/* ==========================================================================
   AURUM SITE-WIDE SECTION HEADING SYSTEM — 2026-09-03
   Single authoritative treatment based on the approved DriveDx Option 2 style.

   RULES
   - Section headings only; page/hero H1s are intentionally excluded.
   - Same font, weight, size, line-height, tracking and red left rule everywhere.
   - Light/white surfaces: black heading text.
   - Teal/dark/coloured surfaces: white heading text.
   - Old italic/gold <em> styling inside section headings is neutralised so all
     section headings read as one system.
   ========================================================================== */

:root{
  --aurum-section-heading-size:clamp(32px,3vw,46px);
  --aurum-section-heading-size-mobile:clamp(28px,8.2vw,35px);
  --aurum-section-heading-line:5px;
  --aurum-section-heading-line-mobile:4px;
  --aurum-section-heading-inset:20px;
  --aurum-section-heading-inset-mobile:14px;
}

/* ---------- CANONICAL HEADING GEOMETRY ---------- */
:where(
  .section-head > h2,
  .section-head--single > h2,
  .latest-stories-head > h2,
  .about-introduction-copy > h2,
  .infrastructure-intro h2,
  .work-image-band-copy h2,
  .leadership-group > h3,
  .clinical-copy-block > h2,
  .clinical-network-card > h2,
  .clinical-infrastructure-head > h2,
  .bammisho-editorial__content > h2,
  .market-matters-grid > div > h2,
  .climate-copy > h2,
  .astra-feature__copy > h2,
  .drivedx-section-head > h2,
  .drivedx-connected h2,
  .home-strap-head > h2,
  .aurum-focus-title
){
  box-sizing:border-box!important;
  position:relative!important;
  display:block!important;
  width:fit-content!important;
  max-width:100%!important;
  margin-top:0!important;
  padding-left:var(--aurum-section-heading-inset)!important;
  border-left:var(--aurum-section-heading-line) solid var(--aurum-red)!important;
  font-family:var(--font-primary,"Neue Haas Grotesk","Archivo",Arial,sans-serif)!important;
  font-size:var(--aurum-section-heading-size)!important;
  font-style:normal!important;
  font-weight:800!important;
  line-height:1.04!important;
  letter-spacing:-.035em!important;
  text-transform:none!important;
}

/* Neutralise previous oversized pseudo-line implementations. */
:where(
  .section-head > h2,
  .section-head--single > h2,
  .latest-stories-head > h2,
  .about-introduction-copy > h2,
  .infrastructure-intro h2,
  .work-image-band-copy h2,
  .leadership-group > h3,
  .clinical-copy-block > h2,
  .clinical-network-card > h2,
  .clinical-infrastructure-head > h2,
  .bammisho-editorial__content > h2,
  .market-matters-grid > div > h2,
  .climate-copy > h2,
  .astra-feature__copy > h2,
  .home-strap-head > h2,
  .aurum-focus-title
)::before{
  content:none!important;
  display:none!important;
}

/* DriveDx already uses border-left; make it share the exact token values. */
.drivedx-page :where(.drivedx-section-head > h2,.drivedx-connected h2){
  padding-left:var(--aurum-section-heading-inset)!important;
  border-left-width:var(--aurum-section-heading-line)!important;
  border-left-color:var(--aurum-red)!important;
}

/* Old subpage headings often wrapped the second line in <em>; section headers
   now use the same DriveDx typography instead of italic/gold fragments. */
:where(
  .section-head > h2,
  .section-head--single > h2,
  .about-introduction-copy > h2,
  .infrastructure-intro h2,
  .work-image-band-copy h2,
  .clinical-copy-block > h2,
  .clinical-network-card > h2,
  .clinical-infrastructure-head > h2
) em{
  color:inherit!important;
  font:inherit!important;
  font-style:normal!important;
}

