/* Small-screen layouts reserve separate space for reading, the portrait and touch controls. */
.touch-hint{display:none;pointer-events:none;font-size:11px;font-weight:700;line-height:1.5;letter-spacing:.015em}
@media(pointer:coarse){.touch-hint{display:block;margin-bottom:10px}.interaction-hint{display:none}}
.reduce-motion .touch-hint{display:none}
.plan-dialog .dialog-close{width:44px;height:44px}
.plan-dialog{overscroll-behavior:contain;scroll-padding-block:68px 24px}
.dialog-highlight>span{color:#ff7979}
.back-top{width:46px;height:46px}
#motion-toggle{min-height:44px;padding:8px 4px}
.footer-top>div a{display:flex;align-items:center;min-height:44px}
.menu-bottom>div a{min-height:44px;display:flex;align-items:center}
.menu-bottom>div a:first-child span{margin-left:auto;padding-left:25px}

/* Tablets with touch input keep one layout when browser chrome or a keyboard opens. */
@media(min-width:701px){
 .touch-layout .manifesto-track,.touch-layout .benefits-track,.touch-layout .journey-track,.touch-layout .black-track{height:auto!important}
 .touch-layout .manifesto-stage,.touch-layout .benefits-stage,.touch-layout .journey-stage,.touch-layout .black-stage{position:relative;height:auto;min-height:0}
 .touch-layout .manifesto-stage{padding:100px 7vw 85px}
 .touch-layout .manifesto-text{margin:45px 0;font-size:clamp(34px,5vw,56px)}
 .touch-layout .benefits-stage{padding:90px 5vw 55px}
 .touch-layout .journey-stage{padding:70px 0}
 .touch-layout .journey-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:auto;gap:40px 28px;padding:0 5vw;transform:none!important}
 .touch-layout .journey-card:nth-child(n){width:100%;min-width:0;padding:0}
 .touch-layout .journey-media{height:auto;aspect-ratio:1;min-height:0}
 .touch-layout .journey-progress{display:none}
 .touch-layout .black-stage{padding:90px 7vw 100px}
 .touch-layout .black-heading{position:relative;top:auto;left:auto;margin:45px 0}
 .touch-layout .black-heading h2{font-size:90px}
 .touch-layout .black-orbit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
 .touch-layout .black-feature{position:relative;top:auto;right:auto;text-align:left;max-width:none}
 .touch-layout .black-feature strong{font-size:clamp(26px,3.4vw,36px)}
 .touch-layout .black-feature span{margin:0;font-size:12px}
 .touch-layout .black-cta{position:relative;bottom:auto;left:auto;margin-top:45px}
}

