/* ═══ MICRO-INTERACCIONES ════════════════════════════════════════════════════
   Lo que responde al dedo o al cursor. Solo transform, opacity y color:
   ninguna propiedad que provoque reflow.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Todo lo pulsable "aterriza" al presionarlo. En móvil es la única
   confirmación de que el toque se registró. */
button:active,
a[class*="b1"]:active, a[class*="bcta"]:active, a[class*="cta-b"]:active,
.cp:active, .pagar:active, .enviar:active, .bwa:active, .comprar:active {
  transform: scale(.975);
}

/* Botones principales: el brillo se desplaza al pasar el cursor */
.b1, .cta-b, .bcta, .pagar, .enviar, .cp {
  position: relative;
  overflow: hidden;
}
.b1::after, .cta-b::after, .bcta::after, .pagar::after, .enviar::after, .cp::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.42) 50%, transparent 62%);
  transform: translateX(-130%);
  transition: transform .62s cubic-bezier(.3,.9,.4,1);
  pointer-events: none;
}
.b1:hover::after, .cta-b:hover::after, .bcta:hover::after,
.pagar:hover::after, .enviar:hover::after, .cp:hover::after {
  transform: translateX(130%);
}

/* Tarjetas de evento: la imagen se acerca, la tarjeta se levanta */
.ev, .rc, .tar, .vm, .vc, .mz, .sv, .ex, .flyer {
  transition: transform .24s cubic-bezier(.16,1,.3,1),
              border-color .24s ease,
              box-shadow .24s ease;
}
.ev:hover, .rc:hover, .vm:hover, .vc:hover, .mz:hover, .ex:hover {
  box-shadow: 0 14px 40px rgba(0,0,0,.45);
}

/* Enlaces de texto: el subrayado crece desde la izquierda */
.menu a, .nav-t a, .pie-cols a, .pie a, .contactos a {
  position: relative;
}

/* Las filas de la cartelera desplazan su contenido al pasar por encima */
.ev:hover .cp, .rc:hover .cp { transform: translateX(2px); }

/* Los chips del configurador rebotan al elegirlos */
.chip { transition: transform .16s cubic-bezier(.3,1.4,.5,1), background-color .16s, border-color .16s, color .16s; }
.chip[aria-pressed="true"] { transform: scale(1.03); }

/* Detalles del acordeón: el contenido se despliega con suavidad */
.faq details[open] p { animation: abre .34s cubic-bezier(.16,1,.3,1) both; }
@keyframes abre { from { opacity: 0; transform: translateY(-6px) } to { opacity: 1; transform: none } }

/* Los campos del formulario se elevan al enfocarlos */
form input, form select, form textarea, .campo input {
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
form input:focus, form select:focus, form textarea:focus, .campo input:focus {
  box-shadow: 0 0 0 3px rgba(0,255,164,.12);
}

/* Foco visible y consistente para teclado */
:focus-visible {
  outline: 2px solid var(--huum);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .b1::after, .cta-b::after, .bcta::after, .pagar::after, .enviar::after, .cp::after { display: none }
}