:root {
    --purple: #6d28d9;
    --purple-dark: #2f1764;
    --violet: #8b5cf6;
    --pink: #ec4899;
    --ink: #171329;
    --muted: #69647a;
    --line: #e8e3f2;
    --surface: #ffffff;
    --soft: #f8f6fc;
    --container: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
img { max-width: 100%; }
.container { width: min(var(--container), calc(100% - 40px)); margin-inline: auto; }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); border-bottom: 1px solid rgba(109,40,217,.09); backdrop-filter: blur(18px); }
.header-inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand img { display: block; width: 270px; max-height: 58px; object-fit: contain; object-position: left center; }
.site-nav { display: flex; align-items: center; gap: 27px; font-size: .94rem; font-weight: 700; }
.site-nav a { text-decoration: none; color: #4e485f; transition: .2s ease; }
.site-nav a:hover { color: var(--purple); }
.site-nav .nav-login { color: #fff; padding: 12px 18px; border-radius: 12px; background: linear-gradient(135deg, var(--purple), var(--pink)); box-shadow: 0 12px 28px rgba(109,40,217,.22); }
.nav-toggle { display: none; border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: 10px 14px; font-weight: 800; color: var(--purple-dark); }
.hero { position: relative; overflow: hidden; padding: 92px 0 82px; background: radial-gradient(circle at 85% 5%, rgba(236,72,153,.12), transparent 35%), linear-gradient(180deg,#fff 0%,#faf8ff 100%); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 62px; }
.hero-copy h1 { margin: 18px 0 23px; max-width: 720px; font-size: clamp(2.55rem,5.5vw,4.9rem); line-height: 1.01; letter-spacing: -.055em; }
.hero-copy > p { margin: 0; max-width: 680px; color: var(--muted); font-size: 1.15rem; line-height: 1.75; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--purple); text-transform: uppercase; letter-spacing: .13em; font-size: .75rem; font-weight: 900; }
.eyebrow::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: linear-gradient(90deg,var(--purple),var(--pink)); }
.eyebrow-light { color: #f4eefe; }
.eyebrow-light::before { background: #fff; }
.hero-actions { display: flex; gap: 13px; flex-wrap: wrap; margin-top: 32px; }
.btn { display: inline-flex; justify-content: center; align-items: center; min-height: 50px; padding: 0 22px; border-radius: 13px; text-decoration: none; font-weight: 850; transition: transform .2s ease, box-shadow .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: #fff; background: linear-gradient(135deg,var(--purple),var(--pink)); box-shadow: 0 16px 35px rgba(109,40,217,.24); }
.btn-secondary { color: var(--purple-dark); background: #fff; border: 1px solid var(--line); box-shadow: 0 10px 25px rgba(47,23,100,.06); }
.btn-white { color: var(--purple-dark); background: #fff; box-shadow: 0 14px 30px rgba(18,9,42,.18); }
.btn-outline-white { color: #fff; border: 1px solid rgba(255,255,255,.45); background: rgba(255,255,255,.08); }
.hero-trust { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 30px; }
.hero-trust span { padding: 8px 11px; border-radius: 999px; background: rgba(109,40,217,.065); color: #5c5370; font-size: .78rem; font-weight: 750; border: 1px solid rgba(109,40,217,.08); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(12px); opacity: .5; }
.hero-glow-one { width: 310px; height: 310px; right: -90px; top: 40px; background: rgba(236,72,153,.13); }
.hero-glow-two { width: 260px; height: 260px; left: -130px; bottom: -80px; background: rgba(139,92,246,.12); }
.product-preview { overflow: hidden; border: 1px solid rgba(109,40,217,.12); border-radius: 22px; background: #fff; box-shadow: 0 35px 80px rgba(46,23,93,.16); transform: perspective(1200px) rotateY(-3deg) rotateX(1deg); }
.preview-toolbar { height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 17px; border-bottom: 1px solid #eee9f5; color: #81798e; font-size: .75rem; font-weight: 700; }
.preview-dots { display: flex; gap: 6px; }
.preview-dots i { width: 8px; height: 8px; border-radius: 50%; background: #ded7e9; }
.preview-dots i:first-child { background: var(--pink); }.preview-dots i:nth-child(2){background:#f59e0b}.preview-dots i:nth-child(3){background:#34d399}
.preview-body { min-height: 410px; display: grid; grid-template-columns: 104px 1fr; }
.preview-sidebar { padding: 20px 15px; background: linear-gradient(180deg,#351770,#25114f); display: flex; flex-direction: column; gap: 16px; }
.preview-logo { width: 52px; height: 52px; margin-bottom: 12px; border-radius: 16px; background: linear-gradient(135deg,#f43f8f,#8b5cf6); }
.preview-sidebar b { display:block; height: 9px; border-radius: 9px; background: rgba(255,255,255,.18); }.preview-sidebar b:nth-child(3){width:75%}.preview-sidebar b:nth-child(5){width:85%}
.preview-content { padding: 28px; background: #fbfaff; }
.preview-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:23px; }.preview-heading span{width:42%;height:16px;border-radius:9px;background:#302447}.preview-heading i{width:70px;height:28px;border-radius:9px;background:linear-gradient(135deg,var(--purple),var(--pink))}
.preview-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.preview-metrics article{padding:16px;border-radius:13px;background:#fff;border:1px solid #eee9f5}.preview-metrics strong{display:block;font-size:1.25rem}.preview-metrics small{color:#81798e;font-size:.65rem}
.preview-panels { display:grid; grid-template-columns:1.3fr .7fr; gap:13px; margin-top:14px; }.preview-panels article{min-height:190px;padding:18px;border-radius:14px;background:#fff;border:1px solid #eee9f5}
.chart-bars { height:145px; display:flex; align-items:flex-end; gap:10px; }.chart-bars i{flex:1;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,var(--pink),var(--purple));}.chart-bars i:nth-child(1){height:38%}.chart-bars i:nth-child(2){height:55%}.chart-bars i:nth-child(3){height:48%}.chart-bars i:nth-child(4){height:76%}.chart-bars i:nth-child(5){height:64%}.chart-bars i:nth-child(6){height:90%}
.ring { width:95px;height:95px;margin:4px auto 17px;border-radius:50%;background:conic-gradient(var(--purple) 0 72%,#eee9f5 72%);position:relative}.ring::after{content:"72%";position:absolute;inset:13px;display:grid;place-items:center;border-radius:50%;background:#fff;font-size:.8rem;font-weight:900}.preview-panels article>span{display:block;height:7px;margin:8px 0;border-radius:8px;background:#eee9f5}.preview-panels article>span:nth-child(3){width:75%}.preview-panels article>span:nth-child(4){width:55%}
.section { padding: 96px 0; }
.section-light { background: var(--soft); }
.section-heading { max-width: 790px; margin: 0 auto 48px; text-align: center; }.section-heading.heading-left { margin-left:0;text-align:left; }.section-heading h2,.security-copy h2,.difference-grid h2,.final-cta h2 { margin:16px 0; font-size:clamp(2rem,4vw,3.4rem);line-height:1.08;letter-spacing:-.04em}.section-heading p,.security-copy p,.difference-grid>div>p{color:var(--muted);line-height:1.75;font-size:1.05rem}
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.feature-card { position:relative;padding:30px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 12px 30px rgba(49,28,93,.045);transition:.2s ease}.feature-card:hover,.vertical-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(49,28,93,.1);border-color:rgba(109,40,217,.2)}.feature-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:13px;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;font-size:.72rem;font-weight:900}.feature-card h3,.vertical-card h3{margin:21px 0 9px;font-size:1.15rem}.feature-card p,.vertical-card p{margin:0;color:var(--muted);line-height:1.62}
.vertical-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.vertical-card{padding:25px;border-radius:18px;border:1px solid var(--line);background:#fff;transition:.2s ease}.vertical-card.featured{background:linear-gradient(145deg,#fff 20%,#f8efff);border-color:rgba(236,72,153,.28)}.vertical-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#f0ebfc;color:var(--purple);font-size:.75rem;font-weight:950}.featured .vertical-mark{color:#fff;background:linear-gradient(135deg,var(--purple),var(--pink))}
.section-gradient { color:#fff;background:linear-gradient(135deg,#2b145a 0%,#5e24b5 55%,#b72b82 100%);overflow:hidden}.difference-grid{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}.difference-grid>div>p{color:rgba(255,255,255,.76)}.difference-list{display:grid;gap:12px}.difference-list article{padding:20px;border-radius:16px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px)}.difference-list strong,.difference-list span{display:block}.difference-list span{margin-top:6px;color:rgba(255,255,255,.72);line-height:1.55;font-size:.92rem}
.security-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}.security-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.security-cards article{padding:25px;border-radius:17px;background:#fff;border:1px solid var(--line)}.security-cards strong,.security-cards span{display:block}.security-cards strong{color:var(--purple);font-size:1.05rem}.security-cards span{margin-top:8px;color:var(--muted);line-height:1.55}
.final-cta{padding:62px 0;color:#fff;background:#1e0f3f}.final-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:40px}.final-cta h2{max-width:740px;margin-bottom:0;font-size:clamp(1.8rem,3.5vw,3rem)}.final-cta .hero-actions{margin-top:0;flex-shrink:0}
.site-footer{padding:38px 0;background:#120928;color:#cfc5dd}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.footer-inner img{width:230px;filter:brightness(0) invert(1);opacity:.92}.footer-inner p{margin:4px 0;text-align:right;font-size:.85rem}.developer-credit strong{color:#fff}
@media (max-width: 980px){.hero-grid,.difference-grid,.security-grid{grid-template-columns:1fr}.product-preview{max-width:720px;transform:none}.feature-grid{grid-template-columns:repeat(2,1fr)}.vertical-grid{grid-template-columns:repeat(2,1fr)}.final-cta-inner{align-items:flex-start;flex-direction:column}.site-nav{position:absolute;top:78px;left:20px;right:20px;display:none;flex-direction:column;align-items:stretch;padding:18px;border-radius:16px;background:#fff;box-shadow:0 22px 50px rgba(32,16,70,.16)}.site-nav.open{display:flex}.site-nav a{padding:10px}.site-nav .nav-login{text-align:center}.nav-toggle{display:inline-flex}.brand img{width:230px}}
@media (max-width: 640px){.container{width:min(100% - 28px,var(--container))}.hero{padding:64px 0 58px}.hero-copy h1{font-size:2.75rem}.product-preview{display:none}.section{padding:70px 0}.feature-grid,.vertical-grid,.security-cards{grid-template-columns:1fr}.preview-body{grid-template-columns:72px 1fr}.preview-content{padding:17px}.preview-metrics{grid-template-columns:1fr}.preview-panels{grid-template-columns:1fr}.footer-inner{align-items:flex-start;flex-direction:column}.footer-inner p{text-align:left}.header-inner{min-height:70px}.site-nav{top:70px}.brand img{width:205px}.hero-actions .btn{width:100%}}