/* Header — logo left, uppercase nav + icon links right */

.block-header {
  background: var(--color-background);
}

.block-header__container {
  max-width: calc(var(--container-max) + 2 * var(--container-pad));
  margin: 0 auto;
  padding: 32px var(--container-pad) 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

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

.block-header__logo-img {
  height: 58px;
  width: auto;
}

.block-header__logo-text {
  font-family: var(--font-display);
  font-size: 20px;
  color: var(--color-accent);
  text-transform: uppercase;
}

.block-header__nav {
  display: flex;
  align-items: center;
  gap: 26px;
}

.block-header__nav-link {
  font-family: var(--font-sans);
  font-size: var(--text-nav);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-muted);
  transition: color var(--transition);
}

.block-header__nav-link:hover,
.block-header__nav-link.is-active {
  color: var(--color-foreground);
  opacity: 1;
}

/* Instagram / mail nav items render as icons */
.block-header__nav-link[href*="instagram"],
.block-header__nav-link[href^="mailto:"] {
  font-size: 0;
  width: 19px;
  height: 19px;
  background-color: var(--color-muted);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  transition: background-color var(--transition);
}

.block-header__nav-link[href*="instagram"]:hover,
.block-header__nav-link[href^="mailto:"]:hover {
  background-color: var(--color-foreground);
}

.block-header__nav-link[href*="instagram"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Ccircle cx='17.3' cy='6.7' r='1.3' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Ccircle cx='17.3' cy='6.7' r='1.3' fill='%23000' stroke='none'/%3E%3C/svg%3E");
}

.block-header__nav-link[href^="mailto:"] {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='2' y='4.5' width='20' height='15' rx='2'/%3E%3Cpath d='M2.5 6l9.5 7 9.5-7'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='2' y='4.5' width='20' height='15' rx='2'/%3E%3Cpath d='M2.5 6l9.5 7 9.5-7'/%3E%3C/svg%3E");
}

/* CTA unused on this site */
.block-header__cta { display: none; }

/* Homepage header overlays the full-viewport showcase hero. */
.page-home .block-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 50;
  background: transparent;
}

.page-home .block-header__container {
  max-width: none;
  padding-top: 24px;
}

.page-home .block-header__logo-img {
  filter: brightness(0) invert(1);
}

.page-home .block-header__nav-link {
  color: rgba(255, 255, 255, 0.86);
}

.page-home .block-header__nav-link:hover,
.page-home .block-header__nav-link.is-active {
  color: #fff;
}

.page-home .block-header__nav-link[href*="instagram"],
.page-home .block-header__nav-link[href^="mailto:"] {
  background-color: rgba(255, 255, 255, 0.86);
}

.page-home .block-header__nav-link[href*="instagram"]:hover,
.page-home .block-header__nav-link[href^="mailto:"]:hover {
  background-color: #fff;
}

/* ── Mobile ─────────────────────────────────────────────── */

.block-header__hamburger {
  display: none;
  background: none;
  border: none;
  padding: 8px;
  cursor: pointer;
  position: relative;
  z-index: 70; /* stays clickable above the open overlay */
}

.block-header__hamburger-line {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--color-foreground);
  margin: 5px 0;
}

.block-header__overlay {
  display: none;
}

@media (max-width: 820px) {
  .page-home .block-header__container { padding-top: 18px; }
  .page-home .block-header__hamburger-line { background: #fff; }
  .page-home .block-header:has(.block-header__overlay.is-open) .block-header__hamburger-line {
    background: var(--color-foreground);
  }

  .block-header__nav { display: none; }
  .block-header__hamburger { display: block; }
  .block-header__logo-img { height: 44px; }

  .block-header__overlay {
    display: block;
    position: fixed;
    inset: 0;
    background: var(--color-background);
    z-index: 60;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--transition);
  }

  .block-header__overlay.is-open {
    opacity: 1;
    pointer-events: auto;
  }

  .block-header__overlay-nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 34px;
    height: 100%;
  }

  .block-header__overlay-link {
    font-family: var(--font-display);
    font-size: 24px;
    text-transform: uppercase;
    color: var(--color-foreground);
  }

  .block-header__overlay-link[href*="instagram"],
  .block-header__overlay-link[href^="mailto:"] {
    font-family: var(--font-sans);
    font-size: 14px;
    letter-spacing: 0.14em;
    color: var(--color-muted-fg);
  }

  .block-header__overlay-cta { display: none; }
}