body { font-family: 'Poppins', sans-serif; }
html { scroll-behavior: smooth; }

/* Aparición al hacer scroll */
.reveal { opacity: 0; transform: translateY(24px); transition: all .6s ease; }
.reveal.show { opacity: 1; transform: none; }

/* ===== FONDO DIFUMINADO ===== */
.bg-collage {
  position: absolute; inset: -10%;
  display: grid; grid-template-columns: repeat(3, 1fr);
  filter: blur(38px) saturate(1.5);   /* ← más blur = más difuminado */
  opacity: .55;                       /* ← sube/baja la intensidad */
  transform: scale(1.1);
}
@media (min-width: 640px)  { .bg-collage { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1024px) { .bg-collage { grid-template-columns: repeat(6, 1fr); } }
.bg-collage img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }

.bg-overlay {
  background: linear-gradient(180deg, #02040acc 0%, #02040a99 45%, #02040af0 100%);
}

/* Aros de neón */
.ring {
  position: absolute; border-radius: 9999px; aspect-ratio: 1;
  border: 6px solid #38bdf8;
  box-shadow: 0 0 40px #38bdf8aa, inset 0 0 40px #38bdf855;
  opacity: .5; filter: blur(1px);
  animation: ringFloat 9s ease-in-out infinite;
}
.ring-a { width: min(38vw, 420px); top: -8%; left: -8%; }
.ring-b {
  width: min(42vw, 480px); bottom: -12%; right: -10%;
  border-color: #a855f7;
  box-shadow: 0 0 40px #a855f7aa, inset 0 0 40px #a855f755;
  animation-delay: -4s;
}
@keyframes ringFloat {
  0%,100% { transform: translate(0,0) scale(1); }
  50%     { transform: translate(14px,-18px) scale(1.04); }
}

/* Hero (sin fondo sólido para que se vea el difuminado) */
.hero-bg {
  background:
    radial-gradient(circle at 15% 25%, #1e90ff22, transparent 50%),
    radial-gradient(circle at 85% 75%, #a855f722, transparent 50%);
}

/* Iconos de la barra de beneficios */
.feat {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; flex-shrink: 0; padding: 9px;
  border-radius: 12px; background: #1e90ff22; color: #38bdf8;
}

/* Logo con brillo neón + flotando */
.logo-glow { filter: drop-shadow(0 0 28px #1e90ff88); }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
.float { animation: float 4s ease-in-out infinite; }

/* Botón flotante WhatsApp */
@keyframes pulseRing {
  0%   { box-shadow: 0 0 0 0 #25d36688; }
  100% { box-shadow: 0 0 0 18px #25d36600; }
}
.pulse { animation: pulseRing 1.8s infinite; }

/* Tarjetas */
.card-img img { transition: transform .5s ease; }
.card:hover .card-img img { transform: scale(1.08); }

/* Chips con scroll horizontal sin barra */
#chips { scrollbar-width: none; }
#chips::-webkit-scrollbar { display: none; }

/* Modal animado */
#modal.open { display: flex; }
#backdrop { opacity: 0; transition: opacity .3s ease; }
#panel { opacity: 0; transform: translateY(20px) scale(.95); transition: all .3s ease; }
#modal.show #backdrop { opacity: 1; }
#modal.show #panel { opacity: 1; transform: none; }
body.no-scroll { overflow: hidden; }

#panel::-webkit-scrollbar { width: 6px; }
#panel::-webkit-scrollbar-thumb { background: #1e90ff66; border-radius: 6px; }