/* =========================================================
   MOYA LODGE — feuille de style
   La Saline-les-Bains, La Réunion
   Direction : Nuit & Braise
   ========================================================= */

/* ---------- polices auto-hébergées ----------
   Aucun appel à Google : l'adresse IP du visiteur
   ne quitte pas l'hébergement. Exigence RGPD.
   ------------------------------------------- */
@font-face{
  font-family:'Bodoni Moda';font-style:normal;font-weight:400 600;font-display:swap;
  src:url('../fonts/BodoniModa.woff2') format('woff2');
}
@font-face{
  font-family:'Bodoni Moda';font-style:italic;font-weight:400 600;font-display:swap;
  src:url('../fonts/BodoniModa-Italic.woff2') format('woff2');
}
@font-face{
  font-family:'Work Sans';font-style:normal;font-weight:200 400;font-display:swap;
  src:url('../fonts/WorkSans.woff2') format('woff2');
}
@font-face{
  font-family:'Ephesis';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/Ephesis.woff2') format('woff2');
}

:root{
  /* palette — tirée du lieu : sculptures de Digema, tableaux, basalte */
  --charbon:#14100F;
  --charbon-2:#1C1715;
  --rouge:#C81D25;
  --rouge-clair:#E0342C;
  --or:#C9A227;
  --basalte:#4A4E4C;
  --lin:#E9E2D6;
  --chaux:#F2EDE6;
  --brume:rgba(233,226,214,.62);

  --serif:'Bodoni Moda',Didot,'Times New Roman',serif;
  --sans:'Work Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,sans-serif;
  --calli:'Ephesis','Apple Chancery','Snell Roundhand',cursive;

  --max:1320px;
  --gut:clamp(1.5rem,5vw,4.5rem);
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

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

body{
  background:var(--charbon);
  color:var(--lin);
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(1rem,.95rem + .2vw,1.08rem);
  line-height:1.75;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
::selection{background:var(--rouge);color:var(--chaux)}

/* ---------- typographie ---------- */
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;line-height:1.04;letter-spacing:-.02em}
h1{font-size:clamp(3rem,10vw,8.5rem)}
h2{font-size:clamp(2.1rem,5.4vw,4.4rem)}
h3{font-size:clamp(1.5rem,2.8vw,2.4rem)}
p{max-width:66ch}
em{font-style:italic}
strong{font-weight:400;color:var(--chaux)}

.kick{
  display:block;
  font-family:var(--sans);
  font-size:.66rem;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.28em;
  color:var(--rouge);
}
.kick--or{color:var(--or)}
.lead{
  font-size:clamp(1.1rem,1.05rem + .6vw,1.5rem);
  font-weight:200;
  line-height:1.62;
  color:var(--brume);
}

.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
.narrow{max-width:760px}
section{padding-block:clamp(5rem,12vh,10rem);position:relative}

/* ---------- révélations ---------- */
.rv{opacity:0;transform:translateY(30px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.12s}
.rv.d2{transition-delay:.24s}
.rv.d3{transition-delay:.36s}
.rv.d4{transition-delay:.48s}

@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  .hero__media{animation:none !important}
}

/* ---------- navigation ---------- */
.nav{
  position:fixed;top:var(--bandeau,0px);left:0;right:0;z-index:120;
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
  padding:1.6rem var(--gut);
  transition:background .55s var(--ease),padding .55s var(--ease),border-color .55s;
  border-bottom:1px solid transparent;
}
.nav.is-solid{
  background:rgba(20,16,15,.9);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  padding-block:1rem;
  border-bottom-color:rgba(233,226,214,.12);
}
.logo{
  font-family:var(--serif);
  font-size:1.15rem;
  letter-spacing:.42em;
  text-indent:.42em;
  color:var(--chaux);
  white-space:nowrap;
}
.nav__links{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2.4rem)}
.nav__links a{
  font-size:.7rem;text-transform:uppercase;letter-spacing:.17em;
  color:var(--brume);transition:color .35s;
}
.nav__links a:hover{color:var(--chaux)}
.nav__links .cta{
  border:1px solid rgba(233,226,214,.35);
  border-radius:999px;padding:.62rem 1.35rem;color:var(--chaux);
  transition:background .4s,border-color .4s,color .4s;
}
.nav__links .cta:hover{background:var(--rouge);border-color:var(--rouge);color:var(--chaux)}
.nav__burger{display:none;background:none;border:0;color:var(--chaux);cursor:pointer;padding:.4rem}
.nav__burger svg{display:block}

