/* ── REPRISE (IA + humain) ── bloo-header ──
 * FICHIER : assets/css/www/www-agences-campagnes.css
 * ROLE : Styles de la landing « Vos campagnes. Leurs prochaines rencontres. » (/agences-campagnes) : héros avec
 *        illustration IA, maillon manquant, 4 bénéfices (cartes), encart enseigne, construire son offre, bande CTA.
 * ENTREES/SORTIES : Préfixe .ac-* et classe du body .bloo-www-ac. Ruptures 900 et 560 px.
 * DEPEND : /assets/css/bloo-www-2026.css (jetons --surf, --surf-2, --line, --ink, --ink-2, --ink-3, --brand, --maxw,
 *          --r, --r-l, --shadow ; .wrap, .sec, .lede, .eyebrow, .cta-band, .btn, .page-hero).
 * APPELE PAR : www/www-agences-campagnes.html via $PAGE['head'] (<link> ?v= = empreinte SHA-256).
 * REPRISE :
 *   - Couleurs : uniquement les jetons du site (clair/sombre). Cibles tactiles ≥ 44 px.
 * MAJ :
 *   - 2026-10-13 · rel3011 · création
 * ── fin REPRISE ── */

.ac-crumbs{max-width:var(--maxw);margin:0 auto;padding:10px 22px 0;font-size:13px;color:var(--ink-3)}
.ac-crumbs ol{list-style:none;margin:0;padding:0;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ac-crumbs li+li::before{content:"\203A";margin-right:6px;color:var(--ink-3)}
.ac-crumbs a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-2);text-decoration:underline;text-underline-offset:2px}

.ac-hero{padding-top:26px}
.ac-hero h1{font-size:clamp(30px,4.8vw,52px);margin:12px auto 0;max-width:20ch}
.ac-lede{max-width:70ch;color:var(--ink-2);line-height:1.7}
.ac-hero .ac-lede{margin:14px auto 0}
.ac-cta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:22px}
.bloo-www-ac .btn-lg{max-width:100%;white-space:normal;min-height:44px}
.ac-hero-fig{max-width:1060px;margin:28px auto 0}
.ac-hero-fig img{display:block;width:100%;height:auto;aspect-ratio:1536/1024;object-fit:cover;border-radius:var(--r-l);border:1px solid var(--line);box-shadow:var(--shadow)}
.ac-note{margin:10px auto 0;max-width:860px;font-size:13px;line-height:1.55;color:var(--ink-2);text-align:center}

.ac-body{max-width:70ch;color:var(--ink-2);line-height:1.7}

.ac-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:22px}
.ac-card{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow)}
.ac-card>i{font-size:22px;color:var(--brand)}
.ac-card h3{margin:12px 0 6px;font-size:19px;color:var(--ink)}
.ac-card p{margin:0;color:var(--ink-2);line-height:1.6}

.ac-box{background:color-mix(in srgb,var(--brand) 7%,var(--surf));border:1px solid var(--line);border-radius:var(--r-l);padding:26px;margin-top:8px}
.ac-box h2{margin-top:0}

@media (max-width:900px){
  .ac-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .ac-hero h1{font-size:clamp(26px,8vw,34px)}
  .ac-card{padding:18px}
}