/* ============================================================
   LIVE STADIUM — feuille de style « Lever de rideau »
   Palette : velours (fond) · rouge rideau · or · ivoire
   Typos  : Prata (titres) · Red Hat Text (texte)
   ============================================================ */

:root {
  --velours: #15090D;
  --velours-2: #1F1016;
  --velours-3: #2A161E;
  --rouge: #8E1B2E;
  --rouge-vif: #C8293F;
  --or: #D9B46A;
  --or-pale: #EBD9AE;
  --ivoire: #F4ECDF;
  --ivoire-2: #D8CDBA;
  --gris: #9A8C86;
  --filet: rgba(217, 180, 106, .22);
  --filet-fort: rgba(217, 180, 106, .5);

  --f-titre: "Prata", "Georgia", serif;
  --f-texte: "Red Hat Text", "Segoe UI", sans-serif;

  --contenant: 1180px;
  --gouttiere: 24px;
  --transition: .4s cubic-bezier(.25, .8, .25, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--velours);
  color: var(--ivoire);
  font-family: var(--f-texte);
  font-size: 1.0625rem;
  line-height: 1.7;
  font-weight: 300;
  overflow-x: hidden;
}
img, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
p a:not(.bouton) { color: var(--or); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
ul { margin: 0; padding: 0; list-style: none; }
b, strong { font-weight: 500; }
h1, h2, h3, h4 { font-family: var(--f-titre); font-weight: 400; line-height: 1.08; margin: 0; letter-spacing: -.005em; }
h1 { font-size: clamp(2.6rem, 6vw, 5.4rem); }
h2 { font-size: clamp(2rem, 4.2vw, 3.4rem); }
h3 { font-size: clamp(1.35rem, 2vw, 1.7rem); }
h4 { font-size: 1.2rem; }
.chapo { font-size: clamp(1.1rem, 1.5vw, 1.3rem); color: var(--ivoire-2); max-width: 62ch; font-weight: 300; line-height: 1.6; }
.etiquette { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; color: var(--or); }
.a-completer { color: var(--or); }
small { font-size: .85em; }

.evitement { position: absolute; left: -999px; top: 8px; background: var(--or); color: var(--velours); padding: .5rem 1rem; z-index: 1000; }
.evitement:focus { left: 8px; }

.contenant { width: min(100% - 2 * var(--gouttiere), var(--contenant)); margin-inline: auto; }
.section { padding: clamp(4rem, 8vw, 7.5rem) 0; position: relative; }
.section-serree { padding: clamp(2.5rem, 5vw, 4rem) 0; }
.section-velours { background: var(--velours-2); }

/* ---------- Surtitre & ornement ---------- */
.surtitre { display: flex; align-items: center; gap: .9rem; margin: 0 0 1.2rem; font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; color: var(--or); }
.surtitre::before { content: ""; width: 36px; height: 1px; background: var(--or); }
.centre .surtitre { justify-content: center; }
.centre .surtitre::after { content: ""; width: 36px; height: 1px; background: var(--or); }
.ornement { display: flex; align-items: center; gap: 1rem; margin: 0 auto; max-width: 420px; color: var(--or); }
.ornement i { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--filet-fort)); }
.ornement i:last-child { background: linear-gradient(90deg, var(--filet-fort), transparent); }
.ornement b { font-size: .9rem; font-weight: 400; }

/* ---------- Boutons ---------- */
.bouton {
  display: inline-flex; align-items: center; gap: .6rem;
  font-family: var(--f-texte); font-size: .8rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; line-height: 1;
  padding: 1rem 1.7rem; border: 1px solid var(--or); border-radius: 0; cursor: pointer; color: var(--or); background: transparent;
  transition: background var(--transition), color var(--transition), border-color var(--transition), transform var(--transition);
  white-space: nowrap; position: relative;
}
.bouton svg { transition: transform var(--transition); }
.bouton:hover svg { transform: translateX(4px); }
.bouton-or { background: var(--or); color: var(--velours); }
.bouton-or:hover { background: var(--or-pale); border-color: var(--or-pale); }
.bouton-contour:hover { background: rgba(217, 180, 106, .12); }
.bouton-rouge { background: var(--rouge); border-color: var(--rouge); color: var(--ivoire); }
.bouton-rouge:hover { background: var(--rouge-vif); border-color: var(--rouge-vif); }
.bouton-sombre { background: var(--velours); border-color: var(--velours); color: var(--ivoire); }
.bouton-sombre:hover { background: var(--rouge); border-color: var(--rouge); }
.bouton-petit { padding: .7rem 1.1rem; font-size: .72rem; }
.bouton-grand { padding: 1.2rem 2.2rem; font-size: .85rem; }
.bouton:focus-visible, a:focus-visible, button:focus-visible { outline: 2px solid var(--or-pale); outline-offset: 3px; }
.actions { display: flex; flex-wrap: wrap; gap: 1rem; }

