/* Shared site header: keep every page aligned with the top page. */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  height: 64px;
  align-items: center;
  justify-content: space-between;
  padding: 9px 19px 8px;
  background: rgba(253, 250, 248, .96);
  box-shadow: 0 1px 0 rgba(213, 179, 176, .14);
  backdrop-filter: blur(10px);
}
.site-header .brand { display: block; min-width: 138px; text-align: center; }
.site-header .brand-logo { display: block; width: auto; height: 44px; max-width: 152px; object-fit: contain; }
.site-header .menu-button {
  display: grid;
  width: 38px;
  height: 38px;
  padding: 9px 7px;
  align-content: center;
  gap: 5px;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.site-header .menu-button span { display: block; height: 1px; background: var(--ink, #433836); transition: .24s; }
.site-header .menu-button[aria-expanded="true"] span:first-child { transform: translateY(6px) rotate(45deg); }
.site-header .menu-button[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.site-header .menu-button[aria-expanded="true"] span:last-child { transform: translateY(-6px) rotate(-45deg); }
.site-header .global-nav {
  position: absolute;
  top: 64px;
  right: 0;
  left: 0;
  display: grid;
  padding: .8rem 7vw 1.5rem;
  background: rgba(253, 250, 248, .985);
  box-shadow: var(--shadow, 0 8px 24px rgba(115, 73, 69, .08));
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transform: scaleY(0);
  transform-origin: top;
  transition: .24s;
}
.site-header .global-nav.open { opacity: 1; pointer-events: auto; visibility: visible; transform: scaleY(1); }
.site-header .global-nav a { padding: .42rem; border-bottom: 1px solid var(--rule, #e5cbc9); color: inherit; font-family: var(--latin, "Italiana", serif); text-decoration: none; }

@media (min-width: 600px) {
  .site-header { height: 76px; padding-inline: 5vw; }
  .site-header .brand-logo { height: 56px; max-width: 178px; }
  .site-header .global-nav { top: 76px; }
}

@media (min-width: 1024px) {
  .site-header { height: 86px; }
  .site-header .menu-button { display: none; }
  .site-header .global-nav {
    position: static;
    display: flex;
    gap: 1.2rem;
    padding: 0;
    background: none;
    box-shadow: none;
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    transform: none;
  }
  .site-header .global-nav a { padding: .42rem; border: 0; font-size: .72rem; }
}