/* SOSBA SERVICES CSS — v1.0.0 (04.10.2026)
   Feuille de la page Services. Tokens, polices, header/footer et classes
   communes : sosba-global.css. */

/* ---------- intro ---------- */
.sb-intro{ padding:64px 0 56px; }
.sb-services .sb-intro .sb-eyebrow{ color:var(--sb-laiton); }
.sb-services .sb-intro h1{
  margin:8px 0 0; font:500 clamp(34px,5vw,54px)/1.08 var(--sb-font-display); color:#E9EEEC;
}
.sb-intro p{ margin:16px 0 0; max-width:58ch; }
.sb-sommaire{ display:flex; flex-wrap:wrap; gap:4px 22px; margin-top:28px; }
.sb-services .sb-sommaire a{
  color:var(--sb-lien-sur-nuit); text-decoration:none; font-size:14px;
  min-height:44px; display:inline-flex; align-items:center;
  border-bottom:1px solid rgba(184,151,90,.35);
}
.sb-services .sb-sommaire a:hover{ color:var(--sb-laiton-clair); border-bottom-color:var(--sb-laiton); }

/* ---------- métiers ---------- */
.sb-metier{ scroll-margin-top:72px; }
.sb-metier--alt{ background:#E4EBE7; }
.sb-metier__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:48px; }
.sb-metier__titre .sb-morse{ margin-bottom:18px; }
.sb-metier__phrase{
  margin:10px 0 0; font:italic 500 22px/1.3 var(--sb-font-display); color:var(--sb-encre-2);
}
.sb-metier .sb-list{ margin-top:0; }

.sb-exemple{
  margin-top:24px; padding:18px 22px; background:var(--sb-carte);
  border-left:3px solid var(--sb-laiton); border-radius:0 4px 4px 0;
}
.sb-exemple p{ margin:0; color:var(--sb-encre-2); }
.sb-services .sb-exemple .sb-exemple__label{
  margin-bottom:6px; font-size:12px; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--sb-accent);
}

/* ---------- formats (bandeau sombre) ---------- */
#formats{ scroll-margin-top:72px; }
#formats .sb-eyebrow{ color:var(--sb-laiton); }
#formats h2{ color:#E9EEEC; }
.sb-format{ border-top:1px solid rgba(184,151,90,.35); padding-top:16px; }
.sb-services .sb-format h3{ color:var(--sb-laiton-clair); }
.sb-format p{ margin:8px 0 0; }
.sb-note{ margin:32px 0 0; font-style:italic; }

/* ---------- outils ---------- */
#outils{ scroll-margin-top:72px; }
.sb-card{ display:flex; flex-direction:column; }
.sb-tag{
  display:inline-block; margin-top:14px; font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--sb-encre-2);
}

/* ---------- appel final ---------- */
.sb-cta{ padding-top:0; }
.sb-cta__box{ border-radius:4px; padding:48px 32px; text-align:center; }
.sb-cta__box h2{ color:#E9EEEC; }
.sb-cta__box p{ margin:14px auto 26px; max-width:52ch; }

@media (max-width:760px){
  .sb-intro{ padding:44px 0 40px; }
  .sb-metier__grid{ grid-template-columns:1fr; gap:20px; }
  .sb-cta__box{ padding:36px 20px; }
}