/* Luxe Immobilier : feuille commune des six pages. Dossier de création v3 (30/09/2026). */


:root{
  --canvas:#14284A;
  --panel:#1D3559;
  --text-primary:#F4EEE3;
  --text-secondary:#BFB8AA;
  --accent:#E7A1AE;
  --accent-hover:#EFB7C2;
  --accent-muted:#6E4250;
  --line:#8C97AB;
  --sable:#E9DFCD;
  --sable-hover:#F1E8D8;
  --sable-panel:#DFD2BC;
  --ink:#14284A;
  --ink-secondary:#4B5567;
  --rose-fonce:#8E3F52;

  --ease-porte:cubic-bezier(.77,0,.18,1);
  --ease-glisse:cubic-bezier(.16,1,.3,1);

  --serif:'Instrument Serif','Times New Roman',serif;
  --sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;

  --bandeau:36px;
  --barre:76px;
  --haut:calc(var(--bandeau) + var(--barre));
  --marge:clamp(20px,5vw,72px);
  --marge-d:var(--marge);
  --gout:24px;
  --max:1440px;
  --fond:var(--canvas);
  --tshadow:0 1px 2px rgba(8,18,36,.9),0 3px 12px rgba(8,18,36,.7),0 10px 40px rgba(8,18,36,.72);
  --p-trait:var(--line);
  --p-axe:var(--accent);
  --p-texte:var(--line);
}
@media (max-width:900px){:root{--barre:60px;--marge-d:max(var(--marge),58px)}}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--canvas);overflow-x:hidden;overflow-x:clip;overflow-anchor:none;scroll-padding-top:calc(var(--haut) + 16px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;overflow-x:hidden;overflow-x:clip;isolation:isolate;background:var(--canvas);color:var(--text-primary);font:400 1.0625rem/1.7 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img,svg,video,picture{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:400}
ul,ol{margin:0;padding:0}
::selection{background:var(--accent);color:var(--canvas)}
:focus{outline:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.s-sable :focus-visible,.feuille :focus-visible{outline-color:var(--rose-fonce)}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
main{display:block;outline:none}

/* ---------- Lien d'évitement ---------- */
.evitement{position:fixed;left:var(--marge);top:calc(var(--bandeau) + 10px);z-index:1100;padding:12px 18px;background:var(--sable);color:var(--ink);font:500 .9375rem/1.2 var(--sans);text-decoration:none;transform:translateY(-220%);transition:transform 450ms var(--ease-glisse)}
.evitement:focus-visible{transform:none;outline-color:var(--rose-fonce)}

/* ---------- Typographie ---------- */
.titre-page{margin-bottom:clamp(1rem,.6rem + 1vw,1.7rem);font:400 clamp(3.25rem,2rem + 5.2vw,8rem)/.92 var(--serif);letter-spacing:-.015em}
.titre-2{margin-bottom:clamp(1rem,.7rem + .9vw,1.6rem);font:400 clamp(2.25rem,1.4rem + 3vw,4.5rem)/1 var(--serif);letter-spacing:-.01em;text-wrap:balance}
.titre-3{font:400 clamp(1.6rem,1.2rem + 1.2vw,2.25rem)/1.08 var(--serif)}
.titre-page--long{font-size:clamp(2.75rem,1.5rem + 3.4vw,5.6rem);line-height:.98}
.titre-page em,.titre-2 em,.titre-3 em,.phrase-titre em{font-style:italic}
.chapeau{font:300 clamp(1.125rem,1rem + .4vw,1.375rem)/1.55 var(--sans);max-width:38ch;text-wrap:pretty}
.texte{max-width:62ch;text-wrap:pretty}
.texte p:last-child{margin-bottom:0}
.releve{font-family:var(--sans);font-weight:500;font-size:.875rem;line-height:1.5;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.etiquette{display:block;font:500 .75rem/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;font-variant-numeric:tabular-nums;color:var(--accent);margin:0 0 1.1rem}
.caps{font:500 .75rem/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.s-sable .etiquette{color:var(--rose-fonce)}
.secondaire{color:var(--text-secondary)}
.s-sable .secondaire{color:var(--ink-secondary)}

/* ---------- Grille de magazine ---------- */
.grille{max-width:var(--max);margin:0 auto;padding-left:var(--marge);padding-right:var(--marge-d);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gout)}
.col-4{grid-column:span 4}.col-5{grid-column:span 5}.col-6{grid-column:span 6}.col-7{grid-column:span 7}.col-12{grid-column:1 / -1}
.cadrage{max-width:var(--max);margin:0 auto;padding-left:var(--marge);padding-right:var(--marge-d)}
@media (max-width:900px){.grille{grid-template-columns:minmax(0,1fr)}.grille>*{grid-column:1 / -1!important}}

.sec{position:relative;padding:clamp(96px,11vw,168px) 0}
.s-sable{--fond:var(--sable);--p-trait:rgba(20,40,74,.7);--p-axe:var(--rose-fonce);--p-texte:var(--ink-secondary);background-color:var(--sable);color:var(--ink);background-image:linear-gradient(rgba(20,40,74,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(20,40,74,.04) 1px,transparent 1px);background-size:64px 64px}
.s-bleu{--fond:var(--canvas)}

/* ---------- Le calque (fond d'ambiance fixe) ---------- */
.calque{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.calque-trame{position:absolute;inset:-64px;background-image:linear-gradient(rgba(244,238,227,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(244,238,227,.035) 1px,transparent 1px);background-size:64px 64px;animation:li-derive 120s linear infinite}
.calque-lueur{position:absolute;top:-25vh;left:0;width:80vw;height:150vh;background:radial-gradient(closest-side,rgba(30,58,102,.35),rgba(30,58,102,.2) 55%,rgba(30,58,102,0));animation:li-traverse 90s ease-in-out infinite alternate;animation-delay:-38s}
.calque-poussiere{position:absolute;inset:0;width:100%;height:100%}
@keyframes li-derive{to{transform:translate(64px,64px)}}
@keyframes li-traverse{from{transform:translateX(-55vw)}to{transform:translateX(85vw)}}

/* ---------- Transition de page : deux panneaux, comme une porte ---------- */
.porte-transition{position:fixed;inset:0;z-index:900;pointer-events:none;display:flex}
.porte-transition span{flex:1;background:var(--canvas);transform:scaleX(0);transition:transform 380ms var(--ease-porte)}
.porte-transition span:first-child{transform-origin:0 50%;border-right:1px solid var(--accent-muted)}
.porte-transition span:last-child{transform-origin:100% 50%}
html.js .porte-transition span{animation:li-porte-ouvre 700ms var(--ease-porte) both}
html.sortie .porte-transition span{animation:none;transform:scaleX(1)}
@keyframes li-porte-ouvre{from{transform:scaleX(1)}to{transform:scaleX(0)}}

/* ---------- La barre de menu ---------- */
.barre{position:fixed;top:var(--bandeau);left:0;right:0;height:var(--barre);z-index:800;color:var(--text-primary)}
.barre::before{content:"";position:absolute;left:0;right:0;top:calc(-1 * var(--bandeau));height:calc(var(--bandeau) + 160px);pointer-events:none;background:linear-gradient(to bottom,rgba(8,18,36,.62),rgba(8,18,36,.34) 45%,rgba(8,18,36,0));opacity:.68;transition:opacity 500ms var(--ease-glisse)}
html.p6 .barre::before{opacity:1}
.barre::after{content:"";position:absolute;inset:0;background:rgba(29,53,89,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--accent-muted);opacity:0;transition:opacity 500ms var(--ease-glisse)}
.barre.pleine::after{opacity:1}
html .barre.pleine::before{opacity:0}
.barre:not(.pleine){text-shadow:0 1px 10px rgba(8,18,36,.55)}
.barre-in{position:relative;z-index:1;height:100%;max-width:var(--max);margin:0 auto;padding:0 var(--marge);display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:inline-flex;align-items:center;gap:12px;min-height:44px;text-decoration:none;color:var(--text-primary)}
.logo-marque{width:30px;height:34px;flex:none;color:var(--accent);overflow:visible}
.logo-marque path{fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:square;stroke-linejoin:miter}
html.js .logo-marque path{stroke-dasharray:1 1;stroke-dashoffset:1;animation:li-trace-logo 900ms var(--ease-porte) forwards}
html.js .logo-marque path:nth-child(2){animation-delay:150ms}
html.js .logo-marque path:nth-child(3){animation-delay:300ms}
@keyframes li-trace-logo{to{stroke-dashoffset:0}}
.logo-nom{font:400 28px/1 var(--serif);letter-spacing:-.005em;white-space:nowrap}
.nav ul{display:flex;gap:clamp(22px,2.6vw,44px);list-style:none}
.nav a{position:relative;display:inline-flex;align-items:center;min-height:44px;color:var(--text-primary);text-decoration:none;font:400 1rem/1 var(--sans)}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform 450ms var(--ease-glisse)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.menu-bouton{display:none;align-items:center;gap:10px;min-height:44px;min-width:44px;padding:0 2px;background:none;border:0;color:var(--text-primary);font:500 1rem/1 var(--sans);letter-spacing:.02em}
.menu-bouton i{position:relative;display:block;width:22px;height:9px;border-top:1px solid var(--accent);border-bottom:1px solid var(--accent);transition:transform 450ms var(--ease-glisse)}
.menu-bouton[aria-expanded="true"] i{transform:scaleX(.55)}
@media (max-width:900px){
  .nav{display:none}
  .menu-bouton{display:inline-flex}
  .logo-nom{font-size:24px}
  .logo-marque{width:26px;height:30px}
}

/* ---------- La feuille du menu (téléphone) : un store couleur sable ---------- */
.feuille-cadre{position:fixed;top:calc(var(--bandeau) + var(--barre));left:0;right:0;height:78vh;height:78svh;z-index:790;overflow:hidden;pointer-events:none;visibility:hidden;transition:visibility 0s linear 900ms}
.feuille-cadre.ouvert{pointer-events:auto;visibility:visible;transition:none}
.feuille{height:100%;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:22px;padding:18px var(--marge-d) 28px var(--marge);background-color:var(--sable);color:var(--ink);background-image:linear-gradient(rgba(20,40,74,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(20,40,74,.04) 1px,transparent 1px);background-size:64px 64px;border-bottom:1px solid var(--rose-fonce);transform:translateY(-101%);transition:transform 900ms var(--ease-porte)}
.feuille-cadre.ouvert .feuille{transform:none}
.feuille ul{list-style:none}
.feuille li a{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:.5em;padding:10px 0 12px;border-bottom:1px solid rgba(20,40,74,.16);color:var(--ink);text-decoration:none;font:400 2.4rem/1.05 var(--serif)}
.feuille li a .releve{color:var(--ink-secondary)}
.feuille li a[aria-current="page"]{color:var(--rose-fonce)}
.feuille-tel{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:none}
.feuille .dalle{width:100%}

/* ---------- L'onglet « Visite privée », au bord droit ---------- */
.onglet{position:fixed;right:0;top:50%;z-index:780;width:54px;height:176px;margin-top:-88px;padding:0 10px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(20,40,74,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--accent);border-right:0;color:var(--accent);font:500 .75rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;transform:translateX(10px);transition:transform 450ms var(--ease-glisse),opacity 450ms var(--ease-glisse)}
.onglet span{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap}
.onglet svg{width:12px;height:12px;opacity:0;transform:translateY(6px);transition:opacity 450ms var(--ease-glisse),transform 450ms var(--ease-glisse)}
.onglet svg path{fill:none;stroke:currentColor;stroke-width:1.5}
.onglet:hover,.onglet:focus-visible{transform:translateX(0)}
.onglet:hover svg,.onglet:focus-visible svg{opacity:1;transform:none}
.onglet.sur-sable{background:rgba(233,223,205,.95);color:var(--rose-fonce);border-color:var(--rose-fonce)}
.onglet.sur-sable:focus-visible{outline-color:var(--rose-fonce)}
.onglet.cache{opacity:0;pointer-events:none;transform:translateX(100%)}
@media (max-width:900px){.onglet{height:136px;margin-top:-68px;top:64%}}
@media print{.onglet,.barre,.calque,.porte-transition{display:none}}

/* ---------- Le bouton principal : une dalle pleine ---------- */
.dalle{--d-fond:var(--sable);--d-texte:var(--ink);--d-fleche:var(--rose-fonce);--d-survol:var(--sable-hover);--d-focus:var(--accent);position:relative;display:inline-flex;align-items:center;justify-content:space-between;gap:24px;height:56px;min-width:min(352px,100%);padding:0 24px;background:var(--d-fond);color:var(--d-texte);font:500 1rem/1.2 var(--sans);text-align:left;text-decoration:none;text-shadow:none;border:0;border-radius:0;transition:transform 180ms var(--ease-glisse);-webkit-tap-highlight-color:transparent}
.dalle::before{content:"";position:absolute;inset:0;background:var(--d-survol);opacity:0;transition:opacity 450ms var(--ease-glisse)}
.dalle>*{position:relative}
.dalle:hover::before{opacity:1}
.dalle:active{transform:translateY(1px)}
.dalle:focus-visible{outline:2px solid var(--d-focus);outline-offset:4px}
.fleche{position:relative;flex:none;width:64px;height:12px;transition:transform 160ms var(--ease-glisse)}
.fleche i{position:absolute;left:0;top:5.25px;width:28px;height:1.5px;background:var(--d-fleche);transform-origin:0 50%;transition:transform 450ms var(--ease-glisse)}
.fleche svg{position:absolute;left:21px;top:0;width:8px;height:12px;color:var(--d-fleche);overflow:visible;transition:transform 450ms var(--ease-glisse)}
.fleche svg path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:square}
.dalle:hover .fleche i{transform:scaleX(2.143)}
.dalle:hover .fleche svg{transform:translateX(32px)}
.dalle:active .fleche{transform:translateX(-2px)}
.s-sable .dalle,.feuille .dalle,.dalle--nuit{--d-fond:var(--ink);--d-texte:var(--sable);--d-fleche:var(--accent);--d-survol:var(--panel);--d-focus:var(--rose-fonce)}
.s-bleu .dalle--jour{--d-fond:var(--sable);--d-texte:var(--ink);--d-fleche:var(--rose-fonce);--d-survol:var(--sable-hover);--d-focus:var(--accent)}
@media (max-width:640px){.dalle{width:100%;height:52px;padding:0 20px;gap:14px;line-height:1.15}.dalle .fleche{width:36px}}

/* ---------- Liens secondaires : un filet qui s'étire ---------- */
.lien{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:none;font:500 1rem/1.3 var(--sans)}
button.lien{padding:0;background:none;border:0;cursor:pointer;text-align:left}
.col-4>.lien,.col-5>.lien,.mandat-txt>.lien{margin-top:1.2rem}
.lien span{position:relative;display:inline-block}
.lien span::after,.lien span::before{content:"";position:absolute;top:calc(100% + 6px);height:1px;background:var(--accent)}
.lien span::after{left:0;width:100%}
.lien span::before{left:100%;width:22px;transform:scaleX(0);transform-origin:0 50%;transition:transform 450ms var(--ease-glisse)}
.lien:hover span::before,.lien:focus-visible span::before{transform:scaleX(1)}
.s-sable .lien span::after,.s-sable .lien span::before,.feuille .lien span::after{background:var(--rose-fonce)}
.texte a,.lien-texte{color:inherit;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1px;text-underline-offset:5px}
.s-sable .texte a,.s-sable .lien-texte{text-decoration-color:var(--rose-fonce)}

/* ---------- Panneaux latéraux : « Visite privée » (droite) et tiroirs des biens (gauche) ---------- */
dialog.panneau,dialog.tiroir{position:fixed;top:0;bottom:0;margin:0;width:min(480px,100vw);max-width:100vw;height:100%;max-height:none;padding:0;border:0;background:var(--panel);color:var(--text-primary);overflow:hidden;transition:transform 900ms var(--ease-porte)}
dialog.panneau{left:auto;right:0;border-left:1px solid var(--accent-muted);transform:translateX(101%)}
dialog.tiroir{right:auto;left:0;width:min(560px,100vw);border-right:1px solid var(--accent-muted);transform:translateX(-101%)}
dialog.panneau[open],dialog.tiroir[open]{display:flex;flex-direction:column}
dialog.panneau.ouvert,dialog.tiroir.ouvert{transform:none}
dialog.panneau::backdrop,dialog.tiroir::backdrop{background:rgba(8,18,36,.62);opacity:0;transition:opacity 900ms var(--ease-porte)}
dialog.panneau.ouvert::backdrop,dialog.tiroir.ouvert::backdrop{opacity:1}
.panneau-tete{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:28px 32px 8px}
.panneau-tete h2{font:400 clamp(1.9rem,1.5rem + 1.2vw,2.5rem)/1.02 var(--serif)}
.fermer{flex:none;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 2px;background:none;border:0;color:var(--text-primary);font:500 .9375rem/1 var(--sans)}
.fermer i{position:relative;width:16px;height:16px}
.fermer i::before,.fermer i::after{content:"";position:absolute;left:-2px;right:-2px;top:7.5px;height:1px;background:var(--accent);transform:rotate(45deg)}
.fermer i::after{transform:rotate(-45deg)}
.panneau-corps{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:8px 32px 40px}
.onglets-p{display:flex;gap:28px;margin:4px 0 26px;border-bottom:1px solid rgba(140,151,171,.35)}
.onglets-p button{position:relative;min-height:48px;padding:0;background:none;border:0;color:var(--text-secondary);font:500 .9375rem/1.2 var(--sans)}
.onglets-p button[aria-selected="true"]{color:var(--text-primary)}
.onglets-p button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform 450ms var(--ease-glisse)}
.onglets-p button[aria-selected="true"]::after{transform:scaleX(1)}
@media (max-width:520px){.panneau-tete{padding:22px 20px 6px}.panneau-corps{padding:6px 20px 36px}}

/* ---------- Formulaires ---------- */
.champs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:18px}
.champ{grid-column:1 / -1;display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.champ--demi{grid-column:span 1}
@media (max-width:520px){.champ--demi{grid-column:1 / -1}}
.champ label{font:500 .875rem/1.3 var(--sans)}
.champ label small{font-weight:400;font-size:.8125rem;color:var(--text-secondary)}
.champ input,.champ select,.champ textarea{width:100%;min-height:48px;padding:11px 14px;border:1px solid var(--line);border-radius:0;background:rgba(20,40,74,.55);color:var(--text-primary);font:400 1rem/1.4 var(--sans);-webkit-appearance:none;appearance:none}
.champ textarea{min-height:110px;resize:vertical}
.champ select{padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23E7A1AE' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:12px 8px}
.champ select option{background:var(--panel);color:var(--text-primary)}
.champ input::placeholder,.champ textarea::placeholder{color:var(--text-secondary);opacity:1}
.champ input:focus-visible,.champ select:focus-visible,.champ textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.champ [aria-invalid="true"]{border-color:var(--accent)}
.champ input[type="date"]{color-scheme:dark}
.erreur{margin:0;color:var(--accent-hover);font:500 .875rem/1.4 var(--sans)}
.s-sable .champ input,.s-sable .champ select,.s-sable .champ textarea{background-color:var(--sable-hover);color:var(--ink);border-color:var(--ink-secondary)}
.s-sable .champ input::placeholder,.s-sable .champ textarea::placeholder{color:var(--ink-secondary)}
.s-sable .champ select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%238E3F52' stroke-width='1.4'/%3E%3C/svg%3E")}
.s-sable .champ select option{background:var(--sable-hover);color:var(--ink)}
.s-sable .champ label small{color:var(--ink-secondary)}
.s-sable .champ input:focus-visible,.s-sable .champ select:focus-visible,.s-sable .champ textarea:focus-visible{outline-color:var(--rose-fonce)}
.s-sable .champ [aria-invalid="true"]{border-color:var(--rose-fonce)}
.s-sable .champ input[type="date"]{color-scheme:light}
.s-sable .erreur{color:var(--rose-fonce)}
.form-pied{margin-top:8px}
.succes{padding:22px 0 8px 22px;border-left:1px solid var(--accent);font:400 1.0625rem/1.65 var(--sans)}
.succes strong{display:block;margin-bottom:.4em;font:400 1.75rem/1.1 var(--serif)}
.s-sable .succes{border-left-color:var(--rose-fonce)}
.estimer-lien p{margin-bottom:24px;color:var(--text-secondary)}

/* ---------- La vidéo d'ouverture ---------- */
.ouverture{position:relative}
.scene{display:none}
/* Hauteurs stables : la scène collante prend la grande hauteur d'écran (100lvh, repli 100vh), et --hv (mesurée dans le <head>,
   remesurée seulement au changement de largeur ou d'orientation sur téléphone) fige l'ouverture : la barre d'adresse ne la fait plus varier. */
html.scrub .ouverture{height:1000vh;height:1000lvh}
html.scrub.hv .ouverture{height:calc(var(--hv) * 10)}
html.scrub .scene{display:block;position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden}
html.scrub.hv .scene{height:var(--hv)}
html.scrub .ouverture-fixe{display:none}
.scene-media{position:absolute;inset:0}
.affiche,.affiche-fin{position:absolute;inset:0;background:var(--canvas) center/cover no-repeat}
.affiche-fin{opacity:0}
.film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:0;transition:opacity 800ms var(--ease-glisse);will-change:transform;transform:translateZ(0)}
.scene.video-ready .film{opacity:1}
.scene.video-failed .film{display:none}
.scene-media::after{content:"";position:absolute;left:0;right:0;top:0;height:min(40vh,320px);pointer-events:none;background:linear-gradient(to bottom,rgba(8,18,36,.84),rgba(8,18,36,.58) 42%,rgba(8,18,36,0));opacity:0;transition:opacity 700ms var(--ease-glisse)}
@media (orientation:portrait){html.p6 .scene-media::after{opacity:1}}
.voile-global{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 92% at 50% 46%,rgba(8,18,36,0) 42%,rgba(8,18,36,.46) 100%)}
.anneau{position:absolute;left:50%;bottom:30px;width:40px;height:40px;margin-left:-20px;color:var(--accent);transform:rotate(-90deg);opacity:.92;transition:opacity 600ms var(--ease-glisse)}
.anneau circle{transition:stroke-dashoffset 150ms linear}
.anneau .fond-anneau{stroke:rgba(244,238,227,.18)}
.scene.video-ready .anneau,.scene.video-failed .anneau{opacity:0}
.chevron{position:absolute;left:50%;bottom:28px;width:28px;height:28px;margin-left:-14px;color:var(--accent)}
@media (max-height:560px){.anneau,.chevron{display:none}}

/* Les phrases : deux colonnes sur ordinateur, haut et bas sur téléphone, l'axe central reste libre */
.phrases{position:absolute;left:0;right:0;top:0;height:100vh;height:100svh;pointer-events:none}
.phrase{position:absolute;opacity:0;--k:0;isolation:isolate;text-shadow:var(--tshadow)}
.phrase::before{content:"";position:absolute;inset:-42% -26% -40% -36%;z-index:-1;pointer-events:none;opacity:calc(.25 + .75 * var(--k));background:radial-gradient(closest-side,rgba(8,18,36,var(--va,.66)) 0%,rgba(8,18,36,var(--va,.66)) 52%,rgba(8,18,36,calc(var(--va,.66) * .62)) 76%,rgba(8,18,36,0) 100%)}
/* Pastille pour les petits textes posés sur la vidéo */
.phrase .etiquette:not([data-ligne]),.phrase .indice{width:fit-content;margin-left:-.6em;padding:.42em .6em .38em;background:rgba(8,18,36,.62)}
.phrase [data-ligne].etiquette,.phrase [data-ligne].releve{margin-left:-.6em}
.phrase .etiquette .seuil-t,.phrase .releve .seuil-t{padding:.36em .6em .32em;background:rgba(8,18,36,.62)}
.phrase--g,.phrase--d{top:max(calc(var(--haut) + 28px),22vh);width:32vw}
.phrase--g{left:6vw}
.phrase--d{left:62vw}
.phrase--6{top:calc(var(--haut) + 4.5vh);pointer-events:auto}
.phrase-titre{margin:0 0 .42em;font:400 clamp(2.4rem,1.25rem + 2.9vw,4.4rem)/.98 var(--serif);letter-spacing:-.012em;max-width:13.5ch;text-wrap:balance}
.phrase--6 .phrase-titre{max-width:12ch}
.phrase--6::before{inset:-40% -56% -36% -36%;background:radial-gradient(closest-side,rgba(8,18,36,var(--va,.7)) 0%,rgba(8,18,36,calc(var(--va,.7) * .9)) 48%,rgba(8,18,36,calc(var(--va,.7) * .45)) 76%,rgba(8,18,36,0) 100%)}
.nw{white-space:nowrap}
.phrase-sous{margin:0;font:400 clamp(1.05rem,.95rem + .35vw,1.25rem)/1.55 var(--sans);max-width:34ch;text-wrap:pretty}
.phrase .etiquette{margin-bottom:.9rem;color:var(--accent)}
.phrase .releve{font-size:clamp(.875rem,.8rem + .2vw,1rem);max-width:36ch}
.phrase-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:1.6rem}
.phrase .dalle,.phrase .lien{text-shadow:none}
.phrase .lien{text-shadow:0 1px 8px rgba(8,18,36,.8);padding:0 .75em;margin-left:-.75em;background:rgba(8,18,36,.62)}
.indice{margin:2.2rem 0 0;font:500 .75rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text-primary)}
.indice i{display:inline-block;width:1px;height:26px;margin:0 0 0 .6em;vertical-align:-9px;background:var(--accent);transform-origin:50% 0;animation:li-indice 2.8s var(--ease-glisse) infinite;animation-delay:-.6s}
@keyframes li-indice{0%{transform:scaleY(0)}45%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
.phrase .desk{display:inline}.phrase .tel{display:none}
.phrase .lien.desk{display:inline-flex}
@media (orientation:portrait){
  .phrase--g,.phrase--d{left:var(--marge);right:var(--marge-d);width:auto}
  .phrase--ph{top:calc(var(--haut) + 18px)}
  .phrase--pb{top:auto;bottom:max(10vh,78px)}
  .phrase::before{inset:-24% calc(-1 * var(--marge-d)) -28% calc(-1 * var(--marge));background:linear-gradient(to bottom,rgba(8,18,36,0) 0%,rgba(8,18,36,min(.9,calc(var(--va,.66) + .08))) 24%,rgba(8,18,36,min(.9,calc(var(--va,.66) + .08))) 76%,rgba(8,18,36,0) 100%)}
  .phrase-titre{font-size:clamp(2.2rem,8.6vw,3.1rem);max-width:14ch}
  .phrase--6{top:calc(var(--haut) + 16px)}
  .phrase--6 .phrase-titre{font-size:clamp(2.4rem,9vw,2.6rem);max-width:11ch;margin-bottom:.3em}
  .phrase--6 .phrase-cta{margin-top:1rem}
  .phrase--6 .dalle{width:100%;height:52px}
  .phrase-sous{font-size:1.0625rem;max-width:30ch}
  .phrase .desk{display:none}.phrase .tel{display:inline}
  .phrase .lien.desk{display:none}
}
@media (orientation:portrait) and (min-width:700px){.phrase--g,.phrase--d{right:auto;width:min(560px,70vw)}.phrase--6 .dalle{width:auto}}
@media (orientation:landscape) and (max-height:620px){.phrase--6 .phrase-sous{display:none}.phrase-titre{font-size:clamp(2rem,4.2vh + 1rem,3.2rem)}}

/* Entrées des phrases, toutes pilotées par --k (réversibles), sauf la phrase 1 au chargement */
.split-vis .w{display:inline-block;white-space:nowrap}
.split-vis .it{font-style:italic}
.split-vis .c{display:inline-block}
/* 1. Battants : le titre se coupe en son milieu, les deux moitiés s'écartent */
[data-fx="battants"] .moitie{display:inline-block;--kc:clamp(0,var(--k) * 1.15,1);opacity:var(--kc);transform:translateX(calc((1 - var(--kc)) * var(--jx)))}
[data-fx="battants"] .moitie--a{--jx:1.1em}
[data-fx="battants"] .moitie--b{--jx:-1.1em}
/* 2. Perspective : les mots grandissent depuis le point de fuite */
[data-fx="perspective"] .w{--kc:clamp(0,(var(--k) - var(--th,0)) * 2.4,1);opacity:var(--kc);transform-origin:0 60%;transform:translateX(calc((1 - var(--kc)) * -3.4rem)) scale(calc(.68 + .32 * var(--kc)))}
/* 3. Tracé : un mur de plan se dessine sous le titre, puis les lettres montent depuis lui */
.mur{display:block;width:min(100%,11.5em);height:8.5px;margin:-.1em 0 1.1rem;border-top:1.25px solid var(--accent);border-bottom:1.25px solid var(--accent);transform-origin:0 50%;transform:scaleX(clamp(0,var(--k) * 2.2,1));box-shadow:0 1px 6px rgba(8,18,36,.5)}
[data-fx="trace"] .c{--kc:clamp(0,(var(--k) - var(--th,0)) * 3,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc)) * .55em))}
/* 4. Travelling : les mots glissent de la droite, profondeurs décalées */
[data-fx="travelling"] .w{--kc:clamp(0,(var(--k) - var(--th,0)) * 2.6,1);opacity:var(--kc);transform:translateX(calc((1 - var(--kc)) * var(--jx,80px)))}
/* 5. Seuil : chaque ligne se découvre derrière un montant de porte (900 ms, --ease-porte) */
.seuil-u{position:relative;display:block;width:fit-content;max-width:100%;overflow:hidden;padding:0 .35em .14em 0;margin-bottom:-.14em}
.seuil-u.libre{overflow:visible}
.seuil-m{position:relative;display:block;transform:translateX(-101%);transition:transform 900ms var(--ease-porte) calc(var(--i,0) * 120ms)}
.seuil-t{display:block;transform:translateX(101%);transition:transform 900ms var(--ease-porte) calc(var(--i,0) * 120ms)}
.seuil-mt{position:absolute;top:0;bottom:0;right:-10px;width:10px;background:var(--fond);border-left:1px solid var(--accent);opacity:1;transition:opacity 420ms var(--ease-glisse) calc(760ms + var(--i,0) * 120ms),transform 420ms var(--ease-glisse) calc(760ms + var(--i,0) * 120ms)}
.s-sable .seuil-mt{border-left-color:var(--rose-fonce)}
.phrase .seuil-mt{background:var(--canvas)}
.ouvre .seuil-m,.ouvre .seuil-t,.in .seuil-m,.in .seuil-t{transform:none}
.ouvre .seuil-mt,.in .seuil-mt{opacity:0;transform:translateX(12px)}
/* 6. Arrivée : les mots montent un à un, puis le sous-titre, puis le bouton */
[data-fx="arrivee"] .w{--kc:clamp(0,(var(--k) - var(--th,0)) * 2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc)) * .5em))}
[data-fx="arrivee"] .phrase-sous{--ks:clamp(0,(var(--k) - .6) * 4,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks)) * 12px))}
[data-fx="arrivee"] .phrase-cta{--kb:clamp(0,(var(--k) - .76) * 4.4,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb)) * 12px))}
.phrase:not([data-fx="arrivee"]) .phrase-sous,.phrase .indice{--ks:clamp(0,(var(--k) - .42) * 2.6,1);opacity:var(--ks)}
.phrase:not([data-fx="seuil"]) .etiquette{opacity:clamp(0,var(--k) * 3,1)}

