/* Fade In Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  @keyframes fadeInDown {
    from {
      opacity: 0;
      transform: translateY(-20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  /* Apply Animations */
  .hero-content h2 {
    animation: fadeInDown 1s ease both;
  }
  
  .hero-content p {
    animation: fadeInUp 1s ease both 0.2s;
  }
  
  .hero-content .btn {
    animation: fadeInUp 1s ease both 0.4s;
  }
  
  .section {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 1s ease forwards;
  }
  
  .section:nth-child(1) { animation-delay: 0.2s; }
  .section:nth-child(2) { animation-delay: 0.4s; }
  .section:nth-child(3) { animation-delay: 0.6s; }
  
  /* Gallery Overlay Effect */
  .gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.8));
    color: white;
    padding: 1.5rem;
    transform: translateY(100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
  }
  
  .gallery-item:hover .gallery-overlay {
    transform: translateY(0);
  }
  
  .gallery-overlay h3 {
    margin-bottom: 1rem;
    font-size: 1.2rem;
  }
  
  .gallery-overlay .btn {
    background: rgba(255,255,255,0.2);
    border: 1px solid white;
  }
  
  .gallery-overlay .btn:hover {
    background: var(--primary);
    border-color: var(--primary);
  }