@media(max-width:768px){.case-blocks{grid-template-columns:1fr;}}

@media(max-width:1024px){
  .features-grid{grid-template-columns:1fr;}
  .tno-inner{grid-template-columns:1fr;}
  .cta-inner{grid-template-columns:1fr;}
  .cta-person{min-height:280px;}
  .footer-top{grid-template-columns:1fr;gap:36px;}
  .pain-header{grid-template-columns:1fr;gap:24px;}
}

@media(max-width:768px){
  .header-inner{padding:0 20px;gap:12px;}
  .logo, img[src*='ehv-logo']{height:32px;}
  .nav-links{width:100%;flex-direction:column;display:none;align-items:flex-start;padding:0 20px 20px;order:4;}
  .nav-links.active{display:flex;}
  .nav-right{display:none;}
  .mobile-actions{width:100%;display:none;flex-direction:column;align-items:flex-start;padding:0 20px 20px;}
  .mobile-actions.active{display:flex;}
  .menu-toggle{display:flex;}
  .sec{padding:64px 20px;}
  .hero-visual-inner{grid-template-columns:1fr;padding:40px 24px;}
  .hero-stat-row{grid-column:1;}
  .stappen{grid-template-columns:1fr 1fr;}
  .waarden-grid{grid-template-columns:1fr;}
  .pain-grid{grid-template-columns:1fr;}
  .koppeling{flex-direction:column;gap:24px;}
  .cta-contact-row{flex-direction:column;gap:20px;}
  footer{padding:48px 20px 28px;}
  .footer-legal{flex-direction:column;gap:8px;}
}

@media(max-width:520px){
  .stappen{grid-template-columns:1fr;}
  .hero-btns{flex-direction:column;align-items:center;}
  .cta-btns{flex-direction:column;}
}

/* Extra hardening for mobile and smaller tablets */
@media (max-width: 900px){
  .hero-visual{min-height:auto;}
  .hero-visual-inner{grid-template-columns:1fr;gap:16px;padding:32px 20px;}
  .hero-stat-row{grid-column:1;flex-wrap:wrap;gap:16px;padding-top:20px;}
  .hero-stat{min-width:calc(50% - 8px);border-right:none;padding:0;}
  .trust-inner{flex-wrap:wrap;}
  .trust-sep{display:none;}
  .case-head{align-items:flex-start;}
}

@media (max-width: 768px){
  html, body{overflow-x:hidden;}
  .header-inner,
  .sec-inner,
  .trust-inner,
  .footer-inner,
  .hero-visual-inner,
  .cta-inner,
  .tno-inner{max-width:100%;}
  .hero-h{font-size:clamp(34px, 12vw, 54px);}
  .hero-sub{font-size:16px;line-height:1.6;}
  .hero-proof{flex-wrap:wrap;text-align:center;padding-inline:12px;}
  .feat{grid-template-columns:1fr;}
  .feat-body,
  .case-card,
  .pain-card,
  .stap,
  .waarde,
  .quote,
  .tno-l,
  .tno-r,
  .cta-body{padding-left:20px;padding-right:20px;}
  .feat-clients,
  .kop-tags,
  .trust-logos{flex-wrap:wrap;}
  .trust-chip,
  .feat-cli,
  .kop-tag,
  .hero-chip{max-width:100%;white-space:normal;}
}

@media (max-width: 520px){
  .hero-visual{border-radius:18px 18px 0 0;}
  .hero-card{padding:18px;}
  .hero-card-title{font-size:18px;line-height:1.25;}
  .feat-body,
  .koppeling,
  .case-card,
  .tno-l,
  .tno-r,
  .cta-body{padding:18px 16px;}
  .hero-stat{min-width:100%;}
  .btn-primary,
  .btn-secondary,
  .btn-cta-aq,
  .btn-cta-ghost{width:100%;justify-content:center;}
}



@media (max-width: 640px){
  .header-inner{padding:0 16px;}
  .mobile-actions{padding:0 16px 16px;}
  .sec{padding:56px 16px;}
  .hero{padding-inline:0;}
  .hero-h{font-size:clamp(30px,11vw,46px);line-height:1.04;}
  .hero-btns{width:100%;}
  .hero-btns a{width:100%;justify-content:center;}
  .hero-proof{gap:6px;}
  .hero-card{padding:16px;}
  .hero-card-chips{gap:8px;}
  .hero-chip{font-size:10px;line-height:1.3;}
  .trust-strip{padding:16px;}
  .trust-chip{padding:7px 12px;font-size:10px;}
  .feat-visual{height:220px;}
  .sec-h{font-size:clamp(26px,8vw,36px);}
}

