/* Hallmark · design-system: design.md · theme: Hum · genre: playful
 * Les jetons partagés de tout le site Maille. Une seule source, liée par chaque
 * page. Changer un accent ici le change partout. Ne jamais coder une couleur ou
 * une police en dur dans une page : toujours passer par un jeton nommé. */
:root{
  /* ── Hum · crème + multi-accent ─────────────────────────────── */
  --paper:      oklch(97% 0.012 95);   /* crème, léger tiré pear */
  --paper-2:    oklch(94% 0.017 95);   /* bande teintée */
  --paper-3:    oklch(91% 0.021 95);   /* survol profond */
  --ink:        oklch(22% 0.012 250);  /* jamais noir pur */
  --ink-2:      oklch(22% 0.012 250 / .64);
  --ink-3:      oklch(22% 0.012 250 / .48);
  --rule:       oklch(88% 0.014 95);

  --pear:       oklch(86% 0.18 95);    /* action primaire + personnage + surligne */
  --pear-deep:  oklch(72% 0.155 95);   /* l'arête du bouton */
  --pear-cast:  oklch(80% 0.16 95 / .45);
  --cyan:       oklch(60% 0.13 235);   /* liens, teinte de survol */
  --coral:      oklch(66% 0.20 22);    /* le pop : un seul moment fort par page */
  --coral-soft: oklch(66% 0.20 22 / .10);
  --mint:       oklch(72% 0.13 155);   /* succès, tags secondaires */
  --green:      oklch(52% 0.13 155);   /* « oui » du comparatif */

  --focus:      oklch(52% 0.19 250);

  --font-display:"Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body:   var(--font-display);
  --font-label: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

  --shell: 1100px;
  --gutter: clamp(1rem, 4vw, 1.5rem);

  --space-2xs:.5rem; --space-xs:.75rem; --space-sm:1rem; --space-md:1.5rem;
  --space-lg:2rem;   --space-xl:3rem;   --space-2xl:4.5rem; --space-3xl:7rem;

  --text-display:clamp(2.4rem,1.4rem + 4.4vw,4rem);
  --text-h2:clamp(1.65rem,1.2rem + 1.9vw,2.4rem);
  --text-lead:clamp(1.05rem,1rem + .4vw,1.2rem);

  --radius-card:20px; --radius-pill:999px; --radius-input:12px;

  --shadow:       0 12px 32px -16px oklch(22% 0.012 250 / .12);
  --shadow-hover: 0 22px 44px -18px oklch(22% 0.012 250 / .20);

  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --ease-snap:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}