/*
 * Réglages de mise en page des blocs (PLN 2, commun à tous les sites).
 * Le rendu pose des classes sur l'élément racine du bloc (Pln2\Content\BlockLayout), jamais de style en ligne.
 * Les valeurs sont des variables : chaque thème peut redéfinir son échelle dans sa propre feuille, chargée après.
 * Sans réglage, aucune classe : le bloc garde exactement le rendu du thème.
 */
:root {
  --pln-space-none: 0px;
  --pln-space-s: 1rem;
  --pln-space-m: 2rem;
  --pln-space-l: 3rem;
  --pln-space-xl: 6rem;
  --pln-w-narrow: 46rem;
  --pln-w-wide: 80rem;
  --pln-bg-light: #f3f5f7;
  --pln-on-light: inherit;
  --pln-bg-theme: #e7eefc;
  --pln-on-theme: inherit;
  --pln-bg-dark: #1f2933;
  --pln-on-dark: #ffffff;
  --pln-bg-pad-x: clamp(1rem, 3vw, 2rem);
  --pln-bg-radius: 0px;
}
@media (max-width: 767.98px) {
  :root { --pln-space-l: 2.25rem; --pln-space-xl: 3.5rem; }
}

/* Espace au-dessus, en dessous (écart avec les blocs voisins) et espace intérieur (air autour du contenu,
   à l'intérieur du fond). Double classe + !important : l'emporte sur les utilitaires du thème (py-5…). */
.pln-l.pln-l-mt-none{margin-top:var(--pln-space-none)!important}
.pln-l.pln-l-mb-none{margin-bottom:var(--pln-space-none)!important}
.pln-l.pln-l-pad-none{padding-top:var(--pln-space-none)!important;padding-bottom:var(--pln-space-none)!important}
.pln-l-bg.pln-l-pad-none{padding-inline:max(var(--pln-space-none),var(--pln-bg-pad-x))!important}
.pln-l.pln-l-mt-s{margin-top:var(--pln-space-s)!important}
.pln-l.pln-l-mb-s{margin-bottom:var(--pln-space-s)!important}
.pln-l.pln-l-pad-s{padding-top:var(--pln-space-s)!important;padding-bottom:var(--pln-space-s)!important}
.pln-l-bg.pln-l-pad-s{padding-inline:max(var(--pln-space-s),var(--pln-bg-pad-x))!important}
.pln-l.pln-l-mt-m{margin-top:var(--pln-space-m)!important}
.pln-l.pln-l-mb-m{margin-bottom:var(--pln-space-m)!important}
.pln-l.pln-l-pad-m{padding-top:var(--pln-space-m)!important;padding-bottom:var(--pln-space-m)!important}
.pln-l-bg.pln-l-pad-m{padding-inline:max(var(--pln-space-m),var(--pln-bg-pad-x))!important}
.pln-l.pln-l-mt-l{margin-top:var(--pln-space-l)!important}
.pln-l.pln-l-mb-l{margin-bottom:var(--pln-space-l)!important}
.pln-l.pln-l-pad-l{padding-top:var(--pln-space-l)!important;padding-bottom:var(--pln-space-l)!important}
.pln-l-bg.pln-l-pad-l{padding-inline:max(var(--pln-space-l),var(--pln-bg-pad-x))!important}
.pln-l.pln-l-mt-xl{margin-top:var(--pln-space-xl)!important}
.pln-l.pln-l-mb-xl{margin-bottom:var(--pln-space-xl)!important}
.pln-l.pln-l-pad-xl{padding-top:var(--pln-space-xl)!important;padding-bottom:var(--pln-space-xl)!important}
.pln-l-bg.pln-l-pad-xl{padding-inline:max(var(--pln-space-xl),var(--pln-bg-pad-x))!important}
/* Sans fond ni espace intérieur réglé, « espace au-dessus » décide seul de l'écart : l'espace propre au thème
   de ce côté est retiré (sinon « Aucun » ne rapprocherait rien sur un thème qui espace ses blocs par l'intérieur). */
