/* ==================================================== HERO D ACCUEIL
   Carrousel plein viewport des spectacles en vedette.
   Toutes les animations sont enfermees dans prefers-reduced-motion :
   si la requete ne s applique pas, aucune regle d opacite n existe et
   le contenu reste visible (lecon de l incident Elementor + WP Rocket). */
.ll-hera {
  position: relative;
  min-height: calc(100vh - var(--ll-entete-h, 100px));
  min-height: calc(100svh - var(--ll-entete-h, 100px));
  overflow: hidden;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}

.ll-hera__piste { position: absolute; inset: 0; }

.ll-hera__vue {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 620ms ease, visibility 620ms;
}
.ll-hera__vue.est-active { opacity: 1; visibility: visible; }

.ll-hera__fond { position: absolute; inset: 0; }
.ll-hera__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  display: block;
}

/* Voile en trois couches : une horizontale COURTE et dense qui ne porte que
   le texte, une verticale legere qui ancre le bas, un halo local sous le
   bloc de texte. La densite CUMULEE doit rester mesuree sur l image. */
.ll-hera__voile {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(90deg, rgba(10, 12, 16, 0.90) 0%, rgba(10, 12, 16, 0.72) 28%, rgba(10, 12, 16, 0.34) 58%, rgba(10, 12, 16, 0.08) 84%, transparent 100%),
    linear-gradient(180deg, rgba(10, 12, 16, 0.42) 0%, rgba(10, 12, 16, 0.08) 26%, rgba(10, 12, 16, 0.3) 68%, rgba(10, 12, 16, 0.52) 100%);
}

.ll-hera__contenu {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  min-height: calc(100vh - var(--ll-entete-h, 100px));
  min-height: calc(100svh - var(--ll-entete-h, 100px));
  box-sizing: border-box;
  max-width: calc(1280px + 2 * var(--ll-marge));
  margin-inline: auto;
  padding: 0 var(--ll-marge) clamp(88px, 12vh, 140px);
  pointer-events: none;
}
.ll-hera__vue.est-active .ll-hera__contenu { pointer-events: auto; }

.ll-hera__bloc { max-width: 44rem; }

.ll-hera__sus {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  font-size: 0.8125rem;
}
.ll-hera__type {
  color: var(--wp--preset--color--projecteur);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.ll-hera__filet-court { width: 26px; height: 1px; background: rgba(255, 255, 255, 0.34); }
.ll-hera__date { color: rgba(255, 255, 255, 0.9); }

.ll-hera__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.6rem, 7vw, 5.25rem);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.022em;
  color: var(--wp--preset--color--projecteur);
}
.ll-hera__titre a { color: inherit; text-decoration: none; }
.ll-hera__titre a:hover { text-decoration: underline; text-underline-offset: 0.14em; }

.ll-hera__filet {
  display: block;
  width: 58px;
  height: 2px;
  margin: 20px 0 0;
  background: var(--wp--preset--color--projecteur);
}

.ll-hera__etat {
  display: inline-block;
  margin: 18px 0 0;
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 0.8125rem;
  font-weight: 500;
  background: var(--wp--preset--color--projecteur);
  color: var(--wp--preset--color--encre);
}
.ll-hera__etat--reporte { background: var(--wp--preset--color--report); }
.ll-hera__etat--annule { background: var(--wp--preset--color--annule); color: var(--wp--preset--color--blanc); }
.ll-hera__etat--complet { background: var(--wp--preset--color--encre); color: var(--wp--preset--color--blanc); }

.ll-hera__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 26px;
}
.ll-hera__reperes {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.875rem;
}

/* ------------------------------------------------------- COMMANDES */
.ll-hera__commandes {
  position: absolute;
  z-index: 3;
  left: 50%;
  transform: translateX(-50%);
  bottom: clamp(26px, 4vh, 44px);
  box-sizing: border-box;
  width: 100%;
  max-width: calc(1280px + 2 * var(--ll-marge));
  padding-inline: var(--ll-marge);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.ll-hera__compteur {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 0.8125rem;
  font-variant-numeric: tabular-nums;
}
.ll-hera__num { color: var(--wp--preset--color--projecteur); font-weight: 700; }
.ll-hera__tot { color: rgba(255, 255, 255, 0.5); }
.ll-hera__jauge { position: relative; width: clamp(80px, 16vw, 190px); height: 2px; background: rgba(255, 255, 255, 0.2); }
.ll-hera__jauge-barre {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  background: var(--wp--preset--color--projecteur);
}

.ll-hera__fleches { display: flex; gap: 8px; }
.ll-hera__fleche {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--wp--preset--color--blanc);
  cursor: pointer;
  transition: background var(--ll-transition), border-color var(--ll-transition);
}
.ll-hera__fleche:hover { background: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.4); }
.ll-hera__fleche svg { width: 19px; height: 19px; }

@media (max-width: 1023.98px) {
  /* Le degrade horizontal ne sert plus a rien quand le texte occupe toute
     la largeur : voile purement vertical, plus dense en bas. */
  .ll-hera__voile {
    background-image: linear-gradient(180deg, rgba(10, 12, 16, 0.44) 0%, rgba(10, 12, 16, 0.24) 28%, rgba(10, 12, 16, 0.68) 46%, rgba(10, 12, 16, 0.84) 66%, rgba(10, 12, 16, 0.9) 100%);
  }
  .ll-hera__bloc { max-width: none; }
  .ll-hera__contenu { padding-bottom: clamp(104px, 16vh, 150px); }
}

@media (max-width: 599.98px) {
  .ll-hera__actions { gap: 9px; }
  .ll-hera__fleche { width: 38px; height: 38px; }
  .ll-hera__sus { flex-wrap: wrap; gap: 8px; }
}

@media (prefers-reduced-motion: no-preference) {
  .ll-hera__vue.est-active .ll-hera__img { animation: ll-hera-respire 12s ease-out both; }
  @keyframes ll-hera-respire { from { transform: scale(1.06); } to { transform: scale(1); } }
  .ll-hera__vue.est-active .ll-hera__bloc > * { animation: ll-hera-monte 700ms ease-out both; }
  .ll-hera__vue.est-active .ll-hera__sus { animation-delay: 90ms; }
  .ll-hera__vue.est-active .ll-hera__titre { animation-delay: 170ms; }
  .ll-hera__vue.est-active .ll-hera__filet { animation-delay: 280ms; }
  .ll-hera__vue.est-active .ll-hera__actions { animation-delay: 380ms; }
  @keyframes ll-hera-monte { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
}

/* ==================================================== SECTIONS D ACCUEIL */
.ll-sec { padding-block: clamp(64px, 8vw, 112px); }
.ll-sec--saison { background: var(--wp--preset--color--creme); }
.ll-sec--mur { background: var(--wp--preset--color--encre); }
.ll-sec--prose { background: var(--wp--preset--color--blanc); }
.ll-sec--visite { background: var(--wp--preset--color--encre-douce); }

.ll-sec__wrap {
  box-sizing: border-box;
  max-width: calc(1280px + 2 * var(--ll-marge));
  margin-inline: auto;
  padding-inline: var(--ll-marge);
}

.ll-sec__sus {
  margin: 0 0 10px;
  color: var(--wp--preset--color--projecteur-profond);
  font-family: var(--wp--preset--font-family--corps);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.ll-sec--mur .ll-sec__sus { color: var(--wp--preset--color--projecteur); }

.ll-sec__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.85rem, 3.6vw, 2.9rem);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.015em;
}
.ll-sec--mur .ll-sec__titre { color: var(--wp--preset--color--blanc); }

.ll-sec__filet { display: block; width: 52px; height: 2px; margin: 18px 0 34px; background: var(--wp--preset--color--projecteur); }

.ll-sec__actions {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: clamp(34px, 4vw, 54px);
}

.ll-btn__picto { width: 17px; height: 17px; margin-right: 7px; vertical-align: -3px; }

/* Variante de bouton sur fond clair : contour encre, jamais colore. */
.ll-btn--contour-sombre {
  border: 1px solid rgba(14, 16, 20, 0.24);
  color: var(--wp--preset--color--encre);
  background: transparent;
}
.ll-btn--contour-sombre:hover { border-color: rgba(14, 16, 20, 0.55); background: rgba(14, 16, 20, 0.04); }

/* ------------------------------------------------- CARTES AFFICHES
   Modele repris de la production : ratio 296/350, affiche en cover,
   degrade transparent 40% -> noir, textes centres en bas.
   Rayon 5px (regle DA), la production etait a 4px. */
.ll-affiches {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.ll-aff {
  position: relative;
  display: block;
  aspect-ratio: 296 / 350;
  border-radius: 5px;
  overflow: hidden;
  background: var(--wp--preset--color--encre-douce);
  text-decoration: none;
  isolation: isolate;
}

.ll-aff__fond { position: absolute; inset: 0; }
.ll-aff__img { width: 100%; height: 100%; object-fit: cover; display: block; }

.ll-aff__voile {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.94) 100%);
}

.ll-aff__txt {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 14px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  text-align: center;
}
.ll-aff__titre { color: var(--wp--preset--color--projecteur); font-size: 1.125rem; font-weight: 700; line-height: 1.2; }
.ll-aff__type { color: rgba(255, 255, 255, 0.88); font-size: 0.6875rem; }
.ll-aff__date { color: var(--wp--preset--color--blanc); font-size: 1rem; font-weight: 600; }

.ll-aff__pastille {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  border-radius: 5px;
  padding: 3px 8px;
  font-size: 0.6875rem;
  font-weight: 500;
}
.ll-aff__pastille--prevente { background: var(--wp--preset--color--projecteur); color: var(--wp--preset--color--encre); }
.ll-aff__pastille--reporte { background: var(--wp--preset--color--report); color: var(--wp--preset--color--encre); }
.ll-aff__pastille--annule { background: var(--wp--preset--color--annule); color: var(--wp--preset--color--blanc); }

/* COMPLET : voile dense, plus aucun lien, et on le dit aux lecteurs d ecran. */
.ll-aff--complet { cursor: default; }
.ll-aff--complet .ll-aff__voile { background-image: linear-gradient(180deg, rgba(14, 16, 20, 0.78) 0%, rgba(14, 16, 20, 0.82) 100%); }
.ll-aff--complet .ll-aff__titre { color: rgba(251, 211, 76, 0.62); }
.ll-aff--complet .ll-aff__type { color: rgba(255, 255, 255, 0.55); }
.ll-aff--complet .ll-aff__date { color: rgba(255, 255, 255, 0.62); }

