/* ====================================================================
   Mobile-first overrides — comprehensive responsive pass.
   Loaded LAST so it wins specificity ties. Targets:
     • ≤900px (tablet/phablet — burger menu shows)
     • ≤640px (phone landscape)
     • ≤480px (phone portrait)
   ==================================================================== */

/* ---------- HEADER ---------- */
@media (max-width:900px){
 /* Hide desktop nav CTA — Launch Bot only inside the burger panel */
 .nav-cta{display:none !important}
 .nav-links{display:none !important}
 .nav-burger{display:flex !important}
 /* Compact site header on mobile */
 .site-header .nav{padding:10px 0}
}

/* ---------- HERO ---------- */
@media (max-width:760px){
 .hero-v4{padding:80px 0 32px}
 .hv4-stage{padding:0 16px}
 .hv4-h1-line{font-size:clamp(34px,10vw,52px);white-space:normal;line-height:1.05}
 .hv4-sub{font-size:14.5px;line-height:1.55;margin-top:1.2em;padding:0 4px}
 .hv4-h1-nets{margin-top:1em;padding:0 12px;gap:6px;flex-direction:column;align-items:center}
 .hv4-h1-nets-rule{display:none}
 .hv4-h1-nets-label{font-size:10px;letter-spacing:.18em;color:var(--text-mute)}
 .hv4-h1-nets-list{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;width:100%}
 .hv4-net-chip{font-size:11.5px;padding:4px 9px;gap:5px;border-radius:999px;line-height:1.1}
 .hv4-net-chip img{width:13px;height:13px;border-radius:3px}
 .hv4-cta{flex-direction:column;align-items:stretch;gap:12px;margin-top:1.6em;padding:0 4px}
 .hv4-cta .btn{width:100%;justify-content:center;white-space:normal;text-align:center}
 .hv4-cta .btn-lg,.hv4-cta .btn-xl{padding:14px 20px;font-size:15px;border-radius:12px}
 .hv4-cta .btn svg{width:16px;height:16px;flex:none}
 .hv4-belt{flex-direction:column;align-items:flex-start;gap:10px;border-radius:14px;padding:12px 14px}
 .hv4-belt-feed{width:100%;gap:14px}
 .hv4-belt-r{align-self:flex-end;font-size:10.5px}
}

/* Pillars stack on mobile */
@media (max-width:760px){
 .hv4-pillars{grid-template-columns:1fr;gap:14px}
 .hv4-pillar{padding:22px 20px 20px}
 .hv4-pillar-num{top:18px;right:18px;font-size:10px}
 .hv4-pillar-h{font-size:17px}
 .hv4-pillar-p{font-size:14px}
}

/* ---------- STATS ---------- */
@media (max-width:760px){
 .stats-grid{grid-template-columns:repeat(2,1fr) !important;gap:14px}
 .stat-num{font-size:28px !important}
 .stat-lbl{font-size:11.5px !important}
}

/* ---------- NETWORKS SECTION ---------- */
@media (max-width:760px){
 .nets-grid-cards{grid-template-columns:1fr !important;gap:12px !important}
 .nets-bridge{flex-direction:column;align-items:flex-start;text-align:left;padding:18px 18px;gap:14px}
 .nbridge-cta{width:100%;justify-content:center}
 .nrail-item{font-size:12px;padding:6px 12px}
}

/* ---------- LIVE EXECUTION MESH ---------- */
@media (max-width:760px){
 .nt-split{grid-template-columns:1fr !important}
 .nt-stats{flex-wrap:wrap;gap:8px}
 .nt-stat{flex:1 1 45%}
 .nt-pane{min-height:auto}
 .nt-stream{font-size:11.5px;padding:12px 14px}
 .nlog-line{flex-wrap:wrap}
 .nt-throughput{flex-wrap:wrap}
 .tp{flex:1 1 30%}
 .nt-foot{flex-wrap:wrap;gap:10px}
 .nt-foot-item.right{margin-left:0}
}

/* ---------- HOW IT WORKS ---------- */
@media (max-width:760px){
 .steps{grid-template-columns:1fr !important;gap:14px}
 .step{padding:22px 20px}
}

/* ---------- FEATURES BENTO ---------- */
@media (max-width:760px){
 .bento{grid-template-columns:1fr !important;grid-auto-rows:auto !important;gap:12px !important}
 .bento-card{grid-column:1/-1 !important;grid-row:auto !important;padding:22px 20px;min-height:auto !important}
 .b-1,.b-2,.b-3,.b-4,.b-5,.b-6,.b-7,.b-feature,.b-dark{grid-column:1/-1 !important;grid-row:auto !important}
 .b-feature .b-title,.bento-card h3{font-size:18px}
 .graduate-multi{flex-wrap:wrap;justify-content:flex-start}
 .g-chip-lg{font-size:11px;padding:5px 10px}
}

/* ---------- ENGINE TABS ---------- */
@media (max-width:760px){
 .ars-tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
 .ars-tabs::-webkit-scrollbar{display:none}
 .ars-tab{flex:none;font-size:12px;padding:8px 12px;white-space:nowrap}
 .ars-grid{grid-template-columns:1fr !important;gap:10px !important}
 .ars-card{padding:18px 16px}
 .ars-showcase{padding:22px 20px}
 .organic-banner{flex-direction:column;align-items:flex-start;gap:18px;padding:20px 18px}
 .ob-meters{width:100%}
}

