:root{
  --ocre:#c6782a;--ocre-d:#a35f1c;--terre:#7a4a24;--sable:#f6efe6;--sable-d:#ecdfcd;
  --bleu:#15314d;--bleu-d:#0d2238;--ink:#1e1a16;--muted:#6b6259;--white:#fff;
  --r:14px;--shadow:0 10px 30px rgba(30,26,22,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--white);line-height:1.55}
h1,h2,h3{font-family:Fraunces,Georgia,serif;line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(2rem,6vw,3.4rem)}h2{font-size:clamp(1.6rem,4vw,2.4rem)}h3{font-size:1.15rem}
p{margin:0 0 1em}a{color:var(--bleu)}
img,svg{max-width:100%}
.muted{color:var(--muted)}.center{text-align:center}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;font-weight:600;color:var(--ocre);margin-bottom:.6em}
.tag{display:inline-block;font-style:normal;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;background:var(--sable-d);color:var(--terre);padding:.1em .5em;border-radius:999px;vertical-align:middle;margin-left:.3em}

.demo-band{background:var(--bleu-d);color:#cfd9e4;font-size:.75rem;text-align:center;padding:.4rem .8rem}

/* top bar */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1rem;padding:.7rem 1rem;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--sable-d)}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);margin-right:auto}
.brand-mark{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--ocre),var(--terre));color:#fff;font-family:Fraunces,serif;font-weight:700;font-size:1.4rem;display:grid;place-items:center}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-text strong{font-size:1rem;letter-spacing:.05em}.brand-text small{font-size:.65rem;color:var(--muted)}
.nav{display:none;gap:1.2rem}
.nav a{text-decoration:none;color:var(--ink);font-weight:500;font-size:.95rem}
.nav a:hover{color:var(--ocre)}
.topbar-tel{display:none}
.burger{background:none;border:0;width:40px;height:40px;display:flex;flex-direction:column;justify-content:center;gap:5px;cursor:pointer;padding:8px}
.burger span{height:2px;background:var(--ink);border-radius:2px}
.nav.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:#fff;padding:1rem;border-bottom:1px solid var(--sable-d);box-shadow:var(--shadow)}

