:root { --ink:#07060b; --panel:#121019; --pink:#ff076b; --magenta:#f000b8; --orange:#ff6a1a; --soft:#aaa4b4; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:#fff; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.shell { width:min(1180px,calc(100% - 40px)); margin-inline:auto; }
.nav { height:86px; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:20; }
.brand { display:flex; align-items:center; gap:11px; font-size:23px; font-weight:800; letter-spacing:-.7px; }
.brand img { width:38px; height:38px; border-radius:10px; }
.navLinks { display:flex; align-items:center; gap:34px; color:#c5c0cc; font-size:14px; }
.navLinks a:hover { color:#fff; }
.navCta { padding:11px 20px; border:1px solid #39333f; border-radius:999px; color:#fff!important; }

.hero { min-height:760px; display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:48px; padding-block:54px 98px; }
.eyebrow { display:flex; align-items:center; gap:10px; color:#d5d0da; font-size:12px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; }
.eyebrow i { width:8px; height:8px; border-radius:50%; background:var(--pink); box-shadow:0 0 18px var(--pink); }
.hero h1 { margin:23px 0; font-size:clamp(66px,7vw,105px); line-height:.91; letter-spacing:-6px; font-weight:850; }
.hero h1 span { color:transparent; background:linear-gradient(90deg,#ff1183,#ff3d61,#ff7a16); -webkit-background-clip:text; background-clip:text; }
.heroLead { max-width:570px; color:#aaa4b4; font-size:19px; line-height:1.7; }
.heroActions { display:flex; gap:12px; margin-top:34px; }
.downloadButton { min-width:210px; border:0; border-radius:15px; padding:13px 18px; display:flex; align-items:center; gap:13px; color:#fff; cursor:pointer; }
.downloadButton.primary { background:linear-gradient(125deg,#ff006f,#ff3d4f); box-shadow:0 16px 42px #ff006f35; }
.downloadButton.secondary { background:#18151f; border:1px solid #332d3b; text-align:left; }
.downloadButton b { font-size:23px; }.downloadButton span { display:flex; flex-direction:column; font-size:15px; font-weight:750; }.downloadButton small { font-size:8px; letter-spacing:1.4px; opacity:.7; margin-bottom:3px; }
.trust { display:flex; gap:21px; margin-top:28px; color:#797382; font-size:11px; }

.heroVisual { min-height:610px; position:relative; display:grid; place-items:center; }
.orb { position:absolute; border-radius:50%; filter:blur(80px); opacity:.23; }.orbOne { width:340px;height:340px;background:#ff007b;top:10%;left:5%; }.orbTwo { width:280px;height:280px;background:#ff4b19;bottom:8%;right:0; }
.phone { width:288px; height:590px; border:7px solid #24202b; border-radius:43px; padding:10px; background:#07060a; box-shadow:0 40px 100px #000,0 0 0 1px #51495c; transform:rotate(4deg); position:relative; z-index:2; }
.phoneTop { height:24px; display:flex; justify-content:space-between; padding:0 9px; font-size:9px; }.phoneTop i { width:65px;height:18px;border-radius:15px;background:#000;position:absolute;top:7px;left:50%;transform:translateX(-50%); }
.appHeader { height:46px; display:flex; align-items:center; gap:7px; padding:0 5px; }.appHeader img { width:25px;height:25px;border-radius:7px; }.appHeader strong { font-size:14px; }.appHeader button { margin-left:auto;border:0;background:#1b1820;color:#fff;border-radius:50%;width:27px;height:27px; }
.videoScene { height:455px; border-radius:27px; overflow:hidden; position:relative; background:linear-gradient(160deg,#f29b72 0%,#7d4352 38%,#251323 68%,#09070c 100%); }
.sceneGlow { position:absolute;inset:0;background:radial-gradient(circle at 65% 25%,#ffd6a755,transparent 26%),linear-gradient(to top,#060409 0%,transparent 55%); }
.location { position:absolute;top:18px;left:15px;font-size:8px;letter-spacing:1.2px;background:#0007;padding:6px 8px;border-radius:20px; }.playMark { position:absolute;inset:0;display:grid;place-items:center;font-size:44px;color:#ffffffdc;text-shadow:0 5px 24px #000; }
.socialRail { position:absolute;right:11px;bottom:82px;display:grid;gap:14px;text-align:center; }.socialRail span { font-size:19px;display:grid;text-shadow:0 2px 8px #000; }.socialRail small { font-size:7px;margin-top:2px; }
.videoText { position:absolute;left:15px;right:52px;bottom:17px;font-size:10px; }.videoText p { color:#eee;margin:5px 0 9px;line-height:1.4; }.videoText em { font-size:8px;color:#bdb6c2;font-style:normal; }
.phoneNav { height:42px;display:flex;align-items:center;justify-content:space-around;font-size:15px; }.phoneNav span,.phoneNav b { display:grid;text-align:center; }.phoneNav small { font-size:6px;margin-top:2px;font-weight:500; }.phoneNav i { width:34px;height:22px;border-radius:7px;background:linear-gradient(90deg,#00e2cf 0 42%,#fff 42% 58%,#ff126d 58%);color:#000;text-align:center;font-style:normal; }
.floatingCard { position:absolute;z-index:4;display:flex;align-items:center;gap:10px;padding:12px 15px;border:1px solid #ffffff1c;background:#15111cd9;backdrop-filter:blur(14px);border-radius:14px;box-shadow:0 18px 40px #0008; }.floatingCard span { width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#ff076b24;color:#ff438a; }.floatingCard div { display:grid;gap:2px; }.floatingCard b { font-size:11px; }.floatingCard small { font-size:8px;color:#8d8794; }.cardOne { left:0;top:26%; }.cardTwo { right:-7%;bottom:19%; }

.featureSection { padding:120px 0; border-top:1px solid #1e1a24; }
.sectionIntro { display:grid; grid-template-columns:1fr 1.25fr 1fr; gap:35px; align-items:end; margin-bottom:52px; }.sectionIntro>span,.experienceCopy>span,.finalCta span { color:#ff4085;font-size:10px;letter-spacing:2px;font-weight:800; }.sectionIntro h2,.experience h2 { margin:0;font-size:55px;line-height:1.02;letter-spacing:-3px; }.sectionIntro p { color:#958f9e;line-height:1.7;margin:0; }
.featureGrid { display:grid;grid-template-columns:repeat(3,1fr);gap:15px; }.featureCard { min-height:310px;position:relative;padding:31px;border:1px solid #27212e;border-radius:24px;background:linear-gradient(145deg,#15121b,#0e0c12);overflow:hidden; }.featureCard>i { width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#ffffff0a;color:#ff478c;font-style:normal;font-size:21px; }.featureCard>span { position:absolute;right:25px;top:25px;color:#4b4551;font-size:11px; }.featureCard h3 { margin:88px 0 14px;font-size:21px; }.featureCard p { margin:0;color:#8e8897;line-height:1.65;font-size:14px; }.card-2 { background:linear-gradient(145deg,#26101f,#100d14); }.card-2:after { content:"";position:absolute;width:170px;height:170px;border-radius:50%;background:#ff006f28;filter:blur(45px);right:-40px;bottom:-60px; }

.experience { padding:130px 0;display:grid;grid-template-columns:1fr 1fr;gap:110px;align-items:center; }
.experienceVisual { height:560px;position:relative; }.miniPhone { position:absolute;width:255px;height:500px;border:6px solid #28232d;border-radius:38px;overflow:hidden;background:#0a080d;box-shadow:0 35px 70px #000a; }.backPhone { left:25px;top:18px;transform:rotate(-10deg);display:grid;place-items:center;background:radial-gradient(circle,#56112f,#09070b 62%); }.backPhone img { width:125px;border-radius:28px; }.frontPhone { right:25px;top:35px;transform:rotate(8deg);background:linear-gradient(150deg,#df8165,#60293f 48%,#130b15); }.feedGradient { position:absolute;inset:0;background:linear-gradient(to top,#080509 3%,transparent 65%); }.feedTag { position:absolute;top:25px;left:20px;font-size:8px;letter-spacing:1.5px;background:#ff0a6d;padding:6px 9px;border-radius:20px; }.feedCopy { position:absolute;bottom:28px;left:20px;right:20px;font-size:11px; }.feedCopy p { color:#ddd; }.experienceCopy h2 { margin:20px 0 25px; }.experienceCopy h2 em { color:#ff2678;font-style:normal; }.experienceCopy>p { color:#98919f;font-size:17px;line-height:1.7;max-width:500px; }.experienceCopy ul { list-style:none;padding:0;margin:38px 0 0;border-top:1px solid #2a252e; }.experienceCopy li { padding:18px 0;border-bottom:1px solid #2a252e;color:#d9d5dd; }.experienceCopy li b { color:#ff2e7c;font-size:10px;margin-right:18px; }

.finalCta { margin-top:50px;margin-bottom:90px;min-height:260px;padding:48px;border-radius:30px;border:1px solid #392033;background:radial-gradient(circle at 20% 50%,#7b123d66,transparent 27%),linear-gradient(120deg,#1c0c18,#100b13);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:35px; }.finalCta img { width:120px;border-radius:28px;box-shadow:0 15px 45px #ff006f35; }.finalCta h2 { margin:12px 0 0;font-size:38px;line-height:1.1;letter-spacing:-2px; }.finalCta>a { padding:16px 20px;border-radius:14px;background:#fff;color:#121016;font-weight:750; }.finalCta>a b { margin-left:16px; }
footer { min-height:110px;border-top:1px solid #211c26;display:flex;align-items:center;gap:28px;color:#716b78;font-size:12px; }footer .brand { color:#fff;margin-right:auto; }footer .brand img { width:29px;height:29px;border-radius:8px; }

@media (max-width:900px) { .navLinks a:not(.navCta){display:none}.hero{grid-template-columns:1fr;padding-top:35px}.heroCopy{text-align:center}.eyebrow,.heroActions,.trust{justify-content:center}.heroLead{margin-inline:auto}.heroVisual{margin-top:20px}.sectionIntro{grid-template-columns:1fr}.featureGrid{grid-template-columns:1fr}.experience{grid-template-columns:1fr;gap:45px}.experienceVisual{order:2}.finalCta{grid-template-columns:1fr;text-align:center;justify-items:center}.finalCta h2{font-size:32px} }
@media (max-width:600px) { .shell{width:min(100% - 28px,1180px)}.nav{height:72px}.hero{padding-bottom:70px}.hero h1{font-size:55px;letter-spacing:-3px}.heroLead{font-size:16px}.heroActions{flex-direction:column}.downloadButton{width:100%;justify-content:center}.trust{flex-wrap:wrap}.heroVisual{min-height:535px;transform:scale(.88);margin-inline:-25px}.phone{height:560px}.videoScene{height:425px}.floatingCard{display:none}.sectionIntro h2,.experience h2{font-size:43px}.featureSection,.experience{padding:85px 0}.experienceVisual{height:470px;transform:scale(.84);transform-origin:left top}.miniPhone{height:470px}.frontPhone{right:-28px}.finalCta{padding:35px 22px}.finalCta img{width:90px}footer{flex-wrap:wrap;padding:30px 0}footer p{width:100%;order:3} }
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.phone,.floatingCard{transform:none}}