/* ================================================================
   PAGE SUB-NAV — Sticky sibling navigation below page hero
   Depends on: layout.css
================================================================ */

.page-subnav {
  position:      sticky;
  top:           var(--header-height);
  z-index:       var(--z-sticky);
  background:    var(--bg-primary);
  border-bottom: 1px solid var(--border-standard);
  box-shadow:    0 2px 8px var(--border-subtle);
  transition:    top 0.28s ease;
}

/* Quando l'header si compatta, il sub-nav sale di conseguenza */
.header-is-compact .page-subnav {
  top: var(--header-height-compact);
}

.page-subnav__inner {
  display:         flex;
  overflow-x:      auto;
  scrollbar-width: none;
}

.page-subnav__inner::-webkit-scrollbar {
  display: none;
}

.page-subnav__link {
  display:         inline-block;
  padding:         var(--space-2) var(--space-4);
  font-family:     var(--font-body);
  font-size:       var(--text-xs);
  font-weight:     500;
  color:           var(--text-nav);
  text-decoration: none;
  border-bottom:   2px solid transparent;
  white-space:     nowrap;
  letter-spacing:  var(--tracking-wide);
  text-transform:  uppercase;
  transition:      color .2s, border-color .2s;
}

.page-subnav__link:hover {
  color: var(--text-nav-hover);
}

.page-subnav__link--active {
  color:               var(--color-gold);
  border-bottom-color: var(--color-gold);
  font-weight:         600;
}

@media (max-width: 768px) {
  .page-subnav__link {
    padding: var(--space-2) var(--space-3);
  }
}