/* ===== WMALL123 MOBILE OPTIMIZATION PATCH v2.0 ===== */
/* Prevent horizontal overflow */
*{box-sizing:border-box}
html,body{overflow-x:hidden;max-width:100%}

/* ===== Breakpoint: 1000px ===== */
@media(max-width:1000px){
  .ecosystem-module-grid{grid-template-columns:repeat(2,1fr)!important}
  .ecosystem-layout{flex-direction:column!important}
  .ecosystem-command{width:100%!important;max-width:500px;margin:0 auto 24px!important}
  .growth-grid{grid-template-columns:1fr!important}
  .solution-panel{flex-direction:column!important}
  .solution-screen{width:100%!important;max-width:500px;margin:0 auto 20px!important}
  .solution-evidence{width:100%!important}
  .feature-split{flex-direction:column!important}
  .feature-split>div{width:100%!important}
  .agent-console{width:100%!important;max-width:500px;margin:0 auto 20px!important}
  .social-inner{flex-direction:column!important}
  .social-inner>div{width:100%!important}
  .social-studio{max-width:500px;margin:0 auto!important}
  .marketplace .section{flex-direction:column!important}
  .marketplace>div{width:100%!important}
  .sync-visual{max-width:500px;margin:20px auto 0!important}
  .translation{flex-direction:column!important}
  .translation>div{width:100%!important}
  .translate-card{max-width:500px;margin:20px auto 0!important}
  .price-layout{grid-template-columns:1fr!important}
  .price-cards{grid-template-columns:repeat(2,1fr)!important}
  .calculator{width:100%!important}
  .cta>div{width:100%!important;max-width:600px;margin:0 auto!important}
  .footer-main{grid-template-columns:repeat(2,1fr)!important;gap:20px!important}
}

