/* Hallmark · tokens · theme: Coral (modern-minimal)
 * paper band: light · display style: grotesk-sans (Geist) · accent hue: warm ~32deg
 * Every colour and font in styles.css references a token from this file.
 */

:root {
  /* ── Type families — 2 families (Geist + Geist Mono). Mono is the outlier
        register and carries exactly one role: the practical facts —
        wordmark, clock hours, phone numbers. ───────────────────────────── */
  --font-display: "Geist", ui-sans-serif, system-ui, sans-serif;
  --font-body:    "Geist", ui-sans-serif, system-ui, sans-serif;
  --font-outlier: "Geist Mono", ui-monospace, SFMono-Regular, monospace;

  /* ── Colour — warm-grey paper, one warm coral accent.
        Anchor hue 45–60. Neutrals lean warm to match. ──────────────────── */
  --color-paper:       oklch(97%   0.006 60);
  --color-paper-2:     oklch(94.5% 0.008 58);
  --color-paper-3:     oklch(91%   0.010 55);
  --color-rule:        oklch(85%   0.009 55);
  --color-hatch:       oklch(78%   0.010 52);  /* diagram texture, not text */
  --color-rule-strong: oklch(55%   0.012 50);  /* UI boundaries — ≥3:1 on paper */
  --color-neutral:     oklch(47%   0.011 50);  /* tertiary text — ≥4.5:1       */
  --color-muted:       oklch(40%   0.013 45);  /* secondary text               */
  --color-ink:         oklch(22%   0.012 45);
  --color-ink-invert:  oklch(97%   0.006 60);
  --color-shadow:      oklch(22%   0.012 45 / 0.28);

  --color-accent:      oklch(58%   0.155 32);  /* fills only — small areas */
  --color-accent-text: oklch(46%   0.140 32);  /* accent as text / links   */
  --color-focus:       oklch(52%   0.170 32);

  /* Diagram bands. Only the one-hour call window is chromatic; the rest are
     distinguished by pattern, never by a second hue. */
  --color-band-call: var(--color-accent);
  --color-band-day:  var(--color-paper-3);
  --color-band-duty: var(--color-paper-2);

  /* ── Space — 4 pt base, nine steps, 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;
  --page-gutter: clamp(1.125rem, 5vw, 4.5rem);
  /* One shared content measure for hero, bands and footer. Sections stay
   * full-bleed so backgrounds and hairlines still span the viewport; the
   * padding grows to centre the content only once the viewport passes
   * --page-max. Text line-length is held separately by the ch-measures. */
  --page-max: 96rem;
  --page-pad-inline: max(var(--page-gutter), (100% - var(--page-max)) / 2);

  /* ── Type scale — major third (1.25) from a 16 px body ────────────────── */
  --text-xs:      0.8rem;
  --text-sm:      0.875rem;
  --text-base:    1rem;
  --text-md:      1.25rem;
  --text-lg:      1.5625rem;
  --text-xl:      1.9531rem;
  --text-2xl:     2.4414rem;
  --text-3xl:     3.0518rem;
  --text-display: clamp(2.5rem, 4.4vw + 1rem, 4.375rem);

  /* ── Rules and radii ─────────────────────────────────────────────────── */
  --rule-hair:  1px;
  --rule-thick: 2px;
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-pill: 999px;

  /* ── Motion ──────────────────────────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro:   120ms;
  --dur-short:   220ms;
  --dur-long:    420ms;

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