/* Fondo audiovisual controlado por el desplazamiento */
html {
  background: #061f39;
}

body {
  position: relative;
  background: transparent;
}

.scroll-video-bg {
  position: fixed;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  background: #061f39;
  pointer-events: none;
}

.scroll-video-bg video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.scroll-video-tint {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 22, 39, 0.34), rgba(4, 22, 39, 0.1) 52%, rgba(4, 22, 39, 0.26)),
    linear-gradient(0deg, rgba(4, 22, 39, 0.22), rgba(4, 22, 39, 0.06));
}

.site-header,
main,
.site-footer {
  position: relative;
  z-index: 1;
}

.site-header {
  position: sticky;
  z-index: 20;
}

.hero > img {
  display: none;
}

.hero-overlay {
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(4, 27, 49, 0.88) 0%, rgba(4, 27, 49, 0.5) 48%, rgba(4, 27, 49, 0.16) 82%),
    linear-gradient(0deg, rgba(4, 27, 49, 0.72) 0%, transparent 52%);
}

.hero-content {
  position: relative;
  z-index: 1;
}

.hero-logo {
  display: block;
  width: 72px;
  height: 96px;
  max-width: 72px;
  margin: 0 0 22px;
  border: 1px solid rgba(216, 169, 57, 0.55);
  border-radius: 11px;
  object-fit: contain;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.34);
}

.welcome,
.history,
.communion,
.mission,
.ministries,
.gallery,
.contact {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.communion,
.gallery {
  background: transparent;
}

.city-ministry,
.activities {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* El video permanece nítido: la transparencia se limita al panel de lectura. */
.section > .container {
  padding: clamp(28px, 4vw, 56px);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 28px;
  background: rgba(6, 31, 57, 0.8);
  color: #ffffff;
  box-shadow: 0 22px 60px rgba(2, 19, 35, 0.28);
}

.communion > .container,
.gallery > .container {
  background: rgba(6, 31, 57, 0.8);
}

.city-ministry > .container,
.activities > .container {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(6, 31, 57, 0.8);
}

/* Contraste alto en todos los paneles de contenido. */
.section > .container h2,
.section > .container h3,
.section > .container strong {
  color: #ffffff;
}

.section > .container p,
.section > .container .section-heading > p:last-child,
.section > .container .prose p,
.section > .container .light-prose p,
.section > .container .contact-intro > p:not(.eyebrow),
.section > .container address {
  color: rgba(255, 255, 255, 0.92);
}

.section > .container time,
.section > .container .schedule-heading > p {
  color: rgba(255, 255, 255, 0.9);
}

.section > .container .eyebrow,
.section > .container .eyebrow.dark,
.section > .container .card-label,
.section > .container .timeline-item span,
.section > .container .ministry-card > span,
.section > .container .contact-card > span {
  color: #f0d595;
}

.section > .container blockquote {
  color: rgba(255, 255, 255, 0.92);
}

.section > .container cite,
.section > .container .contact-card a,
.section > .container address strong {
  color: #f0d595;
}

.section > .container .timeline-item,
.section > .container .mission-card,
.section > .container .ministry-card,
.section > .container .contact-card {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(11, 49, 88, 0.88);
  color: #ffffff;
  box-shadow: 0 14px 34px rgba(1, 13, 25, 0.22);
}

.timeline-item,
.mission-card,
.ministry-card,
.contact-card {
  background: rgba(11, 49, 88, 0.88);
}

.timeline-item.featured {
  background: rgba(11, 49, 88, 0.84);
}

.site-footer {
  background: rgba(6, 31, 57, 0.72);
}

/* Galería ampliada */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 235px;
  grid-auto-flow: dense;
  gap: 18px;
}

.gallery-item,
.gallery-item img {
  min-height: 0;
}

.gallery-item {
  height: 100%;
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-feature {
  grid-column: span 2;
  grid-row: span 2;
}

.gallery-wide {
  grid-column: span 2;
}

.gallery-tall,
.pastor-photo {
  grid-row: span 2;
}

.pastor-photo img {
  object-position: center top;
}

@media (max-width: 980px) {
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 230px;
  }

  .gallery-feature,
  .gallery-wide {
    grid-column: span 2;
  }
}

@media (max-width: 700px) {
  .scroll-video-bg video {
    object-position: center center;
  }

  .hero-logo {
    width: 56px;
    height: 75px;
    max-width: 56px;
    margin-bottom: 18px;
  }

  .section > .container {
    padding: 24px 20px;
    border-radius: 20px;
    background: rgba(6, 31, 57, 0.84);
  }

  .communion > .container,
  .gallery > .container {
    background: rgba(6, 31, 57, 0.84);
  }

  .city-ministry > .container,
  .activities > .container {
    background: rgba(6, 31, 57, 0.84);
  }

  .gallery-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 285px;
  }

  .gallery-feature,
  .gallery-wide,
  .gallery-tall,
  .pastor-photo {
    grid-column: span 1;
    grid-row: span 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-item img {
    transition: none;
  }
}