/* LA PAGE D'INSCRIPTION AU FESTIVAL — EXTRACTION de
   zegame-prototypes/festival-inscription-cible **v3** (Codex, `613654b`).

   ⚠️ EXTRACTION, PAS TRANSPOSITION — même méthode que `engagement.css`, et pour
   la même raison : la maquette de Codex n'est pas une page isolée, c'est une
   page PLUS une coque de site. La coque, ici, existe déjà. Ses sélecteurs ne
   sont pas portés — `.site-header`, `.site-nav*`, `.brand*`, `.menu-toggle*`,
   `.skip-link*`, `.site-footer*`, `.shell`, `.prototype-bar*`, `.header-cta`,
   et les règles de base que `styles.css` pose déjà (`*`, `html`, `body`).

   ⚠️ LE FILTRE PORTE SUR LES FAMILLES, PAS SUR LES SÉLECTEURS EXACTS, et c'est
   une correction : la première version comparait des sélecteurs ENTIERS, si
   bien que `.site-footer>p`, `.footer-brand small` et `.brand-mark.light i` lui
   ont échappé — trois règles qui auraient repeint le pied du SITE sur cette
   page. Un filtre par égalité attrape les sélecteurs, pas leur famille.

   Chargée PAR LA VUE, jamais par la coque — comme `sommaire.css` et
   `engagement.css`. C'est ce qui rend sans danger les noms génériques de la
   maquette (`.hero`, `.faq`, `.button`, `.eyebrow`) : ils n'existent que sur
   cette page-ci.

   ── CE QUE LA v3 CHANGE ──────────────────────────────────────────────────────

   Codex a recomposé la page en une suite de réponses aux questions qu'un
   visiteur se pose — qu'est-ce que ce Festival, c'est quoi le Point Zéro, à qui
   s'adresse-t-il, pourquoi sept ans, quel programme, avec quoi je repars, et
   l'Oméga. Sept sections neuves prennent la place de l'ancienne séquence des
   cinq prototypes.

   ⚠️ ET SA MAQUETTE GARDE LES ANCIENNES SECTIONS EN `hidden` — quatre d'entre
   elles : `.anti-festival`, `.prototypes`, le premier `.doctor` et `.risk`.
   C'est utile dans une maquette, où l'on compare deux états ; ce serait du DOM
   mort dans l'application, avec son CSS et ses images. **On porte la page
   AFFICHÉE**, et le filtre de sélecteurs travaille sur le document dépouillé de
   ces sections : leurs règles ne sont donc pas portées non plus.

   Le bloc du Docteur, lui, ne disparaît pas : il DÉMÉNAGE, plus bas. Et
   l'illustration de l'Ombre, qui servait au cinquième prototype, est
   RÉEMPLOYÉE en fond du nouveau bloc « programme » — vérifié avant de
   l'effacer.

   ── QUATRE ÉCARTS, ET AUCUN AUTRE ───────────────────────────────────────────

   1. ⚠️ LA PALETTE EST CELLE DU SITE (arbitrage de Boris, 4 septembre). La
      maquette redéfinit `--ink`, `--paper`, `--violet`, `--line`… avec des
      valeurs proches mais distinctes, et l'écart SE VOIT : mesuré ΔE 5,20 sur
      `--violet`, 4,97 sur `--paper-2`, 3,10 sur `--ink-2`. Or l'en-tête et le
      pied viennent de la coque : une palette propre à la page aurait fait une
      couture dans le même écran. Seules les couleurs que le Festival INVENTE
      sont portées — `--night`, `--magenta`, `--gold`, `--acid`.

   2. ⚠️ `.dialog-close` EST BORNÉE À SON DIALOGUE. La coque du site emploie ce
      même nom pour son dialogue de lecture, en CLAIR ; celui de Codex est
      SOMBRE. Porté nu, il aurait repeint en noir le bouton de fermeture du site
      sur cette page.

   3. LE CSS QUE LE DOCUMENT N'ATTEINT PAS N'EST PAS PORTÉ. La règle est
      mécanique : aucune classe du sélecteur présente dans le document affiché,
      aucun portage. ⚠️ Une classe citée dans `:not()` ne compte PAS comme
      atteinte — sans quoi `.risk-grid>div:first-child>p:not(.eyebrow)` passait
      le filtre, sa section étant pourtant retirée.

   4. LA GARDE « MOUVEMENT RÉDUIT » N'EST PAS PORTÉE : celle du site est déjà
      plus forte (`animation-duration: .01ms !important`).

   ⚠️ CE QUI EST GARDÉ ET QU'ON POURRAIT CROIRE DE COQUE : `body { padding-bottom:
   72px }` — la place réservée au CTA mobile persistant, qui est en
   `position: fixed`. Sans elle, il recouvrirait le pied du site.

   ⚠️ `--site-header-height: 76px` N'EST PAS UNE SUPPOSITION : mesuré au
   navigateur, l'en-tête du site fait bien 76 px et il est `sticky` en
   `z-index: 200`. La sous-navigation du Festival s'y cale.
*/

