/* Shared full-width layout and persistent navigation. */
:root{--page-gutter:clamp(16px,3vw,56px)}
body{overflow-x:clip}
body>header,body>main,body>footer{max-width:none!important;width:100%;margin-left:0!important;margin-right:0!important;padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
body>header{position:sticky;top:0;z-index:100;background:var(--bg,#faf6ef);box-shadow:0 3px 12px #20211f0d;flex-shrink:0}
body:has(#home[hidden]) .top-nav{display:flex}
main.info-page,main.apps-page{max-width:none!important}
#home>.app-like-hero,#home>.home-grid,#home>.home-steps{max-width:none;width:100%}
#home .hero-heading>div{max-width:none}
#home .hero-heading img{right:0;max-width:none;width:min(39vw,700px)}
.top-nav a{scroll-margin-top:160px}
[id]{scroll-margin-top:160px}
@media(min-width:1000px){#home{column-gap:clamp(32px,5vw,100px)}.play-layout{grid-template-columns:minmax(0,1fr) minmax(330px,30%)}.info-page .how-grid{max-width:none}}
@media(max-width:999px){#home .hero-heading img{position:static;width:200px;max-width:55%}}
@media(max-width:650px){body>header{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}.top-nav{gap:clamp(12px,4vw,32px);flex-wrap:wrap}}
@media(min-width:651px) and (max-width:1100px){body>header{height:auto!important;min-height:90px;padding-top:12px;padding-bottom:8px;flex-wrap:wrap;gap:8px}header>.brand{order:0}header>.secondary{order:1;margin-left:auto}.top-nav{order:2;width:100%;margin:0;justify-content:center;gap:24px}}
