/* Premium colored borders for the two professional tools in the header. */
.navlinks > a:not(.nav-test):not(.nav-interview) {
  padding: 9px 10px;
  border: 1px solid var(--nav-accent, #60758d);
  border-radius: 6px;
  background: color-mix(in srgb, var(--nav-accent, #60758d) 7%, transparent);
  box-shadow: inset 0 0 14px color-mix(in srgb, var(--nav-accent, #60758d) 5%, transparent);
  transition: color .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.navlinks > a:nth-child(1) { --nav-accent: #aebdce; }
.navlinks > a:nth-child(2) { --nav-accent: #a879ff; }
.navlinks > a:nth-child(3) { --nav-accent: #39a8ff; }
.navlinks > a:nth-child(4) { --nav-accent: #d8ad4c; }
.navlinks > a:nth-child(5) { --nav-accent: #7f9dff; }
.navlinks > a:nth-child(6) { --nav-accent: #66c7ff; }

.navlinks .nav-info {
  --nav-accent: #ff4b4b;
  flex: none;
  padding: 10px 14px;
  border: 1.5px solid #ff7777;
  background: linear-gradient(135deg, #e31b23, #a90614);
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .45px;
  box-shadow: 0 0 0 1px #ff6a6a22, 0 0 20px #ed1c2e4d;
}

.navlinks .nav-info:hover {
  color: #fff;
  border-color: #ffaaaa;
  background: linear-gradient(135deg, #fa2934, #c40d1c);
  box-shadow: 0 8px 25px #ed1c2e73, 0 0 24px #ff405066;
}

.navlinks > a:not(.nav-test):not(.nav-interview):hover {
  color: #fff;
  border-color: color-mix(in srgb, var(--nav-accent) 82%, #fff);
  background: color-mix(in srgb, var(--nav-accent) 16%, transparent);
  box-shadow: 0 0 18px color-mix(in srgb, var(--nav-accent) 32%, transparent), inset 0 0 17px color-mix(in srgb, var(--nav-accent) 10%, transparent);
  transform: translateY(-2px);
}

.navlinks .nav-test,
.navlinks .nav-interview {
  position: relative;
  overflow: hidden;
  border: 1.5px solid transparent;
  border-radius: 6px;
  isolation: isolate;
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

.navlinks .nav-test {
  background:
    linear-gradient(135deg, #176fdf, #124ea8) padding-box,
    linear-gradient(115deg, #7cecff, #2f8cff 48%, #a881ff) border-box;
  box-shadow: 0 0 0 1px #68dfff1f, 0 0 20px #238cff45;
}

.navlinks .nav-interview {
  background:
    linear-gradient(135deg, #091524, #111d30) padding-box,
    linear-gradient(115deg, #e9f2fb, #64b7ff 48%, #a979ff) border-box;
  box-shadow: 0 0 0 1px #dcecff17, 0 0 20px #6d8dff2e;
}

.navlinks .nav-test::after,
.navlinks .nav-interview::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(105deg, transparent 28%, #ffffff25 48%, transparent 68%);
  transform: translateX(-120%);
  transition: transform .55s ease;
  pointer-events: none;
}

.navlinks .nav-test:hover,
.navlinks .nav-interview:hover {
  color: #fff;
  transform: translateY(-2px);
  filter: brightness(1.08);
}

.navlinks .nav-test:hover {
  box-shadow: 0 0 0 1px #7cecff38, 0 8px 25px #238cff62;
}

.navlinks .nav-interview:hover {
  box-shadow: 0 0 0 1px #dcecff2b, 0 8px 25px #8c73ff4f;
}

.navlinks .nav-test:hover::after,
.navlinks .nav-interview:hover::after {
  transform: translateX(120%);
}

@media (max-width: 760px) {
  .navlinks > a:not(.nav-test):not(.nav-interview),
  .navlinks .nav-test,
  .navlinks .nav-interview {
    width: 100%;
    padding: 12px 14px;
    text-align: center;
  }
  .navlinks .nav-info {
    width: 100%;
    padding: 13px 14px;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .navlinks > a:not(.nav-test):not(.nav-interview),
  .navlinks .nav-test,
  .navlinks .nav-interview,
  .navlinks .nav-test::after,
  .navlinks .nav-interview::after {
    transition: none;
  }
}

/* Footer links use one consistent hierarchy. */
.footer-grid .footer-interview {
  color: inherit;
  font-weight: 400;
  line-height: inherit;
}