/*
 * sm-2025.css — Surcharges Hugo pour le thème Scènes Mitoyennes
 *
 * Corrections nécessaires après portage WordPress → Hugo :
 *   1. REPLACE_TO_ID : le sélecteur OceanWP ciblait un ID JS dynamique.
 *      On le remplace par .sm-main-nav (classe Hugo statique dans header.html).
 *   2. Ajustements visuels mineurs non couverts par all-styles.css.
 */

/* En-tête : valeurs visuelles utiles de l'ancien widget WordPress. */
#site-header.site-header {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #fff;
  border-bottom: 1px solid #f1f1f1;
  z-index: 998;
}

.site-header__inner {
  position: relative;
  width: 1200px;
  max-width: 90%;
  height: 100%;
  margin: 0 auto;
  transition: all 0.3s ease-in-out;
}

.main-navigation > ul > li > a {
  font-size: 14px;
  line-height: 16px;
}

.main-navigation {
  text-align: center;
}

.main-navigation__list,
.main-navigation__list * {
  margin: 0;
  padding: 0;
  list-style: none;
}

.main-navigation__item {
  display: inline-block;
  position: relative;
  white-space: normal;
}

.main-navigation__link {
  display: block;
  position: relative;
  padding: 8px 15px;
  letter-spacing: 0.6px;
}

.main-navigation__submenu {
  display: none;
  position: absolute;
  visibility: hidden;
  top: 100%;
  left: 0;
  z-index: 9999;
  min-width: 278px;
  background-color: #7a7676;
  border-top: 3px solid #dd3333;
  line-height: 1;
  text-align: left;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.main-navigation__item:hover > .main-navigation__submenu,
.main-navigation__item:focus-within > .main-navigation__submenu {
  display: block;
  visibility: visible;
}

.main-navigation__submenu-item {
  display: block;
  float: none;
  position: relative;
  border-bottom: 1px solid #f1f1f1;
}

.main-navigation__submenu-item:last-child {
  border-bottom: 0;
}

.main-navigation__submenu-link {
  display: block;
  position: relative;
  float: none;
  padding: 12px 15px;
  font-size: 12px;
  line-height: 1.3;
  font-weight: 500;
  letter-spacing: 0.6px;
  text-transform: capitalize;
}

.site-header__bar {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

.site-header__row {
  display: flex;
  align-items: center;
  margin-inline: auto;
  position: relative;
}

.site-header__brand,
.site-header__tools {
  display: flex;
  min-height: 1px;
  position: relative;
}

.site-header__brand-inner,
.site-header__tools-inner {
  align-content: center;
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  width: 100%;
  padding: 10px;
}

.site-header__brand-widget,
.site-header__navigation,
.site-header__social {
  position: relative;
  width: 100%;
}

.site-header__bar {
  background-color: #080808;
  color: var(--e-global-color-primary);
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
}

.site-header__row {
  min-height: 0;
  text-align: end;
}

.site-header__brand-content {
  margin: 0;
  padding: 0 0 0 105px;
}

.site-header__tools-inner {
  text-align: end;
}

#site-header .site-header__tools-inner a,
#site-header .site-header__social a {
  color: #fff;
}

#site-header .site-header__tools-inner a:hover,
#site-header .site-header__social a:hover {
  color: #ce1313;
}

.site-header .site-header__tools-inner > .site-header__navigation {
  width: var(--container-widget-width, 80%);
  max-width: 80%;
  --container-widget-width: 80%;
  --container-widget-flex-grow: 0;
}

.site-header__navigation-inner {
  margin: 0;
}

/* .site-header__social est un enfant direct de .site-header__row (sorti du
   panneau de menu déroulant mobile, voir @media max-width:959px) : taille
   naturelle au contenu plutôt qu'un pourcentage hérité de l'ancienne
   imbrication Elementor, qui rognait la 3e icône. */
.site-header .site-header__row > .site-header__social {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  /* Regagne l'espacement de bord perdu en sortant de .site-header__tools-inner
     (qui avait padding:10px) : sans ça, les icônes touchent le bord droit. */
  padding-right: 1.5rem;
}

.site-header__social-inner {
  margin: 0;
  text-align: right;
  font-size: 0;
  line-height: 1;
}

.social-links {
  display: flex;
  gap: 1rem;
  justify-content: center;
  width: 100%;
}

.social-links__item {
  min-width: 0;
}

.social-links__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border-radius: 10%;
  background-color: transparent;
  color: #fff;
  cursor: pointer;
  font-size: 25px;
  line-height: 25px;
  text-align: center;
  transition: all 0.3s;
}

.social-links__link:hover {
  color: #fff;
  opacity: 0.9;
}

.social-links__link i {
  display: block;
  position: relative;
  width: 1em;
  height: 1em;
  color: #fff;
}

.social-links__link i::before {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.social-links__label {
  clip: rect(0, 0, 0, 0);
  position: absolute;
  top: -10000em;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
}

.site-header__logo-image {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  height: auto;
  max-width: 100%;
  max-height: 45px;
  width: auto;
  vertical-align: middle;
  transition: all 0.3s ease-in-out;
}

.site-header__logo-wrapper {
  text-align: left;
}

.site-header__logo {
  display: inline-block;
}

.site-header__logo-inner {
  display: block;
  height: auto;
  transition: all 0.3s ease-in-out;
}

.site-header__logo-link {
  background-color: transparent !important;
}

.site-header__logo-link:hover .site-header__logo-image {
  opacity: 0.6;
}

@media (max-width: 1024px) {
  .site-header__row {
    flex-wrap: wrap;
  }
}

/* Bouton hamburger : masqué sur desktop, affiché et fonctionnel sous 959px
 * (voir sm-2025.js pour le JS d'ouverture/fermeture). */
.main-navigation__toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  flex: 0 0 auto;
}
.main-navigation__toggle-bar {
  display: block;
  width: 24px;
  height: 2px;
  background: #fff;
  border-radius: 1px;
  transition: transform .2s ease, opacity .2s ease;
}
.site-header--menu-open .main-navigation__toggle-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-header--menu-open .main-navigation__toggle-bar:nth-child(2) { opacity: 0; }
.site-header--menu-open .main-navigation__toggle-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 959px) {
  .site-header__row {
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
  }

  .site-header__brand {
    width: auto;
    flex: 0 0 auto;
  }

  .site-header__brand-content {
    padding-left: 0;
  }

  .site-header__logo-link {
    display: block;
  }

  .site-header__logo-image {
    max-height: 34px;
  }

  .main-navigation__toggle {
    display: flex;
    order: 3;
  }

  /* Sorties du panneau déroulant, les icônes réseaux sociaux restent
     visibles en permanence, juste à côté du bouton hamburger : la marge
     automatique regroupe {social, hamburger} contre le bord droit plutôt
     que de les répartir sur toute la largeur (space-between avec 3
     éléments centrerait sinon les icônes au milieu du header). */
  .site-header .site-header__row > .site-header__social {
    order: 2;
    margin-left: auto;
  }
  .site-header__social-inner {
    margin: 0;
    padding: 0;
    text-align: right;
  }
  .social-links { gap: .65rem; }
  .social-links__link { width: 22px; height: 22px; font-size: 22px; }

  .site-header__tools {
    order: 4;
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: auto;
    flex-direction: column;
    max-height: calc(100vh - 65px);
    overflow-y: auto;
    background: #080808;
    box-shadow: 0 8px 16px rgba(0, 0, 0, .35);
  }

  .site-header--menu-open .site-header__tools {
    display: flex;
  }

  .main-navigation { text-align: left; }
  .main-navigation__item { display: block; }
  .main-navigation__link { padding: 14px 20px; }
  .main-navigation__submenu { min-width: 0; }
}