@media(max-width:700px){
 html{scroll-padding-top:80px}
 .site-header{padding:calc(12px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));gap:10px}
 .brand-link{width:clamp(104px,32vw,140px);flex-shrink:0}
 .brand-link img{height:36px}
 .header-actions{gap:6px;flex-shrink:0}
 .site-header .button-small{min-height:44px;padding:9px 10px;font-size:10px;gap:9px;white-space:nowrap}
 .site-header .button-small>span{font-size:20px}
 .menu-toggle{width:44px;height:44px;flex-shrink:0}
 .hero-track{height:180svh}
 .hero-stage{height:100svh;min-height:540px}
 .hero-side-left{top:calc(88px + env(safe-area-inset-top));left:16px;right:16px;width:auto}
 .hero-side-left>p{font-size:clamp(26px,7vw,32px);margin:9px 0 0;line-height:1.05}
 .hero-side-left>p em{display:block;margin:2px 0 0;line-height:1.1}
 .hero-side-left .micro{font-size:11px}
 .hero-plan-tag{left:16px;right:16px;bottom:calc(115px + env(safe-area-inset-bottom));width:auto;min-height:60px;padding:9px 13px;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;background:#f8f5eff5;backdrop-filter:none}
 .hero-plan-tag strong{grid-column:1;grid-row:1/3;font-size:36px;margin:0}
 .hero-plan-tag>span:first-child{grid-column:2;align-self:end;font-size:10px}
 .hero-plan-tag>span:last-of-type{grid-column:2;align-self:start;font-size:11px}
 .hero-plan-tag i{display:none}
 .hero-interaction{left:16px;right:16px;bottom:calc(52px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;text-align:center}
 .touch-hint{display:flex;align-items:center;justify-content:center;margin:0;padding:6px;min-height:54px}
 .gamer-toggle{width:100%;min-height:54px;margin:0;padding:8px 10px;font-size:11px;line-height:1.35;letter-spacing:0;border-radius:5px;backdrop-filter:none}
 .gamer-toggle{gap:6px;justify-content:center}
 .gamer-toggle .toggle-dot{flex-shrink:0}
 .gamer-toggle .gamer-label{min-width:0}
 .reduce-motion .hero-interaction .gamer-toggle{grid-column:1/-1}
 .scroll-cue{bottom:calc(5px + env(safe-area-inset-bottom));min-height:42px;flex-direction:row;gap:10px;white-space:nowrap;mix-blend-mode:normal;color:var(--ink);font-size:9px;background:#f8f5eff0;padding:0 12px;border-radius:4px}
 .scroll-cue i{font-size:20px}
 .hero-fallback{width:var(--mobile-portrait-size,140vw);height:var(--mobile-portrait-size,140vw);bottom:110px}
 .hero-stamp span{font-size:10px}
 .menu-inner{padding:calc(14px + env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) calc(16px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}
 .menu-top{gap:12px;padding-block:4px}
 .menu-top>img{width:128px;height:36px}
 .menu-close{min-height:44px;gap:8px}
 .menu-body{margin:16px 0}
 .menu-panel nav a{font-size:clamp(28px,8.1vw,42px);padding:12px 0;gap:10px}
 .menu-panel nav a small{min-width:16px}
 .menu-panel nav a>.menu-link-arrow{font-size:24px}
 .menu-panel nav a>.menu-link-mask{padding:5px 0}
 .menu-bottom{padding-top:14px;gap:6px}
 .menu-bottom>span{font-size:10px}
 .menu-bottom>div{gap:0;width:100%}
 .menu-bottom>div a:first-child{font-size:24px}
 .menu-bottom>div a{font-size:14px;overflow-wrap:anywhere}
 .manifesto-track{height:auto!important}
 .manifesto-stage,.reduce-motion .manifesto-stage{position:relative;height:auto;min-height:0;padding:90px 7vw 80px}
 .manifesto-text{font-size:clamp(28px,8.8vw,46px);margin:38px 0;line-height:1.2}
 .manifesto-bottom{gap:22px}
 .manifesto-bottom>a{min-height:44px;display:flex;align-items:center}
 .benefits-stage{padding:80px 6vw 55px}
 .benefits-heading h2{font-size:clamp(44px,13.5vw,60px)}
 .benefit-card{padding:24px;min-height:300px}
 .benefit-card h3>span{font-size:clamp(22px,6.4vw,28px)}
 .benefits-link{min-height:44px}
 .journey-stage{padding:40px 0 70px}
 .journey-media{height:auto;aspect-ratio:1;min-height:0}
 .journey-caption h3{font-size:clamp(30px,9vw,38px)}
 .journey-heading>h2{font-size:clamp(36px,11vw,48px)}
 .mode-section{height:auto;min-height:0}
 .mode-panel{height:clamp(440px,65svh,600px)}
 .mode-content h2{max-width:calc(100% - 60px);font-size:clamp(70px,22vw,104px)}
 .mode-panel .portrait-tile{bottom:-10vw}
 .plan-card{padding:25px clamp(18px,5.5vw,26px);border-radius:5px 28px 5px 5px}
 .plan-speed{font-size:clamp(58px,18.5vw,80px)}
 .plan-speed>span{font-size:14px;margin-left:7px}
 .plan-card li{overflow-wrap:break-word}
 .plan-card ul{line-height:1.6}
 .plan-top{letter-spacing:0}
 .plan-button{padding-inline:14px}
 .black-track,.reduce-motion .black-track{height:auto!important;min-height:0}
 .black-stage,.reduce-motion .black-stage{position:relative;height:auto;min-height:0;padding:85px 6vw 95px}
 .black-stage>.section-label{gap:15px;font-size:10px}
 .black-heading{position:relative;top:auto;left:auto;margin:48px 0 40px}
 .black-heading h2{font-size:clamp(68px,21vw,96px)}
 .black-number{align-items:start;padding-top:200px}
 .black-orbit{display:grid;gap:27px}
 .black-feature{position:relative;top:auto;right:auto;text-align:left;max-width:none}
 .black-feature strong{font-size:32px}
 .black-feature span{font-size:12px;margin-left:0;max-width:none}
 .black-cta{position:relative;left:auto;right:auto;bottom:auto;display:flex;flex-wrap:wrap;margin-top:36px;gap:20px}
 .black-cta .button{flex:1 1 180px;min-height:54px;font-size:12px}
 .coverage-copy>.text-link{align-items:start;font-size:14px;line-height:1.6}
 .faq summary span{min-width:0}
 .closing{min-height:590px;height:80svh}
 .closing h2{margin-top:105px;font-size:13.2vw}
 .closing>.button{max-width:100%;font-size:11px;gap:18px}
 .plan-dialog{padding:68px 22px 24px;max-height:calc(100dvh - 24px);color:var(--paper)}
 .plan-dialog h2{font-size:48px;overflow-wrap:break-word}
 .dialog-highlight{flex-wrap:wrap;gap:10px}
 .dialog-highlight strong{font-size:32px}
 .dialog-highlight>span{font-size:18px}
 .dialog-footnote{font-size:12px;line-height:1.6}
}
/* A rotated phone has width but very little height: keep the controls in reach. */
@media(orientation:landscape) and (max-width:950px) and (max-height:500px){
 .site-header{padding:12px max(20px,env(safe-area-inset-right)) 12px max(20px,env(safe-area-inset-left))}
 .brand-link{width:145px}.brand-link img{height:40px}.header-symbol{display:none}
 .hero-stage{height:100svh;min-height:0}
 .hero-side-left{top:100px;left:24px;right:auto;width:180px;max-width:180px;text-align:left}
 .hero-side-left>p{font-size:26px}.hero-side-left .micro{font-size:10px}.hero-side-left>.micro:last-child,.hero-side-right{display:none}
 .hero-plan-tag{bottom:25px;left:24px;right:auto;width:185px;padding:12px;font-size:9px;display:block}.hero-plan-tag strong{font-size:34px}
 .hero-interaction{bottom:75px;left:auto;right:max(24px,env(safe-area-inset-right));width:190px;display:flex;flex-direction:column;gap:8px}
 .gamer-toggle{font-size:10px;min-height:48px;width:100%}
 .touch-hint{font-size:10px;min-height:0}
 .interaction-hint{display:none}.scroll-cue{bottom:5px}
 .hero-fallback{width:var(--mobile-portrait-size);height:var(--mobile-portrait-size);bottom:-2%}
 .menu-inner{padding:10px max(24px,env(safe-area-inset-right)) 16px max(24px,env(safe-area-inset-left))}
 .menu-kicker{display:none}.menu-body{margin:12px 0}
 .menu-panel nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:25px}
 .menu-panel nav a{font-size:30px;padding:10px 0;gap:10px}.menu-panel nav a:nth-child(2){border-top:1px solid #ffffff30}
 .menu-bottom{padding-top:12px}.menu-bottom>div{flex-direction:row;align-items:center;gap:25px}.menu-bottom>div a:first-child{font-size:20px}.menu-bottom .menu-note{display:none}
}
@media(orientation:landscape) and (max-width:700px) and (max-height:500px){
 .hero-side-left{top:88px;left:18px;width:138px}.hero-side-left>p{font-size:21px}.hero-side-left .micro{font-size:9px}
 .hero-plan-tag{left:18px;width:150px;bottom:26px;padding:9px}.hero-plan-tag strong{font-size:30px}.hero-plan-tag>span:last-of-type{font-size:8px}
 .hero-interaction{right:18px;width:154px;bottom:61px}
 .gamer-toggle{min-height:48px;font-size:10px;padding:8px}
 .menu-inner{padding-block:8px}.menu-body{margin:6px 0}.menu-panel nav a{font-size:24px;padding:7px 0}.menu-bottom{padding-top:7px}.menu-bottom>span{display:none}.menu-bottom>div{justify-content:space-between}.menu-bottom>div a{font-size:13px}
}