/* ============================================================
   LUMA COLLECTION — Hero scroll-scrub
   ============================================================ */

:root{
  --scroll-length: 500vh;      /* hauteur totale du scroll qui pilote la vidéo */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ink: #ffffff;
  --cream: #f4e6c7;            /* crème du logo */
  --burgundy: #3a0e13;         /* bordeaux du logo */
  --pill: rgba(28,24,21,.34);
  --pill-border: rgba(255,255,255,.16);
}

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

/* ---- Touches de bordeaux (accents discrets) ---- */
::selection{ background:rgba(74,20,27,.9); color:#f4e6c7; }
html{ scrollbar-color:#3f1218 #0d0b0a; }
::-webkit-scrollbar{ width:11px; }
::-webkit-scrollbar-track{ background:#0d0b0a; }
::-webkit-scrollbar-thumb{
  background:#3f1218; border-radius:6px;
  border:2px solid #0d0b0a;
}
::-webkit-scrollbar-thumb:hover{ background:#552028; }

/* Lien d'évitement — visible uniquement au focus clavier */
.skip-link{
  position:fixed; top:-100px; left:16px; z-index:300;
  padding:12px 20px;
  background:var(--burgundy); color:var(--cream);
  border-radius:8px;
  font-family:"Jost", sans-serif; font-size:13px; letter-spacing:.08em;
  transition:top .2s ease;
}
.skip-link:focus{ top:16px; }

html{ scroll-behavior:auto; }

body{
  font-family:"Manrope", system-ui, -apple-system, sans-serif;
  background:#0d0b0a;
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

a{ color:inherit; text-decoration:none; }

/* ---------- PRELOADER ---------- */
.preloader{
  position:fixed; inset:0; z-index:100;
  background:var(--burgundy);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .8s var(--ease), visibility .8s;
}
.preloader.is-done{ opacity:0; visibility:hidden; }
.preloader__inner{ text-align:center; width:min(320px,70vw); }
.preloader__logo{
  font-family:"Jost", sans-serif;
  font-size:16px; letter-spacing:.44em; font-weight:300;
  color:var(--cream); margin-bottom:24px; padding-left:.44em;
}
.preloader__bar{
  height:1.5px; width:100%; background:rgba(244,230,199,.2);
  border-radius:2px; overflow:hidden;
}
.preloader__bar span{
  display:block; height:100%; width:0%;
  background:var(--cream);
  transition:width .2s linear;
}
.preloader__pct{
  margin-top:14px; font-size:11px; letter-spacing:.3em;
  color:rgba(244,230,199,.55); font-weight:400;
  font-family:"Jost", sans-serif;
}

/* ---------- HERO / SCROLL CONTAINER ---------- */
.hero{
  position:relative;
  height:520vh;             /* accueil + 6 phrases de valeur sur la vidéo */
}
.hero__stage{
  position:sticky; top:0;
  height:100vh; width:100%;
  overflow:hidden;
  z-index:1;
}
.hero__canvas{
  position:absolute; inset:0;
  width:100%; height:100%;
  display:block;
}

/* Assombrissement pour lisibilité du texte blanc (radial + vertical) */
.hero__scrim{
  position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(120% 85% at 50% 42%, rgba(20,15,12,.55) 0%, rgba(20,15,12,.12) 45%, rgba(20,15,12,0) 70%),
    linear-gradient(to bottom, rgba(15,11,9,.55) 0%, rgba(15,11,9,0) 22%, rgba(15,11,9,0) 58%, rgba(15,11,9,.72) 82%, #0d0b0a 98%);
}

/* ---------- UI OVERLAY ---------- */
.hero__ui{
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  will-change:opacity, transform;
}

/* ---------- NAVBAR ---------- */
.nav{
  position:relative;
  display:flex; align-items:center; gap:14px;
  padding:22px clamp(16px,3vw,34px);
}
.nav__pill{
  flex:1;
  display:flex; align-items:center; gap:26px;
  padding:10px 14px 10px 22px;
  background:linear-gradient(180deg, rgba(38,26,22,.5), rgba(24,16,14,.42));
  border:1px solid rgba(244,230,199,.24);
  border-radius:100px;
  box-shadow:
    0 18px 50px -12px rgba(0,0,0,.5),
    inset 0 1px 0 rgba(255,255,255,.14);
  backdrop-filter:blur(18px) saturate(135%);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
}

.brand{
  display:flex; flex-direction:column; align-items:center;
  line-height:1; padding:2px 6px 0; gap:5px;
  font-family:"Jost", system-ui, sans-serif;
  color:var(--cream);
}
.brand__word{
  font-size:22px; font-weight:300; letter-spacing:.2em;
  padding:6px 0 0 .2em;   /* haut : place pour le macron ; gauche : compense le tracking */
}
.brand__macron{
  position:relative; display:inline-block;
}
.brand__macron::before{
  content:""; position:absolute; left:4%; right:4%; top:-4px;
  height:1.4px; background:currentColor;
}
.brand__line{
  font-size:8px; font-weight:400; letter-spacing:.46em;
  padding-left:.46em; color:rgba(244,230,199,.9);
}

.nav__links{
  display:flex; align-items:center; gap:clamp(16px,2vw,32px);
  margin:0 auto;
}
.nav__links a{
  position:relative;
  font-size:11.5px; font-weight:500;
  text-transform:uppercase; letter-spacing:.16em;
  color:rgba(244,230,199,.72);
  transition:color .3s var(--ease);
  white-space:nowrap; padding:3px 0;
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:-1px;
  width:100%; height:1px;
  background:var(--cream);
  transform:scaleX(0); transform-origin:right center;
  transition:transform .38s var(--ease);
}
.nav__links a:hover{ color:var(--cream); }
.nav__links a:hover::after{ transform:scaleX(1); transform-origin:left center; }

.nav__social{ display:flex; align-items:center; gap:6px; padding-right:2px; }
.nav__social a{
  width:34px; height:34px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff;
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 4px 12px -4px rgba(0,0,0,.4);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.nav__social a:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 18px -5px rgba(0,0,0,.5);
}
.nav__social svg{ width:16px; height:16px; stroke:none; display:block; }
/* Vraies couleurs de marque */
.is-linkedin svg{ fill:#0A66C2; }
.is-whatsapp svg{ fill:#25D366; }
/* Instagram : dégradé porté par le SVG (url(#igGrad)) */

.nav__cta{
  flex-shrink:0;
  padding:14px 26px;
  border-radius:100px;
  font-size:11.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.14em;
  color:var(--burgundy);
  background:var(--cream);
  border:1px solid var(--cream);
  box-shadow:0 12px 34px -10px rgba(0,0,0,.5);
  transition:background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
  white-space:nowrap;
}
.nav__cta:hover{
  background:var(--burgundy); color:var(--cream);
  transform:translateY(-1px);
  box-shadow:0 16px 40px -10px rgba(0,0,0,.55);
}

/* ---------- SIGNATURE BAS-GAUCHE ---------- */
.hero__signature{
  margin-top:auto;
  padding:0 0 clamp(30px,5vh,58px) clamp(28px,4vw,64px);
  animation:sigReveal 1.1s var(--ease) .3s both;
}
.sig__name{
  font-family:"Cormorant Garamond", serif;
  font-weight:500;
  font-size:clamp(52px,7.4vw,116px);
  line-height:.92; letter-spacing:.004em;
  color:var(--cream);
  text-shadow:0 3px 40px rgba(0,0,0,.55), 0 0 80px rgba(0,0,0,.35);
}
.sig__sub{
  display:flex; align-items:center; gap:16px;
  margin-top:clamp(10px,1.3vw,20px);
  font-family:"Jost", sans-serif;
  font-weight:300;
  font-size:clamp(14px,1.5vw,21px);
  letter-spacing:.32em; text-transform:uppercase;
  color:rgba(244,230,199,.88);
  text-shadow:0 1px 18px rgba(0,0,0,.55);
  padding-left:.32em;
}
.sig__line{
  width:clamp(36px,4vw,64px); height:1px;
  background:linear-gradient(90deg, rgba(244,230,199,.9), rgba(244,230,199,.25));
}
@keyframes sigReveal{
  from{ opacity:0; transform:translateY(18px); }
  to{ opacity:1; transform:none; }
}

/* ---------- CENTER ---------- */
.hero__center{
  flex:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
  padding:0 20px;
  transform:translateY(-2vh);
}
.hero__avatar{
  width:66px; height:66px; border-radius:50%;
  box-shadow:0 8px 30px rgba(0,0,0,.4);
  overflow:hidden;
  margin-bottom:16px;
}
.hero__avatar img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.02);   /* mange tout résidu de bord clair */
}
.hero__eyebrow{
  font-family:"Jost", sans-serif;
  font-size:13px; font-weight:300; letter-spacing:.42em;
  color:var(--cream);
  margin-bottom:clamp(16px,2.4vw,26px);
  padding-left:.42em;
}
.hero__eyebrow .mac{ position:relative; }
.hero__eyebrow .mac::before{
  content:""; position:absolute; left:0; width:.56em; top:-.26em;
  height:1px; background:currentColor;
}
.hero__title{
  font-size:clamp(34px,5.3vw,78px);
  line-height:1.0;
  font-weight:800;
  letter-spacing:-.022em;
  color:#fff;
  text-shadow:0 2px 40px rgba(0,0,0,.28);
  white-space:nowrap;
}
.hero__cta{
  margin-top:clamp(22px,3vw,36px);
  padding:17px 34px;
  border-radius:100px;
  background:var(--burgundy);
  color:var(--cream);
  border:1.5px solid var(--cream);
  font-size:15px; font-weight:700; letter-spacing:.005em;
  box-shadow:
    0 14px 40px -8px rgba(58,14,19,.6),
    0 0 18px rgba(244,230,199,.45),
    0 0 4px rgba(244,230,199,.55);
  transition:transform .3s var(--ease), background .3s var(--ease), color .3s var(--ease), box-shadow .3s var(--ease);
  animation:ctaGlow 2.8s var(--ease) infinite;
}
.hero__cta:hover{
  transform:translateY(-2px);
  background:#4a141b;
  box-shadow:
    0 18px 46px -8px rgba(58,14,19,.7),
    0 0 30px rgba(244,230,199,.75),
    0 0 8px rgba(244,230,199,.7);
  animation-play-state:paused;
}
@keyframes ctaGlow{
  0%,100%{
    box-shadow:
      0 14px 40px -8px rgba(58,14,19,.6),
      0 0 14px rgba(244,230,199,.32),
      0 0 3px rgba(244,230,199,.45);
  }
  50%{
    box-shadow:
      0 14px 40px -8px rgba(58,14,19,.6),
      0 0 26px rgba(244,230,199,.6),
      0 0 6px rgba(244,230,199,.7);
  }
}

.hero__tagline{
  margin-top:clamp(22px,2.8vw,32px);
  display:flex; align-items:center; justify-content:center; gap:clamp(14px,1.6vw,22px);
  font-family:"Jost", sans-serif;
  font-size:clamp(13px,1.15vw,15px); font-weight:400; letter-spacing:.4em;
  color:var(--cream);
  padding-left:.4em;
  text-shadow:0 0 20px rgba(244,230,199,.45), 0 2px 24px rgba(0,0,0,.35);
}
.hero__tagline::before,
.hero__tagline::after{
  content:""; height:1px; width:clamp(30px,5vw,64px);
  background:linear-gradient(90deg, transparent, rgba(244,230,199,.85));
}
.hero__tagline::after{ transform:scaleX(-1); }

/* ---------- PROOF BUBBLES / CHIFFRES CLÉS ---------- */
.stats{
  display:flex; align-items:center; justify-content:center;
  gap:clamp(12px,2.6vw,42px);
  padding:4px clamp(16px,4vw,40px) 36px;
}
.stat{
  position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:7px; text-align:center;
  width:clamp(132px,16vw,182px);
  aspect-ratio:1;
  padding:14px;
  background:
    radial-gradient(120% 120% at 32% 24%, rgba(244,230,199,.26), rgba(244,230,199,.06) 46%),
    linear-gradient(155deg, rgba(58,14,19,.66), rgba(24,12,11,.6));
  border:1.5px solid rgba(244,230,199,.5);
  box-shadow:
    0 26px 60px -16px rgba(0,0,0,.72),
    0 0 30px -6px rgba(244,230,199,.28),
    inset 0 1px 0 rgba(255,255,255,.3),
    inset 0 -12px 30px -12px rgba(58,14,19,.6);
  backdrop-filter:blur(10px) saturate(130%);
  -webkit-backdrop-filter:blur(10px) saturate(130%);
  border-radius:47% 53% 58% 42% / 55% 46% 54% 45%;
  opacity:0;
  will-change:transform, border-radius;
  animation:
    statFade .9s var(--ease) forwards,
    blobMorph 11s ease-in-out infinite,
    blobFloat 6.5s ease-in-out infinite;
}
/* Reflet de bulle */
.stat::before{
  content:""; position:absolute; top:11%; left:17%;
  width:38%; height:26%;
  background:radial-gradient(closest-side, rgba(255,255,255,.6), transparent);
  border-radius:50%; filter:blur(2px);
  pointer-events:none; opacity:.75;
}
/* Asymétrie : hauteurs + tailles + désync des animations */
.stat:nth-child(1){ margin-top:-16px; width:clamp(142px,17vw,192px); animation-delay:.05s, -1s,  -.4s; }
.stat:nth-child(2){ margin-top:32px;  width:clamp(124px,14.6vw,164px); animation-delay:.18s, -4s,  -3s;  }
.stat:nth-child(3){ margin-top:-4px;  width:clamp(134px,15.8vw,178px); animation-delay:.31s, -7.5s,-1.8s; }
.stat:nth-child(4){ margin-top:26px;  width:clamp(126px,15vw,168px);   animation-delay:.44s, -2.5s,-5s;  }

.stat__num{
  font-family:"Jost", sans-serif;
  font-size:clamp(30px,3.6vw,46px);
  font-weight:400; letter-spacing:.005em;
  color:#fbf1da;
  line-height:1;
  text-shadow:0 2px 18px rgba(0,0,0,.55), 0 0 26px rgba(244,230,199,.35);
  font-variant-numeric:tabular-nums;
}
.stat__num em{
  font-style:normal; font-weight:300;
  font-size:.55em; opacity:.8; letter-spacing:.01em;
}
.stat__label{
  font-family:"Manrope", sans-serif;
  font-size:clamp(9.5px,.75vw,11px); font-weight:700; line-height:1.35;
  text-transform:uppercase; letter-spacing:.16em;
  color:rgba(244,230,199,.82);
  text-shadow:0 1px 10px rgba(0,0,0,.5);
}

@keyframes statFade{
  from{ opacity:0; }
  to{ opacity:1; }
}
@keyframes blobFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-12px); }
}
@keyframes blobMorph{
  0%,100%{ border-radius:47% 53% 58% 42% / 55% 46% 54% 45%; }
  33%{ border-radius:60% 40% 45% 55% / 48% 58% 42% 52%; }
  66%{ border-radius:42% 58% 52% 48% / 58% 42% 55% 45%; }
}
@media (prefers-reduced-motion:reduce){
  .stat{ animation:statFade .6s var(--ease) forwards; }
}

/* ============================================================
   PHRASES DE VALEUR — sur la vidéo, pilotées par le scroll (JS)
   ============================================================ */
.hero__phrases{
  position:absolute; inset:0; z-index:2;
  pointer-events:none;
}
.hero__phrase{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:clamp(18px,2.6vh,28px);
  text-align:center; padding:0 clamp(24px,6vw,80px);
  opacity:0;
  will-change:opacity, transform;
}
.phrase__kicker{
  display:flex; align-items:center; gap:18px;
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:clamp(10px,.85vw,12.5px); letter-spacing:.42em; text-transform:uppercase;
  color:rgba(244,230,199,.78); padding-left:.42em;
}
.phrase__kicker::before,
.phrase__kicker::after{
  content:""; width:clamp(26px,3vw,42px); height:1px;
}
.phrase__kicker::before{ background:linear-gradient(90deg, transparent, rgba(244,230,199,.6)); }
.phrase__kicker::after{  background:linear-gradient(90deg, rgba(244,230,199,.6), transparent); }
.phrase__text{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(32px,4.4vw,68px); line-height:1.14; letter-spacing:.004em;
  color:#fdf6e6; max-width:24ch;
  text-shadow:0 2px 34px rgba(0,0,0,.5);
}
.phrase__text em{ font-style:italic; opacity:.9; }

/* ============================================================
   À PROPOS — section pleine, après la séquence vidéo
   ============================================================ */
.about{
  position:relative; z-index:5;
  min-height:100vh;
  display:flex; align-items:center;
  padding:16vh clamp(24px,7vw,120px);
  background:#0d0b0a;
  overflow:hidden;
}
/* photo en fond (parallax JS), sous un voile sombre */
.about__bg{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.about__bg img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14);
  will-change:transform;
}
.about__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(180deg, rgba(15,10,8,.66) 0%, rgba(15,10,8,.42) 40%, rgba(15,10,8,.55) 100%),
    linear-gradient(90deg, rgba(15,10,8,.72) 0%, rgba(15,10,8,.45) 55%, rgba(15,10,8,.3) 100%);
}
/* numéro de section fantôme */
.sec__index{
  position:absolute; top:clamp(24px,5vh,60px); right:clamp(24px,4vw,72px);
  z-index:1; pointer-events:none;
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(80px,11vw,170px); line-height:1;
  color:transparent;
  -webkit-text-stroke:1px rgba(172,84,94,.3);
}
.sec__index--left{ right:auto; left:clamp(24px,4vw,72px); }
.about__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(300px,32vw,420px);
  gap:clamp(48px,8vw,120px);
  align-items:center;
  color:var(--cream);
}
.about__text{
  max-width:600px;
}

