/* Théâtre Le 13e Art · feuille de style unique (COV 360) */

/* ---------- Polices auto-hébergées ---------- */
@font-face { font-family: 'Poppins'; font-weight: 300; font-display: swap; src: url('/assets/fonts/poppins-300-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-weight: 300; font-display: swap; src: url('/assets/fonts/poppins-300-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-weight: 400; font-display: swap; src: url('/assets/fonts/poppins-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-weight: 400; font-display: swap; src: url('/assets/fonts/poppins-400-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-weight: 500; font-display: swap; src: url('/assets/fonts/poppins-500-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-weight: 500; font-display: swap; src: url('/assets/fonts/poppins-500-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-weight: 600; font-display: swap; src: url('/assets/fonts/poppins-600-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-weight: 600; font-display: swap; src: url('/assets/fonts/poppins-600-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Playfair Display'; font-weight: 500; font-display: swap; src: url('/assets/fonts/playfair-display-500-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Playfair Display'; font-weight: 500; font-display: swap; src: url('/assets/fonts/playfair-display-500-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Playfair Display'; font-weight: 600; font-display: swap; src: url('/assets/fonts/playfair-display-600-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Playfair Display'; font-weight: 600; font-display: swap; src: url('/assets/fonts/playfair-display-600-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02AF, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ---------- Jetons ---------- */
:root {
  --noir: #09090b;
  --encre: #111114;
  --encre-2: #17171c;
  --rouge: #dd3332;
  --rouge-fonce: #b92a29;
  --or: #c8ad8c;
  --or-clair: #e3cfb4;
  --blanc: #ffffff;
  --texte: rgba(255, 255, 255, 0.86);
  --texte-doux: rgba(255, 255, 255, 0.62);
  --trait: rgba(255, 255, 255, 0.1);

  /* Verre : mêmes réglages que les sites COV (neutre, sans teinte) */
  --glass-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.03) 50%, rgba(255, 255, 255, 0.01) 100%);
  --glass-border: rgba(255, 255, 255, 0.16);
  --glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.18);
  --blur-glass: blur(28px) saturate(1.25);
  --glass-sombre: rgba(12, 12, 15, 0.58);
  --ombre: 0 30px 80px -30px rgba(0, 0, 0, 0.7);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-court: 0.35s;
  --t-moyen: 0.7s;
  --t-long: 1.1s;

  --f-titre: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --f-texte: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --largeur: 1240px;
  --marge: clamp(1.25rem, 4vw, 2.5rem);
  --entete: 76px;
  --rayon: 1.25rem;
  --rayon-s: 0.75rem;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--entete) + 1rem); }
