@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#070911;--panel:#101726;--line:#28334b;--ink:#f5f7fc;--muted:#a7b7ca;--blue:#11c4ed;--violet:#9065ff}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 0%,#1c193a 0,transparent 42%),radial-gradient(ellipse at 0% 40%,#102f48 0,transparent 45%),var(--bg);color:var(--ink);font:15px/1.65 'DM Sans',sans-serif}a{color:inherit;text-decoration:none}h1{font-size:clamp(36px,5.5vw,72px);letter-spacing:-.055em;line-height:1.05;margin:14px 0 22px}h2{font-size:clamp(22px,3vw,34px);letter-spacing:-.04em}p{color:var(--muted)}.top{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px max(24px,calc((100% - 1200px)/2));border-bottom:1px solid var(--line);background:#070b16a8;backdrop-filter:blur(20px)}.top img{display:block;width:142px;max-height:60px;object-fit:contain;object-position:left}.top nav{display:flex;flex-wrap:wrap;gap:24px;font-size:13px;color:#d4e1f3}.hero{max-width:1200px;margin:auto;padding:85px 24px 50px;display:grid;grid-template-columns:1fr 300px;align-items:center;gap:40px}.hero img{width:100%;filter:drop-shadow(0 20px 45px #2673ff28)}.eyebrow{color:#7bdcf7;letter-spacing:.22em;text-transform:uppercase;font-weight:800;font-size:11px}.shell{max-width:1200px;margin:auto;padding:20px 24px 90px}.narrow{max-width:1050px;margin:auto;padding:45px 24px 100px}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}.tab,button,.action{border:1px solid #46536e;background:linear-gradient(135deg,#254366,#29224d);color:white;border-radius:10px;padding:11px 16px;font:inherit;cursor:pointer}.tab.active{background:linear-gradient(135deg,#04a8d5,#7652e6);border-color:transparent}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:15px}.card,.panel{border:1px solid var(--line);background:linear-gradient(155deg,#171e31,#111725);border-radius:19px;padding:25px;box-shadow:0 25px 50px #0002}.panel{margin:20px 0}.card .name{font-weight:800;font-size:20px}.muted{font-size:13px;color:var(--muted)}.card .action{display:inline-block;margin-top:12px;background:#e4f3ff;color:#0b1b34;font-weight:800;border:none}.section{margin:65px 0}.pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}.price{font-size:34px;font-weight:800;letter-spacing:-.04em;margin:18px 0}.table{width:100%;border-collapse:collapse}.table td,.table th{padding:11px 9px;text-align:left;border-bottom:1px solid var(--line)}.table th{font-size:12px;letter-spacing:.08em;color:#b8d2e8}.quotebuilder{display:grid;grid-template-columns:1fr 1fr;gap:22px}.quotebuilder .wide{grid-column:1/-1}label{display:block;font-size:13px;font-weight:700;margin:16px 0 7px;color:#cedbee}input,select{width:100%;padding:11px 13px;border:1px solid #44516b;background:#0b1220;border-radius:10px;color:white;font:inherit;margin-top:6px}input[type=checkbox]{width:auto;margin-right:10px;accent-color:#42c6ed}.checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:9px}.checks label{padding:10px 12px;background:#10182a;border:1px solid #2e3b52;border-radius:10px;margin:0;font-weight:500}.summary{padding:25px;border:1px solid #52668a;background:#13223a;border-radius:17px}.summary strong{display:block;font-size:32px}textarea{width:100%;min-height:240px;border-radius:10px;padding:14px;background:#0a111f;color:#edf4ff;border:1px solid #40516d;font:13px/1.55 ui-monospace,monospace}footer{text-align:center;padding:40px 24px;border-top:1px solid var(--line);color:var(--muted)}footer a{color:#83d8fa}.editgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:4px 18px}.error{color:#ffa7af}.success{color:#a8ffc9}.logout{margin-bottom:24px}.secondary{background:#202a3f}.hide{display:none!important}@media(max-width:780px){.hero{grid-template-columns:1fr;padding-top:48px}.hero img{max-width:230px}.top{align-items:flex-start;flex-direction:column}.quotebuilder{grid-template-columns:1fr}}

html{scroll-behavior:smooth;scroll-padding-top:86px} .top{position:sticky;top:0;z-index:80} .top nav a:hover{color:#77d9fd} .action,button{transition:transform .2s ease,box-shadow .2s ease} .action:hover,button:hover{transform:translateY(-2px);box-shadow:0 10px 25px #1ccaff20} :focus-visible{outline:2px solid #4bcaff;outline-offset:3px}.ticket-table{overflow:auto}.ticket-table a{color:#8cddff}.mini-actions{display:flex;gap:10px;flex-wrap:wrap;margin:15px 0}.mini-actions .action{display:inline-block}.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:14px}.statrow .panel{margin:5px 0}.statrow strong{font-size:25px}.help{font-size:12px;color:#9bb0ce}.form2{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.fieldwide{grid-column:1/-1}.ticket-table td{white-space:nowrap}.pill{border-radius:50px;border:1px solid #44607e;padding:4px 9px;font-size:12px}.top img{max-height:60px} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto} .action,button{transition:none}}

/* V3 live demo update */
html{scroll-behavior:smooth;scroll-padding-top:88px}
.demo-card{display:flex;flex-direction:column;gap:5px}
.demo-card .action{margin-top:auto;align-self:flex-start}
