.main-nav > a,
.nav-group { padding: .65rem 0; }
.nav-group { position: relative; display: flex; align-items: center; gap: .2rem; }
.submenu-toggle { border: 0; background: none; color: inherit; padding: .25rem; cursor: pointer; }
.submenu { position: absolute; display: none; top: 100%; right: 0; width: 310px; background: #fff; color: var(--ink); border-radius: 4px; padding: .6rem; box-shadow: 0 18px 50px rgba(0,0,0,.3); }
.nav-group:hover .submenu,
.nav-group:focus-within .submenu { display: grid; }
.submenu a { padding: .65rem .8rem; border-bottom: 1px solid #e8eef3; }
.submenu a:last-child { border: 0; }
@media (max-width: 980px) {
  .main-nav > a, .nav-group { padding: .7rem; }
  .nav-group { display: block; }
  .submenu-toggle { position: absolute; top: .6rem; right: .4rem; }
  .submenu { position: static; width: 100%; margin-top: .5rem; }
  .nav-group:focus-within .submenu { display: grid; }
}