/* =========================================================
   AZURIA LUXURY VILLAGE
   ========================================================= */

:root{
  --gold:#d9b877;
  --gold-lt:#f2dcae;
  --gold-dk:#b8914c;
  --cream:#f4efe6;
  --cream-dim:rgba(244,239,230,.72);
  --cream-soft:rgba(244,239,230,.52);
  --ink:#07141a;
  --ink-2:#0b1d25;
  --line:rgba(244,239,230,.16);

  --sans:'Jost','Futura','Avenir Next','Helvetica Neue',Arial,sans-serif;
  --body:'Nunito Sans','Avenir Next','Helvetica Neue',Arial,sans-serif;
  --serif:'Bodoni Moda','Didot','Bodoni 72','Times New Roman',serif;
  --display:'Bodoni Moda','Didot','Bodoni 72','Times New Roman',serif;
  --script:'Allison','Sacramento',cursive;

  --col:14.5vw;          /* colonne de texte principale */
  --axis:42.6vw;         /* axe vertical numéroté */
  --nav-x:2.6vw;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:var(--body);
  font-weight:300;
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:400}
/* tout ce qui est en capitales espacées est en Jost, comme la maquette */
.nav a,.topline__label,.eyebrow,.link,.bk__label,.bk__value em,.booking__cta,.rebook,.rail__word,.lang,
.scroller,.vcard__body,.intro h2,.pillars b,.figures dd,.listing span,.card__kicker,.card__price,
.footer__col h3,.footer__bottom,.news button,.tick,.brand__sub{font-family:var(--sans)}
p{margin:0}
ul,ol,dl{margin:0;padding:0;list-style:none}

::selection{background:var(--gold);color:var(--ink)}
[hidden]{display:none !important}

/* ---------------------------------------------------------
   FOND VIDÉO
   --------------------------------------------------------- */
.bg{
  position:fixed;inset:0;z-index:0;
  overflow:hidden;
  transition:opacity .55s var(--ease);
  will-change:opacity;
}
.bg.is-hidden{opacity:0}

.bg__video{
  position:absolute;top:50%;left:50%;
  width:100%;height:100%;
  transform:translate(-50%,-50%);
  object-fit:cover;
}

/* dégradés de lisibilité, calqués sur la maquette */
.bg__scrim{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(4,15,20,.92) 0%,rgba(4,15,20,.74) 22%,rgba(4,15,20,.34) 48%,rgba(4,15,20,.08) 72%,rgba(4,15,20,.22) 100%),
    linear-gradient(180deg,rgba(4,15,20,.68) 0%,rgba(4,15,20,0) 26%,rgba(4,15,20,0) 62%,rgba(4,15,20,.72) 100%);
}
.bg__vignette{
  position:absolute;inset:0;
  background:radial-gradient(120% 90% at 50% 45%,transparent 42%,rgba(3,11,15,.62) 100%);
}
.bg__grain{
  position:absolute;inset:-50%;
  opacity:.05;pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='140' height='140' filter='url(%23n)' opacity='.5'/></svg>");
}

/* ---------------------------------------------------------
   CHROME FIXE
   --------------------------------------------------------- */
/* bandeau supérieur, uniquement sous 1024px : le contenu passe
   derrière le logo sans le percuter */
.topbar{display:none}
.brand{
  position:fixed;top:2.4vh;left:var(--nav-x);z-index:40;
  display:flex;flex-direction:column;align-items:center;
  color:var(--gold);
  transition:opacity .45s var(--ease),visibility .45s var(--ease);
}
.brand__mark{width:32px;height:38px;margin-bottom:6px;opacity:.95}
.brand__name{
  font-family:var(--serif);font-size:25px;font-weight:400;
  letter-spacing:.28em;text-indent:.28em;color:var(--cream);line-height:1;
}
.brand__sub{
  margin-top:8px;font-size:8.5px;font-weight:400;letter-spacing:.4em;text-indent:.4em;
  text-transform:uppercase;color:var(--cream-dim);
}

