/* ============================================================
   MOBIELE CENTRERING — alleen subpagina's (:is(body.subpage,body.home)), <=900px.
   Desktop en homepage blijven volledig onaangetast.
   Doel: alles gecentreerd — koppen, teksten, knoppen, foto's —
   en cta-knoppen netjes ONDER de tekst in plaats van ernaast.
   ============================================================ */
@media (max-width: 900px) {

  /* ---------- 1. Alle tekst gecentreerd ---------- */
  :is(body.subpage,body.home) section h1,
  :is(body.subpage,body.home) section h2,
  :is(body.subpage,body.home) section h3,
  :is(body.subpage,body.home) section h4,
  :is(body.subpage,body.home) section h5,
  :is(body.subpage,body.home) section p,
  :is(body.subpage,body.home) section .eyebrow,
  :is(body.subpage,body.home) section li,
  :is(body.subpage,body.home) section blockquote,
  :is(body.subpage,body.home) section figcaption,
  :is(body.subpage,body.home) section label,
  :is(body.subpage,body.home) .subhero-content,
  :is(body.subpage,body.home) .subhero-sub {
    text-align: center !important;
  }
  :is(body.subpage,body.home) section .eyebrow { display: inline-block; }

  /* ---------- 2. Breadcrumb + subhero ---------- */
  :is(body.subpage,body.home) .breadcrumb {
    justify-content: center !important;
    text-align: center !important;
    display: flex; flex-wrap: wrap;
  }

  /* ---------- 3. Knoppen: gecentreerd, onder de tekst ---------- */
  :is(body.subpage,body.home) section .btn,
  :is(body.subpage,body.home) section .btn-pill-dark {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  /* containers die knoppen bevatten: centreer de inhoud */
  :is(body.subpage,body.home) section .content-text,
  :is(body.subpage,body.home) section .seo-content,
  :is(body.subpage,body.home) section .contact-info-card {
    text-align: center !important;
  }

  /* ---------- 4. CTA-band: tekst boven, knoppen eronder ---------- */
  :is(body.subpage,body.home) .cta-band-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 22px !important;
  }
  :is(body.subpage,body.home) .cta-band-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    width: 100%;
    margin: 0 !important;
  }
  :is(body.subpage,body.home) .cta-band-actions .btn {
    width: min(100%, 320px);
    justify-content: center;
    text-align: center;
  }

  /* ---------- 4b. btn-group (standaard cta-band op de meeste pagina's):
       knoppen onder elkaar, gecentreerd onder de tekst ---------- */
  :is(body.subpage,body.home) .btn-group {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
  }
  :is(body.subpage,body.home) .btn-group .btn {
    width: min(100%, 320px);
    justify-content: center;
    text-align: center;
  }

  /* ---------- 4c. Generiek: losse knoppen in secties gecentreerd
       (prijs-cta, werkwijze-knoppen, hero- en content-knoppen) ---------- */
  :is(body.subpage,body.home) section .container,
  :is(body.subpage,body.home) .prijs-cta,
  :is(body.subpage,body.home) .rich-final-cta,
  :is(body.subpage,body.home) .hp-werkwijze .container {
    text-align: center;
  }

  /* ---------- 5. Foto's en media gecentreerd ---------- */
  :is(body.subpage,body.home) section img,
  :is(body.subpage,body.home) section .content-img,
  :is(body.subpage,body.home) section video {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* ---------- 6. Lijsten (vinkjes/usp's) netjes gecentreerd ---------- */
  :is(body.subpage,body.home) section ul,
  :is(body.subpage,body.home) section ol {
    list-style-position: inside;
    padding-left: 0 !important;
  }
  :is(body.subpage,body.home) section ul li,
  :is(body.subpage,body.home) section ol li {
    text-align: center !important;
  }

  /* ---------- 7. Contact-rijen: icoon boven, tekst eronder ---------- */
  :is(body.subpage,body.home) .contact-row {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 10px !important;
  }
  :is(body.subpage,body.home) .contact-row > div { text-align: center !important; }

  /* ---------- 8. Specs / details / faq ---------- */
  :is(body.subpage,body.home) .proj-specs,
  :is(body.subpage,body.home) .proj-specs-grid > div,
  :is(body.subpage,body.home) .faq-item,
  :is(body.subpage,body.home) .faq-item summary,
  :is(body.subpage,body.home) .seo-werkgebied,
  :is(body.subpage,body.home) .seo-longtext {
    text-align: center !important;
  }
  :is(body.subpage,body.home) .proj-specs-grid strong,
  :is(body.subpage,body.home) .proj-specs-grid span { display: block; }

  /* ---------- 9. Verhaal-pagina blokken ---------- */
  :is(body.subpage,body.home) .verhaal-cta-inner,
  :is(body.subpage,body.home) .verhaal-cta-btns {
    display: flex; flex-direction: column;
    align-items: center !important;
    text-align: center !important;
    gap: 14px;
  }

  /* ---------- 10. Cursusagenda ---------- */
  :is(body.subpage,body.home) .ca-toolbar { justify-content: center !important; text-align: center; }
  :is(body.subpage,body.home) .ca-info h4,
  :is(body.subpage,body.home) .ca-meta,
  :is(body.subpage,body.home) .ca-m-info { text-align: center !important; justify-content: center !important; }
  :is(body.subpage,body.home) .ca-card { text-align: center; }
  :is(body.subpage,body.home) .ca-boek {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
  }
  :is(body.subpage,body.home) .ca-boek .prijs { text-align: center !important; margin: 0 !important; }
  :is(body.subpage,body.home) .ca-boek .btn { width: min(100%, 280px); justify-content: center; }
  :is(body.subpage,body.home) .ca-deelnemer h5 { text-align: center !important; }
  :is(body.subpage,body.home) .ca-privacy,
  :is(body.subpage,body.home) .ca-form-status { text-align: center !important; }
  :is(body.subpage,body.home) #ca-success { text-align: center !important; }

  /* ---------- 11. Formuliervelden: labels gecentreerd, velden full-width ---------- */
  :is(body.subpage,body.home) form label { text-align: center !important; display: block; }

  /* ---------- 12. Kleine correcties ---------- */
  :is(body.subpage,body.home) section table { margin-left: auto; margin-right: auto; }
  :is(body.subpage,body.home) section .stagger > * { text-align: center; }

  /* ============ HOMEPAGE-SPECIFIEK (body.home) ============ */

  /* 1. Hero: titel, subtekst en knoppen gecentreerd */
  body.home .hp-hs-static-content {
    align-items: center !important;
    text-align: center !important;
  }
  body.home .hp-hs-static-content .hp-hs-eyebrow,
  body.home .hp-hs-static-content .hp-hs-title,
  body.home .hp-hs-static-content .hp-hs-desc {
    text-align: center !important;
  }
  body.home .hp-hs-static-content .hp-hs-btn { margin-left: auto; margin-right: auto; }

  /* 2. Waarom kiezen voor ons: kaarten met icoon gecentreerd */
  body.home .hp-waarom-card {
    display: flex; flex-direction: column;
    align-items: center !important;
    text-align: center !important;
  }
  body.home .hp-waarom-card .hp-waarom-ic { margin-left: auto !important; margin-right: auto !important; }

  /* 3. Cursus-kaarten: badge, titel, tekst, features en knop gecentreerd */
  body.home .hp-svc-body { text-align: center !important; }
  body.home .hp-svc-badge { left: 50% !important; transform: translateX(-50%) !important; right: auto !important; }
  body.home .hp-svc-features { padding-left: 0 !important; }
  body.home .hp-svc-features li { text-align: center !important; list-style-position: inside; justify-content: center !important; }
  body.home .hp-svc-body .btn { margin-left: auto !important; margin-right: auto !important; }

  /* 5. Trainingen in beeld: kaart-inhoud gecentreerd */
  body.home .hp-port-meta { text-align: center !important; align-items: center !important; justify-content: center !important; }
  body.home .hp-port-tag { margin-left: auto; margin-right: auto; }

  /* 6. Tips & nieuws: kaart-inhoud en Lees meer-knop gecentreerd */
  body.home .hp-tips-card-body { text-align: center !important; }
  body.home .hp-tips-meta { justify-content: center !important; }
  body.home .hp-tips-tag { margin-left: auto; margin-right: auto; }
  body.home .hp-tips-card-body a,
  body.home .hp-tips-card-body .btn { margin-left: auto !important; margin-right: auto !important; }

  /* 7. Google Reviews: kop en reviewkaarten gecentreerd */
  body.home .hpgr-head { text-align: center !important; align-items: center !important; flex-direction: column; }
  body.home .hpgr-google { justify-content: center !important; }
  body.home .hpgr-track > * { text-align: center !important; }
  body.home .hpgr-allcta, body.home .hpgr-write { margin-left: auto; margin-right: auto; }

}
