/* Ákros, direction C : « Le fil ». Corps, verticalité, élan. Seconde passe. */
:root {
  --nuit: #141614;
  --nuit-2: #1d201c;
  --papier: #f3f0e8;
  --or: #d6be83;
  --or-encre: #7a6330;
  --brume: #b5b8ae;
  --encre-2: #55584f;
  --fil: #a8915a;

  --serif: "Cormorant Garamond", "Cormorant", Georgia, serif;
  --sans: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;

  --axe: 14px;
  --pad-l: 34px;
  --pad-r: 18px;
  --col-gap: 14px;

  --s-display: clamp(3.3rem, 15.5vw, 9.4rem);
  --s-h2: clamp(2.5rem, 10vw, 6.2rem);
  --s-h3: clamp(1.75rem, 5vw, 2.6rem);
  --s-lead: clamp(1.25rem, 1.05rem + .9vw, 1.7rem);
  --s-body: 1rem;
  --s-small: .875rem;
  --s-label: .72rem;

  --ease: cubic-bezier(.2, .7, .1, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-io: cubic-bezier(.45, 0, .55, 1);
  --t-descente: 1.15s;
  --t-court: .45s;
}
@media (min-width: 900px) {
  :root { --axe: 4.2vw; --pad-l: 8.4vw; --pad-r: 4.6vw; --col-gap: 24px; --s-display: clamp(5rem, 9vw, 10rem); }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 84px; background: var(--fond); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

/* Passage d'une page à l'autre : fondu court, l'en-tête et le fil restent en place */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .38s; animation-timing-function: var(--ease); }
.tete { view-transition-name: tete; }
.fil { view-transition-name: fil; }
::view-transition-group(tete), ::view-transition-group(fil) { animation: none; }
::view-transition-old(tete), ::view-transition-old(fil) { display: none; }
::view-transition-new(tete), ::view-transition-new(fil) { animation: none; }
@media (prefers-reduced-motion: reduce) { ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; } }

body {
  margin: 0; background: var(--fond); color: var(--texte);
  font-family: var(--sans); font-size: var(--s-body); line-height: 1.65; font-weight: 400;
  -webkit-font-smoothing: antialiased; overflow-x: hidden; font-kerning: normal; hyphens: manual; overflow-wrap: break-word;
  -webkit-tap-highlight-color: rgba(214, 190, 131, .22);
}
img, video { display: block; max-width: 100%; }
a { color: inherit; }
p { margin: 0 0 1em; }
h1, h2, h3 { margin: 0; font-weight: 300; text-wrap: balance; }
p, li, dd, figcaption { text-wrap: pretty; }
button { font-family: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.saut { position: fixed; left: 12px; top: 12px; z-index: 100; padding: .7rem 1rem; background: var(--or); color: var(--nuit); font-weight: 600; transform: translateY(-160%); transition: transform var(--t-court) var(--ease); }
.saut:focus { transform: none; }

/* Focus visible : or sur nuit, or encré sur papier */
:focus-visible { outline: 2px solid var(--focus, var(--or)); outline-offset: 4px; border-radius: 1px; }
.papier { --focus: var(--or-encre); }

/* ---------- Le fil : l'axe vertical de tout le site ---------- */
.fil { position: fixed; left: var(--axe); top: 0; bottom: 0; width: 1px; z-index: 45; pointer-events: none; }
.fil::before { content: ""; position: absolute; inset: 0; background: var(--fil); opacity: .38; }
.fil__trace { position: absolute; inset: 0; background: var(--or); transform-origin: 50% 0; transform: scaleY(0); will-change: transform; }
.fil__anneau { position: absolute; left: -5px; top: -5px; width: 11px; height: 11px; border: 1.5px solid var(--or); border-radius: 50%; background: var(--fond); will-change: transform; }

/* ---------- En-tête ---------- */
.tete { position: fixed; inset: 0 0 auto 0; z-index: 50; height: 68px; display: flex; align-items: center; justify-content: space-between; padding: 0 var(--pad-r) 0 var(--pad-l); color: var(--texte); }
.tete::before { content: ""; position: absolute; inset: 0; background: rgba(20, 22, 20, .94); opacity: 0; transition: opacity var(--t-court) var(--ease); z-index: -1; }
.tete.est-pose::before, .tete.est-ouvert::before { opacity: 1; }
.marque { display: inline-flex; align-items: center; gap: .7rem; min-height: 44px; text-decoration: none; }
.marque img { width: 21px; height: auto; }
.marque span { font-size: .78rem; font-weight: 600; letter-spacing: .32em; }
.marque small { display: none; font-weight: 400; letter-spacing: .32em; color: var(--brume); }
.nav { display: none; }
.nav a { position: relative; text-decoration: none; font-size: .74rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; font-feature-settings: "case" 1; padding: .85rem 0; }
.nav a::after { content: ""; position: absolute; left: 0; right: .14em; bottom: .5rem; height: 1px; background: var(--or); transform: scaleX(0); transform-origin: 0 50%; transition: transform var(--t-court) var(--ease); }
.nav a:hover::after, .nav a:focus-visible::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
.nav a[aria-current="page"] { color: var(--accent); }
.nav .nav__parler { color: var(--accent); }
.menu-btn { appearance: none; display: inline-flex; align-items: center; gap: .7rem; border: 1px solid rgba(243, 240, 232, .5); background: rgba(20, 22, 20, .38); color: var(--texte); font: 600 .72rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; min-height: 44px; padding: .75rem 1rem .75rem 1.1rem; cursor: pointer; transition: background-color var(--t-court) var(--ease), color var(--t-court) var(--ease), border-color var(--t-court) var(--ease); }
.menu-btn::after { content: ""; flex: none; width: 1px; height: 14px; background: currentColor; transition: transform .5s var(--ease-out); }
.menu-btn[aria-expanded="true"] { background: var(--or); border-color: var(--accent); color: var(--nuit); }
.menu-btn[aria-expanded="true"]::after { transform: scaleY(1.5); }
.menu-btn:active { transform: translateY(1px); }
.panneau { position: fixed; inset: 0; z-index: 48; background: var(--fond); padding: 100px var(--pad-r) 1.4rem var(--pad-l); display: flex; flex-direction: column; justify-content: space-between; overflow-y: auto; opacity: 0; visibility: hidden; transition: opacity var(--t-court) var(--ease), visibility 0s linear var(--t-court); }
.panneau.est-ouvert { opacity: 1; visibility: visible; transition: opacity var(--t-court) var(--ease); }
.panneau ol { counter-reset: p; }
.panneau li { overflow: hidden; border-top: 1px solid rgba(214, 190, 131, .2); }
.panneau li:first-child { border-top: 0; }
.panneau ol a { display: flex; align-items: baseline; gap: .9rem; min-height: 56px; padding: .55rem 0 .5rem; font: 300 clamp(2.3rem, 11vw, 3.4rem)/1.15 var(--serif); text-decoration: none; transform: translateY(-70%); opacity: 0; transition: transform .7s var(--ease-out), opacity .5s var(--ease), color var(--t-court) var(--ease); }
.panneau.est-ouvert ol a { transform: none; opacity: 1; }
.panneau li:nth-child(2) a { transition-delay: .05s; } .panneau li:nth-child(3) a { transition-delay: .1s; }
.panneau li:nth-child(4) a { transition-delay: .15s; } .panneau li:nth-child(5) a { transition-delay: .2s; }
.panneau ol a::before { counter-increment: p; content: "0" counter(p); min-width: 1.9rem; font: 600 .7rem/1 var(--sans); letter-spacing: .18em; color: var(--accent); }
.panneau ol a:active { color: var(--accent); }
.panneau ol a[aria-current="page"] { color: var(--accent); font-style: italic; }
.panneau__pied { display: grid; gap: 0; margin-top: 1.6rem; padding-top: .8rem; border-top: 1px solid rgba(214, 190, 131, .35); font-size: var(--s-small); color: var(--brume); }
.panneau__pied span { padding-bottom: .3rem; }
.panneau__pied a { display: flex; align-items: center; min-height: 44px; color: var(--texte); text-decoration: none; }
.panneau__pied a:active { color: var(--accent); }
@media (hover: hover) { .panneau ol a:hover { color: var(--accent); } .menu-btn:hover { border-color: var(--accent); color: var(--accent); } .menu-btn[aria-expanded="true"]:hover { color: var(--nuit); } }
@media (min-width: 1280px) {
  .nav { display: flex; gap: clamp(1.1rem, 2.2vw, 2rem); align-items: center; }
  .nav a { white-space: nowrap; }
  .menu-btn, .panneau { display: none; }
  .nav .nav__parler { padding: .8rem 1.1rem; border: 1px solid rgba(214, 190, 131, .55); transition: background-color var(--t-court) var(--ease), color var(--t-court) var(--ease); }
  .nav .nav__parler::after { display: none; }
  .nav .nav__parler:hover, .nav .nav__parler:focus-visible { background: var(--or); color: var(--nuit); }
}

@media (min-width: 1560px) { .marque small { display: inline; } }

/* ---------- Structure ---------- */
main { display: block; }
.s { position: relative; padding: clamp(5rem, 13vw, 10.5rem) var(--pad-r) clamp(5rem, 13vw, 10.5rem) var(--pad-l); }
.papier { background: var(--papier); color: var(--nuit); }
.nuit-2 { background: var(--surface); }
.g { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--col-gap); }
@media (min-width: 900px) { .g { grid-template-columns: repeat(12, minmax(0, 1fr)); } }

/* ---------- Typographie ---------- */
.label { display: block; font: 600 var(--s-label)/1.5 var(--sans); letter-spacing: .2em; text-transform: uppercase; font-feature-settings: "case" 1; color: var(--accent); margin: 0 0 1.4rem; }
.papier .label { color: var(--or-encre); }
.display { margin-left: -.055em; font-family: var(--serif); font-weight: 300; font-size: var(--s-display); line-height: .94; letter-spacing: -.018em; font-variant-numeric: lining-nums; }
.h2 { margin-left: -.04em; font-family: var(--serif); font-weight: 300; font-size: var(--s-h2); line-height: .98; letter-spacing: -.012em; margin-bottom: 1.6rem; font-variant-numeric: lining-nums; }
.h3 { font-family: var(--serif); font-weight: 400; font-size: var(--s-h3); line-height: 1.06; letter-spacing: -.004em; margin-bottom: .8rem; font-variant-numeric: lining-nums; }
.it { font-style: italic; }
.or { color: var(--accent); }
.papier .or { color: var(--or-encre); }
.lead { font-family: var(--serif); font-size: var(--s-lead); line-height: 1.34; font-weight: 400; max-width: 32ch; font-variant-numeric: lining-nums; }
.texte { max-width: 38rem; }
.doux { color: var(--brume); }
.papier .doux { color: var(--encre-2); }
/* La chute : chaque ligne descend d'un cran vers la droite */
.chute > span { display: block; padding-top: .05em; }
.chute > span:nth-child(2) { padding-left: .55em; }
.chute > span:nth-child(3) { padding-left: 1.1em; }
@media (min-width: 900px) {
  .chute > span:nth-child(2) { padding-left: .9em; }
  .chute > span:nth-child(3) { padding-left: 1.8em; }
}
.nombre { margin: 0 0 .12em -.04em; font-family: var(--serif); font-weight: 300; font-size: clamp(4.5rem, 22vw, 15rem); line-height: .8; letter-spacing: -.03em; font-variant-numeric: lining-nums; }
.nombre small { font-size: .3em; letter-spacing: 0; margin-left: .08em; }

/* ---------- Composants ---------- */
.actions { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; align-items: center; margin-top: 2rem; }
.btn { position: relative; isolation: isolate; overflow: hidden; display: inline-flex; align-items: center; justify-content: space-between; gap: .7rem; min-height: 48px; padding: .9rem 1.35rem; text-decoration: none; font: 600 .76rem/1.25 var(--sans); letter-spacing: .15em; text-transform: uppercase; font-feature-settings: "case" 1; background: var(--or); color: var(--nuit); border: 1px solid var(--or); cursor: pointer; transition: color var(--t-court) var(--ease); }
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--papier); transform: scaleY(0); transform-origin: 50% 100%; transition: transform .5s var(--ease-out); }
.btn:hover::before, .btn:focus-visible::before { transform: scaleY(1); }
.btn:active { transform: translateY(1px); }
.papier .btn { background: var(--fond); color: var(--texte); border-color: var(--nuit); }
.papier .btn::before { background: var(--or-encre); }
.btn--ligne { background: transparent; color: inherit; border-color: currentColor; }
.btn--ligne::before { background: var(--or); }
.btn--ligne:hover, .btn--ligne:focus-visible { color: var(--nuit); }
.papier .btn--ligne { background: transparent; color: var(--nuit); border-color: var(--nuit); }
.papier .btn--ligne:hover, .papier .btn--ligne:focus-visible { color: var(--texte); }
.papier .btn--ligne::before { background: var(--fond); }
.fleche { display: inline-block; transition: transform var(--t-court) var(--ease); }
a:hover .fleche--b, a:focus-visible .fleche--b { transform: translateY(3px); }
a:hover .fleche--h, a:focus-visible .fleche--h { transform: translate(2px, -2px); }
.lien { position: relative; display: inline-flex; gap: .5rem; align-items: baseline; min-height: 44px; padding: .85rem 0 .7rem; text-decoration: none; font: 600 .76rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; font-feature-settings: "case" 1; }
.lien::after { content: ""; position: absolute; left: 0; right: .14em; bottom: .55rem; height: 1px; background: currentColor; transform-origin: 0 50%; transform: scaleX(.35); transition: transform var(--t-court) var(--ease); }
.lien:hover::after, .lien:focus-visible::after { transform: scaleX(1); }
.lien:active { opacity: .7; }
@media (max-width: 560px) {
  .actions { flex-direction: column; align-items: stretch; gap: .5rem; }
  .actions .lien { align-self: flex-start; }
}

/* Photo : cadre fixe, image qui respire (zoom lent), qui ne démarre que visible */
.ph { position: relative; margin: 0; }
.ph__cadre { position: relative; overflow: hidden; background: var(--surface); }
.ph__cadre > img, .ph__cadre > video { width: 100%; height: 100%; object-fit: cover; }
.respire > img { transform-origin: var(--origine, 50% 40%); }
.js .respire > img { animation: respire 42s var(--ease-io) infinite alternate; animation-play-state: paused; }
.js .respire.vu > img { animation-play-state: running; }
@keyframes respire { from { transform: scale(1); } to { transform: scale(1.09); } }
.ph figcaption, .legende { display: flex; gap: .7rem; align-items: baseline; margin-top: .75rem; font-size: .75rem; line-height: 1.5; letter-spacing: .02em; color: var(--brume); }
.ph figcaption::before, .legende::before { content: ""; flex: 0 0 18px; height: 1px; background: var(--or); transform: translateY(-.25em); }
.papier .ph figcaption, .papier .legende { color: var(--encre-2); }
.papier .ph figcaption::before, .papier .legende::before { background: var(--or-encre); }
/* Légende posée sur l'image : pastille sombre, contraste tenu quelle que soit la photo */
.ph figcaption.sur { position: absolute; z-index: 2; margin: 0; padding: .4rem .7rem .4rem .6rem; background: rgba(20, 22, 20, .8); color: var(--texte); }
.ph figcaption.sur::before { background: var(--or); }

