/* tokens.css — variables de marque : couleurs, typo, espacements, rayons, ombres.
   Aucune règle de mise en page ici : uniquement des custom properties. */
:root{
  /* Couleurs neutres */
  --color-white: #FFFFFF;
  --color-ink: #1E1B18;
  --color-ink-soft: #4A443E;
  --color-ink-faint: #7A7165;  /* conforme AA (4.8:1 sur blanc) */
  --color-gray-100: #F7F5F2;
  --color-gray-200: #EFEAE3;
  --color-gray-300: #DDD5C8;
  --color-gray-400: #C7BCAA;

  /* Accent unique — terracotta du logo */
  --color-accent: #EC7D4B;       /* grands aplats, icônes, bordures, badges */
  --color-accent-dark: #D96A3A;  /* survol des aplats */
  --color-accent-text: #B85A2E;  /* liens, prix : conforme AA (4.63:1) sur blanc */
  --color-accent-soft: #FBEADF;  /* fond très clair pour badges/alertes */

  /* États */
  --color-success: #3F6B4A;
  --color-success-soft: #EAF2EA;
  --color-error: #A83A2E;
  --color-error-soft: #FBEAE7;

  /* Typographie */
  --font-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fs-h1: clamp(2.25rem, 5.5vw, 4.25rem);
  --fs-h2: clamp(1.75rem, 3.6vw, 2.75rem);
  --fs-h3: clamp(1.25rem, 2.2vw, 1.625rem);
  --fs-h4: 1.125rem;
  --fs-lead: 1.125rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-micro: 0.75rem;

  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-body: 1.65;

  --ls-kicker: 0.16em;
  --ls-wide: 0.04em;

  /* Espacements (échelle 4px) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* Structure */
  --container-max: 1320px;
  --container-pad: 20px;
  --border-hairline: 1px solid var(--color-gray-300);
  --border-hairline-dark: 1px solid var(--color-ink);
  --radius-sm: 2px;
  --radius-md: 4px;
  --focus-ring: 0 0 0 2px var(--color-white), 0 0 0 4px var(--color-ink);

  --ease: cubic-bezier(.4,0,.2,1);
  --duration: 180ms;
}