/* Gharar editorial heading emphasis — 2026-10-24.
   Apply only to the existing blue heading phrases and the school offers title.
   Keep typography, layout, body text and dark hero treatments unchanged.
   .gharar-heading-highlight is the reusable opt-in for future heading phrases. */
:root{--gharar-heading-highlight-ink:#1e40af;--gharar-heading-highlight-paper:#dbeafe}
main :is(h1,h2) :is(.gharar-heading-highlight,span.text-blue-600,span.text-blue-500){
 color:var(--gharar-heading-highlight-ink)!important;
 background-color:var(--gharar-heading-highlight-paper);
 padding:.055em .14em;
 border-radius:2px;
 -webkit-box-decoration-break:clone;
 box-decoration-break:clone;
}
main #school-offers-title{
 width:fit-content;
 max-width:100%;
 margin-inline:auto;
 color:var(--gharar-heading-highlight-ink);
 background-color:var(--gharar-heading-highlight-paper);
 padding:.055em .2em;
 border-radius:2px;
 -webkit-box-decoration-break:clone;
 box-decoration-break:clone;
}
/* The existing decorative underline would duplicate this new emphasis. */
main :is(h1,h2) span.text-blue-600>svg.absolute.-bottom-2{display:none}
.dark{--gharar-heading-highlight-ink:#d5e5ff;--gharar-heading-highlight-paper:#213a59}
@media(forced-colors:active){main :is(h1,h2) :is(.gharar-heading-highlight,span.text-blue-600,span.text-blue-500),main #school-offers-title{color:CanvasText!important;background:Canvas}}

main :is(h1,h2) :is(.gharar-heading-highlight,span.text-blue-600,span.text-blue-500)::selection,main #school-offers-title::selection{background:#1e40af;color:#fff}

/* Curated extension: one key title per editorial page, plus section wayfinding.
   These selectors rely on route context, not text matching or DOM rewriting. */
main[data-gharar-heading-page="foundations"] h1.flex>span:last-child,
main[data-gharar-heading-page="essays"] h1.flex>span:last-child,
main[data-gharar-heading-page="library"] h1.flex>span:last-child,
main[data-gharar-heading-page="events"] h1.flex>span:last-child,
main[data-gharar-heading-page="why"] h1,
main[data-gharar-heading-page="blog"] h1.font-sans,
main[data-gharar-heading-page="library"] h1:not(.flex),
main[data-gharar-heading-page="catalog"] h1,
main[data-gharar-heading-page="fifty"] .fifty-hero-copy h1,
main #coaches-title,
main #courses-section>.text-center>h2,
main[data-gharar-heading-page="home"] #pathways h2,
main[data-gharar-heading-page="executive"] h2.text-teal-900{
 color:var(--gharar-heading-highlight-ink)!important;
 background-color:var(--gharar-heading-highlight-paper);
 padding:.055em .14em;
 border-radius:2px;
 max-width:100%;
 -webkit-box-decoration-break:clone;
 box-decoration-break:clone;
 text-shadow:none;
 filter:none;
}
/* Keep a title's highlight close to the words, never across its whole column. */
main[data-gharar-heading-page="why"] h1,
main[data-gharar-heading-page="blog"] h1.font-sans,
main[data-gharar-heading-page="library"] h1:not(.flex),
main[data-gharar-heading-page="catalog"] h1,
main[data-gharar-heading-page="fifty"] .fifty-hero-copy h1,
main #coaches-title,
main #courses-section>.text-center>h2,
main[data-gharar-heading-page="home"] #pathways h2,
main[data-gharar-heading-page="executive"] h2.text-teal-900{width:fit-content}
main[data-gharar-heading-page="why"] h1,
main[data-gharar-heading-page="blog"] h1.font-sans,
main[data-gharar-heading-page="library"] h1:not(.flex),
main[data-gharar-heading-page="fifty"] .fifty-hero-copy h1,
main #courses-section>.text-center>h2,
main[data-gharar-heading-page="home"] #pathways h2{margin-inline:auto}
@media(forced-colors:active){main[data-gharar-heading-page] :is(h1,h2),main #coaches-title,main #courses-section>.text-center>h2{background:Canvas!important;color:CanvasText!important}}
/* Preserve contrast when the original title contains a second accent color. */
main[data-gharar-heading-page="foundations"] h1.flex>span:last-child>span{color:inherit!important}