@media (max-width:640px){
  .hero__media{background-position:72% center}
  .hero--centre .hero__media{background-position:56% 40%}
}

@media (max-width:940px){
  .nav__links{
    position:fixed;inset:0;flex-direction:column;justify-content:center;gap:2.2rem;
    background:rgba(20,16,15,.98);backdrop-filter:blur(20px);
    opacity:0;pointer-events:none;transition:opacity .5s var(--ease);
  }
  .nav__links.is-open{opacity:1;pointer-events:auto}
  .nav__links a{font-size:.92rem;letter-spacing:.22em}
  .nav__burger{display:block;position:relative;z-index:2}
}

/* ---------- hero ---------- */
.hero{
  position:relative;min-height:100svh;
  display:flex;flex-direction:column;justify-content:flex-end;
  overflow:hidden;isolation:isolate;
}
.hero__media{
  position:absolute;inset:-6%;z-index:-2;
  background-size:cover;background-position:center;
  animation:souffle 26s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes souffle{
  from{transform:scale(1.02) translateY(0)}
  to{transform:scale(1.09) translateY(-1.2%)}
}
.hero::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(100deg,rgba(20,16,15,.88) 0%,rgba(20,16,15,.55) 46%,rgba(20,16,15,.12) 76%,rgba(20,16,15,0) 90%),
    linear-gradient(180deg,rgba(20,16,15,.78) 0%,rgba(20,16,15,.18) 26%,rgba(20,16,15,.42) 58%,rgba(20,16,15,.96) 100%);
}
.hero__inner{padding-block-end:clamp(3.5rem,10vh,8rem)}
.hero .kick{color:var(--or);text-shadow:0 1px 18px rgba(20,16,15,.9)}
.hero h1,.hero .lead{text-shadow:0 2px 30px rgba(20,16,15,.55)}
.hero h1{max-width:13ch;margin-top:1.6rem}
.hero .lead{max-width:38ch;margin-top:1.9rem}

/* ---------- hero centré (piscine) ---------- */
.hero--centre{justify-content:center;text-align:center}
.hero--centre .hero__media{background-position:center 42%}
.hero--centre::after{
  background:
    radial-gradient(112% 74% at 50% 44%,rgba(20,16,15,.46) 0%,rgba(20,16,15,.30) 44%,rgba(20,16,15,.08) 72%,rgba(20,16,15,0) 100%),
    linear-gradient(180deg,rgba(20,16,15,.68) 0%,rgba(20,16,15,.14) 22%,rgba(20,16,15,.20) 60%,rgba(20,16,15,.88) 100%);
}
.hero--centre .hero__inner{
  padding-block-end:0;
  display:flex;flex-direction:column;align-items:center;
}
.hero--centre h1{max-width:none;margin-top:1.3rem}
.hero--centre .signature{
  font-size:clamp(7rem,26vw,19rem);
  text-shadow:0 6px 50px rgba(20,16,15,.9),0 2px 6px rgba(20,16,15,.75);
}
.hero--centre .hero__sous{margin-top:.35rem}
.hero--centre .lead{
  max-width:44ch;margin-inline:auto;margin-top:1.9rem;
  color:var(--lin);
  text-shadow:0 2px 24px rgba(20,16,15,.95),0 1px 3px rgba(20,16,15,.85);
}
.hero--centre .godown{
  position:absolute;left:50%;bottom:clamp(2rem,5vh,3.6rem);
  transform:translateX(-50%);margin-top:0;
  flex-direction:column;gap:.7rem;
}
.hero--centre .godown i{width:1px;height:44px;order:2;transform-origin:top;animation:tirer-v 2.8s ease-in-out infinite}
@keyframes tirer-v{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}

