/* ============================================================
   Pages par acheteur (audit du 28/09, etape 12, F-087)
   collectivites.html, ftth.html, humanitaire.html, leurs pages EN,
   base-adresse-locale.html et plan-communal-de-sauvegarde.html.
   Charge APRES style.css. Jetons de style.css uniquement (couleurs, tailles,
   rayons) : le Theme Editor et le mode sombre s'appliquent sans copie.
   Regle P001 : peu d'elements, une seule action principale par ecran
   (« Demander un devis »), une seule couleur d'accent (turquoise).
   ============================================================ */

/* Heros : l'accroche est plus longue que celle des autres pages. */
.page-hero > .container > p.ac-lead { max-width: 720px; font-size: var(--size-body); line-height: 1.65; }
.ac-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 24px; }
.ac-link { color: var(--turquoise-text); font-weight: var(--fw-semibold); text-decoration: underline; text-underline-offset: 3px; }
.ac-link:hover { color: var(--orange-text); }
.page-hero > .container > p.ac-promise { margin-top: 16px; font-size: var(--size-small); color: var(--text-secondary); max-width: none; }

/* Sections : alternance de fond, pas de decor. */
.ac-alt { background: var(--bg-alt); }
.ac-head { margin-bottom: 28px; }
.ac-head .section-title { margin-bottom: 8px; }
.ac-head p { color: var(--text-secondary); max-width: 760px; line-height: 1.65; }

/* Texte courant */
.ac-prose { max-width: 780px; }
.ac-prose p { color: var(--text-secondary); line-height: 1.7; margin-bottom: 14px; }
.ac-prose p:last-child { margin-bottom: 0; }
.ac-prose strong { color: var(--text); }
.ac-prose a, .ac-offer a, .ac-faq a, .ac-list a, .ac-example a { color: var(--turquoise-text); text-decoration: underline; text-underline-offset: 3px; }

/* Fiches de prestation */
.ac-offers { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--spacing-card-gap); }
.ac-offer {
    display: flex; flex-direction: column; gap: 10px;
    background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius);
    padding: var(--spacing-card-padding);
}
.ac-alt .ac-offer { background: var(--bg); }
.ac-offer h3 { font-size: var(--size-card-title); font-weight: var(--fw-bold); line-height: 1.35; color: var(--text); }
.ac-offer > p { color: var(--text-secondary); font-size: var(--size-card-body); line-height: 1.6; }
.ac-offer dl { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--border); font-size: var(--size-small); line-height: 1.55; }
.ac-offer dt { font-weight: var(--fw-semibold); color: var(--text); }
.ac-offer dd { margin: 0 0 8px; color: var(--text-secondary); }
.ac-offer dd:last-child { margin-bottom: 0; }

/* Listes simples (formats, organisations, etapes) */
.ac-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 28px 40px; }
.ac-cols h3 { font-size: var(--size-h3); font-weight: var(--fw-bold); color: var(--text); margin-bottom: 10px; }
.ac-list { list-style: none; display: grid; gap: 10px; }
.ac-list li { position: relative; padding-left: 18px; color: var(--text-secondary); line-height: 1.6; }
.ac-list li::before { content: ''; position: absolute; left: 0; top: 0.62em; width: 7px; height: 7px; border-radius: 50%; background: var(--turquoise); }
.ac-list strong { color: var(--text); }

.ac-steps { list-style: none; counter-reset: ac-step; display: grid; gap: 18px; max-width: 820px; }
.ac-steps li { counter-increment: ac-step; position: relative; padding-left: 48px; color: var(--text-secondary); line-height: 1.65; }
.ac-steps li::before {
    content: counter(ac-step); position: absolute; left: 0; top: -2px;
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--turquoise-pale); color: var(--turquoise-text); font-weight: var(--fw-bold);
}
[data-theme="dark"] .ac-steps li::before { background: rgba(var(--turquoise-rgb), 0.14); }
.ac-steps strong { color: var(--text); }

/* Exemple tire d'une realisation publiable */
.ac-example { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 36px; align-items: start; }
.ac-example figure { margin: 0; }
.ac-example img { display: block; width: 100%; height: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-alt); }
.ac-example figcaption { margin-top: 8px; font-size: var(--size-small); color: var(--text-secondary); line-height: 1.5; }
.ac-figures { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin: 18px 0; }
.ac-figures li { border-left: 3px solid var(--turquoise); padding: 2px 0 2px 12px; color: var(--text-secondary); font-size: var(--size-small); line-height: 1.45; }
.ac-figures strong { display: block; font-size: calc(var(--size-h3) * 1.35); color: var(--text); line-height: 1.2; }

/* FAQ visible (pas d'accordeon : le texte est la preuve) */
.ac-faq { display: grid; gap: 26px; max-width: 820px; }
.ac-faq h3 { font-size: var(--size-h3); font-weight: var(--fw-bold); color: var(--text); margin-bottom: 6px; line-height: 1.4; }
.ac-faq p { color: var(--text-secondary); line-height: 1.7; }

.cta-band .cta-reassure { margin-top: 14px; font-size: var(--size-small); opacity: 0.85; }

@media (max-width: 900px) {
    .ac-example { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .ac-example figure { max-width: 420px; }
}
@media (max-width: 640px) {
    .ac-offers { grid-template-columns: minmax(0, 1fr); }
    .ac-hero-actions .btn { width: 100%; text-align: center; justify-content: center; }
}

/* Fiche prestataire (PDF) sous l'appel final : lien secondaire, couleur du texte de la bande. */
.cta-band .cta-doc { margin-top: 10px; font-size: var(--size-small); }
.cta-band .ac-doc { color: inherit; text-decoration: underline; text-underline-offset: 3px; font-weight: var(--fw-semibold); display: inline-block; padding: 12px 2px; margin: -12px 0; }
.ac-note { margin-top: 28px; max-width: 780px; color: var(--text-secondary); line-height: 1.7; }
.ac-note a { color: var(--turquoise-text); text-decoration: underline; text-underline-offset: 3px; }