/* TwinPare sitewide theme hardening — 2026-09-01
 * Loaded after the main section and Light Mode styles. This file only fixes
 * components whose local Dark Mode styling otherwise overrides the global
 * Light Mode palette. Dark Mode remains unchanged unless explicitly noted. */

/* Above-the-fold first-paint hardening.
 * Hero copy/product imagery must be readable immediately instead of spending the
 * first ~700 ms inside the generic reveal animation. Below-the-fold reveal motion
 * remains unchanged. This also prevents screenshots and real users from seeing an
 * apparently blank/low-contrast hero during initial render. */
:is(.app-hero,.v2-hero) .reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

html[data-color-mode="light"] :is(.v2-eyebrow,.v2-card > span) {
  color: #6540A8 !important;
}

html[data-color-mode="light"] .v2-brand-line {
  color: #514B5C !important;
}

html[data-color-mode="light"] .v2-signal {
  color: #2B2337 !important;
  background: rgba(255,255,255,.94) !important;
  border-color: rgba(67,54,95,.16) !important;
  box-shadow: 0 10px 28px rgba(42,31,66,.08);
}

html[data-color-mode="light"] .v2-health__copy h3 {
  color: #21192D !important;
}

html[data-color-mode="light"] .v2-beta-note {
  background: rgba(0,126,152,.06) !important;
  border-color: rgba(0,126,152,.18) !important;
}

html[data-color-mode="light"] .v2-beta-note strong {
  color: #006A80 !important;
}

html[data-color-mode="light"] .v2-context__flow :is(span,strong) {
  color: #2B2337 !important;
  background: #F1EDF8 !important;
  border-color: rgba(92,79,156,.16) !important;
}

html[data-color-mode="light"] .v2-context__flow strong {
  background: linear-gradient(135deg, rgba(109,70,182,.10), rgba(0,126,152,.07)) !important;
}

html[data-color-mode="light"] .v2-context__flow b,
html[data-color-mode="light"] .v2-bridge__arrow {
  color: #6540A8 !important;
}

html[data-color-mode="light"] .v2-research-card span {
  color: #6540A8 !important;
}

html[data-color-mode="light"] .v2-research-card small {
  color: #514B5C !important;
}

html[data-color-mode="light"] .v2-bridge__science {
  color: #21192D !important;
  background: #F1EDF8 !important;
  border: 1px solid rgba(92,79,156,.15);
}

html[data-color-mode="light"] .v2-bridge__science span {
  color: #6540A8 !important;
}

html[data-color-mode="light"] .v2-bridge__science strong {
  color: #21192D !important;
}

html[data-color-mode="light"] .v2-bridge__science small,
html[data-color-mode="light"] .v2-origin__statement span {
  color: #5B5568 !important;
}

html[data-color-mode="light"] .v2-trust a {
  color: #5D35A8 !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__eyebrow {
  color: #6540A8 !important;
}

