/* ---------- Header navigation: Books mega menu (header.php) ---------- */
.site-nav{align-self:stretch;align-items:center}
.nav-item{position:relative;display:flex;align-items:center;align-self:stretch}
.nav-item .nav-link{display:inline-flex;align-items:center;gap:7px}
.nav-item .nav-link:after{
  content:"";
  width:5px;
  height:5px;
  border-right:1px solid currentColor;
  border-bottom:1px solid currentColor;
  transform:rotate(45deg) translateY(-1px);
  transition:transform .2s ease;
}
.nav-item.has-menu:hover .nav-link:after,
.nav-item.has-menu:focus-within .nav-link:after{transform:rotate(45deg) translateY(2px)}
.nav-item.is-active .nav-link,
.nav-item.has-menu:hover .nav-link,
.nav-item.has-menu:focus-within .nav-link{color:var(--blue-700)}

.nav-mega{
  position:absolute;
  top:100%;
  right:0;
  z-index:120;
  min-width:min(680px, calc(100vw - 48px));
  padding:24px 26px;
  background:var(--white);
  border:1px solid var(--line-300);
  border-top:0;
  border-radius:0 0 var(--radius) var(--radius);
  box-shadow:0 24px 48px rgba(13,27,42,.14);
  opacity:0;
  visibility:hidden;
  transform:translateY(-8px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.nav-item.has-menu:hover .nav-mega,
.nav-item.has-menu:focus-within .nav-mega{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.nav-mega-inner{display:grid;grid-template-columns:repeat(3, minmax(150px, 1fr));gap:28px}
.nav-mega-title{
  margin:0 0 12px;
  padding-bottom:10px;
  border-bottom:1px solid var(--line-200);
  font-size:11px;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--blue-700);
}
.nav-mega-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.nav-mega-list a{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:-9px;
  padding:7px 9px;
  border-radius:var(--radius-sm);
  font-size:13px;
  font-weight:600;
  color:var(--ink-600);
  white-space:nowrap;
  transition:background .16s ease, color .16s ease;
}
.nav-mega-thumb{
  width:32px;
  height:32px;
  flex:0 0 32px;
  object-fit:cover;
  border-radius:var(--radius-sm);
  border:1px solid var(--line-200);
  background:var(--bg-100);
}
.nav-mega-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.nav-mega-desc{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:11px;
  font-weight:500;
  line-height:1.35;
  color:var(--ink-400);
  white-space:normal;
}
.nav-mega-list a:hover,
.nav-mega-list a:focus-visible{background:var(--bg-100);color:var(--blue-700)}

@media (max-width:680px){
  .nav-mega{display:none}
}