/* ============================================================
   BRUMA — Design tokens (LOCKED)
   Palette per CONCEPT.md «ALIENTO» — dark-warm smoke world.
   Do not introduce colours outside this file.
   ============================================================ */

/* ---- Self-hosted fonts (variable, woff2 — no third-party) --- */
@font-face {
  font-family: "Fraunces";
  src: url("../assets/fonts/Fraunces.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 100%;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Libre Franklin";
  src: url("../assets/fonts/LibreFranklin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../assets/fonts/IBMPlexMono.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- Colour (locked hex + role) ------------------------- */
  --bg:        #1a1512;   /* warm charcoal base            */
  --surface:   #221b16;   /* elevated surface-2           */
  --surface-3: #2b231d;   /* one step lighter (elevation) */
  --stone:     #3a322b;   /* stone divider / hairline     */
  --stone-2:   #4a4038;   /* lighter stone for edges      */

  --ink:       #e8ded0;   /* bone — primary text on dark  */
  --ink-2:     #b7ab99;   /* secondary bone               */
  --ink-3:     #8c8375;   /* muted / captions             */

  --agave:     #7c8471;   /* dusty grey-green — kickers, rules */
  --agave-dim: #5e6559;

  --ember:     #c17c3f;   /* mezcal copper-amber — ACCENT, rare */
  --ember-hot: #b5541f;   /* hot coal (roast stage)       */
  --ember-soft:#d29a63;

  /* alpha helpers (overlays / shadows only) */
  --scrim:      rgba(16, 12, 9, 0.62);
  --scrim-strong: rgba(16, 12, 9, 0.82);
  --shadow-soft: 0 18px 48px rgba(0, 0, 0, 0.45);
  --shadow-lift: 0 8px 28px rgba(0, 0, 0, 0.38);
  --hair:        rgba(232, 222, 208, 0.09);
  --hair-strong: rgba(232, 222, 208, 0.16);

  /* ---- Type families -------------------------------------- */
  --font-display: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;
  --font-body:    "Libre Franklin", ui-sans-serif, system-ui, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;

  /* ---- Fluid type scale — modular 1.333, lock 320→1240 ---- */
  --step--2: clamp(0.694rem, 0.66rem + 0.17vw, 0.79rem);
  --step--1: clamp(0.833rem, 0.79rem + 0.22vw, 0.95rem);
  --step-0:  clamp(1rem, 0.95rem + 0.27vw, 1.15rem);
  --step-1:  clamp(1.2rem, 1.11rem + 0.44vw, 1.5rem);
  --step-2:  clamp(1.44rem, 1.29rem + 0.75vw, 2rem);
  --step-3:  clamp(1.728rem, 1.49rem + 1.19vw, 2.66rem);
  --step-4:  clamp(2.074rem, 1.7rem + 1.86vw, 3.55rem);
  --step-5:  clamp(2.488rem, 1.93rem + 2.79vw, 4.73rem);
  --step-6:  clamp(2.986rem, 2.15rem + 4.18vw, 6.3rem);
  --step-7:  clamp(3.58rem, 2.3rem + 6.4vw, 8.4rem);

  /* ---- Spacing scale — 4pt base, named by role ------------ */
  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;
  --space-5xl: 13rem;

  /* ---- Measure / containers ------------------------------- */
  --measure:     65ch;
  --measure-tight: 46ch;
  --container:   min(100% - 2 * var(--space-lg), 1240px);
  --container-wide: min(100% - 2 * var(--space-lg), 1480px);

  /* ---- Radii (non-uniform on purpose) --------------------- */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;
  --r-pill: 999px;

  /* ---- Motion — one timing system ------------------------- */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-reveal:   cubic-bezier(0, 0, 0.2, 1);
  --dur-fade:      400ms;
  --dur-opacity:   250ms;
  --dur-transform: 300ms;

  /* ---- Z-index — six named levels ------------------------- */
  --z-base:     1;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    400;
  --z-toast:    500;
  --z-tooltip:  600;
}