:root{
  --ink:#0b1220;
  --ink-2:#121c2f;
  --paper:#f7f8fb;
  --white:#fff;
  --blue:#4f7cff;
  --blue-2:#6f91ff;
  --cyan:#64e6dd;
  --muted:#6d7585;
  --line:#e2e6ee;
  --radius:26px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"DM Sans",system-ui,-apple-system,sans-serif;color:var(--ink);background:#fff;overflow-x:hidden}
a{text-decoration:none;color:inherit}
button,input,textarea{font:inherit}
.topbar{height:34px;background:#0d1423;color:#d9e2f3;display:flex;align-items:center;justify-content:center;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:blur(18px);z-index:50;border-bottom:1px solid rgba(11,18,32,.06)}
.brand{display:flex;align-items:center;gap:12px;font-family:Manrope,sans-serif;font-weight:700}
.brand-mark{width:34px;height:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;transform:skewY(-8deg)}
.brand-mark span{background:var(--ink);border-radius:2px}
.brand-mark span:nth-child(2){background:var(--blue);height:75%;align-self:end}
.brand-mark span:nth-child(3){background:var(--cyan);height:52%;align-self:end}
.brand-text{font-size:20px;letter-spacing:-.04em}
.brand-text strong{font-weight:800}
.nav{display:flex;align-items:center;gap:30px;font-size:14px;font-weight:600}
.nav a{color:#3d4555}
.nav a:hover{color:var(--ink)}
.nav-cta{padding:12px 18px;border:1px solid var(--ink);border-radius:999px;color:var(--ink)!important}
.menu-btn{display:none;background:none;border:0;font-weight:700}
.hero{background:var(--ink);color:#fff;min-height:760px;position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:
radial-gradient(circle at 78% 30%, rgba(79,124,255,.26), transparent 28%),
radial-gradient(circle at 18% 85%, rgba(100,230,221,.11), transparent 28%),
linear-gradient(115deg,transparent 0 56%,rgba(255,255,255,.025) 56% 57%,transparent 57% 100%)}
.hero-bg:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to right,transparent,#000)}
.hero-grid{position:relative;z-index:1;max-width:1320px;margin:auto;min-height:760px;display:grid;grid-template-columns:1.03fr .97fr;align-items:center;gap:7vw;padding:82px 5vw}
.eyebrow{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#c8d3e8}
.eyebrow span{width:26px;height:2px;background:var(--cyan)}
.eyebrow.dark{color:#6c7483}
.hero h1,.section h2,.showcase h2,.pricing h2,.cta-section h2{font-family:Manrope,sans-serif;letter-spacing:-.055em;line-height:.98;margin:20px 0 24px}
.hero h1{font-size:clamp(54px,6vw,88px);font-weight:800}
.hero h1 em,.section h2 em,.pricing h2 em{font-style:normal;color:var(--blue-2)}
.hero-lead{font-size:19px;line-height:1.65;color:#bac5d8;max-width:640px}
.hero-actions{display:flex;gap:14px;margin:36px 0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;padding:16px 24px;border-radius:999px;font-weight:700;font-size:15px;transition:.25s}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 12px 30px rgba(79,124,255,.25)}
.btn-primary:hover{transform:translateY(-2px);background:#5c85ff}
.btn-ghost{border:1px solid rgba(255,255,255,.2);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.06)}
.hero-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;padding-top:28px;border-top:1px solid rgba(255,255,255,.12)}
.hero-trust div{display:grid;gap:5px}
.hero-trust strong{font-size:13px}
.hero-trust span{font-size:11px;color:#8f9bb0}
.browser-wrap{position:relative}
.browser-card{background:#fff;border-radius:22px;padding:9px;box-shadow:0 40px 100px rgba(0,0,0,.38);transform:rotate(1.4deg)}
.browser-top{height:44px;border-radius:15px 15px 0 0;background:#eef1f5;display:flex;align-items:center;padding:0 14px;gap:16px}
.dots{display:flex;gap:6px}.dots i{width:8px;height:8px;background:#c6ccd6;border-radius:50%}
.address{background:#fff;border-radius:7px;height:25px;flex:1;display:flex;align-items:center;padding:0 12px;color:#8c93a0;font-size:10px}
.mock-site{color:#111;background:#fbf7f1;border-radius:0 0 14px 14px;overflow:hidden}
.mock-nav{display:flex;justify-content:space-between;align-items:center;padding:22px 28px}
.mock-logo{font-size:13px;font-weight:800;letter-spacing:.02em}.mock-logo span{color:#bc6f3f}
.mock-links{display:flex;gap:8px}.mock-links span{display:block;width:30px;height:4px;border-radius:10px;background:#c4bdb5}
.mock-hero{display:grid;grid-template-columns:1.1fr .9fr;padding:35px 28px 32px;gap:24px;align-items:center}
.mock-hero small{font-size:8px;letter-spacing:.16em;color:#9e653e;font-weight:700}
.mock-hero h3{font-family:Manrope;font-size:32px;line-height:1.05;letter-spacing:-.05em;margin:10px 0}
.mock-hero p{font-size:10px;color:#766f68;line-height:1.6}
.mock-hero button{background:#181512;color:#fff;border:0;padding:10px 15px;border-radius:999px;font-size:8px;font-weight:700}
.mock-photo{height:250px;border-radius:18px;background:linear-gradient(145deg,#222,#625142);display:grid;place-items:center;position:relative;overflow:hidden}
.photo-glow{position:absolute;width:180px;height:180px;background:#cf8a55;filter:blur(40px);opacity:.45;border-radius:50%}
.photo-icon{position:relative;border:1px solid rgba(255,255,255,.45);width:100px;height:100px;border-radius:30px;color:#fff;display:grid;place-items:center;font:800 46px Manrope}
.mock-stats{display:grid;grid-template-columns:repeat(3,1fr);background:#191613;color:#fff}
.mock-stats div{padding:16px;border-right:1px solid rgba(255,255,255,.1);display:grid;gap:3px}.mock-stats b{font-size:13px}.mock-stats small{font-size:8px;color:#b8b0a9}
.floating-note{position:absolute;background:#fff;color:#142033;padding:12px 16px;border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,.25);font-size:12px;font-weight:700}.floating-note span{color:#2aaf88}
.note-one{left:-35px;bottom:90px}.note-two{right:-15px;top:80px}
.proof-strip{overflow:hidden;border-bottom:1px solid var(--line);background:#fff}
.proof-inner{min-width:max-content;display:flex;align-items:center;justify-content:center;gap:22px;padding:22px 4vw;font-size:13px}
.proof-inner span{color:#9299a6;font-size:10px;font-weight:700;letter-spacing:.12em}.proof-inner i{width:3px;height:3px;background:#bcc2cb;border-radius:50%}
.section{max-width:1260px;margin:auto;padding:110px 5vw}
.section-head{max-width:760px;margin-bottom:54px}
.section-head h2,.showcase h2,.pricing h2{font-size:clamp(42px,5vw,68px)}
.section-head>p{max-width:660px;color:var(--muted);font-size:18px;line-height:1.65}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.step-card{border:1px solid var(--line);border-radius:var(--radius);padding:32px;position:relative;background:#fff;min-height:300px}
.step-num{font:700 11px Manrope;color:#9da4b1;letter-spacing:.1em}
.step-icon{width:56px;height:56px;margin:35px 0 28px;background:#eef2ff;color:var(--blue);display:grid;place-items:center;border-radius:18px;font-size:27px}
.step-card h3,.inc-card h3{font:700 21px Manrope;letter-spacing:-.03em}
.step-card p,.inc-card p{color:var(--muted);line-height:1.65;font-size:15px}
.showcase{background:var(--ink);color:#fff;padding:110px 5vw;overflow:hidden}
.showcase-inner{max-width:1260px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:center}
.showcase-copy>p{color:#aeb9cb;font-size:18px;line-height:1.6}
.feature-list{list-style:none;padding:0;margin:42px 0 0}
.feature-list li{display:grid;grid-template-columns:46px 1fr;gap:14px;padding:22px 0;border-top:1px solid rgba(255,255,255,.12)}
.feature-list li>span{color:var(--cyan);font:700 11px Manrope;padding-top:3px}
.feature-list strong{font-size:16px}.feature-list p{color:#8f9bb0;margin:6px 0 0;font-size:13px;line-height:1.5}
.phone-scene{min-height:590px;display:grid;place-items:center;position:relative}
.phone{width:290px;background:#111827;padding:9px;border-radius:46px;box-shadow:0 45px 120px rgba(0,0,0,.45);position:relative;z-index:2;transform:rotate(4deg)}
.phone-notch{position:absolute;z-index:3;top:18px;left:50%;transform:translateX(-50%);width:82px;height:22px;border-radius:999px;background:#0b0d12}
.phone-screen{min-height:560px;border-radius:38px;background:#f2ede4;overflow:hidden;color:#16120f}
.mobile-hero{padding:70px 24px 36px;background:linear-gradient(160deg,#15120f 0 63%,#a9663d 63%);color:#fff;min-height:440px}
.mobile-brand{font:800 15px Manrope;margin-bottom:55px}.mobile-brand span{color:#d9905f}
.mobile-hero small{font-size:8px;letter-spacing:.16em;color:#d8b69f}
.mobile-hero h3{font:800 34px/1.02 Manrope;letter-spacing:-.05em;margin:10px 0}
.mobile-hero p{font-size:11px;line-height:1.6;color:#d5d0cb;width:85%}
.mobile-hero button{margin-top:18px;border:0;background:#fff;color:#15120f;border-radius:999px;padding:12px 18px;font-size:9px;font-weight:800}
.mobile-cards{display:grid;grid-template-columns:1fr 1fr;padding:17px;gap:8px}.mobile-cards div{background:#fff;border-radius:14px;padding:14px;display:grid;gap:3px}.mobile-cards b{font-size:12px}.mobile-cards span{font-size:8px;color:#8b8179}
.orbit{position:absolute;width:68px;height:68px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);backdrop-filter:blur(8px);font:700 10px Manrope;color:#cdd7e9}
.orbit-a{left:5%;top:20%}.orbit-b{right:3%;top:40%}.orbit-c{left:10%;bottom:13%}
.included{padding-bottom:130px}
.included-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.inc-card{padding:34px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:250px}
.inc-icon{font-size:27px;color:var(--blue);margin-bottom:26px}
.pricing{background:#eef2ff;padding:110px 5vw}
.pricing-inner{max-width:1160px;margin:auto;display:grid;grid-template-columns:.9fr 1.1fr;gap:9vw;align-items:center}
.pricing-copy p{color:#657087;line-height:1.6;font-size:17px}
.price-card{background:#fff;border-radius:30px;padding:38px;box-shadow:0 30px 70px rgba(34,52,95,.12);position:relative}
.price-badge{position:absolute;top:-13px;right:28px;background:var(--ink);color:#fff;padding:8px 12px;border-radius:999px;font-size:9px;letter-spacing:.12em;font-weight:800}
.price-top{display:flex;justify-content:space-between;gap:30px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.price-top>span{font:700 18px Manrope;max-width:180px}
.price{display:flex;align-items:flex-start;gap:5px}.price small{font-size:11px;color:#838b9a;margin-top:8px}.price strong{font:800 44px Manrope;letter-spacing:-.06em}
.price-card ul{list-style:none;padding:16px 0;margin:0 0 16px}.price-card li{padding:11px 0;color:#394153;font-size:14px;border-bottom:1px solid #f0f2f5}
.full{width:100%}.micro{font-size:10px!important;color:#989fab!important;text-align:center;margin:14px 0 0!important}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:9vw}
.section-head.left{margin-bottom:0}
.accordion details{border-top:1px solid var(--line);padding:24px 0}
.accordion details:last-child{border-bottom:1px solid var(--line)}
.accordion summary{cursor:pointer;font:700 17px Manrope;list-style:none;padding-right:36px;position:relative}
.accordion summary::-webkit-details-marker{display:none}.accordion summary:after{content:"+";position:absolute;right:4px;top:-3px;font-size:24px;color:var(--blue)}
.accordion details[open] summary:after{content:"–"}
.accordion p{color:var(--muted);line-height:1.65;font-size:14px;max-width:650px}
.cta-section{background:var(--blue);color:#fff;position:relative;overflow:hidden;padding:110px 5vw;text-align:center}
.cta-glow{position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(100,230,221,.26),transparent 25%),radial-gradient(circle at 85% 30%,rgba(255,255,255,.16),transparent 24%)}
.cta-inner{position:relative;max-width:900px;margin:auto}.cta-inner .eyebrow{justify-content:center;color:#e6ecff}.cta-section h2{font-size:clamp(44px,5vw,70px)}.cta-section p{font-size:18px;color:#e1e7ff}
.btn-white{background:#fff;color:var(--ink);margin-top:18px}.cta-note{font-size:11px!important;opacity:.75}
footer{background:#080d17;color:#fff;padding:54px 5vw 24px}.footer-main{max-width:1260px;margin:auto;display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;align-items:start}.footer-brand .brand-mark span{background:#fff}.footer-brand .brand-mark span:nth-child(2){background:var(--blue)}.footer-brand .brand-mark span:nth-child(3){background:var(--cyan)}.footer-main>p{color:#909aad;font-size:13px;line-height:1.6;max-width:320px}.footer-links{display:flex;gap:20px;justify-content:flex-end;font-size:12px;color:#b5becd}.footer-bottom{max-width:1260px;margin:40px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;color:#747e90;font-size:10px}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.12s}.delay-2{transition-delay:.24s}
@media(max-width:900px){
  .nav{display:none}.menu-btn{display:block}.nav.open{position:absolute;top:82px;left:0;right:0;background:#fff;display:flex;flex-direction:column;align-items:stretch;padding:20px 5vw;border-bottom:1px solid var(--line);gap:4px}.nav.open a{padding:14px 0}
  .hero-grid,.showcase-inner,.pricing-inner,.faq-grid{grid-template-columns:1fr}.hero-grid{padding-top:70px}.browser-wrap{margin-top:20px}.hero-trust{grid-template-columns:1fr}.hero{min-height:auto}
  .steps,.included-grid{grid-template-columns:1fr}.section,.showcase,.pricing,.cta-section{padding-top:80px;padding-bottom:80px}.phone-scene{min-height:560px}.footer-main{grid-template-columns:1fr}.footer-links{justify-content:flex-start;flex-wrap:wrap}
}
@media(max-width:600px){
  .site-header{height:68px;padding:0 20px}.brand-text{font-size:17px}.topbar{font-size:9px;height:28px}.hero-grid{padding:55px 20px 65px}.hero h1{font-size:50px}.hero-lead{font-size:16px}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions .btn{width:100%}.browser-card{transform:none}.floating-note{display:none}.mock-hero{grid-template-columns:1fr}.mock-photo{height:170px}.mock-hero h3{font-size:26px}.proof-inner{justify-content:flex-start}
  .section,.showcase,.pricing,.cta-section{padding-left:20px;padding-right:20px}.section-head h2,.showcase h2,.pricing h2{font-size:43px}.step-card,.price-card{padding:26px}.phone{width:270px}.price-top{flex-direction:column}.footer-bottom{gap:16px;flex-direction:column}
}