/* L'image fixe (mouvement réduit, économie de données, téléphone à l'horizontale) */
.ouverture-fixe{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-start;padding:calc(var(--haut) + 9vh) var(--marge-d) 12vh var(--marge);isolation:isolate;background:var(--canvas) 50% 50%/cover no-repeat;background-image:url('/demos/immobilier/assets/video/hero-16x9-ending.jpg');background-image:image-set(url('/demos/immobilier/assets/video/hero-16x9-ending.webp') type('image/webp'),url('/demos/immobilier/assets/video/hero-16x9-ending.jpg') type('image/jpeg'))}
@media (orientation:portrait){.ouverture-fixe{padding-top:calc(var(--haut) + 22px);background-image:url('/demos/immobilier/assets/video/hero-9x16-ending.jpg');background-image:image-set(url('/demos/immobilier/assets/video/hero-9x16-ending.webp') type('image/webp'),url('/demos/immobilier/assets/video/hero-9x16-ending.jpg') type('image/jpeg'))}}
.ouverture-fixe::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(8,18,36,.55),rgba(8,18,36,0) 22%),radial-gradient(ellipse 62% 70% at 22% 34%,rgba(8,18,36,.74),rgba(8,18,36,.44) 55%,rgba(8,18,36,0) 100%)}
.fixe-in{max-width:560px;text-shadow:var(--tshadow)}
.fixe-titre{margin:0 0 .5em;font:400 clamp(2.6rem,1.4rem + 3.4vw,4.8rem)/.96 var(--serif);letter-spacing:-.012em;max-width:12ch;text-wrap:balance}
.fixe-in .dalle{text-shadow:none}
.fixe-in .dalle{margin-top:1.6rem}
@media (orientation:portrait){.ouverture-fixe::before{background:linear-gradient(to bottom,rgba(8,18,36,.72),rgba(8,18,36,.5) 42%,rgba(8,18,36,0) 64%)}}

