/* ============================================================
   URBINO DESIGN TOKENS · TYPOGRAPHY LAYER
   Font setup + per-world typography presets.

   These rules consume semantic tokens (--u-h1-size, --u-text-base,
   --u-font-display, etc.) so they automatically pick up world
   overrides when wrapped in .urbino-mgr or .urbino-cit.

   See tokens/README.md for the architecture.
   ============================================================ */


/* ---------- WEBFONTS ---------- */
/* Plus Jakarta Sans — brand typeface (display + UI), uploaded.
   Variable weight 200–800 + variable italic. Full Latin Extended (HU ő ű etc).
   JetBrains Mono — codes, IDs, coordinates. */
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("../fonts/PlusJakartaSans-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("../fonts/PlusJakartaSans-Italic-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 200 800;
  font-style: italic;
  font-display: swap;
}
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap');


/* ============================================================
   MANAGER WORLD — typography presets
   Apply .urbino-mgr on a parent to opt in.
   ============================================================ */

.urbino-mgr {
  font-family: var(--u-font-sans);
  font-size: var(--u-text-base);
  line-height: var(--u-leading-normal);
  color: var(--u-fg-1);
  background: var(--u-bg);
  -webkit-font-smoothing: antialiased;
}

.urbino-mgr h1, .urbino-mgr .h1 {
  font-family: var(--u-font-display);
  font-size: var(--u-h1-size);
  font-weight: 700;
  line-height: var(--u-leading-tight);
  letter-spacing: var(--u-tracking-tight);
  color: var(--u-fg-1);
}
.urbino-mgr h2, .urbino-mgr .h2 {
  font-family: var(--u-font-display);
  font-size: var(--u-h2-size);
  font-weight: 700;
  line-height: var(--u-leading-snug);
  letter-spacing: var(--u-tracking-tight);
}
.urbino-mgr h3, .urbino-mgr .h3 {
  font-family: var(--u-font-sans);
  font-size: var(--u-h3-size);
  font-weight: 600;
  line-height: var(--u-leading-snug);
}
.urbino-mgr h4, .urbino-mgr .h4 {
  font-family: var(--u-font-sans);
  font-size: var(--u-h4-size);
  font-weight: 600;
}
.urbino-mgr .eyebrow {
  font-family: var(--u-font-sans);
  font-size: var(--u-text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--u-fg-3);
}
.urbino-mgr .label {
  font-size: var(--u-text-sm);
  font-weight: 500;
  color: var(--u-fg-2);
}
.urbino-mgr .caption { font-size: var(--u-text-xs); color: var(--u-fg-3); }
.urbino-mgr code, .urbino-mgr .mono {
  font-family: var(--u-font-mono);
  font-size: 0.92em;
  font-variant-numeric: tabular-nums;
}


/* ============================================================
   CITIZEN WORLD — typography presets
   Apply .urbino-cit on a parent to opt in.
   Slightly larger sizes, h3 uses display font for warmth.
   ============================================================ */

.urbino-cit {
  font-family: var(--u-font-sans);
  font-size: var(--u-text-base);
  line-height: var(--u-leading-normal);
  color: var(--u-fg-1);
  background: var(--u-bg);
  -webkit-font-smoothing: antialiased;
}

.urbino-cit h1, .urbino-cit .h1 {
  font-family: var(--u-font-display);
  font-size: var(--u-h1-size);
  font-weight: 700;
  line-height: var(--u-leading-tight);
  letter-spacing: var(--u-tracking-tight);
}
.urbino-cit h2, .urbino-cit .h2 {
  font-family: var(--u-font-display);
  font-size: var(--u-h2-size);
  font-weight: 700;
  line-height: var(--u-leading-tight);
  letter-spacing: var(--u-tracking-tight);
}
.urbino-cit h3, .urbino-cit .h3 {
  font-family: var(--u-font-display);
  font-size: var(--u-h3-size);
  font-weight: 700;
  line-height: var(--u-leading-snug);
  letter-spacing: var(--u-tracking-snug);
}
.urbino-cit h4, .urbino-cit .h4 {
  font-family: var(--u-font-sans);
  font-size: var(--u-h4-size);
  font-weight: 600;
}
.urbino-cit .lead {
  font-size: var(--u-text-lg);
  line-height: var(--u-leading-relaxed);
  color: var(--u-fg-2);
}
.urbino-cit .label {
  font-size: var(--u-text-sm);
  font-weight: 500;
  color: var(--u-fg-2);
}
.urbino-cit .eyebrow {
  font-family: var(--u-font-sans);
  font-size: var(--u-text-sm);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--u-fg-3);
}
.urbino-cit .caption { font-size: var(--u-text-sm); color: var(--u-fg-3); }
.urbino-cit code, .urbino-cit .mono {
  font-family: var(--u-font-mono);
  font-variant-numeric: tabular-nums;
}