/* =========================================================================
   L'Art du Glow, Beauty Salon & Spa, Souissi Rabat
   Kit: Ivoire F8EEDC, Beige Sable E4D1B8, Dore C9A979, Taupe 8B6F47, Expresso 3F3326
   Titres Playfair Display, textes Montserrat. Motif structurant: l'arche du logo.
   ========================================================================= */

:root{
  --ivoire:#F8EEDC;
  --sable:#E4D1B8;
  --dore:#C9A979;
  --taupe:#8B6F47;
  --expresso:#3F3326;
  --surface:#FDF8EE;            /* teinte claire de l'ivoire, pour les cartes */
  --rule:rgba(201,169,121,.34);
  --rule-fort:rgba(201,169,121,.62);
  --ombre:0 18px 50px -28px rgba(63,51,38,.42);
  --ombre-douce:0 10px 34px -22px rgba(63,51,38,.3);
  --t:.72s cubic-bezier(.22,.61,.36,1);
  --t-fast:.32s cubic-bezier(.22,.61,.36,1);
  --wrap:1180px;
  --arche:52% 52% 10px 10px / 30% 30% 2% 2%;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ivoire);color:var(--expresso);
  font-family:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:400;font-size:clamp(.95rem,.3vw + .88rem,1.02rem);line-height:1.78;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:"Playfair Display",Georgia,serif;font-weight:400;margin:0;line-height:1.12}
p{margin:0}
ul{margin:0;padding:0;list-style:none}

.wrap{width:min(100% - 44px,var(--wrap));margin-inline:auto}
.center{text-align:center;max-width:720px;margin-inline:auto}
.section{padding:clamp(66px,8.5vw,118px) 0}
.section--sable{background:var(--sable)}
.section--surface{background:var(--surface)}

/* ---------- Titres et petits elements ---------- */
.eyebrow{
  display:inline-block;font-family:"Montserrat",sans-serif;font-weight:600;
  font-size:.695rem;letter-spacing:.24em;text-transform:uppercase;color:var(--taupe);
  margin-bottom:18px;
}
.eyebrow::after{
  content:"";display:block;width:34px;height:1px;background:var(--dore);
  margin:12px auto 0;opacity:.85;
}
.duo__txt .eyebrow::after,.tete .eyebrow::after{margin-left:0;margin-right:auto}
h1,.h1{font-size:clamp(2.45rem,5.6vw,4.3rem);letter-spacing:-.012em}
.h2{font-size:clamp(1.82rem,3.3vw,2.95rem);letter-spacing:-.008em}
.h3{font-size:clamp(1.12rem,1.5vw,1.36rem);letter-spacing:-.004em}
.lead{color:rgba(63,51,38,.8);font-weight:300;font-size:clamp(1rem,.4vw + .92rem,1.1rem)}
.lead + .lead{margin-top:16px}
.muted{color:rgba(63,51,38,.66);font-weight:300}
.script{
  font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:400;
  font-size:clamp(1.3rem,2.4vw,2.05rem);color:var(--dore);line-height:1.35;
}

/* filet dore avec pastille, separateur signature */
.filet{display:flex;align-items:center;gap:14px;justify-content:center;margin:26px auto 0;max-width:260px}
.filet::before,.filet::after{content:"";flex:1;height:1px;background:var(--rule-fort)}
.filet i{width:6px;height:6px;border-radius:50%;background:var(--dore);display:block}

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:"Montserrat",sans-serif;font-weight:600;font-size:.735rem;
  letter-spacing:.17em;text-transform:uppercase;text-decoration:none;
  padding:15px 30px;border:1px solid var(--expresso);background:var(--expresso);
  color:var(--ivoire);cursor:pointer;border-radius:2px;position:relative;overflow:hidden;
  transition:color var(--t-fast),border-color var(--t-fast),background var(--t-fast);
  line-height:1;
}
.btn::before{
  content:"";position:absolute;inset:0;background:var(--dore);
  transform:translateY(101%);transition:transform var(--t-fast);z-index:0;
}
.btn > *{position:relative;z-index:1}
.btn:hover{color:var(--expresso);border-color:var(--dore)}
.btn:hover::before{transform:translateY(0)}
.btn--light{background:var(--ivoire);border-color:var(--ivoire);color:var(--expresso)}
.btn--light:hover{color:var(--expresso);border-color:var(--dore)}
.btn--ghost{background:transparent;color:var(--expresso);border-color:var(--rule-fort)}
.btn--ghost-light{background:transparent;color:var(--ivoire);border-color:rgba(248,238,220,.5)}
.btn--ghost-light:hover{color:var(--expresso)}
.btn--outline{background:transparent;color:var(--taupe);border-color:var(--rule-fort)}
.btn--outline:hover{color:var(--expresso)}

