:root{
  --sable: #F2ECDF;
  --creme: #FBF8F2;
  --noyer: #545352;
  --noyer-clair: #837F7C;
  --terre: #FF640F;
  --mousse: #6B7A4F;
  --ligne: #D8CBB0;
  --ligne-forte: #C2B190;
  --serif: "Fraunces", Georgia, serif;
  --sans: "Public Sans", "Helvetica Neue", Arial, sans-serif;
  --mono: "IBM Plex Mono", monospace;
  --max: 1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--sable);color:var(--noyer);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
h1,h2,h3{font-family:var(--serif);font-weight:600;margin:0 0 .4em 0;color:var(--noyer);letter-spacing:-0.01em;}
p{margin:0 0 1em 0;}
a{color:inherit;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px;}
@media (max-width:640px){.wrap{padding:0 20px;}}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{outline:2px solid var(--terre);outline-offset:3px;}
@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}}

.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--terre);display:flex;align-items:center;gap:.6em;margin-bottom:.9em;}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--terre);display:inline-block;}

/* HEADER */
header.site{position:sticky;top:0;z-index:50;background:rgba(242,236,223,.96);backdrop-filter:blur(6px);border-bottom:1px solid var(--ligne);}
.nav-inner{max-width:var(--max);margin:0 auto;padding:14px 32px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.brand-logo{height:26px;width:auto;}
nav.links{display:flex;gap:1.8rem;flex-wrap:wrap;}
nav.links a{
  font-family:var(--mono);font-size:.76rem;letter-spacing:.05em;text-transform:uppercase;
  text-decoration:none;color:var(--noyer-clair);padding:5px 0;
  border-bottom:1px solid transparent;transition:color .15s,border-color .15s;white-space:nowrap;
}
nav.links a:hover, nav.links a.active{color:var(--terre);border-color:var(--terre);}

/* Sur mobile : logo au-dessus, liens centrés en dessous */
@media (max-width:780px){
  .nav-inner{flex-direction:column;align-items:center;gap:11px;padding:12px 16px;}
  .brand-logo{height:23px;}
  nav.links{gap:.85rem 1.15rem;justify-content:center;width:100%;}
  nav.links a{font-size:.63rem;letter-spacing:.03em;padding:3px 0;}
}
@media (max-width:400px){
  nav.links{gap:.7rem .8rem;}
  nav.links a{font-size:.585rem;}
}

/* HERO GENEVE ANIME */
.hero-geneve{position:relative;height:min(78vh,640px);min-height:420px;overflow:hidden;border-bottom:1px solid var(--ligne);}
.hero-geneve .scene-wrap{position:absolute;inset:-4%;animation:drone-pan 26s ease-in-out infinite alternate;}
.hero-geneve svg{width:100%;height:100%;display:block;}
@keyframes drone-pan{
  0%{transform:scale(1.01) translate(0,0);}
  100%{transform:scale(1.045) translate(-.7%,.6%);}
}
.hero-geneve .voile{position:absolute;inset:0;background:linear-gradient(180deg, rgba(62,50,38,.15) 0%, rgba(62,50,38,.35) 55%, rgba(62,50,38,.55) 100%);}
.hero-geneve .contenu{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:72px;max-width:100%;box-sizing:border-box;}
.hero-geneve .eyebrow{color:#F2ECDF;}
.hero-geneve .eyebrow::before{background:var(--terre);}
.hero-geneve h1{color:#FBF8F2;font-size:clamp(2rem,5vw,3.6rem);max-width:18ch;line-height:1.05;text-shadow:0 2px 24px rgba(0,0,0,.25);}
.hero-geneve .lede{color:#EDE6D6;max-width:48ch;font-size:1.05rem;margin-bottom:0;}
.btn{font-family:var(--mono);font-size:.78rem;box-sizing:border-box;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;padding:14px 26px;border-radius:2px;display:inline-block;transition:background .15s,color .15s,border-color .15s;}
.btn-primary{background:var(--terre);color:var(--creme);}
.btn-primary:hover{background:#e5590d;}

/* HERO simple (pages internes) */
.hero-simple{padding:70px 0 50px;border-bottom:1px solid var(--ligne);}
.hero-simple h1{font-size:clamp(2rem,4.2vw,3rem);max-width:22ch;}
.hero-simple .lede{color:var(--noyer-clair);max-width:56ch;font-size:1.05rem;margin-top:1em;}

section{padding:76px 0;}
section.alt{background:var(--creme);border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);}
.section-head{max-width:60ch;margin-bottom:2.6rem;display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:1rem;}
.section-head h2{font-size:clamp(1.6rem,3vw,2.2rem);margin:0;}
.section-head p{color:var(--noyer-clair);margin:0;max-width:44ch;}

/* Galerie renovations */
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media (max-width:860px){.galerie{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.galerie{grid-template-columns:1fr;}}
.paire-avant-apres{grid-column:span 3;display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--ligne-forte);border:1px solid var(--ligne-forte);border-radius:2px;overflow:hidden;}
@media (max-width:860px){.paire-avant-apres{grid-column:span 2;}}
@media (max-width:560px){.paire-avant-apres{grid-column:span 1;grid-template-columns:1fr;}}
.paire-avant-apres .cote{position:relative;background:var(--sable);aspect-ratio:4/3;}
.paire-avant-apres .cote img{width:100%;height:100%;object-fit:cover;display:block;}
.tag-etat{position:absolute;top:10px;left:10px;font-family:var(--mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.06em;padding:4px 8px;border-radius:2px;}
.tag-avant{background:var(--noyer);color:var(--creme);}
.tag-apres{background:var(--terre);color:var(--creme);}
.legende-chantier{grid-column:1/-1;background:var(--creme);padding:12px 18px;font-size:.85rem;color:var(--noyer-clair);border-top:1px solid var(--ligne-forte);}
.legende-chantier b{color:var(--noyer);font-family:var(--sans);}
.separation-chantier{
  grid-column:1/-1;display:flex;align-items:center;gap:16px;
  margin:44px 0 26px;
}
.separation-chantier span{height:1px;background:var(--ligne-forte);flex:1;}
.separation-chantier .losange{
  flex:0 0 auto;width:7px;height:7px;background:var(--terre);
  transform:rotate(45deg);
}
@media (max-width:560px){.separation-chantier{margin:32px 0 20px;}}}

/* Cartes biens */
.grid-biens{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media (max-width:900px){.grid-biens{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.grid-biens{grid-template-columns:1fr;}}
.carte-bien{background:var(--creme);border:1px solid var(--ligne);border-radius:2px;overflow:hidden;transition:transform .18s,box-shadow .18s;}
.carte-bien:hover{transform:translateY(-4px);box-shadow:0 14px 30px -18px rgba(84,83,82,.35);}
.plan-visuel{aspect-ratio:4/3;background:var(--sable);position:relative;display:flex;align-items:center;justify-content:center;}
.plan-visuel svg{width:34px;height:34px;stroke:var(--ligne-forte);}
.statut-tag{position:absolute;top:12px;left:12px;font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.06em;background:var(--noyer);color:var(--creme);padding:5px 9px;border-radius:2px;}
.carte-bien .infos{padding:18px 20px;}
.carte-bien h4{font-family:var(--sans);font-weight:700;font-size:1rem;margin:0 0 .15em;}
.carte-bien .lieu{font-size:.85rem;color:var(--noyer-clair);margin-bottom:.8em;}
.carte-bien .meta{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:.78rem;border-top:1px dashed var(--ligne-forte);padding-top:10px;}
.carte-bien .prix{color:var(--terre);font-weight:600;}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr;}}
.coord-list{list-style:none;padding:0;margin:0 0 2rem 0;}
.coord-list li{padding:13px 0;border-top:1px solid var(--ligne);font-size:1.02rem;line-height:1.55;}
.coord-list li:first-child{border-top:none;font-family:var(--serif);font-size:1.2rem;font-weight:600;padding-top:0;}
.coord-list a{color:var(--noyer);text-decoration:none;border-bottom:1px solid var(--ligne-forte);transition:color .15s,border-color .15s;}
.coord-list a:hover{color:var(--terre);border-color:var(--terre);}
form.contact-form{display:flex;flex-direction:column;gap:18px;}
form.contact-form label{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--noyer-clair);display:block;margin-bottom:6px;}
form.contact-form input, form.contact-form select, form.contact-form textarea{width:100%;font-family:var(--sans);font-size:.95rem;padding:12px 14px;border:1px solid var(--ligne-forte);background:var(--creme);border-radius:2px;color:var(--noyer);}
form.contact-form textarea{resize:vertical;min-height:120px;}
form.contact-form button{align-self:flex-start;border:none;cursor:pointer;font-family:var(--mono);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;background:var(--terre);color:var(--creme);padding:14px 30px;border-radius:2px;transition:background .15s;}
form.contact-form button:hover{background:#e5590d;}
.placeholder-note{font-size:.82rem;color:var(--noyer-clair);margin-top:1em;}
.placeholder-flag{display:inline-block;background:rgba(255,100,15,.1);color:var(--terre);border:1px dashed var(--terre);padding:1px 6px;border-radius:2px;font-size:.85em;}

/* Résumé d'activité (accueil) */
.intro-activite{max-width:62ch;}
.intro-activite h2{font-size:clamp(1.7rem,3vw,2.4rem);}
.intro-activite p{color:var(--noyer-clair);font-size:1.05rem;}
.prestations{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--ligne);border:1px solid var(--ligne);margin-top:3rem;}
@media (max-width:560px){.prestations{grid-template-columns:1fr;}}
.prestation{background:var(--sable);padding:34px 30px;}
.prestation h3{font-family:var(--serif);font-weight:600;font-size:1.22rem;margin-bottom:.5em;}
.prestation p{color:var(--noyer-clair);font-size:.92rem;margin:0;}

/* ============ FICHES DE BIENS ============ */
.fiche-bien{display:grid;grid-template-columns:1.05fr 1fr;background:var(--creme);border:1px solid var(--ligne);border-radius:2px;overflow:hidden;margin-bottom:28px;}
@media (max-width:800px){.fiche-bien{grid-template-columns:1fr;}}
.fiche-visuel{position:relative;background:var(--sable);}
.fiche-corps{padding:34px 32px;}
@media (max-width:560px){.fiche-corps{padding:26px 22px;}}
.fiche-corps h3{font-size:1.35rem;margin-bottom:.2em;}
.fiche-corps .lieu{font-size:.9rem;color:var(--noyer-clair);margin-bottom:1.4em;}
.fiche-chiffres{display:flex;gap:2rem;flex-wrap:wrap;padding:16px 0;border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);margin-bottom:1.4em;}
.fiche-chiffres div b{display:block;font-family:var(--mono);font-size:1.15rem;color:var(--noyer);line-height:1.2;}
.fiche-chiffres div span{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.07em;color:var(--mousse);}
.fiche-chiffres .loyer b{color:var(--terre);}
.fiche-corps ul.atouts{list-style:none;padding:0;margin:0 0 1.6em;display:flex;flex-wrap:wrap;gap:8px;}
.fiche-corps ul.atouts li{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--noyer-clair);border:1px solid var(--ligne-forte);padding:5px 10px;border-radius:2px;}
.fiche-corps p.desc{font-size:.95rem;color:var(--noyer-clair);}
.fiche-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.4em;}
.btn-sm{font-size:.72rem;padding:11px 20px;}

