/* ============================================================
   UNIVERS DU CHIEN — Design tokens  ·  « La Collection »
   Minimalisme chaleureux, mais avec une vraie signature :
   serif éditoriale (Fraunces), textures papier, motif d'atlas.
   ============================================================ */

:root {
  /* ---- Couleur : terrain, encre, action, nature, signature ---- */
  --cream:        #F7EFE3;   /* fond de marque, chaud (légèrement plus profond) */
  --cream-deep:   #F0E5D3;   /* variation de section */
  --cream-hi:     #FBF6EE;   /* crème très clair, surfaces */
  --paper:        #FFFFFF;

  --ink:          #1C160F;   /* texte principal, near-black chaud */
  --ink-soft:     #6C6357;   /* texte secondaire */
  --ink-faint:    #857A69;   /* légendes, méta (contraste renforcé) */

  --espresso:     #241A12;   /* sections sombres, chaudes (pas de noir froid) */
  --espresso-2:   #2F2318;
  --on-dark:      #EFE7D9;   /* texte sur sombre */
  --on-dark-soft: #B9AD99;

  --hairline:     #E4D9C6;   /* filets sur crème */
  --hairline-2:   #EDE4D5;

  --accent:       #E77323;   /* ACTION : orange terracotta */
  --accent-deep:  #C25812;   /* hover / texte accent */
  --accent-soft:  #F0A968;
  --accent-wash:  #FAE7D3;   /* fond doux d'accent */

  --sage:         #6E7A55;   /* NATURE : catégories, tags, calme */
  --sage-deep:    #55603F;
  --sage-wash:    #E9ECDD;

  --brand-blue:   #1E49D6;   /* SIGNATURE : réservée au logo */
  --success:      #2E7D5B;
  --danger:       #C0392B;

  /* ---- Typographie ---- */
  /* Une seule famille pour toute la marque : cohérence + lisibilité maximales (esprit Apple/Linear/Raycast) */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-display: var(--font-sans);

  --fs-mega:    clamp(3rem, 1.1rem + 7.4vw, 6.4rem);    /* hero / statements */
  --fs-display: clamp(2.4rem, 1.3rem + 4.3vw, 4.2rem);
  --fs-h1:      clamp(2.1rem, 1.4rem + 2.6vw, 3.3rem);
  --fs-h2:      clamp(1.8rem, 1.2rem + 2vw, 2.8rem);
  --fs-h3:      clamp(1.3rem, 1.05rem + 0.8vw, 1.7rem);
  --fs-lead:    clamp(1.12rem, 1rem + 0.45vw, 1.35rem);
  --fs-body:    1.0625rem;
  --fs-small:   0.9375rem;
  --fs-xs:      0.82rem;
  --fs-eyebrow: 0.76rem;

  --lh-tight:   1.02;
  --lh-snug:    1.14;
  --lh-body:    1.7;

  --tracking-display: -0.025em;
  --tracking-tight:   -0.012em;
  --tracking-eyebrow:  0.18em;

  /* Axes variables de Fraunces (personnalité) */
  --wonk: 1;
  --soft: 40;

  /* ---- Espace ---- */
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.5rem; --space-6:2rem; --space-7:3rem; --space-8:4rem;
  --space-9:6rem;   --space-10:8rem;
  --section-y: clamp(5rem, 3rem + 7vw, 8.5rem);

  /* ---- Largeurs ---- */
  --container: 1200px;
  --wide:      1360px;
  --measure:   680px;
  --narrow:    920px;

  /* ---- Rayons & ombres ---- */
  --radius-sm: 10px;
  --radius:    16px;
  --radius-lg: 26px;
  --radius-xl: 34px;
  --radius-pill: 999px;

  --shadow-xs: 0 1px 2px rgba(28,22,15,.05);
  --shadow-sm: 0 4px 14px -6px rgba(28,22,15,.12);
  --shadow-md: 0 18px 40px -18px rgba(28,22,15,.22);
  --shadow-lg: 0 40px 80px -28px rgba(28,22,15,.32);
  --shadow-cover: 0 30px 60px -20px rgba(48,30,12,.42);

  /* ---- Mouvement ---- */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --dur:  .5s;

  --header-h: 74px;
  --announce-h: 40px;

  /* ---- Grain papier réutilisable ---- */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}