/* ---------- Entrées nommées ---------- */
/* Lever de ligne : chaque ligne de titre monte dans son masque */
html.js .lever:not(.decoupe){opacity:0}
.lever .ligne{display:block;overflow:hidden;padding:0 .08em .16em 0;margin:0 0 -.16em}
.lever .ligne-in{display:block;transform:translateY(110%);transition:transform 900ms var(--ease-glisse) calc(var(--i,0) * 110ms)}
.lever .it{font-style:italic}
.in .lever .ligne-in,.lever.in .ligne-in{transform:none}
/* Perspective : chapeaux et cartes */
html.js .persp{opacity:0;transform:translateY(24px) scale(.94);transition:opacity 900ms var(--ease-glisse) calc(var(--i,0) * 110ms),transform 900ms var(--ease-glisse) calc(var(--i,0) * 110ms)}
html.js .in .persp,html.js .persp.in{opacity:1;transform:none}
.fait .persp,.fait .lever .ligne-in,.fait .seuil-m,.fait .seuil-t{transition-delay:0ms!important}
/* Rideau : deux panneaux couleur fond s'écartent du centre, l'image passe de 1,08 à 1 */
.cadre{position:relative;margin:0}
.cadre-vue{position:relative;overflow:hidden;background:var(--panel)}
.s-sable .cadre-vue{background:var(--sable-panel)}
.cadre-vue picture,.cadre-vue img{width:100%;height:100%}
.cadre-vue img{object-fit:cover}
.cadre-zoom{position:absolute;inset:0;transform:scale(1.08);transition:transform 1400ms var(--ease-porte)}
.cadre-zoom img{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;transform:translateY(var(--py,0%))}
.rideau{position:absolute;inset:0;z-index:2;display:flex;pointer-events:none}
.rideau i{flex:1;background:var(--fond);transition:transform 1400ms var(--ease-porte)}
html:not(.js) .rideau{display:none}
.in .cadre-zoom,.cadre.in .cadre-zoom{transform:none}
.in .rideau i:first-child,.cadre.in .rideau i:first-child{transform:translateX(-101%)}
.in .rideau i:last-child,.cadre.in .rideau i:last-child{transform:translateX(101%)}
.legende{margin:12px 0 0;color:var(--text-secondary)}
.s-sable .legende{color:var(--ink-secondary)}
/* Embrasure : un encadrement de porte se trace, deux battants s'ouvrent sur le chiffre */
.embrasure{position:relative;padding:56px 28px 30px;min-height:280px;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate}
.embrasure>.emb{position:absolute;background:var(--line)}
.s-sable .embrasure>.emb{background:rgba(20,40,74,.7)}
.emb-g,.emb-d{top:0;bottom:0;width:1px;transform:scaleY(0);transform-origin:50% 100%;transition:transform 420ms var(--ease-porte)}
.emb-g{left:0}.emb-d{right:0}
.emb-l{top:0;left:0;right:0;height:1px;transform:scaleX(0);transform-origin:0 50%;transition:transform 300ms var(--ease-porte) 420ms}
.embrasure>.bat{position:absolute;top:1px;bottom:0;width:calc(50% - 1px);z-index:2;background:var(--fond);transition:transform 900ms var(--ease-porte) 720ms}
.bat-g{left:1px;transform-origin:0 50%}
.bat-d{right:1px;transform-origin:100% 50%}
.emb-n{display:block;font:400 clamp(4rem,2.4rem + 5vw,7.5rem)/.9 var(--serif);letter-spacing:-.02em;font-variant-numeric:tabular-nums;transform:translateY(12px);transition:transform 900ms var(--ease-porte) 720ms}
.emb-n small{font-size:.42em;letter-spacing:0;margin-left:.12em}
.emb-t{margin:14px 0 0;max-width:24ch;color:var(--text-secondary)}
@media (min-width:901px){.chiffres-liste .emb-t{min-height:calc(3 * 1.7em)}}
.in .emb-g,.in .emb-d{transform:none}
.in .emb-l{transform:none}
.in .bat{transform:scaleX(0)}
.in .emb-n{transform:none}
html:not(.js) .bat{display:none}

