/* ============================================================
   mariska.fr — Design system --msk-*  (source : 04-maquettes)
   Univers coloré famille/enfance. Voir design-system.md.
   ============================================================ */
:root{
  --msk-nuit:#4A1414; --msk-encre:#5C4B45;
  --msk-rouge:#C50000; --msk-rouge-fonce:#9C0000;
  --msk-jaune:#FFC53F; --msk-turquoise:#0E7C7B;
  --msk-corail:#F4743B; --msk-lilas:#8B5FBF; --msk-vert:#2E8B57;
  --msk-creme:#FFF6EB; --msk-creme-fonce:#FBEBD3; --msk-blanc:#fff;
  --msk-font-titre:"Baloo 2",cursive; --msk-font-texte:"Nunito",sans-serif;
  --msk-radius:22px; --msk-radius-sm:14px; --msk-radius-pill:999px;
  --msk-ombre:0 6px 24px rgba(74,20,20,.12);
  --msk-ombre-forte:0 12px 36px rgba(74,20,20,.18);
}
body{font-family:var(--msk-font-texte);background:var(--msk-creme);color:var(--msk-encre);font-size:1.05rem;line-height:1.65;}
h1,h2,h3,h4,.msk-btn{font-family:var(--msk-font-titre);color:var(--msk-nuit);}
a{color:var(--msk-rouge);} a:hover{color:var(--msk-rouge-fonce);}
:focus-visible{outline:3px solid var(--msk-jaune);outline-offset:2px;}

/* ---------- Conteneur élargi (pages thématiques landing.php) ---------- */
@media (min-width:1400px){.msk-container-large{max-width:1440px;}}

