/* Hallmark · genre: playful · macrostructure: Ecosystem Index · theme: Hum · enrichment: real product imagery + CSS shapes · nav: N12 · footer: Ft8
 * tone: warm-playful · anchor hue: pear 95 (multi-accent: cyan 235, coral 18) · axes: light / rounded-sans / multi
 * pre-emit critique: P4 H4 E4 S4 R4 V5 */
:root {
  --color-paper:      oklch(97% 0.012 95);
  --color-paper-2:    oklch(94% 0.016 95);
  --color-paper-3:    oklch(91% 0.020 95);
  --color-ink:        oklch(20% 0.012 250);
  --color-ink-2:      oklch(20% 0.012 250 / 0.72);
  --color-ink-3:      oklch(20% 0.012 250 / 0.5);
  --color-rule:       oklch(20% 0.012 250 / 0.12);
  --color-surface:    oklch(99% 0.006 95);

  --color-accent:       oklch(86% 0.18 95);   /* pear — primary action */
  --color-accent-deep:  oklch(72% 0.17 92);
  --color-accent-tint:  oklch(86% 0.18 95 / 0.18);
  --color-accent-2:     oklch(66% 0.18 235);  /* cyan — links, Amazon band */
  --color-accent-2-tint:oklch(66% 0.18 235 / 0.14);
  --color-accent-3:     oklch(68% 0.24 18);   /* coral — the one loud moment */
  --color-accent-3-tint:oklch(68% 0.24 18 / 0.14);
  --color-mint:         oklch(80% 0.16 150);
  --color-lavender:     oklch(74% 0.16 305);
  --color-focus:        oklch(55% 0.2 235);

  --font-display: "Plus Jakarta Sans", "Geist", ui-rounded, system-ui, sans-serif;
  --font-body:    "Plus Jakarta Sans", "Geist", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --space-3xs: 0.25rem; --space-2xs: 0.5rem; --space-xs: 0.75rem;
  --space-sm: 1rem;     --space-md: 1.5rem;  --space-lg: 2rem;
  --space-xl: 3rem;     --space-2xl: 4.5rem; --space-3xl: 7rem;

  --text-xs: 0.75rem; --text-sm: 0.875rem; --text-md: 1rem; --text-lg: 1.25rem;
  --text-xl: 1.5rem;  --text-2xl: 2rem;
  --text-display-s: clamp(1.75rem, 1.2rem + 2.4vw, 3rem);
  --text-display:   clamp(2.25rem, 1.5rem + 3.6vw, 4.25rem);

  --radius-card: 28px; --radius-inner: 18px; --radius-input: 12px; --radius-pill: 999px;

  --shadow-contact: 0 1px 2px oklch(20% 0.012 250 / 0.08);
  --shadow-ambient: 0 14px 34px -18px oklch(20% 0.012 250 / 0.22);
  --shadow-lift:    0 22px 48px -20px oklch(20% 0.012 250 / 0.28);

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-snap:   cubic-bezier(0.22, 1, 0.36, 1);
  --ease-press:  cubic-bezier(0.2, 0.7, 0.3, 1);
  --dur-short: 140ms; --dur-med: 220ms; --dur-long: 600ms;

  --page-max: 80rem; --page-gutter: clamp(1rem, 4vw, 2.5rem); --section-gap: clamp(2.5rem, 6vw, 4.5rem);
}

html.dark-mode {
  --color-paper:   oklch(19% 0.012 250);
  --color-paper-2: oklch(23% 0.014 250);
  --color-paper-3: oklch(27% 0.016 250);
  --color-ink:     oklch(96% 0.01 95);
  --color-ink-2:   oklch(96% 0.01 95 / 0.74);
  --color-ink-3:   oklch(96% 0.01 95 / 0.5);
  --color-rule:    oklch(96% 0.01 95 / 0.12);
  --color-surface: oklch(24% 0.014 250);
  --color-accent-tint:   oklch(86% 0.18 95 / 0.14);
  --color-accent-2-tint: oklch(66% 0.18 235 / 0.18);
  --color-accent-3-tint: oklch(68% 0.24 18 / 0.18);
  --shadow-ambient: 0 14px 34px -18px oklch(0% 0 0 / 0.6);
  --shadow-lift:    0 22px 48px -20px oklch(0% 0 0 / 0.7);
}