/* ---- CTA ---- */
.about__actions{
  display:flex; align-items:center; gap:clamp(18px,2.4vw,28px);
  flex-wrap:wrap;
  margin-top:clamp(34px,4vw,52px);
}
.about__cta{
  display:inline-flex; align-items:center;
  padding:15px clamp(28px,3vw,40px);
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:12.5px; text-transform:uppercase; letter-spacing:.28em;
  color:#171009; background:var(--cream);
  border:1px solid var(--cream); border-radius:100px;
  padding-left:calc(clamp(28px,3vw,40px) + .28em);
  transition:background .35s var(--ease), color .35s var(--ease);
}
.about__cta:hover{ background:var(--burgundy); color:var(--cream); }
.about__alt{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:13.5px; letter-spacing:.02em;
  color:rgba(244,230,199,.62);
  border-bottom:1px solid rgba(244,230,199,.28);
  padding-bottom:3px;
  transition:color .3s, border-color .3s;
}
.about__alt:hover{ color:var(--cream); border-color:rgba(244,230,199,.6); }

/* ---- Chiffres clés — pile éditoriale minimaliste ---- */
.about__stats{
  display:flex; flex-direction:column;
}
.astat{
  padding:clamp(22px,2.8vh,34px) 0;
  border-top:1px solid rgba(244,230,199,.16);
  display:flex; flex-direction:column; gap:10px;
  transition:border-color .5s var(--ease);
}
.astat:last-child{ border-bottom:1px solid rgba(244,230,199,.16); }
.astat .astat__num{ transition:transform .6s var(--ease); }
.astat:hover{ border-top-color:rgba(244,230,199,.5); }
.astat:hover .astat__num{ transform:translateX(10px); }
.astat__num{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(42px,4.4vw,66px); line-height:1;
  color:#fdf6e6; letter-spacing:.01em;
  font-variant-numeric:tabular-nums;
}
.astat__num em{
  font-style:normal; font-weight:400;
  font-size:.48em; opacity:.7; letter-spacing:.02em;
  margin-left:2px;
}
.astat__label{
  font-family:"Manrope", sans-serif; font-weight:400;
  font-size:clamp(10.5px,.8vw,12px); line-height:1.5;
  text-transform:uppercase; letter-spacing:.16em;
  color:rgba(244,230,199,.55);
  max-width:34ch;
}

/* ---- Contenu ---- */
.about__eyebrow{
  display:flex; align-items:center; gap:14px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(22px,3vw,36px); padding-left:.36em;
}
.about__line{
  width:clamp(34px,4vw,52px); height:1px;
  background:linear-gradient(90deg, rgba(244,230,199,.9), rgba(244,230,199,.15));
}
.about__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(30px,3.7vw,60px); line-height:1.06; letter-spacing:.004em;
  color:#fdf6e6;
  margin-bottom:clamp(6px,1vw,10px);
}
.about__title em{ font-style:italic; color:var(--cream); opacity:.92; }
.about__rule{
  display:block; width:1px; height:clamp(44px,5vw,68px);
  background:linear-gradient(to bottom, rgba(244,230,199,.7), transparent);
  margin:clamp(20px,2.6vw,30px) 0 clamp(24px,3vw,34px) 2px;
}
.about__body p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(14px,1.02vw,16.5px); line-height:1.92; letter-spacing:.015em;
  color:rgba(244,230,199,.78); max-width:48ch;
}
.about__body p + p{ margin-top:clamp(16px,1.6vw,22px); }
.about__body strong{ color:var(--cream); font-weight:500; letter-spacing:.03em; }

/* ---- Révélation scroll (minimaliste, synchro entrée) ---- */
.reveal{
  opacity:0; transform:translateY(30px); filter:blur(8px);
  transition:opacity 1.1s var(--ease), transform 1.1s var(--ease), filter 1.1s var(--ease);
  transition-delay:var(--d, 0s);
}
.reveal.in{ opacity:1; transform:none; filter:blur(0); }
@media (prefers-reduced-motion:reduce){
  .reveal{ transition:opacity .5s ease; transform:none; filter:none; }
}

/* ============================================================
   PROPRIÉTÉS — image immersive sous voile sombre, contenu à droite
   ============================================================ */
.props{
  position:relative; z-index:5;
  min-height:100vh;
  display:flex; align-items:center;
  padding:16vh clamp(24px,7vw,120px);
  overflow:hidden;
}
.props__bg{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.props__bg img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14);
  will-change:transform;
}
/* voile : lisibilité à droite, la vue mer respire à gauche */
.props__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(270deg, rgba(15,10,8,.82) 0%, rgba(15,10,8,.55) 42%, rgba(15,10,8,.18) 100%),
    linear-gradient(180deg, rgba(15,10,8,.5) 0%, rgba(15,10,8,0) 26%, rgba(15,10,8,0) 72%, rgba(15,10,8,.55) 100%);
}
.props__content{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  color:var(--cream);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,560px);
  gap:clamp(48px,7vw,110px);
  align-items:center;
}
.props__box{
  max-width:560px; margin-left:auto;
}

/* ============================================================
   IPHONE — vos annonces sur Airbnb (preuve de confiance)
   ============================================================ */
