/* ==========================================================================
   Шапка + мобільне меню
   ========================================================================== */

.header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 30;
  width: 100%;
}

.header__row--top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 80.26rem;
}

.header__info {
  display: flex;
  align-items: center;
  gap: 104.45rem;
}

.header__address,
.header__phone {
  font-weight: 500;
  font-size: 16rem;
  line-height: 1.4;
  letter-spacing: 0.8rem;
  white-space: nowrap;
}

.header__phone {
  transition: color 0.2s ease;
}

.header__phone:hover {
  color: var(--c-red);
}

.header__cta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12rem;
}

.header__row--bottom {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 306rem;
  height: 43rem;
  padding-top: 17rem;
  border-top: 1rem solid var(--c-line);
}

/* ------------------------------------------------------------ навігація */
.nav__list {
  display: flex;
  align-items: center;
  gap: 50rem;
}

.nav__link {
  position: relative;
  font-weight: 500;
  font-size: 16rem;
  line-height: 1.4;
  letter-spacing: 0.8rem;
  white-space: nowrap;
  transition: color 0.2s ease;
}

.nav__link:hover,
.nav__link.is-active {
  color: var(--c-red);
}

/* ----------------------------------------------------- перемикач мови */
.lang {
  display: flex;
  align-items: center;
  gap: 4rem;
  font-weight: 500;
  font-size: 16rem;
  line-height: 1.4;
  letter-spacing: 0.8rem;
  color: var(--c-grey);
}

.lang__item {
  transition: color 0.2s ease;
}

.lang__item.is-active,
.lang__item:hover {
  color: var(--c-red);
}

/* ---------------------------------------------------------------- бургер */
.burger {
  display: none;
  position: relative;
  width: 30rem;
  height: 16rem;
  flex-shrink: 0;
}

.burger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3rem;
  border-radius: 3rem;
  background: var(--c-red);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease;
}

.burger span:nth-child(1) { top: 0; }
.burger span:nth-child(2) { top: 6.5rem; }
.burger span:nth-child(3) { top: 13rem; }

/* -------------------------------------------------------- мобільне меню */
.mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  display: none;
  width: 100%;
  height: 100dvh;
  padding: 14rem 20rem 40rem;
  overflow-y: auto;
  background: #fdfdfd;
  transform: translateY(-100%);
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-menu.is-open {
  transform: translateY(0);
}

.mobile-menu__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68rem;
  margin-bottom: 40rem;
}

.mobile-menu__close {
  position: relative;
  width: 24rem;
  height: 24rem;
  flex-shrink: 0;
}

.mobile-menu__close::before,
.mobile-menu__close::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 32rem;
  height: 3rem;
  border-radius: 3rem;
  background: var(--c-red);
}

.mobile-menu__close::before { transform: translate(-50%, -50%) rotate(45deg); }
.mobile-menu__close::after { transform: translate(-50%, -50%) rotate(-45deg); }

.mobile-menu__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 60rem;
}

.mobile-menu__nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20rem;
  width: 100%;
}

.mobile-menu__link {
  font-weight: 500;
  font-size: 32rem;
  line-height: 1.2;
  text-align: center;
}

.mobile-menu__link.is-active {
  font-weight: 600;
  color: var(--c-red);
}

.mobile-menu__lang {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5rem;
  width: 100%;
  font-weight: 600;
  font-size: 20rem;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--c-grey);
}

.mobile-menu__lang .lang__item.is-active {
  color: var(--c-red);
}

.mobile-menu__contacts {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16rem;
  width: 100%;
}

.mobile-contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10rem;
  font-weight: 500;
  font-size: 16rem;
  line-height: 1.4;
  letter-spacing: 0.8rem;
}

.mobile-contact img {
  width: 20rem;
  height: 20rem;
}

/* поетапна поява вмісту меню */
.mobile-menu__body > * {
  opacity: 0;
  transform: translateY(16rem);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.mobile-menu.is-open .mobile-menu__body > * {
  opacity: 1;
  transform: translateY(0);
}

.mobile-menu.is-open .mobile-menu__body > *:nth-child(1) { transition-delay: 0.18s; }
.mobile-menu.is-open .mobile-menu__body > *:nth-child(2) { transition-delay: 0.26s; }
.mobile-menu.is-open .mobile-menu__body > *:nth-child(3) { transition-delay: 0.32s; }
.mobile-menu.is-open .mobile-menu__body > *:nth-child(4) { transition-delay: 0.38s; }

/* ========================================================== мобільна версія */
@media (max-width: 479px) {
  .header {
    position: relative;
    height: 87rem;
    background: #fdfdfd;
    border-bottom: 1rem solid var(--c-line);
  }

  .header__row--top {
    height: auto;
    padding-top: 14rem;
  }

  .header__info,
  .header__row--bottom {
    display: none;
  }

  .burger {
    display: block;
  }

  .mobile-menu {
    display: block;
  }

  body.menu-open {
    overflow: hidden;
  }
}
