/** Shared header scale. Scoped to the header so the footer stays unchanged. */
.site-header .brand > img { width: 50px; height: 50px; }
.site-header .brand > span { font-size: 36px; }
.site-header #main-nav { font-size: 16px; gap: 24px; }
.site-header #main-nav > .button { font-size: var(--text-reading); }
@media (min-width:851px) and (max-width:1100px) {
  .site-header .brand > img { width: 44px; height: 44px; }
  .site-header .brand > span { font-size: 32px; }
  .site-header #main-nav { font-size: 13px; gap: 12px; }
  .site-header #main-nav > .button { font-size: var(--text-reading); padding-inline: 15px; }
}
@media (max-width:850px) {
  .site-header .brand > img { width: 44px; height: 44px; }
  .site-header .brand > span { font-size: 32px; }
  .site-header .header-inner { gap: 16px; }
  .site-header .menu-toggle { font-size: var(--text-reading); }
  .site-header #main-nav { font-size: 16px; gap: 12px; }
  .site-header #main-nav > .button { font-size: var(--text-reading); }
}
@media (max-width:360px) {
  .site-header .brand { gap: 8px; }
  .site-header .brand > img { width: 40px; height: 40px; }
  .site-header .brand > span { font-size: 29px; }
  .site-header .menu-toggle { gap: 8px; padding-inline: 10px; }
}

/* Keep the larger menu label inside very narrow screens without scaling the brand. */
@media(max-width:360px) {
 .site-header .header-inner { padding-inline:12px; gap:8px; }
}

/* Enlarge only the Ki mark. Keep the wordmark and existing layout dimensions fixed. */
.site-header .brand > img,
.site-footer .brand > img {
 transform: scale(1.2);
 transform-origin: center;
}

/* Footer-only second 20% increase: 1.2 × 1.2 = 1.44. Header mark stays unchanged. */
.site-footer .brand > img { transform: scale(1.44); }

/* Icon state follows aria-expanded for every open/close route. */
.menu-toggle .menu-icon-close { display:none; }
.menu-toggle[aria-expanded="true"] .menu-icon-bars { display:none; }
.menu-toggle[aria-expanded="true"] .menu-icon-close { display:block; }
