/* ===========================================================================
   Archimedes Funding — PROFESSIONAL / EDITORIAL theme
   A restrained counterpart to the loud marketing system. Same palette, toned
   down: beige-led surfaces, brown ink, gold + teal as quiet accents, hairline
   rules instead of sticker shadows. Built for investor communications,
   letterhead, and serious documents.

   Load AFTER colors_and_type.css — it reuses those base tokens.
   =========================================================================== */
@import url('colors_and_type.css');

:root {
  /* ---- Toned-down surface & ink (muted from the marketing brights) ---- */
  --pro-paper:      #fdfaf0;   /* primary surface — warm near-white */
  --pro-beige:      #f6ecc9;   /* signature panel — muted from #fdf2c1 */
  --pro-beige-deep: #ece0b6;   /* recessed panels, table zebra */
  --pro-ink:        #3a1800;   /* brown ink — slightly deeper for print */
  --pro-ink-soft:   #6b4a2e;   /* secondary text, captions */
  --pro-ink-faint:  #a99274;   /* metadata, disabled */

  /* ---- Accents — used sparingly, one dominant per surface ---- */
  --pro-gold:       #ffc248;   /* brand gold — thin rules, small marks only */
  --pro-gold-ink:   #b8811a;   /* legible gold for text/figures on light */
  --pro-teal:       #00707a;   /* deepened teal — links, labels, one accent */
  --pro-teal-faint: #d7e7e8;   /* teal wash for quiet panels */

  /* ---- Rules & hairlines (replace sticker shadows entirely) ---- */
  --pro-rule:       #3a1800;         /* 1px brown hairline */
  --pro-rule-soft:  #d8c9a8;         /* faint divider on beige */
  --pro-hair:       1px solid var(--pro-rule);
  --pro-hair-soft:  1px solid var(--pro-rule-soft);
  --pro-shadow:     0 1px 3px rgba(58, 24, 0, 0.10);  /* barely-there lift */

  /* ---- Type — display used sparingly; work set in Source Sans Pro ---- */
  --pro-font-display: var(--font-display);        /* Broadway Flat — covers/dividers */
  --pro-font-head:    "Source Sans Pro", var(--font-body);  /* working headings */
  --pro-font-body:    "Source Sans Pro", var(--font-body);

  --pro-tracking-label: 0.18em;   /* wide-tracked small caps for eyebrows */
}

/* ============================================= EDITORIAL ELEMENT HELPERS */

/* Restrained display — Broadway Flat, moderate, brown. Not everything shouts. */
.pro-display {
  font-family: var(--pro-font-display);
  color: var(--pro-ink);
  text-transform: uppercase;
  line-height: 1.02;
  letter-spacing: -0.005em;
  font-weight: 400;
}

/* Working heading — quiet, confident, Source Sans Pro semibold */
.pro-h {
  font-family: var(--pro-font-head);
  color: var(--pro-ink);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}

/* Wide-tracked small-caps label / eyebrow — teal or gold-ink */
.pro-label {
  font-family: var(--pro-font-body);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--pro-tracking-label);
  color: var(--pro-teal);
}
.pro-label--gold { color: var(--pro-gold-ink); }
.pro-label--ink  { color: var(--pro-ink-soft); }

/* Body copy — generous leading for reading */
.pro-body {
  font-family: var(--pro-font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--pro-ink-soft);
}

/* A thin gold rule — the one decorative flourish carried over from the brand */
.pro-rule-gold {
  border: 0;
  height: 3px;
  width: 56px;
  background: var(--pro-gold);
  margin: 0;
}

/* Figure / statistic — quiet, no card chrome; a hairline + label */
.pro-figure {
  font-family: var(--pro-font-display);
  color: var(--pro-ink);
  line-height: 0.95;
}
.pro-figure--gold { color: var(--pro-gold-ink); }
.pro-figure--teal { color: var(--pro-teal); }

/* Panel — beige block, hairline framed, no drop shadow */
.pro-panel {
  background: var(--pro-beige);
  border: var(--pro-hair);
  padding: 24px;
}
.pro-panel--paper { background: var(--pro-paper); }
.pro-panel--quiet { border: var(--pro-hair-soft); }

/* Link */
.pro-link {
  color: var(--pro-teal);
  text-decoration: none;
  border-bottom: 1px solid var(--pro-teal);
  padding-bottom: 1px;
}
.pro-link:hover { color: var(--pro-ink); border-color: var(--pro-ink); }