/* ==== tbh-hero-contrast ==== */

/* ============================================================
   HERO CONTRAST FIX — dark text on dark blue.
   16 pages carry an inline  style="background:var(--brandblue); color:#14181F"
   on .page-hero. The inline background makes the hero dark blue, but the
   text stays near-black (#14181F) — measured 1.5:1, effectively invisible.
   The stylesheet's own .page-hero is a LIGHT ivory hero, so it never
   whitened the text. This forces light text wherever the hero is dark.
   Scoped to [style*="brandblue"] so it only touches the dark heroes.
   ============================================================ */
.page-hero[style*="brandblue"],
.page-hero[style*="brandblue"] .page-hero-text,
.page-hero[style*="brandblue"] h1,
.page-hero[style*="brandblue"] h2,
.page-hero[style*="brandblue"] p,
.page-hero[style*="brandblue"] li,
.page-hero[style*="brandblue"] .page-hero-lede,
.page-hero[style*="brandblue"] .lead{
  color:#EAF2FB !important;                 /* soft white — 13.8:1 on #003087 */
}
/* headline stays crisp white */
.page-hero[style*="brandblue"] h1{ color:#FFFFFF !important; }

/* the italic accent word in the headline: cyan, not near-black.
   #7FE9F2 measures 9.6:1 on #003087. */
.page-hero[style*="brandblue"] .accent-italic,
.page-hero[style*="brandblue"] .page-hero-accent,
.page-hero[style*="brandblue"] em{
  color:#7FE9F2 !important;
}

/* eyebrow / kicker / meta line */
.page-hero[style*="brandblue"] .page-hero-eyebrow,
.page-hero[style*="brandblue"] [class*="eyebrow"],
.page-hero[style*="brandblue"] [class*="kicker"],
.page-hero[style*="brandblue"] [class*="meta"],
/* bare <span> eyebrows with no class, sitting directly in the hero wrap */
.page-hero[style*="brandblue"] .wrap > span,
.page-hero[style*="brandblue"] .page-hero-text > span{
  color:#9FF0F7 !important;                 /* 8.9:1 */
}

/* breadcrumb: all crumbs legible, current page brightest */
.page-hero[style*="brandblue"] .crumb,
.page-hero[style*="brandblue"] nav a,
.page-hero[style*="brandblue"] [class*="crumb"] a,
.page-hero[style*="brandblue"] [class*="breadcrumb"] a{
  color:rgba(234,242,251,.82) !important;
}
.page-hero[style*="brandblue"] [aria-current],
.page-hero[style*="brandblue"] .crumb-current{
  color:#FFFFFF !important;
}

/* separators / slashes */
.page-hero[style*="brandblue"] .crumb-sep,
.page-hero[style*="brandblue"] [class*="crumb"] span{
  color:rgba(234,242,251,.5) !important;
}

/* any plain link in a dark hero (e.g. an unstyled tel: link) */
.page-hero[style*="brandblue"] a:not([class*="btn"]):not([class*="cta"]){
  color:#BFE9FF !important;
}

/* buttons keep their own colours — never override a light-chip button's dark label */
.page-hero[style*="brandblue"] .btn-primary,
.page-hero[style*="brandblue"] .btn-primary *{
  color:#FFFFFF !important;
}
.page-hero[style*="brandblue"] .btn-secondary{
  color:#EAF2FB !important;
  border-color:rgba(234,242,251,.5) !important;
}

/* ==== tbh-breadcrumb-system ==== */

/* ============================================================
   ONE BREADCRUMB SYSTEM  (brief item 5)
   Six different breadcrumb classes existed: .breadcrumb (uppercase,
   heavy tracking, chevron hidden) plus .res-bc/.bt-bc/.clin-bc/.lab-bc
   (title case, chevron). This unifies all of them to one look:
   title case, muted navy-grey, current page stronger navy, compact
   chevron separators, no underline.
   ============================================================ */
.breadcrumb, .res-bc, .bt-bc, .clin-bc, .lab-bc{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:7px !important;
  font-family:'Manrope',sans-serif !important;
  font-size:13.5px !important;
  font-weight:500 !important;
  text-transform:none !important;         /* was UPPERCASE on 143 pages */
  letter-spacing:0 !important;            /* was ~0.9px tracking */
  line-height:1.4 !important;
  margin:0 0 4px !important;
}
/* links: muted navy-grey, no underline, teal on hover */
.breadcrumb a, .res-bc a, .bt-bc a, .clin-bc a, .lab-bc a{
  color:#5A6B80 !important;
  text-decoration:none !important;
  font-weight:500 !important;
}
.breadcrumb a:hover, .res-bc a:hover, .bt-bc a:hover,
.clin-bc a:hover, .lab-bc a:hover{
  color:#007D8A !important;
}
/* current page: stronger navy, not a link */
.breadcrumb [aria-current], .res-bc [aria-current], .bt-bc [aria-current],
.clin-bc [aria-current], .lab-bc [aria-current],
.breadcrumb > span:last-child, .res-bc > span:last-child,
.bt-bc > span:last-child, .clin-bc > span:last-child, .lab-bc > span:last-child{
  color:#00214E !important;
  font-weight:600 !important;
}
/* chevron separators — compact, muted */
.breadcrumb svg, .res-bc svg, .bt-bc svg, .clin-bc svg, .lab-bc svg{
  width:13px !important; height:13px !important;
  color:#9DB0C6 !important;
  stroke:#9DB0C6 !important;
  flex:0 0 auto !important;
  opacity:1 !important;
}
.breadcrumb span[aria-hidden], .res-bc span[aria-hidden],
.bt-bc span[aria-hidden], .clin-bc span[aria-hidden], .lab-bc span[aria-hidden]{
  color:#9DB0C6 !important;
  font-weight:400 !important;
}

/* DARK-HERO breadcrumbs (about/contact/directions still have a dark hero):
   keep the same shape but light-on-dark so it stays readable. */
.page-hero[style*="brandblue"] .breadcrumb,
.page-hero[style*="brandblue"] .res-bc{
  font-size:13.5px !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  gap:7px !important;
}
.page-hero[style*="brandblue"] .breadcrumb a,
.page-hero[style*="brandblue"] .res-bc a{
  color:rgba(234,242,251,.82) !important;
}
.page-hero[style*="brandblue"] .breadcrumb [aria-current],
.page-hero[style*="brandblue"] .breadcrumb > span:last-child{
  color:#FFFFFF !important;
}
.page-hero[style*="brandblue"] .breadcrumb svg{
  color:rgba(234,242,251,.6) !important; stroke:rgba(234,242,251,.6) !important;
}
