/* Mobile polish - phone / small tablet */
.nav-backdrop,
.sidebar-backdrop{
  display:none;
  position:fixed;inset:0;z-index:999;
  background:rgba(5,10,18,.55);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  border:0;padding:0;margin:0;cursor:pointer;
}
.nav-backdrop.show,
.sidebar-backdrop.show{display:block;}
body.nav-open,
body.sidebar-open{overflow:hidden;touch-action:none;}

@media (max-width:960px){
  .container{padding:0 16px;}
  .hero{padding:120px 0 56px;}
  .hero-grid{
    grid-template-columns:1fr;
    gap:36px;
  }
  .hero-copy p.lead{font-size:16px;max-width:none;}
  .hero-actions .btn{width:100%;}
  .hero-visual{max-width:560px;margin:0 auto;}
  .browser-frame{transform:none;}
  .mock-sidebar{display:none;}
  .mock-main{width:100%;}
  .screen-frame .mock-sidebar{display:none;}
  .screen-tabs{
    display:flex;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;
    gap:8px;padding-bottom:6px;scrollbar-width:thin;
  }
  .screen-tabs .tab-btn{flex:0 0 auto;white-space:nowrap;}
  .brand small{display:none;}
  .nav-actions .btn-primary,
  .nav-actions .btn-sm{padding:9px 12px;font-size:12.5px;}
  .nav-toggle{min-width:44px;min-height:44px;}
  .nav-links{
    z-index:1001;
    max-height:min(70vh, calc(100dvh - 80px));
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .cta-box{padding:36px 22px;}
  .app-topbar{padding:12px 14px;}
  .app-topbar h1{font-size:17px;}
  .app-topbar .sub{display:none;}
  .app-content{padding:16px 14px 28px;}
  .app-sidebar{
    width:min(280px, 86vw);
    box-shadow:12px 0 40px -16px rgba(0,0,0,.55);
  }
  .sidebar-backdrop{z-index:199;}
  .card{padding:16px;}
  .card:has(.data-table),
  .table-scroll{
    overflow-x:auto;-webkit-overflow-scrolling:touch;
  }
  .data-table{min-width:560px;}
  .btn{white-space:normal;text-align:center;}
  .auth-card{padding:28px 20px;}
  .auth-shell{min-height:100dvh;}
  .logo-strip .container{justify-content:center;text-align:center;}
  .footer-grid{gap:28px;}
  .hero-note{flex-wrap:wrap;line-height:1.45;}
}

@media (max-width:640px){
  .hero{padding:108px 0 40px;}
  .hero-copy h1{font-size:clamp(28px,8.2vw,36px);}
  .section-head{margin-bottom:36px;}
  .section-head p{font-size:15px;}
  .stats-bar{grid-template-columns:1fr 1fr;gap:12px;}
  .trust-logos{gap:14px 18px;font-size:13px;justify-content:flex-start;}
  .pricing-toggle{flex-wrap:wrap;gap:10px;}
  .faq-q{padding:16px;font-size:15px;}
  .topbar-actions .btn{padding:8px 10px;font-size:12px;}
  .kpi .num{font-size:22px;}
  .mock-stats{grid-template-columns:1fr 1fr !important;}
  .license-key{font-size:12.5px;padding:10px 12px;}
  .ticket-msg{padding:12px;}
  .ticket-msg-meta{font-size:12px;}
}

@media (max-width:420px){
  .nav-actions .btn-ghost,
  .nav-actions a.btn-outline{display:none;}
  .container{padding:0 12px;}
  .stats-bar{grid-template-columns:1fr;}
}

/* iOS safe areas */
@supports (padding: max(0px)){
  .navbar .container,
  .app-topbar,
  .app-content{
    padding-left:max(16px, env(safe-area-inset-left));
    padding-right:max(16px, env(safe-area-inset-right));
  }
  .app-sidebar{padding-bottom:max(22px, env(safe-area-inset-bottom));}
}
