*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#0f172a;line-height:1.55}a{color:#4f46e5;text-decoration:none}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}.narrow{max-width:760px}.muted{color:#64748b}.small{font-size:13px}.center{text-align:center}
.btn{display:inline-block;background:#4f46e5;color:#fff;border-radius:10px;padding:10px 18px;font-weight:600;border:0;cursor:pointer;font:inherit;font-weight:600}.btn:hover{background:#4338ca}.btn.ghost{background:#eef2ff;color:#4338ca}.btn.lg{padding:14px 24px;font-size:16px}.btn.full{width:100%}
.top{position:sticky;top:0;background:rgba(255,255,255,.88);backdrop-filter:blur(10px);border-bottom:1px solid #eef0f4;z-index:9}.nav{display:flex;justify-content:space-between;align-items:center;height:66px}.nav nav{display:flex;gap:22px;align-items:center}.nav nav a:not(.btn){color:#334155;font-weight:500}
.hero{background:radial-gradient(1000px 500px at 80% -10%,#e0e7ff,transparent),radial-gradient(800px 400px at 0% 100%,#cffafe,transparent);padding:80px 0 70px}.hgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.pill{display:inline-block;background:#fff;border:1px solid #e0e7ff;color:#4338ca;padding:5px 12px;border-radius:99px;font-size:13px;font-weight:600}
h1{font-size:54px;line-height:1.08;letter-spacing:-.03em;margin:18px 0}.grad{background:linear-gradient(90deg,#4f46e5,#06b6d4);-webkit-background-clip:text;background-clip:text;color:transparent}.lead{font-size:19px;color:#475569}.cta{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 12px}
.mock{background:#fff;border-radius:16px;box-shadow:0 30px 60px -20px rgba(30,27,75,.25);border:1px solid #e5e7eb;overflow:hidden}.mbar{background:#f8fafc;padding:10px 14px;display:flex;gap:6px;align-items:center;border-bottom:1px solid #eef0f4}.mbar i{width:10px;height:10px;border-radius:50%;background:#e2e8f0}.mbar span{margin-left:10px;font-size:12px;color:#64748b;background:#fff;padding:3px 10px;border-radius:6px}
.mbody{padding:16px}.mrow{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid #eef0f4;border-radius:10px;margin-bottom:10px;font-size:14px}.mrow em{font-style:normal;font-size:12px;font-weight:700;padding:3px 9px;border-radius:99px}.t-u{background:#fee2e2;color:#b91c1c}.t-i{background:#e0f2fe;color:#0369a1}.t-t{background:#dcfce7;color:#166534}.t-e{background:#f3e8ff;color:#7e22ce}.mqr{text-align:center;padding:12px;background:#f0fdf4;border-radius:10px;color:#166534;font-weight:700}
.logos{border-block:1px solid #f1f5f9;padding:18px 0}.logos .wrap{display:flex;gap:28px;flex-wrap:wrap;align-items:center;justify-content:center;color:#94a3b8}.logos b{color:#64748b}
section{padding:80px 0}section.alt{background:#f8fafc}h2{font-size:36px;letter-spacing:-.02em;text-align:center;margin:0 0 10px}.sub{text-align:center;color:#64748b;font-size:17px;margin:0 auto 40px;max-width:640px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.mcard{border:1px solid #e5e7eb;border-radius:16px;padding:24px;transition:.2s}.mcard:hover{transform:translateY(-3px);box-shadow:0 14px 30px -12px rgba(79,70,229,.3)}.mcard span{font-size:34px}.mcard h3{margin:10px 0 6px}.mcard p{color:#475569;margin:0}
.feats>div{background:#fff;border:1px solid #eef0f4;border-radius:14px;padding:20px}.feats p{margin:6px 0 0;color:#64748b}
.steps>div{text-align:center}.steps i{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#eef2ff;color:#4338ca;font-style:normal;font-weight:800;font-size:18px}.steps p{color:#64748b}
.demo{background:linear-gradient(135deg,#312e81,#0e7490);color:#fff}.demo h2{color:#fff}.demo .sub{color:#c7d2fe}.dcard{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:18px;padding:28px;color:#fff;transition:.2s;display:block}.dcard:hover{background:rgba(255,255,255,.16);transform:translateY(-3px)}.dcard span{font-size:36px}.dcard p{color:#e0e7ff}.dcard b{color:#a5f3fc}
.price{border:1px solid #e5e7eb;border-radius:16px;padding:26px;position:relative;display:flex;flex-direction:column}.price p{color:#64748b;flex:1}.price.pop{border:2px solid #4f46e5;box-shadow:0 20px 40px -20px rgba(79,70,229,.4)}.tag{position:absolute;top:-12px;left:20px;background:#4f46e5;color:#fff;font-size:12px;padding:3px 10px;border-radius:99px;font-weight:700}.amt{font-size:38px;font-weight:800}.amt small{font-size:14px;color:#64748b;font-weight:500}
details{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:16px 20px;margin-bottom:10px}summary{font-weight:600;cursor:pointer}details p{color:#475569;margin:10px 0 0}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}.tgrid h2{text-align:left}.checks{padding:0;list-style:none}.checks li{padding:6px 0}.checks li:before{content:"✓ ";color:#16a34a;font-weight:800}
.formcard{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:28px;box-shadow:0 20px 50px -25px rgba(15,23,42,.25)}.formcard label{display:block;font-weight:600;font-size:14px;margin-bottom:14px}.formcard input,.formcard select,.formcard textarea{width:100%;padding:11px 12px;border:1px solid #d6dae3;border-radius:10px;font:inherit;margin-top:5px}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}fieldset{border:0;padding:0;margin:0 0 14px}legend{font-weight:600;font-size:14px;margin-bottom:6px}.ck{display:inline-flex!important;gap:6px;align-items:center;margin-right:14px;font-weight:500!important}.ck input{width:auto!important;margin:0!important}.hp{position:absolute;left:-9999px}.ok{text-align:center}.err{background:#fee2e2;color:#991b1b;padding:10px;border-radius:8px;margin-bottom:12px}
footer{background:#0f172a;color:#cbd5e1;padding:50px 0 24px}.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.fgrid b{display:block;color:#fff;margin-bottom:8px}.fgrid a{display:block;color:#94a3b8;margin-bottom:6px}.copy{border-top:1px solid #1e293b;margin-top:30px;padding-top:20px;font-size:13px;color:#64748b}
@media(max-width:900px){.hgrid,.tgrid{grid-template-columns:1fr}h1{font-size:38px}.g4,.g3{grid-template-columns:1fr 1fr}.nav nav a:not(.btn){display:none}}@media(max-width:560px){.g4,.g3,.two,.fgrid{grid-template-columns:1fr}section{padding:56px 0}}
/* v4: modules grid, e-commerce, calculator, signup */
.ggh{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:#64748b;margin:30px 0 12px}.mcard{display:flex;flex-direction:column}.mcard p{flex:1;font-size:14.5px}.mtop{display:flex;justify-content:space-between;align-items:center}.soonb,.betab{font-style:normal;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:99px;background:#f1f5f9;color:#64748b}.betab{background:#fef3c7;color:#92400e}.mcard.soon{background:#fafbfc;border-style:dashed}.mp{margin-top:12px;font-weight:800;color:#4f46e5;font-size:18px}.mp small{font-size:12.5px;color:#64748b;font-weight:500}
h2.left{text-align:left}.egrid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}#ecommerce{background:linear-gradient(180deg,#fff,#f5f3ff)}
.dlinks{text-align:center;margin-top:28px;color:#c7d2fe}.dlinks a{color:#a5f3fc;font-weight:600}
.calc{display:grid;grid-template-columns:1fr 340px;gap:24px;align-items:start}.cpick{display:grid;grid-template-columns:1fr 1fr;gap:18px}.cg b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#64748b;margin-bottom:8px}
.cm{display:flex;gap:10px;align-items:center;border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px;margin-bottom:8px;cursor:pointer;transition:.15s;background:#fff}.cm:hover{border-color:#c7d2fe}.cm:has(input:checked){border-color:#4f46e5;background:#f5f7ff;box-shadow:0 0 0 2px rgba(79,70,229,.15)}.cm input{width:18px;height:18px;accent-color:#4f46e5;flex:none}.ci{font-size:22px}.cn{font-weight:600;font-size:14.5px}.cn small{display:block;color:#64748b;font-weight:500;font-size:12.5px}.cm.soon{border-style:dashed}
.csum{position:sticky;top:84px;background:#fff;border:2px solid #4f46e5;border-radius:18px;padding:22px;box-shadow:0 20px 40px -20px rgba(79,70,229,.4)}.crange{display:block;font-weight:600;font-size:14px;margin-bottom:12px}.crange b{float:right;color:#4f46e5}.crange input[type=range]{width:100%;accent-color:#4f46e5;margin-top:8px}.crange input[type=number]{width:80px;float:right;padding:4px 8px;border:1px solid #d6dae3;border-radius:8px;font:inherit}
.ctog{display:flex;gap:8px;align-items:center;font-weight:600;font-size:14px;margin-bottom:12px}.ctog em{font-style:normal;background:#dcfce7;color:#166534;font-size:12px;padding:2px 8px;border-radius:99px}.ctog input{accent-color:#4f46e5;width:18px;height:18px}
.qt{width:100%;border-collapse:collapse;margin:8px 0}.qt td{padding:6px 0;font-size:13.5px;border-bottom:1px dashed #eef0f4;vertical-align:top}.qt small{display:block;color:#64748b;font-size:12px}.qt .r{text-align:right;font-weight:600;white-space:nowrap}.qt tr.dim td{opacity:.6}.qline{display:flex;justify-content:space-between;font-size:14px;margin:6px 0}.qline.save{color:#15803d;font-weight:700}.qtotal{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid #e5e7eb;padding-top:10px;margin-top:8px;font-weight:600}.qtotal b{font-size:34px;letter-spacing:-.02em}.qnote{font-size:12.5px;color:#64748b;margin-top:4px}.qnote.hint{color:#4f46e5;font-weight:700}.csum .btn{margin-top:14px}
.bundles{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:30px 0 16px}.bundles div{text-align:center;border:1px solid #e5e7eb;border-radius:14px;padding:14px}.bundles b{display:block;font-size:14px}.bundles span{color:#15803d;font-weight:800;font-size:20px}
/* signup */
body.signup{background:radial-gradient(900px 500px at 90% -10%,#e0e7ff,transparent),#f8fafc}header.nav{height:auto;display:block;background:rgba(255,255,255,.9);border-bottom:1px solid #eef0f4}header.nav .wrap{display:flex;justify-content:space-between;align-items:center;height:66px}header.nav nav{display:flex;gap:20px;align-items:center}header.nav nav a:not(.btn){color:#334155;font-weight:500}.btn.sm{padding:7px 14px;font-size:14px}
.su{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;padding-top:40px;padding-bottom:60px;align-items:start}.su-intro h1{font-size:42px}.ticks{padding:0;list-style:none}.ticks li{padding:6px 0}.ticks li:before{content:"✓ ";color:#16a34a;font-weight:800}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:26px;box-shadow:0 20px 50px -25px rgba(15,23,42,.25)}.su-form label{display:block;font-weight:600;font-size:14px;margin-bottom:14px}.su-form input:not([type=checkbox]),.su-form select{width:100%;padding:11px 12px;border:1px solid #d6dae3;border-radius:10px;font:inherit;margin-top:5px;background:#fff}
.su-form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ws{display:flex;align-items:center;border:1px solid #d6dae3;border-radius:10px;margin-top:5px;overflow:hidden;background:#fff}.ws span{padding:0 2px 0 12px;color:#64748b;white-space:nowrap;font-weight:500}.su-form .ws input{border:0;margin:0;padding-left:2px}
.mods{border:1px solid #e5e7eb;border-radius:12px;padding:12px 14px;margin-bottom:14px}.mg{margin-bottom:8px}.mg b{display:block;font-size:12px;text-transform:uppercase;color:#64748b;letter-spacing:.05em;margin:6px 0}.mods label.mod{display:flex;gap:8px;align-items:flex-start;font-weight:500;margin:0 0 6px;font-size:14px}.mods label.mod input{margin-top:3px;accent-color:#4f46e5}.mods small{color:#64748b}.mods .soon{opacity:.8}
label.inline{display:flex !important;gap:8px;align-items:center;font-weight:500 !important}code{background:#eef2ff;padding:1px 6px;border-radius:6px;font-size:.92em}
@media(max-width:900px){.egrid,.calc,.su{grid-template-columns:1fr}.cpick{grid-template-columns:1fr}.bundles{grid-template-columns:1fr 1fr}.csum{position:static}}
/* v5: real screenshots, tour, what's new */
.mock.shot img{display:block;width:100%;height:auto}
.hero .mock.shot{transform:perspective(1600px) rotateY(-4deg);transform-origin:left center}
@media(max-width:900px){.hero .mock.shot{transform:none}}
.tour{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:22px 0 18px}
.ttab{border:1px solid #e2e8f0;background:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-size:14px;cursor:pointer;color:#334155}
.ttab:hover{border-color:#2F6FE4}.ttab.on{background:#2F6FE4;border-color:#2F6FE4;color:#fff}
.tshot{display:none;margin:0 auto;max-width:1060px}.tshot.on{display:block}
.tshot figcaption{text-align:center;color:#64748b;font-size:14px;margin-top:12px}
.clog{list-style:none;padding:0;margin:26px auto 0;max-width:820px;position:relative}
.clog:before{content:"";position:absolute;left:118px;top:6px;bottom:6px;width:2px;background:#e2e8f0}
.clog li{display:grid;grid-template-columns:104px 1fr;gap:28px;padding:0 0 22px;position:relative}
.clog li:before{content:"";position:absolute;left:113px;top:6px;width:12px;height:12px;border-radius:50%;background:#2F6FE4;box-shadow:0 0 0 4px #eef4ff}
.cdate{font-size:13px;color:#64748b;text-align:right;padding-top:2px}
.cbody b{display:block;font-size:16px;margin:2px 0 4px}.cbody p{margin:0;color:#475569;font-size:14.5px;line-height:1.55}
.ctag{font-style:normal;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px 8px;border-radius:999px;background:#e0ecff;color:#1d4ed8}
.ctag-design{background:#f3e8ff;color:#7e22ce}.ctag-soon{background:#fef3c7;color:#92400e}
@media(max-width:640px){.clog:before{left:5px}.clog li{grid-template-columns:1fr;gap:4px;padding-left:24px}.clog li:before{left:0}.cdate{text-align:left}}