/* ============================================================
   BIGWOOD VENTURES — COLOR & TYPE FOUNDATIONS
   Frontier Finders. Builders who happen to have a fund.
   ============================================================ */

/* ---------- FONTS ---------- */

@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-Roman.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-RomanItalic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Neue Haas Display";
  src: url("./fonts/NeueHaasDisplay-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Monument Grotesk";
  src: url("./fonts/MonumentGrotesk-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("./fonts/MonumentGrotesk-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("./fonts/MonumentGrotesk-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("./fonts/MonumentGrotesk-MediumItalic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("./fonts/MonumentGrotesk-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk Mono";
  src: url("./fonts/MonumentGrotesk-Mono.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk Semi-Mono";
  src: url("./fonts/MonumentGrotesk-Semi-Mono.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter Tight";
  src: url("./fonts/InterTight.ttf") format("truetype-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter Tight";
  src: url("./fonts/InterTight-Italic.ttf") format("truetype-variations");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

/* ---------- COLOR PRIMITIVES ---------- */
:root {
  /* Ink — warm near-black. The primary brand ground. */
  --ink-1000: #0B0B0A;        /* deepest ink, hero backgrounds */
  --ink-900:  #141413;        /* default ink */
  --ink-800:  #1F1E1C;        /* raised surface on ink */
  --ink-700:  #2C2A27;        /* borders / dividers on ink */
  --ink-500:  #6B6660;        /* muted text on ink */
  --ink-300:  #A8A39B;        /* low-emphasis text on ink */

  /* Bone — warm cream paper. The default light ground. */
  --bone-50:  #FAF7F0;        /* page background */
  --bone-100: #F2EEE5;        /* default bone */
  --bone-200: #E8E2D4;        /* raised surface on bone */
  --bone-300: #D6CFBE;        /* borders / dividers on bone */
  --bone-400: #B8B0A0;        /* low-emphasis */

  /* Forest — deep evergreen. Signals depth, roots, the long game. */
  --forest-900: #0F2A1E;
  --forest-800: #173527;
  --forest-700: #1F4231;
  --forest-600: #2A553F;
  --forest-500: #3A6B52;      /* primary forest */
  --forest-300: #7FA08C;
  --forest-100: #DCE6DF;

  /* Bark — warm umber. Earth, roots, gritty edge. */
  --bark-900:  #2A1D11;
  --bark-700:  #4E3621;
  --bark-500:  #74532F;       /* primary bark */
  --bark-300:  #B59475;
  --bark-100:  #ECDDC9;

  /* Spark — high-voltage signal yellow. From the lightning in the mark. */
  --spark-500: #F0D43A;       /* primary signal */
  --spark-400: #F7E26B;
  --spark-700: #B89C1E;
  --spark-100: #FBF2C3;

  /* Sap — fresh growth green. Use sparingly. */
  --sap-500: #7FB069;
  --sap-700: #4F8A3C;

  /* Semantic */
  --success: var(--sap-500);
  --warning: var(--spark-500);
  --danger:  #C04A2B;         /* clay red */
  --info:    var(--forest-500);
}

/* ---------- SEMANTIC SURFACE VARS ---------- */
/* Default theme = bone (light). Override on .theme-ink for dark surfaces. */
:root {
  --bg:        var(--bone-100);
  --bg-page:   var(--bone-50);
  --bg-raised: var(--bone-200);
  --bg-sunken: var(--bone-200);
  --bg-invert: var(--ink-900);

  --fg:        var(--ink-900);     /* primary text */
  --fg-muted:  var(--ink-500);     /* secondary text */
  --fg-faint:  var(--bone-400);    /* tertiary / placeholder */
  --fg-invert: var(--bone-100);

  --border:        var(--bone-300);
  --border-strong: var(--ink-900);
  --border-faint:  var(--bone-200);

  --accent:        var(--forest-500);
  --accent-fg:     var(--bone-50);
  --signal:        var(--spark-500);
  --signal-fg:     var(--ink-1000);

  --link:          var(--ink-900);
  --link-hover:    var(--forest-500);

  --focus-ring:    var(--spark-500);

  /* Elevation */
  --shadow-0: none;
  --shadow-1: 0 1px 0 0 rgba(20, 20, 19, 0.06), 0 1px 2px 0 rgba(20, 20, 19, 0.04);
  --shadow-2: 0 2px 0 0 rgba(20, 20, 19, 0.08), 0 4px 16px -4px rgba(20, 20, 19, 0.08);
  --shadow-3: 0 4px 0 0 var(--ink-900);  /* "stamped" hard shadow */
  --shadow-press: 0 1px 0 0 var(--ink-900);

  /* Radii — restrained. Bigwood is squared-up and grounded. */
  --r-0: 0px;
  --r-1: 2px;
  --r-2: 4px;
  --r-3: 8px;
  --r-pill: 999px;

  /* Spacing scale (4px base) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* Layout */
  --container: 1280px;
  --container-narrow: 880px;

  /* Type families */
  --font-display: "Neue Haas Display", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-body:    "Monument Grotesk", "Inter Tight", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono:    "Monument Grotesk Mono", "JetBrains Mono", "Menlo", monospace;
  --font-semi-mono: "Monument Grotesk Semi-Mono", "Monument Grotesk", sans-serif;
}

/* Dark / ink theme — apply to any container */
.theme-ink {
  --bg:        var(--ink-900);
  --bg-page:   var(--ink-1000);
  --bg-raised: var(--ink-800);
  --bg-sunken: var(--ink-1000);
  --bg-invert: var(--bone-100);

  --fg:        var(--bone-100);
  --fg-muted:  var(--ink-300);
  --fg-faint:  var(--ink-500);
  --fg-invert: var(--ink-900);

  --border:        var(--ink-700);
  --border-strong: var(--bone-100);
  --border-faint:  var(--ink-800);

  --link:          var(--bone-100);
  --link-hover:    var(--spark-500);

  --shadow-1: 0 1px 0 0 rgba(0,0,0,0.4), 0 1px 2px 0 rgba(0,0,0,0.3);
  --shadow-2: 0 2px 0 0 rgba(0,0,0,0.5), 0 4px 16px -4px rgba(0,0,0,0.5);
  --shadow-3: 0 4px 0 0 var(--bone-100);
  --shadow-press: 0 1px 0 0 var(--bone-100);
}

.theme-forest {
  --bg:        var(--forest-800);
  --bg-page:   var(--forest-900);
  --bg-raised: var(--forest-700);
  --fg:        var(--bone-100);
  --fg-muted:  var(--forest-300);
  --border:    var(--forest-700);
  --border-strong: var(--bone-100);
  --link-hover: var(--spark-500);
}

/* ---------- TYPE SCALE ---------- */
/* Bigwood type is DECLARATIVE. Big, bold, tight tracking on display.
   Body in Monument Grotesk — neutral, technical, no-nonsense. */

:root {
  /* Display — pitch-deck and hero scale */
  --t-display-1: 700 clamp(64px, 9vw, 144px) / 0.9 var(--font-display);
  --t-display-2: 700 clamp(48px, 6vw, 96px) / 0.92 var(--font-display);

  /* Headings */
  --t-h1: 700 56px/1.0 var(--font-display);
  --t-h2: 700 40px/1.05 var(--font-display);
  --t-h3: 600 28px/1.15 var(--font-display);
  --t-h4: 600 20px/1.25 var(--font-display);
  --t-h5: 500 16px/1.3 var(--font-display);

  /* Body */
  --t-body-lg: 400 19px/1.5 var(--font-body);
  --t-body:    400 16px/1.55 var(--font-body);
  --t-body-sm: 400 14px/1.5 var(--font-body);
  --t-caption: 400 12px/1.4 var(--font-body);

  /* Eyebrow / overline — semi-mono, uppercase, tight */
  --t-eyebrow: 500 12px/1 var(--font-semi-mono);

  /* Mono — for tickers, code, numerics, citations */
  --t-mono:    400 14px/1.5 var(--font-mono);
  --t-mono-sm: 400 12px/1.4 var(--font-mono);
}

/* ---------- SEMANTIC ELEMENT STYLES ---------- */
.bw-display-1 { font: var(--t-display-1); letter-spacing: -0.025em; color: var(--fg); }
.bw-display-2 { font: var(--t-display-2); letter-spacing: -0.025em; color: var(--fg); }
.bw-h1 { font: var(--t-h1); letter-spacing: -0.02em; color: var(--fg); }
.bw-h2 { font: var(--t-h2); letter-spacing: -0.02em; color: var(--fg); }
.bw-h3 { font: var(--t-h3); letter-spacing: -0.015em; color: var(--fg); }
.bw-h4 { font: var(--t-h4); letter-spacing: -0.01em; color: var(--fg); }
.bw-h5 { font: var(--t-h5); letter-spacing: 0; color: var(--fg); }
.bw-body-lg { font: var(--t-body-lg); color: var(--fg); }
.bw-body { font: var(--t-body); color: var(--fg); }
.bw-body-sm { font: var(--t-body-sm); color: var(--fg-muted); }
.bw-caption { font: var(--t-caption); color: var(--fg-muted); }
.bw-eyebrow {
  font: var(--t-eyebrow);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fg-muted);
}
.bw-mono { font: var(--t-mono); color: var(--fg); }
.bw-mono-sm { font: var(--t-mono-sm); color: var(--fg-muted); }

/* "Manifesto italic" — Neue Haas Black Italic.
   Bigwood's signature flourish. Used for taglines & punchy emphasis. */
.bw-manifesto {
  font-family: var(--font-display);
  font-weight: 900;
  font-style: italic;
  letter-spacing: -0.03em;
  line-height: 0.92;
}

/* Tabular figures for any numeric callout */
.bw-tabular { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }