.body-header-overlay::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: var(--z-index-header-overlay);
  pointer-events: auto;
  border-radius: var(--Overlay-Radius, 0);
  background: var(--Overlay-Default-Background, rgb(0 0 0 / 40%));
  backdrop-filter: var(--Background-Blur-400-24, 1.5rem);
}

.header-hamburger-overlay .header-navigation-container {
  display: none;
}

.section.header-logo-container,
.section.header-navigation-section-container,
.section.header-utilities-section-container {
  padding-block: var(--Header-Vertical-Padding, 24px);
  padding: var(--Header-Vertical-Padding, 24px) var(--Header-Horizontal-Padding-D-Ds, 24px);
}

.header-navigation-section-wrapper {
  position: fixed;
  width: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin: 0 auto;
  display: flex;
  justify-content: center;
  padding: var(--Header-Vertical-Padding-D-Ds, 24px) var(--Header-Horizontal-Padding-D-Ds, 24px);
}

.header-navigation-section-wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    var(--Unipol-Azure-Blue-800, rgb(0 28 53 / 80%)) 0%,
    var(--Core-Null-000, rgb(17 17 17 / 0%)) 100%
  );
  opacity: 0;
  transition: opacity 0.35s ease;
}

.header-navigation-section-wrapper.header-sticky-gradient::before {
  opacity: 1;
}

.header-navigation-section {
  display: flex;
  justify-content: center;
}

.header-navigation-section .navigation-pill-container {
  position: relative;
  display: flex;
  width: max-content;
  align-items: center;
  backdrop-filter: blur(calc(var(--P24, 24px) / 2));
  background: var(--Header-Background);
  padding: var(--Header-Navigation-Vertical-Padding, 4px) var(--Header-Navigation-Horizontal-Padding, 4px);
  border-radius: var(--Header-Radius, 9999px);
  gap: var(--Header-Horizontal-Gap, 4px);
  transition: width 0.25s ease-in-out;
}

.header-box-container {
  position: absolute;
  top: 90%;
  width: 100%;
  margin-top: var(--Category-Menu-Navigation-Top-Vertical-Padding, 16px);
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform-origin: top;
  will-change: max-height, opacity;
  transition: max-height 0.3s ease,
  opacity 0.3s ease;
}

.nav-header-sticky .header-box-container {
  top: 90%;
}

.nav-header-sticky .navigation-pill-container {
  box-shadow: var(--Drop-Shadow-100);
}

.mobile-nav-box-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--Navigation-Menu-Widget-Content-Gap, 40px);
}

