/* Animaciones decorativas */
@keyframes blob {
  0%,100% { transform: scale(1) translate(0,0); }
  33% { transform: scale(1.1) translate(20px,-20px); }
  66% { transform: scale(0.9) translate(-20px,20px); }
}
.animate-blob { animation: blob 8s infinite ease-in-out; }
.delay-1000 { animation-delay: 1s; }
.delay-2000 { animation-delay: 2s; }

/* Fade in */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate-fade { animation: fadeIn 1s ease-out forwards; }
.delay-300 { animation-delay: .3s; }
.delay-500 { animation-delay: .5s; }
.delay-800 { animation-delay: .8s; }
.delay-1100 { animation-delay: 1.1s; }
.delay-1400 { animation-delay: 1.4s; }

/* Accesibilidad */
.high-contrast { filter: invert(1) hue-rotate(180deg); }
.reading-mode { line-height: 1.8; font-family: serif; }

/* Usabilidad general */
html { scroll-behavior: smooth; }

.rv-card {
  cursor: pointer;
  outline: none;
}

.rv-card:hover {
  transform: translateY(-2px);
}

.rv-card:focus-visible {
  box-shadow: 0 0 0 4px rgba(49, 25, 147, .25);
}

.rv-card .card-desc {
  transition: color .2s ease;
}

.rv-card:hover .card-desc {
  color: #374151; /* gris 700 */
}


/* Tarjetas Respirar – efecto de contorno y sombra */
.rv-card {
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    outline 0.2s ease,
    outline-offset 0.2s ease;
}

/* Hover con contorno morado suave */
.rv-card:hover,
.rv-card:focus-visible {
  outline: 2px solid rgba(49, 25, 147, 0.35); /* #311993 con transparencia */
  outline-offset: 3px;
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
}