/* DMP design tokens — spec §2 (canonical values, do not "improve").
   Consumed by base.css and components.css; nothing else may declare colours,
   sizes, radii, shadows, or motion timings. An eleventh colour means someone
   invented something. Don't. */

:root {
  /* ── Colour (10, exact) ────────────────────────────────────────────── */
  --dmp-red:        #c20e23;  /* primary brand red — dominant accent */
  --dmp-red-dark:   #99081a;  /* link hover only */
  --dmp-cream:      #f3e9d2;  /* page background */
  --dmp-cream-warm: #f5ecdd;  /* on-dark text, alt section bg */
  --dmp-char:       #1c110e;  /* primary text */
  --dmp-black:      #14100e;  /* dark section bg, cards */
  --dmp-brown:      #4a3833;  /* body prose on cream */
  --dmp-tan:        #c9bdae;  /* muted / borders / placeholder ink */
  --dmp-yellow:     #f2b705;  /* accent — menu section variant only */
  --dmp-peach:      #f7d9c4;  /* card hover desc text only */

  /* ── Type — face stacks ────────────────────────────────────────────── */
  /* Poppins / Archivo / Noto Sans SC self-hosted (see base.css, noto-sans-sc.css).
     The system faces are the FOUT swap-in only. Design intent is Poppins + Archivo. */
  --dmp-display-face: "Poppins", "Archivo", ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  --dmp-body-face:    "Archivo", ui-sans-serif, system-ui, "Helvetica Neue", Arial, sans-serif;
  --dmp-cjk-face:     "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;

  /* ── Type scale (clamp: mobile → desktop) ──────────────────────────── */
  --fs-hero:        8.25rem;                                   /* 132px */
  --fs-cta:         6rem;                                      /* 96px */
  --fs-section:     clamp(3.5rem, 3.5vw + 0.5rem, 4rem);        /* 56 → 64 */
  --fs-card-title:  clamp(1.375rem, 0.4vw + 1rem, 1.5rem);      /* 22 → 24 */
  --fs-eyebrow:     0.9375rem;   /* 15px */
  --fs-body:        1.125rem;    /* 18px */
  --fs-nav:         0.9375rem;   /* 15px */
  --fs-button:      1rem;        /* 16px (spec says 16–17; component may bump to 17 for large variants) */
  --fs-small:       0.875rem;    /* 14px */

  --lh-display:     0.9;    /* spec 0.82–0.98 range — mid-band default */
  --lh-body:        1.7;
  --lh-tight:       1.15;

  --ls-hero:        -0.015em;  /* ≈ -2px at 132px */
  --ls-cta:         -0.015em;
  --ls-nav:         0.07em;    /* ≈ 1px at 15px */
  --ls-eyebrow:     0.28em;    /* ≈ 4px at 15px */
  --ls-button:      0.07em;

  /* ── Shape ─────────────────────────────────────────────────────────── */
  --radius-card:    16px;
  --radius-pill:    999px;

  /* ── Layout / section padding (§2: 90×48 desktop) ──────────────────── */
  --sec-pad-y:      clamp(56px, 6vw + 16px, 90px);
  --sec-pad-x:      clamp(20px, 4vw, 48px);
  --sec-max:        1240px;

  /* ── Shadow ────────────────────────────────────────────────────────── */
  --shadow-card:       0 12px 30px -18px rgba(28, 17, 14, 0.35);
  --shadow-card-hover: 0 26px 50px -24px rgba(28, 17, 14, 0.5);

  /* ── Motion ────────────────────────────────────────────────────────── */
  --ease-reveal:      cubic-bezier(.2, .7, .2, 1);
  --dur-reveal:       800ms;
  --dur-ticker:       26s;
  --dur-nav-underline: 260ms;
  --dur-menu-row:     240ms;
  --dur-card-hover:   300ms;
  --reveal-y:         40px;   /* translateY start position for reveal */

  /* ── Focus (§10 keyboard focus must be visible) ────────────────────── */
  --focus-ring: 2px solid var(--dmp-red);
  --focus-off:  2px;
}

/* ── prefers-reduced-motion ─────────────────────────────────────────────
   Kills reveal + ticker per §3 quality floor. Components read these token
   values; overriding them here neutralises reveal/ticker with zero JS. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-reveal: 1ms;
    --dur-ticker: 0s;
    --reveal-y:   0px;
  }
}