/* header-override.css */
/* ------------------------------------------------------
   Scope: anything inside your existing .desktop-nav
   or .main-nav  (adjust selector names if they differ)
   ------------------------------------------------------*/

/* A — neutralise the old line */
.desktop-nav a::after,
.main-nav a::after{
  content:none !important;           /* kills pseudo-element */
}

/* B — new hover line driven by background-size */
.desktop-nav a,
.main-nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  line-height: var(--header-h, 70px);
  /* ↓ replace padding:0 with: */
  padding-top: 25px;     
  /* if you used horizontal padding elsewhere, it will still apply */
  background-image: linear-gradient(90deg, #10b981, #3b82f6);
  background-repeat: no-repeat;
  background-position: 0 100%; /* still sits at the bottom of the box */
  background-size: 0 2px;
  transition: background-size .3s ease-out, color .2s;
}


.desktop-nav a:hover,
.main-nav a:hover{
  color:#10b981;                     /* text tint on hover */
  background-size:100% 2px;          /* full-width under-line */
}