/* Ajustes específicos de la portada en móviles. */
@media (max-width: 700px) {
    .flacso-oferta-mosaico__card,
    .flacso-oferta-mosaico__card:nth-child(2n),
    .flacso-oferta-mosaico__card--featured,
    .flacso-oferta-mosaico__card--wide {
        min-height: 200px;
        aspect-ratio: 16 / 9;
        border-radius: 18px;
    }

    /*
     * Estas tarjetas son enlaces completos sobre fotografía. Kadence y algunos
     * estilos de contenido pueden asignar color propio a <p>, <span> o enlaces
     * visitados; se fija explícitamente el esquema claro del componente.
     */
    .flacso-main-page .flacso-oferta-mosaico__card,
    .flacso-main-page .flacso-oferta-mosaico__card:visited,
    .flacso-main-page .flacso-oferta-mosaico__card:hover,
    .flacso-main-page .flacso-oferta-mosaico__card:focus-visible {
        color: #ffffff !important;
    }

    .flacso-oferta-mosaico__media img {
        object-fit: cover;
        object-position: center 42%;
    }

    /*
     * Contraste localizado: oscurece principalmente la zona izquierda, donde
     * vive el texto, y deja visible la mayor parte de la fotografía. Evita que
     * el overlay convierta toda la tarjeta en una superficie casi negra.
     */
    .flacso-oferta-mosaico__card::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        background:
            linear-gradient(
                90deg,
                rgba(3, 15, 35, 0.78) 0%,
                rgba(3, 15, 35, 0.62) 32%,
                rgba(3, 15, 35, 0.42) 55%,
                rgba(3, 15, 35, 0.18) 78%,
                rgba(3, 15, 35, 0.02) 100%
            ),
            linear-gradient(
                0deg,
                rgba(3, 15, 35, 0.28) 0%,
                rgba(3, 15, 35, 0.08) 45%,
                transparent 72%
            );
    }

    /* Evita sumar una segunda capa distinta y mantiene un único contraste predecible. */
    .flacso-oferta-mosaico__media::after {
        background: none;
    }

    .flacso-oferta-mosaico__content {
        position: relative;
        z-index: 1;
        width: min(76%, 325px);
        justify-content: flex-end;
        align-items: flex-start;
        padding: 1.15rem 1.2rem;
        gap: 0.48rem;
        color: #ffffff !important;
    }

    .flacso-main-page .flacso-oferta-mosaico__content h3,
    .flacso-main-page .flacso-oferta-mosaico__card:not(.flacso-oferta-mosaico__card--featured) .flacso-oferta-mosaico__content h3 {
        margin: 0;
        color: #ffffff !important;
        font-size: clamp(1.35rem, 7vw, 1.8rem);
        font-weight: 850;
        line-height: 1.05;
        text-shadow: 0 2px 9px rgba(0, 0, 0, 0.58);
    }

    .flacso-main-page .flacso-oferta-mosaico__description,
    .flacso-main-page .flacso-oferta-mosaico__description p,
    .flacso-main-page .flacso-oferta-mosaico__description span,
    .flacso-main-page .flacso-oferta-mosaico__description strong,
    .flacso-main-page .flacso-oferta-mosaico__description em {
        color: rgba(255, 255, 255, 0.94) !important;
    }

    .flacso-oferta-mosaico__description {
        display: -webkit-box;
        margin: 0;
        overflow: hidden;
        color: rgba(255, 255, 255, 0.94) !important;
        font-size: 0.86rem;
        font-weight: 600;
        line-height: 1.38;
        text-shadow: 0 1px 7px rgba(0, 0, 0, 0.48);
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .flacso-main-page .flacso-oferta-mosaico__link,
    .flacso-main-page .flacso-oferta-mosaico__link span {
        color: #ffffff !important;
    }

    .flacso-oferta-mosaico__link {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        width: max-content;
        max-width: 100%;
        min-height: 32px;
        margin-top: 0.08rem;
        padding: 0.28rem 0.5rem;
        border: 1px solid rgba(255, 255, 255, 0.28);
        border-radius: 999px;
        background: rgba(3, 15, 35, 0.12);
        color: #ffffff !important;
        font-size: 0.84rem;
        font-weight: 850;
        line-height: 1.2;
        white-space: nowrap;
        text-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
        box-shadow: none;
        backdrop-filter: none;
    }

    .flacso-homepage-completa {
        padding-bottom: calc(92px + env(safe-area-inset-bottom));
    }

    .flacso-front-hero-fab {
        right: 12px;
        bottom: calc(10px + env(safe-area-inset-bottom));
        left: 12px;
        gap: 0.3rem;
        padding: 0.3rem;
        border-radius: 16px;
    }

    .flacso-front-hero-fab__link {
        min-height: 46px;
        padding: 0.38rem 0.5rem;
        gap: 0.38rem;
        font-size: clamp(0.68rem, 3vw, 0.78rem);
        line-height: 1.1;
    }

    .flacso-front-hero-fab__icon {
        width: 28px;
        height: 28px;
        border-radius: 8px;
    }
}

@media (max-width: 420px) {
    .flacso-oferta-mosaico__card,
    .flacso-oferta-mosaico__card:nth-child(2n),
    .flacso-oferta-mosaico__card--featured,
    .flacso-oferta-mosaico__card--wide {
        min-height: 185px;
    }

    .flacso-oferta-mosaico__content {
        width: 78%;
        padding: 1rem;
    }

    .flacso-oferta-mosaico__description {
        -webkit-line-clamp: 1;
    }
}