/* =====================================================================
   LABORATOIRE — feuille de style de la version commerciale
   Écrite pour Laboratoire, composant par composant, à partir du rendu validé
   (mesures relevées sur la version de référence). Aucune règle copiée d'un autre site.
   Unité de base : 1rem = 1/144 de la largeur d'écran (grille de 12 colonnes).
   ===================================================================== */

/* ---------- Jetons ---------- */
:root{
  --papier:#ECE9E1;
  --papier-fonce:#DFDBD0;
  --encre:#141412;
  --orange:#FF4A1C;
  --gris:#6B675F;
  --filet:rgba(20,20,18,.5);
  --t-titre:"Big Shoulders Display",Impact,sans-serif;
  --t-texte:"Newsreader",Georgia,serif;
  --t-ui:"Inter Tight",Helvetica,Arial,sans-serif;
  --t-italique:"Instrument Serif",Georgia,serif;
  /* grille : 12 colonnes, marges et gouttières égales */
  --marge:1rem;--gout:1rem;
  --col:calc((100vw - 2 * var(--marge) - 11 * var(--gout)) / 12);
  /* courbes Laboratoire */
  --sortie:cubic-bezier(.2,.9,.25,1);      /* arrivée longue et douce */
  --vif:cubic-bezier(.45,.9,.6,1);         /* départ court */
  --balai:cubic-bezier(.3,.95,.25,1);      /* soulignés */
  --d-ligne:1.5s;
}