.phone{
  justify-self:center;
  width:clamp(240px,20vw,296px);
  aspect-ratio:9/19.2;
  border-radius:clamp(40px,3.6vw,50px);
  background:linear-gradient(160deg,#3a3a3d,#131315 40%,#2c2c30);
  padding:10px;
  box-shadow:
    0 60px 110px -34px rgba(0,0,0,.85),
    0 24px 46px -22px rgba(0,0,0,.7),
    inset 0 1px 1px rgba(255,255,255,.32),
    inset 0 -1px 1px rgba(255,255,255,.1);
  transition:transform .8s var(--ease);
  animation:phoneFloat 7s ease-in-out infinite;
}
.phone:hover{ transform:scale(1.015); }
/* .reveal.in impose transform:none (spécificité) -> on réaffirme le survol */
.phone.reveal.in:hover{ transform:scale(1.015); }
@keyframes phoneFloat{
  0%,100%{ translate:0 0; }
  50%{ translate:0 -10px; }
}
@media (prefers-reduced-motion:reduce){ .phone{ animation:none; } }

.phone__screen{
  position:relative;
  height:100%; width:100%;
  background:#fff;
  border-radius:clamp(31px,2.8vw,40px);
  overflow:hidden;
  display:flex; flex-direction:column;
  font-family:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
  color:#222222;
  text-align:left;
}
.phone__island{
  position:absolute; top:9px; left:50%; transform:translateX(-50%);
  width:31%; height:20px; border-radius:20px;
  background:#000; z-index:6;
}
.ph-status{
  display:flex; justify-content:space-between; align-items:center;
  padding:9px 22px 2px;
  font-size:12.5px; font-weight:600; color:#111;
}
.ph-sig{ display:flex; align-items:center; gap:5px; }
.ph-sig svg{ height:10px; width:auto; fill:#111; color:#111; }

.ph-search{
  margin:8px 12px 4px;
  display:flex; align-items:center; gap:10px;
  padding:7px 14px;
  border:1px solid #e6e6e6; border-radius:26px;
  box-shadow:0 3px 10px rgba(0,0,0,.09);
}
.ph-search svg{ width:15px; height:15px; color:#111; flex:none; }
.ph-search span{ display:flex; flex-direction:column; line-height:1.25; }
.ph-search b{ font-size:10.5px; font-weight:600; color:#111; }
.ph-search i{ font-style:normal; font-size:9px; color:#8a8a8a; }

.ph-feed{
  flex:1; min-height:0;
  padding:6px 12px 0;
  display:flex; flex-direction:column; gap:10px;
  overflow:hidden;
}
.ph-card{ display:flex; flex-direction:column; gap:1px; }
.ph-photo{
  position:relative;
  border-radius:13px; overflow:hidden;
  aspect-ratio:13/8.6;
}
.ph-photo img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; display:block;
}
.ph-badge{
  position:absolute; top:9px; left:9px;
  background:#fff; border-radius:14px;
  padding:3px 8px;
  font-size:8.5px; font-weight:600; color:#222;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
}
.ph-heart{
  position:absolute; top:8px; right:9px;
  width:19px; height:19px;
  fill:rgba(0,0,0,.45); stroke:#fff; stroke-width:1.6px;
}
.ph-dots{
  position:absolute; bottom:7px; left:50%; transform:translateX(-50%);
  display:flex; gap:4px;
}
.ph-dots i{
  width:4.5px; height:4.5px; border-radius:50%;
  background:rgba(255,255,255,.55);
}
.ph-dots i.on{ background:#fff; }
.ph-row{
  display:flex; justify-content:space-between; align-items:baseline;
  margin-top:6px;
}
.ph-row b{ font-size:11px; font-weight:600; color:#111; }
.ph-row span{ font-size:10.5px; color:#111; }
.ph-sub{ font-size:10px; color:#8a8a8a; }
.ph-price{ font-size:10.5px; color:#111; margin-top:1px; }
.ph-price b{ font-weight:600; }

.ph-tabs{
  display:flex; justify-content:space-around; align-items:flex-start;
  border-top:1px solid #ececec;
  padding:7px 4px 0;
}
.ph-tab{
  display:flex; flex-direction:column; align-items:center; gap:2.5px;
  font-size:7.8px; color:#6f6f6f;
}
.ph-tab svg{ width:19px; height:19px; color:#6f6f6f; }
.ph-tab.is-on{ color:#ff385c; }
.ph-tab.is-on svg{ color:#ff385c; }
.ph-homebar{
  width:36%; height:4px; border-radius:3px;
  background:#111; opacity:.9;
  margin:5px auto 7px;
}

/* ---- Écran scrollable + notifications hôte ---- */
.ph-scroll{
  flex:1; min-height:0;
  overflow:hidden; position:relative;
}
.ph-inner{ will-change:transform; }
.ph-notifs{
  padding:6px 12px 12px;
}
.ph-ntitle{
  font-size:14px; font-weight:700; color:#111;
  letter-spacing:-.01em;
  margin:8px 0 2px;
}
.ph-notif{
  display:flex; align-items:center; gap:9px;
  padding:9px 0;
}
.ph-notif + .ph-notif{ border-top:1px solid #f1f1f1; }
.ph-notif__ava{
  width:30px; height:30px; border-radius:50%; flex:none;
  display:grid; place-items:center;
  background:#efe7e2; color:#5a4638;
  font-size:12.5px; font-weight:700;
}
.ph-notif__ava--pay{ background:#e9f7ee; color:#0a8a3a; font-size:12px; }
.ph-notif__ava--star{ background:#fff0f2; color:#ff385c; font-size:11px; }
.ph-notif > div{ min-width:0; flex:1; }
.ph-notif b{
  display:block;
  font-size:10px; font-weight:600; color:#111; line-height:1.3;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ph-notif p{
  font-size:9px; color:#8a8a8a; line-height:1.35;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ph-notif time{
  flex:none; align-self:flex-start; padding-top:2px;
  font-size:8px; color:#b8b8b8;
}
.props__more{
  display:inline-flex; align-items:center; gap:12px;
  margin-top:clamp(28px,3.4vw,44px);
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:12px; text-transform:uppercase; letter-spacing:.26em;
  color:var(--cream);
  border-bottom:1px solid rgba(244,230,199,.35);
  padding-bottom:7px;
  transition:border-color .4s var(--ease);
}
.props__more span{
  font-family:"Manrope", sans-serif;
  transition:transform .45s var(--ease);
}
.props__more:hover{ border-color:rgba(244,230,199,.85); }
.props__more:hover span{ transform:translateX(8px); }
.props__eyebrow{
  display:flex; align-items:center; gap:14px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(22px,3vw,36px); padding-left:.36em;
}
.props__eline{
  width:clamp(34px,4vw,52px); height:1px;
  background:linear-gradient(90deg, rgba(244,230,199,.9), rgba(244,230,199,.15));
}
.props__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.4vw,72px); line-height:1.06; letter-spacing:.004em;
  color:#fdf6e6;
  text-shadow:0 2px 30px rgba(0,0,0,.45);
}
.props__title em{ font-style:italic; color:var(--cream); opacity:.92; }
.props__vrule{
  display:block; width:1px; height:clamp(44px,5vw,68px);
  background:linear-gradient(to bottom, rgba(244,230,199,.7), transparent);
  margin:clamp(20px,2.6vw,30px) 0 clamp(24px,3vw,34px) 2px;
}
.props__body p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(14px,1.02vw,16.5px); line-height:1.92; letter-spacing:.015em;
  color:rgba(244,230,199,.78); max-width:46ch;
  text-shadow:0 1px 14px rgba(0,0,0,.45);
}
.props__body p + p{ margin-top:clamp(16px,1.6vw,22px); }
.props__body strong{ color:var(--cream); font-weight:500; letter-spacing:.03em; }

@media (max-width:860px){
  .about__inner{ grid-template-columns:1fr; gap:clamp(40px,8vw,60px); }
  .about__text{ max-width:600px; }
  .about__stats{ max-width:480px; }
  .props{ padding:14vh 24px; }
  .props__content{ grid-template-columns:1fr; gap:clamp(48px,10vw,70px); }
  .props__box{ margin-left:0; }
  /* mobile : l'écran est rendu à sa largeur de conception (296px) puis
     réduit par un scale -> proportions et lisibilité identiques au desktop */
  .phone{
    order:2;
    width:296px;
    transform:scale(.74);
    margin:-82px 0;
  }
  .phone.reveal{ transform:translateY(30px) scale(.74); }
  .phone.reveal.in{ transform:scale(.74); }
  .sec__index{ font-size:clamp(64px,16vw,100px); }
}

/* ============================================================
   DESTINATIONS — carte de France interactive minimaliste
   ============================================================ */
.dests{
  position:relative; z-index:5;
  min-height:100vh;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:11vh clamp(24px,7vw,120px) 12vh;
  background:#0d0b0a;
  overflow:hidden;
}
/* photo en fond (parallax JS), sous un voile sombre */
.dests__bg{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.dests__bg img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14);
  will-change:transform;
}
.dests__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(90deg, rgba(13,11,10,.82) 0%, rgba(13,11,10,.6) 46%, rgba(13,11,10,.46) 100%),
    linear-gradient(180deg, rgba(13,11,10,.62) 0%, rgba(13,11,10,.28) 28%, rgba(13,11,10,.28) 68%, rgba(13,11,10,.7) 100%);
}
.dests__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(380px,42vw,560px);
  grid-template-areas:"head map" "list map";
  column-gap:clamp(48px,7vw,110px);
  align-items:center;
  color:var(--cream);
}
.dests__head{ grid-area:head; align-self:end; }
.dests__map{  grid-area:map; }

.dests__eyebrow{
  display:flex; align-items:center; gap:14px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(22px,3vw,36px); padding-left:.36em;
}
.dests__eline{
  width:clamp(34px,4vw,52px); height:1px;
  background:linear-gradient(90deg, rgba(244,230,199,.9), rgba(244,230,199,.15));
}
.dests__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.4vw,72px); line-height:1.06; letter-spacing:.004em;
  color:#fdf6e6;
}
.dests__title em{ font-style:italic; color:var(--cream); opacity:.92; }
.dests__vrule{
  display:block; width:1px; height:clamp(26px,3vw,40px);
  background:linear-gradient(to bottom, rgba(244,230,199,.7), transparent);
  margin:clamp(14px,1.8vw,22px) 0 0 2px;
}

/* ---- Liste des destinations ---- */
.dests__list{
  grid-area:list; align-self:start;
  list-style:none;
  margin-top:clamp(18px,2.2vw,30px);
  max-width:460px; width:100%;
}
.dests__list li{
  border-top:1px solid rgba(244,230,199,.14);
  transition:border-color .5s var(--ease);
}
.dests__list li:last-child{ border-bottom:1px solid rgba(244,230,199,.14); }
.dests__list li:has(.is-active){ border-top-color:rgba(244,230,199,.55); }
.dests__list button{
  display:flex; align-items:baseline; gap:clamp(14px,1.6vw,22px);
  width:100%; padding:clamp(10px,1.4vh,15px) 2px;
  background:none; border:0; cursor:pointer; text-align:left;
  color:rgba(244,230,199,.5);
  transition:color .45s var(--ease);
}
.dests__list button:focus-visible{
  outline:1px solid rgba(244,230,199,.6); outline-offset:4px;
  border-radius:2px;
}
.dl__idx{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:10.5px; letter-spacing:.3em;
  color:rgba(190,96,106,.75);
  transition:color .45s var(--ease);
}
.dl__name{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(21px,1.9vw,29px); line-height:1.1; letter-spacing:.01em;
  transition:transform .55s var(--ease);
}
.dl__arrow{
  margin-left:auto;
  font-family:"Manrope", sans-serif; font-size:15px;
  opacity:0; transform:translateX(-10px);
  transition:opacity .45s var(--ease), transform .45s var(--ease);
}
.dests__list button:hover{ color:rgba(244,230,199,.85); }
.dests__list button.is-active{ color:#fdf6e6; }
.dests__list button.is-active .dl__idx{ color:rgba(244,230,199,.8); }
.dests__list button.is-active .dl__name{ transform:translateX(10px); }
.dests__list button.is-active .dl__arrow{ opacity:.8; transform:none; }

/* ---- Carte ---- */
.dests__map svg{ width:100%; height:auto; display:block; overflow:visible; }
.map__land{
  fill:url(#mapDots); fill-opacity:0;
  stroke:rgba(244,230,199,.5); stroke-width:1.1;
  stroke-linejoin:round; stroke-linecap:round;
  stroke-dasharray:1; stroke-dashoffset:1;
  transition:stroke-dashoffset 2.6s var(--ease) .15s, fill-opacity 1.8s var(--ease) 1.5s;
}
.dests__map.in .map__land{ stroke-dashoffset:0; fill-opacity:1; }

.map__compass{ opacity:0; transition:opacity 1.2s var(--ease) 2.2s; }
.dests__map.in .map__compass{ opacity:.55; }
.map__compass line{ stroke:rgba(244,230,199,.6); stroke-width:1; }
.map__compass text{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:11px; letter-spacing:.18em;
  fill:rgba(244,230,199,.75);
}

/* ---- Marqueurs ---- */
.marker{
  cursor:pointer;
  opacity:0;
  transition:opacity .9s var(--ease);
  transition-delay:calc(1.4s + var(--i, 0) * .14s);
}
.dests__map.in .marker{ opacity:1; }
.marker circle{ transform-box:fill-box; transform-origin:center; }
.mk__hit{ fill:transparent; }
.mk__dot{
  fill:var(--cream); opacity:.5;
  transition:opacity .45s var(--ease), transform .45s var(--ease), filter .45s var(--ease);
}
.mk__ring{
  fill:none; stroke:var(--cream); stroke-width:1;
  opacity:0; transform:scale(.4);
}
.mk__line{ stroke:rgba(244,230,199,.65); stroke-width:1; }
.mk__line, .mk__label{
  opacity:0;
  transition:opacity .55s var(--ease), transform .55s var(--ease);
}
.mk__label{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  fill:#fdf6e6;
}
.marker .mk__label{ transform:translateX(8px); }
.marker--left .mk__label{ transform:translateX(-8px); }
.marker:hover .mk__dot{ opacity:.95; }
.marker.is-active .mk__dot{
  opacity:1; transform:scale(1.4);
  filter:drop-shadow(0 0 7px rgba(244,230,199,.85));
}
.marker.is-active .mk__ring{ animation:mkPulse 2.3s var(--ease) infinite; }
.marker.is-active .mk__line,
.marker.is-active .mk__label{ opacity:1; transform:none; }
@keyframes mkPulse{
  0%{ transform:scale(.4); opacity:.75; }
  75%,100%{ transform:scale(1.5); opacity:0; }
}
@media (prefers-reduced-motion:reduce){
  .marker.is-active .mk__ring{ animation:none; opacity:.5; transform:scale(1); }
}

/* ---- Phrase de clôture ---- */
.dests__claim{
  position:relative; z-index:1;
  margin:clamp(40px,6.5vh,68px) auto 0;
  display:flex; align-items:center; gap:clamp(16px,2.2vw,28px);
  font-family:"Cormorant Garamond", serif; font-weight:500; font-style:italic;
  font-size:clamp(20px,2.4vw,32px); line-height:1.3;
  color:rgba(253,246,230,.9);
  text-align:center;
}
.dests__claim::before,
.dests__claim::after{
  content:""; height:1px; width:clamp(34px,5vw,72px); flex:none;
}
.dests__claim::before{ background:linear-gradient(90deg, transparent, rgba(244,230,199,.55)); }
.dests__claim::after{  background:linear-gradient(90deg, rgba(244,230,199,.55), transparent); }
.dests__claim em{ opacity:.72; }

@media (max-width:860px){
  .dests{ padding:14vh 24px; }
  .dests__inner{
    grid-template-columns:1fr;
    grid-template-areas:"head" "map" "list";
  }
  .dests__map{
    max-width:460px; width:100%;
    margin:clamp(28px,7vw,44px) auto 0;
  }
  .dests__list{ margin-top:clamp(24px,6vw,36px); max-width:none; }
  .dests__claim{ margin-top:clamp(44px,8vh,64px); }
  /* le SVG est réduit : on regonfle labels et points */
  .mk__label{ font-size:17px; letter-spacing:.18em; }
  .mk__dot{ r:4.6px; }
  .mk__ring{ r:14px; }
  .mk__hit{ r:22px; }
}

/* ============================================================
   EXPÉRIENCE — le fil d'un séjour
   ============================================================ */
.xp{
  position:relative; z-index:5;
  min-height:100vh;
  display:flex; align-items:center;
  padding:16vh clamp(24px,7vw,120px);
  background:#0d0b0a;
  overflow:hidden;
}
.xp__bg{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.xp__bg img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14);
  will-change:transform;
}
/* image lumineuse : voile plus soutenu, texte à gauche */
.xp__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(90deg, rgba(15,10,8,.86) 0%, rgba(15,10,8,.62) 48%, rgba(15,10,8,.44) 100%),
    linear-gradient(180deg, rgba(15,10,8,.5) 0%, rgba(15,10,8,.18) 30%, rgba(15,10,8,.18) 70%, rgba(15,10,8,.55) 100%);
}
.xp__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(360px,36vw,470px);
  gap:clamp(48px,7vw,110px);
  align-items:center;
  color:var(--cream);
}
.xp__text{ max-width:560px; }

.xp__eyebrow{
  display:flex; align-items:center; gap:14px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(22px,3vw,36px); padding-left:.36em;
}
.xp__eline{
  width:clamp(34px,4vw,52px); height:1px;
  background:linear-gradient(90deg, rgba(244,230,199,.9), rgba(244,230,199,.15));
}
.xp__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.4vw,72px); line-height:1.06; letter-spacing:.004em;
  color:#fdf6e6;
  text-shadow:0 2px 30px rgba(0,0,0,.45);
}
.xp__title em{ font-style:italic; color:var(--cream); opacity:.92; }
.xp__vrule{
  display:block; width:1px; height:clamp(44px,5vw,68px);
  background:linear-gradient(to bottom, rgba(244,230,199,.7), transparent);
  margin:clamp(20px,2.6vw,30px) 0 clamp(24px,3vw,34px) 2px;
}
.xp__body p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(14px,1.02vw,16.5px); line-height:1.92; letter-spacing:.015em;
  color:rgba(244,230,199,.78); max-width:46ch;
  text-shadow:0 1px 14px rgba(0,0,0,.45);
}
.xp__body p + p{ margin-top:clamp(16px,1.6vw,22px); }
.xp__body strong{ color:var(--cream); font-weight:500; letter-spacing:.03em; }

/* ---- Badge disponibilité ---- */
.xp__badge{
  display:inline-flex; align-items:center; gap:12px;
  margin-top:clamp(28px,3.4vw,44px);
  padding:12px 24px 12px 20px;
  border:1px solid rgba(244,230,199,.32); border-radius:100px;
  background:rgba(13,11,10,.35);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:11.5px; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(244,230,199,.9);
}
.xp__badge i{
  position:relative; flex:none;
  width:7px; height:7px; border-radius:50%;
  background:var(--cream);
  box-shadow:0 0 10px rgba(244,230,199,.8);
}
.xp__badge i::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:var(--cream);
  animation:xpPing 2.4s ease-out infinite;
}
@keyframes xpPing{
  0%{ transform:scale(1); opacity:.6; }
  70%,100%{ transform:scale(3); opacity:0; }
}
@media (prefers-reduced-motion:reduce){
  .xp__badge i::before{ animation:none; }
}

/* ---- Timeline ---- */
.xp__timeline{
  position:relative;
  padding-left:36px;
}
.xp__track{
  position:absolute; left:8px; top:8px; bottom:8px;
  width:1px;
  background:rgba(244,230,199,.14);
}
.xp__track span{
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(244,230,199,.85), rgba(244,230,199,.2));
  transform:scaleY(0); transform-origin:top center;
  transition:transform 2.4s var(--ease) .45s;
}
.xp__timeline.in .xp__track span{ transform:scaleY(1); }

.xp__steps{
  list-style:none;
  display:flex; flex-direction:column;
  gap:clamp(24px,3.4vh,38px);
}
.xstep{
  position:relative;
  transition:transform .55s var(--ease);
}
.xstep:hover{ transform:translateX(8px); }
.xstep__dot{
  position:absolute; left:-32px; top:3px;
  width:9px; height:9px; border-radius:50%;
  background:var(--cream);
  box-shadow:0 0 0 4px rgba(244,230,199,.1), 0 0 12px rgba(244,230,199,.35);
  transition:box-shadow .5s var(--ease);
}
.xstep:hover .xstep__dot{
  box-shadow:0 0 0 5px rgba(244,230,199,.18), 0 0 18px rgba(244,230,199,.8);
}
.xstep__kicker{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:10.5px; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(244,230,199,.55);
}
.xstep__name{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(19px,1.65vw,25px); line-height:1.15;
  color:#fdf6e6;
  margin:7px 0 8px;
}
.xstep p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(12.5px,.88vw,13.5px); line-height:1.7; letter-spacing:.01em;
  color:rgba(244,230,199,.62);
  max-width:40ch;
  text-shadow:0 1px 12px rgba(0,0,0,.5);
}

