/* Marketing pages. Builds on app.css (tokens, buttons, pills, finding cards). */
a{color:var(--accent)}
.site-mast{align-items:center}
.brand.home{text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:10px}
.brand-name{font-family:var(--display);font-weight:700;font-size:24px;letter-spacing:-.005em}
.glyph{width:26px;height:26px;border-radius:5px;display:block}
.topnav{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px}
.topnav a:not(.btn){font-family:var(--display);font-weight:600;font-size:16px;color:var(--muted);text-decoration:none}
.topnav a:not(.btn):hover{color:var(--accent)}
.btn{text-decoration:none;display:inline-block}
.btn.big{font-size:18px;padding:10px 18px}
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center;padding-block:56px 48px}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(38px,5.4vw,60px);line-height:1.02;margin:10px 0 0;letter-spacing:-.01em;text-wrap:balance}
.lede{font-size:18px;line-height:1.6;max-width:56ch;margin:18px 0 0}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:26px}
.cta .muted{font-size:14px}
.hero-demo{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px;min-width:0}
.demo-config{margin-top:10px;background:var(--sunk);border-radius:6px;padding:10px 12px;font:12px/1.7 var(--mono);white-space:pre;overflow-x:auto}
.demo-config .ln{display:inline-block;width:1.6em;color:var(--muted);user-select:none}
.demo-config code{font-size:inherit}
.dead-line{text-decoration:line-through;text-decoration-color:var(--high);text-decoration-thickness:2px;color:var(--muted)}
.hero-demo .finding{margin-top:12px}
.band{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:28px}
.band h2{font-size:30px;margin-top:6px;line-height:1.1}
.band p{max-width:62ch}
.csp{font:14px/1.9 var(--mono);background:var(--ink);color:var(--ground);border-radius:8px;padding:18px 20px;margin:0;overflow-x:auto}
.part h2{font-size:28px;margin-top:6px;line-height:1.15}
.checkgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:6px}
.checkcol{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:16px 18px}
.checkcol h3{font-size:19px;color:var(--accent)}
.checkcol ul{margin:10px 0 0;padding-left:18px;display:grid;gap:8px;font-size:14.5px}
.plat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.plat h3{font-size:20px}
.plat p{margin:8px 0 0}
.cmd{font:13px/1.7 var(--mono);background:var(--sunk);border-radius:6px;padding:10px 14px;margin-top:10px;max-height:none}
.small{font-size:13.5px}
.closing{margin-top:56px;text-align:left;border-top:2px solid var(--ink);padding-top:28px}
.closing h2{font-size:30px}
.closing p{max-width:60ch;margin:10px 0 18px}
.site-foot{margin-top:56px;padding-top:16px;border-top:1px solid var(--line);font-size:13.5px;max-width:90ch}
.site-foot p{margin:6px 0}
.prose{max-width:68ch;padding-block:40px 20px}
.prose h1{font-family:var(--display);font-weight:700;font-size:42px;line-height:1.05;margin:8px 0 6px}
.prose h2{margin-top:30px}
.prose p{line-height:1.65}
@media (max-width:980px){.checkgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.plat{grid-template-columns:1fr}}
@media (max-width:860px){.hero,.band{grid-template-columns:1fr}.hero{padding-block:36px 32px}}
@media (max-width:560px){.checkgrid{grid-template-columns:1fr}.topnav a:not(.btn){display:none}.band{padding:20px}.brand-name{font-size:21px}}