/* Phone layout. index.html loads it only under 700px; m.html (the mobile site) always loads it, so it looks the same in any window width. */
.web{display:grid;grid-template-columns:repeat(6,1fr);gap:26px 4px;height:auto;container-type:normal;margin-top:36px}
.spokes{display:none}
.web-cap{grid-column:1/-1;order:0;display:block;margin:0;max-width:none}
.ag{position:relative;left:auto;top:auto;transform:none;order:1;justify-self:center;width:48px;min-height:48px;padding:0;justify-content:center}
.ag.busy{transform:scale(1.12)}
.ag span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.panel{position:relative;left:auto;top:auto;transform:none;width:auto;grid-column:1/-1}
.hub{order:2}.cloud{order:3}
.hub:after,.cloud:before{content:"";position:absolute;left:50%;height:26px;border-left:2px dotted #7fb0ff99}
.hub:after{top:-27px}.cloud:before{top:-27px;border-color:#5ad28899}
.panel{overflow:visible}
.ph{padding:12px 14px}.ph b{font-size:14px}
.counts>div{padding:10px 14px}.counts strong{font-size:26px}
.feed{min-height:104px}.dep{min-height:118px}
.rows li{font-size:14px}.rows em{font-size:12px;white-space:nowrap}
.web .say{display:none}
.web .chip{font-size:14px;padding:7px 14px}
.caps{grid-template-columns:1fr;gap:20px}
:root{--nav-h:60px}.nav .in{gap:16px}.brand{font-size:17px}.btn.sm{padding:0 16px;font-size:15px}
.orbit{display:none}
.sec{padding:60px 0}
.hero{padding:48px 0 48px}
.facts{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:40px}
.facts li{padding:18px 10px;font-size:14px}
.cta{flex-direction:column;gap:4px}
.cta .btn{width:100%;max-width:340px}
.card{padding:24px}
.arch{padding:20px}
.sub-h{margin-top:56px}
.punch{white-space:normal;margin-top:48px;font-size:clamp(24px,7vw,30px)}
