/* Site-wide typography polish for Bushulo MNCH Specialty Center */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Poppins:wght@500;600;700;800;900&display=swap');

:root {
  --font-site: 'Inter', 'Segoe UI', Arial, sans-serif;
  --font-heading: 'Poppins', 'Inter', 'Segoe UI', Arial, sans-serif;
  --type-ink: #10223f;
  --type-muted: #4f5f73;
  --type-blue: #003087;
  --type-gold: #d99016;
}

html,
body {
  font-family: var(--font-site) !important;
  color: var(--type-ink) !important;
  font-weight: 500 !important;
  line-height: 1.68 !important;
  letter-spacing: 0 !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body,
p,
li,
span,
div,
input,
textarea,
select,
button,
a,
td,
th {
  font-family: var(--font-site) !important;
}

p,
li,
.result-excerpt,
.section-sub,
.card-body p,
.care-description,
.partner-desc,
.contact-item span {
  color: var(--type-muted);
  font-size: clamp(0.95rem, 0.35vw + 0.88rem, 1.05rem) !important;
  font-weight: 500 !important;
  line-height: 1.78 !important;
}

/* Hero paragraphs sit on dark/photo backgrounds site-wide, so keep them white */
.hero-sub,
.hero-message,
.hero p,
.page-hero p,
.research-hero p,
.careers-hero p {
  color: #ffffff !important;
  font-size: clamp(0.95rem, 0.35vw + 0.88rem, 1.05rem) !important;
  font-weight: 500 !important;
  line-height: 1.78 !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.care-title,
.care-subtitle,
.hero h1,
.result-title a,
.fb-name,
.brand-text .name,
.partner-info h4,
.stat-num {
  font-family: var(--font-heading) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
}

h1,
.hero h1,
.hero-title,
.page-hero h1,
.research-hero h1,
.careers-hero h1 {
  font-size: clamp(2.25rem, 5vw, 4.35rem) !important;
}

h2,
.section-title,
.section-heading,
.care-title,
.search-header h1 {
  font-size: clamp(1.75rem, 3.2vw, 2.85rem) !important;
}

h3,
.card-body h3,
.feature-card-title,
.result-title a,
.team-name,
.specialist-name {
  font-size: clamp(1.08rem, 0.8vw + 0.95rem, 1.45rem) !important;
}

h4,
h5,
h6,
.section-tag,
.result-category,
.stat-label,
.footer-col h4 {
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
}

strong,
b,
mark,
.search-query strong {
  font-weight: 900 !important;
}

a,
.btn,
.btn-primary,
.btn-outline,
.btn-gold,
.partner-btn,
.btn-home,
.card-link,
.video-link,
.nav-menu a,
.mobile-nav a,
.footer-col a,
.result-url {
  font-family: var(--font-site) !important;
  font-weight: 800 !important;
}

.btn,
.btn-primary,
.btn-outline,
.btn-gold,
.partner-btn,
.btn-home,
.newsletter-form button,
.search-submit-btn,
.topbar-donate {
  letter-spacing: 0.01em !important;
  border-radius: 8px !important;
}

.topbar,
.topbar span,
.topbar a,
.lang-btn,
.brand-text .sub,
.brand-text .tagline,
.footer-bottom span,
.footer-bottom a {
  font-weight: 700 !important;
}

.search-container {
  font-family: var(--font-site) !important;
}

.search-header h1 {
  color: var(--type-blue) !important;
  margin-bottom: 0.5rem !important;
}

.results-count {
  color: #087f5b !important;
  font-weight: 800 !important;
}

.search-result {
  border-left-color: var(--type-blue) !important;
}

.search-result:hover {
  border-left-color: var(--type-gold) !important;
}

.result-category {
  border-radius: 999px !important;
  background: #e8f0fb !important;
  color: var(--type-blue) !important;
}

.result-excerpt mark {
  background: #fff2b8 !important;
  color: #6f4700 !important;
  font-weight: 900 !important;
}

input,
textarea,
select {
  font-weight: 600 !important;
}

.fa,
.fas,
.far,
.fab,
.fa-solid,
.fa-regular,
.fa-brands {
  font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands' !important;
}

@media (max-width: 640px) {
  h1,
  .hero h1,
  .hero-title,
  .page-hero h1,
  .research-hero h1,
  .careers-hero h1 {
    font-size: clamp(2rem, 11vw, 3rem) !important;
  }

  h2,
  .section-title,
  .section-heading,
  .care-title,
  .search-header h1 {
    font-size: clamp(1.55rem, 8vw, 2.25rem) !important;
  }
}