/**
 * Page événement refondue - ce qui n'appartient qu'à elle.
 *
 * Le design system commun (variables, typographie, boutons, sections, cartes,
 * vignettes de sortie, bandeau d'appel, privatisation, newsletter) vit dans
 * html/exo/socle.css, que le gabarit charge avant cette feuille. On ne trouve
 * ici que la carte de réservation, la fiche technique, le profil des étapes,
 * la carte de zone, la sous-navigation, le programme, l'équipement, le guide,
 * la F.A.Q. et la barre collante.
 */

/* L'ancienne barre collante (plg_system_exostickycta) : la page porte la
   sienne, pilotée par l'état des places. */
body:has(.exo2) .exo-sticky-cta { display: none !important; }

/* ---------- fil d'Ariane ----------
   Posé sur l'image du hero, sans fond : la photo gagne la hauteur qu'une
   bande sombre lui prenait. Une ombre portée tient la lisibilité, quel que
   soit le ciel de la bannière. */
.exo2-crumbs {
	font-size: 13px; color: rgba(255, 255, 255, .8); margin-bottom: 18px;
	text-shadow: 0 1px 4px rgba(0, 0, 4, .75);
}
.exo2 .exo2-crumbs a { color: rgba(255, 255, 255, .8); }
.exo2 .exo2-crumbs a:hover { color: #fff; }
.exo2-crumbs span { margin: 0 8px; color: var(--exo2-corail); }

/* ---------- hero + carte de réservation ---------- */
.exo2-hero { position: relative; background: #0d0d0d; color: #fff; min-height: 640px; display: flex; align-items: flex-end; overflow: hidden; }
.exo2-hero-photo { position: absolute; inset: 0; margin: 0; }
.exo2-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.exo2-hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 400px; gap: 56px; align-items: end; padding-top: 180px; padding-bottom: 48px; width: 100%; }
.exo2-hero h1 { max-width: 720px; text-wrap: balance; }
.exo2-lead { font-size: 18px; line-height: 1.6; max-width: 600px; margin: 20px 0 22px; color: var(--exo2-texte); font-weight: 300; }
.exo2-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.exo2-chip {
	font: 600 12px var(--exo2-police); letter-spacing: 1px; text-transform: uppercase;
	padding: 7px 12px 6px; border: 1px solid rgba(255, 255, 255, .35); color: #fff; background: rgba(18, 18, 18, .35);
}
.exo2-chip b { color: var(--exo2-corail); }
.exo2-hero-actions { display: flex; gap: 14px; align-items: center; }

.exo2-booking { background: var(--exo2-carte); box-shadow: var(--exo2-liseret), var(--exo2-ombre); padding: 26px 26px 22px; color: var(--exo2-texte); }
.exo2-booking-date { font: 700 19px/1.2 var(--exo2-police-titre); text-transform: uppercase; color: #fff; letter-spacing: .5px; }
.exo2-booking-sub { font-size: 13px; color: var(--exo2-meta); line-height: 1.5; }
.exo2-booking-sub a { color: var(--exo2-corail); }
.exo2-price { display: flex; align-items: baseline; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.exo2 .exo2-price b, .exo2 .exo2-price b .exo-price { font: italic 700 48px/1 var(--exo2-police-titre); color: #fff; letter-spacing: 1px; }
.exo2-price > span { font-size: 13px; color: var(--exo2-meta); text-transform: uppercase; letter-spacing: 1px; }
/* Le surtitre d'une section ne porte qu'un prix : le lien de conversion
   du plugin de devises y coupait la phrase en deux. */
.exo2-label .exo-price-hint { display: none; }
/* La mention « changer de devise » du plugin de conversion sort du montant :
   une ligne discrète sous le prix, pas un appendice dans le chiffre. */
.exo2 .exo2-price .exo-price-hint {
	display: block; margin: 6px 0 0; font: 400 12px/1.3 var(--exo2-police);
	font-style: normal; letter-spacing: 0; color: var(--exo2-meta);
}
.exo2-seats { margin: 18px 0 6px; padding-top: 16px; border-top: 1px solid var(--exo2-ligne); }
.exo2-seats-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; font: 700 14px var(--exo2-police-titre); text-transform: uppercase; letter-spacing: .5px; color: #fff; }
.exo2-seats-row { display: flex; align-items: center; gap: 6px; margin: 10px 0 6px; position: relative; }
.exo2-seat { width: 22px; height: 14px; border: 1px solid rgba(255, 255, 255, .3); }
.exo2-seat.on { border-color: transparent; background: var(--exo2-degrade); }
.exo2-seat-mark { width: 2px; height: 22px; background: var(--exo2-accent); margin: 0 2px; position: relative; }
.exo2-seat-mark::after {
	content: attr(data-cap); position: absolute; left: -4px; top: 24px;
	font: 600 10px/1 var(--exo2-police); letter-spacing: .8px; text-transform: uppercase; color: var(--exo2-corail); white-space: nowrap;
}
.exo2-seats-row.garanti .exo2-seat-mark::after { display: none; }
.exo2-seats-foot { font-size: 14px; color: var(--exo2-texte); margin-top: 22px; line-height: 1.45; }
.exo2-seats-foot b { color: #fff; }
.exo2-closing { font-size: 13px; color: var(--exo2-meta); margin: 10px 0 18px; }
.exo2-closing b { color: var(--exo2-corail); }
.exo2 .exo2-booking-alt { display: block; text-align: center; font-size: 14px; margin: 12px 0 16px; color: #fff; }
.exo2 .exo2-booking-alt:hover { color: var(--exo2-corail); }
.exo2 .exo2-reassure { border-top: 1px solid var(--exo2-ligne); padding-top: 14px; display: grid; gap: 8px; }
.exo2-reassure li { display: flex; gap: 10px; font-size: 13.5px; line-height: 1.45; }
.exo2-reassure svg { flex: none; width: 14px; height: 14px; margin-top: 4px; color: var(--exo2-corail); }

/* ---------- fiche technique ---------- */
.exo2-facts-section { padding: 30px 0; }
.exo2-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)); margin: 0; padding: 0; }
.exo2-facts div { padding: 4px 16px; border-left: 1px solid var(--exo2-ligne); }
.exo2-facts div:first-child { border-left: 0; padding-left: 0; }
.exo2-facts dt { font: 400 11px var(--exo2-police); letter-spacing: 1.2px; text-transform: uppercase; color: var(--exo2-meta); }
.exo2-facts dd { margin: 4px 0 0; font: 700 19px/1.2 var(--exo2-police-titre); text-transform: uppercase; color: #fff; overflow-wrap: anywhere; }
.exo2-facts dd small { display: block; font: 400 12px var(--exo2-police); letter-spacing: 0; text-transform: none; color: var(--exo2-meta); }
.exo2-facts dd small a { color: var(--exo2-corail); }

/* ---------- en bref ---------- */
.exo2-brief { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: start; }
.exo2-brief-lead { font-size: 19px; color: #fff; margin-top: 16px; }
/* Préfixé .exo2 : la remise à zéro « .exo2 ul » (un type + une classe) pèse
   plus lourd qu'une classe seule et mangeait cette marge. */
.exo2 .exo2-hl { display: grid; gap: 14px; margin-top: 44px; }
.exo2-hl li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; }
.exo2-hl-ic { width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, .18); display: grid; place-items: center; color: var(--exo2-corail); background: #1a1a1a; }
.exo2-hl b { display: block; font: 700 15px var(--exo2-police-titre); text-transform: uppercase; color: #fff; letter-spacing: .3px; }
.exo2-hl span { font-size: 14.5px; color: var(--exo2-meta); line-height: 1.5; }

.exo2-video { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #0d0d0d; box-shadow: var(--exo2-ombre); }
.exo2-video img, .exo2-video video { width: 100%; height: 100%; object-fit: cover; display: block; }
.exo2-video img { opacity: .85; }
.exo2-video-ov { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(245, 82, 103, .3), rgba(187, 2, 64, .3)); opacity: .6; pointer-events: none; }
.exo2-play { position: absolute; inset: 0; display: grid; place-items: center; background: none; border: 0; cursor: pointer; padding: 0; }
.exo2-play b { width: 78px; height: 78px; background: var(--exo2-degrade); display: grid; place-items: center; color: #fff; box-shadow: var(--exo2-ombre); }
.exo2-video.joue .exo2-play, .exo2-video.joue .exo2-video-ov, .exo2-video.joue img { display: none; }

/* ---------- carte de zone (fond OpenStreetMap) ---------- */
.exo2-zone { margin: 22px 0 0; }
.exo2-zone-cadre {
	position: relative; overflow: hidden; background: #1a1a1a;
	box-shadow: var(--exo2-liseret), var(--exo2-ombre);
}
/* La grille de tuiles est calculée en pixels : on la met à l'échelle du
   conteneur plutôt que de recalculer une carte par largeur d'écran. */
.exo2-zone-tuiles {
	position: absolute; top: 0; left: 0; transform-origin: top left;
	/* Le fond de carte prend la teinte du site : inversé (le papier blanc
	   d'OpenStreetMap devient un fond sombre, les routes des traits clairs),
	   désaturé, un peu assombri. Le cercle corail reste la seule couleur qui
	   compte, et la carte cesse d'être un rectangle lumineux dans une page
	   sombre. */
	filter: invert(1) grayscale(1) brightness(.92) contrast(.95);
}
.exo2-zone-tuiles img { position: absolute; width: 256px; height: 256px; max-width: none; display: block; }
/* Le tracé est un frère des tuiles, jamais leur enfant : le filtre du fond
   décolorerait le corail. */
.exo2-zone-trace {
	position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none;
	font-family: var(--exo2-police);
}
.exo2-zone-attribution {
	position: absolute; right: 0; bottom: 0; z-index: 2;
	font: 400 10px/1 var(--exo2-police); padding: 4px 6px; background: rgba(0, 0, 4, .55);
}
.exo2 .exo2-zone-attribution a { color: rgba(255, 255, 255, .75); }
.exo2 .exo2-zone-attribution a:hover { color: #fff; }

/* ---------- profil des étapes ---------- */
.exo2-profile { background: var(--exo2-carte); box-shadow: var(--exo2-liseret), var(--exo2-ombre); padding: 30px 34px 22px; margin-top: 60px; }
.exo2-profile-head { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 14px; flex-wrap: wrap; }
.exo2-totals { display: flex; gap: 30px; }
.exo2-totals b { font: italic 700 24px/1 var(--exo2-police-titre); color: #fff; letter-spacing: 1px; }
.exo2-totals span { display: block; font: 400 11px var(--exo2-police); letter-spacing: 1.2px; text-transform: uppercase; color: var(--exo2-meta); margin-top: 4px; }
.exo2-profile svg { width: 100%; height: auto; display: block; }
.exo2-legend { display: flex; gap: 24px; font-size: 12px; color: var(--exo2-meta); margin-top: 10px; flex-wrap: wrap; }
.exo2-legend i { display: inline-block; width: 22px; height: 0; border-top: 3px solid var(--exo2-corail); vertical-align: middle; margin-right: 6px; }
.exo2-legend i.bus { border-top-style: dashed; border-color: rgba(255, 255, 255, .5); }

/* Le tracé se dessine à l'apparition. */
.exo2-profile svg .ride path { stroke-dasharray: 1400; stroke-dashoffset: 1400; transition: stroke-dashoffset 1.8s ease-out; }
.exo2-profile.in svg .ride path { stroke-dashoffset: 0; }
.exo2-profile svg path[fill^="url(#exo2g"] { opacity: 0; transition: opacity 1s ease .9s; }
.exo2-profile.in svg path[fill^="url(#exo2g"] { opacity: 1; }
.exo2-profile svg circle { transform-box: fill-box; transform-origin: center; transform: scale(0); transition: transform .5s cubic-bezier(.3, 1.6, .5, 1) 1.4s; }
.exo2-profile.in svg circle { transform: scale(1); }

/* ---------- galerie ---------- */
.exo2-gallery { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 260px 260px; gap: 10px; }
.exo2-gallery figure { margin: 0; position: relative; overflow: hidden; background: #1a1a1a; box-shadow: var(--exo2-ombre); }
.exo2-gallery figure:first-child { grid-row: 1 / 3; }
.exo2-gallery a { display: block; width: 100%; height: 100%; }
.exo2-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.exo2-gallery figure:hover img { transform: scale(1.03); }
.exo2-gallery-more { position: absolute; right: 14px; bottom: 14px; pointer-events: none; }
/* Deux classes : « .exo2-gallery a » ci-dessus pese une classe et un type, et
   battrait une regle a classe unique. Le defaut etait latent ici - aucune fiche
   n'a plus de cinq photos aujourd'hui - et bien reel sur les destinations. */
.exo2-gallery .exo2-gallery-cache { display: none; }
.exo2-gcap {
	position: absolute; left: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 5px;
	font: 600 10.5px var(--exo2-police); letter-spacing: 1px; text-transform: uppercase; color: #fff;
	background: rgba(0, 0, 4, .62); padding: 5px 9px 4px; margin: 0; pointer-events: none;
}
.exo2-gcap svg { width: 11px; height: 11px; fill: var(--exo2-accent); }

/* ---------- sous-navigation ---------- */
.exo2-subnav { position: sticky; top: 0; z-index: 20; background: #0d0d0d; border-bottom: 1px solid var(--exo2-ligne); box-shadow: 0 8px 30px rgba(0, 0, 0, .5); }
.exo2-subnav .exo2-wrap { display: flex; align-items: center; gap: 4px; height: 60px; }
.exo2-subnav-links { display: flex; align-items: center; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.exo2-subnav-links::-webkit-scrollbar { display: none; }
.exo2-subnav-links a {
	color: var(--exo2-texte); font: italic 700 12px var(--exo2-police-titre); letter-spacing: 2px;
	text-transform: uppercase; padding: 8px 12px; position: relative; white-space: nowrap;
}
.exo2-subnav-links a.on { color: #fff; }
.exo2-subnav-links a.on::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: -13px; height: 2px; background: var(--exo2-degrade); }
.exo2-subnav-cta { margin-left: auto; display: flex; align-items: center; gap: 18px; font-size: 14px; color: var(--exo2-texte); white-space: nowrap; }
.exo2-subnav-cta b { font: italic 700 16px var(--exo2-police-titre); color: #fff; letter-spacing: 1px; }
.exo2-navtrace { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: rgba(255, 255, 255, .08); }
.exo2-navtrace i { position: absolute; left: 0; top: 0; height: 100%; width: 0; background: var(--exo2-degrade); }
.exo2-navtrace b { position: absolute; top: -2px; width: 1px; height: 6px; background: rgba(255, 255, 255, .35); }

/* Les sections ancrées s'arrêtent sous la barre collante. */
.exo2 [id] { scroll-margin-top: 74px; }

/* ---------- programme ---------- */
.exo2-days { display: grid; gap: 24px; position: relative; padding-left: 72px; }
.exo2-days::before { content: ""; position: absolute; left: 23px; top: 16px; bottom: 16px; width: 1px; background: rgba(255, 255, 255, .15); }
.exo2-day { position: relative; }
.exo2-day::before {
	content: attr(data-day); position: absolute; left: -72px; top: 26px; width: 48px; height: 48px;
	background: var(--exo2-degrade); color: #fff; display: grid; place-items: center;
	font: italic 700 15px var(--exo2-police-titre); letter-spacing: 1px; box-shadow: var(--exo2-ombre);
}
.exo2-day summary { list-style: none; cursor: default; }
.exo2-day summary::-webkit-details-marker { display: none; }
.exo2-day summary h3 { font: 400 22px/1.25 var(--exo2-police-h3); margin-bottom: 14px; }
.exo2-day-grid { display: grid; grid-template-columns: 1fr 250px; gap: 34px; }
.exo2-day-texte { font-size: 15.5px; line-height: 1.65; }
.exo2-day-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; align-content: start; }
.exo2-day-stats div { background: #171717; box-shadow: var(--exo2-liseret); padding: 12px 14px; }
.exo2-day-stats dt { font: 400 10.5px var(--exo2-police); letter-spacing: 1.2px; text-transform: uppercase; color: var(--exo2-meta); }
.exo2-day-stats dd { margin: 3px 0 0; font: 700 19px var(--exo2-police-titre); color: #fff; }
.exo2-night {
	grid-column: 1 / -1; display: flex; align-items: center; gap: 10px;
	font: 600 12px var(--exo2-police); letter-spacing: .8px; text-transform: uppercase; color: #fff;
	border-left: 2px solid var(--exo2-corail); padding: 8px 12px; background: #171717;
}
.exo2-night svg { color: var(--exo2-corail); flex: none; }

/* ---------- inclus / non inclus / options ---------- */
.exo2-cols3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.exo2-cols3 > .exo2-card > .exo2-h4 { margin-bottom: 14px; }
.exo2-liste-inclus ul li, .exo2-liste-noninclus ul li {
	position: relative; font-size: 15px; line-height: 1.5; padding: 8px 0 8px 26px; border-top: 1px solid var(--exo2-ligne);
}
.exo2-liste-inclus ul li:first-child, .exo2-liste-noninclus ul li:first-child { border-top: 0; }
.exo2-liste-inclus ul li::before, .exo2-liste-noninclus ul li::before {
	position: absolute; left: 0; top: 8px; font-weight: 700; font-size: 15px;
}
.exo2-liste-inclus ul li::before { content: "✓"; color: var(--exo2-corail); }
.exo2-liste-noninclus ul li::before { content: "✕"; color: rgba(255, 255, 255, .4); }
.exo2-liste-inclus a, .exo2-liste-noninclus a { color: var(--exo2-corail); }
.exo2-liste-options li { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; line-height: 1.5; padding: 8px 0; border-top: 1px solid var(--exo2-ligne); }
.exo2-liste-options li:first-child { border-top: 0; }
.exo2-liste-options b { white-space: nowrap; color: #fff; font: 700 14px var(--exo2-police-titre); letter-spacing: .5px; }

/* ---------- équipement / infos : cartes ---------- */
.exo2-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; }
.exo2-acc summary { list-style: none; cursor: default; }
.exo2-acc summary::-webkit-details-marker { display: none; }
.exo2-acc summary .exo2-h4 { margin-bottom: 12px; }
.exo2-contenu { font-size: 14.5px; line-height: 1.55; }
.exo2-contenu ul { margin: 0 0 10px; }
.exo2-contenu ul:last-child { margin-bottom: 0; }
.exo2-contenu ul li { font-size: 14.5px; line-height: 1.5; padding: 4px 0 4px 18px; position: relative; }
.exo2-contenu ul li::before { content: ""; position: absolute; left: 0; top: 13px; width: 7px; height: 2px; background: var(--exo2-corail); }
.exo2-contenu h5, .exo2-contenu h6, .exo2-contenu h4 {
	font: 600 11px/1.4 var(--exo2-police); letter-spacing: 1.2px; text-transform: uppercase; color: var(--exo2-corail); margin: 16px 0 6px;
}
.exo2-contenu a { color: var(--exo2-corail); }
.exo2-niveau-lien { margin-top: 26px; font-size: 15px; }

/* ---------- guide ---------- */
.exo2-guide { display: grid; grid-template-columns: 300px 1fr; gap: 44px; align-items: center; }
.exo2-guide figure { margin: 0; overflow: hidden; aspect-ratio: 1; border-radius: 50%; width: 300px; max-width: 100%; justify-self: center; }
.exo2-guide figure img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.exo2-guide-nom { font-size: 40px; }
.exo2-guide-role { color: var(--exo2-corail); font: 600 12px var(--exo2-police); letter-spacing: 1px; text-transform: uppercase; margin: 8px 0 20px; }
.exo2-guide-texte { font-size: 16px; }
.exo2-guide-texte p { margin-bottom: 12px; }

/* ---------- faq ---------- */
.exo2-faq { columns: 2; column-gap: 24px; }
.exo2-faq details { break-inside: avoid; background: var(--exo2-carte); box-shadow: var(--exo2-liseret); margin-bottom: 12px; }
.exo2-faq summary {
	cursor: pointer; list-style: none; padding: 16px 48px 16px 20px; position: relative;
	font: 700 14px/1.35 var(--exo2-police-titre); text-transform: uppercase; color: #fff; letter-spacing: .3px;
}
.exo2-faq summary::-webkit-details-marker { display: none; }
.exo2-faq summary::after { content: "+"; position: absolute; right: 18px; top: 11px; font: 300 24px var(--exo2-police-titre); color: var(--exo2-corail); }
.exo2-faq details[open] summary::after { content: "\2212"; }
.exo2-faq details > div { padding: 0 20px 18px; font-size: 15px; line-height: 1.55; }

/* ---------- barre collante (smartphone) ---------- */
.exo2-sticky {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: #0d0d0d;
	border-top: 1px solid var(--exo2-ligne); padding: 10px 14px 14px;
	display: flex; align-items: center; gap: 12px; box-shadow: 0 -8px 30px rgba(0, 0, 0, .6);
	transform: translateY(110%); transition: transform .25s ease;
}
.exo2-sticky.visible { transform: none; }
/* Le bouton WhatsApp du module mod_whatsapp_agent est un rond de 60 px ancré
   en bas à gauche (left 15px, bottom 15px) et passe devant la barre : le
   tarif et la date démarrent après lui, jamais dessous. Le rond s'arrête à
   75 px du bord ; avec le retrait de la barre, le texte commence à 96 px,
   soit 21 px d'air. Le bouton, lui, reste calé à droite. */
.exo2-sticky-texte { flex: 1; min-width: 0; padding-left: 82px; }
.exo2-sticky-texte b { display: block; font: italic 700 15px var(--exo2-police-titre); color: #fff; letter-spacing: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exo2-sticky-texte span { font-size: 11.5px; color: var(--exo2-meta); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exo2-sticky .exo2-btn { padding: 0 18px 2px; font-size: 11.5px; line-height: 38px; flex: none; }

@media (min-width: 961px) {
	.exo2-sticky { display: none !important; }
}

/* =======================================================================
   Smartphone et tablette
   ======================================================================= */
@media (max-width: 960px) {

	.exo2-crumbs { padding: 12px 0; font-size: 12px; }

	/* Hero 4:5, carte de réservation sous le hero. */
	.exo2-hero { min-height: 0; }
	.exo2-hero-grid { display: block; padding-top: 130px; padding-bottom: 30px; }
	.exo2-lead { font-size: 14.5px; margin: 10px 0 12px; }
	.exo2-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; margin-bottom: 14px; }
	.exo2-chips::-webkit-scrollbar { display: none; }
	.exo2-chip { flex: none; font-size: 11px; padding: 6px 10px 5px; }
	.exo2-hero-actions { display: none; }
	.exo2-hero-side { margin: 18px -4px 0; }
	.exo2-booking { padding: 18px; }
	.exo2 .exo2-price b, .exo2 .exo2-price b .exo-price { font-size: 40px; }

	.exo2-facts-section { padding: 20px 0 14px; }
	.exo2-facts { grid-template-columns: repeat(4, 1fr); gap: 12px 6px; }
	.exo2-facts div, .exo2-facts div:first-child { border-left: 0; padding: 0; }
	.exo2-facts dd { font-size: 15px; }

	.exo2-brief { display: block; }
	.exo2-brief > div + div { margin-top: 22px; }
	.exo2-profile { padding: 16px 14px 12px; margin-top: 24px; }
	.exo2-totals { gap: 18px; }
	.exo2-totals b { font-size: 17px; }

	/* Galerie à balayage. */
	.exo2-gallery { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; scrollbar-width: none; grid-template-rows: none; }
	.exo2-gallery::-webkit-scrollbar { display: none; }
	.exo2-gallery figure { flex: none; width: 300px; aspect-ratio: 4 / 3; scroll-snap-align: start; }
	.exo2-gallery figure:first-child { grid-row: auto; }

	.exo2-subnav { top: 0; }
	.exo2-subnav .exo2-wrap { height: 46px; }
	.exo2-subnav-links a { font-size: 11px; letter-spacing: 1.5px; padding: 7px 10px; }
	.exo2-subnav-links a.on::after { bottom: -8px; left: 10px; right: 10px; }
	.exo2-subnav-cta { display: none; }
	.exo2 [id] { scroll-margin-top: 60px; }

	/* Programme, équipement et infos en accordéons. */
	.exo2-days { padding-left: 0; gap: 10px; }
	.exo2-days::before { display: none; }
	.exo2-day { padding: 0; }
	.exo2-day::before { content: none; }
	.exo2-day summary { cursor: pointer; padding: 14px 44px 14px 58px; position: relative; }
	.exo2-day summary::before {
		content: attr(data-day); position: absolute; left: 14px; top: 11px; width: 32px; height: 32px;
		background: var(--exo2-degrade); color: #fff; font: italic 700 12px/32px var(--exo2-police-titre); text-align: center;
	}
	.exo2-day summary::after { content: "+"; position: absolute; right: 16px; top: 9px; font: 300 22px var(--exo2-police-titre); color: var(--exo2-corail); }
	.exo2-day[open] summary::after { content: "\2212"; }
	.exo2-day summary h3 { font-size: 14.5px; line-height: 1.35; margin: 0; font-family: var(--exo2-police-titre); font-weight: 700; }
	.exo2-day.exo2-card { padding: 0; }
	.exo2-day-grid { display: block; padding: 0 16px 16px; }
	.exo2-day-stats { grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 12px; }
	.exo2-day-stats div { padding: 8px 6px; text-align: center; }
	.exo2-day-stats dd { font-size: 14px; }
	.exo2-night { margin-top: 6px; }

	/* Un repère data-day sur la puce du résumé : on le duplique pour mobile. */

	.exo2-cols3 { grid-template-columns: 1fr; gap: 12px; }
	.exo2-cards-grid { grid-template-columns: 1fr; gap: 10px; }
	.exo2-acc { padding: 0; }
	.exo2-acc summary { cursor: pointer; padding: 14px 44px 14px 16px; position: relative; }
	.exo2-acc summary .exo2-h4 { margin: 0; font-size: 13.5px; }
	.exo2-acc summary::after { content: "+"; position: absolute; right: 16px; top: 9px; font: 300 22px var(--exo2-police-titre); color: var(--exo2-corail); }
	.exo2-acc[open] summary::after { content: "\2212"; }
	.exo2-acc-in { padding: 0 16px 16px; }

	.exo2-guide { display: block; }
	/* Largeur explicite, pas seulement un maximum : un élément flottant qui
	   ne contient qu'une image en largeur relative n'a pas de largeur propre
	   à laquelle se raccrocher. */
	.exo2-guide figure { width: 120px; max-width: 40%; float: left; margin: 0 16px 6px 0; }
	.exo2-guide-nom { font-size: 26px; }
	.exo2-guide-role { margin-bottom: 12px; }
	.exo2-guide-texte { clear: none; font-size: 14.5px; }

	.exo2-faq { columns: 1; }

	/* De la place pour la barre collante. */
	.exo2 { padding-bottom: 76px; }
}

/* Le mobile replie ce que le desktop étale : sur grand écran, les résumés ne
   sont pas des interrupteurs. */
@media (min-width: 961px) {
	.exo2-day summary, .exo2-acc summary { pointer-events: none; }
}

@media (prefers-reduced-motion: reduce) {
	.exo2-profile svg .ride path, .exo2-profile svg path[fill^="url(#exo2g"], .exo2-profile svg circle {
		transition: none; stroke-dashoffset: 0; opacity: 1; transform: none;
	}
}