.ll-aff__sceau {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
  padding: 6px 16px;
  border-radius: 5px;
  background: var(--wp--preset--color--complet);
  color: var(--wp--preset--color--encre);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@media (prefers-reduced-motion: no-preference) {
  a.ll-aff { transition: transform 320ms ease; }
  a.ll-aff .ll-aff__img { transition: transform 620ms ease; }
  a.ll-aff:hover { transform: translateY(-5px); }
  a.ll-aff:hover .ll-aff__img { transform: scale(1.06); }
}

@media (max-width: 1023.98px) {
  .ll-affiches { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
}
@media (max-width: 767.98px) {
  .ll-affiches { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ll-aff__titre { font-size: 1rem; }
}

/* ----------------------------------------------------------- LE MUR
   Affiches desaturees qui reprennent leurs couleurs au survol.
   La desaturation est posee SANS media query (c est un parti pris
   visuel, pas une animation) ; seule la transition est conditionnee. */
.ll-mur {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.ll-mur__item {
  position: relative;
  display: block;
  aspect-ratio: 1;
  border-radius: 5px;
  overflow: hidden;
  background: var(--wp--preset--color--encre-douce);
  text-decoration: none;
}

.ll-mur__fond { position: absolute; inset: 0; }
.ll-mur__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(1) contrast(0.94);
}
.ll-mur__item:hover .ll-mur__img,
.ll-mur__item:focus-visible .ll-mur__img { filter: grayscale(0) contrast(1); }

.ll-mur__voile {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(180deg, rgba(14, 16, 20, 0.1) 0%, rgba(14, 16, 20, 0.08) 32%, rgba(14, 16, 20, 0.62) 48%, rgba(14, 16, 20, 0.88) 68%, rgba(14, 16, 20, 0.96) 100%);
}

.ll-mur__txt { position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; flex-direction: column; gap: 1px; }
.ll-mur__titre { color: var(--wp--preset--color--blanc); font-size: 0.875rem; font-weight: 500; line-height: 1.22; }
.ll-mur__mois { color: rgba(255, 255, 255, 0.86); font-size: 0.75rem; }
.ll-mur__item:hover .ll-mur__titre,
.ll-mur__item:focus-visible .ll-mur__titre { color: var(--wp--preset--color--projecteur); }

@media (prefers-reduced-motion: no-preference) {
  .ll-mur__img { transition: filter 420ms ease, transform 520ms ease; }
  .ll-mur__item:hover .ll-mur__img { transform: scale(1.05); }
}

@media (max-width: 1023.98px) { .ll-mur { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 599.98px) { .ll-mur { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } }

/* ------------------------------------------------- VISITE VIRTUELLE */
.ll-visite__cadre {
  position: relative;
  border-radius: 5px;
  overflow: hidden;
  background: var(--wp--preset--color--encre);
  aspect-ratio: 16 / 9;
}
.ll-visite__cadre iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
@media (max-width: 767.98px) { .ll-visite__cadre { aspect-ratio: 4 / 3; } }

/* ------------------------------------------------- SECTIONS EDITORIALES
   Alternance des fonds : crème (saison) -> encre-douce (visite) -> blanc
   (presentation) -> encre (mur) -> blanc (partenaires) -> crème (infos).
   Jamais deux fonds identiques qui se suivent. */
.ll-sec--infos { background: var(--wp--preset--color--creme); }

.ll-sec__intro {
  max-width: 46rem;
  margin: 0 0 30px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.0625rem;
  line-height: 1.66;
}
.ll-sec--prose .ll-sec__intro,
.ll-sec--infos .ll-sec__intro { color: var(--wp--preset--color--graphite); }

.ll-sec--visite .ll-sec__titre { color: var(--wp--preset--color--blanc); }
.ll-sec--visite .ll-sec__sus { color: var(--wp--preset--color--projecteur); }

.ll-trio {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 40px);
  margin-top: 34px;
}

.ll-trio__item { min-width: 0; }

.ll-trio__chiffre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2rem, 3.4vw, 2.75rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--wp--preset--color--projecteur-profond);
}

.ll-trio__legende {
  margin: 6px 0 0;
  color: var(--wp--preset--color--graphite);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ll-trio__titre {
  margin: 18px 0 10px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.25;
}

.ll-trio__item p { margin: 0 0 12px; line-height: 1.68; }

.ll-trio__liste {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 7px;
}
.ll-trio__liste li {
  position: relative;
  padding-left: 17px;
  font-size: 0.9375rem;
  line-height: 1.5;
}
/* Pastille ronde plutot qu un trait lateral : aucun liseré d accent. */
.ll-trio__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--wp--preset--color--projecteur);
}

.ll-trio__lien { margin-top: 14px; }
.ll-trio__lien a {
  color: var(--wp--preset--color--projecteur-profond);
  font-weight: 500;
  text-decoration: none;
  border-bottom: 1px solid rgba(117, 92, 9, 0.32);
  padding-bottom: 1px;
}
.ll-trio__lien a:hover { border-bottom-color: currentColor; }

@media (max-width: 899.98px) {
  .ll-trio { grid-template-columns: 1fr; gap: 30px; }
}

/* --------------------------------------- HAUTEUR REELLE DU HERO
   L en-tete n est PAS en superposition : il occupe 100px (61 en mobile)
   au-dessus du hero. Un hero a 100svh donnait donc 100 + 900 = 1000px
   pour un viewport de 900 -> compteur et fleches 64px SOUS le pli.
   La variable est posee par le JS depuis la hauteur mesuree ; le repli
   couvre le premier rendu (valeurs mesurees : 100 desktop / 61 mobile). */

/* ------------------------------------------ BLANCS ENTRE SECTIONS
   Meme piege que la barre basse du pied : :root :where(.is-layout-flow) > *
   pose margin-block-start sur chaque section. Mesure : 24px x 6 = 144px
   de blanc parasite entre les sections de l accueil. (0,2,0) suffit. */
.ll-accueil .entry-content > * {
  margin-block-start: 0;
  margin-block-end: 0;
}

/* Les boutons doivent avoir la meme hauteur : sans border-box, la bordure
   de 1px des variantes contour ajoute 2px de haut sur le plein. */
.ll-btn { box-sizing: border-box; }

@media (max-width: 1023.98px) {
  .ll-hera { min-height: calc(100svh - var(--ll-entete-h, 61px)); }
  .ll-hera__contenu { min-height: calc(100svh - var(--ll-entete-h, 61px)); }
}

/* ============================================ SECTION PRESENTATION
   Verre sur photo, cartes qui se chevauchent, chiffres en degrade.
   Bordures NEUTRES uniquement (rgba blanc) : aucun liseré d accent. */
.ll-pres {
  position: relative;
  overflow: hidden;
  padding-block: clamp(80px, 10vw, 148px);
  background: var(--wp--preset--color--encre);
  isolation: isolate;
}

.ll-pres__fond { position: absolute; inset: 0; z-index: -2; }
.ll-pres__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 42%;
  display: block;
}

/* Voile dense : la photo ne sert que de matiere sous le verre. */
.ll-pres__voile {
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(180deg, rgba(10, 12, 16, 0.94) 0%, rgba(10, 12, 16, 0.82) 38%, rgba(10, 12, 16, 0.9) 100%),
    radial-gradient(120% 90% at 18% 12%, rgba(251, 211, 76, 0.09) 0%, transparent 62%);
}

.ll-pres__titre { color: var(--wp--preset--color--blanc); max-width: 22ch; }
.ll-pres .ll-sec__sus { color: var(--wp--preset--color--projecteur); }

.ll-pres__grille {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 0;
  align-items: start;
  margin-top: 8px;
}

/* Le visuel passe SOUS les cartes : c est lui qui cree la profondeur. */
.ll-pres__visuel {
  position: relative;
  z-index: 1;
  margin: 34px -56px 0 0;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 0 42px 90px -34px rgba(0, 0, 0, 0.9);
}
.ll-pres__visuel img { display: block; width: 100%; height: auto; }

.ll-pres__legende {
  margin: 0;
  padding: 12px 16px;
  background: rgba(10, 12, 16, 0.72);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.8125rem;
}

.ll-pres__cartes {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 16px;
}

/* Recette du verre du projet : base sombre + reflet diagonal + flou +
   bordure neutre + ombre. La profondeur vient du reflet et de l ombre. */
.ll-verre {
  position: relative;
  padding: 26px 28px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.56);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.04) 38%, transparent 72%);
  -webkit-backdrop-filter: blur(26px) saturate(164%);
  backdrop-filter: blur(26px) saturate(164%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 30px 70px -30px rgba(0, 0, 0, 0.85);
}

/* Chevauchement : chaque carte mord sur la precedente et se decale. */
.ll-verre--1 { margin-left: 0; }
.ll-verre--2 { margin-left: 34px; margin-top: -6px; }
.ll-verre--3 { margin-left: 68px; margin-top: -6px; }

.ll-verre__chiffre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.1rem, 3.6vw, 3rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;
  /* Repli : si le clip texte n est pas supporte, la couleur pleine reste. */
  color: var(--wp--preset--color--projecteur);
}
.ll-verre__chiffre span {
  background-image: linear-gradient(96deg, #FBD34C 0%, #FDE9A8 46%, #F7B472 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ll-verre__legende {
  margin: 8px 0 0;
  color: rgba(255, 255, 255, 0.66);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ll-verre__titre {
  margin: 18px 0 8px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.24;
  color: var(--wp--preset--color--blanc);
}

.ll-verre__texte { margin: 0; color: rgba(255, 255, 255, 0.82); font-size: 0.9375rem; line-height: 1.65; }

.ll-verre__points {
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.ll-verre__points li {
  padding: 4px 11px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 5px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.8125rem;
}

@media (max-width: 1023.98px) {
  .ll-pres__grille { grid-template-columns: 1fr; }
  .ll-pres__visuel { margin: 26px 0 0; }
  .ll-pres__cartes { margin-top: 20px; }
  .ll-verre--1, .ll-verre--2, .ll-verre--3 { margin-left: 0; margin-top: 0; }
  .ll-pres__titre { max-width: none; }
  .ll-pres__titre br { display: none; }
}
@media (max-width: 599.98px) {
  .ll-verre { padding: 20px 18px; }
}

@media (prefers-reduced-motion: no-preference) {
  .ll-verre { transition: transform 420ms ease, box-shadow 420ms ease, background-color 420ms ease; }
  .ll-verre:hover {
    transform: translateY(-6px);
    background-color: rgba(11, 13, 17, 0.66);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 40px 84px -30px rgba(0, 0, 0, 0.92);
  }
  .ll-pres__visuel { transition: transform 620ms ease; }
  .ll-pres__visuel:hover { transform: translateY(-4px); }

  @supports (animation-timeline: view()) {
    .ll-verre, .ll-pres__visuel {
      animation: ll-pres-entre both;
      animation-timeline: view();
      animation-range: entry 8% cover 34%;
    }
    @keyframes ll-pres-entre { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }
  }
}

/* ======================================== INFORMATIONS PRATIQUES
   Cartes claires surelevees, pictos maison, chevauchement leger. */
.ll-infos {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: start;
}

.ll-info {
  position: relative;
  padding: 30px 28px 32px;
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 26px 54px -30px rgba(14, 16, 20, 0.42);
}
/* Decalage vertical : la composition respire sans grille rigide. */
.ll-info--2 { margin-top: 26px; }
.ll-info--3 { margin-top: 52px; }

.ll-info__picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin-bottom: 18px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
}
.ll-info__picto .ll-picto { width: 23px; height: 23px; }

.ll-info__titre {
  margin: 0 0 10px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.1875rem;
  font-weight: 600;
  line-height: 1.26;
}

.ll-info__texte { margin: 0 0 14px; color: var(--wp--preset--color--graphite); font-size: 0.9375rem; line-height: 1.65; }

.ll-info__liste { margin: 0; padding: 0; list-style: none; display: grid; gap: 9px; }
.ll-info__liste li { position: relative; padding-left: 18px; font-size: 0.9375rem; line-height: 1.5; }
.ll-info__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--wp--preset--color--projecteur);
}