.linkarrow{
  display:inline-flex;align-items:center;gap:9px;margin-top:22px;
  font-weight:600;font-size:.715rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--taupe);text-decoration:none;transition:color var(--t-fast);
}
.linkarrow svg{display:block;width:17px;height:17px;transition:transform var(--t-fast)}
.linkarrow:hover{color:var(--expresso)}
.linkarrow:hover svg{transform:translateX(6px)}

/* ---------- Navigation ---------- */
.nav{
  position:sticky;top:0;z-index:90;background:var(--ivoire);
  border-bottom:1px solid var(--rule);
  transition:background var(--t-fast),border-color var(--t-fast),padding var(--t-fast);
}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 0}
.nav__brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}
.nav__brand img{width:46px;height:46px;object-fit:contain}
.nav__brand span{display:block}
.nav__name{
  display:block;font-family:"Playfair Display",Georgia,serif;font-size:1.06rem;
  color:var(--expresso);line-height:1.15;transition:color var(--t-fast);
}
.nav__sub{
  display:block;font-size:.575rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--taupe);font-weight:500;margin-top:2px;transition:color var(--t-fast);
}
.nav__links{display:flex;align-items:center;gap:clamp(18px,2.4vw,34px)}
.nav__links a{
  font-family:"Playfair Display",Georgia,serif;font-size:1rem;color:var(--expresso);
  text-decoration:none;position:relative;padding:5px 1px;display:block;
  transition:color var(--t-fast);
}
.nav__links a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;
  background:var(--dore);transition:right var(--t-fast);
}
.nav__links a:hover::after,.nav__links a.active::after{right:0}
.nav__links a.active{color:var(--taupe)}
.nav__end{display:flex;align-items:center;gap:14px}
.nav__cta{padding:12px 22px;font-size:.665rem}
.nav__cta--menu{display:none}
.nav__burger{
  display:none;width:44px;height:44px;border:1px solid var(--rule-fort);background:transparent;
  color:var(--expresso);cursor:pointer;border-radius:2px;position:relative;
}
.nav__burger span,.nav__burger span::before,.nav__burger span::after{
  position:absolute;left:50%;width:20px;height:1.5px;background:currentColor;
  transition:transform var(--t-fast),opacity var(--t-fast);
}
.nav__burger span{top:50%;transform:translate(-50%,-50%)}
.nav__burger span::before,.nav__burger span::after{content:"";left:0;transform:none}
.nav__burger span::before{top:-6px}
.nav__burger span::after{top:6px}

/* etat transparent au dessus du hero.
   :not(.nav--solid) est obligatoire: les deux classes cohabitent sur l'element,
   sans ca le fond devient ivoire au scroll mais le texte reste ivoire, donc invisible. */
