<section id="gallery" class="py-20 bg-white"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="text-center mb-12" data-aos="fade-up"> <h2 id="gallery-heading" class="text-4xl font-extrabold text-primary-blue mb-4"> {{ 'gallery.heading'|trans }} </h2> <p id="gallery-subtext" class="text-xl text-gray-600"> {{ 'gallery.subtext'|trans }} </p> </div> <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-12" id="gallery-container"> </div> <div class="text-center" data-aos="fade-up"> <a href="#contact" class="inline-flex items-center px-8 py-3 bg-gold text-primary-blue font-bold rounded-lg shadow-lg hover:bg-yellow-600 transition duration-300 transform hover:scale-105"> <i class="fas fa-camera mr-2"></i> <span id="gallery-cta">{{ 'gallery.cta'|trans }}</span> </a> </div> </div></section>