/* Alexouminou — refuge félin, Granby.
   Art direction "Brume & Noyer" : brume bleue d'un matin réchauffée par le
   noyer. Bleu-sarcelle froid + terracotta chaud + lin crème. Voix éditoriale
   (Fraunces / Inter). Tout le système de design vit dans ce fichier —
   ailleurs, uniquement des tokens.
   CONVENTION : couleurs literales (1 hop max), paires --x / --on-x lisibles
   AA, espacement sur l'échelle 8pt. */
:root {
  /* ---- palette : paires (--x / --on-x) ---- */
  --surface:        hsl(38 44% 96%);   /* lin crème chaud */
  --on-surface:     hsl(220 26% 15%);  /* encre noyer-ardoise */
  --surface-alt:    hsl(202 34% 91%);  /* brume bleu pâle (sections calmes) */
  --on-surface-alt: hsl(213 30% 18%);
  --brand:          hsl(201 47% 29%);  /* bleu-sarcelle profond — le froid */
  --on-brand:       hsl(38 46% 97%);
  --accent:         hsl(21 55% 39%);   /* terracotta / noyer — le chaud */
  --on-accent:      hsl(38 46% 97%);
  --muted:          hsl(213 15% 39%);  /* texte secondaire sur --surface */
  --border:         hsl(210 20% 82%);  /* filet discret */
  --surface-veil:   hsl(38 44% 96% / 0.82); /* nav condensée (blur) */

  /* teintes du dégradé vivant du héro — assez pâles pour que l'encre reste
     lisible par-dessus (test de contraste sur la couleur la PLUS claire) */
  --hero-c1: hsl(38 44% 96%);   /* crème */
  --hero-c2: hsl(200 42% 74%);  /* bleu brume clair (le froid) */
  --hero-c3: hsl(27 56% 78%);   /* sable chaud (le marron adouci) */

  /* ---- type — Fraunces (display) / Inter (corps) ---- */
  --font-display: "Fraunces", Georgia, serif;
  --font-body:    "Inter", system-ui, sans-serif;
  --text-sm:   clamp(0.83rem, 0.8rem + 0.15vw, 0.94rem);
  --text-base: clamp(1rem, 0.96rem + 0.2vw, 1.13rem);
  --text-lg:   clamp(1.25rem, 1.18rem + 0.35vw, 1.5rem);
  --text-xl:   clamp(1.56rem, 1.44rem + 0.6vw, 2rem);
  --text-2xl:  clamp(1.95rem, 1.75rem + 1vw, 2.66rem);
  --text-hero: clamp(2.44rem, 2.1rem + 1.7vw, 3.55rem);
  --leading-body: 1.55;
  --leading-tight: 1.12;

  /* ---- espacement — échelle 8pt ---- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-6: 3rem;
  --space-8: 4rem;
  --space-12: 6rem;

  /* ---- forme & profondeur ---- */
  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 22px;
  --shadow-sm: 0 1px 2px hsl(215 40% 12% / 0.06), 0 3px 10px hsl(215 40% 12% / 0.07);
  --shadow:    0 4px 12px hsl(215 40% 12% / 0.08), 0 18px 40px hsl(215 40% 12% / 0.12);

  /* ---- mouvement ---- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --speed: 260ms;
}