body {
  margin: 0;
  background: var(--noir);
  color: var(--texte);
  font-family: var(--f-texte);
  font-weight: 300;
  font-size: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
body::before { /* lueurs de scène, sur lesquelles le verre prend toute sa matière */
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(60vw 50vh at 12% -10%, rgba(221, 51, 50, 0.16), transparent 70%),
    radial-gradient(50vw 45vh at 95% 20%, rgba(200, 173, 140, 0.10), transparent 70%),
    radial-gradient(70vw 60vh at 50% 120%, rgba(221, 51, 50, 0.08), transparent 70%);
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
p a:not(.bouton), .article li a, .liste-points a, dd a, td a, .lien { color: var(--or-clair); text-decoration: underline; text-decoration-color: rgba(227, 207, 180, 0.4); text-underline-offset: 0.2em; transition: text-decoration-color var(--t-court) var(--ease-out), color var(--t-court); }
p a:not(.bouton):hover, .article li a:hover, .liste-points a:hover, dd a:hover, td a:hover, .lien:hover { color: var(--blanc); text-decoration-color: var(--blanc); }
h1, h2, h3, h4 { font-family: var(--f-titre); font-weight: 500; color: var(--blanc); line-height: 1.12; margin: 0 0 0.6em; letter-spacing: -0.01em; text-wrap: balance; }
h1 { font-size: clamp(2.4rem, 1.6rem + 3.6vw, 4.6rem); }
h2 { font-size: clamp(1.9rem, 1.4rem + 2vw, 3rem); }
h3 { font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.7rem); }
h4 { font-size: 1.15rem; }
p { margin: 0 0 1.1em; text-wrap: pretty; }
strong { font-weight: 500; color: var(--blanc); }
::selection { background: var(--rouge); color: var(--blanc); }
:focus-visible { outline: 2px solid var(--or); outline-offset: 3px; border-radius: 4px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.evitement { position: fixed; top: 0.75rem; left: 0.75rem; z-index: 200; padding: 0.7rem 1.1rem; border-radius: 999px; background: var(--rouge); color: #fff; transform: translateY(-160%); transition: transform var(--t-court) var(--ease-out); }
.evitement:focus { transform: none; }

.conteneur { width: min(100% - 2 * var(--marge), var(--largeur)); margin-inline: auto; }
.etroit { width: min(100% - 2 * var(--marge), 820px); margin-inline: auto; }
.section { padding-block: clamp(4rem, 3rem + 5vw, 7.5rem); }
.section--serre { padding-block: clamp(2.5rem, 2rem + 3vw, 4.5rem); }
.surtitre { display: inline-flex; align-items: center; gap: 0.7rem; font-family: var(--f-texte); font-size: 0.78rem; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--or); margin-bottom: 1.1rem; }
.surtitre::before { content: ""; width: 28px; height: 1px; background: currentColor; opacity: 0.7; }
.chapeau { font-size: clamp(1.08rem, 1rem + 0.4vw, 1.3rem); color: var(--texte); max-width: 46rem; }
.doux { color: var(--texte-doux); }
.centre { text-align: center; }
.centre .surtitre { justify-content: center; }
.centre .chapeau { margin-inline: auto; }

/* ---------- Verre ---------- */
.verre {
  position: relative;
  background: var(--glass-bg), var(--glass-sombre);
  border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: var(--blur-glass);
  backdrop-filter: var(--blur-glass);
  box-shadow: var(--glass-highlight), var(--ombre);
  border-radius: var(--rayon);
}
.reflet { overflow: hidden; isolation: isolate; }
.reflet::after { /* bande lumineuse qui balaie le verre au survol, comme sur cov-360.com */
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 3;
  background: linear-gradient(115deg, transparent 32%, rgba(255, 255, 255, 0.14) 48%, rgba(255, 255, 255, 0.04) 54%, transparent 66%);
  transform: translateX(-120%);
  transition: transform 1.1s var(--ease-out);
}
.reflet:hover::after, .reflet:focus-within::after { transform: translateX(120%); }

/* ---------- Boutons ---------- */
.bouton {
  --fond: var(--rouge);
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
  min-height: 48px; padding: 0.8rem 1.5rem; border-radius: 999px; border: 1px solid transparent;
  background: var(--fond); color: var(--blanc);
  font-family: var(--f-texte); font-size: 0.9rem; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; line-height: 1;
  cursor: pointer; overflow: hidden; isolation: isolate;
  transition: transform var(--t-court) var(--ease-out), background-color var(--t-court), box-shadow var(--t-moyen) var(--ease-out), border-color var(--t-court);
  box-shadow: 0 12px 30px -12px rgba(221, 51, 50, 0.65);
}
.bouton:hover { transform: translateY(-2px); background-color: var(--rouge-fonce); box-shadow: 0 18px 40px -14px rgba(221, 51, 50, 0.8); }
.bouton:active { transform: translateY(0); }
.bouton svg { width: 1.05em; height: 1.05em; flex: none; transition: transform var(--t-court) var(--ease-out); }
.bouton:hover svg { transform: translateX(3px); }
.bouton--verre { background: var(--glass-bg), rgba(255, 255, 255, 0.04); border-color: var(--glass-border); -webkit-backdrop-filter: var(--blur-glass); backdrop-filter: var(--blur-glass); box-shadow: var(--glass-highlight); }
.bouton--verre:hover { background-color: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.3); box-shadow: var(--glass-highlight); }
.bouton--or { --fond: var(--or); color: var(--noir); box-shadow: 0 12px 30px -14px rgba(200, 173, 140, 0.7); }
.bouton--or:hover { background-color: var(--or-clair); }
.bouton--petit { min-height: 40px; padding: 0.6rem 1.1rem; font-size: 0.78rem; }
.boutons { display: flex; flex-wrap: wrap; gap: 0.8rem; }

/* ---------- En-tête et menu ---------- */
.entete {
  position: fixed; inset: 0 0 auto; z-index: 100; height: var(--entete);
  transition: background-color var(--t-moyen) var(--ease-out), border-color var(--t-moyen), -webkit-backdrop-filter var(--t-moyen), backdrop-filter var(--t-moyen), transform var(--t-moyen) var(--ease-out);
  border-bottom: 1px solid transparent;
}
.entete::before { /* fond de verre, invisible en haut de page */
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--glass-bg), rgba(10, 10, 13, 0.55);
  -webkit-backdrop-filter: var(--blur-glass); backdrop-filter: var(--blur-glass);
  opacity: 0; transition: opacity var(--t-moyen) var(--ease-out);
}
.entete.est-defile::before, .entete.menu-ouvert::before, .entete:has(.nav__item:hover)::before, .page-claire .entete::before { opacity: 1; }
.entete.est-defile, .entete.menu-ouvert { border-bottom-color: var(--trait); }
.entete__ligne { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.logo { display: block; flex: none; width: 128px; transition: opacity var(--t-court); }
.logo img { width: 100%; height: auto; }
.logo:hover { opacity: 0.85; }

.nav { display: flex; align-items: center; gap: 0.25rem; height: 100%; }
.nav__item { height: 100%; display: flex; align-items: center; }
.nav__bouton {
  display: inline-flex; align-items: center; gap: 0.4rem; height: 44px; padding: 0 1rem; border-radius: 999px; border: 0; background: transparent;
  color: var(--blanc); font: 400 0.92rem/1 var(--f-texte); letter-spacing: 0.02em; white-space: nowrap; cursor: pointer;
  transition: background-color var(--t-court) var(--ease-out), color var(--t-court);
}
.nav__bouton svg { width: 12px; height: 12px; opacity: 0.7; transition: transform var(--t-court) var(--ease-out); }
.nav__item:hover .nav__bouton, .nav__item:focus-within .nav__bouton, .nav__item.est-ouvert .nav__bouton { background: rgba(255, 255, 255, 0.08); }
.nav__item.est-ouvert .nav__bouton svg, .nav__item:hover .nav__bouton svg { transform: rotate(180deg); }
.nav__bouton[aria-current="page"] { color: var(--or-clair); }

.panneau {
  position: absolute; left: 0; right: 0; top: 100%;
  padding-block: 2rem 2.4rem;
  background: var(--glass-bg), rgba(10, 10, 13, 0.82);
  -webkit-backdrop-filter: var(--blur-glass); backdrop-filter: var(--blur-glass);
  border-bottom: 1px solid var(--trait);
  box-shadow: 0 40px 80px -40px rgba(0, 0, 0, 0.9);
  opacity: 0; visibility: hidden; transform: translateY(-10px);
  transition: opacity var(--t-court) var(--ease-out), transform 0.5s var(--ease-out), visibility 0s linear var(--t-court);
}
.nav__item.est-ouvert .panneau { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
@media (hover: hover) {
  .nav__item:hover .panneau { opacity: 1; visibility: visible; transform: none; transition-delay: 0.08s, 0.08s, 0s; }
  .nav__item:hover .nav__bouton { background: rgba(255, 255, 255, 0.08); }
}
.nav:has(.nav__item.est-ouvert) .nav__item:not(.est-ouvert):not(:hover) .panneau { opacity: 0; visibility: hidden; }
.panneau__grille { display: grid; grid-template-columns: minmax(200px, 0.8fr) 2fr minmax(240px, 1fr); gap: 2.5rem; align-items: start; }
.panneau__tete h2 { font-size: 1.9rem; margin-bottom: 0.4rem; }
.panneau__tete p { color: var(--texte-doux); font-size: 0.92rem; margin: 0; }
.panneau__liens { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.4rem 1.5rem; list-style: none; margin: 0; padding: 0; }
.panneau__liens a { display: block; padding: 0.75rem 0.9rem; border-radius: var(--rayon-s); transition: background-color var(--t-court) var(--ease-out), transform var(--t-court) var(--ease-out); }
.panneau__liens a:hover, .panneau__liens a:focus-visible { background: rgba(255, 255, 255, 0.06); transform: translateX(4px); }
.panneau__liens strong { display: block; font-weight: 500; font-size: 0.98rem; color: var(--blanc); }
.panneau__liens span { display: block; font-size: 0.82rem; color: var(--texte-doux); line-height: 1.45; margin-top: 0.15rem; }
.panneau__carte { display: grid; grid-template-columns: 84px 1fr; gap: 1rem; align-items: center; padding: 0.9rem; }
.panneau__carte img { width: 84px; aspect-ratio: 3/4; object-fit: cover; border-radius: 0.6rem; }
.panneau__carte small { display: block; color: var(--or); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; }
.panneau__carte strong { display: block; font-family: var(--f-titre); font-size: 1.15rem; font-weight: 500; color: var(--blanc); line-height: 1.2; margin: 0.15rem 0; }
.panneau__carte span { font-size: 0.82rem; color: var(--texte-doux); }
.entete__actions { display: flex; align-items: center; gap: 0.6rem; }
.burger { display: none; width: 46px; height: 46px; border-radius: 999px; border: 1px solid var(--glass-border); background: rgba(255, 255, 255, 0.04); color: var(--blanc); cursor: pointer; place-items: center; }
.burger { position: relative; }
.burger span { position: absolute; left: 50%; top: 50%; width: 18px; height: 1.5px; margin: -0.75px 0 0 -9px; background: currentColor; border-radius: 2px; transition: transform var(--t-court) var(--ease-out), opacity var(--t-court); }
.burger span:nth-child(1) { transform: translateY(-6px); }
.burger span:nth-child(3) { transform: translateY(6px); }
.menu-ouvert .burger span:nth-child(1) { transform: rotate(45deg); }
.menu-ouvert .burger span:nth-child(2) { opacity: 0; }
.menu-ouvert .burger span:nth-child(3) { transform: rotate(-45deg); }

/* Menu mobile : un tiroir de verre plein écran, rubriques en accordéon */
.tiroir { display: none; }
@media (max-width: 1180px) {
  .entete__ligne { gap: 0.8rem; }
  .logo { width: 108px; }
  .nav { gap: 0; }
  .nav__bouton { padding: 0 0.7rem; font-size: 0.86rem; }
  .panneau__grille { grid-template-columns: minmax(180px, 0.7fr) 2fr; gap: 1.8rem; }
  .panneau__carte { display: none; }
}
@media (max-width: 1000px) {
  .logo { width: 96px; }
  .nav__bouton { padding: 0 0.5rem; font-size: 0.8rem; gap: 0.25rem; letter-spacing: 0; }
  .nav__bouton svg { width: 10px; height: 10px; }
  .entete__actions .bouton--petit { padding-inline: 0.8rem; font-size: 0.72rem; }
}
@media (max-width: 860px) {
  .nav, .entete__actions .bouton--billetterie-large { display: none; }
  .burger { display: grid; }
  .tiroir {
    display: block; position: fixed; inset: var(--entete) 0 0; z-index: 99; overflow-y: auto; overscroll-behavior: contain;
    padding: 1.5rem var(--marge) 2.5rem;
    background: var(--glass-bg), rgba(9, 9, 11, 0.9);
    -webkit-backdrop-filter: var(--blur-glass); backdrop-filter: var(--blur-glass);
    opacity: 0; visibility: hidden; transform: translateY(-12px);
    transition: opacity var(--t-court) var(--ease-out), transform 0.5s var(--ease-out), visibility 0s linear var(--t-court);
  }
  .menu-ouvert .tiroir { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .tiroir details { border-bottom: 1px solid var(--trait); }
  .tiroir summary { list-style: none; display: flex; justify-content: space-between; align-items: center; padding: 1.1rem 0; font-family: var(--f-titre); font-size: 1.6rem; color: var(--blanc); cursor: pointer; }
  .tiroir summary::-webkit-details-marker { display: none; }
  .tiroir summary svg { width: 16px; height: 16px; transition: transform var(--t-court) var(--ease-out); }
  .tiroir details[open] summary svg { transform: rotate(180deg); }
  .tiroir ul { list-style: none; margin: 0 0 1rem; padding: 0; }
  .tiroir li a { display: block; padding: 0.55rem 0; }
  .tiroir li strong { display: block; font-weight: 500; color: var(--blanc); }
  .tiroir li span { display: block; font-size: 0.85rem; color: var(--texte-doux); }
  .tiroir .bouton { width: 100%; margin-top: 1.5rem; }
  .tiroir__infos { margin-top: 1.5rem; font-size: 0.9rem; color: var(--texte-doux); }
}
@media (max-width: 520px) { .entete__actions .bouton--petit { padding-inline: 0.9rem; } .logo { width: 108px; } }

/* ---------- Héros d'accueil (diaporama en fondu) ---------- */
.heros { position: relative; min-height: min(100svh, 980px); display: grid; align-items: end; overflow: hidden; isolation: isolate; }
.heros__diapo { position: absolute; inset: 0; opacity: 0; transition: opacity 0.9s var(--ease-in-out); z-index: 0; }
.heros__diapo.est-active { opacity: 1; z-index: 1; }
.heros__fond { position: absolute; inset: -4%; background-size: cover; background-position: center 30%; transform: scale(1.08); transition: transform 9s linear; will-change: transform; }
.heros__diapo.est-active .heros__fond { transform: scale(1); }
.heros__fond--flou { filter: blur(40px) saturate(1.2); opacity: 0.55; }
.heros__affiche { position: absolute; right: max(var(--marge), calc((100vw - var(--largeur)) / 2)); top: 50%; width: min(30vw, 400px); aspect-ratio: 4/5; transform: translateY(-46%) translateX(30px); opacity: 0; transition: transform 1.4s var(--ease-out), opacity 1.1s var(--ease-out); border-radius: var(--rayon); overflow: hidden; box-shadow: 0 50px 100px -40px rgba(0, 0, 0, 0.9); }
.heros__affiche img { width: 100%; height: 100%; object-fit: cover; }
.heros__diapo.est-active .heros__affiche { transform: translateY(-50%); opacity: 1; transition-delay: 0.25s; }
.heros::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(90deg, rgba(9, 9, 11, 0.92) 0%, rgba(9, 9, 11, 0.55) 45%, rgba(9, 9, 11, 0.15) 75%), linear-gradient(0deg, var(--noir) 0%, transparent 35%); }
.heros__contenu { position: relative; z-index: 3; padding-block: calc(var(--entete) + 3rem) clamp(3rem, 8vh, 6rem); }
.heros__texte { max-width: 38rem; }
.heros__texte > * { transition: opacity 0.9s var(--ease-out), transform 0.9s var(--ease-out); }
.heros.change .heros__texte > * { opacity: 0; transform: translateY(14px); }
.heros__titre { font-size: clamp(2.8rem, 1.8rem + 4.4vw, 5.6rem); margin-bottom: 0.25em; }
.heros__dates { font-size: 1.05rem; color: var(--or-clair); margin-bottom: 1.6rem; }
.heros__controles { display: flex; align-items: center; gap: 1rem; margin-top: 2.6rem; }
.heros__points { display: flex; gap: 0.5rem; }
.heros__points button { width: 34px; height: 4px; border: 0; padding: 0; border-radius: 4px; background: rgba(255, 255, 255, 0.25); cursor: pointer; position: relative; overflow: hidden; }
.heros__points button::after { content: ""; position: absolute; inset: 0; background: var(--blanc); transform: scaleX(0); transform-origin: left; }
.heros__points button.est-active::after { animation: progres var(--duree-diapo, 7s) linear forwards; }
.heros.en-pause .heros__points button.est-active::after { animation-play-state: paused; }
@keyframes progres { to { transform: scaleX(1); } }
.heros__fleche { width: 44px; height: 44px; border-radius: 999px; display: grid; place-items: center; color: var(--blanc); cursor: pointer; border: 1px solid var(--glass-border); background: rgba(255, 255, 255, 0.05); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); transition: background-color var(--t-court); }
.heros__fleche:hover { background: rgba(255, 255, 255, 0.14); }
.heros__fleche svg { width: 16px; height: 16px; }
@media (max-width: 860px) {
  .heros { align-items: end; }
  .heros__affiche { display: none; }
  .heros::after { background: linear-gradient(0deg, var(--noir) 8%, rgba(9, 9, 11, 0.7) 50%, rgba(9, 9, 11, 0.35) 100%); }
}

/* ---------- Bandeau infos clés (sous le héros) ---------- */
.reperes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: -2.2rem; position: relative; z-index: 4; }
.reperes > div { padding: 1.4rem 1.6rem; border-right: 1px solid var(--trait); }
.reperes > div:last-child { border-right: 0; }
.reperes strong { display: block; font-family: var(--f-titre); font-size: 1.5rem; font-weight: 500; color: var(--blanc); line-height: 1.15; }
.reperes span { font-size: 0.85rem; color: var(--texte-doux); }
@media (max-width: 860px) { .reperes { grid-template-columns: repeat(2, minmax(0, 1fr)); } .reperes > div:nth-child(2) { border-right: 0; } .reperes > div:nth-child(-n+2) { border-bottom: 1px solid var(--trait); } }

