.site-header {
  background-color: var(--spruce-base-color-background);
  position: relative;
}
.site-header--sticky {
  backdrop-filter: blur(12px);
  background-color: color-mix(in srgb, var(--spruce-base-color-background) 85%, transparent);
  border-block-end: var(--spruce-border-width-base) solid var(--spruce-base-color-border);
  inset-block-start: 0;
  position: sticky;
  z-index: 1020;
}
.site-header__inner {
  --block-size: 4.5rem;
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 5vw, 3rem);
  justify-content: space-between;
  min-block-size: var(--block-size);
}
.site-header__column {
  align-items: center;
  display: flex;
  flex-grow: 1;
  gap: clamp(1rem, 5vw, 3rem);
}
.site-header__actions {
  align-items: center;
  display: flex;
  gap: clamp(1rem, 5vw, 3rem);
}
.site-header__logo {
  display: inline-flex;
}
.site-header__logo img {
  --size: 2rem;
  block-size: var(--size);
  inline-size: var(--size);
}
.site-header__email {
  display: none;
  text-decoration: none;
}
@media (min-width: 48em) {
  .site-header__email {
    display: inline-block;
  }
}
.site-header__navigation {
  margin-inline-start: auto;
}
@media (min-width: 64em) {
  .site-header__navigation {
    margin-inline-start: 0;
  }
}