.topline{
  position:fixed;top:calc(2.4vh + 22px);left:22vw;z-index:40;
  transition:opacity .5s var(--ease),visibility .5s var(--ease);
  display:flex;align-items:center;gap:26px;
  pointer-events:none;
}
.topline__label{
  font-size:11.5px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--cream-dim);
}
.topline__rule{width:34px;height:1px;background:var(--line)}
.topline__rule::after{
  content:'';display:block;width:1px;height:9px;background:var(--line);
  transform:translate(34px,-4px);
}

/* --- navigation verticale --- */
.nav{position:fixed;top:19vh;left:var(--nav-x);z-index:40;transition:opacity .45s var(--ease),visibility .45s var(--ease)}
.nav ul{display:flex;flex-direction:column;gap:3.4vh}
.nav a{
  position:relative;display:flex;align-items:center;gap:14px;
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--cream-soft);
  transition:color .35s var(--ease);
}
.nav a i{
  width:14px;height:1px;background:currentColor;opacity:.45;
  transition:width .35s var(--ease),opacity .35s var(--ease);
}
.nav a:hover{color:var(--cream)}
.nav a.is-active{color:var(--cream)}
.nav a.is-active i{width:26px;opacity:1;background:var(--gold)}

/* --- module de réservation --- */
.booking{
  position:fixed;top:2.2vh;right:2.2vw;z-index:45;
  display:flex;align-items:stretch;
  background:rgba(6,18,24,.62);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(244,239,230,.13);
  border-radius:3px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.38);
  transition:opacity .5s var(--ease),transform .5s var(--ease),visibility .5s var(--ease);
}
.booking__fields{display:flex;align-items:stretch}
.bk{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:18px 26px;cursor:pointer;
  transition:background .3s var(--ease);
}
.bk:hover{background:rgba(244,239,230,.05)}
.bk__label{font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--cream-soft)}
.bk__value{display:flex;flex-direction:column;align-items:center;gap:3px;line-height:1}
.bk__value b{font-family:var(--serif);font-size:25px;font-weight:400;letter-spacing:.02em}
.bk__value em{font-style:normal;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream-dim)}
.bk__sep{width:1px;margin:16px 0;background:var(--line)}
.bk input,.bk select{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;cursor:pointer;border:0;background:transparent;
}
.bk--select{padding-right:40px}
.bk__chev{position:absolute;right:20px;bottom:24px;width:11px;height:8px;color:var(--cream-soft)}