.nav--over{background:transparent;border-bottom-color:transparent;position:fixed;left:0;right:0}
.nav--over:not(.nav--solid) .nav__name,
.nav--over:not(.nav--solid) .nav__links a{color:var(--ivoire)}
.nav--over:not(.nav--solid) .nav__sub{color:rgba(248,238,220,.76)}
.nav--over:not(.nav--solid) .nav__burger{color:var(--ivoire);border-color:rgba(248,238,220,.5)}
.nav--over:not(.nav--solid) .nav__cta--bar{background:transparent;border-color:rgba(248,238,220,.55);color:var(--ivoire)}
.nav--over:not(.nav--solid) .nav__cta--bar:hover{color:var(--expresso)}
.nav--solid{background:var(--ivoire);border-bottom-color:var(--rule);box-shadow:0 1px 24px -18px rgba(63,51,38,.7)}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:min(92svh,820px);display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:62% 45%;animation:kenburns 26s ease-out forwards}
@keyframes kenburns{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero__veil{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(63,51,38,.82) 0%,rgba(63,51,38,.66) 34%,rgba(63,51,38,.4) 58%,rgba(63,51,38,.14) 78%,rgba(63,51,38,.3) 100%);
}
.hero__in{position:relative;padding:clamp(120px,15vh,180px) 0 clamp(72px,10vh,110px);max-width:660px;color:var(--ivoire)}
.hero__eyebrow{color:rgba(248,238,220,.86)}
.hero__eyebrow::after{background:var(--dore);margin-left:0;margin-right:auto}
.hero__title{color:var(--ivoire);font-size:clamp(2.6rem,6.2vw,4.7rem)}
.hero__title em{font-style:italic;color:var(--dore)}
.hero__sub{
  margin-top:22px;color:rgba(248,238,220,.9);font-weight:300;
  font-size:clamp(1.02rem,.5vw + .92rem,1.18rem);max-width:30em;
}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
/* anneau dore flottant, rappel du badge */
.hero__ring{
  position:absolute;right:clamp(-150px,-6vw,-60px);top:50%;transform:translateY(-50%);
  width:clamp(320px,38vw,560px);aspect-ratio:1;border:1px solid rgba(201,169,121,.42);
  border-radius:50%;z-index:-1;pointer-events:none;animation:flotte 16s ease-in-out infinite;
}
.hero__ring::after{
  content:"";position:absolute;inset:26px;border:1px solid rgba(201,169,121,.22);border-radius:50%;
}
@keyframes flotte{0%,100%{transform:translateY(-50%) scale(1)}50%{transform:translateY(-54%) scale(1.035)}}

/* ---------- Entete des pages interieures ---------- */
.tete{position:relative;min-height:clamp(320px,42vh,440px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.tete__bg{position:absolute;inset:0;z-index:-2}
.tete__bg img{width:100%;height:100%;object-fit:cover;animation:kenburns 24s ease-out forwards}
.tete__veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(63,51,38,.78) 0%,rgba(63,51,38,.44) 55%,rgba(63,51,38,.22) 100%)}
.tete__in{position:relative;padding:0 0 clamp(40px,5.5vw,62px);color:var(--ivoire);max-width:760px}
.tete__in .eyebrow{color:rgba(248,238,220,.86)}
.tete__in .eyebrow::after{background:var(--dore)}
.tete__in h1{color:var(--ivoire)}
.tete__in p{margin-top:16px;color:rgba(248,238,220,.88);font-weight:300;max-width:46em}

/* ---------- Bande de faits ---------- */
.faits{background:var(--expresso);color:var(--ivoire)}
.faits__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(248,238,220,.16)}
.faits__item{display:flex;align-items:center;gap:15px;padding:30px clamp(16px,2.4vw,30px);background:var(--expresso)}
.faits__ico{display:inline-flex;flex-shrink:0;width:30px;height:30px;color:var(--dore)}
.faits__ico svg{width:100%;height:100%}
.faits__k{display:block;font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dore);font-weight:600}
.faits__v{display:block;margin-top:5px;font-size:.93rem;font-weight:300;color:rgba(248,238,220,.94);line-height:1.5}
.faits__v a{text-decoration:none;transition:color var(--t-fast)}
.faits__v a:hover{color:var(--dore)}

/* ---------- Bloc duo texte + image en arche ---------- */
.duo{display:grid;grid-template-columns:1fr .86fr;gap:clamp(36px,5.5vw,84px);align-items:center}
.duo--inverse .duo__txt{order:2}
.duo__media{position:relative}
.arche{position:relative;padding:18px}
.arche__ring{
  position:absolute;inset:0;border:1px solid var(--rule-fort);
  border-radius:var(--arche);pointer-events:none;
}
.arche__frame{
  position:relative;overflow:hidden;border-radius:var(--arche);
  box-shadow:var(--ombre);background:var(--sable);
}
.arche__frame img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4}
.badge-flottant{
  position:absolute;right:-8px;bottom:26px;z-index:2;background:var(--expresso);color:var(--ivoire);
  padding:15px 20px;border-radius:2px;box-shadow:var(--ombre);text-align:center;
  font-family:"Playfair Display",Georgia,serif;font-size:1.06rem;line-height:1.25;
}
.badge-flottant small{
  display:block;font-family:"Montserrat",sans-serif;font-size:.58rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--dore);font-weight:600;margin-bottom:5px;
}

