/* =========================================================================
   SCI MINIATURE — site vente de terrains, Yaoundé
   Direction : monochrome editorial (reference kononenkogroup.com),
   accent bleu #1C87CC. Typo d'affichage auto-hebergee.
   ========================================================================= */

@font-face{font-family:"Grotesk";src:url(fonts/display-500.woff2) format("woff2");
  font-weight:500;font-display:swap}
@font-face{font-family:"Grotesk";src:url(fonts/display-400.woff2) format("woff2");
  font-weight:400;font-display:swap}
@font-face{font-family:"Editorial";src:url(fonts/serif-400.woff2) format("woff2");
  font-weight:400;font-display:swap}

:root{
  --ink:#000; --paper:#fff; --grey:#8a8a8a; --panel:#f4f4f2;
  --accent:#0E90D0; --accent-d:#0B72A6;     /* bleu du logo */
  --green:#00B04C; --green-d:#008A3B;        /* vert du logo — 2e couleur */
  --line:#e3e3e1;
  --d-ink:#fff; --d-grey:#9a9a9a; --d-line:#262626; --d-panel:#0e0e0e;
  --sans:"Grotesk","Helvetica Neue",Arial,sans-serif;
  --serif:"Editorial",Georgia,"Times New Roman",serif;
  --pad:clamp(20px,5vw,80px);
  --gap:clamp(48px,9vw,140px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);
  font-size:15px;line-height:1.55;font-weight:400;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img,picture,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:#fff}

/* ---- rythme & conteneurs -------------------------------------------------- */
.sec{padding:var(--gap) var(--pad);position:relative}
.sec--panel{background:var(--panel)}
.sec--dark{background:var(--ink);color:var(--d-ink)}
.sec--flush{padding:0}
.wrap{max-width:1560px;margin:0 auto}
.col-tight{max-width:940px}
.hr{height:1px;background:var(--line);border:0}
.sec--dark .hr{background:var(--d-line)}

/* ---- typographie -------------------------------------------------------- */
.eyebrow{font-family:var(--serif);font-size:13px;letter-spacing:0;color:var(--grey);
  display:block;margin-bottom:1.4em}
.sec--dark .eyebrow{color:var(--d-grey)}
.display{font-family:var(--sans);font-weight:500;
  font-size:clamp(2.7rem,8.2vw,8.2rem);line-height:.9;letter-spacing:-.04em;
  text-wrap:balance}
.display .ln{display:block;overflow:hidden}
.title{font-weight:500;font-size:clamp(1.7rem,4vw,3.4rem);line-height:1;
  letter-spacing:-.032em;text-wrap:balance}
.sub{font-weight:500;font-size:clamp(1.15rem,1.7vw,1.6rem);line-height:1.15;
  letter-spacing:-.02em}
.lead{font-size:clamp(1.15rem,1.9vw,1.7rem);line-height:1.45;letter-spacing:-.015em;
  font-weight:400}
.muted{color:var(--grey)}
.sec--dark .muted{color:var(--d-grey)}
p+p{margin-top:1em}
strong{font-weight:500}

/* ---- navigation (fixe ; transparente sur le hero, blanche au defilement) - */
.nav{position:fixed;inset:0 0 auto 0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:16px var(--pad);color:#fff;
  border-bottom:1px solid transparent;
  transition:background .3s,border-color .3s,color .3s,padding .3s}
.nav.scrolled{background:var(--paper);color:var(--ink);
  border-bottom-color:var(--line);padding:11px var(--pad)}
.nav a,.nav button{color:inherit}
.nav .brand{display:flex;align-items:center}
.nav .brand img{height:30px;width:auto;
  filter:brightness(0) invert(1);transition:filter .3s}
.nav.scrolled .brand img{filter:none}
.nav ul{display:flex;gap:26px;list-style:none;font-size:14px}
.nav ul a:hover{opacity:.55}
.nav.scrolled ul a:hover{opacity:1;color:var(--accent)}
.nav .burger{display:none;background:none;border:0;font:inherit;cursor:pointer;
  font-size:14px;color:inherit}
/* menu plein ecran ouvert : en-tete forcee en blanc par-dessus le fond noir */
.menu-open .nav,.menu-open .nav.scrolled{background:none;border-color:transparent;color:#fff}
.menu-open .nav .brand img{filter:brightness(0) invert(1)}

/* menu plein ecran (mobile) */
.menu{position:fixed;inset:0;z-index:99;background:var(--ink);color:var(--d-ink);
  display:flex;flex-direction:column;justify-content:center;gap:6px;
  padding:var(--pad);transform:translateY(-100%);transition:transform .5s cubic-bezier(.7,0,.2,1);
  visibility:hidden}
.menu.open{transform:none;visibility:visible}
.menu a{font-family:var(--sans);font-weight:500;font-size:clamp(2rem,7vw,4.5rem);
  letter-spacing:-.03em;line-height:1.05}
.menu a:hover{color:var(--accent)}
.menu .m-meta{margin-top:40px;font-size:14px;color:var(--d-grey);display:grid;gap:4px}

/* ---- boutons & liens -------------------------------------------------- */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);
  font-weight:500;font-size:14px;letter-spacing:-.01em;cursor:pointer;border:0;
  padding:15px 26px;background:var(--ink);color:var(--paper);border-radius:0;
  transition:background .25s,color .25s}
