:root { --ink:#f8fafc; --muted:#94a3b8; --paper:#080b14; --white:#0d1120; --lime:#8b5cf6; --coral:#8b5cf6; --line:rgba(139,92,246,.22); --lavender:#151c2f; --yellow:#151c2f; --radius:8px; }
* { box-sizing:border-box; margin:0; }
html { scroll-behavior:smooth; }
body { background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; line-height:1.55; }
button,input { font:inherit; }
a { color:inherit; text-decoration:none; }
.container { width:min(1160px,calc(100% - 48px)); margin:auto; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(13,17,32,.88); border-bottom:1px solid transparent; backdrop-filter:blur(14px); }
.site-header.scrolled { border-color:var(--line); }
.brand-logo--navbar{filter:invert(1)}
.nav-wrap { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:26px; }
.brand { display:inline-flex; align-items:center; gap:9px; font:700 18px/1 'Space Grotesk',sans-serif; letter-spacing:0; white-space:nowrap; }
.brand-mark { display:grid; place-items:center; width:37px; height:30px; background:var(--ink); color:var(--lime); border-radius:4px; font-size:14px; }
.main-nav { display:flex; align-items:center; gap:29px; margin-left:auto; }
.main-nav a,.site-footer a:not(.brand) { font-size:14px; font-weight:700; color:#445057; transition:color .2s ease; }
.main-nav a:hover,.site-footer a:not(.brand):hover { color:var(--coral); }
.button { display:inline-flex; justify-content:center; align-items:center; gap:11px; min-height:50px; padding:0 19px; border:1px solid transparent; border-radius:5px; cursor:pointer; font-size:14px; font-weight:800; transition:transform .2s ease,background .2s ease; }
.button:hover { transform:translateY(-2px); }
.button svg { width:17px; height:17px; }
.button-dark { color:white; background:var(--ink); }
.button-dark:hover { background:#303c44; }
.button-lime { color:var(--ink); background:var(--lime); }
.button-lime:hover { background:#a78bfa; }
.menu-toggle { display:none; border:0; background:transparent; color:var(--ink); padding:8px; cursor:pointer; }
.hero { overflow:hidden; padding:76px 0 68px; }
.hero-grid { display:grid; grid-template-columns:.94fr 1.06fr; align-items:center; gap:74px; }
.eyebrow { display:flex; align-items:center; gap:9px; color:#536068; font-size:11px; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.eyebrow span { width:23px; height:2px; background:var(--coral); }
h1,h2,h3 { font-family:'Space Grotesk',sans-serif; line-height:1.05; letter-spacing:0; }
h1 { max-width:600px; margin:20px 0 23px; font-size:clamp(48px,5.3vw,76px); font-weight:700; }
h1 em { color:var(--coral); font-style:normal; }
.hero-text { max-width:500px; color:var(--muted); font-size:17px; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:34px; }
.text-link { display:inline-flex; align-items:center; gap:9px; border-bottom:1px solid var(--ink); padding-bottom:3px; font-size:14px; font-weight:800; }
.text-link svg { width:16px; }
.trusted-row { display:flex; align-items:center; gap:13px; margin-top:56px; }
.trusted-row p { color:var(--muted); font-size:12px; }
.trusted-row strong { color:var(--ink); }
.avatar-stack { display:flex; }
.avatar-stack span { display:grid; place-items:center; width:28px; height:28px; margin-left:-7px; border:2px solid var(--paper); border-radius:50%; background:#f6b396; color:#203139; font-size:10px; font-weight:800; }
.avatar-stack span:first-child { margin-left:0; background:#b9dcd2; }.avatar-stack span:nth-child(2){background:#dfbcaf}.avatar-stack span:nth-child(3){background:#b6bddb}.avatar-stack span:last-child{background:var(--ink);color:white}
.hero-visual { position:relative; min-height:493px; }
.dashboard-preview { position:absolute; inset:38px 19px 28px 38px; padding:28px; border:1px solid #cad3d1; border-radius:7px; background:#fff; box-shadow:15px 17px 0 #dffb7e; }
.preview-head,.metric-main,.chart-label,.preview-footer,.result-top { display:flex; align-items:flex-start; justify-content:space-between; }
.preview-head p { color:#7d878c; font-size:10px; font-weight:800; letter-spacing:.13em; }.preview-head h2 { margin-top:3px; font-size:24px; }.icon-button{display:grid;place-items:center;border:0;background:#eff1ed;width:33px;height:33px;border-radius:4px;cursor:pointer}.icon-button svg{width:18px}
.metric-main { align-items:center; margin:30px 0 20px; }.metric-main span,.preview-footer span { display:block; color:#7c878d; font-size:11px; font-weight:700; }.metric-main strong { display:block; margin:4px 0; font:700 39px/1 'Space Grotesk',sans-serif; }.metric-main small { color:#3e8d55; font-size:10px; font-weight:800; }.metric-main small svg { width:11px; height:11px; vertical-align:-2px; }
.ring-chart { display:grid; place-items:center; width:84px; height:84px; border:9px solid #dff5c9; border-top-color:#6caf56; border-right-color:#6caf56; border-radius:50%; transform:rotate(25deg); }.ring-chart span{color:var(--ink);font-size:17px;font-weight:800;transform:rotate(-25deg)}.ring-chart small{color:var(--ink);font-size:9px}
.chart-label { align-items:center; font-size:10px; font-weight:700; }.chart-label span{color:#7b858b}.chart-label strong{font-size:12px}.bar-chart { height:84px; display:flex; align-items:flex-end; gap:7px; margin-top:6px; border-bottom:1px solid #e5e8e4; }.bar-chart i { display:block; width:100%; background:#bfe88a; border-radius:2px 2px 0 0; }.bar-chart i:nth-child(1){height:25%}.bar-chart i:nth-child(2){height:42%}.bar-chart i:nth-child(3){height:34%}.bar-chart i:nth-child(4){height:58%}.bar-chart i:nth-child(5){height:47%}.bar-chart i:nth-child(6){height:64%}.bar-chart i:nth-child(7){height:54%}.bar-chart i:nth-child(8){height:76%}.bar-chart i:nth-child(9){height:69%}.bar-chart i:nth-child(10){height:87%;background:#86c961}.bar-chart i:nth-child(11){height:76%;background:#86c961}.bar-chart i:nth-child(12){height:100%;background:#5ea643}
.preview-footer { gap:20px; margin-top:17px; }.preview-footer div+div{padding-left:22px;border-left:1px solid #e6e9e5}.preview-footer strong{font:700 16px 'Space Grotesk',sans-serif}
.card-float { position:absolute; z-index:2; display:flex; align-items:center; gap:10px; padding:11px 13px; background:#fff; border:1px solid #dfe4de; border-radius:5px; box-shadow:0 12px 20px rgba(28,38,37,.12); }.card-float strong,.card-float small{display:block}.card-float strong{font-size:11px}.card-float small{color:#748086;font-size:9px}.signal-card{top:0;left:0}.success-card{right:0;bottom:0}.signal-icon,.success-icon{display:grid;place-items:center;width:29px;height:29px;border-radius:50%}.signal-icon{background:var(--lavender);color:#554bb9}.success-icon{background:#dff5cb;color:#438d38}.signal-icon svg,.success-icon svg{width:15px}.call-pulse{width:7px;height:7px;border-radius:50%;background:#72c95b}
.section { padding:118px 0; }.section-heading { max-width:650px; }.section-heading h2,.process-copy h2,.contact-box h2 { margin:17px 0 17px; font-size:clamp(34px,4vw,53px); }.section-heading>p:last-child,.process-copy>p { color:var(--muted); font-size:16px; }.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:53px; }.service-card { position:relative; min-height:306px; padding:28px; background:var(--white); border:1px solid #e3e6e1; border-radius:6px; transition:transform .25s ease, box-shadow .25s ease; }.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 35px rgba(37,47,45,.08)}.service-card>span{position:absolute;top:29px;right:27px;color:#a5afb1;font:600 12px 'Space Grotesk',sans-serif}.service-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:5px}.service-icon svg{width:23px}.coral{background:#ffe0d9;color:#e7654d}.lilac{background:var(--lavender);color:#6359bc}.yellow{background:var(--yellow);color:#9e7c10}.service-card h3{margin-top:43px;font-size:23px}.service-card p{max-width:280px;margin-top:12px;color:var(--muted);font-size:13px}.service-card a{position:absolute;right:27px;bottom:25px;display:grid;place-items:center;width:32px;height:32px;border:1px solid #cbd2cc;border-radius:50%;transition:background .2s}.service-card a:hover{background:var(--lime)}.service-card a svg{width:15px}
.process { background:#e8ece5; }.process-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:105px; align-items:center; }.process-copy .button{margin-top:31px}.timeline{list-style:none;counter-reset:steps}.timeline li{display:grid;grid-template-columns:62px 1fr;gap:25px;padding:23px 0;border-top:1px solid #cbd1ca}.timeline li:last-child{border-bottom:1px solid #cbd1ca}.timeline b{color:var(--coral);font:700 15px 'Space Grotesk',sans-serif}.timeline h3{font-size:20px}.timeline p{max-width:430px;margin-top:7px;color:#647076;font-size:13px}
.results-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:75px; align-items:center; }.result-panel{padding:29px;background:#fff;border:1px solid #dee3dc;border-radius:6px}.result-top span:first-child{color:#768086;font-size:11px;font-weight:800}.result-top h3{margin-top:6px;font-size:28px}.up-badge{display:inline-flex;align-items:center;gap:5px;padding:6px 8px;background:#e3f6d4;color:#48883b!important;border-radius:3px;font-size:9px!important}.up-badge svg{width:12px}.line-chart{margin-top:32px}.line-chart svg{width:100%;height:auto;overflow:visible}.chart-area{fill:#e9f9c9}.chart-line{fill:none;stroke:#68ad4a;stroke-width:4}.months{display:flex;justify-content:space-between;color:#899297;font-size:10px;font-weight:700}
.contact { padding-top:18px; }.contact-box { display:grid; grid-template-columns:1fr .78fr; gap:65px; padding:62px; background:var(--ink); color:#fff; border-radius:7px; }.eyebrow-light{color:#c8d0ce}.eyebrow-light span{background:var(--lime)}.contact-box h2{max-width:540px}.contact-box>div>p:last-child{max-width:495px;color:#b9c1bf;font-size:15px}.lead-form{display:grid;align-content:center;gap:14px}.lead-form label{color:#ced5d2;font-size:11px;font-weight:700}.lead-form input{display:block;width:100%;margin-top:5px;padding:0 13px;height:46px;border:1px solid #586268;border-radius:4px;background:#253138;color:#fff;outline:0}.lead-form input:focus{border-color:var(--lime)}.form-message{min-height:18px;color:var(--lime);font-size:11px;font-weight:700}
.site-footer{padding:29px 0}.footer-wrap{display:flex;justify-content:space-between;align-items:center;gap:20px}.site-footer p{color:#859095;font-size:11px}

/* Premium navigation polish */
.site-header { border-bottom-color: color-mix(in srgb, var(--color-white), transparent 84%); background: color-mix(in srgb, var(--color-surface), transparent 12%); box-shadow: 0 var(--space-px) color-mix(in srgb, var(--color-white), transparent 68%) inset; transition: background var(--duration-base) var(--ease-standard), border-color var(--duration-base) var(--ease-standard), box-shadow var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard); backdrop-filter: blur(var(--space-5)) saturate(1.35); -webkit-backdrop-filter: blur(var(--space-5)) saturate(1.35); }
.site-header.scrolled { border-color: color-mix(in srgb, var(--color-ink), transparent 88%); box-shadow: var(--shadow-sm), 0 var(--space-px) color-mix(in srgb, var(--color-white), transparent 52%) inset; }.nav-wrap { min-height: 4.5rem; }.main-nav { gap: var(--space-6); }.main-nav a { position: relative; padding-block: var(--space-2); color: var(--color-ink-muted); transition: color var(--duration-base) var(--ease-standard); }.main-nav a::after { position: absolute; right: var(--space-2); bottom: var(--space-0); left: var(--space-2); height: var(--space-px); background: var(--gradient-brand); content: ""; transform: scaleX(var(--z-base)); transform-origin: center; transition: transform var(--duration-base) var(--ease-emphasized); }.main-nav a:hover,.main-nav a.is-active { color: var(--color-ink); }.main-nav a:hover::after,.main-nav a.is-active::after { transform: scaleX(var(--z-raised)); }.nav-cta { min-height: var(--space-10); border: var(--border-width) solid color-mix(in srgb, var(--color-white), transparent 82%); background: var(--gradient-dark); box-shadow: var(--shadow-sm); }

/* Premium hero only */
.hero-premium { position:relative; isolation:isolate; min-height:calc(100vh - 78px); display:flex; align-items:center; padding:82px 0 74px; background:#090c16; color:#f8faff; }
.hero-premium::before { content:""; position:absolute; z-index:-1; inset:0; opacity:.38; background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:44px 44px; mask-image:linear-gradient(to bottom,black,transparent 90%); }
.hero-aurora { position:absolute; z-index:-2; inset:-20%; overflow:hidden; background:radial-gradient(circle at 22% 42%,rgba(85,86,255,.48),transparent 26%),radial-gradient(circle at 75% 22%,rgba(139,92,246,.2),transparent 25%),radial-gradient(circle at 78% 71%,rgba(231,83,177,.29),transparent 30%),#090c16; filter:saturate(1.12); animation:aurora-shift 15s ease-in-out infinite alternate; }
.hero-premium .hero-grid { width:100%; grid-template-columns:.86fr 1.14fr; gap:58px; }
.hero-premium .eyebrow { color:#b8c6d1; }.hero-premium .eyebrow span { background:#99f7de; }
.hero-premium h1 { max-width:640px; font-size:clamp(52px,5.5vw,82px); letter-spacing:-.035em; }.hero-premium h1 em { color:#a9f7d4; }
.hero-premium .hero-text { max-width:500px; color:#c0cad4; font-size:17px; }.hero-premium .button-lime { background:linear-gradient(110deg,#a78bfa,#38bdf8); box-shadow:0 12px 30px rgba(83,223,199,.22); }.hero-premium .button-lime:hover{background:#c2ffe4}.hero-premium .text-link { border-color:#b3c2cb; color:#eff7fb; }
.hero-premium .trusted-row p { color:#b7c1cb; }.hero-premium .trusted-row strong { color:#fff; }.hero-premium .avatar-stack span { border-color:#0d101b; }.hero-premium .avatar-stack span:last-child { background:#78caae;color:#07241f; }
.hero-premium .hero-visual { min-height:550px; perspective:900px; }.hero-premium .dashboard-preview { inset:61px 26px 38px 60px; overflow:hidden; padding:30px; border:1px solid rgba(255,255,255,.26); border-radius:15px; background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(232,243,255,.07)); box-shadow:0 35px 90px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.26); backdrop-filter:blur(24px); transform:rotateY(-3deg) rotateX(1deg); }
.hero-premium .dashboard-preview::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(120deg,rgba(255,255,255,.22),transparent 30%); }.hero-premium .preview-head p,.hero-premium .metric-main span,.hero-premium .preview-footer span,.hero-premium .chart-label span { color:#b7c5d0; }.hero-premium .preview-head h2,.hero-premium .metric-main strong,.hero-premium .chart-label strong,.hero-premium .preview-footer strong { color:#fff; }.hero-premium .icon-button { background:rgba(255,255,255,.13); color:#fff; }.hero-premium .metric-main small { color:#a9f7d4; }.hero-premium .ring-chart { border-color:rgba(132,243,214,.18); border-top-color:#9cf5d6; border-right-color:#9cf5d6; }.hero-premium .ring-chart span,.hero-premium .ring-chart small { color:#fff; }.hero-premium .bar-chart { border-color:rgba(255,255,255,.18); }.hero-premium .bar-chart i { background:rgba(160,206,255,.48); }.hero-premium .bar-chart i:nth-child(n+10) { background:#9cf5d6; }.hero-premium .preview-footer div+div { border-color:rgba(255,255,255,.18); }
.hero-premium .card-float,.hero-kpi { border:1px solid rgba(255,255,255,.22); background:rgba(12,20,36,.54); box-shadow:0 18px 45px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.14); backdrop-filter:blur(18px); }.hero-premium .card-float strong { color:#fff; }.hero-premium .card-float small { color:#b9c7d2; }.hero-premium .signal-icon { background:rgba(124,113,255,.25); color:#c8c3ff; }.hero-premium .success-icon { background:rgba(125,242,190,.2); color:#a9f7d4; }.hero-premium .success-card { right:3px; bottom:5px; }.hero-premium .signal-card { top:28px; left:3px; }.hero-premium .call-pulse { background:#a9f7d4; }
.hero-kpi { position:absolute; z-index:3; display:flex; flex-direction:column; min-width:168px; padding:13px 15px; border-radius:11px; }.hero-kpi span { color:#b9c8d4; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.hero-kpi strong { margin:4px 0; color:white; font:700 18px/1 'Space Grotesk',sans-serif; }.hero-kpi small { color:#9cf5d6; font-size:9px; font-weight:700; }.hero-kpi small svg { width:11px; height:11px; vertical-align:-2px; }.hero-kpi-sales { right:-9px; top:5px; }.hero-kpi-team { left:-17px; bottom:77px; min-width:145px; }.hero-kpi-team strong { font-size:12px; margin-top:7px; }.hero-kpi-team small { color:#b8c7d2; }.kpi-avatars { display:flex; padding-left:4px; }.kpi-avatars b { display:grid; place-items:center; width:19px; height:19px; margin-left:-4px; border:1px solid #273b4d; border-radius:50%; background:#91b6f7; color:#10243e; font-size:7px; }.kpi-avatars b:nth-child(2){background:#e8a8cf}.kpi-avatars b:nth-child(3){background:#a4e1cc}