.puces{margin-top:28px;display:grid;gap:13px}
.puces li{display:flex;align-items:flex-start;gap:12px;font-weight:300;color:rgba(63,51,38,.84)}
.puces svg{width:17px;height:17px;flex-shrink:0;margin-top:5px;color:var(--dore)}

/* ---------- Cartes de prestations ---------- */
.uni{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.uni__card{
  background:var(--surface);border:1px solid var(--rule);padding:clamp(28px,3vw,40px);
  border-radius:2px;position:relative;overflow:hidden;
  transition:border-color var(--t-fast),transform var(--t-fast),box-shadow var(--t-fast);
}
.uni__card::after{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--dore);
  transform:scaleX(0);transform-origin:left;transition:transform var(--t-fast);
}
.uni__card:hover{transform:translateY(-5px);box-shadow:var(--ombre-douce);border-color:var(--rule-fort)}
.uni__card:hover::after{transform:scaleX(1)}
.uni__ico{
  display:inline-flex;width:46px;height:46px;color:var(--dore);margin-bottom:20px;
}
.uni__ico svg{width:100%;height:100%}
.uni__card .h3{margin-bottom:10px}
.uni__card p{color:rgba(63,51,38,.72);font-weight:300;font-size:.945rem;line-height:1.68}

/* ---------- Lignes de tarifs ---------- */
.menuline{
  display:flex;align-items:baseline;gap:12px;padding:13px 0;
  border-bottom:1px solid var(--rule);flex-wrap:wrap;
}
.menuline:last-child{border-bottom:0}
.menuline__n{font-weight:400;color:var(--expresso);flex:1 1 auto;min-width:0;font-size:.96rem}
.menuline__d{flex:1 1 16px;border-bottom:1px dotted var(--rule-fort);transform:translateY(-4px);min-width:16px}
.menuline__p{
  font-family:"Playfair Display",Georgia,serif;font-size:1.12rem;color:var(--taupe);
  flex:0 0 auto;white-space:nowrap;margin-left:auto;
}
.menuline__p small{font-family:"Montserrat",sans-serif;font-size:.6rem;letter-spacing:.13em;
  text-transform:uppercase;margin-left:4px;color:rgba(139,111,71,.8)}
.menuline__p em{font-family:"Montserrat",sans-serif;font-style:normal;font-size:.62rem;
  letter-spacing:.13em;text-transform:uppercase;margin-right:7px;color:rgba(139,111,71,.8)}
.menuline__note{display:block;font-size:.8rem;font-weight:300;color:rgba(63,51,38,.6);margin-top:3px;line-height:1.5}

.teaser{display:grid;grid-template-columns:.85fr 1fr;gap:clamp(34px,5vw,74px);align-items:center}
.teaser__list{background:var(--surface);border:1px solid var(--rule);padding:clamp(24px,3vw,38px);border-radius:2px}

/* ---------- Page prestations: la carte ---------- */
.carte{display:grid;gap:clamp(44px,5vw,70px)}
.fam{scroll-margin-top:110px}
.fam__tete{display:flex;align-items:baseline;gap:16px;margin-bottom:8px}
.fam__tete h2{font-size:clamp(1.5rem,2.3vw,2rem)}
.fam__tete span{flex:1;height:1px;background:var(--rule-fort)}
.fam__note{color:rgba(63,51,38,.66);font-weight:300;font-size:.93rem;margin-bottom:20px;max-width:56em}
.fam__cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3vw,52px);align-items:start}
.bloc{background:var(--surface);border:1px solid var(--rule);padding:clamp(22px,2.6vw,34px);border-radius:2px}
.bloc--sable{background:var(--sable);border-color:rgba(139,111,71,.24)}
.bloc__t{
  font-family:"Montserrat",sans-serif;font-weight:600;font-size:.675rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--taupe);margin-bottom:6px;display:block;
}
.bloc__st{display:block;font-weight:300;font-size:.85rem;color:rgba(63,51,38,.62);margin-bottom:14px;line-height:1.55;text-transform:none;letter-spacing:0}