.ll-info__lien {
  display: inline-block;
  margin-top: 18px;
  color: var(--wp--preset--color--projecteur-profond);
  font-weight: 500;
  font-size: 0.9375rem;
  text-decoration: none;
  border-bottom: 1px solid rgba(117, 92, 9, 0.34);
  padding-bottom: 1px;
}
.ll-info__lien:hover { border-bottom-color: currentColor; }

@media (max-width: 899.98px) {
  .ll-infos { grid-template-columns: 1fr; gap: 16px; }
  .ll-info--2, .ll-info--3 { margin-top: 0; }
}

@media (prefers-reduced-motion: no-preference) {
  .ll-info { transition: transform 420ms ease, box-shadow 420ms ease; }
  .ll-info:hover { transform: translateY(-6px); box-shadow: 0 34px 66px -30px rgba(14, 16, 20, 0.5); }
  @supports (animation-timeline: view()) {
    .ll-info { animation: ll-pres-entre both; animation-timeline: view(); animation-range: entry 8% cover 32%; }
  }
}

/* ================================================ ARCHIVE PAR GENRE
   Memes cartes-affiches que l accueil. Les passes sont desatures pour
   hierarchiser sans changer de modele de carte, et reprennent leurs
   couleurs au survol comme le mur de l accueil. */
.ll-archtype__entete {
  padding-block: clamp(46px, 6vw, 78px);
  background: var(--wp--preset--color--creme);
}

.ll-archtype__entete .ll-sec__sus { margin-bottom: 12px; }
.ll-archtype__entete .ll-sec__sus a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(117, 92, 9, 0.34); }
.ll-archtype__entete .ll-sec__sus a:hover { border-bottom-color: currentColor; }

.ll-archtype__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.4rem, 6vw, 4rem);
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: -0.022em;
}

.ll-archtype__genres {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 26px;
}

.ll-archtype__genre {
  padding: 7px 15px;
  border: 1px solid rgba(14, 16, 20, 0.16);
  border-radius: 5px;
  color: var(--wp--preset--color--encre);
  font-size: 0.875rem;
  text-decoration: none;
  transition: border-color var(--ll-transition), background var(--ll-transition);
}
.ll-archtype__genre:hover { border-color: rgba(14, 16, 20, 0.5); background: rgba(14, 16, 20, 0.04); }

/* L onglet actif est porte par la MATIERE (aplat), pas par un liseré. */
.ll-archtype__genre.est-actif {
  background: var(--wp--preset--color--encre);
  border-color: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}

/* Fond alterne pour la seconde section : jamais deux fonds identiques. */
.ll-sec--archives-claire { background: var(--wp--preset--color--blanc); }

.ll-archtype__bloc { padding-block: clamp(52px, 6.5vw, 92px); }

/* Les sections de l archive se touchent, comme sur l accueil. */
.ll-accueil .ll-archtype > * { margin-block-start: 0; margin-block-end: 0; }

.ll-affiches--passees .ll-aff__img { filter: grayscale(1) contrast(0.95); }
.ll-affiches--passees a.ll-aff:hover .ll-aff__img,
.ll-affiches--passees a.ll-aff:focus-visible .ll-aff__img { filter: grayscale(0) contrast(1); }

@media (prefers-reduced-motion: no-preference) {
  .ll-affiches--passees .ll-aff__img { transition: filter 420ms ease, transform 620ms ease; }
}

.ll-vide { margin: 0 0 22px; color: var(--wp--preset--color--graphite); font-size: 1.0625rem; }

/* ------------------------------------------------------- PAGINATION */
.ll-pagination { margin-top: clamp(34px, 4vw, 52px); }
.ll-pagination ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ll-pagination a,
.ll-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 42px;
  height: 42px;
  padding: 0 13px;
  border: 1px solid rgba(14, 16, 20, 0.16);
  border-radius: 5px;
  color: var(--wp--preset--color--encre);
  font-size: 0.9375rem;
  text-decoration: none;
  transition: border-color var(--ll-transition), background var(--ll-transition);
}
.ll-pagination a:hover { border-color: rgba(14, 16, 20, 0.5); background: rgba(14, 16, 20, 0.04); }
.ll-pagination .current {
  background: var(--wp--preset--color--encre);
  border-color: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-pagination .dots { border-color: transparent; }

@media (max-width: 599.98px) {
  .ll-pagination a, .ll-pagination span { min-width: 38px; height: 38px; padding: 0 10px; font-size: 0.875rem; }
}

/* ------------------------------------------ ANNONCE AUCUNE DATE
   Cinq genres sur sept n ont aucune date a venir. Sans ce message, le
   visiteur tombe sans transition sur les archives et croit la page vide.
   Encart sobre : aplat creme, picto sur pastille encre, aucun liseré. */
.ll-annonce {
  display: flex;
  gap: clamp(16px, 2.4vw, 26px);
  align-items: flex-start;
  padding: clamp(24px, 3vw, 36px);
  border-radius: 5px;
  background: var(--wp--preset--color--creme);
}

.ll-annonce__picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
}
.ll-annonce__picto .ll-picto { width: 26px; height: 26px; }

.ll-annonce__txt { min-width: 0; }
.ll-annonce .ll-sec__sus { margin-bottom: 8px; }

.ll-annonce__titre {
  margin: 0 0 10px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.3rem, 2.4vw, 1.75rem);
  font-weight: 600;
  line-height: 1.22;
}

.ll-annonce__texte {
  margin: 0;
  max-width: 56ch;
  color: var(--wp--preset--color--graphite);
  font-size: 1rem;
  line-height: 1.66;
}

.ll-annonce__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

/* La bande d annonce n a pas besoin du meme souffle qu une vraie section. */
.ll-archtype__vide { padding-block: clamp(38px, 4.5vw, 62px); }

@media (max-width: 599.98px) {
  .ll-annonce { flex-direction: column; gap: 16px; }
  .ll-annonce__actions .ll-btn { flex: 1 1 100%; }
}

/* ================================================== PAGE BILLETTERIE */
.ll-bil__hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(70px, 9vw, 128px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}

/* Pas de photo ici : la page d accueil en use deja beaucoup. Un degrade
   sobre suffit et evite un visuel basse definition (le seul disponible
   sur ce sujet fait 770px de large). */
.ll-bil__hero-voile {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(112% 82% at 8% 6%, rgba(251, 211, 76, 0.13) 0%, transparent 60%),
    radial-gradient(90% 70% at 96% 96%, rgba(232, 134, 42, 0.09) 0%, transparent 62%);
}
.ll-bil__hero .ll-sec__wrap { position: relative; z-index: 1; }

.ll-bil__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.3rem, 5.4vw, 4.1rem);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wp--preset--color--blanc);
}

.ll-bil__accroche {
  max-width: 46ch;
  margin: 20px 0 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.0625rem;
  line-height: 1.66;
}

.ll-bil__reperes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: clamp(30px, 4vw, 48px);
}

.ll-bil__repere {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 18px 20px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.5);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03) 40%, transparent 74%);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  backdrop-filter: blur(22px) saturate(160%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}
.ll-bil__repere .ll-picto { width: 22px; height: 22px; flex: none; margin-top: 2px; }
.ll-bil__repere-titre { display: block; font-weight: 500; font-size: 0.9375rem; }
.ll-bil__repere-txt { display: block; margin-top: 2px; color: rgba(255, 255, 255, 0.66); font-size: 0.8125rem; line-height: 1.45; }

/* ----------------------------------------------------- LES 4 CANAUX */
.ll-canaux {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.ll-canal--large { grid-column: 1 / -1; }

.ll-canal {
  display: flex;
  gap: 18px;
  padding: clamp(22px, 2.6vw, 32px);
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 24px 52px -30px rgba(14, 16, 20, 0.4);
}

.ll-canal__num {
  flex: none;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--projecteur-profond);
  font-variant-numeric: tabular-nums;
}

.ll-canal__corps { min-width: 0; flex: 1; }

.ll-canal__titre {
  margin: 0 0 12px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.26;
}

.ll-canal__txt { margin: 0 0 14px; font-size: 0.9375rem; line-height: 1.68; }
.ll-canal__note { margin: 14px 0 0; color: var(--wp--preset--color--graphite); font-size: 0.875rem; line-height: 1.55; }

.ll-canal__adresse {
  margin: 0 0 16px;
  font-style: normal;
  font-size: 0.9375rem;
  line-height: 1.62;
}
.ll-canal__adresse a { color: var(--wp--preset--color--projecteur-profond); text-decoration: none; border-bottom: 1px solid rgba(117, 92, 9, 0.34); }
.ll-canal__adresse a:hover { border-bottom-color: currentColor; }

.ll-bil__plaques { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 4px; }

/* --------------------------------------------------------- HORAIRES */
.ll-horaires {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.ll-horaires th,
.ll-horaires td {
  padding: 8px 0;
  text-align: left;
  border-bottom: 1px solid var(--wp--preset--color--brume);
  vertical-align: baseline;
}
.ll-horaires th { font-weight: 500; width: 42%; }
.ll-horaires td { color: var(--wp--preset--color--graphite); font-variant-numeric: tabular-nums; }
.ll-horaires tr:last-child th,
.ll-horaires tr:last-child td { border-bottom: 0; }
.ll-horaires .est-ferme th,
.ll-horaires .est-ferme td { color: var(--wp--preset--color--graphite); }
.ll-horaires__vide { color: var(--wp--preset--color--graphite); opacity: 0.75; }

/* ------------------------------------------------- CARTE ABONNEMENT */
.ll-bil__abo {
  padding-block: clamp(64px, 8vw, 112px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}

.ll-bil__abo-grille {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
  gap: clamp(26px, 4vw, 58px);
  align-items: center;
}

.ll-bil__abo-titre {
  margin: 0 0 14px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.75rem, 3.2vw, 2.6rem);
  font-weight: 600;
  line-height: 1.1;
  color: var(--wp--preset--color--blanc);
}
.ll-bil__abo-texte { margin: 0; max-width: 48ch; color: rgba(255, 255, 255, 0.82); font-size: 1rem; line-height: 1.68; }
.ll-bil__abo-actions { margin-top: 26px; }

/* Carte materialisee : aucun visuel a disposition, on la dessine. */
.ll-bil__carte {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 3px;
  aspect-ratio: 1.586;
  max-width: 380px;
  margin-inline: auto;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 5px;
  background-color: rgba(26, 31, 39, 0.9);
  background-image: linear-gradient(148deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.04) 42%, transparent 76%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 36px 74px -30px rgba(0, 0, 0, 0.86);
  transform: rotate(-3deg);
}

.ll-bil__carte-puce {
  position: absolute;
  top: 24px;
  left: 24px;
  width: 40px;
  height: 30px;
  border-radius: 5px;
  background-image: linear-gradient(140deg, #FBD34C 0%, #D9A82E 100%);
}

.ll-bil__carte-marque {
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--wp--preset--color--blanc);
}
.ll-bil__carte-legende { color: rgba(255, 255, 255, 0.62); font-size: 0.8125rem; letter-spacing: 0.06em; text-transform: uppercase; }
.ll-bil__carte-prix {
  position: absolute;
  top: 24px;
  right: 24px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--wp--preset--color--projecteur);
}

@media (prefers-reduced-motion: no-preference) {
  .ll-canal { transition: transform 380ms ease, box-shadow 380ms ease; }
  .ll-canal:hover { transform: translateY(-5px); box-shadow: 0 32px 64px -30px rgba(14, 16, 20, 0.48); }
  .ll-bil__carte { transition: transform 520ms ease; }
  .ll-bil__carte:hover { transform: rotate(-1deg) translateY(-6px); }
}

