/* ===== Moonvival Gallery (namespaced) ===== */
.mv-gallery{
  /* variables locales, no globales */
  --mv-bg:#0b0f14; --mv-panel:#111723; --mv-muted:#1b2330;
  --mv-text:#e6eef7; --mv-sub:#9fb3c8;
  --mv-accent:#7ae4ff; --mv-accent2:#c8a9ff;
  --mv-radius:18px;
  --mv-ring:0 0 0 1px rgba(122,228,255,.25),0 0 24px rgba(122,228,255,.18);
  isolation:isolate; position:relative; z-index:5;
  background:
    radial-gradient(1200px 700px at 80% -10%,rgba(122,228,255,.10),transparent 60%),
    radial-gradient(900px 600px at 10% 0%,rgba(200,169,255,.08),transparent 60%);
  padding:48px 12px 70px;
  color:var(--mv-text);
  border-top:1px solid rgba(255,255,255,.05);
}
.mv-eyebrow{display:inline-flex;gap:.5rem;align-items:center;color:var(--mv-sub);
  letter-spacing:.18em;font-weight:600;text-transform:uppercase;font-size:.8rem}
.mv-eyebrow .mv-dot{width:10px;height:10px;border-radius:50%;
  background:linear-gradient(135deg,var(--mv-accent),var(--mv-accent2));
  box-shadow:0 0 20px rgba(122,228,255,.5)}
.mv-gallery h2{margin:.4rem 0 1rem;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.02em}
.mv-lead{max-width:820px;color:var(--mv-sub);font-size:1.05rem;margin-bottom:22px}

/* Grid */
.mv-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;max-width:1200px;margin:0 auto}
.mv-span-4{grid-column:span 4} .mv-span-6{grid-column:span 6}
.mv-span-8{grid-column:span 8} .mv-span-12{grid-column:span 12}
.mv-wide{aspect-ratio:16/9} .mv-tall{aspect-ratio:4/5}

.mv-card{position:relative;overflow:hidden;border-radius:var(--mv-radius);
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,0));
  box-shadow:var(--mv-ring); outline:1px solid rgba(255,255,255,.04); cursor:zoom-in}
.mv-card img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.02)}
.mv-card::after{content:\"\";position:absolute;inset:0;
  background:radial-gradient(600px 240px at 70% 110%,rgba(122,228,255,.18),transparent 40%);
  opacity:0;transition:opacity .35s ease}
.mv-card:hover::after{opacity:1}
.mv-card:hover img{transform:scale(1.03);transition:transform .45s cubic-bezier(.2,.7,.2,1)}

.mv-caption{position:absolute;left:0;right:0;bottom:0;padding:14px 16px 16px;
  color:#fff;font-weight:700;letter-spacing:.2px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(6,10,16,.55) 50%,rgba(6,10,16,.85) 100%)}
.mv-caption small{display:block;color:rgba(255,255,255,.85);font-weight:600}
.mv-chip{position:absolute;top:12px;left:12px;padding:6px 10px;font-size:.775rem;border-radius:999px;color:#061018;
  background:linear-gradient(135deg,var(--mv-accent),var(--mv-accent2));font-weight:800}

/* Lightbox */
#mvLightbox{width:min(1200px,92vw);max-height:90dvh;border:none;padding:0;border-radius:20px;
  overflow:hidden;background:var(--mv-panel);box-shadow:0 40px 120px rgba(0,0,0,.55)}
#mvLightbox::backdrop{background:rgba(2,6,12,.6);backdrop-filter:blur(6px)}
.mv-lb-head{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.06)}
.mv-lb-title{font-weight:800} .mv-lb-sub{color:var(--mv-sub)}
.mv-lb-actions{display:flex;gap:10px}
.mv-btn{border:none;border-radius:12px;padding:10px 12px;background:var(--mv-muted);color:var(--mv-text);
  font-weight:700;cursor:pointer}
.mv-btn.primary{background:linear-gradient(135deg,var(--mv-accent),var(--mv-accent2));color:#061018}
.mv-lb-media{background:#000}
.mv-lb-media img{display:block;width:100%;height:auto}

/* Responsive */
@media (max-width: 960px){ .mv-span-6,.mv-span-8{grid-column:span 12} }
@media (max-width: 640px){ .mv-grid{gap:14px} .mv-tall{aspect-ratio:4/3} }
#mv-gallery .mv-title{
  /* misma columna que el timeline */
  max-width: 1200px;      /* igual que el grid de la galería */
  margin: 0 auto 12px;    /* centra y conserva la línea actual */
  padding-left: 15px;     /* gutter como .container de Bootstrap */
  padding-right: 15px;
}