/* ---------- Avis ---------- */
.avis{columns:3;column-gap:clamp(16px,2vw,26px)}
.avis__card{
  break-inside:avoid;margin:0 0 clamp(16px,2vw,26px);background:var(--surface);
  border:1px solid var(--rule);padding:clamp(26px,3vw,36px);border-radius:2px;position:relative;
}
.avis__q{
  display:block;font-family:"Playfair Display",Georgia,serif;font-size:3.4rem;color:var(--dore);
  line-height:.6;opacity:.5;margin-bottom:14px;
}
.avis__t{font-weight:300;color:rgba(63,51,38,.84);font-size:.96rem;line-height:1.75}
.avis__n{
  display:block;margin-top:18px;font-style:normal;font-family:"Playfair Display",Georgia,serif;
  font-size:1rem;color:var(--taupe);
}

/* ---------- Instagram ---------- */
.ig-handle{
  display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--taupe);
  font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  border:1px solid var(--rule-fort);padding:11px 20px;border-radius:2px;
  transition:background var(--t-fast),color var(--t-fast);
}
.ig-handle svg{width:17px;height:17px;display:block}
.ig-handle:hover{background:var(--dore);color:var(--expresso);border-color:var(--dore)}

.ig-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.2vw,16px);grid-auto-flow:dense}
.ig-grid--strip{grid-template-columns:repeat(4,1fr)}
.ig-post{
  position:relative;display:block;overflow:hidden;border-radius:2px;background:var(--sable);
  aspect-ratio:4/5;text-decoration:none;
}
.ig-post--large{grid-column:span 2;grid-row:span 2}
.ig-post img{width:100%;height:100%;object-fit:cover;transition:transform .85s cubic-bezier(.22,.61,.36,1)}
.ig-post::after{
  content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(63,51,38,.62),rgba(63,51,38,0) 58%);
  opacity:0;transition:opacity var(--t-fast);
}
.ig-post__see{
  position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px;
  color:var(--ivoire);font-size:.635rem;font-weight:600;letter-spacing:.17em;text-transform:uppercase;
  opacity:0;transform:translateY(10px);transition:opacity var(--t-fast),transform var(--t-fast);
  display:flex;align-items:center;gap:8px;
}
.ig-post__see svg{width:14px;height:14px;flex-shrink:0}
.ig-post:hover img{transform:scale(1.07)}
.ig-post:hover::after{opacity:1}
.ig-post:hover .ig-post__see{opacity:1;transform:none}
.ig-post:focus-visible::after{opacity:1}
.ig-post:focus-visible .ig-post__see{opacity:1;transform:none}
.ig-cta{margin-top:clamp(30px,4vw,46px);text-align:center}

/* ---------- Bande CTA ---------- */
.ctaband{background:var(--expresso);color:var(--ivoire);position:relative;overflow:hidden}
.ctaband::before{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(620px,86vw);aspect-ratio:1;border:1px solid rgba(201,169,121,.2);border-radius:50%;
  pointer-events:none;
}
.ctaband .h2{color:var(--ivoire);position:relative}
.ctaband p{color:rgba(248,238,220,.82);font-weight:300;position:relative}
.ctaband__row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:34px;position:relative}

/* ---------- Contact ---------- */
.contact{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(34px,4.5vw,64px);align-items:start}
.infoline{display:flex;gap:16px;padding:22px 0;border-bottom:1px solid var(--rule)}
.infoline:first-child{padding-top:0}
.infoline:last-child{border-bottom:0}
.infoline__ico{display:inline-flex;width:24px;height:24px;flex-shrink:0;color:var(--dore);margin-top:3px}
.infoline__ico svg{width:100%;height:100%}
.infoline__k{display:block;font-size:.635rem;letter-spacing:.22em;text-transform:uppercase;color:var(--taupe);font-weight:600;margin-bottom:6px}
.infoline__v{display:block;font-weight:300;color:rgba(63,51,38,.86);line-height:1.6}
.infoline__v a{text-decoration:none;border-bottom:1px solid var(--rule-fort);transition:color var(--t-fast)}
.infoline__v a:hover{color:var(--taupe)}
.map{border:1px solid var(--rule);border-radius:2px;overflow:hidden;background:var(--sable);line-height:0}
.map iframe{display:block;width:100%;border:0}
.whatsapp-cta{margin-top:26px}
.whatsapp-cta svg{width:17px;height:17px;flex-shrink:0}
.horaires{display:grid;gap:9px;margin-top:4px}
.horaires li{display:flex;justify-content:space-between;gap:18px;font-weight:300;font-size:.93rem;color:rgba(63,51,38,.8)}
.horaires b{font-weight:500;color:var(--expresso)}

