/* ============================================================
   MF BUILDING SA — Pages Services (FR)
   Additive to /assets/css/base.css — système commun réutilisable
   sur les 7 pages services. Ne modifie pas les règles partagées,
   ne modifie ni contenus ni structure SEO (head/schema inchangés).
   ============================================================ */

:root{
  --r-media:6px;
  --space-minor:clamp(44px,5vw,72px);
}

/* ---------- HERO SERVICE : respirations ---------- */
.svc-hero{padding:44px 0 52px}

/* ---------- HERO SERVICE : variante avec photo (quand une bonne photo existe) ---------- */
.svc-hero.has-media .wrap.svc-hero-grid{
  display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;
}
.svc-hero .hero-media{
  position:relative;border-radius:var(--r-media);overflow:hidden;
  box-shadow:0 26px 54px -28px rgba(11,34,48,.45);
  aspect-ratio:4/5;background:var(--ink);
}
.svc-hero .hero-media img{width:100%;height:100%;object-fit:cover;display:block}
.svc-hero .hero-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(23,24,28,0) 50%,rgba(23,24,28,.72) 100%);
}
.svc-hero .hero-media .hm-cap{
  position:absolute;left:18px;right:18px;bottom:14px;z-index:2;
  font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.08em;
  color:rgba(255,255,255,.88);
}
.svc-hero .hero-media .hm-cap b{
  display:block;color:#fff;font-family:"Archivo",sans-serif;font-weight:700;
  letter-spacing:0;font-size:13.5px;margin-bottom:2px;
}
@media (min-width:901px){ .svc-hero .hero-media{aspect-ratio:auto;height:100%} }
@media (max-width:900px){
  .svc-hero.has-media .wrap.svc-hero-grid{display:flex;flex-direction:column}
  .svc-hero .hero-media{order:-1;margin-bottom:28px;aspect-ratio:16/10}
}

/* ---------- CORPS DE PAGE : respirations ---------- */
section.block.svc-content{padding:var(--space-minor) 0}
.article h2{margin-top:40px}
.article h2:first-child{margin-top:0}

/* ---------- ASIDE : moins "bloc commercial", plus éditorial ---------- */
.aside{padding:36px 32px 32px}
.aside::before{content:"";display:block;width:34px;height:2px;background:var(--hi);margin-bottom:18px}
.aside h3{margin-bottom:12px}
.aside p{margin-bottom:26px}
.aside .btn{margin-bottom:16px}
.aside .tel{
  margin-top:0;margin-bottom:24px;padding-bottom:24px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.aside .mini-list{margin-top:0}
.aside .mini-list a{
  background:none;padding:12px 2px;border-radius:0;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.aside .mini-list a:last-child{border-bottom:0}
.aside .mini-list a:hover{background:none;color:var(--hi)}

/* ---------- FAQ : rythme cohérent avec la homepage ---------- */
.faq{padding:var(--space-minor) 0}

/* ---------- ICONES CTA (cohérence avec la homepage) ---------- */
.hero-cta .btn svg{flex:0 0 auto}