@media (max-width: 899.98px) {
  .ll-bil__reperes { grid-template-columns: 1fr; }
  .ll-canaux { grid-template-columns: 1fr; }
  .ll-bil__plaques { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ll-bil__abo-grille { grid-template-columns: 1fr; }
  .ll-bil__carte { transform: none; margin-inline: 0; }
}

@media (max-width: 599.98px) {
  .ll-canal { flex-direction: column; gap: 10px; }
  .ll-horaires th { width: 38%; }
  .ll-horaires { font-size: 0.8125rem; }
}

/* ------------------------------------- SUR-TITRE SUR FOND SOMBRE
   .ll-sec__sus utilise projecteur-profond (#755C09), pense pour un fond
   CLAIR. Pose sur l encre il tombe a 2,98 de contraste. Regle generique
   pour toute section sombre, plutot qu une exception par bloc.
   (0,2,0) bat la declaration de base en (0,1,0). */
.ll-sombre .ll-sec__sus,
.ll-sec--mur .ll-sec__sus,
.ll-bil__hero .ll-sec__sus,
.ll-bil__abo .ll-sec__sus { color: var(--wp--preset--color--projecteur); }

/* ------------------------------------------ COLONNES EQUILIBREES
   La carte 02 (adresse + tableau de 6 lignes) est deux fois plus haute
   que la 03 : en grille simple, un vide beant se creusait a droite et la
   04 restait seule sur sa ligne. Les cartes 03 et 04 sont donc empilees
   face a la 02, dont elles compensent la hauteur. */
.ll-canaux {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  /* stretch (defaut) : les deux colonnes prennent la hauteur de la plus
     haute, pour que la carte 02 descende au niveau de la 04. */
  align-items: stretch;
}
.ll-canaux__col {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}
/* Seule une carte SEULE dans sa colonne s etire : dans la colonne a deux
   cartes, chacune garde sa hauteur naturelle et l espace se repartit. */
.ll-canaux__col > .ll-canal:only-child { height: 100%; }

/* Le tableau des horaires respire quand la carte a de la place. */
.ll-horaires { margin-top: 4px; }

@media (max-width: 899.98px) {
  .ll-canaux { grid-template-columns: 1fr; }
  .ll-canaux__col > .ll-canal:only-child { height: auto; }
}

/* --------------------------------------- FOND PHOTO DU HERO BILLETTERIE
   Image demandee par le client (batiment HQE, ID 1803). Le voile radial
   existant ne suffisait plus : il faut une base sombre sous le texte.
   Densite a re-mesurer si du contenu est ajoute au hero. */
.ll-bil__hero-fond { position: absolute; inset: 0; z-index: 0; }
.ll-bil__hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
  display: block;
}
.ll-bil__hero-voile {
  z-index: 1;
  background-image:
    linear-gradient(96deg, rgba(10, 12, 16, 0.92) 0%, rgba(10, 12, 16, 0.82) 34%, rgba(10, 12, 16, 0.6) 66%, rgba(10, 12, 16, 0.5) 100%),
    linear-gradient(180deg, rgba(10, 12, 16, 0.42) 0%, rgba(10, 12, 16, 0.2) 40%, rgba(10, 12, 16, 0.55) 100%),
    radial-gradient(112% 82% at 8% 6%, rgba(251, 211, 76, 0.1) 0%, transparent 58%);
}
.ll-bil__hero .ll-sec__wrap { position: relative; z-index: 2; }

@media (max-width: 1023.98px) {
  /* Le texte occupe toute la largeur : le degrade horizontal ne sert plus. */
  .ll-bil__hero-voile {
    background-image:
      linear-gradient(180deg, rgba(10, 12, 16, 0.78) 0%, rgba(10, 12, 16, 0.7) 42%, rgba(10, 12, 16, 0.86) 100%),
      radial-gradient(120% 70% at 10% 4%, rgba(251, 211, 76, 0.08) 0%, transparent 60%);
  }
}

/* ============================================= PAGE CARTE ABONNEMENT */
.ll-abo__hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(64px, 8vw, 118px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-abo__hero-voile {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(108% 80% at 88% 12%, rgba(251, 211, 76, 0.16) 0%, transparent 58%),
    radial-gradient(86% 72% at 4% 92%, rgba(232, 134, 42, 0.1) 0%, transparent 62%);
}
.ll-abo__hero .ll-sec__wrap { position: relative; z-index: 1; }

.ll-abo__hero-grille {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.94fr);
  gap: clamp(28px, 4vw, 62px);
  align-items: center;
}

.ll-abo__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.3rem, 5.2vw, 4rem);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wp--preset--color--blanc);
}

.ll-abo__accroche {
  max-width: 44ch;
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.0625rem;
  line-height: 1.66;
}

.ll-abo__prix-ligne { display: flex; align-items: baseline; gap: 10px; margin: 26px 0 0; }
.ll-abo__prix {
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2rem, 3.4vw, 2.75rem);
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--projecteur);
}
.ll-abo__prix-txt { color: rgba(255, 255, 255, 0.7); font-size: 0.9375rem; }

.ll-abo__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* -------------------------------------------- LA CARTE, DESSINEE EN CSS */
.ll-abo__carte {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  aspect-ratio: 1.586;
  max-width: 420px;
  margin-inline: auto;
  padding: 26px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 5px;
  background-color: rgba(26, 31, 39, 0.92);
  background-image: linear-gradient(146deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.05) 44%, transparent 78%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 40px 80px -32px rgba(0, 0, 0, 0.88);
  transform: rotate(-3deg);
}

.ll-abo__carte-puce {
  position: absolute;
  top: 26px;
  left: 26px;
  width: 44px;
  height: 33px;
  border-radius: 5px;
  background-image: linear-gradient(138deg, #FBD34C 0%, #D9A82E 62%, #B98F1F 100%);
}
.ll-abo__carte-prix {
  position: absolute;
  top: 26px;
  right: 26px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.875rem;
  font-weight: 600;
  color: var(--wp--preset--color--projecteur);
}
.ll-abo__carte-bas { display: flex; flex-direction: column; gap: 3px; }
.ll-abo__carte-marque {
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.625rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--wp--preset--color--blanc);
}
.ll-abo__carte-legende { color: rgba(255, 255, 255, 0.86); font-size: 0.875rem; }
.ll-abo__carte-mention { color: rgba(255, 255, 255, 0.58); font-size: 0.75rem; letter-spacing: 0.04em; }

/* -------------------------------------------------------- AVANTAGES */
.ll-avantages {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.ll-avantage {
  padding: 26px 24px 28px;
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 22px 48px -30px rgba(14, 16, 20, 0.38);
}
.ll-avantage__picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 16px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
}
.ll-avantage__picto .ll-picto { width: 22px; height: 22px; }
.ll-avantage__titre {
  margin: 0 0 8px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.26;
}
.ll-avantage__txt { margin: 0; color: var(--wp--preset--color--graphite); font-size: 0.9375rem; line-height: 1.6; }

/* --------------------------------------------------------- FORMULES */
.ll-formules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}
.ll-formule {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(26px, 3vw, 38px);
  border-radius: 5px;
  background: var(--wp--preset--color--creme);
}
/* La formule mise en avant se distingue par la MATIERE (aplat encre),
   jamais par un liseré colore. */
.ll-formule--vedette {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-formule__ruban {
  align-self: flex-start;
  margin-bottom: 14px;
  padding: 4px 12px;
  border-radius: 5px;
  background: var(--wp--preset--color--projecteur);
  color: var(--wp--preset--color--encre);
  font-size: 0.75rem;
  font-weight: 500;
}
.ll-formule__titre {
  margin: 0 0 6px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.375rem;
  font-weight: 600;
}
.ll-formule--vedette .ll-formule__titre { color: var(--wp--preset--color--blanc); }
.ll-formule__prix {
  margin: 0 0 18px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2rem, 3.2vw, 2.5rem);
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--projecteur-profond);
}
.ll-formule--vedette .ll-formule__prix { color: var(--wp--preset--color--projecteur); }
.ll-formule__prix span { margin-left: 7px; font-family: var(--wp--preset--font-family--corps); font-size: 0.875rem; font-weight: 400; color: var(--wp--preset--color--graphite); }
.ll-formule--vedette .ll-formule__prix span { color: rgba(255, 255, 255, 0.66); }

.ll-formule__liste { margin: 0 0 26px; padding: 0; list-style: none; display: grid; gap: 9px; }
.ll-formule__liste li { position: relative; padding-left: 18px; font-size: 0.9375rem; line-height: 1.5; }
.ll-formule--vedette .ll-formule__liste li { color: rgba(255, 255, 255, 0.88); }
.ll-formule__liste li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--wp--preset--color--projecteur);
}
.ll-formule .ll-btn { align-self: flex-start; margin-top: auto; }

/* ---------------------------------------------------------- POINTS */
.ll-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ll-point {
  display: flex;
  gap: 16px;
  padding: 26px 24px;
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 22px 48px -30px rgba(14, 16, 20, 0.38);
}
.ll-point__picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
}
.ll-point__picto .ll-picto { width: 22px; height: 22px; }
.ll-point__titre { margin: 0 0 6px; font-family: var(--wp--preset--font-family--titres); font-size: 1.125rem; font-weight: 600; }
.ll-point__txt { margin: 0; color: var(--wp--preset--color--graphite); font-size: 0.9375rem; line-height: 1.6; }
.ll-points__note { margin: 22px 0 0; color: var(--wp--preset--color--graphite); font-size: 0.9375rem; line-height: 1.6; }

/* -------------------------------------------------------- CTA FINAL */
.ll-abo__final {
  padding-block: clamp(58px, 7vw, 100px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
  text-align: center;
}
.ll-abo__final-titre {
  margin: 0 0 12px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.75rem, 3.4vw, 2.6rem);
  font-weight: 600;
  line-height: 1.14;
  color: var(--wp--preset--color--blanc);
}
.ll-abo__final-txt { max-width: 52ch; margin: 0 auto; color: rgba(255, 255, 255, 0.8); font-size: 1rem; line-height: 1.66; }
.ll-abo__final .ll-abo__actions { justify-content: center; }

@media (prefers-reduced-motion: no-preference) {
  .ll-avantage, .ll-point, .ll-formule { transition: transform 380ms ease, box-shadow 380ms ease; }
  .ll-avantage:hover, .ll-point:hover { transform: translateY(-5px); }
  .ll-formule:hover { transform: translateY(-4px); }
  .ll-abo__carte { transition: transform 520ms ease; }
  .ll-abo__carte:hover { transform: rotate(-1deg) translateY(-6px); }
}

@media (max-width: 1023.98px) {
  .ll-avantages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 899.98px) {
  .ll-abo__hero-grille { grid-template-columns: 1fr; }
  .ll-abo__carte { transform: none; margin-inline: 0; max-width: 100%; }
  .ll-formules, .ll-points { grid-template-columns: 1fr; }
}
@media (max-width: 599.98px) {
  .ll-avantages { grid-template-columns: 1fr; }
  .ll-abo__actions .ll-btn { flex: 1 1 100%; }
}