/* ---------- En-tête « frise » ---------- */
.frise { position: fixed; inset: 0 0 auto 0; z-index: 100; padding: 1.2rem 0; transition: background var(--transition), padding var(--transition), border-color var(--transition); border-bottom: 1px solid transparent; }
.frise.collee { background: rgba(21, 9, 13, .92); padding: .7rem 0; border-color: var(--filet); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.frise-int { width: min(100% - 2 * var(--gouttiere), var(--contenant)); margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }

.marque { display: inline-grid; grid-template-columns: auto auto; grid-template-rows: auto auto; column-gap: .6rem; align-items: baseline; }
.marque-etoile { color: var(--or); font-size: .9rem; grid-row: 1; }
.marque-nom { font-family: var(--f-titre); font-size: 1.55rem; color: var(--ivoire); letter-spacing: .02em; line-height: 1; grid-row: 1; }
.marque-sous { grid-column: 2; font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--gris); margin-top: .3rem; }

.nav ul { display: flex; align-items: center; gap: 2.4rem; }
.nav a:not(.bouton) { font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: var(--ivoire-2); position: relative; padding: .4rem 0; transition: color var(--transition); }
.nav a:not(.bouton)::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--or); transform: scaleX(0); transform-origin: left; transition: transform var(--transition); }
.nav a:not(.bouton):hover, .nav a:not(.bouton).actif { color: var(--or); }
.nav a:not(.bouton):hover::after, .nav a:not(.bouton).actif::after { transform: scaleX(1); }
.nav-cta .bouton { padding: .8rem 1.3rem; font-size: .72rem; }
.nav-cta .bouton.actif { background: var(--or-pale); }
.nav-pied { display: none; }

.burger { display: none; background: none; border: 0; width: 44px; height: 44px; cursor: pointer; flex-direction: column; justify-content: center; gap: 7px; padding: 0 8px; }
.burger span { display: block; height: 1.5px; background: var(--or); transition: transform var(--transition); }
.burger[aria-expanded="true"] span:first-child { transform: translateY(4.25px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child { transform: translateY(-4.25px) rotate(-45deg); }

/* ---------- Scène d'ouverture (héros) ---------- */
.scene { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; isolation: isolate; text-align: center; }
.scene-fond { position: absolute; inset: 0; z-index: -2; }
.scene-fond video, .scene-fond img { width: 100%; height: 100%; object-fit: cover; }
.scene::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 60% 70% at 50% 60%, rgba(21, 9, 13, .2), rgba(21, 9, 13, .78) 70%, var(--velours) 100%); }
.scene-int { width: min(100% - 2 * var(--gouttiere), 900px); margin-inline: auto; padding: 9rem 0 7rem; }
.scene h1 { color: var(--ivoire); text-wrap: balance; }
.scene h1 em { font-style: normal; color: var(--or); }
.scene .chapo { margin: 1.6rem auto 2.4rem; }
.scene .actions { justify-content: center; }
.scene-pied { position: absolute; left: 0; right: 0; bottom: 0; border-top: 1px solid var(--filet); background: rgba(21, 9, 13, .6); backdrop-filter: blur(6px); }
.scene-pied .contenant { display: grid; grid-template-columns: repeat(3, 1fr); }
.scene-pied div { padding: 1.1rem 1rem; text-align: left; border-right: 1px solid var(--filet); }
.scene-pied div:last-child { border-right: 0; }
.scene-pied b { display: block; font-family: var(--f-titre); font-weight: 400; font-size: 1.15rem; color: var(--or-pale); }
.scene-pied span { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }

/* Rideau d'ouverture */
.rideau { position: fixed; inset: 0; z-index: 300; pointer-events: none; display: flex; }
.rideau span {
  flex: 1; height: 100%;
  background:
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .28) 0 14px, transparent 14px 46px, rgba(255, 255, 255, .05) 46px 60px),
    linear-gradient(90deg, #5E0F1F, #8E1B2E 50%, #5E0F1F);
  box-shadow: inset 0 0 120px rgba(0, 0, 0, .55);
  transition: transform 1.7s cubic-bezier(.7, 0, .3, 1);
}
.rideau span:first-child { border-right: 2px solid var(--or); }
.rideau.ouvert span:first-child { transform: translateX(-102%); }
.rideau.ouvert span:last-child { transform: translateX(102%); }
.rideau.fini { display: none; }
html:not(.js) .rideau { display: none; }

/* ---------- Têtes de section ---------- */
.tete { margin-bottom: clamp(2.4rem, 5vw, 4rem); max-width: 720px; }
.tete.centre { margin-inline: auto; text-align: center; }
.tete h2 { text-wrap: balance; }
.tete .chapo { margin: 1rem 0 0; }
.tete.centre .chapo { margin-inline: auto; }

/* ---------- Affiches (cartes à cadre doré) ---------- */
.affiches { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.affiche { position: relative; display: block; }
.affiche-cadre { position: relative; overflow: hidden; aspect-ratio: 3 / 4; outline: 1px solid var(--filet-fort); outline-offset: 10px; transition: outline-offset var(--transition), outline-color var(--transition); }
.affiche:hover .affiche-cadre { outline-offset: 4px; outline-color: var(--or); }
.affiche-cadre img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s ease; filter: saturate(.9); }
.affiche:hover .affiche-cadre img { transform: scale(1.05); }
.affiche-num { position: absolute; left: 1rem; top: 1rem; font-family: var(--f-titre); font-size: 1.3rem; color: var(--or-pale); background: rgba(21, 9, 13, .75); padding: .3rem .7rem; line-height: 1; }
.affiche-texte { padding: 1.6rem .2rem 0; }
.affiche-texte h3 { color: var(--ivoire); margin-bottom: .4rem; }
.affiche-texte p { margin: 0; color: var(--gris); font-size: .98rem; }
.affiche-lien { display: inline-flex; align-items: center; gap: .5rem; margin-top: .9rem; font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: var(--or); }

/* ---------- Deux colonnes ---------- */
.deux-col { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: center; }
.deux-col .cadre { position: relative; }
.deux-col .cadre img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; outline: 1px solid var(--filet-fort); outline-offset: 12px; }
.deux-col .cadre figcaption { margin-top: 1.6rem; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); display: flex; justify-content: space-between; }
.deux-col p { color: var(--ivoire-2); }
.liste-or { display: grid; gap: .8rem; margin-top: 1.6rem; }
.liste-or li { display: flex; gap: .9rem; align-items: flex-start; color: var(--ivoire-2); }
.liste-or li::before { content: "✦"; color: var(--or); font-size: .7rem; margin-top: .45rem; flex: none; }

/* ---------- Production / coproduction ---------- */
.modes { display: grid; grid-template-columns: 1fr 1px 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.modes-sep { background: linear-gradient(transparent, var(--filet-fort), transparent); align-self: stretch; }
.mode .numero { font-family: var(--f-titre); font-size: 3.4rem; color: var(--rouge-vif); line-height: 1; margin-bottom: .6rem; }
.mode h3 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); color: var(--ivoire); margin-bottom: 1rem; }
.mode p { color: var(--ivoire-2); margin: 0 0 1rem; }

/* ---------- Soirée type (programme) ---------- */
.programme { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid var(--filet); border-bottom: 1px solid var(--filet); }
.programme div { padding: 1.8rem 1.2rem 1.8rem 0; border-right: 1px solid var(--filet); margin-right: 1.2rem; }
.programme div:last-child { border-right: 0; margin-right: 0; }
.programme .heure { font-family: var(--f-titre); font-size: 1.9rem; color: var(--or); line-height: 1; }
.programme h3 { font-family: var(--f-texte); font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; margin: .9rem 0 .4rem; color: var(--ivoire); }
.programme p { margin: 0; color: var(--gris); font-size: .9rem; line-height: 1.5; }