/* Sur mobile/tablette, un premier tap sur un item de menu avec sous-menu
 * (ex. Programmation) déplie le sous-menu au lieu de naviguer directement
 * (pas de :hover tactile). Un second tap navigue normalement. Voir le JS
 * correspondant dans sm-2025.js. */
@media (max-width: 959px) {
  .main-navigation__item--open > .main-navigation__submenu {
    display: block;
    visibility: visible;
    position: static;
    box-shadow: none;
  }
}

@media (max-width: 767px) {
  .programmation-filtres .elementor-container {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 0.5rem;
    padding: 0 0.25rem;
  }
  .programmation-filtres .elementor-container::-webkit-scrollbar {
    display: none;
  }
  .programmation-filtres .elementor-column.elementor-col-14 {
    width: auto !important;
    flex: 0 0 auto;
  }
  .programmation-filtres .elementor-button {
    white-space: nowrap;
  }
}

@media (min-width: 768px) {
  .site-header .site-header__brand {
    width: 17.665%;
  }

  .site-header .site-header__tools {
    width: 82%;
  }
}

/* Pages éditoriales structurées : remplace les exports Elementor page-dump. */
.page-structuree__hero {
  background: linear-gradient(#666, #151515);
  color: #fff;
  min-height: 116px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-structuree__hero-inner,
.page-structuree__contenu-inner {
  width: min(1140px, calc(100% - 48px));
  margin: 0 auto;
}

.page-structuree__hero h1 {
  color: #fff;
  font-size: 3rem;
  margin: 0;
  text-align: center;
}

.page-structuree__ruban {
  height: 45px;
  background: #ef302b;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-structuree__ruban a {
  color: #fff;
  border: 0;
  border-radius: 2px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  box-shadow: 0 0 10px rgba(0, 0, 0, .5);
}
.page-structuree__ruban--cta { height: 56px; }

.page-structuree__image { margin: 0; line-height: 0; }
.page-structuree__image img { width: 100%; max-height: 350px; object-fit: cover; }

.page-structuree__contenu {
  background: #5b5959;
  color: #fff;
  padding: 52px 0 34px;
}

.page-structuree__contenu a { color: #ed655e; }
.page-structuree__contenu h1,
.page-structuree__contenu h2,
.page-structuree__contenu h3,
.page-structuree__contenu h4,
.page-structuree__contenu h5,
.page-structuree__contenu h6 { color: #e8c77a; }
.page-structuree__contenu img { max-width: 100%; height: auto; }

.page-encart {
  margin: 28px 0;
  padding: 26px 32px;
  border: 1px solid rgba(255, 255, 255, .65);
  background: rgba(0, 0, 0, .12);
}

.page-encart__titre { margin-top: 0; }
.page-encart__contenu > :last-child { margin-bottom: 0; }
.page-encart--offre {
  width: 90%;
  margin: 28px auto;
  padding: 30px 45px;
  border: 7px solid #e7322d;
  background: #2c2c2cad;
  box-shadow: 0 0 10px rgba(0, 0, 0, .5);
}
.page-encart--offre .page-encart__titre {
  color: #d17b7b;
  text-align: center;
  font-size: 30px;
  line-height: 1.3;
  margin-bottom: 22px;
}

.page-grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 20px 0; }
.page-grille--2 { grid-template-columns: repeat(2, 1fr); }
.page-grille--4 { grid-template-columns: repeat(4, 1fr); }
.page-grille--centree .page-carte { text-align: center; }
.page-carte { background: rgba(0, 0, 0, .16); padding: 16px; }
.page-carte > :last-child { margin-bottom: 0; }
.page-separateur { border: 0; border-top: 1px solid rgba(0, 0, 0, .65); margin: 28px 0; }

.page-contact-bloc { max-width: 760px; margin: 0 auto 26px; }
.page-contact-bloc__entete { display: flex; align-items: center; gap: 18px; }
.page-contact-bloc__entete img { display: block; width: 58px; height: 58px; object-fit: contain; }
.page-contact-bloc__entete h2 { margin: 0; }
.page-contact-bloc__contenu { margin-left: 76px; }
.page-grille--contacts { max-width: 980px; margin-inline: auto; gap: 42px; }
.page-contact__lieu { padding: 0; background: transparent; }
.page-contact__lieu h2 { color: #8eafb1; font-size: 2rem; margin-top: 0; }
.page-contact__lieu p { margin-bottom: 1rem; }

@media (max-width: 767px) { .page-grille, .page-grille--2, .page-grille--4 { grid-template-columns: 1fr; } }

@media (max-width: 767px) {
  .page-structuree__hero { min-height: 94px; }
  .page-structuree__hero h1 { font-size: 2.25rem; }
  .page-structuree__ruban { height: 28px; }
  .page-structuree__ruban--cta { height: 56px; }
  .page-structuree__contenu { padding-top: 30px; }
  .page-encart { padding: 20px; }
  .page-contact-bloc__contenu { margin-left: 0; }
}

/* --- 2. Suppression lazy-load BG Elementor (bloc 30/56) --- */
/*
 * Original : .e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded) { background-image: none !important; }
 * Hugo n'utilise pas .e-lazyloaded — on annule la règle pour ne pas masquer les fonds.
 */
.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload),
.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload) * {
  background-image: unset !important;
}

/* Marge supérieure du contenu : compense l'en-tête fixe. */
#main {
  margin-top: 65px;
}
/* Les fiches spectacle de l'ancien site commençaient juste sous le header
 * (65 px), quelle que soit la largeur de l'écran. */
body.spectacle-page #main {
  margin-top: 65px;
}
@media (min-width: 768px) {
  #main {
    margin-top: 75px;
  }

  /* Accueil WordPress : colonne plaquette étroite, actualités majoritaires. */
  .elementor-home > .elementor-section:first-child > .elementor-container > .elementor-column:first-child {
    width: 18.246%;
  }

  .elementor-home > .elementor-section:first-child > .elementor-container > .elementor-column:nth-child(2) {
    width: 81.754%;
  }
}
@media (min-width: 1200px) {
  #main {
    margin-top: 80px;
  }
}

/* Les sous-menus restent au-dessus du contenu. */
#site-header .main-navigation__list {
  overflow: visible;
}
#site-header .site-header__brand-content,
#site-header .site-header__navigation-inner,
#site-header .site-header__social-inner {
  overflow: visible;
}
.main-navigation__submenu {
  z-index: 9999;
}

/* Positionnement du sous-menu par rapport à son entrée parente. */
.main-navigation__item {
  position: relative;
}

/* --- 4. Spectacles terminés (dernière date passée) --- */
/* Grisage de l'affiche + transparence sur la carte programmation */
.spectacle-termine figure img,
.spectacle-termine__couverture {
  opacity: 0.35;
  filter: grayscale(40%);
  transition: opacity 0.3s, filter 0.3s;
}
.spectacle-termine:hover figure img {
  opacity: 0.55;
  filter: grayscale(20%);
}
.spectacle-termine .elementor-image-box-content {
  opacity: 0.65;
}
.spectacle-termine__mention {
  font-size: 0.75em;
  color: #888;
  font-style: italic;
  margin-top: 0.25em;
}

