/* RAMAD SLIDESHOW PURO - CSS NATIVO */

/* Asegurar altura completa */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* Sección home - altura completa */
#home {
    height: 100vh !important;
    min-height: 100vh !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

#home .view {
    height: 100vh !important;
    min-height: 100vh !important;
    position: relative !important;
}

#home .view .content {
    position: relative !important;
    z-index: 3 !important;
    height: 100vh !important;
    min-height: 100vh !important;
}

/* Contenedores del slideshow - altura completa */
#ramad-slideshow-desktop-2025,
#ramad-slideshow-mobile-2025 {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    min-height: 100vh !important;
    z-index: 1 !important;
    overflow: hidden !important;
}

/* CRÍTICO: Todas las imágenes del slideshow altura completa */
#ramad-slideshow-desktop-2025 img,
#ramad-slideshow-mobile-2025 img,
.ramad-slide-image {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    min-height: 100vh !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* Contenedores responsivos */
.ramad-desktop-only { display: none; }
.ramad-mobile-only { display: block; }

@media (min-width: 992px) {
    .ramad-desktop-only { display: block; }
    .ramad-mobile-only { display: none; }
}

/* Paginación - OCULTA */
.ramad-pagination {
    display: none !important;
    visibility: hidden !important;
}

/* EFECTOS SIMPLES DE ZOOM Y PANNING */
.ramad-slide-image {
    transition: transform 12s ease-in-out !important;
    transform-origin: center center !important;
}

/* Efectos específicos por slide */
.ramad-effect-zoom-in {
    animation: ramadZoomIn 12s ease-in-out infinite alternate;
}

.ramad-effect-zoom-out {
    animation: ramadZoomOut 12s ease-in-out infinite alternate;
}

.ramad-effect-pan-left {
    animation: ramadPanLeft 12s ease-in-out infinite alternate;
}

.ramad-effect-pan-right {
    animation: ramadPanRight 12s ease-in-out infinite alternate;
}

.ramad-effect-pan-up {
    animation: ramadPanUp 12s ease-in-out infinite alternate;
}

.ramad-effect-pan-down {
    animation: ramadPanDown 12s ease-in-out infinite alternate;
}

/* Animaciones de efectos */
@keyframes ramadZoomIn {
    0% { transform: scale(1.0); }
    100% { transform: scale(1.1); }
}

@keyframes ramadZoomOut {
    0% { transform: scale(1.1); }
    100% { transform: scale(1.0); }
}

@keyframes ramadPanLeft {
    0% { transform: scale(1.05) translateX(0%); }
    100% { transform: scale(1.05) translateX(-3%); }
}

@keyframes ramadPanRight {
    0% { transform: scale(1.05) translateX(-3%); }
    100% { transform: scale(1.05) translateX(0%); }
}

@keyframes ramadPanUp {
    0% { transform: scale(1.05) translateY(0%); }
    100% { transform: scale(1.05) translateY(-3%); }
}

@keyframes ramadPanDown {
    0% { transform: scale(1.05) translateY(-3%); }
    100% { transform: scale(1.05) translateY(0%); }
}