@media (max-width:860px){
  .xp{ padding:14vh 24px; }
  .xp__inner{ grid-template-columns:1fr; gap:clamp(44px,9vw,64px); }
  .xp__timeline{ max-width:480px; }
}

/* ============================================================
   SERVICES — une gestion complète
   ============================================================ */
.svc{
  position:relative; z-index:5;
  min-height:100vh;
  display:flex; align-items:center;
  padding:16vh clamp(24px,7vw,120px);
  background:#0d0b0a;
  overflow:hidden;
}
.svc__bg{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.svc__bg img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14);
  will-change:transform;
}
/* mur clair à droite : voile renforcé côté texte */
.svc__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(270deg, rgba(15,10,8,.84) 0%, rgba(15,10,8,.6) 45%, rgba(15,10,8,.42) 100%),
    linear-gradient(180deg, rgba(15,10,8,.5) 0%, rgba(15,10,8,.2) 30%, rgba(15,10,8,.2) 70%, rgba(15,10,8,.55) 100%);
}
.svc__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(330px,32vw,420px);
  gap:clamp(48px,7vw,110px);
  align-items:center;
  color:var(--cream);
}

/* ---- Le cercle de gestion (cadran orbital) ---- */
.sr-only{
  position:absolute; width:1px; height:1px;
  margin:-1px; padding:0; border:0;
  clip:rect(0 0 0 0); clip-path:inset(50%);
  overflow:hidden; white-space:nowrap;
}
.svc__dial{ position:relative; }
.svc__dial svg{ width:100%; height:auto; display:block; overflow:visible; }

/* cercle de base : se dessine à l'entrée */
.dial__base{
  fill:none; stroke:rgba(244,230,199,.22); stroke-width:1.1;
  stroke-dasharray:1; stroke-dashoffset:1;
  transition:stroke-dashoffset 2.4s var(--ease) .2s;
}
.svc__dial.in .dial__base{ stroke-dashoffset:0; }
.dial__inner{
  fill:none; stroke:rgba(244,230,199,.08); stroke-width:1;
  opacity:0; transition:opacity 1.4s var(--ease) 1.6s;
}
.svc__dial.in .dial__inner{ opacity:1; }

/* arc de progression : 1 unité = 1 service, le cercle se "complète" */
.dial__arc{
  fill:none; stroke:rgba(244,230,199,.85); stroke-width:1.8;
  stroke-linecap:round;
  stroke-dasharray:0 8;
  transition:stroke-dasharray .95s var(--ease);
  filter:drop-shadow(0 0 6px rgba(244,230,199,.4));
}
.dial__arc.no-t{ transition:none; }