/* ===== Breakpoint: 768px ===== */
@media(max-width:768px){
  .nav{padding:12px 16px!important;flex-wrap:wrap!important}
  .nav-links{display:none!important;position:fixed;top:56px;left:0;right:0;background:#fff!important;border-bottom:3px solid #1769ff!important;flex-direction:column!important;padding:12px 16px!important;z-index:9999;gap:6px!important;max-height:80vh;overflow-y:auto;box-shadow:0 12px 40px rgba(23,105,255,.18)!important}
  .nav-links.open{display:flex!important}
  .nav-links a:not(.login){padding:14px 16px!important;font-size:16px!important;font-weight:700!important;width:100%!important;text-align:left!important;color:#0a1c4a!important;background:#f7faff!important;border:1px solid #eef2f8!important;border-radius:12px!important;transition:all .2s!important}
  .nav-links a:not(.login):hover,.nav-links a:not(.login):active{background:#eaf2ff!important;color:#1769ff!important;border-color:#c5dbff!important}
  .nav-links a.login{padding:14px 16px!important;font-size:15px!important;font-weight:800!important;width:100%!important;text-align:center!important;color:#fff!important;background:linear-gradient(135deg,#1769ff,#084bd0)!important;border:0!important;border-radius:12px!important;box-shadow:0 6px 18px rgba(23,105,255,.3)!important;margin-top:4px!important}
  .nav-links a.login:hover{transform:translateY(-1px)!important;box-shadow:0 10px 24px rgba(23,105,255,.4)!important}
  .nav-links .primary.small{margin-top:6px!important;padding:14px!important;text-align:center!important;font-size:15px!important;width:100%!important}
  .nav .menu-button{display:flex!important;align-items:center;justify-content:center;background:#eaf2ff!important;border:1px solid #d2e3ff!important;border-radius:10px!important;color:#1769ff!important;font-size:22px!important;font-weight:900!important;cursor:pointer!important;padding:8px 12px!important;line-height:1!important}
  .nav .menu-button:hover{background:#d2e3ff!important}
  .hero{padding:40px 16px 40px!important;min-height:auto!important}
  .hero-copy{width:100%!important;max-width:600px;margin:0 auto!important;text-align:center!important}
  .hero-visual{display:none!important}
  .hero h1{font-size:32px!important;line-height:1.3!important}
  .hero p{font-size:15px!important;line-height:1.6!important}
  .hero-actions{flex-direction:column!important;gap:12px!important;align-items:center!important}
  .hero-actions button,.hero-actions a{width:100%!important;max-width:320px}
  .hero-proof{flex-direction:column!important;gap:8px!important;align-items:center!important}
  .trust{flex-wrap:wrap!important;justify-content:center!important;gap:12px 24px!important;padding:20px 16px!important}
  .section{padding:50px 16px!important}
  .section-title h2{font-size:24px!important;line-height:1.4!important}
  .section-title p{font-size:14px!important}
  .camp-grid{grid-template-columns:1fr!important;gap:16px!important}
  .camp-schedule{flex-direction:column!important;gap:16px!important}
  .growth-path{flex-wrap:wrap!important;justify-content:center!important;gap:8px!important;font-size:13px!important}
  .ecosystem-module-grid{grid-template-columns:1fr!important;gap:12px!important}
  .ecosystem-card{padding:16px!important}
  .ecosystem-card b{font-size:16px!important}
  .ecosystem-card p{font-size:13px!important}
  .ecosystem-pipeline{flex-wrap:wrap!important;justify-content:center!important;gap:4px!important;font-size:12px!important}
  .ecosystem-pipeline i{width:20px!important}
  .flow{flex-direction:column!important;align-items:center!important;gap:8px!important}
  .flow-item{width:100%!important;max-width:320px;text-align:center!important}
  .flow-item i{display:none!important}
  .solution-tabs{flex-wrap:wrap!important;gap:8px!important}
  .solution-tabs button{padding:8px 14px!important;font-size:13px!important}
  .check-grid{grid-template-columns:1fr!important;gap:6px!important}
  .check-grid span{font-size:13px!important;padding:8px 12px!important}
  .growth-list article{padding:12px 0!important}
  .growth-list h3{font-size:15px!important}
  .growth-list p{font-size:13px!important}
  .market-price{flex-direction:row!important;align-items:center!important;gap:16px!important}
  .market-price strong{font-size:28px!important}
  .sync-stats em{font-size:24px!important}
  .sync-stats em small{font-size:12px!important}
  .language-list{flex-wrap:wrap!important;gap:6px!important}
  .language-list span{font-size:13px!important;padding:4px 10px!important}
  .translate-card{padding:16px!important}
  .price-cards{grid-template-columns:1fr!important;gap:12px!important}
  .price-cards article{padding:16px!important}
  .price-cards strong{font-size:24px!important}
  .calculator{padding:16px!important}
  .calculator input[type=range]{width:100%!important}
  .result-grid{grid-template-columns:1fr!important;gap:12px!important}
  .faq-list article{padding:12px 0!important}
  .faq-list button{font-size:14px!important;text-align:left!important}
  .faq-list p{font-size:13px!important;line-height:1.6!important}
  .cta-grid{display:none!important}
  .cta h2{font-size:22px!important;line-height:1.4!important}
  .cta p{font-size:14px!important}
  .cta>div>div{flex-direction:column!important;gap:12px!important;align-items:center!important}
  .cta button,.cta a{width:100%!important;max-width:320px;text-align:center!important}
  .footer-main{grid-template-columns:1fr!important;gap:16px!important;text-align:center!important}
  .footer-main>div{display:flex!important;flex-direction:column!important;align-items:center!important;gap:6px!important}
  .footer-bottom{flex-direction:column!important;gap:6px!important;text-align:center!important;padding:12px 16px!important}
}

/* ===== Breakpoint: 650px ===== */
@media(max-width:650px){
  .hero h1{font-size:28px!important}
  .hero p{font-size:14px!important}
  .section{padding:40px 14px!important}
  .section-title h2{font-size:20px!important}
  .section-title span{font-size:11px!important;letter-spacing:1px!important}
  .ecosystem-heading h2{font-size:18px!important}
  .ecosystem-command{padding:16px!important}
  .ecosystem-command h3{font-size:16px!important}
  .ecosystem-command p{font-size:13px!important}
  .camp-main h3{font-size:16px!important;line-height:1.4!important}
  .camp-schedule>div{padding:12px!important}
  .camp-schedule b{font-size:14px!important}
  .camp-schedule p{font-size:12px!important}
  .camp-follow ul li{font-size:13px!important;padding:6px 0!important}
  .social-chips{flex-wrap:wrap!important;gap:6px!important}
  .social-chips span{font-size:12px!important;padding:4px 8px!important}
  .studio-nav{padding:8px 12px!important}
  .video-preview{height:160px!important}
  .mini-header{padding:8px 12px!important;font-size:13px!important}
  .ring{width:60px!important;height:60px!important}
  .ring b{font-size:18px!important}
  .mini-bars>div>span{height:16px!important}
  .mini-bars small{font-size:10px!important}
  .activity{padding:8px 12px!important}
  .activity b{font-size:13px!important}
  .activity small{font-size:11px!important}
  .market-copy h2{font-size:20px!important}
  .market-copy p{font-size:13px!important}
  .sync-center{padding:16px!important}
  .sync-stats em{font-size:20px!important}
  .sync-node{padding:10px!important}
  .sync-node b{font-size:13px!important}
  .sync-node small{font-size:11px!important}
}

/* ===== Breakpoint: 380px ===== */
@media(max-width:380px){
  .hero h1{font-size:24px!important}
  .hero-actions button,.hero-actions a{font-size:14px!important;padding:10px 16px!important}
  .section{padding:32px 12px!important}
  .section-title h2{font-size:18px!important}
  .price-cards strong{font-size:20px!important}
  .market-price strong{font-size:24px!important}
  .footer-main p{font-size:12px!important}
  .footer-bottom span,.footer-bottom a{font-size:11px!important}
}

/* ===== Touch-friendly buttons ===== */
@media(max-width:768px){
  button,a.primary,a.secondary,.text-button,.white-button{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:10px 20px!important;
    font-size:14px!important;
  }
  .nav-links a.login,.nav-links a.primary{
    min-height:40px!important;
    padding:8px 16px!important;
  }
}

/* ===== Print optimization ===== */
@media print{
  .nav,.hero-visual,.cta-grid,.social-studio,.sync-visual,.agent-console,.solution-screen,.command-dashboard,.float-card{
    display:none!important;
  }
  body{color:#000!important;background:#fff!important}
  .section{padding:10px 0!important;page-break-inside:avoid}
}