/* TrevorBart.com design system — shared stylesheet.
   Source of truth: claude.ai/design project f9e78f49 (tokens copied verbatim). */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
/* Blackout Green */
--green-1000:#000900;--green-950:#001000;--green-900:#02180a;--green-850:#06230c;--green-700:#003108;
/* Signal Red */
--red-700:#8f0006;--red-600:#b4000a;--red-500:#e80009;--red-400:#ff2b33;--red-300:#ff7a80;--red-100:#ffe5e6;
/* Money Gold */
--gold-700:#c98a00;--gold-600:#e09b00;--gold-500:#f5b301;--gold-400:#f7d046;--gold-300:#fbe38a;--gold-100:#fff6dc;
/* Neutrals (warmed green) */
--neutral-0:#ffffff;--neutral-25:#f7f9f6;--neutral-50:#eef1ec;--neutral-100:#e2e7e0;--neutral-200:#c9d1c6;--neutral-300:#a7b2a4;--neutral-400:#7e8a7c;--neutral-500:#5d6a5c;--neutral-600:#414c41;--neutral-700:#2b342b;--neutral-800:#1a211a;--neutral-900:#0f140f;
/* Semantics */
--success-500:#1fa84e;--success-100:#e3f7e9;--info-500:#2e7dd1;--info-100:#e6f0fb;
/* Aliases */
--brand:var(--red-500);--brand-hover:var(--red-400);--brand-press:var(--red-600);
--surface-page:var(--neutral-0);--surface-page-alt:var(--neutral-25);--surface-sunken:var(--neutral-50);--surface-inverse:var(--green-1000);--surface-inverse-card:#0a1a0dcc;
--text-heading:var(--neutral-900);--text-body:var(--neutral-700);--text-muted:var(--neutral-500);--text-subtle:var(--neutral-400);
--text-on-cta:#241a00;--text-inverse:#ffffff;--text-inverse-body:#c9d6c9;--text-inverse-muted:#8fa08f;
--border-subtle:var(--neutral-100);--border-default:var(--neutral-200);--border-inverse:#ffffff1f;
/* Gradients */
--gradient-cta:linear-gradient(180deg,var(--gold-400) 0%,var(--gold-500) 52%,var(--gold-600) 100%);
--gradient-stage:radial-gradient(120% 90% at 78% 22%,var(--green-700) 0%,var(--green-950) 46%,var(--green-1000) 100%);
/* Type */
--font-display:"Montserrat","Helvetica Neue",Arial,sans-serif;
--font-body:"Manrope","Helvetica Neue",Arial,sans-serif;
--font-condensed:"Oswald","Arial Narrow",Arial,sans-serif;
--font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
/* Elevation */
--shadow-sm:0 1px 3px #0f140f1f,0 1px 2px #0f140f0f;
--shadow-md:0 4px 14px #0f140f14,0 1px 3px #0f140f0f;
--shadow-lg:0 12px 32px #0f140f1a,0 2px 8px #0f140f0f;
--shadow-brand:0 8px 24px #e800091f;
--shadow-cta:0 10px 24px #f5b3013d,inset 0 1px 0 #fff6dc99;
--inset-field:inset 0 1px 2px #0f140f0f;
--ring-focus:0 0 0 3px #ff2b334d;
/* Radius */
--radius-control:8px;--radius-card:14px;--radius-media:20px;--radius-pill:999px;
/* Layout */
--container-md:840px;--container-lg:1080px;--container-xl:1240px;--gutter:24px;--nav-height:72px;
--ease:cubic-bezier(.2,.7,.3,1);
}

html{scroll-behavior:smooth}
body{font:400 16px/1.55 var(--font-body);background:var(--surface-page);color:var(--text-body)}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:var(--container-xl);margin:0 auto;padding:0 var(--gutter)}
.wrap-lg{max-width:var(--container-lg);margin:0 auto;padding:0 var(--gutter)}
.wrap-md{max-width:var(--container-md);margin:0 auto;padding:0 var(--gutter)}