.btn:hover{background:var(--accent)}
.sec--dark .btn{background:var(--paper);color:var(--ink)}
.sec--dark .btn:hover{background:var(--accent);color:#fff}
.btn--line{background:none;color:inherit;border:1px solid currentColor;padding:14px 25px}
.btn--line:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.sec--dark .btn--line:hover{background:var(--paper);color:var(--ink)}
.btn--accent{background:var(--accent);color:#fff}
.btn--accent:hover{background:var(--accent-d)}
.arrow::after{content:"\2192";display:inline-block}
.link{color:var(--green-d);border-bottom:1px solid currentColor;padding-bottom:1px}
.link:hover{color:var(--green)}
.sec--dark .link{color:#3ED37E}
.tlink{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;
  border-bottom:1px solid var(--ink);padding-bottom:3px}
.sec--dark .tlink{border-color:var(--d-ink)}
.tlink:hover{color:var(--green-d);border-color:var(--green-d)}
.sec--dark .tlink:hover{color:#3ED37E;border-color:#3ED37E}

/* ---- hero ------------------------------------------------------------- */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:var(--pad);color:#fff;background:#111}
.hero .bg{position:absolute;inset:0;z-index:0}
.hero .bg .ph,.hero .bg img{width:100%;height:135%;object-fit:cover;
  position:absolute;inset:0;will-change:transform}
.hero::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.05) 40%,rgba(0,0,0,.6))}
.hero>*{position:relative;z-index:2}
.hero .eyebrow{color:rgba(255,255,255,.8)}
.hero .display{margin-bottom:.35em}
.hero .herofoot{display:flex;justify-content:space-between;align-items:flex-end;
  gap:24px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.25);padding-top:22px}
.hero .herofoot p{max-width:40ch;font-size:15px;color:rgba(255,255,255,.85)}

/* ---- lignes label / valeur ------------------------------------------- */
.rows{display:grid;gap:0;border-top:1px solid var(--line)}
.sec--dark .rows{border-color:var(--d-line)}
.rows .row{display:grid;grid-template-columns:minmax(140px,1fr) 2.4fr;gap:24px;
  padding:26px 0;border-bottom:1px solid var(--line);align-items:start}
.sec--dark .rows .row{border-color:var(--d-line)}
.rows .row .k{font-family:var(--serif);font-size:13px;color:var(--grey);padding-top:4px}
.sec--dark .rows .row .k{color:var(--d-grey)}
.rows .row .v{font-size:clamp(1rem,1.4vw,1.35rem);letter-spacing:-.015em;line-height:1.3}
.rows .row .v.big{font-weight:500;font-size:clamp(1.4rem,2.6vw,2.4rem);letter-spacing:-.03em}

/* ---- registre (annuaire : engagements, dossier) --------------------- */
.ledger{border-top:1px solid var(--line)}
.sec--dark .ledger{border-color:var(--d-line)}
.ledger li{list-style:none;display:grid;grid-template-columns:44px 1fr;gap:18px;
  padding:20px 0;border-bottom:1px solid var(--line);font-size:clamp(1rem,1.5vw,1.35rem);
  letter-spacing:-.015em;line-height:1.35}
.sec--dark .ledger li{border-color:var(--d-line)}
.ledger li .n{font-family:var(--serif);font-size:13px;color:var(--grey);padding-top:5px}
.sec--dark .ledger li .n{color:var(--d-grey)}
.ledger.no li .n::before{content:"\2715";color:var(--accent)}
.ledger.yes li .n::before{content:"\2713";color:var(--green-d)}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,90px)}
.pair h3{margin-bottom:14px}

