/* =====================================================
   TRITA EXECUTIVE NAV – ANIMATED PROFESSIONAL EDITION
   (Keep effects + reduced height + centered logo no-shrink)
===================================================== */

/* RESET */
*,
*::before,
*::after { box-sizing:border-box; }

/*html,body{
  margin:0!important;
  padding:0!important;
} */

/* remove template artifacts */
.header .hd-nav li > a.has-child::after{ display:none!important; }
.header .hd-nav li .sub-nav,
.header .hd-nav li .sub-nav-h{
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
}

/* =====================================================
   HEADER FOUNDATION
===================================================== */
.header{
  position:sticky;
  top:0;
  z-index:999;
  font-family:"Segoe UI", Arial, sans-serif;
}

/* =====================================================
   TITLE BAR
===================================================== */
.hd-a{
  background:linear-gradient(180deg,#10274a,#07172f);
  text-align:center;
}

.site-title h1{
  margin:0;
  font-size:clamp(14px,3vw,20px);
  font-weight:700;
  letter-spacing:4px;
  color:#fff;
}

.site-title .trita{
  display:block;
  font-size:12px;
  letter-spacing:4px;
  color:rgba(255,255,255,.85);
}

/* =====================================================
   MENU BAR
===================================================== */
.hd-b{
  background:#0a2550;
  position:relative;
}

/* =====================================================
   HAMBURGER (LEFT SIDE – CLEAN)
===================================================== */
.menu-toggle{
  display:none;
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  cursor:pointer;
  z-index:1001;
}

.menu-toggle span{
  display:block;
  height:3px;
  background:#ffffff;
  margin:5px 0;
  transition:.3s ease;
}

/* =====================================================
   MAIN MENU – DESKTOP (EQUAL CELLS)
===================================================== */
.hd-nav{
  display:flex;
  align-items:stretch;
  justify-content:stretch;
  list-style:none;
  margin:0;
  padding:0;
  width:100%;
}

/* menu cells */
.hd-nav > li{
  flex:1;
  text-align:center;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;

  border-left:1px solid rgba(255,255,255,.35);
}

.hd-nav > li:last-child{
  border-right:1px solid rgba(255,255,255,.35);
}

/* remove old pseudo separators if any exist */
.hd-nav>li:not(:last-child)::after{
  display:none !important;
}

/* =====================================================
   MENU LINK – ANIMATED (KEEP EFFECTS)
   ✅ reduced height here
===================================================== */
.hd-nav > li > a{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;

  padding:6px 0;                /* ✅ reduced from 12/14 */
  font-weight:600;
  color:#ffffff;
  text-decoration:none;
  position:relative;
  background:#0a2550;
  transition: color .25s ease, transform .25s ease;
}

/* =====================================================
   CENTER LOGO (IMAGE ONLY – NO CIRCLE)
   ✅ centered gap
   ✅ vertical lines at both sides of logo
   ✅ prevent shrinking from global img rules
===================================================== */
.hd-nav > li.nav-logo{
  flex:0 0 120px;                 /* gap width */
  border-left:1px solid rgba(255,255,255,.35);  /* line starts at logo */
  border-right:1px solid rgba(255,255,255,.35); /* line ends at logo */
  display:flex;
  align-items:center;
  justify-content:center;
}

.hd-nav > li.nav-logo a{
  width:auto;
  padding:0;
  background:transparent;         /* keep bar color */
}

.hd-nav > li.nav-logo img{
  height:46px;                    /* logo size */
  width:auto;
  display:block;

  /* ✅ cancel global max rules that shrink images */
  max-width:none;
  max-height:none;
}

/* =====================================================
   HOVER EFFECTS (KEEP YOUR PRO ANIMATION)
===================================================== */

/* underline sweep */
.hd-nav > li > a::after,
.sub-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:4px;
  width:100%;
  height:2px;
  background:#5fb0ff;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .35s ease;
}

/* glow line */
.hd-nav > li > a::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:4px;
  height:2px;
  background:#5fb0ff;
  opacity:0;
  filter:blur(6px);
  transition:opacity .35s ease;
}

/* hover lift */
.hd-nav > li:hover > a{
  transform:translateY(-2px);
}

.hd-nav > li:hover > a::after,
.sub-nav a:hover::after{
  transform:scaleX(1);
}

.hd-nav > li:hover > a::before{
  opacity:.6;
}

/* DO NOT animate logo item like text items */
.hd-nav > li.nav-logo:hover > a{
  transform:none;
}
.hd-nav > li.nav-logo a::before,
.hd-nav > li.nav-logo a::after{
  display:none !important;
}

/* =====================================================
   DROPDOWN – PREMIUM REVEAL (KEEP ANIMATION)
===================================================== */
.sub-nav{
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%) translateY(10px) rotateX(-12deg);
  transform-origin:top;
  min-width:180px;
  background:#ffffff;
  padding:6px 0;
  opacity:0;
  visibility:hidden;
  box-shadow:0 20px 40px rgba(0,0,0,.35);
  transition: opacity .35s ease, transform .45s cubic-bezier(.2,.8,.2,1);
}

.hd-nav > li:hover > .sub-nav{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(0) rotateX(0);
}

.sub-nav a{
  display:block;
  padding:12px 18px;
  font-weight:500;
  color:#0a2550;
  text-decoration:none;
  position:relative;
  transition: background .25s ease, padding-left .25s ease;
}

.sub-nav a:hover{
  background:#edf4ff;
  padding-left:26px;
}

/* =====================================================
   MOBILE – ANIMATED SLIDE PANEL (KEEP)
===================================================== */
@media(max-width:992px){

  .menu-toggle{ display:block; }

  /* hide logo in mobile */
  .hd-nav > li.nav-logo{ display:none !important; }

  .hd-nav{
    position:fixed;
    top:0;
    left:-100%;
    width:85%;
    height:100vh;
    background:#ffffff;
    flex-direction:column;
    align-items:stretch;
    padding:80px 20px;
    transition:left .4s cubic-bezier(.2,.8,.2,1);
    z-index:1000;
  }

  .hd-nav.active{ left:0; }

  .hd-nav > li{
    width:100%;
    opacity:0;
    transform:translateX(-20px);
    animation:menuFade .4s ease forwards;
    border-left:none;
    border-right:none;
  }

  .hd-nav.active > li{
    animation-delay:calc(var(--i) * .05s);
  }

  @keyframes menuFade{
    to{ opacity:1; transform:translateX(0); }
  }

  .hd-nav > li > a{
    width:100%;
    padding:14px 16px;
    color:#0a2550;
    background:#f3f6fb;
    margin-bottom:8px;
    transform:none;
  }

  .sub-nav{
    position:static;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    display:none;
    box-shadow:none;
    padding-left:12px;
  }

  .hd-nav > li.open > .sub-nav{ display:block; }
}

/* =====================================================
   FINAL OVERRIDES (block old style.css spacing conflicts)
===================================================== */
.hd-b .hd-nav li{
  margin-left:0 !important;
  margin-right:0 !important;
}

.nav-parent{
  background:none;
  border:0;
  color:#fff;
  font:inherit;
  cursor:pointer;
  padding:0 .9rem;
}
