/* Accueil v3 : refonte d'après la maquette « test1 ». Tout est limité à .hp (aucun impact sur les autres pages). */
.hp{
  --nuit:#07181d; --lagon:#0f4a52; --turquoise:#35c4bd; --or:#d0b874; --corail:#ff6f7d; --sable:#f1e6d2;
  --disp:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
  --txt:"Work Sans","Helvetica Neue",Arial,sans-serif;
  background:var(--nuit); color:var(--sable); font-family:var(--txt); font-weight:400; font-size:1.0625rem; line-height:1.65; overflow-x:hidden;
}
.hp *{box-sizing:border-box}
.hp img{max-width:100%;display:block}
.hp section{position:relative}
.hp [data-p]{transform:translate3d(0,var(--y,0px),0) rotate(var(--r,0deg)) scaleX(var(--sx,1));will-change:transform}

/* Boutons */
.hp .hp-btn{display:inline-block;padding:.85rem 1.6rem;border-radius:999px;border:1px solid var(--or);background:var(--or);color:var(--nuit);font:700 .95rem var(--txt);text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.hp .hp-btn:hover{background:transparent;color:var(--or)}
.hp .hp-btn.fantome{background:transparent;color:var(--sable);border-color:rgba(241,230,210,.45)}
.hp .hp-btn.fantome:hover{border-color:var(--or);color:var(--or)}
.hp :focus-visible{outline:2px solid var(--or);outline-offset:3px}

/* Hero : crépuscule au-dessus du bassin */
.hp .hp-hero{position:relative;height:100svh;min-height:640px;overflow:hidden;isolation:isolate}
.hp .fond-hero{position:absolute;left:0;right:0;top:-12%;bottom:-12%;z-index:-1;background:radial-gradient(ellipse at 50% 50%,rgba(4,10,12,.72) 0%,rgba(4,10,12,.5) 45%,rgba(4,10,12,.18) 100%),linear-gradient(180deg,rgba(4,10,12,.35) 0%,rgba(4,10,12,0) 30%),url("/assets/img/brand/hero-bg.webp") 55% center/cover no-repeat,#050b0d}
.hp .hp-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;z-index:2;background:linear-gradient(180deg,rgba(7,24,29,0),var(--nuit));pointer-events:none}
.hp .feuille{position:absolute;pointer-events:none;width:clamp(220px,40vw,560px);height:auto;filter:drop-shadow(0 20px 30px rgba(0,0,0,.45))}
.hp .hero-contenu{position:relative;z-index:5;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:5rem clamp(1.25rem,5vw,4rem) 3rem}
.hp .hero-contenu .logo{position:relative;top:clamp(6px,1vw,14px);width:clamp(190px,22vw,300px);height:auto;margin-bottom:1.4rem;filter:drop-shadow(0 6px 18px rgba(0,0,0,.4))}
.hp .hero-contenu h1{font:italic 400 clamp(2.2rem,5.2vw,4.4rem)/1.08 var(--disp);max-width:16ch;margin:0;text-shadow:0 4px 30px rgba(20,5,30,.55);color:var(--sable);text-transform:none;letter-spacing:0}
.hp .hero-contenu .sous{margin:1.3rem auto 2rem;max-width:36rem;font-size:1.12rem}
.hp .hero-contenu .actions{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center}
.hp .hero-contenu>*{animation:hp-entree .9s cubic-bezier(.2,.7,.2,1) both}
.hp .hero-contenu>*:nth-child(2){animation-delay:.12s}
.hp .hero-contenu>*:nth-child(3){animation-delay:.24s}
.hp .hero-contenu>*:nth-child(4){animation-delay:.36s}
@keyframes hp-entree{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media(max-width:760px){
  .hp .fond-hero{background:linear-gradient(180deg,rgba(4,10,12,.3) 0%,rgba(4,10,12,0) 28%,rgba(4,10,12,.65) 62%,rgba(4,10,12,.92) 100%),url("/assets/img/brand/hero-bg.webp") 62% center/cover no-repeat,#050b0d}
  .hp .hero-contenu{justify-content:flex-end;padding-bottom:4.6rem}
  .hp .hero-contenu .logo{width:190px;top:30px;margin-bottom:1.2rem}
  .hp .hero-contenu .sous{margin:1rem auto 1.5rem}
}

/* Sections */
.hp .conteneur{width:min(1080px,100% - 2.5rem);margin-inline:auto}
.hp .espace .conteneur{width:min(1320px,100% - 2.5rem)}
.hp h2.titre{font:italic 400 clamp(2rem,4.6vw,3.4rem)/1.12 var(--disp);margin:0 0 1rem;color:var(--sable);text-transform:none;letter-spacing:0}
.hp .intro{padding:clamp(4rem,10vw,8rem) 0;background:linear-gradient(180deg,var(--nuit),#0b2a30)}
.hp .intro p{max-width:46rem;font-size:1.15rem;margin:0 0 1.1rem}
.hp .intro .grand{font:400 clamp(1.5rem,3vw,2.1rem)/1.35 var(--disp);color:var(--or);margin-bottom:1.6rem}

/* Les espaces : quatre bandes parallaxe */
.hp .espace{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hp .espace .fond{position:absolute;inset:-12% 0;z-index:-2}
.hp .espace .orbe{position:absolute;z-index:-1;width:clamp(260px,42vw,560px);aspect-ratio:1;border-radius:50%;filter:blur(2px)}
.hp .espace .feuille{opacity:.75;z-index:-1;width:clamp(180px,28vw,380px)}
.hp .espace .duo{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:center;padding:clamp(2.5rem,6vw,4rem) 0}
.hp .espace .duo.sans-photo{grid-template-columns:minmax(0,1fr)}
.hp .espace .texte{max-width:30rem;padding:0}
.hp .espace.droite .photo{order:-1}
.hp .espace.droite .duo{grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr)}
.hp .espace.droite .duo.sans-photo{grid-template-columns:minmax(0,1fr)}
.hp .espace .photo{position:relative;margin:0;aspect-ratio:3/2;border-radius:20px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.5);border:1px solid rgba(241,230,210,.18)}
.hp .espace .photo .zoom{position:absolute;inset:0;width:100%;padding:0;border:0;background:none;overflow:hidden;cursor:zoom-in;display:block;color:inherit}
.hp .espace .photo img{position:absolute;left:0;width:100%;height:130%;top:-15%;max-width:none;object-fit:cover;transition:filter .3s}
.hp .espace .photo .zoom:hover img{filter:brightness(1.08)}
.hp .espace .photo .loupe{position:absolute;right:.9rem;bottom:.9rem;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(7,24,29,.7);border:1px solid rgba(241,230,210,.5);font-size:1.15rem;pointer-events:none;color:var(--sable)}
@media(max-width:760px){
  .hp .espace .duo,.hp .espace.droite .duo{grid-template-columns:1fr}
  .hp .espace .photo,.hp .espace.droite .photo{order:-1}
}
.hp .espace h3{font:italic 400 clamp(2.2rem,5vw,3.8rem)/1.05 var(--disp);margin:0 0 .9rem;color:inherit;text-transform:none;letter-spacing:0}
.hp .espace p{margin:0 0 1rem}
.hp .espace ul{list-style:none;display:grid;gap:.35rem;font-size:.98rem;opacity:.92;margin:0;padding:0}
.hp .espace li::before{content:"";display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--or);margin-right:.7rem}
.hp .e-spa .fond{background:linear-gradient(135deg,#0b3a41,#14656b 55%,#0b2a30)}
.hp .e-spa .orbe{right:-6%;top:12%;background:radial-gradient(circle,rgba(53,196,189,.55),rgba(53,196,189,0) 68%)}
.hp .e-vip .fond{background:linear-gradient(135deg,#2b0d2a,#5b1d49 55%,#2a0c26)}
.hp .e-vip .orbe{left:-8%;top:8%;background:radial-gradient(circle,rgba(255,111,125,.5),rgba(255,111,125,0) 68%)}
.hp .e-club .fond{background:linear-gradient(135deg,#1a1230,#34216b 55%,#150f2b)}
.hp .e-club .orbe{right:-4%;bottom:6%;background:radial-gradient(circle,rgba(208,184,116,.4),rgba(208,184,116,0) 68%)}
.hp .e-ext .fond{background:linear-gradient(180deg,#e58b5c,#f3b47b 30%,#2aa8a6 62%,#0f4a52)}
.hp .e-ext .orbe{left:6%;top:6%;background:radial-gradient(circle,rgba(255,236,190,.9),rgba(255,236,190,0) 66%)}
.hp .e-ext .texte{color:var(--nuit)}
.hp .e-ext li::before{background:var(--nuit)}

/* Visionneuse */
.hp-visio{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:1rem;border:0;background:rgba(4,10,12,.95);color:#f1e6d2}
.hp-visio[open]{display:grid;place-items:center;grid-template-columns:auto minmax(0,1fr) auto;gap:.5rem}
.hp-visio figure{margin:0;text-align:center;min-width:0}
.hp-visio img{max-width:100%;max-height:80vh;margin:0 auto;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.hp-visio figcaption{margin-top:.9rem;font:italic 400 1.4rem "Bodoni Moda",Georgia,serif}
.hp-visio button{width:48px;height:48px;border-radius:50%;border:1px solid rgba(241,230,210,.5);background:rgba(7,24,29,.7);color:#f1e6d2;font-size:1.5rem;line-height:1;cursor:pointer;padding:0}
.hp-visio button:hover{border-color:#d0b874;color:#d0b874}
.hp-visio .v-fermer{position:absolute;top:1rem;right:1rem}
@media(max-width:760px){
  .hp-visio[open]{grid-template-columns:1fr;grid-template-rows:1fr auto;align-content:center}
  .hp-visio .v-prec,.hp-visio .v-suiv{position:absolute;bottom:1.2rem}
  .hp-visio .v-prec{left:1rem}.hp-visio .v-suiv{right:1rem}
}

/* Soirées */
.hp .soirees{padding:clamp(4rem,10vw,7rem) 0;background:linear-gradient(180deg,var(--lagon),var(--nuit));overflow:hidden}
.hp .buffet{margin:.5rem 0 2.4rem;color:var(--or);font-weight:500}
.hp .agenda{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1.4rem;list-style:none;margin:0;padding:0}
.hp .agenda li{border:1px solid rgba(208,184,116,.45);border-radius:18px;background:rgba(7,24,29,.55);backdrop-filter:blur(6px);overflow:hidden;display:flex;flex-direction:column}
.hp .agenda .aff{display:block;aspect-ratio:4/5;background:#06161a;padding:.4rem}
.hp .agenda .aff img{width:100%;height:100%;object-fit:contain}
.hp .agenda .aff img.aff-logo{object-fit:contain;padding:22%}
.hp .agenda .corps{padding:1.3rem 1.5rem 1.6rem;display:flex;flex-direction:column;flex:1}
.hp .agenda time{display:block;font:italic 400 2.1rem/1 var(--disp);color:var(--or);margin-bottom:.6rem}
.hp .agenda h3{font:600 1.15rem/1.3 var(--txt);margin:0 0 .5rem;color:var(--sable);text-transform:none;letter-spacing:0}
.hp .agenda .heure{display:block;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--or);opacity:.85;margin:-.2rem 0 .7rem}
.hp .agenda p{opacity:.88;margin:0 0 1rem;font-size:.98rem}
.hp .agenda .go{margin-top:auto;color:var(--or);font-weight:700;text-decoration:none}
.hp .agenda .go:hover{text-decoration:underline}
.hp .vide{opacity:.85}
.hp.hp-liste{background:transparent;overflow:visible}
.hp .buffet-liste{text-align:center;color:var(--or);margin:0 0 1.8rem}
.hp .prepare{margin-top:2.4rem;text-align:center}

/* Newsletter */
.hp .abonnement{padding:clamp(3.5rem,8vw,6rem) 0;background:linear-gradient(180deg,var(--nuit),#0b2a30);text-align:center}
.hp .abonnement p{max-width:40rem;margin:0 auto 1.4rem}
.hp .abonnement .form{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;max-width:36rem;margin:0 auto}
.hp .abonnement input[type=email]{flex:1 1 15rem;padding:.85rem 1.1rem;border-radius:999px;border:1px solid rgba(241,230,210,.4);background:rgba(7,24,29,.7);color:var(--sable);font:inherit}
.hp .abonnement .nl-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.hp .abonnement .msg{padding:.7rem 1rem;border-radius:12px;max-width:36rem;margin:0 auto 1rem;border:1px solid var(--or)}
.hp .abonnement .msg.error{border-color:var(--corail)}
.hp .abonnement .legal{font-size:.8rem;opacity:.65;margin:1.2rem auto 0}
.hp .abonnement .legal a{color:inherit}
.hp .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media(prefers-reduced-motion:reduce){
  .hp .hero-contenu>*{animation:none}
  .hp [data-p]{transform:rotate(var(--r,0deg)) scaleX(var(--sx,1))!important}
}
.hp.hp-liste{max-width:1380px;margin:0 auto;padding:0 2.2rem 2.5rem}
.hp.hp-liste .carousel .agenda{justify-content:flex-start}
@media(max-width:760px){.hp.hp-liste{padding:0 1.2rem 2rem}}
.hp.hp-liste .prepare{text-align:center;margin-top:2.2rem}

/* Carrousel des soirées (accueil) */
.hp .carousel{position:relative}
.hp .carousel .agenda{display:flex;gap:1.4rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:.3rem .2rem 1rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hp .carousel .agenda::-webkit-scrollbar{display:none}
.hp .carousel .agenda li{flex:0 0 calc((100% - 4.2rem)/4);min-width:250px;scroll-snap-align:start}
.hp .car-btn{position:absolute;top:38%;z-index:3;width:46px;height:46px;border-radius:50%;border:1px solid var(--or);background:rgba(7,24,29,.85);color:var(--or);font-size:1.8rem;line-height:1;cursor:pointer}
.hp .car-btn:disabled{opacity:.25;cursor:default}
.hp .car-prev{left:-.6rem}.hp .car-next{right:-.6rem}
@media(max-width:1100px){.hp .carousel .agenda li{flex-basis:calc((100% - 2.8rem)/3)}}
@media(max-width:760px){
  .hp .carousel .agenda li{flex-basis:100%;min-width:0}
  .hp .car-btn{top:30%;width:38px;height:38px}
  .hp .car-prev{left:-.3rem}.hp .car-next{right:-.3rem}
}

@media(max-width:760px){.hp .car-prev{left:.5rem}.hp .car-next{right:.5rem}}