/* ---- process numerote --------------------------------------------------- */
.steps{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.sec--dark .steps{background:var(--d-line);border-color:var(--d-line)}
.step{background:var(--paper);padding:clamp(28px,4vw,56px);display:flex;
  flex-direction:column;gap:16px}
.sec--dark .step{background:var(--ink)}
.step .n{font-weight:500;font-size:clamp(2.4rem,6vw,5rem);line-height:.8;
  letter-spacing:-.05em;color:var(--green)}
.step h3{font-size:clamp(1.1rem,1.6vw,1.45rem);font-weight:500;letter-spacing:-.02em}
.step p{color:var(--grey);font-size:14.5px;max-width:34ch}
.sec--dark .step p{color:var(--d-grey)}

/* ---- projets / parcelles --------------------------------------------- */
.plots{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,4vw,64px)}
.plot{display:block;color:inherit}
.plot .shot{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--panel);margin-bottom:18px}
.plot .shot .ph,.plot .shot img{width:100%;height:100%;object-fit:cover;
  transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.plot:hover .shot img{transform:scale(1.04)}
.plot .badge{position:absolute;left:14px;top:14px;z-index:2;
  font-family:var(--serif);font-size:12px;letter-spacing:.02em;
  background:var(--paper);color:var(--ink);padding:5px 11px}
.plot[data-statut="Disponible"] .badge{background:var(--green);color:var(--ink)}
.plot.person .shot{aspect-ratio:3/4}
.plot .meta{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.plot .meta h3{font-size:clamp(1.2rem,2vw,1.9rem);font-weight:500;letter-spacing:-.03em}
.plot .meta .area{font-family:var(--serif);font-size:15px;color:var(--grey);white-space:nowrap}
.plot .sub2{margin-top:8px;color:var(--grey);font-size:14px}
.plot .go{margin-top:14px;font-size:13px;font-weight:500;color:var(--green-d)}

/* ---- liste editoriale des terrains (facon "selected projects") ------- */
.projlist{border-top:1px solid var(--line)}
.sec--dark .projlist{border-color:var(--d-line)}
.projrow{position:relative;display:grid;align-items:center;gap:clamp(14px,3vw,40px);
  grid-template-columns:52px minmax(0,1fr) auto auto;
  padding:clamp(22px,3.4vw,40px) 0;border-bottom:1px solid var(--line);
  color:inherit;isolation:isolate}
.sec--dark .projrow{border-color:var(--d-line)}
.projrow__n{font-family:var(--serif);font-size:13px;color:var(--grey)}
.projrow__name{font-weight:500;letter-spacing:-.035em;line-height:1;
  font-size:clamp(1.6rem,5vw,3.4rem);transition:transform .5s var(--ease),opacity .3s}
.projrow__sub{display:block;font-family:var(--serif);font-weight:400;font-size:13px;
  letter-spacing:0;color:var(--grey);margin-top:10px;max-width:52ch}
.projrow__surf{font-weight:500;font-size:clamp(1rem,1.5vw,1.35rem);letter-spacing:-.02em;
  white-space:nowrap;transition:transform .5s var(--ease)}
.projrow__go{font-family:var(--serif);font-size:13px;color:var(--green-d);white-space:nowrap;
  opacity:0;transform:translateX(-8px);transition:opacity .35s,transform .35s var(--ease)}
.sec--dark .projrow__go{color:#3ED37E}
/* vignette qui apparait au survol, calee a droite */
.projrow__img{position:absolute;right:clamp(90px,14vw,190px);top:50%;z-index:3;
  width:clamp(200px,22vw,300px);aspect-ratio:4/3;overflow:hidden;pointer-events:none;
  opacity:0;transform:translateY(-50%) scale(.82) rotate(-2deg);
  transition:opacity .4s var(--ease),transform .55s var(--ease)}
.projrow__img img{width:100%;height:100%;object-fit:cover}
.projrow[data-statut="En préparation"]{opacity:.55}
.projrow[data-statut="En préparation"] .projrow__go{color:var(--grey)}

@media (hover:hover) and (pointer:fine){
  .projrow:hover .projrow__name{transform:translateX(18px)}
  .projrow:hover .projrow__surf{transform:translateX(-10px)}
  .projrow:hover .projrow__go{opacity:1;transform:none}
  .projrow:hover .projrow__img{opacity:1;transform:translateY(-50%) scale(1) rotate(0deg)}
  .projlist:hover .projrow:not(:hover) .projrow__name{opacity:.32}
}
@media (max-width:820px){
  .projrow{grid-template-columns:34px 1fr auto;row-gap:6px}
  .projrow__go{display:none}
  .projrow__img{display:none}
}

/* ---- beat "people & process" : phrase + photos qui derivent au scroll --- */
.people{position:relative;overflow:hidden;display:grid;align-items:center;
  min-height:min(100vh,880px);padding:clamp(90px,16vh,190px) var(--pad)}
.people__text{position:relative;z-index:3;max-width:19ch;font-weight:500;
  letter-spacing:-.035em;line-height:1.05;font-size:clamp(2rem,5.6vw,4.8rem)}
.people__text .accent{color:var(--green)}
.people__note{position:relative;z-index:3;margin-top:clamp(24px,4vw,44px);
  max-width:40ch;font-family:var(--serif);font-size:15px;color:var(--grey);line-height:1.6}
.sec--dark .people__note{color:var(--d-grey)}
.people__ph{position:absolute;z-index:1;overflow:hidden;
  width:clamp(118px,16vw,248px);aspect-ratio:3/4;will-change:transform;
  opacity:0;transition:opacity 1s var(--ease)}
.people__ph img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.04) brightness(.92)}
.js .people.in .people__ph{opacity:.9}
.people__ph:nth-child(1){top:5%;right:3%;--drift:-95;--rot:5}
.people__ph:nth-child(2){bottom:6%;right:20%;--drift:70;--rot:-6}
.people__ph:nth-child(3){top:15%;right:33%;--drift:-45;--rot:3;width:clamp(96px,12vw,188px)}
.people__ph:nth-child(4){bottom:3%;left:1%;--drift:115;--rot:-4}
.people__ph:nth-child(5){top:1%;left:22%;--drift:-72;--rot:7;width:clamp(92px,11vw,172px)}
@media (max-width:820px){
  .people{min-height:auto}
  .people__ph{position:relative;display:none;inset:auto}
  .people__ph:nth-child(1),.people__ph:nth-child(4){display:block;width:46vw;
    margin:22px 18px 0 0;opacity:.92!important;transform:none!important}
  .people .wrap{order:-1}
}

/* ---- chiffres en orbite (bas d'accueil, facon Kononenko) ----------- */
.orbit{position:relative;overflow:hidden;display:grid;place-items:center;
  min-height:min(125vh,1150px);padding:clamp(70px,12vh,140px) var(--pad)}
.orbit::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(ellipse 60% 55% at 50% 50%,
    var(--ink) 0%,var(--ink) 34%,rgba(0,0,0,.55) 60%,transparent 100%)}
.orbit__ring{position:absolute;inset:0;z-index:1;pointer-events:none;
  transform:rotate(var(--spin,0deg))}
.orbit__ph{position:absolute;left:50%;top:50%;
  width:clamp(90px,11.5vw,168px);aspect-ratio:3/4;overflow:hidden;background:#111;
  transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(-1 * var(--r,44vmin)))
    rotate(calc(-1 * var(--a) + var(--tilt,0deg))) scale(var(--sc,.5));
  opacity:0;transition:opacity .9s var(--ease),scale 1.1s var(--ease)}
.orbit__ph img,.orbit__ph .ph{width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.05) brightness(.72)}
.js .orbit.in .orbit__ph{opacity:.62;--sc:1}
.orbit__center{position:relative;z-index:3;text-align:center}
.orbit__figs{position:relative;min-height:clamp(200px,32vh,340px);margin-top:20px}
.ofig{position:absolute;inset:0;display:grid;place-content:center;gap:18px;
  opacity:0;transform:translateY(22px) scale(.97);
  transition:opacity .5s ease,transform .5s var(--ease)}
.ofig.on{opacity:1;transform:none;transition:opacity .7s ease .12s,transform .8s var(--ease) .12s}
.ofig__n{font-weight:500;font-size:clamp(3.8rem,14vw,11rem);line-height:.8;
  letter-spacing:-.055em}
.ofig__l{color:var(--d-ink);font-size:clamp(1rem,1.8vw,1.3rem);
  max-width:24ch;margin:0 auto;line-height:1.4}
.orbit__note{position:relative;z-index:3;margin-top:clamp(30px,6vh,64px);
  font-family:var(--serif);font-size:12.5px;color:var(--d-grey)}
@media (max-width:600px){.orbit__ph{width:70px;--r:40vmin}}

/* ---- section manifeste (bas de page, facon Kononenko) --------------- */
.manifesto{overflow:hidden;padding-top:clamp(80px,16vh,180px);
  padding-bottom:clamp(80px,16vh,180px)}
.manifesto__text{font-weight:500;letter-spacing:-.045em;line-height:1.04;
  font-size:clamp(2.2rem,6.4vw,5.8rem);margin:.2em 0 0}
.manifesto__text .ln-mask{display:block;overflow:clip;padding-bottom:.04em}
.manifesto__text .ln{display:block}
.manifesto__text .ln i{display:block;font-style:normal;
  transition:transform 1.1s var(--ease),opacity 1.1s var(--ease)}
