/* Capstead marketing site — shares the dashboard's dark palette (static/capstead/index.html). */
:root {
    --bg:#0f1420; --bg2:#0c1119; --card:#171d2b; --line:#26304a;
    --text:#e6ebf5; --muted:#8b97b3; --ok:#37d67a; --warn:#f6c343; --bad:#f05a5a; --accent:#5b8cff;
    --maxw:1080px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin:0; background:var(--bg); color:var(--text);
    font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
}
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }
code { background:var(--bg2); padding:2px 6px; border-radius:6px; color:var(--accent); font-size:.9em;
    font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace; }
pre { background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:16px 18px;
    overflow:auto; font-size:13.5px; line-height:1.55; }
pre code { background:none; padding:0; color:var(--text); }

/* Header / nav */
.nav { position:sticky; top:0; z-index:10; background:rgba(15,20,32,.82); backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line); }
.nav-inner { max-width:var(--maxw); margin:0 auto; padding:14px 24px; display:flex; align-items:center; gap:20px; }
.brand { font-weight:700; font-size:18px; letter-spacing:.3px; color:var(--text); }
.brand:hover { text-decoration:none; }
.brand .dot { color:var(--accent); }
.nav .spacer { flex:1; }
.nav a.link { color:var(--muted); font-size:14px; }
.nav a.link:hover { color:var(--text); text-decoration:none; }

/* Layout */
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.section { padding:56px 0; border-bottom:1px solid var(--line); }
.section:last-child { border-bottom:none; }
.eyebrow { color:var(--accent); font-size:12px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; }
h1 { font-size:40px; line-height:1.15; margin:12px 0 16px; letter-spacing:-.5px; }
h2 { font-size:26px; margin:0 0 14px; letter-spacing:-.3px; }
h3 { font-size:18px; margin:26px 0 8px; }
.lede { font-size:19px; color:var(--muted); max-width:760px; }
.muted { color:var(--muted); }

/* Hero */
.hero { padding:72px 0 48px; }
.hero .cta { margin-top:26px; display:flex; gap:12px; flex-wrap:wrap; }
.btn { display:inline-block; padding:11px 20px; border-radius:10px; font-weight:600; font-size:15px; border:1px solid var(--line); }
.btn.primary { background:var(--accent); color:#0b1020; border-color:var(--accent); }
.btn.primary:hover { text-decoration:none; filter:brightness(1.08); }
.btn.ghost { background:var(--card); color:var(--text); }
.btn.ghost:hover { text-decoration:none; border-color:var(--accent); }

/* Cards */
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px 22px; }
.card h3 { margin-top:0; }
.card p { margin:0; color:var(--muted); font-size:14.5px; }
.card .k { color:var(--accent); font-weight:700; font-size:13px; letter-spacing:.4px; text-transform:uppercase; }

/* Table */
.tbl-scroll { overflow:auto; border:1px solid var(--line); border-radius:14px; }
table { width:100%; border-collapse:collapse; background:var(--card); min-width:620px; }
th, td { text-align:left; padding:13px 16px; border-bottom:1px solid var(--line); font-size:14.5px; vertical-align:top; }
th { color:var(--muted); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.5px; }
tr:last-child td { border-bottom:none; }
td.c { text-align:center; }
.yes { color:var(--ok); font-weight:700; }
.no { color:var(--bad); font-weight:700; }
.part { color:var(--warn); font-weight:700; }

/* Callout */
.callout { background:linear-gradient(180deg, rgba(91,140,255,.08), rgba(91,140,255,.02));
    border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:12px; padding:18px 22px; }
.callout p { margin:0; }

/* Pills / tags */
.pill { display:inline-block; padding:3px 12px; border-radius:999px; font-size:12px; font-weight:600;
    background:rgba(91,140,255,.14); color:var(--accent); }

/* Footer */
footer { padding:36px 0; color:var(--muted); font-size:13.5px; }
footer .wrap { display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
footer .spacer { flex:1; }

ul.clean { padding-left:20px; }
ul.clean li { margin:6px 0; }

@media (max-width:640px){
    h1 { font-size:31px; }
    .hero { padding:48px 0 36px; }
    .section { padding:40px 0; }
}