/* Site header: folded K + wordmark, three links, and "Get the app" as the
   primary action. Below 760px the links move into a <details> menu (no JS needed). */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(251, 249, 246, 0.92);
  -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid transparent;
}
.site-header__bar { display: flex; align-items: center; gap: 12px; min-height: 64px; }

.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; margin-right: auto; }
.brand:hover { color: var(--ink); }
.brand__icon { width: 36px; height: 36px; border-radius: 22.5%; box-shadow: 0 1px 2px rgba(30, 43, 41, 0.18); }
.brand__name { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.03em; }

.site-nav { display: none; gap: 4px; }
.site-nav__link {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 999px;
  color: var(--ink-2); font-size: 0.9375rem; font-weight: 600; text-decoration: none;
}
.site-nav__link:hover { color: var(--ink); background: var(--cream-2); }

.site-header__cta { padding: 0 16px; }

.site-menu { position: relative; }
.site-menu__toggle {
  display: grid; place-items: center; width: 44px; height: 44px; border-radius: 999px;
  color: var(--ink); cursor: pointer; list-style: none;
}
.site-menu__toggle::-webkit-details-marker { display: none; }
.site-menu__toggle:hover { background: var(--cream-2); }
.site-menu__panel {
  position: absolute; right: 0; top: calc(100% + 8px); min-width: 200px; padding: 6px;
  display: grid; background: var(--surface); border-radius: var(--radius-m); box-shadow: var(--shadow-raised);
}
.site-menu__panel a {
  display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: var(--radius-s);
  color: var(--ink); font-weight: 600; text-decoration: none;
}
.site-menu__panel a:hover { background: var(--cream-2); }

@media (min-width: 760px) {
  .site-nav { display: flex; }
  .site-menu { display: none; }
}