/* Copie de docs/design/tokens/sanoo-tokens.css (charte de travail). Ne pas modifier ici : recopier depuis docs/design/ (bin/copier-design.sh). */
/* Sanoo · direction 1c « Épicerie de quartier » · tokens
   Miroir de theme.json : dans WordPress, préférer les variables --wp--preset--*. */
:root {
  --sn-vert: #235353;        /* 8,63:1 sur blanc · texte, aplats enseigne */
  --sn-vert-fonce: #1a3f3f;
  --sn-vert-pale: #dcebe6;
  --sn-sarcelle: #2c8585;    /* 4,48:1 · grands titres et décor seulement */
  --sn-encre: #1d2a36;
  --sn-encre-2: #3a4652;
  --sn-encre-3: #4a5560;
  --sn-rouge: #c0453a;       /* 5,05:1 · bouton principal, texte blanc */
  --sn-rouge-fonce: #a83a30;
  --sn-rouge-pale: #fbe3e0;
  --sn-rouge-logo: #e75e53;  /* 3,43:1 · décor uniquement */
  --sn-jaune: #e99c2f;       /* 2,27:1 · aplat, texte encre dessus 6,1:1 */
  --sn-jaune-texte: #8a5a10;
  --sn-jaune-pale: #fbe7c6;
  --sn-papier: #fbf8f2;
  --sn-papier-2: #efe9de;
  --sn-filet: #e3dccf;       /* décoratif · bordures de champs : --sn-encre-3 */
  --sn-blanc: #ffffff;

  --sn-font: Archivo, system-ui, sans-serif;
  --sn-mono: "Space Mono", ui-monospace, monospace;
  --sn-stretch-enseigne: 70%;
  --sn-stretch-bouton: 80%;

  --sn-fs-xs: 14px;  /* étiquettes mono en capitales uniquement */
  --sn-fs-s: 16px;
  --sn-fs-m: 18px;
  --sn-fs-l: clamp(20px, 1.6vw, 22px);
  --sn-fs-xl: clamp(24px, 2.2vw, 28px);
  --sn-fs-2xl: clamp(32px, 3.2vw, 40px);
  --sn-fs-3xl: clamp(40px, 4.4vw, 56px);
  --sn-fs-4xl: clamp(48px, 6.4vw, 80px);

  --sn-sp-1: 4px; --sn-sp-2: 8px; --sn-sp-3: 12px; --sn-sp-4: 16px;
  --sn-sp-5: 24px; --sn-sp-6: clamp(24px, 3vw, 32px); --sn-sp-7: clamp(32px, 5vw, 48px);
  --sn-sp-8: clamp(40px, 7vw, 64px); --sn-sp-9: clamp(56px, 10vw, 96px);

  --sn-r-etiquette: 3px; --sn-r-controle: 6px; --sn-r-carte: 8px; --sn-r-pastille: 999px;
  --sn-shadow-filet: 0 1px 0 #e3dccf;
  --sn-shadow-superpose: 0 12px 32px rgba(29, 42, 54, .18);

  --sn-focus: 3px solid var(--sn-encre);
  --sn-focus-on-dark: 3px solid var(--sn-jaune);
  --sn-target: 44px;
}
:focus-visible { outline: var(--sn-focus); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}