/*
 * Kelly Anne Howard surface-aware contrast guard.
 * Loaded after all design styles so WordPress/Hello/Elementor global link colors
 * cannot create dark-on-dark or light-on-light interaction states.
 */

/* ---------- Dark surfaces: light foreground on interaction ---------- */
:where(
  .header,
  .hero,
  .hero-invitations,
  .intro,
  .practice-detail,
  .ways,
  .ways .help-0,
  .ways .help-1,
  .ways .help-3,
  .work,
  .project:not(.mistakes):not(.commercial),
  .lab,
  .lab-item,
  .strategy-workbench,
  .strategy-example,
  .consulting,
  .consult-response,
  .about,
  .contact,
  .contact form,
  .service-page,
  .service-hero,
  .service-body,
  .service-output,
  .service-end,
  .policy-page,
  footer
) a:is(:hover,:focus,:focus-visible,:active),
:where(
  .header,
  .hero,
  .hero-invitations,
  .intro,
  .practice-detail,
  .ways,
  .ways .help-0,
  .ways .help-1,
  .ways .help-3,
  .work,
  .project:not(.mistakes):not(.commercial),
  .lab,
  .lab-item,
  .strategy-workbench,
  .strategy-example,
  .consulting,
  .consult-response,
  .about,
  .contact,
  .contact form,
  .service-page,
  .service-hero,
  .service-body,
  .service-output,
  .service-end,
  .policy-page,
  footer
) button:is(:hover,:focus,:focus-visible,:active) {
  color:#f0f7fa !important;
  border-color:currentColor !important;
  text-decoration-color:currentColor !important;
}

/* Nested text and SVGs follow the corrected foreground. */
:where(main,header,footer) :is(a,button):is(:hover,:focus,:focus-visible,:active) :where(span,b,strong,em,small,p,svg,use) {
  color:inherit !important;
  border-color:currentColor !important;
  text-decoration-color:currentColor !important;
  fill:currentColor !important;
  stroke:currentColor !important;
}

/* ---------- Light surfaces: dark foreground on interaction ---------- */
:where(
  .ways .help-2,
  .use-cases,
  .strategy,
  .project.mistakes,
  .project.commercial,
  .service-example
) a:is(:hover,:focus,:focus-visible,:active),
:where(
  .ways .help-2,
  .use-cases,
  .strategy,
  .project.mistakes,
  .project.commercial,
  .service-example
) button:is(:hover,:focus,:focus-visible,:active) {
  color:#081b29 !important;
  border-color:currentColor !important;
  text-decoration-color:currentColor !important;
}

/* Dark islands nested inside the light strategy section. */
.strategy :where(.strategy-workbench,.strategy-example) a:is(:hover,:focus,:focus-visible,:active),
.strategy :where(.strategy-workbench,.strategy-example) button:is(:hover,:focus,:focus-visible,:active) {
  color:#f0f7fa !important;
}

/* ---------- Components whose own interaction changes the surface ---------- */
/* Light-background buttons need dark text. */
.service-button:is(:hover,:focus,:focus-visible,:active),
.lab-filters button[aria-pressed="true"],
.drag-handle:is(:hover,:focus,:focus-visible,:active),
.problems button[aria-pressed="true"],
.contact .submit:is(:hover,:focus,:focus-visible,:active),
.contact-options input:checked + span,
.contact-options input:checked + span:is(:hover,:focus,:focus-visible,:active) {
  color:#081b29 !important;
}

/* Dark-background selected controls need light text. */
.thinking-tabs button[aria-pressed="true"],
.thinking-tabs button[aria-pressed="true"]:is(:hover,:focus,:focus-visible,:active) {
  color:#f0f7fa !important;
}

/* ---------- Ways I can help: bind text to each card's actual surface ---------- */
.ways .help-card {
  text-decoration:none !important;
}
.ways .help-card > :where(span,p,b) { color:inherit !important; }
.ways .help-card.help-0,
.ways .help-card.help-1,
.ways .help-card.help-3,
.ways .help-card.help-0:is(:hover,:focus,:focus-visible,:active),
.ways .help-card.help-1:is(:hover,:focus,:focus-visible,:active),
.ways .help-card.help-3:is(:hover,:focus,:focus-visible,:active) {
  color:#f0f7fa !important;
}
.ways .help-card.help-2,
.ways .help-card.help-2:is(:hover,:focus,:focus-visible,:active) {
  background:#e7f0f8 !important;
  color:#081b29 !important;
}

/* ---------- Service evidence captions ---------- */
.service-page .service-evidence,
.service-page .service-evidence figcaption,
.service-page .service-evidence figcaption :where(a,span,em,strong) {
  color:#d6e8f5 !important;
}
.service-page .service-evidence figcaption a:is(:hover,:focus,:focus-visible,:active) {
  color:#f0f7fa !important;
  text-decoration-color:currentColor !important;
}
/* If an evidence block is placed inside a light service example, invert it. */
.service-page .service-example .service-evidence,
.service-page .service-example .service-evidence figcaption,
.service-page .service-example .service-evidence figcaption :where(a,span,em,strong),
.service-page .service-example .service-evidence figcaption a:is(:hover,:focus,:focus-visible,:active) {
  color:#081b29 !important;
}

/* ---------- Normal-state safeguards for known dark text links ---------- */
.hero-invitations .text-link,
.hero-invitations .text-link:visited,
.consult-response a,
.service-bridge a,
.contact .privacy-note a,
.policy-page a,
footer a {
  color:inherit;
}

/* Touch devices can retain hover after a tap. Keep foreground tied to surface. */
@media (hover:none), (pointer:coarse) {
  .ways .help-card:hover { transform:none !important; }
  .ways .help-card.help-0:is(:hover,:active,:focus),
  .ways .help-card.help-1:is(:hover,:active,:focus),
  .ways .help-card.help-3:is(:hover,:active,:focus) { color:#f0f7fa !important; }
  .ways .help-card.help-2:is(:hover,:active,:focus) { color:#081b29 !important; }
}