/* ---------- Galerie ---------- */
.galerie { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem; }
.galerie figure { margin: 0; position: relative; overflow: hidden; }
.galerie img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s ease; filter: saturate(.9); }
.galerie figure:hover img { transform: scale(1.04); }
.galerie figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.2rem 1rem .9rem; background: linear-gradient(transparent, rgba(21, 9, 13, .9)); font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--or-pale); }
.galerie .g-5 { grid-column: span 5; aspect-ratio: 5 / 4; }
.galerie .g-4 { grid-column: span 4; aspect-ratio: 4 / 4; }
.galerie .g-3 { grid-column: span 3; aspect-ratio: 3 / 4; }
.galerie .g-7 { grid-column: span 7; aspect-ratio: 7 / 4; }
.galerie .g-8 { grid-column: span 8; aspect-ratio: 8 / 4; }

/* ---------- Chiffres ---------- */
.chiffres { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; text-align: center; }
.chiffres b { display: block; font-family: var(--f-titre); font-weight: 400; font-size: clamp(2.8rem, 5vw, 4.4rem); color: var(--or); line-height: 1; }
.chiffres span { display: block; margin-top: .7rem; font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); }

/* ---------- Citation ---------- */
.citation { text-align: center; max-width: 820px; margin: 0 auto; }
.citation p { font-family: var(--f-titre); font-size: clamp(1.5rem, 2.8vw, 2.3rem); line-height: 1.35; color: var(--ivoire); margin: 1.4rem 0; }
.citation footer { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--or); }

/* ---------- Appel (bandeau final) ---------- */
.appel { position: relative; overflow: hidden; isolation: isolate; padding: clamp(4rem, 8vw, 7rem) 0; text-align: center; }
.appel > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.appel::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(94, 15, 31, .92), rgba(21, 9, 13, .78) 50%, rgba(94, 15, 31, .92)); }
.appel h2 { max-width: 18ch; margin-inline: auto; text-wrap: balance; }
.appel .chapo { margin: 1.2rem auto 2.2rem; }
.appel .actions { justify-content: center; }

/* ---------- Frontispice (en-tête de page interne) ---------- */
.frontispice { padding: 11rem 0 5rem; text-align: center; position: relative; overflow: hidden; isolation: isolate; border-bottom: 1px solid var(--filet); }
.frontispice-court { padding: 9rem 0 3.5rem; }
.frontispice-fond { position: absolute; inset: 0; z-index: -1; }
.frontispice-fond img { width: 100%; height: 100%; object-fit: cover; opacity: .28; }
.frontispice-fond::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(21, 9, 13, .5), var(--velours) 96%); }
.frontispice .surtitre { justify-content: center; }
.frontispice .surtitre::after { content: ""; width: 36px; height: 1px; background: var(--or); }
.frontispice h1 { max-width: 16ch; margin-inline: auto; text-wrap: balance; }
.frontispice .chapo { margin: 1.4rem auto 0; }

/* ---------- Page événements : tableaux ---------- */
.tableau-ev { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; padding: clamp(3rem, 6vw, 5rem) 0; border-bottom: 1px solid var(--filet); }
.tableau-ev:last-child { border-bottom: 0; }
.tableau-ev:nth-child(even) .tableau-visuel { order: 2; }
.tableau-visuel { position: relative; }
.tableau-visuel img { width: 100%; aspect-ratio: 16 / 11; object-fit: cover; outline: 1px solid var(--filet-fort); outline-offset: 10px; }
.tableau-visuel .numero { position: absolute; left: -10px; top: -10px; transform: translate(-50%, -50%); font-family: var(--f-titre); font-size: 2.2rem; color: var(--or); background: var(--velours); padding: .2rem .5rem; line-height: 1; }
.tableau-ev h2 { font-size: clamp(1.8rem, 3.2vw, 2.7rem); }
.tableau-ev .chapo { margin: .9rem 0 1.4rem; font-size: 1.05rem; }
.repere { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem 1.5rem; padding: 1.1rem 0; border-top: 1px solid var(--filet); border-bottom: 1px solid var(--filet); margin: 1.4rem 0; }
.repere div { font-size: .95rem; color: var(--ivoire-2); }
.repere .etiquette { display: block; margin-bottom: .15rem; }

