/* #######################################################################
 * 🐢 TRTL — Nav CSS
 * Document: /assets/css/nav.css
 * Version:  v1.2.1-TRTL
 * Role:     topbar + primary nav only
 ####################################################################### */

.tn-topbar{
  position:sticky;
  top:0;
  z-index:30;

  display:flex;
  align-items:center;
  gap:24px;

  height:68px;
  padding:0 24px;

  background:var(--surface);
  border-bottom:1px solid var(--border);
}

.tn-topbar .brand a{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:700;
  color:var(--t-fg);
  text-decoration:none;
}

.tn-nav{
  display:flex;
  align-items:center;
  gap:28px;
}

.tn-link{
  position:relative;
  padding:10px 2px;
  color:var(--t-fg);
  text-decoration:none;
  font-weight:500;
  transition:color .25s ease;
}

.tn-link::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:-10px;
  height:3px;
  border-radius:3px;
  background:var(--t-green);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}

.tn-link:hover::after{ transform:scaleX(1); }

/* Active page underline */
.tn-link[aria-current="page"]::after{
  transform:scaleX(1);
}

/* Kill any legacy ink bars */
.tn-nav .ink,
.tn-ink,
.nav-ink,
.nav__ink{ display:none !important; }