/* ==== SCSS Utils ==== */
/* ========== Layout & Grid ========== */
/* ========== Fonts ========== */
/* ========== Elderplan Color Palette ========== */
/* Based on Figma designs - 2026-05-18 */
/* ========== Semantic Color Aliases ========== */
/* ========== Spacing ========== */
/* ========== Borders ========== */
/* ========== Z-Index ========== */
/* ========== SVGS ========== */
/* ==== SCSS Utils ==== */
/* ========== Font Weights ========== */
/* ========== Font Sizes ========== */
/* ==== SCSS Utils ==== */
/* ========== Breakpoints for Mixins ========== */
/* ======= Media Queries ======= */
/* Mobile */
/* Tablet */
/* Desktop */
/* Desktop XL */
/* Desktop XXL */
/* Custom media queries */
/* ==== SCSS Utils ==== */
/* ==== SCSS Utils ==== */
/* ======= Media ======= */
/* ======= SVG ======= */
/* ======= Typography ======= */
/* ======= Storybook Goodies ======= */
/* ======= Form Spacing ======= */
/* ======= Input Styles ======= */
/* ==== SCSS Utils ==== */
/* ======= Buttons ======= */
/* Base button styles */
/* Primary button styles */
/* Secondary button styles */
/* Blue button styles */
/* Green button styles */
/* Link button styles */
/* Button Icon styles */
/* Button Icon styles */
/* ==== SCSS Utils ==== */
/* ======= Layout ======= */
/* ======= FLEXBOX MIXINS ======= */
/* ======= GRID MIXINS ======= */
/* ==== SCSS Utils ==== */
/* MJ 7.17.24: Only call utilites like variable definitions and mixins.
* ! Do not add any class or ID selects, or it will render output into EVERY .css file.
* Add styles to global.scss instead to add styles globally.
*/
.site-logo {
  position: relative;
  display: block;
  width: 300px;
  aspect-ratio: 4.8/1;
  container-type: size;
}
.site-logo a {
  display: flex;
  position: absolute;
  z-index: 1;
  width: 100cqw;
  height: 100cqh;
  justify-content: center;
  align-items: center;
}
.site-logo svg {
  display: block;
  width: 100cqi;
  height: auto;
  object-fit: contain;
}

#site-navigation .menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}
@media (min-width: 783px) {
  #site-navigation .menu {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
}
#site-navigation .menu-item {
  margin: 0;
  padding: 0;
}
#site-navigation .menu-item a {
  display: block;
  color: inherit;
  text-decoration: none;
}
#site-navigation .menu-item a:hover, #site-navigation .menu-item a:focus {
  text-decoration: underline;
}
#site-navigation .current-menu-item a,
#site-navigation .current_page_item a {
  font-weight: 700;
}
#site-navigation .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
  padding-top: 0.5rem;
  padding-left: 1rem;
}

@media (max-width: 782px) {
  body.mobile-menu-open {
    background-color: #2E8500;
  }
  body.mobile-menu-open main,
  body.mobile-menu-open footer {
    display: none;
  }
}
.mobile-menu {
  display: none;
  background-color: #2E8500;
  color: #ffffff;
}
@media (max-width: 782px) {
  .mobile-menu.is-open, .mobile-menu-open .mobile-menu {
    display: block;
  }
}
@media (min-width: 783px) {
  .mobile-menu {
    display: none;
  }
}

.mobile-menu__inner {
  padding-top: 1rem;
  padding-bottom: 1.5rem;
}

.mobile-menu__items,
.mobile-menu__sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-menu__items {
  display: grid;
  gap: 0.75rem;
}

.mobile-menu__sub-menu {
  display: grid;
  gap: 0.5rem;
  padding-top: 0.5rem;
  padding-left: 1rem;
}

.mobile-menu__link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.header {
  background-color: #ffffff;
}

.header-layout {
  display: flex;
  gap: 1rem;
}

.header-section__first {
  order: 1;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-grow: 1;
}
@media (min-width: 783px) {
  .header-section__first {
    flex-grow: 0;
  }
}
.header-section__first .site-logo {
  width: 216px;
  height: 100px;
  aspect-ratio: unset;
}
@media (min-width: 783px) {
  .header-section__first .site-logo {
    width: 417px;
    height: 172px;
  }
}

.header-section__second {
  display: none;
}
@media (min-width: 783px) {
  .header-section__second {
    order: 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-grow: 1;
  }
}

.header-section__third {
  order: 2;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
@media (min-width: 783px) {
  .header-section__third {
    display: none;
  }
}
/*# sourceMappingURL=header.css.map */