/* Approved four-screen mobile prototypes. Loaded only below 721px. */
:root{
 --mobile-gutter:clamp(20px,6.154vw,28px);
 --mobile-body:clamp(16px,4.49vw,18px);
 --mobile-leading:calc(var(--mobile-body)*1.5);
 --mobile-display:clamp(30px,9.23vw,36px);
 --mobile-copy-gap:clamp(16px,2.4svh,20px);
 --mobile-header-space:clamp(112px,14svh,128px);
}
.copy-container,.footer-inner{width:min(560px,calc(100% - var(--mobile-gutter)*2));max-width:none;margin-inline:auto}
.topbar .nav-logo{left:var(--mobile-gutter);top:max(24px,env(safe-area-inset-top));width:58px;gap:4px}
.topbar .nav-logo img{width:36px;height:36px;border-radius:9px}
.nav-brand-name{font-size:12px;line-height:16px}
.menu-toggle{right:calc(var(--mobile-gutter) - 4px);top:max(20px,env(safe-area-inset-top));width:44px;height:44px}
body[data-active-section="3"] .topbar{height:92px;background:#000}
.hero-copy,.section-copy,.app-panel .section-copy{width:100%;max-width:none}
.hero-copy h1,.section-copy h2,.stories-panel h2,.app-panel h2{font-size:var(--mobile-display);line-height:1.12;letter-spacing:0}
.hero-copy p,.section-copy p,.app-panel .app-copy,.closing-copy p{font-size:var(--mobile-body);line-height:var(--mobile-leading);letter-spacing:0;text-wrap:pretty}
.hero-copy p,.section-copy p{margin-top:var(--mobile-copy-gap)}
.hero-panel .copy-container{display:block;padding-top:clamp(224px,41svh,430px)}
.hero-copy{padding:0}
.hero-copy h1{max-width:none;font-size:clamp(28px,calc((100vw - var(--mobile-gutter)*2)*.0994),34px);line-height:1.12;letter-spacing:-.35px}
.hero-copy p>span{display:block}
.hero-download{margin-top:28px}
.store-button{width:250px;max-width:100%;min-height:52px;font-size:18px;line-height:26px;padding:12px 14px 12px 20px}
.hero-foot{bottom:max(24px,env(safe-area-inset-bottom))}
.hero-markers button{width:clamp(30px,9.75vw,42px);min-height:32px}
.stories-panel .section-copy{position:static}
.stories-panel .copy-container{padding:0;align-items:center}
.stories-panel .section-copy p{max-width:100%}
.stories-canvas:after{content:'';position:absolute;inset:25% 0;background:linear-gradient(0deg,transparent,#09070db3 28%,#09070db3 70%,transparent);pointer-events:none}
.app-panel{display:flex;flex-direction:column;gap:clamp(20px,3.3svh,32px);padding:var(--mobile-header-space) 0 max(24px,env(safe-area-inset-bottom))}
.app-panel .copy-container{flex:0 0 auto;display:block;height:auto;padding:0;margin:0 auto}
.app-panel .section-copy{position:static}
.app-panel .app-copy{margin-top:var(--mobile-copy-gap);min-height:calc(var(--mobile-leading)*2);letter-spacing:-.12px;text-wrap:balance}
.app-stack{position:relative;left:auto;top:auto;bottom:auto;transform:none;width:100%;max-width:560px;margin:0 auto;display:flex;flex:1 1 auto;flex-direction:column;min-height:0;--side-offset:clamp(64px,22vw,108px)}
.stack-stage{flex:1 1 auto;height:auto;min-height:140px;max-height:clamp(240px,49svh,480px)}
.stack-phone{top:0;width:auto;height:100%;aspect-ratio:1/2;--case-radius:clamp(18px,6.2vw,24px)}
.app-stack .app-tabs{flex:0 0 auto;width:100%;margin:16px 0 0;padding:0 var(--mobile-gutter);justify-content:space-between;gap:clamp(8px,2.8vw,16px);min-height:48px}
.app-stack .app-tabs button{font-size:clamp(14px,4.1vw,16px);line-height:24px;min-width:44px;min-height:48px;padding:10px 0}
.contact-panel{padding-top:var(--mobile-header-space);justify-content:flex-start;gap:clamp(28px,5svh,48px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;touch-action:pan-y;scroll-padding-top:96px}
.contact-panel::-webkit-scrollbar{display:none}
.closing-content{display:block;flex:0 0 auto;height:auto;min-height:auto;padding:0;margin:0 auto}
.closing-copy h2{font-size:clamp(23px,6.67vw,26px);line-height:1.23;letter-spacing:0}
.closing-copy p{margin-top:12px}
.closing-copy p>span{display:block}
.closing-copy article+article{margin-top:28px}
.closing-copy #get-app{margin-top:28px}
.contact-footer{flex:1 0 auto;min-height:172px;display:flex;align-items:flex-start}
.footer-inner{flex-direction:column;align-items:flex-start;gap:18px;margin-block:24px;padding-bottom:env(safe-area-inset-bottom)}
.footer-inner h3{font-size:16px;line-height:22px;margin-bottom:8px}
.footer-inner a[href^="mailto:"]{font-size:14px;line-height:22px}
.footer-inner p{font-size:13px;line-height:20px;margin-top:8px}
.legal-links{width:100%;gap:8px 16px;justify-content:space-between}
.legal-links a,.legal-links button{font-size:clamp(12px,3.4vw,14px);line-height:20px;min-height:44px;display:flex;align-items:center}
@media(max-width:359px){.app-panel .app-copy{min-height:calc(var(--mobile-leading)*3)}}
@media(max-height:740px){
 :root{--mobile-header-space:100px;--mobile-copy-gap:16px}
 .hero-panel .copy-container{padding-top:37svh}
 .hero-download{margin-top:24px}
 .app-panel{gap:20px;padding-bottom:max(16px,env(safe-area-inset-bottom))}
 .app-stack .app-tabs{margin-top:12px}
 .closing-copy h2{font-size:22px;line-height:28px}
 .closing-copy p{font-size:16px;line-height:23px;margin-top:8px}
 .closing-copy article+article{margin-top:20px}
 .closing-copy #get-app{margin-top:20px}
 .contact-panel{gap:24px}
 .contact-footer{min-height:156px}
 .footer-inner{margin-block:18px;gap:12px}
}
@media(max-height:620px){
 :root{--mobile-header-space:92px}
 .app-panel{gap:16px}
 .app-panel .app-copy{font-size:16px;line-height:24px}
 .hero-panel .copy-container{padding-top:34svh}
 .hero-copy p{margin-top:16px}
 .hero-download{margin-top:20px}
 .hero-foot{bottom:16px}
}