/* =====================================================================
   StandardVentures — Core tokens (colors + type)

   StandardVentures is a commercial-side sibling to StandardData, Inc.
   The two brands share Futura and a single gold accent and nothing else.
   StandardVentures is warmer, riskier, more ornate: pinkish-ivory paper,
   Aggie maroon as the primary, terracotta + oxblood + a single deep
   teal as supports, gold as the inherited hairline accent only.

   Type signature: Futura Light Italic (300i) set against Futura Heavy
   Upright (800) in the SAME line. That tension is the brand move.
   ===================================================================== */

/* -------------------------------------------------- */
/*  TYPE — Futura Std (licensed, shipped in /fonts/)  */
/*  Lato kept as the body face — the StandardData     */
/*  thread continues here.                            */
/* -------------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&family=JetBrains+Mono:wght@400;500&display=swap");

@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdLight.otf")            format("opentype"); font-weight: 300; font-style: normal;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdLightOblique.otf")     format("opentype"); font-weight: 300; font-style: italic;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdBook.otf")             format("opentype"); font-weight: 400; font-style: normal;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdBookOblique.otf")      format("opentype"); font-weight: 400; font-style: italic;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdMedium.otf")           format("opentype"); font-weight: 500; font-style: normal;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdMediumOblique.otf")    format("opentype"); font-weight: 500; font-style: italic;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdBold.otf")             format("opentype"); font-weight: 700; font-style: normal;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdBoldOblique.otf")      format("opentype"); font-weight: 700; font-style: italic;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdHeavy.otf")            format("opentype"); font-weight: 800; font-style: normal;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdHeavyOblique.otf")     format("opentype"); font-weight: 800; font-style: italic;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdExtraBold.otf")        format("opentype"); font-weight: 900; font-style: normal;  font-display: swap; }
@font-face { font-family: "Futura Std"; src: url("fonts/FuturaStdExtraBoldOblique.otf") format("opentype"); font-weight: 900; font-style: italic;  font-display: swap; }

@font-face { font-family: "Futura Std Condensed"; src: url("fonts/FuturaStdCondensedLight.otf")    format("opentype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Futura Std Condensed"; src: url("fonts/FuturaStdCondensed.otf")        format("opentype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Futura Std Condensed"; src: url("fonts/FuturaStdCondensedBold.otf")    format("opentype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Futura Std Condensed"; src: url("fonts/FuturaStdCondensedExtraBd.otf") format("opentype"); font-weight: 800; font-style: normal; font-display: swap; }

:root {
  /* ============ COLOR — PRIMARY ============ */
  /* Aggie maroon, the principal brand color.       */
  --sv-maroon:        #500000;
  /* Pinkish-ivory paper, the principal light surface.
     Aged-fresco pink — noticeable warmth without saturation. */
  --sv-ivory:         #F6E3D5;
  /* The inherited gold from StandardData — used SPARINGLY.
     Hairlines, eyebrows, key punctuation, micro-rules. Never fill. */
  --sv-gold:          #A68542;

  /* ============ COLOR — MAROON SCALE ============ */
  /* Anchored on Aggie #500000 at the 700 step. The 50/100
     are workable as soft fills on ivory pages.        */
  --sv-maroon-50:     #FBEAE6;
  --sv-maroon-100:    #F4CFC7;
  --sv-maroon-200:    #E4A096;
  --sv-maroon-300:    #C56B5F;
  --sv-maroon-400:    #9B3F36;
  --sv-maroon-500:    #74211B;
  --sv-maroon-600:    #5E1310;
  --sv-maroon-700:    #500000;  /* = --sv-maroon, Aggie  */
  --sv-maroon-800:    #380000;
  --sv-maroon-900:    #200405;

  /* ============ COLOR — IVORY SCALE ============ */
  /* Pinkish paper, run lighter and darker.            */
  --sv-ivory-50:      #FCF1E8;
  --sv-ivory-100:     #F6E3D5;  /* = --sv-ivory          */
  --sv-ivory-200:     #EDD3C2;
  --sv-ivory-300:     #DDBEA9;
  --sv-ivory-400:     #C29A85;
  --sv-ivory-500:     #9C7460;

  /* ============ COLOR — GOLD SCALE ============ */
  /* Held identical to StandardData. This is the bridge. */
  --sv-gold-100:      #F4EBD6;
  --sv-gold-200:      #E3CE9A;
  --sv-gold-300:      #CDAD6A;
  --sv-gold-400:      #B89554;
  --sv-gold-500:      #A68542;  /* = --sv-gold            */
  --sv-gold-600:      #8A6D35;
  --sv-gold-700:      #6E5628;
  --sv-gold-800:      #4F3E1C;

  /* ============ COLOR — SECONDARY (Warm Renaissance, tight) ============ */
  /* Used sparingly and intentionally. Never two in the same composition. */
  --sv-terracotta:    #B85C3F;   /* warm clay — secondary accent           */
  --sv-oxblood:       #3F1414;   /* deepest depth — darker than maroon     */
  --sv-parchment:     #EAD7B7;   /* antique ivory — for callouts on ivory  */
  --sv-verdigris:     #2E544D;   /* one cool counterpoint — rare           */
  --sv-ink:           #1A0F0C;   /* near-black with warm undertone         */

  /* ============ NEUTRAL — WARM ============ */
  --sv-bone-50:       #F8F1EA;
  --sv-bone-100:      #EFE5DB;
  --sv-bone-200:      #DCCBBC;
  --sv-bone-300:      #B8A18C;
  --sv-bone-400:      #806A57;
  --sv-bone-500:      #4D3E33;
  --sv-bone-600:      #322821;
  --sv-bone-700:      #221A16;

  /* ============ SEMANTIC ============ */
  --sv-fg-1:          var(--sv-ink);              /* primary text on light    */
  --sv-fg-2:          var(--sv-bone-500);         /* secondary text on light  */
  --sv-fg-3:          var(--sv-bone-400);         /* muted text on light      */
  --sv-fg-on-maroon:  var(--sv-ivory);            /* text on maroon surface   */
  --sv-fg-on-ivory:   var(--sv-ink);
  --sv-fg-on-gold:    var(--sv-ink);

  --sv-bg-page:       var(--sv-ivory);            /* default LIGHT surface    */
  --sv-bg-page-deep:  var(--sv-maroon-700);       /* default DARK surface     */
  --sv-bg-surface:    #FCF1E8;                    /* card paper, lighter than page */
  --sv-bg-sunken:     var(--sv-ivory-200);
  --sv-bg-inverse:    var(--sv-maroon-800);

  --sv-accent:        var(--sv-maroon);
  --sv-accent-hover:  var(--sv-maroon-600);
  --sv-accent-soft:   var(--sv-maroon-100);

  --sv-thread:        var(--sv-gold);             /* the inherited gold       */

  --sv-border:        #E8CFBC;                    /* hairline on ivory        */
  --sv-border-strong: var(--sv-ivory-300);
  --sv-border-on-dark:rgba(234,215,183,0.18);     /* parchment-tinted on dark */
  --sv-divider:       rgba(26,15,12,0.10);

  --sv-success:       var(--sv-verdigris);
  --sv-info:          #5B7A9E;                    /* slate blue, used rarely  */
  --sv-warning:       var(--sv-terracotta);
  --sv-danger:        #8A1A1A;

  /* ============ TYPE FAMILIES ============ */
  --sv-font-display:           "Futura Std", "Futura", "Futura PT", "ITC Avant Garde", "Century Gothic", sans-serif;
  --sv-font-display-condensed: "Futura Std Condensed", "Futura Std", "Futura", sans-serif;
  --sv-font-body:              "Lato", "Helvetica Neue", Arial, sans-serif;
  --sv-font-mono:              "JetBrains Mono", "SF Mono", ui-monospace, Menlo, monospace;

  /* ============ TYPE SCALE (modular ~1.25) ============ */
  --sv-text-xs:   12px;
  --sv-text-sm:   14px;
  --sv-text-md:   16px;
  --sv-text-lg:   18px;
  --sv-text-xl:   22px;
  --sv-text-2xl:  28px;
  --sv-text-3xl:  36px;
  --sv-text-4xl:  48px;
  --sv-text-5xl:  64px;
  --sv-text-6xl:  88px;
  --sv-text-7xl:  120px;

  /* ============ WEIGHT ============ */
  --sv-w-light:    300;   /* the whisper half of the tension       */
  --sv-w-book:     400;
  --sv-w-medium:   500;
  --sv-w-bold:     700;
  --sv-w-heavy:    800;   /* the shout half of the tension         */
  --sv-w-xbold:    900;

  /* ============ LEADING / TRACKING ============ */
  --sv-lh-tight:   1.02;
  --sv-lh-snug:    1.15;
  --sv-lh-normal:  1.5;
  --sv-lh-loose:   1.7;

  --sv-tr-tighter: -0.03em;
  --sv-tr-tight:   -0.02em;
  --sv-tr-normal:   0;
  --sv-tr-wide:     0.06em;
  --sv-tr-wider:    0.14em;
  --sv-tr-eyebrow:  0.24em;

  /* ============ SPACING (8pt grid) ============ */
  --sv-s-1:  4px;
  --sv-s-2:  8px;
  --sv-s-3:  12px;
  --sv-s-4:  16px;
  --sv-s-5:  24px;
  --sv-s-6:  32px;
  --sv-s-7:  48px;
  --sv-s-8:  64px;
  --sv-s-9:  96px;
  --sv-s-10: 128px;
  --sv-s-11: 160px;

  /* ============ RADII ============ */
  /* Architectural still — slightly softer than StandardData's 2-6px,
     because StandardVentures dresses warmer. Not pillowy.            */
  --sv-r-none: 0;
  --sv-r-xs:   3px;
  --sv-r-sm:   6px;
  --sv-r-md:   10px;
  --sv-r-lg:   14px;
  --sv-r-pill: 999px;

  /* ============ ELEVATION ============ */
  /* Warmer shadows: a hint of maroon in the umbra.                  */
  --sv-shadow-xs:    0 1px 2px  rgba(80, 0, 0, 0.06);
  --sv-shadow-sm:    0 2px 6px  rgba(80, 0, 0, 0.08), 0 1px 2px rgba(80,0,0,0.05);
  --sv-shadow-md:    0 10px 22px rgba(80, 0, 0, 0.10), 0 2px 6px rgba(80,0,0,0.06);
  --sv-shadow-lg:    0 28px 52px rgba(80, 0, 0, 0.16), 0 8px 18px rgba(80,0,0,0.08);
  --sv-shadow-inset: inset 0 0 0 1px rgba(80,0,0,0.08);

  /* ============ MOTION ============ */
  /* Same easing tokens as StandardData — these are the shared bones. */
  --sv-ease-standard: cubic-bezier(.2,.6,.2,1);
  --sv-ease-emph:     cubic-bezier(.16,1,.3,1);
  --sv-dur-fast:   140ms;
  --sv-dur-base:   220ms;
  --sv-dur-slow:   420ms;
}

