/**
 * AI20 Visual Identity v1 — Typography hierarchy (Staging).
 */

body.ai20-vi-system {
  font-family: var(--ai20-vi-font);
  color: var(--ai20-vi-graphite);
  -webkit-font-smoothing: antialiased;
}

body.ai20-vi-system .entry-content,
body.ai20-vi-system .content-area,
body.ai20-vi-system .site-main,
body.ai20-vi-system .ai20-homepage-experience,
body.ai20-vi-system .ai20-people-directory,
body.ai20-vi-system .ai20-organizations-directory,
body.ai20-vi-system .ai20-events-directory,
body.ai20-vi-system .ai20-public-search,
body.ai20-vi-system .ai20-countries-page,
body.ai20-vi-system .ai20-join-page {
  font-family: var(--ai20-vi-font);
}

/* Display / page heroes */
body.ai20-vi-system .ai20-hero h1,
body.ai20-vi-system .ai20-hero .ai20-display,
body.ai20-vi-system .ai20-people-directory__title,
body.ai20-vi-system .ai20-organizations-directory__title,
body.ai20-vi-system .ai20-events-directory__title,
body.ai20-vi-system .ai20-countries-page__title,
body.ai20-vi-system .ai20-join-page__title,
body.ai20-vi-system .ai20-public-search__title {
  font-family: var(--ai20-vi-font);
  font-size: var(--ai20-vi-display);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.08;
  color: var(--ai20-vi-midnight);
}

body.ai20-vi-system .ai20-hero h1,
body.ai20-vi-system .ai20-hero .ai20-display {
  color: var(--ai20-vi-white);
}

body.ai20-vi-system h1 {
  font-family: var(--ai20-vi-font);
  font-size: var(--ai20-vi-h1);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: var(--ai20-vi-midnight);
}

body.ai20-vi-system h2,
body.ai20-vi-system .ai20-ecosystem-nav__heading,
body.ai20-vi-system .ai20-economy-highlights__heading,
body.ai20-vi-system .ai20-countries__heading,
body.ai20-vi-system .ai20-join__heading,
body.ai20-vi-system .ai20-search-teaser__heading {
  font-family: var(--ai20-vi-font);
  font-size: var(--ai20-vi-h2);
  font-weight: 600;
  letter-spacing: -0.015em;
  line-height: 1.2;
  color: var(--ai20-vi-midnight);
}

body.ai20-vi-system h3,
body.ai20-vi-system .edpf-entity-card__title,
body.ai20-vi-system .ai20-economy-highlights__title,
body.ai20-vi-system .ai20-countries__card-title {
  font-family: var(--ai20-vi-font);
  font-size: var(--ai20-vi-h3);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.25;
  color: var(--ai20-vi-midnight);
}

body.ai20-vi-system p,
body.ai20-vi-system .entry-content p,
body.ai20-vi-system .edpf-entity-card__excerpt,
body.ai20-vi-system .ai20-ecosystem-nav__intro {
  font-size: var(--ai20-vi-body);
  line-height: 1.65;
  color: var(--ai20-vi-graphite);
}

body.ai20-vi-system .ai20-kicker,
body.ai20-vi-system .ai20-ecosystem-nav__kicker,
body.ai20-vi-system .ai20-countries__kicker,
body.ai20-vi-system .ai20-economy-highlights__kicker,
body.ai20-vi-system .ai20-join__kicker,
body.ai20-vi-system .ai20-join-teaser__kicker,
body.ai20-vi-system .ai20-search-teaser__kicker,
body.ai20-vi-system .ai20-people-directory__brand,
body.ai20-vi-system .ai20-organizations-directory__brand,
body.ai20-vi-system .ai20-events-directory__brand,
body.ai20-vi-system .ai20-countries-page__brand,
body.ai20-vi-system .ai20-awaiting-content__marker {
  font-family: var(--ai20-vi-font) !important;
  font-size: var(--ai20-vi-label) !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--ai20-vi-azure) !important;
}

body.ai20-vi-system .ai20-hero .ai20-kicker {
  color: var(--ai20-vi-cyan);
}

/* Data / statistics */
body.ai20-vi-system .ai20-stat,
body.ai20-vi-system .ai20-economy-highlights__metric-value,
body.ai20-vi-system [data-ai20-stat] {
  font-family: var(--ai20-vi-font-data);
  font-size: var(--ai20-vi-stat);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--ai20-vi-midnight);
  font-variant-numeric: tabular-nums;
}

html[lang^="ar"] body.ai20-vi-system,
body.ai20-vi-system[dir="rtl"] {
  font-family: var(--ai20-vi-font-ar);
}

html[lang^="ar"] body.ai20-vi-system h1,
html[lang^="ar"] body.ai20-vi-system h2,
html[lang^="ar"] body.ai20-vi-system h3,
body.ai20-vi-system[dir="rtl"] h1,
body.ai20-vi-system[dir="rtl"] h2,
body.ai20-vi-system[dir="rtl"] h3 {
  letter-spacing: 0;
}
