/* ==========================================================================
   Aegis Health — contrast corrections
   Added 2026-09-18

   WHY THIS EXISTS
   The palette carries a warm gold and a muted stone that each work on only
   one kind of ground, and over time both ended up used on the wrong one:
   the warm gold (#D4B07A, built for dark sections) on cream labels, the
   deep gold (#8A6329, built for cream) inside dark sections, and the muted
   stone (#6E675D, darkened in legibility.css so it would pass on cream) on
   charcoal, where it falls to 1.28:1 and is effectively invisible. Two
   outline buttons were literally 1:1, charcoal text on a charcoal card.

   Three replacement tones, all measured against the real grounds:
     #755220  deep gold on cream        6.31:1 on cream-light, 5.62 on cream-mid
     #E4CAA0  soft gold on charcoal     4.52:1 on charcoal,    5.98 on charcoal-dark
     #D8D2C9  muted stone on charcoal   4.77:1 on charcoal

   THE DARK HOST LIST
   Section 1 lists every section on the site whose ground is dark and which
   carries a label or an italic heading. It was generated by measuring the
   rendered background of each one rather than assumed, so if a new dark
   section is added later its label will inherit the cream default and look
   wrong until it is added here.

   Loaded last, after density.css, because several of these carry the colour
   in an inline style attribute.
   ========================================================================== */

:root {
  --gold-on-light: #755220;
  --gold-on-dark:  #E4CAA0;
  --stone-on-dark: #D8D2C9;
}

/* ---- 1. Eyebrow labels ----------------------------------------------- */
/* Cream is the common case, so it is the default and the dark hosts opt
   out immediately below. */

.section-label,
.page-label,
.our-story-label { color: var(--gold-on-light) !important; }
.section-label::before { background: var(--gold-on-light) !important; }

header.page-header .section-label,
header.page-header .page-label,
section.services .section-label,
section.conditions .section-label,
section.cta:not(.cta-light) .section-label,
section#contact.cta .section-label,
section#clinics.clinics .section-label,
section#clinics.clinics .page-label,
section#respite.respite-sec .section-label,
section.activities .section-label,
section.packages:not(.packages-light) .section-label,
section.pillars .section-label,
section.values .section-label {
  color: var(--gold-on-dark) !important;
}

header.page-header .section-label::before,
section.services .section-label::before,
section.conditions .section-label::before,
section.cta:not(.cta-light) .section-label::before,
section#clinics.clinics .section-label::before,
section#respite.respite-sec .section-label::before,
section.activities .section-label::before,
section.packages:not(.packages-light) .section-label::before,
section.pillars .section-label::before,
section.values .section-label::before {
  background: var(--gold-on-dark) !important;
}

/* ---- 2. Italic emphasis inside headings on dark sections -------------- */

header.page-header h1 em,
section.services .section-title em,
section.conditions .section-title em,
section.cta:not(.cta-light) .section-title em,
section.cta:not(.cta-light) .cta-title em,
section#contact.cta .cta-title em,
section#clinics.clinics .section-title em,
section#respite.respite-sec .section-title em,
section.activities .section-title em,
section.packages:not(.packages-light) .section-title em,
section.pillars .section-title em,
section.values .section-title em {
  color: var(--gold-on-dark) !important;
}

/* ---- 3. Muted notes sitting on charcoal ------------------------------- */

.respite-cta .rc-note { color: var(--stone-on-dark) !important; }

/* ---- 4. Card links ---------------------------------------------------- */
/* The blue grey read 2.45:1 on cream. */

.care-card-link { color: #4F6874 !important; }

/* ---- 5. Outline buttons sitting on dark sections ---------------------- */
/* .btn-outline and .pkg-cta-outline are charcoal on transparent, correct
   on cream and exactly 1:1 on a charcoal ground. Both were invisible. */

section.cta:not(.cta-light) .btn-outline,
section#contact.cta .btn-outline,
section.services .btn-outline,
section.conditions .btn-outline,
header.page-header .btn-outline,
.pkg-featured .pkg-cta-outline {
  border-color: rgba(221, 208, 187, 0.45) !important;
  color: var(--cream-light) !important;
}
section.cta:not(.cta-light) .btn-outline:hover,
section.services .btn-outline:hover,
section.conditions .btn-outline:hover,
header.page-header .btn-outline:hover {
  background: rgba(255, 255, 255, 0.08) !important;
}
.pkg-featured .pkg-cta-outline:hover {
  background: var(--cream-light) !important;
  color: var(--charcoal-dark) !important;
}

/* ---- 6. Gold small text on the mid charcoal cards --------------------- */
/* #706B63 is light enough that no gold reaches 4.5:1 against it, so the
   small labels take cream and only the large figures keep the gold. */

.service-card p[style*="horizon-gold"] { color: var(--cream-light) !important; }
.service-card p[style*="font-size:2.1rem"],
.service-card p[style*="font-size: 2.1rem"] { color: var(--gold-on-dark) !important; }

/* ---- 7. Display gold on charcoal ------------------------------------- */
/* The signature gold reads 2.77:1 on charcoal, just under the 3:1 that
   large text needs. #CEA871 is two shades lighter, reaches 3.23:1, and is
   close enough to the brand gold to be hard to tell apart. Small gold
   text on charcoal needs 4.5:1, which no near gold reaches, so it takes
   the soft gold already defined above. */

.hero-title em,
#heroRot em,
.pkg-featured .pkg-price-amount,
section.cta:not(.cta-light) .cta-title em,
h2 em[style*="horizon-gold"] { color: #CEA871 !important; }

section.services p[style*="horizon-gold"],
section.conditions p[style*="horizon-gold"] { color: var(--gold-on-dark) !important; }
