:root{--purple:#7c3aed;--blue:#2563eb;--ink:#121212;--gray:#f3f4f6;--muted:#686873}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#fff}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #9461ee;outline-offset:5px}button{border:0}header{height:82px;position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 6%;background:#ffffffd9;backdrop-filter:blur(24px);border-bottom:1px solid #1212120b}.wordmark{display:flex;align-items:center;font-size:22px;font-weight:900;letter-spacing:-1.1px}.wordmark span{font-weight:400;margin-left:5px}.wordmark i{width:7px;height:7px;background:var(--purple);border-radius:50%;margin:0 0 14px 4px}header nav{display:flex;gap:38px;align-items:center;font-size:12px;font-weight:600}header nav a:last-child{border:1px solid #ddd5e9;padding:11px 18px;border-radius:30px}nav a:hover{color:var(--purple)}.menu{display:none}.hero{position:relative;padding:145px 6% 25px;background:radial-gradient(ellipse at 73% 70%,#ebe1ff99,transparent 50%),#f8f8fb;overflow:hidden;min-height:960px}.hero-copy{position:relative;z-index:2;text-align:center}.eyebrow{font-size:10px;letter-spacing:2.5px;font-weight:700;margin:0 0 27px}.dot{display:inline-block;width:6px;height:6px;background:var(--purple);border-radius:50%;margin-right:9px;vertical-align:2px}h1{font-size:clamp(44px,5.5vw,80px);line-height:1.04;letter-spacing:-4px;margin:0;font-weight:650}em{font-style:normal;color:var(--purple)}.lead{font-size:17px;line-height:1.6;color:var(--muted);margin:24px 0}.actions{display:flex;align-items:center;justify-content:center;gap:28px}.shiny{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:16px 23px;border-radius:40px;background:linear-gradient(#19171e,#19171e) padding-box,conic-gradient(from var(--angle),#2563eb,#7c3aed,#d6baff,#2563eb) border-box;border:1px solid transparent;color:#fff;font-size:12px;font-weight:600;box-shadow:inset 0 1px 14px #9571ff30;animation:shine 3s linear infinite;animation-play-state:paused}.shiny:hover,.shiny:focus-visible{animation-play-state:running;box-shadow:0 6px 25px #7c3aed25,inset 0 1px 20px #9571ff60}.shiny:disabled{opacity:.5;cursor:wait;animation-play-state:paused}@property --angle{syntax:'<angle>';initial-value:0deg;inherits:false}@keyframes shine{to{--angle:360deg}}.text-link{background:none;padding:10px 0;font-size:12px;font-weight:600}.text-link span{margin-left:12px;color:var(--purple)}.hero-products{height:430px;max-width:980px;margin:5px auto 0;position:relative;z-index:1}.hero-mac{position:absolute;width:69%;left:3%;top:-4%;filter:drop-shadow(0 24px 25px #1b073d17);transform:rotate(-4deg)}.hero-phone{position:absolute;width:33%;right:7%;top:5%;transform:rotate(9deg);filter:drop-shadow(15px 20px 15px #120c2022)}.product-note{position:absolute;right:-4%;bottom:70px;font-size:8px;line-height:1.9;letter-spacing:2px;color:#7e778a}.hero-bottom{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:2px;color:#817b8d;position:relative;z-index:2}.hero-bottom a{font-size:23px;color:var(--purple)}#dots{position:absolute;inset:26% -10% 0;opacity:.7;pointer-events:none;background-image:radial-gradient(#9466c955 .8px,transparent .8px);background-size:23px 23px;mask-image:linear-gradient(transparent,#000 60%,transparent)}#dots canvas{width:100%;height:100%;display:block}.dark{background:#09090c;color:#fff;overflow:hidden}.phone-scene{position:relative;min-height:750px;padding:140px 8%;display:flex;align-items:center;background:radial-gradient(ellipse at 78% 55%,#401a6955,transparent 50%),#09090c}.section-copy{position:relative;z-index:2}h2{font-size:clamp(36px,4.2vw,62px);letter-spacing:-2.7px;line-height:1.09;margin:0 0 27px;font-weight:600}.dark em{color:#b18aff}.section-copy>p:not(.eyebrow){font-size:15px;line-height:1.7;color:#a9a6b3}.dark .eyebrow{color:#a69ab8}.line-link{display:inline-block;font-size:12px;font-weight:600;border-bottom:1px solid #8a6bac66;padding:14px 0}.phone-art{position:absolute;right:2%;top:10%;width:51%;height:85%}.phone-art img{position:absolute;width:76%;top:3%;right:0;z-index:1;filter:drop-shadow(0 40px 35px #0009)}.case{position:absolute;top:22%;left:16%;width:32%;height:54%;border-radius:35px;transform:rotate(-16deg);background:linear-gradient(120deg,#ad8bff,#66429b 60%,#8a5bc6);border:3px solid #b597d9;box-shadow:inset 0 0 15px #291335,0 30px 40px #0006}.camera-cut{width:53%;height:27%;border-radius:20px;background:#150d25;border:4px solid #9971c5;margin:10px}.scene-caption{position:absolute;bottom:40px;left:8%;font-size:8px;letter-spacing:3px;color:#70687f}.section-pad{padding:110px 8%}.brand-intro{display:flex;justify-content:space-between;gap:70px;margin-bottom:40px}.brand-intro>p{max-width:390px;font-size:16px;line-height:1.8;color:var(--muted);margin:5px 0}.categories{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.glass{border:1px solid transparent;background:linear-gradient(135deg,#ffffffb8,#f1edf8bb) padding-box,linear-gradient(130deg,#dac8f6,#fff,#c7b1ea) border-box;backdrop-filter:blur(20px);border-radius:19px;padding:28px;transition:transform .3s,box-shadow .3s}.glass:hover{transform:translateY(-4px);box-shadow:0 14px 35px #7c3aed13}.category{display:block;position:relative;min-height:190px}.category .icon{color:var(--purple);font-size:25px;display:block;height:48px}.category h3{font-size:17px;margin:12px 0}.category p,.step p{font-size:13px;line-height:1.7;color:var(--muted);max-width:260px;margin-bottom:0}.category .arrow{position:absolute;top:32px;right:26px;color:#867c98}.mac-scene{position:relative;text-align:center;padding:95px 7% 30px;background:radial-gradient(ellipse at 55% 60%,#222d6f66,transparent 60%),#09090c}.mac-large{display:block;width:min(820px,90%);margin:-15px auto -25px;filter:drop-shadow(0 0 70px #5537ad33)}.mac-words{display:flex;justify-content:center;gap:100px;font-size:12px;letter-spacing:2px;color:#a496be;margin-bottom:35px}.heading-row{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:35px}.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.step .number{color:var(--purple);font-size:12px;letter-spacing:2px;display:block;margin-bottom:40px}.step h3{font-size:19px;letter-spacing:-.5px}.steps{background:#f8f7fb}.contact{display:grid;grid-template-columns:1fr 1fr;gap:8%;background:#f0ecf7}.contact-copy>p:not(.eyebrow){font-size:15px;line-height:1.8;color:var(--muted)}.contact-copy .small-note{font-size:11px!important;margin-top:65px;max-width:270px}label{display:flex;flex-direction:column;gap:9px;font-size:11px;font-weight:600;margin-bottom:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}input,select,textarea{width:100%;background:#ffffffa8;border:1px solid #d9d3e4;border-radius:8px;padding:13px;color:#121212;font-size:12px;min-width:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#82788b}fieldset{border:1px solid #cfc3e2;border-radius:12px;margin:0 0 20px;padding:20px}legend{font-size:12px;padding:0 8px}.form-notice{font-size:11px;line-height:1.6;color:#6b6078;margin:0 0 20px}#form-status{font-size:12px;line-height:1.7;color:#6135a0}footer{padding:60px 8% 20px;display:flex;flex-wrap:wrap;align-items:center;gap:25px}footer>p{font-size:11px;color:var(--muted)}footer nav{margin-left:auto;display:flex;gap:25px;font-size:11px}.footer-bottom{width:100%;border-top:1px solid #ece8f2;margin-top:25px;padding-top:24px;display:flex;justify-content:space-between;font-size:9px;color:#888;letter-spacing:.5px}dialog{border:1px solid #e6dbfa;border-radius:24px;padding:50px;max-width:650px;width:calc(100% - 30px);max-height:90vh;color:var(--ink);box-shadow:0 30px 100px #0005}dialog::backdrop{background:#100a20aa;backdrop-filter:blur(8px)}dialog h2{font-size:36px}.close{position:absolute;top:16px;right:20px;background:none;font-size:30px}#guide-steps .step{margin:15px 0;padding:18px}#guide-steps .number{margin-bottom:12px}#guide-steps h3{margin:0}#guide-steps p{max-width:none}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:#fff;padding:15px}.skip:focus{top:10px}[hidden]{display:none!important}#floating{position:fixed;bottom:22px;right:22px;z-index:25}.reveal{transition:opacity .8s,transform .8s}.motion .reveal:not(.visible){opacity:0;transform:translateY(20px)}@media(hover:hover) and (pointer:fine){body{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='28'%3E%3Cpath d='M3 2L19 17L11 17L7 24Z' fill='%237c3aed' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E") 3 2,auto}input,textarea{cursor:text}}
@media(min-width:1500px){.hero{min-height:1050px}.hero-products{height:490px}}@media(max-width:800px){header{height:68px;padding:0 6%}.wordmark{font-size:19px}.menu{display:block;background:transparent;font-size:24px}header nav{display:none;position:absolute;top:68px;left:0;right:0;background:#fffffff5;backdrop-filter:blur(20px);padding:25px 7%;flex-direction:column;align-items:stretch;gap:22px}header nav.open{display:flex}header nav a:last-child{border:0;padding:0}.hero{padding:115px 6% 25px;min-height:790px}h1{font-size:49px;letter-spacing:-2.7px}.eyebrow{font-size:8px;letter-spacing:1.8px}.lead{font-size:14px}.actions{gap:10px;flex-direction:column}.shiny{font-size:11px;padding:15px 22px}.hero-products{height:310px;margin-top:15px;width:118%;left:-9%}.hero-mac{width:81%;top:5%;left:-1%}.hero-phone{width:42%;right:0;top:13%}.product-note{display:none}.hero-bottom{font-size:6px;letter-spacing:1px}.phone-scene{min-height:850px;display:block;padding:80px 7%}.phone-art{top:340px;right:2%;width:95%;height:490px}.phone-art img{width:73%;right:4%}.case{height:57%;width:30%;top:23%}h2{font-size:40px;letter-spacing:-1.8px}.section-copy>p:not(.eyebrow){font-size:14px}.section-pad{padding:75px 7%}.brand-intro{display:block}.brand-intro>p{font-size:14px;max-width:100%;margin:25px 0}.categories{grid-template-columns:1fr 1fr;gap:12px}.glass{padding:22px 18px;border-radius:15px}.category h3{font-size:15px}.category p{font-size:11px}.category .arrow{top:23px;right:15px}.mac-scene{padding:75px 6% 35px}.mac-large{width:120%;max-width:none;margin:0 0 0 -10%}.mac-words{gap:35px;font-size:9px}.heading-row{display:block}.step-grid{grid-template-columns:1fr}.step .number{margin-bottom:20px}.step p{max-width:none}.contact{grid-template-columns:1fr;gap:35px}.contact-copy .small-note{margin-top:20px}.form-grid{gap:0 12px}footer{padding:40px 7% 20px;gap:15px}footer>p{font-size:10px}footer nav{width:100%;margin:10px 0;gap:20px;flex-wrap:wrap}.desktop{display:none}dialog{padding:40px 22px}dialog h2{font-size:30px}.footer-bottom{gap:20px;line-height:1.6}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1!important;transform:none!important}.scroll-product{transform:none!important}}
/* Independent product cutouts, composed for each viewport. */
.hero-products{margin-top:38px}.hero-mac{width:69%;top:3%}.hero-phone{width:30%;right:9%;top:0}.phone-art img{width:65%;top:8%;right:4%}.mac-large{margin:35px auto 10px}.mac-words{margin-top:35px}@media(max-width:800px){.hero-products{margin-top:35px;height:280px}.hero-mac{width:76%;top:16%;left:1%}.hero-phone{width:35%;top:3%;right:3%}.phone-art img{width:62%;top:6%;right:5%}.mac-large{width:110%;margin:35px 0 10px -5%}}
/* Scroll-directed choreography. No wheel interception or scroll locking. */
.scene-viewport{position:relative;width:100%}.phone-scene>.scene-viewport{min-height:470px;display:flex;align-items:center}.phone-scene .phone-art{top:-65px;right:-7%;height:620px;width:60%}.phone-scene .scene-caption{bottom:-100px;left:0}.scene-track{display:none}.reading-progress{position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#2563eb,#7c3aed,#c7a2ff);z-index:25;transform:scaleX(var(--reading,0));transform-origin:left;pointer-events:none}.scroll-motion .scroll-reveal{transition:opacity .8s ease var(--stagger,0ms),translate .9s cubic-bezier(.2,.7,.2,1) var(--stagger,0ms)}.scroll-motion .scroll-reveal:not(.in-view){opacity:0;translate:0 44px}.scroll-motion .scroll-reveal.in-view{opacity:1;translate:0 0}
@media(min-width:900px) and (min-height:600px){
.scroll-motion .hero-copy{transform:translate3d(0,var(--hero-text-y,0px),0);opacity:var(--hero-text-opacity,1);will-change:transform,opacity}.scroll-motion .hero-mac{transform:translate3d(0,var(--hero-mac-y,0px),0) rotate(-4deg) scale(var(--hero-scale,1));will-change:transform}.scroll-motion .hero-phone{transform:translate3d(0,var(--hero-phone-y,0px),0) rotate(9deg) scale(var(--hero-scale,1));will-change:transform}
.cinematic-scroll .phone-scene,.cinematic-scroll .mac-scene{padding:0;display:block;overflow:visible;height:185vh;min-height:0;background:#09090c}
.cinematic-scroll .mac-scene{height:210vh}
.cinematic-scroll .scene-viewport{position:sticky;top:82px;height:calc(100vh - 82px);min-height:0;overflow:hidden;isolation:isolate}
.cinematic-scroll .phone-scene .scene-viewport{padding:6vh 8%;display:flex;align-items:center;background:radial-gradient(ellipse at var(--glow-x,85%) 55%,#642cac65,transparent 58%),#09090c}
.cinematic-scroll .phone-scene .section-copy{width:50%;transform:translate3d(0,var(--copy-y,30px),0);will-change:transform}
.cinematic-scroll .phone-art{width:48%;height:90%;right:2%;top:5%}
.cinematic-scroll .phone-art img{width:76%;height:88%;object-fit:contain;right:2%;top:4%;transform:translate3d(var(--phone-x,48px),var(--phone-y,65px),0) rotate(var(--phone-angle,7deg)) scale(var(--phone-scale,.87));will-change:transform}
.cinematic-scroll .case{width:32%;height:53%;top:23%;left:14%;transform:translate3d(var(--case-x,30px),var(--case-y,40px),0) rotate(var(--case-angle,-12deg));will-change:transform}
.cinematic-scroll .scene-caption{bottom:35px;left:8%}
.cinematic-scroll .scene-track{display:block;position:absolute;bottom:38px;right:8%;height:2px;width:130px;background:#ffffff20;z-index:4}
.cinematic-scroll .scene-track span{display:block;height:100%;background:#b18aff;transform:scaleX(var(--scene-p,0));transform-origin:left}
.cinematic-scroll .mac-scene .scene-viewport{padding:5vh 6% 3vh;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at 50% 70%,#3c358066,transparent 65%),#09090c}
.cinematic-scroll .mac-scene .section-copy{flex:none;transform:translate3d(0,var(--mac-title-y,0px),0)}
.cinematic-scroll .mac-scene .section-copy h2,.cinematic-scroll .mac-scene .section-copy>.eyebrow,.cinematic-scroll .mac-scene .section-copy>p:not(.eyebrow){opacity:var(--mac-title-opacity,1)}
.cinematic-scroll .mac-scene h2{font-size:clamp(36px,4.2vw,64px);margin-bottom:14px}.cinematic-scroll .mac-scene .eyebrow{margin-bottom:16px}.cinematic-scroll .mac-scene .section-copy>p:not(.eyebrow){margin:8px 0}
.cinematic-scroll .mac-large{width:min(62vw,860px);height:44vh;object-fit:contain;margin:0;flex:none;transform:translate3d(0,var(--mac-y,60px),0) scale(var(--mac-scale,.78));transform-origin:50% 60%;will-change:transform}
.cinematic-scroll .mac-words{position:absolute;bottom:5%;left:0;right:0;gap:9vw;margin:0;z-index:3;font-size:clamp(20px,2.8vw,42px);font-weight:600;letter-spacing:-1px;color:#dbc7ff}.cinematic-scroll .mac-words span{opacity:var(--word-opacity,.15);transform:translate3d(0,var(--word-y,32px),0);will-change:transform,opacity}
}
@media(max-width:899px){.phone-scene>.scene-viewport{min-height:690px;display:block}.phone-scene .phone-art{top:230px;right:-5%;width:106%;height:480px}.phone-scene .scene-caption{bottom:-20px;left:0}.mac-scene .scene-viewport{overflow:visible}.scroll-motion .scroll-reveal:not(.in-view){translate:0 22px}}
@media(prefers-reduced-motion:reduce){.reading-progress{display:none}.scroll-reveal{opacity:1!important;translate:none!important}.scene-viewport *{will-change:auto!important}}
@media(min-width:900px) and (min-height:600px){.cinematic-scroll .case{width:25%;height:40%;top:28%;left:24%}}
@media(max-width:899px){.phone-scene .case{height:36%;width:25%;top:18%;left:24%}}
/* Two independent product views. Transparent sprite halves retain full devices. */
.phone-pair .device{position:absolute;overflow:hidden;aspect-ratio:1 / 2;filter:drop-shadow(0 28px 22px #0003);transform-origin:50% 50%;will-change:transform}
.phone-pair .device img,.cinematic-scroll .phone-pair .device img{position:static;display:block;width:200%;height:auto;max-width:none;object-fit:fill;margin:0;filter:none;transform:none;will-change:auto}
.phone-pair .device-front img,.cinematic-scroll .phone-pair .device-front img{transform:translateX(-50%)}
.hero-phone.phone-pair{height:100%;filter:none;transform:rotate(3deg)}
.hero-phone .device{width:65%;top:0}.hero-phone .device-back{left:3%;transform:translateX(calc(var(--hero-spread,0%) * -1)) rotate(-9deg)}.hero-phone .device-front{left:35%;top:7%;transform:translateX(var(--hero-spread,0%)) rotate(6deg)}
.phone-art.phone-pair .device{width:42%;top:10%}.phone-art .device-back{left:24%;transform:rotate(-12deg)}.phone-art .device-front{left:52%;top:16%;transform:rotate(8deg)}
@media(min-width:900px) and (min-height:600px){
.cinematic-scroll .phone-art.phone-pair{width:56%;right:0;top:5%;height:90%}
.cinematic-scroll .phone-art.phone-pair .device{width:min(19vw,28vh);top:15%}
.cinematic-scroll .phone-art .device-back{left:40%;transform:translate3d(var(--back-x,-12%),var(--back-y,60px),0) rotate(var(--back-angle,-3deg)) scale(var(--device-scale,.72))}
.cinematic-scroll .phone-art .device-front{left:48%;transform:translate3d(var(--front-x,-30%),var(--front-y,82px),0) rotate(var(--front-angle,3deg)) scale(var(--device-scale,.72))}
.cinematic-scroll .phone-scene .section-copy{width:45%}
}
@media(max-width:899px){.phone-scene .phone-art.phone-pair{top:240px;right:-2%;width:104%;height:420px}.phone-art.phone-pair .device{width:42%;top:6%}.phone-art .device-back{left:10%;transform:rotate(-12deg)}.phone-art .device-front{left:46%;top:12%;transform:rotate(9deg)}.hero-phone .device{width:68%}.hero-phone .device-front{left:39%}}
@media(prefers-reduced-motion:reduce){.phone-pair .device{will-change:auto}}