/* ---------- Les plans (élément signature) ---------- */
.plan{width:100%;height:auto;overflow:visible}
.plan .m,.plan .m2,.plan .o,.plan .b,.plan .a,.plan .c,.plan .x,.plan .h,.plan .ce{fill:none;stroke:var(--p-trait);stroke-linecap:butt;stroke-linejoin:miter}
.plan .m{stroke-width:1.25}
.plan .m2{stroke-width:.75}
.plan .o{stroke-width:.6}
.plan .b{stroke-width:.75}
.plan .a{stroke-width:.75;stroke-dasharray:2.5 3}
.plan .c{stroke-width:.75}
.plan .h{stroke-width:.6;opacity:.8}
.plan .x{stroke:var(--p-axe);stroke-width:1.5}
.plan .ce{stroke:var(--p-axe);stroke-width:1}
.plan .cf{fill:var(--p-axe);stroke:none;opacity:.08}
.plan .pt{fill:var(--p-axe)}
.plan .pt2{fill:var(--fond);stroke:var(--p-axe);stroke-width:1.25}
.plan .mer{fill:none;stroke:var(--p-trait);stroke-width:.6;stroke-dasharray:1 5;stroke-linecap:round}
.plan text{fill:var(--p-texte);font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.plan text.tx-axe{fill:var(--p-axe)}
.plan text.tx-g{font-size:13px}
.plan .voile-h{fill:url(#li-hachure)}
.plan .vif{transform-box:view-box}
.vu .plan .vif.pret{animation:li-battant 8s ease-in-out infinite alternate;animation-delay:-3s}
.vu .plan .cf.pret{animation:li-respire 6s ease-in-out infinite alternate;animation-delay:-2s}
@keyframes li-battant{from{transform:rotate(0deg)}to{transform:rotate(-2deg)}}
@keyframes li-respire{from{opacity:.06}to{opacity:.1}}
@media (max-width:700px){.plan text{font-size:17px}.plan text.tx-g{font-size:19px}.plan.plan--mini text{font-size:11px}}

/* ---------- Accueil : Le principe (sable, plan épinglé sur 160 vh) ---------- */
.principe{padding:0}
.principe-scene{padding-top:clamp(96px,11vw,150px);padding-bottom:clamp(96px,11vw,150px);align-items:center}
.principe-texte{grid-column:1 / span 5}
.principe-plan{grid-column:6 / -1;padding-left:clamp(0px,2vw,32px)}
.reperes{list-style:none;margin:2rem 0 0}
.reperes li{display:flex;align-items:baseline;gap:14px;padding:.55rem 0}
.reperes li::before{content:"";flex:none;width:18px;height:6px;border-top:1px solid var(--rose-fonce);border-bottom:1px solid var(--rose-fonce);transform:translateY(-3px)}
@media (min-width:901px) and (min-height:760px){
  html.js:not(.rm) .principe{height:260vh}
  html.js:not(.rm) .principe-scene{position:sticky;top:0;min-height:100vh;padding-top:calc(var(--haut) + 24px);padding-bottom:40px}
}

/* ---------- Accueil : Six adresses (la coulisse) ---------- */
.adresses{padding:clamp(96px,10vw,150px) 0 clamp(72px,8vw,120px)}
.adresses-tete{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 48px;margin-bottom:clamp(28px,3.5vh,48px)}
.adresses-tete .chapeau{margin:0}
.piste-cadre{position:relative}
.piste{display:flex;gap:clamp(20px,2.2vw,36px);padding:0 var(--marge-d) 6px var(--marge);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--marge);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.piste::-webkit-scrollbar{display:none}
.carte{flex:none;width:min(78vw,380px);scroll-snap-align:start;display:flex;flex-direction:column}
.carte .cadre-vue{aspect-ratio:3 / 2}
.carte-corps{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;padding-top:16px}
.carte h3{font:400 clamp(1.6rem,1.3rem + .8vw,2rem)/1.05 var(--serif)}
.carte .lieu{margin:2px 0 0;color:var(--text-secondary)}
.carte .donnees{grid-column:1 / -1;margin:6px 0 0}
.carte .plan--mini{width:96px;grid-row:1 / span 2;grid-column:2}
.carte .lien{grid-column:1 / -1;margin-top:4px;justify-self:start}
.carte-porte{flex:1;display:flex;flex-direction:column;justify-content:flex-start;text-decoration:none;color:var(--text-primary)}
.carte-porte-t{font:400 clamp(1.6rem,1.3rem + .8vw,2rem)/1.05 var(--serif)}
.carte-porte:hover svg .battant-p,.carte-porte:focus-visible svg .battant-p{transform:scaleX(.7)}
.carte-porte:focus-visible{outline-offset:6px}
.carte-porte .porte-dessin{position:relative;aspect-ratio:3 / 2;display:flex;align-items:center;justify-content:center}
.carte-porte svg{position:absolute;top:4%;left:50%;height:92%;width:auto;transform:translateX(-50%)}
.carte-porte svg path{fill:none;stroke:var(--line);stroke-width:1.25}
.carte-porte svg .battant-p{stroke:var(--accent);transform-box:fill-box;transform-origin:0 50%;transition:transform 900ms var(--ease-porte)}
.carte-porte svg .lumiere{fill:var(--accent);stroke:none;opacity:.08;transition:opacity 900ms var(--ease-porte)}
.carte-porte:hover svg .lumiere,.carte-porte:focus-visible svg .lumiere{opacity:.16}
.carte-porte .carte-corps{grid-template-columns:1fr}
.rail-bas{display:flex;align-items:center;gap:24px;margin-top:clamp(20px,3vh,36px)}
.portes-rail{display:flex;gap:12px}
.porte-i{position:relative;width:14px;height:22px;border:1px solid var(--line);border-bottom:0}
.porte-i::before{content:"";position:absolute;inset:-1px -1px 0;border:1px solid var(--accent);border-bottom:0;opacity:0;transition:opacity 450ms var(--ease-glisse)}
.porte-i::after{content:"";position:absolute;inset:-6px -6px -2px;background:radial-gradient(closest-side,rgba(231,161,174,.35),rgba(231,161,174,0));opacity:0}
.porte-i.allume::before{opacity:1}
.vu .porte-i.dernier::after{animation:li-lueur 4.5s ease-in-out infinite alternate;animation-delay:-1.4s}
@keyframes li-lueur{from{opacity:.15}to{opacity:.9}}
.compteur{color:var(--text-secondary)}
@media (min-width:901px) and (min-height:640px) and (pointer:fine){
  html.js:not(.rm) .adresses{height:300vh;padding:0}
  html.js:not(.rm) .adresses-scene{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding-top:calc(var(--haut) + 8px)}
  html.js:not(.rm) .adresses-scene>.cadrage{width:100%}
  html.js:not(.rm) .piste{overflow:visible;scroll-snap-type:none;will-change:transform}
  html.js:not(.rm) .carte{--ih:clamp(170px,calc(100vh - 480px),330px);width:calc(var(--ih) * 1.5)}
}

/* ---------- Écran partagé 40 / 60 ---------- */
.partage{align-items:center}
.partage-img{grid-column:1 / span 7}
.partage-txt{grid-column:9 / span 4}
.partage--inverse .partage-img{grid-column:6 / span 7;grid-row:1}
.partage--inverse .partage-txt{grid-column:1 / span 5;grid-row:1}
.partage-img .cadre-vue{aspect-ratio:16 / 10}
.partage-txt .titre-2{margin-bottom:1.5rem}
.partage-txt .dalle{margin-top:1.6rem}
@media (max-width:900px){.partage-img{margin-bottom:40px}.partage--inverse .partage-img{grid-row:auto}}

/* ---------- Accueil : Vendre (sable, trois engagements) ---------- */
.engagements{grid-column:7 / -1;list-style:none;display:grid;gap:clamp(28px,3vw,44px)}
.engagements li{display:grid;grid-template-columns:minmax(150px,11rem) minmax(0,1fr);gap:24px;align-items:baseline}
.eng-n{font:400 clamp(2.6rem,1.8rem + 2.2vw,4rem)/1 var(--serif);letter-spacing:-.01em}
.eng-n .releve{font-size:.875rem;margin-left:.3em;letter-spacing:.12em}
.eng-t{margin:0;font-size:1.0625rem}
@media (max-width:900px){.engagements{margin-top:48px}.engagements li{grid-template-columns:1fr;gap:6px}}

/* ---------- Accueil : Les chiffres ---------- */
.chiffres-liste{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px);margin-top:clamp(40px,5vw,72px)}
@media (max-width:900px){.chiffres-liste{grid-template-columns:1fr}.embrasure{min-height:220px}}

/* ---------- Avis ---------- */
.avis-tete{grid-column:1 / span 4}
.avis-corps{grid-column:6 / -1}
.avis-scene{position:relative;min-height:15rem}
@media (max-width:900px){.avis-corps{margin-top:36px}}
.avis-item{margin:0}
.avis-item blockquote{margin:0;font:400 clamp(1.75rem,1.2rem + 2vw,3.1rem)/1.16 var(--serif);font-style:italic;max-width:26ch;text-wrap:balance}
.avis-item figcaption{margin-top:1.4rem;color:var(--text-secondary)}
.avis-rideau{position:absolute;inset:-12px -16px;z-index:2;display:flex;pointer-events:none}
.avis-rideau i{flex:1;background:var(--fond);transform:scaleX(0);transition:transform 450ms var(--ease-porte)}
.avis-rideau i:first-child{transform-origin:0 50%}
.avis-rideau i:last-child{transform-origin:100% 50%}
.avis-rideau.ferme i{transform:scaleX(1.01)}
.avis-rideau.rouvre i{transition-duration:900ms}
.avis-nav{display:flex;gap:4px;margin-top:28px}
.avis-nav button{width:44px;height:44px;padding:0;background:none;border:0;display:inline-flex;align-items:center;justify-content:center}
.avis-nav button i{width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);transition:background-color 300ms}
.avis-nav button[aria-current="true"] i{background:var(--accent)}

/* ---------- Accueil : le carnet (liste) ---------- */
.carnet-liste{grid-column:6 / -1;list-style:none}
.carnet-liste li{border-top:1px solid rgba(20,40,74,.18)}
.carnet-liste li:last-child{border-bottom:1px solid rgba(20,40,74,.18)}
.carnet-liste a{display:grid;grid-template-columns:10rem minmax(0,1fr);gap:24px;align-items:baseline;padding:22px 0;text-decoration:none;color:var(--ink)}
.carnet-liste .t{font:400 clamp(1.5rem,1.2rem + .9vw,2.1rem)/1.12 var(--serif);transition:transform 450ms var(--ease-glisse)}
.carnet-liste a:hover .t{transform:translateX(8px)}
@media (max-width:900px){.carnet-liste{margin-top:40px}.carnet-liste a{grid-template-columns:1fr;gap:6px}}

/* ---------- Grande image finale ---------- */
.finale{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-start;padding:calc(var(--haut) + 9vh) 0 12vh;isolation:isolate;overflow:hidden}
.finale>.grille,.entete-image>.grille{flex:1;width:100%;min-width:0}
.finale>.cadre{position:absolute;inset:0;z-index:-2}
.finale>.cadre .cadre-vue{position:absolute;inset:0}
.finale::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 60% 74% at 22% 34%,rgba(8,18,36,.72),rgba(8,18,36,.42) 55%,rgba(8,18,36,0) 100%),linear-gradient(to bottom,rgba(8,18,36,.5),rgba(8,18,36,0) 24%)}
.finale-in{grid-column:1 / span 5;text-shadow:var(--tshadow)}
.finale-in .dalle{margin-top:1.8rem}
.finale-in .appel{margin-top:1.2rem;display:flex;align-items:center;gap:12px}
.finale-in .appel a{color:var(--text-primary);text-underline-offset:5px;text-decoration-color:var(--accent)}
.lanterne{width:14px;height:22px;flex:none;color:var(--accent);overflow:visible}
.lanterne path{fill:none;stroke:currentColor;stroke-width:1}
.lanterne circle{fill:var(--accent);opacity:.25}
.vu .lanterne circle{animation:li-lanterne 5s ease-in-out infinite alternate;animation-delay:-2s}
@keyframes li-lanterne{from{opacity:.18}to{opacity:.85}}
@media (orientation:portrait) and (max-width:900px){.finale{padding-top:calc(var(--haut) + 24px)}.finale::before{background:linear-gradient(to bottom,rgba(8,18,36,.74),rgba(8,18,36,.5) 45%,rgba(8,18,36,0) 68%)}}