.godown{
  display:inline-flex;align-items:center;gap:.85rem;margin-top:3rem;
  font-size:.68rem;text-transform:uppercase;letter-spacing:.22em;color:var(--brume);
  transition:color .35s;
}
.godown:hover{color:var(--chaux)}
.godown i{
  display:block;width:54px;height:1px;background:currentColor;
  transform-origin:left;animation:tirer 2.8s ease-in-out infinite;
}
@keyframes tirer{0%,100%{transform:scaleX(.35)}50%{transform:scaleX(1)}}

/* ---------- manifeste ---------- */
.manifeste p{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(1.9rem,5.2vw,4rem);line-height:1.2;letter-spacing:-.02em;
  color:var(--chaux);max-width:none;margin-bottom:.22em;
}
.manifeste em{color:var(--rouge);font-style:italic}

/* ---------- sections claires ---------- */
.clair{background:var(--chaux);color:var(--charbon)}
.clair .lead{color:rgba(20,16,15,.7)}
.clair strong{color:var(--charbon)}
.clair .kick{color:var(--rouge)}

/* ---------- le souffle : deux cartes ---------- */
.souffle{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.4rem,3vw,3rem);margin-top:4rem}
@media(max-width:860px){.souffle{grid-template-columns:1fr}}
.carte{
  position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(2rem,3.4vw,3.2rem);
  border:1px solid rgba(233,226,214,.16);
}
.carte::before{
  content:'';position:absolute;inset:0;z-index:-1;opacity:.55;
  transition:opacity .8s var(--ease);
}
.carte--jour::before{background:radial-gradient(105% 80% at 12% 100%,rgba(70,110,110,.55),transparent 68%)}
.carte--nuit::before{background:radial-gradient(105% 80% at 88% 0%,rgba(200,29,37,.4),transparent 68%)}
.carte:hover::before{opacity:.85}
.carte__h{
  font-family:var(--serif);font-size:clamp(2.6rem,5vw,3.8rem);
  line-height:1;color:var(--or);opacity:.55;
}
.carte h3{margin:.9rem 0 1.1rem;color:var(--chaux)}
.carte p{color:var(--brume);font-weight:200}
.source{
  margin-top:3rem;font-size:.7rem;letter-spacing:.13em;
  text-transform:uppercase;color:rgba(233,226,214,.4);
}

/* ---------- les heures ---------- */
.heures{margin-top:4rem;border-top:1px solid rgba(20,16,15,.16)}
.heure{
  display:grid;grid-template-columns:130px 1.1fr 1.4fr;
  gap:clamp(1rem,3vw,3rem);align-items:baseline;
  padding-block:2.1rem;border-bottom:1px solid rgba(20,16,15,.16);
  transition:background .5s var(--ease);
}
.heure:hover{background:rgba(200,29,37,.05)}
.heure__t{font-family:var(--serif);font-size:1.06rem;letter-spacing:.08em;color:var(--rouge)}
.heure h3{color:var(--charbon)}
.heure p{font-weight:200;color:rgba(20,16,15,.72);font-size:.99rem}
@media(max-width:860px){.heure{grid-template-columns:1fr;gap:.5rem}}

/* ---------- suites ---------- */
.suites{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);margin-top:4rem}
@media(max-width:860px){.suites{grid-template-columns:1fr}}
.suite__media{position:relative;aspect-ratio:4/5;overflow:hidden;margin-bottom:1.9rem}
.suite__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.8s var(--ease)}
.suite:hover .suite__media img{transform:scale(1.06)}
.suite__tag{
  position:absolute;left:1.1rem;bottom:1.1rem;
  font-size:.6rem;text-transform:uppercase;letter-spacing:.2em;
  background:rgba(20,16,15,.55);backdrop-filter:blur(6px);
  padding:.45rem .95rem;border-radius:999px;color:var(--chaux);
}
.suite__meta{
  font-size:.7rem;text-transform:uppercase;letter-spacing:.18em;
  color:var(--or);margin:.7rem 0 1.1rem;
}
.suite p{color:var(--brume);font-weight:200}

