/* site.css — aaron-ross.co look (sits on top of base.css) */
:root {
  --bg: #0c070a;
  --text: #ffffff;
  --text-soft: rgba(255, 255, 255, .82);
  --brand: #5a26f0;
  --brand-2: #8a5bf2;
  --line: rgba(255, 255, 255, .18);
  --card: rgba(255, 255, 255, .05);
  --field-line: rgba(255, 255, 255, .0);
  --focus: #a98cff;
  --ok: #6ee7a8;
  --error: #ffb4a8;
  --font-head: Montserrat, Arial, sans-serif;
  --font-body: Inter, Arial, Helvetica, sans-serif;
  --radius: 14px;
}

body {
  background: linear-gradient(to bottom, #2a1a8f 0%, #20106a 16%, #1a0d2e 42%, #0c070a 100%);
  background-color: var(--bg);
}

/* Hero */
.hero { text-align: center; padding: 56px 16px 24px; }
.kicker { font-family: var(--font-head); font-weight: 400; font-size: clamp(24px, 5vw, 40px); line-height: 1.3; }
.kicker strong { font-weight: 700; }
.hero h1 { margin-top: 28px; font-weight: 200; font-size: clamp(25px, 5vw, 44px); color: var(--text-soft); }
.hero h1 em { font-style: normal; font-weight: 400; color: var(--text); }

.step {
  font-family: var(--font-head); font-weight: 800; font-style: italic;
  font-size: 20px; text-align: center; margin: 32px 0 16px;
}

.video { border: 5px solid var(--brand); box-shadow: 0 0 40px rgba(90, 38, 240, .35); }

.big { font-weight: 800; font-size: clamp(23px, 4.5vw, 34px); text-align: center; margin-bottom: 26px; }
.sub { font-weight: 700; font-size: clamp(20px, 3.6vw, 26px); text-align: center; margin-bottom: 18px; }
.pull { font-family: var(--font-head); font-weight: 700; color: var(--text); font-size: 21px; text-align: center; margin: 1.4em 0; }
.small { color: var(--text-soft); }
.small a, .card .alt, footer a { color: #c9b8ff; }

/* Hub homepage */
.wrap.wide { max-width: 1040px; }
.hero h1.hi { margin-top: 8px; font-weight: 400; font-size: clamp(32px, 6vw, 52px); color: var(--text); }
.lede { max-width: 640px; margin: 18px auto 0; font-size: clamp(17px, 2.4vw, 20px); line-height: 1.6; }
.lede em { font-style: italic; color: var(--text); }
.card { background: rgba(255, 255, 255, .06); }
.card:hover { border-color: rgba(169, 140, 255, .5); }
.nav { position: relative; z-index: 2; }