/* ---------- Pièce suivante : une porte ---------- */
.suivante{padding:clamp(72px,8vw,120px) 0}
.porte-lien{grid-column:1 / -1;display:flex;align-items:flex-end;gap:clamp(20px,3vw,48px);text-decoration:none;color:inherit}
.porte-lien>svg{flex:none;width:clamp(64px,7vw,96px);height:auto;overflow:visible}
.porte-lien>svg path{fill:none;stroke:var(--p-trait);stroke-width:1.25}
.porte-lien>svg .battant-p{stroke:var(--p-axe);transform-box:fill-box;transform-origin:0 100%;transition:transform 900ms var(--ease-porte)}
.porte-lien:hover>svg .battant-p,.porte-lien:focus-visible>svg .battant-p{transform:skewY(-8deg) scaleX(.62)}
.porte-txt{display:block;min-width:0}
.porte-txt .etiquette{margin-bottom:.5rem}
.porte-lien .nom{display:block;font:400 clamp(2.4rem,1.6rem + 3vw,5rem)/1.05 var(--serif)}
.porte-lien .nom .fleche{--d-fleche:var(--accent);display:inline-block;vertical-align:middle;margin-left:.3em}
.s-sable .porte-lien .nom .fleche{--d-fleche:var(--rose-fonce)}
.porte-lien:hover .fleche i{transform:scaleX(2.143)}
.porte-lien:hover .fleche svg{transform:translateX(32px)}