.js .manifesto__text .ln i{transform:translateY(112%);opacity:0}
.js .manifesto.in .manifesto__text .ln i{transform:none;opacity:1}
.js .manifesto.in .manifesto__text .ln-mask:nth-child(1) i{transition-delay:.05s}
.js .manifesto.in .manifesto__text .ln-mask:nth-child(2) i{transition-delay:.16s}
.js .manifesto.in .manifesto__text .ln-mask:nth-child(3) i{transition-delay:.27s}
.js .manifesto.in .manifesto__text .ln-mask:nth-child(4) i{transition-delay:.38s}
.js .manifesto.in .manifesto__text .ln-mask:nth-child(5) i{transition-delay:.49s}
.manifesto__text .accent{color:var(--green)}
.manifesto__foot{margin-top:clamp(28px,4vw,52px);max-width:44ch;
  font-family:var(--serif);font-size:15px;color:var(--d-grey);line-height:1.55}

/* ---- pied de page editorial (facon Kononenko) --------------------- */
.foot__head{display:flex;flex-wrap:wrap;justify-content:space-between;
  align-items:flex-end;gap:30px;padding-bottom:clamp(50px,7vw,90px);
  border-bottom:1px solid var(--d-line)}
.foot__brand{display:block}
.foot__brand img{display:block;height:auto;width:clamp(240px,42vw,560px);
  filter:brightness(0) invert(1)}
.foot__tag{max-width:32ch;font-size:15px;color:var(--d-grey);line-height:1.5}
.foot__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 30px;
  padding:clamp(44px,6vw,80px) 0}
.foot .fcol h4{font-family:var(--serif);font-size:13px;color:var(--d-grey);
  font-weight:400;margin-bottom:20px}
.foot .fcol ul{list-style:none;display:grid;gap:12px}
.foot .fcol li,.foot .fcol a{font-size:clamp(1rem,1.5vw,1.3rem);letter-spacing:-.02em;
  color:var(--d-ink)}
.foot .fcol a{transition:color .2s,padding-left .25s var(--ease)}
.foot .fcol a:hover{color:var(--green);padding-left:8px}
.foot__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 40px;
  padding-top:30px;border-top:1px solid var(--d-line);
  font-family:var(--serif);font-size:12.5px;color:var(--d-grey)}
.foot__bottom a{color:var(--d-grey)}
.foot__bottom a:hover{color:var(--d-ink)}
.foot__credit{flex-basis:100%;text-align:center;margin-top:6px;opacity:.55;letter-spacing:.02em}

/* ---- grands chiffres (fond noir) ----------------------------------- */
.figures{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--d-line);border:1px solid var(--d-line)}
.figure{background:var(--ink);padding:clamp(28px,4vw,52px) clamp(20px,3vw,40px)}
.figure .fn{font-weight:500;font-size:clamp(2.6rem,7vw,6rem);line-height:.85;
  letter-spacing:-.05em}
.figure .fl{margin-top:14px;color:var(--d-grey);font-size:14px;max-width:22ch}

/* ---- bloc image plein cadre ----------------------------------------- */
.band{position:relative;height:clamp(300px,52vh,560px);overflow:hidden;background:#111}
.band .ph,.band img{position:absolute;top:-15%;left:0;width:100%;height:130%;object-fit:cover;
  will-change:transform}
.band .cap{position:absolute;left:var(--pad);bottom:var(--pad);z-index:2;color:#fff;
  font-family:var(--serif);font-size:13px;text-shadow:0 1px 12px rgba(0,0,0,.5)}

/* ---- bureau / adresse ---------------------------------------------- */
.office{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(24px,5vw,80px);align-items:start}
.office .addr{font-size:clamp(1.1rem,1.8vw,1.6rem);letter-spacing:-.02em;line-height:1.4}
.office .hours{display:grid;gap:12px;font-size:14px}
.office .hours .hr-row{display:flex;justify-content:space-between;
  border-bottom:1px solid var(--line);padding-bottom:10px}
.sec--dark .office .hours .hr-row{border-color:var(--d-line)}

/* ---- photos : noir & blanc editorial (cohérent avec la charte) ----- */
.hero .bg img,.band img,.plot .shot img,.gal img,.office img{
   filter:grayscale(1) contrast(1.04) brightness(.98)}

/* ---- placeholder image (a remplacer) ------------------------------- */
.ph{background:
   repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 1px,transparent 1px 26px),
   linear-gradient(135deg,#3c3c3c,#565656);
   position:relative;display:grid;place-items:center}
.ph::after{content:attr(data-label);max-width:80%;text-align:center;
   font-family:var(--serif);font-size:13px;color:rgba(255,255,255,.72);
   letter-spacing:.01em;line-height:1.4}

/* ---- formulaire --------------------------------------------------- */
.form{display:grid;gap:0;border-top:1px solid var(--line)}
.sec--dark .form{border-color:var(--d-line)}
.form .fld{display:grid;grid-template-columns:minmax(120px,1fr) 2.4fr;gap:20px;
  padding:18px 0;border-bottom:1px solid var(--line);align-items:center}
.sec--dark .form .fld{border-color:var(--d-line)}
.form label{font-family:var(--serif);font-size:13px;color:var(--grey)}
.form input,.form select{font-family:var(--sans);font-size:16px;color:inherit;
  background:none;border:0;border-bottom:1px solid transparent;padding:6px 0;width:100%}
.form input:focus,.form select:focus{outline:0;border-bottom-color:var(--accent)}
.form select{cursor:pointer}
.sec--dark .form select option{color:#000}
.form .fld.bad input,.form .fld.bad select{border-bottom-color:var(--accent)}
.form .err{display:none;font-size:12px;color:var(--accent);font-family:var(--serif)}
.form .fld.bad .err{display:block}
.form .submit{padding-top:26px}
.hp{position:absolute;left:-9999px}
.form-done{margin-top:18px;font-family:var(--serif);color:var(--accent)}

/* ---- matcher (zone + budget -> terrains) -------------------------- */
.matcher{padding:24px 0 4px;border-top:1px solid var(--line)}
.sec--dark .matcher{border-color:var(--d-line)}
.matcher__head{font-family:var(--serif);font-size:13px;color:var(--grey);margin-bottom:14px}
.sec--dark .matcher__head{color:var(--d-grey)}
.matcher__list{display:grid;gap:1px;background:var(--line)}
.sec--dark .matcher__list{background:var(--d-line)}
.matcher__row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:15px 2px;background:var(--paper);color:inherit;font-size:15px}
.sec--dark .matcher__row{background:var(--ink)}
.matcher__row:hover span:first-child{color:var(--green)}
.matcher__row span:last-child{font-family:var(--serif);color:var(--grey);white-space:nowrap}
.matcher__none{font-size:14px;color:var(--grey);line-height:1.55;max-width:52ch}
.sec--dark .matcher__none{color:var(--d-grey)}

/* ---- fiche parcelle ---------------------------------------------- */
.fiche{display:grid;grid-template-columns:1.6fr 1fr;gap:clamp(30px,5vw,80px);align-items:start}
.fiche .aside{position:sticky;top:100px;border:1px solid var(--line);padding:28px}
.fiche .aside .price{font-weight:500;font-size:clamp(1.6rem,3vw,2.6rem);letter-spacing:-.03em}
.fiche .aside .psub{color:var(--grey);font-size:13.5px;margin:6px 0 20px}
.fiche .aside .btn{width:100%;justify-content:center;margin-bottom:10px}
.fiche .aside .fine{font-size:12.5px;color:var(--grey);margin-top:10px;font-family:var(--serif)}
.gal{display:grid;gap:12px;margin-bottom:34px}
.gal .lead-shot{aspect-ratio:16/10;overflow:hidden;position:relative}
.gal .lead-shot .ph,.gal .lead-shot img{width:100%;height:100%;object-fit:cover}
.gal .thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.gal .thumbs>.ph,.gal .thumbs>img{aspect-ratio:4/3;width:100%;height:100%;object-fit:cover}
.gal img{cursor:zoom-in;transition:filter .25s}
.gal img:hover{filter:grayscale(1) contrast(1.04) brightness(1.06)}
.gal__count{position:absolute;left:14px;bottom:14px;z-index:3;background:var(--paper);
  color:var(--ink);font-family:var(--serif);font-size:12px;padding:5px 11px;pointer-events:none}
.pother{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);
  font-family:var(--serif);font-size:12.5px;color:var(--grey);display:grid;gap:6px}