.postes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.poste { padding: 1.6rem 0 0; border-top: 1px solid var(--filet-fort); }
.poste svg { color: var(--or); margin-bottom: .9rem; }
.poste h3 { font-family: var(--f-texte); font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--ivoire); margin-bottom: .4rem; }
.poste p { margin: 0; font-size: .92rem; color: var(--gris); }

/* ---------- Page production : actes ---------- */
.actes { display: grid; gap: 0; }
.acte { display: grid; grid-template-columns: 150px 1fr; gap: 2.5rem; padding: 2.4rem 0; border-top: 1px solid var(--filet); }
.acte:last-child { border-bottom: 1px solid var(--filet); }
.acte-num { font-family: var(--f-titre); font-size: 2.6rem; color: var(--rouge-vif); line-height: 1; }
.acte-num small { display: block; font-family: var(--f-texte); font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); margin-top: .5rem; }
.acte h3 { margin-bottom: .6rem; }
.acte p { margin: 0 0 .9rem; color: var(--ivoire-2); }
.acte ul { display: flex; flex-wrap: wrap; gap: .5rem; }
.acte ul li { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; padding: .4rem .7rem; border: 1px solid var(--filet-fort); color: var(--or-pale); }

.metiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.metier { padding: 1.8rem; border: 1px solid var(--filet); background: rgba(31, 16, 22, .6); display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: start; }
.metier svg { color: var(--or); }
.metier h3 { font-size: 1.2rem; margin-bottom: .3rem; }
.metier p { margin: 0; color: var(--gris); font-size: .92rem; }

/* ---------- Page société ---------- */
.valeurs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.valeur { text-align: center; padding: 2rem 1.5rem; border: 1px solid var(--filet); position: relative; }
.valeur::before { content: "✦"; position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); background: var(--velours); color: var(--or); padding: 0 .6rem; font-size: .8rem; }
.valeur h3 { margin: .6rem 0 .8rem; }
.valeur p { margin: 0; color: var(--ivoire-2); font-size: .98rem; }
.dates { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.date { padding-top: 1.4rem; border-top: 1px solid var(--filet-fort); }
.date .annee { font-family: var(--f-titre); font-size: 2.2rem; color: var(--or); line-height: 1; }
.date h3 { font-size: 1.15rem; margin: .7rem 0 .4rem; }
.date p { margin: 0; color: var(--gris); font-size: .92rem; }
.adresse { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--filet); }
.adresse img { width: 100%; height: 100%; object-fit: cover; min-height: 340px; }
.adresse-txt { padding: 2.6rem; display: flex; flex-direction: column; justify-content: center; gap: .7rem; background: var(--velours-2); }
.adresse-txt p { margin: 0; color: var(--ivoire-2); }

/* ---------- Formulaire ---------- */
.contact-grille { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.formulaire { display: grid; gap: 1.6rem; }
.champ { display: grid; gap: .3rem; }
.champ label { font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: var(--or-pale); }
.champ label b { color: var(--rouge-vif); font-weight: 400; }
.champ input, .champ select, .champ textarea {
  width: 100%; background: transparent; border: 0; border-bottom: 1px solid var(--filet-fort); border-radius: 0; color: var(--ivoire);
  padding: .8rem 0; font: inherit; font-size: 1.05rem; font-weight: 300; transition: border-color var(--transition);
}
.champ input::placeholder, .champ textarea::placeholder { color: var(--gris); opacity: .8; }
.champ select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--or) 50%), linear-gradient(135deg, var(--or) 50%, transparent 50%); background-position: calc(100% - 14px) 50%, calc(100% - 8px) 50%; background-size: 6px 6px; background-repeat: no-repeat; cursor: pointer; }
.champ select option { background: var(--velours-2); color: var(--ivoire); }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: 0; border-bottom-color: var(--or); }
.champ textarea { min-height: 140px; resize: vertical; }
.champ.erreur input, .champ.erreur select, .champ.erreur textarea { border-bottom-color: var(--rouge-vif); }
.champ .aide { font-size: .82rem; color: var(--gris); }
.rangee { display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem; }
.consent { display: flex; gap: .8rem; align-items: flex-start; font-size: .9rem; color: var(--ivoire-2); }
.consent input { width: 18px; height: 18px; margin-top: .25rem; accent-color: var(--or); flex: none; }
.consent.erreur { color: var(--rouge-vif); }
.pot-de-miel { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }
.message-etat { padding: 1rem 1.2rem; border: 1px solid; font-size: .95rem; margin-bottom: 1.6rem; }
.message-etat.ok { border-color: var(--or); background: rgba(217, 180, 106, .1); }
.message-etat.ko { border-color: var(--rouge-vif); background: rgba(200, 41, 63, .12); }