/* ---------- chiffres ---------- */
.chiffres{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:4rem}
@media(max-width:720px){.chiffres{grid-template-columns:1fr;gap:2.6rem}}
.chiffre__n{
  font-family:var(--serif);font-size:clamp(3.4rem,8vw,6rem);
  line-height:.9;color:var(--rouge);
}
.chiffre__l{
  font-size:.74rem;text-transform:uppercase;letter-spacing:.16em;
  margin-top:1rem;color:var(--brume);line-height:1.6;max-width:22ch;
}

/* ---------- bloc image pleine largeur ---------- */
.plein{position:relative;height:clamp(60vh,72vh,80vh);overflow:hidden}
.plein img{width:100%;height:100%;object-fit:cover}
.plein::after{
  content:'';position:absolute;inset:auto 0 0 0;height:38%;pointer-events:none;
  background:linear-gradient(180deg,rgba(20,16,15,0) 0%,rgba(20,16,15,.62) 100%);
}
.plein__legende{
  position:absolute;z-index:1;left:var(--gut);bottom:2.4rem;
  font-size:.68rem;text-transform:uppercase;letter-spacing:.2em;
  color:rgba(233,226,214,.92);text-shadow:0 1px 12px rgba(0,0,0,.8);
}

/* ---------- une pièce isolée ---------- */
.piece{
  max-width:min(520px,78vw);
  margin:clamp(4rem,9vw,7.5rem) auto 0;
  text-align:center;
}
.piece img{width:100%;height:auto;display:block}
.piece figcaption{
  margin-top:1.15rem;
  font-size:.66rem;text-transform:uppercase;letter-spacing:.22em;
  color:var(--brume);
}
.clair .piece figcaption{color:#6B615A}

/* ---------- digema ---------- */
.digema{display:grid;grid-template-columns:.85fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
@media(max-width:900px){.digema{grid-template-columns:1fr}}
.digema__img{aspect-ratio:3/4;overflow:hidden}
.digema__img img{width:100%;height:100%;object-fit:cover}
.cote{
  margin-top:2.2rem;padding-top:1.6rem;
  border-top:1px solid rgba(233,226,214,.18);
  font-size:.86rem;color:rgba(233,226,214,.55);font-weight:200;
}

/* ---------- le nom, la chute ---------- */
.nom{text-align:center;background:var(--charbon-2)}
.nom__mot{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(4rem,17vw,14rem);line-height:.9;letter-spacing:.01em;
  color:var(--rouge);margin:1.6rem 0 2.6rem;
}
.nom__gloss{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(1.2rem,2.7vw,2.1rem);line-height:1.55;
  color:var(--chaux);max-width:none;
}
.nom p{margin-inline:auto}
.nom__sign{margin-top:2.6rem;color:rgba(233,226,214,.6);font-weight:200;max-width:52ch}
.nom__sign strong{color:var(--or);font-weight:400}

/* ---------- boutons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  padding:1.05rem 2.3rem;border-radius:999px;cursor:pointer;
  border:1px solid var(--rouge);background:var(--rouge);color:var(--chaux);
  font-family:var(--sans);font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;
  transition:background .4s,color .4s,border-color .4s;
}
.btn:hover{background:transparent;color:var(--rouge)}
.btn--ghost{background:transparent;color:var(--lin);border-color:rgba(233,226,214,.4)}
.btn--ghost:hover{background:var(--lin);color:var(--charbon);border-color:var(--lin)}
.clair .btn--ghost{color:var(--charbon);border-color:rgba(20,16,15,.35)}
.clair .btn--ghost:hover{background:var(--charbon);color:var(--chaux)}

/* ---------- formulaire ---------- */
.book{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,6rem);align-items:start}
@media(max-width:900px){.book{grid-template-columns:1fr}}
form{display:grid;gap:1.5rem}
.row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
@media(max-width:560px){.row{grid-template-columns:1fr}}
label{
  display:block;font-size:.64rem;text-transform:uppercase;
  letter-spacing:.19em;color:rgba(233,226,214,.55);margin-bottom:.65rem;
}
input,select,textarea{
  width:100%;background:transparent;border:0;border-radius:0;
  border-bottom:1px solid rgba(233,226,214,.28);
  padding:.75rem 0;color:var(--lin);
  font-family:var(--sans);font-size:1rem;font-weight:300;
  transition:border-color .4s;
}
input:focus,select:focus,textarea:focus{outline:none;border-bottom-color:var(--rouge)}
select option{background:var(--charbon);color:var(--lin)}
textarea{resize:vertical;min-height:100px}
.consent{
  display:flex;gap:.8rem;align-items:flex-start;font-size:.82rem;
  color:var(--brume);font-weight:200;line-height:1.7;
  text-transform:none;letter-spacing:0;
}
.consent input{width:auto;margin-top:.35rem}

.gages{margin-top:2.4rem;padding-top:2rem;border-top:1px solid rgba(233,226,214,.16);list-style:none}
.gages li{position:relative;padding:.55rem 0 .55rem 1.7rem;font-weight:200;color:var(--brume)}
.gages li::before{
  content:'';position:absolute;left:0;top:1.25rem;
  width:9px;height:1px;background:var(--rouge);
}

/* ---------- tableau tarifs ---------- */
.tarifs{width:100%;border-collapse:collapse;margin-top:2.4rem;font-size:.98rem}
.tarifs th,.tarifs td{
  text-align:left;padding:1rem .6rem;
  border-bottom:1px solid rgba(233,226,214,.16);font-weight:300;
}
.tarifs th{
  font-size:.66rem;text-transform:uppercase;letter-spacing:.17em;
  color:var(--or);font-weight:400;
}
.tarifs td:last-child{text-align:right;font-family:var(--serif);font-size:1.25rem;color:var(--chaux)}
.clair .tarifs th,.clair .tarifs td{border-bottom-color:rgba(20,16,15,.16)}
.clair .tarifs td:last-child{color:var(--charbon)}

/* ---------- partenaires ---------- */
.partenaires{display:grid;gap:0;margin-top:3.5rem;border-top:1px solid rgba(233,226,214,.16)}
.part{
  display:grid;grid-template-columns:150px 1fr;gap:clamp(1rem,3vw,3rem);
  padding-block:2.6rem;border-bottom:1px solid rgba(233,226,214,.16);
}
@media(max-width:820px){.part{grid-template-columns:1fr;gap:.8rem}}
.part__h{font-family:var(--serif);font-size:1.05rem;color:var(--rouge);letter-spacing:.06em}
.part h3{color:var(--chaux);margin-bottom:.5rem}
.part__sub{font-size:.7rem;text-transform:uppercase;letter-spacing:.17em;color:var(--or);margin-bottom:1.1rem}
.part p{color:var(--brume);font-weight:200}

/* ---------- pied de page ---------- */
.pied{background:var(--charbon-2);padding-block:clamp(4rem,8vh,6rem) 2.5rem;font-size:.9rem;font-weight:200}
.pied__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:3rem}
@media(max-width:820px){.pied__grid{grid-template-columns:1fr;gap:2.4rem}}
.pied h4{
  font-family:var(--sans);font-size:.64rem;font-weight:400;
  text-transform:uppercase;letter-spacing:.2em;color:var(--rouge);margin-bottom:1.2rem;
}
.pied p{color:var(--brume)}
.pied a{color:var(--brume);transition:color .3s}
.pied a:hover{color:var(--chaux)}
.pied__legal{
  margin-top:3.5rem;padding-top:2rem;
  border-top:1px solid rgba(233,226,214,.12);
  font-size:.74rem;line-height:1.9;color:rgba(233,226,214,.42);max-width:none;
}

