@media (min-width:768px){
.top-navigation-bar .top-navigation-menu:has(> .top-navigation-menu-trigger){display:flex;align-items:center;justify-content:center;gap:4px;padding-right:0;}
.top-navigation-bar .top-navigation-menu > .top-navigation-bar-menu{width:auto;min-width:0;max-width:calc(100% - 32px);}
.top-navigation-bar .top-navigation-menu > .top-navigation-menu-trigger{order:1;flex:0 0 25px;position:relative;inset:auto;border-radius:6px;background:#edf4ee;color:#23613b;}
.top-navigation-bar .top-navigation-menu > .top-navigation-menu-trigger:hover{background:#dceadf;color:#19472b;}
.top-navigation-bar .top-navigation-menu > .top-navigation-bar-menu-helper{right:50%;transform:translateX(50%);}
}

/* Reserve the hero height before the custom carousel starts. Keep a compact
   native carousel available if the script is delayed or cannot load. */
body.in-index .homepage-box.before-carousel .wide-carousel > #carousel:not([hidden]) {
  --fm-native-banner-height: clamp(380px, calc((100vw - 40px) * .375), 474px);
  height: var(--fm-native-banner-height);
  overflow: hidden;
  visibility: hidden;
  animation: fm-banner-fallback 1ms 3s forwards;
}

body.in-index .homepage-box.before-carousel #carousel:not([hidden]) :is(.carousel-inner, .item, .item > a) {
  height: var(--fm-native-banner-height) !important;
}

body.in-index .homepage-box.before-carousel #carousel:not([hidden]) .item img {
  width: 100%;
  height: var(--fm-native-banner-height) !important;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 767px) {
  body.in-index .homepage-box.before-carousel .wide-carousel > #carousel:not([hidden]) {
    --fm-native-banner-height: calc(100vw - 40px);
  }
}

@keyframes fm-banner-fallback {
  from, to { visibility: visible; }
}