.encadre { border: 1px solid var(--filet); padding: 1.8rem; background: rgba(31, 16, 22, .6); }
.encadre + .encadre { margin-top: 1.4rem; }
.encadre h3 { font-size: 1.2rem; margin-bottom: 1rem; }
.encadre ul li { display: flex; gap: .8rem; align-items: flex-start; padding: .5rem 0; border-bottom: 1px solid var(--filet); color: var(--ivoire-2); font-size: .95rem; }
.encadre ul li:last-child { border-bottom: 0; }
.encadre ul svg { color: var(--or); flex: none; margin-top: .25rem; }
.suite { counter-reset: etape; display: grid; gap: .9rem; }
.suite li { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: baseline; counter-increment: etape; color: var(--ivoire-2); font-size: .95rem; }
.suite li::before { content: counter(etape, upper-roman); font-family: var(--f-titre); font-size: 1.3rem; color: var(--or); min-width: 1.8rem; }

/* ---------- Pages légales ---------- */
.legal-grille { display: grid; grid-template-columns: 230px 1fr; gap: 3.5rem; align-items: start; }
.legal-nav { position: sticky; top: 6rem; display: grid; gap: .2rem; }
.legal-nav a { padding: .6rem 1rem; border-left: 1px solid var(--filet); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--gris); transition: color var(--transition), border-color var(--transition); }
.legal-nav a:hover, .legal-nav a.actif { color: var(--or); border-color: var(--or); }
.legal { max-width: 74ch; }
.legal h2 { font-size: 1.6rem; margin: 2.4rem 0 .8rem; color: var(--ivoire); }
.legal h2:first-of-type { margin-top: 1.2rem; }
.legal p, .legal li { color: var(--ivoire-2); font-size: 1rem; }
.legal ul { list-style: none; padding-left: 0; display: grid; gap: .4rem; }
.legal ul li { padding-left: 1.3rem; position: relative; }
.legal ul li::before { content: "✦"; color: var(--or); font-size: .65rem; position: absolute; left: 0; top: .5rem; }
.legal table { border-collapse: collapse; width: 100%; font-size: .95rem; margin: 1rem 0; }
.legal th, .legal td { border: 1px solid var(--filet); padding: .6rem .8rem; text-align: left; vertical-align: top; }
.legal th { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--or); background: var(--velours-2); font-weight: 500; }

/* ---------- Pied de page ---------- */
.pied { margin-top: clamp(3rem, 7vw, 6rem); padding: 3rem 0 0; background: var(--velours-2); border-top: 1px solid var(--filet); }
.pied-haut { display: grid; grid-template-columns: 1.5fr 1fr 1.2fr 1fr; gap: 2.5rem; padding: 3rem 0; }
.pied-marque p { color: var(--gris); font-size: .95rem; margin: 1.2rem 0 0; max-width: 40ch; }
.pied-col h3 { font-family: var(--f-texte); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; color: var(--or); margin-bottom: 1rem; }
.pied-col ul { display: grid; gap: .5rem; }
.pied-col ul a { color: var(--ivoire-2); font-size: .95rem; transition: color var(--transition); }
.pied-col ul a:hover { color: var(--or); }
.pied-contact li { display: flex; gap: .7rem; align-items: flex-start; color: var(--ivoire-2); font-size: .95rem; }
.pied-contact svg { color: var(--or); flex: none; margin-top: .3rem; }
.pied-bas { display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; padding: 1.3rem 0; border-top: 1px solid var(--filet); }
.pied-bas p { margin: 0; font-size: .78rem; color: var(--gris); letter-spacing: .04em; }

