/* ---------------------------------------------------------------
   Design tokens — surface, type, rhythm, motion

   Near-black ground, off-white type. `--ink` is the identity
   off-white the mark itself is drawn in; the band is a lift above
   the ground rather than a darker patch, and the accent is the
   identity blue kept just bright enough to read on black.

   Every surface colour is named for its role, so the whole scheme
   inverts from this one block. Type stacks are local only:
   nothing is fetched over the network.
   --------------------------------------------------------------- */

:root {
  /* Surface & ink */
  --paper: #0b0b0d;
  --paper-alt: #131315;
  --ink: #f2f2f0;
  --ink-soft: #d8d8d5;
  --muted: #a8a8a5;
  --faint: #828280;
  --rule: rgba(242, 242, 240, 0.16);
  --rule-soft: rgba(242, 242, 240, 0.09);
  --accent: #8ab4e8;

  /* Typefaces — local stacks. Serif carries the editorial voice,
     the system sans carries interface text, mono carries labels. */
  --serif: Charter, 'Iowan Old Style', 'Source Serif 4', 'Palatino Linotype',
    Palatino, Georgia, 'Times New Roman', Times, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue',
    Helvetica, Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas,
    'Liberation Mono', monospace;

  /* Tracking — the wordmark figure follows `B / STACKED SANS` in
     brand/cranebird_logo_concept.pdf: Tc 5.2pt at 22pt = 0.236em */
  --track-word: 0.236em;
  --track-label: 0.18em;

  /* Rhythm */
  --wrap: 1180px;
  --gutter: 20px;
  --sec-y: clamp(60px, 9vh, 104px);
  --head-h: 60px;

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.15, 1);
}

@media (min-width: 640px) {
  :root {
    --gutter: 32px;
    --sec-y: clamp(76px, 11vh, 128px);
    --head-h: 68px;
  }
}

@media (min-width: 1024px) {
  :root { --gutter: 48px; }
}