:root { --night:#110b10; --night-2:#21131f; --magenta:#c73794; --gold:#d8a64c; --gold-light:#f0cd81; --acid:#e5ff6e; --site-header-height:76px; --festival-nav-height:50px; }
a { color:inherit; }
button,
input { font:inherit; }
button,
a { -webkit-tap-highlight-color:transparent; }
button:focus-visible,
a:focus-visible,
input:focus-visible,
summary:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
.eyebrow { margin:0 0 14px; color:var(--violet); font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow.gold { color:var(--gold-light); }
h1,
h2,
h3 { font-family:var(--serif); font-weight:500; line-height:1.07; margin:0; letter-spacing:-.035em; }
h2 { font-size:clamp(38px,5vw,66px); }
p { margin:0; }
.festival-nav { height:var(--festival-nav-height); position:sticky; top:var(--site-header-height); z-index:290; padding:0 max(var(--site-gouttiere, 20px), calc((100% - var(--site-largeur, 1180px)) / 2)); display:grid; grid-template-columns:260px 1fr auto; align-items:center; gap:30px; background:rgba(17,11,16,.95); color:white; border-bottom:1px solid rgba(255,255,255,.13); backdrop-filter:blur(14px); }
.festival-nav-title { text-decoration:none; display:flex; align-items:center; gap:10px; line-height:1; }
.festival-nav-title span { font-size:9px; color:var(--gold-light); letter-spacing:.12em; }
.festival-nav-title b { font-family:var(--serif); font-size:13px; font-weight:500; }
.festival-nav>div { display:flex; justify-content:center; gap:28px; }
.festival-nav>div a { font-size:10px; text-decoration:none; color:rgba(255,255,255,.68); }
.festival-nav>div a:hover { color:white; }
.festival-nav-cta { text-decoration:none; font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--gold-light); display:flex; gap:10px; }
.hero { min-height:730px; height:calc(100vh - var(--site-header-height) - var(--festival-nav-height)); max-height:850px; display:grid; grid-template-columns:46% 54%; background:var(--night); color:white; overflow:hidden; }
.hero-copy { padding:clamp(55px,7vh,90px) clamp(34px,5vw,85px); display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; }
.hero-copy::after { content:""; position:absolute; z-index:-1; right:-130px; top:0; bottom:0; width:250px; background:linear-gradient(90deg,var(--night),transparent); }
.hero-date { font-size:13px; letter-spacing:.08em; color:rgba(255,255,255,.68); margin:0 0 28px; }
.hero h1 { font-size:clamp(42px,4.7vw,69px); }
.hero h1 em { color:var(--gold-light); font-style:normal; }
.hero-lead { font-family:var(--serif); font-size:clamp(18px,1.7vw,24px); margin-top:28px; color:rgba(255,255,255,.82); }
.hero-price { display:flex; align-items:center; gap:27px; margin-top:32px; }
.hero-price strong { font-family:var(--serif); font-size:36px; color:var(--gold-light); font-weight:500; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:50px; padding:10px 12px 10px 24px; border-radius:999px; text-decoration:none; font-size:13px; font-weight:600; }
.button-gold { background:var(--gold-light); color:var(--ink); }
.button i,
.submit-button i { width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:var(--ink); color:white; font-style:normal; }
.hero-art { margin:0; position:relative; overflow:hidden; background:#28180f; }
.hero-art img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.hero-art::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(17,11,16,.2),transparent 35%); }
.hero-art figcaption { position:absolute; z-index:2; right:24px; bottom:20px; color:rgba(255,255,255,.62); font-size:9px; letter-spacing:.15em; text-transform:uppercase; }
[hidden] { display:none!important; }
.festival-intro { padding:120px 0; background:var(--paper); }
.festival-intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; }
.festival-intro-title h2 { font-size:clamp(42px,5.3vw,72px); }
.festival-intro-title h2 em { font-style:normal; color:var(--violet); }
.festival-intro-copy .lead { font-family:var(--serif); font-size:clamp(23px,2.5vw,34px); line-height:1.45; }
.festival-intro-copy>p:last-child { max-width:570px; margin-top:26px; color:#655961; }
.seven-mark { display:flex; align-items:center; gap:20px; margin-top:40px; }
.seven-mark strong { font-family:var(--serif); font-size:90px; line-height:.8; color:var(--violet); font-weight:450; }
.seven-mark span { padding-left:20px; border-left:1px solid #b8a58e; font-size:11px; font-weight:600; letter-spacing:.15em; }
.pz-explainer { display:grid; grid-template-columns:1fr 1fr; min-height:720px; background:var(--night); color:white; }
.pz-explainer figure { margin:0; position:relative; overflow:hidden; }
.pz-explainer figure:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 50%,var(--night)); }
.pz-explainer img { width:100%; height:100%; object-fit:cover; display:block; }
.pz-explainer>div { padding:95px clamp(35px,7vw,110px) 95px clamp(30px,5vw,80px); display:flex; flex-direction:column; justify-content:center; }
.pz-explainer h2 { font-size:clamp(42px,5vw,68px); }
.pz-explainer>div>p:not(.eyebrow) { margin-top:23px; color:rgba(255,255,255,.7); max-width:650px; }
.era-shift { display:grid; grid-template-columns:auto 1fr auto 1fr auto; gap:13px; align-items:center; margin-top:45px; color:rgba(255,255,255,.62); font-size:8px; letter-spacing:.12em; }
.era-shift i { height:1px; background:rgba(255,255,255,.25); }
.era-shift b { color:var(--gold-light); font-family:var(--serif); font-size:12px; letter-spacing:.04em; }
.pioneers { display:grid; grid-template-columns:56% 44%; min-height:760px; background:#321329; color:white; }
.pioneers-art { grid-column:2; grid-row:1; position:relative; overflow:hidden; }
.pioneers-art:after { content:""; position:absolute; inset:0; background:linear-gradient(270deg,transparent 55%,#321329); }
.pioneers-art img { width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.76) contrast(1.08); }
.pioneers-copy { grid-column:1; grid-row:1; padding:95px clamp(40px,6vw,90px) 95px max(6vw,calc((100vw - 1180px)/2)); }
.pioneers-copy h2 { font-size:clamp(42px,5vw,68px); }
.pioneers-copy>p:not(.eyebrow) { max-width:680px; color:rgba(255,255,255,.7); margin-top:25px; }
.pioneers-copy ul { list-style:none; margin:38px 0 27px; padding:0; max-width:720px; }
.pioneers-copy li { position:relative; padding:15px 0 15px 34px; border-bottom:1px solid rgba(255,255,255,.16); font-family:var(--serif); font-size:clamp(18px,1.75vw,24px); }
.pioneers-copy li:before { content:"→"; position:absolute; left:0; color:var(--gold-light); }
.pioneers-copy>strong { font-family:var(--serif); font-size:30px; color:var(--gold-light); font-weight:500; }
.decisive-window { padding:120px 0; background:#e5d9c5; }
.decisive-grid { display:grid; grid-template-columns:1fr .9fr; gap:90px; align-items:center; }
.decisive-copy h2 { font-size:clamp(45px,5vw,70px); }
.decisive-copy>p:not(.eyebrow) { margin-top:22px; max-width:620px; color:#61545d; }
.decisive-copy blockquote { margin:38px 0 0; padding:25px 0 25px 30px; border-left:3px solid var(--violet); font-family:var(--serif); font-size:clamp(19px,2vw,27px); line-height:1.45; }
.decisive-copy blockquote b { color:var(--violet); }
.decisive-window figure { margin:0; min-height:600px; position:relative; border-radius:50% 50% 20px 20px; overflow:hidden; box-shadow:0 30px 60px rgba(37,20,32,.18); }
.decisive-window figure img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.decisive-window figcaption { position:absolute; left:25px; right:25px; bottom:25px; display:grid; grid-template-columns:repeat(5,1fr); gap:7px; }
.decisive-window figcaption span { height:34px; display:grid; place-items:center; background:rgba(17,11,16,.78); color:white; border:1px solid rgba(255,255,255,.2); font-size:9px; }
.day-experience { padding:115px 0 0; background:var(--night); color:white; }
.day-heading { max-width:920px; margin-bottom:65px; }
.day-heading h2 { font-size:clamp(45px,5.4vw,72px); }
.day-heading .lead { max-width:820px; margin-top:28px; font-family:var(--serif); font-size:clamp(20px,2vw,28px); color:rgba(255,255,255,.72); }
.day-polarities { display:grid; grid-template-columns:1fr 1fr; min-height:650px; background:url("/site/assets/festival/festival-shadow.webp") center/cover; }
.day-polarities article { padding:90px max(5vw,calc((100vw - 1180px)/2)); display:flex; align-items:flex-end; }
.day-polarities article>div { max-width:520px; }
.day-polarities small { display:block; margin-bottom:25px; font-size:10px; letter-spacing:.15em; }
.day-polarities h3 { font-size:clamp(38px,4vw,58px); }
.day-polarities p:not(.eyebrow) { margin-top:20px; font-size:14px; }
.light-day { background:linear-gradient(90deg,rgba(244,232,211,.96),rgba(244,232,211,.68)); color:var(--ink); }
.shadow-night { background:linear-gradient(90deg,rgba(17,11,16,.55),rgba(17,11,16,.94)); color:white; }
.shadow-night>div { margin-left:auto; }
.shadow-night p:not(.eyebrow) { color:rgba(255,255,255,.7); }
.shadow-reason { padding-block:105px; display:grid; grid-template-columns:.65fr 1.2fr 1fr; gap:65px; align-items:start; }
.shadow-reason h2 { font-size:clamp(34px,4vw,55px); }
.shadow-reason>div p { color:rgba(255,255,255,.68); margin-bottom:22px; }
.departure { padding:120px 0; background:var(--paper); }
.departure-heading { display:grid; grid-template-columns:.7fr 1.3fr; gap:70px; align-items:end; }
.departure-heading h2 { font-size:clamp(45px,5.5vw,74px); }
.departure-grid { display:grid; grid-template-columns:1fr .7fr; gap:90px; align-items:center; margin-top:65px; }
.departure-copy>p { margin-top:22px; color:#61565e; max-width:650px; }
.world-row { display:grid; grid-template-columns:repeat(10,1fr); margin-top:42px; position:relative; }
.world-row:before { content:""; position:absolute; left:4%; right:4%; top:18px; height:1px; background:#b8a794; }
.world-row>* { width:36px; height:36px; z-index:1; border-radius:50%; display:grid; place-items:center; background:var(--paper); border:1px solid #a99481; font-style:normal; font-size:10px; }
.world-row b { background:var(--violet); border-color:var(--violet); color:white; }
.mobile-common { width:min(100%,330px); min-height:570px; margin:auto; padding:28px 22px; border:10px solid var(--night); border-radius:35px; background:linear-gradient(180deg,#f7f1e7 0 24%,#d7b368 24% 45%,#1b111a 45%); box-shadow:0 35px 70px rgba(27,15,26,.22); display:flex; flex-direction:column; }
.mobile-common>span { font-size:10px; font-weight:600; letter-spacing:.16em; }
.mobile-common>small { margin-top:35px; font-size:8px; letter-spacing:.13em; color:var(--violet); }
.mobile-common>strong { font-family:var(--serif); font-size:30px; line-height:1.1; margin-top:8px; }
.mobile-common>div { margin-top:auto; padding:22px; background:rgba(255,255,255,.94); border-radius:18px; color:var(--ink); }
.mobile-common>div>b { font-size:8px; color:var(--violet); letter-spacing:.12em; }
.mobile-common>div p { font-family:var(--serif); font-size:20px; margin:8px 0 17px; }
.mobile-common button { width:100%; border:0; border-radius:50px; padding:13px; background:var(--night); color:white; font-size:11px; }
.mobile-common button i { font-style:normal; margin-left:15px; }
.omega-answer { padding:115px 0; background:linear-gradient(135deg,#4b143d,#982775); color:white; }
.omega-answer-grid { display:grid; grid-template-columns:1fr .85fr; gap:90px; align-items:center; }
.omega-answer h2 { font-size:clamp(45px,5.4vw,72px); }
.omega-answer-grid>div>p:not(.eyebrow) { margin-top:22px; color:rgba(255,255,255,.72); max-width:660px; }
.omega-answer figure { margin:0; position:relative; min-height:520px; border-radius:50%; overflow:hidden; border:1px solid rgba(255,255,255,.23); }
.omega-answer figure:after { content:""; position:absolute; inset:0; background:radial-gradient(circle,transparent 25%,rgba(26,8,21,.76)); }
.omega-answer figure img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.72); }
@keyframes festival-omega {from{transform:rotate(0deg) translateX(115px) rotate(0deg)}to{transform:rotate(360deg) translateX(115px) rotate(-360deg)}}
.section-heading { max-width:850px; margin-bottom:65px; }
@keyframes omega-drift {0%,100%{transform:translateX(-80px)}50%{transform:translateX(80px)}}
.doctor { display:grid; grid-template-columns:220px 1fr; background:#0a090a; color:white; position:relative; overflow:hidden; }
.doctor::after { content:"Z.E.R.O."; position:absolute; right:-25px; bottom:-75px; font-family:var(--serif); font-size:190px; color:rgba(255,255,255,.035); }
.doctor-copy { padding:85px max(8vw,calc((100vw - 950px)/2)); max-width:1150px; position:relative; z-index:1; }
.eyebrow.acid { color:var(--acid); }
.doctor blockquote { font-family:var(--serif); font-size:clamp(36px,5vw,64px); margin:0 0 25px; }
.doctor-copy>p:not(.eyebrow) { font-family:var(--serif); font-size:clamp(19px,2.3vw,29px); margin-top:14px; max-width:900px; }
.doctor-copy>strong { display:block; margin-top:25px; color:var(--acid); font-family:var(--serif); font-size:34px; font-weight:500; }
.price-prototype { padding:120px 0; background:var(--night); color:white; }
.price-grid { display:grid; grid-template-columns:.8fr .8fr 1.2fr; margin-top:50px; }
.price-grid>div { padding:20px 45px 20px 0; margin-right:45px; border-right:1px solid rgba(255,255,255,.2); }
.price-grid>div:last-child { margin:0; padding:32px; background:var(--gold-light); color:var(--ink); border:0; }
.price-grid small { font-size:9px; letter-spacing:.15em; }
.price-grid strong { display:block; font-family:var(--serif); font-size:clamp(46px,5vw,70px); font-weight:500; margin:18px 0 0; color:var(--gold-light); }
.price-grid>div:last-child strong { color:var(--violet-deep); }
.price-grid span { font-size:11px; opacity:.6; }
.price-grid p { font-size:13px; color:rgba(255,255,255,.65); margin-top:24px; }
.price-grid>div:last-child p { color:#51444d; }
.price-grid h3 { font-size:28px; margin-top:-9px; }
.ticket-cost>p:first-of-type { font-family:var(--serif); font-size:19px; color:white; }
.returned h3 { text-transform:uppercase; letter-spacing:.06em; }
.after { padding:115px 0; background:#ded0ba; }
.after-grid { display:grid; grid-template-columns:1fr .8fr; gap:80px; align-items:center; }
.after h2 { font-size:clamp(38px,5vw,64px); }
.after-grid>div:first-child>p:not(.eyebrow) { margin-top:20px; color:#5c4f56; }
.member-offer { padding:38px; background:var(--white); border:1px solid rgba(23,18,24,.2); box-shadow:18px 18px 0 rgba(142,36,111,.12); }
.member-offer small,
.member-offer b,
.member-offer strong,
.member-offer span { display:block; }
.member-offer small { font-size:9px; letter-spacing:.14em; color:var(--violet); }
.member-offer b { font-family:var(--serif); font-size:27px; margin-top:18px; }
.member-offer strong { font-family:var(--serif); font-size:62px; color:var(--violet); font-weight:500; }
.member-offer strong em { font-family:var(--sans); font-size:15px; font-style:normal; }
.member-offer span { font-size:12px; color:#695c64; }
.member-offer p { border-top:1px solid var(--line); margin-top:22px; padding-top:18px; font-family:var(--serif); font-size:19px; }
.timeline { padding:120px 0; background:linear-gradient(rgba(17,11,16,.93),rgba(17,11,16,.97)),url("/site/assets/festival/festival-cover.webp") center/cover fixed; color:white; }
.timeline .section-heading { max-width:780px; }
.timeline ol { list-style:none; margin:70px 0 0; padding:0; position:relative; }
.timeline ol::before { content:""; position:absolute; left:205px; top:0; bottom:0; border-left:1px solid rgba(216,166,76,.5); }
.timeline li { display:grid; grid-template-columns:180px 1fr; gap:55px; padding:0 0 55px; position:relative; }
.timeline li::before { content:""; position:absolute; left:198px; top:4px; width:15px; height:15px; border-radius:50%; background:var(--night); border:2px solid var(--gold); }
.timeline time { font-size:10px; letter-spacing:.14em; color:var(--gold-light); text-align:right; }
.timeline h3 { font-size:clamp(25px,3vw,40px); }
.timeline li p { font-size:13px; color:rgba(255,255,255,.64); margin-top:7px; }
.timeline-question { padding-top:18px; }
.timeline-question div { padding:30px; border:1px solid rgba(216,166,76,.5); }
.timeline-question small { font-size:9px; letter-spacing:.18em; color:var(--gold-light); }
.place-opens { padding:115px 0; background:var(--paper); }
.open-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.open-grid article { padding:34px 30px; background:var(--white); border-top:4px solid var(--violet); }
.open-grid span { font-size:10px; letter-spacing:.15em; color:var(--violet); font-weight:600; }
.open-grid h3 { font-size:28px; margin:20px 0 13px; }
.open-grid p { font-size:13px; color:#665a62; }
.place-opens h2 { text-align:center; margin-top:70px; }
.place-opens h2 em { font-style:normal; color:var(--violet); }
.fit { display:grid; grid-template-columns:1fr 1fr; }
.fit-column { padding:80px max(5vw,calc((100vw - 1180px)/2)); min-height:620px; }
.fit-yes { background:#eadfcd; }
.fit-no { background:#24111f; color:white; }
.fit-column ul { list-style:none; padding:0; margin:36px 0 0; }
.fit-column li { font-family:var(--serif); font-size:clamp(19px,2vw,26px); padding:16px 0 16px 35px; border-bottom:1px solid rgba(23,18,24,.15); position:relative; }
.fit-column li::before { content:"+"; position:absolute; left:0; color:var(--violet); }
.fit-no li { border-color:rgba(255,255,255,.14); }
.fit-no li::before { content:"−"; color:var(--gold); }
.doctor-signoff { margin-top:35px; font-size:12px; color:#e4a8d1; border-left:2px solid var(--gold); padding-left:15px; }
.faq { padding:115px 0; background:var(--white); }
.faq-grid { display:grid; grid-template-columns:.65fr 1.35fr; gap:100px; }
.faq-list details { border-top:1px solid var(--line); padding:20px 0; }
.faq-list details:last-child { border-bottom:1px solid var(--line); }
.faq-list summary { font-family:var(--serif); font-size:23px; font-weight:500; cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:20px; }
.faq-list summary::after { content:"+"; color:var(--violet); }
.faq-list details[open] summary::after { content:"−"; }
.faq-list details p { font-size:14px; color:#655961; max-width:720px; padding:16px 45px 0 0; }
.final-call { padding:120px 0; background:var(--night); color:white; position:relative; overflow:hidden; }
.final-art { position:absolute; inset:0 50% 0 0; opacity:.19; }
.final-art img { width:100%; height:100%; object-fit:cover; }
.final-call::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(17,11,16,.2),var(--night) 55%); pointer-events:none; }
.final-grid { display:grid; grid-template-columns:1fr .8fr; gap:90px; align-items:center; position:relative; z-index:1; }
.final-grid h2 { font-size:clamp(55px,7vw,95px); }
.final-grid>div>p:not(.eyebrow) { margin-top:20px; max-width:600px; color:rgba(255,255,255,.68); }
.final-event { margin-top:35px; padding-top:24px; border-top:1px solid rgba(255,255,255,.23); }
.final-event b,
.final-event span,
.final-event small { display:block; }
.final-event b { font-family:var(--serif); font-size:22px; color:var(--gold-light); }
.final-event span { font-size:13px; margin-top:4px; }
.final-event small { font-size:11px; color:rgba(255,255,255,.57); margin-top:8px; }
.booking-form { background:var(--white); color:var(--ink); padding:38px 42px; }
.form-head { margin-bottom:27px; }
.form-head span { float:right; background:#ead7e5; color:var(--violet-deep); border-radius:99px; padding:5px 10px; font-size:10px; font-weight:600; }
.form-head b,
.form-head small { display:block; }
.form-head b { font-family:var(--serif); font-size:30px; font-weight:500; }
.form-head small { font-size:11px; color:#776d75; }
.booking-form label:not(.check) { display:block; font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; margin-top:17px; }
.booking-form input:not([type=checkbox]) { width:100%; display:block; border:0; border-bottom:1px solid #cfc4cb; background:transparent; padding:10px 2px; font-size:15px; color:var(--ink); border-radius:0; }
.booking-form input::placeholder { color:#a89ea5; }
.check { display:flex; align-items:flex-start; gap:10px; font-size:11px; color:#655b63; margin:22px 0; }
.check input { margin-top:4px; }
.submit-button { width:100%; min-height:58px; border:0; border-radius:99px; padding:10px 12px 10px 25px; background:var(--ink); color:white; font-weight:600; display:flex; align-items:center; justify-content:space-between; cursor:pointer; }
.submit-button:hover { background:var(--violet-deep); }
.submit-button i { background:white; color:var(--ink); }
.secure { text-align:center; font-size:9px; color:#8d838a; margin:10px 0 0; }
.form-message { text-align:center; font-size:12px; color:var(--violet); min-height:20px; margin-top:8px; }
.mobile-book { display:none; }
.video-dialog { width:min(1040px,calc(100% - 30px)); padding:0; border:0; background:#080608; color:white; box-shadow:0 30px 100px rgba(0,0,0,.6); }
.video-dialog::backdrop { background:rgba(11,6,12,.9); backdrop-filter:blur(7px); }
.video-dialog .dialog-close { position:absolute; z-index:2; right:10px; top:10px; width:38px; height:38px; border:1px solid rgba(255,255,255,.5); border-radius:50%; background:rgba(8,6,8,.72); color:white; font-size:24px; cursor:pointer; }
.video-frame { aspect-ratio:16/9; }
.video-frame iframe { width:100%; height:100%; border:0; display:block; }
@media(max-width:1050px) {
  .price-grid>div { padding-right:25px; margin-right:25px; }
}
@media(max-width:820px) {
  :root { --site-header-height:64px; --festival-nav-height:46px; }
  .festival-nav { grid-template-columns:1fr auto; padding:0 18px; }
  .festival-nav>div { display:none; }
  .festival-nav-title span { display:none; }
  .hero { height:auto; max-height:none; min-height:0; grid-template-columns:1fr; }
  .hero-copy { order:2; padding:55px 24px 65px; }
  .hero-copy::after { display:none; }
  .hero-art { height:58vw; min-height:340px; order:1; }
  .hero-art img { object-position:center; }
  .after-grid,
  .faq-grid,
  .final-grid { grid-template-columns:1fr; }
  .after-grid,
  .faq-grid,
  .final-grid { gap:45px; }
  .price-grid { grid-template-columns:1fr; }
  .price-grid>div { border-right:0; border-bottom:1px solid rgba(255,255,255,.2); margin:0 0 25px; padding:20px 0 35px; }
  .open-grid { grid-template-columns:1fr; }
  .fit { grid-template-columns:1fr; }
  .fit-column { min-height:0; }
  .final-art { inset:0; opacity:.1; }
}
@media(max-width:600px) {
  :root { --site-header-height:58px; --festival-nav-height:44px; }
  body { padding-bottom:72px; }
  .festival-nav { top:var(--site-header-height); padding:0 14px; }
  .festival-nav-title b { font-size:11px; }
  .festival-nav-cta { font-size:9px; }
  .hero-art { height:70vw; min-height:270px; }
  .hero-copy { padding:44px 18px 58px; text-align:center; }
  .hero-date { margin-bottom:19px; }
  .hero h1 { font-size:37px; }
  .hero-lead { font-size:18px; }
  .hero-price { display:grid; grid-template-columns:auto 1fr; gap:16px; text-align:left; }
  .hero-price strong { font-size:32px; }
  .button { padding-left:19px; }
  .price-prototype,
  .after,
  .timeline,
  .place-opens,
  .faq,
  .final-call { padding-block:75px; }
  .section-heading h2,
  .after h2,
  .faq h2 { font-size:37px; }
  .section-heading { margin-bottom:40px; }
  .doctor { grid-template-columns:38px 1fr; }
  .doctor-copy { padding:65px 23px; }
  .doctor blockquote { font-size:38px; }
  .doctor-copy>p:not(.eyebrow) { font-size:20px; }
  .price-grid { margin-top:30px; }
  .price-grid>div:last-child { padding:28px; }
  .member-offer { padding:28px; }
  .timeline ol::before { left:7px; }
  .timeline li { grid-template-columns:1fr; gap:10px; padding:0 0 42px 34px; }
  .timeline li::before { left:0; }
  .timeline time { text-align:left; }
  .timeline-question div { padding:23px; }
  .open-grid article { padding:27px 24px; }
  .place-opens h2 { margin-top:48px; font-size:36px; }
  .fit-column { padding:62px 22px; }
  .fit-column li { font-size:19px; }
  .faq-grid { gap:25px; }
  .faq-list summary { font-size:19px; }
  .final-grid h2 { font-size:57px; }
  .booking-form { margin-inline:-15px; padding:30px 22px; }
  .mobile-book { position:fixed; z-index:400; left:10px; right:10px; bottom:9px; min-height:58px; border-radius:99px; background:var(--gold-light); color:var(--ink); text-decoration:none; display:flex; align-items:center; justify-content:space-between; padding:8px 10px 8px 22px; box-shadow:0 10px 35px rgba(21,9,20,.32); }
  .mobile-book span small,
  .mobile-book span b { display:block; }
  .mobile-book span small { font-size:8px; text-transform:uppercase; letter-spacing:.09em; }
  .mobile-book span b { font-size:13px; }
  .mobile-book>i { width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--ink); color:white; font-style:normal; }
  .video-dialog { width:100%; }
}
.hero-art::before { content:""; position:absolute; inset:-25px; background:url("/site/assets/festival/festival-cover.webp") center/cover; filter:blur(22px) brightness(.55); transform:scale(1.08); }
.hero-art img { object-fit:contain; position:relative; z-index:1; }
.hero-art::after { z-index:2; }
.hero-art figcaption { z-index:3; }
@media(max-width:820px) {
  .hero-art { height:56.25vw; min-height:0; }
}
.hero-art picture { display:block; width:100%; height:100%; }
@media(max-width:820px) {
  .festival-intro-grid,
  .decisive-grid,
  .departure-heading,
  .departure-grid,
  .omega-answer-grid { grid-template-columns:1fr; }
  .festival-intro-grid,
  .decisive-grid,
  .departure-grid,
  .omega-answer-grid { gap:48px; }
  .festival-intro-title h2 { font-size:48px; }
  .pz-explainer,
  .pioneers { grid-template-columns:1fr; }
  .pioneers-art { grid-column:1; grid-row:1; }
  .pioneers-copy { grid-column:1; grid-row:2; }
  .pz-explainer figure,
  .pioneers-art { height:420px; }
  .pz-explainer figure:after { background:linear-gradient(0deg,var(--night),transparent 55%); }
  .pz-explainer>div,
  .pioneers-copy { padding:65px 24px 75px; }
  .pioneers-art:after { background:linear-gradient(0deg,#321329,transparent 55%); }
  .pioneers-copy h2 { font-size:48px; }
  .decisive-window figure { min-height:500px; }
  .day-polarities { grid-template-columns:1fr; min-height:0; background-position:center; }
  .day-polarities article { min-height:480px; padding:65px 24px; }
  .light-day { background:linear-gradient(0deg,rgba(244,232,211,.97),rgba(244,232,211,.5)); }
  .shadow-night { background:linear-gradient(0deg,rgba(17,11,16,.96),rgba(17,11,16,.5)); }
  .shadow-night>div { margin-left:0; }
  .shadow-reason { grid-template-columns:1fr; gap:30px; }
  .departure-heading { gap:22px; }
  .world-row { grid-template-columns:repeat(5,1fr); gap:15px 0; }
  .world-row:before { display:none; }
  .mobile-common { min-height:540px; }
  .omega-answer figure { min-height:500px; max-width:500px; width:100%; margin:auto; }
}
@media(max-width:600px) {
  .festival-intro,
  .decisive-window,
  .departure,
  .omega-answer { padding-block:75px; }
  .festival-intro-grid { gap:40px; }
  .festival-intro-title h2,
  .pioneers-copy h2,
  .decisive-copy h2,
  .day-heading h2,
  .departure-heading h2,
  .omega-answer h2 { font-size:38px; }
  .festival-intro-copy .lead { font-size:22px; }
  .seven-mark strong { font-size:72px; }
  .pz-explainer figure,
  .pioneers-art { height:330px; }
  .pz-explainer>div,
  .pioneers-copy { padding:55px 18px 65px; }
  .pz-explainer h2 { font-size:39px; }
  .era-shift { grid-template-columns:1fr auto 1fr; text-align:center; }
  .era-shift i { display:none; }
  .era-shift b { grid-row:2; grid-column:1/-1; margin-top:8px; }
  .pioneers-copy li { font-size:18px; }
  .pioneers-copy>strong { font-size:25px; }
  .decisive-grid { gap:38px; }
  .decisive-copy blockquote { padding-left:20px; font-size:19px; }
  .decisive-window figure { min-height:400px; border-radius:18px; }
  .day-experience { padding-top:75px; }
  .day-heading { margin-bottom:40px; }
  .day-heading .lead { font-size:20px; }
  .day-polarities article { min-height:420px; padding:52px 18px; }
  .day-polarities h3 { font-size:38px; }
  .shadow-reason { padding-block:70px; }
  .shadow-reason h2 { font-size:34px; }
  .departure-grid { margin-top:42px; }
  .mobile-common { min-height:510px; }
  .omega-answer figure { min-height:345px; }
  from { transform:rotate(0deg) translateX(83px) rotate(0deg); }
  to { transform:rotate(360deg) translateX(83px) rotate(-360deg); }
}
@media(max-width:600px) {
  .hero-price { display:none; }
}
.cover-play { position:absolute; z-index:4; left:50%; top:50%; transform:translate(-50%,-50%); border:1px solid rgba(255,255,255,.7); border-radius:999px; background:rgba(15,9,14,.48); color:white; display:grid; grid-template-columns:62px auto; grid-template-rows:1fr 1fr; column-gap:15px; align-items:center; padding:12px 22px 12px 12px; cursor:pointer; backdrop-filter:blur(8px); box-shadow:0 12px 45px rgba(0,0,0,.28); }
.cover-play>span { grid-row:1/3; width:62px; height:62px; border-radius:50%; display:grid; place-items:center; padding-left:4px; background:rgba(255,255,255,.9); color:var(--violet-deep); font-size:15px; }
.cover-play b { align-self:end; white-space:nowrap; font-size:12px; }
.cover-play small { align-self:start; text-align:left; color:rgba(255,255,255,.72); font-size:10px; }
.cover-play:hover { background:rgba(142,36,111,.72); }
.mobile-common { width:min(100%,315px); min-height:0; aspect-ratio:1080/2200; padding:0; overflow:hidden; background:#171018; }
.mobile-common img { display:block; width:100%; height:112%; object-fit:cover; transform:translateY(-4%); }
.omega-answer .omega-app-preview { width:min(100%,520px); justify-self:center; border-color:rgba(255,255,255,.42); box-shadow:0 35px 80px rgba(28,7,23,.42); }
.omega-answer .omega-app-bar { height:58px; padding-inline:25px; font-size:10px; }
.omega-answer .omega-app-body { padding:34px 36px 28px; }
.omega-answer .omega-app-body small { font-size:9px; }
.omega-answer .omega-app-body>strong { font-size:58px; margin-top:9px; }
.omega-answer .omega-app-body>span { font-size:11px; }
.omega-answer .omega-app-body>b { font-size:40px; margin-top:9px; }
.omega-answer .omega-app-body p { font-size:10px; }
.omega-answer .omega-app-body em { font-size:9px; padding:11px 13px; }
.omega-answer .omega-app-preview footer { padding:15px 25px; font-size:9px; }
@media(max-width:600px) {
  .mobile-common { width:min(88vw,310px); }
  .omega-answer .omega-app-body { padding:27px 25px 23px; }
  .omega-answer .omega-app-body>strong { font-size:48px; }
  .omega-answer .omega-app-body>b { font-size:34px; }
}
@keyframes motor-circulation {to{offset-distance:100%}}
.doctor { grid-template-columns:minmax(320px,38vw) 1fr; }
.doctor-portrait { margin:0; position:relative; min-height:620px; background:#0a090a; overflow:hidden; }
.doctor-portrait::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 45%,#0a090a 100%); }
.doctor-portrait img { width:100%; height:100%; object-fit:cover; object-position:center; filter:contrast(1.04); }
.doctor-portrait figcaption { position:absolute; z-index:2; left:28px; bottom:25px; font-size:9px; letter-spacing:.15em; color:var(--acid); }
.doctor-copy { padding-inline:clamp(45px,7vw,115px); }
.doctor-evening { display:block; max-width:720px; margin-top:34px; padding-top:20px; border-top:1px solid rgba(229,255,110,.32); font-family:var(--sans); font-size:11px; line-height:1.6; color:rgba(255,255,255,.62); }
.ten-worlds { grid-column:1/-1; margin-top:30px; padding:35px 38px; background:var(--night); color:white; display:grid; grid-template-columns:1fr 1.4fr; gap:45px; align-items:center; }
.ten-worlds small { font-size:9px; letter-spacing:.15em; color:var(--gold-light); }
.ten-worlds h3 { font-size:27px; margin:10px 0; }
.ten-worlds p { font-size:12px; color:rgba(255,255,255,.65); }
.ten-worlds ol { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(10,1fr); position:relative; }
.ten-worlds ol::before { content:""; position:absolute; left:4%; right:4%; top:50%; border-top:1px solid rgba(255,255,255,.2); }
.ten-worlds li { position:relative; z-index:1; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; margin:auto; background:#30232e; border:1px solid rgba(255,255,255,.25); font-family:var(--serif); font-size:12px; color:rgba(255,255,255,.55); }
.ten-worlds li.open { background:var(--gold-light); color:var(--ink); border-color:var(--gold-light); }
.doctor-signoff { display:flex; align-items:center; gap:16px; padding-left:0; border-left:0; }
.doctor-signoff img { width:78px; height:78px; border-radius:50%; object-fit:cover; object-position:center; border:2px solid var(--gold); flex:none; }
.doctor-signoff p { font-size:11px; color:#e4a8d1; }
@media(max-width:820px) {
  .doctor { grid-template-columns:1fr; }
  .doctor-portrait { min-height:430px; }
  .doctor-portrait::after { background:linear-gradient(0deg,#0a090a,transparent 45%); }
  .ten-worlds { grid-template-columns:1fr; }
  .ten-worlds ol { grid-template-columns:repeat(10,1fr); }
}
@media(max-width:600px) {
  .cover-play { grid-template-columns:50px auto; padding:9px 16px 9px 9px; }
  .cover-play>span { width:50px; height:50px; }
  .cover-play b { font-size:10px; }
  .doctor-portrait { min-height:360px; }
  .doctor-copy { padding-inline:23px; }
  .ten-worlds { margin-inline:-15px; padding:28px 22px; }
  .ten-worlds ol { grid-template-columns:repeat(5,1fr); gap:13px 0; }
  .ten-worlds ol::before { display:none; }
}
@keyframes constellation-turn {to{transform:rotate(360deg)}}
.omega-app-preview { display:block; min-height:0; overflow:hidden; border:1px solid rgba(255,255,255,.3); border-radius:20px; background:#fffdfa; color:#211921; text-align:left; box-shadow:0 28px 65px rgba(33,12,29,.3); }
.omega-app-bar { height:44px; padding:0 18px; display:flex; align-items:center; justify-content:space-between; background:#211921; color:#fff; font-size:8px; letter-spacing:.08em; }
.omega-app-bar span { color:#d99aca; }
.omega-app-body { padding:23px 25px 19px; }
.omega-app-body small { display:block; color:#9f167d; font-size:7px; font-weight:700; letter-spacing:.13em; }
.omega-app-body>strong { display:block; margin-top:5px; font:700 41px/1 var(--serif); color:#7b195f; }
.omega-app-body>strong i { font-style:normal; color:#aa3b8b; }
.omega-app-body>span { font-size:9px; color:#766a72; }
.omega-app-body hr { border:0; border-top:1px solid #e0d6dc; margin:17px 0; }
.omega-app-body>b { display:block; margin-top:6px; font:700 30px/1 var(--serif); }
.omega-app-body p { margin:5px 0 10px; font-size:8px; color:#776d74; }
.omega-progress { height:5px; border-radius:9px; background:#e9dfe6; overflow:hidden; }
.omega-progress i { display:block; width:68%; height:100%; background:linear-gradient(90deg,#8e246f,#d1a13f); }
.omega-app-body em { display:block; margin-top:12px; padding:8px 10px; border-radius:8px; background:#f2e8ef; color:#7b195f; font-size:7px; font-style:normal; font-weight:600; }
.omega-app-preview footer { padding:11px 18px; background:#f0e9df; color:#635861; font-size:7px; line-height:1.4; }
.ticket-return { margin:10px 10px 0; text-align:center; color:#6f626b; font-size:10px; line-height:1.45; }
@media(max-width:820px) {
  .omega-app-preview { width:min(100%,430px); margin-inline:auto; }
}
@media(max-width:600px) {
  .omega-app-preview { max-width:360px; }
  .ticket-return { font-size:9px; }
}

/* ══ APRÈS LE REGARD ══════════════════════════════════════════════════════════

   Tout ce qui précède est l'extraction de la maquette. Ce qui suit vient de la
   page RENDUE et des remarques de Boris. Le bloc est séparé exprès : on doit
   pouvoir lire d'un côté ce que Codex a dessiné, de l'autre ce que l'écran a
   corrigé.

   ⚠️ CE BLOC A SURVÉCU À LA v3 SANS ÊTRE REFAIT, et c'est ce qui justifie de
   l'avoir tenu à part. La recomposition a remplacé sept sections sur seize ;
   les corrections, elles, portaient sur des RÈGLES (la colonne, les gouttières,
   une collision de nom) et non sur des sections. Elles se sont réappliquées
   telles quelles, à trois ajouts près — les nouvelles sections pleine largeur.
   ═════════════════════════════════════════════════════════════════════════════ */

/* ── 0. UNE RÉGRESSION QUE J'AVAIS INTRODUITE ────────────────────────────────
   Mon extraction écarte les règles `html` avec le reste de la coque. Or la
   maquette en pose UNE qui n'est pas de la coque : le décalage des ancres.
   Vérifié sur la page publiée — `scroll-padding-top: auto`, et un saut vers
   `#prix` atterrissait SOUS les deux barres collantes, 126 px de contenu
   masqués. Les liens de la sous-navigation étaient donc tous fautifs.

   ⚠️ La leçon : « les règles de base sont à la coque » est vrai pour `body`,
   faux pour tout ce que `html` porte. Un filtre par NOM DE BALISE ne distingue
   pas une remise à zéro d'un réglage de page. */
html { scroll-padding-top: calc(var(--site-header-height) + var(--festival-nav-height) + 20px); }

/* ── 1. LA SOUS-NAVIGATION : TROP PETITE SUR GRAND ÉCRAN (Boris) ─────────────
   Mesuré : liens et CTA à 10 px, date à 9. La barre du SITE, juste au-dessus,
   pose ses liens à 11 px et son bouton à 13 — la sous-navigation était donc
   plus petite que sa mère, ce qui se lit comme un défaut avant de se lire comme
   une hiérarchie. Bornée à ≥ 821 px : en dessous la barre se réduit déjà. */
@media (min-width: 821px) {
  .festival-nav-title span { font-size: 10px; }
  .festival-nav-title b { font-size: 15px; }
  .festival-nav > div { gap: 30px; }
  .festival-nav > div a { font-size: 12px; }
  .festival-nav-cta { font-size: 12px; }
}

/* ── 2 ET 3. LE CONTENU DANS LA COLONNE DU SITE (Boris) ──────────────────────

   ⚠️ BORNÉ À ≥ 821 px, ET C'EST UNE CORRECTION D'APRÈS COUP. Ces deux sections
   ont d'abord été écrites sans borne, en fin de fichier, et elles écrasaient en
   silence les valeurs que la maquette pose EXPLICITEMENT pour le téléphone. Le
   §6 portait déjà l'avertissement ; je ne l'avais pas appliqué ici.

   Le défaut le plus visible, signalé par Boris : le fond de `.fit`. La bascule
   crème/encre est un dégradé HORIZONTAL, juste quand les colonnes sont côte à
   côte, faux dès que la maquette les empile — chaque bloc se retrouvait moitié
   sur le crème, moitié sur l'encre. Et pour `.day-polarities`, la réponse était
   DÉJÀ dans la feuille de Codex : `.light-day` et `.shadow-night` y passent en
   `0deg` sous 821 px, verticalement. Mon `background: none` annulait sa
   correction pour lui substituer mon défaut.

   ⚠️ LES CINQ AUTRES NE SE VOYAIENT PAS, ET ÉTAIENT LÀ. Mesuré à 376 px avant
   correction : `.doctor-copy` et `.pz-explainer > div` à 40 px du bord gauche
   pour 15 à droite, `.hero-copy` et `.pioneers-copy` l'inverse — 14 contre 41.
   La maquette leur donne `padding: 65px 24px`, symétrique ; mes règles n'en
   remplaçaient que la moitié horizontale. Un texte décentré de 26 px ne crie pas
   comme un fond coupé en deux : sans la mesure, ces quatre-là partaient en ligne.

   ⚠️ CE QUI RESTE HORS BORNE, ET POURQUOI : le §0 (décalage des ancres) et le §5
   (les fuites du site). Ces deux-là réparent des règles qui s'appliquent à TOUTE
   largeur — `.hero-copy { width: min(720px, 62%) }` mord aussi sur téléphone. Les
   borner rouvrirait le défaut là où il fait le plus de mal.

   ── CE QUE LES RÈGLES CI-DESSOUS FONT ───────────────────────────────────────

   §2 : les FONDS restent pleine largeur, les CONTENUS rentrent. C'est la règle du
   site, pas une exception : `.site-header` fait déjà exactement cela.

   §3 : la maquette donne à CHAQUE colonne la gouttière de PAGE sur ses DEUX
   bords, y compris le bord intérieur. Elle se double donc au centre. Mesuré sur
   `.fit` à 1600 px : 210 px par bord, 373 px de texte, 420 px de vide au milieu ;
   à 1920 px, 370 px de gouttière pour 220 px de texte. Le bloc ne se dégradait
   pas, il se vidait. Le dégradé unique remplace les fonds de colonne : les
   moitiés colorées restent pleine largeur, le texte rentre, et l'espacement
   enjambe la bascule symétriquement — aucun texte ne passe de l'autre côté. */
@media (min-width: 821px) {
  .hero,
  .doctor,
  .fit,
  .pz-explainer,
  .pioneers,
  .day-polarities {
    --gouttiere-page: max(var(--site-gouttiere, 20px), calc((100% - var(--site-largeur, 1180px)) / 2));
  }
  .hero { padding-inline: var(--gouttiere-page); }
  .hero-copy { padding-inline: 0 clamp(26px, 3vw, 58px); }
  .doctor { padding-inline: var(--gouttiere-page); }
  .doctor-copy { padding-inline: clamp(26px, 3vw, 58px) 0; max-width: none; }
  /* ⚠️ `.section-heading` est CENTRÉE, pas décalée : `max-width: 850px` sur un
     `.shell` plus le `margin: 0 auto` du shell la ramènent au milieu. C'est la
     LARGEUR qu'il faut rendre au shell, et borner le texte à l'intérieur — le
     premier remède, `margin-inline: 0 auto`, collait le titre au bord. */
  .section-heading { max-width: none; }
  .section-heading > * { max-width: 850px; }

  /* Les deux sections illustrées de la v3, même traitement. */
  .pz-explainer { padding-inline: var(--gouttiere-page); }
  .pz-explainer > div { padding-inline: clamp(26px, 3vw, 58px) 0; }
  .pioneers { padding-inline: var(--gouttiere-page); }
  /* ⚠️ `.pioneers-copy` portait la gouttière de PAGE à gauche, en `100vw`. Le
     même piège que `.doctor` : une mesure en `vw` cesse d'être juste dès que son
     bloc entre dans un conteneur. La page la lui donne maintenant. */
  .pioneers-copy { padding-inline: 0 clamp(26px, 3vw, 58px); }

  .fit {
    padding-inline: var(--gouttiere-page);
    gap: clamp(34px, 4vw, 70px);
    background: linear-gradient(90deg, #eadfcd 0 50%, #24111f 50%);
  }
  .fit-column { padding-inline: 0; }
  .fit-yes,
  .fit-no { background: none; }

  /* ⚠️ `.day-polarities` a le même défaut, hérité du même patron — mais son fond
     est une IMAGE que les deux dégradés voilent. Les remonter sur la section
     demande de les écrire en un seul, la bascule au milieu. */
  .day-polarities {
    padding-inline: var(--gouttiere-page);
    column-gap: clamp(34px, 4vw, 70px);
    background:
      linear-gradient(90deg,
        rgba(244,232,211,.96) 0%, rgba(244,232,211,.68) 50%,
        rgba(17,11,16,.55) 50%, rgba(17,11,16,.94) 100%),
      url("/site/assets/festival/festival-shadow.webp") center / cover;
  }
  .day-polarities article { padding-inline: 0; background: none; }
}

/* ── 4. LA COUVERTURE ENTRE 821 ET 1200 px ──────────────────────────────────
   ⚠️ 46/54 DEPUIS QUE LA COVER PORTRAIT EXISTE. J'avais mis 56/44 pour sauver
   le titre, quand la seule image disponible était en 1,78 et que la colonne
   d'image ne servait qu'à porter un flou. Mesuré depuis : sur toute cette bande
   le cadre reste PORTRAIT — 0,57 à 830 px, 0,84 à 1190 — donc c'est bien
   l'image portrait qui y sert, et elle mérite la place.

   ⚠️ ET L'ÉLARGISSEMENT NE COÛTE RIEN AU TITRE, mesuré aux deux bouts : cinq
   lignes en 46/54 comme en 54/46. Les six lignes de un à deux mots du départ
   venaient du §5, pas de la proportion. */
@media (min-width: 821px) and (max-width: 1200px) {
  .hero { grid-template-columns: 46% 54%; }
  .hero-date { margin-bottom: 20px; }
}

/* ── 5. ⚠️ DEUX PROPRIÉTÉS QUE LE SITE IMPOSE SANS QUE RIEN NE L'ÉCRASE ──────

   ⚠️ UNE COLLISION NE SE RÈGLE PAS AU NOM, ELLE SE RÈGLE PROPRIÉTÉ PAR
   PROPRIÉTÉ. Une propriété que le site déclare et que la maquette ne déclare
   PAS traverse : rien ne l'écrase, et elle gouverne.

   Le site pose `.hero-copy { width: min(720px, 62%) }` pour SON accueil ; la
   maquette n'en pose aucune — son hero est une grille, la colonne suffit. La
   règle du site s'appliquait donc au Festival : 62 % de 529 = 328 px, exactement
   la colonne mesurée. Le titre sur six lignes n'était pas un défaut de
   proportion, c'était un mot du site prononcé dans une page qui ne le lui avait
   pas demandé.

   `.button` ne laisse passer qu'une bordure de 1 px, `.button-gold` couvrant le
   reste. Le banc garde le balayage complet, à chaque passage. */
.hero-copy { width: auto; }
.button { border: 0; }

/* ── 6. LE BLOC DU DOCTEUR, ET LES GRANDS TITRES (Boris) ─────────────────────
   ⚠️ `.doctor { grid-template-columns: minmax(320px, 38vw) 1fr }` : `38vw` se
   mesure sur LA FENÊTRE. Rentré dans la colonne, le portrait gardait ses 38 vw
   dans un conteneur plus étroit — 45 % de lui. Mesuré à 1400 px : portrait
   532 px, texte 648, hauteur 1 344. Après : 401, 779, 805.

   Les grands titres : le `h1` du hero était à 65,8 px et les `h2` à 66 — donc
   PLUS GROS que lui. Réduire le seul h1 n'aurait presque rien changé à l'écran
   et aurait creusé l'inversion. Le h1 arrive à la valeur des h1 du reste du
   site.

   ⚠️ BORNÉ À ≥ 821 px : la feuille de Codex pose des valeurs EXPLICITES pour le
   téléphone (`.hero h1` à 37 px, `.doctor` en une colonne). Une règle ajoutée en
   fin de fichier sans borne les écraserait en silence — essayé, mesuré : le
   portrait passait à 280 px sur un écran de 376. */
@media (min-width: 821px) {
  .doctor { grid-template-columns: minmax(280px, 34%) 1fr; }
  .doctor blockquote { font-size: clamp(32px, 3.5vw, 50px); }
  .doctor-copy > p:not(.eyebrow) { font-size: clamp(17px, 1.6vw, 23px); }
  .doctor-copy > strong { font-size: 28px; }
  .hero h1 { font-size: clamp(38px, 4.1vw, 58px); }
  h2 { font-size: clamp(33px, 4.2vw, 56px); }
}

/* ── 7. UNE MARGE NÉGATIVE ÉCRITE EN DUR CONTRE UNE GOUTTIÈRE QUI VARIE ──────
   Trouvé par le portable, reproduit ici avant d'y toucher. `.ten-worlds` et
   `.booking-form` débordent : mesuré à 375 px, boîte [-1, 376] pour un `.shell`
   de [14, 361]. La maquette leur donne `margin-inline: -15px` pour les faire
   saigner jusqu'au bord — juste quand la gouttière vaut 15, faux partout
   ailleurs. Le site en pose 14 sous 560 px (depuis #147) et 20 au-dessus : un
   pixel de trop de chaque côté d'un côté du palier, cinq de trop peu de l'autre.

   ⚠️ ET MON PROPRE CONTRÔLE DE DÉBORDEMENT NE POUVAIT PAS LE VOIR :
   `scrollWidth - innerWidth` valait 0, les deux mesurant 376 dans une fenêtre
   émulée à 375. Une soustraction entre deux nombres issus de la même erreur
   d'arrondi ne borne rien. Ce sont les BOÎTES comparées entre elles qui l'ont
   montré — 377 dans 347.

   ⚠️ ON NE RECALE PAS LA VALEUR, ON LA RELIE. Écrire `-14px` réparerait ce
   palier-ci et rouvrirait le défaut au prochain changement de gouttière. Le
   repli garde le chiffre de Codex si la variable venait à manquer. */
@media (max-width: 600px) {
  .ten-worlds,
  .booking-form { margin-inline: calc(-1 * var(--site-gouttiere, 15px)); }
}

/* ── 8. LA HIÉRARCHIE DES TITRES, ACHEVÉE ────────────────────────────────────
   ⚠️ LE §6 N'AVAIT ATTRAPÉ QUE QUATRE h2 SUR TREIZE, et personne ne l'a vu
   pendant trois jours. Il posait `h2 { clamp(33px, 4.2vw, 56px) }` — mais ce
   sélecteur NU est le plus faible de la feuille : les onze sections qui portent
   un sélecteur propre (`.after h2`, `.departure-heading h2`…) lui échappent par
   spécificité, et gardaient les valeurs de la maquette.

   Mesuré en production le 9 septembre, à 1440 px : le `h1` du hero rend 58, et
   NEUF h2 le dépassent — 95, 74, 72, 72, 72, 70, 68, 68, 64. Quatre seulement
   respectaient la hiérarchie que le §6 croyait avoir posée. Le titre principal
   de la page était le dixième plus gros texte qu'elle affiche.

   ⚠️ ET LE SIGNALEMENT REÇU EN NOMMAIT DEUX. Le portable avait relevé `.after`
   (64) et `.final-call` (95) « quand les autres sont à 56 » : la comparaison
   portait sur les quatre h2 nus, pas sur l'étendue réelle. `.after` n'était pas
   une exception, il était le plus SAGE des neuf.

   ⓘ ON PLAFONNE, ON NE REMPLACE PAS. Chaque section garde son plancher et sa
   pente en `vw` — la fluidité voulue par Codex est intacte, seul le sommet
   descend à 56. Écraser les huit par le clamp du §6 aurait fait tomber
   `.departure-heading` de 45 à 34 px autour de 821 px, là où la maquette la
   veut grande.

   ⚠️ `.final-grid h2` EST EXEMPTÉ, ET BORIS L'A TRANCHÉ DEUX FOIS : « garde la
   chute », le 9 septembre 2026 — puis de nouveau le 10, APRÈS qu'une consigne
   contraire (« aligne final call ») lui eut été rapportée par le poste fixe.
   Les deux agents se sont arrêtés plutôt que de choisir entre les deux
   messages ; c'est la seconde réponse qui fait foi, et elle dit la même chose
   que la première. Ses 95 px ferment la page sur « Il a besoin de
   joueurs. » — c'est une chute, pas un titre de section. La ramener à 56
   rendrait la hiérarchie parfaite et la page muette.

   ⚠️ CE N'EST DONC PLUS UNE QUESTION OUVERTE : c'est une décision, et une passe
   future qui « corrigerait » ce dernier dépassement défera un arbitrage. Le
   §9 ter de `verifier_festival_inscription` l'assert dans les deux sens — un
   seul h2 dépasse le h1, et c'est celui-là.

   ⚠️ BORNÉ À ≥ 821 px, pour la raison exacte du §6 : la feuille de Codex pose
   des valeurs EXPLICITES sous 600 px (`.faq h2` 37, `.place-opens h2` 36,
   `.final-grid h2` 57…). Une règle sans borne les écraserait en silence. */
@media (min-width: 821px) {
  .festival-intro-title h2 { font-size: clamp(42px, 5.3vw, 56px); }
  .pz-explainer h2         { font-size: clamp(42px, 5vw,   56px); }
  .pioneers-copy h2        { font-size: clamp(42px, 5vw,   56px); }
  .decisive-copy h2        { font-size: clamp(45px, 5vw,   56px); }
  .day-heading h2          { font-size: clamp(45px, 5.4vw, 56px); }
  .departure-heading h2    { font-size: clamp(45px, 5.5vw, 56px); }
  .omega-answer h2         { font-size: clamp(45px, 5.4vw, 56px); }
  .after h2                { font-size: clamp(38px, 5vw,   56px); }
}

/* ─────────────────────────────────────────────────────────────────────────────
   AJOUTS PROPRES À L'ARCHIVE — ils n'existent que dans cette feuille figée.
   La feuille vivante (`/site/festival.css`) ne les porte pas et ne doit pas les
   porter : ce sont les deux blocs que l'archive AJOUTE à la page d'origine, le
   bandeau qui dit ce qu'on regarde et le formulaire retiré.
   ───────────────────────────────────────────────────────────────────────────── */
.archive-bandeau {
  padding: 14px 24px;
  background: var(--violet, #8f246f);
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
}
.archive-bandeau strong { font-weight: 700; }
.archive-bandeau a { margin-left: 10px; color: var(--gold, #e7c272); font-weight: 600; white-space: nowrap; }

[data-archive-inerte] {
  padding: 28px 30px;
  border: 1px dashed rgba(255, 255, 255, .28);
  border-radius: 10px;
  background: rgba(0, 0, 0, .18);
}
[data-archive-inerte] p { margin: 0 0 14px; font-size: 15px; line-height: 1.6; }
[data-archive-inerte] p:last-child { margin-bottom: 0; }
.archive-inerte-titre { font-weight: 700; }