/* ---- Type roles ---- */
h1,.h1{font:800 48px/1.14 var(--font-display);letter-spacing:-.03em;color:var(--text-heading)}
h2,.h2{font:800 38px/1.14 var(--font-display);letter-spacing:-.015em;color:var(--text-heading)}
h3,.h3{font:700 30px/1.2 var(--font-display);letter-spacing:-.015em;color:var(--text-heading)}
h4,.h4{font:700 20px/1.2 var(--font-display);letter-spacing:-.015em;color:var(--text-heading)}
.lead{font:400 18px/1.55 var(--font-body);color:var(--text-muted)}
.mono{font:400 12px/1.5 var(--font-mono);color:var(--text-subtle)}
.metric{font:600 15px/1.5 var(--font-mono)}
.accent{color:var(--red-500);font-style:normal}
.eyebrow{display:inline-block;font:700 12px/1.2 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--red-500);margin-bottom:16px}
.on-stage .eyebrow,.eyebrow.inverse{color:var(--red-400)}
@media(max-width:720px){h1,.h1{font-size:34px}h2,.h2{font-size:28px}h3,.h3{font-size:24px}}

/* ---- Surfaces ---- */
.stage{background:var(--gradient-stage);color:var(--text-inverse)}
.stage h1,.stage h2,.stage h3,.stage h4{color:var(--text-inverse)}
.stage p{color:var(--text-inverse-body)}
.band{background:var(--surface-page)}
.band-alt{background:var(--surface-page-alt)}
section{padding:96px 0}
section.tight{padding:64px 0}
.sec-head{text-align:center;max-width:680px;margin:0 auto 40px}
.sec-head p{margin-top:12px}