/* ---------- Grilles et cartes spectacles ---------- */
.tete-section { display: flex; justify-content: space-between; align-items: end; gap: 2rem; flex-wrap: wrap; margin-bottom: 2.6rem; }
.tete-section h2 { margin: 0; }
.filtres { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.filtre { min-height: 40px; padding: 0.5rem 1rem; border-radius: 999px; border: 1px solid var(--glass-border); background: rgba(255, 255, 255, 0.03); color: var(--texte); font: 400 0.85rem/1 var(--f-texte); cursor: pointer; transition: background-color var(--t-court) var(--ease-out), color var(--t-court), border-color var(--t-court); }
.filtre:hover { background: rgba(255, 255, 255, 0.08); }
.filtre[aria-pressed="true"] { background: var(--blanc); color: var(--noir); border-color: var(--blanc); }
.grille-spectacles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: clamp(1.2rem, 2vw, 1.8rem); }
.carte { position: relative; display: flex; flex-direction: column; border-radius: var(--rayon); transition: transform var(--t-moyen) var(--ease-out), opacity 0.45s var(--ease-out); }
.carte__visuel { position: relative; aspect-ratio: 3/4; border-radius: var(--rayon); overflow: hidden; background: var(--encre-2); box-shadow: 0 30px 60px -36px rgba(0, 0, 0, 0.9); }
.carte__visuel img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out), filter var(--t-moyen); }
.carte:hover { transform: translateY(-6px); }
.carte:hover .carte__visuel img { transform: scale(1.05); }
.carte__badge { position: absolute; top: 0.8rem; left: 0.8rem; z-index: 2; padding: 0.35rem 0.7rem; border-radius: 999px; font-size: 0.7rem; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--blanc); background: var(--glass-bg), rgba(10, 10, 13, 0.45); border: 1px solid var(--glass-border); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.carte__badge--rouge { background: var(--rouge); border-color: transparent; }
.carte__corps { padding: 1rem 0.2rem 0; }
.carte__genre { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--or); }
.carte__titre { font-family: var(--f-titre); font-size: 1.35rem; font-weight: 500; color: var(--blanc); line-height: 1.2; margin: 0.25rem 0 0.3rem; }
.carte__dates { font-size: 0.88rem; color: var(--texte-doux); }
.carte__lien::before { content: ""; position: absolute; inset: 0; z-index: 4; border-radius: var(--rayon); }
.carte.est-masquee { display: none; }
.carte.apparait { animation: apparait 0.6s var(--ease-out) both; }
@keyframes apparait { from { opacity: 0; transform: translateY(16px); } }
.mois { grid-column: 1 / -1; display: flex; align-items: center; gap: 1rem; margin: 1.2rem 0 -0.2rem; font-family: var(--f-titre); font-size: 1.4rem; color: var(--blanc); }
.mois::after { content: ""; flex: 1; height: 1px; background: var(--trait); }
.mois.est-masquee { display: none; }