/* ============ GALERIE : grande image + vignettes (sans JS) ============ */
.galerie-bien{background:var(--sable);height:100%;display:flex;flex-direction:column;gap:6px;padding:6px;}
.galerie-bien input{position:absolute;opacity:0;pointer-events:none;}
.gal-scene{position:relative;flex:1;min-height:260px;background:var(--ligne);border-radius:2px;overflow:hidden;}
.gal-scene figure{margin:0;position:absolute;inset:0;opacity:0;transition:opacity .35s ease;}
.gal-scene figure img{width:100%;height:100%;object-fit:cover;display:block;}
.gal-scene figcaption{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg,rgba(84,83,82,.82),transparent);color:#FBF8F2;font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;padding:28px 14px 11px;}
.gal-vignettes{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;}
.gal-vignettes label{display:block;cursor:pointer;aspect-ratio:1/1;overflow:hidden;border-radius:2px;opacity:.5;transition:opacity .18s,outline-color .18s;outline:2px solid transparent;outline-offset:-2px;}
.gal-vignettes label:hover{opacity:.85;}
.gal-vignettes label img{width:100%;height:100%;object-fit:cover;display:block;}
.g1:checked ~ .gal-scene .f1,
.g2:checked ~ .gal-scene .f2,
.g3:checked ~ .gal-scene .f3,
.g4:checked ~ .gal-scene .f4,
.g5:checked ~ .gal-scene .f5{opacity:1;}
.g1:checked ~ .gal-vignettes .v1,
.g2:checked ~ .gal-vignettes .v2,
.g3:checked ~ .gal-vignettes .v3,
.g4:checked ~ .gal-vignettes .v4,
.g5:checked ~ .gal-vignettes .v5{opacity:1;outline-color:var(--terre);}