/* buttons */
.btn{display:inline-block;padding:.85rem 1.4rem;border-radius:999px;font-weight:600;text-decoration:none;border:2px solid transparent;cursor:pointer;font-size:.95rem;font-family:inherit;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--ocre);color:#fff;box-shadow:0 8px 20px rgba(198,120,42,.3)}
.btn-primary:hover{background:var(--ocre-d)}
.btn-outline{border-color:var(--bleu);color:var(--bleu);background:transparent}
.btn-outline:hover{background:var(--bleu);color:#fff}
.btn-ghost{color:var(--bleu);padding:.5rem .9rem;border-color:var(--sable-d)}

/* hero */
.hero{display:grid;gap:2rem;padding:3rem 1.25rem 2.5rem;background:radial-gradient(circle at 85% 10%,#fbe4c8 0,transparent 40%),linear-gradient(180deg,var(--sable) 0,#fff 100%)}
.hero h1 em{font-style:normal;color:var(--ocre)}
.lead{font-size:1.1rem;color:#3d352d;max-width:34rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.5rem 0}
.hero-points{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;font-size:.9rem;color:var(--muted)}
.hero-points li::before{content:"✓ ";color:var(--ocre);font-weight:700}
.hero-visual{display:grid;place-items:center}
.house{position:relative;width:min(100%,320px);aspect-ratio:1.1}
.roof{position:absolute;left:0;right:0;top:0;height:40%;background:linear-gradient(135deg,var(--terre),var(--ocre));clip-path:polygon(50% 0,100% 100%,0 100%)}
.walls{position:absolute;left:8%;right:8%;top:40%;bottom:10%;background:linear-gradient(180deg,#fff7ee,#f1e4d2);border:3px solid var(--bleu);border-radius:0 0 8px 8px;display:flex;justify-content:space-around;align-items:flex-end;padding:0 6% 0}
.door{width:18%;height:55%;background:var(--bleu);border-radius:6px 6px 0 0}
.win{width:20%;height:30%;margin-bottom:28%;background:linear-gradient(180deg,#9fd3ff,#4f9bd6);border:3px solid var(--bleu);border-radius:4px}
.ground{position:absolute;left:-5%;right:-5%;bottom:0;height:10%;background:linear-gradient(180deg,#8fb57a,#5d8a4c);border-radius:999px}

/* trust */
.trust{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:1.5rem 1.25rem;background:var(--bleu);color:#fff}
.trust-item{display:flex;gap:.7rem;align-items:flex-start}
.trust-item svg{width:30px;height:30px;flex:none;color:#f0c38e}
.trust-item strong{display:block;font-size:.95rem}.trust-item span{font-size:.78rem;color:#b8c6d6}
.trust-item .tag{background:#2a4a6b;color:#f0c38e}

/* sections */
.section{padding:3.5rem 1.25rem;max-width:1140px;margin:0 auto}
.section.alt{max-width:none;background:var(--sable)}
.section.alt>*{max-width:1140px;margin-left:auto;margin-right:auto}
.section-head{max-width:46rem;margin-bottom:2rem}
.grid{display:grid;gap:1.2rem}
.card{background:#fff;border:1px solid var(--sable-d);border-radius:var(--r);padding:1.5rem;box-shadow:var(--shadow)}
.card svg{width:40px;height:40px;color:var(--ocre);margin-bottom:.8rem}
.card p{margin:0;color:var(--muted);font-size:.95rem}

/* realisations */
.realisation{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.photo{aspect-ratio:4/3;display:flex;align-items:flex-end;padding:1rem;color:#fff;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,.4);position:relative}
.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.45))}
.photo span{position:relative;z-index:1}
.p1{background:linear-gradient(135deg,#d9a066,#7a4a24)}
.p2{background:linear-gradient(135deg,#6f8aa6,#15314d)}
.p3{background:linear-gradient(135deg,#e5c9a3,#a35f1c)}
.p4{background:linear-gradient(135deg,#8fc1e0,#2b5876)}
.p5{background:linear-gradient(135deg,#b7a27f,#5c4a2b)}
.p6{background:linear-gradient(135deg,#9bc48a,#3f6b3a)}
.realisation-body{padding:1rem 1.2rem 1.2rem}
.meta{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem;font-size:.8rem}
.meta li{background:var(--sable);color:var(--terre);padding:.2em .7em;border-radius:999px;font-weight:500}

/* prices */
.price{background:#fff;border:1px solid var(--sable-d);border-radius:var(--r);padding:1.5rem;border-top:4px solid var(--ocre)}
.amount{font-family:Fraunces,serif;font-size:1.6rem;font-weight:700;color:var(--bleu);margin:.2em 0 .5em}
.amount small{display:block;font-family:Inter,sans-serif;font-size:.8rem;font-weight:500;color:var(--muted)}
.price p:last-child{margin:0;font-size:.9rem;color:var(--muted)}

/* suivi */
.suivi{display:grid;gap:2.5rem;align-items:center}
.checklist{list-style:none;padding:0;margin:0 0 1.5rem}
.checklist li{padding-left:1.8rem;position:relative;margin-bottom:.8rem}
.checklist li::before{content:"";position:absolute;left:0;top:.35em;width:1.1em;height:1.1em;border-radius:50%;background:var(--ocre);box-shadow:inset 0 0 0 3px #fff,0 0 0 2px var(--ocre)}
.phone{justify-self:center;width:270px;padding:12px;background:var(--bleu-d);border-radius:36px;box-shadow:0 30px 60px rgba(13,34,56,.35)}
.phone-screen{background:#fff;border-radius:26px;padding:1.4rem 1rem 1rem;font-size:.8rem}
.ph-head{display:flex;justify-content:space-between;font-weight:600;margin-bottom:.4rem}
.ph-head b{color:var(--ocre)}
.ph-bar{height:8px;background:var(--sable-d);border-radius:999px;overflow:hidden;margin-bottom:1rem}
.ph-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--ocre),var(--terre))}
.ph-step{display:flex;align-items:center;gap:.5rem;padding:.35rem 0;color:var(--muted)}
.ph-step i{width:12px;height:12px;border-radius:50%;border:2px solid var(--sable-d);flex:none}
.ph-step.done i{background:#4c9a5e;border-color:#4c9a5e}.ph-step.done{color:var(--ink)}
.ph-step.now i{background:var(--ocre);border-color:var(--ocre);box-shadow:0 0 0 4px #fbe4c8}.ph-step.now{color:var(--ink);font-weight:600}
.ph-step small{margin-left:auto;font-size:.7rem}
.ph-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin:.8rem 0}
.ph-photos div{aspect-ratio:1;border-radius:8px;background:linear-gradient(135deg,#d9a066,#7a4a24)}
.ph-photos div:nth-child(2){background:linear-gradient(135deg,#9fb8cf,#15314d)}
.ph-photos div:nth-child(3){background:linear-gradient(135deg,#c5c5c5,#6f6f6f)}
.ph-alert{background:#eaf5ec;color:#2f6b3e;padding:.5rem .7rem;border-radius:8px;font-size:.72rem;font-weight:500}

/* reviews */
.review{margin:0;background:#fff;border-radius:var(--r);padding:1.5rem;box-shadow:var(--shadow)}
.stars{color:var(--ocre);letter-spacing:.1em;margin-bottom:.5rem}
.review p{font-style:italic}
.review footer{font-size:.85rem;color:var(--muted);font-weight:500}

/* steps */
.steps{list-style:none;padding:0;margin:0;display:grid;gap:1.2rem;counter-reset:s}
.steps li{position:relative;padding:1.2rem 1.2rem 1.2rem 4rem;background:#fff;border:1px solid var(--sable-d);border-radius:var(--r)}
.steps li span{position:absolute;left:1.1rem;top:1.1rem;width:2rem;height:2rem;border-radius:50%;background:var(--bleu);color:#fff;display:grid;place-items:center;font-weight:700;font-family:Fraunces,serif}
.steps h3{margin-bottom:.2em}.steps p{margin:0;color:var(--muted);font-size:.92rem}

/* zone */
.communes{list-style:none;padding:0;margin:0 auto 1rem;display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}
.communes li{background:#fff;border:1px solid var(--sable-d);padding:.5em 1.1em;border-radius:999px;font-weight:500}

/* contact */
.contact{display:grid;gap:2.5rem}
address{font-style:normal;margin:1.5rem 0 .8rem;line-height:1.7}
.hours{font-size:.9rem;color:var(--muted)}
.form{background:#fff;border:1px solid var(--sable-d);border-radius:var(--r);padding:1.5rem;box-shadow:var(--shadow);display:grid;gap:.9rem}
.form h3{margin:0}
.form label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;font-weight:500;color:#3d352d}
.form input,.form select,.form textarea{font:inherit;padding:.65rem .8rem;border:1px solid #d9cdbc;border-radius:10px;background:#fffdfa}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--ocre);border-color:transparent}
.form .row{display:grid;gap:.9rem}
.consent{flex-direction:row!important;align-items:flex-start;font-weight:400!important}
.consent input{margin-top:.2rem}
.form-msg{margin:0;font-size:.9rem;color:#2f6b3e;min-height:1.2em}

/* footer */
.footer{background:var(--bleu-d);color:#b8c6d6;padding:2.5rem 1.25rem 1.5rem;font-size:.88rem}
.footer a{color:#f0c38e}
.footer-cols{display:grid;gap:1.5rem;max-width:1140px;margin:0 auto 1.5rem}
.footer strong{color:#fff;display:block;margin-bottom:.3rem}
.footer p{margin:0}
.footer-note{text-align:center;font-size:.75rem;color:#7f93a8}

/* responsive */
@media (min-width:640px){
  .form .row{grid-template-columns:1fr 1fr}
  .cards-3,.cards-4,.cards-5{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .trust{grid-template-columns:repeat(4,1fr)}
  .footer-cols{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:900px){
  .nav{display:flex}.burger{display:none}.topbar-tel{display:inline-block}
  .topbar{padding:.8rem 2rem}
  .hero{grid-template-columns:1.2fr 1fr;align-items:center;padding:5rem 2rem 4rem;max-width:1140px;margin:0 auto}
  .cards-3{grid-template-columns:repeat(3,1fr)}
  .cards-4{grid-template-columns:repeat(4,1fr)}
  .cards-5{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(3,1fr)}
  .suivi{grid-template-columns:1.1fr 1fr}
  .contact{grid-template-columns:1fr 1.2fr}
}