/* ============================================================
   ANGEL INVESTOR, brand kit tokens
   Canvas   : #0A0A0F (ink) · surfaces #12121A / #1A1A24
   Signature: gold gradient #FFC94D → #F59E0B (angel = gold, capital = gold)
   Accents  : startups #FFB224 · ai #38BDF8 · tech #4ADE80
   Type     : Space Grotesk (display) · Inter (body)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* LIGHT (default) */
  --ink: #FFFFFF;
  --surface: #F7F7F9;
  --surface-2: #ECECF1;
  --line: #E3E3EB;
  --line-hover: #C9C9D4;
  --header-bg: rgba(255,255,255,.86);
  --text: #121216;
  --text-2: #4B4B58;
  --text-3: #7E7E8C;
  --prose: #2A2A33;
  --gold: #D97706;
  --gold-2: #B45309;
  --grad: linear-gradient(100deg, #FFC94D 0%, #F59E0B 100%);
  --c-startups: #B45309;
  --c-ai: #0369A1;
  --c-tech: #047857;
  --font-display: 'Space Grotesk', -apple-system, sans-serif;
  --font-body: 'Inter', -apple-system, sans-serif;
}

:root[data-theme="dark"] {
  --ink: #0B0B0E;
  --surface: #15151A;
  --surface-2: #1F1F27;
  --line: #32323E;
  --line-hover: #4A4A58;
  --header-bg: rgba(10,10,15,.82);
  --text: #FFFFFF;
  --text-2: #C2C2CE;
  --text-3: #8A8A98;
  --prose: #E4E4EC;
  --gold: #FFB224;
  --gold-2: #F59E0B;
  --c-startups: #FFB224;
  --c-ai: #38BDF8;
  --c-tech: #4ADE80;
}

html { background: var(--ink); }
body { font-family: var(--font-body); background: var(--ink); color: var(--text); }
.hov-text:hover { color: var(--text) !important; }
.font-display { font-family: var(--font-display); }

/* signature gradient utilities */
.grad-text { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.grad-bg { background: var(--grad); color: #0B0B0E !important; font-weight: 700; }
.grad-border { border: 1px solid transparent; background:
  linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad) border-box; }

/* category pills */
.pill { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  padding: 3px 10px; border-radius: 999px; }
.pill-startups { color: var(--c-startups); background: rgba(255,178,36,.12); }
.pill-ai       { color: var(--c-ai);       background: rgba(56,189,248,.12); }
.pill-tech     { color: var(--c-tech);     background: rgba(74,222,128,.12); }

/* article card imagery fallback: per-category gradient covers */
.cover { aspect-ratio: 16/9; border-radius: 12px; overflow: hidden; position: relative; background: var(--surface-2); }
.cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cover-startups { background: radial-gradient(120% 120% at 20% 0%, rgba(255,178,36,.30), transparent 55%), var(--surface-2); }
.cover-ai       { background: radial-gradient(120% 120% at 80% 0%, rgba(56,189,248,.30), transparent 60%), var(--surface-2); }
.cover-tech     { background: radial-gradient(120% 120% at 50% 100%, rgba(74,222,128,.28), transparent 55%), var(--surface-2); }
.cover .mark { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: .25; }

/* prose for article bodies (bm.markdown output) */
.prose-ai { line-height: 1.75; color: var(--prose); font-size: 1.05rem; }
.prose-ai h2 { font-family: var(--font-display); font-size: 1.5rem; font-weight: 700; color: var(--text); margin: 2em 0 .6em; }
.prose-ai h3 { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; color: var(--text); margin: 1.6em 0 .5em; }
.prose-ai p { margin: 0 0 1.2em; }
.prose-ai a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.prose-ai ul, .prose-ai ol { margin: 0 0 1.2em 1.4em; }
.prose-ai li { margin-bottom: .4em; }
.prose-ai blockquote { border-left: 3px solid var(--gold); padding-left: 1em; color: var(--text-2); margin: 1.4em 0; font-style: italic; }
.prose-ai code { background: var(--surface-2); padding: 2px 6px; border-radius: 5px; font-size: .9em; }
.prose-ai strong { color: var(--text); }

/* micro-interactions */
.card-hover { transition: transform .18s ease, border-color .18s ease; }
.card-hover:hover { transform: translateY(-3px); border-color: var(--line-hover); }
@keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.fade-up { animation: fadeUp .5s ease both; }

::selection { background: rgba(255,178,36,.35); color: #0B0B0E; }
html { scroll-behavior: smooth; }

/* framework cookie banner: keep it inside small viewports + match the brand */
html, body { overflow-x: clip; }
#bm-cookie {
  max-width: min(380px, calc(100vw - 32px)) !important;
  background: var(--surface) !important;
  border-color: var(--line) !important;
  color: var(--text-2) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.18) !important;
}
#bm-cookie-accept {
  background: var(--grad) !important;
  color: #0B0B0E !important;
  border-color: transparent !important;
}
#bm-cookie-decline {
  background: transparent !important;
  color: var(--text-3) !important;
  border-color: var(--line) !important;
}