/* ---------- PRICING CALCULATOR ---------- */
@media (max-width:760px){
 .calc-unified{padding:20px 18px}
 .cu-header{flex-direction:column;align-items:stretch;gap:14px}
 .cu-arrow{align-self:center;transform:rotate(90deg)}
 .cu-hcol-right{text-align:left !important}
 .cu-hcol{text-align:left !important}
 .calc-big{font-size:36px}
 .calc-presets-segmented{flex-wrap:wrap;justify-content:flex-start}
 .calc-preset{flex:1 1 28%;font-size:13px;padding:8px 6px}
 .cu-controls-foot{flex-direction:column;align-items:stretch;gap:10px}
 .cfg-sliders-grid{grid-template-columns:1fr !important}
 .cpv-grid{grid-template-columns:repeat(2,1fr) !important;gap:10px}
 .cpv strong{font-size:18px}
 .cu-footer{flex-direction:column;align-items:stretch;gap:14px}
 .cu-footer .btn{width:100%;justify-content:center}
}

/* ---------- STATUS BARS ---------- */
@media (max-width:760px){
 .status-top{flex-direction:column;align-items:flex-start;gap:14px}
 .status-head-right{align-self:flex-start}
 .st-bar{height:32px}
}

/* ---------- FAQ ---------- */
@media (max-width:760px){
 .faq-board{grid-template-columns:1fr !important}
 .faq-q summary{padding:14px 16px;font-size:14px}
 .fq-n{font-size:11px}
 .fq-t{font-size:14.5px;line-height:1.4}
 .fq-a{padding:0 16px 16px}
 .fq-a p{font-size:14px;line-height:1.55}
}

/* ---------- CTA SECTION ---------- */
@media (max-width:760px){
 .cta-box{flex-direction:column;align-items:stretch;padding:28px 20px;gap:24px}
 .cta-h{font-size:clamp(24px,6vw,32px) !important}
 .cta-actions{flex-direction:column;align-items:stretch}
 .cta-actions .btn{width:100%;justify-content:center}
 .cta-stepcard{align-self:stretch}
}

/* ---------- FOOTER ---------- */
@media (max-width:760px){
 .footer-grid{grid-template-columns:1fr !important;gap:24px}
 .footer-col{margin-top:0}
 .footer-h{font-size:13px}
 .footer-nets{justify-content:flex-start}
 .seo-article{padding:36px 0}
 .seo-h{font-size:22px !important;line-height:1.3}
 .seo-body p{font-size:14.5px;line-height:1.65}
 .seo-body h3{font-size:18px}
}

/* ---------- LIVE CHAT WIDGET ---------- */
@media (max-width:760px){
 .lc-launcher{right:16px !important;bottom:16px !important;width:52px !important;height:52px !important}
 .lc-panel{right:12px !important;left:12px !important;bottom:80px !important;width:auto !important;max-width:none !important}
}

/* ---------- COMMON SECTION SPACING ---------- */
@media (max-width:760px){
 .section{padding:clamp(48px,9vw,72px) 0 !important}
 .section-head{padding:0 12px}
 .h-xl{font-size:clamp(26px,6vw,38px) !important}
 .lead{font-size:15px;line-height:1.55}
 .container{width:min(var(--container),100% - 32px)}
}

/* ---------- TIGHT PHONE PORTRAIT ≤480px ---------- */
@media (max-width:480px){
 .hv4-h1-line{font-size:clamp(30px,11vw,42px)}
 .hv4-sub{font-size:13.5px}
 .hv4-h1-nets-list{gap:4px}
 .hv4-h1-nets-label{font-size:9.5px}
 .hv4-net-chip{font-size:11px;padding:3.5px 8px}
 .hv4-cta .btn{padding:12px 18px;font-size:14.5px}
 .hv4-pillar{padding:20px 18px 18px}
 .hv4-pillar-h{font-size:16px}
 .hv4-pillar-ico{width:42px;height:42px}
 .stats-grid{gap:10px !important}
 .stat-num{font-size:24px !important}
 .calc-big{font-size:30px}
 .footer-bottom p{font-size:11.5px;line-height:1.5}
 .lc-panel{bottom:74px !important}
}

/* ---------- TOUCH TARGETS ≥44px ---------- */
@media (max-width:760px){
 .btn,.faq-q summary,.ars-tab,.calc-preset,.curve-btn,.nlink,.fnet,.hv4-net-chip{
   min-height:44px;
 }
 .hv4-net-chip{min-height:32px}  /* chips can be smaller, decorative */
 .nlink{padding:10px 12px}
}

/* ---------- HORIZONTAL SCROLL PROTECTION ---------- */
@media (max-width:760px){
 html,body{overflow-x:hidden;max-width:100vw}
 .marquee{margin-left:-16px;margin-right:-16px}
 code{word-break:break-all;display:inline-block;max-width:100%}
}