/* ---------- bandeau de travail ---------- */
.chantier{
  position:fixed;top:0;left:0;right:0;
  background:var(--or);color:var(--charbon);
  font-size:.76rem;letter-spacing:.05em;text-align:center;
  padding:.85rem 1.5rem;z-index:200;
}

/* ---------- page intérieure ---------- */
.entete{padding-block:clamp(9rem,18vh,13rem) clamp(3rem,6vh,5rem)}
.entete h1{font-size:clamp(2.6rem,7vw,5.6rem);max-width:16ch}
.entete .lead{margin-top:1.8rem;max-width:60ch}

/* =========================================================
   AGENDA DE RÉSERVATION
   ========================================================= */
.agenda{margin-top:3rem}

.formules{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem;margin-bottom:2.6rem}
@media(max-width:760px){.formules{grid-template-columns:1fr}}
.formule{
  border:1px solid rgba(233,226,214,.2);background:transparent;cursor:pointer;
  padding:1.15rem 1.3rem;text-align:left;color:var(--brume);
  font-family:var(--sans);font-weight:300;
  transition:border-color .4s,background .4s,color .4s;
}
.formule:hover{border-color:rgba(233,226,214,.45);color:var(--chaux)}
.formule[aria-pressed="true"]{border-color:var(--rouge);background:rgba(200,29,37,.1);color:var(--chaux)}
.formule b{display:block;font-family:var(--serif);font-size:1.12rem;font-weight:400;color:var(--chaux);margin-bottom:.25rem}
.formule span{font-size:.63rem;text-transform:uppercase;letter-spacing:.11em;color:var(--or)}

