/*
 * Public information surfaces only. This file deliberately avoids restricted
 * site subsystems and targets only the approved public presentation roots.
 */
:root {
  --ghair-brand-blue: #031F83;
  --ghair-brand-red: #C5241B;
}

/* Root tokens correct the late page-specific near-brand substitutions. */
body.page-id-12 .ghair-about {
  --about-navy: var(--ghair-brand-blue);
  --about-blue: var(--ghair-brand-blue);
  --about-red: var(--ghair-brand-red);
}
.ghair-achievements,
.ghair-publications {
  --pub-navy: var(--ghair-brand-blue);
  --pub-red: var(--ghair-brand-red);
}
.ghair-blog {
  --blog-navy: var(--ghair-brand-blue);
  --blog-red: var(--ghair-brand-red);
}

/* Homepage heading system: Plus Jakarta Sans, weight 800/700 and its original responsive scale. */
body.page-id-12 .ghair-about__hero h1,
.ghair-projects-hero h1,
.ghair-learning-hub h1,
.ghair-achievements__hero h1,
.ghair-publications__hero h1,
.ghair-blog h1,
.ghair-partners-hero h1 {
  color: var(--ghair-brand-blue);
  font-family: var(--font-heading);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

body.page-id-12 .ghair-about__hero h1 .ghair-about__hero-impact {
  color: var(--ghair-brand-red);
}

body.page-id-12 .ghair-about__story-heading h2,
body.page-id-12 .ghair-about__team-heading h2,
body.page-id-12 .ghair-about__story-card h3,
.ghair-projects-feature header h2,
.ghair-learning-hub__courses-header h2,
.ghair-achievements__section-heading h2,
.ghair-achievements__impact h2,
.ghair-achievements__recognition-card h2,
.ghair-publications__empty h2,
.ghair-partners-showcase h2,
.ghair-partners-closing h2,
.ghair-blog__empty h2 {
  color: var(--ghair-brand-blue);
  font-family: var(--font-heading);
  font-size: clamp(1.6rem, 3vw, 2.25rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.ghair-projects-card h3,
.ghair-learning-hub__course-content h3,
.ghair-partner-card h3,
.ghair-publication-card__title,
.ghair-blog-card h2 {
  color: var(--ghair-brand-blue);
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
}
.ghair-publication-card__title a { color: inherit; }

/* Page labels and approved primary accents use the exact red token. */
body.page-id-12 .ghair-about__eyebrow,
body.page-id-12 .ghair-about__timeline-label,
.ghair-projects-eyebrow,
.ghair-learning-hub__eyebrow,
.ghair-partners__eyebrow,
.ghair-eyebrow,
.ghair-blog__eyebrow {
  color: var(--ghair-brand-red);
}

.ghair-projects-hero h1,
.ghair-projects-feature header h2,
.ghair-projects-card h3,
.ghair-learning-hub h1,
.ghair-learning-hub h2,
.ghair-learning-hub h3,
.ghair-partners-page h1,
.ghair-partners-page h2,
.ghair-partners-page h3 {
  color: var(--ghair-brand-blue);
}

/* Direct decorative/action accents that previously bypassed component variables. */
.ghair-projects-hero__media::before,
.ghair-learning-hub__hero-art::before { border-color: var(--ghair-brand-red); }
.ghair-projects-status-nav a:first-child { border-color: var(--ghair-brand-red); }
.ghair-learning-hub__course-card:hover .ghair-learning-hub__course-arrow,
.ghair-partners__button--primary:hover,
.ghair-partners__button--primary:focus-visible { background-color: var(--ghair-brand-red); }
.ghair-partners__button--secondary:hover,
.ghair-partners__button--secondary:focus-visible,
.ghair-partner-card__content > a { color: var(--ghair-brand-red); }
.ghair-partners__button--secondary:hover,
.ghair-partners__button--secondary:focus-visible { border-color: var(--ghair-brand-red); }

/* Inherit Inter for content and controls; no layout, spacing or imagery is changed. */
body.page-id-12 .ghair-about p,
.ghair-projects-redesign p,
.ghair-learning-hub p,
.ghair-achievements p,
.ghair-publications p,
.ghair-blog p,
.ghair-partners-page p,
.ghair-projects-redesign .btn,
.ghair-learning-hub .btn,
.ghair-achievements .btn,
.ghair-publications button,
.ghair-blog button,
.ghair-partners-page .btn {
  font-family: var(--font-body);
}

/* Preserve deliberate white copy on the approved dark About closing panel. */
body.page-id-12 .ghair-about-closing .ghair-about-eyebrow,
body.page-id-12 .ghair-about-closing h2 { color: #FFFFFF; }

@media (max-width: 540px) {
  body.page-id-12 .ghair-about__hero h1,
  .ghair-projects-hero h1,
  .ghair-learning-hub h1,
  .ghair-achievements__hero h1,
  .ghair-publications__hero h1,
  .ghair-blog h1,
  .ghair-partners-hero h1 { font-size: clamp(2rem, 10vw, 2.5rem); }

  .ghair-projects-card h3,
  .ghair-learning-hub__course-content h3,
  .ghair-partner-card h3,
  .ghair-publication-card__title { font-size: 1.25rem; }
}

/* Standardized Opportunity Archives & Detail Typography & Colors */
.opportunity-detail-header h1 {
  font-family: var(--font-heading);
  color: var(--ghair-brand-blue) !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.25 !important;
}

.opportunity-card .opportunity-title,
.opportunity-card .opportunity-title a {
  font-family: var(--font-heading);
  color: var(--ghair-brand-blue) !important;
  font-size: clamp(1.15rem, 2vw, 1.35rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  line-height: 1.3 !important;
}

.opportunity-card .opportunity-title a:hover,
.opportunity-card .opportunity-title a:focus {
  color: var(--ghair-brand-red) !important;
}

.opportunity-card .badge-type {
  background-color: rgba(3, 31, 131, 0.08) !important;
  color: var(--ghair-brand-blue) !important;
}

.opportunity-card .btn-bookmark:hover,
.opportunity-card .btn-bookmark.saved {
  color: var(--ghair-brand-red) !important;
  background-color: rgba(197, 36, 27, 0.08) !important;
}

.detail-content-area h2 {
  font-family: var(--font-heading);
  color: var(--ghair-brand-blue) !important;
  font-size: clamp(1.6rem, 3vw, 2.25rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  line-height: 1.25 !important;
}

.upgrade-screen-container h3 {
  font-family: var(--font-heading);
  color: var(--ghair-brand-blue) !important;
  font-weight: 800 !important;
}

.filters-header h3 {
  font-family: var(--font-heading);
  color: var(--ghair-brand-blue);
  font-weight: 700;
}

#resultsCount {
  color: var(--ghair-brand-blue) !important;
  font-family: var(--font-heading);
  font-weight: 700;
}

/* Red Highlight Spans within Headings */
.accent-text,
.hero-highlight,
.ghair-highlight,
.ghair-red-highlight {
  color: var(--ghair-brand-red) !important;
}

/* Homepage 3-Tab Responsive Search Styling */
.search-type-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0.5rem;
}

@media (max-width: 820px) {
  .search-type-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
  }
  .search-tab-btn {
    min-height: 52px !important;
  }
}

@media (max-width: 520px) {
  .search-type-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.35rem !important;
    padding: 0.35rem !important;
  }
  .search-tab-btn {
    min-height: 62px !important;
    padding: 0.5rem 0.25rem !important;
    font-size: 0.8125rem !important;
    flex-direction: row !important;
    gap: 0.35rem !important;
  }
  .search-tab-btn svg {
    width: 16px !important;
    height: 16px !important;
  }
}


