/* ==========================================================
   SmartCafe Marketing Landing Responsive v5
   ========================================================== */
html{overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:76px}
body{overflow-x:hidden;min-width:0}
img,video,svg,canvas{max-width:100%;height:auto}
.container,.header-inner{max-width:1180px}

@media (min-width:901px) and (max-width:1180px){
  .container,.header-inner{width:min(100% - 40px,1180px)!important}
  .landing-hero-inner{grid-template-columns:minmax(0,1fr) minmax(370px,.82fr)!important;gap:38px!important}
  .landing-hero-text h1{font-size:clamp(2.7rem,5vw,4rem)!important}
  .landing-features-grid,.highlight-grid{gap:14px!important}
}

@media (max-width:900px){
  #siteHeader{padding-top:env(safe-area-inset-top,0px)!important}
  .header-inner{min-height:64px!important}
  .mobile-nav{max-height:calc(100dvh - 64px - env(safe-area-inset-top,0px))!important;overflow-y:auto!important;overscroll-behavior:contain!important}
  .landing-hero-inner{grid-template-columns:1fr!important}
  .landing-hero-text,.landing-hero-visual{min-width:0!important}
  .hero-browser-window{max-width:100%!important}
  .compare-grid,.highlight-grid,.landing-features-grid,.workflow-grid,.pricing-grid,.landing-testi-grid{min-width:0!important}
}

@media (max-width:640px){
  .container,.header-inner{width:calc(100% - 24px)!important}
  .header-inner{min-height:60px!important}.mobile-menu-toggle{width:40px!important;height:40px!important}
  .landing-hero{padding:34px 0 38px!important}.landing-hero-text h1{font-size:clamp(2rem,11vw,3rem)!important;overflow-wrap:anywhere}.landing-hero-text>p{font-size:.92rem!important}.hero-feature-tags{gap:6px!important}.hero-tag{font-size:.72rem!important}.hero-cta{grid-template-columns:1fr!important}.hero-cta>*{width:100%!important;justify-content:center!important}
  .hero-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}.hero-stats .stat{min-width:0!important}.hero-stats .stat strong{overflow-wrap:anywhere!important}
  .hero-admin-box{padding:13px!important}.hero-admin-list{grid-template-columns:1fr!important}
  .hero-browser-window{border-radius:13px!important}.hero-browser-bar{min-width:0!important}.hero-browser-address{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .section-block,.section-features,.section-faq{padding:50px 0!important}.section-head{margin-bottom:24px!important}.section-head h2{font-size:1.65rem!important;overflow-wrap:anywhere}.section-head p{font-size:.9rem!important}
  .compare-card,.highlight-card,.landing-feature-card,.workflow-card,.pricing-card,.testi-card{min-width:0!important}.feature-card-content,.highlight-card,.workflow-card,.pricing-card{padding:16px!important}
  .faq-q{padding:14px!important;gap:10px!important}.faq-a{padding:0 14px 14px!important}
  .landing-cta{padding:52px 0!important}.landing-cta h2{font-size:1.75rem!important}.landing-cta p{font-size:.9rem!important}
  .footer-inner{grid-template-columns:1fr 1fr!important;gap:22px!important}.footer-brand{grid-column:1/-1!important}
  .feature-lightbox-backdrop{padding:10px!important}.feature-lightbox-dialog{width:100%!important;max-height:88dvh!important;border-radius:14px!important}
  .daftar-page{padding:24px 10px!important}.daftar-card{width:100%!important;padding:18px!important}.daftar-card input,.daftar-card select,.daftar-card textarea{font-size:16px!important}
}

@media (min-width:390px) and (max-width:640px){.container,.header-inner{width:calc(100% - 26px)!important}}

@media (max-width:389.98px){
  .container,.header-inner{width:calc(100% - 18px)!important}
  .logo{font-size:1.08rem!important}.logo-icon{width:32px!important;height:32px!important}
  .landing-hero{padding-top:28px!important}.landing-hero-text h1{font-size:clamp(1.82rem,11vw,2.55rem)!important}.hero-eyebrow{font-size:.68rem!important}
  .hero-stats{grid-template-columns:1fr 1fr!important}.hero-stats .stat:last-child{grid-column:1/-1!important}.hero-stats .stat span{font-size:.64rem!important}
  .section-head h2{font-size:1.48rem!important}.compare-card,.highlight-card,.workflow-card,.pricing-card,.testi-card{border-radius:14px!important}
  .footer-inner{grid-template-columns:1fr!important}.footer-brand{grid-column:auto!important}
}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}