.header {
  position: absolute;
  top: 22px;
  left: 0;
  right: 0;
  z-index: 20;
  color: #fff;
}
/* Light header variant for white backgrounds */
.header--light {
  position: static;
  color: var(--color-text);
  margin-top: 22px;
}
.header--light .header__nav a { color: var(--color-text); }
.header--light .header__link { color: var(--color-text); }
.header--light .header__phones a { color: var(--color-text); }

.header__inner {
  display: flex;
  align-items: start;
  gap: 43px;
  height: 84px;
}

.header__logo img {
  width: 359px;
  height: auto;
  display: block;
}

@media (max-width: 1200px) {
  .header__logo img { width: 240px; }
  .header__inner { justify-content: space-between; }
}

@media (max-width: 768px) {
  .header__logo img { width: 240px; }
  .header__inner { justify-content: space-between; }
}

.header__nav {
  display: flex;
  gap: 35px;
  margin-top: 29px;
}
.header__nav a {
  color: #FFFFFF;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
  transition: opacity 0.2s ease;
}
.header__nav a:hover {
  opacity: 0.8;
}

.header__contacts {
  display: flex;
  gap: 28px;
  align-items: center;
  margin-left: auto;
  margin-top: 15px;
}
.header__link {
  color: #FFFFFF;
}
.header__link:hover {
  color: #fff;
}
.header__cta {
  margin-left: 8px;
}

@media (max-width: 1200px) {
  .header__nav { display: none; }
}

/* Burger */
.header__burger {
  display: none;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
}
.header__burger img {
  display: block;
  width: 46px;
  height: auto;
}

@media (max-width: 1200px) {
  .header__contacts { display: none; }
  .header__burger { display: inline-flex; }
}

/* Mobile menu (drawer) */
.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 40;
  pointer-events: none;
}
.mobile-menu__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(13, 20, 32, 0.45);
  opacity: 0;
  transition: opacity .25s ease;
}
.mobile-menu__panel {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 94vw;
  max-width: 440px;
  background: #F0F5FB;
  color: #0f1115;
  transform: translateX(100%);
  transition: transform .3s ease;
  display: flex;
  flex-direction: column;
  padding: 29px 24px 72px;
  border-radius: 20px 0 0 20px;
}
.mobile-menu.is-open {
  pointer-events: auto;
}
.mobile-menu.is-open .mobile-menu__backdrop {
  opacity: 1;
}
.mobile-menu.is-open .mobile-menu__panel {
  transform: translateX(0);
}

.mobile-menu__header {
  display: flex;
  justify-content: flex-end;
  padding: 0;
}
.mobile-menu__close {
  background: transparent;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.mobile-menu__nav {
  display: flex;
  flex-direction: column;
  padding: 16px 0 0;
  gap: 30px;
}
.mobile-menu__nav a {
  font-size: 16px;
  line-height: 18px;
  font-weight: 400;
  color: var(--color-text);
}

.mobile-menu__contacts {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #2F303033;
  display: grid;
  gap: 30px;
}
.mobile-menu__link {
  color: var(--color-text);
}

.mobile-menu__footer {
  margin-top: auto;
  padding-top: 16px;
}

.header__social-link img {
  width: 26px;
  height: 26px;
  display: block;
  transition: opacity 0.2s ease;
}
.header__social-link:hover img {
  opacity: 0.8;
}

.header__socials {
  display: flex;
  gap: 20px;
  align-items: center;
}

.header__phones {
  display: flex;
  flex-direction: column;
  gap: 13px;
}
.header__phones a {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 400;
  color: #FFFFFF;
  transition: opacity 0.2s ease;
}
.header__phones a:hover {
  opacity: 0.8;
}

.mobile-menu__socials {
  display: flex;
  gap: 20px;
  align-items: center;
  margin-top: 30px;
}