*,*::before,*::after{box-sizing:border-box}
:root{color-scheme:light;--ink:#181a31;--night:#121529;--paper:#f8f6f1;--coral:#ff936d;--mint:#8ff1d5;--wrap:1220px}
html{scroll-behavior:smooth;scroll-padding-top:1.2rem}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid #2783f3;outline-offset:5px}
.wrap{width:min(var(--wrap),88vw);margin-inline:auto}
.skip{position:fixed;z-index:3;top:10px;left:10px;padding:12px 18px;background:white;color:var(--ink);transform:translateY(-170%)}
.skip:focus{transform:none}
.top{background:var(--night);color:#fbf7f2;border-bottom:1px solid #ffffff20}
.nav,.footer-inner,.wordmark,.nav nav,.hero-cta,.btn,.app-type,.actions{display:flex;align-items:center}
.nav{justify-content:space-between;min-height:78px}
.wordmark{gap:10px;width:max-content;font-size:26px;font-weight:800;letter-spacing:-1.6px;line-height:1}
.wordmark img{flex:none}
.nav nav{gap:36px;font-size:15px;font-weight:600}
.nav nav span{padding-left:3px;color:var(--coral)}
.nav nav a:hover,.contact a:hover{color:var(--coral)}
.hero{isolation:isolate;overflow:hidden;color:#fbf8f0;background:radial-gradient(ellipse at 87% 50%,#302958 0%,#1c1c38 36%,#121529 73%)}
.hero-inner{display:grid;grid-template-columns:1fr 1.12fr;align-items:center;position:relative;min-height:clamp(440px,40vw,548px)}
.intro{position:relative;z-index:1;padding:58px 0 64px}
.studio,.app-type{margin:0;font-family:ui-monospace,Consolas,monospace;text-transform:uppercase;font-size:12px;line-height:1.5;font-weight:700;letter-spacing:1.7px}
.studio{color:var(--mint);display:flex;align-items:center;gap:12px}
.studio i{width:26px;height:2px;background:var(--mint);display:block}
h1,h2,h3,p{margin:0}
h1,h2,h3{letter-spacing:-.06em;line-height:1;font-weight:780}
h1{font-size:clamp(54px,6.15vw,90px);margin:22px 0 20px}
h1 em{color:var(--coral);font-style:normal}
.lead{max-width:455px;font-size:clamp(16px,1.35vw,19px);line-height:1.55;color:#d3d4e3;text-wrap:pretty}
.hero-cta,.btn{justify-content:center;font-weight:700;gap:13px;min-height:47px;width:fit-content;border-radius:9px;transition:transform .15s,background .15s}
.hero-cta{margin-top:29px;background:var(--coral);color:#241a27;padding:0 20px}
.hero-cta:hover{background:#ffac8c;transform:translateY(-2px)}
.scene{width:119%;height:auto;max-width:none;justify-self:center;display:block;pointer-events:none}
.catalog{padding:clamp(44px,5.8vw,84px) 0 clamp(55px,6vw,92px)}
h2{font-size:clamp(37px,4.1vw,57px);margin-bottom:27px}
h2 span{color:#ca4f2f}
.product{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid #dedbd6;border-radius:22px;background:#fff}
.product-art{isolation:isolate;position:relative;display:grid;place-items:center;overflow:hidden;min-height:295px;background:radial-gradient(ellipse at 33% 22%,#e9fbff 0%,transparent 56%),linear-gradient(130deg,#d9eaff,#d9deff 65%,#ead9ff)}
.orbits,.orbits:before,.orbits:after{position:absolute;width:77%;aspect-ratio:1;transform:rotate(-27deg) scaleX(1.45);border-radius:50%;border:1px solid #7d85d443;z-index:-1}
.orbits:before,.orbits:after{content:"";left:8%;top:8%;width:84%;transform:none}
.orbits:after{width:121%;top:-10.5%;left:-10.5%}
.product-art img{display:block;object-fit:contain;width:77%;height:clamp(230px,23vw,340px);filter:drop-shadow(0 14px 12px #64649322)}
.product-copy{padding:clamp(30px,4.1vw,60px);align-self:center}
.app-type{color:#5d5a72;letter-spacing:1.15px;gap:10px;font-size:11px}
.app-type img{border-radius:8px;width:27px;height:27px}
h3{font-size:clamp(39px,4.1vw,62px);margin:14px 0}
.product-copy>p:not(.availability){line-height:1.55;color:#48485d;font-size:16px;max-width:520px}
.actions{gap:10px;flex-wrap:wrap;margin-top:23px}
.btn{padding:0 16px;font-size:14px;gap:9px}
.primary{background:var(--ink);color:white}
.primary:hover{background:#36395b}
.store{border:1px solid #bcbcc7}
.store:hover{background:#f4f4f8}
.availability{font-size:12px;line-height:1.5;color:#626176;margin-top:14px}
.availability a{text-decoration:underline;text-underline-offset:3px}
footer{background:var(--night);color:#f9f6ef}
.footer-inner{justify-content:space-between;flex-wrap:wrap;gap:26px;padding:32px 0}
.contact{display:grid;gap:5px}
.contact>span{color:#b5b6c8;font-size:13px}
.contact a{font-weight:650}
.contact a span{color:var(--coral)}
@media(max-width:820px){.wrap{width:90vw}.hero-inner{grid-template-columns:1fr .92fr}.scene{width:137%;transform:translateX(-2%)}.product-copy{padding:30px}.actions{gap:8px}}
@media(max-width:650px){.nav{min-height:62px}.wordmark{font-size:23px}.wordmark img{width:29px;height:29px}.nav nav{gap:19px;font-size:14px}.hero-inner{display:flex;flex-direction:column;align-items:stretch}.intro{padding:42px 0 0}.studio{font-size:11px}h1{margin:16px 0;font-size:clamp(48px,11.4vw,72px)}.lead{max-width:460px}.hero-cta{margin-top:21px}.scene{align-self:center;width:min(112%,540px);height:auto;transform:none;margin-top:-6px;margin-bottom:-8px}.catalog{padding:39px 0 48px}h2{margin-bottom:20px}.product{grid-template-columns:1fr;border-radius:17px}.product-art{min-height:185px}.product-art img{height:clamp(185px,46vw,255px);width:70%}.product-copy{padding:26px 23px 30px}.footer-inner{padding:27px 0}.contact{font-size:14px}}
@media(max-width:360px){.nav nav{gap:12px}.btn{padding:0 12px}.product-copy{padding:23px 17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
