:root {
  --static-theme-shell: #151110;
}

html.site-theme-pending {
  min-height: 100%;
  background: var(--static-theme-shell);
}

html.site-theme-pending body {
  visibility: hidden;
}

html.site-theme-pending::before {
  content: "HOMICIDEZERO\A LEARN";
  position: fixed;
  inset: 0;
  z-index: 1;
  display: grid;
  place-content: center;
  color: #ffffff;
  font:
    800 1rem/1.15 Montserrat,
    system-ui,
    sans-serif;
  letter-spacing: 0.08em;
  text-align: center;
  white-space: pre;
}

html[data-site-theme="clinical-daylight"] {
  --header: #0b1f33;
  --header-2: #102a43;
  --ink: #102a43;
  --muted: #526779;
  --muted-light: #a9b8c5;
  --lede-light: #d8e2ea;
  --border: #cfdae2;
  --bg: #fbf8f0;
  --bg-soft: #eef5f4;
  --accent: #ef6c23;
  --accent-ink: #934019;
  --accent-soft: rgb(239 108 35 / 14%);
  --caution: #ef6c23;
  --caution-soft: rgb(239 108 35 / 14%);
  --caution-hover: #d95b18;
  --caution-ink: #ffffff;
  --stripe: rgb(20 122 118 / 28%);
}

html[data-site-theme="clinical-daylight"] body {
  background-image:
    linear-gradient(90deg, transparent 0 49.8%, rgb(20 122 118 / 5%) 50%, transparent 50.2%),
    linear-gradient(var(--bg), var(--bg));
  background-size:
    min(44rem, 90vw) 100%,
    auto;
  background-position: center;
  background-repeat: no-repeat;
}

/* Keep navy as the masthead anchor; the campaign hero itself joins the daylight
   surface so dark product imagery and previews remain the focal evidence. */
html[data-site-theme="clinical-daylight"] .hero-band {
  color: var(--ink);
  background: var(--bg);
  border-bottom: 1px solid var(--border);
}

html[data-site-theme="clinical-daylight"] .hero h1,
html[data-site-theme="clinical-daylight"] .hero .lede strong,
html[data-site-theme="clinical-daylight"] .hero .preview-after,
html[data-site-theme="clinical-daylight"] .hero-price {
  color: var(--ink);
}

html[data-site-theme="clinical-daylight"] .hero .lede,
html[data-site-theme="clinical-daylight"] .hero-note,
html[data-site-theme="clinical-daylight"] .hero-price-note {
  color: var(--muted);
}

html[data-site-theme="clinical-daylight"] .card,
html[data-site-theme="clinical-daylight"] .step,
html[data-site-theme="clinical-daylight"] .lesson,
html[data-site-theme="clinical-daylight"] .quote,
html[data-site-theme="clinical-daylight"] .feature {
  border-color: var(--border);
  box-shadow: 0 10px 30px rgb(11 31 51 / 8%);
}

html[data-site-theme="clinical-daylight"] .check,
html[data-site-theme="clinical-daylight"] .num {
  color: #147a76;
}

:where(a, button, [tabindex]):focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  inset-block-start: 0.5rem;
  inset-inline-start: 0.5rem;
  z-index: 2;
  padding: 0.75rem 1rem;
  color: var(--caution-ink);
  background: var(--caution);
  font-weight: 700;
  text-decoration: none;
  transform: translateY(-150%);
}

.skip-link:focus {
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}