/* ═══════════════════════════════════════════════════════════════════════════
   Ópera de Morelia — FASE K (revised)
   Filosofía: ambient SOLO, sin fotos de fondo en text sections.
   Apple atmospheric lighting via radial gradients SUTILES.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ──────────── AMBIENT GLOWS — sutilísimos, no overpower ──────────── */
.mod-section,
.opm-numbers,
.opm-newsletter,
.mod-quote,
.mod-final-cta,
.mod-portrait,
.estudia, #contacto{
  position: relative !important;
  overflow: hidden !important;
  background: #000 !important;
  background-attachment: scroll !important;
}

.mod-section::before,
.opm-numbers::before,
.opm-newsletter::before,
.mod-quote::before,
.mod-final-cta::before,
.mod-portrait::before,
.estudia::before, #contacto::before{
  content: "" !important;
  position: absolute !important;
  top: -20% !important;
  left: -15% !important;
  width: 70% !important;
  height: 80% !important;
  background: radial-gradient(ellipse 60% 60% at 40% 40%,
    rgba(189, 176, 157, 0.05) 0%,
    rgba(189, 176, 157, 0.02) 35%,
    transparent 70%) !important;
  filter: blur(80px) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.mod-section::after,
.opm-numbers::after,
.mod-quote::after,
.mod-portrait::after,
.mod-final-cta::after{
  content: "" !important;
  position: absolute !important;
  bottom: -15% !important;
  right: -10% !important;
  width: 55% !important;
  height: 70% !important;
  background: radial-gradient(ellipse 55% 55% at 60% 50%,
    rgba(189, 176, 157, 0.035) 0%,
    rgba(189, 176, 157, 0.015) 40%,
    transparent 70%) !important;
  filter: blur(100px) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.mod-section > *,
.opm-numbers > *,
.opm-newsletter > *,
.mod-quote > *,
.mod-final-cta > *,
.mod-portrait > *,
.estudia > *, #contacto > *{
  position: relative !important;
  z-index: 2 !important;
}

/* ──────────── SECTION PADDING — Apple tight flow ──────────── */
.mod-section{
  padding-top: clamp(110px, 14vh, 160px) !important;
  padding-bottom: clamp(110px, 14vh, 160px) !important;
}
.opm-numbers,
.opm-newsletter,
.mod-portrait,
.mod-quote,
.mod-final-cta{
  padding: clamp(120px, 16vh, 180px) 0 !important;
}

/* ──────────── INTRO SECTION — keep simple, photo abajo bien proporcionada ──────────── */
.mod-intro-split{
  display: block !important;
  text-align: center !important;
  max-width: none !important;
  padding: 0 !important;
}
.mod-intro-split .mod-intro-text{
  max-width: 880px !important;
  margin: 0 auto 64px !important;
  padding: 0 clamp(24px, 6vw, 80px) !important;
  text-align: center !important;
}
.mod-intro-split .mod-intro-img{
  display: block !important;
  max-width: 1180px !important;
  width: calc(100% - 48px) !important;
  margin: 0 auto !important;
  aspect-ratio: 21 / 9 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  position: relative !important;
  box-shadow: 0 30px 80px -20px rgba(0,0,0,0.6) !important;
}
.mod-intro-split .mod-intro-img img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* ──────────── PHOTO MOMENT (existente) — tipografía MASSIVE bien alineada ──────────── */
.mod-photomoment{
  min-height: clamp(560px, 85vh, 800px) !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: flex-end !important;
  padding: 0 !important;
}
.mod-photomoment-img,
.mod-photomoment > img,
.mod-photomoment-bg img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  z-index: 1 !important;
}
.mod-photomoment{
  align-items: flex-start !important; /* text TOP, photo composition has empty top */
}
.mod-photomoment::after{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.35) 35%, rgba(0,0,0,0.15) 60%, rgba(0,0,0,0.3) 100%),
    radial-gradient(ellipse 70% 50% at 30% 25%, rgba(0,0,0,0.55) 0%, transparent 65%) !important;
  pointer-events: none !important;
}
.mod-photomoment .mod-inner,
.mod-photomoment-text{
  position: relative !important;
  z-index: 5 !important;
  max-width: 1280px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: clamp(72px, 14vh, 140px) clamp(24px, 6vw, 80px) 0 !important;
  text-align: left !important;
}
.mod-photomoment h2,
.mod-photomoment .mod-photomoment-text,
.mod-photomoment p{
  font-family: var(--font-display, 'Fraunces'), Georgia, serif !important;
  font-variation-settings: "opsz" 144, "SOFT" 50, "wght" 500 !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: clamp(2.4rem, 5.4vw, 4.4rem) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.025em !important;
  color: #F2EDE2 !important;
  max-width: 720px !important;
  margin: 0 0 14px !important;
  text-align: left !important;
  text-shadow: 0 2px 30px rgba(0,0,0,0.6) !important;
}
.mod-photomoment-caption-meta,
.mod-photomoment-caption,
.mod-photomoment small,
.mod-photomoment span,
.mod-photomoment p.meta{
  font-family: var(--font-body, 'Inter Tight'), sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.78) !important;
  margin: 0 !important;
  font-style: normal !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.7) !important;
}

/* ──────────── NEWSLETTER alignment — perfect center Apple ──────────── */
.opm-newsletter-inner{
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 0 clamp(24px, 6vw, 64px) !important;
  text-align: center !important;
}
.opm-newsletter-h2{
  margin: 0 auto 18px !important;
  max-width: 720px !important;
}
.opm-newsletter-lede{
  margin: 0 auto 40px !important;
  max-width: 520px !important;
}
.opm-newsletter-form{
  margin: 0 auto !important;
  max-width: 480px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  justify-content: center !important;
}
.opm-newsletter-fine{
  margin: 24px auto 0 !important;
  max-width: 480px !important;
}

/* ──────────── FINAL CTA — subtle group homenaje background ──────────── */
.mod-final-cta{
  background-image:
    linear-gradient(180deg, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0.96) 100%),
    url('/img/2026/la-mulata-museo/grupo-homenaje-flores.jpg') !important;
  background-size: cover !important;
  background-position: center 30% !important;
}

.mod-final-cta .mod-inner{
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 0 clamp(24px, 6vw, 64px) !important;
  text-align: center !important;
}
.mod-final-cta .mod-h2,
.mod-final-cta .mod-lede,
.mod-final-cta .mod-cta-row{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ──────────── REMOVE all background-attachment fixed ──────────── */
*[style*="background-attachment"]{
  background-attachment: scroll !important;
}

/* ──────────── KILL the broken backgrounds I added ──────────── */
.mod-section--d-warm,
.mod-section--d-midnight,
.mod-section--d-cool,
.mod-section--d-apple,
.mod-section--d-base{
  background-image: none !important;
  background: #000 !important;
}