
/* Hub V394 — Mobile Premium Cleanup
   Keeps the V393 command-center design, but makes mobile shorter, brighter, cleaner, and easier to act on.
*/
:root{
  --hub394-blue:#0ea5e9;
  --hub394-royal:#2563eb;
  --hub394-ink:#08111f;
  --hub394-soft:#f8fafc;
  --hub394-line:#dbeafe;
}

/* General premium cleanup */
body{
  background:
    radial-gradient(circle at 16% 0%, rgba(14,165,233,.15), transparent 24rem),
    radial-gradient(circle at 100% 8%, rgba(124,58,237,.10), transparent 22rem),
    linear-gradient(180deg,#ffffff 0%,#f8fafc 55%,#eef6ff 100%) !important;
}
.shell{
  background:transparent !important;
}
.main.legacy-main{
  padding-top:0 !important;
}
.hub394-mobile-nav{
  display:none;
}
.hub393-home{
  padding-top:16px;
}
.hub393-shell{
  border-color:rgba(14,165,233,.18);
}

/* Desktop footer cleanup still preserves all links but improves spacing */
.footer{
  border-top:1px solid rgba(148,163,184,.20) !important;
}
.footer a{
  line-height:1.35;
}

/* Mobile premium pass */
@media (max-width: 760px){
  .topbar{
    font-size:.68rem !important;
    letter-spacing:.08em !important;
    padding:6px 10px !important;
    background:#07111f !important;
    color:#dbeafe !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  header.nav{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:12px !important;
    margin:0 8px 10px !important;
    border-radius:20px !important;
    background:rgba(255,255,255,.96) !important;
    border:1px solid rgba(191,219,254,.88) !important;
    box-shadow:0 14px 32px rgba(15,23,42,.10) !important;
  }
  header.nav .logo{
    justify-content:center !important;
    gap:9px !important;
    min-width:0 !important;
  }
  header.nav .logo img{
    width:34px !important;
    height:34px !important;
  }
  header.nav .logo span{
    font-size:1.02rem !important;
    letter-spacing:-.02em !important;
  }
  header.nav .logo small{
    display:block !important;
    font-size:.62rem !important;
    letter-spacing:.11em !important;
  }
  .navlinks{
    display:none !important;
  }
  .locked-search{
    width:100% !important;
    display:flex !important;
    order:2;
    margin:0 !important;
    background:#ffffff !important;
    border:1px solid #bfdbfe !important;
    border-radius:15px !important;
    padding:6px !important;
    box-shadow:0 10px 22px rgba(37,99,235,.09) !important;
  }
  .locked-search input{
    width:100% !important;
    min-width:0 !important;
    font-size:.9rem !important;
    padding:9px 10px !important;
  }
  .locked-search button{
    min-width:42px !important;
    border-radius:12px !important;
    background:linear-gradient(135deg,#0ea5e9,#2563eb) !important;
    color:#fff !important;
  }
  .hub394-mobile-nav{
    order:3;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
  }
  .hub394-mobile-nav a{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:9px 6px;
    border-radius:13px;
    border:1px solid #dbeafe;
    background:#f8fafc;
    color:#075985 !important;
    font-size:.74rem;
    font-weight:900;
    text-decoration:none;
    min-height:38px;
  }
  .hub394-mobile-nav a:first-child{
    color:#fff !important;
    background:linear-gradient(135deg,#0ea5e9,#2563eb);
    border-color:transparent;
  }

  .hub393-home{
    padding:6px 10px 30px !important;
  }
  .hub393-shell{
    border-radius:24px !important;
    box-shadow:0 14px 34px rgba(15,23,42,.11) !important;
  }
  .hub393-hero{
    padding:18px !important;
    gap:16px !important;
  }
  .hub393-kicker{
    font-size:.66rem !important;
    padding:7px 10px !important;
  }
  .hub393-hero h1{
    font-size:2.38rem !important;
    letter-spacing:-.075em !important;
    line-height:.94 !important;
    margin:13px 0 8px !important;
  }
  .hub393-lead{
    font-size:.93rem !important;
    line-height:1.48 !important;
    margin-bottom:12px !important;
  }
  .hub393-search{
    margin:12px 0 !important;
    border-radius:16px !important;
  }
  .hub393-search input{
    font-size:.88rem !important;
    padding:10px !important;
  }
  .hub393-search button{
    padding:11px 12px !important;
    border-radius:13px !important;
  }
  .hub393-actions{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    display:grid !important;
  }
  .hub393-actions .hub393-btn{
    width:100% !important;
    min-height:44px !important;
    padding:10px 8px !important;
    font-size:.78rem !important;
    border-radius:14px !important;
  }
  .hub393-actions .hub393-btn:nth-child(n+4){
    display:none !important;
  }
  .hub393-stats{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-top:14px !important;
  }
  .hub393-stat{
    padding:10px !important;
    border-radius:14px !important;
  }
  .hub393-stat b{
    font-size:1rem !important;
  }
  .hub393-stat span{
    font-size:.68rem !important;
  }
  .hub393-hero-visual img{
    border-radius:20px !important;
  }
  .hub393-float-card{
    display:none !important;
  }

  .hub393-section{
    padding-top:24px !important;
  }
  .hub393-section-head{
    margin-bottom:11px !important;
    gap:8px !important;
  }
  .hub393-section-head h2{
    font-size:1.45rem !important;
    letter-spacing:-.04em !important;
  }
  .hub393-section-head p{
    font-size:.86rem !important;
    line-height:1.45 !important;
  }
  .hub393-section-head a{
    font-size:.82rem !important;
  }
  .hub393-grid{
    gap:10px !important;
  }
  .hub393-card{
    border-radius:18px !important;
    padding:12px !important;
    box-shadow:0 12px 26px rgba(15,23,42,.08) !important;
  }
  .hub393-card:hover{
    transform:none !important;
  }
  .hub393-card img{
    height:86px !important;
    border-radius:14px !important;
  }
  .hub393-card h3{
    font-size:.96rem !important;
    margin:9px 0 4px !important;
  }
  .hub393-card p{
    font-size:.79rem !important;
    line-height:1.38 !important;
  }
  .hub393-card small,
  .hub393-chip{
    font-size:.66rem !important;
    padding:6px 8px !important;
    margin-top:8px !important;
  }

  /* Shorten visible card runs on mobile. The full library stays available through "View all" links. */
  .hub393-problems .hub393-card:nth-child(n+7){
    display:none !important;
  }
  .hub393-tools .hub393-card:nth-child(n+5){
    display:none !important;
  }
  .hub393-paths .hub393-path:nth-child(n+5){
    display:none !important;
  }
  .hub393-recs .hub393-card:nth-child(n+4){
    display:none !important;
  }

  .hub393-tool-card img{
    height:74px !important;
  }
  .hub393-tool-card .hub393-btn{
    min-height:36px !important;
    padding:8px 10px !important;
    margin-top:10px !important;
  }

  .hub393-paths{
    gap:9px !important;
  }
  .hub393-path{
    padding:13px !important;
    border-radius:16px !important;
    box-shadow:0 10px 22px rgba(15,23,42,.06) !important;
  }
  .hub393-path span{
    font-size:.8rem !important;
    line-height:1.36 !important;
  }
  .hub393-path em{
    margin-top:8px !important;
    font-size:.75rem !important;
  }

  .hub393-checks{
    gap:10px !important;
  }
  .hub393-check-panel{
    padding:18px !important;
    border-radius:20px !important;
  }
  .hub393-check-panel h3{
    font-size:1.35rem !important;
    line-height:1.05 !important;
  }
  .hub393-check-panel p{
    font-size:.86rem !important;
  }
  .hub393-checks .hub393-card:nth-child(n+4){
    display:none !important;
  }

  .hub393-bridge{
    margin-top:26px !important;
    padding:18px !important;
    border-radius:24px !important;
    gap:12px !important;
  }
  .hub393-bridge h2{
    font-size:1.75rem !important;
    line-height:1.04 !important;
  }
  .hub393-bridge p{
    font-size:.9rem !important;
    line-height:1.45 !important;
  }
  .hub393-bridge img{
    border-radius:18px !important;
  }
  .hub393-email{
    margin-top:18px !important;
    padding:16px !important;
    border-radius:20px !important;
  }
  .hub393-email h2{
    font-size:1.22rem !important;
  }
  .hub393-email p{
    font-size:.84rem !important;
  }

  /* Footer: compact, premium, and no more huge vertical link wall on mobile. */
  .hub144-member-bridge{
    margin:20px 10px 0 !important;
    border-radius:22px !important;
    padding:18px !important;
  }
  .hub144-member-grid{
    grid-template-columns:1fr !important;
    gap:12px !important;
  }
  .hub144-member-bridge h2{
    font-size:1.55rem !important;
    line-height:1.08 !important;
  }
  .hub144-member-bridge p{
    font-size:.86rem !important;
    line-height:1.45 !important;
  }
  .hub144-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  .hub144-proof{
    padding:12px !important;
    border-radius:16px !important;
  }

  footer.footer{
    margin:18px 10px 0 !important;
    padding:18px !important;
    border-radius:22px !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    background:#07111f !important;
    color:#e0f2fe !important;
  }
  footer.footer > div:first-child{
    display:block !important;
    text-align:left !important;
  }
  footer.footer > div:first-child .logo{
    justify-content:flex-start !important;
  }
  footer.footer > div:first-child p{
    display:none !important;
  }
  footer.footer > div:not(:first-child){
    display:none !important;
  }
  footer.footer::after{
    content:"Guides • Tools • Checklists • AI Doctor • STLBEAST.com";
    display:block;
    color:#93c5fd;
    font-size:.78rem;
    line-height:1.45;
    padding-top:4px;
  }
  .hub354-note{
    margin:12px 10px 24px !important;
    padding:10px 12px !important;
    border-radius:14px !important;
    background:#ffffff !important;
    border:1px solid #dbeafe !important;
    font-size:.72rem !important;
    line-height:1.4 !important;
  }
}

@media (max-width: 390px){
  .hub393-hero h1{
    font-size:2.1rem !important;
  }
  .hub393-actions{
    grid-template-columns:1fr !important;
  }
  .hub394-mobile-nav{
    grid-template-columns:1fr 1fr;
  }
  .hub393-stats{
    grid-template-columns:1fr !important;
  }
}
