.brand-logo {
  display: block;
  width: 260px;
  height: 64px;
  overflow: hidden;
  background: transparent;
}

.brand-logo img {
  display: block;
  width: 260px;
  max-width: none;
  height: auto;
  transform: translateY(-40px);
}

.navlinks .overview-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 14px;
  border: 1px solid rgba(255, 105, 0, .38);
  border-radius: 999px;
  color: var(--deep);
  background: rgba(255, 255, 255, .72);
  transition: .2s;
}

.navlinks .overview-link:hover {
  color: #fff;
  border-color: var(--orange);
  background: var(--orange);
  transform: translateY(-1px);
}

.navlinks .btn {
  position: relative;
  overflow: hidden;
  padding: 10px 15px;
  font-size: .82rem;
  box-shadow: 0 8px 20px rgba(255, 105, 0, .19);
  animation: project-button-breathe 3.2s ease-in-out infinite;
}

.navlinks .btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 20%, rgba(255, 255, 255, .42) 47%, transparent 72%);
  transform: translateX(-140%);
  animation: project-button-shine 4.8s ease-in-out infinite;
  pointer-events: none;
}

.navlinks .btn:hover {
  animation-play-state: paused;
}

.ticker {
  padding: 0;
}

.ticker-track {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: ticker-scroll 24s linear infinite;
}

.ticker-set {
  display: flex;
  align-items: center;
  min-width: max-content;
  padding: 15px 0;
}

.ticker:hover .ticker-track {
  animation-play-state: paused;
}

@keyframes project-button-breathe {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}

@keyframes project-button-shine {
  0%, 62% { transform: translateX(-140%); }
  86%, 100% { transform: translateX(140%); }
}

@keyframes ticker-scroll {
  to { transform: translateX(-16.6666667%); }
}

@media (max-width: 1080px) {
  .brand-logo {
    width: 205px;
    height: 52px;
  }

  .brand-logo img {
    width: 205px;
    transform: translateY(-31px);
  }

  .navlinks {
    gap: 15px;
  }

  .navlinks .overview-link {
    padding: 8px 11px;
    font-size: .78rem;
  }
}

@media (max-width: 580px) {
  .brand-logo {
    width: 172px;
    height: 46px;
  }

  .brand-logo img {
    width: 172px;
    transform: translateY(-26px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .navlinks .btn,
  .navlinks .btn::after,
  .ticker-track {
    animation: none;
  }
}