.pln-l[class*="pln-l-mt-"]:not(.pln-l-bg):not([class*="pln-l-pad-"]) { padding-top: 0 !important; }
.pln-l[class*="pln-l-mb-"]:not(.pln-l-bg):not([class*="pln-l-pad-"]) { padding-bottom: 0 !important; }

/* Largeur : étroite, large, pleine largeur (normale = rendu du thème, aucune classe). */
.pln-l[class*="pln-l-w-"] { box-sizing: border-box; }
.pln-l.pln-l-w-narrow { max-width: var(--pln-w-narrow); margin-inline: auto; }
.pln-l.pln-l-w-wide {
  --pln-w-now: min(var(--pln-w-wide), 100vw - 2rem);
  width: var(--pln-w-now); max-width: none;
  margin-inline: calc(50% - var(--pln-w-now) / 2);
}
.pln-l.pln-l-w-full { width: 100vw; max-width: none; margin-inline: calc(50% - 50vw); }
body:has(.pln-l-w-full, .pln-l-w-wide) { overflow-x: clip; }

/* Alignement du contenu : textes, titres, boutons, images et vidéos. */
.pln-l.pln-l-a-left { text-align: left; }
.pln-l.pln-l-a-center { text-align: center; }
.pln-l.pln-l-a-right { text-align: right; }
.pln-l[class*="pln-l-a-"] :is(.text-start, .text-center, .text-end, h1, h2, h3, h4, p, figcaption) { text-align: inherit !important; }
.pln-l-a-left :is(figure, .b-video__frame, .pln-video, .pln-img), .pln-l-a-left:is(figure) { margin-left: 0 !important; margin-right: auto !important; }
.pln-l-a-center :is(figure, .b-video__frame, .pln-video, .pln-img), .pln-l-a-center:is(figure) { margin-left: auto !important; margin-right: auto !important; }
.pln-l-a-right :is(figure, .b-video__frame, .pln-video, .pln-img), .pln-l-a-right:is(figure) { margin-left: auto !important; margin-right: 0 !important; }
.pln-l-a-left .justify-content-center { justify-content: flex-start !important; }
.pln-l-a-right .justify-content-center { justify-content: flex-end !important; }
.pln-l-a-left .mx-auto:not(figure) { margin-left: 0 !important; }
.pln-l-a-right .mx-auto:not(figure) { margin-right: 0 !important; }

/* Fond : clair, couleur du thème, sombre. Un peu d'air par défaut pour que le texte ne touche pas le bord. */
.pln-l-bg { padding-inline: var(--pln-bg-pad-x); padding-block: var(--pln-space-m); border-radius: var(--pln-bg-radius); }
.pln-l-bg-light { background: var(--pln-bg-light); color: var(--pln-on-light); }
.pln-l-bg-theme { background: var(--pln-bg-theme); color: var(--pln-on-theme); }
.pln-l-bg-dark { background: var(--pln-bg-dark); color: var(--pln-on-dark); }
.pln-l-bg-dark :is(h1, h2, h3, h4, h5, h6, p, li, summary, figcaption, .text-muted, .text-body) { color: inherit !important; }
.pln-l-bg-dark a:not(.btn) { color: inherit; text-decoration: underline; }

/* ---------- Réglages propres à certains blocs (gabarits du cœur ; un thème reprend les mêmes classes) ---------- */

/* Image et texte : image au-dessus, taille de l'image, alignement vertical, ordre sur mobile. */
.b-image-text.b-image-text--top { grid-template-columns: 1fr; }
.b-image-text--top .b-image-text__media { order: 0; }
@media (min-width: 760px) {
  .b-image-text--third:not(.b-image-text--top) { grid-template-columns: 1fr 2fr; }
  .b-image-text--third.b-image-text--right { grid-template-columns: 2fr 1fr; }
  .b-image-text--two_thirds:not(.b-image-text--top) { grid-template-columns: 2fr 1fr; }
  .b-image-text--two_thirds.b-image-text--right { grid-template-columns: 1fr 2fr; }
}
.b-image-text.b-image-text--v-top { align-items: start; }
.b-image-text.b-image-text--v-bottom { align-items: end; }
@media (max-width: 759.98px) {
  .b-image-text--text_first .b-image-text__media { order: 2; }
}