.booking__cta{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  min-width:172px;padding:0 26px;border:0;cursor:pointer;
  background:linear-gradient(158deg,#f3ddb0 0%,#d9b877 42%,#c39d59 100%);
  color:#241a08;
  transition:filter .3s var(--ease);
}
.booking__cta:hover{filter:brightness(1.07)}
.booking__cta span{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:400}
.booking__cta em{font-style:normal;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;opacity:.78}
.booking__cta svg{width:24px;height:8px;margin-top:6px}
.booking__cta.is-done span{letter-spacing:.18em}

body.is-past-hero .topline,
body.is-past-hero .booking{opacity:0;visibility:hidden;pointer-events:none}

/* le bas de page reprend la main : l'habillage fixe s'efface */
body.is-footer .brand,
body.is-footer .nav,
body.is-footer .utility,
body.is-footer .rail,
body.is-footer .rebook{opacity:0;visibility:hidden;pointer-events:none}
body.is-past-hero .booking{transform:translateY(-14px)}

/* --- rappel de réservation compact --- */
.rebook{
  position:fixed;top:2.6vh;right:2.2vw;z-index:44;
  display:flex;align-items:center;gap:14px;
  padding:14px 26px;border-radius:2px;
  background:linear-gradient(158deg,#f3ddb0 0%,#d9b877 42%,#c39d59 100%);
  color:#241a08;
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  box-shadow:0 18px 44px rgba(0,0,0,.34);
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:opacity .5s var(--ease),transform .5s var(--ease),visibility .5s var(--ease),filter .3s var(--ease);
}
.rebook svg{width:22px;height:7px}
.rebook:hover{filter:brightness(1.07)}
body.is-past-hero .rebook{opacity:1;visibility:visible;transform:none}

/* --- rail de progression --- */
.rail{
  position:fixed;top:50%;right:1.6vw;transform:translateY(-50%);z-index:40;
  display:flex;flex-direction:column;align-items:center;gap:16px;
  pointer-events:none;
  transition:opacity .45s var(--ease),visibility .45s var(--ease);
}
.rail__word{
  writing-mode:vertical-rl;
  font-size:9px;letter-spacing:.5em;text-transform:uppercase;
  color:rgba(244,239,230,.34);
}
.rail__track{position:relative;width:1px;height:26vh;background:var(--line)}
.rail__track i{
  position:absolute;left:50%;top:0;
  width:5px;height:5px;margin-left:-2px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 0 4px rgba(217,184,119,.16);
  transition:top .12s linear;
}

/* --- langue + son --- */
.utility{
  position:fixed;left:var(--nav-x);bottom:3.4vh;z-index:40;
  display:flex;flex-direction:column;align-items:flex-start;gap:20px;
  transition:opacity .45s var(--ease),visibility .45s var(--ease);
}
.lang{position:relative}
.lang>button{
  display:flex;align-items:center;gap:9px;padding:0;border:0;background:none;cursor:pointer;
  font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--cream-dim);
  transition:color .3s var(--ease);
}
.lang>button:hover{color:var(--cream)}
.lang>button svg{width:10px;height:7px;transition:transform .3s var(--ease)}
.lang>button[aria-expanded="true"] svg{transform:rotate(180deg)}
.lang ul{
  position:absolute;bottom:calc(100% + 12px);left:0;
  display:flex;flex-direction:column;gap:2px;padding:8px 0;
  background:rgba(6,18,24,.82);backdrop-filter:blur(12px);
  border:1px solid var(--line);border-radius:2px;
}
.lang ul button{
  padding:6px 20px;border:0;background:none;cursor:pointer;
  font-size:11px;letter-spacing:.22em;color:var(--cream-soft);
}
.lang ul button:hover{color:var(--gold)}

.sound{
  display:grid;place-items:center;
  width:44px;height:44px;padding:0;cursor:pointer;
  border:1px solid var(--line);border-radius:50%;background:rgba(6,18,24,.28);
  color:var(--cream-dim);
  transition:border-color .35s var(--ease),color .35s var(--ease),background .35s var(--ease);
}
.sound:hover{border-color:rgba(217,184,119,.5);color:var(--gold)}
.sound svg{width:21px}
.sound .sound__on{display:none}
.sound[aria-pressed="true"]{color:var(--gold);border-color:rgba(217,184,119,.45)}
.sound[aria-pressed="true"] .sound__on{display:block}
.sound[aria-pressed="true"] .sound__off{display:none}

/* --- axe vertical --- */
.axis{
  position:fixed;top:0;bottom:0;left:var(--axis);z-index:5;
  width:1px;
  background:linear-gradient(180deg,transparent 0,rgba(244,239,230,.12) 12%,rgba(244,239,230,.12) 88%,transparent 100%);
  pointer-events:none;
}

/* repères numérotés posés sur l'axe */
.tick{
  position:absolute;left:var(--axis);
  display:flex;flex-direction:column-reverse;align-items:center;gap:16px;
  transform:translateX(-50%);
  font-size:11px;letter-spacing:.22em;color:var(--cream-soft);
  z-index:6;pointer-events:none;
}
.tick i{width:1px;height:110px;background:linear-gradient(180deg,rgba(217,184,119,.5),transparent)}
.tick--a{top:5.2vh}
.tick--b{top:58vh}
.tick--c{top:4vh}
.tick--d{top:26vh}

/* ---------------------------------------------------------
   STRUCTURE
   --------------------------------------------------------- */
#main{position:relative;z-index:10}

.section{
  position:relative;
  min-height:100vh;
  padding:0 2.2vw;
  display:flex;align-items:center;
}

.eyebrow{
  font-size:11.5px;letter-spacing:.34em;text-transform:uppercase;
  color:var(--gold);margin-bottom:22px;
}

.link{
  position:relative;display:inline-block;margin-top:34px;
  font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--cream);
  padding-bottom:9px;
}
.link::after{
  content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:var(--gold);transform-origin:left;
  transition:transform .45s var(--ease);
}
.link:hover::after{transform:scaleX(.42)}

