/* ====================================
   ANIMATIONS.CSS
   IESJ Futurista Tropical
   ==================================== */

/* === KEYFRAMES === */

@keyframes slideInUp {
    from { opacity: 0; transform: translateY(40px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes slideInLeft {
    from { opacity: 0; transform: translateX(-40px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(40px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInScale {
    from { opacity: 0; transform: scale(0.92); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-12px); }
}

@keyframes floatSlow {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    33%       { transform: translateY(-8px) rotate(1deg); }
    66%       { transform: translateY(4px) rotate(-0.5deg); }
}

@keyframes pulse {
    0%   { box-shadow: 0 0 0 0 rgba(255,215,0,0.6); }
    70%  { box-shadow: 0 0 0 16px rgba(255,215,0,0); }
    100% { box-shadow: 0 0 0 0 rgba(255,215,0,0); }
}

@keyframes ripple {
    to { transform: scale(4); opacity: 0; }
}

@keyframes gradientShift {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes shimmer {
    0%   { left: -100%; }
    100% { left: 200%; }
}

@keyframes glow {
    0%, 100% { text-shadow: 0 0 8px rgba(0,217,255,0); }
    50%       { text-shadow: 0 0 16px rgba(0,217,255,0.5); }
}

@keyframes borderPulse {
    0%, 100% { border-color: var(--iesj-gold); }
    50%       { border-color: var(--iesj-cyan); }
}

/* === ELEMENTOS CON ANIMACIÓN DE ENTRADA === */

/* Activados via JS cuando entran al viewport */
body.iesj-modern .animate-ready {
    opacity: 0;
    transform: translateY(30px);
}

body.iesj-modern .animate-ready.animated {
    animation: slideInUp 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

body.iesj-modern .animate-ready.animated:nth-child(1) { animation-delay: 0.05s; }
body.iesj-modern .animate-ready.animated:nth-child(2) { animation-delay: 0.12s; }
body.iesj-modern .animate-ready.animated:nth-child(3) { animation-delay: 0.19s; }
body.iesj-modern .animate-ready.animated:nth-child(4) { animation-delay: 0.26s; }
body.iesj-modern .animate-ready.animated:nth-child(n+5) { animation-delay: 0.33s; }

/* === TARJETAS Y POSTS === */
body.iesj-modern .av-masonry-entry,
body.iesj-modern .av-blog-overview article,
body.iesj-modern .post-entry:not(.post-entry-type-page),
body.iesj-modern .av-team-member {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease,
                box-shadow var(--transition-smooth), border-color var(--transition-smooth);
}

body.iesj-modern .av-masonry-entry.is-visible,
body.iesj-modern .av-blog-overview article.is-visible,
body.iesj-modern .post-entry:not(.post-entry-type-page).is-visible,
body.iesj-modern .av-team-member.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* === CARDS PÁGINAS INSTITUCIONALES (Fase 5B+) === */
body.iesj-modern .iesj-dir-card,
body.iesj-modern .iesj-sede-cn,
body.iesj-modern .iesj-coord-cn,
body.iesj-modern .iesj-stat-card,
body.iesj-modern .iesj-sg-card,
body.iesj-modern .iesj-tl-item {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.55s ease, transform 0.55s ease;
}

body.iesj-modern .iesj-dir-card.is-visible,
body.iesj-modern .iesj-sede-cn.is-visible,
body.iesj-modern .iesj-coord-cn.is-visible,
body.iesj-modern .iesj-stat-card.is-visible,
body.iesj-modern .iesj-sg-card.is-visible,
body.iesj-modern .iesj-tl-item.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* === CARDS DEL MURO (inicio) === */
body.iesj-modern .iesj-muro-card {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

body.iesj-modern .iesj-muro-card.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* === TÍTULOS ESPECIALES CON GLOW === */
body.iesj-modern .avia-section.dark h2,
body.iesj-modern .avia-section.dark h3 {
    animation: glow 4s ease-in-out infinite;
}

/* === HEADER SLIDE DOWN === */
body.iesj-modern #header {
    animation: slideInUp 0.5s ease-out;
}

/* === ICONOS FLOTANTES === */
body.iesj-modern .av-icon-char,
body.iesj-modern .avia-icon,
body.iesj-modern .iconfont {
    transition: all var(--transition-smooth) !important;
}

body.iesj-modern .av-icon-char:hover,
body.iesj-modern .avia-icon:hover {
    animation: float 2s ease-in-out infinite;
}

/* === IMÁGENES CON HOVER ZOOM === */
body.iesj-modern .av-masonry-outerimage-container img,
body.iesj-modern .avia-img-lazy-loading,
body.iesj-modern .wp-post-image,
body.iesj-modern .av-gallery-img img {
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                filter 0.5s ease !important;
}

body.iesj-modern .av-masonry-entry:hover .av-masonry-outerimage-container img,
body.iesj-modern .av-gallery-img:hover img {
    transform: scale(1.08) !important;
    filter: brightness(1.05) saturate(1.1) !important;
}

/* === EFECTO RIPPLE EN CLICKS === */
body.iesj-modern .ripple-effect {
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,0.4);
    transform: scale(0);
    animation: ripple 0.6s ease-out;
    pointer-events: none;
    width: 60px;
    height: 60px;
    margin-left: -30px;
    margin-top: -30px;
}

/* === MENÚ MÓVIL === */
body.iesj-modern #av-burger-menu-main,
body.iesj-modern .av-nav-hamburger {
    transition: transform var(--transition-smooth) !important;
}

body.iesj-modern #av-burger-menu-main:hover,
body.iesj-modern .av-nav-hamburger:hover {
    transform: scale(1.1) rotate(5deg) !important;
}

/* === LINKS CON SUBRAYADO ANIMADO === */
body.iesj-modern .entry-content a:not(.button):not(.avia-button),
body.iesj-modern .av-magazine-content-wrap a {
    position: relative;
    color: var(--iesj-navy) !important;
    text-decoration: none !important;
    transition: color var(--transition-fast) !important;
}

body.iesj-modern .entry-content a:not(.button):not(.avia-button)::after,
body.iesj-modern .av-magazine-content-wrap a::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--iesj-gold), var(--iesj-cyan));
    transition: width var(--transition-smooth);
    border-radius: 2px;
}

body.iesj-modern .entry-content a:not(.button):not(.avia-button):hover::after,
body.iesj-modern .av-magazine-content-wrap a:hover::after {
    width: 100%;
}

body.iesj-modern .entry-content a:not(.button):not(.avia-button):hover {
    color: var(--iesj-navy-dark) !important;
}

/* === EXCEPCIÓN SIDEBAR — anula el color navy en todos los enlaces del sidebar === */
body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-links li a,
body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-social a,
body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-contact a {
    color: #ffffff !important;
    text-decoration: none !important;
}

/* Quitar el subrayado animado dentro del sidebar */
body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-links li a::after,
body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-social a::after,
body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-contact a::after {
    display: none !important;
}

/* Hover: dorado en enlaces, dorado en redes sociales */
body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-links li a:hover {
    color: #FFD700 !important;
}

body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-widget .iesj-sidebar-social a {
    color: #ffffff !important;
}

body.iesj-modern .entry-content .iesj-sidebar .iesj-sidebar-widget .iesj-sidebar-social a:hover {
    color: #FFD700 !important;
}

/* === CUADROS DOC-HEADER (páginas con PDF) ===
   Fuerza texto blanco sobre fondos navy en .iesj-doc-header
   para todas las páginas actuales y futuras.
   Especificidad 0,4,1 + !important para vencer regla de links. */

body.iesj-modern .entry-content .iesj-doc-header {
    color: #ffffff !important;
}
body.iesj-modern .entry-content .iesj-doc-header h1,
body.iesj-modern .entry-content .iesj-doc-header h2,
body.iesj-modern .entry-content .iesj-doc-header h3 {
    color: #FFD700 !important;
}
body.iesj-modern .entry-content .iesj-doc-header p {
    color: #e8eaf6 !important;
}
body.iesj-modern .entry-content .iesj-doc-header .iesj-doc-subtitle {
    color: #00D9FF !important;
}
body.iesj-modern .entry-content .iesj-doc-header a,
body.iesj-modern .entry-content .iesj-doc-header a:visited {
    color: #ffffff !important;
}
body.iesj-modern .entry-content .iesj-download-btn,
body.iesj-modern .entry-content .iesj-download-btn:visited,
body.iesj-modern .entry-content .iesj-download-btn:hover {
    color: #07163A !important;
}

/* === SMOOTH SCROLL === */
html {
    scroll-behavior: smooth;
}

/* === HOME ICON ALIGNMENT (eliminado — se usa texto estándar) === */

/* === REDUCIR ANIMACIONES (accesibilidad) === */
@media (prefers-reduced-motion: reduce) {
    body.iesj-modern *,
    body.iesj-modern *::before,
    body.iesj-modern *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* === TRANSICIÓN DE PÁGINA === */
body.iesj-modern {
    animation: fadeInScale 0.4s ease-out;
}
