/* stylelint-disable selector-class-pattern, custom-property-pattern */

.p-header {
  position: fixed;
  z-index: 500;
  inset: 0 0 auto 0;
  transition: var(--v-transition-default);
  box-shadow: var(--v-shadow-default);
  background-color: var(--v-color-2);
}

.p-header__top-bar,
.p-header__main {
  display: flex;
  align-items: stretch;
  transition: var(--v-transition-default);
}

.p-header__top-bar {
  background-color: var(--v-color-3--alt1);
  height: var(--v-p-header-top-bar-size);
  font-size: 90%;
}

body.is-scrolled .p-header__top-bar {
  height: var(--v-p-header-top-bar-size--sticky);
}

.p-header__main {
  height: var(--v-p-header-main-size);
  font-size: 90%;
}

body.is-scrolled .p-header__main {
  height: var(--v-p-header-main-size--sticky);
}

.p-header__main-inner {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  position: relative;
}

.p-header__logo {
  display: flex;
  align-items: center;
}

.p-header__logo img {
  display: block;
  height: calc(var(--v-p-header-main-size) - (var(--v-p-header-logo-spacing) * 2));
  transition: var(--v-transition-default);
}

body.is-scrolled .p-header__logo img {
  height: calc(var(--v-p-header-main-size--sticky) - (var(--v-p-header-logo-spacing--sticky) * 2));
}

.p-header__menu {
  display: flex;
  gap: 1rem;
  align-items: stretch;
  position: static;
  flex-grow: 1;
  justify-content: flex-end;
}

.p-header__menu-button {
  display: flex;
  align-items: center;
}

.p-header__button-link {
  text-decoration: none;
  font-weight: var(--v-font-weight-bold);
  color: var(--v-color-3);
}

.p-header__button-link:hover {
  color: var(--v-color-1);
}

@media (max-width: 999px) {
  .p-header .is-mobile-hidden {
    display: none;
  }
}

@media (min-width: 700px) {
  .p-header .is-mobile-visible {
    display: none;
  }
}

@media (min-width: 1000px) {
  .p-header__menu {
    gap: 1.2rem;
  }
}

@media (min-width: 1200px) {
  .p-header__menu-button--mobile {
    display: none;
  }
}