html[data-color-mode="light"] body.theme-health :is(.health-v2__lead,.health-v2__support,.health-v2__status-note) {
  color: #514B5C !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__beta-band {
  background: rgba(0,126,152,.055) !important;
  border-color: rgba(0,126,152,.16) !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__beta-band strong {
  color: #006A80 !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__flow {
  background: rgba(255,255,255,.84) !important;
  border-color: rgba(0,126,152,.14) !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__flow div span {
  color: #25313A !important;
  background: #EDF1F8 !important;
  border: 1px solid rgba(67,54,95,.10);
}

html[data-color-mode="light"] body.theme-health .health-v2__flow :is(strong,em) {
  color: #2B2337 !important;
  background: rgba(109,70,182,.09) !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__flow b {
  color: #6540A8 !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__area small {
  color: #006A80 !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__badge--beta {
  color: #006A80 !important;
  background: rgba(0,126,152,.10) !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__badge--verify {
  color: #765200 !important;
  background: rgba(168,116,0,.12) !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__badge--dev {
  color: #5D35A8 !important;
  background: rgba(109,70,182,.10) !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__research-card {
  color: #21192D !important;
  background: #F1EDF8 !important;
  border-color: rgba(92,79,156,.16) !important;
  box-shadow: 0 14px 36px rgba(46,36,78,.06);
}

html[data-color-mode="light"] body.theme-health .health-v2__research-card span {
  color: #5B5568 !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__research-card strong {
  color: #21192D !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__research-card b {
  color: #6540A8 !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__privacy a {
  color: #5D35A8 !important;
}

html[data-color-mode="light"] body.theme-health .health-v2__final-inner strong {
  color: #21192D !important;
}

/* Research Light Mode hardening.
 * The Research overview deliberately keeps a dark photographic hero even when the
 * surrounding page is light. This guarantees a premium visual boundary and avoids
 * the dark-text-on-dark-photo failure observed in Chrome after cached CSS updates. */
html[data-color-mode="light"] body.theme-research .research-overview-hero {
  background:
    radial-gradient(circle at 13% 24%, rgba(0,229,255,.07), transparent 28%),
    radial-gradient(circle at 86% 22%, rgba(92,107,192,.12), transparent 34%),
    linear-gradient(180deg, rgba(16,14,34,.24), rgba(16,14,34,.06)),
    #100E22 !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero::before {
  background:
    linear-gradient(90deg,
      rgba(16,14,34,.14) 0%,
      rgba(16,14,34,.28) 44%,
      rgba(16,14,34,.78) 78%,
      rgba(16,14,34,1) 100%),
    linear-gradient(180deg,
      rgba(16,14,34,.16) 0%,
      rgba(16,14,34,.05) 50%,
      rgba(16,14,34,.78) 82%,
      rgba(16,14,34,.98) 100%),
    url('/images/twins-hub/science/hero-v2.jpg') left 42% / auto 100% no-repeat !important;
  opacity: .50 !important;
  filter: saturate(.90) contrast(1.02) !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero::after {
  background:
    linear-gradient(270deg,
      rgba(16,14,34,.10) 0%,
      rgba(16,14,34,.26) 44%,
      rgba(16,14,34,.76) 78%,
      rgba(16,14,34,1) 100%),
    linear-gradient(180deg,
      rgba(16,14,34,.16) 0%,
      rgba(16,14,34,.05) 50%,
      rgba(16,14,34,.78) 82%,
      rgba(16,14,34,.98) 100%),
    url('/images/twins-hub/science/hero-v2.jpg') right 42% / auto 100% no-repeat !important;
  opacity: .46 !important;
  filter: saturate(.82) contrast(.98) !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner {
  text-shadow: 0 2px 28px rgba(8,8,24,.42) !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner > h1 {
  color: #FFFFFF !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner > .hero-support-copy {
  color: #E1DDEA !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner > .breadcrumbs,
html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner > .breadcrumbs a,
html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner > .breadcrumbs strong,
html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner > .breadcrumbs span {
  color: #D4CFDE !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .app-hero__inner > .badge {
  color: #E8D9FF !important;
  background: rgba(187,134,252,.13) !important;
  border-color: rgba(212,178,255,.30) !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .medical-disclaimer {
  color: #40384D !important;
  background: rgba(255,255,255,.94) !important;
  border-color: rgba(92,79,156,.20) !important;
  box-shadow: 0 10px 30px rgba(8,8,24,.18);
  text-shadow: none !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .research-quick-nav {
  background: rgba(16,14,34,.88) !important;
  border-color: rgba(187,134,252,.24) !important;
  box-shadow: 0 14px 38px rgba(8,8,24,.22) !important;
  text-shadow: none !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .research-quick-nav__label {
  color: rgba(255,255,255,.62) !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .research-quick-nav a {
  color: #F1ECF8 !important;
  background: rgba(92,107,192,.10) !important;
  border-color: rgba(187,134,252,.22) !important;
}

html[data-color-mode="light"] body.theme-research .research-overview-hero .research-quick-nav a:hover {
  color: #FFFFFF !important;
  background: rgba(187,134,252,.14) !important;
  border-color: rgba(187,134,252,.42) !important;
}

/* Highlights and all lower Research surfaces remain genuinely light. */
html[data-color-mode="light"] body.theme-research .research-highlights {
  border-color: rgba(92,79,156,.16) !important;
  background: linear-gradient(145deg,rgba(255,255,255,.92),rgba(245,242,252,.95) 58%,rgba(255,255,255,.90)) !important;
  box-shadow: 0 22px 62px rgba(46,36,78,.10) !important;
  text-shadow: none !important;
}

html[data-color-mode="light"] body.theme-research .research-highlights :is(h2,h3,strong) {
  color: #1C1726 !important;
}

html[data-color-mode="light"] body.theme-research .research-highlights__boundary {
  color: #514B5C !important;
  background: rgba(255,255,255,.88) !important;
  border-color: rgba(92,79,156,.18) !important;
}

html[data-color-mode="light"] body.theme-research :is(.research-highlights__eyebrow,.research-highlight-card__eyebrow) {
  color: #6540A8 !important;
}

html[data-color-mode="light"] body.theme-research .research-highlight-card {
  background: rgba(255,255,255,.94) !important;
  border-color: rgba(92,79,156,.16) !important;
  box-shadow: 0 16px 42px rgba(46,36,78,.08) !important;
}

html[data-color-mode="light"] body.theme-research .research-highlight-card :is(p,.research-highlight-card__meta) {
  color: #514B5C !important;
}

html[data-color-mode="light"] body.theme-research .research-highlight-card__link {
  color: #5D35A8 !important;
}

/* Research topic cards and series headings need explicit inherited contrast in
 * light mode because some historical component styles still carry dark tokens. */
html[data-color-mode="light"] body.theme-research .research-series-index :is(.section-header h2,.article-card--research h2,.article-card--research h3) {
  color: #1C1726 !important;
}

html[data-color-mode="light"] body.theme-research .research-series-index :is(.section-header p,.article-card--research p,.article-card__meta) {
  color: #514B5C !important;
}

@media (max-width: 760px) {
  html[data-color-mode="light"] body.theme-research .research-overview-hero::before {
    opacity: .34 !important;
  }
  html[data-color-mode="light"] body.theme-research .research-overview-hero::after {
    opacity: .28 !important;
  }
}
