/* =========================================================
   Domaine des Oliviers — feuille de style
   Palette & typographies conservées, mise en page repensée
   ========================================================= */

:root {
  --vert: #8eb359;
  --vert-fonce: #7a9c47;
  --vert-clair: #eef4e2;
  --brun: #503014;
  --brun-fonce: #3c250e;
  --gris: #696969;
  --gris-fonce: #2a2a2a;
  --fond: #ffffff;
  --creme: #f3ead8;
  --blanc: #ffffff;
  --radius: 18px;
  --shadow: 0 10px 30px rgba(80, 48, 20, 0.10);
  --shadow-lg: 0 10px 10px rgba(80, 48, 20, 0.18);
  --font-titre: 'Lobster', cursive;
  --font-texte: 'Lato', 'Segoe UI', sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 150px; }
body {
  font-family: var(--font-texte);
  color: var(--gris);
  background: var(--fond);
  line-height: 1.7;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4 {
  font-family: var(--font-titre);
  font-weight: 400;
  line-height: 1.2;
  color: var(--brun);
  letter-spacing: .02em;
}
strong { color: var(--brun); }
.container { width: min(1140px, 92%); margin: 0 auto; }

/* ---------- Réseaux fixes ---------- */
.social-fixed {
  position: fixed; left: 14px; top: 50%; transform: translateY(-50%);
  display: flex; flex-direction: column; gap: .6rem; z-index: 80;
}
.social-fixed a {
  width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--brun); box-shadow: 0 4px 12px rgba(80,48,20,.3);
  transition: background .25s, transform .25s;
}
.social-fixed a:hover { background: var(--vert); transform: scale(1.1); }
.social-fixed svg { width: 19px; height: 19px; fill: #fff; }

/* ---------- En-tête & onglets ---------- */
.header {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  height: 88px; padding: 0 4%;
  background: linear-gradient(180deg, #4a2d12, var(--brun-fonce));
  border-bottom: 1px solid rgba(142,179,89,.35);
  transition: box-shadow .3s;
}
.header.is-scrolled { box-shadow: 0 6px 24px rgba(0,0,0,.35); }
.brand {
  position: absolute; left: 50%; top: 10px;
  transform: translateX(-50%); z-index: 5; text-decoration: none;
}
.brand-logo {
  width: 140px; height: auto; transition: transform .3s, width .3s;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.45));
}
.brand:hover .brand-logo { transform: scale(1.04) rotate(-2deg); }
@media (min-width: 1081px) {
  .header.is-scrolled .brand-logo { width: 75px; }
}
.nav { display: flex; align-items: center; gap: 1.9rem; flex: 1; }
.nav-left { justify-content: flex-end; padding-right: 95px; }
.nav-right { padding-left: 95px; }
.nav-link {
  text-decoration: none; font-family: var(--font-titre); font-size: 1.2rem;
  color: var(--creme); position: relative; padding: .3rem 0; letter-spacing: .03em;
}
.nav-link::after {
  content: ''; position: absolute; left: 0; bottom: -2px;
  width: 0; height: 2px; background: var(--vert); border-radius: 2px;
  transition: width .25s;
}
.nav-link:hover, .nav-link.is-active { color: var(--vert); }
.nav-link:hover::after, .nav-link.is-active::after { width: 100%; }
.nav-cta { background: var(--vert); color: #fff !important; padding: .5rem 1.4rem; border-radius: 999px; }
.nav-cta::after { display: none; }
.nav-cta:hover { background: var(--vert-fonce); }
.nav-mobile { display: none; }
.burger {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: 0; cursor: pointer; padding: 6px; z-index: 95;
}
.burger span { width: 24px; height: 2px; background: var(--creme); border-radius: 2px; transition: .3s; }
.burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger.is-open span:nth-child(2) { opacity: 0; }
.burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Boutons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .85rem 1.9rem; border-radius: 999px;
  font-family: var(--font-texte); font-weight: 700; font-size: .95rem;
  text-decoration: none; border: 0; cursor: pointer; transition: .25s;
}
.btn-primary { background: var(--vert); color: #fff; box-shadow: 0 8px 20px rgba(142,179,89,.4); }
.btn-primary:hover { background: var(--vert-fonce); transform: translateY(-2px); }
.btn-ghost { background: transparent; color: var(--creme); border: 1.5px solid rgba(243,234,216,.55); }
.btn-ghost:hover { background: rgba(255,255,255,.12); border-color: var(--creme); }
.btn-light { background: #fff; color: var(--brun); }
.btn-light:hover { background: var(--vert-clair); }
.btn-outline { background: transparent; color: var(--brun); border: 1.5px solid var(--brun); }
.btn-outline:hover { background: var(--brun); color: #fff; }

/* =========================================================
   BANDEAU DE PAGE (nouveau)
   ========================================================= */
.home-hero {
  position: relative; overflow: hidden; isolation: isolate;
  background:
    radial-gradient(circle at 72% 45%, rgba(142,179,89,.28), transparent 42%),
    linear-gradient(160deg, #5a3718 0%, var(--brun) 45%, var(--brun-fonce) 100%);
  color: var(--creme);
}
.home-hero::before {
  content: ''; position: absolute; inset: -40%; z-index: -1;
  background: repeating-conic-gradient(from 0deg at 50% 50%, rgba(243,234,216,.055) 0 5deg, transparent 5deg 12deg);
  transform-origin: 50% 50%;
  animation: rays 90s linear infinite;
}
@keyframes rays { to { transform: rotate(360deg); } }

/* =========================================================
   BANDEAU DES PAGES DE CONTENU — frise photo + carte titre
   ========================================================= */
.page-banner { position: relative; background: var(--fond); }
.page-banner--white { background: #fff; }
.page-banner-strip {
  position: relative; display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px;
  height: 380px; background: var(--brun-fonce); overflow: hidden;
}
.page-banner-strip img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease, filter .4s; filter: saturate(.95); }
.page-banner-strip img:hover { filter: saturate(1.15); }
.page-banner-strip::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(60,37,14,.55) 0%, rgba(60,37,14,0) 35%, rgba(60,37,14,0) 65%, rgba(60,37,14,.35) 100%);
}
.page-banner-card {
  position: relative; z-index: 2; max-width: 780px; margin: -150px auto 0;
  background: #fff; border-radius: 24px; padding: 2.6rem 3rem 2.6rem;
  text-align: center; box-shadow: var(--shadow-lg);
}
.page-banner--white .page-banner-card { box-shadow: 0 24px 60px rgba(80,48,20,.16); }
.page-banner-card::before {
  content: ''; position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%);
  width: 64px; height: 8px; border-radius: 8px; background: var(--vert);
}
.page-banner-crumbs {
  display: inline-flex; align-items: center; gap: .55rem; flex-wrap: wrap; justify-content: center;
  padding: .35rem 1rem; border-radius: 999px; background: var(--vert-clair);
  font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--brun);
  margin-bottom: 1rem;
}
.page-banner-crumbs a { color: var(--vert-fonce); text-decoration: none; }
.page-banner-crumbs a:hover { text-decoration: underline; }
.page-banner-crumbs span::before { content: '›'; margin-right: .55rem; color: var(--vert-fonce); }
.page-banner h1 { font-size: clamp(2.3rem, 4.6vw, 3.5rem); }
.ornament { display: block; width: 120px; height: 20px; margin: .9rem auto 0; color: var(--vert); fill: var(--vert); }
.page-banner-card p { max-width: 620px; margin: 1rem auto 0; font-size: 1.05rem; }
.page-banner + .section, .page-banner + .subnav + .section { padding-top: 4.5rem; }

