/**
 * Anatoli — The Greek · Brand system
 * Source: Brand Guide / Anatoli-TheGreek_Branbook_2025.pdf
 *
 * COLOUR (Pantone Coated → hex, per brand book p.14)
 *   7622 C  Burgundy  #9C1421  — logo, CTAs, header/footer bar
 *   9064 C  Cream     #FFFADE  — type on dark, borders, skip link
 *   1405 C  Brown     #6E4C1F  — secondary palette
 *   364 C   Green     #457326  — secondary palette
 *   Black 2 C         #221F20  — backgrounds, body
 *
 * TYPOGRAPHY (brand book p.15–16)
 *   Headlines     Director Bold, ALL CAPS
 *   Sub-headlines Bicyclette Black, ALL CAPS, 58% horizontal scale
 *   Body / UI     Director Regular or Bold
 */

@font-face {
      font-family: "Director";
      src: url("../fonts/Director-Regular.otf") format("opentype");
      font-weight: 400;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: "Director";
      src: url("../fonts/Director-bold.otf") format("opentype");
      font-weight: 700;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: "Bicyclette";
      src: url("../fonts/bicyclette-black.ttf") format("truetype");
      font-weight: 900;
      font-style: normal;
      font-display: swap;
    }

    :root {
      /* ── Pantone (Coated) ── */
      --pantone-7622-c: #9c1421;
      --pantone-9064-c: #fffade;
      --pantone-1405-c: #6e4c1f;
      --pantone-364-c: #457326;
      --pantone-black-2-c: #221f20;

      --cream-rgb: 255 250 222;
      --black-rgb: 34 31 32;
      --burgundy-rgb: 156 20 33;

      /* Semantic aliases — use in layout (css/site.css) */
      --burgundy: var(--pantone-7622-c);
      --burgundy-dark: #7a1019;
      --cream: var(--pantone-9064-c);
      --brown: var(--pantone-1405-c);
      --green: var(--pantone-364-c);
      --black: var(--pantone-black-2-c);
      --black-soft: color-mix(in srgb, var(--black) 88%, var(--cream) 12%);

      --accent: var(--burgundy);
      --accent-dark: var(--burgundy-dark);
      --white: var(--cream);
      --muted: rgb(var(--cream-rgb) / 0.78);
      --text-on-dark: rgb(var(--cream-rgb) / 0.92);
      --text-on-dark-soft: rgb(var(--cream-rgb) / 0.88);
      --text-on-dark-faint: rgb(var(--cream-rgb) / 0.85);

      --overlay-scrim: rgb(0 0 0 / 0.38);
      --overlay-menu: rgb(var(--black-rgb) / 0.97);
      --overlay-menu-sticky: rgb(var(--black-rgb) / 0.92);
      --border-cream-25: rgb(var(--cream-rgb) / 0.25);
      --border-on-dark-06: rgb(var(--cream-rgb) / 0.06);
      --border-on-dark-07: rgb(var(--cream-rgb) / 0.07);
      --border-on-dark-08: rgb(var(--cream-rgb) / 0.08);
      --border-on-dark-10: rgb(var(--cream-rgb) / 0.1);
      --border-on-dark-15: rgb(var(--cream-rgb) / 0.15);
      --border-on-dark-22: rgb(var(--cream-rgb) / 0.22);
      --border-on-dark-55: rgb(var(--cream-rgb) / 0.55);
      --surface-on-dark-02: rgb(var(--cream-rgb) / 0.02);
      --surface-on-dark-04: rgb(var(--cream-rgb) / 0.04);
      --border-ink-20: rgb(0 0 0 / 0.2);
      --border-ink-25: rgb(0 0 0 / 0.25);
      --border-ink-35: rgb(0 0 0 / 0.35);

      --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
      --header-h: 5.5rem;
      --site-header-offset: calc(env(safe-area-inset-top, 0px) + 5.5rem);
      --menu-jump-strip: 3.5rem;
      --shell-cream: var(--cream);
      --shell-bg: var(--black);
      --shell-bar: var(--burgundy);
      --font-headline: "Director", Georgia, serif;
      --font-subhead: "Bicyclette", "Arial Narrow", sans-serif;
      --subhead-scale-x: 0.58;

      /* Logo assets (assets/images/logos/) — night = The Greek, day = Anatoli The Greek */
      --logo-night-lockup: url("../assets/images/logos/the-greek-anatoli-offwhite.png");
      --logo-night-wordmark: url("../assets/images/logos/the-greek-offwhite.png");
      --logo-day-stacked: url("../assets/images/logos/anatoli-the-greek-offwhite.png");
      --logo-header: var(--logo-day-stacked);
      /* Favicon — Anatoli “A” mark (Assets/Logo Files: Anatoli_OffWhite / Black / White) */
      --favicon-mark: url("../assets/images/favicon/anatoli-offwhite.png");
    }

    /* Cream marks on burgundy bars: drop baked-in black matte via blend */
    .logo-img--on-burgundy {
      mix-blend-mode: screen;
    }

    .logo-img {
      display: block;
      height: auto;
      object-fit: contain;
    }

    .type-headline {
      font-family: var(--font-headline);
      font-weight: 700;
      text-transform: uppercase;
    }
    .type-subhead {
      font-family: var(--font-subhead);
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      transform: scaleX(var(--subhead-scale-x));
    }