:root { --ink:#081823; --paper:#f3efe5; --white:#fffdfa; --line:#bdbab1; --blue:#1763e8; --orange:#f1633f; --green:#21a669; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.pro-nav { position:sticky; top:0; z-index:10; min-height:66px; padding:0 clamp(18px,5vw,72px); display:flex; align-items:center; justify-content:space-between; gap:25px; color:white; background:rgba(8,24,35,.97); border-bottom:1px solid #334753; }
.brand { display:flex; align-items:center; gap:8px; color:white; font-weight:850; text-decoration:none; }
.brand > span { display:grid; place-items:center; width:34px; height:34px; margin-right:3px; background:var(--orange); font:900 11px/1 ui-monospace,monospace; }
.brand strong { color:#79aaff; font:900 10px/1 ui-monospace,monospace; letter-spacing:.1em; }
nav { display:flex; align-items:center; gap:26px; }
nav a { color:#c4cdd2; font-size:12px; font-weight:750; text-decoration:none; }
.nav-button { padding:10px 13px; color:white; border:1px solid #70818a; }
main { overflow:hidden; }
.pro-hero { min-height:720px; padding:clamp(70px,9vw,135px) clamp(18px,5vw,72px); display:grid; grid-template-columns:minmax(0,.9fr) minmax(500px,1.1fr); gap:clamp(45px,8vw,120px); align-items:center; background-image:linear-gradient(rgba(8,24,35,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(8,24,35,.035) 1px,transparent 1px); background-size:32px 32px; }
.kicker { margin:0; color:var(--blue); font:850 11px/1.4 ui-monospace,monospace; letter-spacing:.12em; }
h1 { max-width:720px; margin:18px 0 26px; font:500 clamp(54px,7vw,98px)/.92 Georgia,serif; letter-spacing:-.06em; }
h1 em { color:var(--orange); font-weight:500; }
.lede { max-width:650px; color:#40525c; font-size:clamp(17px,1.55vw,22px); line-height:1.6; }
.hero-actions { display:flex; flex-wrap:wrap; gap:11px; margin-top:32px; }
.button { min-height:48px; padding:13px 18px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--ink); border-radius:3px; font-size:12px; font-weight:850; text-decoration:none; }
.primary { color:white; background:var(--blue); box-shadow:4px 4px 0 var(--ink); }
.secondary { background:transparent; }
.launch-note { margin:22px 0 0; color:#596a73; font-size:12px; }
.product-window { border:1px solid var(--ink); background:white; box-shadow:14px 14px 0 var(--blue); transform:rotate(1deg); }
.window-bar { min-height:50px; padding:0 18px; display:flex; align-items:center; justify-content:space-between; color:white; background:var(--ink); font:800 10px/1 ui-monospace,monospace; letter-spacing:.08em; }
.window-bar span:last-child { color:#6ee0a9; }
.window-body { min-height:410px; display:grid; grid-template-columns:.75fr 1.25fr; }
.window-body aside { padding:24px; color:white; background:#132b39; }
.window-body small { color:#75a7ff; font:850 9px/1.3 ui-monospace,monospace; letter-spacing:.08em; }
.window-body aside strong { display:block; margin:11px 0 28px; font-size:17px; }
.window-body aside div { padding:13px 0; display:flex; justify-content:space-between; gap:14px; border-top:1px solid #3c515d; font-size:10px; }
.window-body article { padding:32px; }
.window-body article h2 { margin:12px 0 35px; font:500 44px/1 Georgia,serif; letter-spacing:-.05em; }
.decision { padding:22px; display:flex; align-items:center; justify-content:space-between; gap:18px; color:white; background:var(--ink); }
.decision b { color:#ffd171; font:900 14px/1 ui-monospace,monospace; }
.decision span { color:#aab8bf; font-size:10px; }
.bars { height:115px; margin-top:24px; display:flex; align-items:end; gap:12px; border-bottom:1px solid var(--line); }
.bars i { flex:1; height:52%; background:#aac3f7; }
.bars i:nth-child(2) { height:82%; background:var(--blue); }.bars i:nth-child(3) { height:37%; background:var(--orange); }.bars i:nth-child(4) { height:68%; background:#57b995; }
.window-body article > p { margin:18px 0 0; color:#63747d; font:800 9px/1 ui-monospace,monospace; }
.proof-strip { padding:22px clamp(18px,5vw,72px); display:flex; justify-content:space-around; flex-wrap:wrap; gap:18px; color:white; background:var(--ink); font:800 11px/1.4 ui-monospace,monospace; letter-spacing:.05em; }
.proof-strip span::before { content:"✓"; margin-right:8px; color:#67dda5; }
.features,.faq { padding:clamp(75px,9vw,130px) clamp(18px,5vw,72px); }
.section-title { max-width:830px; margin-bottom:50px; }
.section-title h2,.workflow h2 { margin:12px 0 0; font:500 clamp(40px,5vw,68px)/1 Georgia,serif; letter-spacing:-.045em; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ink); border-left:1px solid var(--ink); }
.feature-grid article { min-height:260px; padding:30px; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.feature-grid article > span { color:var(--blue); font:850 11px/1 ui-monospace,monospace; }
.feature-grid h3 { margin:52px 0 12px; font-size:21px; letter-spacing:-.025em; }
.feature-grid p { margin:0; color:#52636d; font-size:14px; line-height:1.65; }
.workflow { padding:clamp(65px,8vw,110px) clamp(18px,5vw,72px); display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; color:white; background:var(--ink); }
.workflow .kicker { color:#63d9a1; }
.workflow ol { margin:0; padding:0; list-style:none; }
.workflow li { padding:22px 0; display:grid; grid-template-columns:120px 1fr; border-top:1px solid #41535e; }
.workflow li:last-child { border-bottom:1px solid #41535e; }
.workflow li strong { color:#79aaff; }.workflow li span { color:#c4ced3; }
.license-card { margin:clamp(60px,8vw,110px) clamp(18px,5vw,72px); padding:clamp(30px,5vw,64px); display:grid; grid-template-columns:1fr .9fr .65fr; gap:55px; align-items:center; background:var(--orange); border:1px solid var(--ink); box-shadow:10px 10px 0 var(--ink); }
.license-card h2 { margin:12px 0; font:500 clamp(50px,6vw,78px)/1 Georgia,serif; }.license-card h2 span { font:700 13px/1 ui-sans-serif,system-ui; }
.license-card p { line-height:1.6; }.license-card ul { margin:0; padding-left:20px; line-height:1.9; font-size:13px; }
.license-card > div:last-child { display:grid; gap:14px; }.license-card small { line-height:1.5; }
.faq { background:#e7e2d6; }
.faq details { max-width:980px; padding:22px 0; border-top:1px solid #9d9b94; }
.faq details:last-child { border-bottom:1px solid #9d9b94; }
.faq summary { cursor:pointer; font-size:17px; font-weight:800; }.faq details p { max-width:820px; margin:15px 0 0; color:#4c5d66; line-height:1.7; }
footer { padding:38px clamp(18px,5vw,72px); display:flex; align-items:flex-start; justify-content:space-between; gap:25px; color:white; background:var(--ink); }
footer div { display:flex; gap:16px; flex-wrap:wrap; } footer span,footer a { color:#9fb0b8; font-size:12px; text-decoration:none; }
@media(max-width:980px){.pro-hero{grid-template-columns:1fr}.product-window{max-width:720px}.feature-grid{grid-template-columns:1fr 1fr}.workflow,.license-card{grid-template-columns:1fr}.license-card{gap:25px}}
@media(max-width:660px){nav a:not(.nav-button){display:none}.pro-hero{padding-top:70px}.product-window{transform:none;box-shadow:7px 7px 0 var(--blue)}.window-body{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr}.workflow{gap:35px}.workflow li{grid-template-columns:90px 1fr}footer{flex-direction:column}}