/* ---------------------------------------------------------
   01 · HÉRO
   --------------------------------------------------------- */
.section--hero{min-height:84vh;align-items:center}

.hero{position:absolute;left:var(--col);top:21vh;max-width:min(46ch,34vw)}
.hero__title{
  font-family:var(--display);font-weight:400;font-variation-settings:'opsz' 16;
  font-size:clamp(40px,4.3vw,68px);
  line-height:1.02;letter-spacing:.03em;text-transform:uppercase;
  text-shadow:0 12px 40px rgba(0,0,0,.42);
}
.hero__script{
  margin-top:.02em;margin-left:.06em;
  font-family:var(--script);
  font-size:clamp(40px,4.4vw,70px);
  line-height:1;color:var(--gold-lt);
  text-shadow:0 8px 30px rgba(0,0,0,.4);
}

.scroller{
  display:inline-flex;align-items:center;gap:18px;margin-top:6vh;
  font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--cream-dim);
  transition:color .35s var(--ease);
}
.scroller:hover{color:var(--cream)}
.scroller__ring{
  display:grid;place-items:center;width:34px;height:34px;
  border:1px solid var(--line);border-radius:50%;
  transition:border-color .35s var(--ease);
}
.scroller:hover .scroller__ring{border-color:rgba(217,184,119,.55)}
.scroller__ring svg{width:15px;height:15px;color:var(--gold);animation:bob 2.6s var(--ease) infinite}
@keyframes bob{0%,100%{transform:translateY(-2px)}50%{transform:translateY(2px)}}

/* carte vidéo */
.vcard{
  position:absolute;left:var(--col);bottom:4vh;
  display:flex;align-items:stretch;
  width:min(372px,26vw);
  background:rgba(6,18,24,.66);
  border:1px solid rgba(244,239,230,.12);border-radius:3px;
  overflow:hidden;
  transition:border-color .4s var(--ease),transform .5s var(--ease);
}
.vcard:hover{border-color:rgba(217,184,119,.4);transform:translateY(-3px)}
.vcard__thumb{width:47%;overflow:hidden}
.vcard__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.vcard:hover .vcard__thumb img{transform:scale(1.06)}
.vcard__body{position:relative;flex:1;padding:22px 22px 20px}
.vcard__body b{
  display:block;font-size:14px;font-weight:500;
  letter-spacing:.17em;text-transform:uppercase;line-height:1.55;
}
.vcard__body em{
  display:block;margin-top:16px;font-style:normal;
  font-size:11px;letter-spacing:.2em;color:var(--cream-dim);
}
.vcard__body i{display:block;margin-top:5px;font-style:normal;font-size:11px;letter-spacing:.2em;color:var(--cream-soft)}
.vcard__play{
  position:absolute;right:20px;bottom:20px;
  display:grid;place-items:center;width:28px;height:28px;
  border:1px solid rgba(244,239,230,.22);border-radius:50%;color:var(--gold);
}
.vcard__play svg{width:13px;margin-left:1px}

/* bloc introduction, colonne droite */
.intro{
  position:absolute;left:57.5vw;bottom:6vh;
  width:min(430px,30vw);text-align:center;
}
.intro__pin{width:20px;height:25px;color:var(--gold);margin:0 auto 22px}
.intro h2{
  font-size:clamp(17px,1.32vw,21px);font-weight:400;
  letter-spacing:.26em;text-transform:uppercase;margin-bottom:22px;
}
.intro p{font-size:14.5px;line-height:1.85;color:var(--cream-dim)}
.intro .link{margin-top:26px}

/* ---------------------------------------------------------
   03 · BANDEAU PILIERS
   --------------------------------------------------------- */
