*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#101820;background:#f7f8fa}header{height:76px;padding:0 5%;display:flex;align-items:center;gap:35px;background:#09111a;color:#fff;position:sticky;top:0;z-index:10}.brand{color:#fff;text-decoration:none;line-height:.8}.brand b{font-size:31px;font-style:italic;letter-spacing:-2px}.brand span{display:block;font-size:8px;letter-spacing:3px;color:#ffc400}nav{display:flex;gap:27px;margin-left:auto}nav a{color:#fff;text-decoration:none;font-size:14px}.outline{color:#ffc400;border:1px solid #ffc400;border-radius:7px;padding:12px 16px;text-decoration:none}.hero{height:650px;background:url('hero-tbl.png') center/cover no-repeat}.overlay{height:100%;background:linear-gradient(90deg,rgba(4,10,16,.92),rgba(4,10,16,.45) 48%,rgba(4,10,16,.03));display:flex;align-items:center}.copy{margin-left:5%;max-width:650px;color:#fff}.kicker,.section-title span,.yellow{color:#ffc400;font-size:12px;font-weight:800;letter-spacing:2px}.copy h1{font-size:60px;line-height:1.02;margin:12px 0}.copy h1 em{font-style:normal;color:#ffc400}.copy p{font-size:19px;line-height:1.55;max-width:580px}.actions{display:flex;gap:12px;margin-top:28px}.primary,.secondary,.quote button{padding:15px 21px;border-radius:7px;text-decoration:none;font-weight:800}.primary,.quote button{background:#ffc400;color:#111;border:0}.secondary{color:#fff;border:1px solid #fff}.wrap{max-width:1180px;margin:auto}.quote{background:#fff;margin-top:-55px;position:relative;padding:27px;border-radius:13px;box-shadow:0 18px 55px #0002}.section-title h2{font-size:34px;margin:7px 0 22px}.quote form{display:grid;grid-template-columns:1.2fr 1.2fr .8fr 1fr auto;gap:11px}.quote label{font-size:12px;font-weight:700}.quote input,.quote select{width:100%;padding:14px;margin-top:7px;border:1px solid #d8dde2;border-radius:6px;background:#fff}.quote button{align-self:end}.request{margin-top:18px;padding:18px;background:#101820;color:#fff;border-radius:8px}.hidden{display:none}.section{padding:78px 25px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.grid article{background:#fff;border:1px solid #e0e4e8;padding:27px;border-radius:10px}.grid i{font-style:normal;font-size:34px}.grid p,.two p,.steps p{color:#626c76;line-height:1.55}.dark{background:#0b131c;color:#fff}.two{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center}.two h2{font-size:38px;margin:8px 0}.dark .two p{color:#c2c9cf}.checks{display:grid;gap:16px}.checks b{padding:17px;border-bottom:1px solid #ffffff25}.region{background:#101820;color:#fff;border-radius:15px;min-height:250px;display:flex;align-items:center;justify-content:center;gap:25px;font-size:65px;font-weight:900}.region span{color:#ffc400}.region small{display:block;font-size:11px;font-weight:400;align-self:flex-end;margin-bottom:30px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.steps b{display:grid;place-items:center;background:#ffc400;border-radius:50%;width:42px;height:42px}.contact{background:#e9edf1;padding:70px 25px}.contact-card{background:#fff;border-radius:12px;padding:30px;display:grid;gap:15px}.contact-card a{font-size:20px;color:#101820;font-weight:800;text-decoration:none}footer{padding:30px 5%;background:#070d13;color:#9aa3aa;display:flex;align-items:center;justify-content:space-between;font-size:12px}@media(max-width:900px){nav{display:none}.hero{height:580px}.copy h1{font-size:45px}.quote{margin:0;border-radius:0}.quote form{grid-template-columns:1fr 1fr}.quote button{grid-column:1/-1}.grid,.steps{grid-template-columns:1fr 1fr}.two{grid-template-columns:1fr}.region{min-height:180px}footer{gap:20px;flex-wrap:wrap}}@media(max-width:560px){header{padding:0 18px}.outline{margin-left:auto;font-size:12px}.hero{height:560px;background-position:62% center}.copy{margin:0 20px}.copy h1{font-size:39px}.copy p{font-size:16px}.actions{flex-direction:column;align-items:flex-start}.quote form,.grid,.steps{grid-template-columns:1fr}.section{padding:55px 20px}.section-title h2,.two h2{font-size:30px}.region{font-size:48px}footer{display:block}.brand{margin-bottom:18px}}
.loading{margin-top:18px;padding:16px;border-radius:8px;background:#fff8db;color:#5a4700;font-weight:700}
.map{height:330px;margin-top:18px;border-radius:10px;overflow:hidden;border:1px solid #d8dde2}
.quote-note{font-size:11px;color:#727b83;line-height:1.45;margin:15px 0 0}
.price-result{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}
.price-result h3{font-size:36px;color:#ffc400;margin:4px 0}
.price-result p{margin:5px 0;color:#d7dde2}
.price-breakdown{font-size:12px!important;color:#9fa9b2!important}
.book-btn{display:inline-block;background:#ffc400;color:#111;padding:14px 18px;border-radius:7px;text-decoration:none;font-weight:800}
.error{background:#4a1717!important;color:#fff!important}
@media(max-width:560px){.price-result{grid-template-columns:1fr}.map{height:260px}}

.send-actions{display:grid;gap:9px;min-width:240px}
.mail-btn{display:block;text-align:center;color:#fff;border:1px solid #ffffff55;padding:12px 16px;border-radius:7px;text-decoration:none;font-weight:700}
.delivery-note{margin-top:15px;padding-top:14px;border-top:1px solid #ffffff20;font-size:12px;color:#aeb7bf}

.jumpy-limit{margin-top:16px;padding:13px 15px;background:#fff8db;border-left:4px solid #ffc400;border-radius:5px;font-size:12px;color:#3d3a2c}

.order-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:18px}
.order-card{background:#fff;border:1px solid #e0e4e8;border-radius:12px;padding:25px;margin-bottom:18px}
.order-card h3{margin-top:0}.order-card label{display:block;font-size:12px;font-weight:700;margin:12px 0}
.order-card input,.order-card textarea{width:100%;padding:13px;border:1px solid #d6dce1;border-radius:7px;margin-top:6px;font:inherit}
.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mini-grid.three{grid-template-columns:repeat(3,1fr)}
.order-card small{color:#737d85;line-height:1.4}.check{display:flex!important;gap:9px;align-items:center}.check input{width:auto!important;margin:0!important}
.compatibility{margin-top:16px;padding:14px;border-radius:7px;background:#eef2f5;font-size:13px}
.compatibility.ok{background:#e5f7e9;color:#155c25}.compatibility.warn{background:#fff0dc;color:#7a4600}.compatibility.no{background:#ffe4e4;color:#7b1616}
.final-actions{display:flex;justify-content:flex-end;gap:12px}.primary-btn,.confirm-btn{border:0;border-radius:7px;padding:15px 20px;font-weight:800;cursor:pointer}
.primary-btn{background:#101820;color:#fff}.confirm-btn{background:#ffc400;color:#111}.confirm-btn:disabled{opacity:.35;cursor:not-allowed}
.order-summary{margin-top:20px;background:#0b131c;color:#fff;border-radius:10px;padding:22px;line-height:1.6}
@media(max-width:700px){.order-grid{grid-template-columns:1fr}.mini-grid.three{grid-template-columns:1fr 1fr}.final-actions{flex-direction:column}.primary-btn,.confirm-btn{width:100%}}

/* V7 — optimisation téléphone */
html,body{max-width:100%;overflow-x:hidden}
img,svg{max-width:100%}
@media(max-width:700px){
  header{height:68px;padding:0 18px;gap:10px;position:relative}
  header .brand b{font-size:27px}
  header .outline{padding:10px 12px;font-size:11px;white-space:nowrap}
  .hero{
    height:auto;
    min-height:0;
    background-position:67% center;
    background-size:cover;
  }
  .hero .overlay{
    min-height:600px;
    padding:210px 0 35px;
    align-items:flex-end;
    background:
      linear-gradient(180deg,rgba(4,10,16,.05) 0%,rgba(4,10,16,.18) 30%,rgba(4,10,16,.92) 64%,rgba(4,10,16,.98) 100%);
  }
  .copy{margin:0;padding:0 22px;width:100%;max-width:none}
  .kicker{font-size:11px;letter-spacing:1.6px}
  .copy h1{font-size:38px;line-height:1.03;margin:10px 0 14px;letter-spacing:-1px}
  .copy p{font-size:16px;line-height:1.45;margin:0;max-width:100%}
  .actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:22px}
  .actions a{width:100%;text-align:center;padding:15px 12px}
  .quote{margin:0;padding:32px 20px;border-radius:0;box-shadow:none;width:100%}
  .quote form{display:grid;grid-template-columns:1fr;gap:14px}
  .quote label{font-size:13px}
  .quote input,.quote select{font-size:16px;min-height:50px;margin-top:7px}
  .quote button{grid-column:auto;width:100%;min-height:52px}
  .section-title h2{font-size:30px;line-height:1.1}
  .grid,.steps,.two,.order-grid{grid-template-columns:1fr}
  .mini-grid,.mini-grid.three{grid-template-columns:1fr 1fr}
  .section{padding:52px 20px}
  .region{font-size:43px;min-height:160px}
  .price-result{grid-template-columns:1fr}
  .send-actions{min-width:0;width:100%}
  .map{height:260px}
  .order-card{padding:20px}
  .final-actions{display:grid;grid-template-columns:1fr}
  .primary-btn,.confirm-btn{width:100%;min-height:50px}
  .contact{padding:52px 20px}
  footer{padding:30px 20px;display:block}
  footer p{margin:10px 0}
}
@media(max-width:380px){
  .copy h1{font-size:34px}
  .hero .overlay{padding-top:190px}
  .mini-grid,.mini-grid.three{grid-template-columns:1fr}
}

/* V8 final mobile hero */
.mobile-van{display:none}
@media(max-width:700px){
 .hero{background:#071019!important;position:relative}
 .hero .mobile-van{
   display:block;
   height:250px;
   background:url("hero-mobile.jpg") 58% 48%/cover no-repeat;
   position:absolute;top:0;left:0;right:0;
 }
 .hero .mobile-van:after{
   content:"";position:absolute;inset:0;
   background:linear-gradient(180deg,rgba(7,16,25,.02),rgba(7,16,25,.15) 55%,#071019 100%);
 }
 .hero .overlay{
   position:relative;
   min-height:0!important;
   padding:220px 0 34px!important;
   background:linear-gradient(180deg,transparent 0 28%,rgba(7,16,25,.88) 43%,#071019 60%)!important;
 }
 .copy{position:relative;z-index:2}
 .copy h1{font-size:36px!important;line-height:1.04!important}
 .copy p{font-size:16px!important}
}

/* V9 — centrage mobile */
@media(max-width:700px){
  .hero .mobile-van{
    left:0!important; right:0!important; width:100%!important;
    background-position:70% 48%!important;
  }
  .copy{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto!important;
    padding-left:24px!important;
    padding-right:24px!important;
    box-sizing:border-box!important;
  }
  .copy .kicker{
    text-align:center!important;
    display:block!important;
  }
  .copy h1{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
    max-width:620px!important;
  }
  .copy p{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
    max-width:560px!important;
  }
  .actions{
    width:100%!important;
    max-width:560px!important;
    margin:24px auto 0!important;
  }
  .actions a{
    box-sizing:border-box!important;
    margin:0!important;
  }
  .quote,.section,.contact{
    box-sizing:border-box!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

@media(max-width:700px){
.hero{background:#071019!important}
.hero .mobile-van{display:block!important;height:300px!important;position:absolute!important;top:0!important;left:0!important;right:0!important;width:100%!important;background:url("hero-clean.jpg") 55% center/cover no-repeat!important}
.hero .mobile-van:after{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(180deg,rgba(7,16,25,0),rgba(7,16,25,.05) 58%,#071019 100%)!important}
.hero .overlay{padding:270px 0 38px!important;background:linear-gradient(180deg,transparent 0 25%,rgba(7,16,25,.75) 39%,#071019 53%)!important}
.copy{width:100%!important;padding:0 24px!important;margin:0 auto!important;box-sizing:border-box!important;text-align:center!important}
.copy .kicker,.copy h1,.copy p{text-align:center!important;margin-left:auto!important;margin-right:auto!important}
.copy h1{font-size:36px!important;line-height:1.04!important}
.actions{width:100%!important;max-width:560px!important;margin:24px auto 0!important}
}
