/* tokens.css — Client: Rodéo Ste-Perpétue
   Direction « La nuit de l'arène » (maquette approuvée par Maxime, 2026-10-22).
   Palette tirée du logo de Tao : ruban rouge, cercle bordeaux, nuit chaude, crème.
   Open Props (shadows + easings, servis localement depuis /css/vendor/) fournit
   ombres et courbes ; ce fichier fournit la marque, la typo et les échelles Utopia.
   Aucune page ne code une couleur, un espacement ou une ombre en dur : tout passe ici. */

@font-face {
  font-family: "Big Shoulders Display";
  src: url("/fonts/big-shoulders-display-latin-var.woff2") format("woff2");
  font-weight: 700 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Archivo";
  src: url("/fonts/archivo-latin-var.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: dark;

  /* Marque — tirée du logo */
  --rouge: #e3120b;            /* ruban, bas du cercle */
  --rouge-vif: #f21d15;        /* survol du bouton principal */
  --rouge-fonce: #8f0a06;      /* dégradé du ruban */
  --bordeaux: #3d0503;         /* haut du cercle */
  --blanc: #ffffff;

  /* Surfaces nuit, teintées chaud (jamais #000) */
  --nuit: #0d0908;
  --nuit-2: #151010;
  --carte: #1d1615;
  --carte-2: #271e1c;
  --trait: #3a2e2b;
  --gris: #9a8b80;
  --sable: #cdb9a6;
  --creme: #f6eee6;

  /* Bracelets — défauts par code (l'admin peut choisir une autre couleur par type) */
  --b-general: #e3120b;
  --b-enfant: #2f7ae0;
  --b-vip: #d8b04a;
  --b-camping: #33a865;
  --b-passe: #f2ede6;

  /* Plan du site (SVG) */
  --plan-herbe: #1b2a1c;
  --plan-herbe-2: #264028;
  --plan-sable: #5a3a24;
  --plan-sable-2: #7a5235;
  --plan-sable-3: #4a2f1d;
  --plan-vip: #2a1f12;
  --plan-camping: #16301d;

  /* Typo */
  --f-display: "Big Shoulders Display", "Arial Narrow", "Helvetica Neue Condensed", Impact, sans-serif;
  --f-texte: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --track-label: .14em;
  --track-eyebrow: .18em;
  --track-wide: .24em;

  /* Échelle typographique Utopia (320 → 1240 px) */
  --step--2: clamp(.6944rem, .6597rem + .1736vw, .8rem);
  --step--1: clamp(.8333rem, .7754rem + .2899vw, 1rem);
  --step-0: clamp(1rem, .913rem + .4348vw, 1.25rem);
  --step-1: clamp(1.2rem, 1.0739rem + .6304vw, 1.5625rem);
  --step-2: clamp(1.44rem, 1.2615rem + .8924vw, 1.9531rem);
  --step-3: clamp(1.728rem, 1.4799rem + 1.2406vw, 2.4414rem);
  --step-4: clamp(2.0736rem, 1.7334rem + 1.7011vw, 3.0518rem);
  --step-5: clamp(2.4883rem, 2.027rem + 2.3067vw, 3.8147rem);
  --step-horloge: clamp(4.5rem, 3rem + 7vw, 10rem);
  --step-hero: clamp(4rem, 1.5rem + 12.5vw, 13.5rem);
  --step-petit: .8rem;
  --step-mini: .72rem;

  /* Espacements Utopia */
  --space-3xs: clamp(.25rem, .2283rem + .1087vw, .3125rem);
  --space-2xs: clamp(.5rem, .4565rem + .2174vw, .625rem);
  --space-xs: clamp(.75rem, .6848rem + .3261vw, .9375rem);
  --space-s: clamp(1rem, .913rem + .4348vw, 1.25rem);
  --space-m: clamp(1.5rem, 1.3696rem + .6522vw, 1.875rem);
  --space-l: clamp(2rem, 1.8261rem + .8696vw, 2.5rem);
  --space-xl: clamp(3rem, 2.7391rem + 1.3043vw, 3.75rem);
  --space-2xl: clamp(4rem, 3.6522rem + 1.7391vw, 5rem);
  --space-3xl: clamp(6rem, 5.4783rem + 2.6087vw, 7.5rem);

  /* Mise en page */
  --gutter: max(16px, env(safe-area-inset-left, 0px));
  --gutter-r: max(16px, env(safe-area-inset-right, 0px));
  --max: 1240px;
  --nav-h: 72px;
  --panneau: 380px;
  --rayon: 4px;
  --rayon-fin: 2px;
  --trait-fin: 1px;
  --trait-moyen: 2px;
  --cible: 44px;              /* zone tactile minimale */

  /* Profondeur et mouvement (Open Props) */
  --shadow-color: 10 6% 3%;
  --shadow-strength: 40%;
  --ombre-rouge: 0 10px 30px -10px color-mix(in oklab, var(--rouge) 55%, transparent);
  --ombre-texte: 0 6px 40px color-mix(in oklab, var(--nuit) 70%, transparent);
  --ombre-texte-fine: 0 1px 12px color-mix(in oklab, var(--nuit) 90%, transparent);
  --ombre-logo: drop-shadow(0 12px 30px color-mix(in oklab, var(--nuit) 70%, transparent));
  --duree-1: .2s;
  --duree-2: .35s;
  --duree-3: .9s;
  --ease-site: var(--ease-out-3);

  /* Voiles photo */
  --voile-nav: color-mix(in oklab, var(--nuit) 88%, transparent);
  --flou: blur(10px);

  /* Plans */
  --z-bulle: 70;
  --z-nav: 50;
  --z-toast: 80;

  /* Alias hérités — lus par scan.html (scanner du personnel, hors périmètre public).
     Remappés sur la nouvelle palette pour garder le scanner lisible et cohérent. */
  --brand-primary: var(--b-vip);
  --brand-secondary: var(--rouge);
  --brand-accent: var(--rouge-fonce);
  --brand-dark: var(--nuit);
  --brand-dark-2: var(--carte);
  --brand-dark-3: var(--trait);
  --brand-light: var(--creme);
  --brand-light-2: var(--sable);
  --brand-gold-glow: var(--b-vip);
  --font-display: var(--f-display);
  --font-body: var(--f-texte);
}