.section--band{
  min-height:48vh;align-items:flex-start;
  background:linear-gradient(180deg,rgba(5,15,20,0) 0%,rgba(5,15,20,.82) 26%,rgba(5,15,20,.86) 74%,rgba(5,15,20,0) 100%);
}
.band{display:flex;align-items:center;gap:6vw;width:100%;padding:5.5vh var(--col) 9vh}
.band__head h2{
  font-family:var(--display);font-weight:400;font-variation-settings:'opsz' 20;
  font-size:clamp(30px,2.9vw,46px);letter-spacing:.1em;text-transform:uppercase;line-height:1;
}
.pillars{
  flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:2.2vw;
  margin-left:auto;max-width:56%;
}
.pillars li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
.pillars svg{width:46px;height:46px;color:var(--gold)}
.pillars b{
  font-size:11.5px;font-weight:300;letter-spacing:.22em;text-transform:uppercase;
  line-height:1.9;color:var(--cream-dim);
}

/* ---------------------------------------------------------
   PANNEAUX DE TEXTE
   --------------------------------------------------------- */
/* voile de lisibilité pour les blocs alignés à droite */
.section--right::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(270deg,rgba(4,15,20,.74) 0%,rgba(4,15,20,.46) 30%,rgba(4,15,20,0) 62%);
}

.panel{
  position:relative;z-index:1;
  width:min(560px,38vw);
  padding:44px 0;
}
.panel--left{margin-left:calc(var(--col) - 2.2vw)}
.section--right{justify-content:flex-end}
.panel--right{margin-right:6vw}

.panel h2{
  font-family:var(--display);font-weight:400;font-variation-settings:'opsz' 20;
  font-size:clamp(28px,2.8vw,46px);
  line-height:1.06;letter-spacing:.04em;text-transform:uppercase;
  margin-bottom:30px;
  text-shadow:0 10px 34px rgba(0,0,0,.36);
}
.lead{font-size:15.5px;line-height:1.95;color:var(--cream-dim);max-width:46ch}
.lead+.lead{margin-top:18px}
.lead--muted{color:var(--cream-soft);font-size:14px}

.figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 40px;margin-top:46px;max-width:440px}
.figures dt{font-family:var(--serif);font-size:36px;font-weight:400;color:var(--gold-lt);line-height:1}
.figures dd{margin:10px 0 0;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--cream-soft)}

.listing{margin-top:12px;border-top:1px solid var(--line)}
.listing li{
  display:flex;justify-content:space-between;align-items:baseline;gap:24px;
  padding:20px 0;border-bottom:1px solid var(--line);
}
.listing b{font-family:var(--serif);font-size:19px;font-weight:400;letter-spacing:.02em}
.listing span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream-soft);text-align:right}
.listing--tight li{padding:15px 0}

address{font-style:normal;margin-top:34px;font-size:14.5px;line-height:2;color:var(--cream-dim)}
address a{border-bottom:1px solid rgba(217,184,119,.4);padding-bottom:2px}
address a:hover{color:var(--gold)}

/* ---------------------------------------------------------
   05 · CARTES
   --------------------------------------------------------- */
.section--cards{min-height:auto;flex-direction:column;justify-content:center;gap:5vh;padding-top:16vh;padding-bottom:16vh}
.cards__head{width:100%;padding-left:var(--col);text-align:left}
.cards__head h2{font-family:var(--display);font-weight:400;font-variation-settings:'opsz' 20;font-size:clamp(26px,2.5vw,40px);letter-spacing:.08em;text-transform:uppercase}
.cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.6vw;
  width:100%;padding:0 var(--col);
}
.card{
  padding:36px 32px 34px;
  background:rgba(6,18,24,.68);
  border:1px solid rgba(244,239,230,.11);border-radius:3px;
  transition:border-color .45s var(--ease),background .45s var(--ease),transform .5s var(--ease);
}
.card:hover{border-color:rgba(217,184,119,.38);background:rgba(8,22,28,.78);transform:translateY(-4px)}
.card__kicker{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.card h3{margin:16px 0 16px;font-size:24px;letter-spacing:.03em}
.card p{font-size:14px;line-height:1.85;color:var(--cream-dim)}
.card__price{margin-top:26px;padding-top:20px;border-top:1px solid var(--line);
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream-soft)}
.card__price b{font-family:var(--serif);font-size:22px;font-weight:400;letter-spacing:.02em;color:var(--gold-lt)}

