/* SS-CONVERSIE-20261010 — conversielaag SaniSafe-familie (sanisafebadkamers.nl, safesanitair.nl, veiligbaden.nl/.be).
   Geladen als laatste stylesheet (na ss-navy-force.css). Inhoud: tikdoelen >=44px, compacte hero op mobiel
   (primaire CTA boven de vouw), compacte cookiemelding, vaste mobiele actiebalk (markup: includes/widgets/ss-conversie-balk.php). */

/* Kopbalk: bel- en WhatsApp-knop altijd minstens 44x44 (was 38-40px op mobiel) */
html body .header-icon-btn{width:44px!important;height:44px!important;min-width:44px;min-height:44px;flex:0 0 44px}
html body .menu-toggle,html body .mobile-menu-toggle{min-width:44px;min-height:44px}

/* Hero: primaire knop "Gratis inmeting aan huis" duidelijk; tweede knop rustig */
html body .hero .hero-cta .ss-cta-hoofd{font-size:1.08rem!important}
html body .hero .ss-cta-sub{display:block;margin:10px auto 0;color:#eef3fb;font-size:.92rem;opacity:.95;text-shadow:0 1px 2px rgba(0,0,0,.4)}

@media (max-width:640px){
  /* Hero compact: titel + 2 kenmerken + knoppen passen in het eerste scherm (390x844) */
  html body .hero .hero-content{padding-top:calc(var(--header-height,72px) + 18px)!important;padding-bottom:22px!important}
  html body .hero .hero-title{font-size:1.72rem!important;line-height:1.18!important;margin-bottom:10px!important}
  html body .hero .hero-subtitle{font-size:1rem!important;margin-bottom:12px!important}
  html body .hero .hero-badges{gap:6px!important;margin-bottom:12px!important}
  html body .hero .hero-badges .badge:nth-child(n+3){display:none!important}
  html body .hero .hero-badges .badge{padding:6px 12px!important;font-size:.88rem!important}
  html body .hero .ss-hero-score{margin-bottom:12px!important}
  html body .hero .hero-cta{gap:10px!important}
  html body .hero .hero-cta .btn{min-height:52px!important;padding-top:12px!important;padding-bottom:12px!important}
}

/* Cookiemelding op mobiel compact (was tot 250px hoog en dekte de hero-knop af) */
@media (max-width:768px){
  html body .cookie-banner .cookie-inner{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center;gap:8px!important;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))!important;text-align:left!important}
  html body .cookie-banner .cookie-inner p{font-size:12.5px!important;line-height:1.35!important;margin:0!important;flex:1 1 100%}
  html body .cookie-banner .cookie-actions{flex:1 1 100%;width:100%;display:flex!important;flex-direction:row!important;gap:8px!important}
  html body .cookie-banner .cookie-actions .btn{flex:1 1 0;width:auto!important;min-height:44px!important;padding:8px 10px!important;font-size:13px!important;white-space:nowrap;justify-content:center}
}

/* Vaste actiebalk onderaan op mobiel: Bellen · WhatsApp · Gratis inmeting */
.ss-mbar{display:none}
@media (max-width:1023px){
  html body .ss-fabs,html body .wa-fab{display:none!important}
  .ss-mbar{position:fixed;left:0;right:0;bottom:0;z-index:9000;display:grid;grid-template-columns:.95fr 1.1fr 1.45fr;gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid #dbe2ef;box-shadow:0 -6px 20px rgba(22,28,72,.12)}
  .ss-mbar a{display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:0 6px;border-radius:999px;font-weight:700;font-size:.9rem;line-height:1.05;text-decoration:none!important;white-space:nowrap;min-width:0;text-align:center}
  .ss-mbar a svg{flex:0 0 auto}
  html body .ss-mbar .ss-mbar-tel{background:#fff;color:#161c48!important;border:2px solid #161c48}
  html body .ss-mbar .ss-mbar-wa{background:#146c3c;color:#fff!important}
  html body .ss-mbar .ss-mbar-off{background:#161c48;color:#fff!important}
  body.ss-heeft-mbar{padding-bottom:calc(66px + env(safe-area-inset-bottom,0px))}
  body.ss-heeft-mbar .chatbot-toggle{bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}
  body.ss-heeft-mbar .back-to-top{bottom:calc(144px + env(safe-area-inset-bottom,0px))!important}
  body.ss-heeft-mbar .cookie-banner{bottom:calc(64px + env(safe-area-inset-bottom,0px))!important}
  body.ss-menu-open .ss-mbar,body:has(#mobileMenu.open) .ss-mbar,body:has(.mobile-menu.open) .ss-mbar{display:none}
}
@media (max-width:359px){.ss-mbar a{font-size:.8rem}.ss-mbar a svg{display:none}}

/* aanvulling 20261010b: hero-knoppen even breed en gecentreerd op mobiel; terug-naar-boven-knop 44px */
@media (max-width:640px){
  html body .hero .hero-cta{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;max-width:420px;margin-left:auto!important;margin-right:auto!important}
  html body .hero .hero-cta .btn{width:100%!important;max-width:none!important;justify-content:center}
}
html body .back-to-top{width:44px!important;height:44px!important}