/* ---------- En-têtes des pages internes ---------- */
.entete{padding:calc(var(--haut) + clamp(56px,8vw,112px)) 0 clamp(72px,8vw,120px)}
.entete-txt{grid-column:1 / span 6;align-self:end}
.entete-txt .chapeau{margin-top:0}
.entete-plan{grid-column:8 / -1;align-self:center}
@media (max-width:900px){.entete-plan{margin-top:48px}}
.entete-image{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;padding:calc(var(--haut) + 40px) 0 clamp(56px,9vh,110px);isolation:isolate;overflow:hidden}
.entete-image>.cadre{position:absolute;inset:0;z-index:-2}
.entete-image>.cadre .cadre-vue{position:absolute;inset:0}
.entete-image::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to top,rgba(8,18,36,.8),rgba(8,18,36,.36) 42%,rgba(8,18,36,0) 70%),radial-gradient(ellipse 70% 60% at 18% 88%,rgba(8,18,36,.6),rgba(8,18,36,0) 70%),linear-gradient(to bottom,rgba(8,18,36,.46),rgba(8,18,36,0) 22%)}
.entete-image .entete-txt{grid-column:1 / span 8;text-shadow:var(--tshadow)}
.entete-image .donnees{margin-top:1.1rem}
.entete-image .dalle{margin-top:1.8rem}
.entete-image .mandat{margin-top:1.1rem;color:var(--text-primary);opacity:.92}
.fiche-sous{margin-top:.6rem;font:300 clamp(1.25rem,1rem + .8vw,1.75rem)/1.3 var(--sans)}

/* ---------- Nos biens : filtre et grille ---------- */
.filtre{position:sticky;top:calc(var(--bandeau) + var(--barre));z-index:60;background:rgba(29,53,89,.95);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--accent-muted)}
.filtre-in{display:flex;align-items:flex-end;gap:16px 24px;padding-top:12px;padding-bottom:12px}
.filtre .champ{margin:0;flex:1 1 0;min-width:0;gap:4px}
.filtre .champ label{font:500 .75rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary)}
.filtre .champ select{min-height:44px;padding-top:8px;padding-bottom:8px}
.filtre .compteur{flex:none;min-width:5.5rem;padding-bottom:11px;text-align:right;color:var(--text-primary)}
@media (max-width:640px){.filtre-in{gap:10px}.filtre .champ select{padding-left:10px;padding-right:28px;background-position:right 10px center;font-size:.9375rem}.filtre .compteur{display:none}}
.grille-biens{row-gap:clamp(64px,8vw,112px);padding-top:clamp(56px,7vw,96px)}
.bien{position:relative;grid-column:span 7}
.bien.etroite{grid-column:span 5}
.bien.decale{margin-top:clamp(0px,9vw,140px)}
.biens-liste{position:relative}
.bien .cadre-vue{aspect-ratio:3 / 2}
.bien-corps{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 24px;padding-top:18px}
.bien h2{font:400 clamp(1.9rem,1.4rem + 1.4vw,2.75rem)/1.02 var(--serif)}
.bien .prix{font-size:1rem}
.bien .lieu,.bien .donnees{flex-basis:100%;margin:0}
.bien .lieu{color:var(--text-secondary)}
.bien .donnees{margin-top:4px}
.bien .lien{margin-top:6px}
.bien-voile{position:absolute;inset:-8px;z-index:3;display:flex;pointer-events:none}
.bien-voile i{flex:1;background:var(--canvas);transform:scaleX(0);transition:transform 480ms var(--ease-porte)}
.bien-voile i:first-child{transform-origin:0 50%}
.bien-voile i:last-child{transform-origin:100% 50%}
.bien.ferme .bien-voile i{transform:scaleX(1.02)}
.bien.rouvre .bien-voile i{transition-duration:900ms}
.vide{grid-column:1 / -1;max-width:44ch;font:400 clamp(1.6rem,1.3rem + 1vw,2.25rem)/1.2 var(--serif)}
.vide button{padding:0;background:none;border:0;color:var(--text-primary);font:inherit;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1px;text-underline-offset:6px;cursor:pointer}
@media (max-width:900px){.bien.decale{margin-top:0}}
.tiroir .panneau-tete{justify-content:flex-end;padding-bottom:0}
.tiroir .panneau-corps .etiquette{margin-bottom:.7rem}
.tiroir .panneau-corps p.releve{margin-bottom:.35em}
.tiroir .prix-t{font-size:1.0625rem}
.tiroir .panneau-corps .plan--mini{width:min(260px,70%);margin:6px 0 22px}
.tiroir h2{font:400 clamp(2rem,1.6rem + 1.2vw,2.75rem)/1.02 var(--serif)}
.tiroir .phrase-bien{margin:1.2rem 0;font:400 1.5rem/1.25 var(--serif);font-style:italic}
.tiroir .mentions{margin:1.4rem 0 1.6rem;padding-top:1rem;border-top:1px solid rgba(140,151,171,.35);font-size:.9375rem;color:var(--text-secondary)}
.tiroir .mentions p{margin-bottom:.6em}
.tiroir .dalle{width:100%}

/* ---------- Plans voilés (ventes confidentielles, discrétion) ---------- */
.voile-plan{position:relative}
.niveaux{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,48px);margin-top:clamp(40px,5vw,72px)}
.niveaux .plan{margin-bottom:22px}
.niveaux h3{margin-bottom:.6rem}
@media (max-width:900px){.niveaux{grid-template-columns:1fr}}

