/* Keyframe Animations */
@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  
  @keyframes slideInLeft {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(0); }
  }
  
  @keyframes slideInRight {
    0% { transform: translateX(100%); }
    100% { transform: translateX(0); }
  }
  
  @keyframes slideInUp {
    0% { transform: translateY(100%); }
    100% { transform: translateY(0); }
  }
  
  @keyframes slideInDown {
    0% { transform: translateY(-100%); }
    100% { transform: translateY(0); }
  }
  
  /* Animation Durations */
  :root {
    --animation-duration-fast: 0.3s;
    --animation-duration-medium: 0.5s;
    --animation-duration-slow: 0.7s;
  }
  
  /* Banner Animation */
  .banner-container {
    animation: slideInUp var(--animation-duration-medium) ease-out;
  }
  
  /* Smooth Scrolling for Navigation Links */
  html {
    scroll-behavior: smooth;
  }
  
  /* Button Hover Effects */
  .button,
  .cta-button {
    transition: background-color var(--animation-duration-fast) ease,
                color var(--animation-duration-fast) ease,
                transform var(--animation-duration-fast) ease;
  }
  
  .button:hover,
  .cta-button:hover {
    background-color: #0056b3;
    color: #fff;
    transform: translateY(-2px);
  }
  
  /* Fade-In Effect for Content Sections */
  .fade-in {
    opacity: 0;
    animation: fadeIn var(--animation-duration-fast) ease-out;
    animation-fill-mode: forwards;
  }
  
  /* Slide-In Effects for Content Sections */
  .slide-in-left {
    transform: translateX(-100%);
    animation: slideInLeft var(--animation-duration-medium) ease-out;
    animation-fill-mode: forwards;
  }
  
  .slide-in-right {
    transform: translateX(100%);
    animation: slideInRight var(--animation-duration-medium) ease-out;
    animation-fill-mode: forwards;
  }
  
  .slide-in-up {
    transform: translateY(100%);
    animation: slideInUp var(--animation-duration-medium) ease-out;
    animation-fill-mode: forwards;
  }
  
  .slide-in-down {
    transform: translateY(-100%);
    animation: slideInDown var(--animation-duration-medium) ease-out;
    animation-fill-mode: forwards;
  }