:root{--bg:#050b18;--ink:#f6f9ff;--muted:#a9bad0;--cyan:#13d9ff;--blue:#168bff;--purple:#7738ff;--pink:#ff2a9d;--yellow:#ffd43b;--green:#55e7a6;--line:rgba(255,255,255,.13);--shell:min(1180px,calc(100% - 40px));--shadow:0 30px 78px rgba(0,0,0,.45)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:radial-gradient(circle at 12% 25%,rgba(19,217,255,.12),transparent 31%),radial-gradient(circle at 90% 17%,rgba(255,42,157,.13),transparent 32%),var(--bg);font:16px/1.55 "Instrument Sans",sans-serif}a{color:inherit}.shell{width:var(--shell);margin:auto}header{position:sticky;top:0;z-index:60;border-bottom:1px solid var(--line);background:rgba(5,11,24,.9);backdrop-filter:blur(18px)}header nav{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 24px/1 "Bricolage Grotesque",sans-serif;font-style:italic;background:linear-gradient(95deg,var(--cyan),var(--pink));background-clip:text;color:transparent}.brand img{width:42px;height:42px;border-radius:10px}.navlinks{display:flex;align-items:center;gap:22px}.navlinks>a:not(.btn){font-size:12px;font-weight:900;text-decoration:none}.btn{min-height:52px;display:inline-flex;align-items:center;justify-content:center;padding:12px 22px;border:1px solid var(--line);border-radius:15px;color:white;background:rgba(255,255,255,.06);font-weight:900;text-decoration:none;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-2px);border-color:rgba(19,217,255,.55)}.btn.primary{border:0;color:#07101e;background:linear-gradient(110deg,var(--cyan),#58d8ff 45%,var(--pink))}.btn.yellow{border:0;color:#07101e;background:linear-gradient(115deg,#fff275,var(--yellow),#ff922d);box-shadow:0 14px 42px rgba(255,212,59,.24)}
.hero{position:relative;overflow:hidden;min-height:650px;display:grid;align-items:center;padding:56px 0 44px}.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(5,11,24,.97),rgba(5,11,24,.7) 48%,rgba(17,8,35,.82));z-index:1}.scene-grid{position:absolute;inset:0;z-index:0}.scene-grid i{position:absolute;width:180px;aspect-ratio:1.35;border-radius:25px;background-image:url('/th/assets/living/entertainment-atlas-v1.webp');background-size:400% 400%;opacity:0;filter:saturate(1.25);-webkit-mask-image:radial-gradient(ellipse,#000 45%,transparent 100%);mask-image:radial-gradient(ellipse,#000 45%,transparent 100%);animation:scene 12s ease-in-out infinite}.scene-grid i:nth-child(1){left:2%;top:4%;background-position:0 0}.scene-grid i:nth-child(2){left:38%;top:-4%;background-position:66.66% 33.33%;animation-delay:-2s}.scene-grid i:nth-child(3){right:4%;top:8%;background-position:100% 0;animation-delay:-4s}.scene-grid i:nth-child(4){right:0;bottom:0;background-position:33.33% 100%;animation-delay:-6s}.scene-grid i:nth-child(5){left:25%;bottom:-6%;background-position:0 66.66%;animation-delay:-8s}.scene-grid i:nth-child(6){left:-2%;bottom:8%;background-position:100% 66.66%;animation-delay:-10s}@keyframes scene{20%,60%{opacity:.7;transform:none}0%,100%{opacity:0;transform:translateY(14px) scale(.88)}}.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:.9fr 1.1fr;gap:52px;align-items:center}.eyebrow,.kicker{color:var(--cyan);font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.eyebrow i{display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green);animation:blink 1.5s ease-in-out infinite}@keyframes blink{50%{opacity:.35}}h1,h2,h3{font-family:"Bricolage Grotesque",sans-serif}h1{margin:16px 0 22px;font-size:clamp(58px,6.6vw,91px);line-height:.91;letter-spacing:-.055em}h1 em{font-style:normal;background:linear-gradient(95deg,var(--cyan),#8ae8ff 36%,var(--purple),var(--pink));background-clip:text;color:transparent}.copy>p{max-width:650px;margin:0;color:#c2d0e3;font-size:clamp(18px,2vw,21px)}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.trust{display:flex;flex-wrap:wrap;gap:14px;margin-top:20px;color:#d8e5f4;font-size:11px;font-weight:900}.trust span::before{content:"✓";margin-right:7px;color:var(--green)}.pulse{position:relative;animation:pulse 2.1s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.04);box-shadow:0 18px 52px rgba(255,212,59,.42)}}
.visual{position:relative;min-height:460px}.windows-mark{position:absolute;right:3%;top:1%;display:grid;grid-template-columns:1fr 1fr;gap:7px;width:112px;height:112px;transform:perspective(500px) rotateY(-14deg);filter:drop-shadow(0 0 24px rgba(19,217,255,.38));animation:mark 5s ease-in-out infinite}.windows-mark span{background:linear-gradient(135deg,var(--cyan),var(--blue))}.windows-mark span:nth-child(2),.windows-mark span:nth-child(4){background:linear-gradient(135deg,var(--blue),var(--purple))}@keyframes mark{50%{transform:perspective(500px) translateY(-10px) rotateY(8deg) scale(1.04)}}.screen{position:absolute;left:1%;right:8%;top:65px;z-index:2;padding:8px;border:1px solid rgba(19,217,255,.45);border-radius:22px;background:#07111f;box-shadow:var(--shadow),0 0 58px rgba(19,217,255,.16);transform:perspective(1200px) rotateY(-4deg);animation:screen 5.5s ease-in-out infinite}.screen img{display:block;width:100%;border-radius:0 0 14px 14px;opacity:.9}.screen-bar{height:33px;display:flex;align-items:center;gap:8px;padding:0 10px;color:#dce7f4;font-size:10px;font-weight:900}.screen-bar span{margin-right:auto}.screen-bar i{width:8px;height:8px;border-radius:50%;background:var(--cyan)}.screen-bar i:nth-last-child(2){background:var(--yellow)}.screen-bar i:last-child{background:var(--pink)}@keyframes screen{50%{transform:perspective(1200px) translateY(-9px) rotateY(1deg);box-shadow:0 36px 84px rgba(0,0,0,.5),0 0 65px rgba(119,56,255,.2)}}.keyboard{position:absolute;left:10%;right:17%;bottom:15px;height:48px;border-radius:9px 9px 22px 22px;background:linear-gradient(#2b3341,#0a0e15);box-shadow:0 20px 38px rgba(0,0,0,.46);transform:perspective(400px) rotateX(62deg)}.coming{position:absolute;right:-20px;bottom:-22px;padding:15px 18px;border-radius:15px;color:#07101e;background:linear-gradient(120deg,var(--yellow),#ff9130,var(--pink));box-shadow:0 18px 42px rgba(255,42,157,.28);animation:coming 2.5s ease-in-out infinite}.coming b,.coming span{display:block}.coming b{font:900 22px/1 "Bricolage Grotesque",sans-serif}.coming span{font-size:10px;font-weight:900}@keyframes coming{50%{transform:scale(1.05) rotate(-1deg)}}.pop{position:absolute;z-index:4;padding:10px 13px;border:1px solid rgba(19,217,255,.5);border-radius:14px;background:linear-gradient(125deg,rgba(6,26,45,.96),rgba(44,18,70,.96));box-shadow:0 17px 38px rgba(0,0,0,.42);animation:pop 4s ease-in-out infinite}.pop b,.pop span{display:block}.pop b{color:var(--cyan);font-size:10px}.pop span{color:#d7e3f1;font-size:9px}.pop.one{left:0;top:28px}.pop.two{right:0;bottom:65px;animation-delay:-2s}@keyframes pop{50%{transform:translateY(-8px)}}
.rail{overflow:hidden;border-block:1px solid var(--line);background:linear-gradient(90deg,var(--blue),var(--purple),var(--pink))}.rail>div{width:max-content;display:flex;gap:48px;padding:11px 0;color:white;font-size:11px;font-weight:1000;letter-spacing:.08em;animation:rail 22s linear infinite}.rail span::before{content:"●";margin-right:9px;color:var(--yellow)}@keyframes rail{to{transform:translateX(-50%)}}section{padding:82px 0}.section-head{max-width:820px;margin:0 auto 40px;text-align:center}.section-head h2{margin:9px 0 12px;font-size:clamp(38px,5vw,58px);line-height:1;letter-spacing:-.04em}.section-head p{margin:0;color:var(--muted);font-size:18px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.features article{padding:27px;border:1px solid var(--line);border-radius:23px;background:linear-gradient(145deg,rgba(16,34,58,.96),rgba(6,16,30,.97));box-shadow:var(--shadow);transition:.3s}.features article:hover{transform:translateY(-6px);border-color:rgba(19,217,255,.52)}.features b{display:grid;width:50px;height:50px;place-items:center;border-radius:15px;color:#07101e;background:linear-gradient(135deg,var(--cyan),var(--purple));font-size:20px}.features h3{margin:22px 0 8px;font-size:23px}.features p{margin:0;color:var(--muted);font-size:14px}.status{background:linear-gradient(180deg,rgba(19,217,255,.04),rgba(255,42,157,.05))}.timeline{max-width:900px;margin:auto;display:grid;gap:14px}.timeline article{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:25px;border:1px solid var(--line);border-radius:22px;background:#0a1729}.timeline article>span{display:grid;width:48px;height:48px;place-items:center;border-radius:50%;color:#07101e;background:#62728a;font:900 20px/1 "Bricolage Grotesque",sans-serif}.timeline .done>span{background:var(--green)}.timeline .active{border-color:rgba(19,217,255,.5);box-shadow:0 0 38px rgba(19,217,255,.1)}.timeline .active>span{background:linear-gradient(135deg,var(--cyan),var(--purple));animation:blink 1.6s infinite}.timeline b{font-size:21px}.timeline p{margin:3px 0 0;color:var(--muted)}.timeline em{padding:7px 10px;border-radius:999px;color:#07101e;background:var(--yellow);font-size:10px;font-style:normal;font-weight:1000}.available{padding:50px 0}.available-box{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;padding:40px;border:1px solid rgba(19,217,255,.34);border-radius:28px;background:linear-gradient(130deg,rgba(19,217,255,.12),rgba(119,56,255,.13),rgba(255,42,157,.12)),#09162a}.available h2{margin:7px 0;font-size:clamp(36px,4.5vw,54px)}.available p{margin:0;color:var(--muted)}.available-actions{display:grid;gap:10px}.final{padding-top:42px}.final-box{padding:56px;border:1px solid rgba(119,56,255,.45);border-radius:30px;text-align:center;background:radial-gradient(circle at 50% 110%,rgba(19,217,255,.2),transparent 38%),linear-gradient(130deg,rgba(119,56,255,.17),rgba(255,42,157,.17)),#0a1427;box-shadow:var(--shadow)}.launch-badge{display:inline-flex;padding:8px 12px;border-radius:999px;color:#07101e;background:linear-gradient(120deg,var(--cyan),var(--purple));font-size:11px;font-weight:1000}.final h2{margin:16px 0 9px;font-size:clamp(40px,5vw,60px)}.final p{max-width:720px;margin:0 auto 25px;color:var(--muted);font-size:18px}footer{padding:44px 0 110px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}footer .shell{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:22px}footer .shell>div{display:flex;flex-wrap:wrap;gap:18px}footer a{text-decoration:none}footer p{width:100%}.mobile-cta{display:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
.screen::before{content:"";position:absolute;z-index:5;left:13.5%;top:15.5%;width:28%;height:6.5%;border-radius:7px;background:rgba(5,11,24,.18);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none}
@media(max-width:900px){.navlinks>a:not(.btn){display:none}.hero-grid{grid-template-columns:1fr}.visual{min-height:430px}.features{grid-template-columns:repeat(2,1fr)}.available-box{grid-template-columns:1fr}.available-actions{grid-template-columns:1fr 1fr}}
@media(max-width:600px){:root{--shell:min(100% - 26px,1180px)}body{padding-bottom:146px}header nav{min-height:64px}.brand{font-size:20px}.brand img{width:36px;height:36px}.navlinks .btn{min-height:42px;padding:9px 12px;font-size:11px}.hero{min-height:0;padding:38px 0 24px}h1{font-size:clamp(47px,14.5vw,62px)}.copy>p{font-size:17px}.actions{display:grid}.visual{min-height:320px}.screen{left:0;right:8%;top:60px;padding:5px;animation:none;transform:none}.windows-mark{width:72px;height:72px}.coming{right:-7px;bottom:-20px;padding:11px 13px}.coming b{font-size:16px}.keyboard{bottom:0}.pop{padding:7px 9px}.pop.one{top:16px}.pop.two{bottom:32px}.features{grid-template-columns:1fr}.timeline article{grid-template-columns:auto 1fr}.timeline em{grid-column:1/-1;text-align:center}.available-box{padding:28px 22px}.available-actions{grid-template-columns:1fr}.final-box{padding:40px 20px}.mobile-cta{position:fixed;left:0;right:0;bottom:72px;z-index:70;display:block;padding:9px 13px;background:rgba(5,11,24,.95);backdrop-filter:blur(16px);border-block:1px solid rgba(19,217,255,.3)}.mobile-cta .btn{width:100%;min-height:52px}section{content-visibility:auto;contain-intrinsic-size:680px}.hero{content-visibility:visible}}
