/* Trouver Spectacle : direction artistique « Plan de ville » (lignes de couleur, trois barres du logo, tuiles en feuille) */
:root{
  color-scheme:light;
  --encre:#0E1B2B; --texte:#222B38; --doux:#5E6B7C; --filet:#E4E8ED; --fond:#fff; --gris:#F5F7F9;
  --bord-champ:#8895A5; /* bordure des champs et commandes : contraste 3:1 sur blanc (WCAG 1.4.11) */
  /* Orange de la ligne 5 assombri : pictogramme blanc lisible (4,6:1). */
  --l1:#E4002B; --l2:#0072CE; --l3:#7A2FC9; --l4:#00844A; --l5:#B85A00; --l6:#5B6B7B;
  /* Texte courant : police système de l'appareil (aucune police téléchargée), titres en Bricolage Grotesque (plus bas). */
  --titre:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,'SF Mono',Consolas,'Liberation Mono',monospace;
  --h-bar:76px; --h-cats:92px; --rayon:16px;
  --max:1200px; /* largeur maximale commune : en-tête, barre de catégories, contenu et pied de page */
  --filtre-photo:none; /* photos en couleurs d’origine */
  --ombre:0 6px 24px rgba(14,27,43,.16); --ombre-douce:0 1px 2px rgba(14,27,43,.08),0 4px 12px rgba(14,27,43,.06);
  /* Thème : surfaces, bouton plein (encre en clair, s'inverse en sombre), pastilles vitrées sur les affiches */
  --fond-page:#FBFBFD; --surface:#fff; --surface-2:#F4F7FB;
  --accent-fond:#0E1B2B; --accent-texte:#fff; --accent-survol:#1c2f47;
  --verre:rgba(255,255,255,.82); --verre-bord:rgba(255,255,255,.7);
  --vert-texte:#00562D; --doux-fort:#4A5565; --alerte-fond:#FFF4E5; --surligne:#F6C945; --lien-bleu:#0072CE; --focus:#0072CE;
}
/* Thème sombre : choisi dans le menu (data-theme="sombre"), ou réglage de l'appareil quand le choix est « Automatique ».
   Contrastes vérifiés : texte 13:1, gris secondaire 7,3:1, bordures de champs 3,6:1, « Gratuit » 6:1 sur la pire photo. */
:root[data-theme="sombre"]{
  color-scheme:dark;
  --encre:#F1F4F8; --texte:#D5DBE3; --doux:#A3AEBC; --filet:#2C3846; --fond:#17202C; --gris:#1E2936; --bord-champ:#6B7887;
  --fond-page:#0E151F; --surface:#17202C; --surface-2:#1E2936;
  --accent-fond:#F1F4F8; --accent-texte:#0E1B2B; --accent-survol:#D4DCE6;
  --verre:rgba(23,32,44,.86); --verre-bord:rgba(255,255,255,.14);
  --vert-texte:#6FD6A0; --doux-fort:#B9C3CF; --alerte-fond:#3A2C14; --surligne:#8A6A0A; --lien-bleu:#6CB4F0; --focus:#4DA3F0;
  --ombre:0 6px 24px rgba(0,0,0,.45); --ombre-douce:0 1px 2px rgba(0,0,0,.3),0 4px 12px rgba(0,0,0,.25);
  --filtre-photo:brightness(.92);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme]){
    color-scheme:dark;
    --encre:#F1F4F8; --texte:#D5DBE3; --doux:#A3AEBC; --filet:#2C3846; --fond:#17202C; --gris:#1E2936; --bord-champ:#6B7887;
    --fond-page:#0E151F; --surface:#17202C; --surface-2:#1E2936;
    --accent-fond:#F1F4F8; --accent-texte:#0E1B2B; --accent-survol:#D4DCE6;
    --verre:rgba(23,32,44,.86); --verre-bord:rgba(255,255,255,.14);
    --vert-texte:#6FD6A0; --doux-fort:#B9C3CF; --alerte-fond:#3A2C14; --surligne:#8A6A0A; --lien-bleu:#6CB4F0; --focus:#4DA3F0;
    --ombre:0 6px 24px rgba(0,0,0,.45); --ombre-douce:0 1px 2px rgba(0,0,0,.3),0 4px 12px rgba(0,0,0,.25);
    --filtre-photo:brightness(.92);
  }
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:100%}
html[data-texte="1"]{font-size:112.5%}
html[data-texte="2"]{font-size:125%}
html[data-texte="3"]{font-size:150%}
html{scroll-padding-top:calc(var(--h-bar) + var(--h-cats))}
body{margin:0;background:var(--fond);color:var(--texte);font:400 1rem/1.5 var(--titre);-webkit-font-smoothing:antialiased}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;cursor:pointer}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-999px;top:8px;background:var(--accent-fond);color:var(--accent-texte);padding:.5rem 1rem;border-radius:8px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
.l1{--c:var(--l1)}.l2{--c:var(--l2)}.l3{--c:var(--l3)}.l4{--c:var(--l4)}.l5{--c:var(--l5)}.l6{--c:var(--l6)}