/* ---- Nav ---- */
.nav{position:sticky;top:0;z-index:50;height:var(--nav-height);background:#00090099;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border-inverse)}
.nav>.wrap{height:100%;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px;font:800 20px/1 var(--font-display);letter-spacing:-.03em;color:#fff}
.brand img{width:40px;height:40px;border-radius:50%;display:block}
.brand span{color:var(--red-500)}
.nav-links{display:flex;gap:28px;align-items:center}
.nav-links a{color:var(--text-inverse-body);font-size:14px;font-weight:600;padding:6px 0;transition:color 140ms var(--ease)}
.nav-links a:hover{color:#fff}
.nav-links a.active{color:#fff;box-shadow:inset 0 -2px 0 var(--red-500)}
@media(max-width:720px){.nav-links a:not(.btn){display:none}}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 14px/1 var(--font-body);border:none;border-radius:var(--radius-control);cursor:pointer;text-align:center;transition:background 140ms var(--ease),box-shadow 140ms var(--ease),transform 140ms var(--ease),filter 140ms var(--ease)}
.btn:active{transform:scale(.985);box-shadow:none}
.btn-primary{background:var(--brand);color:#fff;height:44px;padding:0 20px;box-shadow:var(--shadow-brand)}
.btn-primary:hover{background:var(--brand-hover)}
.btn-primary:active{background:var(--brand-press)}
.btn-secondary{background:transparent;color:var(--text-heading);height:44px;padding:0 20px;border:1px solid var(--border-default)}
.btn-secondary:hover{background:var(--surface-sunken)}
.stage .btn-secondary,.btn-secondary.inverse{color:#fff;border-color:#475569}
.stage .btn-secondary:hover,.btn-secondary.inverse:hover{background:transparent;border-color:#fff}
.btn-cta{background:var(--gradient-cta);color:var(--text-on-cta);font:700 20px/1 var(--font-condensed);text-transform:uppercase;letter-spacing:.06em;height:56px;padding:0 28px;border:2px solid var(--gold-700);border-radius:10px;box-shadow:var(--shadow-cta)}
.btn-cta:hover{filter:brightness(1.06)}
.btn-sm{height:34px;padding:0 14px;font-size:13px}
.btn-block{width:100%}

/* ---- Cards ---- */
.card{background:var(--neutral-0);border:1px solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-sm);padding:32px}
.card.sunken{background:var(--surface-sunken);box-shadow:none}
.card.accent{border:1px solid var(--red-500)}
.card.inverse{background:var(--gradient-stage);border:1px solid var(--border-inverse);box-shadow:inset 0 1px 0 #ffffff14;color:var(--text-inverse)}
.card.inverse h4,.card.inverse .h4{color:var(--text-inverse)}
.card.inverse p{color:var(--text-inverse-body)}
.card.lift{transition:transform 220ms var(--ease),box-shadow 220ms var(--ease)}
.card.lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}

/* ---- Badges & tags ---- */
.badge{display:inline-block;font:700 11px/1.2 var(--font-body);letter-spacing:.04em;text-transform:uppercase;color:var(--red-600);background:var(--red-100);border-radius:var(--radius-pill);padding:4px 12px}
.badge.gold{color:var(--text-on-cta);background:var(--gold-100)}
.badge.on-white{background:#fff;color:var(--red-600)}

/* ---- Forms ---- */
input,select,textarea{width:100%;height:46px;padding:0 14px;border:1px solid var(--border-default);border-radius:var(--radius-control);background:#fff;color:var(--text-heading);font:400 14px/1 var(--font-body);outline:none;box-shadow:var(--inset-field)}
textarea{height:auto;min-height:88px;padding:12px 14px;line-height:1.55;resize:vertical}
input:focus,select:focus,textarea:focus{box-shadow:var(--ring-focus)}
input::placeholder,textarea::placeholder{color:var(--text-subtle)}
label{display:block;font:700 13px/1.2 var(--font-body);color:var(--text-heading);margin-bottom:6px}
label .hint{font-weight:400;color:var(--text-subtle)}
label .req{color:var(--red-500)}
.card.inverse input{background:var(--surface-inverse-card);border-color:var(--border-inverse);color:#fff;box-shadow:inset 0 1px 0 #ffffff14}
.card.inverse input::placeholder{color:var(--text-inverse-muted)}
.form-note{font-size:12px;color:var(--text-subtle);text-align:center;margin-top:12px}
.card.inverse .form-note{color:var(--text-inverse-muted)}

/* ---- Checklist ---- */
.check{list-style:none}
.check li{padding:6px 0 6px 26px;position:relative;font-size:15px;color:var(--text-body)}
.check li::before{content:"\2713";position:absolute;left:0;color:var(--red-500);font-weight:800}
.card.inverse .check li{color:var(--text-inverse-body)}
.check.neg li::before{content:"\2715";color:var(--red-600)}

/* ---- Byline / avatar ---- */
.avatar-img{border-radius:50%;display:block}
.byline{display:flex;align-items:center;gap:12px}
.byline img{width:32px;height:32px;border-radius:50%}
.byline span{font-size:14px;color:var(--text-muted)}

/* ---- Tables ---- */
table{width:100%;border-collapse:collapse;font-size:14px;background:#fff;border:1px solid var(--border-subtle);border-radius:10px;overflow:hidden}
th{background:var(--surface-sunken);text-align:left;padding:10px 12px;font:700 11px/1.4 var(--font-body);text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}
td{padding:10px 12px;border-top:1px solid var(--border-subtle);color:var(--text-body)}
td b{color:var(--text-heading)}

/* ---- FAQ ---- */
.faq-item{background:#fff;border:1px solid var(--border-subtle);border-radius:10px;margin-bottom:10px}
.faq-q{padding:16px 18px;font:700 15px/1.4 var(--font-body);color:var(--text-heading);cursor:pointer;display:flex;justify-content:space-between;gap:12px}
.faq-a{display:none;padding:0 18px 16px;color:var(--text-body);font-size:14px}
.faq-a.open{display:block}

/* ---- Grids ---- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.split{display:grid;grid-template-columns:1.15fr 1fr;gap:44px;align-items:center}
.split-wide{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;align-items:start}
@media(max-width:900px){.grid-2,.grid-3,.grid-4,.split,.split-wide{grid-template-columns:1fr}}
@media(max-width:900px){.grid-4{grid-template-columns:1fr 1fr}}

/* ---- Footer ---- */
.footer{background:var(--gradient-stage);color:var(--text-inverse-muted);padding:48px 0}
.footer>.wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.footer .brand{font-size:17px}
.footer .brand img{width:32px;height:32px}
.footer nav{display:flex;gap:22px;flex-wrap:wrap}
.footer a{font-size:13px;color:var(--text-inverse-body);transition:color 140ms var(--ease)}
.footer a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.footer .fine{font-size:12px}

/* ---- Links in copy ---- */
.copy a{color:var(--red-600);font-weight:600}
.copy a:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}