.site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: var(--z-header);
  height: var(--header-height);
  border-bottom: 0.0625rem solid rgba(216, 205, 189, 0.72);
  transition: background-color var(--transition-base), box-shadow var(--transition-base);
}

.site-header.is-scrolled {
  position: fixed;
  background: rgba(243, 239, 230, 0.92);
  box-shadow: var(--shadow-sm);
  -webkit-backdrop-filter: blur(1rem);
  backdrop-filter: blur(1rem);
}

.site-header__inner {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) auto minmax(12rem, 1fr);
  align-items: center;
  height: 100%;
}

.brand {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: var(--space-200);
}

.brand__mark {
  width: 2.5rem;
  height: 2.5rem;
  overflow: visible;
  fill: none;
  stroke: var(--color-primary);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.2;
}

.brand__name {
  font-family: var(--font-heading);
  font-size: var(--fs-500);
  letter-spacing: -0.02em;
}

.brand__name strong { color: var(--color-primary); }

.header-contact {
  display: inline-flex;
  align-items: center;
  justify-self: end;
  gap: var(--space-100);
  padding-bottom: var(--space-050);
  border-bottom: 0.0625rem solid var(--color-text);
  font-family: var(--font-mono);
  font-size: var(--fs-200);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.header-contact svg {
  width: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.4;
  transition: transform var(--transition-fast);
}

.header-contact:hover svg { transform: translateX(0.2rem); }

.site-header__toggle { display: none; }

.nav-backdrop { display: none; }

@media (max-width: 900px) {
  .site-header--menu-open { z-index: var(--z-modal); }

  .site-header__inner { grid-template-columns: 1fr auto; }
  .header-contact { display: none; }

  .site-header__toggle {
    position: relative;
    z-index: calc(var(--z-overlay) + 1);
    display: grid;
    align-content: center;
    justify-self: end;
    width: 2.75rem;
    height: 2.75rem;
    gap: 0.4rem;
  }

  .site-header__toggle span {
    display: block;
    width: 1.6rem;
    height: 0.0625rem;
    background: var(--color-text);
    transition: transform var(--transition-fast);
  }

  .site-header__toggle[aria-expanded="true"] span:first-child { transform: translateY(0.23rem) rotate(45deg); }
  .site-header__toggle[aria-expanded="true"] span:last-child { transform: translateY(-0.23rem) rotate(-45deg); }

  .nav-backdrop {
    position: fixed;
    inset: 0;
    z-index: var(--z-overlay);
    display: block;
    width: 100%;
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    background: var(--color-bg);
    transition: visibility var(--transition-base), opacity var(--transition-base);
  }

  .nav-backdrop--visible {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
  }
}