.agenda__barre{
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  padding-bottom:1.2rem;margin-bottom:1.8rem;
  border-bottom:1px solid rgba(233,226,214,.16);
}
.agenda__titre{font-family:var(--serif);font-size:1.3rem;color:var(--chaux);letter-spacing:.02em}
.agenda__nav{display:flex;gap:.6rem}
.fleche{
  width:42px;height:42px;border-radius:999px;cursor:pointer;
  border:1px solid rgba(233,226,214,.28);background:transparent;color:var(--lin);
  display:grid;place-items:center;font-size:1rem;line-height:1;
  transition:border-color .35s,background .35s,color .35s;
}
.fleche:hover:not(:disabled){border-color:var(--rouge);background:var(--rouge);color:var(--chaux)}
.fleche:disabled{opacity:.28;cursor:not-allowed}

.mois{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem)}
@media(max-width:760px){.mois{grid-template-columns:1fr}}
.mois__nom{
  font-family:var(--serif);font-size:1.05rem;color:var(--or);
  letter-spacing:.1em;margin-bottom:1.1rem;text-transform:capitalize;
}
.jsem{
  display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:.5rem;
  font-size:.58rem;text-transform:uppercase;letter-spacing:.12em;
  color:rgba(233,226,214,.38);text-align:center;
}
.jours{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.jour{
  position:relative;aspect-ratio:1;border:0;background:transparent;
  color:var(--brume);font-family:var(--sans);font-size:.86rem;font-weight:300;
  display:grid;place-items:center;cursor:default;
  transition:background .25s,color .25s;
}
.jour--vide{visibility:hidden}
.jour.est-libre{cursor:pointer;color:var(--lin)}
.jour.est-libre:not(.est-debut):not(.est-fin):not(.est-entre):hover{
  background:rgba(233,226,214,.12);color:var(--chaux);
}
.jour.est-pris,.jour.est-passe{color:rgba(233,226,214,.22);cursor:not-allowed}
.jour.est-pris::after{
  content:'';position:absolute;left:22%;right:22%;top:50%;
  height:1px;background:rgba(233,226,214,.28);transform:rotate(-18deg);
}
.jour.est-entre{background:rgba(200,29,37,.16);color:var(--chaux)}
.jour.est-debut,.jour.est-fin{background:var(--rouge);color:var(--chaux)}
.jour.est-debut{border-radius:999px 0 0 999px}
.jour.est-fin{border-radius:0 999px 999px 0}
.jour.est-debut.est-fin{border-radius:999px}
.jour.est-survol{background:rgba(200,29,37,.1)}

.legende{
  display:flex;flex-wrap:wrap;gap:1.6rem;margin-top:2.2rem;padding-top:1.5rem;
  border-top:1px solid rgba(233,226,214,.16);
  font-size:.68rem;text-transform:uppercase;letter-spacing:.14em;color:rgba(233,226,214,.45);
}
.legende i{display:inline-block;width:11px;height:11px;margin-right:.6rem;vertical-align:-1px}
.legende .l-libre{border:1px solid rgba(233,226,214,.45)}
.legende .l-choisi{background:var(--rouge)}
.legende .l-pris{background:rgba(233,226,214,.14)}

/* ---------- le devis ---------- */
.devis{
  position:sticky;top:calc(var(--bandeau,0px) + 6rem);
  border:1px solid rgba(233,226,214,.2);padding:clamp(1.6rem,3vw,2.4rem);
  background:var(--charbon-2);
}
.devis h3{color:var(--chaux);font-size:1.5rem;margin-bottom:1.6rem}
.devis__vide{color:var(--brume);font-weight:200;font-size:.94rem}
.devis__ligne{
  display:flex;justify-content:space-between;gap:1.5rem;align-items:baseline;
  padding-block:.72rem;border-bottom:1px solid rgba(233,226,214,.1);
  font-size:.92rem;font-weight:200;color:var(--brume);
}
.devis__ligne b{font-weight:300;color:var(--chaux);white-space:nowrap;font-family:var(--serif);font-size:1.02rem}
.devis__ligne small{display:block;font-size:.7rem;letter-spacing:.08em;color:rgba(233,226,214,.4)}
.devis__total{
  display:flex;justify-content:space-between;gap:1.5rem;align-items:baseline;
  margin-top:1.5rem;padding-top:1.3rem;border-top:1px solid rgba(233,226,214,.28);
}
.devis__total span{font-size:.66rem;text-transform:uppercase;letter-spacing:.2em;color:var(--or)}
.devis__total b{font-family:var(--serif);font-size:clamp(1.9rem,4vw,2.6rem);font-weight:400;color:var(--chaux);line-height:1}
.devis__arrhes{margin-top:1rem;font-size:.8rem;font-weight:200;color:var(--brume)}
.devis__alerte{
  margin-top:1.4rem;padding:.9rem 1.1rem;
  border-left:2px solid var(--rouge);background:rgba(200,29,37,.09);
  font-size:.84rem;font-weight:200;color:var(--chaux);
}
.devis .btn{width:100%;margin-top:1.8rem}
.devis__note{
  margin-top:1.4rem;font-size:.72rem;line-height:1.7;
  color:rgba(233,226,214,.4);font-weight:200;
}
.reserve{display:grid;grid-template-columns:1.55fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
@media(max-width:1000px){
  .reserve{grid-template-columns:1fr}
  .devis{position:static}
}

/* =========================================================
   QUESTIONNAIRE DE BIENVENUE
   ========================================================= */
.qform{max-width:820px;display:block}
.bloc{
  padding-block:clamp(2.4rem,5vh,3.6rem);
  border-top:1px solid rgba(233,226,214,.16);
}
.bloc:first-of-type{border-top:0;padding-top:0}
.bloc__n{
  font-family:var(--serif);font-size:2.6rem;line-height:1;
  color:var(--rouge);opacity:.5;margin-bottom:.7rem;
}
.bloc h2{font-size:clamp(1.7rem,3.4vw,2.6rem);color:var(--chaux)}
.bloc > p{margin-top:1.2rem;color:var(--brume);font-weight:200}
.bloc form,.bloc .grille{margin-top:2.4rem}
.grille{display:grid;gap:1.6rem}

.choix{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.3rem}
.choix label{
  margin:0;display:inline-flex;align-items:center;gap:.55rem;cursor:pointer;
  border:1px solid rgba(233,226,214,.24);border-radius:999px;
  padding:.62rem 1.15rem;font-size:.72rem;letter-spacing:.1em;
  text-transform:none;color:var(--brume);
  transition:border-color .35s,background .35s,color .35s;
}
.choix label:hover{border-color:rgba(233,226,214,.5);color:var(--chaux)}
.choix input{width:auto;margin:0;accent-color:var(--rouge)}
.choix input:checked + span{color:var(--chaux)}
.choix label:has(input:checked){border-color:var(--rouge);background:rgba(200,29,37,.12);color:var(--chaux)}

.sante{
  border:1px solid rgba(200,29,37,.32);
  padding:clamp(1.4rem,3vw,2.2rem);
  background:rgba(200,29,37,.05);
}
.sante > .kick{margin-bottom:1rem}
.encadre{
  border-left:2px solid var(--or);padding:.2rem 0 .2rem 1.4rem;
  margin-top:1.8rem;font-weight:200;color:var(--brume);font-size:.94rem;
}
.encadre strong{color:var(--or);font-weight:400}
.deroule{margin-top:3rem;border-top:1px solid rgba(233,226,214,.16)}
.etape{
  display:grid;grid-template-columns:120px 1fr;gap:clamp(1rem,3vw,2.6rem);
  padding-block:1.8rem;border-bottom:1px solid rgba(233,226,214,.16);align-items:baseline;
}
@media(max-width:700px){.etape{grid-template-columns:1fr;gap:.4rem}}
.etape__t{font-family:var(--serif);font-size:1rem;letter-spacing:.08em;color:var(--rouge)}
.etape h4{font-family:var(--sans);font-size:.94rem;font-weight:400;color:var(--chaux);margin-bottom:.3rem}
.etape p{font-weight:200;color:var(--brume);font-size:.92rem}

@media(max-width:620px){
  .tarifs--3 td:nth-child(2){display:none}
}

/* =========================================================
   SECTIONS CLAIRES — variantes des composants
   Le fond chaux inverse la palette : sans ces règles, les
   textes en --brume et l'or clair deviennent illisibles.
   ========================================================= */
.clair .suite h3,
.clair .carte h3,
.clair .part h3{color:var(--charbon)}
.clair .suite p,
.clair .carte p,
.clair .part p,
.clair .gages li,
.clair .nom__sign{color:rgba(20,16,15,.72)}
.clair .suite__meta,
.clair .part__sub,
.clair .kick--or{color:#8A6D0F}
.clair .chiffre__l{color:rgba(20,16,15,.62)}
.clair .source,
.clair .devis__note{color:rgba(20,16,15,.45)}
.clair .gages,
.clair .partenaires,
.clair .part,
.clair .cote,
.clair .heures{border-color:rgba(20,16,15,.16)}
.clair .gages li::before{background:var(--rouge)}
.clair .cote{border-top-color:rgba(20,16,15,.18);color:rgba(20,16,15,.6)}

/* =========================================================
   LA SIGNATURE — le nom calligraphié
   Une seule variable commande la calligraphie : --calli.
   Pour en changer, remplacer 'Ephesis' dans :root et
   déposer le .woff2 correspondant dans assets/fonts/.
   ========================================================= */
.signature{
  display:block;
  font-family:var(--calli);
  font-weight:400;
  font-size:clamp(5.6rem,19.5vw,16.5rem);
  line-height:.9;
  letter-spacing:-.005em;
  color:var(--rouge);
  text-shadow:0 4px 34px rgba(20,16,15,.7),0 1px 3px rgba(20,16,15,.5);
  padding-block:.06em;
}
.hero__h1{margin-top:1.1rem}
.hero__sous{
  display:block;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(1.7rem,4.4vw,3.4rem);
  line-height:1.06;
  letter-spacing:-.02em;
  color:var(--chaux);
  margin-top:.9rem;
  text-shadow:0 2px 26px rgba(20,16,15,.85);
}
.hero .lead{margin-top:1.6rem}

/* la signature en petit, dans la barre de navigation */
.logo--calli{
  font-family:var(--calli);
  font-size:2.5rem;
  letter-spacing:0;
  text-indent:0;
  color:var(--rouge);
  line-height:1;
  transition:color .35s;
}
.logo--calli:hover{color:var(--rouge-clair)}
.nav.is-solid .logo--calli{font-size:2.1rem}
.pied .logo--calli{font-size:2.8rem;color:var(--rouge);margin-bottom:1rem}

/* la chute de page reprend la même main */
.nom__mot{font-family:var(--calli);font-size:clamp(5rem,19vw,15rem);line-height:.85;letter-spacing:0}

/* piège à robots — jamais visible, jamais lu par un lecteur d'écran */
.piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* --- correctif hero centre, 16 aout 2026 : evite le chevauchement avec Descendre --- */
.hero--centre .hero__inner{padding-block:4.5rem 7rem}
@media (min-width:941px) and (max-height:860px){
  .hero--centre .signature{font-size:clamp(5rem,15vw,12.5rem)}
  .hero--centre .hero__sous{font-size:clamp(1.5rem,3.4vw,2.6rem)}
  .hero--centre .lead{margin-top:1.2rem;font-size:1rem;max-width:52ch}
  .hero--centre .hero__inner{padding-block:3rem 6rem}
}