/* Fiche technique : les repères chiffrés */
.fiche { display: grid; gap: 0; border-top: 1px solid rgba(214, 190, 131, .35); }
.papier .fiche { border-top-color: rgba(20, 22, 20, .2); }
.fiche > div { display: grid; grid-template-columns: minmax(7.5rem, 34%) 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid rgba(214, 190, 131, .35); }
.papier .fiche > div { border-bottom-color: rgba(20, 22, 20, .2); }
.fiche dt { font: 600 var(--s-label)/1.5 var(--sans); letter-spacing: .18em; text-transform: uppercase; font-feature-settings: "case" 1; color: var(--accent); padding-top: .2rem; }
.papier .fiche dt { color: var(--or-encre); }
.fiche dd { margin: 0; font-family: var(--serif); font-size: 1.3rem; line-height: 1.3; font-variant-numeric: lining-nums; }

/* Bande des partenaires qui défile */
.bande { position: relative; overflow: hidden; margin: 3rem calc(var(--pad-r) * -1) 0 calc(var(--pad-l) * -1); padding: 1.6rem 0; border-block: 1px solid rgba(20, 22, 20, .14); -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); }
.bande__piste { display: flex; width: max-content; animation: defile 52s linear infinite; }
.bande.est-pause .bande__piste { animation-play-state: paused; }
.bande.est-clavier .bande__piste { animation: none; }
.bande ul { display: flex; align-items: flex-start; gap: 22px; padding-right: 22px; }
.bande li { flex: 0 0 116px; width: 116px; }
.logo-partenaire { display: flex; flex-direction: column; align-items: center; gap: .75rem; width: fit-content; color: inherit; text-decoration: none; }
.logo-partenaire__cadre { display: flex; align-items: center; justify-content: center; width: 88px; height: 88px; border: 1px solid rgba(20, 22, 20, .1); border-radius: 50%; overflow: hidden; isolation: isolate; flex: none; background: #fff; transition: border-color .25s, box-shadow .25s, transform .25s; }
.logo-partenaire__cadre--sombre { background: #141614; border-color: rgba(214, 190, 131, .3); }
.logo-partenaire .logo-partenaire__cadre img { width: var(--logo-taille, 78%); height: var(--logo-taille, 78%); max-width: none; object-fit: contain; object-position: center; margin: 0; mix-blend-mode: normal; flex: none; }
.logo-partenaire__nom { display: none; }
.bande .logo-partenaire { width: 100%; }
.bande .logo-partenaire__nom { display: block; min-height: 2.8em; max-width: 18ch; font: 500 .7rem/1.4 var(--sans); text-align: center; color: var(--encre-2); }
.logo-partenaire:focus-visible { outline: 2px solid var(--or-encre); outline-offset: 6px; border-radius: 4px; }
@media (hover: hover) { .logo-partenaire:hover .logo-partenaire__cadre { border-color: var(--or-encre); box-shadow: 0 3px 14px rgba(20, 22, 20, .08); transform: translateY(-2px); } }
@media (min-width: 900px) { .bande ul { gap: 44px; padding-right: 44px; } .bande li { flex-basis: 150px; width: 150px; } .logo-partenaire__cadre { width: 112px; height: 112px; } .bande .logo-partenaire__nom { font-size: .75rem; } }
@keyframes defile { to { transform: translateX(-50%); } }
.bande__pause { appearance: none; display: inline-flex; align-items: center; min-height: 44px; margin: .4rem 0 0; padding: .4rem 0; background: none; border: 0; color: var(--encre-2); font: 600 .7rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; cursor: pointer; text-decoration: underline; text-underline-offset: .35em; text-decoration-thickness: 1px; }
.bande__pause:hover { color: var(--nuit); }

/* Entrée au chargement : tout ce qui est à l'écran arrive depuis le haut, sans jamais s'être montré avant */
.js [data-e] { animation: entree var(--t-descente) var(--ease-out) both; animation-delay: var(--delai, 0s); }
@keyframes entree { from { opacity: 0; transform: translate3d(0, -26px, 0); } to { opacity: 1; transform: none; } }

/* Révélation à la lecture : les blocs descendent depuis leur point d'accroche */
.js [data-d] { opacity: 0; transform: translate3d(0, -26px, 0); }
.js [data-d].est-la { opacity: 1; transform: none; transition: opacity 1s var(--ease), transform var(--t-descente) var(--ease-out); transition-delay: var(--delai, 0s); }

/* ---------- Accueil : ouverture ---------- */
.ouverture { position: relative; min-height: 100svh; padding: 0 var(--pad-r) 3.5rem var(--pad-l); overflow: hidden; }
.ouverture__ph { margin: 0 calc(var(--pad-r) * -1) 0 calc(var(--pad-l) * -1); }
.ouverture__ph .ph__cadre { height: 64svh; min-height: 380px; }
.ouverture__ph .ph__cadre::before, .ouverture__ph .ph__cadre::after { content: ""; position: absolute; left: 0; right: 0; z-index: 1; pointer-events: none; }
.ouverture__ph .ph__cadre::before { top: 0; height: 130px; background: linear-gradient(180deg, rgba(20, 22, 20, .72), rgba(20, 22, 20, 0)); }
.ouverture__ph .ph__cadre::after { bottom: 0; height: 42%; background: linear-gradient(0deg, var(--nuit) 4%, rgba(20, 22, 20, 0)); }
.ouverture__ph figcaption.sur { right: 0; left: auto; top: 112px; writing-mode: vertical-rl; transform: rotate(180deg); padding: .7rem .45rem; font-size: .7rem; border-right: 1px solid var(--or); }
.ouverture__ph figcaption.sur::before { display: none; }
.ouverture__texte { position: relative; z-index: 2; margin-top: -11svh; }
.ouverture h1 { margin-bottom: 1.5rem; }
.ouverture__bas { display: grid; grid-template-areas: "lead" "act" "det"; }
.ouverture__bas > .lead { grid-area: lead; }
.ouverture__bas > .actions { grid-area: act; }
.ouverture__bas > .detail { grid-area: det; }
.detail { width: 52%; margin: 2.6rem 0 0 auto; }
.detail .ph__cadre { aspect-ratio: 4 / 5; }
.detail img { object-position: 27% 47%; transform-origin: 27% 47%; transform: scale(2.1); }
.detail figcaption { font-size: .72rem; }
@media (min-width: 900px) {
  .ouverture { min-height: max(100vh, 760px); padding-bottom: 0; }
  .ouverture__ph { position: absolute; top: 68px; right: var(--pad-r); bottom: 0; width: 38vw; margin: 0; }
  .ouverture__ph .ph__cadre { height: 100%; }
  .ouverture__ph .ph__cadre::before { display: none; }
  .ouverture__ph .ph__cadre::after { height: 22%; background: linear-gradient(0deg, rgba(20, 22, 20, .55), rgba(20, 22, 20, 0)); }
  .ouverture__ph figcaption.sur { left: 1.1rem; right: auto; top: auto; bottom: 1.3rem; max-width: calc(100% - 2.2rem); writing-mode: horizontal-tb; transform: none; padding: .4rem .7rem .4rem .6rem; font-size: .75rem; border-right: 0; }
  .ouverture__ph figcaption.sur::before { display: block; }
  .ouverture__texte { margin-top: 0; padding-top: max(9vh, 92px); max-width: calc(100vw - var(--pad-l) - var(--pad-r) - 38vw - 2.4rem); }
  .ouverture h1 { font-size: clamp(4.6rem, 8.6vw, 9.8rem); }
  .ouverture__bas { grid-template-columns: minmax(0, 1fr) 156px; grid-template-areas: "lead det" "act det"; grid-template-rows: auto 1fr; column-gap: 2rem; align-items: start; padding-bottom: 2.4rem; }
  .ouverture__bas > .actions { margin-top: 1.6rem; }
  .detail { width: 156px; margin: 0; }
}

/* ---------- Accueil : trois cordes ---------- */
.cordes { margin-top: 3.5rem; display: grid; gap: 1rem; }
.corde { position: relative; display: block; text-decoration: none; padding-top: var(--chute, 2.5rem); }
.corde::before { content: ""; position: absolute; left: 0; top: 0; height: calc(var(--chute, 2.5rem) - 10px); width: 1px; background: var(--or-encre); transform-origin: 50% 0; transform: scaleY(var(--tendu, 1)); transition: transform .9s var(--ease-out); }
.corde::after { content: ""; position: absolute; left: -5px; top: calc(var(--chute, 2.5rem) - 11px); width: 11px; height: 11px; border: 1.5px solid var(--or-encre); border-radius: 50%; background: var(--papier); transition: transform .7s var(--ease-out), background-color var(--t-court) var(--ease); }
.corde__corps { display: block; padding: 1.4rem 0 1.6rem 1.4rem; border-left: 1px solid rgba(20, 22, 20, .14); transition: border-color var(--t-court) var(--ease); }
.corde__num { display: block; font: italic 300 3.4rem/1 var(--serif); font-variant-numeric: lining-nums; color: var(--or-encre); margin-bottom: .6rem; transition: transform .6s var(--ease-out); }
.corde .h3 { display: block; }
.corde p { color: var(--encre-2); max-width: 34ch; }
.corde .lien { margin-top: .2rem; }
.corde:focus-visible { outline-offset: 2px; }
.corde:active .corde__num { transform: translateY(6px); }
@media (hover: hover) {
  .corde:hover .corde__num, .corde:focus-visible .corde__num { transform: translateY(6px); }
  .corde:hover::after, .corde:focus-visible::after { transform: translateY(6px); background: var(--or-encre); }
  .corde:hover .corde__corps, .corde:focus-visible .corde__corps { border-left-color: var(--or-encre); }
  .corde:hover .lien::after, .corde:focus-visible .lien::after { transform: scaleX(1); }
}
.corde:nth-child(2) { --chute: 4.5rem; margin-left: 12vw; }
.corde:nth-child(3) { --chute: 3.2rem; margin-left: 5vw; }
@media (min-width: 900px) {
  .cordes { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); margin-top: 4rem; }
  .corde { margin: 0 !important; }
  .corde:nth-child(1) { grid-column: 1 / span 4; --chute: 3rem; }
  .corde:nth-child(2) { grid-column: 5 / span 4; --chute: 13rem; }
  .corde:nth-child(3) { grid-column: 9 / span 4; --chute: 7rem; }
}

/* Les quatre besoins sont visibles immédiatement, chacun avec son univers. */
.entrees { display: grid; gap: .8rem; margin-top: 2.6rem; }
.entrees__intro .h2 { font-size: clamp(2.5rem, 7vw, 5rem); }
.entree { display: grid; grid-template-columns: minmax(0, 36%) minmax(0, 1fr); min-height: 164px; background: var(--fond); color: var(--texte); text-decoration: none; overflow: hidden; }
.entree > img { width: 100%; height: 100%; min-height: 164px; object-fit: cover; }
.entree__texte { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: .45rem; min-width: 0; padding: 1rem; font-size: .8rem; line-height: 1.4; }
.entree__texte .label { margin: 0; color: var(--accent); font-size: .6rem; }
.entree__texte .h3 { margin: 0; font-size: clamp(1.3rem, 5.8vw, 1.75rem); line-height: 1.05; }
.entree__lien { margin-top: .2rem; color: var(--accent); font: 600 .68rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.entree:focus-visible { outline: 2px solid var(--or-encre); outline-offset: 3px; }
@media (min-width: 700px) {
  .entrees { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .entree { grid-template-columns: 1fr; }
  .entree > img { height: clamp(210px, 20vw, 330px); min-height: 0; }
  .entree__texte { min-height: 190px; padding: 1.3rem; }
  .entree__texte .h3 { font-size: clamp(1.8rem, 2.5vw, 2.5rem); }
}
@media (hover: hover) { .entree > img { transition: transform .7s var(--ease-out); } .entree:hover > img { transform: scale(1.05); } }

/* ---------- Accueil : réalisations ---------- */
.real { margin-top: 4rem; }
.real + .real { margin-top: clamp(5rem, 12vw, 10rem); }
.real__ph .ph__cadre { aspect-ratio: 4 / 5; }
.real__mot { display: none; }
.real__texte { margin-top: 1.8rem; }
.real__detail { width: 62%; margin: 3rem 0 0 auto; }
.real__detail .ph__cadre { aspect-ratio: 4 / 5; }
.real__detail img { object-position: 45% 50%; }
@media (min-width: 900px) {
  .real { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: end; }
  .real--a .real__ph { grid-column: 1 / span 5; grid-row: 1; }
  .real--a .real__ph .ph__cadre { aspect-ratio: 2 / 3; }
  .real--a .real__mot { display: block; grid-column: 6 / span 2; grid-row: 1; align-self: start; writing-mode: vertical-rl; font: italic 300 clamp(6rem, 10vw, 10rem)/.8 var(--serif); color: var(--accent); letter-spacing: -.01em; margin-left: 1rem; }
  .real--a .real__texte { grid-column: 8 / span 5; grid-row: 1; margin: 0 0 4rem; }
  .real--b { align-items: start; }
  .real--b .real__texte { grid-column: 1 / span 4; grid-row: 1; margin: 2rem 0 0; }
  .real--b .real__detail { width: 58%; margin: 7rem 0 0 18%; }
  .real--b .real__ph { grid-column: 6 / span 7; grid-row: 1; margin-top: 9rem; }
  .real--b .real__ph .ph__cadre { aspect-ratio: 3 / 2; }
}

/* ---------- Accueil : le diptyque vertical, deux hauteurs ---------- */
.seuil { margin-top: clamp(5rem, 12vw, 10rem); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 3rem; align-items: start; }
.seuil > :nth-child(1) { grid-column: 1 / span 3; }
.seuil > :nth-child(2) { grid-column: 2 / span 3; }
.seuil .ph__cadre { aspect-ratio: 2 / 3; }
.seuil > :nth-child(2) .ph__cadre { aspect-ratio: 3 / 4; }
@media (min-width: 900px) {
  .seuil { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .seuil > :nth-child(1) { grid-column: 2 / span 4; }
  .seuil > :nth-child(2) { grid-column: 7 / span 5; margin-top: 9rem; }
  .seuil > :nth-child(2) .ph__cadre { aspect-ratio: 4 / 5; }
}

/* ---------- Accueil : références ---------- */
.refs { margin-top: 3rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem var(--col-gap); }
.refs li { border-top: 1px solid rgba(20, 22, 20, .18); padding-top: .8rem; }
.refs b { display: block; font: 400 1.25rem/1.15 var(--serif); font-variant-numeric: lining-nums; margin-bottom: .3rem; }
.refs span { display: block; font-size: .8rem; line-height: 1.5; color: var(--encre-2); }
@media (min-width: 900px) { .refs { grid-template-columns: repeat(4, 1fr); } }

/* ---------- Médias ---------- */
.medias { margin-top: 3rem; display: grid; gap: 3.5rem; }
.media .ph__cadre { aspect-ratio: 16 / 9; }
.media__src { display: block; margin: 1.3rem 0 .5rem; font: 600 var(--s-label)/1.4 var(--sans); letter-spacing: .18em; text-transform: uppercase; font-feature-settings: "case" 1; color: var(--or-encre); }
.media .h3 { font-size: clamp(1.5rem, 3.6vw, 2.1rem); }
.media p { color: var(--encre-2); max-width: 44ch; }
.nuit .media__src, .s:not(.papier) .media__src { color: var(--accent); }
.s:not(.papier) .media p { color: var(--brume); }
@media (min-width: 900px) {
  .medias { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
  .media:nth-child(1) { grid-column: 1 / span 6; }
  .media:nth-child(2) { grid-column: 8 / span 5; margin-top: 10rem; }
}

/* ---------- Compagnie : portraits suspendus ---------- */
.suspendus { margin-top: 3rem; display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--col-gap); row-gap: 2.5rem; }
.suspendu { position: relative; padding-top: var(--chute); }
.suspendu::before { content: ""; position: absolute; left: 50%; top: 0; height: var(--chute); width: 1px; background: var(--fil); transform-origin: 50% 0; transition: transform .9s var(--ease-out); }
.suspendu .ph__cadre { aspect-ratio: 3 / 4; }
.suspendu h3 { font: 400 1.45rem/1.1 var(--serif); margin: 1rem 0 .3rem; }
.suspendu p { font-size: .8rem; color: var(--brume); margin: 0 0 .2rem; }
.suspendu:nth-child(1) { --chute: 1.5rem; } .suspendu:nth-child(2) { --chute: 6rem; }
.suspendu:nth-child(3) { --chute: 2.5rem; } .suspendu:nth-child(4) { --chute: 7.5rem; }
@media (min-width: 900px) {
  .suspendus { grid-template-columns: repeat(4, 1fr); column-gap: clamp(1.5rem, 3vw, 3.5rem); }
  .suspendu:nth-child(1) { --chute: 2rem; } .suspendu:nth-child(2) { --chute: 11rem; }
  .suspendu:nth-child(3) { --chute: 4.5rem; } .suspendu:nth-child(4) { --chute: 14rem; }
}
@media (hover: hover) { .suspendu:hover::before { transform: scaleY(1.08); } }

/* ---------- Étapes : l'élan, en escalier ---------- */
.etapes { margin-top: 3rem; display: grid; gap: 2.4rem; counter-reset: e; }
.etape { position: relative; padding-left: 3.6rem; max-width: 30rem; }
.etape::before { counter-increment: e; content: counter(e); position: absolute; left: 0; top: -.35rem; font: italic 300 3rem/1 var(--serif); font-variant-numeric: lining-nums; color: var(--or-encre); }
.etape h3 { font: 400 1.5rem/1.15 var(--serif); margin-bottom: .5rem; }
.etape p { color: var(--encre-2); margin: 0; }
.s:not(.papier) .etape::before { color: var(--accent); }
.s:not(.papier) .etape p { color: var(--brume); }
@media (min-width: 900px) {
  .etapes { gap: 3rem; }
  .etape:nth-child(2) { margin-left: 22%; }
  .etape:nth-child(3) { margin-left: 44%; }
  .etape:nth-child(4) { margin-left: 66%; }
}

/* ---------- Contact ---------- */
.contact .display { font-size: clamp(3rem, 13vw, 8.6rem); margin-bottom: 1.8rem; }
.coord { grid-column: 1 / -1; margin-top: 3rem; display: grid; gap: 0; font-size: var(--s-small); color: var(--brume); font-style: normal; }
.coord b { color: var(--texte); font-weight: 600; letter-spacing: .06em; padding-bottom: .3rem; }
.coord a { display: flex; align-items: center; min-height: 44px; text-decoration: none; color: var(--texte); }
.coord a:hover { text-decoration: underline; text-underline-offset: 4px; }
.coord span { padding-top: .5rem; }
@media (min-width: 900px) {
  .contact .g > .contact__texte { grid-column: 1 / span 8; }
  .contact .g > .coord { grid-column: 10 / span 3; align-self: end; margin: 0; }
  .coord a { min-height: 36px; }
}

/* ---------- Pied ---------- */
.pied { padding: 3.5rem var(--pad-r) 2.5rem var(--pad-l); background: var(--surface); color: var(--brume); font-size: var(--s-small); }
.pied__haut { display: grid; gap: 2rem; }
.pied img { width: 86px; height: auto; }
.pied ul { display: grid; gap: 0; }
.pied a { text-decoration: none; color: var(--texte); display: flex; align-items: center; min-height: 44px; }
.pied a:hover { color: var(--accent); }
.pied__bas { margin-top: 3rem; padding-top: 1.2rem; border-top: 1px solid rgba(181, 184, 174, .2); display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; justify-content: space-between; font-size: .75rem; }
@media (min-width: 900px) { .pied__haut { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 2.5rem; } .pied a { min-height: 36px; } }

/* ---------- Page spectacle ---------- */
.scene { position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; padding: 0 var(--pad-r) 2.2rem var(--pad-l); overflow: hidden; }
.scene__media { position: absolute; inset: 0; z-index: 0; }
.scene__media video, .scene__media img { width: 100%; height: 100%; object-fit: cover; object-position: var(--cadre-x, 52%) 50%; }
.scene__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 22, 20, .6) 0%, rgba(20, 22, 20, 0) 26%, rgba(20, 22, 20, 0) 42%, rgba(20, 22, 20, .92) 100%); }
.scene__texte { position: relative; z-index: 1; }
.scene .display { font-size: clamp(4.2rem, 21vw, 15rem); line-height: .86; margin-bottom: 1rem; }
.scene__bas { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem 2rem; }
.scene__bas .legende { color: var(--texte); margin: 0; }
.video-ctrl { appearance: none; background: rgba(20, 22, 20, .62); color: var(--texte); border: 1px solid rgba(243, 240, 232, .55); min-height: 44px; padding: .6rem 1rem; font: 600 .7rem/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; transition: background-color var(--t-court) var(--ease), color var(--t-court) var(--ease); }
.video-ctrl:active { transform: translateY(1px); }
@media (hover: hover) { .video-ctrl:hover { background: var(--or); border-color: var(--accent); color: var(--nuit); } }
.intro-sp { display: grid; gap: 3rem; }
@media (min-width: 900px) {
  .intro-sp { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
  .intro-sp__texte { grid-column: 1 / span 6; }
  .intro-sp .fiche { grid-column: 8 / span 5; align-self: end; }
}
.hauteur { display: grid; gap: 2rem; align-items: end; }
.hauteur__ph { position: relative; }
.hauteur__ph .ph__cadre { aspect-ratio: 3 / 4; }
.hauteur__ph img { object-position: 27% 50%; }
.hauteur__texte .nombre { color: var(--accent); }
/* La règle : 0 au sol, 54 m au sommet, se déroule du haut vers le bas */
.regle { position: absolute; z-index: 2; top: 0; bottom: 0; right: 0; width: 22px; pointer-events: none; transform-origin: 50% 0; }
.regle::before { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 1px; background: var(--or); box-shadow: 0 0 6px rgba(20, 22, 20, .6); }
.regle::after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 12px; background: repeating-linear-gradient(180deg, var(--or) 0, var(--or) 1px, transparent 1px, transparent 24px); opacity: .85; }
.regle b { position: absolute; right: 26px; padding: .2rem .5rem; background: rgba(20, 22, 20, .82); color: var(--accent); font: 600 .7rem/1.3 var(--sans); letter-spacing: .14em; }
.regle b:first-child { top: 0; }
.regle b:last-child { bottom: 0; }
.js .hauteur__ph .regle { transform: scaleY(0); transition: transform 2.2s var(--ease-out) .25s; }
.js .hauteur__ph.est-la .regle { transform: none; }
@media (min-width: 900px) {
  .hauteur { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
  .hauteur__texte { grid-column: 1 / span 6; padding-bottom: 2rem; }
  .hauteur__ph { grid-column: 8 / span 4; }
  .hauteur__texte .nombre { font-size: clamp(12rem, 23vw, 22rem); }
}
.planche { display: grid; gap: 2.5rem; margin-top: 3rem; }
.planche .p1 .ph__cadre { aspect-ratio: 2 / 3; }
.planche .p2 .ph__cadre { aspect-ratio: 3 / 2; }
.planche .p3 .ph__cadre { aspect-ratio: 16 / 10; }
.planche .p4 .ph__cadre { aspect-ratio: 4 / 5; }
.planche .p6 .ph__cadre { aspect-ratio: 3 / 4; }
.planche .p5 { margin: .5rem calc(var(--pad-r) * -1) 0 calc(var(--pad-l) * -1); }
.planche .p5 .ph__cadre { aspect-ratio: 4 / 5; }
.planche .p5 figcaption { padding: 0 var(--pad-r) 0 var(--pad-l); }
@media (min-width: 900px) {
  .planche { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); row-gap: 4rem; align-items: start; }
  .planche .p1 { grid-column: 1 / span 5; grid-row: 1 / span 2; }
  .planche .p2 { grid-column: 7 / span 6; margin-top: 6rem; }
  .planche .p3 { grid-column: 7 / span 4; }
  .planche .p4 { grid-column: 2 / span 3; }
  .planche .p6 { grid-column: 6 / span 3; margin-top: 7rem; }
  .planche .p5 { grid-column: 1 / -1; margin: 3rem calc(var(--pad-r) * -1) 0 calc(var(--pad-l) * -1); }
  .planche .p5 .ph__cadre { aspect-ratio: auto; height: 88vh; max-height: 62vw; }
}
.citation { font: italic 300 clamp(1.7rem, 4.4vw, 3rem)/1.18 var(--serif); max-width: 24ch; margin: 0; }
.programme { border-left: 1px solid var(--or-encre); padding: .2rem 0 .2rem 1.3rem; }
.programme .h3 { font-size: 1.6rem; }
.suite { display: grid; gap: 2rem; }
.suite .ph__cadre { aspect-ratio: 3 / 2; }
@media (min-width: 900px) {
  .suite { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: center; }
  .suite .ph { grid-column: 1 / span 6; }
  .suite > div { grid-column: 8 / span 5; }
}

/* ---------- Pages intérieures ---------- */
.ouv-page { position: relative; padding: 116px var(--pad-r) 3rem var(--pad-l); overflow: hidden; }
.ouv-page__grille { display: grid; gap: 2.2rem; }
.ouv-page .display { font-size: clamp(3rem, 13.5vw, 8.4rem); margin-bottom: 2.2rem; }
.ouv-page__ph .ph__cadre { aspect-ratio: 4 / 5; }
@media (min-width: 900px) {
  .ouv-page { padding-top: 0; min-height: max(100vh, 760px); }
  .ouv-page__grille { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); min-height: max(100vh, 760px); align-items: center; }
  .ouv-page__texte { grid-column: 1 / span 7; padding: 140px 0 4rem; }
  .ouv-page__ph { grid-column: 8 / span 5; align-self: stretch; margin: 68px calc(var(--pad-r) * -1) 0 0; }
  .ouv-page__ph .ph__cadre { aspect-ratio: auto; height: 100%; }
  .ouv-page .ouv-page__ph figcaption.sur { left: 1.1rem; bottom: 1.3rem; max-width: calc(100% - 2.2rem); }
}
.ouv-page__ph--video .ph__cadre { aspect-ratio: 4 / 3; }
.ouv-page__ph--video video { object-position: 52% 50%; }
@media (min-width: 900px) {
  .ouv-page__ph--video { grid-column: 7 / span 6; align-self: center; margin: 68px calc(var(--pad-r) * -1) 0 0; }
  .ouv-page__ph--video .ph__cadre { aspect-ratio: 3 / 2; height: auto; }
  .ouv-page__texte--video { grid-column: 1 / span 6; }
}
.ouv-page__ph figcaption.sur { left: .8rem; bottom: .8rem; max-width: calc(100% - 1.6rem); }
@media (max-width: 899px) {
  /* Téléphone : la photo (ou la vidéo) ouvre la page, le titre remonte sur son pied */
  .ouv-page--photo { padding-top: 0; }
  .ouv-page--photo .ouv-page__grille { gap: 0; }
  .ouv-page--photo .ouv-page__ph { order: -1; margin: 0 calc(var(--pad-r) * -1) 0 calc(var(--pad-l) * -1); }
  .ouv-page--photo .ph__cadre { aspect-ratio: auto; height: 62svh; min-height: 360px; }
  .ouv-page--photo .ouv-page__ph--video .ph__cadre { aspect-ratio: 4 / 3; height: auto; min-height: 0; }
  .ouv-page--photo .ph__cadre::before, .ouv-page--photo .ph__cadre::after { content: ""; position: absolute; left: 0; right: 0; z-index: 1; pointer-events: none; }
  .ouv-page--photo .ph__cadre::before { top: 0; height: 130px; background: linear-gradient(180deg, rgba(20, 22, 20, .72), rgba(20, 22, 20, 0)); }
  .ouv-page--photo .ph__cadre::after { bottom: 0; height: 40%; background: linear-gradient(0deg, var(--nuit) 4%, rgba(20, 22, 20, 0)); }
  .ouv-page--photo .ouv-page__texte { position: relative; z-index: 2; margin-top: -9svh; }
  .ouv-page--photo .ouv-page__texte--video { margin-top: 1.6rem; }
  .ouv-page--photo .ouv-page__ph figcaption.sur { right: 0; left: auto; top: 112px; bottom: auto; writing-mode: vertical-rl; transform: rotate(180deg); padding: .7rem .45rem; font-size: .7rem; border-right: 1px solid var(--or); max-width: none; }
  .ouv-page--photo .ouv-page__ph figcaption.sur::before { display: none; }
  .ouv-page--photo .salle-ctrl { z-index: 3; }
}
.deroule { margin-top: 3rem; display: grid; gap: 0; }
.deroule li { display: grid; grid-template-columns: 3.4rem 1fr; gap: 1rem; padding: 1.6rem 0; border-top: 1px solid rgba(20, 22, 20, .18); }
.deroule li > span { font: italic 300 2.6rem/1 var(--serif); font-variant-numeric: lining-nums; color: var(--or-encre); }
.deroule h3 { font: 400 1.45rem/1.15 var(--serif); margin-bottom: .4rem; }
.deroule p { margin: 0; color: var(--encre-2); }
@media (min-width: 900px) {
  .deroule { grid-template-columns: repeat(4, 1fr); column-gap: var(--col-gap); align-items: start; }
  .deroule li { grid-template-columns: 1fr; border-top: 0; border-left: 1px solid rgba(20, 22, 20, .18); padding: 0 0 0 1.3rem; }
  .deroule li:nth-child(2) { margin-top: 5rem; } .deroule li:nth-child(3) { margin-top: 10rem; } .deroule li:nth-child(4) { margin-top: 15rem; }
}
.deux { display: grid; gap: 2.5rem; }
@media (min-width: 900px) {
  .deux { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
  .deux > :first-child { grid-column: 1 / span 6; }
  .deux > :last-child { grid-column: 8 / span 5; }
}
.galerie { display: grid; gap: 2.4rem; margin-top: 3rem; }
.galerie .ph__cadre { aspect-ratio: 4 / 5; }
.galerie .ph:nth-child(2) { margin-left: 12vw; }
.galerie .ph:nth-child(2) .ph__cadre { aspect-ratio: 3 / 2; }
@media (min-width: 900px) {
  .galerie { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: start; }
  .galerie .ph:nth-child(1) { grid-column: 1 / span 4; }
  .galerie .ph:nth-child(2) { grid-column: 5 / span 5; margin: 7rem 0 0; }
  .galerie .ph:nth-child(3) { grid-column: 10 / span 3; margin-top: 2rem; }
}
.tarif { display: grid; gap: 0; margin-top: 2rem; }
.tarif > div { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 1.1rem 0; border-top: 1px solid rgba(214, 190, 131, .35); }
.papier .tarif > div { border-top-color: rgba(20, 22, 20, .2); }
.tarif dt { font-size: .9rem; }
.tarif dd { margin: 0; font: 300 clamp(2.2rem, 7vw, 3.6rem)/1 var(--serif); font-variant-numeric: lining-nums; color: var(--accent); white-space: nowrap; }
.papier .tarif dd { color: var(--or-encre); }
.note { font-size: var(--s-small); color: var(--brume); max-width: 40rem; }
.papier .note { color: var(--encre-2); }
.cond { margin-top: 2.4rem; display: grid; gap: 1rem; }
.cond p { margin: 0; max-width: 44rem; }
.cond b { font-weight: 600; }

/* Salle */
.moyens { margin-top: 3rem; display: grid; gap: 0; counter-reset: m; }
.moyens li { display: grid; grid-template-columns: 2.4rem 1fr; gap: .8rem; padding: 1.2rem 0; border-top: 1px solid rgba(214, 190, 131, .3); font-family: var(--serif); font-size: clamp(1.3rem, 2.6vw, 1.8rem); line-height: 1.25; }
.moyens li::before { counter-increment: m; content: "0" counter(m); font: 600 var(--s-label)/2.4 var(--sans); letter-spacing: .18em; color: var(--accent); }
.invites { margin-top: 3rem; display: grid; gap: 2.4rem; }
.invite .ph__cadre { aspect-ratio: 4 / 5; }
.invite:nth-child(1) .ph__cadre { aspect-ratio: 3 / 2; }
.invite h3 { font: 400 1.5rem/1.15 var(--serif); margin: 1rem 0 .2rem; }
.invite p { margin: 0; font-size: .85rem; color: var(--encre-2); }
.autres { margin-top: 2.4rem; font-size: .9rem; color: var(--encre-2); }
.autres li { padding: .55rem 0; border-top: 1px solid rgba(20, 22, 20, .15); }
@media (min-width: 900px) {
  .invites { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: start; }
  .invite:nth-child(1) { grid-column: 1 / span 6; }
  .invite:nth-child(2) { grid-column: 8 / span 3; margin-top: 8rem; }
}
.faq { margin-top: 2.4rem; border-top: 1px solid rgba(20, 22, 20, .2); }
.faq details { border-bottom: 1px solid rgba(20, 22, 20, .2); }
.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; min-height: 56px; padding: 1.2rem 0; font: 400 clamp(1.25rem, 2.4vw, 1.6rem)/1.25 var(--serif); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--sans); font-weight: 300; font-size: 1.6rem; line-height: 1; color: var(--or-encre); transition: transform var(--t-court) var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq summary:focus-visible { outline-offset: -2px; }
.faq details p { margin: 0 0 1.3rem; color: var(--encre-2); max-width: 46rem; }
@media (hover: hover) { .faq summary:hover { color: var(--or-encre); } }