/* Affiche typographique quand le visuel n'est pas encore fourni */
.affiche-typo { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 3.4rem 1.4rem 1.4rem; background: radial-gradient(120% 80% at 20% 0%, rgba(221, 51, 50, 0.55), transparent 60%), radial-gradient(90% 70% at 100% 100%, rgba(200, 173, 140, 0.35), transparent 60%), #141418; }
.affiche-typo small { font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--or-clair); }
.affiche-typo strong { font-family: var(--f-titre); font-weight: 500; font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.2rem); line-height: 1.05; color: var(--blanc); }
.affiche-typo span { font-size: 0.8rem; color: var(--texte); }

/* ---------- Blocs éditoriaux ---------- */
.duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.duo--inverse > :first-child { order: 2; }
.duo__visuel { border-radius: var(--rayon); overflow: hidden; aspect-ratio: 4/3; box-shadow: var(--ombre); }
.duo__visuel img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.duo__visuel:hover img { transform: scale(1.04); }
@media (max-width: 860px) { .duo { grid-template-columns: 1fr; } .duo--inverse > :first-child { order: 0; } }
.cartes-verre { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 1.2rem; }
.carte-verre { padding: 1.8rem; transition: transform var(--t-moyen) var(--ease-out), box-shadow var(--t-moyen) var(--ease-out); }
.carte-verre:hover { transform: translateY(-4px); }
.carte-verre h3 { font-size: 1.4rem; margin-bottom: 0.5rem; }
.carte-verre p { color: var(--texte-doux); font-size: 0.95rem; margin-bottom: 0; }
.carte-verre .chiffre { font-family: var(--f-titre); font-size: 2.6rem; color: var(--blanc); line-height: 1; margin-bottom: 0.6rem; }
.carte-verre .chiffre small { font-size: 1rem; color: var(--or); margin-left: 0.3rem; }
.carte-verre__lien { display: inline-flex; align-items: center; gap: 0.4rem; margin-top: 1rem; color: var(--or-clair); font-size: 0.88rem; font-weight: 500; }
.carte-verre__lien svg { width: 14px; transition: transform var(--t-court) var(--ease-out); }
.carte-verre:hover .carte-verre__lien svg { transform: translateX(4px); }
a.carte-verre { display: block; }
.liste-points { list-style: none; padding: 0; margin: 0 0 1.4rem; display: grid; gap: 0.55rem; }
.liste-points li { position: relative; padding-left: 1.4rem; }
.liste-points li::before { content: ""; position: absolute; left: 0; top: 0.72em; width: 7px; height: 7px; border-radius: 50%; background: var(--rouge); }