/* Vidéo : proportion (16:9 par défaut, 4:3, carré, vertical). */
.pln-ratio-4x3 { aspect-ratio: 4 / 3 !important; --bs-aspect-ratio: 75%; }
.pln-ratio-1x1 { aspect-ratio: 1 / 1 !important; --bs-aspect-ratio: 100%; }
.pln-ratio-9x16 { aspect-ratio: 9 / 16 !important; --bs-aspect-ratio: 177.78%; max-width: 420px; margin-inline: auto; }

/* Galerie : nombre de colonnes imposé ; images entières (sans recadrage). */
.b-gallery--cols-2 .b-gallery__list { grid-template-columns: repeat(2, 1fr); }
.b-gallery--cols-3 .b-gallery__list { grid-template-columns: repeat(3, 1fr); }
.b-gallery--cols-4 .b-gallery__list { grid-template-columns: repeat(4, 1fr); }
.b-gallery--cols-6 .b-gallery__list { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 575.98px) {
  .b-gallery[class*="b-gallery--cols-"] .b-gallery__list { grid-template-columns: repeat(2, 1fr); }
}
.b-gallery--natural img { height: auto !important; object-fit: contain !important; }

/* Texte : paragraphes serrés (comme l'ancien éditeur de blocs : pas d'espace entre paragraphes, lignes vides explicites). */
.rich--tight { display: flow-root; }
.rich--tight p { margin: 0; }
/* Image et texte : espace entre l'image et le texte, taille de l'image dans sa colonne (centrée). */
.b-image-text.b-image-text--gap-tight { gap: 1rem; }
.b-image-text.b-image-text--gap-none { gap: 0; }
:root { --pln-img-l: 30rem; --pln-img-m: 21.5rem; --pln-img-s: 15rem; }
.b-image-text--img-l .b-image-text__media img { max-width: var(--pln-img-l); margin-inline: auto; display: block; }
.b-image-text--img-m .b-image-text__media img { max-width: var(--pln-img-m); margin-inline: auto; display: block; }
.b-image-text--img-s .b-image-text__media img { max-width: var(--pln-img-s); margin-inline: auto; display: block; }

/* Cartes : vignettes toutes au même format (recadrées), cartes par ligne, lien sur toute la carte,
   et au téléphone une petite vignette carrée à gauche du texte (compact). */