@media (max-width: 420px){
  .hero-visual-inner{padding:24px 16px;}
  .hero-card-title{font-size:17px;}
  .hero-card-desc{font-size:14px;line-height:1.6;}
  .hs-num{font-size:24px;}
  .btn-primary,.btn-secondary,.btn-cta,.btn-cta-aq,.btn-cta-ghost{padding-left:16px;padding-right:16px;}
  .cta-contact-row{align-items:flex-start;}
  .footer-ptp{font-size:42px;line-height:.96;}
}


/* V3 responsive polish */
@media (max-width: 900px){
  #site-header{position:sticky;top:0;}
  .powered{padding-left:20px;padding-right:20px;}
}

@media (max-width: 768px){
  #site-header{padding-top:max(0px, env(safe-area-inset-top));}
  .nav-links,
  .mobile-actions{
    background:rgba(252,252,249,.98);
    backdrop-filter:blur(16px);
  }
  .nav-links a,
  .mobile-actions a,
  .lang-pill-btn{min-height:44px;display:inline-flex;align-items:center;}
  .nav-links a{width:100%;padding:10px 0;}
  .hero-visual{margin-inline:-4px;}
  .hero-card-desc{font-size:14px;}
  .sec-sub{font-size:16px;line-height:1.65;}
  .proof-list{padding-left:18px;}
}

@media (max-width: 640px){
  .page-shell > section:first-child{padding-top:12px;}
  .hero-eyebrow{font-size:10px;letter-spacing:.14em;padding:6px 12px;}
  .hero-proof{font-size:12px;}
  .hero-stat-row{gap:12px;}
  .hero-stat{padding:12px 0;border-top:1px solid rgba(78,168,163,.12);}
  .hero-stat:first-child{border-top:none;}
}

@media (max-width: 420px){
  .nav-links,.mobile-actions{padding-left:14px;padding-right:14px;}
  .hero-chip,.trust-chip,.feat-cli,.kop-tag{font-size:10px;}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none !important;transition:none !important;}
}


/* === MOBILE POLISH ADDITIONS === */

/* 1. iOS safe area — footer bottom (iPhone X notch/home indicator) */
footer {
  padding-bottom: max(36px, calc(28px + env(safe-area-inset-bottom)));
}

/* 2. Lang-pill buttons: minimum 44px tap target (iOS HIG) */
.lang-pill-btn {
  min-height: 44px;
  min-width: 36px;
  padding: 6px 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* 3. Active lang pill button — clearer active state on touch */
.lang-pill-btn.is-active {
  background: var(--p);
  color: #fff;
}

/* 4. Solution page hero on very small screens */
@media (max-width: 420px) {
  .page-shell-wide {
    padding-inline: 16px;
  }
  .page-shell .sec {
    padding-inline: 16px;
  }
}

/* 5. Testimonial marquee: respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  .marquee-track {
    animation: none !important;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 0 20px;
  }
}

/* 6. Trust strip overflow on narrow screens */
@media (max-width: 380px) {
  .trust-logos {
    grid-template-columns: repeat(3, auto);
  }
  .trust-chip {
    font-size: 9px;
    padding: 6px 10px;
  }
}

/* 7. CTA contact row: stack cleanly on narrow phones */
@media (max-width: 380px) {
  .cta-contact-row {
    gap: 16px;
  }
  .ci-l, .ci-v {
    font-size: 13px;
  }
}

/* 8. Footer: prevent horizontal scroll on mobile */
@media (max-width: 640px) {
  footer {
    padding-inline: 16px;
  }
  .footer-inner {
    overflow-x: hidden;
  }
  .footer-ptp {
    font-size: clamp(36px, 14vw, 56px);
  }
}

/* 9. Powered strip: wrap on very small screens */
@media (max-width: 360px) {
  .powered {
    font-size: 12px;
    text-align: center;
  }
}

/* 10. Header: safe area on iOS for sticky nav */
@media (max-width: 768px) {
  #site-header {
    padding-top: env(safe-area-inset-top, 0px);
  }
}
