.site-header {
  background: var(--color-paper);
  border-bottom: 2px solid var(--color-ink);
  position: sticky; top: 0; z-index: 10;
}
.site-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  padding-block: var(--space-2);
}
.site-nav { display: flex; gap: var(--space-3); }
.site-nav a {
  font-family: var(--font-display);
  text-transform: uppercase;
  text-decoration: none;
  font-size: 0.95rem;
}
.nav-toggle {
  display: none;
  flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: var(--space-1);
}
.nav-toggle__bar { width: 24px; height: 2px; background: var(--color-ink); }

@media (max-width: 767px) {
  .nav-toggle { display: flex; }
  .site-nav {
    display: none; flex-direction: column;
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--color-paper);
    border-bottom: 2px solid var(--color-ink);
    padding: var(--space-2) var(--space-3);
  }
  .site-nav--open { display: flex; }
}

.site-footer {
  background: var(--color-ink);
  color: var(--color-paper);
  padding-block: var(--space-5);
}
.site-footer__inner { display: grid; gap: var(--space-3); }
.site-footer a { color: var(--color-sejahtera); }
.site-footer__copy { opacity: 0.7; font-size: 0.85rem; }

/* Official marks (Dinas Kebudayaan, BerAKHLAK, Dana Keistimewaan) are
   mandatory logos and must render in their real registered colors — a
   dark strip would force them to white/mono via filter, which is a
   compliance issue, not a style choice. Light strip, native color. */
.sponsor-strip {
  background: var(--color-paper);
  border-bottom: 1px solid color-mix(in srgb, var(--color-ink) 20%, transparent);
  padding-block: var(--space-1);
}
.sponsor-strip__inner {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.sponsor-strip__inner img {
  height: 26px;
  width: auto;
}