/* Salle : la photo en très grand, la vidéo d'ouverture */
.salle-large { margin: 0; }
.salle-large .ph__cadre { height: 72svh; min-height: 320px; }
.salle-large figcaption { padding: 0 var(--pad-r) 0 var(--pad-l); }
.salle-ctrl { position: absolute; z-index: 3; right: .8rem; bottom: .8rem; }
@media (min-width: 900px) { .salle-large .ph__cadre { height: 92vh; } }

/* ---------- Page système ---------- */
.sys code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .85em; padding: .05em .3em; background: rgba(214, 190, 131, .14); }
.papier.s code, .sys .papier code { background: rgba(20, 22, 20, .07); }
@media (min-width: 900px) { .sys-ouv { padding-top: 150px; min-height: 0; padding-bottom: 6rem; } }
.sys-intention { display: grid; gap: 1.2rem; max-width: 60rem; margin-top: 1rem; }
@media (min-width: 900px) { .sys-intention { grid-template-columns: 1.1fr 1fr; gap: 3rem; } }
.sys-grille { position: relative; margin-top: 3rem; height: 15rem; }
.sys-grille .g { position: absolute; inset: 0; }
.sys-grille .g i { background: rgba(122, 99, 48, .1); border-inline: 1px solid rgba(122, 99, 48, .25); }
.sys-grille .g i:nth-child(n+5) { display: none; }
.sys-grille__fil { position: absolute; top: -1rem; bottom: -1rem; left: calc(var(--axe) - var(--pad-l)); width: 1px; background: var(--or-encre); }
.sys-grille__blocs { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: start; }
.sys-grille__blocs b { grid-column: auto / span 4 !important; display: none; }
.sys-grille__blocs b:first-child { display: block; }
.sys-grille__blocs b { height: 5.5rem; background: var(--fond); color: var(--accent); font: italic 300 2.4rem/5.5rem var(--serif); padding-left: 1rem; }
@media (min-width: 900px) {
  .sys-grille .g i:nth-child(n+5) { display: block; }
  .sys-grille__blocs { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .sys-grille__blocs b { display: block; }
  .sys-grille__blocs b:nth-child(1) { grid-column: 1 / span 4 !important; }
  .sys-grille__blocs b:nth-child(2) { grid-column: 5 / span 4 !important; }
  .sys-grille__blocs b:nth-child(3) { grid-column: 9 / span 4 !important; }
}
.sys-typo { margin-top: 3rem; display: grid; gap: 0; }
.sys-typo > div { padding: 1.6rem 0; border-top: 1px solid rgba(214, 190, 131, .25); }
.sys-typo__tag { display: block; margin-bottom: .8rem; font: 500 .7rem/1.4 var(--sans); letter-spacing: .08em; color: var(--brume); }
.papier .sys-typo__tag { color: var(--encre-2); }
.sys-coul { margin-top: 3rem; display: grid; grid-template-columns: 1fr 1fr; gap: var(--col-gap); }
.sys-coul li { background: var(--c); color: var(--t); padding: 1.1rem 1rem 1.2rem; min-height: 11rem; display: flex; flex-direction: column; border: 1px solid rgba(20, 22, 20, .12); }
.sys-coul b { font: 400 1.6rem/1.1 var(--serif); }
.sys-coul span { font-size: .8rem; letter-spacing: .06em; margin: .3rem 0 auto; }
.sys-coul em { font-style: normal; font-size: .74rem; line-height: 1.4; margin-top: 1rem; }
@media (min-width: 900px) { .sys-coul { grid-template-columns: repeat(4, 1fr); } }
.sys-comp, .sys-mouv { margin-top: 3rem; display: grid; gap: var(--col-gap); }
.sys-carte { padding: 1.5rem; border: 1px solid rgba(214, 190, 131, .25); }
.sys-carte.papier { border-color: transparent; }
@media (min-width: 900px) {
  .sys-comp { grid-template-columns: repeat(2, 1fr); }
  .sys-mouv { grid-template-columns: 1fr 1fr; align-items: start; }
}
.sys-demo { margin: 1.2rem 0 1.5rem; font: 300 clamp(2.4rem, 6vw, 4rem)/.98 var(--serif); }
.sys-demo span { display: block; opacity: 0; transform: translate3d(0, -26px, 0); }
.sys-demo span:nth-child(2) { padding-left: .9em; } .sys-demo span:nth-child(3) { padding-left: 1.8em; }
.sys-demo.joue span { opacity: 1; transform: none; transition: opacity 1s var(--ease), transform var(--t-descente) var(--ease-out); }
.sys-demo.joue span:nth-child(2) { transition-delay: .13s; } .sys-demo.joue span:nth-child(3) { transition-delay: .26s; }
.sys-var { margin-top: 3rem; display: grid; gap: var(--col-gap); }
.sys-var__col { padding: 1.6rem 1.4rem 2rem; border: 1px solid rgba(20, 22, 20, .15); overflow: hidden; }
.sys-var__col .display { font-size: clamp(2.6rem, 9vw, 5.6rem); }
.sys-var__col--nuit { background: var(--fond); color: var(--texte); }
.sys-var__col--nuit .sys-typo__tag { color: var(--brume); }
.sys-var__titre { margin: 0; font: 800 clamp(3.2rem, 12vw, 7.6rem)/.9 "Big Shoulders Display", Impact, sans-serif; text-transform: uppercase; letter-spacing: .005em; }
.sys-var__titre span { display: block; }
.sys-var__titre span:nth-child(2) { padding-left: .5em; }
.sys-var__titre .sys-var__it { padding-left: 1em; font-family: var(--serif); font-weight: 300; font-style: italic; text-transform: none; color: var(--accent); letter-spacing: -.01em; }
@media (min-width: 900px) { .sys-var { grid-template-columns: 1fr 1fr; } }
@media (prefers-reduced-motion: reduce) { .sys-demo span { transform: none; } }

/* ---------- Mouvement réduit : plus de translation, le zoom lent reste, ralenti ---------- */
@media (prefers-reduced-motion: reduce) {
  .js [data-e] { animation: entree-douce .4s linear both; animation-delay: 0s; }
  @keyframes entree-douce { from { opacity: 0; } to { opacity: 1; } }
  .js [data-d] { transform: none; }
  .js [data-d].est-la { transition: opacity .3s linear; }
  .bande { -webkit-mask-image: none; mask-image: none; }
  .bande__piste { animation: none; flex-wrap: wrap; width: auto; }
  .bande__piste > ul[aria-hidden] { display: none; }
  .bande ul { flex-wrap: wrap; justify-content: center; padding: 0 var(--pad-r) 0 var(--pad-l); }
  .bande__pause { display: none; }
  .js .respire > img { animation-duration: 90s; }
  .panneau ol a { transform: none; transition: opacity .2s linear; }
  .js .hauteur__ph .regle { transform: none; transition: none; }
  .fil__trace, .fil__anneau { display: none; }
  html { scroll-behavior: auto; }
}

/* =====================================================================
   Site complet : les bons menus, le contact, les pages ajoutées
   ===================================================================== */
[hidden] { display: none !important; }

/* ---------- Menu : rubriques, application, langue ---------- */
@media (min-width: 1280px) {
  .nav { gap: clamp(.9rem, 1.5vw, 1.7rem); }
  .nav a { font-size: .7rem; letter-spacing: .12em; }
}
.nav a.est-section { color: var(--accent); }
.nav a.est-section::after { transform: scaleX(1); opacity: .45; }
.langue { display: inline-flex; align-items: center; gap: .15rem; padding-left: .9rem; border-left: 1px solid rgba(243, 240, 232, .28); }
.nav .langue a { padding: .85rem .3rem; letter-spacing: .1em; color: var(--brume); }
.nav .langue a[aria-current="true"] { color: var(--texte); }
.nav .langue a::after { left: .3rem; right: .3rem; }
.nav .langue a[aria-current="true"]::after { transform: scaleX(1); }
.panneau ol a { font-size: clamp(2rem, 9.4vw, 3.4rem); }
.panneau ol a.est-section { color: var(--accent); }
.panneau__plus { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1.4rem; margin-top: 1.4rem; }
.panneau__plus > a, .panneau .langue a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; font: 600 .72rem/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--texte); }
.panneau__plus .panneau__parler { padding: 0 1rem; border: 1px solid rgba(214, 190, 131, .6); color: var(--accent); }
.panneau .langue { padding-left: 1rem; }
.panneau .langue a { padding: 0 .45rem; color: var(--brume); }
.panneau .langue a[aria-current="true"] { color: var(--accent); }
.panneau li:nth-child(4) a { transition-delay: .15s; }

