/*
Theme Name: Just For You – Lounge Fluide
Description: Thème sombre et élégant pour Just For You Dakar : restaurant, bar lounge et les salles. Version 2.8 : événements gérés depuis le tableau de bord (publication = affichage automatique sur l’accueil), page Galerie, liens et coordonnées réglables, corrections.
Version: 2.8.1
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: jfy-lounge-fluide
*/
:root{--bg:#0a0a0b;--bg2:#121214;--sand:#e5bd87;--blue:#2068cf;--pink:#e8176a;--red:#7d111b;--muted:#b9b4ab;--head:'Oswald',sans-serif;--body:'Montserrat',sans-serif;--serif:'Cormorant Garamond',serif;--ease:cubic-bezier(.2,.7,.2,1);--ease2:cubic-bezier(.7,0,.2,1);--L:min(230px,46vw,27vh)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:70px;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:#fff;font-family:var(--body);font-weight:300;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeSpeed}
html.menu-open,html.menu-open body{overflow:hidden}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
img,video{max-width:100%}
:focus-visible{outline:2px solid var(--sand);outline-offset:3px}
h1,h2,h3{font-family:var(--head);font-weight:500;text-transform:uppercase;line-height:1.05}
.serif{font-family:var(--serif);font-style:italic;font-weight:400}
.kicker{font-family:var(--head);letter-spacing:.4em;text-transform:uppercase;color:var(--sand);font-size:14px;display:flex;align-items:center;gap:14px}
.kicker:before{content:"";width:46px;height:1px;background:var(--sand)}

/* ---------- Header : seules les propriétés « transform » et « opacity » s'animent ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:80;display:flex;justify-content:center;align-items:center;padding:14px 5vw}
.site-header:before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(10,10,11,.94);opacity:0;transform-origin:top;transition:opacity .45s var(--ease),transform .45s var(--ease)}
.site-header.scrolled:before{opacity:1;transform:scaleY(.72)}
.wipe{-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent 55%);mask-image:linear-gradient(90deg,#000 45%,transparent 55%);-webkit-mask-size:250% 100%;mask-size:250% 100%;-webkit-mask-position:100% 0;mask-position:100% 0;animation:wipe 2s cubic-bezier(.6,.1,.2,1) .2s forwards}
.wipe.done{-webkit-mask:none;mask:none;animation:none}
@keyframes wipe{to{-webkit-mask-position:0 0;mask-position:0 0}}
@keyframes up{to{opacity:1;transform:none}}
@keyframes float{50%{transform:translate3d(0,-10px,0)}}
.nav{display:flex;align-items:center;gap:30px;transition:transform .45s var(--ease)}
.nav a{font-family:var(--head);text-transform:uppercase;letter-spacing:.2em;font-size:14px;position:relative}
.nav a:not(.res):after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:1px;background:var(--sand);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:not(.res):hover:after,.nav a.active:after{transform:none}
.nav .res{background:var(--pink);padding:10px 22px;transition:background-color .3s}.nav .res:hover{background:var(--blue)}
.burger{display:none;background:none;border:0;width:40px;height:30px;position:relative;cursor:pointer;transition:transform .45s var(--ease)}
.burger i{position:absolute;left:0;width:100%;height:2px;background:#fff;transition:transform .3s,opacity .3s,top .3s}
.burger i:nth-child(1){top:5px}.burger i:nth-child(2){top:14px}.burger i:nth-child(3){top:23px}
.open .burger i:nth-child(1){top:14px;transform:rotate(45deg)}.open .burger i:nth-child(2){opacity:0}.open .burger i:nth-child(3){top:14px;transform:rotate(-45deg)}
@media(min-width:901px){.scrolled .nav{transform:translateY(-12px)}}
@media(max-width:900px){
 .site-header{justify-content:flex-end}
 .burger{display:block;z-index:3}.scrolled .burger{transform:translateY(-12px)}
 .nav{position:fixed;inset:0;background:var(--bg);flex-direction:column;justify-content:center;gap:24px;transform:translate3d(0,-100%,0);visibility:hidden;transition:transform .5s var(--ease2),visibility 0s .5s;z-index:2}
 .open .nav{transform:none;visibility:visible;transition-delay:0s}
 .nav a{font-size:28px}
}

/* ---------- Hero : la vidéo, avec le logo qui flotte dessus ---------- */
.hero{position:relative;isolation:isolate;height:min(56.25vw,100svh);min-height:300px;margin-top:0;overflow:hidden;background:radial-gradient(circle at 70% 30%,rgba(232,23,106,.35),transparent 55%),radial-gradient(circle at 25% 75%,rgba(32,104,207,.4),transparent 55%),linear-gradient(160deg,#1a0a14,#05070f)}
.hero:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 48%,rgba(0,0,0,.16),transparent 60%),linear-gradient(#0004,#0000 14%)}
.hero-video{position:absolute;inset:0;width:100%;height:100%;max-width:none;filter:brightness(1.12) saturate(1.08);object-fit:contain;z-index:0;background:#000}
.hero-top{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 5vw 0;pointer-events:none;will-change:transform,opacity}
.hero-top .float{width:min(var(--L),30vh);animation:float 6s ease-in-out 3s infinite;will-change:transform}
.hero-top img{display:block;width:100%;height:auto;opacity:.92;filter:drop-shadow(0 4px 18px #0009);animation-duration:2.6s;animation-delay:.4s}
.hero-top p{margin-top:14px;font-size:clamp(20px,3vw,32px);color:#fff;text-shadow:0 2px 14px #000c}
.novideo{position:absolute;z-index:7;left:50%;top:84px;translate:-50% 0;width:min(92vw,560px);background:#000c;border:1px solid var(--sand);color:#fff;font-size:13px;line-height:1.5;padding:10px 14px;text-align:center}
.cue{position:absolute;z-index:6;left:50%;bottom:14px;translate:-50% 0;display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--head);letter-spacing:.35em;text-transform:uppercase;font-size:12px;color:var(--sand);animation:in-up 1s var(--ease) 3.2s backwards}
.cue i{display:block;width:1px;height:44px;background:linear-gradient(var(--sand),transparent);transform-origin:top;animation:cue 2.2s var(--ease2) infinite}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}

/* ---------- Les 3 univers : sous la vidéo ---------- */
.panels{display:flex;height:clamp(440px,70vh,660px);position:relative;background:var(--bg);margin-top:0}
.panel{flex:1 1 0;min-width:0;position:relative;overflow:hidden;contain:layout paint;display:flex;flex-direction:column;justify-content:flex-end;padding:40px 3vw clamp(36px,7vh,64px);transition:flex-grow .9s var(--ease2);border-right:1px solid #ffffff22;background-size:cover;background-position:center}
.panel:last-child{border:0}
.panel:hover,.panel:focus-visible{flex-grow:1.7}
.panel:before{content:"";position:absolute;inset:0;background:inherit;background-size:cover;transition:transform 1.6s var(--ease);will-change:transform}
.panel:hover:before{transform:scale(1.08)}
.panel:after{content:"";position:absolute;inset:0;background:linear-gradient(#0006,#0002 35%,#000d)}
.panel>*{position:relative;z-index:2}
.p1{background-image:radial-gradient(circle at 70% 30%,rgba(232,23,106,.45),transparent 55%),linear-gradient(160deg,#7d111b,#1a0307)}
.p2{background-image:radial-gradient(circle at 30% 70%,rgba(32,104,207,.55),transparent 55%),linear-gradient(160deg,#10224a,#05070f)}
.p3{background-image:radial-gradient(circle at 50% 30%,rgba(229,189,135,.45),transparent 55%),linear-gradient(160deg,#4a3a22,#0d0a06)}
.panel .num{font-family:var(--serif);font-style:italic;font-size:26px;color:var(--sand)}
.panel h2{font-size:clamp(30px,4vw,60px);margin:4px 0 10px}
.panel .pw p{max-width:340px;color:#ddd}
.panel .more{font-family:var(--head);letter-spacing:.25em;text-transform:uppercase;font-size:13px;margin-top:12px;color:var(--sand);transition:transform .4s var(--ease)}
.panel:hover .more{transform:translate3d(8px,0,0)}
.panel .num,.panel .more{display:block}
@media(max-width:800px){
 :root{--L:min(190px,50vw,26vh)}
 .hero{height:78svh;height:78vh;height:78svh;min-height:480px}
 .hero-video{object-fit:cover}
 .hero-top{padding-top:30px}
 .panels{flex-direction:column;height:auto}
 .panel{flex:1 0 auto;min-height:250px;padding:28px 6vw 30px;border-right:0;border-bottom:1px solid #ffffff22;justify-content:flex-end}
 .panel:hover,.panel:focus-visible{flex-grow:1}
 .panel .pw p{font-size:14px}
}

/* ---------- Univers sous la vidéo : texte animé ---------- */
.panel h2{perspective:600px}
.panel .split .w{overflow:hidden;padding:.08em .04em;margin:-.08em -.04em;vertical-align:top}
.js .panel .split .c{opacity:0;transform:translate3d(0,115%,0) rotateX(-70deg) skewY(6deg);transform-origin:50% 100%;filter:blur(6px);transition:opacity .8s var(--ease) calc(var(--b,0ms) + var(--i)*45ms),transform 1s var(--ease) calc(var(--b,0ms) + var(--i)*45ms),filter .8s var(--ease) calc(var(--b,0ms) + var(--i)*45ms)}
.js .panel .split.in .c{opacity:1;transform:none;filter:none}
.panel .rule{display:block;width:64px;height:2px;margin:0 0 14px;background:linear-gradient(90deg,var(--sand),var(--pink));transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease2) calc(var(--b,0ms) + .5s),width .6s var(--ease)}
.panel:hover .rule{width:120px}
.panel:nth-child(2) .rule{--b:150ms}.panel:nth-child(3) .rule{--b:300ms}
.panel .num.in~.rule,.panel:has(.split.in) .rule{transform:none}
/* survol : les lettres ondulent l'une après l'autre */
@keyframes wave{40%{transform:translate3d(0,-9px,0);color:var(--sand)}}
.panel:hover .split.in .c{animation:wave .7s var(--ease) calc(var(--i)*38ms)}
/* respiration lumineuse du numéro */
@keyframes pulse{50%{text-shadow:0 0 18px rgba(229,189,135,.8)}}
.panel .num.in{animation:pulse 3.4s ease-in-out 1.5s infinite}

/* ---------- Vidéo en arrière-plan des 3 univers ---------- */
.panels{isolation:isolate;overflow:hidden;background:#000}
.panel{background-color:#000;z-index:1}
.panel>.pv{position:absolute!important;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;z-index:0!important;filter:brightness(1.08) saturate(1.08)}
.panel:before{display:none}
.panel:after{background:linear-gradient(#0003,#0000 35%,#000c)}
.p1:after{background:linear-gradient(#0003,#0000 35%,#000c),radial-gradient(circle at 70% 30%,rgba(232,23,106,.18),transparent 60%)}
.p2:after{background:linear-gradient(#0003,#0000 35%,#000c),radial-gradient(circle at 30% 70%,rgba(32,104,207,.2),transparent 60%)}
.p3:after{background:linear-gradient(#0003,#0000 35%,#000c),radial-gradient(circle at 50% 30%,rgba(229,189,135,.18),transparent 60%)}

/* ---------- Vidéo unique : logo flottant en haut, univers en bas ---------- */
.panels{height:clamp(620px,100svh,920px)}
.panels .hero-top{inset:0 0 42%;padding:70px 5vw 0}
@media(max-width:800px){
 .panels{height:auto;padding-top:min(72svh,560px)}
 .panels .hero-top{inset:0 0 auto;height:min(72svh,560px)}
}

/* ---------- Marquee ---------- */
.marq{background:var(--sand);color:#000;overflow:hidden;white-space:nowrap;padding:14px 0}
.marq div{display:inline-block;animation:mq 28s linear infinite;will-change:transform;font-family:var(--head);text-transform:uppercase;letter-spacing:.25em;font-size:22px}
.marq.off div{animation-play-state:paused}
.marq span{margin:0 26px}.marq b{color:var(--red)}
@keyframes mq{to{transform:translate3d(-50%,0,0)}}

/* ---------- Sections split ---------- */
.univers{display:grid;grid-template-columns:1fr 1fr;min-height:92vh;min-height:92svh;position:relative}
.univers .media{position:relative;overflow:hidden;min-height:420px;background-size:cover;background-position:center;contain:paint}
.univers .media i{position:absolute;inset:-14% 0;background:inherit;background-size:cover;will-change:transform;backface-visibility:hidden}
.univers .media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,var(--bg))}
.univers.rev .media{order:2}.univers.rev .media:after{background:linear-gradient(270deg,transparent 60%,var(--bg))}
.univers .txt{padding:90px 7vw;display:flex;flex-direction:column;justify-content:center}
.univers h2{font-size:clamp(44px,7vw,100px);margin:14px 0 22px}
.univers p.lead{font-size:clamp(16px,1.8vw,20px);color:var(--muted);max-width:560px}
.m1{background-image:radial-gradient(circle at 60% 40%,rgba(125,17,27,.8),transparent 70%),linear-gradient(160deg,#3b0a10,#0a0a0b)}
.m2{background-image:radial-gradient(circle at 40% 50%,rgba(32,104,207,.6),transparent 70%),linear-gradient(160deg,#0f2552,#0a0a0b)}
.m3{background-image:radial-gradient(circle at 50% 50%,rgba(229,189,135,.5),transparent 70%),linear-gradient(160deg,#3d2f1a,#0a0a0b)}
.bar{background:var(--bg2)}.sem{background:#0f0d0a}
.menu{margin-top:34px;border-top:1px solid #ffffff2a}
.menu div{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid #ffffff2a;transition:background-color .3s}
.menu div>span{transition:transform .35s var(--ease)}
.menu div:hover{background:#ffffff08}.menu div:hover>span{transform:translate3d(14px,0,0)}
.menu strong{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(24px,3vw,34px);display:block;line-height:1.1}
.menu small{color:var(--muted)}
.menu a{border:1px solid var(--sand);color:var(--sand);padding:8px 20px;font-family:var(--head);letter-spacing:.2em;text-transform:uppercase;font-size:13px;white-space:nowrap;transition:background-color .3s,color .3s}
.menu a:hover{background:var(--sand);color:#000}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.chips span{border:1px solid #ffffff44;padding:8px 18px;font-family:var(--head);letter-spacing:.15em;text-transform:uppercase;font-size:13px;transition:background-color .3s,border-color .3s}
.chips span:hover{background:var(--blue);border-color:var(--blue)}
.btn{display:inline-block;align-self:flex-start;margin-top:34px;padding:15px 40px;background:var(--pink);font-family:var(--head);letter-spacing:.25em;text-transform:uppercase;transition:background-color .3s,color .3s,transform .35s var(--ease)}
.btn:hover{background:#fff;color:#000;transform:translate3d(0,-4px,0)}
.btn.sandb{background:var(--sand);color:#000}.btn.sandb:hover{background:#fff}
.feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:24px;margin-top:34px}
.feat div{text-align:center}
.feat svg{width:72px;height:auto;stroke:var(--sand);fill:none;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;transition:transform .4s var(--ease)}
.feat div:hover svg{transform:translate3d(0,-6px,0) scale(1.08)}
.feat h4{font-family:var(--head);text-transform:uppercase;letter-spacing:.1em;font-weight:400;font-size:16px;margin-top:8px}
@media(max-width:800px){.univers,.univers.rev{grid-template-columns:1fr}.univers .media,.univers.rev .media{order:0;min-height:300px}.univers .media:after,.univers.rev .media:after{background:linear-gradient(transparent 60%,var(--bg))}}

/* ---------- Événements ---------- */
.agenda{padding:100px 0 100px 7vw;background:var(--bg)}
.agenda h2{font-size:clamp(40px,7vw,84px);margin:14px 0 40px}
.strip{display:flex;gap:22px;overflow-x:auto;padding:0 7vw 20px 0;scroll-snap-type:x mandatory;scrollbar-width:thin;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.ev{display:flex;flex-direction:column;flex:0 0 min(300px,78vw);scroll-snap-align:start;border:1px solid #ffffff2a;transition:transform .4s var(--ease),border-color .4s;position:relative}
.ev:hover{transform:translate3d(0,-8px,0);border-color:var(--sand)}
.ev .im{flex:none;aspect-ratio:9/13;background:linear-gradient(160deg,#2b2b2e,#0d0d0f) center/cover;position:relative;overflow:hidden}
.ev .body{padding:18px;display:flex;flex-direction:column;flex:1}.ev h3{font-size:24px;font-weight:500}.ev .d{color:var(--sand);font-family:var(--serif);font-style:italic;font-size:22px}
.ev .tags{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding:0}
.ev .tags li{border:1px solid #ffffff3a;padding:3px 10px;font-family:var(--head);letter-spacing:.1em;text-transform:uppercase;font-size:12px;color:var(--muted);line-height:1.6}
.ev .tags li:first-child{border-color:var(--sand);color:var(--sand)}
.ev .cta{margin-top:auto;padding-top:16px;font-family:var(--head);letter-spacing:.25em;text-transform:uppercase;font-size:13px;color:var(--sand);transition:transform .35s var(--ease)}
.ev:hover .cta{transform:translate3d(6px,0,0)}
.ev .past,.ev .soon{position:absolute;top:10px;left:10px;z-index:1;background:#000;font-family:var(--head);text-transform:uppercase;font-size:12px;letter-spacing:.2em;padding:3px 10px}
.ev .soon{background:var(--pink)}
.ev .badge{position:absolute;top:10px;right:10px;z-index:1;display:flex;flex-direction:column;align-items:center;min-width:52px;padding:6px 8px;background:rgba(10,10,11,.82);border:1px solid var(--sand);font-family:var(--head);text-transform:uppercase;line-height:1}
.ev .badge b{font-size:24px;font-weight:500}.ev .badge i{font-style:normal;font-size:12px;letter-spacing:.15em;color:var(--sand);margin-top:3px}
.ev.is-past .im{opacity:.5}
.ev.is-past h3,.ev.is-past .d{opacity:.7}
.swipe,.dots,.next{display:none}

/* ---------- Contact ---------- */
.contact{background:var(--sand);color:#000;padding:100px 7vw 40px}
.cwrap{display:grid;grid-template-columns:1fr 1fr;gap:6vw;max-width:1200px;margin:auto}
.contact h2{font-size:clamp(40px,7vw,84px);margin:14px 0 22px}
.contact .kicker{color:#000}.contact .kicker:before{background:#000}
.contact address{font-style:normal;font-size:20px}
.contact address a:hover{text-decoration:underline}
.contact label{display:block;margin-top:22px;font-size:17px}
.contact input,.contact select,.contact textarea{width:100%;background:none;border:0;border-bottom:2px solid #000;border-radius:0;padding:10px 2px;font:inherit;font-size:19px;outline:0;color:#000;resize:none;transition:border-color .3s}
.contact input:focus,.contact select:focus,.contact textarea:focus{border-color:var(--blue)}
.contact button{margin-top:34px;width:100%;background:#000;color:var(--sand);border:0;padding:17px;font-family:var(--head);letter-spacing:.3em;text-transform:uppercase;font-size:17px;cursor:pointer;transition:background-color .3s,color .3s}
.contact button:hover{background:var(--pink);color:#fff}
.contact :focus-visible{outline-color:#000}
.hp{position:absolute;left:-9999px}.ok{background:#000;color:#fff;padding:12px;margin-bottom:10px}
.social{display:flex;gap:26px;margin-top:26px}.social svg{width:30px;height:30px;fill:#000;transition:transform .35s var(--ease)}.social a:hover svg{transform:translate3d(0,-5px,0)}
.legal{max-width:1200px;margin:70px auto 0;border-top:1px solid #0004;padding-top:22px;display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:space-between;font-size:14px}
.legal a:hover{text-decoration:underline}
@media(max-width:800px){.cwrap{grid-template-columns:1fr}}

/* ---------- Animations supplémentaires (transform / opacity uniquement) ---------- */
@keyframes in-up{from{opacity:0;transform:translate3d(0,28px,0)}}
@keyframes in-down{from{opacity:0;transform:translate3d(0,-16px,0)}}
@keyframes ring{0%{opacity:.85;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.28,1.75)}}
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:90;background:linear-gradient(90deg,var(--pink),var(--sand),var(--blue));transform:scaleX(0);transform-origin:left;will-change:transform;pointer-events:none}
.nav a{animation:in-down .7s var(--ease) backwards}
.nav a:nth-child(1){animation-delay:.25s}.nav a:nth-child(2){animation-delay:.33s}.nav a:nth-child(3){animation-delay:.41s}.nav a:nth-child(4){animation-delay:.49s}.nav a:nth-child(5){animation-delay:.57s}
.nav .res:before{content:"";position:absolute;inset:0;border:1px solid var(--pink);pointer-events:none;animation:ring 3s ease-out 3.6s infinite}
@media(max-width:900px){.nav a{animation:none}.open .nav a{animation:in-up .6s var(--ease) backwards}.open .nav a:nth-child(1){animation-delay:.25s}.open .nav a:nth-child(2){animation-delay:.32s}.open .nav a:nth-child(3){animation-delay:.39s}.open .nav a:nth-child(4){animation-delay:.46s}.open .nav a:nth-child(5){animation-delay:.53s}}
/* photos : rideau + zoom doux à l'apparition */
.js .univers .media:before{content:"";position:absolute;inset:0;z-index:2;background:var(--bg);transform-origin:left;transition:transform 1.2s var(--ease2)}
.js .univers.rev .media:before{transform-origin:right;background:var(--bg2)}
.js .univers.sem .media:before{background:#0f0d0a}
.js .univers .media.in:before{transform:scaleX(0)}
.js .univers .media i{scale:1.2;transition:scale 2s var(--ease)}
.js .univers .media.in i{scale:1}
/* diaporama des salles (fondu enchaîné) */
.slides i.s{opacity:0}.slides i.s.on{opacity:1}
.js .slides i.s{transition:scale 2s var(--ease),opacity 1.4s ease}
/* traits des kickers qui se dessinent */
.js .kicker.reveal:before{transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease)}
.js .kicker.reveal.in:before{transform:none}
/* pictogrammes dessinés */
.js .feat svg :is(path,rect){stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--ease) .25s}
.js .feat .in svg :is(path,rect){stroke-dashoffset:0}
/* petits effets au survol */
.btn{position:relative;overflow:hidden}
.btn:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);transform:translate3d(-120%,0,0);transition:transform .8s var(--ease)}
.btn:hover:after{transform:translate3d(120%,0,0)}
.chips span:hover{transform:translate3d(0,-3px,0)}.chips span{transition:background-color .3s,border-color .3s,transform .3s var(--ease)}
.ev .im{position:relative;overflow:hidden}
.ev .im:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(229,189,135,.2) 50%,transparent 65%);transform:translate3d(-100%,0,0);transition:transform .9s var(--ease)}
.ev:hover .im:after{transform:translate3d(100%,0,0)}
.contact input:focus,.contact textarea:focus,.contact select:focus{box-shadow:0 2px 0 var(--blue)}

/* ---------- Textes animés ---------- */
.js [data-words]:not(.ready),.js [data-load-words]:not(.ready){opacity:0}
.wd{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.wi{display:inline-block;will-change:transform}
[data-words] .wi{transform:translate3d(0,110%,0);transition:transform .85s var(--ease) calc(var(--b,0ms) + var(--i)*26ms)}
[data-words].in .wi{transform:none}
[data-load-words] .wi{animation:in-up .9s var(--ease) backwards;animation-delay:calc(var(--base,1s) + var(--p,0)*.18s + var(--i)*.09s)}
.kicker.in{animation:glow 1.8s ease .4s 1 both}
@keyframes glow{40%{text-shadow:0 0 18px rgba(229,189,135,.65)}}

/* ---------- Mobile : événements, bannière, carrousel ---------- */
@keyframes nudge{50%{transform:translate3d(8px,0,0)}}
@keyframes beat{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.4);opacity:0}}
@media(max-width:800px){
 .next{display:flex;align-items:center;gap:14px;padding:16px 5vw;background:linear-gradient(100deg,var(--red),#2a0509 70%);border-bottom:1px solid #ffffff22}
 .next .dot{position:relative;flex:0 0 10px;height:10px;border-radius:50%;background:var(--pink)}
 .next .dot:after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--pink);animation:beat 1.8s ease-out infinite}
 .next .nx{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
 .next small{font-family:var(--head);letter-spacing:.3em;text-transform:uppercase;font-size:11px;color:var(--sand)}
 .next strong{font-family:var(--head);font-weight:500;text-transform:uppercase;font-size:19px;letter-spacing:.04em;line-height:1.15}
 .next em{font-family:var(--serif);font-size:17px;color:#ddd}
 .next .go{flex:0 0 auto;background:var(--pink);padding:9px 14px;font-family:var(--head);letter-spacing:.15em;text-transform:uppercase;font-size:12px}
 .univers .txt{padding:56px 7vw 64px}
 .univers h2{font-size:clamp(38px,12vw,56px)}
 .univers .media,.univers.rev .media{min-height:260px}
 .menu div{flex-wrap:wrap}.menu a{padding:8px 16px}
 .agenda{padding:64px 0 56px 6vw}
 .agenda h2{margin-bottom:12px}
 .swipe{display:block;margin:0 0 18px;font-family:var(--head);letter-spacing:.3em;text-transform:uppercase;font-size:12px;color:var(--muted);transition:opacity .4s}
 .swipe i{display:inline-block;font-style:normal;color:var(--sand);animation:nudge 1.4s ease-in-out infinite}
 .swipe.gone{opacity:0}
 .strip{gap:16px;padding-right:6vw;scroll-padding-left:0}
 .ev{flex-basis:76vw}
 .ev .im{aspect-ratio:9/12}
 .dots{display:flex;gap:8px;margin-top:16px}
 .dots button{width:22px;height:4px;border:0;padding:0;background:#ffffff33;cursor:pointer;transform-origin:left;transition:background-color .3s,transform .3s var(--ease)}
 .dots button.on{background:var(--sand);transform:scaleX(1.8)}
 .contact{padding:64px 6vw 32px}
}

/* ---------- Animations d'apparition (opacity + transform uniquement) ---------- */
.js .reveal{opacity:0;transform:translate3d(0,40px,0);transition:opacity .9s var(--ease) var(--d,0ms),transform .9s var(--ease) var(--d,0ms)}
.js .strip .ev.reveal{transform:translate3d(0,50px,0)}
.js .chips .reveal{transform:translate3d(0,16px,0) scale(.88)}
.js .social .reveal{transform:translate3d(0,24px,0) scale(.7)}
.js .reveal.in,.js .strip .ev.reveal.in,.js .chips .reveal.in,.js .social .reveal.in{opacity:1;transform:none}
.js .split:not(.ready){opacity:0}
.split .w{display:inline-block;white-space:nowrap}
.split .c{display:inline-block;opacity:0;transform:translate3d(0,70%,0) rotate(3deg);transition:opacity .7s cubic-bezier(.2,.8,.2,1) calc(var(--b,0ms) + var(--i)*38ms),transform .7s cubic-bezier(.2,.8,.2,1) calc(var(--b,0ms) + var(--i)*38ms)}
.split.in .c{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
 .js .panel .split .c{filter:none;transform:none;opacity:1}.panel .rule{transform:none}.panel .num.in{animation:none}
 html{scroll-behavior:auto}
 *,*:before,*:after{animation-duration:.01s!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.01s!important;transition-delay:0s!important}
 .js .reveal,.js .strip .ev.reveal,.js .chips .reveal,.js .social .reveal,.split .c{opacity:1;transform:none}
 .js .univers .media i{scale:1}
 .nav .res:before{display:none}
 [data-words] .wi{transform:none}
 .marq div{animation:none}
}

/* ============================================================
   2.8.0 — Événements dynamiques, Galerie, pages, corrections
   ============================================================ */
.nav a:nth-child(6){animation-delay:.65s}
@media(max-width:900px){.open .nav a:nth-child(6){animation-delay:.6s}}
div.ev:hover{transform:none;border-color:#ffffff2a}
.agenda-empty{color:var(--muted);font-family:var(--serif);font-style:italic;font-size:22px;padding:10px 7vw 10px 0}
.agenda-more{margin-top:34px}
.agenda-more .btn{margin-top:0}

/* Logo d'accueil dans l'en-tête (pages autres que l'accueil) */
.brand{position:absolute;left:5vw;top:50%;transform:translateY(-50%);display:block;line-height:0}
.brand img{height:44px;width:auto;display:block}
@media(max-width:900px){.brand{z-index:3}}

/* Pages ordinaires (mentions légales, etc.) */
.page{padding:140px 7vw 90px;background:var(--bg);min-height:70vh}
.page-in{max-width:860px;margin:auto}
.page h1{font-size:clamp(36px,6vw,64px);margin:14px 0 30px}
.entry{font-size:17px;line-height:1.85}
.entry>*+*{margin-top:1.1em}
.entry h2,.entry h3{margin-top:1.8em;color:var(--sand)}
.entry h2{font-size:clamp(24px,3.4vw,34px)}.entry h3{font-size:22px}
.entry a:not(.btn){color:var(--sand);text-decoration:underline;text-underline-offset:3px}
.entry ul,.entry ol{padding-left:1.4em}
.entry img{height:auto}
.site-foot{background:var(--bg2);border-top:1px solid #ffffff1f;padding:26px 7vw;display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:space-between;font-size:14px;color:var(--muted)}
.site-foot a:hover{color:var(--sand)}

/* Galerie */
.gal{padding:140px 6vw 90px;background:var(--bg);min-height:80vh}
.gal-head{text-align:center;max-width:720px;margin:0 auto 34px}
.gal-head .kicker{justify-content:center}
.gal-head h1{font-size:clamp(38px,7vw,76px);margin:14px 0}
.gal-head h1 em{font-family:var(--serif);font-weight:400;text-transform:none;color:var(--sand)}
.gal-head p{color:var(--muted);font-size:18px}
.gal-filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:1200px;margin:0 auto 34px}
.gal-filters button{background:none;color:#fff;border:1px solid #ffffff3a;padding:9px 18px;font-family:var(--head);letter-spacing:.14em;text-transform:uppercase;font-size:13px;cursor:pointer;transition:background-color .3s,color .3s,border-color .3s}
.gal-filters button:hover{border-color:var(--sand);color:var(--sand)}
.gal-filters button.on{background:var(--sand);border-color:var(--sand);color:#000}
.gal-grid{max-width:1200px;margin:0 auto;columns:3 280px;column-gap:14px}
.gal-item{position:relative;margin:0 0 14px;break-inside:avoid;overflow:hidden;background:var(--bg2);cursor:zoom-in}
.gal-item[hidden]{display:none}
.gal-item img{display:block;width:100%;height:auto;transition:transform .6s var(--ease)}
.gal-item:hover img,.gal-item:focus-visible img{transform:scale(1.05)}
.gal-item figcaption{position:absolute;inset:auto 0 0;padding:44px 16px 14px;display:flex;flex-direction:column;background:linear-gradient(transparent,rgba(10,10,11,.92));opacity:0;transform:translate3d(0,8px,0);transition:opacity .3s,transform .3s}
.gal-item:hover figcaption,.gal-item:focus-visible figcaption{opacity:1;transform:none}
.gal-item figcaption b{font-family:var(--head);font-weight:500;text-transform:uppercase;font-size:18px;letter-spacing:.04em}
.gal-item figcaption span{font-family:var(--serif);font-style:italic;color:var(--sand);font-size:18px}
@media(hover:none){.gal-item figcaption{opacity:1;transform:none}}
.gal-empty{text-align:center;color:var(--muted);font-family:var(--serif);font-style:italic;font-size:22px;margin-top:20px}
.gal-cta{max-width:1200px;margin:60px auto 0;padding:26px 28px;border:1px solid #ffffff2a;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.gal-cta p{margin:0}.gal-cta b{color:var(--sand);font-weight:500}
.gal-cta .btn{margin:0}
.lb{position:fixed;inset:0;z-index:200;background:rgba(5,5,6,.96);display:flex;align-items:center;justify-content:center;padding:20px}
.lb[hidden]{display:none}
.lb figure{margin:0;max-width:min(92vw,1100px);text-align:center}
.lb img{max-width:100%;max-height:78vh;display:inline-block}
.lb figcaption{margin-top:14px;font-family:var(--serif);font-style:italic;color:var(--sand);font-size:20px}
.lb button{background:#ffffff14;color:#fff;border:0;cursor:pointer;border-radius:50%;width:48px;height:48px;font-size:28px;line-height:1;transition:background-color .2s,color .2s}
.lb button:hover{background:var(--sand);color:#000}
.lb-x{position:absolute;top:18px;right:18px}
.lb-n{position:absolute;top:50%;transform:translateY(-50%)}
.lb-p{left:14px}.lb-s{right:14px}
@media(max-width:600px){.gal{padding:112px 5vw 64px}.lb-n{top:auto;bottom:20px;transform:none}}

/* ============================================================
   2.8.1 — Section « Les soirées du Bar Lounge » (carrousel)
   ============================================================ */
.lxe{background:var(--bg);padding:100px 7vw;border-top:1px solid #ffffff14}
.lxe-in{max-width:1300px;margin:auto}
.lxe-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:44px}
.lxe h2{font-size:clamp(40px,6vw,84px);margin:14px 0 22px}
.lxe p.lead{font-size:clamp(16px,1.8vw,20px);color:var(--muted);max-width:620px}
.slc-nav{display:flex;gap:10px;flex:none}
.slc-nav button{width:52px;height:52px;border:1px solid var(--sand);background:transparent;color:var(--sand);font-size:22px;cursor:pointer;transition:background-color .3s,color .3s,opacity .3s}
.slc-nav button:hover:not(:disabled){background:var(--sand);color:#000}
.slc-nav button:disabled{opacity:.3;cursor:default}
.lxe.no-scroll .slc-nav{display:none}
.slc-track{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.slc-track::-webkit-scrollbar{display:none}
.sl-card{flex:0 0 min(400px,84%);scroll-snap-align:start;display:flex;flex-direction:column;border:1px solid #ffffff2a;background:var(--bg2);border-top:3px solid var(--sand)}
.sl-img{height:200px;background-size:cover;background-position:center}
.sl-body{display:flex;flex-direction:column;padding:30px;flex:1}
.sl-day{font-family:var(--head);text-transform:uppercase;letter-spacing:.4em;font-size:14px;color:var(--sand)}
.sl-date{font-family:var(--serif);font-style:italic;font-size:26px;margin:6px 0 18px}
.sl-body h3{font-size:clamp(24px,2.6vw,32px);line-height:1.1}
.sl-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.sl-tags span{border:1px solid #ffffff44;padding:7px 16px;font-family:var(--head);letter-spacing:.15em;text-transform:uppercase;font-size:13px}
.sl-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:28px}
.sl-actions .btn{margin-top:0;padding:13px 24px;font-size:14px}
.sl-actions .btn.wab{display:inline-flex;align-items:center;gap:10px;background:#25d366;color:#04210f}
.sl-actions .btn.wab:hover{background:#fff;color:#000}
.lxe-empty{color:var(--muted);font-family:var(--serif);font-style:italic;font-size:24px}
.lxe-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.lxe-actions .btn{margin-top:0;padding:13px 28px;font-size:14px}
@media(max-width:800px){
 .lxe{padding:64px 6vw}
 .lxe-head{flex-direction:column;align-items:flex-start;gap:20px;margin-bottom:30px}
 .sl-body{padding:24px}
}
@media(prefers-reduced-motion:reduce){.slc-track{scroll-behavior:auto}}
