.hmb-button[data-astro-cid-xulqxona] {
  width: var(--fs-m);
  aspect-ratio: 1;
  position: relative;
  z-index: 1;

  & #hmb-button-checkbox {
    width: 1px;
    height: 1px;
    position: absolute;
    opacity: 0;
    pointer-events: none;
    background-color: #0000;
    border: none;
    outline: none;
  }

  & .hmb-button__label {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    position: relative;
    cursor: pointer;

    & span {
      background-color: var(--dolphin);
      width: 100%;
      height: 8%;
      display: block;
      border-radius: 50px;
    }
  }

  &:has(input:focus-visible) {
    outline: var(--o-dolphin-xs);
    outline-color: var(--blue-haze);
    outline-offset: var(--space-3xs);
  }

  &:has(input:checked) {
    & .hmb-button__label {
      justify-content: center;

      & span {
        position: absolute;

        &:first-child {
          rotate: 45deg;
        }

        &:nth-child(2) {
          opacity: 0;
        }

        &:nth-child(3) {
          rotate: -45deg;
        }
      }
    }
  }
}
.base-link {
    display: grid;
    place-items: center;
    font-size: var(--fs-s);
    text-transform: capitalize;

    &.base-link--magenta {
        color: var(--amaranth);
    }
    
    &.base-link--melanze {
        color: var(--melanze);
    }
    
    &.base-link--maroon-flush {
        color: var(--maroon-flush);
    }
    
    &.base-link--hibiscus,
    &.base-link--is-active {
        color: var(--hibiscus);
    }
}


@media (width >= 1025px) {
    .base-link {
        font-size: var(--fs-xs);
    }
}

@media (prefers-reduced-motion: no-preference) {
    .base-link {
        transition: color var(--tr-sx);

        path {
            transition: fill var(--tr-xs);
        }

        &:hover {
            color: var(--blue-haze);
            font-weight: 600;

            path {
                fill: var(--blue-haze);
            }
        }
    }
}
.main-nav[data-astro-cid-4434shp5] {
  background-image: var(--gradient-main-nav);
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: var(--space-l);
  position: sticky;
  top: 0;
  z-index: 2;

  &:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    backdrop-filter: blur(1px);
    z-index: -1;
  }

  & a {
    display: grid;
    place-items: center;
  }

  & .main-nav__logo {
    width: 90%;
    justify-content: flex-start;
  }

  & .nav-list {
    display: flex;
    justify-content: center;
    align-items: center;

    & .nav-item {
      & .nav-item__a {
        font-size: var(--fs-s);
        text-transform: capitalize;
      }
    }

    &.nav-list--main {
      width: min(100%, 478px);
      height: 100dvh;
      padding-top: var(--space-m);
      flex-direction: column;
      gap: var(--space-s);
      position: fixed;
      right: -100%;
      top: 0;
      transition: var(--tr-s);
      overflow-y: auto;
      scrollbar-color: var(--dolphin) var(--baltic-sea);
      scrollbar-width: thin;
    }

    &.nav-list--social {
      width: 100%;
      justify-content: flex-end;
      gap: var(--space-xs);

      & .nav-item {
        flex-shrink: 0;
      }
    }
  }

  & .main-nav__logo, & .nav-list.nav-list--social {
    position: relative;
    z-index: 1;
  }

  & .hmb-button {
    flex-shrink: 0;
  }

  &:has(input:checked) {
    & .nav-list {
      &.nav-list--main {
        background-color: var(--baltic-sea);
        right: 0;
      }
    }
  }

  &.main-nav--fixed {
    width: var(--calc-w);
    position: fixed;
  }
}

@media (width >= 1025px) {
  .main-nav[data-astro-cid-4434shp5] {
    & .main-nav__logo {
      & svg {
        width: var(--fs-xl);
      }
    }

    & .nav-list {
      &.nav-list--main {
        & .nav-item {
          & .nav-item__a {
            font-size: var(--fs-xs);
          }
        }
      }

      &.nav-list.nav-list--social {
        & .nav-item {
          & .nav-item__a {
            & svg {
              width: var(--fs-s);
            }
          }
        }
      }
    }

    & .main-nav__logo, & .nav-list.nav-list.nav-list--social .nav-item {
      width: fit-content;

      & svg {
        height: fit-content;
      }
    }
  }
}