/* Le CSS WordPress de la programmation rendait chaque carte transparente.
 * Seules les représentations réellement passées doivent être grisées. */
.elementor-programmation .programmation-carte .elementor-element.elementor-element-4b6ebdc .elementor-image-box-img img {
  opacity: 1;
  filter: none;
}

.elementor-programmation .programmation-carte.spectacle-termine .elementor-element.elementor-element-4b6ebdc .elementor-image-box-img img {
  opacity: 0.35;
  filter: grayscale(40%);
}

.elementor-programmation .programmation-carte.spectacle-termine .elementor-image-box-content {
  opacity: 0.65;
}

/* --- 5. Indicateur COMPLET sur les cartes de programmation --- */
.elementor-image-box-img.spectacle-complet {
  position: relative;
  overflow: visible;
}
.spectacle-complet__bandeau {
  position: absolute;
  width: 122%;
  bottom: 22px;
  left: 50%;
  box-sizing: border-box;
  transform: translateX(-50%);
  z-index: 1;
  display: block;
  padding: 0.7rem 0.75rem;
  background: #e7322d;
  color: #fff;
  font-family: var(--e-global-typography-primary-font-family, sans-serif);
  font-size: 2.5rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1;
  text-align: center;
}

/* Même effet Elementor que l'ancienne programmation : l'affiche et son cadre
 * débordent légèrement au survol, au-dessus des cartes voisines. */
.elementor-programmation .programmation-carte {
  position: relative;
}

.elementor-programmation .programmation-carte:hover {
  z-index: 2;
}

.elementor-programmation .programmation-carte .elementor-image-box-img {
  overflow: visible;
}

.elementor-programmation .programmation-carte .elementor-image-box-img img {
  display: block;
}

/* Découpage de la saison, comme sur l'ancienne programmation WordPress. */
.elementor-programmation .programmation-partie {
  margin-top: 28px;
  background: #00abbd;
}

.elementor-programmation .programmation-partie__bandeau .elementor-widget-container {
  padding: 4px 18px;
  text-align: center;
}

.elementor-programmation .programmation-partie__bandeau h2 {
  display: block;
  width: 100%;
  margin: 0;
  color: #fff;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center !important;
}

.elementor-programmation .programmation-partie__bandeau span {
  font-weight: 400;
}

/* Une grille mensuelle doit conserver la largeur du conteneur, même lorsqu'un
 * mois ne comporte qu'un ou deux spectacles. */
.elementor-programmation .programmation-mois .elementor-inner-section {
  width: 100%;
}

/* Une ligne de programmation ne présente jamais plus de quatre spectacles. */
.elementor-programmation .programmation-mois .elementor-inner-section > .elementor-container {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.elementor-programmation .programmation-mois .programmation-carte {
  width: auto !important;
}

/* Pictogrammes insérés dans le texte avec le shortcode {{< picto >}}. */
.picto-inline {
  display: inline-block;
  vertical-align: middle;
  object-fit: contain;
}

.shortcode-bouton {
  margin: 1.25rem 0;
  text-align: center;
}

.shortcode-deux-colonnes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

@media (max-width: 767px) {
  .elementor-programmation .programmation-mois .elementor-inner-section > .elementor-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shortcode-deux-colonnes {
    grid-template-columns: 1fr;
  }
}

/* Affiche artiste (figure) — wrapper plein */
.spectacle-affiche {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 1;
  background: #000;
}

.spectacle-affiche img,
.elementor-programmation .spectacle-visuel-artiste img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.elementor-programmation .spectacle-visuel-artiste {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  background: #000;
}

.elementor-programmation .spectacle-visuel-artiste > a {
  display: block;
  width: 100%;
  height: 100%;
}

/* Filtre catégorie programmation */
/* Après le CTA de plaquette, les filtres restent visuellement distincts du ruban. */
.elementor-programmation > .page-structuree__ruban { margin-bottom: 24px; }

.active-filter {
  outline: 3px solid var(--e-global-color-7ae7e1b, #E7322D) !important;
  outline-offset: 2px;
}

.programmation-filtres a.active-filter {
  background-color: var(--e-global-color-7ae7e1b, #E7322D) !important;
  color: #fff !important;
}

/* CGV : reprennent le bandeau beige des intitulés d'articles du site source. */
.cgv-page .elementor-widget-text-editor h2 {
  margin: 2rem 0 1.25rem;
  padding: 0.65rem 1rem;
  background-color: var(--e-global-color-caddbc8, #E9D08D);
  color: #2c2c2c;
  font-size: 1.2rem;
  line-height: 1.35;
}

/* Galerie photos : vignettes cliquables et visionneuse modale. */
.sm-gallery {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 1.5rem 0;
  padding: 0 2.8rem;
}
.sm-gallery__viewport {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
}
.sm-gallery__viewport::-webkit-scrollbar { display: none; }
.sm-gallery__grid {
  display: flex !important;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 0.8rem;
  width: max-content;
  min-width: 100%;
  max-width: none;
}
.sm-gallery__item {
  position: relative;
  display: block;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 2px;
  /* Hauteur explicite plutôt que aspect-ratio (ratio 16/10 équivalent à la
     largeur ci-dessous) : sur cet élément précis (flex + overflow-x:auto),
     aspect-ratio provoque un vrai bug de peinture Firefox, la vignette
     restant parfois invisible au premier chargement (aucune récurrence
     observée sur 18 rechargements après ce changement, contre ~50% avec
     aspect-ratio). Garder les deux valeurs synchronisées si la largeur
     change. */
  height: clamp(81px, 9.375vw, 119px);
  cursor: zoom-in;
  background: #151515;
  flex: 0 0 clamp(130px, 15vw, 190px);
  scroll-snap-align: start;
}
.sm-gallery--compact .sm-gallery__item {
  flex-basis: clamp(105px, 12vw, 160px);
  height: clamp(66px, 7.5vw, 100px);
}
.sm-gallery__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 220ms ease, opacity 220ms ease;
}
.sm-gallery__item:hover img,
.sm-gallery__item:focus-visible img {
  opacity: .82;
  transform: scale(1.06);
}
.sm-gallery__item:focus-visible {
  outline: 3px solid #e7322d;
  outline-offset: 3px;
}
.sm-gallery__nav {
  position: absolute;
  z-index: 2;
  top: 50%;
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  padding: 0;
  place-items: center;
  color: #fff;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  background: rgba(0, 0, 0, .68);
  box-shadow: 0 1px 7px rgba(0, 0, 0, .45);
  transform: translateY(-50%);
  transition: background 160ms ease, opacity 160ms ease;
}
.sm-gallery__nav:hover { background: #e7322d; }
.sm-gallery__nav:focus-visible { outline: 3px solid #e7322d; outline-offset: 3px; }
.sm-gallery__nav:disabled { cursor: default; opacity: .35; }
.sm-gallery__nav--previous { left: 0; }
.sm-gallery__nav--next { right: 0; }
.sm-gallery__zoom {
  position: absolute;
  right: .55rem;
  bottom: .55rem;
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  color: #fff;
  border-radius: 50%;
  background: rgba(0, 0, 0, .58);
  opacity: 0;
  transform: translateY(.35rem);
  transition: opacity 180ms ease, transform 180ms ease;
}
.sm-gallery__item:hover .sm-gallery__zoom,
.sm-gallery__item:focus-visible .sm-gallery__zoom {
  opacity: 1;
  transform: none;
}
.sm-gallery-lightbox {
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 3.5rem 4.5rem;
  background: rgba(7, 7, 7, .94);
}
.sm-gallery-lightbox.is-open { display: flex; }
.sm-gallery-lightbox__dialog {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 1400px);
  max-height: 100%;
}
.sm-gallery-lightbox__figure { margin: 0; text-align: center; }
.sm-gallery-lightbox__figure img {
  display: block;
  max-width: min(100%, 1400px);
  max-height: calc(100vh - 8rem);
  margin: auto;
  object-fit: contain;
}
.sm-gallery-lightbox__figure figcaption {
  margin-top: .6rem;
  color: #fff;
  font-size: .9rem;
}
.sm-gallery-lightbox button {
  border: 0;
  color: #fff;
  cursor: pointer;
  background: rgba(0, 0, 0, .5);
}
.sm-gallery-lightbox button:focus-visible { outline: 3px solid #e7322d; outline-offset: 3px; }
.sm-gallery-lightbox__close {
  position: absolute;
  z-index: 1;
  top: -2.6rem;
  right: 0;
  width: 2.25rem;
  height: 2.25rem;
  font-size: 2rem;
  line-height: 1;
}
.sm-gallery-lightbox__previous,
.sm-gallery-lightbox__next {
  position: absolute;
  top: calc(50% - 1.5rem);
  width: 3rem;
  height: 3rem;
  font-size: 1.25rem;
}
.sm-gallery-lightbox__previous { left: -4rem; }
.sm-gallery-lightbox__next { right: -4rem; }
@media (max-width: 767px) {
  .sm-gallery { padding: 0 2.25rem; }
  .sm-gallery__item { flex-basis: 42vw; }
  .sm-gallery--compact .sm-gallery__item { flex-basis: 35vw; }
  .sm-gallery__nav { width: 2rem; height: 2rem; }
  .sm-gallery-lightbox { padding: 3rem 1rem 4.5rem; }
  .sm-gallery-lightbox__figure img { max-height: calc(100vh - 8rem); }
  .sm-gallery-lightbox__previous { left: .25rem; }
  .sm-gallery-lightbox__next { right: .25rem; }
  .sm-gallery-lightbox__previous,
  .sm-gallery-lightbox__next { background: rgba(0, 0, 0, .68); }
}

/* Lightbox vidéo */
#sm-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,0.85);
  align-items: center;
  justify-content: center;
}
#sm-lightbox.is-open {
  display: flex;
}
#sm-lightbox__inner {
  position: relative;
  width: min(90vw, calc((100vh - 5rem) * 16 / 9), 1100px);
  aspect-ratio: 16/9;
  background: #000;
}
#sm-lightbox__inner iframe,
#sm-lightbox__inner video {
  width: 100%;
  height: 100%;
  border: none;
}
#sm-lightbox__inner video {
  display: none;
  object-fit: contain;
}
#sm-lightbox.sm-lightbox--video iframe {
  display: none;
}
#sm-lightbox.sm-lightbox--video video {
  display: block;
}
#sm-lightbox__close {
  position: absolute;
  z-index: 1;
  top: -2rem;
  right: 0;
  color: #fff;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
}