/* ---------- DEFAULT: LIGHT / WHITE SURFACES ---------- */
:where(
  .section-head > h2,
  .section-head--single > h2,
  .latest-stories-head > h2,
  .about-introduction-copy > h2,
  .infrastructure-intro h2,
  .bammisho-editorial__content > h2,
  .market-matters-grid > div > h2,
  .climate-copy > h2,
  .astra-feature__copy > h2,
  .home-strap-head > h2,
  .aurum-focus-title,
  .drivedx-page .drivedx-section-head > h2,
  .drivedx-page .drivedx-connected h2
){
  color:var(--aurum-ink,#171514)!important;
}

/* ---------- COLOURED / DARK SURFACES ---------- */
/* Explicit contexts beat inherited legacy colours. */
:where(
  .leadership,
  .clinical-research-panel,
  .discipline.teal,
  .area-work-section,
  .area-work-section--market,
  .project-section.teal,
  .project-section.dark,
  .page-section.teal,
  .page-section.dark,
  .people,
  .purpose,
  .dark-section,
  .teal-section
) :where(
  .section-head > h2,
  .section-head--single > h2,
  .leadership-group > h3,
  .clinical-copy-block > h2,
  .clinical-network-card > h2,
  .clinical-infrastructure-head > h2
){
  color:#fff!important;
}

/* Leadership is a teal page but its groups use h3, not h2. */
.leadership .leadership-group > h3{
  color:#fff!important;
  margin-bottom:26px!important;
}

/* Health area "Our Work" blocks are teal in the current system. */
.area-work-section .section-head--single > h2{
  color:#fff!important;
}

/* Health-area Focus Areas / expertise panels use a white surface. */
.area-focus-icons .section-head--single > h2,
.area-focus-icons .section-head > h2{
  color:var(--aurum-ink,#171514)!important;
}

/* Clinical Research main block is teal. */
.clinical-research-panel :where(
  .clinical-copy-block > h2,
  .clinical-network-card > h2,
  .clinical-infrastructure-head > h2
){
  color:#fff!important;
}

/* History timeline is a white surface. */
.history .section-head > h2{
  color:var(--aurum-ink,#171514)!important;
}

/* ---------- PAGE-SPECIFIC ALIGNMENT WITHOUT CHANGING THE SYSTEM ---------- */
/* Keep the homepage Areas of Focus heading centred as previously approved. */
.aurum-focus-title{
  margin-left:0!important;
  margin-right:0!important;
}

/* A heading in a two-column section should not inherit old giant widths. */
.section-head{
  align-items:start!important;
}
.section-head > h2{
  max-width:min(100%,900px)!important;
}

/* Latest Stories uses same hierarchy, not a special giant headline. */
.latest-stories-head{
  margin-bottom:34px!important;
}
.latest-stories-head > h2{
  max-width:min(100%,980px)!important;
}

/* Clinical headings were explicitly set as high as 72px in revision CSS.
   This is the authoritative override back to the DriveDx scale. */
.clinical-copy-block > h2,
.clinical-network-card > h2,
.clinical-infrastructure-head > h2{
  margin-bottom:24px!important;
}

/* About "Who we are" should read as a proper section heading on white. */
.about-introduction-copy > h2{
  color:var(--aurum-ink,#171514)!important;
  margin-bottom:28px!important;
}

/* Leadership page section headings all follow the same scale. */
.leadership-group > h3{
  font-size:var(--aurum-section-heading-size)!important;
  line-height:1.04!important;
  letter-spacing:-.035em!important;
  font-weight:800!important;
}

/* Market Access standalone section headings on white. */
.market-matters-grid > div > h2,
.climate-copy > h2,
.astra-feature__copy > h2{
  color:var(--aurum-ink,#171514)!important;
  margin-bottom:22px!important;
}

/* ---------- MOBILE ---------- */
@media(max-width:700px){
  .aurum-focus-title{
    margin-left:auto!important;
    margin-right:auto!important;
  }

  :where(
    .section-head > h2,
    .section-head--single > h2,
    .latest-stories-head > h2,
    .about-introduction-copy > h2,
    .infrastructure-intro h2,
    .work-image-band-copy h2,
    .leadership-group > h3,
    .clinical-copy-block > h2,
    .clinical-network-card > h2,
    .clinical-infrastructure-head > h2,
    .bammisho-editorial__content > h2,
    .market-matters-grid > div > h2,
    .climate-copy > h2,
    .astra-feature__copy > h2,
    .drivedx-section-head > h2,
    .drivedx-connected h2,
    .home-strap-head > h2,
    .aurum-focus-title
  ){
    padding-left:var(--aurum-section-heading-inset-mobile)!important;
    border-left-width:var(--aurum-section-heading-line-mobile)!important;
    font-size:var(--aurum-section-heading-size-mobile)!important;
    line-height:1.05!important;
  }
}


/* =====================================================================
   2026-09-03 FINAL CONTEXT CORRECTIONS
   ===================================================================== */

/* About: the complete authored "Who We Are" heading is Aurum gold.
   The red section rule remains; only the text colour is special here. */
.about-introduction .about-introduction-copy > h2,
.about-introduction .about-introduction-copy > h2 em{
  color:var(--aurum-gold,#e0ac26)!important;
}

/* Clinical Research: give Scientific infrastructure safe breathing room
   from the red rule without increasing the heading itself. */
.clinical-infrastructure-head > h2{
  padding-left:30px!important;
  max-width:100%!important;
}

/* User-requested Market Access heading is intentionally a little smaller
   than other coloured-panel section headings. */
.area-work-section--market .section-head--single > h2{
  font-size:clamp(28px,2.65vw,40px)!important;
}
@media(max-width:700px){
  .clinical-infrastructure-head > h2{padding-left:20px!important;}
  .area-work-section--market .section-head--single > h2{
    font-size:clamp(26px,7.4vw,33px)!important;
  }
}