/* ---------- Pied de page ---------- */
.footer{background:var(--expresso);color:rgba(248,238,220,.76);padding:clamp(56px,6vw,82px) 0 30px}
.footer__grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.1fr;gap:clamp(28px,3.5vw,54px)}
.footer__brand img{width:120px;height:auto;margin-bottom:18px}
.footer__tag{
  font-family:"Playfair Display",Georgia,serif;font-style:italic;color:var(--dore);
  font-size:1.05rem;line-height:1.4;
}
.footer h4{
  font-family:"Montserrat",sans-serif;font-weight:600;font-size:.645rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--dore);margin-bottom:16px;
}
.footer ul{display:grid;gap:10px}
.footer li{font-size:.9rem;font-weight:300;line-height:1.55}
.footer a{text-decoration:none;transition:color var(--t-fast)}
.footer a:hover{color:var(--dore)}
.footer__bar{
  margin-top:clamp(40px,5vw,60px);padding-top:24px;border-top:1px solid rgba(248,238,220,.16);
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center;
  font-size:.74rem;letter-spacing:.1em;
}
.footer__credit{
  text-transform:uppercase;text-decoration:none;font-size:.665rem;letter-spacing:.17em;
  color:rgba(248,238,220,.6);
}
.footer__credit:hover{color:var(--dore)}

/* =========================================================================
   Modale de reservation (.rsv) — architecture de scroll canonique
   ========================================================================= */