#sm-lightbox__external-link {
  position: absolute;
  right: 0;
  bottom: -2rem;
  color: #fff;
  font-size: 0.9rem;
  text-decoration: underline;
}

#sm-lightbox__external-link:not([href]) {
  display: none;
}

/* Citations presse */
.spectacle-presse {
  margin-top: 1.5rem;
}
.spectacle-presse__citation {
  border-left: 3px solid #c0392b;
  padding: 0.4rem 0.8rem;
  margin: 0.8rem 0;
  font-style: italic;
}
.spectacle-presse__citation p {
  margin: 0 0 0.2rem;
}
.spectacle-presse__citation cite {
  font-style: normal;
  font-weight: 600;
  font-size: 0.85em;
  color: var(--e-global-color-caddbc8, #E9D08D);
}

/* Bouton billetterie désactivé */
.spectacle-btn-disabled {
  opacity: 0.6;
  cursor: default;
  pointer-events: none;
}

/* Lien revente PasseTonBillet */
.spectacle-revente {
  margin-top: 0.5rem;
  font-size: 0.9em;
  color: #fff;
}
.spectacle-revente a {
  color: var(--e-global-color-caddbc8, #E9D08D);
  text-decoration: underline;
}

/* --- 7. Labels pictos (badges spectacle) --- */
.spectacle-labels {
  display: flex;
  gap: 6px;
  margin-bottom: 8px;
}
.spectacle-label img {
  width: 50px;
  height: 50px;
  object-fit: contain;
}

/* Cartes de spectacles en présentation compacte (accueil, programmation) :
 * les pictogrammes concluent la carte, centrés et moins imposants que sur
 * une fiche détaillée. Non scopé à une page : le modificateur de la card
 * (accueil=true dans spectacle-card.html) suffit à cibler l'usage voulu. */
.spectacle-card--accueil .spectacle-labels {
  justify-content: center;
  gap: 4px;
  margin: 0.65rem 0 0;
}
.spectacle-card--accueil .spectacle-label img {
  width: 32px;
  height: 32px;
}

/* Accueil : appel à la billetterie, lien photographe et prochain coup de cœur. */
.elementor-home .home-reservation .elementor-button {
  border-radius: 16px;
  background-color: #bd1010;
  font-weight: 700;
}

.elementor-home .home-reservation .elementor-button:hover,
.elementor-home .home-reservation .elementor-button:focus-visible {
  background-color: #8f0b0b;
}

.elementor-home .home-photographe .elementor-widget-container {
  margin-top: 24px;
  padding: 10px 0 0;
  border: 2px solid var(--e-global-color-7ae7e1b, #e7322d);
  border-radius: 20px;
  text-align: center;
}

.elementor-home .home-photographe p {
  margin: 0;
}

.elementor-home .home-photographe a {
  color: var(--e-global-color-7ae7e1b, #e7322d);
  text-decoration: underline;
}

.elementor-home .home-actualites {
  color: #fffefe;
  font-size: 17px;
  line-height: 1.65;
  text-align: justify;
}

.elementor-home .home-actualites p {
  margin: 0 0 1rem;
}

.elementor-home .home-actualites__media {
  margin: 1.25rem 0 0;
}

.elementor-home .home-actualites__image img,
.elementor-home .home-actualites__video video {
  display: block;
  width: 100%;
  height: auto;
}

/* Les titres de blocs de la page d'accueil reprennent le beige WordPress. */
.elementor-home .elementor-widget-heading .elementor-heading-title {
  color: var(--e-global-color-caddbc8, #e9d08d);
}

.elementor-home .home-coup-de-coeur {
  margin-bottom: 42px;
}

.elementor-home .home-coup-de-coeur__conteneur {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 1.25rem 1.5rem;
  border: 7px solid #ff2b2b;
  background: #282828;
}

.elementor-home .home-coup-de-coeur__conteneur:hover {
  background: #353535;
}

.elementor-home .home-coup-de-coeur__picto-lien {
  flex: 0 0 90px;
}

.elementor-home .home-coup-de-coeur__picto {
  width: 90px;
  height: 90px;
  object-fit: contain;
}

.elementor-home .home-coup-de-coeur__contenu {
  min-width: 0;
}

.elementor-home .home-coup-de-coeur h2,
.elementor-home .home-coup-de-coeur h3 {
  margin: 0;
}

.elementor-home .home-coup-de-coeur h2 {
  color: #ff2b2b;
  font-size: 2rem;
  line-height: 1.2;
}

.elementor-home .home-coup-de-coeur h3 {
  margin-top: 0.35rem;
  color: #fff;
  font-size: 1.6rem;
  line-height: 1.25;
  text-decoration: underline;
}

.elementor-home .home-coup-de-coeur h3 a {
  color: inherit;
}

.elementor-home .home-coup-de-coeur__texte {
  margin-top: 0.7rem;
  font-style: italic;
  cursor: text;
  -webkit-user-select: text !important;
  user-select: text !important;
}

.elementor-home .home-coup-de-coeur__texte,
.elementor-home .home-coup-de-coeur__texte * {
  -webkit-user-select: text !important;
  user-select: text !important;
}

.elementor-home .home-coup-de-coeur__texte p {
  margin: 0;
}

/* Pied de page. */
.site-footer__bar {
  padding: 0;
  background-color: #000;
  border-top: 1px solid #eaeaea;
  color: #fff;
  font-size: 12px;
  line-height: 1;
}

.site-footer__container {
  width: 1200px;
  max-width: 90%;
  margin: 0 auto;
  padding: 22px 0 20px;
  border-top: 0;
}

.footer-navigation {
  float: none;
  width: 100%;
  padding: 0;
  font-size: 14px;
  line-height: 1;
  text-align: center;
}

.footer-navigation__list {
  display: inline-block;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-navigation__item {
  float: left;
}

.footer-navigation__link {
  padding: 0 15px;
  color: #fff;
}

.footer-navigation__link:hover {
  color: #dd3333;
}

.footer-navigation__logo {
  display: inline-block;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

.footer-navigation__label {
  display: none;
}

@media (max-width: 959px) {
  .footer-navigation {
    float: none;
    width: 100%;
    margin-bottom: 15px;
    padding-right: 0;
    padding-left: 0;
    text-align: center;
  }

  .footer-navigation__item {
    float: none;
    display: inline-block;
  }
}

@media (max-width: 480px) {
  .footer-navigation__item {
    margin-bottom: 8px;
  }
}

/* Liste de programmation : les labels accompagnent directement le titre. */
.elementor-programmation .spectacle-card__titre {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
}
.elementor-programmation .spectacle-card__titre .spectacle-labels {
  flex: 0 0 auto;
  gap: 3px;
  margin: 0;
}
.elementor-programmation .spectacle-card__titre .spectacle-label img {
  width: 32px;
  height: 32px;
}
.elementor-programmation .spectacle-card__titre > a {
  flex: 1 1 auto;
  min-width: 0;
}
.elementor-programmation .spectacle-card__titre .elementor-image-box-title {
  margin-top: 0;
}

/* ============================================================
   SECTION SPECTACLES — CSS générique (remplace elementor-6898)
   Identique pour tous les spectacles (template Elementor partagé).
   Source : post-6898.css avec elementor-6898 → elementor-spectacle
   ============================================================ */

/* Fond de page pour tous les spectacles */
body.spectacle-page {
  background-color: #5C5A5A;
}

/* === [53/56] /wp-content/uploads/elementor/css/post-6898.css
 *   source  : https://www.scenes-mitoyennes.fr/wp-content/uploads/elementor/css/post-6898.css?ver=1780304451
 *   pages   : spectacles/www.scenes-mitoyennes.fr-calogero--.html
 */
.elementor-spectacle .elementor-element.elementor-element-0a00bf9 > .elementor-container {
  min-height: 149px;
}

.elementor-spectacle .elementor-element.elementor-element-0a00bf9 {
  margin-top: 0px;
  margin-bottom: 0px;
}

.elementor-spectacle .elementor-element.elementor-element-3695b6f {
  width: 100%;
  max-width: 100%;
  align-self: flex-start;
}

.elementor-spectacle .elementor-element.elementor-element-3695b6f > .elementor-widget-container {
  padding: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-3695b6f img {
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1920 / 350;
  object-fit: cover;
  object-position: center center;
  opacity: 0.69;
  filter: brightness(100%) contrast(100%) saturate(100%) blur(0px) hue-rotate(0deg);
}

.elementor-spectacle .elementor-element.elementor-element-629a092 {
  margin-top: -65px;
  margin-bottom: 0px;
  padding: 0px 20px 0px 20px;
}

.elementor-spectacle .elementor-element.elementor-element-cb9db12 .elementor-button,
.elementor-spectacle .elementor-element.elementor-element-3ff045e .elementor-button {
  background-color: var(--e-global-color-7ae7e1b);
  font-weight: 600;
}

.elementor-spectacle .elementor-element.elementor-element-cb9db12 .elementor-button:hover,
.elementor-spectacle .elementor-element.elementor-element-cb9db12 .elementor-button:focus,
.elementor-spectacle .elementor-element.elementor-element-3ff045e .elementor-button:hover,
.elementor-spectacle .elementor-element.elementor-element-3ff045e .elementor-button:focus {
  color: #000000;
}

.elementor-spectacle .elementor-element.elementor-element-cb9db12 .elementor-button:hover svg,
.elementor-spectacle .elementor-element.elementor-element-cb9db12 .elementor-button:focus svg,
.elementor-spectacle .elementor-element.elementor-element-3ff045e .elementor-button:hover svg,
.elementor-spectacle .elementor-element.elementor-element-3ff045e .elementor-button:focus svg {
  fill: #000000;
}

.elementor-spectacle .elementor-element.elementor-element-81f2d7a {
  padding: 0px 0px 0px 50px;
}

.elementor-spectacle .elementor-element.elementor-element-e80a8c5.elementor-column > .elementor-widget-wrap {
  justify-content: flex-start;
}

.elementor-spectacle .elementor-element.elementor-element-e80a8c5 > .elementor-element-populated {
  margin: 0px 0px 0px -28px;
  --e-column-margin-right: 0px;
  --e-column-margin-left: -28px;
}

.elementor-spectacle .elementor-element.elementor-element-ef00b37 {
  text-align: start;
}

.elementor-spectacle .elementor-element.elementor-element-ef00b37 img {
  width: 100%;
}

.elementor-spectacle .elementor-element.elementor-element-5ee36c1 {
  width: var(--container-widget-width, 100.87%);
  max-width: 100.87%;
  --container-widget-width: 100.87%;
  --container-widget-flex-grow: 0;
  text-align: start;
  font-weight: 600;
  text-transform: uppercase;
  line-height: 14px;
  color: var(--e-global-color-caddbc8);
}

.elementor-spectacle .elementor-element.elementor-element-5ee36c1 > .elementor-widget-container {
  margin: 13px 0px 0px -10px;
}

.elementor-spectacle .elementor-element.elementor-element-a705a06 {
  width: var(--container-widget-width, 25.164%);
  max-width: 25.164%;
  --container-widget-width: 25.164%;
  --container-widget-flex-grow: 0;
  align-self: flex-end;
  text-align: start;
}

/* Le gabarit WordPress Calogero aligne ce bloc à gauche. Certaines règles
 * globales Elementor peuvent sinon centrer les titres Hugo. */
.elementor-spectacle .elementor-element.elementor-element-5ee36c1,
.elementor-spectacle .elementor-element.elementor-element-a705a06,
.elementor-spectacle .elementor-element.elementor-element-8adaf1e,
.elementor-spectacle .elementor-element.elementor-element-a705a06 .elementor-heading-title,
.elementor-spectacle .elementor-element.elementor-element-8adaf1e .elementor-heading-title {
  text-align: left !important;
}

.elementor-spectacle .elementor-element.elementor-element-a705a06 .elementor-heading-title {
  font-size: 36px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  color: #FFFFFF;
}

/* Le titre et le sous-titre doivent partir du bord gauche du bandeau.
 * `flex-end` les plaçait à droite malgré l'alignement de leur texte. */
.elementor-spectacle .elementor-element.elementor-element-a705a06,
.elementor-spectacle .elementor-element.elementor-element-8adaf1e {
  align-self: flex-start;
}

.elementor-spectacle .elementor-element.elementor-element-8adaf1e {
  width: var(--container-widget-width, 49.821%);
  max-width: 49.821%;
  --container-widget-width: 49.821%;
  --container-widget-flex-grow: 0;
  align-self: flex-end;
  text-align: start;
}

.elementor-spectacle .elementor-element.elementor-element-8adaf1e .elementor-heading-title {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 1.4px;
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-8adaf1e > .elementor-widget-container {
  margin-top: 10px;
}

/* Les pictogrammes gardent leur taille native, quel que soit leur nombre.
 * La règle Elementor générique ci-dessus force sinon les images à 100 %. */
.elementor-spectacle .spectacle-label img {
  display: block;
  width: 50px !important;
  height: 50px !important;
  max-width: none;
}

/* Les pictos et le type partagent une première ligne. Le titre et le
 * sous-titre occupent ensuite toute la largeur du bandeau des informations. */
.elementor-spectacle .elementor-element.elementor-element-9384862,
.elementor-spectacle .elementor-element.elementor-element-a705a06,
.elementor-spectacle .elementor-element.elementor-element-8adaf1e {
  width: 100% !important;
  max-width: 100% !important;
}

.elementor-spectacle .spectacle-entete {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.elementor-spectacle .spectacle-entete__categorie {
  display: flex;
  align-items: center;
  gap: 14px;
}

.elementor-spectacle .spectacle-entete__categorie .elementor-element-ef00b37,
.elementor-spectacle .spectacle-entete__categorie .elementor-element-5ee36c1 {
  width: auto;
  max-width: none;
}

.elementor-spectacle .spectacle-entete__categorie .elementor-element-5ee36c1 > .elementor-widget-container {
  margin: 0;
}

.elementor-spectacle .elementor-element.elementor-element-6bd5542:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap,
.elementor-spectacle .elementor-element.elementor-element-6bd5542 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-color: #00ABBD;
}

.elementor-spectacle .elementor-element.elementor-element-6bd5542 > .elementor-element-populated {
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
}

.elementor-spectacle .elementor-element.elementor-element-6bd5542 > .elementor-element-populated > .elementor-background-overlay {
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

.elementor-spectacle .elementor-element.elementor-element-6f4e031 > .elementor-widget-container {
  margin: -3px -3px -3px -3px;
}

.elementor-spectacle .elementor-element.elementor-element-6f4e031 .elementor-heading-title {
  font-size: 22px;
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-b839a48 > .elementor-widget-container {
  margin: -3px -3px -3px -3px;
}

.elementor-spectacle .elementor-element.elementor-element-b839a48 .elementor-heading-title {
  font-size: 22px;
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-50ea133 > .elementor-widget-container {
  margin: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-50ea133 .elementor-heading-title {
  font-size: 16px;
  -webkit-text-stroke-color: #000;
  stroke: #000;
  mix-blend-mode: screen;
  color: #F8DB61;
}

.elementor-spectacle .elementor-element.elementor-element-a52cfec > .elementor-widget-container {
  margin: 0px 0px -15px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-a52cfec {
  text-align: justify;
  color: #252627;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .lightbox_button_only.htmega-lightbox .htmega-lightbox-action a {
  background-color: var(--e-global-color-7ae7e1b);
}

/* Bouton de lecture vidéo : en surimpression du bas de l'image artiste
   (pas en dessous). La classe Elementor `lightbox_button_only` force le
   bouton en `position: static` (voir all-styles.css), donc le widget reste
   en flux juste après l'image — repositionné ici en absolute, ancré au bas
   de la colonne qui ne contient que l'image + ce widget, avec un léger
   écart (`bottom`) pour ne pas coller au bord de la photo. Centré
   horizontalement via left:0/right:0 + text-align:center (ci-dessous),
   volontairement identique à toutes les largeurs — les anciennes
   surcharges Elementor à 1024px/767px figeaient ce widget à une largeur de
   quelques dizaines de px calée sur les colonnes pixel-perfect de l'éditeur
   WYSIWYG d'origine, ce qui décalait le bouton à gauche. */
.elementor-spectacle .elementor-element-799cd45 > .elementor-widget-wrap {
  position: relative;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 20px;
  --container-widget-flex-grow: 0;
  --e-transform-transition-duration: 100ms;
  z-index: 2;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece > .elementor-widget-container:hover {
  --e-transform-scale: 1.4;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece > .elementor-widget-container {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox {
  text-align: center;
  padding: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .htmega-lightbox-action::before {
  background-color: rgba(0, 0, 0, 0.5);
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .htmega-lightbox-action {
  justify-content: center;
}

/* Bouton de lecture vidéo : disque à léger dégradé + ombre portée pour le
   détacher de l'image, anneau de pulsation discret en incitation au clic
   (désactivée pour les visiteurs préférant moins de mouvement). */
.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .image-popup-vertical-fit {
  color: #FFFFFF;
  width: 60px;
  height: 60px;
  border-width: 3px;
  background: radial-gradient(circle at 35% 30%, #ff5b4d, var(--e-global-color-7ae7e1b, #e7322d) 70%);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .5);
  transition: box-shadow .2s ease, background-color .2s ease;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .image-popup-vertical-fit::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 100%;
  border: 2px solid #fff;
  opacity: .8;
  animation: sm-video-play-pulse 2.4s ease-out infinite;
}

@keyframes sm-video-play-pulse {
  0%   { transform: scale(1);   opacity: .6; }
  70%  { transform: scale(1.55); opacity: 0; }
  100% { transform: scale(1.55); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .image-popup-vertical-fit::after {
    animation: none;
    display: none;
  }
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .htmega-lightbox-action a:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, .6);
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .htmega-lightbox-action a i {
  color: #FFFFFF;
  font-size: 22px;
  /* Optique : le triangle "play" paraît décalé à gauche une fois centré
     mathématiquement ; ce décalage corrige la perception visuelle. */
  margin-left: 4px;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .image-popup-vertical-fit svg path {
  fill: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .image-popup-vertical-fit i {
  font-size: 24px;
}

.elementor-spectacle .elementor-element.elementor-element-fc62ece .htmega-lightbox .image-popup-vertical-fit svg {
  width: 24px;
}

.elementor-spectacle .elementor-element.elementor-element-a36868e > .elementor-widget-container {
  margin: 0px 0px -8px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-a36868e {
  text-align: justify;
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-de6640a {
  width: var(--container-widget-width, 162.917%);
  max-width: 162.917%;
  --container-widget-width: 162.917%;
  --container-widget-flex-grow: 0;
  text-align: start;
}

.elementor-spectacle .elementor-element.elementor-element-de6640a > .elementor-widget-container {
  margin: 6px 6px 11px 6px;
}

.elementor-spectacle .elementor-element.elementor-element-de6640a .elementor-heading-title {
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.elementor-repeater-item-79614c2 {
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.htb-active.elementor-repeater-item-79614c2 {
  color: var(--e-global-color-7ae7e1b);
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.elementor-repeater-item-c701425 {
  color: #FFFCFC;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.htb-active.elementor-repeater-item-c701425 {
  color: var(--e-global-color-7ae7e1b);
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.elementor-repeater-item-96f35c1 {
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.htb-active.elementor-repeater-item-96f35c1 {
  color: var(--e-global-color-7ae7e1b);
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.htb-active {
  background-color: #A79F9F;
  border-radius: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-single-tab {
  background-color: #A79F9F;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 {
  width: 100%;
  max-width: 100%;
  --container-widget-width: 100%;
  --container-widget-flex-grow: 0;
  align-self: center;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 > .elementor-widget-container {
  padding: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav {
  width: 100%;
  max-width: 100%;
  border-radius: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  justify-content: center !important;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a {
  justify-content: center;
  margin: 0px 0px 0px 0px;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a i {
  font-size: 14px;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a .htmega-tab-svg-icon svg {
  width: 14px;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a i,
.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a .htmega-tab-svg-icon {
  width: 26px;
  height: 26px;
}

.elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-content-area .htmega-tab-content p {
  color: var(--e-global-color-9d20c01);
  font-size: 37px;
}

.elementor-spectacle .spectacle-seances {
  display: grid;
  grid-template-columns: repeat(auto-fit, 400px);
  gap: 14px;
}

.elementor-spectacle .spectacle-seances__item {
  background-color: #7f7777;
  padding: 16px 18px 18px;
  color: #fff;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}

.elementor-spectacle .spectacle-seances__entete {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px 14px;
  margin-bottom: 12px;
}

.elementor-spectacle .spectacle-seances__date,
.elementor-spectacle .spectacle-seances__salle,
.elementor-spectacle .spectacle-seances__type {
  margin: 0;
}

.elementor-spectacle .spectacle-seances__meta {
  min-width: 0;
}

.elementor-spectacle .spectacle-seances__date {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.35;
  color: #fff;
}

.elementor-spectacle .spectacle-seances__salle {
  margin-top: 4px;
  font-size: 1.08rem;
  font-weight: 600;
  line-height: 1.35;
  color: #f8f4e7;
}

.elementor-spectacle .spectacle-seances__type {
  display: inline-block;
  padding: 4px 10px;
  background: rgba(0, 0, 0, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.35);
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #fff;
  text-align: right;
  justify-self: end;
}

.elementor-spectacle .spectacle-seances__tarifs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 18px;
  margin: 0;
}

.elementor-spectacle .spectacle-seances__tarif {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.elementor-spectacle .spectacle-seances__tarif dt,
.elementor-spectacle .spectacle-seances__tarif dd {
  margin: 0;
}

.elementor-spectacle .spectacle-seances__tarif dt {
  font-size: 1rem;
  line-height: 1.35;
  color: #fff;
}

.elementor-spectacle .spectacle-seances__tarif dd {
  font-size: 1.65rem;
  font-weight: 800;
  line-height: 1;
  color: #f4d98f;
  text-align: right;
  white-space: nowrap;
}

.elementor-spectacle .elementor-element.elementor-element-f29c30e .elementor-button {
  background-color: #BD1010;
  font-weight: 600;
  border-radius: 16px 16px 16px 16px;
}

.elementor-spectacle .elementor-element.elementor-element-f29c30e {
  width: 100%;
  max-width: 100%;
  --container-widget-width: 100%;
  --container-widget-flex-grow: 0;
  align-self: center;
}

.elementor-spectacle .elementor-element.elementor-element-f29c30e > .elementor-widget-container {
  margin: 28px 0 18px;
  padding: 0;
  text-align: center;
}

.elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-accordion-icon,
.elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-accordion-title {
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-accordion-icon svg {
  fill: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-active .elementor-accordion-icon,
.elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-active .elementor-accordion-title {
  color: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-active .elementor-accordion-icon svg {
  fill: #FFFFFF;
}

.elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-tab-content {
  color: #FFFFFF;
  font-size: 12px;
}

.elementor-spectacle .elementor-element.elementor-element-e88b204 {
  --divider-border-style: solid;
  --divider-color: #000;
  --divider-border-width: 1px;
}

.elementor-spectacle .elementor-element.elementor-element-e88b204 .elementor-divider-separator {
  width: 100%;
}

.elementor-spectacle .elementor-element.elementor-element-e88b204 .elementor-divider {
  padding-block-start: 15px;
  padding-block-end: 15px;
}

.elementor-spectacle .elementor-element.elementor-element-85735cd {
  --e-image-carousel-slides-to-show: 2;
}

body.spectacle-page:not(.elementor-motion-effects-element-type-background),
body.spectacle-page > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-color: #5C5A5A;
}

:root {
  --page-title-display: none;
}

@media(max-width:1024px) {
  .elementor-spectacle .elementor-element.elementor-element-a705a06 {
    width: var(--container-widget-width, 697.2px);
    max-width: 697.2px;
    --container-widget-width: 697.2px;
    --container-widget-flex-grow: 0;
  }

  .elementor-spectacle .elementor-element.elementor-element-8adaf1e {
    width: var(--container-widget-width, 499.833px);
    max-width: 499.833px;
    --container-widget-width: 499.833px;
    --container-widget-flex-grow: 0;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 {
    width: 100%;
    max-width: 100%;
    --container-widget-width: 100%;
    --container-widget-flex-grow: 0;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav {
    border-radius: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a {
    margin: 0px 0px 0px 0px;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-single-tab {
    padding: 0px 0px 0px 0px;
  }

  .elementor-spectacle .elementor-element.elementor-element-f29c30e {
    width: 100%;
    max-width: 100%;
    --container-widget-width: 100%;
    --container-widget-flex-grow: 0;
  }

  .elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-tab-content {
    font-size: 12px;
  }
}

/* --- Archives des saisons --- */
.elementor-archives .archives-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
  width: 100%;
}

.elementor-archives .archives-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 3px 14px rgb(0 0 0 / 12%);
}

.elementor-archives .archives-card > img {
  display: block;
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
}

.elementor-archives .archives-card-content {
  padding: 1.25rem;
}

.elementor-archives .archives-card h2 {
  margin: 0 0 1rem;
  font-size: 1.2rem;
}

.elementor-archives .archives-texte p:first-child {
  margin-top: 0;
}

.elementor-archives .archives-texte ul {
  margin-bottom: 0;
  padding-left: 1.25rem;
}

@media(min-width:768px) {
  .elementor-spectacle .elementor-element.elementor-element-83c6dd6 {
    width: 5%;
  }

  .elementor-spectacle .elementor-element.elementor-element-9384862 {
    width: 95%;
  }
}

@media(max-width:1024px) and (min-width:768px) {
  .elementor-spectacle .elementor-element.elementor-element-83c6dd6 {
    width: 10%;
  }

  .elementor-spectacle .elementor-element.elementor-element-9384862 {
    width: 90%;
  }
}

@media(max-width:767px) {
  /* Boutons spectacle précédent/suivant : sur desktop ils chevauchent le bas
     de la couverture via une marge négative (-65px) calibrée pour la hauteur
     réelle du bandeau sur grand écran ; sur mobile ce même décalage fixe ne
     suffit plus (image proportionnellement plus basse) et les boutons
     retombent sous l'image en flux normal. Repositionnés ici en surimpression,
     centrés verticalement sur la couverture (ratio 1920/350, donc hauteur
     = 18.229vw en pleine largeur) via transform, indépendamment de la
     hauteur réelle des boutons. */
  .elementor-spectacle {
    position: relative;
  }
  .elementor-spectacle .elementor-element.elementor-element-629a092 {
    position: absolute;
    top: 9.115vw;
    left: 0;
    right: 0;
    margin-top: 0;
    transform: translateY(-50%);
    z-index: 5;
  }

  .elementor-spectacle .elementor-element.elementor-element-d8b9523 {
    width: 50%;
  }

  .elementor-spectacle .elementor-element.elementor-element-3ff045e {
    width: 50%;
  }

  .elementor-spectacle .elementor-element.elementor-element-83c6dd6 {
    width: 15%;
  }

  .elementor-spectacle .elementor-element.elementor-element-ef00b37 img {
    max-width: 100%;
  }

  .elementor-spectacle .elementor-element.elementor-element-9384862 {
    width: 80%;
  }

  .elementor-spectacle .elementor-element.elementor-element-a705a06 {
    width: var(--container-widget-width, 272.7px);
    max-width: 272.7px;
    --container-widget-width: 272.7px;
    --container-widget-flex-grow: 0;
  }

  .elementor-spectacle .elementor-element.elementor-element-8adaf1e {
    width: var(--container-widget-width, 243.183px);
    max-width: 243.183px;
    --container-widget-width: 243.183px;
    --container-widget-flex-grow: 0;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 {
    width: 100%;
    max-width: 100%;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav {
    margin: 0px 0px 0px 0px;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a {
    margin: 0px 0px 0px 0px;
  }

  .elementor-spectacle .elementor-element.elementor-element-6926ef0 .htmega-tab-nav a.htb-active {
    border-radius: 0px 0px 0px 0px;
  }

  .elementor-spectacle .spectacle-seances {
    /* La colonne fixe de 400px (règle desktop) dépasse tout écran plus
       étroit qu'elle, provoquant un débordement horizontal de toute la
       page (scroll latéral au pouce sur mobile). */
    grid-template-columns: 1fr;
  }

  .elementor-spectacle .spectacle-seances__item {
    padding: 12px 14px 14px;
  }

  .elementor-spectacle .spectacle-seances__entete {
    grid-template-columns: 1fr;
  }

  .elementor-spectacle .spectacle-seances__type {
    justify-self: start;
    text-align: left;
  }

  .elementor-spectacle .spectacle-seances__tarifs {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .elementor-spectacle .spectacle-seances__tarif dd {
    font-size: 1.3rem;
  }

  .elementor-spectacle .elementor-element.elementor-element-de4c30c .elementor-tab-content {
    font-size: 12px;
  }
}

/* --- Archives des saisons : reprise de la mise en page WordPress --- */
.elementor-archives .archives-hero {
  padding: 10px 0 20px;
  background: linear-gradient(180deg, #5c5a5a 48%, #000 100%);
}

.elementor-archives .archives-hero .elementor-heading-title {
  color: #fdfdfd;
  text-align: center;
}

.elementor-archives .archives-photographe {
  min-height: 46px;
  background: #e7322d;
  color: #fff;
}

.elementor-archives .archives-photographe .elementor-widget-container {
  text-align: center;
}

.elementor-archives .archives-photographe p {
  margin: 12px 0;
}

.elementor-archives .archives-photographe a {
  color: #99ccff;
}

.elementor-archives .archives-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.5rem 0;
}

.elementor-archives .archives-item {
  min-width: 0;
  padding: 20px 10px 0;
}

.elementor-archives .archives-couverture {
  display: block;
  width: 70%;
  margin: 0 auto;
  text-align: center;
}

.elementor-archives .archives-couverture img {
  display: block;
  width: 100%;
  height: auto;
}

.elementor-archives .archives-accordion {
  position: relative;
  border: 0;
  margin-top: 20px;
}

.elementor-archives .archives-accordion summary {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 15px;
  border: 1px solid #ececec;
  cursor: pointer;
  color: #2c2c2c;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  list-style: none;
}

.elementor-archives .archives-accordion summary::-webkit-details-marker {
  display: none;
}

.elementor-archives .archives-accordion summary::before {
  content: "+";
  display: inline-block;
  width: 1.25em;
  font-weight: 700;
}

.elementor-archives .archives-saison-lien {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-width: 4.25rem;
  height: 2.7rem;
  padding: 0 0.55rem;
  margin-left: auto;
  border-radius: 0.2rem;
  color: #fff;
  background: #0d70b7;
  box-shadow: 0 2px 0 #004f87;
  line-height: 1;
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.elementor-archives .archives-saison-lien__label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.elementor-archives .archives-saison-lien__icone {
  font-size: 1.55rem;
  font-weight: 700;
}

.elementor-archives .archives-saison-lien:hover,
.elementor-archives .archives-saison-lien:focus-visible {
  color: #fff;
  background: #004f87;
  transform: translate(2px, -1px);
}

.elementor-archives .archives-accordion[open] summary::before {
  content: "−";
}

.elementor-archives .archives-texte {
  margin-top: 6px;
  padding: 0 15px 15px;
  border: 1px solid #ececec;
}

.elementor-archives .archives-texte p,
.elementor-archives .archives-texte ul,
.elementor-archives .archives-texte li {
  margin: 0;
}

.elementor-archives .archives-texte ul {
  padding: 0;
  list-style: none;
}

.elementor-archives .archives-texte li::before {
  content: "– ";
}

.elementor-archives .archives-texte li p {
  display: inline;
}

/* Légende des pictogrammes en bas de la programmation. */
.elementor-programmation .programmation-legende {
  padding: 28px 0 36px;
}

.elementor-programmation .programmation-legende__item .elementor-image-box-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: left;
}

.elementor-programmation .programmation-legende__item .elementor-image-box-img {
  flex: 0 0 50px;
  width: 50px;
  margin: 0 12px 0 0;
}

.elementor-programmation .programmation-legende__item .elementor-image-box-img img {
  display: block;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

.elementor-programmation .programmation-legende__item .elementor-image-box-title {
  margin: 0;
  color: #fdfdfd;
  font-size: 15px;
  line-height: 1.2;
}

@media (max-width: 1024px) {
  .elementor-archives .archives-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .elementor-home .home-coup-de-coeur__conteneur {
    align-items: flex-start;
    gap: 0.9rem;
    padding: 1rem;
    border-width: 5px;
  }

  .elementor-home .home-coup-de-coeur__picto-lien {
    flex-basis: 58px;
  }

  .elementor-home .home-coup-de-coeur__picto {
    width: 58px;
    height: 58px;
  }

  .elementor-home .home-coup-de-coeur h2 {
    font-size: 0.95rem;
  }

  .elementor-home .home-coup-de-coeur h3 {
    font-size: 1.3rem;
  }

  .elementor-programmation .programmation-legende__item {
    width: 50%;
  }

  .elementor-programmation .programmation-legende__item .elementor-image-box-wrapper {
    justify-content: flex-start;
    margin: 8px 0;
  }

  .elementor-archives .archives-grid {
    grid-template-columns: 1fr;
  }
}