/* Retour vers la rubrique, dans l'étiquette d'une page de spectacle */
.retour { color: inherit; text-decoration: underline; text-underline-offset: .3em; text-decoration-thickness: 1px; }
.retour:hover { color: var(--texte); }

/* ---------- Ouvertures plein écran : photo qui respire, titres longs ---------- */
.scene__media.respire { overflow: hidden; }
.scene--photo .scene__media img { object-position: var(--cadre-x, 50%) var(--cadre-y, 50%); }
.scene .display.chute { font-size: clamp(3.3rem, 15vw, 10.5rem); line-height: .9; }
.scene .display.scene__titre-long, .scene--haute .display.chute { font-size: clamp(2.7rem, 11.5vw, 8.4rem); }
@media (min-width: 900px) {
  .scene .display.chute { font-size: clamp(5rem, 9vw, 10.5rem); }
  .scene .display.scene__titre-long, .scene--haute .display.chute { font-size: clamp(4.4rem, 7.2vw, 8.4rem); }
}

/* Ouverture de page sans photo (programmateurs, mentions) */
.ouv-texte { position: relative; padding: 132px var(--pad-r) clamp(4rem, 9vw, 7rem) var(--pad-l); }
.ouv-texte .display { font-size: clamp(3rem, 13vw, 9rem); margin-bottom: 2rem; }
.ouv-texte--court { padding-bottom: 3rem; }
.ouv-texte__bas { display: grid; gap: 2rem; }
.ouv-texte__contact { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.4rem; }
.ouv-texte__contact a:not(.btn) { display: inline-flex; align-items: center; min-height: 44px; color: var(--texte); text-decoration: none; border-bottom: 1px solid rgba(214, 190, 131, .5); }
@media (min-width: 900px) {
  .ouv-texte { padding-top: 190px; }
  .ouv-texte__bas { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: end; }
  .ouv-texte__bas .lead { grid-column: 1 / span 6; margin: 0; }
  .ouv-texte__contact { grid-column: 8 / span 5; }
}

/* ---------- Sommaire (créations, compagnie) ---------- */
.sommaire { display: grid; border-top: 1px solid rgba(20, 22, 20, .2); }
.sommaire a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 54px; padding: .5rem 0; border-bottom: 1px solid rgba(20, 22, 20, .2); font: 400 1.22rem/1.2 var(--serif); text-decoration: none; transition: color var(--t-court) var(--ease); }
.sommaire a:hover { color: var(--or-encre); }
.sommaire--court { margin-top: 2rem; border-top-color: rgba(214, 190, 131, .3); }
.sommaire--court a { border-bottom-color: rgba(214, 190, 131, .3); }
.sommaire--court a:hover { color: var(--accent); }
@media (min-width: 900px) { .intro-sp .sommaire { grid-column: 8 / span 5; align-self: end; } .sommaire--court { max-width: 30rem; } }

/* ---------- Créations : trois formes, trois hauteurs ---------- */
.cartes { display: grid; gap: 3.5rem; margin-top: 3rem; }
.carte a { display: block; text-decoration: none; }
.carte .ph__cadre { aspect-ratio: 4 / 5; }
.carte.carte--poupet .ph__cadre { aspect-ratio: 3 / 2; }
.carte .label { margin: 1.5rem 0 .6rem; }
.carte__titre { display: block; font: 300 clamp(2.1rem, 6vw, 3.1rem)/1.02 var(--serif); margin-bottom: .8rem; transition: color var(--t-court) var(--ease); }
.carte__texte { display: block; color: var(--brume); max-width: 36ch; }
.carte .lien { margin-top: .4rem; }
@media (hover: hover) { .carte a:hover .carte__titre { color: var(--accent); } .carte a:hover .lien::after { transform: scaleX(1); } }
@media (min-width: 900px) {
  .cartes { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1.5rem, 3vw, 3.5rem); align-items: start; }
  .carte .ph__cadre { aspect-ratio: 2 / 3; }
  .carte:nth-child(2) { margin-top: 8rem; }
  .carte:nth-child(3) { margin-top: 3.5rem; }
}