.rsv{
  position:fixed;inset:0;z-index:140;display:none;align-items:flex-start;justify-content:center;
  padding:24px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
}
.rsv.open{display:flex}
.rsv__backdrop{position:fixed;inset:0;background:rgba(63,51,38,.66);backdrop-filter:blur(3px)}
.rsv__card{
  position:relative;display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:minmax(0,1fr);
  width:min(960px,calc(100vw - 40px));margin:auto;
  max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);
  overflow:hidden;background:var(--surface);border-radius:2px;box-shadow:0 40px 90px -40px rgba(63,51,38,.7);
}
.rsv__aside{
  min-height:0;overflow-y:auto;position:relative;background:var(--expresso);color:var(--ivoire);
  padding:clamp(30px,3.4vw,44px);display:flex;flex-direction:column;justify-content:space-between;gap:28px;
}
.rsv__aside::before{
  content:"";position:absolute;right:-70px;bottom:-70px;width:240px;height:240px;
  border:1px solid rgba(201,169,121,.26);border-radius:50%;pointer-events:none;
}
.rsv__aside img{width:88px;height:88px;object-fit:contain;position:relative}
.rsv__aside h2{font-size:clamp(1.5rem,2.2vw,2rem);color:var(--ivoire);position:relative}
.rsv__aside p{margin-top:14px;color:rgba(248,238,220,.78);font-weight:300;font-size:.92rem;position:relative}
.rsv__steps{display:flex;gap:8px;margin-top:22px;position:relative}
.rsv__steps i{width:34px;height:2px;background:rgba(248,238,220,.26);display:block;transition:background var(--t-fast)}
.rsv__steps i.on{background:var(--dore)}
.rsv__body{
  display:flex;flex-direction:column;overflow-y:auto;min-height:0;-webkit-overflow-scrolling:touch;
  padding:clamp(28px,3.2vw,40px);gap:24px;
}
.rsv__body > *{flex-shrink:0}
.rsv__close{
  position:absolute;right:12px;top:12px;z-index:3;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--rule-fort);background:var(--surface);color:var(--expresso);cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background var(--t-fast);
}
.rsv__close:hover{background:var(--dore)}
.rsv__close svg{width:16px;height:16px}
.rsv__lab{
  display:block;font-weight:600;font-size:.645rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--taupe);margin-bottom:12px;
}
.rsv__packs{display:grid;gap:7px;max-height:290px;overflow-y:auto;padding-right:4px}
.rsv__pack{
  display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;text-align:left;
  padding:13px 16px;border:1px solid var(--rule);background:transparent;cursor:pointer;
  font-family:inherit;font-size:.9rem;color:var(--expresso);border-radius:2px;
  transition:border-color var(--t-fast),background var(--t-fast);
}
.rsv__pack:hover{border-color:var(--rule-fort);background:rgba(228,209,184,.32)}
.rsv__pack[aria-pressed="true"]{border-color:var(--dore);background:rgba(201,169,121,.2)}
.rsv__pack b{font-weight:400}
.rsv__pack span{font-family:"Playfair Display",Georgia,serif;color:var(--taupe);white-space:nowrap;font-size:1rem}
.rsv__compte{display:block;margin-top:10px;font-size:.78rem;font-weight:300;color:rgba(63,51,38,.62)}
.rsv__field input[type="date"]{
  -webkit-appearance:none;appearance:none;width:100%;min-height:48px;line-height:1.3;padding:0 14px;
  background:rgba(228,209,184,.4);border:1px solid var(--rule);border-radius:2px;
  font-family:inherit;font-size:1rem;color:var(--expresso);
}
.rsv__field input[type="date"]::-webkit-date-and-time-value{text-align:left;margin:0}
.rsv__field input[type="date"]::-webkit-calendar-picker-indicator{opacity:.55;cursor:pointer}
.rsv__chips{display:flex;flex-wrap:wrap;gap:8px}
.rsv__chip{
  padding:11px 20px;border:1px solid var(--rule);background:transparent;cursor:pointer;
  font-family:inherit;font-size:.83rem;color:var(--expresso);border-radius:2px;
  transition:border-color var(--t-fast),background var(--t-fast);
}
.rsv__chip:hover{border-color:var(--rule-fort)}
.rsv__chip[aria-pressed="true"]{border-color:var(--dore);background:rgba(201,169,121,.2)}
.rsv__recap{border-top:1px solid var(--rule);padding-top:20px;display:grid;gap:9px}
.rsv__ligne{display:flex;justify-content:space-between;gap:18px;font-size:.88rem;font-weight:300;color:rgba(63,51,38,.78)}
.rsv__ligne b{font-weight:500;color:var(--expresso);text-align:right}
.rsv__total{
  display:flex;justify-content:space-between;align-items:baseline;gap:18px;
  border-top:1px solid var(--rule-fort);padding-top:14px;margin-top:4px;
}
.rsv__total span{font-size:.645rem;letter-spacing:.2em;text-transform:uppercase;color:var(--taupe);font-weight:600}
.rsv__total b{font-family:"Playfair Display",Georgia,serif;font-weight:400;font-size:1.45rem;color:var(--expresso)}
.rsv__actions{display:flex;flex-wrap:wrap;gap:10px}
.rsv__actions .btn{flex:1 1 200px;min-width:0}
.rsv__hint{font-size:.8rem;font-weight:300;color:rgba(63,51,38,.6);line-height:1.6}
.rsv__note{font-size:.78rem;font-weight:300;color:rgba(63,51,38,.58);line-height:1.6;border-top:1px solid var(--rule);padding-top:16px}
.rsv__note a{color:var(--taupe)}
body.rsv-open{overflow:hidden}

@media (max-width:1020px){
  .rsv__card{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);
    max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px)}
  .rsv__aside{flex-direction:row;align-items:center;gap:20px;padding:22px 24px}
  .rsv__aside img{width:56px;height:56px}
  .rsv__aside p{display:none}
  .rsv__steps{margin-top:12px}
}
@media (max-width:680px){
  .rsv{padding:0}
  .rsv__card{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);width:100vw;margin:0;
    height:100vh;max-height:100vh;height:100dvh;max-height:100dvh}
  .rsv__packs{max-height:none}
}

/* =========================================================================
   Animations
   ========================================================================= */
