/* ============================================================
   SEF v1.0.4 — header theme-button context fix
   On internal pages, the light-theme toggle keeps the white/dark-header
   treatment while the header is over the purple hero. It only switches
   to the purple treatment after the header reaches the white content area.
============================================================ */
@media (min-width: 901px) {
  html.light-mode #site-header:not(.scrolled) .btn-theme,
  html.light-mode #site-header.sef-over-dark-section .btn-theme {
    background: rgba(255,255,255,0.10) !important;
    border-color: rgba(255,255,255,0.28) !important;
    color: #FFFFFF !important;
  }

  html.light-mode #site-header:not(.scrolled) .btn-theme:hover,
  html.light-mode #site-header.sef-over-dark-section .btn-theme:hover {
    background: rgba(255,255,255,0.22) !important;
    border-color: rgba(255,255,255,0.44) !important;
  }

  html.light-mode #site-header.sef-over-light-section .btn-theme,
  html.light-mode #site-header.scrolled:not(.sef-over-dark-section) .btn-theme {
    background: rgba(76,22,90,0.10) !important;
    border-color: rgba(76,22,90,0.25) !important;
    color: #4C165A !important;
  }

  html.light-mode #site-header.sef-over-light-section .btn-theme:hover,
  html.light-mode #site-header.scrolled:not(.sef-over-dark-section) .btn-theme:hover {
    background: rgba(76,22,90,0.18) !important;
  }
}