/* Manoir Pub : styles communs et accueil (repris de prototypes/frise-moderne.html) */
@property --x{syntax:"<length-percentage>";inherits:true;initial-value:68%}
@property --y{syntax:"<length-percentage>";inherits:true;initial-value:38%}
:root{--orange:#e8701c;--orange-2:#ff8a34;--nuit:#150a05;--nuit-2:#241208;--os:#f5e3bd;--sang:#a3170d;
  --titre:"Big Shoulders Display",Impact,sans-serif;--gothique:"Grenze Gotisch",serif}
*{box-sizing:border-box;margin:0}
html{overflow-x:clip;scrollbar-color:var(--orange) var(--nuit);scroll-behavior:smooth;scroll-padding-top:4.5rem;-webkit-text-size-adjust:100%}
body{font:400 clamp(1.02rem,.3vw + .96rem,1.18rem)/1.5 "Schibsted Grotesk",system-ui,sans-serif;color:var(--os);background:var(--nuit);overflow-x:clip}
::selection{background:var(--orange);color:var(--nuit)}
a{color:inherit;text-underline-offset:.2em}
:focus-visible{outline:3px solid var(--nuit);outline-offset:2px;box-shadow:0 0 0 5px var(--os)}
h1,h2,h3{text-wrap:balance}

