/* ExchangeRateFinder – minimal custom styles (Tailwind handles the rest) */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Sidebar / mobile drawer */
#mobileMenu {
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* FAQ answer slide */
.faq-answer {
  animation: slideDown 0.2s ease-out;
}
@keyframes slideDown {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Result pulse on update */
@keyframes pulse-once {
  0%   { transform: scale(1);    opacity: 1; }
  50%  { transform: scale(1.04); opacity: 0.85; }
  100% { transform: scale(1);    opacity: 1; }
}
.pulse { animation: pulse-once 0.35s ease; }

/* Spinner */
.spinner {
  border: 3px solid #e5e7eb;
  border-top-color: #3b82f6;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  animation: spin 0.7s linear infinite;
  display: inline-block;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Gradient hero */
.hero-gradient {
  background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #06b6d4 100%);
}

/* Card hover lift */
.card-hover { transition: transform 0.2s, box-shadow 0.2s; }
.card-hover:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(0,0,0,0.1); }

/* Active nav link */
.nav-active { color: #3b82f6; border-bottom: 2px solid #3b82f6; }

/* Table striped already via Tailwind; extra focus for buttons */
button:focus-visible, a:focus-visible {
  outline: 3px solid #3b82f6;
  outline-offset: 2px;
}