/* ---------------------------------------------------------
   BAS DE PAGE
   --------------------------------------------------------- */
.footer{
  position:relative;z-index:20;
  background:#050f14;
  border-top:1px solid rgba(244,239,230,.1);
  padding:9vh 2.2vw 34px;
}
.footer__top{
  display:grid;grid-template-columns:1.35fr 1fr 1fr 1.5fr;gap:5vw;
  max-width:1400px;margin:0 auto;padding-bottom:7vh;
}
.footer__brand{display:flex;flex-direction:column;color:var(--gold)}
.footer__brand .brand__mark{width:32px;height:38px;margin-bottom:6px}
.footer__brand .brand__name{align-self:flex-start}
.footer__brand .brand__sub{align-self:flex-start}
.footer__brand p{margin-top:26px;font-size:13.5px;line-height:1.95;color:var(--cream-soft)}

.footer__col h3{
  font-family:var(--sans);font-size:10.5px;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:24px;
}
.footer__col li+li{margin-top:13px}
.footer__col a{font-size:14px;color:var(--cream-dim);transition:color .3s var(--ease)}
.footer__col a:hover{color:var(--cream)}
.footer__news p{font-size:13.5px;color:var(--cream-soft);margin-bottom:22px}

.news{display:flex;border-bottom:1px solid var(--line);padding-bottom:12px;gap:14px}
.news input{
  flex:1;border:0;background:none;outline:none;
  font-size:13.5px;letter-spacing:.04em;color:var(--cream);
}
.news input::placeholder{color:rgba(244,239,230,.34)}
.news button{
  border:0;background:none;cursor:pointer;padding:0;
  font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);
  transition:color .3s var(--ease);
}
.news button:hover{color:var(--gold-lt)}
.news__ok{margin-top:14px;font-size:12px;letter-spacing:.12em;color:var(--gold)}

.footer__bottom{
  display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  max-width:1400px;margin:0 auto;padding-top:30px;
  border-top:1px solid rgba(244,239,230,.08);
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,239,230,.4);
}
.footer__bottom ul{display:flex;gap:28px}
.footer__bottom a:hover{color:var(--cream-dim)}
.social{gap:16px}
.social svg{width:17px}
.social a{display:grid;place-items:center;width:32px;height:32px;color:rgba(244,239,230,.45);transition:color .3s var(--ease)}
.social a:hover{color:var(--gold)}

/* ---------------------------------------------------------
   APPARITIONS AU SCROLL
   --------------------------------------------------------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .scroller__ring svg{animation:none}
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */
@media (max-width:1500px){
  :root{--col:16vw;--axis:44vw}
  .intro{left:56vw;width:min(400px,32vw)}
}

@media (max-width:1280px){
  :root{--col:17vw}
  .axis,.tick,.topline{display:none}
  .booking{top:auto;bottom:3vh;right:50%;transform:translateX(50%)}
  .rail{display:none}
  .hero{top:20vh;max-width:52vw}
  .intro{position:relative;left:auto;bottom:auto;margin-left:auto;width:min(420px,42vw);text-align:left}
  .section--hero{flex-direction:column;justify-content:center;padding-top:20vh;padding-bottom:26vh}
  .vcard{display:none}
  .pillars{max-width:none}
}