/* ---------- Créations : les années ---------- */
/* Album: photos first, one year at a time; full stories remain native details without JS. */
.album .h2 { font-size: clamp(2.3rem, 5vw, 4.4rem); }
.album-filtres { display:flex; flex-wrap:wrap; gap:.45rem; margin:1.7rem 0 1.4rem; }
.album-filtres[hidden], .souvenir[hidden] { display:none; }
.album-filtres button { min-height:44px; min-width:52px; padding:.5rem .9rem; border:1px solid #a99c7f; border-radius:50px; color:var(--nuit); background:transparent; cursor:pointer; font-size:.85rem; }
.album-filtres button[aria-pressed=true] { background:var(--nuit); color:var(--papier); border-color:var(--nuit); }
.album-grille { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:1.5rem 1rem; }
.souvenir { min-width:0; }
.souvenir summary { display:block; list-style:none; cursor:pointer; }
.souvenir summary::-webkit-details-marker { display:none; }
.souvenir-photo { display:block; position:relative; background:#fff; padding:7px; box-shadow:0 3px 12px #14161414; transform:rotate(-1deg); transition:transform .25s ease; }
.souvenir-video-badge { position:absolute; bottom:15px; right:15px; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; color:#141614; background:#d8c185; font-size:.8rem; }
.souvenir:nth-child(2n) .souvenir-photo { transform:rotate(1deg); }
.souvenir-photo img { aspect-ratio:4/3; width:100%; height:auto; object-fit:cover; }
.souvenir-photo--affiche img { object-fit:contain; background:#f3f0e8; }
.souvenir-galerie.souvenir-galerie--intervenants { display:flex; gap:1rem; overflow-x:auto; padding-bottom:.75rem; scroll-snap-type:x proximity; }
.souvenir-galerie--intervenants figure { flex:0 0 126px; min-width:0; margin:0; scroll-snap-align:start; }
.souvenir-galerie.souvenir-galerie--intervenants img { width:100%; height:158px; object-fit:contain; background:transparent; }
.souvenir-galerie--intervenants figcaption { font-size:.72rem; line-height:1.4; margin-top:.5rem; }
.souvenir-legende { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.25rem .6rem; padding:.8rem .25rem; }
.souvenir-annee { grid-column:1/-1; font:.72rem/1.4 var(--sans); color:var(--or-encre); }
.souvenir-titre { font:500 clamp(1.2rem,1.8vw,1.6rem)/1.1 var(--serif); overflow-wrap:anywhere; }
.souvenir-plus { align-self:center; color:var(--or-encre); }
.souvenir--texte { grid-column:1/-1; border-top:1px solid #a99c7f; }
.souvenir--texte .souvenir-legende { min-height:44px; grid-template-columns:3rem minmax(0,1fr) auto; align-items:center; gap:.8rem; }
.souvenir--texte .souvenir-annee { grid-column:auto; }
.souvenir--texte .souvenir-titre { font-size:clamp(1.1rem,1.6vw,1.4rem); line-height:1.3; }
.souvenir--texte + .souvenir--texte { margin-top:-.75rem; }
.souvenir-contenu { padding:1rem 0; }
.souvenir-contenu > span { display:block; margin-top:1rem; }
.souvenir-contenu > .annee__porteur { font-size:.75rem; color:var(--or-encre); }
.souvenir-stages { margin:1rem 0; }
.souvenir-stages li { padding:.7rem 0; border-bottom:1px solid #a99c7f; }
.souvenir-galerie { display:grid; gap:1.8rem; margin-top:1.5rem; }
.souvenir-galerie:empty { display:none; }
.souvenir-galerie figure { margin:0; }
.souvenir-galerie img { width:100%; height:auto; max-height:68svh; object-fit:contain; background:var(--nuit); }
.souvenir-galerie figcaption { font-size:.75rem; line-height:1.5; margin-top:.55rem; }
.souvenir-video { display:block; position:relative; }
.souvenir-video .jouer { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:54px; height:54px; background:var(--nuit); box-shadow:0 0 0 1px #d8c185; }
.souvenir-source { display:block; width:fit-content; margin-top:.4rem; padding:.4rem 0; text-underline-offset:.25em; }
.album-dialog { padding:0; border:0; width:min(900px,calc(100% - 32px)); max-height:90svh; overflow:auto; background:var(--papier); color:var(--nuit); overscroll-behavior:contain; }
.album-dialog::backdrop { background:#080a08db; }
.album-dialog-bar { display:flex; justify-content:flex-end; position:sticky; top:0; z-index:2; background:var(--papier); padding:.5rem 1rem; border-bottom:1px solid #a99c7f; }
.album-fermer { min-height:44px; padding:.5rem .7rem; border:0; background:none; color:inherit; cursor:pointer; font-size:.9rem; }
.album-fermer span { margin-left:1rem; font-size:1.4rem; }
.album-dialog-contenu { padding:0 clamp(1rem,4vw,2.5rem) 1.5rem; }
body.album-ouvert { overflow:hidden; }
@media (min-width:700px) { .album-grille { grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.6rem; } }
@media (min-width:1250px) { .album-grille { grid-template-columns:repeat(4,minmax(0,1fr)); gap:2rem; } }
@media (hover:hover) { .souvenir summary:hover .souvenir-photo { transform:rotate(0deg) translateY(-3px); } }
@media (prefers-reduced-motion:reduce) { .souvenir-photo { transition:none; } }
.annees { margin-top: 3rem; }
.annee { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr); gap: 1rem; padding: 1.7rem 0; border-top: 1px solid rgba(20, 22, 20, .18); }
.annee__an { font: italic 300 2.3rem/1 var(--serif); font-variant-numeric: lining-nums; color: var(--or-encre); }
.annee ul { display: grid; gap: 1.1rem; }
.annee li b { display: block; font: 400 1.3rem/1.2 var(--serif); font-variant-numeric: lining-nums; }
.annee li > span { display: block; font-size: .88rem; color: var(--encre-2); }
.annee li > .annee__porteur { display: inline-block; margin-top: .45rem; padding: .15rem .55rem; border: 1px solid rgba(122, 99, 48, .6); font: 600 .64rem/1.5 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--or-encre); }
.annee__ph { margin-top: 1rem; max-width: 28rem; }
.annee__ph .ph__cadre { aspect-ratio: 16 / 10; }
@media (min-width: 900px) {
  .annee { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); padding: 2.2rem 0; }
  .annee__an { grid-column: 1 / span 2; font-size: 3.6rem; }
  .annee ul { grid-column: 4 / span 9; grid-template-columns: 1fr 1fr; column-gap: 2.5rem; row-gap: 1.4rem; align-items: start; }
}

/* ---------- Les formes proposées, depuis une page de spectacle ---------- */
.formes__liste { display: grid; gap: 1.2rem; margin: 1.6rem 0 2rem; }
.formes__liste a { display: block; padding: 1.4rem 0 1.4rem 1.3rem; border-left: 1px solid var(--fil); text-decoration: none; }
.formes__titre { display: block; margin: .2rem 0 .7rem; font: 300 clamp(2.4rem, 9vw, 5rem)/1 var(--serif); transition: color var(--t-court) var(--ease); }
.formes__texte { display: block; max-width: 40ch; color: var(--brume); }
@media (hover: hover) { .formes__liste a:hover .formes__titre { color: var(--accent); } .formes__liste a:hover .lien::after { transform: scaleX(1); } }
@media (min-width: 900px) {
  .formes__liste { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); }
  .formes__liste li:nth-child(1) { grid-column: 1 / span 5; }
  .formes__liste li:nth-child(2) { grid-column: 7 / span 5; margin-top: 7rem; }
  .formes__liste:has(> li:nth-child(3)) { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .formes__liste:has(> li:nth-child(3)) > li { grid-column:auto; margin-top:0; }
  .formes__liste:has(> li:nth-child(3)) .formes__titre { font-size:clamp(2rem,3vw,3rem); }
}
.programme-seul { max-width: 42rem; }
@media (min-width: 900px) { .programme-seul { margin-left: 16.66%; } }

/* ---------- Duo : les scènes ---------- */
.scenes { margin: 1.6rem 0; display: grid; }
.scenes li { display: grid; gap: .1rem; padding: .8rem 0; border-top: 1px solid rgba(214, 190, 131, .28); }
.papier .scenes li { border-top-color: rgba(20, 22, 20, .16); }
.scenes b { font: 400 1.18rem/1.25 var(--serif); }
.scenes span { font-size: .86rem; color: var(--brume); }
.papier .scenes span { color: var(--encre-2); }
.duo-salut .ph__cadre { aspect-ratio: 4 / 5; }
@media (min-width: 900px) { .duo-salut { align-self: end; } .duo-salut .ph__cadre { aspect-ratio: 3 / 4; } }

/* ---------- Accueil : les artistes, des noms suspendus ---------- */
.suspendu--nom::before { left: 0; }
.suspendu--nom a { display: block; padding: .7rem 0 0 1rem; border-left: 1px solid rgba(214, 190, 131, .35); text-decoration: none; }
.suspendu__nom { display: block; font: 300 clamp(1.7rem, 5.4vw, 2.7rem)/1.04 var(--serif); transition: color var(--t-court) var(--ease); }
.suspendu__art { display: block; margin: .5rem 0 .1rem; font-size: .8rem; color: var(--brume); }
@media (hover: hover) { .suspendu--nom a:hover .suspendu__nom { color: var(--accent); } }
.suspendus--portraits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 2rem; }
.suspendus--portraits .suspendu { padding: 0; margin: 0; }
.suspendus--portraits .suspendu::before { display: none; }
.suspendus--portraits .suspendu a { height: 100%; padding: 0; border: 0; }
.suspendus--portraits img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; margin-bottom: .7rem; }
.suspendus--portraits .suspendu__nom { font-size: clamp(1.4rem, 3.2vw, 2.1rem); }
@media (max-width: 699px) {
  .suspendus--portraits { display: flex; overflow-x: auto; gap: .75rem; margin-inline: calc(var(--pad-l) * -1) calc(var(--pad-r) * -1); padding-inline: var(--pad-l) var(--pad-r); scroll-snap-type: x mandatory; scroll-padding-inline-start: var(--pad-l); overscroll-behavior-inline: contain; }
  .suspendus--portraits li { flex: 0 0 min(58vw, 250px); scroll-snap-align: start; }
}
@media (min-width: 1000px) { .suspendus--portraits { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.4rem; } }
.medias--texte .media { border-top: 1px solid rgba(20, 22, 20, .2); padding-top: 1.2rem; }
.medias--texte .media__src { margin-top: 0; }

/* ---------- Compagnie : profils ---------- */
.ouverture__raccourcis { grid-area: det; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.25rem; margin-top: 1.5rem; }
.ouverture__raccourcis a { display: flex; justify-content: space-between; align-items: center; gap: .5rem; min-height: 44px; border-top: 1px solid rgba(214, 190, 131, .35); color: var(--texte); text-decoration: none; font: 500 .8rem/1.35 var(--sans); }
.ouverture__raccourcis a span { color: var(--accent); }
.ouverture__raccourcis a:hover, .ouverture__raccourcis a:focus-visible { color: var(--accent); }
@media (min-width: 900px) { .ouverture__bas { grid-template-columns: minmax(0, 1fr) 210px; } .ouverture__raccourcis { grid-template-columns: 1fr; margin-top: 0; } }
@media (max-width: 899px) { .ouverture__ph .ph__cadre { height: 52svh; min-height: 300px; max-height: 480px; } }
.profils { display: grid; gap: clamp(4.5rem, 11vw, 9rem); margin-top: 3.5rem; }
.profil { display: grid; gap: 1.6rem; scroll-margin-top: 90px; }
.profil__ph { width: 72%; }
.profil:nth-child(even) .profil__ph { margin-left: auto; }
.profil__ph .ph__cadre { aspect-ratio: 3 / 4; }
.profil__art { font: 600 var(--s-label)/1.5 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--or-encre); margin: 0 0 1.2rem; }
.profil .label { margin: 1.8rem 0 .5rem; }
.profil h4 { margin: 0 0 .4rem; font: 400 1.4rem/1.2 var(--serif); }
.profil .lien { margin-right: 1.4rem; }
.profil__texte > p:not([class]) { max-width: 40rem; }
@media (min-width: 900px) {
  .profil { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: start; }
  .profil__ph { width: auto; grid-column: 1 / span 4; grid-row: 1; }
  .profil__texte { grid-column: 6 / span 6; grid-row: 1; padding-top: 3rem; }
  .profil:nth-child(even) .profil__ph { grid-column: 9 / span 4; margin: 5rem 0 0; }
  .profil:nth-child(even) .profil__texte { grid-column: 2 / span 6; }
}
.refs li .lien { min-height: 40px; padding: .6rem 0 .5rem; font-size: .68rem; }
@media (min-width: 900px) { .refs--long { grid-template-columns: repeat(4, 1fr); } }
.refs--logos li { min-width: 0; }
.refs--logos .logo-partenaire { margin: 0 0 1.2rem; }
.refs--logos .logo-partenaire__cadre { display: flex; width: 96px; height: 96px; }
.refs--logos .logo-partenaire__nom { display: none; }
@media (min-width: 900px) { .refs--logos .logo-partenaire__cadre { width: 112px; height: 112px; } }
.refs--apercu { margin-bottom: 2rem; }
.profil__details { margin-top: 1.1rem; border-top: 1px solid rgba(20, 22, 20, .18); }
.profil__details summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: .5rem; cursor: pointer; color: var(--or-encre); font: 600 .72rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; list-style: none; }
.profil__details summary::-webkit-details-marker { display: none; }
.profil__details summary::after { content: '+'; font-size: 1.2rem; font-weight: 400; }
.profil__details[open] summary::after { content: '−'; }
.profil__details > p, .profil__details > ul, .profil__details > h4, .profil__details > a { margin-top: 1rem; }
@media (min-width: 900px) {
  .profils__aide { display: none; }
  .profils { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
  .profil, .profil:nth-child(even) { display: block; min-width: 0; }
  .profil__ph, .profil:nth-child(even) .profil__ph { width: 100%; margin: 0 0 1.3rem; }
  .profil__texte, .profil:nth-child(even) .profil__texte { padding: 0; }
  .profil__texte > p:not([class]) { font-size: .85rem; line-height: 1.55; }
  .profil .h3 { font-size: clamp(1.5rem, 2vw, 2rem); }
}
@media (max-width: 899px) {
  #parcours { --ancre-padding: 3.2rem; padding-top: 3.2rem; padding-bottom: 4rem; }
  .profils__entete .h2 { max-width: 10ch; margin-bottom: 0; }
  .profils { display: flex; align-items: flex-start; gap: .8rem; margin: 1.1rem calc(var(--pad-r) * -1) 0 calc(var(--pad-l) * -1); padding: 0 var(--pad-r) 1.2rem var(--pad-l); overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline-start: var(--pad-l); overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
  .profil, .profil:nth-child(even) { position: relative; flex: 0 0 min(72vw, 320px); display: block; min-width: 0; scroll-snap-align: start; }
  .profil__ph, .profil:nth-child(even) .profil__ph { width: 100%; margin: 0 0 .75rem; }
  .profil__ph .ph__cadre { aspect-ratio: 4 / 5; }
  .profil::before { content: attr(data-index); position: absolute; z-index: 2; top: .7rem; left: .7rem; padding: .3rem .55rem; color: var(--texte); background: rgba(20, 22, 20, .82); font: 500 .75rem/1 var(--sans); letter-spacing: .14em; }
  .profil .h3 { margin: 0 0 .2rem; font-size: clamp(1.6rem, 7vw, 2rem); line-height: 1.05; }
  .profil__art { margin-bottom: .25rem; font-size: .65rem; letter-spacing: .12em; }
  .profil__details { margin-top: .25rem; }
  .profil__texte { padding: 0; }
  .profil__texte > p:not([class]) { font-size: .85rem; line-height: 1.55; }
}
.profils__entete { display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; }
.profils__navigation { display: flex; align-items: center; gap: .4rem; margin-bottom: .25rem; white-space: nowrap; }
.profils__compteur { min-width: 4.5rem; color: var(--or-encre); font: 600 .72rem/1 var(--sans); letter-spacing: .14em; }
.profils__fleche { width: 44px; height: 44px; border: 1px solid rgba(20, 22, 20, .36); background: transparent; color: var(--nuit); cursor: pointer; font: 400 1.35rem/1 var(--sans); }
.profils__fleche:disabled { opacity: .3; cursor: default; }
.profils__fleche:focus-visible, .profils:focus-visible { outline: 2px solid var(--or-encre); outline-offset: 3px; }
.profils__note { margin: 1.2rem 0 0; font-size: .9rem; }
.profil__image-lien { display: block; text-decoration: none; }
.profil__image-lien:focus-visible { outline: 2px solid var(--or-encre); outline-offset: 3px; }
.profil__fiche { display: flex; justify-content: space-between; gap: .8rem; align-items: center; min-height: 44px; border-top: 1px solid rgba(20, 22, 20, .25); color: var(--or-encre); font: 600 .72rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; }
.profil__fiche:focus-visible { outline: 2px solid var(--or-encre); outline-offset: 2px; }
@media (min-width: 900px) { .profils__navigation { display: none; } }
@media (max-width: 899px) { .profils__entete { display: block; } .profils__navigation { justify-content: flex-end; margin-top: 1rem; } }

.editorial-visuel { display: grid; gap: 2rem; align-items: center; }
.editorial-visuel__ph .ph__cadre { aspect-ratio: 4 / 5; }
.editorial-visuel--technique .ph__cadre { aspect-ratio: 4 / 5; }
.equipement-categories { display: grid; gap: 0; margin: 1.6rem 0; border-top: 1px solid rgba(20, 22, 20, .2); }
.equipement-categories li { display: grid; gap: .2rem; padding: .75rem 0; border-bottom: 1px solid rgba(20, 22, 20, .2); }
.equipement-categories b { font: 400 1.28rem/1.1 var(--serif); }
.equipement-categories span { color: var(--encre-2); font-size: .88rem; line-height: 1.45; }
.artiste-page { display: grid; min-height: 100svh; background: var(--fond); color: var(--texte); }
.artiste-page__ph .ph__cadre { height: 56svh; min-height: 340px; }
.artiste-page__ph img { object-position: center 28%; }
.artiste-page__texte { padding: 2rem var(--pad-r) 4rem var(--pad-l); }
.artiste-page__texte .display { font-size: clamp(3.2rem, 12vw, 8rem); line-height: .9; margin: 1rem 0 2rem; }
.artiste-page__texte .lead { margin-bottom: 1.1rem; }
.artiste-page__texte > p:not(.lead):not(.label) { max-width: 48ch; color: var(--brume); }
.artiste-page__suite .h2 { max-width: 14ch; }
.artiste-points { display: grid; gap: 0; max-width: 65rem; border-top: 1px solid rgba(20, 22, 20, .2); }
.artiste-points li { display: grid; gap: .25rem; padding: 1rem 0; border-bottom: 1px solid rgba(20, 22, 20, .2); }
.artiste-points b { font: 400 1.32rem/1.15 var(--serif); }
.artiste-points span { color: var(--encre-2); font-size: .9rem; line-height: 1.5; }
.artiste-page__complement { margin-top: 2rem; max-width: 55ch; }
.artiste-page__retour { display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; padding-block: 3rem; }
@media (min-width: 900px) {
  .artiste-page { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
  .artiste-page__ph { margin-top: 68px; }
  .artiste-page__ph .ph__cadre { height: calc(100svh - 68px); min-height: 690px; }
  .artiste-page__texte { align-self: center; padding-top: 120px; padding-bottom: 4rem; }
  .artiste-points li { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 2rem; }
}
@media (max-width: 899px) {
  .editorial-visuel__ph { margin: .3rem calc(var(--pad-r) * -1) 0 calc(var(--pad-l) * -1); }
  .editorial-visuel__ph .ph__cadre { aspect-ratio: 5 / 4; }
  .editorial-visuel--technique .ph__cadre { aspect-ratio: 3 / 4; }
  .editorial-visuel__ph figcaption { padding-inline: var(--pad-l); }
}
@media (min-width: 900px) { .editorial-visuel { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(3rem, 6vw, 7rem); } .editorial-visuel > div { grid-column: 1; grid-row: 1; } .editorial-visuel__ph { grid-column: 2; grid-row: 1; } }
.medias__pile { display: grid; gap: 2.6rem; }
.media--texte { border-top: 1px solid rgba(214, 190, 131, .3); padding-top: 1.2rem; }
.media--texte .media__src { margin-top: 0; }
.archives__titre { margin-top: clamp(4rem, 9vw, 6rem); }
.archives { display: grid; gap: 2.2rem; }
.archives article { border-top: 1px solid rgba(214, 190, 131, .3); padding-top: 1.2rem; }
.archives h4 { margin: 0 0 .5rem; font: 400 1.5rem/1.15 var(--serif); }
@media (min-width: 900px) { .archives { grid-template-columns: 1fr 1fr; column-gap: 3rem; } }
.presentation { margin: 0 0 .8rem; padding-left: 1.2rem; border-left: 1px solid var(--or-encre); font: italic 300 clamp(1.25rem, 2vw, 1.5rem)/1.45 var(--serif); }
.telechargements { margin-top: clamp(3rem, 7vw, 5rem); }
.fichiers li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .2rem 1.2rem; padding: .6rem 0; border-top: 1px solid rgba(20, 22, 20, .18); }
.fichiers li > span { font-size: .9rem; max-width: 52ch; }
.logos-kit { display: grid; grid-template-columns: 1fr 1fr; gap: var(--col-gap); margin-top: 2rem; max-width: 40rem; }
.logos-kit figure { margin: 0; padding: 1.6rem 1rem 1.2rem; display: flex; flex-direction: column; align-items: center; gap: 1rem; text-align: center; }
.logos-kit img { width: 58px; height: auto; }
.logos-kit figcaption { font-size: .8rem; display: grid; gap: .2rem; }
.logos-kit figcaption a { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; }
.logos-kit__sombre { background: var(--fond); color: var(--texte); }
.logos-kit__clair { background: #fff; color: var(--nuit); border: 1px solid rgba(20, 22, 20, .15); }

/* ---------- Accompagnement ---------- */
.disciplines { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 1.8rem; }
.disciplines li { padding: .45rem .75rem; border: 1px solid rgba(214, 190, 131, .5); font: 600 .66rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.papier .disciplines--offre { margin: 2rem 0; }
.papier .disciplines--offre li { border-color: rgba(122, 99, 48, .45); color: var(--or-encre); }
@media (min-width: 900px) {
  .ouv-page--cie .ouv-page__texte { grid-column: 1 / span 6; padding-top: clamp(10rem, 18vh, 14rem); padding-bottom: 5rem; }
  .ouv-page--cie .ouv-page__ph { grid-column: 7 / span 6; }
  .ouv-page--cie .display { font-size: clamp(4.4rem, 6.5vw, 7rem); line-height: .92; margin-bottom: 1.5rem; }
  .ouv-page--cie .lead { max-width: 27ch; }
  .ouv-page--cie .actions { margin-top: 2rem; }
}
.generique { font: italic 400 1.25rem/1.35 var(--serif); color: var(--accent); }
.etapes--rise .etape > .label { margin: 0 0 .5rem; }
.etapes--rise .etape h3 { color: var(--texte); }
@media (min-width: 900px) { .etapes--rise .etape:nth-child(2) { margin-left: 30%; } .etapes--rise .etape:nth-child(3) { margin-left: 60%; } }
@media (min-width: 900px) {
  .deroule--cinq { grid-template-columns: repeat(5, 1fr); }
  .deroule--cinq li:nth-child(2) { margin-top: 3.5rem; } .deroule--cinq li:nth-child(3) { margin-top: 7rem; }
  .deroule--cinq li:nth-child(4) { margin-top: 10.5rem; } .deroule--cinq li:nth-child(5) { margin-top: 14rem; }
}
.cadre-note { margin-top: clamp(3rem, 7vw, 5rem); padding: 1.4rem 1.5rem; border-left: 2px solid var(--or-encre); background: rgba(20, 22, 20, .045); max-width: 54rem; }
.cadre-note p { color: var(--encre-2); }
.cadre-note p:last-child { margin: 0; }
.cadre-note b { color: var(--nuit); font-weight: 600; }

/* ---------- Programmateurs : trois fiches ---------- */
.fiches-prog { margin-top: 3rem; }
.fiche-prog { display: grid; padding: 2.6rem 0; border-top: 1px solid rgba(20, 22, 20, .2); }
.fiche-prog__num { margin: 0 0 1rem; font: italic 300 clamp(4.5rem, 18vw, 11rem)/.8 var(--serif); font-variant-numeric: lining-nums; color: var(--or-encre); }
@media (min-width: 900px) {
  .fiche-prog { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); padding: 3.5rem 0; }
  .fiche-prog__num { grid-column: 1 / span 3; }
  .fiche-prog__corps { grid-column: 5 / span 7; }
  .fiche-prog:nth-child(2) .fiche-prog__num { grid-column: 2 / span 3; } .fiche-prog:nth-child(2) .fiche-prog__corps { grid-column: 6 / span 7; }
  .fiche-prog:nth-child(3) .fiche-prog__num { grid-column: 3 / span 3; } .fiche-prog:nth-child(3) .fiche-prog__corps { grid-column: 6 / span 7; }
}
.actions--col { flex-direction: column; align-items: stretch; gap: .6rem; }

/* ---------- Mentions légales ---------- */
.legal__bloc { display: grid; gap: .6rem; padding: 2rem 0; border-top: 1px solid rgba(20, 22, 20, .18); }
.legal__titre { font: 400 1.6rem/1.15 var(--serif); }
.legal__texte p { max-width: 46rem; color: var(--encre-2); }
.legal__texte a { color: var(--nuit); text-underline-offset: .2em; }
@media (min-width: 900px) {
  .legal__bloc { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); padding: 2.6rem 0; }
  .legal__titre { grid-column: 1 / span 4; }
  .legal__texte { grid-column: 5 / span 8; }
}

/* ---------- Séances photo, salle : ajustements ---------- */
@media (min-width: 900px) {
  .galerie--deux .ph:nth-child(1) { grid-column: 2 / span 4; }
  .galerie--deux .ph:nth-child(1) .ph__cadre { aspect-ratio: 2 / 3; }
  .galerie--deux .ph:nth-child(2) { grid-column: 7 / span 6; margin-top: 9rem; }
}
@media (max-width: 800px) {
  .ouv-page--photo .ouv-page__ph--video .ph__cadre { aspect-ratio: 4 / 5; max-height: 80svh; }
}

/* ---------- La salle en direct (données de l'application) ---------- */
.direct__statut { padding: 1.4rem 1.3rem; border: 1px solid rgba(214, 190, 131, .35); }
.status-heading { display: flex; align-items: center; gap: .8rem; }
.status-heading h3 { font: 400 clamp(1.6rem, 4vw, 2.4rem)/1.1 var(--serif); }
.live-dot { flex: none; width: 12px; height: 12px; border-radius: 50%; background: var(--brume); }
[data-live-state="open"] .live-dot { background: #8fd49a; box-shadow: 0 0 0 4px rgba(143, 212, 154, .2); }
[data-live-state="closed"] .live-dot { background: #e89a88; }
[data-live-state="loading"] .live-dot { animation: battement 1.4s var(--ease-io) infinite alternate; }
@keyframes battement { from { opacity: .35; } to { opacity: 1; } }
[data-live-message] { margin: .8rem 0 .3rem; }
.live-next { color: var(--accent); margin: 0; }
.live-sync { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid rgba(214, 190, 131, .25); }
.live-sync p { margin: 0 0 .3rem; font-size: .8rem; color: var(--brume); }
.live-sync .btn { margin-top: .7rem; }
.planning-title { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .4rem 1rem; margin-top: clamp(3rem, 7vw, 4.5rem); padding-bottom: .7rem; border-bottom: 1px solid rgba(214, 190, 131, .35); }
.planning-title h3 { font: 400 1.6rem/1.15 var(--serif); }
.planning-title span { font: 600 var(--s-label)/1.5 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--accent); }
.live-day { display: grid; gap: .6rem; padding: 1.1rem 0; border-bottom: 1px solid rgba(214, 190, 131, .18); }
.live-day h3 { font: 400 1.3rem/1.2 var(--serif); text-transform: capitalize; }
.live-day.today h3 { color: var(--accent); }
.slot-date, .slot-today { font: 600 .66rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--brume); margin-left: .4rem; }
.live-slots { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.live-slot { padding: .35rem .7rem; border: 1px solid rgba(214, 190, 131, .5); font-variant-numeric: tabular-nums; font-size: .9rem; }
.calendar-day-link, .live-more { display: inline-flex; align-items: center; min-height: 44px; font-size: .78rem; color: var(--texte); }
.live-empty, .live-empty-line { color: var(--brume); padding: 1rem 0; margin: 0; }
.live-empty a, .live-empty-line a { color: var(--accent); }
@media (min-width: 900px) { .live-day { grid-template-columns: 14rem 1fr; align-items: center; } }
.stages__liste { margin-top: 2.4rem; }
.stages .live-empty { color: var(--encre-2); }
.live-stage { display: grid; gap: 1.4rem; padding: 2rem 0; border-top: 1px solid rgba(20, 22, 20, .2); }
.live-stage .eyebrow { font: 600 var(--s-label)/1.5 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--or-encre); margin: 0 0 .6rem; }
.stage-copy h3 { font: 400 clamp(1.6rem, 4vw, 2.4rem)/1.1 var(--serif); }
.stage-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin: .9rem 0; }
.stage-tags > span { padding: .25rem .6rem; border: 1px solid rgba(20, 22, 20, .3); font-size: .8rem; }
.stage-intro, .stage-price, .live-stage .muted { color: var(--encre-2); }
.live-stage .row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem; margin-top: 1rem; }
.live-stage .button { display: inline-flex; align-items: center; gap: .6rem; min-height: 48px; padding: .85rem 1.25rem; background: var(--fond); color: var(--texte); border: 1px solid var(--nuit); text-decoration: none; font: 600 .74rem/1.25 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.live-stage .button.line { background: transparent; color: var(--nuit); }
.live-stage .button:hover { background: var(--or-encre); border-color: var(--or-encre); color: var(--texte); }
.calendar-help { flex-basis: 100%; font-size: .76rem; color: var(--encre-2); }
.stage-poster { margin: 0; }
.stage-poster img { width: 100%; max-width: 340px; height: auto; }
.stage-program summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; }
.stage-program div { white-space: pre-line; color: var(--encre-2); max-width: 46rem; }
@media (min-width: 900px) { .live-stage { grid-template-columns: minmax(0, 1fr) 340px; column-gap: 3rem; } .stage-program { grid-column: 1 / -1; } }

/* ---------- Contact : texte et formulaire ---------- */
.contact__grille { display: grid; gap: 3rem; }
@media (min-width: 900px) {
  .contact__grille { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: start; }
  .contact__texte { grid-column: 1 / span 5; position: sticky; top: 110px; }
  .formulaire { grid-column: 7 / span 6; }
  .contact .display { font-size: clamp(3.2rem, 5.4vw, 6.2rem); }
}
.formulaire { display: grid; gap: 1.35rem; }
.formulaire fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.formulaire legend { padding: 0; margin-bottom: .8rem; font: 600 var(--s-label)/1.5 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--accent); }
.f-options { display: flex; flex-wrap: wrap; gap: .5rem; }
.f-options label { position: relative; cursor: pointer; }
.f-options input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.f-options span { display: inline-flex; align-items: center; min-height: 44px; padding: .55rem 1rem; border: 1px solid rgba(243, 240, 232, .42); font-size: .86rem; transition: background-color var(--t-court) var(--ease), color var(--t-court) var(--ease), border-color var(--t-court) var(--ease); }
.f-options input:checked + span { background: var(--or); border-color: var(--accent); color: var(--nuit); }
.f-options input:focus-visible + span { outline: 2px solid var(--or); outline-offset: 3px; }
@media (hover: hover) { .f-options label:hover span { border-color: var(--accent); } }
.f-champ { display: grid; gap: .4rem; }
.f-champ label { font-size: .82rem; color: var(--brume); }
.f-champ label small { font-size: .76rem; }
.formulaire input[type="text"], .formulaire input[type="email"], .formulaire input[type="tel"], .formulaire input[type="number"], .formulaire input:not([type]), .formulaire textarea {
  width: 100%; min-height: 48px; padding: .75rem .1rem; border: 0; border-bottom: 1px solid rgba(243, 240, 232, .5); border-radius: 0;
  background: transparent; color: var(--texte); font: 400 1rem/1.4 var(--sans); transition: border-color var(--t-court) var(--ease);
}
.formulaire textarea { resize: vertical; min-height: 7.5rem; }
.formulaire input::placeholder, .formulaire textarea::placeholder { color: var(--brume); opacity: 1; }
.formulaire input:focus-visible, .formulaire textarea:focus-visible { outline: 2px solid var(--or); outline-offset: 2px; border-bottom-color: var(--accent); }
.formulaire input:user-invalid, .formulaire textarea:user-invalid { border-bottom-color: #f2a594; }
.f-duo { display: grid; gap: 1.35rem; }
@media (min-width: 600px) { .f-duo { grid-template-columns: 1fr 1fr; column-gap: 1.4rem; } }
.f-plus { border-block: 1px solid rgba(214, 190, 131, .3); }
.f-plus summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 54px; cursor: pointer; list-style: none; font: 400 1.2rem/1.25 var(--serif); }
.f-plus summary::-webkit-details-marker { display: none; }
.f-plus summary small { font: 500 .7rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--brume); margin-left: .5rem; }
.f-plus summary::after { content: "+"; font: 300 1.6rem/1 var(--sans); color: var(--accent); transition: transform var(--t-court) var(--ease); }
.f-plus[open] summary::after { transform: rotate(45deg); }
.f-plus summary:focus-visible { outline-offset: -2px; }
.f-plus__corps { display: grid; gap: 1.35rem; padding: .3rem 0 1.5rem; }
.formulaire .f-cases legend { text-transform: none; letter-spacing: 0; font: 400 .82rem/1.5 var(--sans); color: var(--brume); margin-bottom: .2rem; }
.f-cases > div { display: flex; flex-wrap: wrap; gap: 0 1.3rem; }
.f-cases label { display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; font-size: .88rem; cursor: pointer; }
.f-cases input { width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }
.f-aide { margin: 0; font-size: .78rem; line-height: 1.55; color: var(--brume); }
.f-aide a { color: var(--texte); }
.f-envoi { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.4rem; }
.f-lien { appearance: none; padding: 0; background: none; border: 0; min-height: 44px; color: var(--texte); font: 600 .72rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; text-decoration: underline; text-underline-offset: .35em; text-decoration-thickness: 1px; cursor: pointer; }
.f-lien:hover { color: var(--accent); }
.f-ref { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem 1rem; padding: .7rem 1rem; border-left: 2px solid var(--or); background: rgba(214, 190, 131, .08); }
.f-ref p { margin: 0; }
.f-resultat { display: grid; gap: .8rem; padding: 1.4rem 1.3rem; border: 1px solid rgba(214, 190, 131, .5); }
.f-resultat h3 { font: 400 1.7rem/1.1 var(--serif); }
.f-resultat h3:focus { outline: none; }
.f-resultat p { margin: 0; }
.f-resultat label { font-size: .82rem; color: var(--brume); }
.formulaire .f-resultat textarea { font-size: .9rem; border: 1px solid rgba(243, 240, 232, .3); padding: .8rem; }

