/* Mobile overlap fix + app-like UX */
@media(max-width:900px){
 html,body{max-width:100%;overflow-x:hidden!important}
 body{padding-bottom:124px!important}
 .mobileTop{min-height:86px!important;padding:14px 18px!important;position:sticky!important;top:0!important;z-index:1000!important}
 .brand{min-width:0!important;gap:10px!important}
 .brand img{width:46px!important;height:46px!important;object-fit:contain!important;flex-shrink:0!important}
 .brand h1{font-family:Inter,Arial,sans-serif!important;color:#fff!important;font-size:24px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
 .brand p{font-size:9px!important;letter-spacing:1.7px!important;white-space:nowrap!important}
 .menuBtn{width:52px!important;height:52px!important;border-radius:18px!important;flex-shrink:0!important}
 .drawer{top:92px!important;max-height:calc(100svh - 120px)!important;overflow:auto!important}
 main{padding:14px!important}
 .hero{display:block!important;min-height:auto!important;padding:22px!important;border-radius:28px!important;overflow:hidden!important}
 .hero:after{display:none!important}
 .chips{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin-bottom:22px!important;width:100%!important}
 .chips span{width:100%!important;min-width:0!important;white-space:normal!important;text-align:center!important;font-size:12px!important;line-height:1.1!important;padding:11px 10px!important;overflow:hidden!important}
 .hero h2{font-family:Inter,Arial,sans-serif!important;color:#fff!important;font-size:38px!important;line-height:1.08!important;letter-spacing:-1.1px!important;margin:0 0 16px!important}
 .hero h2:after{font-size:30px!important;line-height:1.05!important;display:block!important;margin-top:14px!important}
 .hero p{font-size:16px!important;line-height:1.68!important;margin:0!important}
 .heroActions{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;margin-top:24px!important}
 .goldBtn,.darkBtn{width:100%!important;min-height:58px!important;border-radius:18px!important;font-size:16px!important;padding:16px!important}
 .trustMicro{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
 .trustMicro span{text-align:center!important;font-size:11px!important;padding:9px!important}
 .heroVisual{margin-top:18px!important}
 .heroVisual>img{max-width:130px!important;padding:10px!important;border-radius:22px!important}
 .statusGrid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}
 .warning,.rolePanel,.features,.pilot,.integrationSection,.liveFlow{margin-top:16px!important;padding:20px!important;border-radius:26px!important}
 .sectionTitle h2,.pilot h2{font-family:Inter,Arial,sans-serif!important;font-size:26px!important;line-height:1.22!important;margin:8px 0 14px!important}
 .roleTabs,.featureGrid,.integrationGrid,.scenarioGrid,.flowGrid{grid-template-columns:1fr!important;gap:12px!important}
 .pilot{grid-template-columns:1fr!important}
 .pilotForm{padding:18px!important;border-radius:22px!important;gap:14px!important}
 .pilotForm input,.pilotForm select{min-height:58px!important;border-radius:18px!important;font-size:16px!important}
 .appFooter{margin-bottom:118px!important}
 .mainStickyBar{position:fixed!important;left:12px!important;right:12px!important;bottom:12px!important;z-index:9999!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;padding:0!important;pointer-events:auto!important}
 .mainStickyBar a{text-align:center!important;padding:15px 10px!important;border-radius:18px!important;font-weight:950!important;font-size:16px!important;background:linear-gradient(135deg,#00C896,#7FFFE4)!important;color:#04100C!important;box-shadow:0 14px 45px rgba(0,0,0,.48)!important}
 .mainStickyBar a:last-child{background:#06100d!important;color:#CFFFF2!important;border:1px solid rgba(0,200,150,.25)!important}
 .stickyCTA{display:none!important}
 section{scroll-margin-top:96px!important}
}
@media(max-width:390px){
 .brand h1{font-size:20px!important}.brand p{font-size:8px!important}
 .hero h2{font-size:32px!important}.hero h2:after{font-size:26px!important}
 .chips{grid-template-columns:1fr!important}
 .mainStickyBar a{font-size:14px!important}
}
