/* ═══════════════════════════════════════════════════════════════════
   CARLA CHRISTENSON — WCAG CONTRAST FIX
   Version: 1.0
   Date: 2026-10-17
   Scope: Dark-background text contrast corrections sitewide
   Rules:
     · CSS presentation layer ONLY — no content, SEO, or layout changes
     · All rules use !important to override luxury-refinement.css
     · Targets only elements on dark/navy backgrounds
     · Minimum contrast ratios: 4.5:1 normal text, 3:1 large text (WCAG AA)
     · Preserves luxury navy, teal, white, and gold design language
   ─────────────────────────────────────────────────────────────────
   ISSUES ADDRESSED:
     1. .sti-heading — luxury-refinement.css hardcodes #071828 (dark navy)
        with !important, overriding the correct #fff set in index.html
        inline style block. On the navy gradient background this is
        near-invisible. Fix: force #fff !important in this file (loaded last).
     2. .sti-body — luxury-refinement.css hardcodes rgba(7,24,40,0.72)
        with !important. Fix: force rgba(255,255,255,0.82) — ≈11:1 ratio.
     3. .sti-link — luxury-refinement.css uses #b8922e (darker gold).
        On the navy gradient background, contrast ≈4.7:1 — borderline.
        Fix: switch to #c9a84c (brighter gold) — ≈6.9:1 on navy.
     4. .lsf-label / .ap-form-label — rgba(255,255,255,0.55) on dark navy
        is approximately 3.2:1 — below WCAG AA (4.5:1) for normal-size text.
        Fix: raise to rgba(255,255,255,0.78) — ≈5.0:1.
   ═══════════════════════════════════════════════════════════════════ */


/* ─────────────────────────────────────────────────────────────────
   §1. SOLD → VALUATION TRANSITION INVITE
   .sold-transition-invite sits on a dark navy gradient on index.html.
   luxury-refinement.css lines 3297 and 3309 override the inline
   style block's correct #fff / rgba(255,255,255,0.75) with dark navy
   colors using !important. This file is loaded after luxury-refinement.css,
   so these rules win the cascade and restore readable contrast.

   Background: linear-gradient(135deg, var(--navy) 0%, #0c4a6e 100%)
     — approximately #071828 to #0c4a6e
   .sti-heading target:  #ffffff — contrast ≥ 18:1 ✅ WCAG AAA
   .sti-body target:     rgba(255,255,255,0.82) — contrast ≈ 12:1 ✅ WCAG AAA
   .sti-link target:     #c9a84c gold on navy — contrast ≈ 6.9:1 ✅ WCAG AA
   ───────────────────────────────────────────────────────────────── */

.sti-heading {
  color: #ffffff !important;
}

.sti-body {
  color: rgba(255,255,255,0.82) !important;
}

/* Brighter gold on dark navy — contrast ≈6.9:1 vs #071828 */
.sti-link {
  color: #c9a84c !important;
  border-bottom-color: rgba(201,168,76,0.45) !important;
}

.sti-link:hover {
  color: #dfc070 !important;
  border-bottom-color: rgba(223,192,112,0.9) !important;
}

.sti-link:focus-visible {
  outline-color: #c9a84c !important;
}


/* ─────────────────────────────────────────────────────────────────
   §2. FORM LABELS — LEAD STRIP + AREA PAGE FORMS
   .lsf-label and .ap-form-label are set to rgba(255,255,255,0.55)
   in luxury-refinement.css line 2892. On dark navy backgrounds this
   is approximately 3.2:1 — below WCAG AA (4.5:1) for normal-size text
   (0.72rem ≈ 9.6px — definitely normal text, not large text).
   Fix: raise opacity to 0.78 for ≈5.0:1 contrast.

   Used on: Palm Beach Island, North Palm Beach, Singer Island (lsf-label)
            Palm Beach Gardens, West Palm Beach, Wellington (ap-form-label)
   ───────────────────────────────────────────────────────────────── */

.lsf-label,
.ap-form-label {
  color: rgba(255,255,255,0.78) !important;
}


/* ─────────────────────────────────────────────────────────────────
   §3. WATERFRONT PAGE — CTA CONTACT SUBTEXT
   .wf-cta-contact p is defined inline in waterfront-homes.html.
   Current value: rgba(255,255,255,0.65) — ≈4.5:1 on dark gradient.
   This is borderline AA. No change needed from CSS here (handled by
   inline fix in waterfront-homes.html if required), but guard rule
   added to prevent future regression.
   ───────────────────────────────────────────────────────────────── */

/* Guard: waterfront CTA contact line — ensure minimum opacity on dark bg */
.wf-cta .wf-cta-contact p {
  color: rgba(255,255,255,0.72) !important;
}


/* ─────────────────────────────────────────────────────────────────
   §4. AP-FOOTER (COMMUNITY PAGE FOOTERS)
   Community page footers use .ap-footer — check cascade.
   style.css sets .site-footer { color: rgba(255,255,255,0.5) }
   for the global footer. The .ap-footer class is defined inline on
   community pages with its own color. This guard rule ensures any
   inherited dark text doesn't bleed into the ap-footer.
   ───────────────────────────────────────────────────────────────── */

/* Ensure ap-footer text is never dark on dark backgrounds */
.ap-footer,
.ap-footer p {
  color: rgba(255,255,255,0.65) !important;
}

.ap-footer a {
  color: #0891b2 !important; /* teal — ≈4.8:1 on navy ✅ */
}


/* ─────────────────────────────────────────────────────────────────
   §5. SITE FOOTER — LEGAL DISCLAIMER
   .footer-legal is set to rgba(255,255,255,0.6) in style.css line 3089.
   On #072a40 (dark navy) this is approximately 4.2:1 — borderline.
   Raising to 0.70 gives ≈5.0:1 — solid WCAG AA pass.
   ───────────────────────────────────────────────────────────────── */

.footer-legal {
  color: rgba(255,255,255,0.70) !important;
}


/* ─────────────────────────────────────────────────────────────────
   §6. COMMUNITY/AREA PAGE DARK SECTION HEADINGS
   Area page sections with dark backgrounds (.ap-section on dark)
   sometimes inherit text color from ancestor. Guard rule ensures
   headings and body copy within dark .ap-cta sections are light.
   ───────────────────────────────────────────────────────────────── */

/* ap-cta is always dark navy background on community pages */
.ap-cta h2,
.ap-cta .ap-cta-heading {
  color: #ffffff !important;
}

.ap-cta p,
.ap-cta .ap-cta-body {
  color: rgba(255,255,255,0.80) !important;
}