/* Per Barangay page specific styles */
#barangay-hero {
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.8), rgba(79, 70, 229, 0.7));
    position: relative;
  }
  
  /* Animations */
  .animate-fade-in {
    opacity: 0;
    animation: fadeIn 1.5s ease-in-out forwards;
  }
  
  .animate-slide-up {
    opacity: 0;
    transform: translateY(20px);
    animation: slideUp 1.5s ease-in-out forwards;
    animation-delay: 0.3s;
  }
  
  .animate-slide-up-delay {
    opacity: 0;
    transform: translateY(20px);
    animation: slideUp 1.5s ease-in-out forwards;
    animation-delay: 0.6s;
  }
  
  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  
  @keyframes slideUp {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
  }
  
  /* Custom gradients */
  .cta-gradient {
    background: linear-gradient(135deg, #4F46E5, #1E40AF);
  }
  
  /* Smooth scrolling */
  html {
    scroll-behavior: smooth;
  }
  
  /* Custom shadows */
  .custom-shadow {
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }
  
  /* Responsive images */
  img {
    max-width: 100%;
    height: auto;
    object-fit: cover;
  }
  
  /* Ensure section backgrounds align with body unless specified */
  body {
    background-color: #F9FAFB; /* bg-gray-50 */
  }
  
  section:not(.cta-gradient, #barangay-hero) {
    background-color: inherit;
  }
  
  /* Mobile adjustments */
  @media (max-width: 768px) {
    #barangay-hero h1 {
      font-size: 2.5rem;
    }
    #barangay-hero p {
      font-size: 1.25rem;
    }
  }