/* ==================================================== PAGE CONTACT */
.ll-ct__hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(62px, 8vw, 112px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-ct__hero-voile {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(104% 78% at 6% 8%, rgba(251, 211, 76, 0.15) 0%, transparent 58%),
    radial-gradient(84% 68% at 94% 92%, rgba(232, 134, 42, 0.1) 0%, transparent 60%);
}
.ll-ct__hero .ll-sec__wrap { position: relative; z-index: 1; }

.ll-ct__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.5rem, 6vw, 4.4rem);
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: -0.024em;
  color: var(--wp--preset--color--blanc);
}
.ll-ct__accroche { max-width: 48ch; margin: 18px 0 0; color: rgba(255, 255, 255, 0.82); font-size: 1.0625rem; line-height: 1.66; }

.ll-ct__directs { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.ll-ct__direct {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.5);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03) 42%, transparent 76%);
  -webkit-backdrop-filter: blur(20px) saturate(158%);
  backdrop-filter: blur(20px) saturate(158%);
  color: var(--wp--preset--color--blanc);
  text-decoration: none;
  transition: border-color var(--ll-transition), background-color var(--ll-transition);
}
.ll-ct__direct:hover { border-color: rgba(255, 255, 255, 0.3); background-color: rgba(11, 13, 17, 0.66); }
.ll-ct__direct .ll-picto { width: 21px; height: 21px; flex: none; }
.ll-ct__direct-lib { display: block; color: rgba(255, 255, 255, 0.62); font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; }
.ll-ct__direct-val { display: block; font-size: 0.9375rem; font-weight: 500; }

/* --------------------------------------------------------- MARQUISE */
.ll-marquise {
  overflow: hidden;
  padding-block: 16px;
  background: var(--wp--preset--color--projecteur);
  color: var(--wp--preset--color--encre);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.ll-marquise__piste { display: flex; width: max-content; }
.ll-marquise__serie { display: flex; align-items: center; }
.ll-marquise__mot {
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1rem, 1.7vw, 1.375rem);
  font-weight: 600;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
/* L ecart est porte par CHAQUE element : avec un gap sur le conteneur,
   le raccord saute d un cran a chaque tour de boucle. */
.ll-marquise__sep { margin-inline: 22px; opacity: 0.5; }

@media (prefers-reduced-motion: no-preference) {
  .ll-marquise__piste { animation: ll-marquise 34s linear infinite; }
  .ll-marquise:hover .ll-marquise__piste { animation-play-state: paused; }
  @keyframes ll-marquise { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(calc(-100% / 3), 0, 0); } }
}

/* --------------------------------------------------- FORMULAIRE + INFOS */
.ll-ct__split {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 20px;
  align-items: stretch;
}

.ll-ct__form-carte {
  padding: clamp(26px, 3vw, 40px);
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 26px 56px -32px rgba(14, 16, 20, 0.42);
}
.ll-ct__form-titre {
  margin: 0 0 22px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 600;
  line-height: 1.16;
}

.ll-ct__avis {
  margin: 0 0 20px;
  padding: 14px 18px;
  border-radius: 5px;
  font-size: 0.9375rem;
  line-height: 1.55;
}
.ll-ct__avis--ok { background: rgba(117, 92, 9, 0.1); color: var(--wp--preset--color--projecteur-profond); }
.ll-ct__avis--erreur { background: rgba(192, 57, 43, 0.1); color: #8E2A20; }

.ll-form__duo { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ll-form__champ { margin: 0 0 16px; display: flex; flex-direction: column; gap: 6px; }
.ll-form__champ label { font-size: 0.875rem; font-weight: 500; }
.ll-form__champ label span { color: var(--wp--preset--color--projecteur-profond); }

.ll-form input[type="text"],
.ll-form input[type="email"],
.ll-form input[type="tel"],
.ll-form select,
.ll-form textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 11px 14px;
  border: 1px solid var(--wp--preset--color--brume);
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  color: var(--wp--preset--color--encre);
  font-family: inherit;
  font-size: 0.9375rem;
  line-height: 1.5;
  transition: border-color var(--ll-transition), box-shadow var(--ll-transition);
}
.ll-form input:focus,
.ll-form select:focus,
.ll-form textarea:focus {
  outline: none;
  border-color: var(--wp--preset--color--projecteur-profond);
  box-shadow: 0 0 0 3px rgba(251, 211, 76, 0.28);
}
.ll-form textarea { resize: vertical; min-height: 140px; }

/* Piege a robots : masque a l ecran mais pas retire du DOM, sinon les
   robots qui lisent le HTML le detectent. */
.ll-form__piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.ll-form__rgpd { display: flex; margin: 4px 0 22px; }
.ll-form__rgpd label { display: flex; align-items: flex-start; gap: 10px; font-size: 0.875rem; line-height: 1.55; cursor: pointer; }
/* flex: none garderait la largeur intrinseque (13,3px) : il faut une base. */
.ll-form__rgpd input { flex: 0 0 18px; width: 18px; height: 18px; min-width: 18px; margin-top: 2px; accent-color: var(--wp--preset--color--projecteur-profond); }
.ll-form__rgpd a { color: var(--wp--preset--color--projecteur-profond); }

.ll-form__envoi { margin: 0; }
.ll-form__mention { margin: 14px 0 0; color: var(--wp--preset--color--graphite); font-size: 0.8125rem; }

/* ------------------------------------------------------------ INFOS */
.ll-ct__infos {
  padding: clamp(26px, 3vw, 36px);
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-ct__infos-titre {
  margin: 0 0 22px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.375rem;
  font-weight: 600;
  color: var(--wp--preset--color--blanc);
}
.ll-ct__liste { margin: 0 0 26px; padding: 0; list-style: none; display: grid; gap: 14px; }
.ll-ct__liste li { display: flex; gap: 12px; align-items: flex-start; font-size: 0.9375rem; line-height: 1.55; }
.ll-ct__liste .ll-picto { width: 20px; height: 20px; flex: none; margin-top: 2px; }
.ll-ct__liste a { color: var(--wp--preset--color--projecteur); text-decoration: none; }
.ll-ct__liste a:hover { text-decoration: underline; }

.ll-ct__horaires { padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, 0.12); }
.ll-ct__horaires-titre { margin: 0 0 2px; font-weight: 500; font-size: 0.9375rem; }
.ll-ct__horaires-lieu { margin: 0 0 14px; color: rgba(255, 255, 255, 0.6); font-size: 0.8125rem; }
.ll-ct__hl { margin: 0 0 24px; display: grid; gap: 10px; }
.ll-ct__hl dt { color: rgba(255, 255, 255, 0.66); font-size: 0.8125rem; }
.ll-ct__hl dd { margin: 2px 0 0; font-size: 0.875rem; font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------ VENIR */
.ll-ct__venir { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 20px; align-items: stretch; }
.ll-ct__carte { position: relative; border-radius: 5px; overflow: hidden; background: var(--wp--preset--color--encre-douce); min-height: 380px; }
.ll-ct__carte iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }

.ll-ct__acces { display: flex; flex-direction: column; gap: 12px; }
.ll-ct__acces-item {
  display: flex;
  gap: 14px;
  padding: 20px 22px;
  border-radius: 5px;
  background: var(--wp--preset--color--creme);
}
.ll-ct__acces-picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
}
.ll-ct__acces-picto .ll-picto { width: 21px; height: 21px; }
.ll-ct__acces-titre { margin: 0 0 4px; font-family: var(--wp--preset--font-family--titres); font-size: 1.0625rem; font-weight: 600; }
.ll-ct__acces-txt { margin: 0; color: var(--wp--preset--color--graphite); font-size: 0.9375rem; line-height: 1.55; }
.ll-ct__itineraire { margin: 4px 0 0; }
.ll-ct__itineraire a { color: var(--wp--preset--color--projecteur-profond); font-weight: 500; font-size: 0.9375rem; text-decoration: none; border-bottom: 1px solid rgba(117, 92, 9, 0.34); }
.ll-ct__itineraire a:hover { border-bottom-color: currentColor; }

@media (max-width: 1023.98px) {
  .ll-ct__split, .ll-ct__venir { grid-template-columns: 1fr; }
  .ll-ct__carte { min-height: 320px; }
}
@media (max-width: 599.98px) {
  .ll-form__duo { grid-template-columns: 1fr; gap: 0; }
  .ll-ct__direct { flex: 1 1 100%; }
  .ll-form__envoi .ll-btn { width: 100%; }
}

/* ------------------------------------- FOND PHOTO DU HERO CONTACT
   Image ID 1812, deja mesuree pour la newsletter du pied : luminance
   moyenne 0,024, donc TRES sombre. Un voile lourd l effacerait ; on
   reste leger et on laisse les halos colores porter la profondeur. */
.ll-ct__hero-fond { position: absolute; inset: 0; z-index: 0; }
.ll-ct__hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  display: block;
}
.ll-ct__hero-voile {
  z-index: 1;
  background-image:
    linear-gradient(96deg, rgba(10, 12, 16, 0.86) 0%, rgba(10, 12, 16, 0.7) 38%, rgba(10, 12, 16, 0.46) 72%, rgba(10, 12, 16, 0.38) 100%),
    linear-gradient(180deg, rgba(10, 12, 16, 0.34) 0%, rgba(10, 12, 16, 0.16) 44%, rgba(10, 12, 16, 0.44) 100%),
    radial-gradient(104% 78% at 6% 8%, rgba(251, 211, 76, 0.13) 0%, transparent 58%);
}
.ll-ct__hero .ll-sec__wrap { position: relative; z-index: 2; }

@media (max-width: 1023.98px) {
  /* Le texte prend toute la largeur : le degrade horizontal ne sert plus. */
  .ll-ct__hero-voile {
    background-image:
      linear-gradient(180deg, rgba(10, 12, 16, 0.72) 0%, rgba(10, 12, 16, 0.62) 44%, rgba(10, 12, 16, 0.8) 100%),
      radial-gradient(120% 70% at 8% 4%, rgba(251, 211, 76, 0.1) 0%, transparent 58%);
  }
}

/* ================================================ PAGE REGLEMENT */
.ll-rg__hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(58px, 7vw, 100px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-rg__hero-voile {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(102% 78% at 4% 6%, rgba(251, 211, 76, 0.13) 0%, transparent 56%),
    radial-gradient(82% 66% at 96% 94%, rgba(232, 134, 42, 0.08) 0%, transparent 60%);
}
.ll-rg__hero .ll-sec__wrap { position: relative; z-index: 1; }

.ll-rg__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.3rem, 5.4vw, 3.9rem);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wp--preset--color--blanc);
}
.ll-rg__accroche { max-width: 62ch; margin: 18px 0 0; color: rgba(255, 255, 255, 0.84); font-size: 1.0625rem; line-height: 1.66; }
.ll-rg__mention { margin: 12px 0 0; color: rgba(255, 255, 255, 0.6); font-size: 0.875rem; }

/* ------------------------------------------------- ENTETE DE SECTION */
.ll-rg__entete {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 26px;
}
.ll-rg__entete .ll-sec__titre { margin-top: 4px; }

/* ----------------------------------------------------------- SOMMAIRE
   Un reglement se consulte par article : le sommaire evite de derouler
   les neuf blocs pour trouver le bon. */
