:root{
  --nuit:#10213e; --nuit-2:#1b2f52; --encre:#14181f; --gris:#5b6372; --filet:#d9dce2; --pierre:#f3f1ec; --blanc:#fff;
  --vert:#2f7d4f; --rouge:#a63a2c; --or:#b58a3c;
  --f:"Mona Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --w:1240px; --g:clamp(16px,4vw,40px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--f);color:var(--encre);background:var(--blanc);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--g)}
.lbl{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--gris)}
h1,h2,h3{font-weight:650;letter-spacing:-.02em;line-height:1.08;font-stretch:105%}
h2{font-size:clamp(30px,4.2vw,52px)}
.num{font-variant-numeric:tabular-nums}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 24px;border:1px solid var(--nuit);background:var(--nuit);color:#fff;text-decoration:none;font-weight:600;font-size:15px;cursor:pointer;transition:background .2s,color .2s}
.btn:hover{background:var(--nuit-2)}
.btn.ghost{background:transparent;color:var(--nuit)}
.btn.ghost:hover{background:var(--nuit);color:#fff}
.btn.light{background:#fff;color:var(--nuit);border-color:#fff}
.btn.light:hover{background:var(--pierre)}
.btn.line-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn.line-light:hover{background:#fff;color:var(--nuit)}
.arrow::after{content:"→";font-weight:400}

/* header */
.hd{position:fixed;inset:0 0 auto;z-index:50;color:#fff;transition:background .25s}
.hd.solid,.hd.always{background:var(--nuit)}
.hd .wrap{display:flex;align-items:center;gap:28px;height:76px}
.hd .logo img{height:56px;width:auto}
.hd nav{display:flex;gap:26px;margin-left:auto}
.hd nav a{text-decoration:none;font-size:15px;font-weight:500;opacity:.9;padding:6px 0;border-bottom:1px solid transparent}
.hd nav a:hover,.hd nav a.on{opacity:1;border-color:currentColor}
.hd .tel{text-decoration:none;font-weight:600;font-size:15px;border-left:1px solid rgba(255,255,255,.3);padding-left:24px;white-space:nowrap}
.hd .burger{display:none;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.5);color:#fff;height:40px;padding:0 14px;cursor:pointer;font-weight:600;font-size:14px}
.menu-m{display:none}
.spacer{height:76px}

/* hero */
.hero{position:relative;min-height:min(100svh,880px);display:flex;align-items:flex-end;color:#fff;background:#222}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,33,62,.55) 0%,rgba(16,33,62,.05) 30%,rgba(16,33,62,.15) 55%,rgba(10,20,40,.82) 100%)}
.hero .wrap{position:relative;z-index:2;width:100%;padding-bottom:48px}
.hero h1{font-size:clamp(36px,5.2vw,72px);max-width:17ch;margin:14px 0 18px}
.hero .lbl{color:rgba(255,255,255,.85)}
.hero p.sub{font-size:clamp(16px,1.6vw,19px);max-width:56ch;opacity:.92}
.hero .cap{position:absolute;right:var(--g);top:96px;z-index:2;font-size:12px;opacity:.85;text-align:right}
.hero .cap a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5)}

/* recherche */
.search{margin-top:34px;background:#fff;color:var(--encre);display:grid;grid-template-columns:auto 1fr 1fr 1fr auto;align-items:stretch;max-width:1040px}
.search .tabs{display:flex;border-right:1px solid var(--filet)}
.search .tabs button{border:0;background:none;padding:0 22px;font-weight:600;cursor:pointer;color:var(--gris);border-bottom:3px solid transparent}
.search .tabs button.on{color:var(--nuit);border-color:var(--nuit)}
.search label{display:flex;flex-direction:column;justify-content:center;padding:12px 18px;border-right:1px solid var(--filet);min-width:0}
.search label span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);font-weight:600}
.search select{border:0;background:none;padding:4px 0;font-weight:500;outline:none;width:100%;cursor:pointer;-webkit-appearance:none;appearance:none}
.search .go{height:auto;min-height:68px;border:0}

/* bandeau chiffres */
.facts{border-bottom:1px solid var(--filet)}
.facts .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.facts div{padding:28px 0;border-right:1px solid var(--filet);padding-left:24px}
.facts div:first-child{padding-left:0}
.facts div:last-child{border-right:0}
.facts b{display:block;font-size:clamp(28px,3.4vw,44px);font-weight:650;letter-spacing:-.02em;color:var(--nuit)}
.facts span{font-size:14px;color:var(--gris)}

section.blk{padding:clamp(64px,9vw,120px) 0}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:40px;flex-wrap:wrap}
.head p{max-width:52ch;color:var(--gris);margin-top:14px}

/* cartes biens */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 28px}
.card{text-decoration:none;display:block;color:inherit}
.card .ph{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--pierre)}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.card:hover .ph img{transform:scale(1.03)}
.badge{position:absolute;left:0;top:14px;background:#fff;color:var(--nuit);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 10px}
.badge.vendu{background:var(--nuit);color:#fff}
.badge.option{background:var(--or);color:#fff}
.peb{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:22px;padding:0 6px;font-size:12px;font-weight:700;color:#fff}
.card .peb{position:absolute;right:12px;top:14px}
.peb.A,.peb[class*="A+"]{background:#00843d}.peb.B{background:#4ba84a}.peb.C{background:#b6cf38;color:#14181f}.peb.D{background:#ffec01;color:#14181f}.peb.E{background:#fbb900;color:#14181f}.peb.F{background:#ec6608}.peb.G{background:#e30613}
.card .meta{padding-top:16px;display:grid;gap:4px}
.card .ref{font-size:12px;color:var(--gris);letter-spacing:.06em}
.card h3{font-size:20px;letter-spacing:-.01em;line-height:1.2}
.card .price{font-size:19px;font-weight:650;color:var(--nuit)}
.card .price small{font-size:13px;font-weight:500;color:var(--gris);margin-right:4px}
.card .spec{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--gris);border-top:1px solid var(--filet);padding-top:10px;margin-top:6px}
.card.sold .ph img{filter:grayscale(.35)}

/* carte (leaflet) */
.mapbox{height:560px;background:var(--pierre);border:1px solid var(--filet)}
.leaflet-container{font-family:var(--f)!important}
.leaflet-tile-pane{filter:grayscale(1) contrast(.9) brightness(1.06)}
.pin{width:14px;height:14px;border:2px solid #fff;background:var(--nuit);box-shadow:0 0 0 1px var(--nuit)}
.pin.vendu{background:#9aa1ad;box-shadow:0 0 0 1px #9aa1ad}
.pin.agence{width:18px;height:18px;background:var(--or);box-shadow:0 0 0 1px var(--or)}
.leaflet-popup-content-wrapper{border-radius:0!important}
.pop{width:220px}.pop img{width:100%;height:120px;object-fit:cover;margin-bottom:8px}
.pop b{display:block;font-size:14px}.pop a{color:var(--nuit);font-weight:600}
.legend{display:flex;gap:22px;flex-wrap:wrap;font-size:14px;color:var(--gris);margin-top:14px}
.legend i{display:inline-block;width:12px;height:12px;margin-right:8px;vertical-align:-1px;background:var(--nuit)}
.legend i.v{background:#9aa1ad}.legend i.a{background:var(--or)}

/* vendre sans panneau */
.sell{background:var(--nuit);color:#fff}
.sell .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,6vw,90px);align-items:start}
.sell .lbl{color:rgba(255,255,255,.7)}
.sell h2{margin:14px 0 20px;max-width:14ch}
.sell p{opacity:.85;max-width:48ch}
.sell .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.engs{list-style:none;border-top:1px solid rgba(255,255,255,.25)}
.engs li{display:grid;grid-template-columns:48px 1fr;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.25);font-size:18px}
.engs li span{font-size:13px;opacity:.6;padding-top:4px}
.engs li b{font-weight:650}
.engs li.hl{color:#fff}
.engs li.hl b{border-bottom:2px solid var(--or)}

/* compétences */
.skills{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--filet)}
.skills div{padding:28px 24px 30px 0;border-bottom:1px solid var(--filet)}
.skills div:not(:nth-child(3n)){border-right:1px solid var(--filet);margin-right:0}
.skills div:not(:nth-child(3n+1)){padding-left:24px}
.skills b{display:block;font-size:22px;font-weight:650;letter-spacing:-.01em;margin-bottom:6px}
.skills span{color:var(--gris);font-size:15px}

/* palmarès */
.sold-rail{display:grid;grid-auto-flow:column;grid-auto-columns:260px;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:16px;scrollbar-width:thin}
.sold-rail .card{scroll-snap-align:start}
.sold-rail .card h3{font-size:17px}

/* agence */
.agency{background:var(--pierre)}
.agency .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,90px)}
.agency dl{display:grid;grid-template-columns:150px 1fr;border-top:1px solid var(--filet)}
.agency dt,.agency dd{padding:14px 0;border-bottom:1px solid var(--filet)}
.agency dt{color:var(--gris);font-size:14px;padding-top:16px}
.agency dd a{text-decoration:none;border-bottom:1px solid var(--filet)}
.agency .mini{height:100%;min-height:340px;border:1px solid var(--filet)}

/* footer */
.ft{background:#0b1730;color:rgba(255,255,255,.78);font-size:14px;padding:64px 0 100px}
.ft .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.3fr;gap:36px}
.ft img{height:46px;width:auto;margin-bottom:16px}
.ft h4{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
.ft a{text-decoration:none}.ft a:hover{color:#fff}
.ft ul{list-style:none;display:grid;gap:8px}
.ft .legal{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.15);padding-top:24px;font-size:12.5px;line-height:1.7;opacity:.8}

/* catalogue */
.cat-top{padding:56px 0 28px;border-bottom:1px solid var(--filet)}
.cat-top h1{font-size:clamp(34px,5vw,62px)}
.switch{display:inline-flex;border:1px solid var(--nuit);margin-top:24px}
.switch a{padding:10px 22px;text-decoration:none;font-weight:600;color:var(--nuit)}
.switch a.on{background:var(--nuit);color:#fff}
.filters{position:sticky;top:76px;z-index:20;background:#fff;border-bottom:1px solid var(--filet)}
.filters .wrap{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}
.filters select{height:42px;border:1px solid var(--filet);background:#fff;padding:0 34px 0 12px;font-size:14px;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gris) 50%),linear-gradient(135deg,var(--gris) 50%,transparent 50%);background-position:calc(100% - 17px) 18px,calc(100% - 12px) 18px;background-size:5px 5px;background-repeat:no-repeat}
.filters label.ck{display:flex;align-items:center;gap:8px;font-size:14px;height:42px;padding:0 12px;border:1px solid var(--filet);cursor:pointer}
.filters .views{margin-left:auto;display:flex;border:1px solid var(--filet)}
.filters .views button{border:0;background:#fff;height:40px;padding:0 14px;font-size:14px;font-weight:600;cursor:pointer;color:var(--gris)}
.filters .views button.on{background:var(--nuit);color:#fff}
.count{padding:22px 0 26px;color:var(--gris);font-size:15px}
.count b{color:var(--encre)}
.empty{padding:60px 0;text-align:center;color:var(--gris)}

/* registre (liste) */
.reg{width:100%;border-collapse:collapse;font-size:15px}
.reg th{text-align:left;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);font-weight:600;padding:10px 12px;border-bottom:2px solid var(--nuit)}
.reg td{padding:12px;border-bottom:1px solid var(--filet);vertical-align:middle}
.reg tr{cursor:pointer}
.reg tbody tr:hover{background:var(--pierre)}
.reg td img{width:84px;height:60px;object-fit:cover}
.reg .r{text-align:right}
.reg td.p{font-weight:650;color:var(--nuit);white-space:nowrap}

/* fiche bien */
.crumb{padding:22px 0;font-size:14px;color:var(--gris)}
.crumb a{text-decoration:none}
.gal{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:8px;height:min(62vh,600px)}
.gal button{border:0;padding:0;cursor:zoom-in;overflow:hidden;background:var(--pierre)}
.gal button img{width:100%;height:100%;object-fit:cover}
.gal button:first-child{grid-row:1/3}
.gal.n1{grid-template-columns:1fr}.gal.n1 button:first-child{grid-row:auto}
.gal.n2{grid-template-columns:1fr 1fr;grid-template-rows:1fr}.gal.n2 button:first-child{grid-row:auto}
.fiche{display:grid;grid-template-columns:1fr 380px;gap:clamp(32px,5vw,72px);padding:40px 0 90px}
.fiche h1{font-size:clamp(30px,4vw,48px);margin:10px 0 8px}
.fiche .loc{color:var(--gris);font-size:17px}
.fiche .bigprice{font-size:clamp(28px,3vw,38px);font-weight:650;color:var(--nuit);margin:24px 0 4px;letter-spacing:-.02em}
.fiche .bigprice small{font-size:15px;color:var(--gris);font-weight:500}
.specs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);margin:28px 0}
.specs div{padding:18px 16px 18px 0}
.specs div+div{border-left:1px solid var(--filet);padding-left:16px}
.specs b{display:block;font-size:22px;font-weight:650}
.specs span{font-size:13px;color:var(--gris)}
.pebscale{display:flex;gap:3px;margin:12px 0 6px}
.pebscale span{flex:1;height:30px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;opacity:.28}
.pebscale span.on{opacity:1;transform:scaleY(1.25)}
.note{background:var(--pierre);padding:18px 20px;font-size:15px;color:var(--gris);border-left:3px solid var(--nuit)}
.side{position:sticky;top:100px;align-self:start;border:1px solid var(--filet);padding:28px}
.side h3{font-size:22px;margin-bottom:6px}
.side p{color:var(--gris);font-size:14px;margin-bottom:18px}
.f{display:grid;gap:12px}
.f label{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--gris)}
.f input,.f select,.f textarea{border:1px solid var(--filet);background:#fff;height:46px;padding:0 12px;font-size:15px;font-weight:400;color:var(--encre);width:100%;border-radius:0}
.f textarea{height:auto;padding:12px;min-height:96px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid var(--nuit);outline-offset:-1px}
.f .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.f .chips{display:flex;flex-wrap:wrap;gap:8px}
.f .chips input{display:none}
.f .chips label{display:block;cursor:pointer}
.f .chips span{display:inline-block;border:1px solid var(--filet);padding:10px 14px;font-size:14px;font-weight:500;color:var(--encre)}
.f .chips input:checked+span{background:var(--nuit);border-color:var(--nuit);color:#fff}
.f .cons{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:13px}
.f .cons input{width:18px;height:18px;margin-top:2px;flex:none}
.side .or{display:flex;gap:10px;margin-top:14px}
.side .or a{flex:1}
.ok{display:none;background:#eef5ef;border-left:3px solid var(--vert);padding:14px 16px;font-size:14px}
.minimap{height:260px;border:1px solid var(--filet);margin-top:14px}
.similar{border-top:1px solid var(--filet);padding:70px 0}

/* lightbox */
.lb{position:fixed;inset:0;background:rgba(8,14,28,.94);z-index:100;display:none;align-items:center;justify-content:center}
.lb.on{display:flex}
.lb img{max-width:92vw;max-height:84vh;object-fit:contain}
.lb button{position:absolute;background:none;border:1px solid rgba(255,255,255,.4);color:#fff;width:50px;height:50px;font-size:20px;cursor:pointer}
.lb .x{top:20px;right:20px}.lb .p{left:20px;top:50%}.lb .n{right:20px;top:50%}
.lb .c{position:absolute;bottom:22px;color:#fff;font-size:14px;opacity:.8}

/* estimation */
.est{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(32px,6vw,90px);padding:56px 0 100px}
.est h1{font-size:clamp(34px,5vw,60px);margin:14px 0 18px}
.est .intro p{color:var(--gris);max-width:46ch;margin-bottom:12px}
.steps{display:flex;border-bottom:1px solid var(--filet);margin-bottom:28px}
.steps span{flex:1;padding:12px 0;font-size:13px;font-weight:600;color:var(--gris);border-bottom:3px solid transparent;margin-bottom:-1px}
.steps span.on{color:var(--nuit);border-color:var(--nuit)}
.steps span.done{color:var(--encre);border-color:var(--filet)}
.stp{display:none}.stp.on{display:grid;gap:18px}
.stp .nav{display:flex;justify-content:space-between;gap:12px;margin-top:8px}
.recap{border:1px solid var(--filet);padding:18px;font-size:14px;line-height:1.8}

/* mobile bar */
.mbar{display:none}

/* mentions */
.legalpage{max-width:780px;padding:56px var(--g) 100px;margin:0 auto}
.legalpage h1{font-size:clamp(32px,4vw,48px);margin-bottom:28px}
.legalpage h2{font-size:22px;margin:36px 0 10px}
.legalpage p,.legalpage li{color:#333;margin-bottom:8px}
.legalpage ul{padding-left:20px}
.todo{background:#fff6e5;border-left:3px solid var(--or);padding:12px 14px;font-size:14px}

@media (max-width:1080px){
  .hd nav,.hd .tel{display:none}
  .hd .burger{display:block}
  .menu-m{position:fixed;inset:76px 0 0;background:var(--nuit);z-index:49;flex-direction:column;padding:20px var(--g)}
  .menu-m.on{display:flex}
  .menu-m a{color:#fff;text-decoration:none;font-size:22px;font-weight:600;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.15)}
  .grid{grid-template-columns:repeat(2,1fr)}
  .search{grid-template-columns:1fr 1fr}
  .search .tabs{grid-column:1/-1;border-right:0;border-bottom:1px solid var(--filet)}
  .search .tabs button{flex:1;height:48px}
  .search label{border-bottom:1px solid var(--filet)}
  .search .go{grid-column:1/-1;min-height:54px}
  .sell .wrap,.agency .wrap,.est,.fiche{grid-template-columns:1fr}
  .side{position:static}
  .ft .wrap{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .hd .wrap{height:64px}.hd .logo img{height:36px}.spacer{height:64px}.menu-m{inset:64px 0 0}
  .hero{min-height:auto;padding-top:120px}
  .hero .wrap{padding-bottom:28px}
  .hero .cap{display:none}
  .search{grid-template-columns:1fr}
  .search label{border-right:0}
  .facts .wrap{grid-template-columns:1fr 1fr}
  .facts div{padding:18px 0 18px 16px!important;border-bottom:1px solid var(--filet)}
  .facts div:nth-child(2n){border-right:0}
  .facts div:nth-child(2n+1){padding-left:0!important}
  .grid{grid-template-columns:1fr;gap:30px}
  .skills{grid-template-columns:1fr}
  .skills div{border-right:0!important;padding-left:0!important}
  .mapbox{height:440px}
  .agency dl{grid-template-columns:110px 1fr}
  .ft .wrap{grid-template-columns:1fr}
  .filters{top:64px}
  .filters .wrap{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .filters select,.filters label.ck{flex:none}
  .filters .views{margin-left:0;flex:none}
  .reg thead{display:none}
  .reg td.h-m{display:none}
  .gal{grid-template-columns:1fr;grid-template-rows:auto;height:auto;display:flex;overflow-x:auto;scroll-snap-type:x mandatory}
  .gal button{flex:0 0 88%;aspect-ratio:4/3;scroll-snap-align:start}
  .specs{grid-template-columns:1fr 1fr}
  .specs div:nth-child(3){border-left:0;padding-left:0}
  .specs div:nth-child(n+3){border-top:1px solid var(--filet)}
  .f .row{grid-template-columns:1fr}
  .mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;inset:auto 0 0;z-index:60;background:#fff;border-top:1px solid var(--filet);padding:10px 12px calc(10px + env(safe-area-inset-bottom));gap:10px}
  .mbar .btn{height:46px;padding:0 10px}
  body{padding-bottom:70px}
}
.agency .wrap>*,.sell .wrap>*,.est>*,.fiche>*{min-width:0}
.agency dd,.ft li{overflow-wrap:anywhere}