/* -- visionneuse photos (fiche parcelle) -- */
.lightbox{position:fixed;inset:0;z-index:1000;display:none;
  background:rgba(0,0,0,.94);padding:clamp(14px,4vw,56px)}
.lightbox.open{display:grid;grid-template-rows:1fr auto;gap:14px}
.lightbox__stage{display:grid;place-items:center;min-height:0}
.lightbox__stage img{max-width:100%;max-height:100%;object-fit:contain;
  filter:grayscale(1) contrast(1.04)}
.lightbox__bar{display:flex;justify-content:space-between;align-items:center;gap:16px;
  color:#fff;font-family:var(--serif);font-size:13px}
.lightbox__bar .cap{color:rgba(255,255,255,.66);max-width:64ch;text-align:right}
.lightbox button{background:none;border:1px solid rgba(255,255,255,.4);color:#fff;
  width:46px;height:46px;cursor:pointer;font-size:20px;line-height:1;flex:0 0 auto;
  transition:border-color .2s,background .2s}
.lightbox button:hover{border-color:#fff;background:rgba(255,255,255,.12)}
.lightbox__close{position:absolute;top:clamp(12px,3vw,26px);right:clamp(12px,3vw,26px)}
.lightbox__nav{position:absolute;left:12px;top:50%;transform:translateY(-50%);
  display:flex;justify-content:space-between;width:calc(100% - 24px);pointer-events:none}
.lightbox__nav button{pointer-events:auto}
@media (max-width:600px){
  .lightbox__nav{position:static;transform:none;width:auto;justify-content:center;gap:22px}
  .lightbox__bar .cap{display:none}
}
.block{margin:38px 0}
.block>h2{font-size:clamp(1.2rem,2vw,1.7rem);font-weight:500;letter-spacing:-.02em;
  margin-bottom:16px}
.specs{border-top:1px solid var(--line)}
.specs div{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:14px 0;
  border-bottom:1px solid var(--line)}
.specs dt{font-family:var(--serif);font-size:13px;color:var(--grey)}
.specs dd{font-size:15px;font-weight:500}
.keyval{border-top:1px solid var(--line)}
.keyval .r{display:grid;grid-template-columns:minmax(150px,1fr) 2fr;gap:20px;
  padding:16px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.keyval .r .k{font-family:var(--serif);color:var(--grey);font-size:13px}
.legal-box{border:1px solid var(--accent);padding:24px}
.legal-box dl{display:grid;grid-template-columns:1fr 1fr;gap:14px 26px}
.legal-box dt{font-family:var(--serif);font-size:12.5px;color:var(--accent)}
.legal-box dd{font-size:14.5px;font-weight:500}
.doclist{list-style:none;border-top:1px solid var(--line)}
.doclist li{padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px;
  display:grid;grid-template-columns:24px 1fr;gap:8px}
.doclist li::before{content:"\2713";color:var(--green-d)}
.missing{border-left:2px solid var(--accent);padding:6px 0 6px 22px}
.missing li{list-style:none;font-size:14.5px;color:var(--grey);margin:8px 0}

/* ---- prose (pages legales) -------------------------------------- */
.prose{max-width:70ch}
.prose h2{font-size:clamp(1.2rem,2vw,1.6rem);font-weight:500;margin:34px 0 10px;letter-spacing:-.02em}
.prose p,.prose li{font-size:15.5px;margin-bottom:10px}
.prose ul{padding-left:20px}

/* ---- le foncier (blog / guide) ------------------------------------- */
.posts{border-top:1px solid var(--line)}
.post{display:grid;grid-template-columns:190px 1fr;gap:clamp(20px,5vw,64px);
  padding:clamp(28px,4vw,44px) 0;border-bottom:1px solid var(--line);
  color:inherit;align-items:start}
.post__meta{font-family:var(--serif);font-size:12.5px;color:var(--grey);
  display:flex;flex-direction:column;gap:4px}
.post__meta a{color:var(--green-d)}
.post__meta--wide{flex-direction:row;flex-wrap:wrap;gap:16px;align-items:center}
.post__title{font-weight:500;font-size:clamp(1.4rem,2.7vw,2.2rem);letter-spacing:-.03em;
  line-height:1.1;margin-bottom:.45em;transition:color .2s}
.post:hover .post__title{color:var(--accent)}
.post__chapo{color:var(--grey);font-size:15px;max-width:60ch;line-height:1.55}
.post .go{margin-top:16px}
.posts--2{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,4vw,64px);
  border-top:1px solid var(--line)}
.posts--2 .post{grid-template-columns:1fr;gap:12px;padding-top:32px}
.post-body{max-width:68ch;font-size:16.5px}
.post-body h2{font-size:clamp(1.3rem,2.3vw,1.9rem);font-weight:500;letter-spacing:-.022em;
  margin:1.7em 0 .5em}
.post-body h3{font-size:1.12rem;font-weight:500;letter-spacing:-.01em;margin:1.5em 0 .35em}
.post-body p,.post-body li{font-size:16.5px;line-height:1.68;margin-bottom:.7em}
.post-body ul{padding-left:20px;margin:.4em 0 1.1em}
.post-body li{margin-bottom:.4em}
.post-body strong{font-weight:500;color:var(--ink)}
.post-body .rappel{background:var(--panel);border:1px solid var(--line);
  padding:22px 24px;margin:2em 0;font-size:15.5px;line-height:1.6}
.post-body .rappel strong{display:block;font-family:var(--serif);font-weight:400;
  font-size:12.5px;color:var(--green-d);margin-bottom:8px}
@media (max-width:820px){
  .post{grid-template-columns:1fr;gap:12px}
  .post__meta{flex-direction:row;flex-wrap:wrap;gap:14px}
  .posts--2{grid-template-columns:1fr}
}

/* ---- widget d'accueil (bulle bas-droite, pose par app.js) --------- */
.chat{position:fixed;right:clamp(12px,3vw,26px);bottom:clamp(12px,3vw,26px);
  z-index:900;display:none;font-family:var(--sans)}
.chat.ready{display:block}
.chat__launch{display:inline-flex;align-items:center;gap:9px;cursor:pointer;
  background:var(--ink);color:#fff;border:0;border-radius:100px;padding:13px 20px;
  font-size:14px;font-weight:500;letter-spacing:-.01em;
  box-shadow:0 10px 34px rgba(0,0,0,.22);
  transition:transform .3s var(--ease),opacity .3s}
.chat__launch:hover{transform:translateY(-2px)}
.chat__dot{width:8px;height:8px;border-radius:50%;background:var(--green)}
.chat__dot{animation:chatpulse 2.6s ease-out infinite}
@keyframes chatpulse{0%{box-shadow:0 0 0 0 rgba(0,176,76,.55)}
  70%{box-shadow:0 0 0 10px rgba(0,176,76,0)}100%{box-shadow:0 0 0 0 rgba(0,176,76,0)}}
.chat.open .chat__launch{opacity:0;pointer-events:none;transform:scale(.9)}
.chat__panel{position:absolute;right:0;bottom:0;width:min(360px,calc(100vw - 24px));
  background:var(--paper);border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(0,0,0,.24);transform-origin:bottom right;
  opacity:0;transform:translateY(14px) scale(.97);pointer-events:none;
  transition:opacity .3s var(--ease),transform .35s var(--ease)}
.chat.open .chat__panel{opacity:1;transform:none;pointer-events:auto}
/* dans le panneau : curseur natif (le curseur custom gêne une UI dense) */
.has-cursor .chat__panel,.has-cursor .chat__panel *{cursor:auto}
.has-cursor .chat__panel button,.has-cursor .chat__panel a{cursor:pointer}
.chat__head{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:14px 8px 14px 18px;border-bottom:1px solid var(--line)}
.chat__head strong{display:block;font-weight:500;font-size:15px}
.chat__head span{font-family:var(--serif);font-size:11.5px;color:var(--green-d)}
.chat__close{background:none;border:0;font-size:16px;line-height:1;cursor:pointer;
  color:var(--grey);width:40px;height:40px;flex:0 0 auto;border-radius:50%;
  transition:background .2s,color .2s}
.chat__close:hover{color:var(--ink);background:var(--panel)}
.chat__body{padding:14px 18px 16px;max-height:60vh;overflow-y:auto;
  display:flex;flex-direction:column;gap:12px}
.chat__log{display:flex;flex-direction:column;gap:8px}
.chat__b,.chat__u{max-width:86%;padding:11px 14px;font-size:14px;line-height:1.5;
  animation:chatin .3s var(--ease) both}
.chat__b{background:var(--panel);align-self:flex-start}
.chat__u{background:var(--ink);color:#fff;align-self:flex-end}
@keyframes chatin{from{opacity:0;transform:translateY(6px)}}
.chat__typing{align-self:flex-start;background:var(--panel);padding:13px 15px;
  display:inline-flex;gap:4px}
.chat__typing i{width:6px;height:6px;border-radius:50%;background:var(--grey);
  animation:chatdot 1s infinite}
.chat__typing i:nth-child(2){animation-delay:.15s}
.chat__typing i:nth-child(3){animation-delay:.3s}
@keyframes chatdot{0%,60%,100%{opacity:.3}30%{opacity:1}}
.chat__answers{display:grid;gap:7px}
.chat__answers>button,.chat__answers>a{display:block;text-align:left;width:100%;
  border:1px solid var(--line);background:none;padding:11px 13px;font-size:13.5px;
  font-family:var(--sans);color:var(--ink);cursor:pointer;
  transition:border-color .2s,background .2s}
.chat__answers>button:hover,.chat__answers>a:hover{border-color:var(--ink);background:var(--panel)}
.chat__answers>.is-wa{border-color:var(--green);color:var(--green-d)}
.chat__cta{margin-top:4px}
.chat__result{display:grid;gap:1px;background:var(--line);margin:2px 0}
.chat__result a{background:var(--paper);padding:12px 13px;display:flex;
  justify-content:space-between;gap:12px;font-size:13.5px;color:var(--ink)}
.chat__result a:hover span:first-child{color:var(--green)}
.chat__result a span:last-child{font-family:var(--serif);color:var(--grey);white-space:nowrap}
.chat__restart{align-self:flex-start;background:none;border:0;font-family:var(--serif);
  font-size:12px;color:var(--grey);cursor:pointer;padding:2px 0;text-decoration:underline}
.chat__fine{font-family:var(--serif);font-size:11px;color:var(--grey);line-height:1.5}
@media (max-width:600px){.chat__panel{width:calc(100vw - 20px)}}
@media (prefers-reduced-motion:reduce){
  .chat__b,.chat__u{animation:none!important}
  .chat__typing i{animation:none!important}
}
@media (prefers-reduced-motion:reduce){
  .chat__launch,.chat__panel{transition:none!important}
  .chat__dot{animation:none!important}
  .chat.open .chat__panel{transform:none!important}
}

/* ---- carte Google Maps (fiche parcelle) --------------------------- */
.geo{border:1px solid var(--line);margin-top:14px}
.geo iframe{display:block;width:100%;height:clamp(280px,40vh,420px);border:0;filter:grayscale(1) contrast(1.05)}
.geo .geo__bar{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:12px 16px;border-top:1px solid var(--line);font-size:13px}
.geo .geo__bar .coords{font-family:var(--serif);color:var(--grey)}

/* ---- pied de page --------------------------------------------------- */
.foot{background:var(--ink);color:var(--d-ink);
  padding:clamp(70px,11vw,150px) var(--pad) 44px}

/* ---- reveal au defilement (JS pose .rv ; sans JS tout est visible) -- */
/* =========================================================================
   MOUVEMENT — reveal au defilement, entree du hero, parallaxe, bandeau.
   Tout se neutralise sous prefers-reduced-motion (voir bloc en fin de fichier).
   ========================================================================= */
:root{--ease:cubic-bezier(.19,1,.22,1)}

/* -- blocs qui apparaissent au scroll (classe .rv posee par app.js) --
   Etat masque uniquement si JS actif (.js sur <html>) : sans JS, tout est visible. */
.js .rv{opacity:0;transform:translateY(48px)}
.js .rv.in{opacity:1;transform:none;
  transition:opacity 1s var(--ease),transform 1s var(--ease);
  transition-delay:var(--d,0ms)}

/* -- images : panneau qui se retire + leger zoom (classe .shot-rv) -- */
.shot-rv{position:relative;overflow:hidden}
.js .shot-rv::after{content:"";position:absolute;inset:-1px;z-index:4;background:var(--paper);
  transform-origin:bottom;transition:transform 1s var(--ease);pointer-events:none}
.js .sec--dark .shot-rv::after,.js .hero .shot-rv::after{background:var(--ink)}
.js .shot-rv.in::after{transform:scaleY(0)}
/* Pas de transition sur transform : app.js pilote la position de ces images en
   parallaxe a chaque frame ; une transition les ferait "trainer" ~1,6 s derriere
   le scroll. Le reveal reste assure par le panneau .shot-rv::after. */
.shot-rv img,.shot-rv .ph{transition:opacity .6s var(--ease)}
.plot .shot .badge{z-index:5}

/* -- entree du hero (classe .in posee sur .hero par app.js) --
   Etats masques prefixes .js ; etats reveles prefixes .js .hero.in (+ specifiques). */
.hero .display .ln{overflow:hidden;padding-bottom:.04em}
.hero .display .ln i{display:block;font-style:normal;transition:transform 1.15s var(--ease)}
.hero .eyebrow{transition:opacity .8s ease,transform .8s var(--ease)}
.hero .herofoot{transition:opacity .9s ease,transform .9s var(--ease)}
.hero .bg img,.hero .bg .ph{transition:transform 1.9s var(--ease)}

.js .hero .display .ln i{transform:translateY(115%)}
.js .hero .eyebrow{opacity:0;transform:translateY(16px)}
.js .hero .herofoot{opacity:0;transform:translateY(34px)}
.js .hero .bg img,.js .hero .bg .ph{transform:scale(1.12)}

.js .hero.in .eyebrow{opacity:.85;transform:none;transition-delay:.1s}
.js .hero.in .display .ln i{transform:none}
.js .hero.in .display .ln:nth-child(1) i{transition-delay:.26s}
.js .hero.in .display .ln:nth-child(2) i{transition-delay:.42s}
.js .hero.in .display .ln:nth-child(3) i{transition-delay:.58s}
.js .hero.in .herofoot{opacity:1;transform:none;transition-delay:.8s}
.js .hero.in .bg img,.js .hero.in .bg .ph{transform:scale(1)}
/* filet 2 : au plus tard 2,6 s, le hero est visible quoi qu'il arrive
   (transition coupee : neutralise aussi une transition figee sur un onglet en arriere-plan) */
.js .hero.done .eyebrow,.js .hero.done .display .ln i,.js .hero.done .herofoot,
.js .hero.done .bg img{transition:none!important;transform:none!important}
.js .hero.done .eyebrow{opacity:.85!important}
.js .hero.done .display .ln i,.js .hero.done .herofoot{opacity:1!important}

/* -- parallaxe a la souris : le conteneur bg et le titre suivent le curseur --
   (--mx/--my poses par initHeroMouse, --sy par initParallax ; se composent) */
.js .hero .bg{transform:scale(1.12) translate3d(var(--mx,0px),var(--my,0px),0)}
.js .hero .display{transform:translate3d(var(--mx,0px),var(--sy,0px),0)}

/* -- bandeau defilant -- */
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:20px 0;background:var(--paper)}
.marquee__track{display:inline-flex;white-space:nowrap;will-change:transform;
  animation:marq 42s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee span{display:inline-flex;align-items:center;gap:2.2vw;padding:0 1.1vw;
  font-family:var(--sans);font-weight:500;letter-spacing:-.02em;
  font-size:clamp(1.05rem,2.1vw,1.7rem);color:var(--ink)}
.marquee span::after{content:"";width:6px;height:6px;border-radius:50%;
  background:var(--green);flex:0 0 auto}
@keyframes marq{to{transform:translateX(-50%)}}

/* -- en-tete qui se cache en descendant -- */
.nav{transition:background .3s,border-color .3s,color .3s,padding .3s,transform .45s var(--ease)}
.nav.hidden{transform:translateY(-101%)}
.menu-open .nav.hidden{transform:none}

/* -- rideau d'ouverture (accueil seulement, 1 fois par session) -- */
.curtain{position:fixed;inset:0;z-index:300;background:var(--ink);display:grid;
  place-items:center;transition:transform 1s cubic-bezier(.85,0,.15,1)}
.curtain img{width:clamp(160px,26vw,280px);filter:brightness(0) invert(1);
  opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .8s var(--ease)}
.js .curtain-up{overflow:hidden}
.js .curtain.ready img{opacity:1;transform:none}
.js .curtain.lift{transform:translateY(-101%)}
.js .curtain.lift img{opacity:0;transition:opacity .3s ease}

/* -- curseur personnalise (souris fine uniquement, pose par app.js) --
   deux elements position:fixed distincts : ils ne rallongent pas la page. */
.cursor{position:fixed;top:0;left:0;z-index:400;pointer-events:none;border-radius:50%;
  mix-blend-mode:difference;will-change:transform}
.cursor--ring{width:46px;height:46px;margin:-23px 0 0 -23px;border:1.5px solid #fff;
  transition:width .28s var(--ease),height .28s var(--ease),margin .28s var(--ease),opacity .25s}
.cursor--dot{width:7px;height:7px;margin:-3.5px 0 0 -3.5px;background:#fff;transition:opacity .2s}
.cursor--ring.is-hot{width:78px;height:78px;margin:-39px 0 0 -39px}
.cursor--dot.is-hot{opacity:0}
.cursor--ring.is-down{width:30px;height:30px;margin:-15px 0 0 -15px}
.cursor.is-hidden{opacity:0}
.has-cursor,.has-cursor a,.has-cursor button,.has-cursor [data-magnetic],
.has-cursor input,.has-cursor select,.has-cursor label{cursor:none}

/* -- boutons magnetiques -- */
[data-magnetic]{will-change:transform}
.js [data-magnetic]{transition:transform .35s var(--ease)}
.js [data-magnetic].pulling{transition:transform .12s linear}

@media (prefers-reduced-motion:reduce){
  .curtain{display:none!important}
  .cursor{display:none!important}
  .has-cursor,.has-cursor *{cursor:auto!important}
  .js [data-magnetic]{transition:none!important;transform:none!important}
  .js .rv,.rv.in{opacity:1!important;transform:none!important;transition:none!important}
  .js .manifesto__text .ln i{transform:none!important;opacity:1!important;transition:none!important}
  .projrow__name,.projrow__surf,.projrow__go{transform:none!important;transition:none!important}
  .projrow__go{opacity:1!important}
  .orbit__ring{transform:none!important}
  .js .orbit .orbit__ph{opacity:.5!important;scale:1!important;transition:none!important}
  .js .people .people__ph{opacity:.9!important;transform:none!important;transition:none!important}
  .ofig{position:static!important;opacity:1!important;transform:none!important;margin-bottom:40px}
  .orbit__figs{min-height:0!important}
  .js .shot-rv::after{display:none!important}
  .js .shot-rv img,.js .shot-rv .ph{transform:none!important;transition:none!important}
  .js .hero .display .ln i{transform:none!important;transition:none!important}
  .js .hero .eyebrow{opacity:.85!important;transform:none!important}
  .js .hero .herofoot{opacity:1!important;transform:none!important}
  .js .hero .bg .ph,.js .hero .bg img{transform:none!important}
  .js .hero .bg,.js .hero .display{transform:none!important}
  .hero .bg .ph,.hero .bg img,.band .ph,.band img{height:100%!important;top:0!important}
  .marquee__track{animation:none!important;transform:none!important}
  .nav.hidden{transform:none!important}
}

/* pas d'etiquette "photo ici" dans le hero : c'est evident */
.hero .bg .ph::after{display:none}
/* garde-fou grille : les enfants peuvent retrecir sous leur contenu */
.rows .row>*,.ledger li>*,.keyval .r>*,.specs div>*,.form .fld>*,
.office>*,.plot .meta>*{min-width:0}
.rows .row .v,.keyval .r>div:last-child{overflow-wrap:anywhere}

/* ---- responsive ---------------------------------------------------- */
@media (max-width:1000px){
  .foot .top{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  body{font-size:14.5px}
  :root{--gap:clamp(40px,12vw,72px)}
  .nav ul{display:none}
  .nav .burger{display:block}
  .hero{height:auto;min-height:92svh;padding-top:120px}
  .hero .display{font-size:clamp(2.5rem,11vw,3.6rem)}
  .hero .herofoot{flex-direction:column;align-items:stretch;gap:18px}
  .hero .herofoot .btn{justify-content:center}
  .plots{grid-template-columns:1fr;gap:44px}
  .figures{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr!important;display:grid}
  .rows .row{grid-template-columns:1fr;gap:6px}
  .rows .row .k{padding-top:0}
  .rows .row .v.big{font-size:clamp(1.25rem,5vw,1.6rem)}
  .pair{grid-template-columns:1fr}
  .office{grid-template-columns:1fr}
  .fiche{grid-template-columns:1fr}
  .fiche .aside{position:static}
  .form .fld{grid-template-columns:1fr;gap:6px}
  .foot__cols{grid-template-columns:1fr 1fr;gap:36px 24px}
  .legal-box dl,.specs div,.keyval .r{grid-template-columns:1fr;gap:6px}
  .gal .thumbs{grid-template-columns:1fr 1fr}
  .band .ph::after{font-size:12px}
}
@media (min-width:1200px){
  .steps{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:1199px) and (min-width:821px){
  .steps{grid-template-columns:repeat(2,1fr)}
}
@media print{.nav,.menu{display:none}}