/* AutomationBotX brand: same look as automationbotx.com (navy bands, Oswald headings, Montserrat text, blue X). */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Oswald:wght@500;600;700&display=swap");
:root{--navy:#0b2d5b;--navy2:#123a70;--ink:#090c10;--bg:#f7fafc;--card:#fff;--tx:#2d3748;--mut:#64748b;--bd:#e2e8f0;
 --pri:#0b2d5b;--blue:#1e88ff;--ok:#12805c;--warn:#b7791f;--crit:#c62828;--hero-tx:#fff;
 --font:"Montserrat","Segoe UI",system-ui,sans-serif;--head:"Oswald","Arial Narrow","Segoe UI",sans-serif}
@media(prefers-color-scheme:dark){:root{--bg:#0b1118;--card:#131c27;--tx:#e6ebf2;--mut:#94a3b8;--bd:#24324a;--pri:#3d8bff;--blue:#4aa3ff;--ok:#3ecf9a;--warn:#e9b44c;--crit:#ff6b5e}}
*{box-sizing:border-box}
[hidden]{display:none!important}   /* .btn{display:inline-block} must not undo the hidden attribute */
body{margin:0;font:16px/1.55 var(--font);background:var(--bg);color:var(--tx)}
h1,h2,h3{font-family:var(--head);font-weight:700;letter-spacing:.2px;line-height:1.2}
a{color:var(--pri)}
@media(prefers-color-scheme:dark){a{color:var(--blue)}}
/* Wordmark: AUTOMATIONBOT + blue X */
.brand{font:700 20px/1 var(--font);letter-spacing:.5px;color:#fff;text-decoration:none;white-space:nowrap;font-style:italic}
.brand b{color:var(--blue);font-size:1.25em;font-style:italic}
.topbar{display:flex;gap:14px;align-items:center;padding:12px 20px;background:var(--navy);color:#fff;flex-wrap:wrap}
.topbar a{color:#fff;text-decoration:none;font-weight:500}
.topbar a:hover{text-decoration:underline}
.topbar .sp{flex:1}
@media(max-width:640px){.topbar{padding:10px 14px;gap:8px}.topbar .hide-sm{display:none}.topbar .brand{flex:1}.topbar .sp{display:none}}
.btn{display:inline-block;border:1px solid var(--bd);background:var(--card);color:var(--tx);padding:8px 14px;border-radius:4px;cursor:pointer;font:500 15px var(--font);text-decoration:none}
.btn.pri{background:var(--navy);color:#fff;border-color:var(--navy)}
@media(prefers-color-scheme:dark){.btn.pri{background:var(--pri);border-color:var(--pri)}}
.btn.light{background:#fff;color:var(--navy);border-color:#fff;border-radius:24px;padding:10px 22px;font-weight:600}
.btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.band{background:var(--navy);color:#fff}
.band h2,.band h3{color:#fff}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
footer.site{background:var(--ink);color:#cbd5e1;padding:26px 20px;font-size:.9rem;text-align:center}
footer.site a{color:#fff;margin:0 8px}
.draft{background:#fff4d6;border:1px solid #e0b84a;color:#5b4610;padding:10px 14px;border-radius:6px;font-size:.92rem}
@media(prefers-color-scheme:dark){.draft{background:#3a3114;border-color:#7a6620;color:#f3e3b5}}

/* BotX logo (inline SVG). On dark bars: bright blue mark, white "Bot" and outlined X; on light cards: brand blue + grey. */
.logo{height:34px;width:auto;display:block;overflow:visible}
.logo .lm{fill:var(--logo-blue)}
.logo .lt{fill:var(--logo-text);font-family:var(--font);font-weight:700}
.logo .lx path{fill:var(--logo-x-fill);stroke:var(--logo-x-line);stroke-width:7;stroke-linejoin:round}
:root{--logo-blue:#1550b0;--logo-text:#5f6064;--logo-x-fill:#fff;--logo-x-line:#9aa0a6}
.topbar,.band,.hero,footer.site{--logo-blue:#3d8bff;--logo-text:#fff;--logo-x-fill:transparent;--logo-x-line:#fff}
@media(prefers-color-scheme:dark){:root{--logo-blue:#3d8bff;--logo-text:#e6ebf2;--logo-x-fill:transparent;--logo-x-line:#e6ebf2}}
.brand .logo{height:30px}
.brand small{display:block;font:600 10px var(--font);letter-spacing:2.5px;color:#cfe0f5;font-style:normal;margin-top:3px;text-transform:uppercase}
@media(max-width:640px){.brand .logo{height:24px}}