/* House Circuit typography system
   UI: Space Grotesk · Brand: Orbitron · Data: JetBrains Mono */

:root {
  --hc-font-ui: 'Space Grotesk', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --hc-font-brand: 'Orbitron', 'Space Grotesk', sans-serif;
  --hc-font-data: 'JetBrains Mono', 'Share Tech Mono', 'SFMono-Regular', Consolas, monospace;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--hc-font-ui) !important;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: -.006em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body :where(button, input, select, textarea, table) {
  font-family: var(--hc-font-ui) !important;
  letter-spacing: 0;
}

body :where(h1, h2, h3, h4, h5, h6, .page-title, .section-title, .card-title, .form-title) {
  font-family: var(--hc-font-ui) !important;
  font-weight: 600;
  line-height: 1.16;
  letter-spacing: -.025em;
  text-wrap: balance;
}

body :where(p, li, .sub, .description, .admin-subtitle) {
  line-height: 1.6;
}

/* Futuristic type is a brand accent, not the default reading face. */
body :where(.logo-text, .logo-name, .logo-mark, .brand, .brand-name, .hero-title, .loading-logo, .brand-word) {
  font-family: var(--hc-font-brand) !important;
}

/* Tabular data stays compact and easy to compare. */
body :where(code, pre, kbd, samp, .amount, .amount-display, .payment-amount,
  .po-stat-val, .fin-metric-val, .dk-stat-value, .bk-tile .v, .eq-tile .v,
  .tx-stat .v, .metric-value, .stat-value, .event-date, time) {
  font-family: var(--hc-font-data) !important;
  font-variant-numeric: tabular-nums slashed-zero;
  letter-spacing: -.02em;
}

body :where(.eyebrow, [class$='-eyebrow'], .section-label, .nav-group-label,
  .admin-eyebrow, .po-stat-label, .fin-metric-label, .dk-stat-label,
  .form-label, .detail-label, .rec-label) {
  font-family: var(--hc-font-ui) !important;
  font-size: 11px !important;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .10em !important;
}

body :where(button, .btn, [class$='-btn'], [class*='-btn ']) {
  font-family: var(--hc-font-ui) !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}

body :where(input, select, textarea) {
  font-size: 14px;
  line-height: 1.35;
}

body :where(table) {
  font-size: 13px;
  line-height: 1.4;
}

body :where(.status-badge, .badge, [class*='-badge']) {
  font-family: var(--hc-font-ui) !important;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .01em;
}

/* Admin workspace: compact, but never cramped or hard to scan. */
body.admin-body {
  font-size: 14px;
  line-height: 1.5;
}

.admin-body :where([style*='Share Tech Mono']) {
  font-family: var(--hc-font-ui) !important;
}

.admin-body :where(.page-title) {
  font-size: 26px !important;
  font-weight: 600;
}

.admin-body :where(.nav-link, .nav-drawer-link) {
  font-size: 14px !important;
  font-weight: 500;
}

.admin-body :where(.fin-section-title) {
  font-family: var(--hc-font-ui) !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  letter-spacing: -.03em !important;
}

.admin-body :where(.fin-section-desc) {
  font-size: 14px !important;
}

.admin-body :where(.fin-card-title, .bk-title, .eq-title, .tx-title, .po-form-title,
  .dk-stat-title, .gallery-upload-title, .admin-table th, .po-table th) {
  font-family: var(--hc-font-ui) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.3;
  letter-spacing: .09em !important;
}

.admin-body :where(.po-stat-val, .fin-metric-val, .dk-stat-value, .bk-tile .v,
  .eq-tile .v, .tx-stat .v) {
  font-family: var(--hc-font-data) !important;
  font-size: 22px;
  font-weight: 600;
}

.admin-body :where(.po-table, .admin-table, .bk-table) {
  font-family: var(--hc-font-ui) !important;
  font-size: 13px !important;
}

.admin-body :where(.po-input, .fin-input, .form-control, input, select, textarea) {
  font-family: var(--hc-font-ui) !important;
  font-size: 14px !important;
}

/* Public site hierarchy. */
body:not(.admin-body) :where(#hero-title) {
  font-size: clamp(36px, 6.5vw, 76px) !important;
  line-height: .98 !important;
  letter-spacing: -.045em !important;
}

body:not(.admin-body) :where(.panel-section-title, .brand-heading, .mission-title) {
  font-family: var(--hc-font-ui) !important;
  font-size: clamp(26px, 4vw, 44px) !important;
  font-weight: 600;
  letter-spacing: -.035em !important;
}

body:not(.admin-body) :where(.card-title, .event-card-title, .form-title) {
  font-size: clamp(16px, 1.5vw, 20px) !important;
}

@media (max-width: 767px) {
  body { font-size: 15px; line-height: 1.55; }

  body :where(input, select, textarea),
  .admin-body :where(.po-input, .fin-input, .form-control, input, select, textarea) {
    font-size: 16px !important;
  }

  .admin-body :where(.page-title) { font-size: 22px !important; }
  .admin-body :where(.fin-section-title) { font-size: 23px !important; }
  .admin-body :where(.po-stat-val, .fin-metric-val, .dk-stat-value) { font-size: 20px; }
}