.ll-rg__sommaire { margin-bottom: 26px; }
.ll-rg__sommaire ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}
.ll-rg__sommaire a {
  display: flex;
  align-items: baseline;
  gap: 9px;
  padding: 7px 0;
  color: var(--wp--preset--color--encre);
  font-size: 0.9375rem;
  line-height: 1.4;
  text-decoration: none;
}
.ll-rg__sommaire a:hover { color: var(--wp--preset--color--projecteur-profond); }
.ll-rg__som-num { color: var(--wp--preset--color--projecteur-profond); font-weight: 700; font-size: 0.8125rem; font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------- ARTICLES */
.ll-rg__articles { display: grid; gap: 10px; }

.ll-rg__article {
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 20px 44px -30px rgba(14, 16, 20, 0.36);
  overflow: hidden;
}

.ll-rg__summary {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  cursor: pointer;
  list-style: none;
  transition: background var(--ll-transition);
}
/* Le marqueur natif est remplace par notre chevron. */
.ll-rg__summary::-webkit-details-marker { display: none; }
.ll-rg__summary::marker { content: ""; }
.ll-rg__summary:hover { background: var(--wp--preset--color--creme); }
.ll-rg__summary:focus-visible { outline: 2px solid var(--wp--preset--color--projecteur-profond); outline-offset: -2px; }

.ll-rg__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--projecteur);
  font-family: var(--wp--preset--font-family--titres);
  font-size: 0.875rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.ll-rg__art-titre {
  flex: 1;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.3;
}

.ll-rg__chevron { flex: none; display: inline-flex; color: var(--wp--preset--color--graphite); }
.ll-rg__chevron svg { width: 20px; height: 20px; transition: transform var(--ll-transition); }
.ll-rg__article[open] .ll-rg__chevron svg { transform: rotate(180deg); }
.ll-rg__article[open] .ll-rg__summary { background: var(--wp--preset--color--creme); }

.ll-rg__corps {
  padding: 4px 24px 24px;
  border-top: 1px solid var(--wp--preset--color--brume);
  margin-top: -1px;
}
.ll-rg__corps ul,
.ll-rg__corps ol { margin: 16px 0 0; padding: 0 0 0 2px; list-style: none; display: grid; gap: 10px; }
.ll-rg__corps li { position: relative; padding-left: 20px; font-size: 0.9375rem; line-height: 1.66; }
/* Pastille ronde plutot qu une puce : aucun liseré ni glyphe importe. */
.ll-rg__corps li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--wp--preset--color--projecteur);
}
.ll-rg__corps p { margin: 14px 0 0; font-size: 0.9375rem; line-height: 1.7; }
.ll-rg__corps strong { font-weight: 600; }

/* ------------------------------------------------------- ACCEPTATION */
.ll-rg__accept {
  padding-block: clamp(52px, 6.5vw, 90px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-rg__accept-grille { display: flex; gap: clamp(18px, 2.6vw, 30px); align-items: flex-start; }
.ll-rg__accept-picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background-color: rgba(255, 255, 255, 0.05);
}
.ll-rg__accept-picto .ll-picto { width: 26px; height: 26px; }
.ll-rg__accept-titre {
  margin: 0 0 12px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.5rem, 2.8vw, 2.1rem);
  font-weight: 600;
  line-height: 1.16;
  color: var(--wp--preset--color--blanc);
}
.ll-rg__accept-txt { max-width: 62ch; margin: 0 0 12px; color: rgba(255, 255, 255, 0.84); font-size: 1rem; line-height: 1.68; }

@media (prefers-reduced-motion: no-preference) {
  .ll-rg__article { transition: box-shadow 380ms ease; }
  .ll-rg__article[open] { box-shadow: 0 26px 54px -30px rgba(14, 16, 20, 0.44); }
}

@media (max-width: 899.98px) {
  .ll-rg__sommaire ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599.98px) {
  .ll-rg__sommaire ol { grid-template-columns: 1fr; }
  .ll-rg__summary { padding: 16px 16px; gap: 12px; }
  .ll-rg__corps { padding: 4px 16px 20px; }
  .ll-rg__accept-grille { flex-direction: column; }
  .ll-rg__entete .ll-rg__tout { width: 100%; }
}

@media print {
  .ll-rg__article > .ll-rg__corps { display: block !important; }
  .ll-rg__chevron, .ll-rg__tout, .ll-rg__sommaire { display: none; }
}

/* ------------------------------- FOND PHOTO DU HERO REGLEMENT
   Image demandee par le client (bal irlandais, ID 5922, 1920x1186).
   Photo de scene deja sombre (luminance moyenne 0,10) mais traversee de
   faisceaux rouges vifs : le voile est dose PAR LE CALCUL GD (pire pixel
   sous chaque zone de texte), jamais a l oeil. Retenu : le dosage le plus
   LEGER qui garde tout le texte au-dessus de 5 de contraste, pour ne pas
   effacer l image (retour client de la v8).
   Le palier dense doit tenir jusqu a 64 % : a 1024 px le texte occupe
   66 % de la largeur (contre 49 % a 1440), et un degre qui retombait
   des 70 % faisait chuter l accroche a 2,74. Mesure du pire pixel sur
   le fichier reellement charge, aux quatre largeurs :
     1024 -> 10,72 / 9,73 / 5,18 / 6,13 (fichier 1024x633)
     1280 -> 12,56 / 9,65 / 8,29 / 6,04 (fichier 1536x949)
     1440 -> 12,34 / 9,73 / 8,43 / 6,86 (fichier 1536x949)
   soit sur-titre / titre / accroche / mention. Voile a 43 % sur le
   quart droit : l image reste pleinement lisible.
   A RE-MESURER si du contenu est ajoute au hero. */
.ll-rg__hero-fond { position: absolute; inset: 0; z-index: 0; }
.ll-rg__hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 58%;
  display: block;
}
.ll-rg__hero-voile {
  z-index: 1;
  background-image:
    linear-gradient(96deg, rgba(10, 12, 16, 0.84) 0%, rgba(10, 12, 16, 0.76) 40%, rgba(10, 12, 16, 0.6) 64%, rgba(10, 12, 16, 0.3) 80%, rgba(10, 12, 16, 0.18) 100%),
    linear-gradient(180deg, rgba(10, 12, 16, 0.22) 0%, rgba(10, 12, 16, 0.1) 46%, rgba(10, 12, 16, 0.36) 100%),
    radial-gradient(104% 78% at 6% 8%, rgba(251, 211, 76, 0.09) 0%, transparent 58%);
}
.ll-rg__hero .ll-sec__wrap { position: relative; z-index: 2; }

@media (max-width: 1023.98px) {
  /* Le texte occupe toute la largeur ET presque toute la hauteur : le
     degrade horizontal ne sert plus, il faut un voile vertical dense.
     Mesure : 768 px -> 5,65 au pire . 375 px -> 5,88 au pire. */
  .ll-rg__hero-voile {
    background-image:
      linear-gradient(180deg, rgba(10, 12, 16, 0.78) 0%, rgba(10, 12, 16, 0.7) 44%, rgba(10, 12, 16, 0.84) 100%),
      radial-gradient(120% 70% at 8% 4%, rgba(251, 211, 76, 0.09) 0%, transparent 58%);
  }
}

/* ================================== PAGE EVENEMENTS PASSES (324)
   Les 101 affiches SONT le visuel de la page : le hero reste sobre
   (aucune photo de fond, elle leur ferait concurrence) et les cartes
   reprennent .ll-mur__item de l accueil, sans style nouveau.
   Alternance : encre -> creme -> encre. */
