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

  --vp-header__height-topbar: 2rem;
  --vp-header__height-topbar--sticky: 0px;

  /*--vp-header__height-info: 3.5rem;*/
  --vp-header__height-info: 0px;
  --vp-header__height-info--sticky: 0px;

  /* The menu is on a separate line from main header */
  --vp-header__height-menu: 0px;
  --vp-header__height-menu--sticky: 0px;

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

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

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

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

  --vp-header__spacing-menu: 1rem;
  --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 {
  position: fixed;
  z-index: 500;
  inset: var(--v-adminbar__height) 0 auto 0;

  transition: var(--v-transition__default);

  background-color: var(--v-color__5);
  box-shadow: var(--v-shadow__default);
}

body.is-scrolled .p-header {
  --v-form-field__height: 2.3rem;
}

.p-header__main {
  position: relative;
}

.p-header__main-inner,
.p-header__menu-inner {
  display: flex;
  align-items: stretch;
  transition: var(--v-transition__default);
}

.p-header__main-inner {
  position: relative;
  height: var(--vp-header__height-main);
  gap: var(--vp-header__spacing-main);
}

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

.p-header__main-inner .p-button {
  margin: 0;
}

.p-header__logo,
.p-header__group,
.p-header__search,
.p-header__shop {
  display: flex;
  align-items: center;
  position: relative;
}

@media (min-width: 700px) {
  body {
    --vp-header__height-topbar: 2rem;
  }
}

@media (min-width: 1000px) {
  .p-header {
    --vp-header__spacing-main: 1.5rem;
    --vp-header__spacing-menu: 1.8rem;
  }

  body {
    --vp-header__height-main: 4rem;
  }
}

@media (min-width: 1300px) {
  body {
    --vp-header__height-menu: 2.7rem;
    --vp-header__height-menu--sticky: 2.5rem;
  }

  .p-header {
    --vp-header__spacing-main: 2rem;
  }
}

@media (min-width: 1500px) {
  body {
    --vp-header__height-topbar: 2.5rem;
    /*--vp-header__height-info: 2.5rem;*/
    --vp-header__height-main: 4.5rem;
  }
}

@media (min-width: 2000px) {
  body {
    --vp-header__height-main: 5.5rem;
    --vp-header__height-menu: 3.5rem;

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