body {
  --vp-header__height-main: 5rem;
  --vp-header__height-main--sticky: 4rem;

  --vp-header__height-total: calc(
    var(--v-adminbar__height) +
    var(--vp-header__height-main)
  );

  --vp-header__height-total--sticky: calc(
    var(--v-adminbar__height) +
    var(--vp-header__height-main--sticky)
  );

  --vp-header__spacing-logo: 0.7rem;
  --vp-header__spacing-logo--sticky: 0.7rem;

  --vp-header__spacing-main: 1rem;
  --vp-header__spacing-main--sticky: var(--vp-header__spacing-main);

  --vp-header__spacing-menu: 2.5rem;
  --vp-header__spacing-menu--sticky: var(--vp-header__spacing-menu);

  padding-top: var(--vp-header__height-total);
}

:target {
  scroll-margin-top: calc( var(--vp-header__height-total--sticky) + 1rem );
}

.p-header-default {
  position: fixed;
  z-index: 500;
  inset: var(--v-adminbar__height) 0 auto 0;

  transition: var(--v-transition__default);
  box-shadow: var(--v-shadow__default);
}

.p-header-default__main {
  position: relative;
  background-color: var(--v-color__light);
}

.p-header-default__main-inner {
  display: flex;
  align-items: stretch;
  transition: var(--v-transition__default);
  position: relative;
  height: var(--vp-header__height-main);
  gap: var(--vp-header__spacing-main);
}

body.is-scrolled .p-header-default__main-inner {
  height: var(--vp-header__height-main--sticky);
  gap: var(--vp-header__spacing-main--sticky);
}

.p-header-default__logo,
.p-header-default__group,
.p-header-default__menu,
.p-header-default__menu-group,
.p-header-default__button-menu {
  display: flex;
  position: relative;
}

.p-header-default__logo,
.p-header-default__group,
.p-header-default__button-menu {
  align-items: center;
}

.p-header-default__menu,
.p-header-default__menu-group {
  align-items: stretch;
}

@media (max-width: 999px) {
  .p-header-default__group .p-button {
    margin: 0;
    height: 2.3rem;
    padding: 0 1rem;
  }
}

@media (min-width: 1000px) {
  body {
    --vp-header__spacing-main: 1.5rem;

    --vp-header__height-main: 7rem;
    --vp-header__height-main--sticky: 5rem;
  }

  body.is-scrolled .p-header-default__group .p-button {
    height: 3rem;
    padding: 0 1.5rem;
  }
}

@media (min-width: 1300px) {
  body {
    --vp-header__spacing-main: 2rem;
  }
}