/* Overlay the shared header on hero images on all WordPress pages. */
body.page:not(.elementor-editor-active):not(.elementor-editor-preview) {
  position: relative;
}

body.page:not(.elementor-editor-active):not(.elementor-editor-preview) > .elementor-25 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
}

/* Replace the previous fixed compensation of -110px / -100px. */
body:not(.elementor-editor-active):not(.elementor-editor-preview) .elementor-25 #header_section {
  margin-bottom: 0;
}

/* Articles have no full-width hero: keep the header above the article content. */
body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) > .elementor-25 {
  position: relative;
  width: 100%;
  z-index: 100;
  background-color: #fff;
}

body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section {
  border-color: rgb(0 0 0 / 20%);
}

body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .eael-simple-menu li > a,
body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .eael-simple-menu-toggle-text,
body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .eael-simple-menu-toggle i,
body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .elementor-social-icon i {
  color: #000;
}

body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .eael-simple-menu li > a > span svg,
body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .eael-simple-menu-toggle svg,
body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .elementor-social-icon svg {
  fill: #000;
}

body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) #header_section .elementor-element-8ae22a2 > .elementor-element-populated {
  border-color: rgb(0 0 0 / 20%);
}

/* Scope article colors to main; the shared footer and other pages keep their palette. */
body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) main {
  --e-global-color-text: #000;
  --e-global-color-accent: #000;
  color: #000;
}

body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) main :is(
  h1, h2, h3, h4, h5, h6, p, li, blockquote, figcaption, dt, dd, th, td,
  .elementor-widget-text-editor, .elementor-heading-title
) {
  color: #000 !important;
}

body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) main .elementor-widget-text-editor :is(a, span, strong, b, em) {
  color: #000 !important;
}

body.single-post:not(.elementor-editor-active):not(.elementor-editor-preview) main .elementor-widget-text-editor a {
  text-decoration: underline;
}