.barre{position:fixed;z-index:20;inset:0 0 auto;display:flex;align-items:center;gap:clamp(.8rem,2.4vw,2.2rem);padding:.5rem clamp(1rem,2.6vw,2.2rem);background:#150a05e0;backdrop-filter:blur(12px)}
.marque{font:900 1.65rem/1 var(--gothique);color:var(--orange-2);text-decoration:none;margin-right:auto;white-space:nowrap}
.barre nav{display:flex;gap:clamp(.8rem,2vw,1.8rem);font-weight:700;font-size:.97em}
.barre nav a{text-decoration:none}@media (hover:hover) and (pointer:fine){.barre nav a:hover{color:var(--orange-2)}}
.etat{display:inline-flex;align-items:center;gap:.5em;font-weight:500;font-size:.92em;white-space:nowrap}
.etat i{width:.58em;height:.58em;border-radius:50%;background:#c9b8a0}
.etat.ouvert i{background:#8fe07a}

.ouverture{position:relative;height:100svh;min-height:600px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:0 clamp(1rem,2.6vw,2.2rem) clamp(6.4rem,15vh,9rem);animation:derive 16s ease-in-out infinite alternate}
@keyframes derive{0%{--x:24%;--y:34%}50%{--x:72%;--y:26%}100%{--x:50%;--y:52%}}
.ouverture.main{animation:none}
.ouverture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sombre{filter:brightness(.34) saturate(.55) contrast(1.05)}
.clair{filter:brightness(1.08) saturate(1.08);-webkit-mask:radial-gradient(circle 40vmax at var(--x) var(--y),#000 22%,#0000 78%);mask:radial-gradient(circle 40vmax at var(--x) var(--y),#000 22%,#0000 78%)}
.voile{position:absolute;inset:0;background:linear-gradient(#150a0500 34%,#150a05d9 82%)}
.une{position:relative;z-index:2}
.une h1{font:900 clamp(3.7rem,11.2vw,12.5rem)/.84 var(--titre);text-transform:uppercase;letter-spacing:-.012em;max-width:13em}
.une .plus{color:var(--orange-2)}
.bas{display:flex;flex-wrap:wrap;gap:.8rem 1.6rem;align-items:center;margin-top:clamp(.9rem,2vh,1.5rem)}
.quand{font:800 clamp(1.7rem,3vw,2.8rem)/1 var(--gothique);color:var(--os)}
.btn{display:inline-block;background:var(--orange);color:var(--nuit);font-weight:700;padding:.72em 1.35em;text-decoration:none;border-radius:999px;transition:transform .18s cubic-bezier(.2,.8,.3,1),background .18s}@media (hover:hover) and (pointer:fine){.btn:hover{background:var(--orange-2);transform:translateY(-2px)}}
.btn:active{transform:translateY(1px) scale(.98)}

/* La frise : le fil du programme, posé en travers de la page */
.frise{position:relative;z-index:6;margin:clamp(-5.2rem,-8vh,-3.6rem) -3vw 0;background:var(--orange);color:var(--nuit);transform:rotate(-1.6deg);overflow:hidden;padding:.34rem 0 .4rem;white-space:nowrap;font:900 clamp(1.9rem,3.6vw,3.5rem)/1 var(--titre);text-transform:uppercase}
.frise div{display:inline-flex;animation:defile 46s linear infinite}@media (hover:hover) and (pointer:fine){.frise:hover div{animation-play-state:paused}}
.frise span{padding-right:.5em}
.frise em{font:900 .95em/1 var(--gothique);text-transform:none;font-style:normal;color:#5a1a05;padding-right:.5em}
@keyframes defile{to{transform:translateX(-50%)}}
.autocollant{position:absolute;z-index:7;right:clamp(.6rem,5vw,5.5rem);top:-7.4rem;width:clamp(120px,15vw,230px);height:auto;transform:rotate(6deg);filter:drop-shadow(0 12px 16px #0007);transition:transform .3s cubic-bezier(.2,1.25,.4,1)}@media (hover:hover) and (pointer:fine){.autocollant:hover{transform:rotate(-3deg) scale(1.06)}}
.apres-frise{position:relative}

.programme{background:var(--orange);color:var(--nuit);padding:clamp(5rem,10vw,8.4rem) clamp(1rem,4vw,3.6rem) clamp(3.4rem,7vw,6rem);margin-top:-3.2rem}
.programme h2{font:900 clamp(3.4rem,8vw,7.5rem)/.86 var(--gothique);margin-bottom:clamp(1.8rem,4vw,3.4rem);max-width:12em}
.liste{--l:90%;max-width:1320px;margin-inline:auto}
.rang>img{width:clamp(3.2rem,5vw,4.8rem);height:auto;transition:transform .3s cubic-bezier(.2,1.25,.4,1)}@media (hover:hover) and (pointer:fine){.rang:hover>img{transform:rotate(-6deg) scale(1.08)}}
.rang.stage>img{width:clamp(4rem,6.4vw,6.2rem)}
.rang .act{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}
.btn2{display:inline-block;padding:.66em 1.2em;border-radius:999px;box-shadow:inset 0 0 0 2px currentColor;font-weight:700;text-decoration:none;white-space:nowrap;transition:transform .18s cubic-bezier(.2,.8,.3,1),background .18s,color .18s}@media (hover:hover) and (pointer:fine){.btn2:hover{background:var(--orange);color:var(--nuit);box-shadow:none;transform:translateY(-2px)}}
.btn2:active{transform:translateY(1px) scale(.98)}
.rang{position:relative;display:grid;grid-template-columns:clamp(5rem,9vw,8rem) clamp(4rem,6.4vw,6.2rem) minmax(0,1fr) auto;gap:.2rem clamp(.9rem,2vw,1.8rem);align-items:center;padding:clamp(.75rem,1.2vw,1.05rem) clamp(1.1rem,2.6vw,2.4rem);margin-bottom:.7rem;isolation:isolate;width:var(--l);color:var(--nuit);transition:color .2s}
.rang:nth-child(odd){rotate:.32deg}
.rang:nth-child(even){rotate:-.42deg;margin-left:auto}
.rang .papier{position:absolute;inset:0;z-index:-1;background:var(--os);filter:url(#dechire);transition:background .2s}@media (hover:hover) and (pointer:fine){.rang:hover{color:var(--os)}}@media (hover:hover) and (pointer:fine){.rang:hover .papier{background:var(--nuit)}}@media (hover:hover) and (pointer:fine){.rang:hover time,.rang:hover .det{color:var(--orange-2)}}
.rang time{font:900 clamp(2.3rem,4vw,3.9rem)/.82 var(--titre);color:var(--sang);transition:color .2s}
.rang time small{display:block;font-size:.4em;letter-spacing:.02em;text-transform:uppercase;margin-top:.22em}
.rang h3{font:800 clamp(1.5rem,2.4vw,2.2rem)/.98 var(--gothique)}
.rang p{font-size:.92em;margin-top:.15em}
.rang.stage{padding-block:clamp(1.1rem,2vw,1.7rem)}
.rang.stage h3{font:900 clamp(2.1rem,4.6vw,4.3rem)/.9 var(--titre);text-transform:uppercase}
.rang.gaming{padding-block:clamp(.95rem,1.6vw,1.4rem)}
.rang.gaming>img{width:clamp(3.7rem,5.8vw,5.6rem)}
.rang.gaming h3{font:900 clamp(1.8rem,3.5vw,3.3rem)/.92 var(--titre);text-transform:uppercase}
.rang.recurrent{--l:78%;padding-block:clamp(.5rem,.9vw,.75rem)}
.rang.recurrent time{font-size:clamp(1.3rem,2vw,1.9rem);line-height:.9}
.rang.recurrent time small{font-size:.62em}
.rang.recurrent>img{width:clamp(2.6rem,4vw,3.6rem)}
.rang.recurrent h3{font-size:clamp(1.3rem,2vw,1.8rem)}
.rang.annule h3{text-decoration:line-through;text-decoration-thickness:.09em;color:#6b4a38}
.rang.annule time{color:#7a5544}.rang.annule>img{opacity:.55}
/* Reporté : le concert n'est pas mort, il change de date */
.rang.reporte h3{color:#5a3a2a}.rang.reporte time{color:#7a5544}
.pastille.reporte{background:var(--nuit);color:var(--orange-2)}
/* Fermeture : un avis, pas une soirée */
.rang.fermeture{--l:78%;padding-block:clamp(.5rem,.9vw,.75rem)}
.rang.fermeture h3{font-size:clamp(1.3rem,2vw,1.8rem)}
.rang.fermeture time{font-size:clamp(1.6rem,2.6vw,2.4rem)}
.rang.fermeture>img{width:clamp(2.6rem,4vw,3.6rem);filter:grayscale(1);opacity:.6}
.pastille{display:inline-block;margin-right:.55em;padding:.16em .6em .2em;border-radius:3px;background:var(--sang);color:#fff1cf;font:900 clamp(1.3rem,1.7vw,1.65rem)/1 var(--titre);text-transform:uppercase;letter-spacing:.04em}
.pastille.gratuit{background:var(--nuit);color:var(--orange-2);margin:0;align-self:center}
.rang .btn{background:var(--sang);color:var(--os)}@media (hover:hover) and (pointer:fine){.rang .btn:hover{background:var(--orange-2);color:var(--nuit)}}
.det{font-weight:700}
.style{display:inline-block;margin-right:.55em;padding:.16em .6em .2em;border-radius:3px;background:var(--nuit);color:var(--os);font:800 clamp(1.3rem,1.7vw,1.65rem)/1 var(--titre);text-transform:uppercase;letter-spacing:.01em;transition:background .2s,color .2s}
.style.vide{background:none;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor;opacity:.72}@media (hover:hover) and (pointer:fine){.rang:hover .style{background:var(--orange);color:var(--nuit)}}
.anciens{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.2rem 1.5rem;max-width:1320px;margin:clamp(1.6rem,3.4vw,2.8rem) auto 0;padding:.5rem .9rem .6rem;border-top:3px solid var(--nuit);border-bottom:3px solid var(--nuit);font:900 clamp(2rem,5.4vw,5.2rem)/1 var(--titre);text-transform:uppercase;text-decoration:none;transition:background .18s,color .18s,padding .25s cubic-bezier(.2,.8,.3,1)}
.anciens small{font:800 .62em/1 var(--gothique);text-transform:none}
.anciens.complet+.anciens{margin-top:0;border-top:0}@media (hover:hover) and (pointer:fine){.anciens:hover{background:var(--nuit);color:var(--orange-2);padding-left:1.6rem}}
@supports (animation-timeline:view()){
  .rang{animation:deroule linear both;animation-timeline:view();animation-range:entry 0% entry 34%}
  @keyframes deroule{from{transform:translateY(22px) rotate(-1.4deg) scaleX(.97)}}
}

.taverne{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.4rem,3vw,2.6rem) clamp(.8rem,1.6vw,1.3rem);padding:clamp(4rem,9vw,7.6rem) clamp(1rem,4vw,3.6rem)}
.taverne h2{grid-column:1/-1;font:900 clamp(3.6rem,11.4vw,11.6rem)/.84 var(--titre);text-transform:uppercase;letter-spacing:-.01em}
.taverne h2 em{font:900 .92em/.84 var(--gothique);text-transform:none;font-style:normal;color:var(--orange-2)}
.taverne figure{overflow:hidden}
.taverne figure img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.23,1,.32,1)}@media (hover:hover) and (pointer:fine){.taverne figure:hover img{transform:scale(1.04)}}
.g1{grid-column:1/9;aspect-ratio:8/5.4}.g2{grid-column:9/13;margin-top:clamp(2rem,9vw,8rem);aspect-ratio:4/5}
.mots{grid-column:1/6}.mots p{max-width:46ch}
.cartes{grid-column:6/13;list-style:none;padding:0}
.cartes a{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.42rem .6rem .5rem;border-top:2px solid #f5e3bd33;font:900 clamp(2.5rem,5.6vw,5.4rem)/1 var(--titre);text-transform:uppercase;text-decoration:none;transition:background .18s,color .18s,padding .25s cubic-bezier(.2,.8,.3,1)}
.cartes span{font:400 clamp(.9rem,1vw,1.05rem)/1.4 "Schibsted Grotesk",sans-serif;text-transform:none;text-align:right;max-width:20ch}@media (hover:hover) and (pointer:fine){.cartes a:hover{background:var(--orange);color:var(--nuit);padding-left:1.3rem}}

.live{position:relative;height:clamp(460px,92vh,920px);overflow:hidden;display:flex;align-items:flex-end}
.live img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@supports (animation-timeline:view()){.live img{animation:avance linear both;animation-timeline:view()}@keyframes avance{from{transform:scale(1.06)}to{transform:scale(1)}}}
.live div{position:relative;width:100%;padding:clamp(5rem,16vh,9rem) clamp(1rem,4vw,3.6rem) clamp(1.6rem,4vw,3.2rem);background:linear-gradient(#150a0500,#150a05e8 66%)}
.live h2{font:900 clamp(4rem,11vw,10rem)/.82 var(--gothique);color:var(--orange-2)}
.live p{max-width:58ch;margin-top:.6rem}.live a{color:var(--orange-2)}

footer{background:var(--orange);color:var(--nuit);padding:clamp(2.6rem,5vw,4.2rem) clamp(1rem,4vw,3.6rem);display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.8rem}
footer h3{font:900 1.9rem/1 var(--titre);text-transform:uppercase;margin-bottom:.4rem}
footer table{border-collapse:collapse;font-variant-numeric:tabular-nums}footer td{padding:.06rem 1rem .06rem 0;white-space:nowrap}
/* Grand écran : trois colonnes égales sur toute la largeur (la ligne de mentions empêchait la grille automatique de s'étirer) */
body>footer{grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr))}
@media (min-width:900px){body>footer{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(2rem,5vw,6rem)}}

@media (max-width:820px){
  .barre nav{display:none}
  .etat{white-space:normal;font-size:.8em;line-height:1.15;text-align:right;max-width:13.5em}
  .autocollant{top:-6.4rem}
  .liste{--l:95%}
  .rang,.rang.stage,.rang.gaming{grid-template-columns:4.7rem minmax(0,1fr)}
  .rang.recurrent{--l:95%}
  .rang time{grid-area:1/1}.rang>img,.rang.stage>img,.rang.gaming>img{grid-area:2/1;width:3.5rem;margin-top:.3rem}
  .rang .txt{grid-area:1/2/3/3}.rang .act{grid-area:3/2;justify-content:flex-start;margin-top:.45rem}
  .rang .act:empty{display:none}
  .g1,.mots,.cartes{grid-column:1/-1}.g2{display:none}
}
.menu-mobile{display:none}
@media (max-width:820px){
  .menu-mobile{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;z-index:20;inset:auto 0 0;background:#150a05f5;padding:0 .2rem env(safe-area-inset-bottom);font-weight:700;font-size:.95rem}
  .menu-mobile>a,.menu-mobile summary{display:flex;align-items:center;justify-content:center;min-height:3.2rem;text-decoration:none;color:var(--os);cursor:pointer;list-style:none}
  .menu-mobile summary::-webkit-details-marker{display:none}
  .menu-mobile summary::after{content:"";width:.42em;height:.42em;margin-left:.4em;border:solid currentColor;border-width:2px 0 0 2px;rotate:45deg;translate:0 .15em;transition:rotate .2s}
  .menu-mobile [open] summary{color:var(--orange-2)}.menu-mobile [open] summary::after{rotate:225deg;translate:0 -.1em}
  .menu-mobile>a[aria-current]{color:var(--orange-2)}
  .tiroir>div{position:fixed;left:.6rem;right:.6rem;bottom:calc(3.6rem + env(safe-area-inset-bottom));display:grid;gap:.2rem;padding:.5rem;background:var(--os);border-radius:10px;box-shadow:0 -1rem 2.4rem #000a;transform-origin:bottom center;animation:tiroir .24s cubic-bezier(.32,.72,0,1)}
  .tiroir>div a{display:block;padding:.75rem .9rem;border-radius:7px;color:var(--nuit);text-decoration:none;font:900 1.45rem/1.05 var(--titre);text-transform:uppercase}
  .tiroir>div a small{display:block;font:400 .9rem/1.3 "Schibsted Grotesk",sans-serif;text-transform:none;opacity:.75;margin-top:.15rem}.tiroir>div a[aria-current]{background:var(--orange)}@media (hover:hover) and (pointer:fine){.tiroir>div a:hover{background:var(--orange)}}
  body{padding-bottom:3.4rem}
  .ouverture{padding-bottom:calc(clamp(6.4rem,15vh,9rem) + 2.4rem)}
}
@keyframes tiroir{from{opacity:0;translate:0 .6rem}}
@media (max-height:620px){.ouverture{min-height:0;height:auto;padding-top:6rem}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
.pied-sombre{background:var(--nuit);color:var(--os)}
.pied-sombre h3{color:var(--orange-2)}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.admin-bar .barre{top:32px}
@media (max-width:782px){.admin-bar .barre{top:46px}}

/* Affiches des concerts à venir : posées comme des posters placardés. */
.une.avec-affiche{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:clamp(1.2rem,3vw,3rem)}
.une.avec-affiche .titre-une{grid-area:1/1}
.une.avec-affiche h1{font-size:clamp(3.2rem,8.6vw,10rem)}
.affiche{grid-area:1/2;position:relative;display:block;margin:0 clamp(.5rem,4vw,5rem) clamp(1.5rem,6vh,4.5rem) 0;width:clamp(12rem,23vw,22rem);rotate:2.4deg;transition:rotate .3s cubic-bezier(.2,1.25,.4,1),scale .3s cubic-bezier(.2,1.25,.4,1)}@media (hover:hover) and (pointer:fine){.affiche:hover{rotate:0deg;scale:1.03}}
.ouverture .affiche img{position:static;display:block;width:100%;height:auto;max-height:calc(100svh - 19rem);object-fit:contain;box-shadow:0 1.4rem 3rem #000b,0 0 0 1px #0006}
.affiche::before{content:"";position:absolute;z-index:1;top:-.7rem;left:50%;width:5.4rem;height:1.5rem;translate:-50% 0;rotate:-4deg;background:#f5e3bdc4;box-shadow:0 1px 3px #0005}
.rang .vignette{display:block;justify-self:center;width:clamp(3.4rem,5.4vw,5.2rem);rotate:-3deg;transition:rotate .3s cubic-bezier(.2,1.25,.4,1),scale .3s cubic-bezier(.2,1.25,.4,1)}
.rang .vignette img{display:block;width:100%;height:auto;box-shadow:0 .35rem .8rem #150a0570}@media (hover:hover) and (pointer:fine){.rang:hover .vignette{rotate:2deg;scale:1.08}}
.rang.annule .vignette{opacity:.5}
.visionneuse{margin:auto;border:0;padding:0;background:none;max-width:min(94vw,64rem);max-height:94svh;overflow:visible}
.visionneuse::backdrop{background:#150a05e8}
.visionneuse img{display:block;max-width:min(94vw,64rem);max-height:88svh;width:auto;height:auto;box-shadow:0 1.5rem 4rem #000}
.visionneuse button{position:absolute;top:-.6rem;right:-.6rem;width:2.6rem;height:2.6rem;border:0;border-radius:50%;background:var(--orange);color:var(--nuit);font:900 1.6rem/1 var(--titre);cursor:pointer}
@media (max-width:820px){
  .une.avec-affiche{grid-template-columns:1fr;gap:1rem}
  .une.avec-affiche .titre-une{grid-area:auto}
  .affiche{grid-area:auto;justify-self:end;width:auto;margin-right:.6rem}
  .ouverture .affiche img{max-height:30svh;width:auto;max-width:56vw}
  .une.avec-affiche h1{font-size:clamp(2.6rem,11vw,4.4rem)}
  .rang .vignette{grid-area:2/1;width:3.5rem;margin-top:.3rem;justify-self:start}
}
footer .fermeture{margin-top:.6rem;font-weight:700;color:var(--sang)}.pied-sombre .fermeture{color:var(--orange-2)}

/* Communauté WhatsApp : un billet sombre posé sur le programme. */
.commu{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(1.4rem,4vw,3.4rem);align-items:center;max-width:1320px;margin:clamp(2.6rem,5vw,4.4rem) auto 0;padding:clamp(1.6rem,3.6vw,3rem) clamp(1.4rem,4vw,3.6rem);background:var(--nuit);color:var(--os);border-radius:6px;rotate:-.6deg;box-shadow:0 1.6rem 2.6rem -1.4rem #150a05d9}
.commu::before{content:"";position:absolute;inset:.55rem;border:2px dashed #f5e3bd30;border-radius:3px;pointer-events:none}
.commu-sur{font:800 clamp(1.3rem,2vw,1.7rem)/1 var(--gothique);color:var(--orange-2)}
.commu h2{font:900 clamp(2.8rem,6.6vw,6rem)/.88 var(--titre);text-transform:uppercase;margin:.35rem 0 .6rem}
.commu-txt>p:not(.commu-sur){max-width:44ch;font-size:1.08em}
.commu-btn{display:inline-flex;align-items:center;gap:.55em;margin-top:1.2rem;padding:.8em 1.5em;border-radius:999px;background:#25d366;color:#0b2e17;font-weight:700;font-size:1.08em;text-decoration:none;transition:transform .18s cubic-bezier(.2,.8,.3,1),background .18s}@media (hover:hover) and (pointer:fine){.commu-btn:hover{background:#4be082;transform:translateY(-2px)}}
.commu-qr{margin:0;text-align:center;rotate:2deg}
.commu-qr img{display:block;width:clamp(8.5rem,13vw,11rem);height:auto;padding:.55rem;background:#fff;border-radius:6px}
.commu-qr figcaption{margin-top:.5rem;font-size:.85em;color:#f5e3bdb3}
@media (max-width:820px),(hover:none) and (pointer:coarse){.commu{grid-template-columns:minmax(0,1fr)}.commu-qr{display:none}.commu-btn{width:100%;justify-content:center}}

/* Fenêtre WhatsApp (ordinateur) : QR code à scanner avec le téléphone */
.wa-fenetre{margin:auto;width:min(92vw,27rem);overflow:hidden;border:0;border-radius:8px;padding:clamp(1.4rem,3vw,2rem);background:var(--os);color:var(--nuit);text-align:center;box-shadow:0 2rem 4rem #000a}
.wa-fenetre::backdrop{background:#150a05d9}
.wa-fenetre h2{font:900 clamp(2rem,4vw,2.6rem)/1 var(--titre);text-transform:uppercase;color:var(--sang)}
.wa-fenetre p{margin-top:.5rem;font-size:.95em}
.wa-fenetre .qr{width:13rem;margin:1.1rem auto;padding:.4rem;background:#fff;border-radius:6px}
.wa-fenetre .qr svg{display:block;width:100%;height:auto}
.wa-fenetre .choix{display:grid;gap:.6rem}.wa-fenetre .choix a{display:block;white-space:normal;transform:none}
.wa-fenetre .btn{background:#25d366;color:#0b2e17}@media (hover:hover) and (pointer:fine){.wa-fenetre .btn:hover{background:#4be082}}
.wa-fenetre .btn2{display:inline-block;padding:.66em 1.2em;border-radius:999px;box-shadow:inset 0 0 0 2px currentColor;font-weight:700;text-decoration:none;font-size:.92em}
.wa-fenetre .fermer{position:absolute;top:.6rem;right:.6rem;width:2.2rem;height:2.2rem;border:0;border-radius:50%;background:var(--nuit);color:var(--os);font:900 1.4rem/1 var(--titre);cursor:pointer}

/* « Ajouter le programme à mon agenda » : menu déroulant natif (details/summary) */
.sous-programme{max-width:1320px;margin:1.2rem auto 0}
.abonnement{position:relative;display:inline-block;margin-top:1.1rem;color:var(--nuit)}
.abonnement summary{list-style:none;display:inline-flex;align-items:center;gap:.5em;padding:.66em 1.2em;border-radius:999px;box-shadow:inset 0 0 0 2px currentColor;font-weight:700;cursor:pointer;transition:background .18s,color .18s,transform .18s cubic-bezier(.2,.8,.3,1)}
.abonnement summary::-webkit-details-marker{display:none}
.abonnement summary::before{content:"";width:1em;height:1em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-2V2h-2v2H9V2zm-2 8h14v10H5zm6 2v3H8v2h3v3h2v-3h3v-2h-3v-3z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-2V2h-2v2H9V2zm-2 8h14v10H5zm6 2v3H8v2h3v3h2v-3h3v-2h-3v-3z'/%3E%3C/svg%3E") center/contain no-repeat}.abonnement[open] summary{background:var(--nuit);color:var(--os);box-shadow:none}@media (hover:hover) and (pointer:fine){.abonnement summary:hover{background:var(--nuit);color:var(--os);box-shadow:none}}
.abonnement>div{position:absolute;z-index:8;top:calc(100% + .5rem);left:0;width:min(88vw,21rem);padding:1rem 1.1rem;background:var(--os);color:var(--nuit);border-radius:8px;box-shadow:0 1.2rem 2.4rem -.8rem #150a05cc}
.abonnement ul{list-style:none;padding:0;margin:.7rem 0;display:grid;gap:.35rem}
.abonnement li a{display:block;padding:.55rem .8rem;border-radius:6px;background:#150a050f;font-weight:700;text-decoration:none}@media (hover:hover) and (pointer:fine){.abonnement li a:hover{background:var(--orange);color:var(--nuit)}}
.abonnement .petit{font-size:.85em;opacity:.8}
.abonnement .petit a{word-break:break-all}

/* Dernière ligne du pied de page */
footer .mentions{grid-column:1/-1;margin-top:1.4rem;padding-top:.9rem;border-top:1px solid currentColor;border-color:color-mix(in srgb,currentColor 25%,transparent);font-size:.85em;opacity:.8}
footer .mentions a{color:inherit}

/* Lecture : pas de mot orphelin en fin de paragraphe */
p,li{text-wrap:pretty}
/* Pied de page : liens assez grands pour le doigt */
footer p a{display:inline-block;padding:.3rem 0}
footer .fermeture{display:inline-block;margin-top:.7rem;padding:.25em .6em;border-radius:4px;background:var(--nuit);color:var(--orange-2)!important;font-weight:700}

/* Fenêtres (affiche en grand, WhatsApp) : entrée courte depuis 96 %, jamais depuis rien */
.visionneuse,.wa-fenetre{opacity:1;scale:1;transition:opacity .2s cubic-bezier(.23,1,.32,1),scale .2s cubic-bezier(.23,1,.32,1),overlay .2s allow-discrete,display .2s allow-discrete}
.visionneuse::backdrop,.wa-fenetre::backdrop{opacity:1;transition:opacity .2s ease-out}
@starting-style{.visionneuse[open],.wa-fenetre[open]{opacity:0;scale:.96}.visionneuse[open]::backdrop,.wa-fenetre[open]::backdrop{opacity:0}}
/* Menu « Ajouter à mon agenda » : sort de son bouton */
.abonnement[open]>div{transform-origin:top left;animation:deroule-menu .18s cubic-bezier(.23,1,.32,1)}
@keyframes deroule-menu{from{opacity:0;scale:.97;translate:0 -.3rem}}
/* Pression : chaque élément cliquable répond au doigt */
.abonnement summary:active,.menu-mobile summary:active,.menu-mobile>a:active,.commu-btn:active{scale:.97}
.abonnement summary,.menu-mobile summary,.menu-mobile>a{transition:scale .12s ease-out,background .18s,color .18s}

/* Heures sous la date du prochain concert */
.quand small{display:block;margin-top:.35rem;font:700 clamp(1rem,1.4vw,1.2rem)/1.2 "Schibsted Grotesk",sans-serif;color:var(--orange-2);letter-spacing:.01em}

/* Titres qui mènent à la page du concert */
.lien-titre,.rang h3 a{color:inherit;text-decoration:none}
@media (hover:hover) and (pointer:fine){.lien-titre:hover{color:var(--orange-2)}.rang h3 a:hover{text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.12em}}

/* Nos alliés : une rangée de logos sobre en bas de l'accueil */
.allies{background:var(--nuit);color:var(--os);padding:clamp(2.2rem,4vw,3.2rem) clamp(1rem,4vw,3.6rem);display:flex;flex-direction:column;align-items:center;gap:clamp(1.2rem,2.4vw,1.8rem);border-top:1px solid #f5e3bd1f}
.allies h2{font:800 clamp(1.5rem,2.4vw,2rem)/1 var(--gothique);color:var(--orange-2);text-align:center}
.allies ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1.4rem clamp(1.6rem,4.5vw,3.6rem)}
.allies img{display:block;height:clamp(3.4rem,6vw,5rem);width:auto;opacity:.88;transition:opacity .2s ease,transform .32s cubic-bezier(.2,1.25,.4,1),filter .32s ease}
/* Survol : le logo se soulève et penche un peu, comme un écusson qu'on décroche du mur, avec une lueur de torche. */
@media (hover:hover) and (pointer:fine){.allies a:hover img,.allies a:focus-visible img{opacity:1;transform:translateY(-5px) rotate(-3deg) scale(1.06);filter:drop-shadow(0 8px 14px rgb(232 112 28 / .35))}}
@media (prefers-reduced-motion:reduce){.allies img{transition:opacity .2s ease}.allies a:hover img,.allies a:focus-visible img{transform:none}}

/* Annulé / reporté : papier hachuré + grosse étiquette au-dessus du titre */
.rang.annule .papier{background:repeating-linear-gradient(-45deg,#ecd5b0 0 14px,#e4c9a2 14px 28px)}
.rang.reporte .papier{background:repeating-linear-gradient(-45deg,#f5e3bd 0 14px,#efd6aa 14px 28px)}
.rang .etat{display:inline-block;margin-bottom:.45rem;padding:.12em .55em .16em;border-radius:4px;rotate:-2deg;background:var(--sang);color:#fff1cf;font:900 clamp(1.6rem,2.6vw,2.3rem)/1 var(--titre);text-transform:uppercase;letter-spacing:.06em;box-shadow:0 .3rem .7rem -.2rem #150a0580}
.rang .etat.reporte{background:var(--nuit);color:var(--orange-2)}
.rang.annule .txt p,.rang.reporte .txt p{font-weight:700}

/* Second bouton du haut de l'accueil, clair sur la photo sombre */
.bas .btn2.clair{color:var(--os)}
@media (hover:hover) and (pointer:fine){.bas .btn2.clair:hover{background:var(--os);color:var(--nuit)}}

/* Banderole de concert : toute la banderole mène à la page du concert (les boutons et l'affiche gardent leur action) */
.rang h3 a.vers-concert{color:inherit;text-decoration:none}
.rang h3 a.vers-concert::after{content:"";position:absolute;inset:0;z-index:1}
.rang .act,.rang .vignette{position:relative;z-index:2}
@media (hover:hover) and (pointer:fine){.rang:has(a.vers-concert){cursor:pointer}}

/* Bouton « Partager » (même famille que « Ajouter à mon agenda ») */
.boutons-tete{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-start;margin-top:1.1rem}
.boutons-tete .abonnement{margin-top:0} /* sa marge propre sert sur l'accueil ; ici les deux boutons s'alignent */
.partage{position:relative;display:inline-block}
.partage summary{list-style:none;display:inline-flex;align-items:center;gap:.5em;padding:.66em 1.2em;border-radius:999px;box-shadow:inset 0 0 0 2px currentColor;font-weight:700;cursor:pointer;transition:scale .12s ease-out,background .18s,color .18s}
.partage summary::-webkit-details-marker{display:none}
.partage summary::before{content:"";width:1em;height:1em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 16a3 3 0 0 0-2.4 1.2l-6.7-3.4a3 3 0 0 0 0-1.6l6.7-3.4A3 3 0 1 0 15 7l-6.7 3.4a3 3 0 1 0 0 3.2L15 17a3 3 0 1 0 3-1z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 16a3 3 0 0 0-2.4 1.2l-6.7-3.4a3 3 0 0 0 0-1.6l6.7-3.4A3 3 0 1 0 15 7l-6.7 3.4a3 3 0 1 0 0 3.2L15 17a3 3 0 1 0 3-1z'/%3E%3C/svg%3E") center/contain no-repeat}
.partage summary:active{scale:.97}
.partage[open] summary{background:var(--nuit);color:var(--os);box-shadow:none}
@media (hover:hover) and (pointer:fine){.partage summary:hover{background:var(--nuit);color:var(--os);box-shadow:none}}
.partage>div{position:absolute;z-index:8;top:calc(100% + .5rem);left:0;width:min(80vw,15rem);padding:.6rem;background:var(--os);color:var(--nuit);border-radius:8px;box-shadow:0 1.2rem 2.4rem -.8rem #150a05cc;transform-origin:top left;animation:deroule-menu .18s cubic-bezier(.23,1,.32,1)}
.partage ul{list-style:none;padding:0;display:grid;gap:.3rem}
.partage li a,.partage li button{display:block;width:100%;padding:.55rem .8rem;border:0;border-radius:6px;background:#150a050f;color:var(--nuit);font:700 1rem/1.2 "Schibsted Grotesk",sans-serif;text-align:left;text-decoration:none;cursor:pointer}
@media (hover:hover) and (pointer:fine){.partage li a:hover,.partage li button:hover{background:var(--orange)}}
.fiche-actions .partage summary{color:var(--os)}