/* -------------------------------------------------- */
/*  Surface helpers                                   */
/* -------------------------------------------------- */
.sv-surface-light {
  background: var(--sv-bg-page);
  color: var(--sv-fg-1);
}
.sv-surface-dark {
  background: var(--sv-bg-page-deep);
  color: var(--sv-fg-on-maroon);
}
.sv-surface-dark .sv-h1,
.sv-surface-dark .sv-h2,
.sv-surface-dark .sv-h3,
.sv-surface-dark .sv-h4,
.sv-surface-dark .sv-display { color: var(--sv-ivory); }

/* -------------------------------------------------- */
/*  Semantic element styles                           */
/* -------------------------------------------------- */
.sv-display, .sv-h1, .sv-h2, .sv-h3, .sv-h4, .sv-h5,
.sv-eyebrow, .sv-button {
  font-family: var(--sv-font-display);
}

/* Display + Headings use the LIGHT default — heavier slots are
   provided by the .sv-shout helper for the signature tension.    */
.sv-display {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-light);
  font-size: clamp(64px, 8vw, var(--sv-text-7xl));
  line-height: var(--sv-lh-tight);
  letter-spacing: var(--sv-tr-tighter);
  color: var(--sv-fg-1);
}
.sv-h1 {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-light);
  font-size: var(--sv-text-5xl);
  line-height: var(--sv-lh-tight);
  letter-spacing: var(--sv-tr-tight);
  color: var(--sv-fg-1);
}
.sv-h2 {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-light);
  font-size: var(--sv-text-4xl);
  line-height: var(--sv-lh-snug);
  letter-spacing: var(--sv-tr-tight);
  color: var(--sv-fg-1);
}
.sv-h3 {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-medium);
  font-size: var(--sv-text-3xl);
  line-height: var(--sv-lh-snug);
  color: var(--sv-fg-1);
}
.sv-h4 {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-medium);
  font-size: var(--sv-text-2xl);
  line-height: var(--sv-lh-snug);
  color: var(--sv-fg-1);
}
.sv-h5 {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-medium);
  font-size: var(--sv-text-xl);
  line-height: var(--sv-lh-snug);
  color: var(--sv-fg-1);
}

