/* ==============================================
   READABILITY — contrast (WCAG 2.1 AA) and a 12px
   minimum text size. Loaded after each page's own
   <style>, so these rules take precedence.
   Light-background colour fixes that depend on the
   page live at the end of each page's <style>.
   ============================================== */

:root {
  /* Gold for text on white/cream: 5.1–6:1. The brand gold (#C89A3C)
     stays for icons, rules and text on navy, where it reads at 6.6:1. */
  --gold-text: #7d5f17;
}

/* Gold buttons: navy text (6.6–9:1). White text on gold was 1.9–2.6:1. */
.btn-primary,
.btn-hero {
  color: var(--navy) !important;
}
/* Hover stays on the lighter part of the gold so the navy text keeps its contrast */
.btn-primary:hover,
.btn-hero:hover {
  background: linear-gradient(90deg, var(--gold-light) 0%, var(--gold) 100%);
}

/* Header: active / hover links on the white bar */
.nav-links > li > a:hover,
.nav-links > li > a.active,
.mega-menu a:hover {
  color: var(--gold-text);
}

/* Breadcrumbs on the dark page banners (were 4.4:1 at 11px) */
.page-hero-breadcrumb,
.page-hero-breadcrumb a,
.about-hero-breadcrumb,
.about-hero-breadcrumb a,
.services-hero-breadcrumb,
.services-hero-breadcrumb a,
.roadmap-hero-breadcrumb,
.roadmap-hero-breadcrumb a,
.contact-hero-breadcrumb,
.contact-hero-breadcrumb a {
  color: rgba(255,255,255,0.68);
  font-size: 13px;
}

/* Footer copyright line (was 3.2:1) */
.footer-bottom p,
.footer-bottom p a {
  color: #939ba4;
}

/* Small labels raised to 12px */
.section-label,
.consult-form-wrap label,
.nav-cta .btn-primary,
.hero-tile-label,
.placement-center-label,
.placements-disclaimer,
.package-badge,
.price-prefix,
.pkg-addon-label,
.addon-label,
.price-label,
.test-prep-badge,
.founder-role,
.team-preview-label,
.partner-link,
.consult-free,
.grade-tab-btn,
.grade-label,
.hours-label,
.phase-grade-label,
.tl-phase,
.consult-tag,
.hours-word,
.role-subtitle,
.home-pro-badge,
.professional-badge {
  font-size: 13px;
}

/* Elements whose page styles use more specific selectors (some in a second
   <style> further down the page), so they need matching specificity here. */
body .package-price .price-prefix,
body .addon-card .addon-label,
body .home-addon-identity .addon-label,
body .sat-timeline li .tl-phase {
  color: var(--gold-text);
  font-size: 13px;
}
body .placements-disclaimer {
  color: #666666;
  font-size: 13px;
}
body .sat-hours-card .hours-sub {
  color: rgba(255,255,255,0.68);
}
body .placement-center-label,
body .core-right .consult-free,
body .grade-panel-sidebar .grade-label,
body .sat-hours-card .hours-label,
body .comparison-table tfoot td .price-label {
  font-size: 13px;
}

/* Header on laptops/tablets: with the larger menu text the full menu no longer
   fits below ~1180px, so tighten it there and switch to the menu button below 1024px. */
@media (min-width: 769px) and (max-width: 1180px) {
  .nav-inner { gap: 16px; }
  .nav-logo img { height: 48px; }
  .nav-links { gap: 0; }
  .nav-links > li > a { padding: 10px 9px; letter-spacing: 1px; white-space: nowrap; }
  .nav-cta .btn-primary { padding: 11px 16px; letter-spacing: 1.2px; white-space: nowrap; }
}
@media (max-width: 1023px) {
  .nav-links, .nav-cta { display: none; }
  .hamburger { display: flex; flex-shrink: 0; }
}