.b-cards[class*="b-cards--r-"] .b-cards__media img { width: 100%; height: auto !important; object-fit: cover; display: block; }
.b-cards--r-3x2 .b-cards__media img { aspect-ratio: 3 / 2; }
.b-cards--r-4x3 .b-cards__media img { aspect-ratio: 4 / 3; }
.b-cards--r-16x9 .b-cards__media img { aspect-ratio: 16 / 9; }
.b-cards--r-1x1 .b-cards__media img { aspect-ratio: 1 / 1; }
.b-cards[class*="b-cards--cols-"] .b-cards__list { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 768px) {
  .b-cards--cols-2 .b-cards__list { grid-template-columns: repeat(2, 1fr); }
  .b-cards--cols-3 .b-cards__list { grid-template-columns: repeat(3, 1fr); }
  .b-cards--cols-4 .b-cards__list { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) { .b-cards--cols-4 .b-cards__list { grid-template-columns: repeat(4, 1fr); } }
.b-cards__item--link { position: relative; }
.b-cards__link { display: inline-block; margin-top: .75rem; font-weight: 600; }
a.b-cards__link::before { content: ""; position: absolute; inset: 0; }
@media (max-width: 575.98px) {
  .b-cards--m-compact .b-cards__item { display: grid; grid-template-columns: 5.5rem 1fr; gap: 1rem; align-items: start; text-align: left; }
  .b-cards--m-compact.pln-l-bg { padding-inline: var(--pln-bg-pad-x) !important; }
  .b-cards--m-compact .b-cards__media img { aspect-ratio: 1 / 1 !important; height: auto !important; width: 100%; object-fit: cover; }
}

/* Texte : chapeau (accroche en tête de page), plus grand ; chaque thème peut régler la taille et la couleur. */
:root { --pln-lead-size: 1.2rem; --pln-lead-color: inherit; }
.rich.rich--lead { font-size: var(--pln-lead-size); line-height: 1.6; color: var(--pln-lead-color); }

/* Agrandir au clic, sans script : le lien vise l'image elle-même (:target), fond sombre, croix pour fermer. */
.pln-zoom { display: block; cursor: zoom-in; }
.pln-zoom__close { display: none; }
.pln-zoom:target::before { content: ""; position: fixed; inset: 0; background: rgba(0, 0, 0, .75); z-index: 999999; }
.pln-zoom:target img { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto !important; height: auto !important;
  max-width: 92vw !important; max-height: 92vh; aspect-ratio: auto !important; object-fit: contain; z-index: 1000000; cursor: default; box-shadow: 0 0 30px rgba(0, 0, 0, .5); }
.pln-zoom:target + .pln-zoom__close { display: block; position: fixed; top: 1rem; right: 1.25rem; font-size: 2.25rem; line-height: 1; color: #fff; text-decoration: none; z-index: 1000001; }

/* Carrousel d'images : une image à la fois, défilement à crans (au doigt sans script), flèches et points (blocks.js). */
:root { --pln-carousel-poster: 24rem; --pln-carousel-wide: 60rem; --pln-carousel-accent: currentColor; }
.pln-carousel { position: relative; margin-inline: auto; max-width: var(--pln-carousel-poster); }
.pln-carousel--wide { max-width: var(--pln-carousel-wide); }
.pln-carousel:focus-visible { outline: 3px solid var(--pln-carousel-accent); outline-offset: 4px; }
.pln-carousel__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: 12px; }
.pln-carousel__track::-webkit-scrollbar { display: none; }
.pln-carousel__slide { flex: 0 0 100%; scroll-snap-align: center; }
.pln-carousel__slide img { display: block; width: 100%; height: auto; }
.pln-carousel--wide .pln-carousel__slide img { aspect-ratio: 16 / 9; object-fit: cover; }
.pln-carousel__prev, .pln-carousel__next { position: absolute; top: 50%; transform: translateY(-50%); width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .92); color: #1f2933; font-size: 1.75rem; line-height: 1; box-shadow: 0 2px 10px rgba(0, 0, 0, .2); cursor: pointer; }
.pln-carousel__prev { left: -1.1rem; } .pln-carousel__next { right: -1.1rem; }
.pln-carousel__prev:active, .pln-carousel__next:active { transform: translateY(-50%) scale(.95); }
.pln-carousel__dots { display: flex; justify-content: center; gap: .5rem; margin-top: .9rem; }
.pln-carousel__dot { width: .75rem; height: .75rem; padding: 0; border: 2px solid var(--pln-carousel-accent); border-radius: 50%; background: transparent; cursor: pointer; }
.pln-carousel__dot[aria-current="true"] { background: var(--pln-carousel-accent); }
@media (max-width: 575.98px) { .pln-carousel__prev { left: .35rem; } .pln-carousel__next { right: .35rem; } }

/* Dates (calendrier) : semaines regroupées par période, état du jour ; semaines passées estompées ; empilé au téléphone. */
.pln-dates { width: 100%; border-collapse: separate; border-spacing: 0; }
.pln-dates :is(th, td) { padding: .7rem .9rem; text-align: left; vertical-align: middle; border-bottom: 1px solid rgba(0, 0, 0, .08); }
.pln-dates thead th { font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; }
.pln-dates__period th { padding-top: 1.2rem; font-size: 1.05rem; border-bottom-width: 2px; }
.pln-dates__week { font-weight: 600; white-space: nowrap; }
.pln-dates__state { text-align: right !important; white-space: nowrap; }
.pln-dates__state span:not(:empty) { display: inline-block; padding: .15rem .6rem; border-radius: 999px; font-size: .8rem; font-weight: 600; background: rgba(0, 0, 0, .06); }
.pln-dates .is-past { opacity: .5; }
.pln-dates .is-past .pln-dates__week { text-decoration: line-through; text-decoration-thickness: 1px; }
.pln-dates .is-next .pln-dates__state span, .pln-dates .is-now .pln-dates__state span { background: var(--pln-carousel-accent); color: #fff; }
@media (max-width: 575.98px) {
  .pln-dates thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .pln-dates__row { display: grid; grid-template-columns: 1fr auto; column-gap: .75rem; padding: .6rem 0; border-bottom: 1px solid rgba(0, 0, 0, .08); }
  .pln-dates__row td { padding: 0; border: 0; }
  .pln-dates__week { white-space: normal; }
  .pln-dates__note { grid-column: 1; grid-row: 2; font-size: .9rem; }
  .pln-dates__state { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .pln-dates__note:empty { display: none; }
}

/* Galerie datée, réglage « Sur téléphone : seulement la période en cours ou à venir » : les autres images sont masquées
   au téléphone ; l'image retenue prend la largeur (sans devenir géante). */
@media (max-width: 640px) {
  .b-gallery--phone-current > :not(.is-current), .b-gallery--phone-current .b-gallery__list > :not(.is-current) { display: none !important; }
  .b-gallery--phone-current > .is-current, .b-gallery--phone-current .b-gallery__list > .is-current { flex: 0 0 100%; width: 100%; max-width: 22rem; margin-inline: auto; }
  .b-gallery--phone-current .b-gallery__list { grid-template-columns: 1fr !important; }
}
/* Dates : semaines passées repliées sur une ligne discrète ; plus aucune date à venir. */
.pln-dates__past { margin-bottom: 1rem; font-size: .9rem; }
.pln-dates__past summary { cursor: pointer; opacity: .7; padding: .4rem 0; }
.pln-dates__past[open] summary { margin-bottom: .5rem; }
.pln-dates--past { opacity: .6; }
.pln-dates__soon { text-align: center; font-size: 1.05rem; padding: 1rem; }
.pln-dates__source { font-size: .85rem; opacity: .7; margin-top: .75rem; }
/* Image et texte : chiffres clés sous l'image. */
.b-image-text__facts { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr)); gap: .75rem; margin: 1rem 0 0; padding: 0; }
.b-image-text__facts li { padding: .75rem; border-radius: 10px; background: var(--pln-bg-light); text-align: center; }
.b-image-text__facts strong { display: block; font-size: 1.5rem; line-height: 1.1; }
.b-image-text__facts span { display: block; font-size: .85rem; }

/* Cartes et colonnes côte à côte : même hauteur, et le bouton (lien de la carte, dernier lien seul d'une colonne)
   toujours en bas, à la même hauteur d'une carte à l'autre, quelle que soit la longueur du texte. */
.b-cards__item { display: flex; flex-direction: column; }
.b-cards__body { display: flex; flex-direction: column; flex: 1 1 auto; }
/* Espace minimal entre la dernière ligne de texte et le bouton poussé en bas (même sur la carte au texte le plus long). */
.b-cards__body > :has(+ .b-cards__link) { margin-bottom: 1.25rem !important; }
.b-cards__link { margin-top: auto !important; align-self: flex-start; }
.b-columns__col, .pln-col { display: flex; flex-direction: column; height: 100%; }
.b-columns__col > .rich, .pln-col > .rich { display: flex; flex-direction: column; flex: 1 1 auto; }
.b-columns__col > .rich > p:last-child:has(> a:only-child), .pln-col > .rich > p:last-child:has(> a:only-child) { margin-top: auto; padding-top: 1.25rem; }