Antorchas Encendidas

<section class="antorchas-gallery">
  <style>
    .antorchas-gallery {
      max-width: 1000px;
      margin: 40px auto;
      padding: 20px;
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    .antorchas-gallery h2 {
      text-align: center;
      font-size: 28px;
      margin-bottom: 10px;
      color: #111827;
    }

    .antorchas-gallery p {
      text-align: center;
      color: #6b7280;
      margin-bottom: 25px;
      font-size: 15px;
    }

    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
      gap: 14px;
    }

    .gallery-grid a {
      display: block;
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 6px 16px rgba(0,0,0,0.12);
      border: 2px solid #f59e0b;
      background: #fff7ed;
    }

    .gallery-grid img {
      width: 100%;
      height: 130px;
      object-fit: cover;
      display: block;
      transition: transform 0.25s ease;
    }

    .gallery-grid a:hover img {
      transform: scale(1.08);
    }
  </style>

  <h2>📸 Galería del Ministerio</h2>
  <p>Momentos de servicio, oración y amor compartido.</p>

  <div class="gallery-grid">

    <a href="Site design – Dashboard" target="_blank">
      <img src="URL-DE-LA-FOTO-1" alt="Galería Antorchas Encendidas">
    </a>

    <a href="URL-DE-LA-FOTO-2" target="_blank">
      <img src="URL-DE-LA-FOTO-2" alt="Galería Antorchas Encendidas">
    </a>

    <a href="URL-DE-LA-FOTO-3" target="_blank">
      <img src="URL-DE-LA-FOTO-3" alt="Galería Antorchas Encendidas">
    </a>

    <a href="URL-DE-LA-FOTO-4" target="_blank">
      <img src="URL-DE-LA-FOTO-4" alt="Galería Antorchas Encendidas">
    </a>

    <a href="URL-DE-LA-FOTO-5" target="_blank">
      <img src="URL-DE-LA-FOTO-5" alt="Galería Antorchas Encendidas">
    </a>

    <a href="URL-DE-LA-FOTO-6" target="_blank">
      <img src="URL-DE-LA-FOTO-6" alt="Galería Antorchas Encendidas">
    </a>

  </div>
</section>