/* étapes en orbite */
.dstep{
  cursor:pointer;
  opacity:0;
  transition:opacity .8s var(--ease);
  transition-delay:calc(1.1s + var(--i, 0) * .11s);
}
.svc__dial.in .dstep{ opacity:1; }
.dstep circle{ transform-box:fill-box; transform-origin:center; }
.dstep__hit{ fill:transparent; }
.dstep__dot{
  fill:var(--cream); opacity:.45;
  transition:opacity .45s var(--ease), transform .45s var(--ease), filter .45s var(--ease);
}
.dstep__ring{
  fill:none; stroke:var(--cream); stroke-width:1;
  opacity:0; transform:scale(.4);
}
.dstep__label{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:14.5px; letter-spacing:.2em; text-transform:uppercase;
  fill:rgba(244,230,199,.48);
  transition:fill .45s var(--ease);
}
.dstep:hover .dstep__dot{ opacity:.9; }
.dstep:hover .dstep__label{ fill:rgba(244,230,199,.85); }
.dstep.is-active .dstep__dot{
  opacity:1; transform:scale(1.45);
  filter:drop-shadow(0 0 8px rgba(244,230,199,.9));
}
.dstep.is-active .dstep__ring{ animation:mkPulse 2.3s var(--ease) infinite; }
.dstep.is-active .dstep__label{ fill:#fdf6e6; }
@media (prefers-reduced-motion:reduce){
  .dstep.is-active .dstep__ring{ animation:none; opacity:.5; transform:scale(1); }
}

/* service actif, au centre */
.dial__center{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; text-align:center;
  padding:0 31%;
  pointer-events:none;
}
/* voile radial discret derrière le texte central */
.dial__center::before{
  content:""; position:absolute;
  width:46%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(closest-side, rgba(13,11,10,.6), rgba(13,11,10,.35) 55%, transparent);
  z-index:-1;
}
.dial__center > *{
  transition:opacity .26s var(--ease), transform .26s var(--ease);
}
.dial__center.is-swap > *{ opacity:0; transform:translateY(7px); }
.dial__num{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:12px; letter-spacing:.34em;
  color:rgba(244,230,199,.55);
  padding-left:.34em;
}
.dial__sep{
  width:26px; height:1px;
  background:rgba(244,230,199,.35);
}
.dial__name{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(19px,1.85vw,27px); line-height:1.28;
  color:#fdf6e6;
  text-shadow:0 2px 24px rgba(0,0,0,.5);
}

/* ---- Texte ---- */
.svc__text{ max-width:420px; margin-left:auto; }
.svc__eyebrow{
  display:flex; align-items:center; gap:14px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(22px,3vw,36px); padding-left:.36em;
}
.svc__eline{
  width:clamp(34px,4vw,52px); height:1px;
  background:linear-gradient(90deg, rgba(244,230,199,.9), rgba(244,230,199,.15));
}
.svc__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.4vw,72px); line-height:1.06; letter-spacing:.004em;
  color:#fdf6e6;
  text-shadow:0 2px 30px rgba(0,0,0,.45);
}
.svc__title em{ font-style:italic; color:var(--cream); opacity:.92; }
.svc__vrule{
  display:block; width:1px; height:clamp(44px,5vw,68px);
  background:linear-gradient(to bottom, rgba(244,230,199,.7), transparent);
  margin:clamp(20px,2.6vw,30px) 0 clamp(24px,3vw,34px) 2px;
}
.svc__body p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(14px,1.02vw,16.5px); line-height:1.92; letter-spacing:.015em;
  color:rgba(244,230,199,.78); max-width:40ch;
  text-shadow:0 1px 14px rgba(0,0,0,.45);
}
.svc__body strong{ color:var(--cream); font-weight:500; letter-spacing:.03em; }

.svc__values{
  display:flex; align-items:center; gap:clamp(12px,1.4vw,18px);
  margin-top:clamp(24px,3vw,38px);
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:11.5px; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(244,230,199,.65);
  white-space:nowrap;
}
.svc__values i{ font-style:normal; color:rgba(176,86,95,.7); }

.svc__more{
  display:inline-flex; align-items:center; gap:12px;
  margin-top:clamp(28px,3.4vw,44px);
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:12px; text-transform:uppercase; letter-spacing:.26em;
  color:var(--cream);
  border-bottom:1px solid rgba(244,230,199,.35);
  padding-bottom:7px;
  transition:border-color .4s var(--ease);
}
.svc__more span{
  font-family:"Manrope", sans-serif;
  transition:transform .45s var(--ease);
}
.svc__more:hover{ border-color:rgba(244,230,199,.85); }
.svc__more:hover span{ transform:translateX(8px); }

@media (max-width:860px){
  .svc{ padding:14vh 24px; }
  .svc__inner{ grid-template-columns:1fr; gap:clamp(40px,8vw,56px); }
  .svc__text{ order:-1; margin-left:0; }
  .svc__dial{ max-width:520px; margin:0 auto; width:100%; padding:0 10px; }
  /* le SVG est réduit : labels regonflés */
  .dstep__label{ font-size:18px; letter-spacing:.12em; }
  .dstep__dot{ r:5px; }
  .dial__center{ padding:0 29%; }
  .dial__name{ font-size:17px; }
}

/* ============================================================
   BASES PARTAGÉES — sections photo 06+
   ============================================================ */
.bts, .trs, .own, .prm, .kpi, .sgn, .ctc{
  position:relative; z-index:5;
  min-height:100vh;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:14vh clamp(24px,7vw,120px);
  background:#0d0b0a;
  overflow:hidden;
}
.bts__bg, .trs__bg, .own__bg, .prm__bg, .kpi__bg, .sgn__bg, .ctc__bg{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.bts__bg img, .trs__bg img, .own__bg img, .prm__bg img,
.kpi__bg img, .sgn__bg img, .ctc__bg img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14);
  will-change:transform;
}
/* voiles : fondu haut/bas + assombrissement côté texte */
.bts__bg::after, .trs__bg::after, .own__bg::after, .prm__bg::after,
.kpi__bg::after, .sgn__bg::after, .ctc__bg::after{
  content:""; position:absolute; inset:0;
}
.bts__bg::after{
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(90deg, rgba(15,10,8,.84) 0%, rgba(15,10,8,.56) 48%, rgba(15,10,8,.4) 100%),
    linear-gradient(180deg, rgba(15,10,8,.44) 0%, rgba(15,10,8,.16) 30%, rgba(15,10,8,.16) 70%, rgba(15,10,8,.5) 100%);
}
.trs__bg::after{
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(270deg, rgba(15,10,8,.82) 0%, rgba(15,10,8,.55) 48%, rgba(15,10,8,.4) 100%),
    linear-gradient(180deg, rgba(15,10,8,.44) 0%, rgba(15,10,8,.16) 30%, rgba(15,10,8,.16) 70%, rgba(15,10,8,.5) 100%);
}
.own__bg::after{
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 84%, #0d0b0a 100%),
    linear-gradient(rgba(15,10,8,.6), rgba(15,10,8,.6)),
    linear-gradient(180deg, rgba(15,10,8,.4) 0%, rgba(15,10,8,0) 30%, rgba(15,10,8,0) 70%, rgba(15,10,8,.45) 100%);
}
.prm__bg::after{
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 18%, rgba(13,11,10,0) 78%, #0d0b0a 97%),
    linear-gradient(90deg, rgba(15,10,8,.88) 0%, rgba(15,10,8,.62) 48%, rgba(15,10,8,.46) 100%),
    linear-gradient(180deg, rgba(15,10,8,.5) 0%, rgba(15,10,8,.2) 30%, rgba(15,10,8,.2) 70%, rgba(15,10,8,.55) 100%);
}
.kpi__bg::after{
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 20%, rgba(13,11,10,0) 78%, #0d0b0a 97%),
    linear-gradient(rgba(15,10,8,.62), rgba(15,10,8,.62));
}
.sgn__bg::after{
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 22%, rgba(13,11,10,0) 76%, #0d0b0a 97%),
    linear-gradient(rgba(15,10,8,.58), rgba(15,10,8,.58));
}
.ctc__bg::after{
  background:
    linear-gradient(180deg, #0d0b0a 0%, rgba(13,11,10,0) 16%, rgba(13,11,10,0) 88%, #0d0b0a 100%),
    linear-gradient(90deg, rgba(15,10,8,.84) 0%, rgba(15,10,8,.58) 48%, rgba(15,10,8,.42) 100%),
    linear-gradient(180deg, rgba(15,10,8,.44) 0%, rgba(15,10,8,.16) 30%, rgba(15,10,8,.16) 70%, rgba(15,10,8,.6) 100%);
}

/* eyebrow / titre / filet / corps — même langage partout */
.bts__eyebrow, .trs__eyebrow, .prm__eyebrow, .ctc__eyebrow{
  display:flex; align-items:center; gap:14px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(22px,3vw,36px); padding-left:.36em;
}
.bts__eline, .trs__eline, .prm__eline, .ctc__eline{
  width:clamp(34px,4vw,52px); height:1px;
  background:linear-gradient(90deg, rgba(244,230,199,.9), rgba(244,230,199,.15));
}
.bts__title, .trs__title, .prm__title, .ctc__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.2vw,68px); line-height:1.06; letter-spacing:.004em;
  color:#fdf6e6;
  text-shadow:0 2px 30px rgba(0,0,0,.45);
}
.bts__title em, .trs__title em, .prm__title em, .ctc__title em{
  font-style:italic; color:var(--cream); opacity:.92;
}
.bts__vrule, .trs__vrule, .prm__vrule, .ctc__vrule{
  display:block; width:1px; height:clamp(40px,4.6vw,62px);
  background:linear-gradient(to bottom, rgba(244,230,199,.7), transparent);
  margin:clamp(20px,2.6vw,30px) 0 clamp(24px,3vw,34px) 2px;
}
.bts__body p, .trs__body p, .prm__body p, .ctc__body p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(14px,1.02vw,16.5px); line-height:1.92; letter-spacing:.015em;
  color:rgba(244,230,199,.78); max-width:44ch;
  text-shadow:0 1px 14px rgba(0,0,0,.45);
}
.bts__body p + p, .ctc__body p + p{ margin-top:clamp(16px,1.6vw,22px); }
.bts__body strong, .trs__body strong, .prm__body strong, .ctc__body strong{
  color:var(--cream); font-weight:500; letter-spacing:.03em;
}

/* ============================================================
   06 — COULISSES : la checklist qui se coche toute seule
   ============================================================ */
.bts__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(320px,32vw,410px);
  gap:clamp(48px,7vw,110px);
  align-items:center;
  color:var(--cream);
}
.bts__text{ max-width:560px; }

.chk{
  padding:clamp(26px,3vw,38px) clamp(26px,3vw,40px);
  background:linear-gradient(165deg, rgba(24,18,15,.66), rgba(13,11,10,.55));
  border:1px solid rgba(244,230,199,.22);
  border-radius:20px;
  backdrop-filter:blur(12px) saturate(120%);
  -webkit-backdrop-filter:blur(12px) saturate(120%);
  box-shadow:0 34px 80px -30px rgba(0,0,0,.75);
}
.chk__kicker{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:11px; letter-spacing:.32em; text-transform:uppercase;
  color:rgba(244,230,199,.6);
  margin-bottom:clamp(18px,2vw,26px);
}
.chk__list{ list-style:none; display:flex; flex-direction:column; }
.chk__item{
  display:flex; align-items:center; gap:16px;
  padding:clamp(11px,1.5vh,15px) 0;
  border-top:1px solid rgba(244,230,199,.1);
}
.chk__box{ width:24px; height:24px; flex:none; }
.chk__box circle{
  fill:none; stroke:rgba(244,230,199,.4); stroke-width:1.2;
  stroke-dasharray:1; stroke-dashoffset:1;
  transition:stroke-dashoffset .7s var(--ease);
  transition-delay:calc(var(--i) * .75s + .3s);
}
.chk__box path{
  fill:none; stroke:var(--cream); stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:1; stroke-dashoffset:1;
  transition:stroke-dashoffset .45s var(--ease);
  transition-delay:calc(var(--i) * .75s + .9s);
}
.chk__item span{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(13.5px,.95vw,15px); letter-spacing:.02em;
  color:rgba(244,230,199,.45);
  transition:color .6s var(--ease);
  transition-delay:calc(var(--i) * .75s + .9s);
}
.chk.play .chk__box circle,
.chk.play .chk__box path{ stroke-dashoffset:0; }
.chk.play .chk__item span{ color:rgba(244,230,199,.92); }
.chk__done{
  display:flex; align-items:center; gap:12px;
  margin-top:clamp(18px,2.2vw,26px);
  font-family:"Cormorant Garamond", serif; font-style:italic; font-weight:500;
  font-size:clamp(18px,1.5vw,22px);
  color:#fdf6e6;
  opacity:0; transform:translateY(8px);
  transition:opacity .9s var(--ease) 4.9s, transform .9s var(--ease) 4.9s;
}
.chk__done i{
  width:7px; height:7px; border-radius:50%; flex:none;
  background:var(--cream);
  box-shadow:0 0 10px rgba(244,230,199,.8);
}
.chk.play .chk__done{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .chk__box circle, .chk__box path{ stroke-dashoffset:0; transition:none; }
  .chk__item span{ color:rgba(244,230,199,.92); transition:none; }
  .chk__done{ opacity:1; transform:none; transition:none; }
}

