/* Menu "Info" bersama (lihat menu-info.js). Warna merek: navy #123B66, biru #009FE3, tint #EAF8FF. */
.menu-info { position: relative; flex: none; display: inline-flex; align-items: center; z-index: 60; margin-left: auto; margin-right: 6px; }
.menu-info .mi summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 4px;
  font: 600 15px/1 Poppins, Figtree, system-ui, sans-serif; color: inherit;
  padding: 9px 10px; border-radius: 8px; user-select: none; white-space: nowrap;
}
.menu-info .mi summary::-webkit-details-marker { display: none; }
.menu-info .mi summary svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.menu-info .mi[open] summary svg { transform: rotate(180deg); }
.menu-info .mi summary:hover, .menu-info .mi summary:focus-visible { background: rgba(0, 159, 227, .14); outline: none; }
.menu-info .mi-list {
  position: absolute; right: 0; top: calc(100% + 8px); margin: 0; padding: 6px; list-style: none;
  width: min(300px, calc(100vw - 32px)); background: #fff; color: #123B66;
  border-radius: 12px; box-shadow: 0 16px 40px rgba(18, 59, 102, .22); border: 1px solid #DCEFFA;
}
.menu-info .mi-list a { display: block; padding: 10px 12px; border-radius: 8px; color: #123B66; text-decoration: none; }
.menu-info .mi-list a b { display: block; font: 600 15px/1.3 Poppins, Figtree, system-ui, sans-serif; }
.menu-info .mi-list a small { display: block; font: 400 13px/1.35 Figtree, Inter, system-ui, sans-serif; color: #4A6A8A; margin-top: 2px; }
.menu-info .mi-list a:hover, .menu-info .mi-list a:focus-visible { background: #EAF8FF; outline: none; }
.menu-info .mi-list a[aria-current="page"] { background: #EAF8FF; }
.menu-info .mi-list a[aria-current="page"] b::after { content: " · halaman ini"; font-weight: 400; font-size: 12px; color: #009FE3; }
/* HP sempit: header berisi logo + Info + tombol utama — rapatkan supaya tidak bertumpuk / tombol tidak pecah 2 baris */
@media (max-width: 440px) {
  .menu-info { margin-right: 0; }
  .menu-info .mi summary { padding: 8px 4px; font-size: 14px; gap: 2px; }
  .menu-info .mi summary svg { width: 14px; height: 14px; }
  .nav .wrap { gap: 8px; }
  .nav .wrap .btn { padding: 0 12px; font-size: 14px; white-space: nowrap; }
  header.nav.glass .btn { white-space: nowrap; font-size: 13px; padding-left: 12px; padding-right: 12px; }
}
@media (prefers-reduced-motion: reduce) { .menu-info .mi summary svg { transition: none; } }