/* The signature move: pair a light-italic phrase with a heavy upright
   payoff. Apply .sv-whisper to the light side, .sv-shout to the heavy
   side, within any .sv-display / .sv-h1 / .sv-h2 line.                */
.sv-whisper { font-weight: var(--sv-w-light); font-style: italic; }
.sv-shout   { font-weight: var(--sv-w-heavy); font-style: normal; letter-spacing: -0.025em; }

/* Eyebrow — a thin gold rule + tracked caps. */
.sv-eyebrow {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-bold);
  font-size: var(--sv-text-xs);
  letter-spacing: var(--sv-tr-eyebrow);
  text-transform: uppercase;
  color: var(--sv-gold);
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.sv-eyebrow::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--sv-gold);
}

/* Drop cap — a tasteful Renaissance flourish. */
.sv-dropcap::first-letter {
  font-family: var(--sv-font-display);
  font-weight: var(--sv-w-heavy);
  font-size: 4.2em;
  line-height: 0.86;
  float: left;
  margin: 0.06em 0.12em 0 -0.04em;
  color: var(--sv-maroon);
}

.sv-lede,
.sv-p {
  font-family: var(--sv-font-body);
  font-weight: var(--sv-w-book);
  color: var(--sv-fg-1);
}
.sv-lede {
  font-size: var(--sv-text-xl);
  line-height: var(--sv-lh-loose);
  color: var(--sv-fg-2);
}
.sv-p {
  font-size: var(--sv-text-md);
  line-height: var(--sv-lh-loose);
}
.sv-p-sm {
  font-family: var(--sv-font-body);
  font-size: var(--sv-text-sm);
  line-height: var(--sv-lh-normal);
  color: var(--sv-fg-2);
}

.sv-caption {
  font-family: var(--sv-font-body);
  font-size: var(--sv-text-xs);
  letter-spacing: var(--sv-tr-wide);
  text-transform: uppercase;
  color: var(--sv-fg-3);
}

.sv-mono {
  font-family: var(--sv-font-mono);
  font-size: var(--sv-text-sm);
  color: var(--sv-fg-1);
}

.sv-link {
  color: var(--sv-maroon);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  transition: color var(--sv-dur-fast) var(--sv-ease-standard);
}
.sv-link:hover { color: var(--sv-maroon-500); }

/* The brand's ornamental rule: a thin gold hairline with a tiny diamond at center.
   One per section, maximum. */
.sv-rule {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--sv-gold);
}
.sv-rule::before,
.sv-rule::after {
  content: "";
  flex: 1;
  height: 1px;
  background: currentColor;
  opacity: 0.55;
}
.sv-rule .sv-rule-mark {
  width: 6px; height: 6px;
  background: currentColor;
  transform: rotate(45deg);
}
