/*
 * Casa Púrpura — movimiento en el sitio público.
 *
 * Reglas: el contenido nunca espera a una animación para verse; el movimiento solo confirma lo que la
 * persona hace (pasar el mouse, tocar, abrir). Duraciones de 120–220 ms y sin zoom de fotos que tarde.
 * Se carga después de themes.css para reemplazar los efectos de la plantilla original.
 */
:root {
    --cp-ease-out: cubic-bezier(.2, .8, .2, 1);
    --cp-motion-fast: 120ms;
    --cp-motion-base: 200ms;
}

/* El contenido marcado para "aparecer" ya no se oculta mientras carga el JS. */
[data-animate] { opacity: 1; }
[data-animate].animated { animation: none; }

/* Fotos de tarjetas y mosaicos: zoom leve y corto en vez de ×1.3 durante 1 s. */
.hover-zoom-in img,
.hover-zoom-in .img,
.hover-zoom-in .card-img { transition: transform 300ms var(--cp-ease-out); }
.hover-zoom-in:hover img,
.hover-zoom-in:hover .img,
.hover-zoom-in:hover .card-img { transform: scale(1.03); }

/* Galería de la ficha: al pasar el mouse la foto se oscurece un poco (indica que se puede abrir), sin moverse. */
.cp-photo-tile { overflow: hidden; }
.cp-photo-tile .card-img { transition: filter var(--cp-motion-fast) ease-out; }
.cp-photo-tile:hover .card-img { filter: brightness(.88); }
.cp-photo-tile .card-img:focus-visible { outline: 3px solid #671ab0; outline-offset: -3px; }

/* Brillo decorativo al pasar el mouse: fuera. */
.hover-shine::before { content: none; }

/* Segunda foto al pasar el mouse en tarjetas: sí ayuda (muestra más de la propiedad), pero rápido. */
.hover-change-image .hover-image,
.hover-change-image .image { transition: opacity var(--cp-motion-base) ease-out; }

/* Mientras cargan las fotos, un fondo neutro en vez de un hueco blanco. */
.hover-change-image,
.cp-photo-tile .card-img { background-color: #f1eff5; }

.hover-to-top { transition: transform var(--cp-motion-base) var(--cp-ease-out), opacity var(--cp-motion-base) ease-out; }
.hover-to-top:hover { transform: translateY(-3px); }

/* Al tocar una tarjeta en el teléfono: respuesta inmediata de que se abrió. */
.property-card,
.cp-card-wrap > a > .card { transition: box-shadow var(--cp-motion-base) ease, transform var(--cp-motion-fast) ease-out; }
.property-card:active,
.cp-card-wrap > a:active > .card { transform: scale(.985); }

/* Sin hover real (pantallas táctiles) no hay efectos de hover que se queden "pegados". */
@media (hover: none) {
    .hover-zoom-in:hover img,
    .hover-zoom-in:hover .img,
    .hover-zoom-in:hover .card-img { transform: none; }
    .cp-photo-tile:hover .card-img { filter: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    .hover-zoom-in:hover img,
    .hover-zoom-in:hover .img,
    .hover-zoom-in:hover .card-img,
    .property-card:active,
    .cp-card-wrap > a:active > .card,
    .hover-to-top:hover { transform: none; }
}

/* Visor de fotos: aparece y cambia de foto con un fundido corto (sin esperar al cerrar). */
.mfp-zoom-in.mfp-bg { opacity: 0; transition: opacity 160ms ease-out; }
.mfp-zoom-in.mfp-bg.mfp-ready { opacity: .8; }
.mfp-zoom-in.mfp-bg.mfp-removing { opacity: 0; }
.mfp-zoom-in .mfp-with-anim { opacity: 0; transform: scale(.98); transition: opacity 160ms ease-out, transform 160ms var(--cp-ease-out); }
.mfp-zoom-in.mfp-ready .mfp-with-anim { opacity: 1; transform: none; }
.mfp-zoom-in.mfp-removing .mfp-with-anim { opacity: 0; transform: scale(.98); }

/* Encabezado fijo: se esconde y vuelve al hacer scroll en 200 ms (antes, medio segundo de "all"). */
.sticky-area,
.sticky-area-wrap { transition: transform var(--cp-motion-base) var(--cp-ease-out), box-shadow var(--cp-motion-base) ease, background-color var(--cp-motion-base) ease; }