/*
Theme Name: Gastrobrands
Theme URI: https://gastrobrands.cz
Author: Gastrobrands
Author URI: https://gastrobrands.cz
Description: Brand Guide v4.0 — Calm infrastructure. Bold signal. Hospitality warmth.
Version: 4.0.0
License: GNU General Public License v2 or later
Text Domain: gastrobrands
Tags: restaurant, hospitality, tools, czech
*/

/* ─── Design Tokens — Brand Guide v4.0 ──────────────────────────────── */
:root {
  /* Neutral foundation */
  --cream:      #FAF8F4;
  --parchment:  #F2EDE4;
  --blush:      #EDE8E1;
  --rose:       #EDE8E1;
  --bg-card:    #FFFFFF;
  --ink-faint:  #DDD8D1;

  /* Brand accent */
  --teal:       #2C5C58;
  --teal-deep:  #1E3D3B;
  --teal-mid:   #4A8C87;
  --teal-lt:    #E8F2F1;

  /* Signal gold */
  --gold:       #C8962A;
  --gold-lt:    #FBF3E3;

  /* Palette aliases */
  --terracotta: #2C5C58;
  --terra-dark: #1E3D3B;
  --sage:       #6EE7B7;
  --sage-dark:  #4A8C87;
  --mocha:      #1C1916;

  /* Text */
  --ink:        #1C1916;
  --ink-mid:    #5C5752;
  --ink-muted:  #9A9490;
  --white:      #FFFFFF;
  --serif-accent:#C8962A;

  /* Category accents (domain pastels) */
  --c-coral:    #FCA5A5;
  --c-pink:     #C084FC;
  --c-mint:     #6EE7B7;
  --c-violet:   #C084FC;
  --c-amber:    #FCD34D;
  --c-teal:     #4A8C87;

  /* Borders */
  --border:     #DDD8D1;
  --border-hov: #9A9490;

  --radius-sm:  2px;
  --radius-md:  4px;
  --radius-lg:  8px;
  --radius-xl:  12px;

  --shadow-sm:  0 1px 4px rgba(28,25,22,.06);
  --shadow-md:  0 2px 12px rgba(28,25,22,.09);
  --shadow-lg:  0 8px 32px rgba(28,25,22,.12);

  --font-display: 'Montserrat', system-ui, sans-serif;
  --font-body:    'Montserrat', system-ui, sans-serif;

  --nav-h: 64px;
  --max-w: 1140px;
  --max-w-narrow: 760px;

  --transition: .22s cubic-bezier(.4,0,.2,1);
}

/* ─── Reset & Base ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--font-body);
  background: var(--cream);
  color: var(--ink);
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { cursor: pointer; font-family: inherit; }

/* ─── Typography ─────────────────────────────────────────────── */
h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.18;
  color: var(--ink);
}
h1 { font-size: clamp(2rem, 4vw, 3.2rem); letter-spacing: -.03em; }
h2 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); letter-spacing: -.025em; }
h3 { font-size: 1.1rem; font-weight: 500; letter-spacing: -.01em; }
h4 { font-size: 1rem; font-weight: 500; }
p  { color: var(--ink-mid); font-weight: 300; }
em { color: var(--gold); }

/* ─── Layout ─────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 2rem;
}
.container--narrow {
  max-width: var(--max-w-narrow);
  margin: 0 auto;
  padding: 0 2rem;
}
section { padding: 5rem 0; }

@media (max-width: 900px) {
  .container { padding: 0 1.25rem; }
}