.AppHeader {
  position: sticky;
  top: 0;
  z-index: var(--layerHeaderZIndex);
}

.AppHeader--overlapse {
  height: 0;
}

.AppHeader-holder {
  padding: 1.1em 0;
  background: var(--colorContrastBg);
  color: hsl(0, 0%, calc((var(--colorContrastBg-l) - 60) * -100%));
  transition: var(--animationBase);
}

.AppHeader--overlapse:not(.is-sticked) .AppHeader-holder {
  background: transparent;
  padding: var(--spaceLg) 0;
}

@media (max-width: 80rem) {
  .AppHeader--overlapse:not(.is-sticked) .AppHeader-holder {
    padding: 1.1em 0;
  }
}

.AppHeader.is-up .AppHeader-holder {
  transform: translateY(-100%);
}

.AppHeader-frame {
  display: flex;
  align-items: center;
}

.AppHeader-logo {
  margin-right: auto;
}

.AppHeader-logo img, .AppHeader-logo svg {
  max-width: 100%;
  height: auto;
}

.AppHeader-center {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.AppHeader-contact {
  font-weight: 300;
  font-size: var(--textSm);
  margin-bottom: .4em;
}

@media (max-width: 64rem) {
  .AppHeader-contact {
    display: none;
  }
}

.AppHeader-contact a {
  color: inherit;
  color: var(--textSubtle);
}

.AppHeader-contact a svg {
  color: var(--colorBrand);
}

@media (min-width: 64.01rem) {
  .AppHeader-phoneBox {
    display: none;
  }
}

.AppHeader-boxes {
  display: flex;
  margin-left: 25px;
  position: relative;
}

.AppHeader-hmb {
  display: flex;
  flex-direction: column;
  font-size: .5rem;
  text-transform: uppercase;
  font-weight: 700;
  margin-left: var(--spaceLg);
  padding-left: var(--spaceLg);
  border-left: 1px solid #fff;
}

.AppHeader-hmb svg {
  width: 1.6rem;
  height: auto;
}

@media (max-width: 32rem) {
  .AppHeader-hmb {
    margin-right: var(--spaceMd);
  }
}

@media (min-width: 80.01rem) {
  .AppHeader-hmb {
    display: none;
  }
}

.AppHeader {
  position: relative;
}

.AppHeader-holder {
  background: var(--colorBrand);
}

.AppHeader--overlapse:not(.is-sticked) .AppHeader-holder {
  padding: 1.1em 0;
}

.AppHeader-frame {
  display: grid;
  grid-template: 'navSec navSec contacts' 'logo navPrim buttons' / auto 1fr auto;
  gap: 0.5em 1rem;
  position: relative;
}

.AppHeader-frame::after {
  content: '';
  position: absolute;
  bottom: -1.1em;
  right: var(--sizeContentOffset);
  width: 70%;
  height: 1.5px;
  background: linear-gradient(0.25turn, transparent, #fffa);
}

:where(.AppHeader--overlapse.is-sticked) .AppHeader-frame::after {
  display: none;
}

.AppHeader-logo {
  grid-area: logo;
}

.AppHeader-navigation {
  grid-area: navPrim;
}

.AppHeader-navigationSecondary {
  grid-area: navSec;
}

.AppHeader-navigationSecondary .AppNavigationItem {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.AppHeader-navigationSecondary .AppNavigationItem-link {
  display: flex;
  align-items: center;
}

.AppHeader-navigationSecondary .AppNavigationItem span {
  display: flex;
}

.AppHeader-boxes {
  grid-area: contacts;
  display: flex;
  justify-content: end;
  align-items: center;
  padding: 0 0 var(--spaceMd);
}

.AppHeader-description {
  padding-right: 0.5rem;
}

.AppHeader-description-text {
  font-size: 0.8125rem;
  white-space: nowrap;
}

.AppHeader-profilePicture {
  border-radius: 100%;
  overflow: hidden;
  width: 2rem;
  height: 2rem;
}

.AppHeader-buttons {
  gap: 1rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  grid-area: buttons;
}

.AppHeader-button {
  padding: clamp(0.5rem, 1vw, 0.8rem) clamp(0.8rem, 1vw, 1rem);
}

.AppHeader-button:first-child {
  margin-left: 0;
}

.AppHeader-hmb {
  grid-area: hmb;
  align-items: center;
  padding-left: .9375rem;
  margin-left: 0;
}

.AppHeader-hmb svg {
  width: 1.625rem;
}

.AppHeader-hmb:hover, .AppHeader-hmb:active, .AppHeader-hmb:focus {
  cursor: pointer;
}

.AppHeader-hmbText {
  font-weight: 500;
  letter-spacing: .03125rem;
}

.AppHeader-socials {
  display: none;
}

@media (min-width: 80rem) {
  .AppHeader-socials {
    display: flex;
    align-items: center;
    gap: .6rem;
  }
}

.AppHeader-socials svg {
  color: var(--colorBrandSecondary);
  width: 1.25rem;
  height: 1.25rem;
}

.AppHeader-socials a {
  display: flex;
  align-items: center;
}

.AppHeader-socials a:hover svg {
  color: hsl(var(--colorBrandSecondary-h), calc(var(--colorBrandSecondary-s) * 1%), calc(var(--colorBrandSecondary-l) * 0.8 * 1%));
}

@media (max-width: 80rem) {
  .AppHeader-frame {
    grid-template: 'logo  contacts contacts' 'logo buttons hmb' / auto 1fr auto;
  }
  .AppHeader-buttons {
    place-self: center end;
  }
}

@media (max-width: 47.99rem) {
  .AppHeader-logo {
    max-width: clamp(100px, 30vw, 150px);
  }
  .AppHeader-button {
    margin-left: 0;
  }
  .AppHeader-button:first-child {
    display: none;
  }
  .AppHeader-hmb {
    margin: 0;
    border: 0;
    padding: 0;
  }
}

@media (max-width: 31.99rem) {
  .AppHeader-frame {
    grid-template: 'logo buttons hmb' / auto 1fr auto;
  }
  .AppHeader-logo {
    max-width: 90px;
  }
  .AppHeader-boxes {
    display: none;
  }
  .AppHeader-button {
    font-size: 0.8rem;
    text-align: center;
  }
}

@media (min-width: 32rem) {
  .AppHeader-logo {
    align-self: flex-end;
  }
}

/*# sourceMappingURL=header.min.css.map */