.header-box-content {
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--Navigation-Menu-Widget-Gap-Banner, 0.5rem);
  transition: height 0.45s ease, opacity 0.45s ease;
  overflow: hidden;
  height: 0;
  opacity: 0;

  & .header-box-wrapper {
    background-color: var(--Quote-Tool-Full-Quote-Tool-Background, #F9F9F7);
    border-radius: var(--Quote-Tool-Radius, 16px);

    &:has(> .item-menu-wrapper) {
      display: flex;
      flex-wrap: wrap;
      row-gap: var(--Category-Menu-Navigation-Gap-Link, 1.25rem);
      padding: var(--Category-Menu-Navigation-Top-Vertical-Padding-Simple, 1.5rem) var(--Category-Menu-Navigation-Horizontal-Padding, 1rem) var(--Category-Menu-Navigation-Bottom-Vertical-Padding, 1.25rem) var(--Category-Menu-Navigation-Horizontal-Padding, 1rem);
      padding-left: calc(var(--Category-Menu-Navigation-Horizontal-Padding, 1rem) + var(--Category-Menu-Navigation-Horizontal-Padding-List, 1.25rem));
      justify-content: flex-start;
      align-items: flex-start;
      align-self: stretch;
      background-color: var(--Category-Menu-Navigation-Background, var(--Background-Neutral-Subtle-Fixed, #f9f9f7));
      border-radius: var(--Category-Menu-Navigation-Radius, 1rem);

      & > .item-menu-wrapper {
        display: flex;
        order: 1;
      }

      & > .highlight-list-menu-wrapper {
        display: flex;
        order: 2;
        align-self: flex-start;
        flex: 0 0 33%;
      }

      & > .category-link-button-wrapper {
        order: 3;
        flex: 0 0 100%;
      }

      & .item-menu-cont {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: var(--Category-Menu-Navigation-Gap-Link, 1.25rem);

        & .item-menu-container {
          display: flex;
          flex-direction: column;
          align-items: flex-start;
          gap: var(--Category-Menu-Navigation-Gap-Link, 1.25rem);
        }
      }
    }
  }
}

.mobile-nav-box-container button.navigation-pill {
  color: var(--Link-Button-Navigation-Link-Navigation-Default-Text, #63727D);
  font: var(--Single-Line-Subheading-Link);
}

.mobile-nav-box-container .header-box-content {
  display: block !important;
  height: auto !important;
  opacity: 1 !important;
}

.header-box-container.is-open {
  max-height: 95vh;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  border-radius: var(--Quote-Tool-Radius, 16px);

  &:has(.header-box-wrapper > .item-menu-wrapper) {
    border-radius: var(--Category-Menu-Navigation-Radius, 1rem);
  }
}

.header-box-container.is-open .header-box-content {
  width: 100%;
  height: auto;
  opacity: 1;
}

.header-box-container[data-header-box-type="quote-tool"]:is(.is-open, .is-closing) {
  overflow: visible;

  .header-box-content {
    overflow: visible;
  }
}

.header-box-container.is-closing {
  visibility: visible;
  pointer-events: none;
}

.header-box-container.is-default-open:is(.is-open, .is-closing) {
  min-height: 360px;
}

.header-box-container.is-default-open:is(.is-open, .is-closing) .header-box-content {
  min-height: 360px;
}

.navigation-pill-container .navigation-pill-wrapper .header-nav-pill-active,
.navigation-pill-container .navigation-pill-wrapper .header-nav-pill-active:hover,
.aziende-background .navigation-pill-container .navigation-pill-wrapper .header-nav-pill-active,
.aziende-background.navigation-pill-container .navigation-pill-wrapper .header-nav-pill-active:hover {
  background-color: var(--Navigation-Pill-Active-Background, #f9f9f7);
  color: var(--Navigation-Pill-Active-Text);
}

.header-sticky-gradient {
  background: transparent;
}

.navigation-pill-wrapper {
  display: flex;
  flex-shrink: 0;
  opacity: 1;
  transform: translateX(0) scale(1);
  transform-origin: left center;
  filter: blur(0);
  transition:
    opacity 0.24s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
    filter 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.navigation-pill-wrapper.nav-pill-hidden {
  opacity: 0;
  transform: translateX(-6px) scale(0.96);
  filter: blur(2px);
  pointer-events: none;
}

.header-navigation-section .navigation-pill:focus {
  outline: none;
}

.header-navigation-section .navigation-pill:focus-visible {
  outline: var(--Stroke-S) solid var(--Border-Key-Brand-Mild-Focused);
}

.second-pill-right-icon {
  display: none;
}

.nav-header-sticky .second-pill-right-icon {
  display: inline-flex;
}

.header-logo-wrapper,
.header-utilities-section-wrapper {
  transition: opacity 0.35s ease, transform 0.35s ease;
}

.header-chrome-hidden .header-logo-wrapper,
.header-chrome-hidden .header-utilities-section-wrapper {
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .header-logo-wrapper,
  .header-utilities-section-wrapper {
    transition: none;
  }
}

:is(.header-box-open, .header-navigation-expanded) {
  position: fixed !important;
  top: 0;
  z-index: var(--z-index-header);
}

:is(.header-box-open, .header-navigation-expanded) .nav-header-sticky {
  position: unset;
  width: 100%;
  padding: 0;
  left: unset;
  transform: unset;
}

.header-box-open:has(
  .header-box-container:is(.is-open, .is-closing)
) .header-sticky-gradient::before {
  opacity: 0;
}

.header-navigation-expanded:not(
  :has(.header-box-container:is(.is-open, .is-closing))
) .header-sticky-gradient::before {
  opacity: 1;
}

.header-box-open:has(
  .header-box-container:is(.is-open, .is-closing)
) .nav-header-sticky .header-box-container {
  margin-top: var(
    --Category-Menu-Navigation-Top-Vertical-Padding,
    16px
  );
}

button.un-close-btn {
  cursor: pointer;
}

.header-box-container button.un-close-btn {
  display: flex;
  width: var(--Icon-M, 24px);
  height: 24px;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  position: absolute;
  right: 16px;
  top: 16px;
}

.offer-carousel-wrapper {
  display: flex;
  flex-direction: column;
  border-radius: var(--Carousel-Offer-Radius, 16px);
}

.offer-carousel-container.desktop-offer-carousel,
.offer-carousel.block,
.offer-carousel.block > div {
  border-radius: var(--Carousel-Offer-Radius, 16px);
}

div[id^="header-box-contact-tool"] .un-close-btn,
div[id^="header-box-assicurazioni-servizi"] .un-close-btn {
  display: none;
}

.aziende-background .navigation-pill-container {
  border-radius: var(--Header-Radius, 9999px);
  background: rgb(0 28 53 / 75%);
  backdrop-filter: blur(calc(var(--P24, 24px) / 2));
}

.aziende-background .navigation-pill-container .navigation-pill{
  color: #F9F9F7;
}