.ll-pas__hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(58px, 7vw, 100px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-pas__hero-voile {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(104% 78% at 5% 8%, rgba(251, 211, 76, 0.14) 0%, transparent 58%),
    radial-gradient(86% 66% at 95% 92%, rgba(232, 134, 42, 0.09) 0%, transparent 60%);
}
.ll-pas__hero .ll-sec__wrap { position: relative; z-index: 1; }
.ll-pas__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.3rem, 5.4vw, 3.9rem);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wp--preset--color--blanc);
}
.ll-pas__accroche {
  max-width: 62ch;
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 1.0625rem;
  line-height: 1.66;
}
/* Trois reperes en verre : recette du projet, bordure NEUTRE. */
.ll-pas__reperes {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 26px 0 0;
}
.ll-pas__repere {
  box-sizing: border-box;
  min-width: 150px;
  padding: 14px 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.5);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.04) 38%, transparent 72%);
  backdrop-filter: blur(26px) saturate(164%);
  -webkit-backdrop-filter: blur(26px) saturate(164%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
.ll-pas__repere dt {
  margin: 0;
  color: var(--wp--preset--color--projecteur);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ll-pas__repere dd {
  margin: 4px 0 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--blanc);
  font-variant-numeric: tabular-nums;
}

/* ------------------------------------------------ FILTRES (2 lignes) */
.ll-pas__filtres { display: grid; gap: 12px; margin: 0 0 20px; }
.ll-pas__ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ll-pas__legende {
  flex: none;
  min-width: 54px;
  color: var(--wp--preset--color--graphite);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ll-pas__resultat { margin: 0 0 22px; color: var(--wp--preset--color--graphite); font-size: 0.9375rem; }
.ll-pas__resultat:empty { display: none; }

/* -------------------------------------------------- ANNEES + CARTES */
.ll-pas__annees { display: grid; gap: 38px; }
.ll-pas__annee[hidden] { display: none; }
.ll-pas__annee-titre {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 0 0 14px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--encre);
  font-variant-numeric: tabular-nums;
}
.ll-pas__annee-n {
  color: var(--wp--preset--color--graphite);
  font-family: var(--wp--preset--font-family--corps);
  font-size: 0.8125rem;
  font-weight: 400;
}
/* Sur fond clair la carte a besoin d une ombre, le mur de l accueil
   etant pose sur l encre. */
.ll-mur--archive { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ll-mur--archive .ll-mur__item { box-shadow: 0 18px 38px -28px rgba(14, 16, 20, 0.55); }
.ll-mur--archive .ll-mur__item[hidden] { display: none; }

.ll-pas__vide {
  margin: 26px 0 0;
  padding: 22px;
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  color: var(--wp--preset--color--encre-douce);
  font-size: 0.9375rem;
}
.ll-pas__vide[hidden] { display: none; }

/* ------------------------------------------------------------ SUITE */
.ll-pas__suite {
  padding-block: clamp(52px, 6.5vw, 90px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-pas__suite-grille {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 26px;
}
.ll-pas__suite-titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  font-weight: 600;
  line-height: 1.14;
  color: var(--wp--preset--color--blanc);
}
.ll-pas__suite-txt { max-width: 54ch; margin: 14px 0 0; color: rgba(255, 255, 255, 0.84); font-size: 1rem; line-height: 1.66; }
.ll-pas__suite-actions { display: flex; gap: 12px; flex-wrap: wrap; }

@media (max-width: 1279.98px) { .ll-mur--archive { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1023.98px) { .ll-mur--archive { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 599.98px) {
  .ll-mur--archive { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .ll-pas__repere { flex: 1 1 100%; min-width: 0; }
  .ll-pas__suite-actions .ll-btn { flex: 1 1 100%; }
  .ll-pas__legende { flex: 1 1 100%; }
}

/* ============================== HERO D INTERSAISON (mode transition)
   Remplace le carrousel quand plus aucun spectacle n est a venir.
   Plein viewport, avec la MEME soustraction que le carrousel : l en-tete
   n est pas en superposition sur ce theme, sans le calc() le hero deborde.
   Repli mesure de la variable (100 px desktop / 61 px mobile), le JS qui la
   pose etant en pied de page. */
.ll-trans {
  position: relative;
  display: flex;
  align-items: center;
  min-height: calc(100vh - var(--ll-entete-h, 100px));
  min-height: calc(100svh - var(--ll-entete-h, 100px));
  overflow: hidden;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-trans__fond { position: absolute; inset: 0; z-index: 0; }
.ll-trans__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
  display: block;
}
/* Voile dose PAR LE CALCUL GD sur la photo reelle, en cherchant le dosage le
   plus LEGER qui tienne : minimum 5,54 de contraste pour 37 % de voile a
   droite seulement (contre 66 % au premier jet, au-dela de la limite que le
   client a posee). Mesures : sur-titre 13,33 . titre 11,79 . texte 11,57 .
   date 15,30 . chiffres du compteur 8,93 . libelles 11,19 avant allegement.
   A RE-MESURER si l administrateur change l image de fond. */
.ll-trans__voile {
  position: absolute;
  inset: 0;
  z-index: 1;
  background-image:
    linear-gradient(96deg, rgba(10, 12, 16, 0.74) 0%, rgba(10, 12, 16, 0.62) 38%, rgba(10, 12, 16, 0.32) 66%, rgba(10, 12, 16, 0.14) 100%),
    linear-gradient(180deg, rgba(10, 12, 16, 0.18) 0%, rgba(10, 12, 16, 0.08) 44%, rgba(10, 12, 16, 0.26) 100%),
    radial-gradient(104% 80% at 6% 40%, rgba(251, 211, 76, 0.12) 0%, transparent 58%);
}
.ll-trans__contenu {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-block: clamp(48px, 7vw, 92px);
}

.ll-trans__titre {
  margin: 0;
  max-width: 22ch;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.4rem, 6vw, 4.4rem);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.024em;
  color: var(--wp--preset--color--blanc);
}
.ll-trans__filet {
  display: block;
  width: 72px;
  height: 4px;
  margin: 22px 0 0;
  border-radius: 5px;
  background: var(--wp--preset--color--projecteur);
}
.ll-trans__texte {
  max-width: 58ch;
  margin: 22px 0 0;
  color: rgba(255, 255, 255, 0.88);
  font-size: 1.0625rem;
  line-height: 1.66;
}

/* ---------------------------------------------- COMPTE A REBOURS
   Chaque case est du verre : recette du projet, bordure NEUTRE, jamais de
   liseré colore. Les chiffres sont en chiffres tabulaires, sans quoi la
   largeur des cases sauterait a chaque seconde. */
.ll-trans__compte {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 30px 0 0;
}
.ll-trans__case {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 96px;
  padding: 16px 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.5);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.04) 38%, transparent 72%);
  backdrop-filter: blur(26px) saturate(164%);
  -webkit-backdrop-filter: blur(26px) saturate(164%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 26px 56px -30px rgba(0, 0, 0, 0.8);
}
.ll-trans__n {
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.9rem, 3.4vw, 2.6rem);
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--projecteur);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}
.ll-trans__u {
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.ll-trans__date {
  margin: 22px 0 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: 1rem;
  font-weight: 500;
}
.ll-trans__date--imminente { color: var(--wp--preset--color--projecteur); }
.ll-trans__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 30px 0 0; }

@media (max-width: 1023.98px) {
  /* Le texte occupe toute la largeur : le degrade horizontal ne sert plus. */
  .ll-trans__voile {
    background-image:
      linear-gradient(180deg, rgba(10, 12, 16, 0.72) 0%, rgba(10, 12, 16, 0.62) 44%, rgba(10, 12, 16, 0.8) 100%),
      radial-gradient(120% 72% at 10% 34%, rgba(251, 211, 76, 0.1) 0%, transparent 60%);
  }
}

@media (max-width: 599.98px) {
  .ll-trans__compte { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 24px; }
  .ll-trans__case { min-width: 0; padding: 13px 14px; }
  .ll-trans__actions { margin-top: 24px; }
  .ll-trans__actions .ll-btn { flex: 1 1 100%; }
  /* Le contenu empile depassait le pli de 12 px : le hero doit tenir dans
     le viewport, sinon on apercoit la section suivante sous le compteur.
     Mesure apres : 61 + 751 = 812, exactement la hauteur de l ecran. */
  .ll-trans__contenu { padding-block: 34px; }
  .ll-trans__texte { margin-top: 16px; }
  .ll-trans__date { margin-top: 18px; }
}

@media (prefers-reduced-motion: no-preference) {
  .ll-trans__case { transition: transform 260ms ease; }
}

/* ====================================== PAGE PROGRAMMATION (archive)
   Meme grammaire que les autres pages : hero, pastilles de filtre,
   cartes-affiches, bandeau de sortie. Alternance encre -> creme -> encre.
   Hero SANS photo : les affiches sont le visuel de la page, une image de
   fond leur ferait concurrence. Meme choix que la page des passes. */
.ll-prog__hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(58px, 7vw, 100px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-prog__hero-voile {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(104% 78% at 5% 8%, rgba(251, 211, 76, 0.15) 0%, transparent 58%),
    radial-gradient(86% 66% at 95% 92%, rgba(232, 134, 42, 0.09) 0%, transparent 60%);
}
.ll-prog__hero .ll-sec__wrap { position: relative; z-index: 1; }
.ll-prog__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2.3rem, 5.4vw, 3.9rem);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.022em;
  color: var(--wp--preset--color--blanc);
}
.ll-prog__accroche {
  max-width: 60ch;
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 1.0625rem;
  line-height: 1.66;
}
/* Trois reperes en verre : recette du projet, bordure NEUTRE. */
.ll-prog__reperes { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 0; }
.ll-prog__repere {
  box-sizing: border-box;
  min-width: 150px;
  padding: 14px 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.5);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.04) 38%, transparent 72%);
  backdrop-filter: blur(26px) saturate(164%);
  -webkit-backdrop-filter: blur(26px) saturate(164%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
.ll-prog__repere dt {
  margin: 0;
  color: var(--wp--preset--color--projecteur);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ll-prog__repere dd {
  margin: 4px 0 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--blanc);
  font-variant-numeric: tabular-nums;
}
/* La date est du texte, pas un nombre : elle ne peut pas tenir la meme
   taille sans deborder de la case. */
.ll-prog__repere--date dd { font-size: 1.125rem; padding-top: 5px; }

.ll-prog__filtres { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 20px; }
.ll-prog__corps .ll-pas__resultat { margin: 0 0 22px; }

/* ------------------------------------------------------- ARCHIVES */
.ll-prog__archives {
  padding-block: clamp(52px, 6.5vw, 90px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-prog__archives-grille {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 26px;
}
.ll-prog__archives-titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  font-weight: 600;
  line-height: 1.14;
  color: var(--wp--preset--color--blanc);
}
.ll-prog__archives-txt {
  max-width: 54ch;
  margin: 14px 0 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: 1rem;
  line-height: 1.66;
}

@media (max-width: 599.98px) {
  .ll-prog__repere { flex: 1 1 100%; min-width: 0; }
  .ll-prog__archives-grille .ll-btn { flex: 1 1 100%; }
}

/* ============================== PAGE ARTS MC ET LE PROJET CULTUREL
   Verre, voiles, chevauchements, degrade clippe, micro-interactions.
   ECARTES avec l accord du client : style retro et 3D d element.
   La "nature" passe par le contenu (parc boise, H.Q.E.), pas par une
   couleur verte qui casserait la charte.
   Alternance : encre -> creme -> blanc -> creme -> blanc -> encre. */
.ll-amc__hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(58px, 7vw, 104px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-amc__hero-voile {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(104% 78% at 4% 10%, rgba(251, 211, 76, 0.16) 0%, transparent 58%),
    radial-gradient(80% 70% at 96% 90%, rgba(232, 134, 42, 0.1) 0%, transparent 60%);
}
.ll-amc__hero-grille {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(26px, 4vw, 56px);
  align-items: center;
}
.ll-amc__titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2rem, 4vw, 3.1rem);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -0.02em;
  color: var(--wp--preset--color--blanc);
}
.ll-amc__accroche {
  max-width: 52ch;
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 1.0625rem;
  line-height: 1.66;
}
.ll-amc__reperes { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; }
.ll-amc__repere {
  box-sizing: border-box;
  min-width: 108px;
  padding: 12px 15px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.5);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.04) 38%, transparent 72%);
  backdrop-filter: blur(26px) saturate(164%);
  -webkit-backdrop-filter: blur(26px) saturate(164%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
.ll-amc__repere dt {
  margin: 0;
  color: var(--wp--preset--color--projecteur);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ll-amc__repere dd {
  margin: 4px 0 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--blanc);
  font-variant-numeric: tabular-nums;
}
/* Un libelle long ne peut pas tenir la taille d un nombre sans deborder. */
.ll-amc__repere--long dd { font-size: 1rem; padding-top: 4px; }

/* Le visuel deborde legerement de la colonne : la profondeur vient du
   chevauchement et de l ombre, pas d une transformation 3D. */
.ll-amc__hero-visuel {
  position: relative;
  margin: 0;
  margin-inline-end: clamp(-40px, -2.6vw, 0px);
}
.ll-amc__hero-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 40px 80px -34px rgba(0, 0, 0, 0.9);
}
.ll-amc__legende {
  position: absolute;
  left: -14px;
  bottom: -16px;
  padding: 9px 14px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 5px;
  background-color: rgba(11, 13, 17, 0.88);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.12), transparent 70%);
  backdrop-filter: blur(22px) saturate(160%);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  color: rgba(255, 255, 255, 0.94);
  font-size: 0.8125rem;
  font-weight: 500;
}

/* ------------------------------------------------------------ RECIT */
.ll-amc__recit-grille {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: clamp(26px, 3.4vw, 52px);
  margin-top: 30px;
  align-items: start;
}
.ll-amc__frise { position: relative; margin: 0; padding: 0 0 0 30px; list-style: none; }
.ll-amc__frise::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 10px;
  bottom: 10px;
  width: 2px;
  border-radius: 5px;
  background-image: linear-gradient(180deg, var(--wp--preset--color--projecteur), rgba(251, 211, 76, 0.12));
}
.ll-amc__etape { position: relative; padding-bottom: 26px; }
.ll-amc__etape:last-child { padding-bottom: 0; }
/* Pastille ronde plutot qu un trait lateral : aucun liseré d accent. */
.ll-amc__etape::before {
  content: "";
  position: absolute;
  left: -29px;
  top: 7px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--wp--preset--color--projecteur);
  box-shadow: 0 0 0 5px var(--wp--preset--color--creme);
}
.ll-amc__annee {
  display: block;
  color: var(--wp--preset--color--projecteur-profond);
  font-family: var(--wp--preset--font-family--titres);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  font-variant-numeric: tabular-nums;
}
.ll-amc__etape-titre {
  margin: 4px 0 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.1875rem;
  font-weight: 600;
  line-height: 1.24;
  color: var(--wp--preset--color--encre);
}
.ll-amc__etape-txt { margin: 7px 0 0; color: var(--wp--preset--color--encre-douce); font-size: 0.9375rem; line-height: 1.7; }