[data-reveal]{opacity:0;transform:translate3d(0,26px,0);transition:opacity var(--t),transform var(--t)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal][data-d="1"]{transition-delay:.11s}
[data-reveal][data-d="2"]{transition-delay:.22s}
[data-reveal][data-d="3"]{transition-delay:.33s}
[data-reveal][data-d="4"]{transition-delay:.44s}

.hero [data-hero]{opacity:0;transform:translate3d(0,24px,0);animation:heroIn .95s cubic-bezier(.22,.61,.36,1) forwards}
.hero [data-hero="1"]{animation-delay:.12s}
.hero [data-hero="2"]{animation-delay:.26s}
.hero [data-hero="3"]{animation-delay:.42s}
.hero [data-hero="4"]{animation-delay:.58s}
@keyframes heroIn{to{opacity:1;transform:none}}

.reveal-img img{transform:scale(1.07);transition:transform 1.7s cubic-bezier(.22,.61,.36,1)}
.reveal-img.in img{transform:scale(1)}

@media (prefers-reduced-motion:reduce){
  [data-reveal],[data-reveal].in,.hero [data-hero]{opacity:1;transform:none;animation:none;transition:none}
  .reveal-img img,.reveal-img.in img,.hero__bg img,.tete__bg img{transform:none;animation:none}
  .hero__ring{animation:none}
  *{scroll-behavior:auto}
}

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width:1080px){
  .uni{grid-template-columns:repeat(2,1fr)}
  .avis{columns:2}
  .footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .nav__links{
    display:none;position:fixed;left:0;right:0;top:0;bottom:0;z-index:95;
    background:var(--ivoire);flex-direction:column;justify-content:center;gap:28px;
    padding:80px 24px;
  }
  .nav__links.nav-open{display:flex}
  .nav__links a{font-size:1.6rem;color:var(--expresso)}
  .nav--over .nav__links a{color:var(--expresso)}
  .nav__cta--menu{display:inline-flex;margin-top:10px}
  .nav__cta--bar{display:none}
  .nav__burger{display:block;z-index:96}
  .nav.menu-open{background:var(--ivoire);border-bottom-color:transparent}
  .nav.menu-open .nav__name{color:var(--expresso)}
  .nav.menu-open .nav__sub{color:var(--taupe)}
  .nav.menu-open .nav__burger{color:var(--expresso);border-color:var(--rule-fort)}
  .nav.menu-open .nav__burger span{background:transparent}
  .nav.menu-open .nav__burger span::before{top:0;transform:rotate(45deg)}
  .nav.menu-open .nav__burger span::after{top:0;transform:rotate(-45deg)}

  .duo,.teaser,.contact{grid-template-columns:1fr}
  .duo--inverse .duo__txt{order:0}
  .duo__media{max-width:440px;margin-inline:auto;width:100%}
  .fam__cols{grid-template-columns:1fr}
  .faits__grid{grid-template-columns:1fr}
  .hero__ring{right:-38%;width:min(420px,88vw)}
  .ig-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:680px){
  .uni{grid-template-columns:1fr}
  .avis{columns:1}
  .footer__grid{grid-template-columns:1fr;gap:32px}
  .ig-grid,.ig-grid--strip{grid-template-columns:repeat(2,1fr)}
  .ig-post--large{grid-column:span 2;grid-row:span 1;aspect-ratio:4/5}
  .badge-flottant{right:0;bottom:8px;padding:12px 16px;font-size:.95rem}
  .hero{min-height:min(88svh,720px)}
  /* en portrait le degrade horizontal ne couvre plus le texte: voile vertical */
  .hero__veil{background:linear-gradient(to top,rgba(63,51,38,.82) 0%,rgba(63,51,38,.62) 48%,rgba(63,51,38,.5) 100%)}
  .btn{padding:14px 24px;font-size:.7rem}
  .hero__cta,.ctaband__row{flex-direction:column;align-items:stretch}
  .footer__bar{flex-direction:column;align-items:flex-start;gap:10px}
}
@media (max-width:420px){
  .wrap{width:calc(100% - 34px)}
  .nav__name{font-size:.98rem}
  .nav__brand img,.nav__markwrap,.nav__markwrap img{width:40px;height:40px}
}