.seal {
  position: absolute; left: -54px; bottom: 26px; width: 132px; height: 132px;
  border-radius: 50%; background: var(--vert); display: grid; place-items: center;
  box-shadow: 0 12px 28px rgba(0,0,0,.3);
}
.seal svg { position: absolute; inset: 0; width: 100%; height: 100%; animation: rays 22s linear infinite; }
.seal text { font-family: var(--font-texte); font-size: 10.5px; font-weight: 900; letter-spacing: 2.4px; fill: #fff; text-transform: uppercase; }
.seal img { width: 66px; }

.hills { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: 90px; z-index: 1; }
.hills .h1 { fill: var(--vert-fonce); }
.hills .h2 { fill: var(--vert); }
.hills .h3 { fill: var(--fond); }
.hills--white .h3 { fill: #fff; }

@keyframes kenburns { from { transform: scale(1); } to { transform: scale(1.1); } }

/* =========================================================
   ACCUEIL — hero
   ========================================================= */
.home-hero .container {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 3.5rem; align-items: center;
  min-height: min(calc(100vh - 88px), 780px); padding: 7rem 0 8.5rem;
}
.badge {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .4rem 1.1rem; border-radius: 999px;
  background: rgba(142,179,89,.2); border: 1px solid rgba(142,179,89,.55);
  font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--creme); margin-bottom: 1.4rem;
}
.badge::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--vert); box-shadow: 0 0 0 4px rgba(142,179,89,.3); }
.home-hero h1 { color: #fff; font-size: clamp(2.8rem, 6vw, 4.8rem); }
.home-hero h1 span { display: block; color: var(--vert); }
.hero-lead { margin: 1.4rem 0 2.2rem; font-size: 1.15rem; max-width: 520px; color: rgba(243,234,216,.92); }
.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }

.hero-stage { position: relative; justify-self: center; width: min(440px, 100%); }
.hero-stage::before {
  content: ''; position: absolute; inset: -20px 20px 20px -20px; z-index: -1;
  border-radius: 999px 999px 30px 30px; border: 2px dashed rgba(142,179,89,.6);
}
.slider {
  position: relative; aspect-ratio: 4 / 5; border-radius: 999px 999px 30px 30px;
  overflow: hidden; border: 7px solid rgba(243,234,216,.92);
  box-shadow: 0 30px 60px rgba(0,0,0,.4);
}
.slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.2s ease; }
.slide.is-active { opacity: 1; }
.slide img { width: 100%; height: 100%; object-fit: cover; }
.slide.is-active img { animation: kenburns 7s ease forwards; }
.slider-controls {
  position: absolute; left: 50%; bottom: -26px; transform: translateX(-50%);
  display: flex; align-items: center; gap: .8rem;
  background: #fff; padding: .45rem .6rem; border-radius: 999px; box-shadow: var(--shadow-lg);
}
.slider-arrow {
  width: 36px; height: 36px; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--vert-clair); color: var(--brun); font-size: 1.3rem; line-height: 1;
  transition: background .25s, color .25s;
}
.slider-arrow:hover { background: var(--vert); color: #fff; }
.slider-dots { display: flex; gap: .45rem; }
.slider-dots button {
  width: 9px; height: 9px; border-radius: 999px; border: 0; cursor: pointer;
  background: #d9cfbd; transition: .3s;
}
.slider-dots button.is-active { background: var(--vert); width: 24px; }
.home-hero .seal { left: auto; right: -40px; bottom: auto; top: 30px; }

/* =========================================================
   ACCUEIL — hero, proposition 2 (claire, collage + bandeau défilant)
   ========================================================= */
.hero-b {
  position: relative; overflow: hidden;
  background:
    radial-gradient(circle at 85% 20%, rgba(142,179,89,.22), transparent 40%),
    radial-gradient(circle at 10% 90%, rgba(142,179,89,.16), transparent 35%),
    var(--creme);
}
.hero-b::before {
  content: ''; position: absolute; right: -180px; top: -180px; width: 560px; height: 560px; border-radius: 50%;
  border: 2px dashed rgba(122,156,71,.35);
}
.hero-b-grid {
  position: relative; display: grid; grid-template-columns: 1fr 1.05fr; gap: 4rem; align-items: center;
  padding: 7.5rem 0 5rem;
}
.badge--light { background: #fff; border-color: rgba(122,156,71,.45); color: var(--brun); letter-spacing: .06em; }
.hero-b h1 { font-size: clamp(2.8rem, 5.6vw, 4.6rem); }
.hero-b h1 span { display: block; color: var(--vert-fonce); }
.hero-b-lead { margin: 1.4rem 0 2.2rem; font-size: 1.15rem; max-width: 500px; color: var(--brun); opacity: .85; }

.hero-b-collage {
  position: relative; display: grid; gap: 14px;
  grid-template-columns: 1fr 1.45fr 1fr; grid-template-rows: repeat(4, 112px);
  grid-template-areas: "a c b" "a c b" "e c d" "e f d";
}
.tile { position: relative; overflow: hidden; border-radius: 22px; box-shadow: var(--shadow-lg); background: #fff; }
.tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.tile:hover img { transform: scale(1.07); }
.t-a { grid-area: a; border-radius: 999px 999px 22px 22px; }
.t-b { grid-area: b; margin-top: 34px; }
.t-c { grid-area: c; }
.t-d { grid-area: d; margin-bottom: -34px; border-radius: 22px 22px 999px 999px; }
.t-e { grid-area: e; }
.t-f { grid-area: f; }
.tile-news { display: block; border: 6px solid #fff; }
.tile-news img { object-fit: cover; object-position: top; }
.tile-news span {
  position: absolute; left: 12px; top: 12px; padding: .3rem .9rem; border-radius: 999px;
  background: var(--vert); color: #fff; font-weight: 900; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  box-shadow: 0 6px 14px rgba(0,0,0,.2);
}
.tile-news span::before { content: ''; display: inline-block; width: 7px; height: 7px; margin-right: .45rem; border-radius: 50%; background: #fff; animation: pulse 1.6s ease-in-out infinite; vertical-align: 1px; }
@keyframes pulse { 50% { opacity: .25; } }
.hero-b .seal { left: -46px; bottom: -40px; z-index: 2; }

.hero-b-marquee { position: relative; background: var(--brun); overflow: hidden; padding: 1rem 0; transform: rotate(-1deg); margin: 0 -2% -10px; }
.marquee-track { display: flex; width: max-content; animation: marquee 32s linear infinite; }
.marquee-track span {
  display: inline-flex; align-items: center; gap: 2rem; padding-right: 2rem;
  font-family: var(--font-titre); font-size: 1.5rem; color: var(--creme); white-space: nowrap;
}
.marquee-track span::after { content: '✦'; color: var(--vert); font-size: 1rem; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* =========================================================
   ACCUEIL — hero, proposition 3 (sobre : photo + texte + infos pratiques)
   ========================================================= */
.hero-c {
  display: grid; grid-template-columns: 1.1fr 1fr; grid-template-rows: 1fr auto;
  min-height: 90vh;
  background:
    radial-gradient(circle at 85% 20%, rgba(142,179,89,.22), transparent 40%),
    radial-gradient(circle at 10% 90%, rgba(142,179,89,.16), transparent 35%),
    var(--creme);
}
.hero-c-photo { position: relative; padding: 3.5rem 1.5rem 3rem 80px; }
.hero-c-frame {
  position: relative; height: 100%; min-height: 360px; overflow: hidden;
  border-radius: 22px; border: 6px solid #fff; background: #fff; box-shadow: var(--shadow-lg);
}
.hero-c .slider { position: absolute; inset: 0; aspect-ratio: auto; border: 0; border-radius: 0; box-shadow: none; }
.hero-c .slide img { object-position: center 40%; }
.hero-c .slide.is-active img { animation: none; }
.hero-c-controls {
  position: absolute; left: 0; bottom: 0; display: flex; align-items: center; gap: .8rem;
  padding: .55rem 1rem; background: #fff; border-top-right-radius: 14px;
}
.hero-c .slider-arrow { width: 28px; height: 28px; border-radius: 0; background: none; color: var(--brun); font-size: 1.3rem; }
.hero-c .slider-arrow:hover { background: var(--vert-clair); color: var(--brun); }
.hero-c .slider-dots button { width: 16px; height: 3px; border-radius: 0; background: #d8cfbf; }
.hero-c .slider-dots button.is-active { width: 30px; background: var(--brun); }

.hero-c-text { padding: 4rem 7% 3rem 6%; display: flex; flex-direction: column; justify-content: center; }
.hero-c-notice {
  align-self: flex-start; max-width: 520px; margin-bottom: 1.8rem; padding: .5rem .9rem;
  background: #fff; border-left: 3px solid var(--vert-fonce); font-size: .86rem; line-height: 1.5;
  box-shadow: 0 2px 10px rgba(80,48,20,.06);
}
.hero-c-notice a { color: var(--vert-fonce); font-weight: 700; }
.hero-c-place { display: flex; align-items: flex-start; gap: .8rem; font-size: .84rem; line-height: 1.5; color: var(--gris); margin-bottom: 1rem; }
.hero-c-place::before { content: ''; flex: none; width: 32px; height: 2px; margin-top: .65em; background: var(--vert); }
@media (min-width: 901px) and (max-height: 820px) {
  .hero-c-text { padding: 3.2rem 6% 2rem 5%; }
  .hero-c-notice { margin-bottom: 1.2rem; }
  .hero-c-place { margin-bottom: .6rem; }
  .hero-c h1 { font-size: clamp(2.1rem, 3.2vw, 2.9rem); }
  .hero-c-lead { margin: .7rem 0 1.3rem; }
  .hero-c .hero-c-infos-row > div { padding-top: 1rem; padding-bottom: 1.1rem; }
}
.hero-c h1 { font-size: clamp(2.3rem, 3.6vw, 3.3rem); }
.hero-c h1 span { display: block; color: var(--vert-fonce); }
.hero-c-lead { margin: 1rem 0 1.7rem; font-size: 1.06rem; max-width: 480px; }

.hero-c-infos { grid-column: 1 / -1; background: var(--brun); color: rgba(243,234,216,.85); }
.hero-c-infos-row { display: flex; }
.hero-c-infos-row > div { flex: 1; padding: 1.3rem 2rem 1.4rem; }
.hero-c-infos-row > div:first-child { padding-left: 0; }
.hero-c-infos-row > div:last-child { padding-right: 0; }
.hero-c-infos-row > div + div { border-left: 1px solid rgba(243,234,216,.15); }
.hero-c-infos h2 { font-size: 1.25rem; color: var(--vert); margin-bottom: .2rem; }
.hero-c-infos p { font-size: .9rem; line-height: 1.5; margin-bottom: .3rem; }
.hero-c-infos a { font-size: .9rem; font-weight: 700; color: var(--creme); }
.hero-c-infos a:hover { color: var(--vert); }

/* =========================================================
   Sections génériques
   ========================================================= */
.section { padding: 6rem 0; position: relative; }
.section-alt { background: #fff; }
.section-vert { background: var(--vert-clair); }
.section-brun { background: linear-gradient(150deg, var(--brun), var(--brun-fonce)); color: rgba(243,234,216,.88); }
.section-brun h2, .section-brun h3, .section-brun strong { color: #fff; }

.kicker {
  display: inline-flex; align-items: center; gap: .6rem;
  font-weight: 700; font-size: .78rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--vert-fonce); margin-bottom: .9rem;
}
.kicker::before { content: ''; width: 28px; height: 2px; background: currentColor; }
.section-brun .kicker { color: var(--vert); }
.title-xl { font-size: clamp(2.1rem, 4vw, 3.1rem); }
.section-title { text-align: center; margin-bottom: 3rem; }
.section-title h2, .section-title h3 { font-size: clamp(2rem, 3.6vw, 2.8rem); }
.section-title .kicker::after { content: ''; width: 28px; height: 2px; background: currentColor; }
.link-arrow { color: var(--vert-fonce); font-weight: 700; text-decoration: none; }
.link-arrow:hover { text-decoration: underline; }

/* =========================================================
   ACCUEIL — contenus
   ========================================================= */
.intro-quote { position: relative; max-width: 900px; margin: 0 auto; text-align: center; padding-top: 2rem; }
.intro-quote::before {
  content: '“'; position: absolute; left: 50%; top: -3.4rem; transform: translateX(-50%);
  font-family: var(--font-titre); font-size: 9rem; line-height: 1; color: var(--vert); opacity: .35;
}
.intro-quote p {
  font-family: var(--font-titre); font-size: clamp(1.5rem, 3vw, 2.15rem);
  color: var(--brun); line-height: 1.45;
}

.products { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 4.5rem; }
.product { position: relative; }
.product:nth-child(2) { margin-top: 3.5rem; }
.product-media {
  position: relative;
  aspect-ratio: 4 / 4;
  border-radius: 60px 60px var(--radius) var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.product-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.product:hover .product-media img { transform: scale(1.07); }
.product-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(60,37,14,.85)); }
.product-num {
  position: absolute; top: 1.2rem; left: 50%; transform: translateX(-50%); z-index: 1;
  width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center;
  background: var(--vert); color: #fff; font-family: var(--font-titre); font-size: 1.3rem;
  box-shadow: 0 6px 14px rgba(0,0,0,.25);
}
.product h3 { position: absolute; left: 0; right: 0; bottom: 1.4rem; z-index: 1; text-align: center; color: #fff; font-size: 2rem; }
.product p {
  position: relative; margin: -1rem 1.4rem 0; z-index: 2;
  background: #fff; border-radius: 14px; padding: 1rem 1.2rem; text-align: center;
  box-shadow: var(--shadow); font-size: .97rem;
}

.ticket {
  display: grid; grid-template-columns: 1.5fr 1fr; margin: 5.5rem auto 0; max-width: 1040px;
  filter: drop-shadow(0 18px 30px rgba(80,48,20,.14));
}
.ticket-main {
  background: #fff; padding: 2.8rem 3rem; border-radius: var(--radius) 0 0 var(--radius);
  -webkit-mask: radial-gradient(circle 16px at 100% 0, transparent 98%, #000) top right / 100% 51% no-repeat,
                radial-gradient(circle 16px at 100% 100%, transparent 98%, #000) bottom right / 100% 51% no-repeat;
          mask: radial-gradient(circle 16px at 100% 0, transparent 98%, #000) top right / 100% 51% no-repeat,
                radial-gradient(circle 16px at 100% 100%, transparent 98%, #000) bottom right / 100% 51% no-repeat;
}
.ticket-main p { margin-bottom: .9rem; font-size: 1.02rem; }
.ticket-main p:first-child { font-size: 1.12rem; padding-left: 1rem; border-left: 4px solid var(--vert); }
.ticket-main p:last-child { margin-bottom: 0; }
.ticket-side {
  position: relative; background: var(--vert); color: #fff; padding: 2.8rem 2.4rem;
  border-radius: 0 var(--radius) var(--radius) 0;
  display: flex; flex-direction: column; justify-content: center; gap: 1.4rem;
  border-left: 3px dashed rgba(255,255,255,.65);
  -webkit-mask: radial-gradient(circle 16px at 0 0, transparent 98%, #000) top left / 100% 51% no-repeat,
                radial-gradient(circle 16px at 0 100%, transparent 98%, #000) bottom left / 100% 51% no-repeat;
          mask: radial-gradient(circle 16px at 0 0, transparent 98%, #000) top left / 100% 51% no-repeat,
                radial-gradient(circle 16px at 0 100%, transparent 98%, #000) bottom left / 100% 51% no-repeat;
}
.ticket-side p { font-family: var(--font-titre); font-size: 1.65rem; line-height: 1.35; }
.ticket-side .btn { align-self: flex-start; }

.video-block { position: relative; padding: 0 0 6rem; }
.video-block::before {
  content: ''; position: absolute; left: 0; right: 0; top: 30%; bottom: 0;
  background: linear-gradient(150deg, var(--brun), var(--brun-fonce));
}
.video-frame {
  position: relative; aspect-ratio: 16/9; max-width: 980px; margin: 0 auto;
  border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg);
  border: 8px solid #fff;
}
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }

/* =========================================================
   PRÉSENTATION
   ========================================================= */
.story { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.story-year {
  font-family: var(--font-titre); font-size: clamp(5rem, 11vw, 8.5rem); line-height: .9;
  color: transparent; -webkit-text-stroke: 2px var(--vert); margin-bottom: .6rem;
}
.story-text h2 { margin-bottom: 1.4rem; }
.story-text p { margin-bottom: 1rem; font-size: 1.04rem; }
.story-text p:first-of-type { font-size: 1.15rem; color: var(--brun); }
.polaroid {
  background: #fff; padding: 14px 14px 56px; border-radius: 6px; box-shadow: var(--shadow-lg);
  transform: rotate(2.5deg); position: relative;
}
.polaroid img { width: 100%; aspect-ratio: 4/3.4; object-fit: cover; border-radius: 3px; }
.polaroid figcaption { position: absolute; left: 0; right: 0; bottom: 14px; text-align: center; font-family: var(--font-titre); color: var(--brun); font-size: 1.3rem; }
.polaroid::before {
  content: ''; position: absolute; top: -14px; left: 50%; width: 110px; height: 30px;
  transform: translateX(-50%) rotate(-4deg); background: rgba(142,179,89,.55);
}

.duo { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1.6rem; align-items: center; margin-top: 4.5rem; }
.duo-card {
  display: flex; gap: 1.2rem; align-items: center;
  background: var(--fond); border-radius: var(--radius); padding: 1.6rem 1.8rem;
  border: 1px solid #ece4d3;
}
.duo-initial {
  flex: none; width: 70px; height: 70px; border-radius: 50%; display: grid; place-items: center;
  background: var(--brun); color: var(--creme); font-family: var(--font-titre); font-size: 2rem;
  box-shadow: 0 0 0 5px var(--vert-clair);
}
.duo-card:last-child .duo-initial { background: var(--vert); color: #fff; }
.duo-card h3 { font-size: 1.5rem; }
.duo-card p { font-size: .95rem; }
.duo-plus { font-family: var(--font-titre); font-size: 2.6rem; color: var(--vert); }
.duo-note { text-align: center; margin-top: 2rem; font-family: var(--font-titre); font-size: 1.5rem; color: var(--brun); }

.sheet { display: grid; grid-template-columns: .8fr 1.2fr; gap: 4rem; align-items: start; }
.sheet-aside { position: sticky; top: 140px; }
.sheet-aside h2 { margin-bottom: 1.2rem; }
.pin {
  display: inline-flex; align-items: center; gap: .5rem; padding: .5rem 1rem;
  background: #fff; border-radius: 999px; font-weight: 700; font-size: .88rem; color: var(--brun);
  box-shadow: var(--shadow);
}
.pin svg { width: 16px; height: 16px; fill: var(--vert-fonce); }
.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.6rem; }
.chips span {
  padding: .35rem .9rem; border-radius: 999px; background: var(--vert); color: #fff;
  font-size: .82rem; font-weight: 700;
}
.sheet-body { background: #fff; border-radius: var(--radius); padding: 3rem; box-shadow: var(--shadow); }
.sheet-body p { margin-bottom: 1.1rem; font-size: 1.03rem; }
.sheet-body p:first-child::first-letter {
  float: left; font-family: var(--font-titre); font-size: 4rem; line-height: .9;
  color: var(--vert); margin: .35rem .6rem 0 0;
}
.sheet-body blockquote {
  margin-top: 1.6rem; padding: 1.4rem 1.6rem; border-radius: 14px;
  background: var(--brun); color: var(--creme);
  font-family: var(--font-titre); font-size: 1.4rem; line-height: 1.4;
}

.immersive {
  position: relative; min-height: 640px; display: flex; align-items: center;
  background: url('../assets/img/ferme-animaux.jpg') center 35%/cover no-repeat;margin-bottom: 40px;
}
.immersive::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(60,37,14,.15), rgba(60,37,14,.75)); }
.immersive .container { position: relative; display: flex; justify-content: flex-end; }
.immersive-card {
  max-width: 560px; background: rgba(80,48,20,.92); color: rgba(243,234,216,.92);
  border-radius: var(--radius); padding: 3rem; backdrop-filter: blur(6px);
  border-top: 5px solid var(--vert);
}
.immersive-card h2 { color: #fff; font-size: clamp(1.8rem, 3vw, 2.3rem); margin-bottom: 1.2rem; }
.immersive-card p { margin-bottom: 1rem; }
.stamp {
  display: flex; gap: 1rem; align-items: center; margin-top: 1.6rem !important;
  background: var(--vert); color: #fff; border-radius: 14px; padding: 1rem 1.2rem; font-weight: 700;
}
.stamp svg { flex: none; width: 34px; height: 34px; fill: #fff; }

/* =========================================================
   HORAIRES MAGASIN
   ========================================================= */
.season { display: grid; grid-template-columns: 300px 1fr; gap: 3.5rem; align-items: start; }
.season-aside { position: sticky; top: 140px; display: flex; flex-direction: column; gap: 1rem; }
.season-tab {
  display: flex; align-items: center; gap: 1rem; width: 100%; text-align: left;
  padding: 1.2rem 1.4rem; border-radius: var(--radius); border: 2px solid transparent;
  background: var(--fond); cursor: pointer; font-family: var(--font-titre); font-size: 1.45rem;
  color: var(--brun); transition: .25s;
}
.season-tab svg { width: 40px; height: 40px; flex: none; padding: 8px; border-radius: 50%; background: #fff; fill: var(--vert-fonce); }
.season-tab:hover { border-color: var(--vert); }
.season-tab.is-active { background: var(--brun); color: #fff; box-shadow: var(--shadow-lg); }
.season-tab.is-active svg { background: var(--vert); fill: #fff; }
.season-hint {
  margin-top: 1rem; padding: 1.4rem; border-radius: var(--radius);
  background: var(--vert-clair); font-size: .95rem;
}
.season-hint .link-arrow { display: inline-block; margin-top: .4rem; }
.season-panels { display: grid; gap: 2rem; }
.poster { position: relative; background: #fff; border-radius: var(--radius); padding: 14px; box-shadow: var(--shadow-lg); max-width: 640px; margin: 0 auto; }
.poster img { width: 100%; border-radius: 10px; }
.poster figcaption {
  position: absolute; top: 28px; left: -18px; padding: .45rem 1.2rem;
  background: var(--vert); color: #fff; font-family: var(--font-titre); font-size: 1.2rem;
  border-radius: 6px; box-shadow: 0 6px 14px rgba(0,0,0,.2);
}
.js .season-panels .poster:not(.is-active) { display: none; }

/* =========================================================
   HORAIRES VISITES
   ========================================================= */
.subnav {
  position: sticky; top: 88px; z-index: 50; background: rgba(248,247,244,.94);
  backdrop-filter: blur(8px); border-bottom: 1px solid #ece4d3;
}
.subnav .container { display: flex; justify-content: safe center; gap: .4rem; padding: .8rem 0; overflow-x: auto; }
.subnav a {
  flex: none; padding: .45rem 1.1rem; border-radius: 999px; text-decoration: none;
  font-weight: 700; font-size: .88rem; color: var(--brun); transition: .2s;
}
.subnav a:hover, .subnav a.is-active { background: var(--brun); color: #fff; }

.manifest { display: grid; grid-template-columns: .9fr 1.1fr; gap: 4rem; align-items: start; }
.manifest-lead {
  font-family: var(--font-titre); font-size: clamp(1.9rem, 3.4vw, 2.7rem); line-height: 1.3; color: var(--brun);
  position: sticky; top: 170px;
}
.manifest-lead::after { content: ''; display: block; width: 80px; height: 4px; border-radius: 4px; background: var(--vert); margin-top: 1.4rem; }
.steps { list-style: none; counter-reset: step; border-left: 2px dashed #d9cfbd; }
.steps li { position: relative; counter-increment: step; padding: 0 0 2.2rem 3.4rem; font-size: 1.03rem; }
.steps li:last-child { padding-bottom: 0; }
.steps li::before {
  content: counter(step, decimal-leading-zero); position: absolute; left: -24px; top: -6px;
  width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
  background: var(--vert); color: #fff; font-family: var(--font-titre); font-size: 1.1rem;
  box-shadow: 0 0 0 6px var(--fond);
}

.facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 4.5rem; background: var(--brun); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg); list-style: none; }
.facts li { display: flex; gap: 1rem; align-items: center; padding: 1.8rem 2rem; color: rgba(243,234,216,.9); }
.facts li + li { border-left: 1px solid rgba(243,234,216,.15); }
.facts svg { flex: none; width: 52px; height: 52px; padding: 12px; border-radius: 50%; background: rgba(142,179,89,.2); fill: var(--vert); }
.facts strong { display: block; font-family: var(--font-titre); font-weight: 400; font-size: 1.4rem; color: var(--vert); line-height: 1.2; }

.overlap { display: grid; grid-template-columns: repeat(12, 1fr); align-items: center; }
.overlap-media { grid-column: 1 / 8; grid-row: 1; }
.overlap-media img { width: 100%; height: 520px; object-fit: cover; border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.overlap-card {
  grid-column: 7 / 13; grid-row: 1; position: relative; z-index: 1;
  background: #fff; border-radius: var(--radius); padding: 2.8rem; box-shadow: var(--shadow-lg);
}
.overlap-card p { margin-bottom: 1rem; }
.note-green { background: var(--vert); color: #fff; padding: 1rem 1.2rem; border-radius: 12px; margin-bottom: 0 !important; }
.note-green strong { color: #fff; }

.strip { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 2px solid var(--brun); border-bottom: 2px solid var(--brun); }
.strip div { padding: 2rem 1.6rem; text-align: center; }
.strip div + div { border-left: 1px dashed rgba(80,48,20,.3); }
.strip span { display: block; font-family: var(--font-titre); font-size: 1.6rem; color: var(--vert-fonce); margin-bottom: .3rem; }
.strip p { font-size: .97rem; color: var(--brun); }

.slate {
  max-width: 820px; margin: 0 auto; position: relative;
  background: linear-gradient(160deg, #4a2d12, var(--brun-fonce)); color: var(--creme);
  border-radius: var(--radius); padding: 3.2rem 3.6rem; box-shadow: var(--shadow-lg);
  border: 10px solid #6b4423; outline: 2px solid rgba(142,179,89,.4); outline-offset: -22px;
}
.slate h3 { color: #fff; text-align: center; font-size: 2.6rem; margin-bottom: 2rem; }
.slate ul { list-style: none; }
.slate li { display: flex; align-items: baseline; gap: .8rem; padding: .85rem 0; }
.slate li::after { content: none; }
.slate .dots { flex: 1; border-bottom: 2px dotted rgba(243,234,216,.35); transform: translateY(-4px); min-width: 20px; }
.slate .label { font-weight: 700; }
.slate .label small { font-weight: 400; opacity: .75; margin-left: .3rem; }
.slate .price { font-family: var(--font-titre); font-size: 1.7rem; color: var(--vert); white-space: nowrap; }
.slate .price small { font-size: .9rem; color: var(--creme); }
.slate li.featured {
  margin-top: 1rem; padding: 1rem 1.2rem; border-radius: 12px; background: var(--vert);
}
.slate li.featured .price { color: #fff; }
.slate li.featured .dots { border-color: rgba(255,255,255,.5); }

.framed { max-width: 820px; margin: 0 auto; background: #fff; padding: 14px; border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.framed img { width: 100%; border-radius: 10px; }
.framed a { display: block; position: relative; }
.framed a::after {
  content: 'Agrandir ↗'; position: absolute; right: 14px; bottom: 14px;
  padding: .4rem .9rem; border-radius: 999px; background: var(--brun); color: #fff;
  font-size: .82rem; font-weight: 700; opacity: 0; transition: opacity .25s;
}
.framed a:hover::after { opacity: 1; }

.mosaic { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 200px; gap: 1rem; grid-auto-flow: dense; }
.mosaic figure { position: relative; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.mosaic figure:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.mosaic figure:nth-child(4), .mosaic figure:nth-child(8) { grid-row: span 2; }
.mosaic figure:nth-child(6) { grid-column: span 2; }
.mosaic img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.mosaic figure:hover img { transform: scale(1.08); }
.mosaic figcaption {
  position: absolute; left: 12px; bottom: 12px; padding: .3rem .9rem; border-radius: 999px;
  background: rgba(255,255,255,.92); color: var(--brun); font-family: var(--font-titre); font-size: 1.05rem;
  transition: background .25s, color .25s;
}
.mosaic figure:hover figcaption { background: var(--vert); color: #fff; }

/* =========================================================
   PARTENAIRES
   ========================================================= */
.partner-list { display: flex; flex-direction: column; gap: 5rem; }
.partner { display: grid; grid-template-columns: 1fr 1.15fr; gap: 3.5rem; align-items: center; }
.partner:nth-child(even) .partner-media { order: 2; }
.partner-media { position: relative; }
.partner-media .frame {
  aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg); background: #fff;
}
.partner-media .frame img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.partner:hover .frame img { transform: scale(1.05); }
.partner-media .frame--logo { position: relative; background: var(--vert-clair); }
.partner-media .frame--logo img { position: absolute; inset: 2.5rem; width: calc(100% - 5rem); height: calc(100% - 5rem); object-fit: contain; }
.partner-media::after {
  content: attr(data-num); position: absolute; top: -34px; right: -16px;
  font-family: var(--font-titre); font-size: 5rem; line-height: 1;
  color: transparent; -webkit-text-stroke: 2px var(--vert);
}
.partner:nth-child(even) .partner-media::after { right: auto; left: -16px; }
.partner-body h2 { font-size: clamp(1.8rem, 3vw, 2.4rem); margin-bottom: 1rem; }
.partner-body p { margin-bottom: 1.6rem; }

.thanks {
  position: relative; margin-top: 6rem; text-align: center; overflow: hidden;
  background: var(--vert); color: rgba(255,255,255,.94);
  border-radius: var(--radius); padding: 3.4rem 3rem 3.2rem;
  box-shadow: 0 18px 40px rgba(122,156,71,.35);
}
.thanks::before {
  content: ''; position: absolute; inset: -60%;
  background: repeating-conic-gradient(from 0deg, rgba(255,255,255,.07) 0 6deg, transparent 6deg 14deg);
}
.thanks > * { position: relative; }
.thanks img { width: 90px; margin: 0 auto 1rem; filter: drop-shadow(0 6px 12px rgba(0,0,0,.2)); }
.thanks h2 { color: #fff; font-size: clamp(1.9rem, 3.4vw, 2.6rem); margin-bottom: .8rem; }
.thanks p { max-width: 620px; margin: 0 auto; font-size: 1.02rem; }

/* =========================================================
   CONTACT
   ========================================================= */
.contact-card {
  display: grid; grid-template-columns: .9fr 1.1fr; border-radius: 24px; overflow: hidden;
  box-shadow: var(--shadow-lg); position: relative; z-index: 2;
}
.contact-info {
  position: relative; overflow: hidden;
  background: linear-gradient(160deg, var(--brun), var(--brun-fonce)); color: rgba(243,234,216,.9);
  padding: 3rem; display: flex; flex-direction: column; gap: 1.8rem;
}
.contact-info::after {
  content: ''; position: absolute; right: -90px; bottom: -90px; width: 260px; height: 260px;
  border-radius: 50%; background: rgba(142,179,89,.18);
}
.contact-info h2 { color: #fff; font-size: 2rem; }
.info-item { display: flex; gap: 1rem; align-items: flex-start; position: relative; z-index: 1; }
.info-icon {
  flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
  background: var(--vert);
}
.info-icon svg { width: 20px; height: 20px; fill: #fff; }
.info-item strong { display: block; color: var(--vert); font-family: var(--font-titre); font-weight: 400; font-size: 1.2rem; }
.info-item a { color: #fff; font-weight: 700; text-decoration: none; }
.info-item a:hover { text-decoration: underline; }
.social-links { display: flex; gap: .6rem; margin-top: .4rem; flex-wrap: wrap; }
.social-links a {
  padding: .3rem .95rem; border-radius: 999px; border: 1px solid rgba(243,234,216,.35);
  font-size: .85rem; font-weight: 700; color: var(--creme); text-decoration: none; transition: .25s;
}
.social-links a:hover { background: var(--vert); border-color: var(--vert); color: #fff; text-decoration: none; }

.contact-form { background: #fff; padding: 3rem; display: flex; flex-direction: column; gap: 1.1rem; }
.contact-form h2 { font-size: 2rem; margin-bottom: .3rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
label { display: flex; flex-direction: column; gap: .35rem; font-weight: 700; font-size: .9rem; color: var(--brun); }
input, select, textarea {
  font-family: var(--font-texte); font-size: .95rem; color: var(--gris-fonce);
  padding: .8rem 1rem; border: 1.5px solid #e5dfd2; border-radius: 12px;
  background: var(--fond); transition: border-color .2s, box-shadow .2s;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--vert); box-shadow: 0 0 0 3px rgba(142,179,89,.18); }
textarea { resize: vertical; }
.contact-form .btn { align-self: flex-start; }
.form-feedback { font-weight: 700; color: var(--vert-fonce); }

/* =========================================================
   NEWSLETTER
   ========================================================= */
.newsletter { padding: 0 0 5rem; background: linear-gradient(180deg, var(--fond) 50%, var(--gris-fonce) 50%); }
.section-alt + .newsletter, .immersive + .newsletter { background: linear-gradient(180deg, #fff 50%, var(--gris-fonce) 50%); }
.section-vert + .newsletter { background: linear-gradient(180deg, var(--vert-clair) 50%, var(--gris-fonce) 50%); }
.video-block + .newsletter { background: linear-gradient(180deg, var(--brun-fonce) 50%, var(--gris-fonce) 50%); }
.newsletter-inner {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 3rem; align-items: center;
  background: var(--vert); color: #fff; border-radius: 24px; padding: 3rem 3.4rem;
  box-shadow: 0 24px 50px rgba(0,0,0,.2);
}
.newsletter-inner::before {
  content: ''; position: absolute; left: -80px; top: -80px; width: 260px; height: 260px; border-radius: 50%;
  background: rgba(255,255,255,.1);
}
.newsletter-inner > * { position: relative; }
.newsletter h2 { color: #fff; font-size: 2.5rem; margin-bottom: .4rem; }
.newsletter p { color: rgba(255,255,255,.9); }
.newsletter-form { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.newsletter-form input { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.35); color: #fff; }
.newsletter-form input::placeholder { color: rgba(255,255,255,.8); }
.newsletter-form input:focus { border-color: #fff; box-shadow: 0 0 0 3px rgba(255,255,255,.25); }
.newsletter-form .btn { grid-column: 1 / -1; justify-self: start; padding: .8rem 2.6rem; }
.newsletter-form .form-feedback { grid-column: 1 / -1; color: #fff; }

/* =========================================================
   PIED DE PAGE
   ========================================================= */
.footer { background: var(--gris-fonce); color: rgba(255,255,255,.8); }
.footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 3rem; padding: 2rem 0 2.5rem; }
.footer-brand img { width: 110px; margin-bottom: 1rem; }
.footer-brand p { font-size: .92rem; line-height: 1.7; }
.footer-nav { display: flex; flex-direction: column; gap: .55rem; }
.footer-nav a { text-decoration: none; color: rgba(255,255,255,.75); font-size: .92rem; }
.footer-nav a:hover { color: var(--vert); }
.footer-contact p { margin-bottom: .6rem; font-size: .92rem; }
.footer-contact a { color: rgba(255,255,255,.85); text-decoration: none; }
.footer-social { display: flex; gap: .7rem; }
.footer-social a { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.25); transition: .25s; }
.footer-social svg { width: 17px; height: 17px; fill: var(--vert); transition: .25s; }
.footer-social a:hover { background: var(--vert); border-color: var(--vert); }
.footer-social a:hover svg { fill: #fff; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); text-align: center; padding: 1.2rem 4%; font-size: .82rem; }
.footer-bottom a { color: rgba(255,255,255,.7); }

/* ---------- Mentions légales ---------- */
.legal { display: grid; grid-template-columns: 220px 1fr; gap: 3.5rem; align-items: start; }
.legal-toc { position: sticky; top: 120px; display: flex; flex-direction: column; gap: .2rem; border-left: 2px solid var(--vert-clair); }
.legal-toc a { padding: .35rem 1rem; font-size: .9rem; font-weight: 700; color: var(--brun); text-decoration: none; border-left: 2px solid transparent; margin-left: -2px; }
.legal-toc a:hover { color: var(--vert-fonce); border-left-color: var(--vert); }
.legal-body { max-width: 780px; }
.legal-body section + section { margin-top: 2.8rem; padding-top: 2.8rem; border-top: 1px solid #ece4d3; }
.legal-body h2 { font-size: 1.8rem; margin-bottom: 1rem; }
.legal-body h3 { font-family: var(--font-texte); font-weight: 900; font-size: 1rem; color: var(--brun); margin: 1.4rem 0 .4rem; letter-spacing: 0; }
.legal-body p, .legal-body li { margin-bottom: .7rem; }
.legal-body ul { padding-left: 1.2rem; }
.legal-body li::marker { color: var(--vert-fonce); }
.legal-body a { color: var(--vert-fonce); font-weight: 700; }
.legal-list { display: grid; grid-template-columns: 210px 1fr; background: var(--fond); border-radius: 12px; padding: 1.2rem 1.5rem; margin-top: .8rem; }
.legal-list dt, .legal-list dd { padding: .5rem 0; border-bottom: 1px solid #ece4d3; }
.legal-list dt:last-of-type, .legal-list dd:last-of-type { border-bottom: 0; }
.legal-list dt { font-weight: 700; color: var(--brun); padding-right: 1rem; }
.legal-update { margin-top: 1.6rem; font-size: .88rem; font-style: italic; }
@media (max-width: 900px) {
  .legal { grid-template-columns: 1fr; gap: 2rem; }
  .legal-toc { position: static; flex-direction: row; flex-wrap: wrap; border-left: 0; gap: .4rem; }
  .legal-toc a { margin: 0; border: 1px solid #ece4d3; border-radius: 999px; padding: .3rem .8rem; font-size: .82rem; }
  .legal-list { grid-template-columns: 1fr; }
  .legal-list dt { border-bottom: 0; padding-bottom: 0; }
}

/* ---------- Fenêtre pop-up (affiches, plan) ---------- */
.lightbox {
  margin: auto; padding: 14px; border: 0; border-radius: 12px; background: #fff;
  max-width: min(92vw, 900px); max-height: 92vh; overflow: visible;
  box-shadow: 0 30px 80px rgba(0,0,0,.45);
}
.lightbox::backdrop { background: rgba(42,26,10,.82); }
.lightbox[open] { animation: lightbox-in .25s ease; }
@keyframes lightbox-in { from { opacity: 0; transform: scale(.96); } }
.lightbox img { display: block; max-width: 100%; max-height: calc(92vh - 80px); width: auto; margin: 0 auto; border-radius: 6px; }
.lightbox-caption { padding-top: .7rem; text-align: center; font-size: .92rem; color: var(--brun); }
.lightbox-close {
  position: absolute; top: -16px; right: -16px; width: 40px; height: 40px; border-radius: 50%;
  border: 0; cursor: pointer; background: var(--brun); color: #fff; font-size: 1.6rem; line-height: 1;
  box-shadow: 0 6px 16px rgba(0,0,0,.3);
}
.lightbox-close:hover { background: var(--vert-fonce); }

/* ---------- Animations d'apparition ---------- */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal.d1 { transition-delay: .15s; }
.reveal.d2 { transition-delay: .3s; }
.reveal.d3 { transition-delay: .45s; }
.reveal.d4 { transition-delay: .6s; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1080px) {
  .nav { display: none; }
  .nav-mobile {
    display: flex; position: fixed; inset: 0; height: 100vh;
    flex-direction: column; align-items: center; justify-content: center; gap: 1.8rem;
    background: linear-gradient(160deg, #4a2d12, #33200c);
    transform: translateX(100%); transition: transform .35s ease; z-index: 90;
  }
  .nav-mobile.is-open { transform: translateX(0); }
  .nav-mobile .nav-link { font-size: 1.7rem; }
  .burger { display: flex; margin-left: auto; }
  .social-fixed { display: none; }
  .brand-logo { width: 100px; }
  .brand { top: 8px; }
}

@media (max-width: 900px) {
  .section { padding: 4.5rem 0; }
  .home-hero .container { grid-template-columns: 1fr; gap: 3rem; padding: 5.5rem 0 7rem; min-height: 0; text-align: center; }
  .hero-lead { margin-left: auto; margin-right: auto; }
  .hero-actions { justify-content: center; }
  .page-banner-strip { grid-template-columns: repeat(3, 1fr); height: 260px; gap: 4px; }
  .page-banner-strip img:nth-child(n+4) { display: none; }
  .page-banner-card { margin-top: -90px; padding: 2.2rem 1.4rem; border-radius: 20px; }
  .page-banner-crumbs { font-size: .66rem; letter-spacing: .06em; padding: .35rem .8rem; }
  .page-banner + .section, .page-banner + .subnav + .section { padding-top: 3.5rem; }
  .subnav .container { flex-wrap: wrap; justify-content: center; gap: .3rem; padding: .6rem 0; overflow: visible; }
  .subnav a { padding: .35rem .8rem; font-size: .82rem; }
  .steps { margin-left: 24px; }
  .steps li { padding-left: 2.6rem; }
  .hero-stage { width: min(340px, 86%); }
  .seal { width: 104px; height: 104px; left: -30px; }
  .seal img { width: 52px; }
  .home-hero .seal { right: -24px; }
  .hero-b-grid { grid-template-columns: 1fr; gap: 3rem; padding: 5.5rem 0 4rem; text-align: center; }
  .hero-b-lead { margin-left: auto; margin-right: auto; }
  .hero-b-collage { grid-template-rows: repeat(4, 78px); gap: 10px; max-width: 480px; width: 100%; margin: 0 auto; }
  .hero-b .seal { left: -14px; bottom: -30px; }
  .marquee-track span { font-size: 1.2rem; }
  .hero-c { grid-template-columns: 1fr; grid-template-rows: auto; min-height: 0; }
  .hero-c-photo { padding: 1.6rem 5% 0; }
  .hero-c-frame { height: 280px; min-height: 0; }
  .hero-c-text { padding: 2.4rem 6% 2.6rem; }
  .hero-c .hero-actions { justify-content: flex-start; }
  .hero-c-infos-row { flex-direction: column; }
  .hero-c-infos-row > div { padding: 1.1rem 0; }
  .hero-c-infos-row > div + div { border-left: 0; border-top: 1px solid rgba(243,234,216,.15); }
  .hills { height: 60px; }

  .products, .story, .sheet, .season, .manifest, .partner, .contact-card, .newsletter-inner { grid-template-columns: 1fr; }
  .product:nth-child(2) { margin-top: 0; }
  .products { max-width: 420px; margin-left: auto; margin-right: auto; }
  .ticket { grid-template-columns: 1fr; }
  .ticket-main { border-radius: var(--radius) var(--radius) 0 0; -webkit-mask: none; mask: none; }
  .ticket-side { border-radius: 0 0 var(--radius) var(--radius); border-left: 0; border-top: 3px dashed rgba(255,255,255,.65); -webkit-mask: none; mask: none; }
  .story { gap: 2.5rem; }
  .duo { grid-template-columns: 1fr; text-align: left; }
  .duo-plus { text-align: center; }
  .sheet { gap: 2rem; }
  .sheet-aside, .season-aside, .manifest-lead { position: static; }
  .sheet-body { padding: 2rem; }
  .immersive { background-attachment: scroll; min-height: 0; padding: 18rem 0 3rem; }
  .immersive::before { background: linear-gradient(180deg, transparent 20%, rgba(60,37,14,.8)); }
  .immersive-card { padding: 2rem; }
  .season-aside { flex-direction: row; flex-wrap: wrap; }
  .season-tab { flex: 1 1 200px; }
  .season-hint { flex-basis: 100%; }
  .poster figcaption { left: 10px; }
  .facts { grid-template-columns: 1fr; }
  .facts li + li { border-left: 0; border-top: 1px solid rgba(243,234,216,.15); }
  .overlap { display: block; }
  .overlap-media img { height: 300px; }
  .overlap-card { margin: -3rem 1rem 0; padding: 2rem; }
  .strip { grid-template-columns: 1fr 1fr; }
  .strip div:nth-child(3) { border-left: 0; }
  .strip div:nth-child(n+3) { border-top: 1px dashed rgba(80,48,20,.3); }
  .slate { padding: 2.4rem 1.6rem; outline-offset: -16px; }
  .mosaic { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 170px; }
  .partner-list { gap: 4rem; }
  .partner:nth-child(even) .partner-media { order: 0; }
  .partner-media::after { right: 10px !important; left: auto !important; }
  .contact-info, .contact-form { padding: 2.2rem; }
  .form-row { grid-template-columns: 1fr; }
  .newsletter-inner { padding: 2.4rem 1.8rem; gap: 1.6rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 2rem; text-align: center; }
  .footer-nav { align-items: center; }
  .footer-brand img { margin: 0 auto 1rem; }
  .footer-social { justify-content: center; }
}

@media (max-width: 520px) {
  .slate li { flex-wrap: wrap; }
  .slate .dots { display: none; }
  .slate .price { margin-left: auto; }
  .strip { grid-template-columns: 1fr; }
  .strip div + div { border-left: 0; border-top: 1px dashed rgba(80,48,20,.3); }
  .newsletter-form { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .home-hero::before, .seal svg, .slide img, .marquee-track, .tile-news span::before { animation: none !important; }
}