.ll-amc__valeurs {
  padding: 24px;
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 26px 56px -34px rgba(14, 16, 20, 0.5);
}
.ll-amc__valeurs-kicker {
  margin: 0 0 12px;
  color: var(--wp--preset--color--projecteur-profond);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ll-amc__valeurs-txt { margin: 0 0 12px; color: var(--wp--preset--color--encre-douce); font-size: 0.9375rem; line-height: 1.7; }
.ll-amc__valeurs-txt:last-child { margin-bottom: 0; }
.ll-amc__valeurs-txt strong { color: var(--wp--preset--color--encre); font-weight: 600; }

/* ------------------------------------------------------------- LIEU */
.ll-amc__lieu { background: var(--wp--preset--color--blanc); }
.ll-amc__lieu-grille {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(26px, 3.4vw, 52px);
  margin-top: 30px;
  align-items: center;
}
.ll-amc__lieu-txt p { margin: 0 0 14px; color: var(--wp--preset--color--encre-douce); font-size: 1rem; line-height: 1.72; }
.ll-amc__lieu-txt strong { color: var(--wp--preset--color--encre); font-weight: 600; }
.ll-amc__chiffres {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 26px;
  margin: 26px 0 0;
}
.ll-amc__chiffre { margin: 0; }
/* Degrade clippe AVEC couleur pleine sur le parent : si background-clip
   n est pas supporte, le chiffre reste lisible. */
.ll-amc__chiffre-n {
  margin: 0;
  color: var(--wp--preset--color--projecteur-profond);
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(2rem, 3.4vw, 2.75rem);
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  background-image: linear-gradient(140deg, var(--wp--preset--color--encre) 0%, var(--wp--preset--color--projecteur-profond) 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .ll-amc__chiffre-n { -webkit-text-fill-color: transparent; }
}
.ll-amc__chiffre-lib { margin: 7px 0 0; color: var(--wp--preset--color--graphite); font-size: 0.875rem; line-height: 1.5; }

.ll-amc__lieu-visuel { position: relative; margin: 0; }
.ll-amc__lieu-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 5px;
  box-shadow: 0 36px 72px -34px rgba(14, 16, 20, 0.62);
}

/* ---------------------------------------------------- ORGANISATION */
.ll-amc__intro { max-width: 68ch; margin: 14px 0 0; color: var(--wp--preset--color--encre-douce); font-size: 1rem; line-height: 1.7; }
.ll-amc__coms {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 34px 0 0;
  align-items: stretch;
}
.ll-amc__com {
  padding: 24px;
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 26px 56px -34px rgba(14, 16, 20, 0.5);
}
.ll-amc__com-picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
}
.ll-amc__com-picto .ll-picto { width: 23px; height: 23px; display: block; }
.ll-amc__com-titre {
  margin: 14px 0 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.26;
  color: var(--wp--preset--color--encre);
}
.ll-amc__com-chapo { margin: 5px 0 0; color: var(--wp--preset--color--projecteur-profond); font-size: 0.8125rem; font-weight: 700; }
.ll-amc__com-txt { margin: 10px 0 0; color: var(--wp--preset--color--encre-douce); font-size: 0.9375rem; line-height: 1.66; }

.ll-amc__benevoles {
  display: grid;
  grid-template-columns: 0.42fr 0.58fr;
  gap: clamp(24px, 3vw, 46px);
  align-items: center;
  margin: 46px 0 0;
  padding: clamp(24px, 3vw, 38px);
  border-radius: 5px;
  background: var(--wp--preset--color--blanc);
  box-shadow: 0 30px 64px -38px rgba(14, 16, 20, 0.5);
}
.ll-amc__benevoles-n {
  margin: 0;
  color: var(--wp--preset--color--projecteur-profond);
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(3rem, 6vw, 4.6rem);
  font-weight: 700;
  line-height: 0.94;
  background-image: linear-gradient(140deg, var(--wp--preset--color--encre) 0%, var(--wp--preset--color--projecteur-profond) 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .ll-amc__benevoles-n { -webkit-text-fill-color: transparent; }
}
.ll-amc__benevoles-lib { margin: 10px 0 0; color: var(--wp--preset--color--encre-douce); font-size: 1rem; line-height: 1.6; }
.ll-amc__missions { margin: 0; padding: 0; list-style: none; display: grid; gap: 11px; }
.ll-amc__missions li { position: relative; padding-left: 22px; color: var(--wp--preset--color--encre-douce); font-size: 0.9375rem; line-height: 1.6; }
.ll-amc__missions li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--wp--preset--color--projecteur);
}

/* ---------------------------------------------------- PROGRAMMATION */
.ll-amc__prog { background: var(--wp--preset--color--blanc); }
.ll-amc__types {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin: 32px 0 0;
}
.ll-amc__type {
  padding: 22px;
  border-radius: 5px;
  background: var(--wp--preset--color--creme);
}
.ll-amc__type-picto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
}
.ll-amc__type-picto .ll-picto { width: 22px; height: 22px; display: block; }
.ll-amc__type-titre {
  margin: 13px 0 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.26;
  color: var(--wp--preset--color--encre);
}
.ll-amc__type-txt { margin: 7px 0 0; color: var(--wp--preset--color--encre-douce); font-size: 0.875rem; line-height: 1.6; }

.ll-amc__temps { margin: 46px 0 0; }
.ll-amc__temps-titre {
  margin: 0 0 18px;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.375rem;
  font-weight: 600;
  color: var(--wp--preset--color--encre);
}
.ll-amc__temps-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ll-amc__temps-carte {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 22px;
  border-radius: 5px;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.08), transparent 62%);
}
.ll-amc__temps-picto {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.ll-amc__temps-picto .ll-picto { width: 22px; height: 22px; display: block; }
.ll-amc__temps-nom {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--wp--preset--color--blanc);
}
.ll-amc__temps-txt { margin: 6px 0 0; color: rgba(255, 255, 255, 0.86); font-size: 0.9375rem; line-height: 1.6; }

/* ----------------------------------------------------------- SORTIE */
.ll-amc__fin {
  padding-block: clamp(52px, 6.5vw, 90px);
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc);
}
.ll-amc__fin-grille {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 26px;
}
.ll-amc__fin-titre {
  margin: 0;
  font-family: var(--wp--preset--font-family--titres);
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  font-weight: 600;
  line-height: 1.14;
  color: var(--wp--preset--color--blanc);
}
.ll-amc__fin-txt { max-width: 54ch; margin: 14px 0 0; color: rgba(255, 255, 255, 0.84); font-size: 1rem; line-height: 1.66; }
.ll-amc__fin-actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ------------------------------------------------------- RESPONSIVE */
@media (max-width: 1023.98px) {
  .ll-amc__hero-grille,
  .ll-amc__recit-grille,
  .ll-amc__lieu-grille,
  .ll-amc__benevoles { grid-template-columns: minmax(0, 1fr); }
  .ll-amc__hero-visuel { margin-inline-end: 0; order: -1; }
  .ll-amc__coms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ll-amc__types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .ll-amc__chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ll-amc__temps-grille { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 599.98px) {
  .ll-amc__coms,
  .ll-amc__types { grid-template-columns: minmax(0, 1fr); }
  .ll-amc__repere { flex: 1 1 100%; min-width: 0; }
  .ll-amc__legende { left: 0; bottom: -12px; }
  .ll-amc__fin-actions .ll-btn { flex: 1 1 100%; }
}

/* --------------------------------------------------------- MOUVEMENT
   Tout est enferme ici : hors de cette requete, aucune regle d opacite
   n existe et le contenu est visible par defaut. */
@media (prefers-reduced-motion: no-preference) {
  .ll-amc__com,
  .ll-amc__type,
  .ll-amc__temps-carte,
  .ll-amc__hero-img { transition: transform 340ms ease, box-shadow 340ms ease; }
  .ll-amc__com:hover { transform: translateY(-6px); }
  .ll-amc__type:hover,
  .ll-amc__temps-carte:hover { transform: translateY(-5px); }

  @supports (animation-timeline: view()) {
    .ll-amc__etape,
    .ll-amc__chiffre,
    .ll-amc__com,
    .ll-amc__type,
    .ll-amc__temps-carte {
      animation: llMonte linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 40%;
    }
  }
}

/* h1 de page : present pour le SEO et les lecteurs d ecran, discret a l ecran. */
.ll-hera__titre-page {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* Mention des dates scolaires dans le slider (public Tout public et scolaire). */
.ll-hera__scolaire {
  flex-basis: 100%;
  margin: 8px 0 0;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wp--preset--color--projecteur);
}

/* --------------------------------------------- FILTRES DE LA SAISON
   Pastilles de genre sur l accueil : vrais liens GET (?genre= + #saison),
   filtrage serveur, le script ne fait qu eviter le rechargement. */

#saison { scroll-margin-block-start: calc(var(--ll-entete-h, 100px) + 32px); }

.ll-saison__filtres {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-block: 4px 26px;
}

.ll-affiches__item { min-width: 0; }

.ll-saison__vide { margin-block-start: 18px; }

/* Une seule formule : elle prend toute la largeur. La grille reste a deux
   colonnes si une seconde revient un jour. Regle client : aucun vide dans
   une composition. */
.ll-formule:only-child { grid-column: 1 / -1; }

/* ----------------------------------------------------------------- MODALE
   PIEGE : UNE SEULE max-height, portee par le dialog. La barre d actions
   est COLLANTE et le corps seul defile, sinon le bouton de fermeture passe
   sous la ligne de flottaison des que le contenu depasse.
   min-height: 0 sur le corps : sans lui, un enfant flex ne defile jamais.
   display: flex UNIQUEMENT sur [open], sinon le dialog ferme redevient
   visible en ecrasant le display:none du navigateur. */
.ll-modale { width: min(920px, calc(100vw - 32px)); max-height: min(86vh, 860px); padding: 0; border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 5px; background: var(--wp--preset--color--blanc); color: var(--wp--preset--color--encre); overflow: clip; }
.ll-modale[open] { display: flex; flex-direction: column; }
.ll-modale::backdrop { background: rgba(8, 10, 14, 0.62); }
.ll-modale__barre { position: sticky; top: 0; z-index: 2; flex: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: var(--wp--preset--color--blanc); }
.ll-modale__titre { margin: 0; font-size: 1.25rem; }
.ll-modale__fermer { display: inline-flex; padding: 8px; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 5px; background: none; color: inherit; cursor: pointer; }
.ll-modale__fermer svg { width: 20px; height: 20px; }
.ll-modale__fermer:hover { background: var(--wp--preset--color--projecteur); }
.ll-modale__corps { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 22px; }
.ll-canaux--modale { display: grid; grid-template-columns: 1fr; gap: 18px; }
@media (min-width: 782px) { .ll-canaux--modale { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ll-canaux--modale > :first-child { grid-row: span 2; } }

/* Modale "Devenir partenaire" : elle porte un formulaire, pas trois canaux.
   Plus etroite que la modale billetterie, sinon les champs s etirent sur
   900 px et la ligne de saisie devient illisible. */
.ll-modale--part { width: min(600px, calc(100vw - 32px)); }
.ll-modale__sus { margin: 0 0 2px; font-family: var(--wp--preset--font-family--corps); font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--projecteur-profond); }
.ll-part__form-intro { margin: 0 0 18px; color: var(--wp--preset--color--graphite); font-size: 0.9375rem; line-height: 1.6; }
.ll-form--part textarea { min-height: 96px; }
.ll-form--part .ll-form__rgpd { margin-bottom: 18px; }
.ll-form__pied { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding-top: 16px; border-top: 1px solid rgba(0, 0, 0, 0.1); }
.ll-form__pied .ll-form__mention { margin: 0; }
@media (max-width: 600px) { .ll-form__pied { display: block; } .ll-form__pied .ll-form__mention { margin-top: 10px; } }