/* ============================================================
   tokens.css — Tuktuk Paris « PHOSPHORE » (rebrand v2, E3→E7)
   Palette « Nuit Lumière » : la nuit n'est jamais noire, la lumière
   est la matière première. Tous les hex vivent ICI (lint L3).
   Contrastes AA mesurés (script E3) : fg 17.5 · nuee 9.2 · phare 13.4 ·
   neon 9.0 · phare-ink 13.3 · reverbere 11.0 — tous ≥ 4.5:1.
   ============================================================ */
:root {
  /* ── Couleurs sémantiques (concept : Paris s'allume à 21h) ── */
  --nuit:      #0A0E1F;  /* fond — le bleu de 22h, jamais #000 */
  --nuit-2:    #10152E;  /* strate de nuit relevée (bandes, guichet) */
  --panneau:   #141A38;  /* surface panneau d'affichage */
  --panneau-2: #1C2450;  /* panneau relevé (Nuit Lumière, dominant) */
  --fg:        #F4F7FF;  /* texte stabilisé après allumage */
  --nuee:      #A9B2D6;  /* texte secondaire (nuée) */
  --phare:     #6FE8FF;  /* cyan — faisceau d'allumage + CTA UNIQUEMENT */
  --phare-ink: #071022;  /* texte sur --phare */
  --neon:      #C1A1FF;  /* violet — rémanence/afterglow, soulignés */
  --eteint:    #4A5AE8;  /* indigo — contours des lettres éteintes, strates */
  --reverbere: #E0CC9F;  /* or désaturé — horodatages Sono, micro-détails */
  --danger:    #FF7A90;  /* erreurs formulaire */
  --ligne:     #29325E;  /* filets, bordures de panneaux */

  /* halos (profondeur de nuit — matière B uiverse, radial uniquement) */
  --halo-phare: radial-gradient(closest-side, rgba(111, 232, 255, 0.14), transparent 70%);
  --halo-neon:  radial-gradient(closest-side, rgba(193, 161, 255, 0.11), transparent 70%);
  --halo-or:    radial-gradient(closest-side, rgba(224, 204, 159, 0.09), transparent 72%);

  /* ── Typo (Syne × Karla × Sono — aucune au registre, self-host) ── */
  --font-display: 'Syne', 'display-fallback', sans-serif;
  --font-body:    'Karla', 'Segoe UI', sans-serif;
  --font-mono:    'Sono', 'Courier New', monospace;

  /* échelle modulaire (ratio ample pour l'enseigne) */
  --step--1:   clamp(0.82rem, 0.78rem + 0.2vw, 0.94rem);
  --step-0:    clamp(1rem, 0.96rem + 0.3vw, 1.0625rem);
  --step-1:    clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem);
  --step-2:    clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem);
  --step-3:    clamp(1.9rem, 1.35rem + 2.6vw, 3.2rem);
  --step-hero: clamp(2.6rem, 1rem + 6vw, 5.4rem);

  /* ── Espacement (échelle 4/8) ── */
  --sp-1: 0.25rem; --sp-2: 0.5rem; --sp-3: 1rem; --sp-4: 1.5rem;
  --sp-5: 2.5rem;  --sp-6: 4rem;   --sp-7: 6.5rem; --sp-8: 10rem;

  /* ── Motion (l'Allumage) ── */
  --dur-fast: 180ms; --dur-med: 420ms; --dur-beam: 600ms; --dur-slow: 900ms;
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-beam: cubic-bezier(0.23, 1, 0.32, 1);

  /* ── Grille ── */
  --container: 75rem; --gutter: clamp(1rem, 3.5vw, 2.5rem);
}

/* ── Polices self-host (woff2 locaux, une graisse = un fichier) ── */
@font-face { font-family: 'Syne'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../fonts/syne-v24-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Syne'; font-style: normal; font-weight: 800; font-display: swap;
  src: url('../fonts/syne-v24-latin-800.woff2') format('woff2'); }
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/karla-v33-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('../fonts/karla-v33-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../fonts/karla-v33-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Sono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/sono-v12-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Sono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('../fonts/sono-v12-latin-500.woff2') format('woff2'); }

/* Fallback anti-CLS de Syne (gotcha savonnerie-lune : CLS 0.17 sans fallback calé).
   Syne est large : size-adjust > 100 %, métriques réglées pour CLS < 0.1 (audit). */
@font-face {
  font-family: 'display-fallback';
  src: local('Arial Bold'), local('Arial');
  size-adjust: 114%;
  ascent-override: 86%;
  descent-override: 26%;
  line-gap-override: 0%;
}

/* Fallback no-js : le contenu existe SANS JavaScript (contrat fiche 07). */
.no-js [data-reveal],
.no-js [data-allumage] { opacity: 1 !important; transform: none !important; clip-path: none !important; }
.no-js [data-allumage] .ltr { color: var(--fg) !important; -webkit-text-stroke: 0 !important; }

/* Reduced motion : obligatoire (lint L4) — état final statique et COMPLET. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
