/* ==========================================================================
   iBlocker – Tailwind patch + motion enhancements
   Colócalo DESPUÉS de tailwind.min.css
   ========================================================================== */

/* Calidad de vida */
html { scroll-behavior: smooth; }
::selection { background:#f53d6c; color:#fff; }

/* “Slash opacity” ausentes en build */
/* bg-white/.. */
.bg-white\/5  { background-color: rgba(255,255,255,.05); }
.bg-white\/10 { background-color: rgba(255,255,255,.10); }
.bg-white\/20 { background-color: rgba(255,255,255,.20); }
.bg-white\/40 { background-color: rgba(255,255,255,.40); }
.bg-white\/90 { background-color: rgba(255,255,255,.90); }
/* text-white/.. */
.text-white\/90 { color: rgba(255,255,255,.90); }
.text-white\/80 { color: rgba(255,255,255,.80); }
.text-white\/70 { color: rgba(255,255,255,.70); }
.text-white\/60 { color: rgba(255,255,255,.60); }
.text-white\/50 { color: rgba(255,255,255,.50); }

/* Grid utilities faltantes */
.grid { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0,1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (min-width:768px){
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

/* Sombras extra */
.shadow-2xl {
  box-shadow:
    0 25px 50px -12px rgba(0,0,0,.25),
    0 10px 15px -3px rgba(0,0,0,.10);
}

/* Hover sutil en tarjetas con borde */
.rounded-2xl.border {
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  will-change: transform;
}
.rounded-2xl.border:hover {
  transform: translateY(-4px);
  border-color: rgba(255,255,255,.28);
  box-shadow: 0 18px 40px -10px rgba(245,61,108,.25);
}

/* Spacing utilities usadas en tus listas */
.space-y-2 > :not([hidden]) ~ :not([hidden]) { margin-top: .5rem; }
.space-y-3 > :not([hidden]) ~ :not([hidden]) { margin-top: .75rem; }

/* Botones (micro-interacciones) */
a.group .rounded-full {
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
a.group:hover .rounded-full { transform: translateY(-1px); }
a.group:active .rounded-full { transform: translateY(0); }

/* Nav sticky con blur (añadido por JS con .is-sticky) */
.is-sticky {
  background: rgba(31,10,15,.35);
  border-color: rgba(255,255,255,.12) !important;
  transition: background-color .25s ease, border-color .25s ease, backdrop-filter .25s ease;
}
@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
  .is-sticky {
    -webkit-backdrop-filter: saturate(160%) blur(8px);
            backdrop-filter: saturate(160%) blur(8px);
  }
}

/* Panel móvil: slide-in suave */
section#home > .fixed.top-0.left-0.bottom-0.max-w-xs {
  transform: translateX(-100%);
  transition: transform .28s ease;
}
section#home > .fixed.top-0.left-0.bottom-0.max-w-xs:not(.hidden) {
  transform: translateX(0);
}

/* Animaciones sutiles */
@keyframes float {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-8px); }
  100% { transform: translateY(0); }
}
@keyframes twinkle {
  0%,100% { opacity: .35; }
  50%     { opacity: .7;  }
}
/* Estrellas del hero */
img[src*="stars-pattern1.svg"] { animation: float 9s ease-in-out infinite; }
img[src*="stars-pattern2.svg"] { animation: float 10s ease-in-out infinite .4s; }
/* Imagen principal del hero */
section#home .max-w-5xl img { animation: float 12s ease-in-out infinite; }

/* Hover de imágenes en tarjetas */
.rounded-xl img { transition: transform .35s ease, opacity .35s ease; }
.rounded-xl:hover img { transform: scale(1.015); }

/* Carrusel de testimonios más sedoso */
[x-data*="activeSlide"] .transition-transform { transition-duration: 600ms; }

/* Focus accesible */
:focus-visible {
  outline: 3px solid rgba(245,61,108,.55);
  outline-offset: 2px;
}
a.rounded-full:focus-visible,
button.rounded-full:focus-visible {
  box-shadow: 0 0 0 4px rgba(245,61,108,.30);
}

/* Respeto por “reducir movimiento” */
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Ajustes tipográficos menores */
h1,h2,h3 { letter-spacing: -0.01em; }