/* ==============================================
   Verona Navbar
   Tall layout + animated underline accent
   ============================================== */

:root {
  --verona-nav-accent: var(--bs-primary, #D51C29);
  --verona-nav-accent-soft: #ff6a6a;
  --verona-nav-underline-thickness: 2px;
  --nav-logo-h: 56px;
  --nav-logo-h-sm: 48px;
  --nav-vpad: 0.75rem;
  --nav-link-vpad: 0.35rem;
}

.navbar.nav-tall {
  padding-top: var(--nav-vpad);
  padding-bottom: var(--nav-vpad);
}

.navbar.nav-tall .brandbar {
  display: flex;
  align-items: flex-end;
  padding-left: 0.5rem;
}

.navbar.nav-tall .brand-logo {
  height: var(--nav-logo-h);
  width: auto;
  object-fit: contain;
}

.navbar.nav-tall.navbar-dark .navbar-brand,
.navbar.nav-tall.navbar-dark .nav-link {
  color: #f8f9fa !important;
}

.navbar.nav-tall .navbar-nav .nav-link {
  font-size: 1.05rem;
  padding: var(--nav-link-vpad) 0.75rem;
  position: relative;
  transition: color 0.2s ease, transform 0.15s ease;
  overflow: hidden;
}

.navbar.nav-tall .navbar-nav .nav-link::after {
  content: "";
  position: absolute;
  left: 0.75rem;
  right: 0.75rem;
  bottom: 0.1rem;
  height: var(--verona-nav-underline-thickness);
  background: linear-gradient(
    90deg,
    var(--verona-nav-accent),
    var(--verona-nav-accent-soft)
  );
  transform: scaleX(0);
  transform-origin: center;
  opacity: 0;
  transition:
    transform 0.25s ease-out,
    opacity 0.25s ease-out;
}

.navbar.nav-tall .navbar-nav .nav-link:hover::after,
.navbar.nav-tall .navbar-nav .nav-link:focus-visible::after,
.navbar.nav-tall .navbar-nav .nav-link.active::after {
  transform: scaleX(1);
  opacity: 1;
}

.navbar.nav-tall .navbar-nav .nav-link:hover,
.navbar.nav-tall .navbar-nav .nav-link:focus-visible,
.navbar.nav-tall .navbar-nav .nav-link.active {
  color: #ffffff !important;
}

.navbar.nav-tall .btn-outline-light {
  border-color: rgba(255, 255, 255, 0.4);
}

.footer-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 40px;
}

.footer-copy,
.footer-links a {
  color: rgba(255, 255, 255, 0.88);
}

.footer-links a {
  line-height: 1.5rem;
  display: inline-block;
  vertical-align: middle;
}

.footer-links a:hover,
.footer-links a:focus-visible {
  color: #ffffff;
}

@media (max-width: 991.98px) {
  .navbar.nav-tall .brand-logo {
    height: var(--nav-logo-h-sm);
  }

  .navbar.nav-tall > .container,
  .navbar.nav-tall > .container-fluid {
    align-items: center;
  }

  .navbar.nav-tall .navbar-collapse {
    margin-top: 0.5rem;
  }

  .footer-links a {
    margin-left: 0 !important;
    margin-right: 1rem;
  }
}
