/* ===========================================================================
   Archimedes Funding — Colors & Type
   Source: ArchimedesFunding_BrandGuide_2026-04.pdf
   =========================================================================== */

/* ------------------------------------------------------------------ FONTS */
/* Brand fonts:
     Broadway Flat      -> fonts/BroadwayFlat-Regular.ttf     (logo/display)
     Broadway Flat 3D   -> fonts/BroadwayFlat3D-Regular.ttf   (primary display)
   Body font Myriad Pro is licensed commercial; substituting Source Sans 3
   (Adobe's open-source sibling) until licensed files are provided.
   ------------------------------------------------------------------------ */
@font-face {
  font-family: "Broadway Flat";
  src: url("fonts/BroadwayFlat-Regular.ttf") format("truetype");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Broadway Flat 3D";
  src: url("fonts/BroadwayFlat3D-Regular.ttf") format("truetype");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("fonts/JetBrainsMono-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("fonts/JetBrainsMono-Medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("fonts/JetBrainsMono-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
/* Source Sans 3 — self-hosted variable font (weight axis 300–700), Adobe's open sibling to Myriad Pro */
@font-face {
  font-family: "Source Sans Pro";
  src: url("fonts/source-sans-3-latin-wght-normal.woff2") format("woff2");
  font-weight: 300 700; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "Source Sans Pro";
  src: url("fonts/source-sans-3-latin-wght-italic.woff2") format("woff2");
  font-weight: 300 700; font-style: italic; font-display: swap;
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "Source Sans Pro";
  src: url("fonts/source-sans-3-latin-ext-wght-normal.woff2") format("woff2");
  font-weight: 300 700; font-style: normal; font-display: swap;
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "Source Sans Pro";
  src: url("fonts/source-sans-3-latin-ext-wght-italic.woff2") format("woff2");
  font-weight: 300 700; font-style: italic; font-display: swap;
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root {
  /* ============================================================= COLORS */
  /* Primary — lead all hierarchy */
  --af-brown:       #421b00;   /* Primary Brown — primary text, frames, ink */
  --af-yellow:      #ffc248;   /* Primary Yellow — marquee fills, CTAs */
  --af-teal:        #00848e;   /* Primary Teal — accents, secondary action */

  /* Secondary — support + surface */
  --af-beige:       #fdf2c1;   /* Beige — warm page surface, block backgrounds */
  --af-orange:      #db3e00;   /* Orange — alerts, energy accents */
  --af-gray:        #494949;   /* Gray — body ink on light, muted UI */

  /* Tonal extensions (derived — not in brand guide, used for UI states) */
  --af-brown-800:   #2a1100;   /* hover / pressed ink */
  --af-brown-600:   #5c2a0d;
  --af-brown-400:   #7a4a2c;   /* muted ink */
  --af-brown-200:   #c9b5a4;   /* disabled / divider on beige */
  --af-yellow-600:  #e6a930;   /* yellow hover */
  --af-yellow-300:  #ffd680;
  --af-yellow-100:  #fff1cf;
  --af-teal-800:    #006068;
  --af-teal-200:    #a6d8dc;
  --af-cream:       #fff8e1;   /* lighter page surface */
  --af-ink:         #1a0800;   /* near-black ink, warmer than #000 */
  --af-paper:       #fdfaf0;   /* near-white paper */

  /* ========================================================== SEMANTIC */
  --fg-1:           var(--af-brown);    /* primary ink on light surfaces */
  --fg-2:           var(--af-gray);     /* secondary / body */
  --fg-3:           var(--af-brown-400);/* muted / captions */
  --fg-inverse:     var(--af-beige);    /* ink on dark surfaces */

  --bg-page:        var(--af-beige);    /* default warm page surface */
  --bg-paper:       var(--af-paper);    /* crisp paper */
  --bg-ink:         var(--af-brown);    /* dark surface */
  --bg-accent:      var(--af-yellow);   /* highlight surface */
  --bg-accent-2:    var(--af-teal);

  --brand-primary:  var(--af-brown);
  --brand-accent:   var(--af-yellow);
  --brand-support:  var(--af-teal);

  --border:         var(--af-brown);    /* default bold border */
  --border-soft:    var(--af-brown-200);

  --success:        #2f7a3d;
  --warning:        var(--af-orange);
  --danger:         var(--af-orange);
  --info:           var(--af-teal);

  /* ============================================================== TYPE */
  --font-display:   "Broadway Flat", "Alfa Slab One", "Ultra", Georgia, serif;
  --font-display-3d:"Broadway Flat 3D", "Broadway Flat", "Ultra", Georgia, serif;
  --font-body:      "Source Sans Pro", "Myriad Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono:      "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;

  /* Type scale — retro display sits LARGE; body stays modest */
  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-md:   18px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-3xl:  44px;
  --text-4xl:  60px;
  --text-5xl:  84px;
  --text-6xl:  120px;

  --lh-tight:  1.05;  /* @kind font */
  --lh-snug:   1.2;   /* @kind font */
  --lh-normal: 1.45;  /* @kind font */
  --lh-loose:  1.65;  /* @kind font */

  --tracking-tight:  -0.01em; /* @kind font */
  --tracking-normal: 0;       /* @kind font */
  --tracking-wide:   0.04em;  /* @kind font */
  --tracking-wider:  0.12em;  /* @kind font */  /* for small-caps labels */

  /* =========================================================== SPACING */
  --s-0:   0;   /* @kind spacing */
  --s-1:   4px;
  --s-2:   8px;
  --s-3:   12px;
  --s-4:   16px;
  --s-5:   20px;
  --s-6:   24px;
  --s-8:   32px;
  --s-10:  40px;
  --s-12:  48px;
  --s-16:  64px;
  --s-20:  80px;
  --s-24:  96px;
  --s-32:  128px;

  /* =========================================================== RADIUS */
  /* Retro, slightly soft. Full pill for capsule buttons. */
  --r-0:   0;   /* @kind radius */
  --r-sm:  4px;
  --r-md:  8px;
  --r-lg:  14px;
  --r-xl:  22px;
  --r-pill: 999px;

  /* ========================================================== BORDERS */
  /* Bold retro outlines — hairline is rarely used. */
  --bw-1: 1px;
  --bw-2: 2px;
  --bw-3: 3px;    /* standard card/button border */
  --bw-4: 4px;    /* emphasis */
  --bw-6: 6px;    /* marquee frames */

  /* =========================================================== SHADOW */
  /* Hard-offset "sticker" shadows — no blur. Very retro. */
  --shadow-xs:   2px 2px 0 0 var(--af-brown);
  --shadow-sm:   4px 4px 0 0 var(--af-brown);
  --shadow-md:   6px 6px 0 0 var(--af-brown);
  --shadow-lg:   10px 10px 0 0 var(--af-brown);
  --shadow-inset-sm: inset 0 -3px 0 0 rgba(66, 27, 0, 0.18);

  /* Optional soft fallback (use sparingly — the retro aesthetic prefers hard) */
  --shadow-soft: 0 10px 30px -10px rgba(66, 27, 0, 0.25);

  /* ========================================================== MOTION */
  --ease-out:     cubic-bezier(0.2, 0.7, 0.2, 1);    /* @kind other */
  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
  --dur-fast:     120ms;  /* @kind other */
  --dur-base:     200ms;  /* @kind other */
  --dur-slow:     360ms;  /* @kind other */

  /* =========================================================== LAYOUT */
  --container-sm:  640px;
  --container-md:  960px;
  --container-lg:  1200px;
  --container-xl:  1440px;
}

/* =============================================== ELEMENT-LEVEL DEFAULTS */
html, body {
  background: var(--bg-page);
  color: var(--fg-1);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--lh-normal);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  color: var(--fg-1);
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-tight);
  font-weight: 400; /* Alfa Slab One only has 400 */
  margin: 0;
  text-transform: uppercase;
}
h1 { font-size: var(--text-5xl); }
h2 { font-size: var(--text-3xl); }
h3 { font-size: var(--text-2xl); }
h4 { font-size: var(--text-xl); letter-spacing: var(--tracking-wide); }

p { margin: 0 0 var(--s-4); color: var(--fg-2); }

a {
  color: var(--af-teal);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 2px;
  transition: color var(--dur-fast) var(--ease-out);
}
a:hover { color: var(--af-teal-800); }

strong { color: var(--fg-1); font-weight: 700; }

code, pre { font-family: var(--font-mono); font-size: 0.92em; }

/* =================================== SEMANTIC COMPONENT-LEVEL HELPERS */

/* Display 3D — uses the real Broadway Flat 3D face.
   No layered shadow/stroke needed; the font carries the dimension. */
.display-3d {
  font-family: var(--font-display-3d);
  font-weight: 400;
  text-transform: uppercase;
  color: var(--af-yellow);
  letter-spacing: 0;
}

/* Eyebrow / kicker label */
.eyebrow {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tracking-wider);
  color: var(--af-teal);
}

/* Body lede */
.lede {
  font-family: var(--font-body);
  font-size: var(--text-lg);
  line-height: var(--lh-normal);
  color: var(--fg-2);
}