/* ---------- En-tête de page intérieure ---------- */
.tete-page { position: relative; padding-block: calc(var(--entete) + clamp(3rem, 8vw, 6rem)) clamp(2.5rem, 5vw, 4rem); overflow: hidden; isolation: isolate; }
.tete-page__fond { position: absolute; inset: 0; z-index: -1; }
.tete-page__fond img { width: 100%; height: 100%; object-fit: cover; opacity: 0.35; transform: scale(1.04); animation: respire 14s var(--ease-in-out) infinite alternate; }
.tete-page__fond::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, var(--noir) 4%, rgba(9, 9, 11, 0.55) 60%, rgba(9, 9, 11, 0.8) 100%); }
@keyframes respire { to { transform: scale(1.1); } }
.fil { display: flex; flex-wrap: wrap; gap: 0.5rem; font-size: 0.82rem; color: var(--texte-doux); margin-bottom: 1.4rem; list-style: none; padding: 0; }
.fil li + li::before { content: "/"; margin-right: 0.5rem; opacity: 0.5; }
.fil a:hover { color: var(--blanc); }

/* ---------- Fiche spectacle ---------- */
.fiche-tete { position: relative; padding-block: calc(var(--entete) + 2.5rem) 3rem; overflow: hidden; isolation: isolate; }
.fiche-tete__fond { position: absolute; inset: -10%; z-index: -2; background-size: cover; background-position: center; filter: blur(60px) saturate(1.3); opacity: 0.55; transform: scale(1.1); }
.fiche-tete::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, var(--noir) 0%, rgba(9, 9, 11, 0.35) 60%, rgba(9, 9, 11, 0.7) 100%); }
.fiche-tete__grille { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.fiche-tete__affiche { position: relative; border-radius: var(--rayon); overflow: hidden; aspect-ratio: 3/4; box-shadow: 0 60px 120px -50px rgba(0, 0, 0, 0.95); }
.fiche-tete__affiche img { width: 100%; height: 100%; object-fit: cover; }
.fiche-tete__presente { font-size: 0.85rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or); margin-bottom: 0.8rem; }
.fiche-tete h1 { margin-bottom: 0.2em; }
.fiche-tete__sous { font-family: var(--f-texte); font-size: 1rem; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase; color: var(--texte); margin-bottom: 1.6rem; }
.infos { padding: 1.6rem 1.8rem; margin-top: 1.8rem; }
.infos dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem 1.6rem; margin: 0 0 1.5rem; }
.infos dt { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--or); margin-bottom: 0.2rem; }
.infos dd { margin: 0; color: var(--blanc); font-weight: 400; }
.infos .bouton { width: 100%; }
.infos__note { font-size: 0.8rem; color: var(--texte-doux); text-align: center; margin: 0.8rem 0 0; }
@media (max-width: 860px) { .fiche-tete__grille { grid-template-columns: 1fr; } .fiche-tete__affiche { max-width: 360px; } }
.fiche-corps { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(260px, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.fiche-corps__texte p:first-of-type { font-size: 1.15rem; color: var(--blanc); }
.encart { padding: 1.6rem 1.8rem; position: sticky; top: calc(var(--entete) + 1.5rem); }
.encart h3 { font-size: 1.15rem; font-family: var(--f-texte); font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or); margin-bottom: 1rem; }
.encart dl { margin: 0; }
.encart dt { font-size: 0.82rem; color: var(--texte-doux); margin-top: 0.9rem; }
.encart dt:first-child { margin-top: 0; }
.encart dd { margin: 0.1rem 0 0; color: var(--blanc); }
@media (max-width: 860px) { .fiche-corps { grid-template-columns: 1fr; } .encart { position: static; } }
.video { position: relative; aspect-ratio: 16/9; border-radius: var(--rayon); overflow: hidden; background: #000; cursor: pointer; box-shadow: var(--ombre); }
.video img { width: 100%; height: 100%; object-fit: cover; opacity: 0.75; transition: opacity var(--t-moyen), transform 1.2s var(--ease-out); }
.video:hover img { opacity: 0.9; transform: scale(1.03); }
.video__lecture { position: absolute; inset: 0; margin: auto; width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center; background: var(--rouge); color: #fff; border: 0; cursor: pointer; transition: transform var(--t-court) var(--ease-out); box-shadow: 0 20px 50px -10px rgba(221, 51, 50, 0.7); }
.video:hover .video__lecture { transform: scale(1.08); }
.video__lecture svg { width: 26px; height: 26px; margin-left: 4px; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 1rem; }
.galerie figure { margin: 0; border-radius: var(--rayon-s); overflow: hidden; aspect-ratio: 4/3; }
.galerie img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.galerie figure:hover img { transform: scale(1.05); }
.barre-reserver { display: none; }
@media (max-width: 860px) {
  .barre-reserver { display: flex; position: fixed; left: 0.75rem; right: 0.75rem; bottom: 0.75rem; z-index: 90; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.7rem 0.7rem 0.7rem 1.1rem; border-radius: 999px; transform: translateY(140%); transition: transform var(--t-moyen) var(--ease-out); }
  .barre-reserver.est-visible { transform: none; }
  .barre-reserver strong { font-size: 0.92rem; line-height: 1.2; }
  .barre-reserver small { display: block; color: var(--texte-doux); font-size: 0.75rem; }
}

/* ---------- Privatisation ---------- */
.espaces { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; }
.espace { overflow: hidden; display: flex; flex-direction: column; }
.espace__visuel { aspect-ratio: 16/10; overflow: hidden; }
.espace__visuel img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.3s var(--ease-out); }
.espace:hover .espace__visuel img { transform: scale(1.05); }
.espace__corps { padding: 1.5rem 1.6rem 1.8rem; }
.espace__corps .chiffre { font-family: var(--f-titre); color: var(--or-clair); font-size: 1.05rem; margin-bottom: 0.4rem; }
.espace__corps h3 { margin-bottom: 0.6rem; }
.espace__corps p { color: var(--texte-doux); font-size: 0.95rem; margin: 0; }
@media (max-width: 960px) { .espaces { grid-template-columns: 1fr; } }
.formulaire-zone { padding: clamp(1.4rem, 3vw, 2.6rem); }
.formulaire-zone__tete { display: grid; grid-template-columns: 1fr auto; gap: 1.5rem; align-items: end; margin-bottom: 1.6rem; }
@media (max-width: 760px) { .formulaire-zone__tete { grid-template-columns: 1fr; } }
.etapes-rapides { display: flex; flex-wrap: wrap; gap: 0.5rem 1.2rem; font-size: 0.85rem; color: var(--texte-doux); list-style: none; padding: 0; margin: 0; }
.etapes-rapides li::before { content: "✓"; color: var(--or); margin-right: 0.4rem; }

/* ---------- FAQ (accordéon fluide) ---------- */
.faq { display: grid; gap: 0.7rem; }
.faq details { border-radius: var(--rayon-s); overflow: hidden; }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 1.15rem 1.4rem; font-weight: 400; color: var(--blanc); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; flex: none; width: 12px; height: 12px; border-right: 1.5px solid var(--or); border-bottom: 1.5px solid var(--or); transform: rotate(45deg) translateY(-3px); transition: transform var(--t-court) var(--ease-out); }
.faq details[open] summary::after { transform: rotate(225deg) translateY(-3px); }
.faq .reponse { padding: 0 1.4rem 1.3rem; color: var(--texte); }
.faq .reponse p:last-child { margin: 0; }
.faq__groupe { margin-top: 3rem; }
.faq__groupe:first-child { margin-top: 0; }
.faq__groupe > h2 { font-size: 1.8rem; margin-bottom: 1.2rem; }

/* ---------- Article (Gazette, fiche technique) ---------- */
.article { font-size: 1.08rem; }
.article h2 { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.2rem); margin-top: 2.4em; }
.article h3 { margin-top: 2em; }
.article figure { margin: 2.4rem 0; }
.article figure img { border-radius: var(--rayon); width: 100%; }
.article figcaption { font-size: 0.82rem; color: var(--texte-doux); margin-top: 0.6rem; }
.article blockquote { margin: 2.4rem 0; padding: 1.6rem 1.8rem; border-left: 2px solid var(--rouge); font-family: var(--f-titre); font-size: 1.45rem; line-height: 1.4; color: var(--blanc); background: rgba(255, 255, 255, 0.03); border-radius: 0 var(--rayon-s) var(--rayon-s) 0; }
.article blockquote cite { display: block; margin-top: 0.8rem; font-family: var(--f-texte); font-size: 0.85rem; font-style: normal; color: var(--or); }
.article .rubrique { display: inline-block; margin-top: 2.6rem; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--rouge); font-weight: 500; }
.article .rubrique + h2 { margin-top: 0.4em; }
.article .encadre { padding: 1.6rem 1.8rem; margin: 2.4rem 0; }
.article table { width: 100%; border-collapse: collapse; font-size: 0.95rem; margin: 1.2rem 0 2rem; }
.article th, .article td { text-align: left; padding: 0.7rem 0.9rem; border-bottom: 1px solid var(--trait); vertical-align: top; }
.article th { color: var(--or); font-weight: 500; width: 40%; }
.meta-article { display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; font-size: 0.88rem; color: var(--texte-doux); }