/* ---------- Socle ---------- */
*,*::before,*::after{box-sizing:border-box}
html{font-size:calc(100vw / 144);-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}
body,h1,h2,h3,p,ul,ol,figure,blockquote{margin:0;padding:0}
h1,h2,h3,p,b,strong,i,em,small,u,label,figcaption,button,input,select,textarea,blockquote,li{font:inherit}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
button,input,select,textarea{display:block;color:inherit;background:none;border:0;padding:0;border-radius:0}
button{cursor:pointer}
img,svg,canvas,video{display:block}
img{width:100%;height:auto}
body{background:var(--papier);color:var(--encre);font-family:var(--t-ui);font-size:1.1rem;line-height:1.2;letter-spacing:-.01em;overflow-x:hidden}
.masque-lecteur{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.attenue{color:var(--gris)}
.orange{color:var(--orange)}
.it{font-family:var(--t-italique);font-style:italic;font-weight:400;text-transform:none;letter-spacing:-.02em}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.evitement{position:fixed;left:1rem;top:-5rem;z-index:100;background:var(--encre);color:var(--papier);padding:.6rem 1rem}
.evitement:focus{top:1rem}

/* lignes qui montent depuis un masque */
.masque{display:block;overflow:hidden;margin-inline:-1px;padding-inline:1px}
.masque__ligne{display:block;transform:translateY(103%);transition:transform var(--d-ligne) var(--sortie)}
.pret .masque__ligne,.calme .masque__ligne{transform:none}

/* soulignés qui se retirent au survol */
.lien-trait{position:relative;display:inline-block}
.trait{position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:left;transition:transform .65s var(--balai)}
.lien-trait:hover .trait,.lien-trait:focus-visible .trait{transform:scaleX(0);transform-origin:right}

/* barre de chargement */
.chargement{position:fixed;inset:0 0 auto;height:2.5px;z-index:99;overflow:hidden;pointer-events:none;transition:opacity .4s}
.chargement div{height:100%;background:var(--orange);transform:translateX(-101%);transition:transform 1s cubic-bezier(.7,0,.25,1)}

/* ---------- Bandeau du haut ---------- */
.bandeau{position:fixed;z-index:90;top:var(--marge);left:var(--marge);right:var(--marge);display:flex;justify-content:space-between;align-items:flex-start;color:#fff;mix-blend-mode:difference;pointer-events:none}
.bandeau a{pointer-events:auto}
.bandeau__nom{overflow:hidden;max-width:calc(2 * var(--col) + 2 * var(--gout));padding-top:.15em;font:800 5.2rem/.95 var(--t-titre);text-transform:uppercase;letter-spacing:-.01em;transition:font-size .8s var(--sortie)}
.bandeau__nom span{display:block;transform:translateY(120%);transition:transform var(--d-ligne) var(--sortie)}
.bandeau.reduit .bandeau__nom{font-size:2.2rem}
.bandeau__droite{display:flex;align-items:flex-start;gap:var(--gout)}
.bandeau__droite>*{width:var(--col);overflow:hidden}
.bandeau__menu{display:flex;flex-wrap:wrap}
.bandeau__menu a,.bandeau__heure span,.bandeau__contact a{display:inline-block;transform:translateY(110%);transition:transform var(--d-ligne) var(--sortie)}
.bandeau__menu a{height:1.2lh;line-height:1}
.bandeau__menu a:not(:last-child)::after{content:", "}
.bandeau__menu a span{position:relative}
.bandeau__menu a span::before{content:"";position:absolute;left:0;right:0;bottom:0;height:.1rem;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .7s var(--balai)}
.bandeau__menu a.actif span::before,.bandeau__menu a:hover span::before,.bandeau__menu a:focus-visible span::before{transform:none;transform-origin:left}
.bandeau__contact{text-align:right}
.pret .bandeau__nom span,.pret .bandeau__menu a,.pret .bandeau__heure span,.pret .bandeau__contact a,
.calme .bandeau__nom span,.calme .bandeau__menu a,.calme .bandeau__heure span,.calme .bandeau__contact a{transform:none}
/* entrée en cascade : nom, menu, heure, contact */
.bandeau__menu a{transition-delay:.06s}.bandeau__heure span{transition-delay:.12s}.bandeau__contact a{transition-delay:.18s}

/* ---------- Index des essais ---------- */
.presentation{position:absolute;z-index:90;top:5rem;right:calc(1 * var(--col) + 3 * var(--gout));width:calc(2 * var(--col))}
.presentation__texte{margin-bottom:1.3rem}
[data-vue-active=grille] .presentation,[data-vue-active=liste] .presentation{display:none}
.vue[hidden]{display:none}
.vues{position:fixed;z-index:80;left:var(--gout);bottom:var(--gout);display:flex;gap:.3em;color:#fff;mix-blend-mode:difference}
.vues button{position:relative;font-size:1.1rem}
.vues button:not(:last-child)::after{content:","}
.vues button::before{content:"";position:absolute;left:0;bottom:0;width:calc(100% - .3em);height:1.34px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .7s var(--sortie)}
.vues button:last-child::before{width:100%}
.vues button[aria-pressed=true]::before,.vues button:hover::before{transform:none;transform-origin:left}
.index__mention{position:fixed;z-index:80;right:var(--gout);bottom:var(--gout);color:var(--gris)}
.bascule-mouvement--texte{display:inline;text-decoration:underline}

/* vue verticale : une scène collante parcourue par le défilement de la page */
.colonne{position:relative;height:calc(100svh + var(--n) * 70svh)}
.colonne__arret{position:absolute;left:0;width:1px;height:1px;top:calc(var(--k) * var(--n) * 70svh / (var(--n) - 1));scroll-snap-align:start}
html:has(.colonne:not([hidden])){scroll-snap-type:y proximity}
.colonne__scene{position:sticky;top:0;height:100svh;overflow:hidden}
.colonne__titres{position:absolute;z-index:2;top:50%;left:var(--gout);width:calc(2 * var(--col) + 1 * var(--gout));height:25.25rem;overflow:hidden;translate:0 -50%}
.colonne__titres>div{display:flex;flex-direction:column;align-items:flex-start;will-change:transform}
.colonne__titres a{opacity:.21;transition:opacity .45s}
.colonne__titres a.actif,.colonne__titres a:hover,.colonne__titres a:focus-visible{opacity:1}
.colonne__meta{position:absolute;z-index:2;top:50%;left:calc(2 * var(--col) + 3 * var(--gout));width:calc(10 * var(--col) + 9 * var(--gout));height:1lh;translate:0 -50%;pointer-events:none}
.colonne__meta p{position:absolute;inset:0;display:grid;grid-template-columns:calc(7 * var(--col) + 7 * var(--gout)) calc(2 * var(--col) + 2 * var(--gout)) var(--col);opacity:0;transition:opacity .3s}
.colonne__meta p.actif{opacity:1}
.colonne__meta span:last-child{text-align:right}
.colonne__images{position:absolute;top:0;left:50%;width:calc(2 * var(--col) + 1 * var(--gout));translate:-50% 0;display:flex;flex-direction:column;gap:.5rem;will-change:transform}
.colonne__images img{aspect-ratio:4/5;object-fit:cover;filter:grayscale(1);opacity:.7;transition:filter .8s var(--sortie),opacity .8s var(--sortie)}
.colonne__images a.actif img{filter:none;opacity:1}
.colonne__cadre{position:absolute;z-index:3;top:50%;left:50%;width:calc(calc(2 * var(--col) + 1 * var(--gout)) + 7rem);height:calc(calc(2 * var(--col) + 1 * var(--gout)) * 1.25 + 2rem);translate:-50% -50%;pointer-events:none}
.colonne__cadre::before,.colonne__cadre::after{content:"";position:absolute;top:0;bottom:0;width:2.6rem;border:.15rem solid var(--encre)}
.colonne__cadre::before{left:0;border-right:0;border-radius:2.6rem 0 0 2.6rem}
.colonne__cadre::after{right:0;border-left:0;border-radius:0 2.6rem 2.6rem 0}
.colonne__aide{position:absolute;bottom:5rem;left:calc(9 * var(--col) + 10 * var(--gout));width:calc(3 * var(--col) + 2 * var(--gout));color:var(--gris)}

/* vue en grille + aperçu central */
.grille__plan{display:grid;grid-template-columns:repeat(12,var(--col));gap:8rem var(--gout);padding:11rem var(--gout) 14rem}
.grille__case{position:relative}
.grille__num{display:block;margin-bottom:.4rem;color:var(--gris)}
.grille__vignette{position:relative;display:block}
.grille__vignette img{filter:grayscale(1);opacity:.55;transition:opacity .5s,filter .5s}
.grille__vignette::after{content:"";position:absolute;inset:.1rem;z-index:1;border:.1rem solid rgba(0,0,0,.1);opacity:0}
.grille__vignette.survol::after{opacity:1}
.grille__vignette.survol img{opacity:.15}
.grille__legende.legende{display:none}
.apercu>*{position:fixed;z-index:5;pointer-events:none}
.apercu__image{top:50%;left:50%;width:calc(2 * var(--col) + 1 * var(--gout));translate:-50% -50%;overflow:hidden;clip-path:inset(50%);transition:clip-path .8s var(--sortie)}
.apercu__image img{aspect-ratio:4/5;object-fit:cover;scale:1.15;transition:scale 1.6s var(--sortie)}
.apercu__titre{bottom:0;left:50%;translate:-50% 0;overflow:hidden;white-space:nowrap;text-align:center;font:800 14rem/.85 var(--t-titre);text-transform:uppercase;letter-spacing:-.03em}
.apercu__meta{top:50%;left:var(--gout);right:var(--gout);translate:0 -50%;display:flex;gap:var(--gout)}
.apercu__meta>span{overflow:hidden}
.apercu__meta>span:nth-child(-n+2){width:calc(2 * var(--col) + 1 * var(--gout))}
.apercu__meta>span:nth-child(3){margin-left:calc(5 * var(--col) + 5 * var(--gout))}
.apercu__meta>span:nth-child(4){margin-left:auto}
.apercu__titre>span,.apercu__meta>span>span{display:block;transform:translateY(110%);transition:transform .3s var(--vif)}
.apercu.visible .apercu__image{clip-path:inset(0)}
.apercu.visible .apercu__image img{scale:1}
.apercu.visible .apercu__titre>span,.apercu.visible .apercu__meta>span>span{transform:none;transition:transform 1.2s var(--sortie)}
.apercu.visible .apercu__meta>span>span{transition-delay:.06s}

/* vue en liste */
.liste{padding:14rem var(--gout) 12rem}
.liste ol{border-top:1px solid var(--filet)}
.liste a{display:grid;grid-template-columns:var(--col) calc(4 * var(--col) + 3 * var(--gout)) calc(3 * var(--col) + 2 * var(--gout)) calc(3 * var(--col) + 2 * var(--gout)) 1fr;gap:var(--gout);align-items:center;padding:1.2rem 0;border-bottom:1px solid var(--filet)}
.liste b{font:800 6rem/.9 var(--t-titre);text-transform:uppercase}
.liste img{width:var(--col);aspect-ratio:4/5;object-fit:cover;justify-self:end}
.liste a:hover b,.liste a:focus-visible b{color:var(--orange)}

/* ---------- Ouverture d'une page d'essai ---------- */
.ouverture{position:relative;height:100svh;display:flex;justify-content:space-between;align-items:center}
.ouverture__retour{position:absolute;z-index:3;left:var(--gout);bottom:var(--gout);color:var(--gris)}
.ouverture__infos{display:flex;padding-left:var(--gout)}
.ouverture__titre{width:calc(2 * var(--col) + 1 * var(--gout))}
.ouverture__titre small{display:block;color:var(--gris)}
.ouverture__meta{width:calc(3 * var(--col) + 2 * var(--gout));padding-inline:var(--marge)}
.ouverture__lire{margin-top:1.1rem}
.ouverture__galerie{position:relative;width:calc(6 * var(--col) + 6.5 * var(--gout));height:100svh;overflow:hidden}
.ouverture__galerie>div{display:flex;flex-direction:column;gap:var(--gout);padding:var(--gout) var(--gout) var(--gout) 0;will-change:transform}
.ouverture__galerie figure{position:relative}
.ouverture__galerie figcaption{position:absolute;left:var(--gout);bottom:var(--gout);color:#fff;mix-blend-mode:difference}

/* ---------- Carnet : texte à mots soulignés, images révélées ---------- */
.manifeste{position:relative;padding:5rem var(--gout) 6rem}
.manifeste__texte{width:calc(7.525 * var(--col) + 6 * var(--gout));font:300 4rem/1.18 var(--t-texte);letter-spacing:-.03em}
.manifeste__texte p+p{margin-top:.6em}
.manifeste__texte u{cursor:pointer;text-decoration-color:var(--orange);text-decoration-thickness:.06em;text-underline-offset:.12em;transition:color .3s}
.manifeste__texte u:hover,.manifeste__texte u:focus-visible,.manifeste__texte u.actif{color:var(--gris)}
.manifeste__images{position:absolute;top:5.2rem;right:var(--gout);bottom:6rem;width:calc(3 * var(--col) + 2 * var(--gout));pointer-events:none}
.manifeste__images>div{position:sticky;top:6rem}
.manifeste__images figure{position:absolute;inset:0 0 auto}
.manifeste__images img{aspect-ratio:.7706;object-fit:cover;clip-path:inset(0 0 0 100%);transition:clip-path 1s var(--sortie)}
.manifeste__images figcaption{overflow:hidden;margin-top:.8rem}
.manifeste__images figcaption span{display:block;transform:translateY(103%);transition:transform .8s var(--sortie)}
.manifeste__images figure.actif img{clip-path:inset(0)}
.manifeste__images figure.actif figcaption span{transform:none}
.fiches{display:grid;grid-template-columns:calc(2 * var(--col) + 1 * var(--gout)) calc(2 * var(--col) + 1 * var(--gout)) calc(3 * var(--col) + 1 * var(--gout));justify-content:space-between;padding:4.9rem var(--gout) 0 calc(var(--gout) + calc(3 * var(--col) + 3 * var(--gout)));gap:var(--gout)}
.fiches__col{padding-bottom:2.5rem}
.fiches h2,.coordonnees h2{color:var(--gris);margin-bottom:1.2rem}
.fiches p+p{margin-top:.8rem}
.fiches li{padding:.1rem 0}
.fiches .trait,.coordonnees .trait{transform:scaleX(0);transform-origin:right;transition:transform .7s var(--balai)}
.fiches .lien-trait:hover .trait,.fiches .lien-trait:focus-visible .trait,.coordonnees .lien-trait:hover .trait,.coordonnees .lien-trait:focus-visible .trait{transform:none;transform-origin:left}

/* ---------- Journal (accueil, bas des pages) : unité = largeur d'écran ---------- */
.journal{position:relative;font:300 2.15vw/2.5vw var(--t-texte);letter-spacing:-.02em}
.journal :is(h1,h2,h3,.manchette,.rubrique__titre,.annonce__titre,.chiffres__mot,.ovale__mot,.defilant__lien,.mot-geant,.ecrire__ligne){font-family:var(--t-titre);font-weight:800;text-transform:uppercase}
.manchette{overflow:hidden;white-space:nowrap;background:var(--encre);color:var(--papier);padding:4.5vw 1vw 2.2vw;font-size:30.6vw;line-height:.74;letter-spacing:-.025em}
.manchette--carnet{padding:3.5vw 3vw .6vw .8vw;font-size:27vw;line-height:.78}
.une{display:grid;grid-template-columns:repeat(3,1fr);gap:4vw 3vw;padding:3vw 2vw 0}
.une__case{position:relative}
.une__case--large{grid-column:1/-1}
.une__case--double{grid-column:span 2}
.une__case--filet{border-right:1px solid var(--filet);padding-right:3vw}
.une__case--cadre{border-block:1px solid var(--encre)}
.une__case--duo{display:flex}
.rubrique{position:relative}
.rubrique__titre{padding-top:1vw;line-height:.86;letter-spacing:-.01em}
.rubrique__titre--a{font-size:8.2vw}
.rubrique__titre--b{font-size:7.6vw}
.rubrique__titre--geant{font-size:14vw}
.rubrique__titre--geant2{font-size:14.7vw}
.rubrique__titre--liste{font-size:7.2vw}
.filets{position:absolute;z-index:-1;left:0;right:0;bottom:0;display:flex;flex-direction:column;justify-content:flex-end}
.filets i{position:relative;bottom:2vw;display:block;height:1px;margin-top:8vw;background:var(--encre);opacity:.3}
.filets .f-a{margin-bottom:10vw}
.filets .f-b{margin-bottom:12vw}
.duo__droite .filets{bottom:-.9vw}
.photo{display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--encre)}
.photo img{width:100%;height:100%;object-fit:cover}
.photo--haute{height:40vw}
.photo--portrait{height:35vw;margin-top:2vw}
.photo--remplit{height:100%;min-height:30vw}
.savoir-faire{position:relative;margin-top:2.5vw}
.chapo{margin-top:3vw}
.chapo--deborde{width:103%}
.lettrine{font-size:2.25vw;line-height:2.7vw}
.lettrine::first-letter{float:left;margin:.7vw 1vw 1vw 0;padding:.75vw .5vw .5vw;background:var(--encre);color:var(--papier);font:800 7vw/5vw var(--t-titre)}
.lettrine--orange::first-letter{background:var(--orange);color:var(--encre)}
.chapo__suite{margin-top:2vw;font-size:1.5vw;line-height:1.9vw}
.duo__gauche{width:65%;display:flex;flex-direction:column;justify-content:space-between;gap:3vw;padding-right:3vw;border-right:1px solid var(--encre)}
.duo__droite{width:35%;padding-left:3vw}
.tampon{position:absolute;top:-2%;right:0;width:13vw;aspect-ratio:1;display:flex;align-items:center;justify-content:center;text-align:center;border:.35vw dotted var(--orange);border-radius:50%;background:color-mix(in srgb,var(--orange) 12%,transparent);font:1vw/1.2 var(--t-ui);rotate:-12deg}
.chiffres{display:flex;justify-content:space-between;padding:3.5vw 0 3vw}
.chiffres li{display:flex;align-items:flex-start}
.chiffres__note{font-size:1.7vw;line-height:2vw;letter-spacing:-.03em}
.chiffres__mot{font-size:5vw;line-height:5vw;letter-spacing:-.02em}
.chiffres__nb{margin-left:.5vw;font:italic 400 11vw/6vw var(--t-italique);color:var(--orange)}

/* bande d'essais à défilement horizontal */
.bande{position:relative;display:flex;flex-direction:column;padding-top:3vw}
.bande--ouverture{padding-top:7.5rem}
.bande--suite{margin-top:5vw;border-top:1px solid var(--encre)}
.bande__rail{display:flex;align-items:stretch;gap:3vw;padding:0 2vw 1.2vw;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--encre) transparent;scroll-snap-type:x proximity}
.bande__rail>*{flex:none;scroll-snap-align:start;scroll-margin-left:2vw}
.carte{width:29vw}
.carte__cadre{width:28vw}
.carte__cadre{height:11vw;overflow:hidden;border:1px solid var(--encre)}
.carte__cadre img{height:100%;object-fit:cover;filter:grayscale(1);transition:filter .6s,scale 1.2s var(--sortie)}
.carte__lien:hover img,.carte__lien:focus-visible img{filter:none;scale:1.04}
.carte__titre{display:flex;align-items:center;gap:.6vw;margin-top:1vw;font:800 1.9vw/1.5vw var(--t-titre);text-transform:uppercase}
.pastille{background:var(--orange);padding:.25vw .4vw;font:500 .9vw/1 var(--t-ui);text-transform:none}
.carte__resume{max-width:95%;margin-top:1vw;font-size:1.2vw;line-height:1.5vw;letter-spacing:-.01em}
.annonce{width:29vw;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0 3vw;text-align:center;border-inline:1px solid var(--filet)}
.annonce--libre{width:auto;flex:1;align-items:flex-start;justify-content:flex-start;padding:0;border:0;text-align:left}
.annonce__titre{font-size:4.5vw;line-height:4.5vw;letter-spacing:-.03em}
.annonce__titre:hover,.annonce__titre:focus-visible{color:var(--orange)}
.annonce__texte{margin-top:1vw;font-size:2.6vw;line-height:3vw;letter-spacing:-.03em}
.annonce__astuce{display:flex;gap:.4vw;align-items:baseline;margin-top:2vw;font-size:1.2vw;line-height:1.5vw}
.annonce__astuce span{max-width:95%}
.annonce__astuce b{font:800 1.4vw/1.4vw var(--t-titre);text-transform:uppercase}
.bande__commandes{display:flex;gap:.6vw;margin-top:.6vw;padding:0 2vw}
.bande__commandes button{border:1px solid var(--encre);border-radius:2vw;padding:.3vw 1vw;font:1vw/2.5vw var(--t-ui)}
.bande__commandes button:hover{background:var(--encre);color:var(--papier)}

/* ovale d'appel : la flèche entre par la gauche */
.ovale{position:relative;overflow:hidden;width:100%;height:13vw;margin-top:3vh;display:flex;align-items:center;justify-content:center;background:var(--papier-fonce);border:1px solid var(--filet);border-radius:50%;transition:background .35s}
.ovale::before{content:"→";position:absolute;left:-8vw;font:4vw var(--t-ui);transition:left .65s var(--sortie)}
.ovale__mot{font-size:6vw;line-height:6vw;letter-spacing:-.02em;transition:translate .65s var(--sortie)}
.ovale:hover{background:var(--orange)}
.ovale:hover::before,.ovale:focus-visible::before{left:4vw}
.ovale:hover .ovale__mot,.ovale:focus-visible .ovale__mot{translate:3vw 0}
.ovale--etroit{width:42%;height:15vw}
.ovale--plein{width:100%;height:15vw}

/* pied : bandeau défilant + informations */
.pied{position:relative;padding:3vw 2vw 2vw}
.defilant{position:relative;display:flex;align-items:center;height:11vw;overflow:hidden;border-block:1px solid var(--encre)}
.defilant__piste{position:absolute;display:flex;width:300%;animation:defile 12s linear infinite}
.defilant:hover .defilant__piste,.defilant:focus-within .defilant__piste,.defilant.en-pause .defilant__piste{animation-play-state:paused}
@keyframes defile{to{transform:translateX(-33.3333%)}}
.defilant__motif{flex:none;display:flex;align-items:center;margin-right:2vw}
.defilant__phrase{white-space:nowrap;font-size:6vw;line-height:8vw;letter-spacing:-.04em}
.defilant__lien{position:relative;bottom:.4vw;margin-left:1.5vw;padding:.5vw .8vw .8vw;background:var(--encre);color:var(--papier);transition:background .3s,color .3s}
.defilant__lien span{display:block;padding-top:.5vw;white-space:nowrap;font-size:6vw;line-height:4.6vw}
.defilant__lien:hover,.defilant__lien:focus-visible{background:var(--orange);color:var(--encre)}
.defilant__pause{position:absolute;z-index:2;top:.6vw;right:2vw;padding:.2rem .5rem;background:var(--papier);border:1px solid var(--encre);border-radius:1rem;font:1rem var(--t-ui)}
.pied__infos{display:flex;justify-content:space-between;margin-top:2vw;font:1.2rem/2.5vw var(--t-ui);letter-spacing:-.01em}
.pied__groupe{display:flex;align-items:center;gap:1.2vw}
.pied__marque{font:800 1.6vw var(--t-titre);text-transform:uppercase}
.pied__lien{font:800 1.5vw/1.5vw var(--t-titre);text-transform:uppercase}
.pied__lien:hover,.pied__lien:focus-visible{color:var(--orange)}
.pied__point{font-size:2.4vw}

/* ---------- Pages d'essai : fiche, chapeau, encart ---------- */
.fiche-essai{display:flex;align-items:center;gap:2vw;padding:.8vw 3vw;font:1.2rem/1.4 var(--t-ui);letter-spacing:-.01em}
.fiche-essai__part{flex:1;display:flex;align-items:center;gap:1vw}
.fiche-essai__part--centre{flex:0 auto;justify-content:center}
.fiche-essai__part--droite{justify-content:flex-end}
.etiquette{border:1px solid var(--encre);border-radius:2vw;padding:.15vw .9vw;font:800 1.3vw var(--t-titre);text-transform:uppercase}
.chapeau{position:relative;display:flex;justify-content:space-between;align-items:center;gap:4vw;margin-top:1vw;padding:3vw 3vw 0}
.chapeau::before{content:"";position:absolute;top:0;left:2%;right:2%;height:1px;background:var(--filet)}
.chapeau__texte,.chapeau>.formulaire{width:50%}
.encart{display:flex;gap:4vw;margin:5vw 0 4vw;padding:0 2vw}
.encart__pointille{width:42vw;flex:none;padding:2.5vw 2vw 2.5vw 2.5vw;border:2px dashed var(--encre);border-radius:.6vw}
.mot-geant{padding-top:1.5vw;font-size:10.5vw;line-height:8.6vw;letter-spacing:-.01em}
.encart__question{margin-top:3vw}
.encart__image{flex:1;align-self:stretch;overflow:hidden;border:1px solid var(--encre)}
.encart__image img{height:100%;object-fit:cover}
.mention-fictif{display:inline-block;padding:.1rem .6rem;border:1px solid currentColor;border-radius:1rem;font:1rem/1.2 var(--t-ui)}
.legende{display:flex;gap:1.2rem;margin-top:.8rem;font:1.1rem/1.3 var(--t-ui);letter-spacing:-.01em}
.legende b{font-weight:500;white-space:nowrap}
.legende span{color:var(--gris)}

/* protocole : sections sur la grille de 12 colonnes */
.protocole{display:grid;grid-template-columns:repeat(12,var(--col));gap:4rem var(--gout);align-items:start;padding:8rem var(--gout) 0}
.protocole--fin{padding-bottom:8rem}
.protocole__rep{position:sticky;top:7rem;grid-column:1/span 2;color:var(--gris)}
.protocole__rep b{display:block;color:var(--encre);font-weight:500}
.protocole__texte{grid-column:3/span 6;font:300 3.2rem/1.15 var(--t-texte);letter-spacing:-.025em}
.protocole__liste{grid-column:10/span 3;font:1.6rem/1.35 var(--t-texte)}
.protocole__liste li{padding:.6rem 0;border-top:1px solid var(--filet)}
.protocole__liste b{font-weight:400}
.protocole__fig img{object-fit:cover}
.protocole__fig--plein{grid-column:1/-1}
.protocole__fig--panorama img{aspect-ratio:16/9}
.protocole__fig--g7{grid-column:1/span 7}
.protocole__fig--haute img{aspect-ratio:4/5}
.protocole__fig--large img{aspect-ratio:3/2}
.statut{display:inline-block;margin-right:.6rem;padding:.1rem .6rem;border-radius:1rem;font:1rem/1.2 var(--t-ui);vertical-align:.2em}
.statut--essai{border:1px dashed var(--encre)}
.statut--final{background:var(--encre);color:var(--papier)}
.bilan{grid-column:3/span 8;display:grid;grid-template-columns:1fr 1fr;gap:3rem;padding:3rem;border:2px dashed var(--encre);border-radius:.6vw;font:1.7rem/1.35 var(--t-texte)}
.bilan h3{margin-bottom:1rem;font:800 3rem/1 var(--t-titre);text-transform:uppercase}

/* objets codés : composeur de lettres, symbole Halo */
.composeur{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gout);width:calc(8 * var(--col) + 7 * var(--gout))}
.affiche{position:relative;aspect-ratio:2/3;overflow:hidden;background:#F4F1EA;border:1px solid var(--filet)}
.affiche svg{position:absolute;inset:0;width:100%;height:100%}
.affiche figcaption{position:absolute;left:6%;bottom:4%;font:500 clamp(.6rem,.9vw,1.2rem)/1.1 var(--t-ui);text-transform:uppercase}
.commandes{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:1.6rem;font-family:var(--t-ui)}
.commandes label{display:flex;align-items:center;gap:.6rem}
.composeur__lettre{width:12rem;padding:.4rem .8rem;border:1px solid var(--encre);font:800 1.6rem var(--t-titre);text-transform:uppercase}
.halo{width:100%;aspect-ratio:1}

/* ---------- Carnet et contact : ouvertures de page ---------- */
.ouvre-page{padding:15vh 2vw 3vw}
.ouvre-page--parcours{padding-top:8rem}
.ouvre-page__intro{position:relative;margin-top:3vw}
.ouvre-page__qui{position:absolute;top:.6vw;left:0;width:11vw;font:1.1rem/1.25 var(--t-ui);letter-spacing:0}
.ouvre-page__phrase{text-indent:13vw;font-size:6.2vw;line-height:6.6vw;letter-spacing:-.03em}
.ouvre-page__chapo{max-width:50rem;margin-top:7vh}
.pli{border-bottom:1px solid var(--encre)}
.pli__titre{width:100%;display:flex;justify-content:space-between;align-items:center;padding:2vw 2vw 2vw 0;text-align:left;font:800 4vw/1 var(--t-titre);text-transform:uppercase}
.pli__titre span:last-child{font:400 1.2rem var(--t-ui);text-transform:none}
.pli__corps{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .75s var(--sortie)}
.pli.ouvert .pli__corps{grid-template-rows:1fr}
.pli__corps>div{min-height:0}
.pli__rang{display:grid;grid-template-columns:10vw 1fr 1fr;gap:2vw;padding:1vw 0 1.4vw;font-size:1.6vw;line-height:2vw}
.pli__rang span:first-child{font:1.2rem var(--t-ui)}
.portrait-final{padding:0 2vw;margin-bottom:4vw}
.ecrire{display:flex;flex-direction:column;align-items:flex-start}
.ecrire br{display:none}
.ecrire__ligne{display:inline-block;padding:2.5vh 1.5vh 1vh 1vh;background:var(--encre);color:var(--papier);font-size:24vh;line-height:17vh;letter-spacing:-.01em}
.ecrire__ligne--bas{margin-top:1.5vh;padding-bottom:.4vh}
.chapeau--contact{align-items:center}
.coordonnees{flex:1;align-self:stretch;display:flex;flex-direction:column;gap:2vw}
.coordonnees__grille{display:grid;grid-template-columns:1fr 1fr;gap:2rem;font:1.3rem/1.4 var(--t-ui);letter-spacing:0}
.coordonnees .bouton{margin-top:1rem}
.coordonnees .attenue{margin-top:.6rem}
.respiration{height:6vw}

/* ---------- Boutons et formulaire ---------- */
.bouton{display:inline-flex;align-items:center;gap:.6rem;padding:.6rem 1.4rem;border:1px solid var(--encre);border-radius:3rem;font:1.3rem/1.2 var(--t-ui);transition:background .3s,color .3s,border-color .3s}
.bouton:hover,.bouton:focus-visible{background:var(--encre);color:var(--papier)}
.bouton--orange{background:var(--orange);border-color:var(--orange)}
.formulaire{display:grid;gap:1.6rem;font:1.1rem/1.4 var(--t-ui);letter-spacing:-.01em}
.formulaire label{display:grid;gap:.4rem;color:var(--gris)}
.formulaire :is(input,textarea,select){width:100%;padding:.6rem 0;border-bottom:1px solid var(--encre);color:var(--encre);font:2.4rem/1.4 var(--t-texte)}
.formulaire textarea{min-height:12rem;resize:vertical}
.formulaire__note{max-width:40rem;color:var(--gris)}

/* ---------- Mouvements réduits ---------- */
.calme *,.calme *::before,.calme *::after{transition-duration:0s!important;animation:none!important}
.calme .defilant__piste{position:static;width:auto;transform:none}
.calme .defilant__motif{width:100%;justify-content:space-between;margin:0;padding:0 1vw}
.calme .defilant__motif~.defilant__motif,.calme .defilant__pause{display:none}
.calme .defilant__phrase{font-size:4.4vw}
.calme .defilant__lien span{font-size:4.6vw}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---------- Écrans moyens ---------- */
@media (max-width:991px){
  html{font-size:1.1vw}
  .carte__resume{font-size:1.7vw;line-height:2vw}
}

/* ---------- Téléphones ---------- */
@media (max-width:700px){
  html{font-size:2.6vw}
  :root{--marge:4vw;--gout:3vw;--col:calc((100vw - 2 * var(--marge) - 3 * var(--gout)) / 4)}
  .bandeau{flex-direction:column;gap:.8rem}
  .bandeau__nom,.bandeau.reduit .bandeau__nom{max-width:none;font-size:4.4rem}
  .bandeau__droite{width:100%;justify-content:space-between}
  .bandeau__droite>*{width:auto}
  .bandeau__heure{display:none}
  .presentation{position:relative;top:auto;right:auto;width:auto;padding:12rem var(--marge) 0}
  .journal{font-size:4.6vw;line-height:5.4vw}
  .une{grid-template-columns:1fr;padding:0 4vw}
  .une__case--double{grid-column:auto}
  .une__case--filet{border-right:0;padding-right:0}
  .une__case--duo{flex-direction:column}
  .manchette{font-size:30vw}
  .manchette--carnet{font-size:24vw}
  .rubrique__titre--a,.rubrique__titre--b{font-size:20vw}
  .rubrique__titre--geant,.rubrique__titre--geant2{font-size:34vw}
  .rubrique__titre--liste{font-size:12.5vw}
  .photo--haute,.photo--portrait{height:70vw}
  .lettrine{font-size:6vw;line-height:7.5vw}
  .lettrine::first-letter{font-size:20vw;line-height:17vw;padding:1.5vw .8vw .5vw 1vw}
  .chapo__suite{font-size:4.4vw;line-height:5.6vw}
  .duo__gauche,.duo__droite{width:100%;border:0;padding:0}
  .chiffres{flex-wrap:wrap;gap:6vw}
  .chiffres li{width:44%}
  .chiffres__note{font-size:4vw;line-height:4.6vw}
  .chiffres__mot{font-size:9vw;line-height:9vw}
  .chiffres__nb{font-size:22vw;line-height:13vw}
  .tampon{top:-6vw;width:28vw;font-size:2.6vw}
  .bande--ouverture{padding-top:13rem}
  .carte,.annonce,.carte__cadre{width:78vw}
  .carte__cadre{height:44vw}
  .carte__titre{font-size:6vw;line-height:5vw}
  .carte__resume{font-size:4.2vw;line-height:5vw}
  .pastille{font-size:2.8vw}
  .annonce__titre{font-size:13vw;line-height:12vw}
  .annonce__texte{font-size:6vw;line-height:7vw}
  .annonce__astuce,.annonce__astuce b{font-size:3.6vw;line-height:4vw}
  .bande__commandes button{font-size:3.4vw;padding:1vw 3vw}
  .ovale,.ovale--etroit,.ovale--plein{width:100%;height:28vw}
  .ovale__mot{font-size:13vw;line-height:12vw}
  .defilant{height:22vw}
  .defilant__piste{width:800%}
  .defilant__phrase{font-size:12vw;line-height:11vw}
  .defilant__lien span{font-size:14vw;line-height:13vw}
  .pied__infos{flex-direction:column;gap:3vw;font-size:3.4vw}
  .pied__marque,.pied__lien{font-size:4.6vw;line-height:5vw}
  .chapeau,.encart{flex-direction:column;padding:4vw}
  .chapeau__texte,.chapeau>.formulaire,.encart__pointille{width:100%}
  .fiche-essai{flex-wrap:wrap;padding:3vw 4vw;font-size:3.2vw}
  .etiquette{font-size:4vw}
  .mot-geant{font-size:40vw;line-height:28vw}
  .ecrire__ligne{font-size:30vw;line-height:23vw}
  .ouvre-page__phrase{text-indent:0;font-size:10vw;line-height:10.6vw}
  .ouvre-page__qui{position:static;width:auto;margin-bottom:3vw}
  .pli__titre{font-size:9vw}
  .pli__rang{grid-template-columns:1fr;gap:1vw;font-size:4.4vw;line-height:5.4vw}
  .colonne__titres{top:auto;bottom:16rem;height:13rem;translate:none}
  .colonne__meta{left:var(--gout);width:calc(100vw - 2 * var(--gout));top:auto;bottom:11rem;translate:none}
  .colonne__meta p{grid-template-columns:45% 40% 15%}
  .colonne__images{width:56vw}
  .colonne__cadre{width:72vw;height:calc(56vw * 1.25 + 4vw)}
  .colonne__aide{display:none}
  .grille__plan{grid-template-columns:repeat(4,1fr);gap:3rem var(--gout)}
  .grille__case{grid-row:auto!important;grid-column:span 2!important}
  .apercu{display:none}
  .grille__vignette img{filter:none;opacity:1}
  .grille__legende.legende{display:flex;flex-direction:column;gap:0;margin-top:.6rem}
  .liste a{grid-template-columns:3rem 1fr 7rem;row-gap:.2rem}
  .liste a span:nth-child(3),.liste a span:nth-child(4){grid-column:2}
  .liste img{grid-row:1/span 3;grid-column:3;width:7rem}
  .liste b{font-size:9rem}
  .index__mention{position:static;padding:0 var(--gout) 6rem}
  .ouverture{flex-direction:column;height:auto;padding-top:14rem}
  .ouverture__infos{flex-direction:column;gap:2rem;padding:0 var(--gout)}
  .ouverture__titre,.ouverture__meta{width:auto;padding:0}
  .ouverture__galerie{width:100%;height:auto;margin-top:3rem}
  .ouverture__galerie>div{padding:0 var(--gout)}
  .ouverture__retour{position:static;align-self:flex-start;margin:2rem var(--gout)}
  .protocole{grid-template-columns:1fr;gap:2.4rem;padding:5rem var(--gout) 0}
  .protocole>*{grid-column:1/-1!important}
  .protocole__rep{position:static}
  .protocole__texte{font-size:2.6rem}
  .protocole__liste{font-size:1.7rem}
  .bilan{grid-template-columns:1fr;padding:2rem}
  .composeur{grid-template-columns:1fr 1fr;width:auto}
  .manifeste__texte{width:auto;font-size:2.8rem}
  .manifeste__images{display:none}
  .fiches{grid-template-columns:1fr;padding:4.9rem var(--gout) 0}
  .formulaire :is(input,textarea){font-size:2rem}
}