@media (max-width:1024px){
  .nav{display:none}
  .utility{display:none}
  :root{--col:8vw}
  .topbar{
    display:block;position:fixed;top:0;left:0;right:0;height:96px;z-index:38;
    background:linear-gradient(180deg,rgba(5,15,20,.94) 0%,rgba(5,15,20,.78) 55%,rgba(5,15,20,0) 100%);
    backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
    pointer-events:none;
  }
  .brand{top:14px;left:5vw;align-items:flex-start}
  .brand__mark{margin-bottom:5px}
  .brand__name{font-size:20px}
  .rebook{top:26px;right:5vw;padding:11px 18px;font-size:10px;gap:10px}
  .rebook svg{width:18px;height:6px}
  .hero{position:relative;left:auto;top:auto;max-width:none;padding-top:6vh;text-align:center}
  .hero__script{margin-left:0}
  .scroller{margin-top:4vh}
  .section--hero{align-items:center;padding-top:22vh;gap:9vh}
  .intro{width:min(520px,84vw);text-align:center;margin:0 auto}
  .band{flex-direction:column;align-items:flex-start;gap:6vh;padding:10vh var(--col)}
  .pillars{grid-template-columns:repeat(2,1fr);gap:6vh 3vw;width:100%}
  .panel,.panel--left,.panel--right{width:auto;max-width:640px;margin:0 auto}
  .section--right{justify-content:center}
  .cards{grid-template-columns:1fr;gap:20px}
  .section--cards{padding-top:12vh}
  .footer__top{grid-template-columns:1fr 1fr;gap:7vh 5vw}
}

@media (max-width:720px){
  body{font-size:15px}
  .booking{
    left:4vw;right:4vw;transform:none;bottom:2vh;
    flex-direction:column;
  }
  .booking__fields{justify-content:space-between}
  .bk{flex:1;padding:14px 8px}
  .bk__value b{font-size:21px}
  .booking__cta{padding:15px;min-width:0}
  .booking__cta svg{display:none}
  .section{padding-left:6vw;padding-right:6vw;padding-top:12vh;padding-bottom:12vh}
  .footer{padding:10vh 6vw 40px}
  .section--hero{padding-bottom:48vh;gap:6vh}
  .brand{top:12px}
  .brand__name{font-size:19px}
  .figures{grid-template-columns:1fr 1fr;gap:26px 20px}
  .listing li{flex-direction:column;gap:6px}
  .listing span{text-align:left}
  .footer__top{grid-template-columns:1fr;gap:6vh}
  .footer__bottom{flex-direction:column;align-items:flex-start;gap:18px}
  .footer__bottom ul{flex-wrap:wrap;gap:18px}
}

/* le rappel compact disparaît lui aussi devant le bas de page */
body.is-footer.is-past-hero .rebook{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-12px)}

/* écrans peu hauts (portables) : on resserre le héros pour que le bandeau reste dans le premier écran */
@media (min-width:1025px) and (max-height:860px){
  .section--hero{min-height:80vh}
  .hero{top:16vh}
  .hero__title{font-size:clamp(36px,3.9vw,60px)}
  .hero__script{font-size:clamp(34px,3.8vw,58px)}
  .scroller{margin-top:3.5vh}
  .vcard{bottom:3vh;width:min(340px,24vw)}
  .intro{bottom:5vh}
  .band{padding-top:3.5vh}
  .tick--c{top:2vh}
}

/* page domotique : titre sur deux lignes, signature courte */
.page-domo .hero{max-width:46vw}
.page-domo .hero__title{font-size:clamp(38px,4.1vw,64px);white-space:nowrap}
.page-domo .hero__script{font-size:clamp(38px,4.2vw,66px)}
@media (max-width:1024px){ .page-domo .hero__title{white-space:normal} }


/* formules annuelles */
.cards__lead{max-width:62ch;margin-top:18px;font-size:15px;line-height:1.85;color:var(--cream-dim)}
.card__list{margin:0 0 4px;padding:0}
.card__list li{position:relative;padding:9px 0 9px 26px;border-top:1px solid var(--line);font-size:13.5px;line-height:1.6;color:var(--cream-dim)}
.card__list li::before{content:'';position:absolute;left:0;top:19px;width:14px;height:1px;background:var(--gold)}
.card__list li b{color:var(--gold-lt);font-weight:600}
.card h3{font-family:var(--serif);font-size:30px;letter-spacing:.02em;margin:14px 0 18px}
.card--featured{border-color:rgba(217,184,119,.45);background:rgba(10,26,34,.78)}
.card--featured .card__kicker::after{content:'· la plus choisie';color:var(--cream-soft);margin-left:6px}
.cards__foot{width:100%;padding:0 var(--col);margin-top:8px;font-size:13px;line-height:1.8;color:var(--cream-soft);max-width:none}
@media (max-width:1024px){ .cards__foot{padding:0 8vw} }


