:root { --ink:#101828; --muted:#667085; --line:#e4e7ec; --blue:#2563eb; --blue-dark:#1d4ed8; --nav:#0b1220; --surface:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#f8fafc; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
p { margin:0; color:var(--muted); line-height:1.7; }
.landing-page { min-height:100vh; overflow:hidden; }
.landing-nav { width:min(1240px,100%); margin:auto; padding:24px 32px; display:flex; align-items:center; justify-content:space-between; }
.landing-brand { display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; letter-spacing:.08em; }
.landing-brand span { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; background:linear-gradient(135deg,#60a5fa,#2563eb); color:#fff; font-size:14px; font-weight:850; box-shadow:0 9px 24px rgb(37 99 235 / 28%); }
.landing-brand strong { font-size:14px; }
.landing-brand small { color:#98a2b3; font-size:8px; font-weight:800; letter-spacing:.12em; }
.nav-login { padding:10px 15px; border:1px solid #d0d5dd; border-radius:10px; background:#fff; color:#344054; text-decoration:none; font-size:12px; font-weight:700; transition:.2s; }
.nav-login:hover { border-color:#98a2b3; box-shadow:0 6px 18px rgb(16 24 40 / 8%); transform:translateY(-1px); }
.landing-hero { width:min(1240px,100%); min-height:680px; margin:auto; padding:80px 32px 110px; display:grid; grid-template-columns:.95fr 1.05fr; align-items:center; gap:72px; }
.landing-eyebrow { color:var(--blue); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.hero-copy h1 { max-width:680px; margin:18px 0 25px; font-size:clamp(56px,6.3vw,88px); line-height:.98; font-weight:680; letter-spacing:-.06em; }
.hero-intro { max-width:570px; font-size:18px; }
.hero-actions { margin-top:38px; display:flex; align-items:center; gap:24px; }
.primary-link,.light-link { display:inline-flex; align-items:center; gap:22px; padding:13px 17px; border-radius:10px; background:var(--blue); color:#fff; font-size:13px; font-weight:700; text-decoration:none; box-shadow:0 8px 22px rgb(37 99 235 / 22%); transition:.2s; }
.primary-link:hover { background:var(--blue-dark); transform:translateY(-1px); }
.text-link { color:#344054; font-size:13px; font-weight:700; text-underline-offset:5px; }
.hero-visual { overflow:hidden; border:1px solid #dbe1ea; border-radius:18px; background:#fff; box-shadow:0 32px 90px rgb(16 24 40 / 18%); transform:perspective(1000px) rotateY(-3deg) rotateX(1deg); }
.visual-top { height:42px; display:flex; align-items:center; gap:6px; padding:0 14px; background:#f2f4f7; color:#98a2b3; font-size:9px; }
.visual-top i { width:7px; height:7px; border-radius:50%; background:#d0d5dd; }
.visual-top span { margin:auto; }
.visual-body { min-height:400px; display:grid; grid-template-columns:62px 1fr; }
.visual-sidebar { display:grid; align-content:start; justify-items:center; gap:28px; padding:22px 0; background:var(--nav); }
.visual-sidebar b { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; background:var(--blue); color:#fff; }
.visual-sidebar i { width:17px; height:3px; border-radius:4px; background:#475467; }
.visual-content { padding:40px 34px; background:#f8fafc; }
.visual-content small { color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.12em; }
.visual-content h2 { margin:9px 0 24px; font-size:23px; letter-spacing:-.03em; }
.visual-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.visual-cards span { padding:14px; border:1px solid var(--line); border-radius:9px; background:#fff; color:#98a2b3; font-size:9px; }
.visual-cards b { display:block; margin-bottom:5px; color:var(--ink); font-size:23px; }
.visual-list { margin-top:14px; padding:4px 17px; border:1px solid var(--line); border-radius:9px; background:#fff; }
.visual-list p { padding:13px 0; display:flex; align-items:center; gap:8px; border-bottom:1px solid #eef0f4; font-size:10px; }
.visual-list p:last-child { border:0; }
.visual-list i { width:6px; height:6px; border-radius:50%; background:var(--blue); }
.visual-list b { margin-left:auto; color:#98a2b3; font-size:9px; }
.landing-benefits { padding:105px max(32px,calc((100vw - 1176px)/2)); background:#fff; }
.benefits-heading { max-width:680px; }
.benefits-heading h2,.landing-cta h2 { margin:12px 0 0; font-size:clamp(38px,4vw,56px); line-height:1.08; letter-spacing:-.045em; }
.benefit-grid { margin-top:60px; display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.benefit-grid article { padding:28px; border:1px solid var(--line); border-radius:15px; background:#fff; transition:.2s; }
.benefit-grid article:hover { transform:translateY(-3px); box-shadow:0 18px 45px rgb(16 24 40 / 9%); }
.benefit-grid span { color:var(--blue); font-size:11px; font-weight:800; }
.benefit-grid h3 { margin:26px 0 10px; font-size:18px; }
.benefit-grid p { font-size:13px; }
.landing-cta { padding:80px max(32px,calc((100vw - 1176px)/2)); display:flex; justify-content:space-between; align-items:center; gap:48px; background:var(--nav); }
.landing-cta h2 { max-width:700px; color:#fff; }
.landing-cta .landing-eyebrow { color:#60a5fa; }
.light-link { flex:none; background:#fff; color:var(--ink); box-shadow:none; }
.landing-footer { padding:24px max(32px,calc((100vw - 1176px)/2)); display:flex; justify-content:space-between; background:#090f1a; color:#667085; font-size:10px; letter-spacing:.04em; }
@media(max-width:1000px){.landing-hero{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-intro{margin:auto}.hero-actions{justify-content:center}.hero-visual{max-width:680px;width:100%;margin:auto;transform:none}.benefit-grid{grid-template-columns:1fr}.landing-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.landing-nav{padding:18px 20px}.landing-brand small{display:none}.landing-hero{min-height:auto;padding:60px 20px 75px;gap:50px}.hero-copy h1{font-size:48px}.hero-intro{font-size:16px}.hero-actions{flex-direction:column;gap:16px}.visual-body{grid-template-columns:42px 1fr;min-height:320px}.visual-content{padding:26px 16px}.visual-cards{grid-template-columns:1fr}.visual-cards span:nth-child(n+2){display:none}.landing-benefits{padding:75px 20px}.landing-cta{padding:65px 20px}.landing-footer{padding:22px 20px;flex-direction:column;gap:8px}}
