/* One source scene and one set of content, rearranged for the available space. */
.header{padding:10px max(24px,env(safe-area-inset-left)) 10px max(24px,env(safe-area-inset-right));gap:26px;min-height:92px}.brand{display:block}.brand .wordmark,.footer-brand .wordmark{display:block}.wordmark{position:relative;overflow:hidden;width:174px;aspect-ratio:230/92;flex:none}.brand .wordmark img,.footer-brand .wordmark img{position:absolute;width:726.9565%;max-width:none;height:auto;border-radius:0;left:-26.087%;top:-4.348%;margin:0}.header-store{display:block;flex:none;width:150px;line-height:0;border-radius:8px}.header-store img{width:100%;height:auto}.header nav{gap:clamp(18px,2vw,34px)}.header nav a{font-size:.875rem}.store-button{display:inline-block;width:204px;min-width:0;padding:0;line-height:0;background:none;border:0;border-radius:11px;box-shadow:none}.store-button img{display:block;width:100%;height:auto}.store-button:hover{box-shadow:none;filter:brightness(1.08)}.footer-brand{display:block;flex:none}.footer-brand .wordmark{width:134px}.footer-brand .footer-tagline{display:block;font-size:.8rem;color:var(--muted)}footer{padding:24px max(30px,env(safe-area-inset-right)) 24px max(30px,env(safe-area-inset-left))}footer p,.footer-links{font-size:.8125rem}
.hero{min-height:0}.hero-layout{max-width:1540px;grid-template-columns:minmax(0,1fr) minmax(340px,420px) minmax(0,1fr);padding:30px 36px 90px;gap:28px;min-height:850px}.hero-scene{opacity:1;background-size:cover;background-position:center bottom}.hero:after{background:linear-gradient(90deg,#03030a10,#03030a05 25%,#02020ab3 43%,#03030ab3 57%,#03030a05 78%),linear-gradient(0deg,#05040b66,transparent 24%,#03030910 80%,#03030920)}.hero-icon{width:240px;height:240px}.hero h1{font-size:5.35rem;letter-spacing:-.055em;margin:16px 0}.coming-soon{margin:17px auto;font-size:.875rem}.hero-description{font-size:.9375rem;margin:17px 0 21px}.qr-block{margin-top:23px}.qr-link img{width:170px;height:170px}.qr-block p{font-size:.875rem}.intro{padding-top:60px;padding-left:3vw}.features{padding-top:75px}.feature p{font-size:.875rem}.hero-bottom{bottom:22px}.menu{min-width:44px;min-height:44px}.menu-label{font-size:.875rem}
.legal{background:#05040b;min-height:70vh;padding:48px 24px 90px}.legal-document{max-width:790px;margin:auto;line-height:1.8;color:#d8d4df;overflow-wrap:anywhere}.legal-document h1{color:#fff;font-size:clamp(2.2rem,4vw,3.6rem);letter-spacing:-.04em;line-height:1.15;margin:28px 0 14px}.legal-document .updated{color:#aba3b8;margin-bottom:52px}.legal-document h2{color:var(--pink);font-size:clamp(1.2rem,2vw,1.5rem);line-height:1.35;margin:42px 0 16px;font-weight:600}.legal-document h3{font-size:1.05rem;color:#eee9f4;margin-top:25px}.legal-document p,.legal-document li{font-size:1rem}.legal-document li{padding-left:5px;margin:7px 0}.legal-document ul{padding-left:22px}.legal-document a{color:#68daff;text-underline-offset:4px;text-decoration:underline}.legal-document .back-home{display:inline-block;min-height:44px;color:#d9cce6;text-decoration:none;border-bottom:1px solid #fb52dc55}.legal-document p:last-child{margin-top:32px}.inner-art{background:linear-gradient(#05040be6,#05040bf5),url('assets/neon-street-three.png') center/cover}
@media(min-width:1700px){.hero-layout{min-height:calc(100vw * .52);padding-top:48px}.hero-icon{width:280px;height:280px}.hero h1{font-size:6rem}.hero-scene{background-size:cover}.features,.intro{padding-top:85px}}
@media(max-width:1100px){.header{flex-wrap:wrap;gap:20px;min-height:82px}.header-store{margin-left:auto;width:141px}.header nav{order:4;flex-basis:100%;justify-content:center;gap:10px 25px;flex-wrap:wrap}.js .header nav{display:none}.js .header nav.open{display:flex}.menu{display:flex;gap:9px;align-items:center;justify-content:center;order:3;padding:8px 12px;border:1px solid #ffffff40;border-radius:9px;background:#0b0810;color:#fff}.brand .wordmark{width:148px}.hero-layout{grid-template-columns:minmax(0,1fr) 330px minmax(0,1fr);gap:16px;padding:26px 26px 80px;min-height:770px}.hero-icon{width:200px;height:200px}.hero h1{font-size:4.4rem}.intro{padding-left:0;padding-top:55px}.intro .eyebrow{font-size:.9rem}.features{padding:62px 0 0;gap:23px}.feature{gap:10px}.feature svg{width:27px;height:27px}.feature h2{font-size:.8125rem}.feature p{font-size:.875rem}.handwritten{font-size:28px}.hero-scene{background-size:100% auto;background-position:center bottom}.hero-bottom p{font-size:1.1rem}}
/* Compact cinema: preserve the full width of the Tokyo artwork, never zoom the cats. */
@media(orientation:landscape) and (max-width:1366px){.header{min-height:68px;padding-top:5px;padding-bottom:5px}.brand .wordmark{width:132px}.header-store{width:132px}.hero-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,32%) minmax(0,1fr);gap:18px;min-height:calc(100vw * .5628);padding:22px 28px 65px}.hero-center{grid-column:auto;grid-row:auto}.hero-icon{width:148px;height:148px}.hero h1{font-size:3.5rem;margin:12px 0}.coming-soon{font-size:.75rem;padding:5px 13px;margin:13px auto;letter-spacing:.21em}.hero-description{font-size:.8125rem;letter-spacing:.065em;margin:13px 0 17px}.store-button{width:170px}.qr-block{margin-top:19px}.qr-link img{width:148px;height:148px}.qr-block p{font-size:.8125rem;margin-top:9px}.qr-block p span{font-size:.75rem}.intro{padding-top:28px}.intro .eyebrow{font-size:.875rem}.handwritten{font-size:26px;margin-top:24px}.features{padding-top:38px;gap:20px}.feature h2{font-size:.8125rem}.feature p{font-size:.8125rem}.hero-scene{background-size:100% auto;background-position:center top}.hero:after{background:linear-gradient(90deg,transparent 20%,#03030a55 38%,#03030a99 50%,#03030a55 62%,transparent 80%),linear-gradient(0deg,#05040b 0%,transparent 28%)}.hero-bottom p{font-size:1rem}.hero-bottom{bottom:20px}}
@media(orientation:landscape) and (max-width:950px){.hero-layout{grid-template-columns:minmax(0,1fr) 270px minmax(0,1fr);padding-inline:18px;gap:12px}.hero-icon{width:120px;height:120px}.hero h1{font-size:3.2rem}.intro .eyebrow{font-size:.8125rem;letter-spacing:.12em}.handwritten{font-size:22px}.features{gap:17px}.feature{gap:8px}.feature svg{width:23px;height:23px}.feature p{font-size:.8125rem}.hero-scene{background-position:center 0}.hero-description{font-size:.8125rem}.qr-link img{width:148px;height:148px}}
/* Portrait reflows the same content; original signs and cats frame the centre. */
@media(orientation:portrait) and (max-width:1100px){.hero-layout{display:flex;flex-direction:column;align-items:center;gap:0;padding:30px 24px 76px;min-height:0}.hero-center{width:100%;order:0}.hero-icon{width:220px;height:220px}.hero h1{font-size:4.6rem}.intro{order:1;width:100%;padding:38px 0 0;text-align:center}.intro .eyebrow{font-size:.9375rem}.intro .eyebrow br{display:none}.handwritten{font-size:28px;transform:none;margin:15px auto 0;line-height:1.4}.handwritten br{display:none}.handwritten br:after{content:' '}.handwritten span{padding-left:0}.features{order:2;display:flex;justify-content:center;gap:25px;padding:32px 0 15px;max-width:650px}.feature{flex:1;flex-direction:column;align-items:center;text-align:center}.feature h2{font-size:.875rem}.feature p{font-size:.875rem}.hero-scene{background-size:auto 700px;background-position:center top}.hero:after{background:linear-gradient(90deg,transparent,#03030a66 35%,#03030a99 50%,#03030a66 65%,transparent),linear-gradient(0deg,#05040b 8%,#05040b77 35%,transparent 65%)}.hero-bottom{justify-content:center}.hero-bottom p:first-child{display:none}.hero-bottom p{font-size:1rem}}
@media(orientation:portrait) and (max-width:600px){.header{gap:12px;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));min-height:76px}.brand .wordmark{width:116px}.header-store{width:120px}.menu{width:44px;padding:0}.menu-label{display:none}.hero-layout{padding:27px 22px 74px}.hero-icon{width:182px;height:182px}.hero h1{font-size:3.8rem}.coming-soon{font-size:.8125rem;margin:20px auto}.hero-description{font-size:.875rem;letter-spacing:.055em;line-height:1.6}.store-button{width:186px}.qr-link img{width:180px;height:180px}.qr-block{margin-top:27px}.hero-scene{background-size:auto 500px;background-position:center 155px}.hero-scene:before,.hero-scene:after{content:'';position:absolute;top:15px;width:24%;height:410px;background-image:url('assets/neon-street-three.png');background-size:auto 520px;background-repeat:no-repeat;opacity:.85}.hero-scene:before{left:0;background-position:left top;mask-image:linear-gradient(90deg,#000 40%,transparent)}.hero-scene:after{right:0;background-position:right top;mask-image:linear-gradient(270deg,#000 40%,transparent)}.hero:after{background:linear-gradient(90deg,#03030a05,#03030a77 32%,#03030aaa 50%,#03030a77 68%,#03030a05),linear-gradient(0deg,#05040b 10%,#05040b99 30%,transparent 65%)}.intro{padding-top:36px}.intro .eyebrow{font-size:.875rem;letter-spacing:.1em}.handwritten{font-size:24px;max-width:320px}.features{flex-direction:column;gap:23px;align-items:flex-start;padding-top:30px}.feature{flex-direction:row;text-align:left;gap:16px;align-items:center}.feature svg{width:30px;height:30px}.feature h2,.feature p{font-size:.875rem}.legal{padding:28px 22px 65px}.legal-document h1{font-size:2.2rem}.legal-document .updated{margin-bottom:35px}.legal-document h2{margin-top:33px}.footer-links{gap:18px}.footer-brand .wordmark{width:126px}}
@media(max-width:360px){.header{gap:8px;padding-inline:12px}.brand .wordmark{width:105px}.header-store{width:110px}.hero h1{font-size:3.35rem}.hero-description{font-size:.8125rem}.hero-layout{padding-inline:18px}.handwritten{font-size:22px}}
@media(orientation:landscape) and (max-width:680px){.hero-layout{grid-template-columns:1fr 1.3fr 1fr;padding-inline:14px;gap:10px}.hero h1{font-size:2.65rem}.hero-icon{width:110px;height:110px}.intro .eyebrow{font-size:.8125rem}.handwritten{font-size:20px}.feature svg{display:none}.feature p{font-size:.8125rem}.hero-description{font-size:.8125rem}.store-button{width:150px}.hero-bottom{position:static;padding:0 16px 20px;justify-content:center}.hero-bottom p:first-child{display:none}}
@media(prefers-reduced-motion:reduce){.hero-icon{animation:none}.store-button{transition:none}}
@media(orientation:portrait) and (max-width:600px){.hero-scene:before{mask-image:linear-gradient(90deg,#000 40%,transparent),linear-gradient(0deg,transparent,#000 23%,#000 95%,transparent);mask-composite:intersect}.hero-scene:after{mask-image:linear-gradient(270deg,#000 40%,transparent),linear-gradient(0deg,transparent,#000 23%,#000 95%,transparent);mask-composite:intersect}}
@media(orientation:portrait) and (min-width:601px) and (max-width:1100px){.hero-scene:before,.hero-scene:after{content:'';position:absolute;top:10px;width:18%;height:540px;background-image:url('assets/neon-street-three.png');background-size:auto 700px;background-repeat:no-repeat;opacity:.85;mask-composite:intersect}.hero-scene:before{left:0;background-position:left top;mask-image:linear-gradient(90deg,#000 30%,transparent),linear-gradient(0deg,transparent,#000 25%,#000 95%,transparent)}.hero-scene:after{right:0;background-position:right top;mask-image:linear-gradient(270deg,#000 30%,transparent),linear-gradient(0deg,transparent,#000 25%,#000 95%,transparent)}}
/* Final brand audit: reuse the exact three-toe paw from the approved app artwork. */
.paw-emblem{position:relative;display:block;overflow:hidden;width:32px;aspect-ratio:190/193;flex:none}.paw-emblem img{position:absolute;width:673.6842%;max-width:none;height:auto;left:-114.7368%;top:-400.5181%}
/* Move both captions inward into the open sky, away from the neon storefronts. */
@media(min-width:1101px), (orientation:landscape){.intro{justify-self:end;align-self:start;width:min(100%,260px);padding:50px 0 0;text-align:center}.intro .eyebrow{position:relative;color:#fff;text-shadow:0 2px 4px #000,0 0 12px #000;line-height:1.65}.handwritten{font-size:32px;line-height:1.3;margin-top:30px;transform:rotate(-5deg);color:#ff9ae8;text-shadow:0 2px 4px #08020c,0 0 10px #090211,0 0 22px #090211}.handwritten span{padding-left:0}}
@media(orientation:landscape) and (max-width:1366px){.intro{width:min(100%,230px);padding-top:22px}.intro .eyebrow{font-size:.875rem;letter-spacing:.11em}.handwritten{font-size:26px;margin-top:24px}}
@media(orientation:landscape) and (max-width:950px){.intro{width:180px;max-width:100%;padding-top:14px}.intro .eyebrow{font-size:.8125rem;letter-spacing:.07em}.handwritten{font-size:23px;line-height:1.3;margin-top:22px}}
@media(orientation:landscape) and (max-width:680px){.intro{padding-top:10px;width:150px}.intro .eyebrow{font-size:.8125rem;letter-spacing:.02em}.handwritten{font-size:20px;transform:none}.paw-emblem{width:23px}}
@media(min-width:1367px){.intro{padding-top:105px}}
@media(orientation:landscape) and (min-width:951px) and (max-width:1366px){.intro{padding-top:76px}}
@media(orientation:landscape) and (min-width:681px) and (max-width:950px){.intro{padding-top:62px;width:165px}.handwritten{margin-top:18px}}
@media(orientation:landscape) and (max-width:680px){.intro{grid-column:1/-1;grid-row:2;width:100%;max-width:none;padding:15px 5px 0;display:flex;align-items:center;justify-content:center;gap:28px}.intro .eyebrow{margin:0}.handwritten{margin:0}.hero-center{grid-column:2;grid-row:1}.features{grid-column:3;grid-row:1}}
/* Shared corrected artwork; header and footer never redraw the brand. */
.wordmark{aspect-ratio:2/1}.brand .wordmark img,.footer-brand .wordmark img{position:static;display:block;width:100%;height:auto;max-width:100%;margin:0;border-radius:0}.paw-emblem{aspect-ratio:1/1;overflow:visible}.paw-emblem img{position:static;display:block;width:100%;height:auto;max-width:100%}
@media(orientation:landscape) and (min-width:951px) and (max-width:1366px){.intro{width:200px;transform:translateX(20px)}}
@media(orientation:landscape) and (min-width:681px) and (max-width:950px){.intro{transform:translateX(30px)}}

/* Show the complete navigation whenever it fits; compact menu sits beside the logo. */
@media(min-width:800px) and (max-width:1100px){
.header{flex-wrap:nowrap;gap:16px}
.brand .wordmark{width:132px}
.header-store{width:132px;margin-left:0}
.header nav{order:0;flex:1;flex-wrap:nowrap;gap:12px;white-space:nowrap}
.js .header nav,.js .header nav.open{display:flex}
.menu{display:none}
}
@media(max-width:799px){
.header .brand{order:0}
.header .menu{order:1}
.header .header-store{order:2;margin-left:auto}
.header nav{order:3}
}

/* Compact doorway to the shared CatZ client. */
.header .catz-signin{display:inline-flex;align-items:center;justify-content:center;min-width:64px;min-height:44px;padding:0 12px;border:1px solid #e27cd755;border-radius:22px;color:#fff;text-decoration:none;font-size:13px;background:#17101cbb;backdrop-filter:blur(10px);white-space:nowrap;flex-shrink:0}
.header .catz-signin:hover,.header .catz-signin:focus-visible{border-color:#f482da;background:#28152c}
@media(max-width:799px){.header .catz-signin{order:0;margin-left:auto}.header .brand{margin-right:0}.header .header-store{margin-left:0}}
