:root{color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#08090d;color:#f5f4fa;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}nav{height:90px;max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid #ffffff13}a{color:inherit;text-decoration:none}nav div,footer div{display:flex;gap:30px;font-size:13px;color:#a8a8b7}.brand{display:flex;align-items:center;gap:8px;font-size:19px;letter-spacing:-.6px}.brand b{font-weight:400;color:#a8a8b7}.logo{display:inline-block;width:36px;height:36px;border-radius:10px;background-image:url('assets/monogram-reference.png');background-size:300%;background-position:center 44%;margin-right:5px}.pill{border:1px solid #ffffff2d;padding:13px 22px;border-radius:50px;font-size:13px;display:inline-block}.light{background:#eeedf5;color:#15141c;border:0}.hero{text-align:center;padding:76px 20px 0;overflow:hidden}.eyebrow{font-size:10px;letter-spacing:3px;color:#b9aed8;margin-bottom:28px}h1{font-size:clamp(56px,7vw,104px);line-height:1.04;letter-spacing:-6px;font-weight:550;margin:0}em{font-style:normal;background:linear-gradient(110deg,#ddd9ef,#9d87cf 55%,#92b6d9);color:transparent;background-clip:text}p{color:#9293a6;font-size:18px;line-height:1.7}.hero>p{margin:30px 0}.stage{position:relative;height:620px;max-width:1120px;margin:70px auto 0;perspective:1400px}.halo{position:absolute;inset:5% 10%;background:radial-gradient(ellipse,#6b41ad55,transparent 70%);filter:blur(55px)}.screen{border:9px solid #202127;border-radius:17px;background:#17181c;overflow:hidden;position:relative;box-shadow:0 0 0 1px #65636c,0 30px 90px #0009}.screen img{width:100%;height:100%;object-fit:cover;display:block}.monitor{width:72%;position:absolute;right:3%;top:0;animation:arrive 1.5s both}.monitor .screen{aspect-ratio:16/9}.screen small{position:absolute;top:9px;left:12px;right:12px;font-size:9px;color:#fff9;text-align:left}.screen small span{float:right}.stand{height:90px;width:90px;margin:auto;background:linear-gradient(90deg,#52535a,#b3b3bc,#55565c);clip-path:polygon(24% 0,76% 0,87% 100%,13% 100%)}.foot{height:10px;width:180px;background:linear-gradient(#b9b8c0,#44454a);margin:auto;border-radius:50% 50% 3px 3px}.laptop{position:absolute;left:0;bottom:65px;width:48%;transform:rotateY(10deg);animation:arrive 1.8s both}.laptop .screen{aspect-ratio:1.6;border-width:7px}.notch{position:absolute;top:0;left:44%;width:12%;height:12px;border-radius:0 0 6px 6px;background:#202127}.base{height:13px;background:linear-gradient(#c0c0ca,#5d5e68);width:112%;margin-left:-6%;border-radius:1px 1px 50% 50%}.caption{position:absolute;bottom:3px;left:0;right:0;font-size:9px;letter-spacing:3px;color:#646477}.intro,.details{max-width:1180px;margin:auto;padding:150px 30px}h2{font-size:clamp(42px,5vw,70px);line-height:1.08;letter-spacing:-3px;font-weight:500;margin:0 0 28px}.intro>p{max-width:650px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:85px}.features span{font-size:10px;letter-spacing:2px;color:#9d87cf}h3{font-size:23px;letter-spacing:-.6px;font-weight:500}.features p,.details p{font-size:15px}.display-section{text-align:center;padding:100px 24px;background:radial-gradient(ellipse at 50% 55%,#292038,#0d0e15 65%)}.display-section>p{max-width:610px;margin:0 auto 35px}.switches{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.switches button{color:#9393a3;border:1px solid #ffffff18;background:transparent;border-radius:30px;padding:12px 19px;cursor:pointer}.switches [aria-pressed=true]{background:#eeeaf7;color:#16121e}.demo{width:55%;max-width:850px;margin:65px auto 35px;transition:width .65s cubic-bezier(.2,.8,.2,1)}.demo .screen{aspect-ratio:1.6}.demo .stand,.demo .foot{display:none}.demo.studio .screen{aspect-ratio:16/9}.demo.studio .stand,.demo.studio .foot{display:block}.demo.studio .base,.demo.studio .notch{display:none}.scene-buttons{display:flex;justify-content:center;gap:12px}.scene-buttons button{width:68px;height:44px;border:2px solid transparent;border-radius:8px;padding:3px;background:transparent;cursor:pointer}.scene-buttons .selected{border-color:#baa3ee}.scene-buttons img{height:100%;width:100%;object-fit:cover;border-radius:3px}.note{display:block;font-size:11px!important;color:#737384;margin-top:25px}.wide{position:relative;height:650px;overflow:hidden}.wide>img{width:100%;height:100%;object-fit:cover}.wide:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#08090de8,transparent)}.wide>div{position:absolute;z-index:1;top:150px;left:10%;max-width:450px}.wide p{color:#ccc8d9}.details{display:grid;grid-template-columns:1fr 1fr;gap:100px}.details article{border-bottom:1px solid #ffffff12;padding-bottom:20px}.closing{text-align:center;padding:90px 20px 130px;background:radial-gradient(ellipse at bottom,#292037,transparent 65%)}.large{width:70px;height:70px;border-radius:18px;margin-bottom:35px}.closing small{display:block;font-size:11px;color:#737384;margin-top:23px}.closing .pill{margin-top:20px}footer{padding:35px 5%;border-top:1px solid #ffffff13;display:flex;align-items:center;justify-content:space-between}footer small{font-size:11px;color:#777}.reveal{opacity:0;transform:translateY(35px);transition:opacity 1s,transform 1s}.reveal.visible{opacity:1;transform:none}@keyframes arrive{from{opacity:0;translate:0 50px}to{opacity:1;translate:0 0}}@media(max-width:700px){nav{padding:0 20px;height:72px}nav>div{display:none}nav>.pill{font-size:10px;padding:10px}h1{letter-spacing:-3px}.hero{padding-top:65px}.stage{height:310px;margin-top:50px}.monitor{width:82%}.laptop{bottom:35px;width:53%}.stand{height:45px;width:50px}.foot{width:100px}.screen{border-width:5px}.intro,.details{padding:80px 25px}.features,.details{grid-template-columns:1fr;gap:30px}.features{margin-top:45px}.demo{width:85%!important}.wide{height:500px}.wide>div{left:25px;top:100px;right:25px}.display-section{padding:75px 20px}.switches button{font-size:11px;padding:10px}.closing{padding:70px 20px}footer{flex-wrap:wrap;gap:25px}footer div{gap:18px}h2{letter-spacing:-2px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}