:root{color-scheme:light;--bg:#f5f8fa;--ink:#102741;--muted:#496177;--line:#cddbe4;--panel:#fff;--soft:#e7f1f5;--blue:#006aa9;--deep:#0b2442;--button:#102e4c;--buttonInk:#fff}
:root[data-theme=dark]{color-scheme:dark;--bg:#0b1829;--ink:#f1f8ff;--muted:#aebfd0;--line:#344759;--panel:#13273b;--soft:#183147;--blue:#67caff;--button:#a1dfff;--buttonInk:#10283a}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,"Segoe UI",sans-serif}html{scroll-behavior:smooth}a,button,summary,input{touch-action:manipulation}a{color:inherit;text-decoration:none}a:hover{color:var(--blue)}button,summary{cursor:pointer}button{font:inherit;color:inherit}button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #039edf;outline-offset:4px}.wrap{width:min(1260px,91%);margin:auto}.skip{position:absolute;top:-80px;z-index:20;background:var(--panel);padding:8px}.skip:focus{top:4px}header,footer,.brand,.actions,.tools,nav,.cap,.swatches{display:flex;align-items:center}header{min-height:80px;gap:30px;border-bottom:1px solid var(--line)}.brand{gap:8px;font-size:22px;letter-spacing:-1.3px;font-weight:760;color:var(--ink)}.brand span{color:var(--blue);margin-left:-7px}.brand img{width:31px;height:34px}nav{margin-inline-start:auto;gap:28px}nav a,.actions a,.tools,footer a{font-size:14px;font-weight:620}.tools{gap:7px}.tools summary,.tools button{background:var(--panel);border:1px solid var(--line);padding:6px 12px;border-radius:18px;list-style:none}summary::-webkit-details-marker{display:none}.tools button{font-size:19px;line-height:23px}.tools details{position:relative}.tools details div{position:absolute;inset-inline-end:0;z-index:5;top:120%;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--panel);min-width:140px}.tools details a{display:block;padding:5px 9px}.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:5%;padding:38px 0 48px}.copy{padding:5% 0}.kicker,.serial,.scene-label,.sample>small,.cap small{font:650 11px/1.6 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}.kicker{color:var(--blue);display:flex;align-items:center;gap:8px}i{display:inline-block;width:7px;height:7px;background:#00abe9;border-radius:50%}h1,h2,h3,p{margin:0}h1{font-size:clamp(54px,6.5vw,98px);line-height:1.02;letter-spacing:-.073em;margin:21px 0}em{font-style:normal;color:var(--blue)}p{color:var(--muted)}.copy p,.inner>p{font-size:clamp(16px,1.4vw,20px);max-width:46ch}.actions{gap:20px;flex-wrap:wrap;margin-top:27px}.play{display:inline-flex;align-items:center;gap:9px;background:var(--button);color:var(--buttonInk)!important;border:0;border-radius:10px;padding:9px 17px;text-align:start;font-size:18px!important;font-weight:680;line-height:1.15}.play small{display:block;font-size:10px;font-weight:520}.play>span:first-child{font-size:28px}.stage{min-height:clamp(350px,37vw,500px);position:relative;isolation:isolate;overflow:hidden;border:1px solid #30516c;border-radius:26px;background:radial-gradient(ellipse at 56% 55%,#136589 0%,#0c3a58 40%,#091e36 78%);display:grid;place-items:center}.stage:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#86cdef45 1px,transparent 1px);background-size:17px 17px}.orb,.orbit{position:absolute;border:1px solid #8ce5ff55;border-radius:50%;width:82%;height:48%;transform:rotate(-24deg)}.orbit{width:112%;height:68%;border-style:dashed;opacity:.45}.phone{background:#11253b;border:4px solid #122131;box-shadow:0 0 0 1px #91abba,0 14px 24px #00162838;border-radius:18px;overflow:hidden;line-height:0}.phone img{width:100%;height:auto;display:block}.stage .phone{width:clamp(120px,13vw,171px);transform:rotate(8deg);position:relative;margin-inline-start:18%;border-radius:16px}.floatshield{width:clamp(92px,11vw,152px);position:absolute;left:11%;top:38%;filter:drop-shadow(0 16px 13px #00102199);animation:drift 5s ease-in-out infinite}.serial,.scene-label{position:absolute;bottom:16px;color:#c5eefd;font-size:9px}.scene-label{left:18px;letter-spacing:.04em;background:#09223ae0;padding:4px 9px;border:1px solid #538099;border-radius:20px}.serial{right:16px}@keyframes drift{50%{transform:translateY(-6px) rotate(-4deg)}}h2{font-size:clamp(30px,4.2vw,56px);line-height:1.12;letter-spacing:-.055em;margin:10px 0 20px}h3{font-size:22px;line-height:1.28;letter-spacing:-.045em}main section[id]{scroll-margin-top:18px}.studio{padding:clamp(22px,4vw,55px);background:var(--soft);border:1px solid var(--line);border-radius:22px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:9%}.controls{max-width:370px;margin-top:19px}.controls label{display:flex;justify-content:space-between;font-weight:650}input[type=range]{width:100%;accent-color:#0879b9}.swatches{gap:9px;font-size:13px;margin-top:10px}.swatches button{padding:0;width:23px;height:23px;border-radius:100%;background:var(--sw);border:2px solid var(--panel)}.swatches button[aria-pressed=true]{outline:2px solid var(--blue)}.sample{padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:15px}.sample small{color:var(--blue)}.ticket{position:relative;overflow:hidden;margin-top:10px;padding:24px;border-radius:10px;background:linear-gradient(130deg,#e6f6ff,#a5d8ef);color:#103451}.ticket h3{margin:22px 0 6px;font-size:30px}.ticket p{color:#264c68}.ticket:after{content:"";position:absolute;inset:0;background:var(--filter,#104677);opacity:var(--opacity,.35)}.barcode{width:80px;height:18px;margin-top:16px;background:repeating-linear-gradient(90deg,#294356 0 2px,transparent 2px 5px,#294356 5px 6px,transparent 6px 9px)}#features,#gallery,#faq{padding:60px 0 0}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}article{padding:24px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}.cap{justify-content:space-between;margin-bottom:25px}.cap svg{width:25px;color:var(--blue)}.cap small{color:var(--muted)}article p{margin-top:9px;font-size:15px}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px}.shot{background:var(--soft);border:1px solid var(--line);border-radius:15px;padding:20px 14px 12px}.shot .phone{width:75%;margin:0 auto 15px}.shot span{font-size:14px;font-weight:600}.shot:hover .phone{transform:translateY(-3px)}.phone{transition:transform .2s}dialog{padding:10px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:16px;max-height:96dvh;max-width:92vw}dialog::backdrop{background:#051623ce}dialog img{max-height:78dvh;max-width:82vw;display:block;margin:auto}dialog button{border:0;background:var(--soft);border-radius:8px;padding:7px 11px;margin-bottom:7px}.question{border-top:1px solid var(--line);padding:16px 0}.question summary{font-weight:640;font-size:18px}.question p{padding-top:10px;max-width:75ch}footer{margin:48px 0 0;border-top:1px solid var(--line);padding:24px 0;gap:20px}footer>span{color:var(--muted);font-size:12px}footer>div{display:flex;gap:18px;margin-inline-start:auto}.inner{max-width:800px;padding:60px 0;margin:auto}.inner h1{font-size:clamp(42px,6vw,74px)}.inner article{margin-top:20px}.inner article h2{font-size:26px}.inner .link{display:inline-block;margin-top:20px;color:var(--blue)}[dir=rtl] :is(h1,h2,h3,.kicker,.scene-label){letter-spacing:0;line-height:1.4}[dir=rtl] .stage .phone{margin-inline-start:0;margin-left:18%}@media(max-width:850px){.cards{grid-template-columns:repeat(2,1fr)}.gallery{grid-template-columns:repeat(2,1fr)}.shot .phone{max-width:155px}nav{gap:14px}}@media(max-width:680px){header{flex-wrap:wrap;gap:8px;justify-content:space-between;padding:12px 0}.tools{margin-inline-start:auto}nav{order:3;width:100%;margin:0;gap:19px}.hero,.studio{grid-template-columns:1fr;gap:22px}.hero{padding:22px 0 28px}.copy{padding:0}.stage{min-height:350px}.stage .phone{width:134px}.floatshield{left:17%}.studio{padding:20px}.inner{padding:36px 0}#features,#gallery,#faq{padding-top:38px}footer{flex-wrap:wrap}footer>div{margin:0}footer>span{display:none}.gallery{gap:9px}.shot{padding:15px 6px 9px}.shot .phone{width:84%;border-radius:10px}.cards{grid-template-columns:1fr}.cap{margin-bottom:12px}.brand{font-size:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
