@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root { --ink:#17243b; --blue:#5a73ef; --soft:#eef2ff; --paper:#fafbf9; --muted:#788597; --line:#e4e8ee; --coral:#ff806c; --lime:#d7f36d; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font-family:'DM Sans',sans-serif; } a { color:inherit; text-decoration:none; } button { font:inherit; cursor:pointer; }
.site-header { width:min(1160px,calc(100% - 48px)); height:82px; margin:auto; display:flex; align-items:center; justify-content:space-between; }.site-brand { display:flex; align-items:center; gap:9px; font:700 22px 'Space Grotesk',sans-serif; letter-spacing:-.05em; }.site-brand span { width:31px; height:31px; display:grid; place-items:center; border-radius:9px; background:var(--lime); font-size:18px; }.site-brand strong { color:var(--blue); }.site-header nav { display:flex; align-items:center; gap:23px; color:#66748b; font-size:11px; }.site-header nav a:hover { color:var(--ink); }.nav-login { padding-left:7px; border-left:1px solid var(--line); }.nav-cta { padding:11px 14px; border-radius:8px; color:#fff; background:var(--ink); font-weight:700; }.nav-cta b { color:var(--lime); margin-left:10px; font-size:15px; }.menu-button { display:none; border:0; background:none; color:var(--ink); font-size:20px; }
.public-hero { width:min(1160px,calc(100% - 48px)); margin:67px auto 0; display:grid; grid-template-columns:1fr .86fr; gap:78px; align-items:center; }.hero-copy { max-width:620px; }.public-eyebrow { margin:0 0 15px; color:var(--blue); font-size:10px; font-weight:700; letter-spacing:.16em; }.hero-copy h1 { margin:0; font:700 clamp(46px,6vw,74px)/.98 'Space Grotesk',sans-serif; letter-spacing:-.075em; }.hero-lede { max-width:540px; margin:24px 0 0; color:var(--muted); font-size:16px; line-height:1.62; }.hero-actions { display:flex; align-items:center; gap:24px; margin-top:29px; }.button-primary { display:inline-flex; align-items:center; gap:25px; padding:15px 18px; border-radius:9px; color:#fff; background:var(--ink); font-size:12px; font-weight:700; }.button-primary span { color:var(--lime); font-size:17px; }.text-link { color:var(--blue); font-size:12px; font-weight:700; }.text-link span { margin-left:7px; font-size:16px; }.hero-note { margin-top:13px; color:#a2abb7; font-size:10px; }
.hero-product { min-height:408px; position:relative; padding:0 33px; }.product-top { height:48px; padding:0 16px; display:flex; align-items:center; gap:8px; border-bottom:1px solid #e6e9ef; border-radius:18px 18px 0 0; color:#758198; background:#fff; font-size:10px; box-shadow:0 18px 45px rgba(23,36,59,.08); }.product-dot { width:7px; height:7px; border-radius:50%; background:#62c699; }.product-top b { margin-left:auto; color:#62a381; font-size:10px; }.product-body { padding:31px 31px 25px; border-radius:0 0 18px 18px; background:#fff; box-shadow:0 18px 45px rgba(23,36,59,.08); }.product-kicker { margin:0 0 11px; color:var(--coral); font-size:9px; font-weight:700; letter-spacing:.13em; }.product-body h2 { max-width:260px; margin:0; font:700 27px/1.08 'Space Grotesk',sans-serif; letter-spacing:-.05em; }.product-body p { max-width:300px; color:var(--muted); font-size:12px; line-height:1.5; }.product-progress { height:7px; margin:26px 0 18px; border-radius:10px; background:#edf0f4; overflow:hidden; }.product-progress i { display:block; width:62%; height:100%; border-radius:10px; background:var(--blue); }.product-footer { display:flex; justify-content:space-between; color:#a1abba; font-size:10px; }.product-footer a { color:var(--blue); font-weight:700; }.product-float { position:absolute; display:flex; align-items:center; gap:9px; padding:12px 13px; border-radius:12px; background:#fff; box-shadow:0 13px 30px rgba(23,36,59,.13); }.product-float span { width:25px; height:25px; display:grid; place-items:center; border-radius:7px; color:var(--blue); background:var(--soft); }.product-float b,.product-float small { display:block; }.product-float b { font:700 16px 'Space Grotesk',sans-serif; }.product-float small { color:#9ba6b3; font-size:9px; }.float-one { right:-2px; top:83px; }.float-two { left:-2px; bottom:30px; }.float-two span { color:var(--ink); background:var(--lime); }
.trust-strip { width:min(1160px,calc(100% - 48px)); margin:94px auto 0; padding:17px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; color:#9aa5b3; font-size:10px; }.trust-strip b { color:#57667d; font-size:11px; }.trust-strip b::before { content:'✦'; margin-right:8px; color:var(--coral); }
.steps-section { width:min(1160px,calc(100% - 48px)); margin:130px auto 0; }.section-intro { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end; }.section-intro h2,.audience-copy h2,.public-cta h2 { margin:0; font:700 42px/1.03 'Space Grotesk',sans-serif; letter-spacing:-.06em; }.section-intro > p:last-child { max-width:355px; margin:0; color:var(--muted); font-size:14px; line-height:1.6; }.steps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:27px; margin-top:56px; }.steps-grid article { padding:19px 0 0; border-top:2px solid var(--ink); }.step-number { color:var(--coral); font-size:10px; font-weight:700; }.steps-grid h3 { margin:23px 0 10px; font:700 18px 'Space Grotesk',sans-serif; }.steps-grid p { max-width:280px; margin:0 0 18px; color:var(--muted); font-size:12px; line-height:1.55; }.steps-grid a { color:var(--blue); font-size:11px; font-weight:700; }
.audience-section { width:min(1160px,calc(100% - 48px)); margin:135px auto 0; padding:67px; display:grid; grid-template-columns:1fr .9fr; gap:80px; border-radius:22px; background:var(--soft); }.audience-copy h2 { max-width:480px; }.audience-copy > p:not(.public-eyebrow) { max-width:455px; margin:23px 0; color:#677693; font-size:14px; line-height:1.65; }.audience-list { display:grid; gap:0; }.audience-list div { padding:17px 0; border-bottom:1px solid #d8def3; }.audience-list div:first-child { border-top:1px solid #d8def3; }.audience-list span { display:inline-block; width:34px; color:var(--blue); font-size:10px; font-weight:700; }.audience-list b { font:700 15px 'Space Grotesk',sans-serif; }.audience-list p { margin:6px 0 0 34px; color:#71809a; font-size:11px; }
.public-cta { width:min(1160px,calc(100% - 48px)); margin:130px auto 0; padding:68px; text-align:center; border-radius:22px; background:var(--ink); color:#fff; }.public-cta .public-eyebrow { color:var(--lime); }.public-cta h2 { font-size:50px; }.public-cta .button-primary { margin-top:28px; background:#fff; color:var(--ink); }.public-cta .button-primary span { color:var(--blue); }
.site-footer { width:min(1160px,calc(100% - 48px)); margin:52px auto 20px; padding-top:17px; border-top:1px solid var(--line); display:flex; justify-content:space-between; color:#a0a9b5; font-size:10px; }.site-footer a { color:var(--blue); }
@media(max-width:820px) { .site-header nav { display:none; }.menu-button { display:block; }.public-hero { grid-template-columns:1fr; gap:45px; margin-top:45px; }.hero-product { max-width:570px; width:100%; margin:auto; }.section-intro { grid-template-columns:1fr; gap:20px; }.audience-section { grid-template-columns:1fr; gap:35px; padding:39px; } }
@media(max-width:820px) { .site-header nav.mobile-open { position:absolute; z-index:5; top:64px; right:14px; left:14px; display:flex; flex-direction:column; align-items:stretch; gap:0; padding:10px; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 15px 30px rgba(23,36,59,.1); }.site-header nav.mobile-open a { padding:12px 10px; }.site-header nav.mobile-open .nav-login { border-left:0; } }
@media(max-width:560px) { .site-header,.public-hero,.trust-strip,.steps-section,.audience-section,.public-cta,.site-footer { width:calc(100% - 28px); }.site-header { height:70px; }.hero-copy h1 { font-size:48px; }.hero-lede { font-size:14px; }.hero-actions { align-items:flex-start; flex-direction:column; gap:17px; }.hero-product { padding:0 12px; }.float-one { right:-4px; }.float-two { left:-4px; }.trust-strip { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.trust-strip span { grid-column:1/-1; }.section-intro h2,.audience-copy h2 { font-size:35px; }.steps-grid { grid-template-columns:1fr; gap:35px; margin-top:38px; }.audience-section { padding:28px 23px; }.public-cta { padding:43px 20px; }.public-cta h2 { font-size:38px; }.site-footer { flex-direction:column; gap:8px; } }