/* ---------- Pied ---------- */
.pied__id { display: grid; gap: 1.4rem; align-content: start; }
.pied address { font-style: normal; display: grid; }
.pied address b { color: var(--texte); font-weight: 600; letter-spacing: .06em; padding-bottom: .2rem; }
.pied address span { padding-top: .4rem; line-height: 1.6; }
@media (min-width: 900px) { .pied__id { grid-template-columns: 86px 1fr; column-gap: 2rem; } }

/* Planche à quatre photos : la colonne de droite se partage, rien ne reste isolé */
@media (min-width: 900px) {
  .planche .p3 { grid-column: 7 / span 3; }
  .planche .p6 { grid-column: 10 / span 3; margin-top: 5rem; }
  .hauteur__texte .nombre--long { font-size: clamp(7rem, 12.5vw, 13rem); white-space: nowrap; }
  .programme-seul .h3 { font-size: clamp(1.9rem, 3vw, 2.6rem); }
}
.nombre--long { white-space: nowrap; }
@media (min-width: 900px) { .medias > .medias__pile { grid-column: 8 / span 5; margin-top: 7rem; } }
.panneau .langue { border-left: 0; padding-left: 0; margin-left: -.45rem; }
.medias__pile > .media { grid-column: auto !important; margin-top: 0 !important; }
.scene__texte > .label { margin-bottom: clamp(1.4rem, 3.2vw, 3.2rem); }
/* Vidéos mises en avant : grand lecteur et bouton lecture */
.jouer { position: relative; flex: none; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: currentColor; }
.jouer::after { content: ""; position: absolute; left: 54%; top: 50%; transform: translate(-50%, -50%); border-style: solid; border-width: .38rem 0 .38rem .62rem; border-color: transparent transparent transparent var(--or); }
.btn--video { justify-content: flex-start; gap: .9rem; padding-left: .7rem; font-size: .8rem; }
.btn--video .jouer { background: var(--fond); }
.papier .btn--video .jouer { background: var(--or); }
.papier .btn--video .jouer::after { border-left-color: var(--nuit); }
.lien--video { display: inline-flex; align-items: center; gap: .7rem; }
.lien--video .jouer { width: 1.7rem; height: 1.7rem; background: var(--or); }
.lien--video .jouer::after { border-left-color: var(--nuit); border-width: .3rem 0 .3rem .5rem; }
.papier .lien--video .jouer { background: var(--fond); }
.papier .lien--video .jouer::after { border-left-color: var(--accent); }
.video-sp { background: var(--fond); padding-block: clamp(3rem, 8vw, 7rem); }
.lecteur { margin: 0 auto; max-width: 1180px; position: relative; aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.lecteur__lien, .lecteur iframe, .lecteur video.video-inline { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; color: var(--texte); text-decoration: none; }
.lecteur__lien img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform 1.2s var(--ease-out), filter .6s var(--ease); filter: saturate(.92) brightness(.82); }
.lecteur__lien::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 22, 20, 0) 45%, rgba(20, 22, 20, .78) 100%); }
.lecteur__rond { position: absolute; left: 50%; top: 50%; z-index: 1; width: clamp(4.6rem, 9vw, 7.5rem); height: clamp(4.6rem, 9vw, 7.5rem); transform: translate(-50%, -50%); border-radius: 50%; background: var(--or); box-shadow: 0 0 0 0 rgba(214, 190, 131, .55); animation: lecteur-pouls 2.6s var(--ease) infinite; transition: transform .5s var(--ease-out); }
.lecteur__rond::after { content: ""; position: absolute; left: 55%; top: 50%; transform: translate(-50%, -50%); border-style: solid; border-width: clamp(.8rem, 1.5vw, 1.25rem) 0 clamp(.8rem, 1.5vw, 1.25rem) clamp(1.3rem, 2.5vw, 2.05rem); border-color: transparent transparent transparent var(--nuit); }
.lecteur__titre { position: absolute; left: clamp(1rem, 3vw, 2.4rem); bottom: clamp(1rem, 3vw, 2.2rem); z-index: 1; display: grid; gap: .3rem; }
.lecteur__titre .label { margin: 0; }
.lecteur__nom { font: 400 clamp(1.6rem, 3.6vw, 3.2rem)/1.05 var(--serif); font-style: italic; }
@keyframes lecteur-pouls { 0% { box-shadow: 0 0 0 0 rgba(214, 190, 131, .5); } 70% { box-shadow: 0 0 0 1.6rem rgba(214, 190, 131, 0); } 100% { box-shadow: 0 0 0 0 rgba(214, 190, 131, 0); } }
@media (hover: hover) { .lecteur__lien:hover img, .lecteur__lien:focus-visible img { transform: scale(1.06); filter: saturate(1) brightness(.92); } .lecteur__lien:hover .lecteur__rond, .lecteur__lien:focus-visible .lecteur__rond { transform: translate(-50%, -50%) scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .lecteur__rond { animation: none; } }
@media (max-width: 700px) { .lecteur__rond { top: 40%; width: 3.9rem; height: 3.9rem; } .lecteur__rond::after { border-width: .62rem 0 .62rem 1rem; } .lecteur__titre { bottom: .9rem; gap: .15rem; } .lecteur__titre .label { font-size: .62rem; letter-spacing: .16em; } .lecteur__nom { font-size: 1.35rem; } }
.video-sp { padding: clamp(1.5rem, 4vw, 4rem) var(--marge, 5vw); }
.lecteur { max-width: min(960px, calc(75svh * 16 / 9)); width: 100%; }
.video-sp + * { border-top: 0; }
.video-destination { position:absolute; top:1rem; right:1rem; z-index:3; padding:.35rem .6rem; background:#141614; color:#fff; font-size:.75rem; }
/* Vidéo d'ouverture sous le texte, jamais derrière */
.scene--sous { min-height: 0; display: flex; flex-direction: column; padding: 0; }
.scene--sous .scene__texte { order: -1; }
.scene--sous .scene__texte { padding: clamp(7rem, 14vw, 10rem) var(--pad-r) clamp(2rem, 5vw, 3.5rem) var(--pad-l); }
.scene--sous .scene__media { position: relative; inset: auto; aspect-ratio: 16 / 9; max-height: 92svh; width: 100%; }
.scene--sous .scene__media::after { display: none; }
@media (max-width: 800px) { .scene--sous .scene__media { aspect-ratio: 4 / 5; } }
.scene--sous .scene__bas { margin-top: 1.4rem; }
/* Reportages et articles : cartes image avec bouton lecture */
.media--image .media__vignette { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.media--image .media__vignette img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease-out), filter .5s var(--ease); filter: brightness(.85); }
.media--image .media__rond { position: absolute; left: 50%; top: 50%; width: 4.2rem; height: 4.2rem; transform: translate(-50%, -50%); border-radius: 50%; background: var(--or); transition: transform .4s var(--ease-out); }
.media--image .media__rond::after { content: ""; position: absolute; left: 56%; top: 50%; transform: translate(-50%, -50%); border-style: solid; border-width: .7rem 0 .7rem 1.15rem; border-color: transparent transparent transparent var(--nuit); }
.media--image .media__src { display: block; margin-top: 1rem; }
@media (hover: hover) { .media--image .media__vignette:hover img, .media--image .media__vignette:focus-visible img { transform: scale(1.05); filter: brightness(1); } .media--image .media__vignette:hover .media__rond { transform: translate(-50%, -50%) scale(1.1); } }
.media--image .credit-photo { margin: .5rem 0 0; font-size: .8rem; color: var(--brume); }
.scene--sous { align-items: stretch; justify-content: flex-start; }
.scene--sous .scene__texte { width: 100%; box-sizing: border-box; }
/* Lisibilité du texte posé sur la vidéo ou la photo d'ouverture */
.scene__media::after { background: linear-gradient(180deg, rgba(20, 22, 20, .55) 0%, rgba(20, 22, 20, .12) 18%, rgba(20, 22, 20, .38) 40%, rgba(20, 22, 20, .8) 66%, rgba(20, 22, 20, .94) 100%); }
.scene__texte > .label { color: #ecd49a; text-shadow: 0 1px 14px rgba(20, 22, 20, .85), 0 0 3px rgba(20, 22, 20, .6); }
.scene .display { text-shadow: 0 2px 26px rgba(20, 22, 20, .55); }
.scene .legende, .scene__bas .legende { color: #f3f0e8; text-shadow: 0 1px 10px rgba(20, 22, 20, .9); }
.scene__bas .video-ctrl { background: rgba(20, 22, 20, .55); }
.scene__media::after { background: linear-gradient(180deg, rgba(20, 22, 20, .5) 0%, rgba(20, 22, 20, .06) 20%, rgba(20, 22, 20, .2) 44%, rgba(20, 22, 20, .72) 68%, rgba(20, 22, 20, .93) 100%); }
@media (max-width: 800px) { .scene__media::after { background: linear-gradient(180deg, rgba(20, 22, 20, .5) 0%, rgba(20, 22, 20, 0) 18%, rgba(20, 22, 20, 0) 50%, rgba(20, 22, 20, .72) 74%, rgba(20, 22, 20, .93) 100%); } }
.scene__actions { margin: 0 0 1.4rem; }
.scene__actions .lien { color: var(--texte); text-shadow: 0 1px 10px rgba(20, 22, 20, .9); }
@media (max-width: 800px) { .scene__media::after { background: linear-gradient(180deg, rgba(20, 22, 20, .5) 0%, rgba(20, 22, 20, 0) 16%, rgba(20, 22, 20, .12) 34%, rgba(20, 22, 20, .62) 50%, rgba(20, 22, 20, .86) 68%, rgba(20, 22, 20, .94) 100%); } .scene .display { text-shadow: 0 2px 22px rgba(20, 22, 20, .75), 0 0 2px rgba(20, 22, 20, .4); } }
@media (max-width: 899px) and (orientation: landscape) and (max-height: 520px) {
  .scene { min-height: max(100svh, 430px); padding-top: 5rem; padding-bottom: .75rem; }
  .scene .display.scene__titre-long { font-size: clamp(2.5rem, 5.5vw, 3.25rem); line-height: .9; margin-bottom: .5rem; }
  .scene__texte > .label { margin-bottom: .5rem; }
  .scene__actions { margin-bottom: .35rem; }
  .scene__bas { gap: .5rem; }
}

/* Navigation: offers first, room app as a separate utility. */
.nav { gap: clamp(.6rem, 1vw, 1.1rem); }
.nav a, .menu-groupe summary, .tete__outils a { font: 500 .84rem/1.35 var(--sans); letter-spacing: 0; text-transform: none; }
.menu-groupe { position: relative; }
.menu-groupe summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: .4rem; min-height: 44px; cursor: pointer; white-space: nowrap; }
.menu-groupe summary::-webkit-details-marker { display: none; }
.menu-groupe summary > span { color: var(--accent); transition: transform .18s; }
.menu-groupe[open] summary > span { transform: rotate(180deg); }
.menu-groupe.est-section > summary { color: var(--accent); }
.menu-groupe summary:focus-visible { outline: 2px solid var(--or); outline-offset: 4px; }
.nav .menu-liens { position: absolute; left: -.9rem; top: 100%; min-width: 245px; padding: .5rem; background: var(--fond); border: 1px solid var(--fil); box-shadow: 0 16px 32px #0005; }
.nav .menu-liens a { display: flex; align-items: center; min-height: 44px; padding: .65rem .7rem; white-space: normal; }
.nav .menu-liens a::after { display: none; }
.menu-liens a:hover, .menu-liens a:focus-visible { background: #d6be1312; color: var(--accent); }
.tete__outils { display: none; }
.panneau .menu-groupe summary { font: 400 clamp(1.4rem, 6vw, 2rem)/1.3 var(--serif); white-space: normal; padding: .5rem 0; min-height: 56px; }
.panneau .menu-liens { padding: 0 0 .75rem .8rem; }
.panneau .menu-liens a { font: 400 1rem/1.4 var(--sans); min-height: 44px; padding: .65rem .4rem; opacity: 1; transform: none; transition: none; }
.panneau .menu-liens a::before { content: none; }
.panneau__plus { border-top: 1px solid var(--fil); padding-top: 1rem; }
.menu-btn { text-transform: none; letter-spacing: .02em; }
[id="preparation-artistes"], .equipement-categories li[id] { scroll-margin-top: 110px; }
@media (min-width:1280px) {
  .tete { gap: 1rem; }
  .tete__outils { display: flex; align-items: center; gap: .6rem; border-left: 1px solid var(--fil); padding-left: .8rem; }
  .tete__outils a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; white-space: nowrap; }
  .tete__outils .nav__app { color: var(--brume); font-size: .75rem; gap: .35rem; }
  .tete__outils .langue { margin: 0; padding: 0; border: 0; }
  .nav .nav__parler { padding: .7rem .9rem; }
}

.vignette-video { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--fond); color: #fff; text-decoration: none; }
.vignette-video img { width: 100%; height: 100%; object-fit: cover; }
.vignette-video::after { content: ''; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, #000b); pointer-events: none; }
.vignette-video__titre { position: absolute; inset: auto 1rem 1rem; z-index: 1; font: 500 clamp(.9rem, 1.3vw, 1.1rem)/1.4 var(--sans); letter-spacing: 0; text-transform: none; }
.vignette-video .lecteur__rond { z-index: 2; }
.video-source { margin:.6rem 0 0; font-size:.8rem; }
.medias--reportages > .media { grid-column:auto; margin-top:0; }
@media (min-width:900px) { .medias--reportages { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.invites.invites--compact { grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.5rem; max-width:1000px; }
.invites--compact .invite { grid-column:auto; margin-top:0; }
.invites--compact .invite .ph__cadre { aspect-ratio:auto; height:200px; background:transparent; }
.invites--compact .invite .ph__cadre img { object-fit:contain; transform:none; }
.invites--compact:focus-visible, .souvenir-galerie--intervenants:focus-visible { outline:2px solid var(--or); outline-offset:4px; }
.invites--compact .invite h3 { font-size:1.25rem; }
.invites--compact .invite .credit-photo { font-size:.7rem; margin-top:.4rem; }
@media (max-width:700px) { .invites.invites--compact { display:flex; overflow-x:auto; padding-bottom:1rem; scroll-snap-type:x proximity; } .invites--compact .invite { flex:0 0 180px; scroll-snap-align:start; } }
.video-inline { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; background: #000; }
.ouverture__ph:has(img[src*="triple-trapeze"]) .ph__cadre { --origine: 70% 45%; }
.real--a .ph__cadre:has(img[src*="scene-celine"]) { aspect-ratio: 3 / 2; }

/* The home introduction has no secondary navigation column. */
.ouverture__bas { grid-template-columns: minmax(0, 1fr); grid-template-areas: "lead" "act"; }
.ouverture__bas > .lead { max-width: 34rem; }


/* Two atmospheres, one identity. Photos keep their own dark overlays. */
:root { --fond: #141614; --surface: #1d201c; --texte: #f3f0e8; --accent: #d6be83; --trait: #d6be8345; color-scheme: dark; }
:root[data-theme="light"] { --fond: #f8f5ed; --surface: #eee9dd; --texte: #242720; --accent: #79602b; --brume: #5b6055; --trait: #74633b40; --focus: #79602b; color-scheme: light; }
[data-theme="light"] .papier { background: #fffdf8; }
.tete::before { opacity: 1; background: var(--fond); border-bottom: 1px solid var(--trait); }
.theme-btn { flex: none; width: 44px; height: 44px; padding: 0; border: 1px solid var(--trait); border-radius: 50%; color: var(--texte); background: transparent; display: grid; place-items: center; cursor: pointer; }
.theme-btn span { font: 400 1.55rem/1 Georgia, serif; transform: rotate(-35deg); }
.theme-btn:hover { border-color: var(--accent); background: var(--surface); }
.tete .theme-btn { margin-left: auto; }
.tete .menu-btn { margin-left: .65rem; border-color: var(--trait); background: transparent; color: var(--texte); border-radius: 24px; }
.tete .menu-btn[aria-expanded="true"] { background: var(--or); color: var(--nuit); }
.papier .btn:not(.btn--ligne), .live-stage .button:not(.line) { background: var(--nuit); color: var(--papier); }
.logos-kit__sombre { background: var(--nuit); color: var(--papier); }
.pied, .scene:not(.scene--sous), .lecteur, .vignette-video, .media__vignette, .ph figcaption.sur, .regle b, .profil::before {
  --texte: #f3f0e8; --accent: #d6be83; --brume: #b5b8ae; --fond: #141614; --surface: #1d201c;
}
.scene--sous .scene__texte > .label { color: var(--accent); text-shadow: none; }
.scene--sous .display, .scene--sous .legende, .scene--sous .scene__actions .lien { color: var(--texte); text-shadow: none; }
[data-theme="light"] .f-options label span, [data-theme="light"] .formulaire input, [data-theme="light"] .formulaire textarea { border-color: #74633b70; }
[data-theme="light"] .formulaire input:user-invalid, [data-theme="light"] .formulaire textarea:user-invalid { border-color: #a33227; }
[data-theme="light"] .f-plus { border-color: var(--trait); }
[data-theme="light"] .ouv-page--photo .ph__cadre::after { background: linear-gradient(0deg, #f8f5ed 4%, #f8f5ed00); }
[data-theme="light"] .ouv-page--photo .ph__cadre::before { background: none; }
[data-theme="light"] .fil__trace { background: var(--accent); }
[data-theme="light"] .fil__anneau { border-color: var(--accent); }
[data-theme="light"] .scene__bas .video-ctrl { color: #f3f0e8; }

/* A photographic contents panel, not a stack of boxed dropdowns. */
.menu-groupe summary > span { font-size: .75rem; }
.menu-groupe[open] > summary { color: var(--accent); }
.menu-choix { counter-reset: entree; }
.menu-choix > a { counter-increment: entree; }
.menu-choix > a::before { content: '0' counter(entree); flex: none; color: var(--accent); font: 500 .62rem/1 var(--sans); letter-spacing: .1em; }
.nav .menu-photo, .panneau .menu-photo { position: relative; display: block; padding: 0; overflow: hidden; background: #141614; color: #fff; min-width: 0; }
.menu-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.menu-photo > span { position: absolute; inset: auto 0 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 3rem 1.2rem 1.2rem; background: linear-gradient(transparent, #000c); color: #fff; font: 400 1.7rem/1.1 var(--serif); }
.menu-photo b { font: 400 1.2rem/1 var(--sans); }
.menu-photo:hover img { transform: scale(1.035); }
.menu-photo:focus-visible { outline-offset: -5px; outline-color: #f3f0e8; }
.nav .menu-choix > a { gap: 1.2rem; font: 400 clamp(1.35rem, 1.8vw, 1.8rem)/1.15 var(--serif); border-bottom: 1px solid var(--trait); padding: 1rem .4rem; min-height: 58px; }
.nav .menu-choix > a::after { content: '↗'; position: static; display: block; height: auto; width: auto; margin-left: auto; background: none; transform: none; color: var(--accent); font: 400 1rem/1 var(--sans); }
.menu-choix > a:hover, .menu-choix > a:focus-visible { background: var(--surface); color: var(--accent); }
@media (min-width:1280px) {
  .tete { padding-left: 3.2vw; padding-right: 2.2vw; gap: .85rem; }
  .tete .theme-btn { margin-left: 0; width: 44px; }
  .nav { margin-left: auto; gap: clamp(.65rem, .9vw, 1.1rem); }
  .nav .menu-groupe { position: static; }
  .nav .menu-liens { position: absolute; top: 68px; left: auto; right: 2.2vw; width: min(790px, 76vw); min-width: 0; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 2rem; padding: 1.25rem; background: var(--fond); border: 1px solid var(--trait); border-top: 0; border-radius: 0 0 4px 4px; box-shadow: 0 24px 40px #0002; }
  .nav .menu-photo { height: 280px; }
  .nav .menu-choix { align-self: center; padding-right: .65rem; }
  .nav .nav__parler { background: var(--texte); color: var(--fond); border-color: transparent; border-radius: 24px; padding: .8rem 1.1rem; }
  .nav .nav__parler:hover { background: var(--accent); color: var(--fond); }
  .nav .menu-groupe[open] .menu-liens { animation: menu-arrive .22s ease-out both; }
  .nav .menu-groupe > summary { position: relative; }
  .nav .menu-groupe[open] > summary::after { content: ''; position: absolute; bottom: -12px; left: 0; right: 0; height: 2px; background: var(--accent); }
}
@media (min-width:1280px) and (max-width:1559px) { .nav a, .nav .menu-groupe summary { font-size: .78rem; } .tete__outils { gap: .2rem; padding-left: .6rem; } }
@media (max-width:1279px) {
  .panneau { padding-top: 88px; }
  .panneau .menu-liens { padding: 0 0 1rem; }
  .panneau .menu-photo { height: 136px; border-radius: 3px; margin: .25rem 0 .5rem; }
  .panneau .menu-photo::before { display: none; }
  .panneau .menu-photo > span { font-size: 1.4rem; padding: 2rem .85rem .85rem; }
  .panneau .menu-choix > a { font-size: .86rem; align-items: center; gap: .85rem; border-bottom: 1px solid var(--trait); padding: .7rem .3rem; }
  .panneau .menu-choix > a::before { content: '0' counter(entree); font-size: .6rem; min-width: 1.1rem; }
  .panneau .menu-choix > a::after { content: '↗'; margin-left: auto; color: var(--accent); }
  .panneau .menu-groupe summary { min-height: 56px; font-size: 1.7rem; }
  .panneau__plus { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
}
@keyframes menu-arrive { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion:reduce) { .nav .menu-groupe[open] .menu-liens { animation: none; } .menu-photo img { transition: none; } }

.marque .marque__claire { display: none; }
[data-theme="light"] .marque .marque__sombre { display: none; }
[data-theme="light"] .marque .marque__claire { display: block; }
.papier .btn--ligne::before, .btn--video .jouer, .papier .lien--video .jouer { background: var(--nuit); }
.papier .btn--ligne:hover, .papier .btn--ligne:focus-visible { color: var(--papier); }
.live-stage .button:hover { background: var(--or-encre); color: var(--papier); }
/* Hide decorative generated content as well as links in closed disclosures. */
.menu-groupe:not([open]) > .menu-liens { display: none; }
.scene:not(.scene--sous) { color: #f3f0e8; }
.scene:not(.scene--sous) .or { color: #d6be83; }
.nav .menu-liens .menu-photo, .panneau .menu-liens .menu-photo { padding: 0; }

/* Home photo joins the ivory canvas; the approved dark treatment is unchanged. */
@media (max-width: 899px) {
  [data-theme="light"] .ouverture__ph .ph__cadre::after {
    height: 48%;
    background: linear-gradient(0deg, #f8f5ed 0%, #f8f5ed 26%, #f8f5ed00 100%);
  }
  [data-theme="light"] .ouverture__texte { margin-top: -6svh; }
}

/* Header contrast changes atomically with the theme, including touch feedback. */
.tete .menu-btn { transition: transform var(--t-court) var(--ease); }
[data-theme="light"] .tete .menu-btn { border-color: #79602b; }
[data-theme="light"] .tete .menu-btn:is(:hover, :focus-visible, :active) { border-color: #79602b; color: #242720; }
[data-theme="light"] .tete .menu-btn:focus-visible { outline-color: #79602b; }

/* Anchor arrivals frame the content, not the section's generous top padding. */
.s[id] { scroll-margin-top: calc(clamp(2rem, 4vw, 5.25rem) - var(--ancre-padding, clamp(5rem, 13vw, 10.5rem))); }
.s[id][style*="padding-top: 0"] { scroll-margin-top: clamp(2rem, 4vw, 5.25rem); }
.ancre-section { display: block; height: 0; scroll-margin-top: clamp(2rem, 4vw, 5.25rem); }
#equipements:has(#agres-structures:target) [data-categorie="agres-structures"],
#equipements:has(#materiel-acrobatique:target) [data-categorie="materiel-acrobatique"],
#equipements:has(#moteurs-accastillage:target) [data-categorie="moteurs-accastillage"] { border-left: 2px solid var(--accent); padding-left: 1rem; }

.s:target [data-d], [data-d]:target, .s:has(.ancre-section:target) [data-d] { opacity: 1; transform: none; transition: none; }
@media (max-width: 899px) { #equipements .editorial-visuel > div { order: -1; } }

.photo-seance { aspect-ratio: 2 / 3; }
.photo-seance img { transform: none !important; object-fit: cover; }
.lecteur video.video-inline { object-fit: contain; }

.ouv-page--photo .ouv-page__ph--seance { align-self: center; }
.ouv-page--photo .ouv-page__ph--seance .photo-seance { aspect-ratio: 2 / 3; height: auto; min-height: 0; }

/* Same landscape source: keep the introduction and credit outside its small mobile frame. */
@media (max-width: 899px) {
  .ouv-page--rise .ouv-page__ph { margin-top: 68px; }
  .ouv-page--rise .ouv-page__texte { margin-top: 1.5rem; }
  .ouv-page--rise .ouv-page__ph figcaption.sur { top: auto; bottom: .5rem; left: .7rem; right: auto; writing-mode: horizontal-tb; transform: none; border: 0; padding: .3rem .5rem; font-size: .65rem; }
}
