/* ==========================================================================
   03E-SPECIAL: Special and Consolidated Components
   
   Recuadro Azul (blue container) and Listado Dinámico (dynamic list) 
   components migrated from 05-cooperacion.css. Includes responsive breakpoints.
   ========================================================================== */

/* ==========================================================================
   RECUADRO AZUL (Blue Container) - From 05-cooperacion.css
   ========================================================================== */

.recuadro-azul {
    background-color: #37BAD9 !important;
    border-radius: 12px !important;
    margin-top: var(--wp--preset--spacing--40) !important;
    margin-bottom: var(--wp--preset--spacing--40) !important;
    min-height: auto !important;
    padding-top: var(--wp--preset--spacing--50) !important;
    padding-right: var(--wp--preset--spacing--50) !important;
    padding-bottom: var(--wp--preset--spacing--50) !important;
    padding-left: var(--wp--preset--spacing--50) !important;
}

.recuadro-azul .enlace-destacado-wraper {
    background-color: transparent !important;
    border-radius: 0 !important;
    margin-top: var(--wp--preset--spacing--30) !important;
    margin-bottom: var(--wp--preset--spacing--30) !important;
    padding-top: var(--wp--preset--spacing--30) !important;
    padding-bottom: var(--wp--preset--spacing--30) !important;
    min-height: auto !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
}

.recuadro-azul .enlace-destacado-wraper:hover {
    transform: translateY(-2px) !important;
}

.recuadro-azul .enlace-destacado-wraper:hover p a {
    color: #ffffff !important;
}

@media (max-width: 768px) {
    .recuadro-azul {
        padding-top: var(--wp--preset--spacing--40) !important;
        padding-right: var(--wp--preset--spacing--40) !important;
        padding-bottom: var(--wp--preset--spacing--40) !important;
        padding-left: var(--wp--preset--spacing--40) !important;
    }
}


/* ==========================================================================
   LISTADO DINÁMICO (Dynamic List) - From 05-cooperacion.css
   ========================================================================== */

.listado-dinamico li,
.wp-block-list li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.listado-dinamico li a,
.wp-block-list li a {
    color: #000000 !important;
    text-decoration: none !important;
    display: block !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

.listado-dinamico li a:hover,
.wp-block-list li a:hover {
    color: #37BAD9 !important;
    background-color: rgba(55, 186, 217, 0.1) !important;
    padding-left: 12px !important;
    transform: translateX(4px) !important;
}

.listado-dinamico li:last-child a,
.wp-block-list li:last-child a {
    border-bottom: none !important;
}

@media (max-width: 768px) {
    .listado-dinamico li a,
    .wp-block-list li a {
        padding: 12px 0 !important;
        font-size: 16px !important;
    }
}