/* ============================================================
   07 — TRANSPARENCE : le calendrier du propriétaire
   ============================================================ */
.trs__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:clamp(340px,36vw,440px) minmax(0,1fr);
  gap:clamp(48px,7vw,110px);
  align-items:center;
  color:var(--cream);
}
.trs__text{ max-width:520px; margin-left:auto; }
.trs__claim{
  margin-top:clamp(24px,3vw,38px);
  font-family:"Cormorant Garamond", serif; font-style:italic; font-weight:500;
  font-size:clamp(19px,1.7vw,26px); line-height:1.4;
  color:rgba(253,246,230,.92);
}
.trs__claim em{ opacity:.75; }

.cal{
  padding:clamp(24px,2.6vw,34px);
  background:linear-gradient(165deg, rgba(24,18,15,.68), rgba(13,11,10,.58));
  border:1px solid rgba(244,230,199,.22);
  border-radius:20px;
  backdrop-filter:blur(12px) saturate(120%);
  -webkit-backdrop-filter:blur(12px) saturate(120%);
  box-shadow:0 34px 80px -30px rgba(0,0,0,.75);
}
.cal__head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-bottom:clamp(16px,1.8vw,22px);
}
.cal__month{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(19px,1.6vw,24px);
  color:#fdf6e6;
}
.cal__chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 14px;
  border:1px solid rgba(244,230,199,.28); border-radius:100px;
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:9.5px; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(244,230,199,.8);
  white-space:nowrap;
}
.cal__chip i{
  width:5px; height:5px; border-radius:50%; flex:none;
  background:var(--cream);
  box-shadow:0 0 8px rgba(244,230,199,.9);
}
.cal__grid{
  display:grid; grid-template-columns:repeat(7,1fr); gap:4px;
}
.cal__wd{
  display:grid; place-items:center;
  padding-bottom:6px;
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:9.5px; letter-spacing:.14em;
  color:rgba(244,230,199,.4);
}
.cal__day{
  position:relative;
  aspect-ratio:1;
  display:grid; place-items:center;
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:clamp(10.5px,.85vw,12px);
  color:rgba(244,230,199,.5);
  border-radius:9px;
}
.cal__day.is-b{ color:rgba(244,230,199,.55); }
.cal__day.is-b::before{
  content:""; position:absolute; inset:2px;
  border-radius:8px;
  background:rgba(244,230,199,.14);
  border:1px solid rgba(244,230,199,.3);
  opacity:0; transform:scale(.55);
  transition:opacity .45s var(--ease), transform .45s var(--ease);
  transition-delay:calc(var(--i) * .07s + .5s);
}
.cal__day.is-b span{ position:relative; }
.cal.play .cal__day.is-b::before{ opacity:1; transform:scale(1); }
.cal.play .cal__day.is-b{
  color:#fdf6e6;
  transition:color .45s var(--ease);
  transition-delay:calc(var(--i) * .07s + .55s);
}
.cal__legend{
  display:flex; align-items:center; gap:clamp(14px,1.6vw,22px);
  margin-top:clamp(14px,1.8vw,20px);
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:10px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(244,230,199,.55);
}
.cal__legend span{ display:inline-flex; align-items:center; gap:8px; }
.cal__dot{
  width:8px; height:8px; border-radius:3px; flex:none;
  border:1px solid rgba(244,230,199,.35);
}
.cal__dot--b{ background:rgba(244,230,199,.4); }
@media (prefers-reduced-motion:reduce){
  .cal__day.is-b::before{ opacity:1; transform:none; transition:none; }
}

/* ============================================================
   08 — PROPRIÉTAIRES : les trois piliers
   ============================================================ */
.own__inner{
  position:relative; z-index:1;
  max-width:1080px; width:100%; margin:0 auto;
  text-align:center;
  color:var(--cream);
}
.own__eyebrow{
  display:flex; align-items:center; justify-content:center; gap:18px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(22px,3vw,36px); padding-left:.36em;
}
.own__eyebrow span{
  width:clamp(30px,3.6vw,48px); height:1px;
}
.own__eyebrow span:first-child{ background:linear-gradient(90deg, transparent, rgba(244,230,199,.7)); }
.own__eyebrow span:last-child{ background:linear-gradient(90deg, rgba(244,230,199,.7), transparent); }
.own__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.2vw,66px); line-height:1.08;
  color:#fdf6e6;
  text-shadow:0 2px 30px rgba(0,0,0,.5);
}
.own__title em{ font-style:italic; color:var(--cream); opacity:.92; }
.own__intro{
  margin:clamp(18px,2.2vw,28px) auto 0;
  max-width:56ch;
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(14px,1.02vw,16.5px); line-height:1.9;
  color:rgba(244,230,199,.75);
  text-shadow:0 1px 14px rgba(0,0,0,.45);
}
.own__pillars{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(28px,4vw,56px);
  margin-top:clamp(44px,6vh,72px);
  text-align:left;
}
.own__pillar{
  padding-top:clamp(18px,2.2vw,26px);
  border-top:1px solid rgba(244,230,199,.22);
  transition:border-color .5s var(--ease);
}
.own__pillar:hover{ border-top-color:rgba(244,230,199,.6); }
.own__no{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(17px,1.4vw,21px); font-style:italic;
  color:rgba(190,96,106,.8);
}
.own__pillar h3{
  margin:10px 0 12px;
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(23px,2vw,30px);
  color:#fdf6e6;
}
.own__pillar p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(12.5px,.9vw,14px); line-height:1.8;
  color:rgba(244,230,199,.66);
  text-shadow:0 1px 12px rgba(0,0,0,.5);
}
.own__actions{
  display:flex; align-items:center; justify-content:center;
  gap:clamp(18px,2.4vw,28px); flex-wrap:wrap;
  margin-top:clamp(44px,6vh,68px);
}
.own__cta{
  display:inline-flex; align-items:center;
  padding:15px clamp(28px,3vw,40px);
  padding-left:calc(clamp(28px,3vw,40px) + .28em);
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:12.5px; text-transform:uppercase; letter-spacing:.28em;
  color:#171009; background:var(--cream);
  border:1px solid var(--cream); border-radius:100px;
  transition:background .35s var(--ease), color .35s var(--ease);
}
.own__cta:hover{ background:var(--burgundy); color:var(--cream); }
.own__alt{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:13.5px;
  color:rgba(244,230,199,.62);
  border-bottom:1px solid rgba(244,230,199,.28);
  padding-bottom:3px;
  transition:color .3s, border-color .3s;
}
.own__alt:hover{ color:var(--cream); border-color:rgba(244,230,199,.6); }

/* ============================================================
   09 — SERVICE PREMIUM : la carte
   ============================================================ */
.prm__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(340px,36vw,460px);
  gap:clamp(48px,7vw,110px);
  align-items:center;
  color:var(--cream);
}
.prm__text{ max-width:520px; }

.prem{
  position:relative;
  padding:clamp(30px,3.4vw,46px) clamp(26px,3vw,42px);
  background:linear-gradient(170deg, rgba(24,18,15,.7), rgba(13,11,10,.6));
  border:1px solid rgba(244,230,199,.35);
  backdrop-filter:blur(12px) saturate(120%);
  -webkit-backdrop-filter:blur(12px) saturate(120%);
  box-shadow:0 38px 90px -32px rgba(0,0,0,.8);
  text-align:center;
}
/* double cadre, comme une carte gravée */
.prem::before{
  content:""; position:absolute; inset:7px;
  border:1px solid rgba(244,230,199,.14);
  pointer-events:none;
}
.prem__orn{
  display:block;
  font-size:11px; color:rgba(190,96,106,.8);
  margin-bottom:10px;
}
.prem__heading{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(24px,2.2vw,32px);
  color:#fdf6e6; letter-spacing:.04em;
}
.prem__sub{
  margin-top:6px;
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:10px; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(244,230,199,.5);
}
.prem__list{
  list-style:none;
  margin-top:clamp(20px,2.4vw,30px);
}
.prem__list li{
  padding:clamp(13px,1.7vh,18px) 6px;
  border-top:1px solid rgba(244,230,199,.12);
  cursor:default; outline:none;
  transition:border-color .5s var(--ease);
}
.prem__list li:last-child{ border-bottom:1px solid rgba(244,230,199,.12); }
.prem__list li:hover, .prem__list li:focus-visible{ border-top-color:rgba(244,230,199,.5); }
.prem__name{
  display:block;
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(18px,1.55vw,23px); line-height:1.2;
  color:rgba(244,230,199,.85);
  transition:color .4s var(--ease);
}
.prem__list li:hover .prem__name,
.prem__list li:focus-visible .prem__name{ color:#fdf6e6; }
.prem__desc{
  display:block; overflow:hidden;
  max-height:0; opacity:0; transform:translateY(-4px);
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:12.5px; line-height:1.6; letter-spacing:.02em;
  color:rgba(244,230,199,.6);
  transition:max-height .55s var(--ease), opacity .5s var(--ease), transform .5s var(--ease), margin .55s var(--ease);
}
.prem__list li:hover .prem__desc,
.prem__list li:focus-visible .prem__desc{
  max-height:48px; opacity:1; transform:none; margin-top:6px;
}

/* ============================================================
   10 — CHIFFRES CLÉS : compteurs
   ============================================================ */
.kpi{ min-height:72vh; }
.kpi__inner{
  position:relative; z-index:1;
  max-width:1120px; width:100%; margin:0 auto;
  text-align:center;
  color:var(--cream);
}
.kpi__eyebrow{
  display:flex; align-items:center; justify-content:center; gap:18px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(20px,2.6vw,32px); padding-left:.36em;
}
.kpi__eyebrow span{ width:clamp(30px,3.6vw,48px); height:1px; }
.kpi__eyebrow span:first-child{ background:linear-gradient(90deg, transparent, rgba(244,230,199,.7)); }
.kpi__eyebrow span:last-child{ background:linear-gradient(90deg, rgba(244,230,199,.7), transparent); }
.kpi__title{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(28px,3.4vw,52px); line-height:1.1;
  color:#fdf6e6;
  text-shadow:0 2px 30px rgba(0,0,0,.5);
}
.kpi__title em{ font-style:italic; color:var(--cream); opacity:.92; }
.kpi__row{
  display:grid; grid-template-columns:repeat(4,1fr);
  margin-top:clamp(44px,7vh,76px);
}
.kpi__item{
  padding:clamp(8px,1vw,14px) clamp(14px,2vw,30px);
}
.kpi__item + .kpi__item{ border-left:1px solid rgba(244,230,199,.16); }
.kpi__num{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(44px,5vw,80px); line-height:1;
  color:#fdf6e6; letter-spacing:.01em;
  font-variant-numeric:tabular-nums;
  text-shadow:0 2px 26px rgba(0,0,0,.5);
}
.kpi__num em{
  font-style:normal; font-weight:400;
  font-size:.46em; opacity:.7; letter-spacing:.02em;
  margin-left:2px;
}
.kpi__label{
  margin-top:12px;
  font-family:"Manrope", sans-serif; font-weight:400;
  font-size:clamp(10px,.8vw,11.5px); line-height:1.5;
  text-transform:uppercase; letter-spacing:.18em;
  color:rgba(244,230,199,.6);
}

/* ============================================================
   SIGNATURE — interlude
   ============================================================ */
.sgn{ min-height:88vh; }
.sgn__inner{
  position:relative; z-index:1;
  text-align:center;
  color:var(--cream);
  display:flex; flex-direction:column; align-items:center;
  gap:clamp(20px,3vh,30px);
}
.sgn__brand{
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:clamp(12px,1vw,14px); letter-spacing:.5em;
  color:rgba(244,230,199,.75);
  padding-left:.5em;
}
.sgn__line{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.6vw,74px); line-height:1.14;
  color:#fdf6e6;
  text-shadow:0 2px 40px rgba(0,0,0,.55);
}
.sgn__line em{ font-style:italic; color:var(--cream); opacity:.9; }
.sgn__rule{
  display:block; width:1px; height:clamp(40px,6vh,64px);
  background:linear-gradient(to bottom, rgba(244,230,199,.75), transparent);
}

