.mfp-zoom-in .mfp-with-anim{opacity:0;transform:scale(.8);transition:all .2s ease-in-out}.mfp-zoom-in.mfp-bg{opacity:0;transition:all .3s ease-out}.mfp-zoom-in.mfp-ready .mfp-with-anim{opacity:1;transform:scale(1)}.mfp-zoom-in.mfp-ready.mfp-bg{opacity:.8}.mfp-zoom-in.mfp-removing .mfp-with-anim{opacity:0;transform:scale(.8)}.mfp-zoom-in.mfp-removing.mfp-bg{opacity:0}.mfp-fade.mfp-bg{opacity:0;transition:all .15s ease-out}.mfp-fade.mfp-bg.mfp-ready{opacity:.8}.mfp-fade.mfp-bg.mfp-removing{opacity:0}.mfp-fade.mfp-wrap .mfp-content{opacity:0;transition:all .15s ease-out}.mfp-fade.mfp-wrap.mfp-ready .mfp-content{opacity:1}.mfp-fade.mfp-wrap.mfp-removing .mfp-content{opacity:0}.mfp-bg{background:#0b0b0b;filter:alpha(opacity=80);opacity:.8;overflow:hidden;z-index:2100}.mfp-bg,.mfp-wrap{height:100%;left:0;position:fixed;top:0;width:100%}.mfp-wrap{-webkit-backface-visibility:hidden;outline:none!important;z-index:2200}.mfp-container{box-sizing:border-box;height:100%;left:0;padding:0 8px;position:absolute;text-align:center;top:0;width:100%}.mfp-container:before{content:"";display:inline-block;height:100%;vertical-align:middle}.mfp-align-top .mfp-container:before{display:none}.mfp-content{display:inline-block;margin:0 auto;position:relative;text-align:left;vertical-align:middle;z-index:2400}.mfp-ajax-holder .mfp-content,.mfp-inline-holder .mfp-content{cursor:auto;width:100%}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:zoom-out}.mfp-zoom{cursor:pointer;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-arrow,.mfp-close,.mfp-counter,.mfp-preloader{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none!important}.mfp-preloader{color:#ccc;left:8px;margin-top:-.8em;position:absolute;right:8px;text-align:center;top:50%;width:auto;z-index:2300}.mfp-preloader a{color:#ccc}.mfp-preloader a:hover{color:#fff}.mfp-s-error .mfp-content,.mfp-s-ready .mfp-preloader{display:none}button.mfp-arrow,button.mfp-close{-webkit-appearance:none;background:transparent;border:0;box-shadow:none;cursor:pointer;display:block;outline:none;overflow:visible;padding:0;touch-action:manipulation;z-index:2400}button::-moz-focus-inner{border:0;padding:0}.mfp-close{color:#fff;font-family:Arial,Baskerville,monospace;font-size:28px;font-style:normal;height:44px;line-height:44px;opacity:.65;padding:0 0 18px 10px;position:absolute;right:0;text-align:center;text-decoration:none;top:0;width:44px}.mfp-close:focus,.mfp-close:hover{opacity:1}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#333}.mfp-iframe-holder .mfp-close,.mfp-image-holder .mfp-close{color:#fff;padding-right:6px;right:-6px;text-align:right;width:100%}.mfp-counter{color:#ccc;font-size:12px;line-height:18px;position:absolute;right:0;top:0;white-space:nowrap}.mfp-arrow{-webkit-tap-highlight-color:rgba(0,0,0,0);height:110px;margin:-55px 0 0;opacity:.65;padding:0;position:absolute;top:50%;width:90px}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:focus,.mfp-arrow:hover{opacity:1}.mfp-arrow:after,.mfp-arrow:before{border:inset transparent;content:"";display:block;height:0;left:0;margin-left:35px;margin-top:35px;position:absolute;top:0;width:0}.mfp-arrow:after{border-bottom-width:13px;border-top-width:13px;top:8px}.mfp-arrow:before{border-bottom-width:21px;border-top-width:21px;opacity:.7}.mfp-arrow-left{left:0}.mfp-arrow-left:after{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left:before{border-right:27px solid #3f3f3f;margin-left:25px}.mfp-arrow-right{right:0}.mfp-arrow-right:after{border-left:17px solid #fff;margin-left:39px}.mfp-arrow-right:before{border-left:27px solid #3f3f3f}.mfp-iframe-holder{padding-bottom:40px;padding-top:40px}.mfp-iframe-holder .mfp-content{line-height:0;max-width:900px;width:100%}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{height:0;overflow:hidden;padding-top:56.25%;width:100%}.mfp-iframe-scaler iframe{background:#000;box-shadow:0 0 8px rgba(0,0,0,.6);display:block;height:100%;left:0;position:absolute;top:0;width:100%}img.mfp-img{box-sizing:border-box;display:block;height:auto;margin:0 auto;max-width:100%;padding:40px 0;width:auto}.mfp-figure,img.mfp-img{line-height:0}.mfp-figure:after{background:#444;bottom:40px;box-shadow:0 0 8px rgba(0,0,0,.6);content:"";display:block;height:auto;left:0;position:absolute;right:0;top:40px;width:auto;z-index:-1}.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{cursor:auto;left:0;margin-top:-36px;position:absolute;top:100%;width:100%}.mfp-title{word-wrap:break-word;color:#f3f3f3;line-height:18px;padding-right:36px;text-align:left}.mfp-image-holder .mfp-content{max-width:100%}.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer}@media screen and (max-height:300px),screen and (max-width:800px)and (orientation:landscape){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{bottom:0;top:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,.6);bottom:0;box-sizing:border-box;margin:0;padding:3px 5px;position:fixed;top:auto}.mfp-img-mobile .mfp-bottom-bar:empty{padding:0}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{background:rgba(0,0,0,.6);height:35px;line-height:35px;padding:0;position:fixed;right:0;text-align:center;top:0;width:35px}}@media (max-width:900px){.mfp-arrow{transform:scale(.75)}.mfp-arrow-left{transform-origin:0}.mfp-arrow-right{transform-origin:100%}.mfp-container{padding-left:6px;padding-right:6px}}div.ccm-lightbox-popup-white{background-color:#fff;border-radius:10px;margin:0 auto;max-width:600px;padding:20px 60px 20px 20px;position:relative}.ccm-block-gallery a{position:relative}.ccm-block-gallery .ccm-block-gallery-image-overlay,.ccm-block-gallery .ccm-block-gallery-image-overlay-color,.ccm-block-gallery .ccm-block-gallery-image-overlay-text{height:100%;left:0;position:absolute;top:0;width:100%}.ccm-block-gallery .ccm-block-gallery-image-overlay{opacity:0;transition:opacity .3s}.ccm-block-gallery .ccm-block-gallery-image-overlay-color{background-color:rgba(13,110,253,.8)}.ccm-block-gallery .ccm-block-gallery-image-overlay-text{align-items:center;color:#fff;display:flex;flex-direction:column;font-weight:700;justify-content:center}.ccm-block-gallery .ccm-block-gallery-image{cursor:pointer;overflow:hidden;padding-top:calc(3.125rem + 22.5vw);position:relative;width:100%}@media(min-width:1200px){.ccm-block-gallery .ccm-block-gallery-image{padding-top:20rem}}.ccm-block-gallery img{bottom:-9999px;height:100%;left:-9999px;margin:auto;-o-object-fit:cover;object-fit:cover;position:absolute;right:-9999px;top:-9999px;width:100%}.ccm-block-gallery a:hover .ccm-block-gallery-image-overlay{opacity:1}/*! http://responsiveslides.com v1.55 by @viljamis */.rslides{list-style:none;margin:0;overflow:hidden;padding:0;position:relative;width:100%}.rslides>li{backface-visibility:hidden;display:none;left:0;margin-bottom:0!important;position:absolute;top:0;width:100%}.rslides>li:first-child{display:block;float:left;position:relative}.rslides img{border:0;display:block;float:left;height:auto;width:100%}.rslides_nav{-webkit-tap-highlight-color:rgba(0,0,0,0);background:transparent url("data:image/gif;base64,R0lGODlhTAA9AMQAABAQEDAwMO/v78/Pz7+/v39/f6+vr1BQUCAgIGBgYJ+fn0BAQN/f33BwcI+Pj////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAAAAAALAAAAABMAD0AAAXkICSOZGmeaKqubOu+cCzPdG3feK7vfO//wKBwSCwaj8ikcslsOp/QqHRKrVqv2Fog4NsiAYTHY8ALPwiAImAgFi90gfY4PVTIyTuzWDEsyAUIPAACcgVBCXIPbz1xcgk/AYRthj8Nf1yCkmIGQnZtAnQ6eg8MoT9rcgQ7jW2YQqxirjeDcg5Efp+mNweJj0G8cgc9uGICsjyRhT+eYqU+qG2cp2zRPsxzQbSTPJafga+aD984CImLQ4itOuVtvkULBgTCOwcGBvNZ+fr7/P3+/wADChxIsKDBgwgTKlzIsKFDKSEAADs=") no-repeat 0 0;height:61px;left:0;margin-top:-45px;opacity:.7;overflow:hidden;position:absolute;text-decoration:none;top:50%;width:38px;z-index:99}.rslides_tabs{padding-bottom:10px;padding-left:0;padding-top:0}.rslides_tabs li{display:inline-block;list-style-type:none;margin-right:5px}.rslides_tabs li.rslides_here a{background:#333}.rslides_tabs li a{background:#ccccc9;border-radius:30px;display:inline-block;height:15px;margin-right:10px;overflow:hidden;text-indent:-9999px;width:15px}.rslides_nav.next{background-position:100% 0;left:auto;right:0}/*! http://responsiveslides.com v1.54 by @viljamis */.ccm-image-slider{position:relative}.ccm-image-slider-text{clear:both;padding-top:1rem}.ccm-image-slider-title{margin-bottom:1rem}.rslides{margin:0 auto}a.mega-link-overlay{height:100%;left:0;position:absolute;width:100%;z-index:20}div.ccm-block-hero-image{min-height:50vh;position:relative}div.ccm-block-hero-image div.ccm-block-hero-image-cover,div.ccm-block-hero-image div.ccm-block-hero-image-text{height:50vh;left:0;position:absolute;top:0;width:100%}div.ccm-block-hero-image div.ccm-block-hero-image-text{align-items:center;display:flex;flex-direction:column;justify-content:center}div.ccm-block-hero-image div.ccm-block-hero-image-cover{z-index:2}div.ccm-block-hero-image div.ccm-block-hero-image-text{z-index:3}div.ccm-block-hero-image div.ccm-block-hero-image-image{background-position:50%;background-size:cover;height:50vh;z-index:1}


/* 1. ESTILOS PARA MÓVIL (Por defecto) */
.lista-actividades-destacadas {
    display: flex;
    flex-direction: column;
    /* Apila las tarjetas verticalmente */
    align-items: center;
    /* Centra las tarjetas en la pantalla */
    gap: .5rem;
    /* Separación holgada para facilitar el toque táctil */
    max-width: 1200px;
    margin: 0 auto 2.5rem auto;
    padding: 0 1rem;
}

.media-card {
    width: 100%;
    max-width: 220px;
    height: auto !important;
    display: flex;
    flex-direction: column;
    /* Ancho cómodo en móvil para que el texto e imagen no se vean apretados */
}

/* 2. Estilos y alineación del Título (<h3>) */
.card-link .card-title {
    grid-row: 1;
    align-self: end;
    /* Alinea el texto en la parte inferior del área reservada */
    margin: 0;
    padding-bottom: 0px !important;

    /* Tipografía */
    text-align: left;
    font-weight: 400;
    font-size: 18px !important;
    line-height: 1.2em !important;
    color: #ffffff;

    /* Truncado a máximo 3 líneas con puntos suspensivos */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 1. Definimos la tarjeta como un Grid vertical */
.card-link {
    display: grid;
    /* Fila 1: Reservamos espacio para 3 líneas (1.35em * 3 = 4.05em)
       Fila 2: La imagen ocupa su tamaño
       Fila 3: Los detalles ocupan el resto del espacio vertical */
    grid-template-rows: 4.05em auto 1fr;
    row-gap: 0.75rem;
    height: 100% !important;
    text-decoration: none;
    color: inherit;
    padding: 0px 10px 0px 10px;
    position: relative;
    border-radius: 6px;
    padding: 0.5rem 1rem;
    /* Transición suave para movimiento, sombra y color de fondo */
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1),
        background-color 0.25s ease,
        box-shadow 0.25s ease;
}

/* Preparamos el contenedor de la imagen para contener el zoom sin desbordar */
.card-figure {
    overflow: hidden;
    width: 100%;
}

.card-figure img.img-responsive {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s cubic-bezier(0.2, 0, 0, 1);
}

.card-title {
    transition: color 0.2s ease;
    font-size: 18px;
    font-family: 'SegoeUIBold';
}

/* 2. Estado HOVER (Posicionamiento del ratón) */
.card-link:hover {
    /* Fondo sutil para dar volumen sin crear bordes agresivos */
    background-color: rgba(255, 255, 255, 0.05);
    /* Eleva la tarjeta 4px hacia arriba */
    transform: translateY(-4px);
    /* Sombra suave y difuminada que simula profundidad real */
    box-shadow: 0 12px 24px -6px rgba(0, 0, 0, 0.6);
}

/* Efecto de escalado en la foto al hacer hover en la tarjeta */
.card-link:hover .card-figure img.img-responsive {
    transform: scale(1.04);
    will-change: transform;
}

/* Sutil cambio de color en el título para reforzar el estado interactivo */
.card-link:hover .card-title {
    color: #ffffff;
    /* Azul claro / Cian de alto contraste sobre fondo oscuro */
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* 3. Estado FOCUS (Navegación por Teclado / WCAG 2.4.7 y 2.4.13) */
.card-link:focus-visible {
    outline: 3px solid #ffffff;
    /* Anillo brillante de alta visibilidad */
    outline-offset: 4px;
    border-radius: 6px;
    /* Mantiene la tarjeta en su sitio o ligeramente elevada al navegar con TAB */
    transform: translateY(-2px);
}

/* 4. Estado ACTIVE (Momento del clic) */
.card-link:active {
    transform: translateY(-1px) scale(0.99);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

/* 5. Estado VISITED (Páginas ya visitadas) */
/* Es vital en tarjetas multimedia asegurar que los títulos sigan siendo legibles */
.card-link:visited .card-title {
    color: #ffffff;
    /* Mantenemos el contraste nativo sin cambiar a morados oscuros illegibles */
}

.card-link:visited:hover .card-title {
    color: #ffffff;
}

.card-details {
    min-height: 77px;
    color: #323232;
}

.card-date {
    font-size: 0.82em;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
    text-align: left;
}

.card-location {
    font-size: 0.82em;
    text-align: left;
}


/* ==========================================================================
   ESTILOS PARA EL BOTÓN "Más actividades en la agenda"
   ========================================================================== */

.btn-destacados {
    display: inline-block;
    padding: 0.75rem 1.75rem;
    border: 2px solid #ffffff;
    border-radius: 4px;
    background-color: transparent;
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.25s ease;
}

.btn-destacados:hover {
    background-color: #ffffff;
    color: #0d0d0d;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.15);
}

.btn-destacados:focus-visible {
    outline: 3px solid #38bdf8;
    outline-offset: 4px;
}

.btn-destacados:active {
    transform: translateY(0);
}

.lista-actividades-grid .card-title {
    color: #333333;
}

.lista-actividades-grid .card-link:visited .card-title {
    color: #333333;
    /* Mantenemos el contraste nativo sin cambiar a morados oscuros illegibles */
}

.lista-actividades-grid .card-link:visited:hover .card-title {
    color: #333333;
}

.lista-actividades-grid .card-link:hover .card-title {
    color: #333333;
}

.actividad-fecha,
.actividad-local {
    display: block;
    font-size: 1.2em;
    font-family: 'SegoeUI', sans-serif;
}

/* Contenedor del widget de inscripción */
.widget-inscripcion {
    display: flex;
    flex-direction: column;
    /* En móvil: apilado vertical */
    gap: 1rem;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #0e7496;
    color: #ffffff;
    /*border-radius: 6px;*/
}

.widget-inscripcion .lista-precios {
    font-family: 'SegoeUIBold', sans-serif;
    list-style-type: none;
    padding-left: 0;
    margin: 0;
    padding-bottom: .5em;
}

.widget-inscripcion .estado-plazas {
    text-transform: uppercase;
    font-family: 'SegoeUIBold', sans-serif;
}

.widget-inscripcion .detalle-grupo {
    border: none !important;
    margin-bottom: 0.1rem !important;
    padding: 0 !important;
}

.widget-inscripcion .widget-detalles {
    border: none !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
}

.widget-inscripcion .btn-destacados {
    align-self: flex-end;
    margin-bottom: 5px;
    background-color: transparent;
    border: 2px solid #ffffff;
}

.widget-inscripcion .btn-destacados:hover {
    background-color: #0d0d0d;
}

.widget-inscripcion .btn-destacados:focus-visible,
.widget-inscripcion .btn-destacados:active {
    color: #ffffff;
    background-color: #0d0d0d;
}

/* En pantallas a partir de móvil ancho / tablet: horizontal */
@media (min-width: 576px) {
    .widget-inscripcion {
        flex-direction: row;
        justify-content: space-between;
        /* Datos a la izquierda, botón a la derecha */
        align-items: center;
        /* Centrado vertical */
    }

    .widget-inscripcion .btn-destacados {
        flex-shrink: 0;
        /* Evita que el botón se comprima */
        margin-left: 1.5rem;
    }
}


/* 2. ESTILOS PARA PANTALLAS GRANDES (A partir de 680px) */
@media (min-width: 680px) {
    .lista-actividades-destacadas {
        flex-direction: row;
        /* Vuelven a ponerse en horizontal */
        justify-content: center;
        flex-wrap: wrap;
        /* Se ajustan si no caben todas */
        gap: .5rem;
        /* Separación fija entre tarjetas */
        padding: 0;
    }

    .media-card {
        flex: 0 0 225px;
        max-width: 225px;
        height: auto !important;
    }

    .lista-actividades-grid {
        display: grid;
        /* Crea columnas automáticas de mínimo 210px. 
           Con un max-width de 1200px y gap de 1.5rem, entran un MÁXIMO de 5 tarjetas por fila */
        grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
        gap: 1.75rem 1.5rem;
        /* 1.75rem vertical, 1.5rem horizontal */
        justify-content: start;
    }

    /* Anula el ancho fijo estricto para que la tarjeta se adapte a su celda del Grid */
    .lista-actividades-grid .media-card {
        flex: initial;
        width: 100%;
        max-width: 100%;
        flex: 0 0 33%;
    }
}


/* ==========================================================================
   PREFERENCIA DE MOVIMIENTO REDUCIDO (Accesibilidad Motora/Vestibular)
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    .card-link,
    .card-figure img.img-responsive,
    .btn-destacados {
        transition: none;
    }

    .card-link:hover {
        transform: none;
        /* Elimina la animación de elevación */
    }

    .card-link:hover .card-figure img.img-responsive {
        transform: none;
        /* Elimina el zoom de la foto */
    }
}