/* ---------- Fiche : le moment interactif ---------- */
.traverser{padding:calc(var(--haut) + clamp(16px,2.5vw,36px)) 0 clamp(80px,9vw,140px)}
.traverser .titre-2{margin-bottom:.2em}
.trav-plan{grid-column:1 / span 5;align-self:center}
.trav-vue{grid-column:7 / -1;align-self:center}
.trav-consigne{margin:0 0 1rem;color:var(--text-secondary)}
.trav-svg-cadre{position:relative;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.trav-svg-cadre .plan{max-height:min(calc(100vh - var(--haut) - 300px),620px);min-height:320px;width:auto;margin:0 auto}
.pv{cursor:grab;touch-action:none}
.pv:active{cursor:grabbing}
.pv .pv-disque{fill:var(--accent);stroke:var(--canvas);stroke-width:2}
.pv .pv-zone{fill:transparent}
.pv:focus{outline:none}
.pv:focus-visible .pv-anneau{opacity:1}
.pv .pv-anneau{fill:none;stroke:var(--accent);stroke-width:1.5;opacity:0}
.hors-axe{cursor:pointer}
.hors-axe .ha-point{fill:var(--canvas);stroke:var(--accent);stroke-width:1.25}
.hors-axe .ha-onde{fill:none;stroke:var(--accent);stroke-width:1;transform-box:fill-box;transform-origin:50% 50%;opacity:0}
.vu .hors-axe .ha-onde{animation:li-onde 3.2s var(--ease-glisse) infinite}
.hors-axe:nth-of-type(2) .ha-onde{animation-delay:-1.6s}
@keyframes li-onde{0%{transform:scale(.6);opacity:.8}100%{transform:scale(2.4);opacity:0}}
.hors-axe:focus{outline:none}
.hors-axe:focus-visible .ha-point{stroke-width:3}
.pv-cone-f{fill:var(--accent);opacity:.1}
.pv-cone-e{fill:none;stroke:var(--accent);stroke-width:1}
.etapes{display:flex;flex-wrap:wrap;gap:4px 18px;list-style:none;margin-top:18px}
.etapes button{min-height:44px;padding:0;background:none;border:0;color:var(--text-secondary);font:500 .875rem/1.2 var(--sans);font-variant-numeric:tabular-nums;border-bottom:1px solid transparent}
.etapes button[aria-pressed="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.vue-cadre{position:relative;aspect-ratio:16 / 10;overflow:hidden;background:var(--panel)}
.vue-couche{position:absolute;inset:0;opacity:0}
.vue-couche.actif{opacity:1;z-index:1}
.vue-couche picture{display:block;width:100%;height:100%}
.vue-couche img{width:100%;height:100%;object-fit:cover;transform:scale(1);transition:transform 1400ms var(--ease-porte)}
.vue-couche.zoom img{transform:scale(1.08);transition:none}
.vue-rideau{position:absolute;inset:0;z-index:3;display:flex;pointer-events:none}
.vue-rideau i{flex:1;background:var(--canvas);transition:transform 900ms var(--ease-porte)}
.vue-rideau i:first-child{transform:translateX(-101%)}
.vue-rideau i:last-child{transform:translateX(101%)}
.vue-rideau.ferme i{transform:none;transition-duration:450ms}
.vue-infos{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px;min-height:4.5rem;padding-top:16px}
.vue-infos .nom{font:400 clamp(1.8rem,1.4rem + 1.2vw,2.5rem)/1 var(--serif)}
.trav-fin{margin-top:22px;opacity:0;transform:translateY(12px);transition:opacity 900ms var(--ease-glisse),transform 900ms var(--ease-glisse)}
.trav-fin.visible{opacity:1;transform:none}
.trav-fin p{font:400 clamp(1.4rem,1.2rem + .7vw,1.9rem)/1.2 var(--serif);max-width:30ch}
@media (max-width:900px){
  .trav-plan{margin-bottom:28px}
  .trav-svg-cadre .plan{width:100%;max-height:none;min-height:0}
}

/* ---------- Fiche : tableaux et listes ---------- */
.cartouche{border:1px solid rgba(20,40,74,.7);background:rgba(241,232,216,.5)}
.cartouche table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.cartouche caption{text-align:left;text-transform:uppercase;padding:16px 20px;border-bottom:1px solid rgba(20,40,74,.7);font:500 .75rem/1.3 var(--sans);letter-spacing:.12em;color:var(--rose-fonce)}
.cartouche th,.cartouche td{padding:11px 20px;text-align:left;font:500 .9375rem/1.4 var(--sans);border-bottom:1px solid rgba(20,40,74,.16);vertical-align:baseline}
.cartouche td.n{text-align:right;white-space:nowrap}
.cartouche th[scope="col"]{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-secondary)}
.cartouche th[scope="col"].n{text-align:right}
.cartouche tfoot td,.cartouche tfoot th{border-top:1px solid rgba(20,40,74,.7);border-bottom:0;font-weight:500}
.surfaces{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gout);margin-top:clamp(36px,4vw,56px)}
.surfaces-note{grid-column:1 / -1;margin-top:28px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gout)}
@media (max-width:900px){.surfaces,.surfaces-note{grid-template-columns:1fr}}
.reponses{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(32px,5vw,80px);margin:clamp(36px,4vw,56px) 0 0}
.reponses div{display:grid;grid-template-columns:12rem minmax(0,1fr);gap:18px;padding:18px 0;border-top:1px solid rgba(140,151,171,.3);align-items:baseline}
.reponses dt{font:500 .75rem/1.5 var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--text-secondary)}
.reponses dd{margin:0}
@media (max-width:900px){.reponses{grid-template-columns:1fr}.reponses div{grid-template-columns:1fr;gap:4px}}
.matieres-img .cadre-vue{aspect-ratio:4 / 5;max-height:86vh;max-width:min(100%,calc(86vh * .8));margin-left:auto}
.galerie{row-gap:clamp(48px,6vw,88px)}
.galerie .cadre{grid-column:span 7}
.galerie .cadre:nth-child(1),.galerie .cadre:nth-child(6){grid-column:1 / -1}
.galerie .cadre:nth-child(3),.galerie .cadre:nth-child(4){grid-column:span 5}
.galerie .cadre:nth-child(3){margin-top:clamp(0px,10vw,160px)}
.galerie .cadre-vue{aspect-ratio:3 / 2}
.galerie .cadre:nth-child(1) .cadre-vue,.galerie .cadre:nth-child(6) .cadre-vue{aspect-ratio:16 / 8}
@media (max-width:900px){.galerie .cadre:nth-child(3){margin-top:0}.galerie .cadre:nth-child(1) .cadre-vue,.galerie .cadre:nth-child(6) .cadre-vue{aspect-ratio:3 / 2}}
.distances{list-style:none;margin-top:1.6rem}
.distances li{display:flex;align-items:baseline;gap:14px;padding:.7rem 0;border-top:1px solid rgba(20,40,74,.18)}
.distances li:last-child{border-bottom:1px solid rgba(20,40,74,.18)}
.distances b{font:400 1.9rem/1 var(--serif);min-width:4.2ch}
.infos-bloc{grid-column:1 / span 8;padding:clamp(24px,3vw,40px);border:1px solid rgba(140,151,171,.45)}
.infos-bloc p{max-width:70ch}
.infos-bloc .releve{display:block;margin-top:.4em}

/* ---------- Vendre ---------- */
.vendre-img .cadre-vue{aspect-ratio:4 / 5;max-height:80vh;max-width:min(100%,calc(80vh * .8));margin-left:auto}
.entendu{grid-column:1 / -1;margin-top:clamp(36px,4vw,56px)}
.entendu table{width:100%;border-collapse:collapse}
.entendu th[scope="col"]{padding:0 24px 16px 0;text-transform:uppercase;text-align:left;font:500 .75rem/1.3 var(--sans);letter-spacing:.12em;color:var(--rose-fonce);border-bottom:1px solid rgba(20,40,74,.7)}
.entendu td{padding:24px 24px 24px 0;border-bottom:1px solid rgba(20,40,74,.18);vertical-align:top;width:50%}
.entendu td:first-child{font:400 clamp(1.35rem,1.1rem + .7vw,1.8rem)/1.2 var(--serif);font-style:italic}
@media (max-width:700px){.entendu thead{display:none}.entendu tr{display:block;padding:18px 0;border-bottom:1px solid rgba(20,40,74,.18)}.entendu td{display:block;width:auto;padding:0;border:0}.entendu td:first-child{margin-bottom:10px}.entendu td::before{content:attr(data-titre);display:block;text-transform:uppercase;margin-bottom:6px;font:500 .75rem/1.3 var(--sans);font-style:normal;letter-spacing:.12em;color:var(--rose-fonce)}}
.methode .grille{align-items:start}
.methode-plan{grid-column:1 / span 5;position:sticky;top:calc(var(--haut) + 40px);padding-top:8px}
.methode-plan .plan{max-height:calc(100vh - var(--haut) - 120px);width:auto;margin:0}
.methode-etapes{grid-column:7 / -1;list-style:none}
.methode-tete{margin-bottom:clamp(36px,4vw,64px)}
.methode-etapes li{min-height:62vh;display:flex;flex-direction:column;justify-content:center;padding:32px 0 32px clamp(20px,2.4vw,36px);border-left:1px solid rgba(140,151,171,.3);transition:border-color 600ms var(--ease-glisse)}
.methode-etapes li.actif{border-left-color:var(--accent)}
.methode-etapes li:first-child{min-height:48vh;justify-content:flex-start}
.methode-etapes .num{display:block;margin-bottom:.6rem;color:var(--text-secondary);letter-spacing:.12em;transition:color 600ms var(--ease-glisse)}
.methode-etapes li.actif .num{color:var(--accent)}
.methode-etapes h3{font:400 clamp(2rem,1.5rem + 1.6vw,3rem)/1.02 var(--serif);margin-bottom:1rem}
.methode-etapes p{max-width:44ch}
@media (max-width:900px){
  .methode-plan{position:sticky;top:calc(var(--haut) - 1px);z-index:5;margin:0 calc(-1 * var(--marge-d)) 0 calc(-1 * var(--marge));padding:10px var(--marge-d) 12px var(--marge);background:rgba(20,40,74,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--accent-muted)}
  .methode-plan .plan{width:100%;max-height:none}
  .methode-etapes li,.methode-etapes li:first-child{min-height:0;padding:40px 0 16px 20px}
}
.mandat-ligne{margin-top:1.4rem}
.estimation .grille{align-items:start}
.estimation-intro{grid-column:1 / span 4}
.estimation-form{grid-column:6 / -1}
@media (max-width:900px){.estimation-form{margin-top:36px}}
.temoin blockquote{margin:0;font:400 clamp(1.9rem,1.3rem + 2.2vw,3.4rem)/1.14 var(--serif);font-style:italic;max-width:24ch;text-wrap:balance}
.temoin figcaption{margin-top:1.4rem;color:var(--text-secondary)}

