/* ==========================================================================
   Kaviareň a vináreň Na dlani — design tokens
   Palette sampled from the real logo + venue photos (not invented):
   - burgundy  = outer logo ring (~#7A1F2B)
   - cream     = logo background / interior walls (~#F7F1E6)
   - espresso  = near-black text brown (~#3B2A22)
   - gold      = logo inner hairline ring / hand (~#B87C4D)
   - blush     = dusty-rose chair fabric in the modern interior (~#A87F86)

   CONTRAST RULES (WCAG-checked — do not break these):
   - espresso on cream ......... 12.1:1 AAA  → body text
   - burgundy on cream ......... 9.1:1  AAA  → headings, links
   - white on burgundy ......... 10.2:1 AAA  → buttons
   - white on espresso ......... 13.6:1 AAA  → footer text
   - gold on cream ............. ~2.7:1 FAIL → decorative only (borders,
     hairlines, icons) — NEVER text
   - blush on cream ............ ~1.5:1 FAIL → background fill only, with
     espresso text on top (8.4:1 AAA)
   ========================================================================== */

:root {
  /* ---- color ---- */
  --color-cream: #f7f1e6;
  --color-cream-deep: #efe5d3;     /* slightly deeper section alt background */
  --color-burgundy: #7a1f2b;
  --color-burgundy-dark: #5e1620;  /* hover state */
  --color-espresso: #3b2a22;
  --color-espresso-soft: #5c473c;  /* secondary text, still 7:1+ on cream */
  --color-gold: #b87c4d;           /* decorative only — never text on cream */
  --color-blush: #a87f86;          /* background fill only — never text */
  --color-blush-tint: #e9d9da;     /* pale blush wash for cards/chips */
  --color-white: #fffdf9;

  /* ---- typography ---- */
  --font-heading: "Fraunces", georgia, "Iowan Old Style", "Times New Roman", serif;
  --font-body: "Karla", -apple-system, "Segoe UI", roboto, helvetica, arial, sans-serif;

  /* fluid type scale (phone → desktop) */
  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-md: clamp(1.125rem, 1.05rem + 0.4vw, 1.3125rem);
  --text-lg: clamp(1.375rem, 1.2rem + 0.9vw, 1.75rem);
  --text-xl: clamp(1.75rem, 1.45rem + 1.5vw, 2.5rem);
  --text-2xl: clamp(2.25rem, 1.7rem + 2.75vw, 3.75rem);

  /* ---- spacing ---- */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1.25rem;
  --space-lg: 2rem;
  --space-xl: 3.25rem;
  --space-2xl: clamp(4rem, 3rem + 5vw, 7rem);   /* vertical rhythm between sections */

  /* ---- layout ---- */
  --content-max-width: 72rem;       /* 1152px readable column */
  --content-narrow-width: 46rem;    /* prose / menu column */
  --space-gutter: clamp(1rem, 4vw, 2rem);
  --header-height: 4.25rem;

  /* ---- shape & elevation ---- */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.25rem;
  --shadow-soft: 0 2px 12px rgb(59 42 34 / 0.08);
  --shadow-lift: 0 10px 32px rgb(59 42 34 / 0.16);

  /* ---- naklonená stuha medzi sekciami ----
     Stuha nie je nalepená NAD švom sekcií — ona sama JE ten šev, takže musí
     schovať rovné vodorovné hrany oboch susedných sekcií. Geometria:
       bleed   = presah do strán, aby naklonené konce boli mimo okna
       rise    = o koľko konce stuhy vystúpia/klesnú
                 = tan(1.6°) × polovica šírky (110vw / 2) ≈ 1.54vw
       overlap = zvislý presah do susedných sekcií, musí byť ≥ rise
       výška   = musí byť ≥ overlap + rise, inak spodná sekcia vykukne
                 nad hornou hranou stuhy (preto min-height nižšie) */
  --ribbon-tilt: -1.6deg;
  --ribbon-bleed: 5vw;
  --ribbon-rise: 1.54vw;
  --ribbon-overlap: calc(var(--ribbon-rise) + 2px);

  /* ---- motion ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-reveal: 700ms;
  --duration-quick: 200ms;
}