:root{
  --marine:#1B3A6B; --marine-d:#132a4e; --bleu:#2472C8;
  --cyan:#35C4C4; --cyan-d:#26a5a5;
  --gris:#F4F7FA; --bord:#e2e8f0; --texte:#1f2937; --muted:#5b6b7f;
}
*{box-sizing:border-box}
body{background:#fff;color:var(--texte);-webkit-font-smoothing:antialiased;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.65}
h1,h2,h3{color:var(--marine);font-weight:700;letter-spacing:-.015em}
h1{font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.2}
h2{font-size:clamp(1.15rem,2vw,1.45rem);margin-top:2.2rem}
a{color:var(--bleu);text-underline-offset:2px}
a:hover{color:var(--marine)}
.lead{font-size:1.08rem;color:var(--muted)}

/* header */
.site-head{background:#fff;border-bottom:1px solid var(--bord);position:sticky;top:0;z-index:50}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;
  gap:1rem;max-width:1140px;margin:0 auto;padding:.7rem 1rem}
.site-head img{height:44px;width:auto;display:block}
.btn-tel{background:var(--cyan);color:#fff!important;font-weight:700;border-radius:999px;
  padding:.6rem 1.15rem;text-decoration:none;white-space:nowrap;display:inline-block;
  transition:background .15s}
.btn-tel:hover{background:var(--cyan-d);color:#fff!important}

/* hero */
.hero{position:relative;min-height:clamp(300px,42vw,440px);display:flex;align-items:center;
  background:var(--marine);overflow:hidden;margin-bottom:2rem}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.30}
.hero .inner{position:relative;max-width:1140px;margin:0 auto;padding:2.5rem 1rem;color:#fff}
.hero h1{color:#fff;max-width:20ch}
.hero p{color:rgba(255,255,255,.9);max-width:52ch;font-size:1.1rem}

/* visuel service */
.svc-visual{border-radius:14px;overflow:hidden;margin:0 0 1.6rem;aspect-ratio:16/7;background:var(--gris)}
.svc-visual img{width:100%;height:100%;object-fit:cover;display:block}

/* cartes */
.card{border:1px solid var(--bord)!important;border-radius:12px!important;
  transition:border-color .15s,transform .15s,box-shadow .15s;overflow:hidden}
.card:hover{border-color:var(--cyan)!important;transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(27,58,107,.09)}
.card .fw-semibold{color:var(--marine)}
.card-thumb{aspect-ratio:16/10;overflow:hidden;background:var(--gris)}
.card-thumb img{width:100%;height:100%;object-fit:cover;display:block}

/* badges villes */
.badge.text-bg-secondary{background:var(--gris)!important;color:var(--marine)!important;
  border:1px solid var(--bord);font-weight:600;font-size:.85rem;padding:.5rem .9rem;
  border-radius:999px;transition:all .15s}
.badge.text-bg-secondary:hover{background:var(--marine)!important;color:#fff!important;
  border-color:var(--marine)}

/* sections texte */
main section p{max-width:72ch}
.bloc{background:var(--gris);border-left:3px solid var(--cyan);
  border-radius:0 10px 10px 0;padding:1.1rem 1.3rem;margin:1.2rem 0}

/* CTA */
.cta{background:var(--marine);border-radius:14px;padding:2rem 1.5rem;text-align:center;
  color:#fff;margin:2.5rem 0}
.cta h2{color:#fff;margin-top:0}
.cta p{color:rgba(255,255,255,.85)}
.cta .btn-tel{font-size:1.18rem;padding:.8rem 1.8rem;margin-top:.6rem}

/* footer */
footer{background:var(--marine)!important;color:rgba(255,255,255,.8);border:0!important}
footer a{color:var(--cyan)!important}
footer img{height:38px;margin-bottom:.8rem}

nav[aria-label] a{color:var(--muted);font-size:.9rem;text-decoration:none}
nav[aria-label] a:hover{color:var(--bleu);text-decoration:underline}

/* --- banner panoramique --- */
.hero{background:#fff;display:block;min-height:0;margin-bottom:2.5rem;overflow:hidden}
.hero img{position:static;width:100%;height:auto;opacity:1;display:block;aspect-ratio:1920/823;object-fit:cover}
.hero .inner{position:absolute;top:50%;left:0;transform:translateY(-50%);
  width:min(46%,560px);padding:0 0 0 clamp(1rem,4vw,3.5rem);color:var(--texte)}
.hero{position:relative}
.hero h1{color:var(--marine);max-width:none}
.hero p{color:var(--muted);font-size:1.02rem}
.hero .btn-tel{margin-top:.9rem}
@media(max-width:820px){
  .hero .inner{position:static;transform:none;width:auto;
    padding:1.4rem clamp(1rem,4vw,2rem) .4rem;text-align:center}
  .hero p{margin-left:auto;margin-right:auto}
}
