/* =========================================================
   SHIELD & STORY — DESIGN TOKENS
   Palette is quarried, not invented. Every value below is a
   material: bedrock, bone, gold leaf, garnet, deep water.
   ========================================================= */

:root {
  /* ---- Bedrock (backgrounds, darkest → lightest) ---- */
  --ink-000: #060504;
  --ink-100: #0b0a09;
  --ink-200: #121010;
  --ink-300: #1a1715;
  --ink-400: #262220;
  --ink-500: #3a3430;

  /* ---- Bone / parchment (foreground) ---- */
  --bone-100: #f4efe6;
  --bone-200: #ede7db;
  --bone-300: #cec6b8;
  --bone-400: #9c9385;
  --bone-500: #6b645a;

  /* ---- Gold leaf (the plaque) ---- */
  --gold-100: #f2e5bb;
  --gold-200: #e3cd8f;
  --gold-300: #c9a227;
  --gold-400: #a07f1a;
  --gold-500: #6d5511;

  /* ---- Mineral accents ---- */
  --garnet: #8e2c24;
  --garnet-lt: #b5544a;
  --indigo: #38495c;
  --indigo-lt: #5b768e;
  --quartz: #d9d4cb;
  --migmatite: #b9b3a8;

  /* ---- Semantic ---- */
  --bg: var(--ink-100);
  --fg: var(--bone-200);
  --fg-dim: var(--bone-400);
  --rule: rgba(237, 231, 219, 0.12);
  --rule-strong: rgba(237, 231, 219, 0.22);
  --gold: var(--gold-300);

  /* ---- Type families ---- */
  --font-display: "Instrument Serif", "Times New Roman", serif;
  --font-serif: "Newsreader", Georgia, serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;

  /* ---- Fluid type scale (viewport 380 → 1600) ---- */
  --step--2: clamp(0.68rem, 0.65rem + 0.12vw, 0.75rem);
  --step--1: clamp(0.8rem, 0.76rem + 0.18vw, 0.9rem);
  --step-0: clamp(0.95rem, 0.9rem + 0.24vw, 1.1rem);
  --step-1: clamp(1.15rem, 1.05rem + 0.48vw, 1.45rem);
  --step-2: clamp(1.45rem, 1.25rem + 0.95vw, 2.1rem);
  --step-3: clamp(1.9rem, 1.5rem + 1.9vw, 3.2rem);
  --step-4: clamp(2.1rem, 1.5rem + 2.8vw, 3.75rem);
  --step-5: clamp(2.35rem, 1.1rem + 4.4vw, 4.4rem);
  --step-6: clamp(3.25rem, 1rem + 9vw, 8.5rem);

  /* ---- Rhythm ---- */
  --gutter: clamp(1.25rem, 0.6rem + 2.6vw, 3.75rem);
  --section-y: clamp(3.75rem, 2.4rem + 4.6vw, 7rem);
  --maxw: 1560px;

  /* ---- Motion ---- */
  --dur-fast: 0.32s;
  --dur: 0.66s;
  --dur-slow: 1.1s;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
  --ease-chisel: cubic-bezier(0.2, 0.9, 0.1, 1);

  /* ---- Depth ---- */
  --z-grain: 9000;
  --z-cursor: 9500;
  --z-nav: 8000;
  --z-loader: 9800;
}

/* A light "quarry face" theme used by inverted sections */
.is-light {
  --bg: var(--bone-200);
  --fg: var(--ink-100);
  --fg-dim: var(--bone-500);
  --rule: rgba(11, 10, 9, 0.14);
  --rule-strong: rgba(11, 10, 9, 0.28);
}