/* =========================================================
   CTA Lava Lamp (movimiento más evidente + 4 colores)
   ========================================================= */
.cta-lava{
  /* 🎨 Paleta (4 colores max) */
  --c1: #ff6a00;
  --c2: #0a9c70; 
  --c3: #0a9c70;
  --c4: #ff6a00;

  --base: #660000; 
  position: relative;
  overflow: hidden;
  padding-block: 64px;
  background: var(--base);
}

/* “Lava” con 3 capas: base + blobs + noise */
.cta-lava::before,
.cta-lava::after{
  content:"";
  position:absolute;
  inset:-30%;
  pointer-events:none;
  transform: translate3d(0,0,0);
}

/* Capa principal: blobs grandes que se mueven bastante */
.cta-lava::before{
  background:
    radial-gradient(circle at 25% 25%, color-mix(in srgb, var(--c1) 85%, transparent) 0 22%, transparent 52%),
    radial-gradient(circle at 75% 20%, color-mix(in srgb, var(--c3) 75%, transparent) 0 20%, transparent 55%),
    radial-gradient(circle at 35% 80%, color-mix(in srgb, var(--c2) 80%, transparent) 0 22%, transparent 58%),
    radial-gradient(circle at 85% 85%, color-mix(in srgb, var(--c4) 70%, transparent) 0 20%, transparent 60%);
  filter: blur(32px) saturate(1.35) contrast(1.05);
  opacity: .75;
  animation: lavaMoveA 9s cubic-bezier(.45,0,.2,1) infinite;
}

/* Capa secundaria: blobs más chicos + otro ritmo (se cruza con la primera) */
.cta-lava::after{
  background:
    radial-gradient(circle at 15% 60%, color-mix(in srgb, var(--c3) 70%, transparent) 0 18%, transparent 55%),
    radial-gradient(circle at 55% 15%, color-mix(in srgb, var(--c4) 65%, transparent) 0 16%, transparent 58%),
    radial-gradient(circle at 60% 85%, color-mix(in srgb, var(--c1) 75%, transparent) 0 18%, transparent 60%),
    radial-gradient(circle at 95% 45%, color-mix(in srgb, var(--c2) 70%, transparent) 0 16%, transparent 62%);
  filter: blur(44px) saturate(1.45) contrast(1.08);
  opacity: .55;
  mix-blend-mode: screen; /* hace que “mezcle” mejor sobre fondo oscuro */
  animation: lavaMoveB 12s cubic-bezier(.45,0,.2,1) infinite;
}

/* Card tipo “glass” */
.cta-lava__card{
  position: relative;
  z-index: 1;
  padding: 26px 26px;
  border-radius: 24px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 60px rgba(0,0,0,.45);
  backdrop-filter: blur(12px);
}

/* Botón */
.cta-lava__btn{
  border-radius: 14px;
  font-weight: 700;
  box-shadow: 0 12px 26px rgba(0,0,0,.25);
  transition: transform .15s ease, box-shadow .15s ease;
}
.cta-lava__btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 38px rgba(0,0,0,.30);
}

/* Animaciones: más amplitud => más “vida” */
@keyframes lavaMoveA{
  0%   { transform: translate(-10%, -8%) scale(1.12) rotate(0deg); }
  30%  { transform: translate(14%,  -6%) scale(1.18) rotate(18deg); }
  60%  { transform: translate(-8%,  12%) scale(1.14) rotate(-14deg); }
  100% { transform: translate(-10%, -8%) scale(1.12) rotate(0deg); }
}
@keyframes lavaMoveB{
  0%   { transform: translate(12%, 10%) scale(1.16) rotate(0deg); }
  35%  { transform: translate(-14%, 6%) scale(1.22) rotate(-22deg); }
  70%  { transform: translate(8%, -12%) scale(1.18) rotate(16deg); }
  100% { transform: translate(12%, 10%) scale(1.16) rotate(0deg); }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  .cta-lava::before,
  .cta-lava::after{ animation: none !important; }
}







/* Eventos Home */

/* E.3 Carrusel destacado – tamaño fijo */
#featuredEventsCarousel .carousel-item {
  aspect-ratio: 3 / 1;  
}
/* Forzamos que todo el contenido estire */
#featuredEventsCarousel .carousel-item > .row {
  height: 100%;
}
/* Columna imagen */
#featuredEventsCarousel .carousel-item .col-md-7 {
  height: 100%;
}
/* Imagen siempre cubre el espacio */
#featuredEventsCarousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* E.4 Carrusel (controles visibles y prolijos) */
.carousel-pro .carousel-control-prev,
.carousel-pro .carousel-control-next{
  width: 56px;
  background: rgba(0,0,0,.25);
  backdrop-filter: blur(4px);
  border-radius: 14px;
  top: 50%;
  transform: translateY(-50%);
  height: 64px;
}

.carousel-pro .carousel-control-prev{ left: 10px; }
.carousel-pro .carousel-control-next{ right: 10px; }

.carousel-pro .carousel-control-prev-icon,
.carousel-pro .carousel-control-next-icon{
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.55));
}

/* Cards pro */
.card-pro{
  border: 0;
  border-radius: 16px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
}

.card-pro:hover{
  transform: translateY(-2px);
  box-shadow: 0 .75rem 1.5rem rgba(0,0,0,.12) !important;
}

/* Media (imagen fija) */
.card-pro__media{
  position: relative;
  aspect-ratio: 4 / 3; /* consistente */
  background: #e9ecef;
  overflow: hidden;
}

.card-pro__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.card-pro__ph{
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #dee2e6, #f8f9fa);
}

.card-pro__overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.00) 40%, rgba(0,0,0,.35) 100%);
}

.card-pro__badges{
  position: absolute;
  left: 10px;
  top: 10px;
  display: flex;
  gap: 6px;
}
