/* tokens.css: the one source of design values for alira.ro (DESIGN.md sections 3-6).
   Token names are an API shared by three agents: never rename; add a line to FOUNDATION_CHANGES.md for any change. */
:root{
  /* palette roles (DESIGN.md 3) */
  --ground:#14100e;
  --ground-deep:#0e0b09;
  --surface:#1d1714;
  --surface-2:#26201b;
  --ink:#f3ece0;
  --ink-muted:rgba(243,236,224,.74);
  --ink-faint:rgba(243,236,224,.5);
  --accent:#c47a2a;          /* 5.55:1 on --ground */
  --accent-deep:#a85800;     /* brand copper: hairline accents, logo context; NOT a text ground (3.66:1 with ground text, 4.4:1 with ink) */
  --accent-hover:#d08a3c;    /* primary button hover: 6.65:1 with --on-accent (accent-deep fails 4.5:1, see FOUNDATION_CHANGES) */
  --accent-on-photo:#e6a868; /* eyebrow tint over photographs (hero only) */
  --on-accent:#14100e;       /* text on an accent ground (5.55:1) */
  --hairline:rgba(243,236,224,.14);
  --hairline-strong:rgba(243,236,224,.28);
  --focus:#f3ece0;
  --sale:#c47a2a;
  /* DESIGN.md 11.2: cream ONLY as an inset card/panel with its own ink, never a full-width section */
  --cream:#f2efe6;
  --cream-ink:#14100e;
  --cream-muted:rgba(20,16,14,.7);
  --cream-hairline:rgba(20,16,14,.16);
  --ghost:rgba(243,236,224,.06);   /* ghost words, 6-10% cream (11.9) */
  --grain-opacity:.5;             /* ground grain (11.1) */
  --error:#e58a6e;           /* form errors on --surface, 5.9:1 */
  --scrim-rgb:18,14,11;      /* hero scrims: rgba(var(--scrim-rgb),a) */

  /* type (DESIGN.md 4) */
  --font-display:"Cinzel",Georgia,serif;
  --font-body:"Open Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fs-display:clamp(44px,7.2vw,112px);
  --fs-h2:clamp(32px,4.4vw,64px);
  --fs-h3:clamp(20px,1.6vw,26px);
  --fs-lede:clamp(17px,1.25vw,20px);
  --fs-body:16px;
  --fs-small:13px;
  --fs-eyebrow:12.5px;
  --fs-year:clamp(36px,3vw,48px);
  --fs-stat:clamp(56px,7vw,112px);
  --lh-display:.98;
  --lh-h2:1.05;
  --lh-h3:1.2;
  --lh-lede:1.55;
  --lh-body:1.6;
  --track-display:.01em;
  --track-eyebrow:.22em;
  --track-small:.14em;
  --measure:64ch;

  /* radius scale (DESIGN.md 6), locked */
  --r-s:12px;   /* buttons, inputs */
  --r-m:16px;   /* cards, panels, photos (DESIGN.md 11.10 supersedes 20px) */
  --r-card:16px; /* alias of --r-m, named after DESIGN.md 11 */
  --r-pill:999px;

  /* rhythm (DESIGN.md 5) */
  --gap-s:clamp(88px,20vh,208px);
  --gap-m:clamp(44px,10vh,104px);
  --gutter:clamp(20px,4vw,56px);
  --maxw:1380px;

  /* motion (DESIGN.md 6, class A) */
  --ease-out:cubic-bezier(.23,1,.32,1);
  --t-fast:120ms;   /* focus, field states */
  --t-ui:160ms;     /* buttons, links */
  --t-tile:240ms;   /* product tile hover */
  --t-in:260ms;     /* drawers, menu in */
  --t-out:200ms;    /* drawers, menu out */
  --t-toast-in:220ms;
  --t-toast-out:180ms;

  /* layering rates (DESIGN.md 6, class B), read by site.js through data-rate */
  --rate-l0:.10; --rate-l1:.25; --rate-l2:.45; --rate-l3:.85; --rate-copy:.65;

  /* geometry */
  --header-h:76px;
  --bars:max(0px,100lvh - 100svh);  /* mobile browser bars offset */
  --z-header:50; --z-drawer:70; --z-toast:80; --z-cookie:60;
}
@media (max-width:700px){ :root{ --fs-body:15px; --header-h:64px } }
@media (max-height:520px) and (orientation:landscape){ :root{ --header-h:48px } }
