/*
  Studio 36 — Design tokens (design.md §2, §3.2, §4, §18, §19).
  Valeurs uniquement : aucune regle de mise en forme ici (voir base.css et
  components/*.css). Mode sombre natif, pas de bascule light/dark.
*/

:root {
  /* §2.1 Fond & neutres */
  --bg-base: #0B0B0C;
  --bg-raised: #151517;
  --surface-1: #1B1B1E;
  --surface-2: #232326;
  --border-hairline: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.18);
  --overlay-scrim: rgba(6, 6, 7, 0.55);
  --overlay-scrim-strong: rgba(6, 6, 7, 0.7); /* §5.8 : scrim renforce derriere une modale */

  /* §2.2 Texte */
  --text-primary: #F4F1EC;
  --text-secondary: #B3AFA6;
  --text-muted: #79766E;
  --text-on-accent: #FFFCF6;
  --text-inverse: #0B0B0C;

  /*
    §2.3 Accent de marque — enseigne neon (nouveau logo, 2026-07-26) :
    rouge neon (le "36") en accent principal, bronze/or chaud (le "STUDIO")
    en second accent pour les moments qui ont besoin de se distinguer du
    rouge sans sortir de la famille chromatique du logo (ex. deux badges
    cote a cote). Valeurs mesurees par echantillonnage direct des pixels du
    logo (public/assets/img/logo/source/logo-new-original.png), pas
    choisies a l'oeil - #FF0000 quasi pur pour le "36", ~#BF8040 pour
    "STUDIO". Legerement tempere pour rester lisible en usage UI (texte,
    focus ring) plutot que repris a l'identique.
  */
  --accent: #E5332B;
  --accent-strong: #B8241D;
  --accent-soft: rgba(229, 51, 43, 0.10);
  /* --accent-glow sert a la fois aux grands aplats de fond (hero, bandeau
     CTA) et aux petites lueurs concentrees (boutons, focus ring) - une
     valeur qui reste discrete en grand format. --accent-glow-strong,
     reservee aux boutons/etats survol, est plus intense car concentree
     sur une petite surface (jamais utilisee en degrade de fond). */
  --accent-glow: rgba(229, 51, 43, 0.28);
  --accent-glow-strong: rgba(229, 51, 43, 0.55);
  --accent-warm: #C9915A;
  --accent-warm-soft: rgba(201, 145, 90, 0.12);
  --accent-warm-glow: rgba(201, 145, 90, 0.45);

  /* §2.4 Semantique */
  --success: #5FA777;
  --success-soft: rgba(95, 167, 119, 0.12);
  --error: #D6634F;
  --error-soft: rgba(214, 99, 79, 0.12);
  --warning: #D9A441;

  /*
    §2.5 Identite par studio (accent local uniquement, jamais un fond plein).
    ATTENTION contraste (verifie WCAG le 2026-07-23, voir PROGRESS.md Phase 3) :
    utilisees en texte directement sur --bg-base, brique-room passe tout juste
    l'AA texte courant (4.98:1), plateau-show ne passe qu'en grand texte
    (4.40:1), blue-room (2.02:1) echoue nettement.
    Ces teintes proviennent des matieres reelles de chaque lieu (design.md
    §2.5, jamais inventees) : ne pas les modifier ici. Reserver leur usage en
    TEXTE a du grand texte / gras, ou preferer un usage non textuel (liseret,
    bordure, pastille, fond teinte) la ou le contraste texte doit etre garanti.
  */
  --studio-plateau-show: #5C7A99;
  --studio-brique-room: #C1683F;
  --studio-blue-room: #2A4374;

  /* §3.1 Familles (fichiers auto-heberges, voir base.css @font-face) */
  --font-display: 'Fraunces', ui-serif, Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* §3.2 Echelle typographique (desktop -> mobile via clamp) */
  --text-eyebrow-size: 0.75rem;
  --text-eyebrow-line: 1.4;
  --text-eyebrow-tracking: 0.12em;

  --text-h1-size: clamp(2.75rem, 6vw, 5.75rem);
  --text-h1-line: 0.98;
  --text-h1-tracking: -0.02em;

  --text-h2-size: clamp(2rem, 4vw, 3.25rem);
  --text-h2-line: 1.05;
  --text-h2-tracking: -0.01em;

  --text-h3-size: clamp(1.5rem, 2.4vw, 2.25rem);
  --text-h3-line: 1.15;

  --text-h4-size: 1.375rem;
  --text-h4-line: 1.2;

  --text-h5-size: 1.125rem;
  --text-h5-line: 1.3;

  --text-h6-size: 1rem;
  --text-h6-line: 1.4;

  --text-body-lg-size: 1.125rem;
  --text-body-lg-line: 1.6;

  --text-body-size: 1rem;
  --text-body-line: 1.6;

  --text-body-sm-size: 0.875rem;
  --text-body-sm-line: 1.5;

  --text-label-size: 0.8125rem;
  --text-label-line: 1.4;
  --text-label-tracking: 0.01em;

  --text-micro-size: 0.75rem;
  --text-micro-line: 1.4;
  --text-micro-tracking: 0.04em;

  --text-button-size: 0.9375rem;
  --text-button-line: 1;
  --text-button-tracking: 0.01em;

  /* §4.1 Espacement (base 4px / 8px) */
  --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;
  --space-11: 160px;
  --space-12: 200px;

  /* §4.2 Grilles par breakpoint (reference - largeurs utilisees en dur dans les media queries) */
  /* 360-428 mobile / 768-1023 tablette / 1024-1279 laptop / 1280-1439 desktop / 1440-1919 large / >=1920 tres large */
  --container-max-laptop: 1120px;
  --container-max-desktop: 1280px;
  --container-max-large: 1440px;
  --container-max-xlarge: 1560px;

  /* §4.3 Rythme vertical entre sections */
  --section-padding-desktop: var(--space-11);
  --section-padding-tablet: 112px;
  --section-padding-mobile: var(--space-8);
  --section-padding-dense-desktop: 120px;
  --section-padding-dense-tablet: 88px;
  --section-padding-dense-mobile: 56px;

  /* §4.4 Rayons — angles nets, rayon minimal seulement */
  --radius-none: 0;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-pill: 999px;

  /* §4.5 Elevation — pas d'ombres portees classiques, sauf niveau 3 (flottant) */
  --elevation-3-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);

  /* §18.1 Mouvement */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --duration-micro: 160ms;
  --duration-standard: 250ms;
  --duration-expressive: 500ms;
  /* Dediee au reveal au scroll (base.css) : volontairement plus courte que
     --duration-expressive, reservee aux zooms photo au survol - une page
     avec beaucoup de sections en reveal-group (la plupart, apres la
     restructuration de cette session) rendait la lecture "en scrollant vite"
     visiblement plus lente avec le meme timing que ces zooms. */
  --duration-reveal: 320ms;
}