/* Lignes (catégories) */
.ligne,.puce{display:inline-grid;place-items:center;width:1.6em;height:1.6em;border-radius:50%;background:var(--c,var(--encre));color:#fff;font:700 .78rem var(--titre);flex:none}
.ligne svg{width:58%;height:58%;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.ligne-tout{--c:var(--accent-fond);color:var(--accent-texte)}
.ligne-gratuit{background:var(--surface);color:var(--l4);box-shadow:inset 0 0 0 2px var(--l4)}

/* En-tête */
.bar{position:sticky;top:0;z-index:50;background:var(--surface);border-bottom:1px solid var(--filet)}
.bar-in{max-width:var(--max);margin:0 auto;padding:0 40px;height:var(--h-bar);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 1.2rem var(--titre);letter-spacing:-.02em;color:var(--encre)}
.pastille{display:flex;align-items:center;border:1px solid var(--filet);border-radius:999px;box-shadow:var(--ombre-douce);padding:6px 6px 6px 8px;background:var(--surface)}
.seg-wrap{position:relative}
.seg{display:flex;flex-direction:column;align-items:flex-start;border:0;background:transparent;border-radius:999px;padding:6px 18px;text-align:left;line-height:1.2;max-width:200px}
.seg:hover:not(:disabled){background:var(--gris)}
.seg:disabled{cursor:default;opacity:.55}
.seg small{font:700 .7rem var(--titre);color:var(--encre)}
.seg b{font:400 .88rem var(--titre);color:var(--doux);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}
.seg-wrap+.seg-wrap .seg{border-left:1px solid var(--filet);border-radius:0 999px 999px 0}
.seg-wrap+.seg-wrap .seg:hover:not(:disabled){border-radius:999px}
.loupe{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--accent-fond);color:var(--accent-texte);margin-left:6px}
.loupe svg,.menu-btn svg,.btn-filtres svg,.pill-carte svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bar-droite{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.lien-haut{font:600 .88rem var(--titre);text-decoration:none;padding:10px 14px;border-radius:999px}
.lien-haut:hover{background:var(--gris)}
.menu-wrap{position:relative}
.menu-btn{position:relative;display:grid;place-items:center;width:46px;height:42px;border:1px solid var(--filet);border-radius:999px;background:var(--surface)}
.menu-btn:hover{box-shadow:var(--ombre-douce)}
.fav-compte{position:absolute;top:-5px;right:-5px;min-width:20px;height:20px;border-radius:10px;background:var(--l1);color:#fff;font:700 .7rem/20px var(--titre);text-align:center;padding:0 5px}
.pop{position:absolute;top:calc(100% + 10px);left:0;min-width:240px;max-height:min(70vh,520px);overflow:auto;background:var(--surface);border-radius:var(--rayon);box-shadow:var(--ombre);padding:12px;z-index:60}
.pop-menu{left:auto;right:0;min-width:260px;padding:8px}
.pop-menu a{display:block;padding:10px 12px;border-radius:10px;text-decoration:none;font-size:.95rem}
.pop-menu a:hover,.pop-liste a:hover{background:var(--gris)}
.pop-menu .menu-fort{font-weight:700}
.pop-menu hr{border:0;border-top:1px solid var(--filet);margin:8px 0}
.pop-titre{font:700 .75rem var(--titre);text-transform:uppercase;letter-spacing:.06em;color:var(--doux);padding:6px 12px}
.pop-liste a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;text-decoration:none;font-size:.95rem}
.pop-liste svg{fill:none;stroke:var(--doux);stroke-width:2}

/* Barre des catégories */
.cats-bar{position:sticky;top:var(--h-bar);z-index:40;background:var(--surface);border-bottom:1px solid var(--filet);display:flex;align-items:center;gap:16px;padding:0 max(40px,calc((100% - var(--max)) / 2 + 40px))}
.cats{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1;padding-top:12px}
.cats::-webkit-scrollbar{display:none}
.cat{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 16px 12px;text-decoration:none;color:var(--doux-fort);font:600 .8rem var(--titre);white-space:nowrap;border-bottom:2px solid transparent}
.cat .ligne{width:30px;height:30px;font-size:.9rem}
.cat:hover{color:var(--encre);border-bottom-color:var(--filet);opacity:1}
.cat.actif{color:var(--encre);border-bottom-color:var(--encre);opacity:1}
.filtres-wrap{position:relative;flex:none}
.btn-filtres{display:flex;align-items:center;gap:8px;border:1px solid var(--filet);border-radius:12px;background:var(--surface);padding:10px 14px;font:600 .85rem var(--titre)}
.btn-filtres:hover{border-color:var(--encre)}
.pop-filtres{left:auto;right:0;min-width:300px}
.pop-filtres input[type=range]{width:100%;accent-color:var(--encre);margin:10px 0}
.pop-note{font-size:.82rem;color:var(--doux)}
.rayon{font-size:.95rem}

/* En-tête d'une liste : titre et introduction à gauche, agenda des jours à droite (sous le texte sur mobile). */
html{scroll-behavior:smooth}
/* Le texte garde sa largeur naturelle ; l'agenda se centre, dans les deux sens, dans tout l'espace blanc restant à droite. */
.entete-liste{display:grid;grid-template-columns:minmax(0,78ch) minmax(0,1fr);gap:16px 40px;align-items:center}
.entete-liste .entete-texte{min-width:0}
.agenda-jours{width:min(100%,400px);justify-self:center;align-self:center;border:1px solid var(--filet);border-radius:var(--rayon);padding:14px 14px 12px;background:var(--surface)}
.agenda-titre{font:700 .75rem var(--titre);text-transform:uppercase;letter-spacing:.06em;color:var(--doux);margin-bottom:10px}
.agenda-grille{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.jour-btn{display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 0 5px;border-radius:12px;border:1px solid var(--filet);text-decoration:none;color:var(--encre);background:var(--surface);line-height:1.1}
a.jour-btn:hover{border-color:var(--encre);box-shadow:var(--ombre-douce)}
.jour-dow{font:600 .75rem var(--titre);text-transform:uppercase;color:var(--doux)}
.jour-num{font:700 1.02rem var(--titre)}
.jour-nb{font:700 .68rem var(--mono);background:var(--accent-fond);color:var(--accent-texte);border-radius:999px;min-width:22px;padding:1px 6px;text-align:center}
.jour-btn.aujourdhui{border-color:var(--l2);box-shadow:inset 0 0 0 1px var(--l2)}
.jour-btn.jour-vide{opacity:.75;background:var(--gris)}
.jour-btn.jour-vide .jour-nb{background:var(--filet);color:var(--doux)}
.jour-btn.hors-liste{border-style:dashed}
.jour-bloc:target .jour-titre{color:var(--lien-bleu)}
@media (max-width:1000px){.entete-liste{grid-template-columns:1fr}.agenda-jours{margin:8px auto 0}}

/* Contenu */
.conteneur{max-width:var(--max);margin:0 auto;padding:24px 40px 56px}
.conteneur.etroit{max-width:880px}
.fil{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.84rem;color:var(--doux);margin-bottom:12px}
.fil a{text-decoration:none}.fil a:hover{text-decoration:underline}
.titre-page{font:700 clamp(1.7rem,3vw,2.3rem)/1.15 var(--titre);letter-spacing:-.03em;color:var(--encre)}
.titre-page.grand{font-size:clamp(2rem,5vw,3.4rem)}
.intro{color:var(--doux);margin-top:10px;max-width:78ch}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--filet);border-radius:999px;padding:8px 16px;text-decoration:none;font:600 .88rem var(--titre);background:var(--surface)}
.chip:hover{border-color:var(--encre)}
.chip.actif{background:var(--accent-fond);color:var(--accent-texte);border-color:var(--accent-fond)}
.chip .ligne{width:22px;height:22px;font-size:.72rem}
.compte{font:500 .9rem var(--titre);color:var(--texte);margin-top:24px}
.bloc{margin-top:48px}
.bloc h2{font:700 1.45rem var(--titre);letter-spacing:-.02em;color:var(--encre);margin-bottom:16px}
.bloc-tete{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.bloc-tete h2{margin:0}
.lien-voir{margin-top:12px}.lien-voir a{display:inline-flex;align-items:center;gap:4px;font-weight:700;text-decoration:underline}
.lien-voir svg{fill:none;stroke:currentColor;stroke-width:2}

/* Grille de cartes */
.jour-titre{font:700 1.3rem var(--titre);letter-spacing:-.02em;color:var(--encre);margin:36px 0 16px}
/* Six cartes par ligne sur grand écran, puis 4, 3, 2 et 1 selon la largeur. Toutes les cartes ont la même taille. */
.grille{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:32px 16px;align-items:stretch}
.grille-3{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
@media (max-width:1099px){.grille:not(.grille-3){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:819px){.grille:not(.grille-3){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.grille:not(.grille-3){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:339px){.grille:not(.grille-3){grid-template-columns:1fr}}
.carte-item{min-width:0;display:flex}
.carte{position:relative;display:flex;flex-direction:column;width:100%}
.carte-lien{display:flex;flex-direction:column;flex:1;text-decoration:none;color:inherit}
/* Case carrée. L'image complète (proportions d'origine, rien n'est coupé) est centrée ; si elle ne remplit pas la case,
   une copie agrandie et floutée occupe le fond. */
.photo{position:relative;aspect-ratio:1/1;border-radius:var(--rayon);overflow:hidden;background:var(--gris);flex:none;isolation:isolate}
.photo img{position:relative;width:100%;height:100%;object-fit:contain}
.photo .photo-img{transition:transform .5s cubic-bezier(.22,.61,.36,1);transform:translateZ(0)}
.photo .photo-fond{position:absolute;inset:0;object-fit:cover;filter:blur(14px) brightness(.96);transform:scale(1.3);transition:none}
/* Zoom au survol : sur l'image nette seulement (le fond flou ne bouge pas), couche d'affichage dédiée pendant l'animation. */
.carte:hover .photo-img{transform:scale(1.04) translateZ(0);will-change:transform}
.photo-vide{display:grid;place-items:center;width:100%;height:100%;background:var(--gris);background:color-mix(in srgb,var(--c,#5B6B7B) 14%,var(--surface))}
.photo-vide svg{width:72px;height:72px;fill:none;stroke:var(--c,#5B6B7B);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.7}
.photo-vide.grand{aspect-ratio:16/8;border-radius:var(--rayon)}
.etiquette{position:absolute;top:12px;left:12px;z-index:2;background:var(--verre);-webkit-backdrop-filter:blur(10px) saturate(1.5);backdrop-filter:blur(10px) saturate(1.5);border:1px solid var(--verre-bord);color:var(--encre);font:700 .78rem var(--titre);padding:5px 10px;border-radius:999px;box-shadow:0 2px 10px rgba(14,27,43,.14);white-space:nowrap}
.etiquette-gratuit{color:var(--vert-texte)}
/* Au-dessus de l'image : type et date avec l'heure (hauteur fixe : toutes les images s'alignent). Sous l'image : titre puis lieu. Tout est centré. */
.carte-entete{height:2em;margin-bottom:-8px;display:flex;align-items:flex-end;justify-content:center;text-align:center;font-size:.88rem;line-height:1.3;color:var(--doux)}
.carte-type{display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;overflow:hidden;color:var(--doux);font-size:.82rem;font-weight:600}
.photo .carte-type{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);z-index:2;max-width:calc(100% - 20px);margin:0;padding:4px 10px;background:var(--verre);-webkit-backdrop-filter:blur(10px) saturate(1.5);backdrop-filter:blur(10px) saturate(1.5);border:1px solid var(--verre-bord);color:var(--encre);border-radius:999px;box-shadow:0 2px 10px rgba(14,27,43,.14);font-size:.78rem}
.carte-type>span:last-child{overflow:hidden;text-overflow:ellipsis}
.carte-type .ligne{width:18px;height:18px;font-size:.62rem}
.carte-texte{padding-top:10px;flex:1;text-align:center}
.carte-titre{height:2.6em;margin:0 0 2px}
.carte-titre{font:700 .98rem/1.3 var(--titre);color:var(--encre);display:flex;align-items:center;justify-content:center;overflow:hidden}
.carte-titre>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.carte-lieu{color:var(--doux);font-size:.88rem;margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.carte-quand{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:92%;padding:3px 14px 12px;border-radius:12px 12px 0 0;background:color-mix(in srgb,var(--c,#5B6B7B) 16%,var(--surface));color:var(--encre)}
.carte .photo{z-index:1}
.non-comm{font-size:.82rem;opacity:.85}
.heure{font-family:var(--mono);font-weight:700;color:var(--encre)}
/* Cœur des favoris : au-dessus de l'affiche (qui a son propre z-index), sur une pastille vitrée lisible sur toute photo. */
.coeur{position:absolute;z-index:3;top:calc(1.5 * .9rem + 20px);right:10px;width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--verre-bord);background:var(--verre);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 10px rgba(14,27,43,.14);padding:0;border-radius:50%}
.coeur svg{width:20px;height:20px;fill:transparent;stroke:var(--encre);stroke-width:2;transition:transform .15s}
.coeur:hover svg{transform:scale(1.12)}
.coeur[aria-pressed=true] svg{fill:var(--l1);stroke:var(--l1)}
.coeur-fiche{position:static;border:1px solid var(--bord-champ);flex:none;width:44px;height:44px;background:var(--surface);box-shadow:none}
.coeur-fiche svg{fill:var(--surface);stroke:var(--encre)}
.coeur-fiche[aria-pressed=true] svg{fill:var(--l1);stroke:var(--l1)}

/* Carrousel de lieux */
.carrousel{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px 12px}
.carrousel::-webkit-scrollbar{display:none}
.carrousel li{flex:0 0 min(240px,72vw);scroll-snap-align:start}
.fleches{display:flex;gap:8px}
.fleches button{width:34px;height:34px;border-radius:50%;border:1px solid var(--filet);background:var(--surface);font-size:1.2rem;line-height:1}
.fleches button:hover{border-color:var(--encre);box-shadow:var(--ombre-douce)}
.lieu-carte{display:flex;flex-direction:column;gap:4px;text-decoration:none;height:100%}
.lieu-fond{display:grid;align-items:end;aspect-ratio:3/2;border-radius:var(--rayon);padding:14px;color:#fff;font:700 .78rem var(--titre);text-transform:uppercase;letter-spacing:.08em;background:linear-gradient(145deg,var(--l6),#0E1B2B)}
.k-cinema .lieu-fond{background:linear-gradient(145deg,var(--l2),#0E1B2B)}
.k-theatre .lieu-fond{background:linear-gradient(145deg,var(--l1),#0E1B2B)}
.k-concert-hall .lieu-fond{background:linear-gradient(145deg,var(--l3),#0E1B2B)}
.k-arts-centre .lieu-fond{background:linear-gradient(145deg,var(--l5),#0E1B2B)}
.lieu-carte b{font:700 .98rem/1.3 var(--titre);color:var(--encre);margin-top:6px}
.lieu-carte small{color:var(--doux);font-size:.85rem}
.lieux-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px 16px}

/* FAQ, texte, états vides */
.faq details{border-top:1px solid var(--filet);padding:16px 0}
.faq details:last-child{border-bottom:1px solid var(--filet)}
.faq summary{font:700 1rem var(--titre);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:"+";font:400 1.4rem/1 var(--titre)}
.faq details[open] summary::after{content:"−"}
.faq p{color:var(--doux);margin-top:8px;max-width:78ch}
.vide,.vide-bloc{margin-top:32px;padding:32px;border:1px dashed var(--filet);border-radius:var(--rayon);color:var(--doux)}
.vide-bloc h2{color:var(--encre);margin-bottom:8px}
.texte{margin-top:24px;max-width:72ch}
.texte h2{font:700 1.25rem var(--titre);color:var(--encre);margin:32px 0 10px}
.texte p,.texte ul{margin-top:12px}
.texte ul{list-style:disc;padding-left:22px}.texte li{margin-top:6px}
.texte pre,.texte code{font-family:var(--mono);font-size:.88rem;background:var(--gris);border-radius:8px}
.texte code{padding:2px 6px}.texte pre{padding:14px;overflow:auto}
.grand-texte{font:700 1.4rem var(--titre)}
.liste-plan{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px}.liste-plan a{text-decoration:underline}
.alerte{background:var(--alerte-fond);border-radius:12px;padding:12px 16px;margin:16px 0}

/* Fiche d'une sortie ou d'un lieu */
.fiche-photo{position:relative;margin-top:8px;border-radius:var(--rayon);overflow:hidden;background:var(--gris);height:clamp(260px,46vw,520px)}
.fiche-photo img{position:relative;width:100%;height:100%;object-fit:contain}
.fiche-photo .photo-fond{position:absolute;inset:0;object-fit:cover;filter:blur(18px) brightness(.96);transform:scale(1.3)}
.fiche-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-top:20px}
.fiche-genre{display:flex;align-items:center;gap:8px;font:600 .9rem var(--titre);color:var(--doux);margin-bottom:6px}
.fiche-genre a{text-decoration:none}.fiche-genre a:hover{text-decoration:underline}
.fiche-infos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:24px;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);padding:20px 0}
.fiche-infos dt{font:700 .75rem var(--titre);text-transform:uppercase;letter-spacing:.06em;color:var(--doux)}
.fiche-infos dd{margin-top:4px}
.fiche-infos small{color:var(--doux)}
.fiche-texte{margin-top:24px;max-width:72ch}
.fiche-cta{margin-top:24px}
.fiche-note{color:var(--doux);font-size:.84rem;margin-top:10px}
.btn-principal{display:inline-block;background:var(--accent-fond);color:var(--accent-texte);text-decoration:none;font:700 1rem var(--titre);padding:14px 24px;border-radius:12px}
.btn-principal:hover{background:var(--accent-survol)}

/* Accueil */
.accueil-hero{padding:24px 0 8px}
.villes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:900px){.villes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.villes{grid-template-columns:1fr}}
.ville-carte{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:200px;padding:20px;border-radius:var(--rayon);color:#fff;text-decoration:none;background:linear-gradient(145deg,var(--c),#0E1B2B 150%)}
.ville-carte img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:var(--filtre-photo);transition:transform .4s}
.ville-carte::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,27,43,0) 35%,rgba(14,27,43,.78))}
.ville-carte>span{position:relative;z-index:1}
.ville-carte:hover{box-shadow:var(--ombre)}
.ville-carte:hover img{transform:scale(1.05)}
/* Photos : couleurs atténuées partout */
.photo img,.fiche-photo img,.peek img,.ville-bandeau img{filter:var(--filtre-photo)}
.ville-bandeau{position:relative;margin:0 0 20px;border-radius:var(--rayon);overflow:hidden;background:var(--gris);height:clamp(150px,22vw,260px)}
.ville-bandeau img{width:100%;height:100%;object-fit:cover}
.ville-bandeau figcaption{position:absolute;right:10px;bottom:8px;background:rgba(14,27,43,.62);color:#fff;font-size:.75rem;padding:3px 8px;border-radius:999px}
.ville-bandeau figcaption a{text-decoration:underline}
.credits li{margin-top:6px}
.v1{--c:var(--l1)}.v2{--c:var(--l2)}.v3{--c:var(--l3)}.v4{--c:var(--l4)}.v5{--c:var(--l5)}.v6{--c:var(--l6)}
.ville-nom{font:700 1.5rem var(--titre);letter-spacing:-.02em}
.ville-info{font:500 .82rem var(--mono);opacity:.92}
.etapes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.etapes li{border:1px solid var(--filet);border-radius:var(--rayon);padding:20px;color:var(--doux)}
.etapes b{color:var(--encre);display:block;margin-bottom:6px}

/* Bouton flottant et vue carte */
.pill-carte{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:45;display:flex;align-items:center;gap:8px;background:var(--accent-fond);color:var(--accent-texte);border:0;border-radius:999px;padding:14px 22px;font:700 .95rem var(--titre);box-shadow:var(--ombre)}
.pill-carte:hover{transform:translateX(-50%) scale(1.04)}
body.carte-ouverte{overflow:hidden}
body.carte-ouverte .pill-carte{z-index:80}
.vue-carte{position:fixed;left:0;right:0;top:var(--h-bar);bottom:0;z-index:70;background:var(--surface);display:grid;grid-template-columns:var(--vc-liste,46%) 10px 1fr}
.vc-liste{overflow-y:auto;padding:20px 24px 110px}
.vc-liste .grille{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:24px 14px} /* cartes lisibles : 2 colonnes, 3 si la liste est élargie */
.vc-liste .jour-titre{margin:20px 0 12px;font-size:1.05rem}
.vc-sep{cursor:col-resize;background:var(--surface);border-left:1px solid var(--filet);border-right:1px solid var(--filet);position:relative;touch-action:none}
.vc-sep::after{content:"";position:absolute;left:50%;top:50%;width:4px;height:44px;border-radius:2px;background:var(--filet);transform:translate(-50%,-50%)}
.vc-sep:hover::after,.vc-sep:focus-visible::after{background:var(--encre)}
.vc-carte{position:relative;min-width:0}
#plan{width:100%;height:100%;background:#E3EAF2}
.leaflet-container{font-family:var(--titre)}
.pin-wrap{background:none;border:0}
.pin{position:absolute;left:0;top:0;transform:translate(-50%,-50%);background:#fff;color:#0E1B2B;border-radius:999px;box-shadow:0 1px 4px rgba(14,27,43,.35);font:700 .78rem/1 var(--titre);padding:7px 10px;white-space:nowrap;border:1px solid rgba(14,27,43,.12);border-left:5px solid var(--c);text-align:center;cursor:pointer}
.pin:hover{background:#F5F7F9}
.pin svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.peek-vide{display:grid;place-items:center}
.peek-vide svg{width:38px;height:38px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pin.actif{background:#0E1B2B;color:#fff;transform:translate(-50%,-50%) scale(1.12)}
.vc-liste .carte-item.actif .photo{outline:3px solid var(--encre);outline-offset:2px}
.peek{position:absolute;left:16px;bottom:16px;width:min(360px,calc(100% - 32px));background:var(--surface);border-radius:var(--rayon);box-shadow:var(--ombre);overflow:hidden;z-index:500}
.peek a{display:grid;grid-template-columns:110px 1fr;text-decoration:none}
.peek img,.peek-vide{width:110px;height:100%;min-height:104px;object-fit:cover;background:linear-gradient(145deg,var(--c,var(--l6)),#0E1B2B)}
.peek-texte{padding:12px 14px}
.peek-texte b{display:block;font:700 .95rem/1.25 var(--titre);color:var(--encre)}
.peek-texte span{display:block;color:var(--doux);font-size:.84rem;margin-top:3px}
.peek-fermer{position:absolute;top:6px;right:6px;width:28px;height:28px;border:0;border-radius:50%;background:var(--surface);color:var(--encre);box-shadow:var(--ombre-douce);font-size:1rem;line-height:1}

/* Pied de page */
.pied-site{background:var(--gris);border-top:1px solid var(--filet);margin-top:24px;padding:48px 0 32px;color:var(--doux);font-size:.9rem}
.pied-in{max-width:var(--max);margin:0 auto;padding:0 40px}
.pied-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.pied-liens{display:flex;flex-wrap:wrap;gap:0 24px;margin-top:28px;font:700 .9rem var(--titre);color:var(--encre)}
.pied-site h2{font:700 .9rem var(--titre);color:var(--encre);margin-bottom:12px}
.pied-site li{margin-top:8px}
.pied-site a{text-decoration:none}.pied-site a:hover{text-decoration:underline}
.pied-seo{border-top:1px solid var(--filet);margin-top:32px;padding-top:20px;display:grid;gap:8px}
.pied-seo a{margin-right:10px}.pied-seo b{color:var(--encre);margin-right:6px}
.pied-bas{border-top:1px solid var(--filet);margin-top:24px;padding-top:20px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:.84rem}

/* Écrans moyens et mobiles */
@media (max-width:820px){.pied-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.pied-cols{grid-template-columns:1fr}}
@media (max-width:1100px){
  .pastille .seg{padding:6px 12px}
  .lien-haut{display:none}
}
@media (max-width:900px){
  :root{--h-bar:64px;--h-cats:86px}
  .bar-in{grid-template-columns:auto 1fr auto;padding:0 16px;height:auto;min-height:var(--h-bar);gap:8px}
  .logo span{display:none}
  .pastille{justify-self:stretch;min-width:0;padding:4px 4px 4px 6px}
  .seg-wrap{flex:1;min-width:0;position:static}
  .seg{padding:5px 8px;max-width:none;width:100%}
  .seg b{max-width:100%;font-size:.8rem}
  .seg small{font-size:.62rem}
  .loupe{width:40px;height:40px}
  .pop{position:fixed;left:12px;right:12px;top:calc(var(--h-bar) + 8px);min-width:0;max-height:70vh}
  .pop-menu{left:12px;right:12px}
  .cats-bar{padding:0 8px}
  .cat{padding:4px 10px 10px}
  .btn-filtres span{display:none}.btn-filtres{padding:10px}
  .conteneur{padding:16px 16px 48px}
  .grille{gap:24px 12px}
  .vue-carte{grid-template-columns:1fr}
  .vc-liste,.vc-sep{display:none}
  .peek{left:12px;right:12px;width:auto;bottom:84px}
  .pied-in{padding:0 16px}
}
@media (max-width:420px){
  .photo{aspect-ratio:4/3}
  .photo:has(.photo-vide){aspect-ratio:16/7}
}
@media (max-width:520px){
  .titre-page.grand{font-size:2rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.jour-partiel{margin-left:8px;font:500 .72rem var(--mono);color:var(--doux);vertical-align:middle}

.photo-credit{position:absolute;right:10px;bottom:8px;z-index:2;margin:0;max-width:calc(100% - 20px);background:rgba(14,27,43,.72);color:#fff;font-size:.75rem;padding:3px 8px;border-radius:999px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.photo-credit a{text-decoration:underline}

/* Signature visuelle : s'éloigne du gabarit « annonces » avec une forme de tuile en feuille (coins opposés très arrondis, deux autres presque droits),
   une barre de couleur par catégorie, des badges en verre plus transparent. */
:root{--forme:28px 6px 28px 6px}
.photo,.fiche-photo,.ville-bandeau,.photo-vide.grand{border-radius:var(--forme)}
.photo{aspect-ratio:4/5}
.carte-quand{border-radius:14px 14px 0 0}
.carte-texte::before{content:"";display:block;width:28px;height:3px;border-radius:3px;background:var(--c,var(--encre));margin:0 auto 9px}
.carte-titre{font-weight:800;letter-spacing:-.012em}
.etiquette,.photo .carte-type{background:var(--verre);-webkit-backdrop-filter:blur(12px) saturate(1.6) brightness(1.12);backdrop-filter:blur(12px) saturate(1.6) brightness(1.12);border-color:var(--verre-bord);box-shadow:0 2px 12px rgba(14,27,43,.12)}
.chip{border-radius:12px 4px 12px 4px}
.btn-filtres{border-radius:12px 4px 12px 4px}
.photo .carte-type{font-size:.7rem;gap:5px;padding:3px 9px 3px 4px}
.photo .carte-type .ligne{width:16px;height:16px}

/* Groupes de sorties sur la carte (nombre de sorties regroupées) */
.groupe{position:absolute;left:0;top:0;transform:translate(-50%,-50%);display:grid;place-items:center;min-width:38px;height:38px;padding:0 6px;border-radius:50%;background:#0E1B2B;color:#fff;border:3px solid rgba(255,255,255,.85);box-shadow:0 2px 8px rgba(14,27,43,.4);font:700 .85rem/1 var(--titre);cursor:pointer}
.groupe:hover{background:var(--l1)}
.groupe-xl{min-width:46px;height:46px;font-size:.95rem}

/* Fiche d'une sortie : « Au même endroit » et « Le même jour », quatre cartes par ligne */
.grille-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:640px){.grille-4{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Police des titres et du logo : Bricolage Grotesque (sans-serif net et reconnaissable, très lisible), hébergée sur le site. Le texte courant garde la police système. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600 800;font-display:swap;src:url(/fonts/bricolage-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600 800;font-display:swap;src:url(/fonts/bricolage-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--display:'Bricolage Grotesque','Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif}
.titre-page,.bloc h2,.jour-titre,.texte h2,.peek-texte>b,.lieu-carte b,.logo{font-family:var(--display);letter-spacing:-.015em}
.titre-page,.logo{font-weight:800}
.carte-titre{font-family:var(--display);font-weight:700;font-size:1.02rem;line-height:1.22;letter-spacing:-.005em}

/* Accessibilité : lisibilité des étiquettes sur les images (fond blanc à 82 %, contraste d'au moins 7:1 quelle que soit la photo),
   cibles d'au moins 24 px de haut (WCAG 2.2), contraste du texte blanc sur le fond orange des lieux. */
.etiquette,.photo .carte-type{background:var(--verre);-webkit-backdrop-filter:blur(10px) saturate(1.5);backdrop-filter:blur(10px) saturate(1.5);border-color:var(--verre-bord);color:var(--encre)}
.etiquette{font-size:.8rem}
.photo .carte-type{font-size:.74rem;font-weight:700}
.etiquette-gratuit{color:var(--vert-texte)} /* 7:1 sur blanc, 5,6:1 sur photo noire */
.carte-quand{background:color-mix(in srgb,var(--c,#5B6B7B) 22%,var(--surface))}
.k-arts-centre .lieu-fond{background:linear-gradient(145deg,var(--l5),#0E1B2B)}
.fil a,.pied-site li a,.pop-liste a,.pied-liens a,.pied-seo a,.pied-bas a{display:inline-block;padding:6px 2px}
.pied-site p a{display:inline-block;padding:4px 3px}
.faq summary{padding:6px 0;min-height:44px;align-items:center}

/* Tactile : cibles de 44 px pour le cœur et le bouton Filtres, indice de défilement sur la barre des catégories. */
@media (pointer:coarse){.coeur{width:44px;height:44px;top:calc(1.5 * .9rem + 14px);right:4px}.btn-filtres{min-width:44px;min-height:44px;justify-content:center}}
@media (max-width:900px){.cats{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}}

/* Accueil : villes avec accès direct aux moments, grille des moments */
.ville-bloc{display:flex;flex-direction:column;gap:8px}
.ville-liens{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.ville-liens a{display:inline-flex;align-items:center;min-height:32px;padding:4px 12px;border:1px solid var(--filet);border-radius:12px 4px 12px 4px;font:600 .82rem var(--titre);text-decoration:none;color:var(--encre);background:var(--surface)}
.ville-liens a:hover{border-color:var(--encre)}
.moments{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px 20px}
.moments h3{font:700 1rem var(--display);color:var(--encre);margin-bottom:8px}
.moments ul{list-style:none;padding:0;margin:0}
.moments li a{display:inline-block;padding:4px 0;font-size:.9rem;text-decoration:none;color:var(--doux)}
.moments li a:hover{color:var(--encre);text-decoration:underline}
.bloc .intro + .grille{margin-top:22px}

/* Habillage : fond en motif des trois barres du logo (très discret), halos de couleur, ombres légères, héros de l'accueil */
:root{--ombre-carte:0 1px 2px rgba(14,27,43,.08),0 8px 20px -6px rgba(14,27,43,.18)}
body{background-color:var(--fond-page);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='168' height='168' viewBox='0 0 168 168'%3E%3Cg fill-opacity='.075'%3E%3Crect x='14' y='18' width='9' height='44' rx='4.5' fill='%23E4002B'/%3E%3Crect x='28' y='30' width='9' height='32' rx='4.5' fill='%230072CE'/%3E%3Crect x='42' y='8' width='9' height='54' rx='4.5' fill='%23F2B705'/%3E%3Crect x='98' y='96' width='9' height='50' rx='4.5' fill='%23E4002B'/%3E%3Crect x='112' y='84' width='9' height='62' rx='4.5' fill='%230072CE'/%3E%3Crect x='126' y='108' width='9' height='38' rx='4.5' fill='%23F2B705'/%3E%3C/g%3E%3C/svg%3E"),radial-gradient(900px 420px at 0 0,rgba(228,0,43,.05),transparent 70%),radial-gradient(900px 420px at 100% 0,rgba(0,114,206,.06),transparent 70%);background-size:168px 168px,auto,auto;background-repeat:repeat,no-repeat,no-repeat}
.bar{box-shadow:0 1px 0 var(--filet),0 6px 18px -10px rgba(14,27,43,.25)}
.cats-bar{box-shadow:0 8px 16px -14px rgba(14,27,43,.3)}
.photo{box-shadow:var(--ombre-carte)}
.carte:hover .photo{box-shadow:0 2px 4px rgba(14,27,43,.1),0 14px 28px -8px rgba(14,27,43,.28)}
.chip,.btn-filtres,.ville-liens a{box-shadow:0 1px 2px rgba(14,27,43,.06)}
.agenda-jours,.etapes li,.fiche-photo,.ville-bandeau{box-shadow:var(--ombre-carte)}
.agenda-jours,.etapes li{background:var(--surface)}
.faq{background:var(--surface);border-radius:var(--rayon);padding:4px 24px;box-shadow:var(--ombre-carte)}
.faq details:first-child{border-top:0}.faq details:last-child{border-bottom:0}
.ville-carte{box-shadow:0 2px 4px rgba(14,27,43,.1),0 12px 24px -10px rgba(14,27,43,.35)}

.bouton{display:inline-flex;align-items:center;min-height:44px;padding:10px 20px;border-radius:14px 5px 14px 5px;background:var(--accent-fond);color:var(--accent-texte);font:700 .95rem var(--titre);text-decoration:none;box-shadow:0 6px 14px -6px rgba(14,27,43,.5)}
.bouton:hover{background:var(--accent-survol)}
.bouton-clair{background:var(--surface);color:var(--encre);border:1px solid var(--filet);box-shadow:0 1px 2px rgba(14,27,43,.08)}
.bouton-clair:hover{background:var(--gris)}

.accueil-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:24px;align-items:center;padding:44px 48px;margin-top:8px;border-radius:var(--forme);background:linear-gradient(120deg,var(--surface) 0%,var(--surface) 55%,var(--surface-2) 100%);box-shadow:0 2px 4px rgba(14,27,43,.06),0 18px 40px -16px rgba(14,27,43,.28);overflow:hidden;position:relative}
.accueil-hero .titre-page.grand{font-size:clamp(2.4rem,5.4vw,4.2rem);line-height:1.02;letter-spacing:-.03em}
.surligne{background:linear-gradient(transparent 62%,var(--surligne) 62%,var(--surligne) 92%,transparent 92%);padding:0 .08em}
.hero-sous{margin-top:14px;font-size:1.15rem;color:var(--texte);max-width:34ch}
.hero-chiffres{margin-top:12px;font:500 .85rem var(--mono);color:var(--doux)}
.hero-chiffres b{color:var(--encre)}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hero-barres{display:flex;align-items:flex-end;justify-content:center;gap:16px;min-height:250px}
.barre{position:relative;width:64px;border-radius:999px;display:block;box-shadow:0 14px 26px -10px rgba(14,27,43,.45)}
.barre .ligne{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:44px;height:44px;background:var(--surface);box-shadow:0 2px 6px rgba(14,27,43,.2);color:var(--c)}
.barre .ligne svg{width:56%;height:56%}
.b1{height:210px;background:linear-gradient(180deg,#F0304F,#E4002B)}
.b2{height:250px;background:linear-gradient(180deg,#2A93E6,#0072CE);transform:translateY(-8px)}
.b3{height:170px;background:linear-gradient(180deg,#F8CB3B,#F2B705)}
.b1 .ligne{--c:var(--l1)}.b2 .ligne{--c:var(--l2)}.b3 .ligne{--c:var(--l5)}
@media (max-width:820px){.accueil-hero{grid-template-columns:1fr;padding:28px 22px}.hero-barres{display:none}}

/* Vague sur les lettres du titre d'accueil (voir app.js) */
.vague-lettre{display:inline-block;animation:vague 1.1s cubic-bezier(.3,.7,.4,1) 1 both}
@keyframes vague{0%{transform:translateY(0)}30%{transform:translateY(-.22em)}60%{transform:translateY(.06em)}100%{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.vague-lettre{animation:none}}

/* Les trois barres de l'accueil battent doucement en boucle une fois la vague du titre passée (classe posée par app.js) */
@keyframes rythme1{0%,100%{height:210px}22%{height:221px}48%{height:206px}74%{height:216px}}
@keyframes rythme2{0%,100%{height:250px}26%{height:239px}52%{height:260px}78%{height:246px}}
@keyframes rythme3{0%,100%{height:170px}20%{height:180px}46%{height:165px}72%{height:177px}}
.hero-barres.en-rythme .b1{animation:rythme1 2.4s ease-in-out infinite}
.hero-barres.en-rythme .b2{animation:rythme2 2.4s ease-in-out -.8s infinite}
.hero-barres.en-rythme .b3{animation:rythme3 2.4s ease-in-out -1.6s infinite}
@media (prefers-reduced-motion:reduce){.hero-barres.en-rythme .barre{animation:none}}

.fiche-dates .dates-mois{margin:18px 0 8px;font:700 1rem var(--titre)}
.dates-liste{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.date-puce{display:inline-block;padding:7px 12px;border:2px solid var(--encre);border-radius:999px;font:600 .9rem var(--titre);color:var(--encre);text-decoration:none;background:var(--surface)}
a.date-puce:hover,a.date-puce:focus-visible{background:var(--accent-fond);color:var(--accent-texte)}
.date-puce.actuelle{background:var(--accent-fond);color:var(--accent-texte)}

/* Recherche par mots-clés (accueil et page /recherche) */
.recherche{margin-top:22px;max-width:640px}
.recherche-champ{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 16px;background:var(--surface);border:2px solid var(--encre);border-radius:18px 6px 18px 6px;box-shadow:0 8px 20px -10px rgba(14,27,43,.45)}
.recherche-champ:focus-within{box-shadow:0 0 0 4px rgba(0,114,206,.25),0 8px 20px -10px rgba(14,27,43,.45)}
.recherche-loupe{display:inline-flex;color:var(--doux);flex:none}
.recherche-loupe svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.recherche-champ input[type=search]{flex:1;min-width:0;border:0;outline:0;background:transparent;font:500 1.05rem var(--titre);color:var(--encre);padding:12px 0;-webkit-appearance:none;appearance:none}
.recherche-champ input[type=search]::placeholder{color:var(--doux);opacity:1}
.recherche-envoi{border:0;cursor:pointer;flex:none}
.recherche-options{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:12px}
.recherche-ville{position:relative;display:inline-block}
.recherche-ville select{min-height:40px;padding:6px 40px 6px 14px;border:1px solid var(--bord-champ);border-radius:999px;background:var(--surface);font:600 .88rem var(--titre);color:var(--encre);cursor:pointer;-webkit-appearance:none;appearance:none}
.recherche-ville::after{content:"";position:absolute;right:18px;top:50%;width:7px;height:7px;border:solid var(--doux);border-width:0 2px 2px 0;transform:translateY(-70%) rotate(45deg);pointer-events:none}
.bascule{display:inline-flex;margin:0;padding:3px;border:1px solid var(--bord-champ);border-radius:999px;background:var(--gris)}
.bascule label{position:relative;cursor:pointer}
.bascule input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.bascule span{display:inline-block;padding:7px 14px;border-radius:999px;font:600 .86rem var(--titre);color:var(--doux)}
.bascule input:checked+span{background:var(--accent-fond);color:var(--accent-texte)}
.bascule input:focus-visible+span{outline:3px solid var(--focus);outline-offset:1px}
.recherche-idees{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px;font:600 .88rem var(--titre);color:var(--texte)}
.recherche-idees .chip{padding:5px 12px;font-size:.82rem}
.recherche-grand{margin-top:26px}
.page-recherche .recherche{max-width:760px;margin-top:16px}
.recherche-resume{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin-top:26px}
.recherche-compris{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font:500 .85rem var(--mono);color:var(--doux)}
.chip-compris{background:var(--gris);padding:6px 12px}
.chip-compris b{font-size:1.05rem;line-height:1;color:var(--doux)}
.chip-compris:hover b{color:var(--l1)}
.recherche-ou{margin-left:4px}
.bascule-resultats{display:flex;gap:8px}
.chip-nb{background:var(--accent-fond);color:var(--accent-texte);border-radius:999px;padding:0 8px;font:700 .75rem var(--mono);min-width:22px;text-align:center}
.chip.actif .chip-nb{background:var(--accent-texte);color:var(--accent-fond)}
.carte-dates{font:600 .78rem var(--mono);color:var(--lien-bleu);margin-top:2px}
@media (max-width:560px){
  .recherche-envoi{padding:10px 14px}
  .recherche-champ input[type=search]{font-size:1rem}
}

/* Cartes : trait de couleur au-dessus de l'affiche, date et heure en pastille discrète dessous (l'heure seule dans les listes par jour) */
.carte-entete{height:auto;margin:0 0 10px;display:block}
.carte-entete::before{content:"";display:block;width:36px;height:4px;border-radius:4px;background:var(--c,var(--encre));margin:0 auto;transition:width .25s ease}
.carte:hover .carte-entete::before{width:52px}
.carte-texte::before{content:none}
.carte-texte{padding-top:6px}
.carte-horaire{display:flex;justify-content:center;align-items:center;min-height:26px;margin-top:10px}
.carte-quand{display:inline-block;max-width:94%;padding:2px 11px;border-radius:999px;background:color-mix(in srgb,var(--c,#5B6B7B) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--c,#5B6B7B) 20%,var(--surface));font-size:.8rem;line-height:1.45;color:var(--doux)}
.carte-quand .heure{font-size:.82rem}

/* La pastille de date et d'heure se glisse sous le bas de l'affiche (l'affiche passe devant) */
.carte-horaire{margin-top:-14px;min-height:40px;align-items:flex-start;position:relative}
.carte-quand{padding:17px 13px 3px;border-top:0;border-radius:0 0 14px 14px}
.carte-texte{padding-top:2px}

/* Accessibilité : taille du texte (boutons A-, A, A+) et retour en haut de page */
.taille-texte{display:flex;align-items:center;gap:6px;padding:4px 12px}
.taille-titre{font:700 .75rem var(--titre);text-transform:uppercase;letter-spacing:.06em;color:var(--doux);margin-right:auto;padding-right:8px}
.taille-btn{min-width:40px;height:40px;padding:0 10px;border:1px solid var(--bord-champ);border-radius:12px;background:var(--surface);color:var(--encre);font:700 1rem var(--titre);cursor:pointer;display:inline-grid;place-items:center}
.taille-btn small{font-size:.7em;margin-left:1px;vertical-align:baseline}
.taille-grande{font-size:1.2rem}
.taille-btn:hover:not(:disabled){border-color:var(--encre)}
.taille-btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.taille-btn:disabled{opacity:.35;cursor:default}
html:not([data-texte]) .taille-normale{background:var(--accent-fond);color:var(--accent-texte);border-color:var(--accent-fond)}
.pied-outils{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:28px;padding-top:20px;border-top:1px solid var(--filet)}
.pied-outils .taille-texte{padding:0}
.pied-outils .taille-titre{margin-right:6px}
.lien-haut-page{font:700 .9rem var(--titre);color:var(--encre);text-decoration:none;padding:8px 14px;border:1px solid var(--filet);border-radius:999px}
.lien-haut-page:hover{border-color:var(--encre)}
.pied-outils+.pied-bas{margin-top:20px}
.bulle-haut{position:fixed;right:18px;bottom:18px;z-index:44;width:52px;height:52px;border:0;border-radius:50%;background:var(--accent-fond);color:var(--accent-texte);display:grid;place-items:center;cursor:pointer;box-shadow:var(--ombre);opacity:0;transform:translateY(12px) scale(.9);pointer-events:none;transition:opacity .25s,transform .25s}
.bulle-haut.visible{opacity:1;transform:none;pointer-events:auto}
.bulle-haut[hidden]{display:none}
.bulle-haut svg{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.bulle-haut:hover{background:var(--accent-survol)}
.bulle-haut:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
body.carte-ouverte .bulle-haut{display:none}
@media (max-width:640px){.bulle-haut{right:12px;bottom:14px;width:48px;height:48px}}
@media (prefers-reduced-motion:reduce){.bulle-haut{transition:none}}

/* Bouton rapide A+ dans la barre du haut */
.taille-rapide{min-width:40px;height:40px;padding:0 10px;border:1px solid var(--bord-champ);border-radius:999px;background:var(--surface);color:var(--encre);font:700 1rem var(--titre);cursor:pointer;display:inline-grid;place-items:center}
.taille-rapide small{font-size:.7em}
.taille-rapide:hover{border-color:var(--encre)}
.taille-rapide:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* Texte agrandi (125 % et 150 %) : on libère de la place dans la barre du haut et on empile l'en-tête de liste */
html[data-texte="2"] .lien-haut,html[data-texte="3"] .lien-haut,html[data-texte="3"] .logo span{display:none}
html[data-texte="2"] .entete-liste,html[data-texte="3"] .entete-liste{grid-template-columns:1fr}
html[data-texte="2"] .agenda-jours{width:min(100%,520px);margin:8px auto 0}
html[data-texte="3"] .agenda-jours{width:min(100%,640px);margin:8px auto 0}
html[data-texte="3"] .agenda-grille{gap:4px}

/* Petits écrans et texte agrandi : rien ne doit déborder */
.hero-texte{min-width:0}
@media (max-width:820px){.accueil-hero{grid-template-columns:minmax(0,1fr)}}
.bascule{max-width:100%;flex-wrap:wrap}
@media (max-width:640px){
  html[data-texte="2"] .accueil-hero .titre-page.grand,html[data-texte="3"] .accueil-hero .titre-page.grand{font-size:clamp(1.7rem,9vw,2.6rem)}
  html[data-texte="2"] .seg-wrap:nth-child(n+2),html[data-texte="3"] .seg-wrap:nth-child(n+2){display:none}
  html[data-texte="2"] .seg-wrap,html[data-texte="3"] .seg-wrap{flex:1}
}
.vague-mot{display:inline-block;white-space:nowrap}

/* Date et heure sous les affiches : gris plus foncé pour rester lisible */
.carte-quand{color:var(--texte)}
.carte-quand .heure{color:var(--encre)}
@media (max-width:640px){
  html[data-texte="2"] .recherche-champ,html[data-texte="3"] .recherche-champ{flex-wrap:wrap;padding:6px 10px 10px 16px}
  html[data-texte="2"] .recherche-champ input[type=search],html[data-texte="3"] .recherche-champ input[type=search]{flex:1 1 60%}
  html[data-texte="2"] .recherche-envoi,html[data-texte="3"] .recherche-envoi{flex:1 1 100%;justify-content:center}
}

/* Vidéo de ville (chargée au clic) */
.video-cadre { position: relative; aspect-ratio: 16 / 9; max-width: 720px; border-radius: var(--forme, 12px); overflow: hidden; background: #111; box-shadow: var(--ombre-carte, 0 2px 8px rgba(0,0,0,.12)); }
.video-cadre iframe, .video-lire { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-lire { padding: 0; cursor: pointer; background: none; border: 0; }
.video-lire img { width: 100%; height: 100%; object-fit: cover; display: block; }
.video-bouton { position: absolute; inset: 0; margin: auto; width: 72px; height: 72px; border-radius: 50%; background: rgba(0,0,0,.72); color: #fff; font-size: 28px; display: grid; place-items: center; padding-left: 5px; }
.video-lire:hover .video-bouton, .video-lire:focus-visible .video-bouton { background: #000; }
.video-legende { font-size: .875rem; color: var(--doux); margin-top: .5rem; }

/* Actualités */
.liste-articles { list-style: none; padding: 0; display: grid; gap: 1rem; }
.liste-articles a { display: grid; grid-template-columns: 200px 1fr; gap: 1rem; text-decoration: none; color: inherit; align-items: start; }
.liste-articles img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--forme, 12px); }
.liste-articles b, .liste-articles small { display: block; }
.liste-articles small { color: var(--doux); margin: .15rem 0 .35rem; }
.liste-articles a:hover .article-titre { text-decoration: underline; }
.article-date { color: var(--doux); font-size: .9rem; }
.article-une img, .texte figure img { max-width: 100%; height: auto; border-radius: var(--forme, 12px); }
@media (max-width: 600px) { .liste-articles a { grid-template-columns: 1fr; } }
.texte .liste-articles { list-style: none; padding: 0; margin: 1rem 0; }
.texte .liste-articles li { list-style: none; margin: 0; padding: 0; }
.texte .liste-articles li::marker { content: none; }

/* Cartes de ville : survol lent et doux (air de vacances), image sans scintillement */
.ville-carte{transition:box-shadow .9s ease,transform .9s cubic-bezier(.22,.61,.36,1);transform:translateZ(0)}
.ville-carte img{transition:transform 1.6s cubic-bezier(.22,.61,.36,1);will-change:transform;backface-visibility:hidden;transform:translateZ(0) scale(1.001);transform-origin:50% 60%}
.ville-carte:hover{transform:translateY(-3px)}
.ville-carte:hover img,.ville-carte:focus-visible img{transform:translateZ(0) scale(1.035)}
@media (prefers-reduced-motion:reduce){.ville-carte,.ville-carte img{transition:none}.ville-carte:hover,.ville-carte:hover img{transform:none}}

/* Pastille de date et d'heure : même teinte de catégorie, un peu plus blanche */
.carte-quand{background:color-mix(in srgb,var(--c,#5B6B7B) 4%,var(--surface));border-color:color-mix(in srgb,var(--c,#5B6B7B) 25%,var(--surface))}

/* Logo des salles : tuile blanche, logo centré, genre en petit */
.lieu-fond.avec-logo{position:relative;background:#fff;border:1px solid var(--filet);color:var(--doux);place-items:center}
.lieu-fond.avec-logo img{max-width:62%;max-height:62%;width:auto;height:auto;object-fit:contain}
.lieu-fond.avec-logo .lieu-genre{position:absolute;left:12px;bottom:8px;font-size:.75rem;letter-spacing:.08em}
.lieu-logo{width:56px;height:56px;object-fit:contain;vertical-align:middle;margin-right:12px;border-radius:12px;background:#fff;border:1px solid var(--filet);padding:4px}

/* ---------- Corrections de l'audit UX (novembre 2026), voir design/audit-ux-2026-11.md ---------- */
/* Bandeau de ville en <picture> (WebP 640/1280) */
.ville-bandeau picture{display:block;height:100%}
.ville-bandeau figcaption{background:rgba(14,27,43,.72)}
.ville-carte picture{position:absolute;inset:0}

/* Pages étroites (texte, favoris, 404) : alignées sur la marge de l'en-tête, colonne de lecture limitée */
.conteneur.etroit{max-width:var(--max)}
.conteneur.etroit>*{max-width:880px}
.panne{padding-top:48px}

/* Listes : suite d'un jour chargé, vue d'un seul jour, saut de la liste au clavier */
.jour-partiel{font:600 .8rem var(--titre);color:var(--doux)}
.jour-suite{margin:20px 0 0;text-align:center}
.jour-suite .bouton{gap:6px}
.jour-suite svg{fill:none;stroke:currentColor;stroke-width:2}
.vue-jour{margin-top:20px}
.skip-liste{display:inline-block;margin-top:8px;padding:8px 14px;border-radius:8px;background:var(--accent-fond);color:var(--accent-texte);font-weight:700;text-decoration:none}
.skip-liste:not(:focus){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#fin-liste{display:block;height:0}
.sous-titre{font:700 1.2rem var(--display);color:var(--encre);margin:28px 0 4px}

/* Introduction repliée sur mobile (app.js) */
.intro-repliee{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lire-suite{margin-top:4px;padding:10px 0;min-height:44px;border:0;background:none;color:var(--encre);font:700 .9rem var(--titre);text-decoration:underline}

/* En-tête : sans ville, un seul bouton « Où sortir ? » ; liseré aux trois couleurs du logo */
.pastille::before{content:none}
.pastille-seule .seg{min-width:200px}
@media (max-width:900px){
  .seg-quoi{display:none} /* les catégories sont dans la barre des catégories (listes) et dans le menu */
  .seg-long{display:none}
  .pastille:not(.pastille-seule) .seg-wrap:first-child{flex:0 1 auto} /* la ville (courte) laisse la place au moment */
  .seg b{font-size:.82rem}

  .pastille-seule .seg{min-width:0}
  .cats-bar{transition:transform .25s ease}
  .cats-bar.cats-cachee{transform:translateY(-100%)}
}
@media (prefers-reduced-motion:reduce){.cats-bar{transition:none}}

/* Fiche d'une sortie : affiche à gauche, l'essentiel à droite (visible sans défiler) */
.fiche-haut{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:40px;align-items:start;margin-top:8px}
.fiche-haut>.fiche-photo{grid-column:1;grid-row:1 / span 4;height:auto;aspect-ratio:4/5;max-height:620px;margin-top:0}
.fiche-haut>:not(.fiche-photo){grid-column:2}
.fiche-haut .fiche-tete{margin-top:0}
.fiche-haut .fiche-infos{grid-template-columns:1fr;gap:14px;margin-top:20px}
.fiche-haut .fiche-cta{margin-top:20px}
.fiche-photo .photo-vide.grand{height:100%;aspect-ratio:auto}
/* L'affiche n'est jamais agrandie au-delà de sa taille réelle (pas de flou) : centrée sur son fond flou. */
.fiche-photo .photo-img{position:absolute;inset:0;margin:auto;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.fiche .fiche-texte,.fiche .fiche-dates{max-width:72ch}
@media (max-width:900px){
  /* Mobile : titre, puis quand / où / tarif / réservation, puis l'affiche */
  .fiche-haut{display:flex;flex-direction:column;align-items:stretch}
  .fiche-haut .fiche-tete{order:1;margin-top:8px}
  .fiche-haut .alerte{order:2}
  .fiche-haut .fiche-cote{order:3}
  .fiche-haut>.fiche-photo{order:4;aspect-ratio:auto;height:clamp(220px,70vw,360px);margin-top:24px}
  .fiche-haut .fiche-infos{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
}

/* Actualités : titres d'articles en vrais titres */
.texte .article-titre{font:700 1.1rem/1.3 var(--display);color:var(--encre);margin:0 0 4px}
.liste-articles .article-date{display:block;margin:.15rem 0 .35rem}
.article-resume{display:block;color:var(--texte)}

/* Carte : message d'attente avant les tuiles */
.carte-chargement{position:absolute;inset:0;display:grid;place-items:center;margin:0;color:var(--doux);font-weight:600}

/* Écrans tactiles : cibles de 44 px */
@media (pointer:coarse){
  .chip,.ville-liens a,.lien-haut-page,.recherche-ville select{min-height:44px}
  .taille-btn,.taille-rapide{min-width:44px;min-height:44px}
  .agenda-grille{gap:4px}
  .jour-btn{min-height:56px;justify-content:center}
  .logo{padding:7px;margin:-7px}
  .fleches button,.peek-fermer{width:44px;height:44px}
  .pied-site li a,.pied-liens a,.pied-seo a{padding:10px 2px}
}

/* ---------- Menu : favoris en tête, raccourcis de la ville, réglages d'affichage (thème, taille du texte) ---------- */
.pop-menu{min-width:320px;padding:10px}
.pop-menu .pop-titre{padding:12px 8px 6px}
.menu-favoris{display:flex!important;align-items:center;gap:12px;padding:12px!important;border-radius:14px 5px 14px 5px!important;background:color-mix(in srgb,var(--l1) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--l1) 30%,var(--surface))}
.menu-favoris:hover{background:color-mix(in srgb,var(--l1) 14%,var(--surface))!important}
.menu-favoris-icone{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--l1);color:#fff}
.menu-favoris-icone svg{width:20px;height:20px;fill:#fff;stroke:#fff;stroke-width:2}
.menu-favoris-texte{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.3}
.menu-favoris-texte b{font:700 1rem var(--display);color:var(--encre)}
.menu-favoris-texte small{font-size:.82rem;color:var(--doux)}
.menu-favoris-nb{flex:none;min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:var(--l1);color:#fff;font:700 .85rem/28px var(--titre);text-align:center}
.menu-raccourcis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:0 4px}
.menu-raccourcis a{display:flex!important;align-items:center;justify-content:center;min-height:40px;padding:6px 10px!important;border:1px solid var(--filet);border-radius:12px 4px 12px 4px!important;font:600 .88rem var(--titre)!important;text-align:center}
.menu-raccourci-large{grid-column:1 / -1}
.menu-reglages{margin:8px 0 0;padding:2px 0 4px;border-top:1px solid var(--filet)}
.menu-reglages .taille-texte{padding:6px 8px}
/* Tout le menu est aligné à droite */
.pop-menu{text-align:right}
.pop-menu .menu-reglages .theme-choix,.pop-menu .menu-reglages .taille-texte{justify-content:flex-end}
.theme-choix{display:flex;align-items:center;gap:6px;padding:6px 8px}
.theme-btn{display:inline-flex;align-items:center;gap:5px;min-height:40px;padding:0 10px;border:1px solid var(--bord-champ);border-radius:12px;background:var(--surface);color:var(--encre);font:600 .85rem var(--titre);cursor:pointer}
.theme-btn svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.theme-btn:hover{border-color:var(--encre)}
.theme-btn[aria-pressed=true]{background:var(--accent-fond);color:var(--accent-texte);border-color:var(--accent-fond)}
@media (pointer:coarse){.theme-btn,.menu-raccourcis a{min-height:44px}}
@media (max-width:900px){.pop-menu{min-width:0}}


/* Salles : un rond avec le logo (ou une illustration par type de salle), plus de gros blocs */
.lieu-carte{align-items:center;text-align:center;gap:6px;padding:8px 4px}
.lieu-rond{display:grid;place-items:center;width:96px;height:96px;border-radius:50%;background:#fff;border:1px solid var(--filet);box-shadow:0 2px 6px rgba(14,27,43,.08),0 10px 18px -12px rgba(14,27,43,.3);overflow:hidden;transition:transform 1s cubic-bezier(.22,.61,.36,1),box-shadow 1s ease}
.lieu-rond img{width:68%;height:68%;object-fit:contain}
.lieu-rond.generique{border-color:transparent;box-shadow:0 2px 6px rgba(14,27,43,.06)}
.lieu-rond.generique img{width:100%;height:100%}
.lieu-carte:hover .lieu-rond,.lieu-carte:focus-visible .lieu-rond{transform:translateY(-2px);box-shadow:0 2px 6px rgba(14,27,43,.1),0 14px 22px -12px rgba(14,27,43,.35)}
.lieu-carte b{font-size:.95rem;line-height:1.25}
.lieu-carte small{color:var(--doux)}
.lieux-grille{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.lieu-logo{border-radius:50%}
.lieu-logo.generique{border-color:transparent;padding:0;background:none}
@media (prefers-reduced-motion:reduce){.lieu-rond{transition:none}.lieu-carte:hover .lieu-rond{transform:none}}

/* Actualités : page façon magazine (cases de tailles et de styles variés) */
.mag-tete{margin-bottom:22px}
.mag-filtres{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.mag-filtres .chip.actif{background:var(--encre);color:#fff;border-color:var(--encre)}
.mag{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px;grid-auto-flow:dense}
.mag-case{--c:#EC7A12;grid-column:span 4;min-width:0;border-radius:18px 6px 18px 6px;overflow:hidden;position:relative;background:#fff;border:1px solid var(--filet);box-shadow:0 2px 4px rgba(14,27,43,.06),0 14px 26px -16px rgba(14,27,43,.3);transition:transform 1.1s cubic-bezier(.22,.61,.36,1),box-shadow 1.1s ease}
.mag-case[hidden]{display:none}
.mag-case.cat-salles{--c:#5B3FC2}
.mag-case.cat-billets{--c:#1B7A43}
.mag-case>a{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.mag-case:hover,.mag-case:focus-within{transform:translateY(-3px);box-shadow:0 2px 4px rgba(14,27,43,.08),0 20px 30px -16px rgba(14,27,43,.38)}
.mag-texte{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;position:relative}
.mag-rubrique{align-self:flex-start;font:700 .72rem var(--titre);letter-spacing:.1em;text-transform:uppercase;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--c) 14%,#fff);color:color-mix(in srgb,var(--c) 70%,#000)}
.mag-titre{font-family:var(--display,var(--titre));font-size:1.18rem;line-height:1.2;color:var(--encre)}
.mag-extrait{font-size:.9rem;line-height:1.5;color:var(--doux)}
.mag-lire{margin-top:4px;font:700 .85rem var(--titre);color:color-mix(in srgb,var(--c) 75%,#000)}
.mag-case img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform 1.6s cubic-bezier(.22,.61,.36,1)}
.mag-case:hover img{transform:scale(1.03)}
.mag-case:not(.avec-photo) .mag-texte{padding:26px 24px;border-top:6px solid var(--c);flex:1}
.mag-case:not(.avec-photo){background:color-mix(in srgb,var(--c) 6%,#fff)}
/* Rythme : grande case, case teintée, trois moyennes, bandeau */
.mag-case.m0{grid-column:span 7}
.mag-case.m0 img{aspect-ratio:16/10}
.mag-case.m0 .mag-titre{font-size:1.55rem}
.mag-case.m1{grid-column:span 5}
.mag-case.m5{grid-column:span 12}
.mag-case.m5>a{flex-direction:row;align-items:stretch}
.mag-case.m5 img{width:42%;aspect-ratio:auto;height:100%;min-height:220px}
.mag-case.m5 .mag-texte{justify-content:center;padding:24px 28px}
/* Cases avec photo en grand format : le titre passe sur l'image */
.mag-case.m0.avec-photo>a,.mag-case.m2.avec-photo>a{display:block}
.mag-case.m0.avec-photo img,.mag-case.m2.avec-photo img{position:absolute;inset:0;height:100%;aspect-ratio:auto}
.mag-case.m0.avec-photo,.mag-case.m2.avec-photo{min-height:360px;border:0;color:#fff}
.mag-case.m0.avec-photo .mag-texte,.mag-case.m2.avec-photo .mag-texte{position:absolute;inset:auto 0 0 0;padding:70px 22px 22px;background:linear-gradient(180deg,rgba(14,27,43,0),rgba(14,27,43,.88))}
.mag-case.m0.avec-photo .mag-titre,.mag-case.m2.avec-photo .mag-titre{color:#fff}
.mag-case.m0.avec-photo .mag-extrait,.mag-case.m2.avec-photo .mag-extrait{color:rgba(255,255,255,.9)}
.mag-case.m0.avec-photo .mag-lire,.mag-case.m2.avec-photo .mag-lire{color:#fff}
.mag-case.m0.avec-photo .mag-rubrique,.mag-case.m2.avec-photo .mag-rubrique{background:rgba(255,255,255,.9);color:#0E1B2B}
@media (max-width:900px){.mag-case,.mag-case.m0,.mag-case.m1,.mag-case.m5{grid-column:span 12}.mag-case.m5>a{flex-direction:column}.mag-case.m5 img{width:100%;height:auto;aspect-ratio:3/2}.mag-case.m0.avec-photo,.mag-case.m2.avec-photo{min-height:300px}}
@media (min-width:901px) and (max-width:1100px){.mag-case{grid-column:span 6}.mag-case.m0{grid-column:span 12}}
@media (prefers-reduced-motion:reduce){.mag-case,.mag-case img{transition:none}.mag-case:hover,.mag-case:hover img{transform:none}}

/* Pied de page : thème et taille du texte sur la même ligne que « Remonter en haut » */
.pied-reglages{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px}
.pied-reglages .theme-choix{display:flex;align-items:center;gap:6px}

/* En-tête : « Mes favoris » à la place du lien d'annonce (qui reste dans le menu) */
.lien-favoris{display:inline-flex;align-items:center;gap:7px}
.lien-favoris svg{width:18px;height:18px}
.lien-fav-nb{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--encre);color:#fff;font:700 .72rem/20px var(--titre);text-align:center}
.lien-fav-nb[hidden]{display:none}

/* Actualités : titres de la presse nationale (liens vers l'article d'origine) */
.mag-actu{margin-top:44px;padding-top:28px;border-top:1px solid var(--filet)}
.mag-actu-liste{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.mag-actu-liste a{display:flex;flex-direction:column;gap:6px;height:100%;padding:16px 18px;border-radius:6px 16px 6px 16px;border:1px solid var(--filet);background:#fff;color:inherit;text-decoration:none;box-shadow:0 2px 6px rgba(14,27,43,.06);transition:box-shadow 1s ease,transform 1s cubic-bezier(.22,.61,.36,1)}
.mag-actu-liste a:hover,.mag-actu-liste a:focus-visible{transform:translateY(-2px);box-shadow:0 12px 22px -14px rgba(14,27,43,.35)}
.mag-actu-liste b{font-family:var(--display,var(--titre));font-size:1rem;line-height:1.3;color:var(--encre)}
.mag-actu-meta{font:700 .72rem var(--titre);letter-spacing:.06em;text-transform:uppercase;color:var(--doux)}
.mag-actu-lien{margin-top:auto;font:700 .82rem var(--titre);color:var(--encre)}
@media (prefers-reduced-motion:reduce){.mag-actu-liste a{transition:none}.mag-actu-liste a:hover{transform:none}}
@media (max-width:760px){.lien-haut.lien-favoris{display:inline-flex;padding:10px}.lien-favoris span:not(.lien-fav-nb){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
.mag-case.cat-actu{--c:#0B6BCB}
.mag-case.cat-actu .mag-rubrique{background:#0B6BCB;color:#fff}
.mag-case.avec-photo.cat-actu:not(.m0):not(.m2) img{object-position:center 30%}

/* Accueil : bandeau des logos de salles qui défile (nombre de salles à gauche) */
.bandeau-salles{display:flex;align-items:center;gap:0;margin:18px 0 6px;border:1px solid var(--filet);border-radius:999px;background:#fff;box-shadow:0 2px 8px rgba(14,27,43,.06);overflow:hidden;min-height:68px}
.bandeau-compte{flex:none;margin:0;padding:0 22px;font:600 .88rem/1.25 var(--titre);color:var(--doux);max-width:230px;border-right:1px solid var(--filet);align-self:stretch;display:flex;align-items:center}
.bandeau-compte b{font:800 1.5rem var(--display,var(--titre));color:var(--encre);margin-right:8px}
.bandeau-piste{flex:1;min-width:0;display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.bandeau-liste{flex:none;display:flex;align-items:center;gap:14px;list-style:none;margin:0;padding:0 7px;animation:bandeau-defile 90s linear infinite}
.bandeau-salles:hover .bandeau-liste,.bandeau-salles:focus-within .bandeau-liste{animation-play-state:paused}
.bandeau-rond{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff;border:1px solid var(--filet);overflow:hidden}
.bandeau-rond img{width:68%;height:68%;object-fit:contain}
.bandeau-rond:hover,.bandeau-rond:focus-visible{border-color:var(--encre)}
@keyframes bandeau-defile{to{transform:translateX(-100%)}}
@media (max-width:700px){.bandeau-salles{border-radius:18px;flex-direction:column;align-items:stretch;padding-bottom:10px}.bandeau-compte{max-width:none;border-right:0;padding:12px 18px 6px}}
@media (prefers-reduced-motion:reduce){.bandeau-piste{overflow-x:auto}.bandeau-liste{animation:none}.bandeau-liste[aria-hidden="true"]{display:none}}
.bandeau-compte b{white-space:nowrap}
.bandeau-compte{font-size:.78rem;gap:0;max-width:none;padding:0 18px}
.bandeau-compte b{font-size:1.3rem;margin-right:8px}
.bandeau-compte span{display:block;white-space:nowrap}
@media (max-width:700px){.bandeau-compte{padding:12px 18px 6px}}

/* Fond : le motif des trois barres reste sur les côtés, une lueur blanche au centre de l'écran le fait disparaître là où on lit */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 58% 80% at 50% 42%,var(--fond-page) 0%,var(--fond-page) 38%,color-mix(in srgb,var(--fond-page) 55%,transparent) 62%,transparent 100%)}
/* Cartes de ville : la même forme que les affiches des sorties */
.ville-carte{border-radius:var(--forme)}
.ville-liens a{border-radius:var(--forme-pastille,12px 4px 12px 4px)}

/* Trois barres : le bas reste fixe (hauteur du bloc constante), seul le haut bouge, lentement et sans à-coup */
.hero-barres{height:268px;min-height:0}
@keyframes rythme1{0%,100%{height:210px}50%{height:222px}}
@keyframes rythme2{0%,100%{height:250px}50%{height:238px}}
@keyframes rythme3{0%,100%{height:170px}50%{height:182px}}
.hero-barres .barre{transition:height 1.6s cubic-bezier(.45,0,.25,1)}
.hero-barres.en-rythme .b1{animation:rythme1 7s cubic-bezier(.45,0,.55,1) 0s infinite}
.hero-barres.en-rythme .b2{animation:rythme2 8.4s cubic-bezier(.45,0,.55,1) 1.2s infinite}
.hero-barres.en-rythme .b3{animation:rythme3 6.2s cubic-bezier(.45,0,.55,1) 2.4s infinite}

/* Lueur du fond à 80 % */
body::before{opacity:.8}

/* Bandeau de salles : au survol, le rond s'ouvre en pastille avec le nom de la salle (le défilement s'arrête) */
.bandeau-rond{width:auto;min-width:48px;display:flex;align-items:center;justify-content:flex-start;gap:0;border-radius:999px;transition:box-shadow .5s ease,border-color .5s ease,background-color .5s ease}
.bandeau-rond img{flex:none;width:46px;height:46px;padding:7px;box-sizing:border-box}
.bandeau-nom{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;font:700 .82rem var(--titre);color:var(--encre);transition:max-width .7s cubic-bezier(.22,.61,.36,1),opacity .5s ease,padding .7s cubic-bezier(.22,.61,.36,1)}
.bandeau-rond:hover,.bandeau-rond:focus-visible{border-color:var(--encre);box-shadow:0 6px 16px -8px rgba(14,27,43,.45);background:var(--surface-2)}
.bandeau-rond:hover .bandeau-nom,.bandeau-rond:focus-visible .bandeau-nom{max-width:230px;opacity:1;padding:0 16px 0 4px}
@media (prefers-reduced-motion:reduce){.bandeau-nom{transition:none}.hero-barres .barre{transition:none}}

/* Bandeau de salles : ronds sans bordure, aucun effet au survol (le défilement s'arrête seulement) */
.bandeau-rond,.bandeau-rond:hover,.bandeau-rond:focus-visible{width:48px;min-width:0;border:0;box-shadow:none;background:#fff;transition:none}
.bandeau-rond:focus-visible{outline:2px solid var(--encre);outline-offset:2px}
.bandeau-rond img{width:48px;height:48px;padding:8px}
.bandeau-nom{display:none}

/* Cœur de favori : centré sur la même ligne que le badge de prix */
.coeur{top:22px}
@media (pointer:coarse){.coeur{top:18px}}
/* Type d'événement : visible seulement au survol (ou au clavier) ; toujours visible sur écran tactile, qui n'a pas de survol */
.photo .carte-type{opacity:0;transition:opacity .6s ease}
.carte:hover .photo .carte-type,.carte:focus-within .photo .carte-type{opacity:1}
@media (hover:none){.photo .carte-type{opacity:1}}
@media (prefers-reduced-motion:reduce){.photo .carte-type{transition:none}}

/* Barres du héros, version fluide : on ne change plus la hauteur (recalcul de mise en page à chaque image), on étire seulement la forme
   par transformation (sur la carte graphique) ; le bas reste fixe et l'icône suit le haut. */
.hero-barres .barre{background:none;box-shadow:none;transition:none;animation:none!important}
.hero-barres .barre::before{content:"";position:absolute;inset:0;border-radius:999px;transform-origin:50% 100%;box-shadow:0 14px 26px -10px rgba(14,27,43,.45);will-change:transform;backface-visibility:hidden}
.hero-barres .b1::before{background:linear-gradient(180deg,#F0304F,#E4002B)}
.hero-barres .b2::before{background:linear-gradient(180deg,#2A93E6,#0072CE)}
.hero-barres .b3::before{background:linear-gradient(180deg,#F8CB3B,#F2B705)}
.hero-barres .barre .ligne{z-index:1;will-change:transform;transform:translate3d(-50%,0,0)}
.hero-barres .b1{--s:1.0857;--dy:-18px}
.hero-barres .b2{--s:.928;--dy:18px}
.hero-barres .b3{--s:1.1059;--dy:-18px}
@keyframes barre-forme{0%,100%{transform:scaleY(1)}50%{transform:scaleY(var(--s))}}
@keyframes barre-icone{0%,100%{transform:translate3d(-50%,0,0)}50%{transform:translate3d(-50%,var(--dy),0)}}
.hero-barres.en-rythme .barre::before{animation:barre-forme var(--duree,8s) cubic-bezier(.37,0,.63,1) var(--delai,0s) infinite}
.hero-barres.en-rythme .barre .ligne{animation:barre-icone var(--duree,8s) cubic-bezier(.37,0,.63,1) var(--delai,0s) infinite}
.hero-barres .b1{--duree:7s;--delai:0s}
.hero-barres .b2{--duree:8.4s;--delai:1s}
.hero-barres .b3{--duree:6.4s;--delai:2s}

/* Vague du titre : plus longue, plus douce, sur la carte graphique */
.vague-lettre{will-change:transform;animation:vague-douce 1.05s cubic-bezier(.37,0,.63,1) 1 both}
@keyframes vague-douce{0%{transform:translate3d(0,0,0)}35%{transform:translate3d(0,-.4em,0)}70%{transform:translate3d(0,.1em,0)}100%{transform:translate3d(0,0,0)}}
@media (prefers-reduced-motion:reduce){.hero-barres.en-rythme .barre::before,.hero-barres.en-rythme .barre .ligne,.vague-lettre{animation:none}}

/* ===== Carte de sortie, maquette n°2 : tuile calendrier, titre, lieu, puis type et prix ===== */
.carte-entete{display:none}
.carte-cal{position:absolute;z-index:3;top:12px;left:12px;width:52px;border-radius:14px 4px 14px 4px;overflow:hidden;background:var(--surface);box-shadow:0 4px 14px rgba(14,27,43,.28);text-align:center;color:var(--encre)}
.carte-cal b{display:block;background:var(--c,var(--l6));color:#fff;font:800 .6rem/1 var(--titre);letter-spacing:.1em;padding:5px 0 4px}
.carte-cal strong{display:block;font:800 1.4rem/1.15 var(--display,var(--titre));color:var(--encre)}
.carte-cal small{display:block;font:700 .68rem var(--titre);color:var(--doux);padding-bottom:5px;text-transform:none}
.coeur{top:12px;right:12px}
@media (pointer:coarse){.coeur{top:8px;right:8px}}
.carte-texte{padding-top:12px;text-align:left}
.carte-titre{justify-content:flex-start}
.carte-bas{display:flex;align-items:center;justify-content:space-between;gap:6px 8px;flex-wrap:wrap;margin-top:8px}
.carte-cat{display:inline-flex;align-items:center;gap:6px;font:700 .68rem var(--titre);letter-spacing:.07em;text-transform:uppercase;color:color-mix(in srgb,var(--c,var(--l6)) 78%,var(--encre));white-space:nowrap}
.carte-cat i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--c,var(--l6))}
.carte-prix{font:800 .9rem var(--titre);color:var(--encre);white-space:nowrap}
.carte-prix.gratuit{color:var(--vert-texte)}
.photo .carte-type,.photo .etiquette{display:none}

/* 5 sorties par ligne partout (ordinateur) */
.grille{grid-template-columns:repeat(5,minmax(0,1fr))}
.grille-4{grid-template-columns:repeat(5,minmax(0,1fr))}
.vc-liste .grille{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px 10px}
@media (max-width:1099px){.grille:not(.grille-3),.grille-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:819px){.grille:not(.grille-3),.grille-4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.grille:not(.grille-3),.grille-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:339px){.grille:not(.grille-3),.grille-4{grid-template-columns:1fr}}

/* Titre en blanc, en bas de l'affiche, sur un dégradé sombre */
.photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(14,27,43,0) 0%,rgba(14,27,43,.55) 55%,rgba(14,27,43,.88) 100%)}
.photo .carte-titre{position:absolute;z-index:3;left:0;right:0;bottom:0;height:auto;margin:0;padding:34px 12px 12px;display:block;font:700 .98rem/1.25 var(--titre);color:#fff;text-align:left;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.photo .carte-titre>span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.carte-texte{padding-top:10px}
/* Sans affiche : fond teinté assez sombre pour que le titre blanc reste lisible */
.photo-vide{background:linear-gradient(160deg,color-mix(in srgb,var(--c,#5B6B7B) 62%,#0E1B2B),color-mix(in srgb,var(--c,#5B6B7B) 38%,#0E1B2B))}
.photo-vide svg{stroke:#fff;opacity:.55}

/* Affiche : cadre portrait 3/4, l'image y entre en entier en hauteur (une affiche A4 n'est jamais déformée ni coupée) ; les images presque carrées remplissent le cadre */
.photo{aspect-ratio:3/4}
.photo:has(.photo-vide){aspect-ratio:3/4}
@media (max-width:420px){.photo,.photo:has(.photo-vide){aspect-ratio:3/4}}
.photo .photo-img{object-fit:contain}
.photo .photo-img.plein{object-fit:cover}

/* Agenda des jours : même tuile calendrier que sur les affiches (bandeau coloré, jour en grand, nombre de sorties) */
.jour-btn{padding:0;gap:0;overflow:hidden;border-radius:12px 4px 12px 4px;border:1px solid var(--filet);box-shadow:0 2px 6px rgba(14,27,43,.08);background:var(--surface);transition:transform .8s cubic-bezier(.22,.61,.36,1),box-shadow .8s ease}
.jour-btn .jour-dow{align-self:stretch;text-align:center;background:var(--l1);color:#fff;font:800 .6rem/1 var(--titre);letter-spacing:.1em;padding:5px 0 4px}
.jour-btn .jour-num{font:800 1.3rem/1.2 var(--display,var(--titre));color:var(--encre);padding-top:2px}
.jour-btn .jour-nb{margin:2px 0 6px;font:700 .66rem var(--titre)}
a.jour-btn:hover{transform:translateY(-2px);border-color:var(--filet);box-shadow:0 10px 18px -12px rgba(14,27,43,.4)}
.jour-btn.aujourdhui{border-color:var(--l2);box-shadow:0 0 0 1px var(--l2),0 2px 6px rgba(14,27,43,.08)}
.jour-btn.aujourdhui .jour-dow{background:var(--l2)}
.jour-btn.jour-vide .jour-dow,.jour-btn.hors-liste .jour-dow{background:var(--doux)}
@media (prefers-reduced-motion:reduce){.jour-btn{transition:none}a.jour-btn:hover{transform:none}}
.agenda-jours{min-width:min(100%,300px)}
.agenda-grille{grid-template-columns:repeat(auto-fill,minmax(48px,1fr))}

/* Affiche : l'image prend TOUJOURS toute la hauteur du cadre et se redimensionne en proportion ; trop large, elle est rognée sur les côtés, trop étroite, le fond flouté comble les côtés */
.photo .photo-img,.photo .photo-img.plein{position:absolute;top:0;left:50%;height:100%;width:auto;max-width:none;object-fit:fill;transform:translate3d(-50%,0,0)}
.carte:hover .photo-img{transform:translate3d(-50%,0,0) scale(1.04)}

/* Cadre des affiches en 4/5 : moins de rognage des images larges */
.photo,.photo:has(.photo-vide){aspect-ratio:4/5}
@media (max-width:420px){.photo,.photo:has(.photo-vide){aspect-ratio:4/5}}

/* Agenda des sorties par jour : vrai agenda (mois, en-tête Lun à Dim, jours alignés sur leur colonne), colonne élargie */
.entete-liste{grid-template-columns:minmax(0,54ch) minmax(380px,1fr);gap:16px 48px}
.agenda-jours{width:100%;max-width:none;min-width:0;padding:18px 20px 16px;border-radius:var(--forme);box-shadow:var(--ombre-carte)}
.agenda-titre{margin:0 0 2px}
.agenda-mois{margin:0 0 12px;font:800 1.45rem/1.2 var(--display,var(--titre));color:var(--encre)}
.agenda-semaine{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;list-style:none;margin:0 0 6px;padding:0}
.agenda-semaine li{text-align:center;font:700 .72rem var(--titre);letter-spacing:.08em;text-transform:uppercase;color:var(--doux)}
.agenda-grille{grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.jour-btn .jour-dow{font-size:.62rem;padding:6px 0 5px}
.jour-btn .jour-num{font:800 1.6rem/1.15 var(--display,var(--titre));padding-top:4px}
.jour-btn .jour-nb{margin:3px 0 8px;font-size:.72rem;min-width:26px}
@media (max-width:1000px){.entete-liste{grid-template-columns:1fr}.agenda-jours{max-width:560px;margin:8px auto 0}}

/* Agenda : sobre, noir et blanc, un vrai tableau de semaines avec leur numéro à gauche */
.entete-liste{grid-template-columns:minmax(0,60ch) minmax(340px,1fr);gap:16px 40px}
.agenda-jours{padding:14px 16px 12px;border-radius:var(--rayon);box-shadow:var(--ombre-carte);max-width:480px;justify-self:end}
.agenda-mois{margin:0 0 8px;font:800 1.2rem/1.2 var(--display,var(--titre));color:var(--encre)}
.agenda-table{width:100%;border-collapse:collapse;table-layout:fixed;font-variant-numeric:tabular-nums}
.agenda-table th{font:700 .66rem var(--titre);letter-spacing:.08em;text-transform:uppercase;color:var(--doux);padding:0 0 6px;text-align:center}
.agenda-table th.sem{width:34px;text-align:left;font-size:.64rem;letter-spacing:.02em}
.agenda-table tbody th.sem{padding:0;vertical-align:middle;border-top:1px solid var(--filet);color:var(--doux)}
.agenda-table td{padding:0;border:1px solid var(--filet);height:52px;vertical-align:top}
.agenda-table .jour-btn{all:unset;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:100%;height:100%;padding:5px 2px 4px;text-align:center;color:var(--encre);background:var(--surface);cursor:pointer}
.agenda-table span.jour-btn{cursor:default}
.agenda-table .jour-num{font:800 1.1rem/1 var(--display,var(--titre));padding:0;color:var(--encre)}
.agenda-table .jour-nb{font:700 .62rem var(--titre);background:var(--encre);color:var(--surface);border-radius:999px;min-width:20px;padding:1px 5px;margin:0}
.agenda-table a.jour-btn:hover{background:var(--encre)}
.agenda-table a.jour-btn:hover .jour-num{color:var(--surface)}
.agenda-table a.jour-btn:hover .jour-nb{background:var(--surface);color:var(--encre)}
.agenda-table a.jour-btn:focus-visible{outline:2px solid var(--encre);outline-offset:-3px}
.agenda-table .jour-btn.aujourdhui{background:var(--encre);box-shadow:none;border:0}
.agenda-table .jour-btn.aujourdhui .jour-num{color:var(--surface)}
.agenda-table .jour-btn.aujourdhui .jour-nb{background:var(--surface);color:var(--encre)}
.agenda-table .jour-vide,.agenda-table .hors-liste{background:var(--gris)}
.agenda-table .jour-vide .jour-num,.agenda-table .hors-liste .jour-num{color:var(--doux);font-weight:700}
.agenda-table .jour-vide .jour-nb{background:transparent;color:var(--doux)}
.agenda-table .hors-liste .jour-nb{background:transparent;color:var(--doux);border:1px solid var(--doux)}
.agenda-table td:empty{background:var(--gris);opacity:.5}
@media (max-width:1000px){.entete-liste{grid-template-columns:1fr}.agenda-jours{max-width:480px;margin:8px auto 0;justify-self:center}}

/* Agenda : même langage visuel que le reste du site (cases aux coins signature, ombres douces, pastilles), sans quadrillage */
.agenda-jours{border:1px solid var(--filet);border-radius:var(--forme);box-shadow:var(--ombre-carte);background:var(--surface)}
.agenda-table{border-collapse:separate;border-spacing:6px}
.agenda-table th{padding:0 0 2px;color:var(--doux)}
.agenda-table th.sem{width:30px;text-align:center;font:700 .62rem var(--titre);letter-spacing:.04em;text-transform:none}
.agenda-table tbody th.sem{border:0;vertical-align:middle;color:var(--doux)}
.agenda-table tbody th.sem::before{content:"";display:none}
.agenda-table td{border:0;height:50px;padding:0;background:none}
.agenda-table td:empty{background:none;opacity:1}
.agenda-table .jour-btn{border:1px solid var(--filet);border-radius:12px 4px 12px 4px;background:var(--surface);box-shadow:0 2px 6px rgba(14,27,43,.07);padding:6px 2px 5px;transition:transform .8s cubic-bezier(.22,.61,.36,1),box-shadow .8s ease,border-color .8s ease}
.agenda-table .jour-nb{background:var(--gris);color:var(--encre);font:700 .64rem var(--titre);min-width:22px;padding:1px 6px}
.agenda-table a.jour-btn:hover{background:var(--surface);border-color:var(--encre);transform:translateY(-2px);box-shadow:0 10px 16px -12px rgba(14,27,43,.4)}
.agenda-table a.jour-btn:hover .jour-num{color:var(--encre)}
.agenda-table a.jour-btn:hover .jour-nb{background:var(--gris);color:var(--encre)}
.agenda-table .jour-btn.aujourdhui{background:var(--encre);border-color:var(--encre)}
.agenda-table .jour-btn.aujourdhui .jour-num{color:var(--surface)}
.agenda-table .jour-btn.aujourdhui .jour-nb{background:var(--surface);color:var(--encre)}
.agenda-table a.jour-btn.aujourdhui:hover{background:var(--encre)}
.agenda-table a.jour-btn.aujourdhui:hover .jour-num{color:var(--surface)}
.agenda-table .jour-vide,.agenda-table .hors-liste{background:var(--gris);box-shadow:none}
@media (prefers-reduced-motion:reduce){.agenda-table .jour-btn{transition:none}.agenda-table a.jour-btn:hover{transform:none}}

/* Agenda : titres centrés, jour courant en rouge, cadre plus doux (graisses allégées, léger voile de couleur, trait des trois barres du logo) */
.agenda-jours{position:relative;background:linear-gradient(180deg,color-mix(in srgb,var(--l1) 5%,var(--surface)) 0%,color-mix(in srgb,var(--l2) 3%,var(--surface)) 55%,var(--surface) 100%);border-color:color-mix(in srgb,var(--filet) 70%,transparent);box-shadow:0 1px 3px rgba(14,27,43,.04),0 14px 30px -20px rgba(14,27,43,.3);overflow:hidden}
.agenda-jours::before{content:"";position:absolute;top:0;left:50%;width:64px;height:4px;transform:translateX(-50%);border-radius:0 0 4px 4px;background:linear-gradient(90deg,var(--l1) 0 33.3%,var(--l2) 33.3% 66.6%,#F2B705 66.6% 100%)}
.agenda-titre{text-align:center;margin:6px 0 2px;font-weight:600;letter-spacing:.08em}
.agenda-mois{text-align:center;margin:0 0 10px;font-weight:600;font-size:1.15rem}
.agenda-table th{font-weight:600}
.agenda-table .jour-btn{box-shadow:0 1px 3px rgba(14,27,43,.05);border-color:color-mix(in srgb,var(--filet) 80%,transparent)}
.agenda-table .jour-num{font-weight:700}
.agenda-table .jour-nb{font-weight:600;background:color-mix(in srgb,var(--gris) 80%,transparent)}
.agenda-table .jour-btn.aujourdhui,.agenda-table a.jour-btn.aujourdhui:hover{background:var(--l1);border-color:var(--l1);box-shadow:0 6px 14px -8px color-mix(in srgb,var(--l1) 70%,transparent)}
.agenda-table .jour-btn.aujourdhui .jour-num{color:#fff}
.agenda-table .jour-btn.aujourdhui .jour-nb{background:rgba(255,255,255,.92);color:#8F001F}

/* Agenda : survol classique, la bordure se renforce, la case ne bouge pas */
.agenda-table .jour-btn{transition:border-color .2s ease}
.agenda-table a.jour-btn:hover,.agenda-table a.jour-btn:focus-visible{transform:none;box-shadow:0 1px 3px rgba(14,27,43,.05);border-color:var(--encre)}
.agenda-table a.jour-btn.aujourdhui:hover{border-color:#8F001F;box-shadow:none}

/* Ligne du bas des cartes : prix à gauche, type à droite ; une seule ligne, même hauteur partout */
.carte-bas{flex-wrap:nowrap;justify-content:space-between;min-height:1.4em}
.carte-bas .carte-prix{flex:none;min-width:1ch}
.carte-bas .carte-cat{min-width:0;overflow:hidden;text-overflow:ellipsis;margin-left:auto}
.carte-lieu{min-height:1.4em}

/* Cartes : titre, lieu et ligne « type · prix » centrés, sans point de couleur devant le type */
.carte-texte{text-align:center}
.photo .carte-titre{text-align:center}
.photo .carte-titre>span{text-align:center}
.carte-bas{justify-content:center;gap:0 8px;margin-top:6px}
.carte-bas .carte-cat{margin-left:0;flex:0 1 auto}
.carte-bas .carte-cat i{display:none}
.carte-sep{color:var(--doux);font-weight:700}
.carte-bas .carte-prix{min-width:0}

/* Cartes : tout à gauche, lieu et « type · prix » rapprochés, hauteur de la ligne identique avec ou sans prix */
.carte-texte{text-align:left}
.photo .carte-titre,.photo .carte-titre>span{text-align:left}
.carte-lieu{margin:0;line-height:1.3}
.carte-bas{justify-content:flex-start;gap:0 8px;margin-top:1px;height:1.35rem;min-height:0;align-items:center;overflow:hidden}
.carte-bas .carte-cat,.carte-bas .carte-prix,.carte-bas .carte-sep{line-height:1.35rem;height:1.35rem;display:inline-flex;align-items:center}

/* ===== Page d'une salle : vitrine (en-tête, chiffres, rendez-vous phares, carte, programme) ===== */
.salle-hero{--c:var(--l1);margin:6px 0 28px;padding:28px 30px 24px;border-radius:var(--forme);border:1px solid color-mix(in srgb,var(--filet) 70%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--c) 9%,var(--surface)) 0%,var(--surface) 62%);box-shadow:var(--ombre-carte);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 28px;align-items:center;position:relative;overflow:hidden}
.salle-hero.k-cinema{--c:var(--l2)}.salle-hero.k-theatre{--c:var(--l1)}.salle-hero.k-concert-hall{--c:var(--l3)}.salle-hero.k-arts-centre{--c:var(--l4)}.salle-hero.k-other{--c:var(--l6)}
.salle-hero::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--c)}
.salle-id{display:flex;align-items:center;gap:22px;min-width:0}
.salle-rond{flex:none;display:grid;place-items:center;width:104px;height:104px;border-radius:50%;background:#fff;border:1px solid var(--filet);box-shadow:0 4px 14px rgba(14,27,43,.12);overflow:hidden}
.salle-rond img{width:70%;height:70%;object-fit:contain}
.salle-rond.generique{border-color:transparent}
.salle-rond.generique img{width:100%;height:100%}
.salle-titres{min-width:0}
.salle-genre{margin:0 0 4px;font:700 .78rem var(--titre);letter-spacing:.1em;text-transform:uppercase;color:color-mix(in srgb,var(--c) 75%,var(--encre))}
.salle-nom{margin:0;font:800 clamp(1.7rem,3.2vw,2.5rem)/1.1 var(--display,var(--titre));color:var(--encre);text-wrap:balance}
.salle-adresse{margin:6px 0 0;color:var(--doux)}
.salle-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.salle-site{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;font-size:1rem}
.salle-site-hote{font-weight:500;opacity:.8;font-size:.82rem}
.salle-stats{grid-column:1/-1;list-style:none;margin:6px 0 0;padding:16px 0 0;border-top:1px solid color-mix(in srgb,var(--filet) 80%,transparent);display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px}
.salle-stats b{display:block;font:800 1.6rem/1.1 var(--display,var(--titre));color:var(--encre)}
.salle-stats span{font-size:.85rem;color:var(--doux)}
.salle-colonnes{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px 32px;align-items:start;margin-bottom:34px}
.salle-colonnes h2,.salle-programme-titre{font:800 1.4rem var(--display,var(--titre));margin:0 0 14px;color:var(--encre)}
.salle-programme-titre{margin-top:6px}
.salle-programme-titre small{font:600 .85rem var(--titre);color:var(--doux);margin-left:8px}
.phares{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px 14px}
.phare a{display:flex;flex-direction:column;gap:8px;color:inherit;text-decoration:none}
.phare-photo{position:relative;display:block;aspect-ratio:3/4;border-radius:var(--forme);overflow:hidden;background:var(--gris);box-shadow:0 2px 8px rgba(14,27,43,.12)}
.phare-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.22,.61,.36,1)}
.phare a:hover .phare-photo img{transform:scale(1.03)}
.phare-vide{position:absolute;inset:0;background:linear-gradient(160deg,color-mix(in srgb,var(--l1) 55%,#0E1B2B),color-mix(in srgb,var(--l1) 30%,#0E1B2B))}
.phare-dates{position:absolute;left:10px;top:10px;padding:4px 11px;border-radius:999px;background:var(--surface);color:var(--encre);font:800 .74rem var(--titre);box-shadow:0 2px 8px rgba(14,27,43,.25)}
.phare-texte{display:flex;flex-direction:column;gap:2px}
.phare-texte b{font:700 .98rem/1.25 var(--titre);color:var(--encre)}
.phare-texte small{color:var(--doux);font-size:.85rem}
.salle-plan-bloc{border:1px solid var(--filet);border-radius:var(--forme);padding:12px 12px 14px;background:var(--surface);box-shadow:var(--ombre-carte);position:sticky;top:90px}
.salle-plan{height:240px;border-radius:18px 4px 18px 4px;overflow:hidden;background:var(--gris)}
.salle-plan-adresse{margin:12px 4px 6px;font-size:.92rem;line-height:1.45}
.salle-plan-liens{display:flex;gap:16px;margin:0 4px;font:700 .85rem var(--titre)}
.salle-pin span{display:block;width:30px;height:30px;margin:2px 2px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);background:var(--l1);border:3px solid #fff;box-shadow:0 3px 10px rgba(14,27,43,.4)}
.salle-invite{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin:40px 0 20px;padding:24px 28px;border-radius:var(--forme);background:color-mix(in srgb,var(--l2) 6%,var(--surface));border:1px solid color-mix(in srgb,var(--filet) 70%,transparent)}
.salle-invite h2{margin:0 0 6px;font:800 1.2rem var(--display,var(--titre))}
.salle-invite p{margin:0;max-width:60ch;color:var(--doux)}
.salle-invite-actions{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:900px){.salle-hero{grid-template-columns:1fr;padding:22px 20px}.salle-actions{justify-content:flex-start}.salle-colonnes{grid-template-columns:1fr}.salle-plan-bloc{position:static}.salle-rond{width:80px;height:80px}.salle-id{gap:16px}}
@media (prefers-reduced-motion:reduce){.phare-photo img{transition:none}.phare a:hover .phare-photo img{transform:none}}

/* ===== Filtre « petits points » sur toutes les images (maquette n°4) : une texture PNG de 8 Ko posée par-dessus (public/img/texture/, générée par tools/make-texture-points.php) ===== */
.photo::before,.fiche-photo::before,.ville-bandeau::before,.ville-carte::before,.phare-photo::before,.mag-img::before,.texte figure::before,.article-une::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:url(/img/texture/points-blancs-paysage.png) 0 0/100% 100% no-repeat}
.photo::before,.phare-photo::before,.fiche-photo::before{background-image:url(/img/texture/points-blancs-portrait.png)}
.ville-bandeau::before,.article-une::before,.texte figure::before{background-image:url(/img/texture/points-blancs-bandeau.png)}
@media (max-width:900px){.fiche-photo::before{background-image:url(/img/texture/points-blancs-paysage.png)}}
.ville-carte>span{z-index:2}
.texte figure,.article-une{position:relative;width:fit-content;max-width:100%}
.mag-img{display:block;position:relative}
.mag-img img{width:100%}
.mag-case.m0.avec-photo .mag-img,.mag-case.m2.avec-photo .mag-img{position:absolute;inset:0}
.mag-case.m0.avec-photo .mag-texte,.mag-case.m2.avec-photo .mag-texte{z-index:2}
.mag-case.m5 .mag-img{width:42%;flex:none}
.mag-case.m5 .mag-img img{width:100%;height:100%;min-height:220px}
@media (max-width:900px){.mag-case.m5 .mag-img{width:100%}.mag-case.m5 .mag-img img{height:auto;min-height:0}}

/* La texture de points reste sous tout ce qui est posé sur les images (date, badges, crédits, titres) */
.phare-dates,.photo-credit,.carte-cal,.photo .carte-titre,.salle-pin{z-index:3}
.mag-case .mag-rubrique{position:relative;z-index:3}

/* ===== Rendez-vous qui reviennent : affiches avec titre dessus, la première en grand ===== */
.phares{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;grid-auto-flow:dense}
.phare a{display:block;height:100%}
.phare-photo{display:block;height:auto;aspect-ratio:3/4}
.phare-une{grid-column:span 2;grid-row:span 2}
.phare-une .phare-photo{height:100%;aspect-ratio:auto;min-height:100%}
.phare-photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(14,27,43,0),rgba(14,27,43,.55) 55%,rgba(14,27,43,.9))}
.phare-photo .carte-cal{z-index:3}
.phare-texte{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:34px 12px 12px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;color:#fff;text-align:left}
.phare-texte b{color:#fff;font:700 .95rem/1.2 var(--titre);text-shadow:0 1px 8px rgba(0,0,0,.45);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.phare-une .phare-texte{padding:60px 18px 18px}
.phare-une .phare-texte b{font:800 1.45rem/1.15 var(--display,var(--titre))}
.phare-texte small{color:rgba(255,255,255,.92);font-size:.8rem}
.phare-dates{position:static;display:inline-block;margin-bottom:4px;padding:3px 10px;border-radius:999px;background:var(--surface);color:var(--encre);font:800 .7rem var(--titre);box-shadow:none}
.phare-une .carte-cal{width:60px}
@media (max-width:1100px){.phares{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.phares{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== Carte de la salle : tuiles OpenStreetMap adoucies (désaturées, légèrement teintées) pour se fondre dans le site ===== */
.salle-plan .leaflet-tile-pane{filter:grayscale(.92) contrast(.92) brightness(1.06) sepia(.12)}
.salle-plan .leaflet-container,.salle-plan.leaflet-container{background:#EEF1F5;font-family:var(--titre)}
.salle-plan .leaflet-control-zoom{border:0;box-shadow:0 2px 8px rgba(14,27,43,.18);border-radius:12px 4px 12px 4px;overflow:hidden}
.salle-plan .leaflet-control-zoom a{width:32px;height:32px;line-height:32px;color:var(--encre);background:var(--surface);border:0;font-weight:700}
.salle-plan .leaflet-control-zoom a+a{border-top:1px solid var(--filet)}
.salle-plan .leaflet-control-zoom a:hover{background:var(--gris)}
.salle-plan .leaflet-control-attribution{background:rgba(255,255,255,.75);font-size:.62rem;border-radius:8px 0 0 0;color:var(--doux)}
.salle-plan .leaflet-control-attribution a{color:var(--doux)}
.salle-pin span{background:var(--c-pin,var(--l1))}
.salle-plan::after{content:"";position:absolute;inset:0;z-index:500;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(14,27,43,.08),inset 0 -40px 40px -40px rgba(255,255,255,.7)}
.salle-plan{position:relative}

/* ===== Survol des images : couche promue d'avance (pas d'à-coup au premier survol), mouvement plus lent ===== */
.photo .photo-img,.phare-photo img,.ville-carte img{will-change:transform;backface-visibility:hidden}
.photo .photo-img{transition:transform 1.1s cubic-bezier(.22,.61,.36,1)}
.ville-carte img{transition:transform 1.6s cubic-bezier(.22,.61,.36,1)}

/* ===== En-tête d'une salle : même langage que le héros de l'accueil (carte claire, barres du logo, chiffres en mono) ===== */
.salle-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.5fr);gap:24px;align-items:center;padding:36px 44px;margin:8px 0 30px;border:0;border-radius:var(--forme);background:linear-gradient(120deg,var(--surface) 0%,var(--surface) 55%,var(--surface-2) 100%);box-shadow:0 2px 4px rgba(14,27,43,.06),0 18px 40px -16px rgba(14,27,43,.28);overflow:hidden;position:relative}
.salle-hero::before{display:none}
.salle-hero .salle-genre{margin:0 0 10px;font:700 .78rem var(--titre);letter-spacing:.1em;text-transform:uppercase;color:var(--doux)}
.salle-ligne{display:flex;align-items:center;gap:18px;min-width:0}
.salle-hero .salle-rond{width:72px;height:72px;box-shadow:0 2px 8px rgba(14,27,43,.12)}
.salle-hero .salle-nom{margin:0;font-size:clamp(1.8rem,4vw,3rem);line-height:1.05;letter-spacing:-.03em;text-wrap:balance}
.salle-hero .hero-sous{margin-top:12px;font-size:1.05rem;max-width:none}
.salle-hero .hero-chiffres{margin-top:10px}
.salle-site-hote{font-weight:500;opacity:.75;font-size:.8rem}
.salle-hero .hero-barres{height:210px;min-height:0;transform:scale(.8);transform-origin:50% 100%}
.salle-hero .hero-barres .barre.b1{height:150px}
.salle-hero .hero-barres .barre.b2{height:190px}
.salle-hero .hero-barres .barre.b3{height:115px}
@media (max-width:820px){.salle-hero{grid-template-columns:1fr;padding:26px 22px}.salle-hero .hero-barres{display:none}.salle-hero .salle-rond{width:56px;height:56px}}

/* ===== Programme d'une salle : agenda à gauche, séances en lignes (heure, affiche, titre, prix) ===== */
.salle-programme{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:28px 36px;align-items:start;margin-bottom:34px}
.salle-agenda{position:sticky;top:90px;max-width:none;justify-self:stretch;width:100%}
.salle-seances{min-width:0}
.salle-seances .salle-programme-titre{margin-top:0}
.seances-jour{margin:0 0 22px;scroll-margin-top:90px}
.seances-titre{margin:0 0 8px;font:800 1.05rem var(--display,var(--titre));color:var(--encre);position:sticky;top:64px;background:var(--fond-page,var(--fond));padding:6px 0;z-index:2}
.seances{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.seance a{display:grid;grid-template-columns:72px 56px minmax(0,1fr) auto 18px;align-items:center;gap:14px;padding:8px 14px 8px 10px;border-radius:14px 4px 14px 4px;background:var(--surface);border:1px solid color-mix(in srgb,var(--filet) 80%,transparent);box-shadow:0 1px 3px rgba(14,27,43,.05);color:inherit;text-decoration:none;transition:border-color .2s ease}
.seance a:hover,.seance a:focus-visible{border-color:var(--encre)}
.seance-heure{font:800 1.05rem var(--display,var(--titre));color:var(--encre);text-align:center;padding:6px 4px;border-radius:10px;background:color-mix(in srgb,var(--c,var(--l6)) 12%,var(--surface))}
.seance-photo{position:relative;width:56px;height:72px;border-radius:12px 3px 12px 3px;overflow:hidden;background:var(--gris)}
.seance-photo img{width:100%;height:100%;object-fit:cover;display:block}
.seance-vide{display:block;width:100%;height:100%;background:linear-gradient(160deg,color-mix(in srgb,var(--c,var(--l6)) 60%,#0E1B2B),color-mix(in srgb,var(--c,var(--l6)) 35%,#0E1B2B))}
.seance-corps{display:flex;flex-direction:column;gap:2px;min-width:0}
.seance-corps b{font:700 1rem/1.25 var(--titre);color:var(--encre);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.seance-corps small{font:700 .68rem var(--titre);letter-spacing:.07em;text-transform:uppercase;color:var(--doux)}
.seance-prix{font:800 .92rem var(--titre);color:var(--encre);white-space:nowrap}
.seance-prix.gratuit{color:var(--vert-texte)}
.seance-fleche{color:var(--doux);font-weight:700}
.seance a:hover .seance-fleche{color:var(--encre)}
@media (max-width:900px){.salle-programme{grid-template-columns:1fr}.salle-agenda{position:static}.seance a{grid-template-columns:60px 48px minmax(0,1fr) auto;gap:10px}.seance-fleche{display:none}.seance-photo{width:48px;height:62px}.seances-titre{top:56px}}
.hero-actions .bouton{gap:8px;display:inline-flex;align-items:center}
.salle-agenda{align-self:start}

/* ===== Page d'une salle, v3 : héros épuré, colonne de droite (carte puis agenda) alignée sur les affiches ===== */
.salle-hero{grid-template-columns:minmax(0,1fr) auto;padding:30px 40px;align-items:center}
.salle-hero .hero-barres{display:none}
.salle-gauche{min-width:0}
.salle-ligne{display:flex;align-items:center;gap:20px;min-width:0}
.salle-titres{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px}
.salle-hero .salle-nom{margin:0}
.salle-adresse{margin:0;font-size:1.05rem;color:var(--doux)}
.salle-hero .hero-chiffres{margin-top:16px}
.salle-droite{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right}
.salle-droite .salle-genre{margin:0}
.salle-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;column-gap:36px;grid-template-rows:auto auto 1fr;align-items:start;margin-bottom:34px}
.salle-titre-phares{grid-column:1;grid-row:1;margin:0 0 14px;font:800 1.4rem var(--display,var(--titre));color:var(--encre)}
.salle-layout>.phares{grid-column:1;grid-row:2;margin-bottom:34px}
.salle-layout>.salle-seances{grid-column:1;grid-row:3;scroll-margin-top:80px}
.salle-cote{grid-column:2;grid-row:2 / span 2;position:sticky;top:84px;display:grid;gap:18px;align-self:start}
.salle-cote .salle-plan-bloc{position:static}
.salle-cote .salle-agenda{position:static;width:100%;max-width:none;justify-self:stretch}
.salle-sans{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;margin-bottom:34px}
@media (max-width:1000px){
  .salle-hero{grid-template-columns:1fr;padding:24px 22px}
  .salle-droite{align-items:flex-start;text-align:left}
  .salle-layout,.salle-sans{grid-template-columns:1fr}
  .salle-layout>.phares,.salle-layout>.salle-seances,.salle-titre-phares{grid-column:1}
  .salle-cote{grid-column:1;grid-row:auto;position:static}
}
/* Agenda (villes et salles) : plus de fond rose en fondu */
.agenda-jours{background:var(--surface)}
.salle-cote .salle-agenda{position:relative}

/* Page d'une salle, v4 : la carte est alignée sur les affiches, l'agenda démarre à la première date du programme et la suit en défilant */
.salle-layout{grid-template-rows:auto auto auto 1fr}
.salle-layout>.salle-programme-titre{grid-column:1;grid-row:3;margin:0 0 10px;scroll-margin-top:80px}
.salle-layout>.salle-seances{grid-column:1;grid-row:4}
.salle-layout>.salle-plan-bloc{grid-column:2;grid-row:2;position:static;align-self:start}
.salle-layout>.salle-agenda{grid-column:2;grid-row:4;position:sticky;top:84px;align-self:start;margin-top:2.3rem;width:100%;max-width:none;justify-self:stretch}
@media (max-width:1000px){
  .salle-layout>.salle-programme-titre,.salle-layout>.salle-seances,.salle-layout>.salle-plan-bloc,.salle-layout>.salle-agenda{grid-column:1;grid-row:auto}
  .salle-layout>.salle-agenda{position:static;margin-top:0}
}
.salle-titres .hero-chiffres{margin:8px 0 0}

/* Carte de la salle : ses calques Leaflet (z-index jusqu'à 1000) restent dans leur boîte et passent sous l'en-tête du site */
.salle-plan{isolation:isolate;z-index:0}
.salle-plan-bloc{position:relative;z-index:0}

/* Mobile : l'affiche en grand des rendez-vous garde une vraie hauteur (format 4/3 sur toute la largeur) */
@media (max-width:900px){
  .phare-une{grid-row:span 1}
  .phare-une .phare-photo{height:auto;min-height:0;aspect-ratio:4/3}
  .phare-une .phare-texte b{font-size:1.25rem}
}

/* Mobile : ordre de lecture rendez-vous, agenda, programmation, puis la carte */
@media (max-width:1000px){
  .salle-layout{display:flex;flex-direction:column;gap:0}
  .salle-titre-phares{order:1}
  .salle-layout>.phares{order:2}
  .salle-layout>.salle-agenda{order:3;margin:0 0 28px}
  .salle-layout>.salle-programme-titre{order:4}
  .salle-layout>.salle-seances{order:5}
  .salle-layout>.salle-plan-bloc{order:6;margin-top:10px}
}
.seance-heure.sans-heure{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.4;padding:9px 4px}
@media (max-width:1000px){.salle-layout{align-items:stretch}}

/* ===== Carte de la salle : noir et blanc, effet dessiné au crayon, peu de détails (rues surtout, bâtiments effacés) ===== */
.salle-plan .leaflet-tile-pane{filter:grayscale(1) contrast(2.3) brightness(1.18) url(#trait-crayon)}
.salle-plan .leaflet-container,.salle-plan.leaflet-container{background:#fff}
.salle-pin span{background:var(--encre);border-color:#fff}
.salle-plan .leaflet-tile-pane{filter:grayscale(1) brightness(.84) contrast(2.6) url(#trait-crayon)}

/* Bouton « Site officiel » en rouge */
.salle-site,.salle-site:hover{background:var(--l1);border-color:var(--l1);color:#fff}
.salle-site:hover{background:#C10025;border-color:#C10025}
.salle-site .salle-site-hote{opacity:.9}

/* Tuile calendrier : mois + année sur deux chiffres quand ce n'est pas l'année en cours */
.carte-cal b{white-space:nowrap;letter-spacing:.06em}

/* ===== Carte de la salle, v3 : encre marine sur fond bleu très pâle (duotone aux couleurs du site), trait dessiné, repère rouge ===== */
.salle-plan{background:#E8F0FA}
.salle-plan .leaflet-container{background:#E8F0FA}
.salle-plan .leaflet-tile-pane{mix-blend-mode:multiply;filter:grayscale(1) brightness(.84) contrast(2.6) url(#trait-crayon)}
.salle-plan .leaflet-overlay-pane,.salle-plan .leaflet-marker-pane{mix-blend-mode:normal}
.salle-plan::before{content:"";position:absolute;inset:0;z-index:450;pointer-events:none;background:#2A4A73;mix-blend-mode:lighten;border-radius:inherit}
.salle-pin span{background:var(--l1);border-color:#fff}
.salle-plan::after{box-shadow:inset 0 0 0 1px rgba(14,27,43,.08),inset 0 0 28px 6px rgba(232,240,250,.9)}

/* Sélecteur de ville : un peu d'air entre le repère et le nom ; le même repère devant l'adresse d'une salle */
.pop-liste li a svg{flex:none;margin-right:10px;vertical-align:-3px}
.pop-liste li a{display:flex;align-items:center}
.salle-adresse-pin{display:inline-block;margin-right:8px;color:var(--doux)}
.salle-adresse-pin svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-2px}

/* Listes déroulantes de l'en-tête : espace réduit entre l'icône et le texte, icônes blanches sur les pastilles colorées, pastille « € » pour le gratuit */
.pop-liste li a svg{margin-right:0}
.pop-liste a{gap:6px}
.pop-liste .ligne svg{stroke:#fff}
.pop-liste .ligne-euro{--c:var(--l4);font:800 .8rem var(--titre);color:#fff;background:var(--l4);box-shadow:none}
.pop-liste li:not(:has(.ligne)):not(:has(svg)) a{padding-left:calc(12px + 1.6em + 6px)}

/* Listes déroulantes de l'en-tête (Où, Quand, Quoi) : même pastille ronde pour chaque ligne, même taille, même écart, icône blanche centrée */
.pop-liste a{gap:10px;padding:8px 12px;align-items:center}
.pop-liste .ligne{width:28px;height:28px;flex:none;display:inline-grid;place-items:center;border-radius:50%;margin:0}
.pop-liste .ligne svg{width:16px;height:16px;margin:0;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pop-liste .ligne-neutre{--c:#4A5565;background:var(--c)}
.pop-liste .ligne-vert{--c:var(--l4);background:var(--c);box-shadow:none;color:#fff}
.pop-liste li:not(:has(.ligne)) a{padding-left:12px}

/* ===== Carte de la salle, v4 : MapLibre (OpenFreeMap), sans bâtiments, routes principales en marine, aux couleurs du site ===== */
.salle-plan{background:#F1F5FA;filter:none;position:relative}
.salle-plan::before,.salle-plan::after{display:none}
.salle-plan .maplibregl-canvas{outline:none}
.salle-plan .maplibregl-ctrl-group{border:0;border-radius:12px 4px 12px 4px;box-shadow:0 2px 8px rgba(14,27,43,.18);overflow:hidden;background:var(--surface)}
.salle-plan .maplibregl-ctrl-group button{width:32px;height:32px;background-color:var(--surface)}
.salle-plan .maplibregl-ctrl-group button+button{border-top:1px solid var(--filet)}
.salle-plan .maplibregl-ctrl-attrib{background:rgba(255,255,255,.8);font:500 .62rem var(--titre);color:var(--doux);border-radius:8px 0 0 0}
.salle-plan .maplibregl-ctrl-attrib a{color:var(--doux)}
.salle-plan .maplibregl-cooperative-gesture-screen{font:600 .85rem var(--titre)}
.salle-pin{width:34px;height:34px}
.salle-pin span{display:block;width:30px;height:30px;margin:2px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);background:var(--l1);border:3px solid #fff;box-shadow:0 3px 10px rgba(14,27,43,.4)}
.salle-plan-echec{margin:0;padding:18px;font-size:.9rem;color:var(--doux)}

/* L'agenda des villes reste collé à droite de sa colonne (le script qui le recentrait est neutralisé) */
.agenda-jours{transform:none!important}
/* Liste à côté de la carte : quatre sorties par ligne */
.vc-liste .grille{grid-template-columns:repeat(4,minmax(0,1fr))}

/* Carte des listes : même habillage que la carte d'une salle (commandes, mentions, fond) */
#plan{background:#F1F5FA}
#plan .leaflet-control-zoom{border:0;box-shadow:0 2px 8px rgba(14,27,43,.18);border-radius:12px 4px 12px 4px;overflow:hidden}
#plan .leaflet-control-zoom a{width:34px;height:34px;line-height:34px;color:var(--encre);background:var(--surface);border:0;font-weight:700}
#plan .leaflet-control-zoom a+a{border-top:1px solid var(--filet)}
#plan .leaflet-control-attribution{background:rgba(255,255,255,.8);font:500 .62rem var(--titre);color:var(--doux)}
#plan .leaflet-control-attribution a{color:var(--doux)}
.maplibregl-canvas{outline:none}

/* ===== Cartes : retour au thème par défaut partout (tuiles OpenStreetMap, commandes et repère Leaflet standards) ===== */
.salle-plan{background:var(--gris);filter:none}
.salle-plan::before,.salle-plan::after{display:none!important}
.salle-plan .leaflet-tile-pane{filter:none!important;mix-blend-mode:normal!important}
.salle-plan .leaflet-control-zoom,#plan .leaflet-control-zoom{border:2px solid rgba(0,0,0,.2);border-radius:4px;box-shadow:none;overflow:visible;background-clip:padding-box}
.salle-plan .leaflet-control-zoom a,#plan .leaflet-control-zoom a{width:30px;height:30px;line-height:30px;color:#000;background:#fff;border:0;border-bottom:1px solid #ccc;font-weight:700}
.salle-plan .leaflet-control-zoom a+a,#plan .leaflet-control-zoom a+a{border-top:0}
.salle-plan .leaflet-control-attribution,#plan .leaflet-control-attribution{background:rgba(255,255,255,.8);font:12px/1.4 Arial,sans-serif;color:#333;border-radius:0}
.salle-plan .leaflet-control-attribution a,#plan .leaflet-control-attribution a{color:#0078A8}
#plan{background:#E3EAF2}

/* ===== Page d'une sortie : même langage que la page d'une salle (carte héros, tuiles de date, bloc lieu avec carte) ===== */
.sortie-hero{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:34px;padding:30px 34px;margin:8px 0 30px;border-radius:var(--forme);background:linear-gradient(120deg,var(--surface) 0%,var(--surface) 55%,var(--surface-2) 100%);box-shadow:0 2px 4px rgba(14,27,43,.06),0 18px 40px -16px rgba(14,27,43,.28);align-items:start}
.sortie-affiche .fiche-photo{margin:0;height:auto;aspect-ratio:4/5;max-height:560px;border-radius:var(--forme)}
.sortie-corps{min-width:0;display:flex;flex-direction:column;gap:12px}
.sortie-genre{margin:0}
.sortie-genre a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font:700 .74rem var(--titre);letter-spacing:.1em;text-transform:uppercase;color:color-mix(in srgb,var(--c,var(--l6)) 75%,var(--encre))}
.sortie-genre .ligne{width:24px;height:24px}
.sortie-titre{margin:0;font-size:clamp(1.8rem,3.6vw,2.9rem);line-height:1.08;letter-spacing:-.03em;text-wrap:balance}
.sortie-lieu{margin:0;font-size:1.05rem;color:var(--doux)}
.sortie-lieu a{color:var(--encre);font-weight:700;text-decoration:none}
.sortie-lieu a:hover{text-decoration:underline}
.sortie-dates{margin-top:6px}
.sortie-dates-titre{margin:0 0 8px;font:800 1.05rem var(--display,var(--titre));color:var(--encre)}
.sortie-dates-titre small{font:600 .8rem var(--titre);color:var(--doux);margin-left:6px}
.sortie-mois{margin:10px 0 6px;font:700 .72rem var(--titre);letter-spacing:.08em;text-transform:uppercase;color:var(--doux)}
.sortie-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.date-choix{display:grid;width:58px;border-radius:12px 4px 12px 4px;overflow:hidden;background:var(--surface);border:1px solid color-mix(in srgb,var(--filet) 80%,transparent);box-shadow:0 1px 3px rgba(14,27,43,.05);text-align:center;text-decoration:none;color:var(--encre);transition:border-color .2s ease}
.date-choix b{display:block;background:var(--doux);color:#fff;font:800 .56rem/1 var(--titre);letter-spacing:.1em;padding:5px 0 4px}
.date-choix strong{display:block;font:800 1.25rem/1.15 var(--display,var(--titre));padding-top:2px}
.date-choix small{display:block;font:700 .66rem var(--titre);color:var(--doux);padding-bottom:5px}
.date-choix:hover,.date-choix:focus-visible{border-color:var(--encre)}
.date-choix.actif{border-color:var(--l1);box-shadow:0 0 0 1px var(--l1),0 6px 14px -8px color-mix(in srgb,var(--l1) 70%,transparent)}
.date-choix.actif b{background:var(--l1)}
.sortie-resume{margin-top:8px;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--filet) 80%,transparent)}
.sortie-quand{margin:0 0 4px;font:800 1.2rem/1.3 var(--display,var(--titre));color:var(--encre)}
.sortie-quand small{font:500 .85rem var(--titre);color:var(--doux)}
.sortie-tarif{margin:0;color:var(--doux)}
.sortie-tarif b{color:var(--encre)}
.sortie-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:6px 0 0}
.sortie-actions .coeur-fiche{position:static}
.sortie-corps .fiche-note{margin:0;max-width:60ch}
.sortie-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:30px 36px;align-items:start;margin-bottom:30px}
.sortie-principal{min-width:0}
.sortie-bloc h2{font:800 1.3rem var(--display,var(--titre));margin:0 0 10px}
.sortie-bloc .fiche-texte{margin:0 0 28px;max-width:70ch}
.sortie-lieu-bloc{border:1px solid var(--filet);border-radius:var(--forme);padding:14px 14px 16px;background:var(--surface);box-shadow:var(--ombre-carte);position:sticky;top:84px}
.sortie-lieu-tete{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.sortie-lieu-tete .salle-rond{width:56px;height:56px}
.sortie-lieu-tete .salle-genre{margin:0;font-size:.68rem}
.sortie-lieu-nom{margin:2px 0 0;font:800 1.05rem/1.25 var(--display,var(--titre));color:var(--encre)}
.sortie-lieu-bloc .salle-plan{height:200px}
.sortie-lieu-liens{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:6px 4px 0;font:700 .85rem var(--titre)}
@media (max-width:1000px){
  .sortie-hero{grid-template-columns:1fr;padding:22px 20px}
  .sortie-affiche .fiche-photo{max-height:420px}
  .sortie-layout{grid-template-columns:1fr}
  .sortie-lieu-bloc{position:static}
}
@media (prefers-reduced-motion:reduce){.date-choix{transition:none}}

/* Page d'une sortie : avec la colonne du lieu à droite, les blocs de cartes passent à quatre par ligne */
.sortie-principal .grille,.sortie-principal .grille-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.sortie-principal .grille,.sortie-principal .grille-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:760px){.sortie-principal .grille,.sortie-principal .grille-4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.sortie-principal .grille,.sortie-principal .grille-4{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Page d'une sortie : le bloc du lieu commence à la hauteur des cartes « Dans la même salle » */
.sortie-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;column-gap:36px;align-items:start}
.sortie-layout>.sortie-apropos{grid-column:1;grid-row:1}
.sortie-layout>.sortie-t-salle{grid-column:1;grid-row:2}
.sortie-layout>.sortie-g-salle{grid-column:1;grid-row:3}
.sortie-layout>.sortie-t-jour{grid-column:1;grid-row:4}
.sortie-layout>.sortie-g-jour{grid-column:1;grid-row:5}
.sortie-layout>.sortie-lieu-bloc{grid-column:2;grid-row:3 / span 3;position:sticky;top:84px;align-self:start}
.sortie-titre-bloc{margin:0 0 14px;font:800 1.3rem var(--display,var(--titre));color:var(--encre)}
.sortie-g-salle{margin-bottom:30px}
.sortie-g-jour{margin-bottom:0}
.sortie-layout>.grille{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){
  .sortie-layout{grid-template-columns:1fr}
  .sortie-layout>*{grid-column:1;grid-row:auto}
  .sortie-layout>.sortie-apropos{order:1}
  .sortie-layout>.sortie-lieu-bloc{order:2;position:static;margin-bottom:26px}
  .sortie-layout>.sortie-t-salle,.sortie-layout>.sortie-g-salle,.sortie-layout>.sortie-t-jour,.sortie-layout>.sortie-g-jour{order:3}
}
@media (max-width:760px){.sortie-layout>.grille{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.sortie-layout>.grille{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Page d'une sortie : le lieu et sa carte à droite, à la hauteur du héros ; les blocs de cartes en dessous sur toute la largeur, cinq par ligne */
.sortie-haut{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:30px;align-items:start;margin:8px 0 30px}
.sortie-haut .sortie-hero{margin:0;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:28px;padding:26px 28px}
.sortie-haut>.sortie-lieu-bloc{position:static;grid-column:2;grid-row:auto;align-self:start}
.sortie-layout{display:block}
.sortie-layout>*{grid-column:auto;grid-row:auto}
.sortie-layout>.grille,.sortie-layout>.grille-4{grid-template-columns:repeat(5,minmax(0,1fr))}
.sortie-layout>.sortie-apropos{margin-bottom:26px}
@media (max-width:1100px){.sortie-layout>.grille{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:1000px){
  .sortie-haut{grid-template-columns:1fr}
  .sortie-haut .sortie-hero{grid-template-columns:1fr;padding:22px 20px}
  .sortie-haut>.sortie-lieu-bloc{grid-column:1}
}
@media (max-width:819px){.sortie-layout>.grille{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.sortie-layout>.grille{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Page d'une sortie : type et titre en haut du héros, affiche plus basse et plus petite, lieu cliquable et chiffres de la salle sous la carte */
.sortie-haut .sortie-hero{grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:18px 28px;padding:24px 28px}
.sortie-entete{grid-column:1 / -1;display:flex;flex-direction:column;gap:8px}
.sortie-entete .sortie-titre{font-size:clamp(1.7rem,3.2vw,2.5rem)}
.sortie-haut .sortie-affiche .fiche-photo{max-height:420px}
.sortie-lieu-nom a{color:var(--encre);text-decoration:none}
.sortie-lieu-nom a:hover,.sortie-lieu-nom a:focus-visible{text-decoration:underline}
a.salle-rond{text-decoration:none}
.sortie-lieu-chiffres{list-style:none;margin:12px 0 4px;padding:12px 0 0;border-top:1px solid color-mix(in srgb,var(--filet) 80%,transparent);display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px}
.sortie-lieu-chiffres b{display:block;font:800 1.2rem/1.1 var(--display,var(--titre));color:var(--encre)}
.sortie-lieu-chiffres span{font-size:.78rem;color:var(--doux)}
@media (max-width:1000px){.sortie-haut .sortie-hero{grid-template-columns:1fr}}

/* Texte d'introduction de la fiche, avant le bouton de réservation */
.sortie-intro{margin:14px 0 12px;font-size:.9rem;line-height:1.55;color:var(--encre)}
.sortie-lieu-chiffres{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 24px;text-align:center}
.sortie-lieu-chiffres li{text-align:center}
.sortie-lieu-bloc .salle-plan-adresse{font-size:.9rem;line-height:1.45;text-align:center}
.sortie-intro .surligne,.sortie-lieu-bloc .surligne{background:linear-gradient(transparent 58%,var(--surligne,#FEF08A) 58%,var(--surligne,#FEF08A) 92%,transparent 92%);color:inherit}
.sortie-lieu-bloc .salle-plan-adresse{text-align:left}
.sortie-lieu-liens{display:flex;justify-content:space-between;align-items:center;gap:12px}
.sortie-lieu-chiffres{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;justify-content:stretch}
.sortie-lieu-chiffres li{padding:0 6px}
.sortie-lieu-chiffres li+li{border-left:1px solid var(--filet)}
.sortie-lieu-liens{margin-top:18px}
.sortie-lieu-itineraire{margin:10px 0 0;text-align:center;font-size:.9rem}
.sortie-lieu-liens a:not(.bouton){flex:1;text-align:center}
.sortie-lieu-liens .bouton:only-child{margin:0 auto}

/* Pages d'information : favoris, annoncer, à propos, contact, mentions, confidentialité, robot */
.page-hero{margin:6px 0 24px;padding:34px 40px 30px;border-radius:var(--forme);background:linear-gradient(120deg,var(--surface) 0%,var(--surface) 55%,var(--surface-2) 100%);box-shadow:0 2px 4px rgba(14,27,43,.06),0 18px 40px -16px rgba(14,27,43,.28);position:relative;overflow:hidden}
.page-hero .titre-page{margin:0;font-size:clamp(1.9rem,4vw,3rem);line-height:1.05;letter-spacing:-.03em;text-wrap:balance}
.page-lead{margin:14px 0 0;max-width:68ch;font-size:1.05rem;line-height:1.6;color:var(--encre)}
.page-lead .surligne,.page-conseils .surligne{background:linear-gradient(transparent 58%,var(--surligne,#FEF08A) 58%,var(--surligne,#FEF08A) 92%,transparent 92%);color:inherit}
.page-chiffres{display:flex;flex-wrap:wrap;gap:8px 28px;margin:18px 0 0;font-size:.95rem;color:var(--doux)}
.page-chiffres b{font:800 1.5rem var(--display);color:var(--encre);margin-right:6px}
.page-carte{padding:26px 30px;border-radius:var(--forme);background:var(--surface);border:1px solid color-mix(in srgb,var(--filet) 70%,transparent);box-shadow:var(--ombre-carte)}
.page-carte>*:first-child{margin-top:0}
.page-carte h2,.page-villes h2{margin:0 0 10px;font:800 1.25rem var(--display);letter-spacing:-.015em}
.page-carte h2::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--l1);margin-right:10px;vertical-align:middle}
.page-carte p{margin-top:10px;line-height:1.6}
.page-carte.texte{max-width:none;margin-top:0}
.page-carte.texte h2{margin-top:30px}
.page-carte.texte h2:first-child{margin-top:0}
.page-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.page-carte-accent{background:linear-gradient(135deg,color-mix(in srgb,var(--l1) 10%,var(--surface)),var(--surface))}
.page-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.page-villes{margin:28px 0 8px}
.liste-coches{list-style:none;padding:0;margin:8px 0 0}
.liste-coches li{position:relative;padding-left:26px;margin-top:10px;line-height:1.55}
.liste-coches li::before{content:"";position:absolute;left:2px;top:.45em;width:12px;height:7px;border-left:3px solid var(--l1);border-bottom:3px solid var(--l1);transform:rotate(-45deg)}
.voies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:20px}
.voie{position:relative;padding:26px 24px 20px;border-radius:var(--forme);background:var(--surface);border:1px solid color-mix(in srgb,var(--filet) 70%,transparent);box-shadow:var(--ombre-carte);display:flex;flex-direction:column}
.voie-num{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--l1);color:#fff;font:800 1.2rem var(--display);margin-bottom:12px}
.voie:nth-child(2) .voie-num{background:var(--l2)}.voie:nth-child(3) .voie-num{background:var(--l3)}
.voie h2{margin:0;font:800 1.15rem var(--display);letter-spacing:-.015em}
.voie p{margin-top:10px;line-height:1.55;font-size:.95rem}
.voie-pied{margin-top:auto!important;padding-top:14px;font-size:.82rem!important;font-weight:700;color:var(--doux);text-transform:uppercase;letter-spacing:.05em}
.fav-page{margin-top:4px}
.fav-vide{text-align:center;padding:44px 24px;border-radius:var(--forme);background:var(--surface);border:1px dashed var(--filet)}
.fav-vide h2{margin:12px 0 6px;font:800 1.4rem var(--display)}
.fav-vide-coeur{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:color-mix(in srgb,var(--l1) 12%,var(--surface));color:var(--l1)}
.fav-vide-coeur svg{width:30px;height:30px}
.fav-vide-villes{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px}
.page-villes .fav-vide-villes{justify-content:flex-start}
.fav-outils{text-align:center;margin-top:24px}
@media (max-width:900px){.voies,.page-grille{grid-template-columns:1fr}.page-hero{padding:24px 22px 22px}.page-carte{padding:20px}}

/* Plan du site */
.plan-villes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:24px}
.plan-ville{border-radius:var(--forme);background:var(--surface);border:1px solid color-mix(in srgb,var(--filet) 70%,transparent);box-shadow:var(--ombre-carte);overflow:hidden;display:flex;flex-direction:column}
.plan-photo{display:block;aspect-ratio:16/6;background:var(--gris);overflow:hidden}
.plan-photo img{width:100%;height:100%;object-fit:cover;display:block}
.plan-corps{padding:18px 22px 22px}
.plan-corps h2{margin:0 0 6px;font:800 1.25rem var(--display);letter-spacing:-.015em}
.plan-corps h2 a{text-decoration:none}
.plan-groupe{margin:14px 0 6px;font:700 .74rem var(--titre);letter-spacing:.1em;text-transform:uppercase;color:var(--doux)}
.plan-liens{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.plan-liens a{display:inline-flex;align-items:center;gap:7px;padding:6px 13px 6px 10px;border-radius:999px;background:var(--gris);font-size:.88rem;font-weight:600;color:var(--encre);text-decoration:none}
.plan-liens a:hover{background:color-mix(in srgb,var(--l1) 12%,var(--gris))}
.plan-liens svg{width:16px;height:16px;flex:none}
.plan-site .plan-liens a{padding-left:13px}
@media (max-width:900px){.plan-villes{grid-template-columns:1fr}}

/* Filtre petits points retiré des images */
.photo::before,.fiche-photo::before,.ville-bandeau::before,.ville-carte::before,.phare-photo::before,.mag-img::before,.texte figure::before,.article-une::before{content:none!important;display:none!important;background:none!important}

/* ===== Pied de page : bandeau, colonnes allégées, villes en pastilles (toujours sombre) ===== */
.pied{--p-fond:#0B1626;--p-texte:#C9D3E0;--p-doux:#8D9BB0;--p-filet:rgba(255,255,255,.1);margin-top:64px;padding:0 0 28px;background:var(--p-fond);color:var(--p-texte);font-size:.92rem;position:relative}
.pied-in{max-width:var(--max);margin:0 auto;padding:0 40px}
.pied a{color:inherit;text-decoration:none}
.pied-bandeau{position:relative;top:-36px;margin-bottom:-4px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 36px;padding:30px 36px;border-radius:var(--forme);color:#fff;background:linear-gradient(110deg,#E4002B 0%,#7A2FC9 55%,#0072CE 100%);box-shadow:0 24px 50px -22px rgba(0,0,0,.55)}
.pied-bandeau h2{margin:0;font:800 clamp(1.4rem,3vw,2rem) var(--display);letter-spacing:-.025em;color:#fff}
.pied-bandeau p{margin:6px 0 0;opacity:.9;color:#fff}
.pied-moments{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.pied-moments a{display:inline-flex;align-items:center;gap:8px;padding:11px 18px 11px 14px;border-radius:999px;background:#fff;color:#0E1B2B;font:700 .95rem var(--titre);box-shadow:0 6px 16px -8px rgba(0,0,0,.5);transition:transform .15s ease}
.pied-moments a:hover{transform:translateY(-2px)}
.pied-moments svg{width:18px;height:18px}
.pied-corps{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.7fr);gap:36px 56px;padding:8px 0 30px}
.pied-marque .logo{color:#fff}
.pied-marque p{margin:14px 0 0;max-width:38ch;line-height:1.6}
.pied-cta{margin-top:18px!important}
.pied-col h2{margin:0 0 14px;font:700 .74rem var(--titre);letter-spacing:.12em;text-transform:uppercase;color:var(--p-doux)}
.pied-col ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.pied-col a{display:inline-flex;align-items:center;gap:10px;padding:6px 0;color:#fff;font-weight:600}
.pied-col a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.pied-col svg{width:18px;height:18px;flex:none}
.pied-simple a{font-weight:500;color:var(--p-texte)}
.pied-villes{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:22px 0;border-top:1px solid var(--p-filet)}
.pied-villes span{margin-right:8px;font:700 .74rem var(--titre);letter-spacing:.12em;text-transform:uppercase;color:var(--p-doux)}
.pied-villes a{padding:7px 14px;border-radius:999px;border:1px solid var(--p-filet);font-size:.88rem}
.pied-villes a:hover{background:rgba(255,255,255,.08);color:#fff}
.pied-bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 28px;padding-top:20px;border-top:1px solid var(--p-filet);font-size:.82rem;color:var(--p-doux)}
.pied-bas p{margin:0}
.pied-bas a{padding:4px 1px;text-decoration:underline;text-underline-offset:3px}
@media (max-width:900px){.pied-corps{grid-template-columns:1fr 1fr}.pied-marque{grid-column:1/-1}}
@media (max-width:640px){.pied-in{padding:0 16px}.pied-bandeau{padding:22px 20px;top:-28px}.pied-corps{grid-template-columns:1fr}}
.pied-fait{display:flex;align-items:center;gap:6px;color:var(--p-texte)}
.pied-fait a{font-weight:700;color:#fff}
.pied-coeur{display:inline-flex;color:#E4002B}
.pied-coeur svg{width:16px;height:16px;fill:#E4002B;stroke:#E4002B}
.pied-col li a>svg{color:#fff;fill:currentColor}

/* Titre du site : le 1 rouge (« trouver 1 spectacle ») */
.logo-un{color:#E4002B;font-weight:800}

/* Promesses : sans publicité, sans inscription */
.promesses{margin:34px 0;padding:30px 34px;border-radius:var(--forme);background:linear-gradient(120deg,var(--surface) 0%,var(--surface) 55%,var(--surface-2) 100%);box-shadow:0 2px 4px rgba(14,27,43,.06),0 18px 40px -16px rgba(14,27,43,.28)}
.promesses-tete h2{margin:0;font:800 clamp(1.3rem,2.6vw,1.8rem) var(--display);letter-spacing:-.025em;text-wrap:balance}
.promesses-tete p{margin:10px 0 0;max-width:70ch;line-height:1.6;color:var(--doux)}
.promesses .surligne{background:linear-gradient(transparent 58%,var(--surligne,#FEF08A) 58%,var(--surligne,#FEF08A) 92%,transparent 92%);color:inherit}
.promesses-liste{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.promesses-liste li{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border-radius:var(--forme);background:var(--gris);line-height:1.5}
.promesses-liste li b{font:800 1.05rem var(--display)}
.promesses-liste li>span:last-child{font-size:.9rem;color:var(--doux)}
.promesse-icone{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--l1);color:#fff;margin-bottom:6px}
.promesses-liste li:nth-child(2) .promesse-icone{background:var(--l2)}.promesses-liste li:nth-child(3) .promesse-icone{background:var(--l4)}
.promesse-icone svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.promesses-liste li:nth-child(3) .promesse-icone svg{fill:currentColor}
@media (max-width:900px){.promesses{padding:22px 20px}.promesses-liste{grid-template-columns:1fr}}

/* Mes favoris (en-tête) : cœur et pastille du nombre en rouge */
.lien-favoris svg{color:#E4002B;fill:#E4002B;stroke:#E4002B}
.lien-fav-nb{background:#E4002B;color:#fff}

/* Comment ça marche : trois barres aux couleurs du logo */
.etapes{counter-reset:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none;padding:0}
.etapes .etape{--c:#E4002B;--c-texte:#fff;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:26px 24px 24px;border:0;border-radius:var(--forme);background:linear-gradient(160deg,color-mix(in srgb,var(--c) 11%,var(--surface)) 0%,var(--surface) 60%);box-shadow:var(--ombre-carte);color:var(--doux);overflow:hidden}
.etapes .etape.e2{--c:#0072CE}
.etapes .etape.e3{--c:#F2B705;--c-texte:#0E1B2B}
.etape-barre{display:grid;place-items:end center;width:46px;height:78px;padding-bottom:10px;margin-bottom:10px;border-radius:23px;background:var(--c);color:var(--c-texte);box-shadow:0 12px 20px -12px var(--c)}
.etape-barre b{font:800 1.6rem/1 var(--display);margin:0;color:inherit;display:block}
.etapes .etape h3{margin:0;font:800 1.15rem var(--display);letter-spacing:-.015em;color:var(--encre)}
.etapes .etape p{margin:0;line-height:1.55}
.etapes .etape::after{content:"";position:absolute;right:-60px;top:-60px;width:140px;height:140px;border-radius:50%;background:var(--c);opacity:.08}
@media (max-width:900px){.etapes{grid-template-columns:1fr}.etapes .etape{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:16px}.etape-barre{height:56px;width:46px;margin:0;grid-row:span 2}.etapes .etape h3{flex:1 1 calc(100% - 70px)}.etapes .etape p{flex-basis:100%}}

/* Héros de l'accueil : pointillés gris clair en fond, comme un chemin qu'on cherche */
.accueil-hero{position:relative;isolation:isolate}
.accueil-hero::before{content:"";position:absolute;top:0;right:0;bottom:0;width:52%;z-index:-1;pointer-events:none;opacity:.75;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520 540' fill='none' stroke='%23B9C2CF' stroke-width='3.5' stroke-linecap='round' stroke-dasharray='0.1 12'%3E%3Cpath d='M20 500 C 90 470, 120 400, 70 350 C 20 300, 60 230, 150 240 C 250 252, 250 340, 180 360 C 110 380, 130 450, 220 440 C 330 428, 330 300, 300 220 C 270 140, 340 80, 410 120 C 470 155, 430 220, 380 210 C 330 200, 350 130, 420 60'/%3E%3C/svg%3E") center/contain no-repeat}
.accueil-hero::after{content:"";position:absolute;top:34px;right:calc(52% * .22 + 6px);width:16px;height:16px;border-radius:50%;border:3px solid #C9D1DC;opacity:.9;z-index:-1;pointer-events:none}
@media (max-width:820px){.accueil-hero::before,.accueil-hero::after{display:none}}

/* FAQ : coins du site, questions numérotées sur pastille de couleur */
.faq{counter-reset:question;border-radius:var(--forme);padding:6px 26px;overflow:hidden}
.faq details{counter-increment:question;--c:#E4002B;--c-texte:#fff;padding:14px 0}
.faq details:nth-child(5n+2){--c:#0072CE}
.faq details:nth-child(5n+3){--c:#F2B705;--c-texte:#0E1B2B}
.faq details:nth-child(5n+4){--c:#00844A}
.faq details:nth-child(5n+5){--c:#7A2FC9}
.faq summary{justify-content:flex-start;gap:14px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:counter(question);flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:11px 4px 11px 4px;background:var(--c);color:var(--c-texte);font:800 .95rem var(--display)}
.faq summary::after{margin-left:auto;flex:none;color:var(--c)}
.faq details[open] summary::before{box-shadow:0 8px 16px -8px var(--c)}
.faq details p{margin:10px 0 2px 48px;color:var(--doux);line-height:1.6}
@media (max-width:640px){.faq{padding:4px 16px}.faq details p{margin-left:0}}
.pied-marque .pied-accroche{font-size:1.1rem;line-height:1.55;color:#fff;max-width:46ch}
.pied-marque .pied-seo-texte{font-size:.95rem;line-height:1.7;max-width:62ch}
.pied-marque .pied-seo-texte b,.pied-marque .pied-accroche b{color:#fff;font-weight:700}
.etapes .etape.e3{--c-texte:#fff}

/* Tuile calendrier des cartes : légèrement transparente */
.carte-cal{opacity:.8}
.carte-cal{opacity:.9;transition:opacity .2s ease}
.carte:hover .carte-cal,.carte:focus-within .carte-cal{opacity:1}

/* Pages d'information : pleine largeur, avec une colonne de liens utiles à droite */
.page-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.page-cols.avec-aside{grid-template-columns:minmax(0,1fr) 320px;align-items:start}
.page-main{min-width:0}
.page-main .texte{max-width:none}
.page-main .bloc:first-child{margin-top:28px}
.page-aside{display:grid;gap:18px;position:sticky;top:calc(var(--h-bar,72px) + 16px)}
.aside-bloc{padding:22px 24px;border-radius:var(--forme);background:var(--surface);border:1px solid color-mix(in srgb,var(--filet) 70%,transparent);box-shadow:var(--ombre-carte)}
.aside-bloc h2{margin:0 0 12px;font:800 1.05rem var(--display);letter-spacing:-.015em}
.aside-bloc p{margin:8px 0 0;line-height:1.55;font-size:.92rem}
.aside-liens{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.aside-liens a{display:flex;align-items:center;gap:10px;padding:8px 10px;margin:0 -10px;border-radius:12px 4px 12px 4px;font-weight:600;text-decoration:none;color:var(--encre)}
.aside-liens a:hover{background:var(--gris)}
.aside-liens svg{width:18px;height:18px;flex:none}
.aside-articles a{font-weight:500;line-height:1.35}
.aside-pied{font-size:.85rem!important}
.aside-accent{background:linear-gradient(135deg,color-mix(in srgb,var(--l1) 10%,var(--surface)),var(--surface))}
.aside-promesse{background:var(--gris);box-shadow:none}
.aside-promesse b{color:var(--encre)}
@media (max-width:980px){.page-cols.avec-aside{grid-template-columns:minmax(0,1fr)}.page-aside{position:static;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}}
.aside-accent{background:var(--surface)}

/* Menu déroulant : texte aligné à gauche */
.pop-menu{text-align:left}
.pop-menu .menu-reglages .theme-choix,.pop-menu .menu-reglages .taille-texte{justify-content:flex-start}
.alerte-passe{max-width:var(--max);margin:16px auto 0;padding:14px 20px;border-radius:var(--forme);font-weight:600}
.page-sortie .alerte-passe,main>.alerte-passe{box-sizing:border-box}

/* Installer l'application : entrée du menu (visible seulement quand le navigateur sait installer le site) */
.pop-menu .menu-installer{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:10px;background:none;color:inherit;font:inherit;font-size:.95rem;text-align:left;cursor:pointer}
.pop-menu .menu-installer[hidden]{display:none}
.pop-menu .menu-installer:hover{background:var(--gris)}
.pop-menu .menu-installer svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;color:var(--l1)}
.installer-aide{position:fixed;left:12px;right:12px;bottom:84px;z-index:90;max-width:420px;margin:0 auto;padding:18px 20px;border-radius:var(--forme);background:var(--surface);color:var(--encre);box-shadow:0 20px 50px -12px rgba(14,27,43,.45);border:1px solid var(--filet)}
.installer-aide[hidden]{display:none}
.installer-aide p{margin:0 0 10px;line-height:1.5;font-size:.95rem}
.installer-aide .bouton{margin-top:4px}