/* Accueil — « Visite d'un étage » : film piloté par le défilement (ajouté le 14 nov. 2026, repris de C:\Web\landing-visite).
   Sans JavaScript ou avec « mouvement réduit », la section reste une suite de blocs texte + image (mode par défaut).
   Avec .anime (posé par visite.js), la scène reste collée à l'écran et le défilement fait avancer le film. */
.visite{position:relative;background:var(--bg);--vm:clamp(16px,5vw,88px)}
.visite .v-scene,.visite .v-rail,.visite .v-defile{display:none}
.visite .v-chaps{max-width:1180px;margin:0 auto;padding:30px 20px}
.visite .v-chap{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(24px,4vw,56px);align-items:center;padding:48px 0;border-bottom:1px solid var(--line)}
.visite .v-chap:last-of-type{border-bottom:0}
.visite .v-chap .v-k{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px;order:2}
.visite .v-chap:not(:has(.v-k)){grid-template-columns:1fr}
.visite .v-txt h2{font-size:clamp(30px,3.6vw,52px);font-weight:300;letter-spacing:-.025em;line-height:1.06;margin:12px 0 16px}
.visite .v-txt p{color:var(--ink2);margin-bottom:12px;max-width:470px}
.visite .tag b{color:var(--ink);margin-right:8px}
.visite .v-chiffres{display:flex;gap:clamp(18px,3vw,40px);margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.visite .v-chiffres dt{font-size:clamp(20px,2.2vw,30px);font-weight:300;letter-spacing:-.02em;line-height:1.1;color:var(--ink)}
.visite .v-chiffres dd{margin:4px 0 0;font-size:12px;letter-spacing:.05em;color:var(--ink2)}
.visite .v-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.visite .v-note{font-size:12px;color:var(--ink2);opacity:.75;margin-top:14px}

/* ── Mode animé ── */
.visite.anime{height:900vh}
.visite.anime .v-scene,.visite.anime .v-chaps{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;max-width:none;padding:0;margin:0}
.visite.anime .v-scene{display:block}
.visite.anime .v-chaps{margin-top:-100vh;margin-top:-100svh;pointer-events:none}
.visite canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.visite .v-voile{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(22,20,21,.94) 0,rgba(22,20,21,.66) 30%,rgba(22,20,21,0) 52%),rgba(22,20,21,calc(var(--fin,0)*.6))}
.visite .v-charge{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.06);transition:opacity .8s}
.visite .v-charge i{display:block;height:100%;background:linear-gradient(90deg,#FFF200,#F58020,#ED1C24,#EC008C,#762B90,#00AEEF,#00A651);transform-origin:0 50%;transform:scaleX(var(--c,0));transition:transform .4s}
.visite.charge .v-charge{opacity:0}
.visite.anime .v-chap{position:absolute;left:var(--vm);bottom:clamp(64px,12vh,130px);width:min(480px,calc(100% - 2*var(--vm)));display:block;padding:0;border:0;opacity:0;transform:translateY(26px);transition:opacity .55s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.visite.anime .v-chap.on{opacity:1;transform:none;pointer-events:auto}
.visite.anime .v-chap .v-k{display:none}
.visite.anime .v-txt h2,.visite.anime .v-txt .v-h{font-size:clamp(34px,4.4vw,66px)}
.visite.anime .v-defile{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--ink);margin-top:26px}
.visite .v-defile span{width:1px;height:36px;background:var(--ink);transform-origin:50% 0;animation:v-defile 1.8s ease-in-out infinite}
@keyframes v-defile{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(0);transform-origin:50% 100%}}
.visite.anime .v-chap.v-fin{left:50%;bottom:clamp(20px,4vh,44px);transform:translate(-50%,26px);text-align:center;width:min(720px,calc(100% - 2*var(--vm)));background:rgba(28,26,27,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:26px;padding:clamp(20px,3vw,34px);box-shadow:0 30px 80px -30px rgba(0,0,0,.7)}
.visite.anime .v-chap.v-fin.on{transform:translate(-50%,0)}
.visite.anime .v-fin h2{font-size:clamp(28px,3.4vw,48px);margin:10px 0 12px}
.visite.anime .v-fin p{margin-left:auto;margin-right:auto}
.visite.anime .v-fin .v-actions{justify-content:center}
.visite.anime .v-rail{display:flex;position:absolute;right:var(--vm);top:50%;transform:translateY(-50%);list-style:none;margin:0;padding:0;flex-direction:column;gap:6px;pointer-events:auto}
.visite .v-rail button{all:unset;cursor:pointer;display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--ink2);padding:6px 0;transition:color .3s}
.visite .v-rail button::after{content:"";width:8px;height:8px;border-radius:50%;box-shadow:inset 0 0 0 1.5px currentColor;transition:all .3s}
.visite .v-rail button.on{color:var(--ink)}
.visite .v-rail button.on::after{background:var(--acc);box-shadow:none;transform:scale(1.3)}
.visite .v-rail button:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.visite .v-etqs{position:absolute;inset:0;pointer-events:none}
.visite .v-etq{position:absolute;left:0;top:0;display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:12.5px;font-weight:700;color:#221F20;opacity:0;transition:opacity .35s;will-change:transform}
.visite .v-etq::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 5px rgba(0,174,239,.25)}
.visite .v-etq span{background:rgba(255,255,255,.94);padding:6px 11px;border-radius:999px;box-shadow:0 6px 18px -8px rgba(0,0,0,.5)}
.visite .v-etq.vue{opacity:1}
.visite .v-etq.gauche{flex-direction:row-reverse}

@media (max-width:760px){
  .visite .v-chap{grid-template-columns:1fr}
  .visite .v-chap .v-k{order:0}
  .visite .v-voile{background:rgba(22,20,21,calc(var(--fin,0)*.45))}
  .visite.anime .v-chap{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .visite.anime .v-txt h2,.visite.anime .v-txt .v-h{font-size:clamp(28px,8.4vw,40px);margin:8px 0 10px}
  .visite.anime .v-txt p{font-size:15px;margin-bottom:6px}
  .visite.anime .v-chiffres{margin-top:12px;padding-top:10px;gap:18px}
  .visite.anime .v-chiffres dt{font-size:19px}
  .visite.anime .v-chap.v-fin{bottom:calc(80px + env(safe-area-inset-bottom,0px))}
  .visite.anime .v-fin h2{font-size:28px}
  .visite.anime .v-rail{top:84px;transform:none;flex-direction:row;gap:10px;right:14px}
  .visite .v-rail button{font-size:0;padding:4px}
  .visite .v-etq{font-size:11px;white-space:normal;align-items:flex-start}
  .visite .v-etq::before{margin-top:4px}
  .visite .v-etq span{padding:5px 9px;max-width:150px;line-height:1.25}
}

/* ── Sections reprises de la landing, sous la visite (14 nov. 2026) : réalisations en photos pro, 4 étapes, offre ── */
.v-sec h2,.v-sec .v-h2{font-size:clamp(30px,3.8vw,52px);font-weight:300;letter-spacing:-.025em;line-height:1.08;margin:10px 0 0}
.v-entete{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:36px}
.v-entete p{color:var(--ink2);max-width:440px}
.v-galerie{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,clamp(220px,22vw,320px));gap:16px}
.v-real{position:relative;display:block;overflow:hidden;border-radius:20px;background:var(--card);color:#fff;isolation:isolate}
.v-real.grande{grid-column:1/3;grid-row:1/3}
.v-real:nth-child(2){grid-column:3/5}
.v-real img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.v-real:hover img{transform:scale(1.045)}
.v-real::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(22,20,21,0) 45%,rgba(22,20,21,.82) 100%);z-index:0}
.v-real::before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#FFF200,#F58020,#ED1C24,#EC008C,#762B90,#00AEEF,#00A651);z-index:2;transform:scaleX(0);transform-origin:0 50%;transition:transform .6s}
.v-real:hover::before{transform:scaleX(1)}
.v-leg{position:absolute;left:22px;right:22px;bottom:20px;z-index:1;display:flex;flex-direction:column;gap:3px}
.v-leg b{font-weight:400;font-size:clamp(20px,1.8vw,26px);letter-spacing:-.01em}
.grande .v-leg b{font-size:clamp(26px,2.6vw,38px)}
.v-leg i{font-style:normal;font-size:13px;letter-spacing:.06em;opacity:.85}
.v-leg em{font-style:normal;font-size:14px;opacity:.85;margin-top:8px;padding-top:10px;border-top:1px solid rgba(255,255,255,.3);max-width:420px}
.v-plus{text-align:center;margin-top:30px}
.v-etapes{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.v-etapes li{padding:28px 24px;border-radius:20px;background:var(--card);border:1px solid var(--line)}
.v-etapes b{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--acc);color:#04131b;font-size:14px;margin-bottom:20px}
.v-etapes h3{font-size:21px;font-weight:600;margin-bottom:8px}
.v-etapes p{color:var(--ink2);font-size:15px}
.v-offre{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,6vw,90px);align-items:start}
.v-offre .muted{margin-top:16px;font-size:18px}
.v-pts{list-style:none;padding:0;margin:24px 0}
.v-pts li{padding:12px 0 12px 30px;border-top:1px solid var(--line);position:relative}
.v-pts li::before{content:"";position:absolute;left:0;top:50%;width:14px;height:2px;background:linear-gradient(90deg,#FFF200,#F58020,#ED1C24,#EC008C,#762B90,#00AEEF,#00A651)}
@media (max-width:960px){
  .v-entete{grid-template-columns:1fr}
  .v-galerie{grid-template-columns:1fr 1fr;grid-template-rows:clamp(260px,48vw,420px) repeat(2,clamp(180px,30vw,260px))}
  .v-real.grande{grid-column:1/3;grid-row:1}
  .v-real:nth-child(2){grid-column:1/3}
  .v-etapes{grid-template-columns:1fr 1fr}
  .v-offre{grid-template-columns:1fr}
}
@media (max-width:640px){
  .v-galerie{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:240px}
  .v-real.grande,.v-real:nth-child(2){grid-column:auto;grid-row:auto}
  .v-real.grande{height:300px}
  .v-etapes{grid-template-columns:1fr}
}
/* Visite en haut de l'accueil : 1er écran = titre du site, boutons, vidéo */
.visite.anime .v-chap.v-ouv{width:min(580px,calc(100% - 2*var(--vm)))}
.visite.anime .v-ouv .v-h{font-size:clamp(36px,4.2vw,62px);font-weight:300;letter-spacing:-.025em;line-height:1.05;margin:12px 0 16px}
.visite .v-ouv .lead{color:var(--ink);opacity:.86;font-size:17px;max-width:520px}
.visite .v-ouv .v-actions{margin-top:20px}
.visite .v-ouv .voir-video{margin-top:16px}
.visite:not(.anime) .v-ouv .v-h{font-size:clamp(34px,4vw,56px);font-weight:300;line-height:1.06;margin:12px 0 16px}
@media (max-width:760px){
  .visite.anime .v-ouv .v-h{font-size:clamp(28px,8vw,38px)}
  .visite.anime .v-ouv .lead{display:none}
  .visite.anime .v-ouv .v-actions,.visite.anime .v-ouv .v-defile{display:none}
}
.visite.anime.v-haut .v-scene{background-color:var(--bg);background-repeat:no-repeat;background-size:cover;background-position:calc(50% + 13vw) 50%}
@media (max-aspect-ratio:999/1000){.visite.anime.v-haut .v-scene{background-size:auto 56%;background-position:50% 64px}}