/* Extra CTA's voor de Ads-landingspagina's (06-11-2026): vaste actiebalk op mobiel, knop na de werkwijze, review bij de laatste knop. */

/* Vaste balk onderaan op mobiel: Bel, WhatsApp, Afspraak (of Prijsopgave op chiptuning). Vervangt daar de zwevende WhatsApp-knop. */
.mob-actiebalk { display: none; }
@media (max-width: 900px) {
  .mob-actiebalk {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 85;
    display: grid; grid-template-columns: 1fr 1fr 1.3fr;
    background: var(--zwart); border-top: 1px solid var(--lijn-donker);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .mob-actiebalk a {
    display: flex; align-items: center; justify-content: center; gap: 7px;
    min-height: 56px; color: var(--wit); text-decoration: none;
    font: 600 .92rem var(--font-body);
  }
  .mob-actiebalk a + a { border-left: 1px solid var(--lijn-donker); }
  .mob-actiebalk .mob-actiebalk-hoofd { background: var(--rood); border-left: 0; }
  .mob-actiebalk svg { width: 18px; height: 18px; flex: none; }
  .mob-actiebalk a:focus-visible { outline: 2px solid var(--wit); outline-offset: -4px; }
  .mob-actiebalk ~ .whatsapp-trigger { display: none; }
  /* Pas tonen na scrollen (script in navHtml); zonder JavaScript gewoon zichtbaar. */
  html.js .mob-actiebalk { transform: translateY(110%); visibility: hidden; transition: transform .3s ease, visibility 0s linear .3s; }
  html.js body.actiebalk-zichtbaar .mob-actiebalk { transform: none; visibility: visible; transition: transform .3s ease, visibility 0s; }
  body:has(.mob-actiebalk) { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
}

/* Knop onder de werkwijze-sectie van een dienstpagina */
.tussen-cta { text-align: center; margin: 32px 0 0; }

/* Eén echte Google-review bij de laatste knop */
.cta-citaat { font-style: italic; font-size: 1rem !important; opacity: .95; margin: -6px auto 22px !important; max-width: 560px; }
.cta-citaat span { display: block; font-style: normal; font-size: .85rem; opacity: .85; margin-top: 6px; }

@media (max-width: 900px) and (prefers-reduced-motion: reduce) { html.js .mob-actiebalk { transition: none !important; } }