@media (width >= 1281px) {
  .main-nav[data-astro-cid-4434shp5] {
    padding: var(--space-s) 0;
    justify-content: space-between;

    & .nav-list {
      &.nav-list--main {
        width: fit-content;
        height: 100%;
        padding: 0;
        flex-direction: row;
        position: static;
        transition: none;

        & .nav-item {
          & .nav-item__a {
            font-size: var(--fs-xs);
          }
        }
      }

      &.nav-list.nav-list--social {
        width: fit-content;
        justify-content: center;

        & .nav-item {
          & .nav-item__a {
            & svg {
              width: var(--fs-s);
              height: fit-content;
            }
          }
        }
      }
    }

    & .hmb-button {
      display: none;
    }

    &:has(input:checked) {
      & .nav-list {
        &.nav-list--main {
          background-color: #0000;
        }
      }
    }
  }
}

@media (prefers-reduced-motion: no-preference) {
  .main-nav[data-astro-cid-4434shp5] {
    & .nav-list {
      & .nav-item {
        & .nav-item__a {
          transition: color var(--tr-sx);
        }

        &:hover {
          & .nav-item__a {
            color: var(--blue-haze);
            font-weight: 600;
          }
        }
      }
    }

    & .main-nav__logo svg, & .nav-item__a {
      & path {
        transition: fill var(--tr-xs);
      }

      &:hover {
        & path {
          fill: var(--blue-haze);
        }
      }
    }
  }
}
.base-button {
    font-family: var(--bold-font);
    font-size: var(--fs-xs);
    padding: var(--space-3xs) var(--space-s);
    border-radius: var(--br-m);
&:disabled {
        cursor: not-allowed;
        opacity: 0.7;
}
&.base-button--blue-haze {
        background-image: var(--gradient-blue-haze);
        color: var(--woodsmoke);
}
&.base-button--magenta {
        background-image: var(--gradient-magenta);
        color: var(--blue-haze);
}
&.base-button--block {
        display: block;
}
&.base-button--inline {
        display: inline;
}
&.base-button--l {
        /* padding: var(--space-3xs) var(--space-m); */
        width: min(100%, calc(var(--space-l) * 3));
}
&.base-button--xl {
        width: min(100%, calc(var(--space-xl) * 3));
        /* padding: var(--space-3xs) var(--space-xl); */
}
}
@media (prefers-reduced-motion: no-preference) {
.base-button {
&:not(&:disabled) {
            background: transparent;
            position: relative;
            overflow: hidden;
&::before,
            &::after {
                content: '';
                width: 100%;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                transition: opacity var(--tr-xs);
}
&::before {
                z-index: -2;
}
&::after {
                opacity: 0;
                z-index: -1;
}
&:hover {
&::before {
                    opacity: 0;
}
&::after {
                    opacity: 1;
}
}
&.base-button--blue-haze {
&::before {
                    background-image: var(--gradient-blue-haze);
}
&::after {
                    background-image: var(--gradient-magenta);
}
&:hover {
                    color: var(--blue-haze);
}
}
&.base-button--magenta {
&::before {
                    background-image: var(--gradient-magenta);
}
&::after {
                    background-image: var(--gradient-blue-haze);
}
&:hover {
                    color: var(--woodsmoke);
}
}
}
}
}
.main-footer[data-astro-cid-tcz3g3y3] {
  flex-grow: 0;
  margin-top: auto;
  padding-bottom: var(--space-m);
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--fs-m);

  & .main-footer__h3 {
    font-weight: 300;
    width: fit-content;
    margin: 0 auto;

    &, & span {
      color: var(--dolphin);
      font-family: var(--regular-font);
      font-size: var(--fs-xs);
      text-align: center;
      line-height: var(--lh-m);
    }

    & span {
      color: var(--blue-haze);
      font-weight: 600;
    }
  }
}

@media (width >= 768px) {
  .main-footer[data-astro-cid-tcz3g3y3] {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;

    & .main-footer__h3 {
      margin: 0;
    }
  }
}

@media (width >= 1281px) {
  .main-footer[data-astro-cid-tcz3g3y3] {
    padding-bottom: var(--space-s);
  }
}