/* ---------- Boutons ---------- */
.msk-btn{display:inline-block;border-radius:var(--msk-radius-pill);padding:.7rem 1.6rem;font-weight:700;font-size:1.05rem;text-decoration:none;border:2px solid transparent;transition:transform .2s,box-shadow .2s,background .2s;cursor:pointer;}
.msk-btn:hover{transform:translateY(-2px);box-shadow:var(--msk-ombre);}
.msk-btn-primaire{background:var(--msk-rouge);color:#fff;}
.msk-btn-primaire:hover{background:var(--msk-rouge-fonce);color:#fff;}
.msk-btn-soleil{background:var(--msk-jaune);color:var(--msk-nuit);}
.msk-btn-soleil:hover{background:#f5b722;color:var(--msk-nuit);}
.msk-btn-outline{border-color:var(--msk-turquoise);color:var(--msk-turquoise);}
.msk-btn-outline:hover{background:var(--msk-turquoise);color:#fff;}
.msk-btn-outline-blanc{border-color:#fff;color:#fff;}
.msk-btn-outline-blanc:hover{background:rgba(255,255,255,.15);color:#fff;}

/* ---------- Navigation ---------- */
.msk-nav{background:rgba(255,246,235,.92);backdrop-filter:blur(8px);box-shadow:0 2px 14px rgba(74,20,20,.08);}
.msk-nav .nav-link{font-weight:700;color:var(--msk-nuit);margin:0 .15rem;padding:.5rem .7rem!important;border-radius:10px;}
.msk-nav .nav-link:hover{color:var(--msk-rouge);}
.msk-nav .nav-link.active{color:var(--msk-rouge);box-shadow:inset 0 -4px 0 var(--msk-jaune);}
.msk-nav .navbar-brand img{height:48px;}
/* Répartition régulière des entrées entre le logo et le bouton Contact, qui reste
   ancré à droite (option B validée par G. le 05/08/2026 — l'ancien `ms-auto`
   poussait tout le bloc à droite et laissait un grand vide après le logo). */
@media (min-width:992px){
  .msk-nav .navbar-collapse{flex-grow:1;}
  .msk-nav .navbar-nav{width:100%;justify-content:space-evenly;}
  .msk-nav .navbar-nav > li:last-child{margin-left:auto;}
  /* Sur les petits écrans « desktop » (992→1200) l'espace est compté : les libellés
     ne doivent jamais se couper en deux lignes (« Boutique » et sa flèche ↗). */
  .msk-nav .nav-link{white-space:nowrap;}
}
.msk-nav .ext::after{content:" ↗";font-size:.8em;}
.msk-nav .btn-contact{border:2px solid var(--msk-rouge);color:var(--msk-rouge);border-radius:var(--msk-radius-pill);padding:.4rem 1.2rem;font-weight:800;text-decoration:none;}
.msk-nav .btn-contact:hover{background:var(--msk-rouge);color:#fff;}
.dropdown-menu{border:none;border-radius:var(--msk-radius-sm);box-shadow:var(--msk-ombre-forte);}
.dropdown-item{font-weight:600;color:var(--msk-encre);padding:.55rem 1.2rem;}
.dropdown-item:hover{background:var(--msk-creme);color:var(--msk-rouge);}
/* Niveau 3 du menu (Spectacles ▸ Noël ▸ …) — sans JS : survol sur desktop,
   items dépliés et indentés dans le menu burger. */
.msk-sous-menu{position:relative;}
.msk-sous-menu > .dropdown-item .fleche{float:right;font-weight:800;color:var(--msk-corail);}
@media (min-width:992px){
  .msk-sous-menu > .dropdown-menu{display:none;position:absolute;top:-.5rem;left:100%;margin:0;}
  .msk-sous-menu:hover > .dropdown-menu,
  .msk-sous-menu:focus-within > .dropdown-menu{display:block;}
}
@media (max-width:991.98px){
  .msk-sous-menu > .dropdown-item .fleche{display:none;}
  .msk-sous-menu > .dropdown-menu{display:block;position:static;border:none;box-shadow:none;padding:0;margin:0;background:transparent;}
  .msk-sous-menu > .dropdown-menu .dropdown-item{padding-left:2.4rem;font-size:.95rem;}
  .msk-sous-menu > .dropdown-menu .dropdown-item::before{content:"› ";color:var(--msk-corail);font-weight:800;}
}
/* Menu mobile : la nav est sticky-top ; sans plafond de hauteur, un menu long
   (ex. dropdown Billetterie déplié) dépasse le bas de l'écran et n'est PAS
   scrollable — c'est la page qui défile derrière. On plafonne + on rend le
   menu scrollable, et overscroll-behavior évite que le scroll fuie sur la page. */
@media (max-width:991.98px){
  .msk-nav .navbar-collapse{max-height:calc(100vh - 68px);max-height:calc(100dvh - 68px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;}
  .msk-nav .navbar-collapse .navbar-nav{padding-bottom:.75rem;}
}

/* ---------- Surtitres, fil d'ariane, vagues ---------- */
.msk-surtitre{font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:.85rem;display:inline-flex;align-items:center;gap:.5rem;}
.msk-surtitre::before{content:"";width:.7em;height:.7em;border-radius:50%;background:currentColor;}
.msk-ariane{font-size:.9rem;font-weight:600;}
.msk-ariane a{text-decoration:none;color:var(--msk-encre);}
.msk-ariane a:hover{color:var(--msk-rouge);}
.msk-ariane .sep{margin:0 .4rem;color:var(--msk-corail);}
.msk-vague{display:block;width:100%;height:70px;margin-top:-1px;}

/* ---------- Héros (accueil, fiches, en-têtes de section) ---------- */
.msk-hero,.msk-entete,.msk-fiche-hero{background:linear-gradient(120deg,#9C0000 0%,#C50000 55%,#E8551E 100%);color:#fff;position:relative;overflow:hidden;}
.msk-hero h1,.msk-entete h1,.msk-fiche-hero h1{color:#fff;font-size:clamp(2rem,4.4vw,3rem);line-height:1.15;}
.msk-hero .fil{color:var(--msk-jaune);white-space:nowrap;}
.msk-hero p.lead,.msk-entete p.lead{color:#FFE3D2;max-width:44rem;}
.msk-hero p.lead{margin-inline:auto;}
.msk-hero .msk-badge-new,.msk-entete .msk-badge-new,.msk-fiche-hero .msk-badge-new{background:#fff;color:var(--msk-rouge);}
.msk-fiche-hero .soustitre{color:var(--msk-jaune);font-family:var(--msk-font-titre);font-weight:700;font-size:1.15rem;letter-spacing:.04em;}
.msk-fiche-hero .affiche,.msk-entete .affiche{width:100%;max-width:380px;border-radius:var(--msk-radius);border:6px solid #fff;box-shadow:var(--msk-ombre-forte);transform:rotate(-2.5deg);}
/* Photo d'ambiance dans un en-tête msk-entete (page anniversaire) : un peu plus large que l'affiche d'une fiche spectacle, format paysage. */
.msk-entete .affiche{max-width:540px;height:auto;}
.msk-confettis{position:absolute;inset:0;pointer-events:none;background:
 radial-gradient(circle 6px at 8% 20%,var(--msk-jaune) 98%,transparent),
 radial-gradient(circle 5px at 22% 75%,rgba(255,255,255,.75) 98%,transparent),
 radial-gradient(circle 7px at 45% 12%,var(--msk-turquoise) 98%,transparent),
 radial-gradient(circle 4px at 70% 26%,var(--msk-jaune) 98%,transparent),
 radial-gradient(circle 6px at 88% 60%,var(--msk-turquoise) 98%,transparent),
 radial-gradient(circle 5px at 60% 85%,rgba(255,255,255,.7) 98%,transparent),
 radial-gradient(circle 4px at 93% 14%,var(--msk-creme) 98%,transparent);
 opacity:.85;}
.msk-badge-1984{display:inline-block;background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.4);border-radius:var(--msk-radius-pill);padding:.35rem 1rem;font-weight:700;color:#fff;font-size:.95rem;margin-bottom:1rem;}
.msk-repere{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.35);border-radius:var(--msk-radius-pill);padding:.35rem 1rem;font-weight:700;font-size:.92rem;color:#fff;}

/* ---------- Cartes d'intention (portes d'entrée accueil) ---------- */
.msk-porte{position:relative;display:flex;flex-direction:column;background:var(--msk-blanc);border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);overflow:hidden;height:100%;transition:transform .2s,box-shadow .2s;text-decoration:none;color:var(--msk-encre);}
.msk-porte:hover{transform:translateY(-4px);box-shadow:var(--msk-ombre-forte);color:var(--msk-encre);}
.msk-porte::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;z-index:2;background:var(--u,var(--msk-rouge));}
.msk-porte .visuel{position:relative;}
.msk-porte img.cover{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;}
.msk-porte.grande img.cover{aspect-ratio:16/8;}
.msk-porte .etiquette{position:absolute;left:1rem;bottom:-0.9rem;z-index:2;display:inline-flex;align-items:center;gap:.45rem;background:var(--u,var(--msk-rouge));color:#fff;font-family:var(--msk-font-titre);font-weight:700;font-size:.85rem;border-radius:var(--msk-radius-pill);padding:.25rem .9rem;box-shadow:var(--msk-ombre);}
.msk-porte .etiquette.sombre{color:var(--msk-nuit);}
.msk-porte .corps{padding:1.5rem 1.3rem 1.3rem;display:flex;flex-direction:column;flex-grow:1;}
.msk-porte h3{font-size:1.35rem;margin-bottom:.4rem;}
.msk-porte.grande h3{font-size:1.6rem;}
.msk-porte p{font-size:.95rem;margin-bottom:1rem;}
.msk-porte .faux-btn{margin-top:auto;align-self:flex-start;border-radius:var(--msk-radius-pill);padding:.5rem 1.3rem;font-family:var(--msk-font-titre);font-weight:700;font-size:.98rem;background:var(--msk-rouge);color:#fff;transition:background .2s;}
.msk-porte:hover .faux-btn{background:var(--msk-rouge-fonce);}
.msk-porte .faux-btn.soleil{background:var(--msk-jaune);color:var(--msk-nuit);}
.msk-porte:hover .faux-btn.soleil{background:#f5b722;}

/* ---------- Grille compacte « Tout l'univers » ---------- */
.msk-univers{background:var(--msk-blanc);border-radius:var(--msk-radius-sm);box-shadow:var(--msk-ombre);padding:1.1rem 1.2rem;height:100%;display:flex;gap:.9rem;align-items:flex-start;text-decoration:none;color:var(--msk-encre);transition:transform .2s,box-shadow .2s;}
.msk-univers:hover{transform:translateY(-4px);box-shadow:var(--msk-ombre-forte);color:var(--msk-encre);}
.msk-univers .puce{flex:0 0 auto;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.35rem;background:color-mix(in srgb,var(--u,var(--msk-rouge)) 14%,#fff);}
.msk-univers h3{font-size:1.02rem;margin:0 0 .15rem;}
.msk-univers h3 .ext-fleche{font-size:.75em;color:var(--u,var(--msk-rouge));}
.msk-univers p{font-size:.85rem;margin:0;line-height:1.45;}
.msk-univers.secondaire{background:var(--msk-creme-fonce);box-shadow:none;border:1.5px dashed color-mix(in srgb,var(--msk-nuit) 18%,transparent);}
.msk-univers.secondaire:hover{box-shadow:var(--msk-ombre);}

/* ---------- Badges (âge, durée, thème, nouveauté) ---------- */
.msk-badges{display:flex;flex-wrap:wrap;gap:.6rem;}
.msk-badge{display:inline-flex;align-items:center;gap:.45rem;border-radius:var(--msk-radius-pill);font-family:var(--msk-font-titre);font-weight:700;font-size:.92rem;padding:.35rem 1rem;}
.msk-badge .pastille{width:.65em;height:.65em;border-radius:50%;background:currentColor;flex:none;}
.msk-badge-age{background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.5);color:#fff;}
.msk-badge-duree{background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.5);color:#fff;}
.msk-badge-theme{background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.5);color:#fff;}
.msk-badge-new{background:var(--msk-rouge);color:#fff;}
/* Classement (Noël…) : badge distinctif — blanc sur fond sombre, rouge plein sur fond clair */
.msk-badge-classement{background:#fff;color:var(--msk-rouge);border:1.5px solid #fff;}
.sur-clair .msk-badge-age{background:rgba(255,197,63,.25);border:none;color:#7A5200;}
.sur-clair .msk-badge-duree{background:rgba(14,124,123,.14);border:none;color:#0A5958;}
.sur-clair .msk-badge-theme{background:rgba(244,116,59,.16);border:none;color:#8A3A10;}
.sur-clair .msk-badge-classement{background:var(--msk-rouge);color:#fff;border:none;}

/* ---------- Cartes spectacle (catalogue) ---------- */
.msk-carte-spectacle{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);overflow:hidden;height:100%;transition:transform .2s,box-shadow .2s;text-decoration:none;color:var(--msk-encre);}
.msk-carte-spectacle:hover{transform:translateY(-4px);box-shadow:var(--msk-ombre-forte);color:var(--msk-encre);}
.msk-carte-spectacle::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;z-index:2;background:var(--msk-rouge);}
.msk-carte-spectacle img.cover{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;}
.msk-carte-spectacle .corps{padding:1.2rem 1.2rem 1.1rem;display:flex;flex-direction:column;flex-grow:1;}
.msk-carte-spectacle h3{font-size:1.2rem;margin-bottom:.35rem;}
.msk-carte-spectacle p{font-size:.9rem;margin-bottom:.8rem;}
.msk-carte-spectacle .msk-badges{margin-top:auto;}
.msk-carte-spectacle .msk-badge{font-size:.8rem;padding:.25rem .8rem;}

/* ---------- Chips de filtre ---------- */
.msk-chips{display:flex;flex-wrap:wrap;gap:.6rem;}
.msk-chip{display:inline-flex;align-items:center;gap:.5rem;border-radius:var(--msk-radius-pill);font-family:var(--msk-font-titre);font-weight:700;font-size:.95rem;padding:.45rem 1.15rem;background:#fff;border:2px solid var(--c,var(--msk-nuit));color:var(--msk-nuit);cursor:pointer;transition:transform .15s,background .15s,color .15s;text-decoration:none;}
.msk-chip .pastille{width:.7em;height:.7em;border-radius:50%;background:var(--c,var(--msk-nuit));flex:none;}
.msk-chip:hover{transform:translateY(-2px);color:var(--msk-nuit);}
.msk-chip.actif{background:var(--c,var(--msk-nuit));color:#fff;}
.msk-chip.actif .pastille{background:#fff;}
.msk-chip.actif.chip-claire{color:var(--msk-nuit);}
.msk-chip.actif.chip-claire .pastille{background:var(--msk-nuit);}

/* Rangée « familles de thématiques » du catalogue et des pages familles.
   Les chips wrappent sur plusieurs lignes — jamais de scroll horizontal. */
.msk-chips-familles{gap:.5rem .6rem;max-width:100%;}
.msk-chips-familles .msk-chip{padding:.4rem 1rem;font-size:.92rem;max-width:100%;}
.msk-chips-familles .msk-chip .emo{font-size:1.05em;line-height:1;flex:none;}
/* État actif net : fond plein + contour épaissi + léger relief */
.msk-chips-familles .msk-chip.actif{box-shadow:0 3px 12px rgba(74,20,20,.22);}
.msk-chips-familles .msk-chip:focus-visible{outline:3px solid var(--msk-jaune);outline-offset:2px;}
@media (max-width:575.98px){
  .msk-chips-familles{gap:.4rem .45rem;}
  .msk-chips-familles .msk-chip{font-size:.85rem;padding:.35rem .8rem;}
}

/* Chip CTA « Demander un devis » — pas un filtre : pleine couleur, toujours en
   fin de barre, distincte des chips de filtre (jamais d'état .actif). */
.msk-chip-cta{background:var(--msk-rouge);border-color:var(--msk-rouge);color:#fff;}
.msk-chip-cta:hover{background:var(--msk-rouge-fonce);border-color:var(--msk-rouge-fonce);color:#fff;}
.msk-chip-cta:focus-visible{outline:3px solid var(--msk-jaune);outline-offset:2px;}

/* Contenu éditorial des pages familles (texte ERP : paragraphes + ## titres) */
/* Pleine largeur du conteneur = exactement la largeur de la grille de cards
   (demande G. 05/08/2026 : « la même largeur que les cards spectacles »). */
.msk-contenu-edito{max-width:none;}
.msk-contenu-edito h2{font-size:clamp(1.35rem,2.4vw,1.7rem);margin:2rem 0 .8rem;}
.msk-contenu-edito h2:first-child{margin-top:0;}
.msk-contenu-edito p{margin-bottom:1.05rem;}
.msk-contenu-edito p:last-child{margin-bottom:0;}
.msk-contenu-edito a{font-weight:700;}

/* ---------- Agenda billetterie ---------- */
.msk-mois-titre{display:flex;align-items:center;gap:1rem;margin:2.5rem 0 1.2rem;}
.msk-mois-titre h2{font-size:1.6rem;margin:0;white-space:nowrap;}
.msk-mois-titre::after{content:"";flex:1;height:4px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--msk-jaune) 0 14px,transparent 14px 26px);}
.msk-seance{background:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);padding:1rem 1.25rem;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;transition:transform .2s,box-shadow .2s;border-left:8px solid var(--c,var(--msk-nuit));margin-bottom:.9rem;}
.msk-seance:hover{transform:translateY(-3px);box-shadow:var(--msk-ombre-forte);}
.msk-date{flex:none;width:74px;text-align:center;background:var(--msk-creme);border-radius:var(--msk-radius-sm);padding:.5rem .25rem;}
.msk-date .jour{font-weight:800;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--msk-rouge);display:block;line-height:1.2;}
.msk-date .num{font-family:var(--msk-font-titre);font-weight:800;font-size:1.7rem;color:var(--msk-nuit);display:block;line-height:1.1;}
.msk-date .mois{font-weight:700;font-size:.8rem;display:block;}
.msk-seance .infos{flex:1 1 240px;min-width:0;}
.msk-seance h3{font-size:1.2rem;margin:0 0 .3rem;}
.msk-salle-tag{display:inline-flex;align-items:center;gap:.4rem;font-weight:800;font-size:.85rem;color:var(--msk-nuit);}
.msk-salle-tag .pastille{width:.7em;height:.7em;border-radius:50%;background:var(--c,var(--msk-nuit));}
.msk-horaires{font-weight:700;font-size:.92rem;color:var(--msk-encre);}
.msk-horaires .h{background:var(--msk-creme-fonce);border-radius:var(--msk-radius-pill);padding:.1rem .7rem;margin-right:.35rem;display:inline-block;}
.msk-seance .action{flex:none;text-align:right;margin-left:auto;}
/* Un bouton de réservation par séance (10h30 / 14h00…) : empilés à droite */
.msk-resa-liens{display:flex;flex-direction:column;align-items:flex-end;gap:.15rem;}
.msk-prix{font-family:var(--msk-font-titre);font-weight:800;font-size:1.25rem;color:var(--msk-rouge);display:block;line-height:1.2;}
.msk-prix small{font-family:var(--msk-font-texte);font-weight:600;font-size:.75rem;color:var(--msk-encre);display:block;}
.msk-seance .msk-btn{padding:.5rem 1.3rem;font-size:.98rem;margin-top:.35rem;}
.msk-vide{display:none;background:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);padding:2rem;text-align:center;font-weight:700;}

/* Couleurs par salle (classe s-<ville> ou var --c inline) */
.s-cysoing{--c:var(--msk-rouge);} .s-croix{--c:var(--msk-turquoise);}
.s-lens{--c:var(--msk-jaune);} .s-lille{--c:var(--msk-lilas);}
.s-valenciennes{--c:var(--msk-corail);} .s-arras{--c:var(--msk-vert);}

/* Jetons couleur bruts (var --c depuis cache_salle.cs_couleur) */
.c-rouge{--c:var(--msk-rouge);} .c-jaune{--c:var(--msk-jaune);} .c-turquoise{--c:var(--msk-turquoise);}
.c-corail{--c:var(--msk-corail);} .c-lilas{--c:var(--msk-lilas);} .c-vert{--c:var(--msk-vert);} .c-nuit{--c:var(--msk-nuit);}

/* ---------- Cards « prochaines séances » (fiche spectacle) ---------- */
.msk-seances-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem;}
.seance-card{position:relative;background:#fff;border-radius:var(--msk-radius-sm);box-shadow:var(--msk-ombre);overflow:hidden;display:flex;flex-direction:column;padding:.9rem 1rem 1rem;transition:transform .18s,box-shadow .18s;border-top:5px solid var(--c,var(--msk-rouge));}
.seance-card:hover{transform:translateY(-3px);box-shadow:var(--msk-ombre-forte);}
.seance-card .sc-ville{align-self:flex-start;display:inline-flex;align-items:center;gap:.35rem;background:var(--c,var(--msk-rouge));color:#fff;font-family:var(--msk-font-titre);font-weight:700;font-size:.82rem;line-height:1;border-radius:var(--msk-radius-pill);padding:.3rem .8rem;margin-bottom:.7rem;}
.seance-card .sc-ville.claire{color:var(--msk-nuit);}
.seance-card .sc-ville .pt{width:.5em;height:.5em;border-radius:50%;background:currentColor;}
.seance-card .sc-when{display:flex;align-items:baseline;flex-wrap:wrap;gap:.5rem;margin-bottom:.35rem;}
.seance-card .sc-date{font-family:var(--msk-font-titre);font-weight:800;font-size:1.1rem;color:var(--msk-nuit);line-height:1.1;}
.seance-card .sc-horaires{display:flex;gap:.3rem;flex-wrap:wrap;}
.seance-card .sc-horaires .h{background:var(--msk-creme-fonce);border-radius:var(--msk-radius-pill);padding:.05rem .55rem;font-weight:700;font-size:.8rem;color:var(--msk-encre);}
.seance-card .sc-salle{font-weight:600;font-size:.85rem;color:var(--msk-encre);margin-bottom:.8rem;}
.seance-card .sc-salle b{font-weight:800;color:var(--msk-nuit);}
.seance-card .sc-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap;margin-top:auto;padding-top:.7rem;border-top:1px solid #F3E7DC;}
.seance-card .sc-resa{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:flex-end;}
.seance-card .sc-prix{font-family:var(--msk-font-titre);font-weight:800;font-size:1rem;color:var(--msk-rouge);line-height:1;}
.seance-card .sc-prix small{font-family:var(--msk-font-texte);font-weight:600;font-size:.68rem;color:var(--msk-encre);display:block;margin-top:.1rem;}
.seance-card .sc-foot .msk-btn{padding:.4rem 1rem;font-size:.9rem;}
.seance-card .sc-complet{font-family:var(--msk-font-titre);font-weight:700;font-size:.8rem;color:#fff;background:var(--msk-encre);border-radius:var(--msk-radius-pill);padding:.3rem .85rem;}
.seance-card.est-complet{opacity:.82;}

/* ---------- Blocs infos / cartes salles ---------- */
.msk-infos-pratiques{background:var(--msk-creme-fonce);border-radius:var(--msk-radius);}
.msk-infos-pratiques li{margin-bottom:.4rem;font-weight:600;}
.msk-carte-salle{background:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);padding:1.2rem 1.3rem;height:100%;border-top:6px solid var(--c,var(--msk-nuit));}
.msk-carte-salle h3{font-size:1.1rem;margin-bottom:.2rem;}
.msk-carte-salle p{font-size:.92rem;margin:0;}
.msk-carte-blanche{background:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);}
/* Carte blanche avec photo en tête (page anniversaire) : la photo va bord à bord, le texte reste dans .corps. */
.msk-carte-photo{display:flex;flex-direction:column;overflow:hidden;padding:0;}
.msk-carte-photo>img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;}
.msk-carte-photo>.corps{padding:1.2rem 1.3rem 1.3rem;display:flex;flex-direction:column;flex-grow:1;}

/* ---------- Fiche spectacle ---------- */
.msk-synopsis p:first-of-type::first-letter{font-family:var(--msk-font-titre);font-weight:800;font-size:2.6em;color:var(--msk-rouge);float:left;line-height:1;padding-right:.12em;}
.msk-galerie img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--msk-radius-sm);box-shadow:var(--msk-ombre);transition:transform .2s;}
.msk-galerie img:hover{transform:scale(1.03) rotate(-1deg);}
.msk-info-ligne{display:flex;gap:.9rem;padding:.85rem 0;border-bottom:2px dashed var(--msk-creme-fonce);}
.msk-info-ligne:last-child{border-bottom:none;}
.msk-info-ligne .ico{flex:none;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;background:var(--msk-creme);}
.msk-info-ligne .lib{font-weight:800;color:var(--msk-nuit);display:block;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;}
.msk-technique{background:var(--msk-creme-fonce);border-radius:var(--msk-radius);}
.msk-mesure{background:#fff;border-radius:var(--msk-radius-sm);box-shadow:var(--msk-ombre);text-align:center;padding:1rem;height:100%;display:flex;flex-direction:column;justify-content:center;}
.msk-mesure .nb{font-family:var(--msk-font-titre);font-weight:800;font-size:1.7rem;color:var(--msk-turquoise);line-height:1.1;}
.msk-mesure .lib{font-weight:700;font-size:.85rem;}

/* ---------- À propos, chiffres, bandeau CTA ---------- */
.msk-apropos{background:var(--msk-creme-fonce);}
.msk-chiffre{background:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);padding:1.2rem 1rem;text-align:center;height:100%;}
.msk-chiffre .nb{font-family:var(--msk-font-titre);font-weight:800;font-size:2.2rem;color:var(--msk-rouge);line-height:1.1;}
.msk-chiffre .lib{font-weight:700;font-size:.9rem;color:var(--msk-encre);}
.msk-marques li{margin-bottom:.35rem;}
.msk-bandeau{background:linear-gradient(120deg,var(--msk-rouge),#E8551E);color:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre-forte);}
.msk-bandeau h2{color:#fff;}

/* ---------- Formulaires ---------- */
.msk-form label{font-weight:800;color:var(--msk-nuit);font-size:.92rem;margin-bottom:.3rem;}
.msk-form .form-control,.msk-form .form-select{border-radius:var(--msk-radius-sm);border:2px solid var(--msk-creme-fonce);padding:.6rem .9rem;font-weight:600;}
.msk-form .form-control:focus,.msk-form .form-select:focus{border-color:var(--msk-turquoise);box-shadow:none;}
.msk-hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden;}

/* ---------- FAQ (accordéon) ---------- */
.msk-faq .accordion-item{border:none;border-radius:var(--msk-radius-sm)!important;box-shadow:var(--msk-ombre);margin-bottom:.9rem;overflow:hidden;}
.msk-faq .accordion-button{font-family:var(--msk-font-titre);font-weight:700;color:var(--msk-nuit);background:#fff;font-size:1.05rem;}
.msk-faq .accordion-button:not(.collapsed){background:var(--msk-creme-fonce);color:var(--msk-rouge);box-shadow:none;}
.msk-faq .accordion-button:focus{box-shadow:none;}
/* Réponses venant de l'ERP : HTML (<p>…</p>) — pas de marge résiduelle en fin de bloc */
.msk-faq .accordion-body > *:last-child{margin-bottom:0;}

/* ---------- Footer ---------- */
.msk-footer{background:var(--msk-nuit);color:#F2D9CC;}
.msk-footer h4{color:#fff;font-size:1.1rem;margin-bottom:.9rem;}
.msk-footer a{color:#F2D9CC;text-decoration:none;}
.msk-footer a:hover{color:var(--msk-jaune);}
.msk-footer ul{list-style:none;padding:0;margin:0;}
.msk-footer li{margin-bottom:.45rem;font-size:.97rem;}
.msk-footer li.sous{margin-bottom:.3rem;font-size:.9rem;padding-left:.9rem;opacity:.9;}
.msk-footer .bas{border-top:1px solid rgba(255,255,255,.15);font-size:.9rem;}
.msk-footer .ext::after{content:" ↗";font-size:.8em;}

@media (max-width:575px){
  .msk-fiche-hero .affiche{transform:rotate(0);}
  .msk-seance .action{margin-left:0;width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;}
  .msk-seance .msk-btn{margin-top:0;}
}

/* Fiche spectacle — objectifs pédagogiques en liste + bande-annonce responsive */
.msk-objectifs{text-align:left;margin:0;padding-left:1.2rem;}
.msk-objectifs li{margin-bottom:.45rem;}
.msk-objectifs li:last-child{margin-bottom:0;}
.msk-video-16-9{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--msk-radius);overflow:hidden;box-shadow:var(--msk-ombre);background:#000;}
.msk-video-16-9 iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

/* --- Bande-annonce : vignette dans la galerie + modal --- */
.msk-galerie-video{position:relative;display:block;width:100%;aspect-ratio:1/1;padding:0;border:0;cursor:pointer;border-radius:var(--msk-radius-sm);overflow:hidden;box-shadow:var(--msk-ombre);background:var(--msk-nuit);transition:transform .2s;}
.msk-galerie-video:hover{transform:scale(1.03) rotate(-1deg);}
.msk-galerie-video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85;}
.msk-galerie-video .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--msk-rouge);display:flex;align-items:center;justify-content:center;font-size:1.15rem;padding-left:4px;box-shadow:var(--msk-ombre);}
.msk-galerie-video:hover .play{background:#fff;}
.msk-galerie-video .tag{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.65);color:#fff;font-size:.72rem;padding:2px 9px;border-radius:var(--msk-radius-pill);}
.msk-video-modal{position:fixed;inset:0;z-index:1080;display:flex;align-items:center;justify-content:center;padding:1rem;}
.msk-video-modal[hidden]{display:none;}
.msk-video-modal .backdrop{position:absolute;inset:0;background:rgba(46,8,8,.86);}
.msk-video-modal .boite{position:relative;width:min(960px,100%);}
.msk-video-modal .fermer{position:absolute;top:-2.5rem;right:0;border:0;background:transparent;color:#fff;font-size:1.35rem;cursor:pointer;line-height:1;}

/* ── Accueil V3 (16/07/2026) ─────────────────────────────── */
.msk-porte.grande h2{font-size:1.6rem;margin-bottom:.4rem;color:var(--msk-nuit);}
.msk-badge-mille{display:inline-flex;align-items:center;gap:.5rem;background:var(--msk-jaune);color:var(--msk-nuit);border-radius:var(--msk-radius-pill);padding:.5rem 1.4rem;font-family:var(--msk-font-titre);font-weight:700;font-size:1.02rem;box-shadow:var(--msk-ombre);}
.msk-puce-xl{font-size:2rem;line-height:1;margin-bottom:.5rem;}
.msk-news .news-img{width:calc(100% + 2.4rem);margin:-1.2rem -1.2rem .8rem;aspect-ratio:16/8;object-fit:cover;display:block;}
.msk-photo-equipe{width:100%;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre-forte);border:6px solid #fff;transform:rotate(1.5deg);}
.msk-confiance{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 2.2rem;align-items:baseline;}
.msk-confiance span{font-family:var(--msk-font-titre);font-weight:700;font-size:1.15rem;color:var(--msk-encre);opacity:.55;}
.msk-confiance span:last-child{font-size:.95rem;font-weight:600;}
.msk-news{position:relative;display:flex;flex-direction:column;height:100%;background:var(--msk-blanc);border-radius:var(--msk-radius-sm);box-shadow:var(--msk-ombre);padding:1.2rem 1.2rem 1.1rem;text-decoration:none;color:var(--msk-encre);overflow:hidden;transition:transform .2s,box-shadow .2s;}
.msk-news::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--u,var(--msk-rouge));}
a.msk-news:hover{transform:translateY(-3px);box-shadow:var(--msk-ombre-forte);color:var(--msk-encre);}
.msk-news h3{font-size:1.05rem;margin:.2rem 0 .35rem;}
.msk-news p{font-size:.88rem;margin-bottom:.6rem;flex-grow:1;}
.msk-news .lien{font-family:var(--msk-font-titre);font-weight:700;font-size:.95rem;color:var(--msk-rouge);}
.msk-seances-vide{background:#fff;border-radius:var(--msk-radius);box-shadow:var(--msk-ombre);padding:1.8rem 2rem;max-width:640px;}

/* ---------- Recherche instantanée du catalogue spectacles ---------- */
.msk-recherche{position:relative;}
.msk-recherche .loupe{position:absolute;left:1.05rem;top:50%;transform:translateY(-50%);width:1.15rem;height:1.15rem;color:var(--msk-nuit);opacity:.5;pointer-events:none;}
.msk-recherche input{width:100%;border-radius:var(--msk-radius-pill);border:2px solid var(--msk-creme-fonce);background:#fff;color:var(--msk-encre);padding:.8rem 3rem .8rem 2.9rem;font-weight:600;font-size:1.02rem;box-shadow:var(--msk-ombre);}
.msk-recherche input::placeholder{color:#A79B95;font-weight:500;}
.msk-recherche input:focus{outline:none;border-color:var(--msk-turquoise);}
.msk-recherche input::-webkit-search-cancel-button,
.msk-recherche input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;}
.msk-recherche .effacer{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);width:2rem;height:2rem;border:none;border-radius:50%;background:var(--msk-creme-fonce);color:var(--msk-nuit);font-size:.95rem;line-height:1;cursor:pointer;display:none;align-items:center;justify-content:center;padding:0;transition:background .15s,color .15s;}
.msk-recherche .effacer.visible{display:flex;}
.msk-recherche .effacer:hover{background:var(--msk-rouge);color:#fff;}