/* ---------- Cookies ---------- */
.bandeau-cookies { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 200; max-width: 640px; margin-inline: auto; background: var(--ivoire); color: var(--velours); padding: 1rem 1.2rem; display: flex; gap: 1rem; align-items: center; box-shadow: 0 20px 50px rgba(0, 0, 0, .5); border-top: 3px solid var(--or); }
.bandeau-cookies[hidden] { display: none; }
.bandeau-cookies p { margin: 0; font-size: .9rem; font-weight: 400; }
.bandeau-cookies a { color: var(--rouge); text-decoration: underline; }
.bandeau-cookies .bouton { flex: none; }

/* ---------- Apparition au défilement (sans JS : visible) ---------- */
.js .apparait { opacity: 0; transform: translateY(18px); transition: opacity .9s ease, transform .9s cubic-bezier(.25, .8, .25, 1); }
.js .apparait.visible { opacity: 1; transform: none; }
.js .apparait.delai-1 { transition-delay: .15s; } .js .apparait.delai-2 { transition-delay: .3s; } .js .apparait.delai-3 { transition-delay: .45s; }
@media (prefers-reduced-motion: reduce) { .js .apparait { opacity: 1; transform: none; transition: none; } .rideau { display: none; } }

/* ---------- Responsive ---------- */
@media (max-width: 1040px) {
  .affiches, .metiers, .valeurs { grid-template-columns: repeat(2, 1fr); }
  .postes, .dates, .chiffres { grid-template-columns: repeat(2, 1fr); }
  .programme { grid-template-columns: repeat(3, 1fr); }
  .programme div:nth-child(3) { border-right: 0; }
  .galerie .g-5, .galerie .g-7, .galerie .g-8 { grid-column: span 6; }
  .galerie .g-4, .galerie .g-3 { grid-column: span 6; aspect-ratio: 4 / 3; }
  .pied-haut { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  :root { --gouttiere: 16px; }
  .burger { display: flex; position: relative; z-index: 3; }
  .marque { position: relative; z-index: 3; }
  .frise, .frise.collee { background: rgba(21, 9, 13, .96); backdrop-filter: none; -webkit-backdrop-filter: none; padding: .8rem 0; border-color: var(--filet); }
  .nav { position: fixed; inset: 0; z-index: 2; background: var(--velours); padding: 6rem var(--gouttiere) 2rem; transform: translateX(100%); transition: transform var(--transition); display: flex; flex-direction: column; justify-content: space-between; }
  .nav.ouvert { transform: none; }
  .nav ul { flex-direction: column; align-items: flex-start; gap: 1.4rem; }
  .nav a:not(.bouton) { font-family: var(--f-titre); font-size: 2rem; letter-spacing: 0; text-transform: none; font-weight: 400; }
  .nav-cta { margin-top: 1rem; }
  .nav-pied { display: block; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }
  .marque-sous { display: none; }
  .scene-int { padding: 7rem 0 11rem; }
  .scene-pied .contenant { grid-template-columns: 1fr; }
  .scene-pied div { border-right: 0; border-bottom: 1px solid var(--filet); padding: .7rem 0; }
  .scene-pied div:last-child { border-bottom: 0; }
  .deux-col, .modes, .tableau-ev, .adresse, .contact-grille, .legal-grille, .rangee, .repere { grid-template-columns: 1fr; }
  .modes-sep { height: 1px; background: linear-gradient(90deg, transparent, var(--filet-fort), transparent); }
  .tableau-ev:nth-child(even) .tableau-visuel { order: 0; }
  .acte { grid-template-columns: 1fr; gap: 1rem; }
  .legal-nav { position: static; grid-template-columns: repeat(2, 1fr); }
  .pied-haut { grid-template-columns: 1fr; gap: 2rem; }
  .bandeau-cookies { flex-direction: column; align-items: stretch; }
}
@media (max-width: 560px) {
  .affiches, .metiers, .valeurs, .postes, .dates, .chiffres, .programme { grid-template-columns: 1fr; }
  .programme div { border-right: 0; margin-right: 0; border-bottom: 1px solid var(--filet); padding: 1.2rem 0; }
  .programme div:last-child { border-bottom: 0; }
  .galerie figure { grid-column: span 12 !important; aspect-ratio: 4 / 3 !important; }
  .actions .bouton { width: 100%; justify-content: center; }
}