/* estimateur de forfait */
.cfg{width:100%;margin:6vh var(--col) 0;width:calc(100% - 2*var(--col));display:grid;grid-template-columns:1.1fr 1.2fr 1fr;gap:3vw;
  padding:34px 36px;background:rgba(6,18,24,.7);border:1px solid rgba(244,239,230,.12);border-radius:3px;position:relative}
.cfg::before,.cfg::after{content:'';position:absolute;width:14px;height:14px;border-color:rgba(217,184,119,.8);border-style:solid}
.cfg::before{top:-1px;left:-1px;border-width:1px 0 0 1px}
.cfg::after{bottom:-1px;right:-1px;border-width:0 1px 1px 0}
.cfg__head h3{font-family:var(--serif);font-size:26px;font-weight:400;letter-spacing:.03em;margin:4px 0 14px}
.cfg__head p:last-child{font-size:13.5px;line-height:1.8;color:var(--cream-dim)}
.cfg__body{display:flex;flex-direction:column;gap:18px;justify-content:center}
.cfg__row{display:flex;flex-direction:column;gap:9px}
.cfg__label{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--cream-soft);font-family:var(--sans)}
.cfg__seg{display:flex;border:1px solid var(--line);border-radius:2px;overflow:hidden}
.cfg__seg button{flex:1;padding:11px 8px;border:0;background:transparent;cursor:pointer;font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cream-dim);transition:background .3s var(--ease),color .3s var(--ease)}
.cfg__seg button+button{border-left:1px solid var(--line)}
.cfg__seg button[aria-pressed="true"]{background:linear-gradient(158deg,#f3ddb0 0%,#d9b877 42%,#c39d59 100%);color:#241a08}
.cfg__num{display:flex;align-items:stretch;border:1px solid var(--line);border-radius:2px;overflow:hidden;width:fit-content}
.cfg__num button{width:44px;border:0;background:transparent;color:var(--gold);font-size:20px;cursor:pointer}
.cfg__num button:hover{background:rgba(244,239,230,.05)}
.cfg__num input{width:78px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);background:transparent;color:var(--cream);text-align:center;font-family:var(--serif);font-size:24px;padding:6px 0;outline:none;-moz-appearance:textfield}
.cfg__num input::-webkit-outer-spin-button,.cfg__num input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cfg__out{display:flex;flex-direction:column;justify-content:center;gap:14px;padding-left:3vw;border-left:1px solid var(--line)}
.cfg__k{display:block;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--cream-soft);font-family:var(--sans);margin-bottom:6px}
.cfg__out b{display:block;font-family:var(--serif);font-weight:400;font-size:38px;line-height:1;color:var(--gold-lt)}
.cfg__out div+div b{font-size:24px;color:var(--cream)}
.cfg__detail{font-size:12.5px;line-height:1.7;color:var(--cream-dim)}
.cfg__out .link{margin-top:6px}
@media (max-width:1024px){ .cfg{grid-template-columns:1fr;margin:6vh 8vw 0;width:calc(100% - 16vw);padding:28px 24px} .cfg__out{padding-left:0;border-left:0;padding-top:20px;border-top:1px solid var(--line)} }

/* 30/09/2026 : trait vertical central et numéros de section retirés à la demande de Laurent */
.axis,.tick{display:none!important}

/* 30/09/2026 : Azuria by NEXORA */
.brand__by{display:inline-flex;align-items:center;gap:.5em;text-transform:none;letter-spacing:.12em}
.brand__nexora{width:78px;height:9px;color:var(--gold);display:inline-block}
.footer__brand .brand__nexora{width:92px;height:11px}
.footer__bottom a{color:inherit}