/* ============================================================
   CONTACT + FOOTER
   ============================================================ */
.ctc{ padding-bottom:0; }
.ctc__inner{
  position:relative; z-index:1;
  max-width:1180px; width:100%; margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(340px,35vw,450px);
  gap:clamp(48px,7vw,110px);
  align-items:center;
  color:var(--cream);
}
.ctc__text{ max-width:560px; }
.ctc__actions{ margin-top:clamp(30px,3.6vw,46px); }
.ctc__cta{
  display:inline-flex; align-items:center;
  padding:15px clamp(28px,3vw,40px);
  padding-left:calc(clamp(28px,3vw,40px) + .28em);
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:12.5px; text-transform:uppercase; letter-spacing:.28em;
  color:#171009; background:var(--cream);
  border:1px solid var(--cream); border-radius:100px;
  transition:background .35s var(--ease), color .35s var(--ease);
}
.ctc__cta:hover{ background:var(--burgundy); color:var(--cream); }

.ctc__card{
  display:flex; flex-direction:column;
  border-radius:20px;
  background:linear-gradient(165deg, rgba(24,18,15,.66), rgba(13,11,10,.56));
  border:1px solid rgba(244,230,199,.22);
  backdrop-filter:blur(12px) saturate(120%);
  -webkit-backdrop-filter:blur(12px) saturate(120%);
  box-shadow:0 34px 80px -30px rgba(0,0,0,.75);
  padding:clamp(10px,1.2vw,16px) clamp(22px,2.4vw,32px);
}
.crow{
  display:flex; align-items:center; gap:clamp(14px,1.6vw,20px);
  padding:clamp(15px,2vh,20px) 2px;
}
.crow + .crow{ border-top:1px solid rgba(244,230,199,.12); }
.crow__ic{
  width:38px; height:38px; flex:none;
  display:grid; place-items:center;
  border:1px solid rgba(244,230,199,.28); border-radius:50%;
  color:rgba(244,230,199,.85);
  transition:background .4s var(--ease), color .4s var(--ease), transform .4s var(--ease);
}
.crow__ic svg{ width:16px; height:16px; }
.crow__body{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.crow__body b{
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:10px; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(244,230,199,.55);
}
.crow__body i{
  font-style:normal;
  font-family:"Manrope", sans-serif; font-weight:400;
  font-size:clamp(13.5px,1vw,15.5px); letter-spacing:.01em;
  color:#fdf6e6;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.crow__arr{
  margin-left:auto;
  font-family:"Manrope", sans-serif; font-size:15px;
  color:rgba(244,230,199,.5);
  opacity:0; transform:translateX(-8px);
  transition:opacity .4s var(--ease), transform .4s var(--ease), color .4s var(--ease);
}
.crow:hover .crow__ic{ background:var(--cream); color:#171009; transform:translateY(-1px); }
.crow:hover .crow__arr{ opacity:1; transform:none; color:var(--cream); }

/* ---- Footer ---- */
.foot{
  position:relative; z-index:1;
  width:100%;
  margin-top:clamp(60px,10vh,110px);
  border-top:1px solid rgba(244,230,199,.14);
  background:rgba(13,11,10,.5);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.foot__inner{
  max-width:1180px; margin:0 auto;
  padding:clamp(22px,3vh,32px) clamp(24px,4vw,48px);
  display:flex; align-items:center; justify-content:space-between;
  gap:clamp(16px,3vw,32px); flex-wrap:wrap;
}
.foot__nav{
  display:flex; align-items:center; gap:clamp(14px,2vw,26px); flex-wrap:wrap;
}
.foot__nav a{
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(244,230,199,.55);
  transition:color .3s var(--ease);
}
.foot__nav a:hover{ color:var(--cream); }
.foot__copy{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:11.5px; letter-spacing:.04em;
  color:rgba(244,230,199,.45);
}
.foot__legal{ display:inline-flex; gap:14px; }
.foot__legal a{
  color:rgba(244,230,199,.45);
  border-bottom:1px solid rgba(244,230,199,.2);
  padding-bottom:1px;
  transition:color .3s var(--ease), border-color .3s var(--ease);
}
.foot__legal a:hover{ color:var(--cream); border-color:rgba(244,230,199,.6); }
/* Bande crédit Automiatik — pleine largeur, centrée */
.foot__made{
  border-top:1px solid rgba(244,230,199,.08);
  padding:15px 24px 17px;
  display:flex; justify-content:center;
}
.foot__made a{
  display:inline-flex; align-items:center; gap:10px;
  font-family:"Manrope", sans-serif; font-weight:400;
  font-size:12.5px; letter-spacing:.02em;
  color:rgba(255,255,255,.5);
  transition:color .35s var(--ease);
}
.foot__made a:hover{ color:rgba(255,255,255,.75); }
.atk{
  display:inline-flex; align-items:center; gap:7px;
  color:#fff;
}
.atk__mark{
  height:16px; width:auto; display:block;
  transition:transform .4s var(--ease);
}
.foot__made a:hover .atk__mark{ transform:translateY(-1px); }
.atk b{
  font-family:"Poppins", "Manrope", sans-serif;
  font-weight:600; font-size:14px; letter-spacing:.005em;
  color:#fff; line-height:1;
}

/* ============================================================
   PAGES LÉGALES — mentions légales & confidentialité
   ============================================================ */
.legal-body{
  min-height:100vh;
  display:flex; flex-direction:column;
  background:#0d0b0a;
}
.legal__top{
  display:flex; align-items:center; justify-content:space-between;
  gap:20px;
  padding:26px clamp(24px,5vw,64px);
  border-bottom:1px solid rgba(244,230,199,.1);
}
.legal__back{
  display:inline-flex; align-items:center; gap:10px;
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:11px; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(244,230,199,.65);
  transition:color .3s var(--ease);
}
.legal__back span{ font-family:"Manrope", sans-serif; transition:transform .4s var(--ease); }
.legal__back:hover{ color:var(--cream); }
.legal__back:hover span{ transform:translateX(-5px); }
.brand--legal{ padding:0; }

.legal{
  width:min(760px, calc(100% - 48px));
  margin:0 auto;
  padding:clamp(48px,8vh,80px) 0 clamp(60px,10vh,100px);
  color:rgba(244,230,199,.8);
}
.legal h1{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(34px,4.6vw,54px); line-height:1.1;
  color:#fdf6e6;
}
.legal__updated{
  margin-top:12px;
  font-family:"Jost", sans-serif; font-weight:300;
  font-size:11px; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(244,230,199,.45);
}
.legal section{
  margin-top:clamp(36px,5vh,52px);
  padding-top:clamp(24px,3vh,32px);
  border-top:1px solid rgba(244,230,199,.12);
}
.legal h2{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(21px,2vw,27px);
  color:#fdf6e6;
  margin-bottom:14px;
}
.legal p, .legal li{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:14.5px; line-height:1.9; letter-spacing:.012em;
  color:rgba(244,230,199,.72);
}
.legal p + p{ margin-top:12px; }
.legal ul{
  margin:10px 0 0 2px;
  padding-left:20px;
  display:flex; flex-direction:column; gap:8px;
}
.legal li::marker{ color:rgba(244,230,199,.45); }
.legal strong{ color:var(--cream); font-weight:500; }
.legal a{
  color:var(--cream);
  border-bottom:1px solid rgba(244,230,199,.3);
  transition:border-color .3s var(--ease);
}
.legal a:hover{ border-color:rgba(244,230,199,.75); }

.legal__foot{
  margin-top:auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; flex-wrap:wrap;
  padding:22px clamp(24px,5vw,64px);
  border-top:1px solid rgba(244,230,199,.1);
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:11.5px;
  color:rgba(244,230,199,.45);
}
.legal__foot nav{ display:flex; gap:18px; }
.legal__foot a{
  color:rgba(244,230,199,.55);
  border-bottom:1px solid rgba(244,230,199,.2);
  transition:color .3s var(--ease);
}
.legal__foot a:hover{ color:var(--cream); }

/* ---- Responsive sections 06+ ---- */
@media (max-width:960px){
  .kpi__row{ grid-template-columns:1fr 1fr; row-gap:clamp(28px,5vw,40px); }
  .kpi__item:nth-child(3){ border-left:0; }
}
@media (max-width:860px){
  .bts, .trs, .own, .prm, .ctc{ padding:13vh 24px; }
  .ctc{ padding-bottom:0; }
  .bts__inner, .trs__inner, .prm__inner, .ctc__inner{
    grid-template-columns:1fr;
    gap:clamp(40px,8vw,56px);
  }
  .chk, .cal, .prem, .ctc__card{ max-width:480px; width:100%; margin:0 auto; }
  .trs__text{ margin-left:0; }
  .cal{ order:2; }
  .own__pillars{ grid-template-columns:1fr; gap:clamp(22px,5vw,32px); text-align:left; }
  .foot__inner{ flex-direction:column; text-align:center; }
}

/* ============================================================
   FAQ — accordéon natif, respiration avant le contact
   ============================================================ */
.faq{
  position:relative; z-index:5;
  padding:clamp(70px,12vh,120px) clamp(24px,7vw,120px);
  background:#0d0b0a;
}
.faq__inner{
  max-width:820px; width:100%; margin:0 auto;
  color:var(--cream);
}
.faq__eyebrow{
  display:flex; align-items:center; justify-content:center; gap:18px;
  font-family:"Jost", sans-serif; font-weight:300;
  text-transform:uppercase; letter-spacing:.36em; font-size:12.5px;
  color:rgba(244,230,199,.86);
  margin-bottom:clamp(20px,2.6vw,32px); padding-left:.36em;
}
.faq__eyebrow span{ width:clamp(30px,3.6vw,48px); height:1px; }
.faq__eyebrow span:first-child{ background:linear-gradient(90deg, transparent, rgba(244,230,199,.7)); }
.faq__eyebrow span:last-child{ background:linear-gradient(90deg, rgba(244,230,199,.7), transparent); }
.faq__title{
  text-align:center;
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(30px,3.6vw,54px); line-height:1.1;
  color:#fdf6e6;
  margin-bottom:clamp(36px,5vh,60px);
}
.faq__title em{ font-style:italic; color:var(--cream); opacity:.92; }

.faq__item{
  border-top:1px solid rgba(244,230,199,.14);
  transition:border-color .5s var(--ease);
}
.faq__item:last-child{ border-bottom:1px solid rgba(244,230,199,.14); }
.faq__item:hover, .faq__item[open]{ border-top-color:rgba(244,230,199,.5); }
.faq__item summary{
  display:flex; align-items:baseline; justify-content:space-between; gap:20px;
  padding:clamp(16px,2.2vh,22px) 2px;
  cursor:pointer; list-style:none;
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary:focus-visible{
  outline:1px solid rgba(244,230,199,.6); outline-offset:4px; border-radius:2px;
}
.faq__item h3{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(19px,1.8vw,25px); line-height:1.25;
  color:rgba(244,230,199,.85);
  transition:color .4s var(--ease);
}
.faq__item:hover h3, .faq__item[open] h3{ color:#fdf6e6; }
/* signe + / − */
.faq__plus{
  position:relative; flex:none;
  width:14px; height:14px; align-self:center;
}
.faq__plus::before, .faq__plus::after{
  content:""; position:absolute; background:rgba(244,230,199,.6);
  transition:transform .4s var(--ease), background .4s var(--ease);
}
.faq__plus::before{ left:0; right:0; top:6.5px; height:1px; }
.faq__plus::after{ top:0; bottom:0; left:6.5px; width:1px; }
.faq__item[open] .faq__plus::after{ transform:scaleY(0); }
.faq__item[open] .faq__plus::before{ background:var(--cream); }
.faq__answer{ overflow:hidden; }
.faq__answer p{
  padding:0 2px clamp(18px,2.4vh,26px);
  max-width:64ch;
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(13.5px,.98vw,15.5px); line-height:1.85; letter-spacing:.015em;
  color:rgba(244,230,199,.72);
}
/* déroulé animé (navigateurs récents), dégradation propre ailleurs */
.faq__item::details-content{
  block-size:0;
  transition:block-size .5s var(--ease), content-visibility .5s allow-discrete;
  overflow:hidden;
}
.faq__item[open]::details-content{ block-size:auto; }

.faq__more{
  margin-top:clamp(28px,4vh,44px);
  text-align:center;
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:clamp(13px,.95vw,15px);
  color:rgba(244,230,199,.6);
}
.faq__more a{
  color:var(--cream);
  border-bottom:1px solid rgba(244,230,199,.35);
  padding-bottom:2px;
  transition:border-color .3s var(--ease);
}
.faq__more a:hover{ border-color:rgba(244,230,199,.85); }

@media (max-width:860px){
  .faq{ padding:60px 24px; }
}

/* ============================================================
   MODALE — CONFIER MON BIEN (thème clair)
   ============================================================ */
.cmodal{
  position:fixed; inset:0; z-index:400;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.cmodal[hidden]{ display:none; }
/* l'attribut hidden doit toujours gagner sur les display posés plus bas */
.cmodal [hidden]{ display:none !important; }
.cmodal__backdrop{
  position:absolute; inset:0;
  background:rgba(10,8,7,.66);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  opacity:0; transition:opacity .35s var(--ease);
}
.cmodal.in .cmodal__backdrop{ opacity:1; }
.cmodal__card{
  position:relative;
  width:min(600px, 100%);
  max-height:calc(100vh - 48px);
  overflow-y:auto;
  padding:clamp(30px,4.5vw,48px) clamp(24px,4vw,52px) clamp(28px,4vw,44px);
  background:linear-gradient(170deg, #fdfaf3, #f6efe1);
  border:1px solid rgba(58,14,19,.12);
  border-radius:24px;
  box-shadow:0 50px 120px -30px rgba(0,0,0,.8);
  color:#241a15;
  opacity:0; transform:translateY(26px) scale(.98);
  transition:opacity .4s var(--ease), transform .4s var(--ease);
}
.cmodal.in .cmodal__card{ opacity:1; transform:none; }
.cmodal__close{
  position:absolute; top:16px; right:16px;
  width:38px; height:38px; border-radius:50%;
  display:grid; place-items:center;
  background:none; border:1px solid rgba(58,14,19,.22);
  color:rgba(58,14,19,.65); cursor:pointer;
  transition:border-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease);
}
.cmodal__close svg{ width:15px; height:15px; }
.cmodal__close:hover{ border-color:rgba(58,14,19,.6); color:var(--burgundy); transform:rotate(90deg); }
.cmodal__close:focus-visible{ outline:1px solid rgba(58,14,19,.6); outline-offset:3px; }

.cmodal__eyebrow{
  display:flex; align-items:center; justify-content:center; gap:14px;
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:11px; letter-spacing:.34em; text-transform:uppercase;
  color:rgba(58,14,19,.6); padding-left:.34em;
}
.cmodal__eyebrow span{ width:30px; height:1px; }
.cmodal__eyebrow span:first-child{ background:linear-gradient(90deg, transparent, rgba(58,14,19,.45)); }
.cmodal__eyebrow span:last-child{ background:linear-gradient(90deg, rgba(58,14,19,.45), transparent); }
.cmodal__title{
  margin-top:12px;
  text-align:center;
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:clamp(28px,3.4vw,40px); line-height:1.08;
  color:#2b1d18;
}
.cmodal__sub{
  margin:10px auto 0; max-width:40ch;
  text-align:center;
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:13.5px; line-height:1.7;
  color:rgba(43,29,24,.65);
}
.cmodal__sub strong{ font-weight:600; color:var(--burgundy); }

/* ---- Champs ---- */
.cform{ margin-top:clamp(24px,3vw,34px); }
.cform__hp{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.cform__grid{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(18px,2.4vw,26px) clamp(18px,2.6vw,28px);
}
.cfield--full{ grid-column:1 / -1; }
.cfield label{
  display:block;
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:10px; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(58,14,19,.55);
  margin-bottom:2px;
}
.cfield input, .cfield select{
  width:100%;
  background:transparent; border:0; border-radius:0;
  border-bottom:1px solid rgba(58,14,19,.22);
  padding:9px 2px 11px;
  font-family:"Manrope", sans-serif; font-weight:400;
  font-size:15px; letter-spacing:.01em;
  color:#241a15;
  transition:border-color .35s var(--ease);
  -webkit-appearance:none; appearance:none;
}
.cfield input:focus, .cfield select:focus{
  outline:none;
  border-bottom-color:var(--burgundy);
}
.cfield input::placeholder{ color:rgba(43,29,24,.32); }
.cfield__select{ position:relative; }
.cfield__select svg{
  position:absolute; right:2px; bottom:13px;
  width:14px; height:14px;
  color:rgba(58,14,19,.55);
  pointer-events:none;
}
.cfield select{ cursor:pointer; padding-right:24px; }
.cfield select:invalid{ color:rgba(43,29,24,.32); }
.cfield select option{ background:#fff; color:#241a15; }

/* ---- Photos ---- */
.cform__photos{ margin-top:clamp(22px,3vw,30px); }
.cform__plabel{
  display:block;
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:10px; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(58,14,19,.55);
  margin-bottom:12px;
}
.cform__plabel em{ font-style:normal; letter-spacing:.12em; color:rgba(58,14,19,.35); }
.cphotos{ display:flex; gap:12px; flex-wrap:wrap; }
.cphoto{
  position:relative;
  width:82px; height:82px; border-radius:14px;
  border:1px dashed rgba(58,14,19,.32);
  display:grid; place-items:center;
  cursor:pointer; overflow:hidden;
  transition:border-color .35s var(--ease), background .35s var(--ease);
}
.cphoto:hover{ border-color:rgba(58,14,19,.6); background:rgba(58,14,19,.04); }
.cphoto input{ position:absolute; inset:0; opacity:0; cursor:pointer; }
.cphoto__add{
  font-family:"Cormorant Garamond", serif;
  font-size:26px; font-weight:500;
  color:rgba(58,14,19,.45);
  pointer-events:none;
}
.cphoto img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
}
.cphoto.has{ border-style:solid; border-color:rgba(58,14,19,.45); }
.cphoto.has .cphoto__add{ display:none; }
.cphoto__del{
  position:absolute; top:4px; right:4px; z-index:2;
  width:20px; height:20px; border-radius:50%;
  display:grid; place-items:center;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(58,14,19,.35);
  color:var(--burgundy); font-size:13px; line-height:1;
  cursor:pointer;
}

/* ---- Envoi ---- */
.cform__submit{
  display:block; width:100%;
  margin-top:clamp(26px,3.4vw,36px);
  padding:16px 20px;
  font-family:"Jost", sans-serif; font-weight:400;
  font-size:12.5px; letter-spacing:.28em; text-transform:uppercase;
  color:var(--cream); background:var(--burgundy);
  border:1px solid var(--burgundy); border-radius:100px;
  cursor:pointer;
  transition:background .35s var(--ease), color .35s var(--ease), opacity .3s;
}
.cform__submit:hover{ background:#571a23; }
.cform__submit:focus-visible{ outline:1px solid rgba(58,14,19,.6); outline-offset:3px; }
.cform__submit[disabled]{ opacity:.55; cursor:wait; }
.cform__alt{
  margin-top:14px; text-align:center;
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:12.5px; color:rgba(43,29,24,.55);
}
.cform__alt a{
  color:var(--burgundy);
  border-bottom:1px solid rgba(58,14,19,.3);
  transition:color .3s, border-color .3s;
}
.cform__alt a:hover{ color:#571a23; border-color:rgba(58,14,19,.6); }
.cform__status{
  margin-top:12px; text-align:center; min-height:1em;
  font-family:"Manrope", sans-serif; font-size:12.5px;
  color:#a03340;
}

/* ---- État succès ---- */
.cform__done{
  padding:clamp(30px,5vw,44px) 0 clamp(10px,2vw,16px);
  display:flex; flex-direction:column; align-items:center; gap:12px;
  text-align:center;
}
.cform__done svg{ width:52px; height:52px; color:var(--burgundy); }
.cform__done b{
  font-family:"Cormorant Garamond", serif; font-weight:500;
  font-size:26px; color:#2b1d18;
}
.cform__done p{
  font-family:"Manrope", sans-serif; font-weight:300;
  font-size:14px; line-height:1.7;
  color:rgba(43,29,24,.65);
}

@media (max-width:560px){
  .cmodal{ padding:12px; align-items:flex-end; }
  .cmodal__card{ max-height:calc(100dvh - 24px); border-radius:22px 22px 16px 16px; }
  .cform__grid{ grid-template-columns:1fr; gap:16px; }
  .cphoto{ width:72px; height:72px; }
}

/* ---------- BULLE WHATSAPP FLOTTANTE ---------- */
.wa-float{
  position:fixed; z-index:200;
  right:clamp(18px,2.4vw,32px);
  bottom:clamp(18px,2.4vw,32px);
  width:62px; height:62px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#25D366;
  box-shadow:
    0 12px 30px -6px rgba(37,211,102,.55),
    0 8px 22px rgba(0,0,0,.35);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
  animation:waIn .5s var(--ease) .8s both;
}
.wa-float svg{ width:33px; height:33px; fill:#fff; }
/* Anneau pulsé */
.wa-float::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:#25D366; z-index:-1;
  animation:waPulse 2.4s ease-out infinite;
}
.wa-float:hover{
  transform:translateY(-3px) scale(1.06);
  box-shadow:
    0 16px 38px -6px rgba(37,211,102,.7),
    0 10px 26px rgba(0,0,0,.4);
}
@keyframes waPulse{
  0%{ transform:scale(1); opacity:.55; }
  70%{ transform:scale(1.6); opacity:0; }
  100%{ transform:scale(1.6); opacity:0; }
}
@keyframes waIn{
  from{ opacity:0; transform:translateY(16px) scale(.85); }
  to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce){
  .wa-float::before{ animation:none; }
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1080px){
  .nav__links{ gap:16px; }
  .nav__links a{ font-size:12px; }
}
@media (max-width:860px){
  .nav__links, .nav__social{ display:none; }
  .brand__sub{ display:none; }
  /* mobile : pas de backdrop-filter au-dessus du canvas qui repeint à chaque
     frame (très coûteux sur iOS) -> fond légèrement plus opaque à la place */
  .nav__pill{
    justify-content:space-between;
    background:linear-gradient(180deg, rgba(38,26,22,.8), rgba(24,16,14,.74));
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
}
@media (max-width:860px){
  /* mobile : scrub plus court = expérience plus dense et plus fluide */
  .hero{ height:400vh; }
}
@media (max-width:560px){
  .hero__title{ font-size:34px; white-space:normal; }
  .nav__cta{ padding:11px 16px; font-size:12px; }
  .stats{ flex-wrap:wrap; gap:14px; padding-bottom:30px; }
  .stat, .stat:nth-child(1), .stat:nth-child(2),
  .stat:nth-child(3), .stat:nth-child(4){
    width:clamp(96px,40vw,124px); margin-top:0;
  }
  /* signature : remonte et laisse la zone de la bulle WhatsApp libre */
  .hero__signature{ padding:0 88px clamp(74px,11vh,96px) 22px; }
  .sig__name{ font-size:clamp(36px,11.5vw,48px); line-height:.96; }
  .sig__sub{ font-size:11.5px; letter-spacing:.24em; gap:10px; padding-left:.24em; }
  .sig__line{ width:26px; }
  .wa-float{ width:54px; height:54px; right:14px; bottom:14px; }
  .wa-float svg{ width:28px; height:28px; }
}