/* ============================================================
   Design tokens — Guide Suisse Design Lab
   PROTOTYPE — NOT FOR PUBLICATION
   Tout réglage visuel passe par ces tokens. Aucune valeur en dur
   dans les feuilles de composants.
   ============================================================ */

:root {
  /* ---- Couleurs — palette calme, éditoriale ---- */
  --color-ink: #1a1c1e;            /* texte principal */
  --color-ink-soft: #45494e;       /* texte secondaire */
  --color-ink-faint: #6d7278;      /* légendes, méta */
  --color-paper: #faf9f7;          /* fond page — blanc cassé chaud */
  --color-paper-raised: #ffffff;   /* cartes, panneaux */
  --color-line: #e4e1dc;           /* filets */
  --color-line-strong: #c9c5be;
  --color-accent: #1f5c46;         /* vert forêt sobre — liens, actifs */
  --color-accent-ink: #16402f;
  --color-accent-wash: #eaf1ee;    /* fonds d'accent très légers */
  --color-warn-wash: #f7efe2;      /* avertissements */
  --color-warn-ink: #7a5a1e;
  --color-error-wash: #f8ecea;
  --color-error-ink: #8a3a30;
  --color-focus: #14524f;          /* anneau de focus */

  /* ---- Typographie ----
     Pas de fonte externe (lab hors ligne). Pile serif éditoriale pour les
     titres, sans pour l'interface, fallbacks CJK explicites. */
  --font-display: "New York", "Iowan Old Style", Georgia, "Times New Roman",
    "Hiragino Mincho ProN", "Noto Serif JP", "Songti SC", "Noto Serif SC", serif;
  --font-text: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans", "Noto Sans JP",
    "Noto Sans SC", sans-serif;

  --text-xs: 0.75rem;    /* 12 — méta, crédits */
  --text-sm: 0.875rem;   /* 14 — UI secondaire */
  --text-base: 1.0625rem;/* 17 — prose */
  --text-lg: 1.25rem;    /* 20 — intro, résumés */
  --text-xl: 1.625rem;   /* 26 — titres de section */
  --text-2xl: 2.25rem;   /* 36 — titres de page */
  --text-3xl: 3.25rem;   /* 52 — héros desktop */

  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-prose: 1.65;
  --leading-prose-cjk: 1.9;   /* zh/ja : interlignage augmenté */

  --tracking-wide: 0.08em;    /* eyebrows, petites capitales */

  /* ---- Espacements (échelle 4) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;

  /* ---- Rayons ---- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;

  /* ---- Ombres — discrètes ---- */
  --shadow-card: 0 1px 2px rgba(26, 28, 30, 0.06), 0 4px 16px rgba(26, 28, 30, 0.05);
  --shadow-raised: 0 2px 6px rgba(26, 28, 30, 0.08), 0 12px 32px rgba(26, 28, 30, 0.10);

  /* ---- Bordures ---- */
  --border-thin: 1px solid var(--color-line);
  --border-strong: 1px solid var(--color-line-strong);

  /* ---- Animation ---- */
  --duration-fast: 150ms;
  --duration-gentle: 280ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);

  /* ---- Breakpoints (référence — utilisés en dur dans les media queries,
       documentés ici comme tokens de contrat) ----
     --bp-mobile-narrow: 375px
     --bp-mobile: 390px
     --bp-tablet-narrow: 768px
     --bp-tablet: 1024px
     --bp-desktop: 1440px
  */

  /* ---- Mise en page ---- */
  --measure-prose: 42rem;     /* largeur de lecture */
  --measure-wide: 72rem;      /* conteneur principal */
  --header-height: 3.75rem;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-gentle: 0ms;
  }
}
