/* ==== The Extra Inch - Main Nav (namespaced) ==== */
.tei-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

:root{
  --tei-bg:#0b1220;
  --tei-fg:#e7e9ee;
  --tei-fg-dim:#b6bdc9;
  --tei-accent:#2ea7ff;
  --tei-border:#1b2333;
  --tei-radius:14px;
  --tei-shadow:0 6px 20px rgba(0,0,0,.18);
  --tei-z:5000;
}

/* Shell */
.tei-nav{position:sticky;top:0;z-index:var(--tei-z);background:var(--tei-bg);color:var(--tei-fg);box-shadow:var(--tei-shadow)}
.tei-nav__inner{max-width:1280px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px}

/* Brand */
.tei-nav__brand{color:var(--tei-fg);text-decoration:none;font-weight:700;letter-spacing:.2px;padding:8px 10px;border-radius:10px}
.tei-nav__brand:focus-visible{outline:2px solid var(--tei-accent);outline-offset:2px}

/* Toggle (mobile) */
.tei-nav__toggle{margin-left:auto;border:0;background:transparent;color:var(--tei-fg);display:flex;flex-direction:column;gap:4px;padding:10px;border-radius:10px}
.tei-nav__toggle span[aria-hidden]{display:block;width:22px;height:2px;background:var(--tei-fg);border-radius:2px}
.tei-nav__toggle:focus-visible{outline:2px solid var(--tei-accent);outline-offset:2px}

/* Menu */
.tei-nav__menu{list-style:none;margin:0;padding:0;display:none;flex-direction:column;width:100%}
.tei-nav[data-open="true"] .tei-nav__menu{display:flex}
.tei-nav__menu > li{position:relative}
.tei-nav__link,.tei-nav__menu > li > a{display:block;padding:10px 12px;text-decoration:none;color:var(--tei-fg);border-radius:10px}
.tei-nav__link:hover,.tei-nav__menu > li > a:hover{background:#121a2b}
.tei-nav__link:focus-visible{outline:2px solid var(--tei-accent);outline-offset:2px}

/* Submenu toggles (mobile) */
.has-sub{--caret:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23b6bdc9' stroke-width='2'/%3E%3C/svg%3E")}
.tei-sub__toggle{position:absolute;right:2px;top:6px;border:0;background:transparent;width:36px;height:36px;border-radius:10px}
.tei-sub__toggle::after{content:"";display:block;width:10px;height:6px;margin:0 auto;background-image:var(--caret);background-repeat:no-repeat;background-position:center}
.tei-sub__toggle:focus-visible{outline:2px solid var(--tei-accent);outline-offset:2px}

/* Submenu list */
.tei-submenu{list-style:none;margin:0 0 8px 0;padding:4px;display:none;border:1px solid var(--tei-border);border-radius:12px;background:#0e1729}
.has-sub[data-open="true"]>.tei-submenu{display:block}
.tei-submenu a{display:block;padding:8px 10px;border-radius:8px;color:var(--tei-fg-dim);text-decoration:none}
.tei-submenu a:hover{background:#121a2b;color:var(--tei-fg)}

/* Spacer + Login (CTA) */
.tei-nav__spacer{display:none}
.tei-nav__cta{display:inline-block;text-decoration:none;color:#0b1220;background:var(--tei-accent);padding:8px 12px;border-radius:999px;font-weight:700}

/* Desktop layout */
@media (min-width:960px){
  .tei-nav__toggle{display:none}
  .tei-nav__menu{display:flex!important;flex-direction:row;align-items:center;gap:4px;width:auto;margin-left:16px}
  .tei-nav__menu>li{padding:4px 2px}
  .tei-nav__spacer{display:block;flex:1}
  .has-sub>.tei-sub__toggle{display:none}
  .has-sub:hover>.tei-submenu,.has-sub:focus-within>.tei-submenu{
    display:block;position:absolute;left:0;top:100%;min-width:240px;margin-top:8px;padding:8px;box-shadow:var(--tei-shadow);z-index:var(--tei-z)
  }
}

/* Active state */
.tei-nav__menu a.is-active{background:#121a2b;color:var(--tei-fg)}

/* --- Desktop: remove hover gap and enlarge handoff area --- */
@media (min-width: 960px){
  /* 1) Kill the vertical gap between parent and dropdown */
  .has-sub:hover > .tei-submenu,
  .has-sub:focus-within > .tei-submenu{
    margin-top: 0;        /* override previous 8px */
    top: 100%;            /* dropdown touches the parent item */
  }

  /* 2) Add an invisible cushion under the parent item so the hover doesn't drop */
  .has-sub{
    padding-bottom: 12px; /* expands the hover hitbox downwards */
  }
}