/* ---------- Gazette : liste ---------- */
.numeros { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 1.4rem; }
.numero { display: grid; grid-template-columns: 120px 1fr; gap: 1.2rem; padding: 1.2rem; align-items: center; }
.numero img { width: 120px; aspect-ratio: 3/4; object-fit: cover; border-radius: 0.6rem; }

/* ---------- Formulaires simples ---------- */
.champ { display: grid; gap: 0.35rem; margin-bottom: 1rem; }
.champ label { font-size: 0.85rem; color: var(--texte); }
.champ input { min-height: 50px; padding: 0.8rem 1rem; border-radius: var(--rayon-s); border: 1px solid var(--glass-border); background: rgba(255, 255, 255, 0.05); color: var(--blanc); font: 400 1rem var(--f-texte); transition: border-color var(--t-court), background-color var(--t-court); }
.champ input:focus { outline: none; border-color: var(--or); background: rgba(255, 255, 255, 0.08); }
.grille-champs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
@media (max-width: 600px) { .grille-champs { grid-template-columns: 1fr; } }
.message-envoi { padding: 1rem 1.2rem; border-radius: var(--rayon-s); background: rgba(200, 173, 140, 0.12); border: 1px solid rgba(200, 173, 140, 0.35); color: var(--blanc); }
.newsletter-mini { display: flex; gap: 0.5rem; }
.newsletter-mini input { flex: 1; min-width: 0; min-height: 48px; padding: 0 1.1rem; border-radius: 999px; border: 1px solid var(--glass-border); background: rgba(255, 255, 255, 0.05); color: var(--blanc); font: 400 0.95rem var(--f-texte); }
.newsletter-mini input:focus { outline: none; border-color: var(--or); }

