/* Depth. The branding is flat and matte: ink on a coloured ground, edges
   cut by full-bleed bands rather than shadow. Two exceptions — glass, on a
   short fixed list of floating UI (below), and a short list of shadows for
   things that genuinely float above the page. */

/* ── glass ────────────────────────────────────────────────────────
   Dark smoked glass on light grounds (gold, cream); light glass on black.
   Cream ink on both, so one ink rule covers every ground. A soft top sheen
   and a thin cream edge give it body; nothing iridescent, no refraction.
   Legal on exactly four things: the sticky nav, the menu / overlay, form
   fields, and the floating CTA. Never a card, never a section, never
   decoration — everywhere else edges come from full-bleed colour bands.
   Only fixed values are referenced, so the light/dark split is the only
   per-ground declaration needed. */
:root,.ground-gold,.ground-cream{
  --glass-fill-thin:color-mix(in srgb,var(--black) 48%,transparent); /* @kind other */
  --glass-fill:color-mix(in srgb,var(--black) 66%,transparent); /* @kind other */
  --glass-fill-strong:color-mix(in srgb,var(--black) 90%,transparent); /* @kind other */
  --glass-ink:var(--cream); /* @kind color */
  --glass-ink-soft:color-mix(in srgb,var(--cream) 72%,transparent); /* @kind color */
  --glass-edge:color-mix(in srgb,var(--cream) 22%,transparent); /* @kind color */
  --glass-sheen:linear-gradient(180deg,color-mix(in srgb,var(--cream) 14%,transparent),transparent 48%); /* @kind other */
}
.ground-dark{
  --glass-fill-thin:color-mix(in srgb,var(--cream) 9%,transparent); /* @kind other */
  --glass-fill:color-mix(in srgb,var(--cream) 14%,transparent); /* @kind other */
  --glass-fill-strong:color-mix(in srgb,var(--black) 92%,transparent); /* @kind other */
  --glass-ink:var(--cream); /* @kind color */
  --glass-ink-soft:color-mix(in srgb,var(--cream) 72%,transparent); /* @kind color */
  --glass-edge:color-mix(in srgb,var(--cream) 28%,transparent); /* @kind color */
  --glass-sheen:linear-gradient(180deg,color-mix(in srgb,var(--cream) 18%,transparent),transparent 48%); /* @kind other */
}

/* ── frost (legacy) ───────────────────────────────────────────────
   The earlier ground-tint frost. Kept so older consumers keep rendering;
   new work uses the --glass-* tokens above. Ground-derived, so it carries
   the same scope list as colours.css. */
:root,.ground-gold,.ground-cream,.ground-dark{
  --frost-tint:color-mix(in srgb,var(--ground) 76%,transparent); /* @kind other */
  --frost-tint-strong:color-mix(in srgb,var(--ground) 92%,transparent); /* @kind other */
  --frost-hairline:inset 0 0 0 1px color-mix(in srgb,var(--on-ground) 12%,transparent); /* @kind other */
}

:root{
  --glass-blur:blur(24px) saturate(150%); /* @kind other */
  --glass-cast:0 12px 32px -16px color-mix(in srgb,var(--black) 45%,transparent); /* @kind other */
  --frost-blur:var(--glass-blur); /* @kind other */
  --frost-cast:0 6px 24px -10px color-mix(in srgb,var(--black) 26%,transparent); /* @kind other */

  /* ── elevation ──────────────────────────────────────────────────
     Warm-black, tight, and rare. Cast from the ink, not from grey. */
  --shadow-1:0 1px 2px color-mix(in srgb,var(--black) 8%,transparent); /* @kind other */
  --shadow-2:0 2px 8px color-mix(in srgb,var(--black) 12%,transparent); /* @kind other */
  --shadow-3:0 10px 32px -12px color-mix(in srgb,var(--black) 22%,transparent); /* @kind other */

  /* ── motion ─────────────────────────────────────────────────────
     Flat design, so hover moves things rather than lighting them.
     No scale, no glow, no lift on a page that has no depth.
     Scroll is the other motion channel, and it is bold: media drifts and
     zooms as it passes (Parallax), case titles pin while the page slides
     over them, figures count up when they arrive (StatBlock), and the
     Work marquee is driven by scroll. All of it stops under
     prefers-reduced-motion. */
  --dur-1:120ms; /* @kind other */
  --dur-2:220ms; /* @kind other */
  --dur-3:420ms; /* @kind other */
  --dur-4:720ms; /* @kind other */
  --dur-count:1100ms; /* @kind other */
  --parallax-speed:0.12; /* @kind other */
  --parallax-zoom:0.08; /* @kind other */
  --ease-out:cubic-bezier(.22,.61,.36,1); /* @kind other */
  --ease-in-out:cubic-bezier(.65,.05,.36,1); /* @kind other */
  --hover-shift:translate3d(0,-2px,0); /* @kind other */
  --press-shift:translate3d(0,0,0); /* @kind other */
  --marquee-dur:38s; /* @kind other */
}