/* ---------- L'agence ---------- */
.equipe-liste{grid-column:1 / -1;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gout);margin-top:clamp(36px,4vw,56px)}
@media (max-width:1000px){.equipe-liste{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.equipe-liste{grid-template-columns:1fr}}
.cartouche-p{position:relative;display:grid;grid-template-rows:auto auto;min-height:196px}
.cartouche-p .t{position:absolute;background:var(--line)}
.cartouche-p .t-h,.cartouche-p .t-b,.cartouche-p .t-m{left:0;right:0;height:1px;transform:scaleX(0);transform-origin:0 50%;transition:transform 700ms var(--ease-porte) calc(var(--i,0) * 110ms)}
.cartouche-p .t-h{top:0}.cartouche-p .t-b{bottom:0}.cartouche-p .t-m{top:84px;transition-delay:calc(var(--i,0) * 110ms + 360ms)}
.cartouche-p .t-g,.cartouche-p .t-d{top:0;bottom:0;width:1px;transform:scaleY(0);transform-origin:50% 0;transition:transform 700ms var(--ease-porte) calc(var(--i,0) * 110ms + 180ms)}
.cartouche-p .t-g{left:0}.cartouche-p .t-d{right:0}
.in .cartouche-p .t{transform:none}
.cartouche-p .nom{padding:22px 22px 0;height:84px;font:400 clamp(1.7rem,1.4rem + .8vw,2.1rem)/1.05 var(--serif)}
.cartouche-p .role{padding:16px 22px 22px;margin:0}
.cartouche-p .role span{display:block}
.cartouche-p .role .fn{color:var(--accent);text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;margin-bottom:.35rem}
.cartouche-p .coin{position:absolute;right:14px;top:14px;color:var(--text-secondary);font-size:.75rem;letter-spacing:.12em}
.bareme-tab{grid-column:6 / -1}
.bareme-tab .cartouche td.n{font-size:1.5rem;font-family:var(--serif);font-weight:400}
@media (max-width:900px){.bareme-tab{margin-top:36px}}
.trouver-liste{list-style:none;margin:1.4rem 0 0}
.trouver-liste li{padding:.75rem 0;border-top:1px solid rgba(140,151,171,.3)}
.trouver-liste a{color:inherit;text-underline-offset:5px;text-decoration-color:var(--accent)}

/* ---------- Le carnet ---------- */
.article-tete{align-items:start}
.article-tete .article-txt{grid-column:1 / span 5}
.article-tete .cadre{grid-column:7 / -1}
.article-tete .cadre-vue{aspect-ratio:3 / 2}
.s-sable .article-tete .article-txt{grid-column:8 / -1;grid-row:1}
.s-sable .article-tete .cadre{grid-column:1 / span 6;grid-row:1}
.article-tete h2{margin:.2rem 0 1.2rem}
.lire{margin-top:1.4rem;display:inline-flex;align-items:center;gap:12px;min-height:44px;padding:0;background:none;border:0;font:500 1rem/1.3 var(--sans);color:inherit}
.lire span{position:relative}
.lire span::after{content:"";position:absolute;left:0;right:0;top:calc(100% + 6px);height:1px;background:var(--accent);transform-origin:0 50%;transition:transform 450ms var(--ease-glisse)}
.s-sable .lire span::after{background:var(--rose-fonce)}
.lire svg{width:12px;height:8px;transition:transform 450ms var(--ease-glisse)}
.lire svg path{fill:none;stroke:currentColor;stroke-width:1.4}
.lire[aria-expanded="true"] svg{transform:rotate(180deg)}
.article-corps{grid-column:3 / span 7;margin-top:clamp(40px,5vw,64px)}
.article-corps h3{margin:2.2rem 0 .8rem}
.article-corps .dalle{margin-top:2rem}
.article-corps .fin-article{margin-top:2rem;font:400 1.5rem/1.3 var(--serif);font-style:italic}
@media (max-width:900px){.s-sable .article-tete .cadre,.article-tete .cadre{margin-top:32px;grid-row:auto}}

/* ---------- Pied de page ---------- */
.pied{position:relative;overflow:hidden;padding:clamp(80px,8vw,120px) 0 40px;border-top:1px solid var(--accent-muted);isolation:isolate}
.pied-arc{position:absolute;right:var(--marge);bottom:-2px;z-index:-1;width:clamp(200px,20vw,300px);height:auto;opacity:.85}
@media (max-width:1100px){.pied-arc{display:none}}
.pied-haut{grid-column:1 / span 5}
.pied-haut .logo{margin-bottom:14px}
.pied-haut p{color:var(--text-secondary);max-width:32ch}
.pied-nav{grid-column:7 / -1}
.pied-liens{list-style:none;columns:2;column-gap:var(--gout)}
.pied-liens li{break-inside:avoid}
.pied-liens a{display:inline-flex;min-height:44px;align-items:center;color:var(--text-primary);text-decoration:none}
.pied-liens a:hover{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:5px}
.pied-bas{grid-column:1 / -1;margin-top:clamp(48px,5vw,72px);padding-top:24px;border-top:1px solid rgba(140,151,171,.28);color:var(--text-secondary);font-size:.9375rem}
.pied-bas p{margin-bottom:.5em}
.pied-bas a{color:var(--text-primary);text-underline-offset:4px;text-decoration-color:var(--accent)}
.pied details{margin-top:14px}
.pied summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;color:var(--text-primary);list-style:none}
.pied summary::-webkit-details-marker{display:none}
.pied summary::after{content:"+";margin-left:.6em;color:var(--accent)}
.pied details[open] summary::after{content:"\2212"}
@media (max-width:900px){.pied-nav{margin-top:36px}}
@media (max-width:420px){.pied-liens{columns:1}}

/* ---------- Blocs propres aux pages ---------- */
.galerie-tete{margin-bottom:clamp(40px,5vw,72px)}
.situation{align-items:center}
.situation-plan{grid-column:7 / -1}
.secteur .grille{align-items:center}
.secteur-txt{grid-column:1 / span 4}
.secteur-plan{grid-column:6 / -1}
.trouver-plan{grid-column:1 / span 6}
.trouver .partage-txt{grid-column:8 / -1}
.trouver .dalle{margin-top:1.8rem}
.confidentielles .voile-plan{padding:clamp(0px,2vw,24px) clamp(0px,3vw,48px) clamp(0px,2vw,24px) 0}
.surfaces-note{align-items:start}
.surface-hab{margin:0;font:400 clamp(1.5rem,1.2rem + .9vw,2.1rem)/1.2 var(--serif);max-width:24ch}
.surface-hab strong{font-weight:400}
.exterieurs .caps{margin:0 0 .6rem;color:var(--rose-fonce)}
.exterieurs ul{list-style:none}
.exterieurs li{padding:.55rem 0;border-top:1px solid rgba(20,40,74,.18)}
.exterieurs li:last-child{border-bottom:1px solid rgba(20,40,74,.18)}
.mandat .grille{align-items:center}
.mandat-emb{grid-column:1 / span 4}
.mandat-txt{grid-column:6 / -1}
.mandat-txt .titre-2{margin-bottom:1.4rem}
.temoin-fig{grid-column:4 / -1;margin:0}
.sommaire{grid-column:8 / -1;align-self:end}
.sommaire ol{list-style:none}
.sommaire li{border-top:1px solid rgba(140,151,171,.3)}
.sommaire li:last-child{border-bottom:1px solid rgba(140,151,171,.3)}
.sommaire a{display:flex;flex-direction:column;gap:2px;padding:14px 0;text-decoration:none;color:var(--text-primary)}
.sommaire .t{font:400 clamp(1.35rem,1.1rem + .6vw,1.65rem)/1.15 var(--serif);transition:transform 450ms var(--ease-glisse)}
.sommaire a:hover .t{transform:translateX(8px)}
.article .article-txt>.releve{margin-bottom:.8rem}
@media (max-width:900px){
  .situation-plan,.secteur-plan,.mandat-txt,.sommaire{margin-top:44px}
  .trouver-plan,.confidentielles .voile-plan{margin-bottom:40px}
}

/* ---------- Mouvement réduit : tout est posé, rien ne bouge ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;transition-delay:0s!important;scroll-behavior:auto!important}
  html.js .lever:not(.decoupe){opacity:1}
  .lever .ligne-in{transform:none!important}
  html.js .persp{opacity:1!important;transform:none!important}
  .cadre-zoom{transform:none!important}
  .cadre-zoom img{transform:none!important}
  .rideau,.bien-voile,.avis-rideau,.vue-rideau{display:none!important}
  .seuil-m,.seuil-t{transform:none!important}
  .seuil-mt{display:none!important}
  .emb-g,.emb-d,.emb-l,.emb-n{transform:none!important}
  .bat{display:none!important}
  .cartouche-p .t{transform:none!important}
  .porte-i::before{opacity:1!important}
  .porte-transition{display:none!important}
  .calque-poussiere{display:none}
  .trav-fin{transition:none}
  .vue-couche img{transform:none!important}
  .logo-marque path{stroke-dasharray:none!important;stroke-dashoffset:0!important}
  .indice i{transform:scaleY(1)!important}
}