/* ---------- Contacts ---------- */
.contacts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 1.2rem; }
.contact { padding: 1.5rem 1.6rem; }
.contact small { display: block; color: var(--or); font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; margin-bottom: 0.4rem; }
.contact strong { display: block; font-family: var(--f-titre); font-size: 1.25rem; font-weight: 500; margin-bottom: 0.4rem; }
.contact a { color: var(--texte); word-break: break-word; text-decoration: none; }
.contact a:hover { color: var(--blanc); }

/* ---------- Archives ---------- */
.archives { columns: 3 260px; column-gap: 2.5rem; }
.archives section { break-inside: avoid; margin-bottom: 2.2rem; }
.archives h2 { font-size: 1.5rem; margin-bottom: 0.8rem; }
.archives ul { list-style: none; padding: 0; margin: 0; }
.archives li { padding: 0.55rem 0; border-bottom: 1px solid var(--trait); }
.archives li strong { display: block; font-weight: 400; color: var(--blanc); }
.archives li span { font-size: 0.82rem; color: var(--texte-doux); }

/* ---------- Pied de page ---------- */
.pied { margin-top: clamp(3rem, 6vw, 6rem); border-top: 1px solid var(--trait); background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent); }
.pied__grille { display: grid; grid-template-columns: 1.3fr repeat(3, minmax(0, 1fr)) 1.4fr; gap: 2.2rem; padding-block: 4rem 2.5rem; }
.pied h2 { font-family: var(--f-texte); font-size: 0.78rem; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--or); margin-bottom: 1rem; }
.pied ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; font-size: 0.92rem; }
.pied ul a { color: var(--texte-doux); transition: color var(--t-court); }
.pied ul a:hover { color: var(--blanc); }
.pied address { font-style: normal; font-size: 0.92rem; color: var(--texte-doux); line-height: 1.7; }
.pied address a { color: var(--texte); }
.reseaux { display: flex; gap: 0.5rem; margin-top: 1.2rem; }
.reseaux a { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--glass-border); background: rgba(255, 255, 255, 0.03); transition: background-color var(--t-court), transform var(--t-court) var(--ease-out); }
.reseaux a:hover { background: rgba(255, 255, 255, 0.1); transform: translateY(-2px); }
.reseaux svg { width: 18px; height: 18px; fill: var(--blanc); }
.pied__bas { display: flex; flex-wrap: wrap; gap: 0.6rem 1.6rem; justify-content: space-between; padding-block: 1.4rem 2rem; border-top: 1px solid var(--trait); font-size: 0.82rem; color: var(--texte-doux); }
.pied__bas a, .pied__bas button { color: var(--texte-doux); background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.pied__bas a:hover, .pied__bas button:hover { color: var(--blanc); }
.pied__bas nav { display: flex; flex-wrap: wrap; gap: 1.2rem; }
@media (max-width: 860px) { .pied__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pied__grille > :first-child, .pied__grille > :last-child { grid-column: 1 / -1; } }

/* ---------- Bandeau cookies ---------- */
.cookies { position: fixed; z-index: 150; left: 1rem; bottom: 1rem; width: min(420px, calc(100% - 2rem)); padding: 1.3rem 1.4rem; opacity: 0; transform: translateY(20px); transition: opacity var(--t-moyen) var(--ease-out), transform var(--t-moyen) var(--ease-out); }
.cookies.est-visible { opacity: 1; transform: none; }
.cookies p { font-size: 0.88rem; margin-bottom: 1rem; }
.cookies .boutons { gap: 0.5rem; }
.cookies .bouton { flex: 1; }

/* ---------- Apparitions au défilement ---------- */
.js [data-apparition] { opacity: 0; transform: translateY(28px); transition: opacity 1s var(--ease-out), transform 1.1s var(--ease-out); transition-delay: var(--delai, 0s); }
.js [data-apparition].est-vu { opacity: 1; transform: none; }
.js [data-apparition="fondu"] { transform: none; }
.js [data-apparition="zoom"] { transform: scale(0.96); }

/* Transitions entre pages (navigateurs compatibles) */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: 0.32s var(--ease-out) both sortie-page; }
::view-transition-new(root) { animation: 0.5s var(--ease-out) both entree-page; }
@keyframes sortie-page { to { opacity: 0; } }
@keyframes entree-page { from { opacity: 0; transform: translateY(10px); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .js [data-apparition] { opacity: 1; transform: none; }
  .heros__fond, .tete-page__fond img { transform: none !important; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .verre, .panneau, .entete::before, .tiroir { background: rgba(16, 16, 20, 0.96); }
}