/* ============ ONGLETS À vendre / À louer (sans JS) ============ */
.bascule{position:relative;}
.bascule > input{position:absolute;opacity:0;pointer-events:none;}
.onglets{display:flex;gap:2px;background:var(--ligne);border:1px solid var(--ligne);border-radius:2px;margin-bottom:34px;width:fit-content;}
.onglets label{font-family:var(--mono);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;background:var(--sable);color:var(--noyer-clair);cursor:pointer;padding:13px 24px;transition:background .15s,color .15s;user-select:none;}
.onglets label:hover{color:var(--noyer);}
.onglets label .compte{opacity:.6;margin-left:.5em;}
#tab-vendre:checked ~ .onglets label[for="tab-vendre"],
#tab-louer:checked ~ .onglets label[for="tab-louer"]{background:var(--noyer);color:var(--creme);}
.panneau{display:none;}
#tab-vendre:checked ~ #panneau-vendre,
#tab-louer:checked ~ #panneau-louer{display:block;}
@media (max-width:520px){.onglets{width:100%;} .onglets label{flex:1;padding:13px 8px;font-size:.66rem;text-align:center;}}

/* ============ BLOC PROMOTION ============ */
.promo{display:grid;grid-template-columns:1.15fr 1fr;border:1px solid var(--noyer);border-radius:2px;overflow:hidden;margin-bottom:28px;background:var(--creme);}
@media (max-width:860px){.promo{grid-template-columns:1fr;}}
.promo-visuel{background:var(--sable);}
.promo-corps{padding:34px 32px;}
@media (max-width:560px){.promo-corps{padding:26px 22px;}}
.promo-corps h3{font-size:clamp(1.5rem,2.6vw,2rem);margin-bottom:.15em;}
.promo-corps .lieu{font-size:.9rem;color:var(--noyer-clair);margin-bottom:1.4em;}
.promo-chiffres{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1.6rem;padding:18px 0;border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);margin-bottom:1.4em;}
.promo-chiffres div b{display:block;font-family:var(--mono);font-size:1.05rem;color:var(--noyer);line-height:1.25;}
.promo-chiffres div span{font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.07em;color:var(--mousse);}
.promo-chiffres .prix b{color:var(--terre);}

