
.mobile-hero{padding:48px 0 40px}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:46px;align-items:center}
.mobile-hero h1{font-size:clamp(3.2rem,5.8vw,5.9rem);line-height:.9;letter-spacing:-.06em;margin:12px 0 20px}
.lead{font-size:1.17rem;line-height:1.65;color:#d8dde7}
.wtf{margin:20px 0;padding:15px 17px;border-left:3px solid var(--cyan);background:rgba(86,215,255,.055);border-radius:0 12px 12px 0;font-weight:850}

.tablet-scene{width:min(100%,480px);justify-self:center;position:relative;height:400px;display:grid;place-items:center}
.tablet-device{position:relative;width:305px;height:390px;padding:17px;background:#171c23;border:1px solid #4a5562;border-radius:26px;box-shadow:0 30px 64px rgba(0,0,0,.48);transform:rotate(4deg);z-index:2}
.tablet-camera{position:absolute;width:6px;height:6px;border-radius:50%;background:#48515c;top:6px;left:50%;transform:translateX(-50%)}
.tablet-screen{position:relative;width:100%;height:100%;border-radius:15px;overflow:hidden;background:linear-gradient(145deg,#132735,#183044 48%,#281d43);padding:25px 20px 60px;box-sizing:border-box}
.app-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.app-grid i{aspect-ratio:1;border-radius:14px;background:linear-gradient(145deg,#2d4c61,#3a627d);border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;font-style:normal;font-size:1.55rem;box-shadow:0 8px 18px rgba(0,0,0,.2)}.app-grid i:nth-child(2n){background:linear-gradient(145deg,#593b70,#775095)}
.dock{position:absolute;left:26px;right:26px;bottom:15px;height:42px;border-radius:15px;background:rgba(255,255,255,.1);display:flex;justify-content:center;align-items:center;gap:15px;backdrop-filter:blur(6px)}.dock b{width:26px;height:26px;border-radius:8px;background:#74b7dc}.dock b:nth-child(2){background:#f09d62}.dock b:nth-child(3){background:#8bcf8c}.dock b:nth-child(4){background:#c98ee1}
.finger{position:absolute;right:23px;bottom:17px;width:105px;height:170px;background:linear-gradient(160deg,#e2af92,#b87f68);border-radius:55px 55px 28px 28px;transform:rotate(-25deg);z-index:4;box-shadow:0 12px 24px rgba(0,0,0,.25)}.finger:before{content:"";position:absolute;left:30px;top:-58px;width:47px;height:115px;border-radius:26px 26px 15px 15px;background:linear-gradient(160deg,#efbea0,#c98f75)}.finger span{position:absolute;left:39px;top:-48px;width:29px;height:35px;border-radius:16px;background:rgba(255,220,205,.35)}
.touch-ring{position:absolute;border:2px solid var(--cyan);border-radius:50%;width:52px;height:52px;right:92px;top:105px;opacity:.45;animation:touchpulse 2s ease-out infinite}.r2{animation-delay:1s}@keyframes touchpulse{0%{transform:scale(.3);opacity:.8}100%{transform:scale(1.8);opacity:0}}

.fact-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-top:28px}.fact{background:var(--panel);border:1px solid var(--line);border-radius:17px;padding:17px}.fact strong{display:block;color:var(--gold);font-size:1.18rem}.fact small{color:var(--muted)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:24px}
.network-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.network-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:22px}.network-card .g{font-size:2.35rem;font-weight:950;color:var(--cyan)}

.race-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px;align-items:stretch}.gesture-buttons{display:grid;grid-template-columns:1fr 1fr;gap:9px}.gesture{padding:13px;border:1px solid var(--line);border-radius:11px;background:#202936;color:#fff;font-weight:900;cursor:pointer}.gesture.active{border-color:var(--cyan);background:#16303d;outline:1px solid rgba(86,215,255,.35)}.gesture-copy{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.touch-demo{min-height:330px;border-radius:22px;background:#0c121b;border:1px solid var(--line);display:grid;place-items:center;padding:20px;position:relative}.demo-tablet{width:min(100%,360px);height:235px;background:#252c34;border:1px solid #596473;border-radius:22px;padding:14px}.demo-screen{height:100%;position:relative;border-radius:12px;background:linear-gradient(135deg,#193042,#172335);overflow:hidden;display:grid;place-items:center}.demo-object{font-size:4.3rem;transition:transform .5s,left .5s,opacity .25s;position:relative}.swipe-track{position:absolute;left:18%;right:18%;top:50%;height:3px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:0;transform:translateY(-50%)}.pen-line{position:absolute;left:18%;top:66%;width:0;height:4px;background:var(--orange);border-radius:99px;transform:rotate(-12deg);transform-origin:left;transition:width .7s}.gesture-status{position:absolute;bottom:11px;font-weight:850;color:#cbd5df;font-size:.83rem}
.touch-demo.do-swipe .demo-object{transform:translateX(90px)}.touch-demo.do-swipe .swipe-track{opacity:.7}.touch-demo.do-pinch .demo-object{transform:scale(1.75)}.touch-demo.do-write .pen-line{width:58%}.touch-demo.do-write .demo-object{opacity:.2}

.compare-lab{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.device-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:25px;text-align:center}.device-card span{display:block;font-size:3.4rem;margin-bottom:12px}.device-card strong,.device-card small{display:block}.device-card small{color:var(--muted);margin-top:8px}.device-card.highlight{border-color:rgba(86,215,255,.65);box-shadow:0 0 32px rgba(86,215,255,.08)}

.latency-lab{display:grid;grid-template-columns:1fr 1fr;gap:18px}.school-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.school-item{min-height:92px;padding:13px;border:1px solid var(--line);border-radius:15px;background:#18212c;color:#fff;font-size:1.8rem;cursor:pointer}.school-item span{display:block;font-size:.82rem;font-weight:900;margin-top:5px}.school-item.active{background:#153327;border-color:var(--green);box-shadow:0 0 20px rgba(65,210,133,.1)}.school-score{display:flex;align-items:baseline;gap:8px;margin:13px 0}.school-score strong{font-size:4rem;color:var(--gold);line-height:1}.school-score span{color:var(--muted)}

.quiz-options{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.choice{padding:14px;border:1px solid var(--line);border-radius:12px;background:#202631;color:#fff;font-weight:900;cursor:pointer}.choice.good{outline:2px solid var(--green);background:#113426}.choice.bad{outline:2px solid #ff6969;background:#3a1719}.quiz-result{min-height:44px;margin-top:14px;font-weight:850}
.faq details{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:16px 18px;margin:9px 0}.faq summary{font-weight:900;cursor:pointer}
.sources{color:var(--muted);border-top:1px solid var(--line);padding-top:20px}.sources a{color:#a9e8ff}
.next-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.next-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:19px;text-decoration:none}.next-card strong{display:block;margin:5px 0}.next-card small{color:var(--muted)}

@media(max-width:820px){
 .hero-grid,.race-grid,.latency-lab{grid-template-columns:1fr}
 .fact-strip{grid-template-columns:1fr 1fr}
 .network-cards,.compare-lab{grid-template-columns:1fr}
 .mobile-hero h1{font-size:clamp(3rem,14vw,5rem)}
 .tablet-scene{transform:scale(.82);margin:-30px 0}
 .quiz-options,.next-cards{grid-template-columns:1fr}
}