/* ============ SÉPARATION ENTRE CHANTIERS ============ */
.separation-chantier{grid-column:1/-1;display:flex;align-items:center;gap:16px;margin:44px 0 26px;}
.separation-chantier span{height:1px;background:var(--ligne-forte);flex:1;}
.separation-chantier .losange{flex:0 0 auto;width:7px;height:7px;background:var(--terre);transform:rotate(45deg);}
@media (max-width:560px){.separation-chantier{margin:32px 0 20px;}}

/* photos avant / après */
.paire-avant-apres .cote{overflow:hidden;}
.paire-avant-apres .cote img{transition:transform .35s ease;}
.paire-avant-apres .cote:hover img{transform:scale(1.03);}

/* ============ PIED DE PAGE ============ */
footer{background:var(--noyer);color:var(--sable);padding:22px 0;}
.footer-bottom{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:4px 18px;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.03em;color:#A99B84;
  max-width:var(--max);margin:0 auto;padding:0 32px;line-height:1.5;
}

/* ============ ADAPTATION MOBILE (iOS + Android) ============ */
html{-webkit-text-size-adjust:100%;}
body{overflow-x:hidden;}
img{height:auto;}

/* zones tactiles suffisantes */
nav.links a, .btn, .onglets button, .vignette, .gal-nav{touch-action:manipulation;}

/* hero : hauteur adaptée aux écrans de téléphone */
@media (max-width:700px){
  .hero-geneve{height:auto;min-height:0;aspect-ratio:3/4;max-height:76vh;}
  .hero-geneve .contenu{padding-bottom:28px;}
  .hero-geneve h1{font-size:clamp(1.7rem,7.5vw,2.4rem);max-width:14ch;}
  .hero-geneve .lede{font-size:.98rem;}
  .hero-simple{padding:44px 0 34px;}
  section{padding:52px 0;}
}

/* iOS : empêche le zoom auto sur les champs (police < 16px) */
@media (max-width:820px){
  form.contact-form input,
  form.contact-form select,
  form.contact-form textarea{font-size:16px;}
}

/* galeries et fiches sur petit écran */
@media (max-width:560px){
  .galerie-bien .principale{min-height:210px;}
  .gal-nav{padding:16px 10px;}
  .fiche-chiffres{gap:1rem 1.2rem;}
  .promo-chiffres{grid-template-columns:1fr 1fr;}
  .prestation{padding:24px 20px;}
  .footer-bottom{flex-direction:column;align-items:center;gap:3px;text-align:center;font-size:.56rem;}
}

/* Android : le survol n'existe pas, on montre l'indice en permanence */
@media (hover:none){
  .indice-zoom{opacity:.85;}
  .paire-avant-apres .cote:hover img{transform:none;}
  .apercu:hover img{transform:none;}
  .carte-bien:hover{transform:none;box-shadow:none;}
}

/* respecte les encoches iPhone */
@supports(padding:max(0px)){
  .wrap, .nav-inner, .footer-bottom{
    padding-left:max(20px, env(safe-area-inset-left));
    padding-right:max(20px, env(safe-area-inset-right));
  }
}