.elementor-widget-loop-grid .elementor-button{background-color:var( --e-global-color-accent );}.elementor-21559 .elementor-element.elementor-element-f5fbe24{--grid-columns:3;--load-more-button-align:center;}.elementor-21559 .elementor-element.elementor-element-f5fbe24 .elementor-loop-container{grid-auto-rows:1fr;}.elementor-21559 .elementor-element.elementor-element-f5fbe24 .e-loop-item > .elementor-section, .elementor-21559 .elementor-element.elementor-element-f5fbe24 .e-loop-item > .elementor-section > .elementor-container, .elementor-21559 .elementor-element.elementor-element-f5fbe24 .e-loop-item > .e-con, .elementor-21559 .elementor-element.elementor-element-f5fbe24 .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-21559 .elementor-element.elementor-element-f5fbe24{--grid-columns:2;}}@media(max-width:880px){.elementor-21559 .elementor-element.elementor-element-f5fbe24{--grid-columns:2;}}@media(max-width:767px){.elementor-21559 .elementor-element.elementor-element-f5fbe24{--grid-columns:1;}}/* Start custom CSS *//* =========================================================
   OXFAM COLOMBIA
   PÁGINA PROYECTOS 2026
   HERO + INTRO + LOOP GRID
   VERSIÓN CONSOLIDADA RESPONSIVE

   HTML:
   .oxfam-proyectos-hero
   .oxfam-proyectos-intro

   LOOP GRID:
   .oxfam-proyectos-loop

   SHORTCODE:
   .oxfam-pro-card
   ========================================================= */


/* =========================================================
   01. VARIABLES
   ========================================================= */

.oxfam-proyectos-hero,
.oxfam-proyectos-intro,
.oxfam-proyectos-loop {

    --ox-green: #44841A;
    --ox-green-dark: #235B13;
    --ox-green-deep: #123F22;

    --ox-lime: #BECE45;
    --ox-pink: #E43989;
    --ox-orange: #F16E22;

    --ox-white: #FFFFFF;

    --ox-soft: #F7F8F2;
    --ox-soft-green: #F1F5E9;

    --ox-text: #273229;
    --ox-muted: #70766F;

    --ox-border: rgba(35,91,19,.11);

    --ox-shadow:
        0 15px 38px rgba(28,66,30,.085);
}


/* =========================================================
   02. RESET LOCAL
   ========================================================= */

.oxfam-proyectos-hero *,
.oxfam-proyectos-hero *::before,
.oxfam-proyectos-hero *::after,
.oxfam-proyectos-intro *,
.oxfam-proyectos-intro *::before,
.oxfam-proyectos-intro *::after,
.oxfam-proyectos-loop *,
.oxfam-proyectos-loop *::before,
.oxfam-proyectos-loop *::after {

    box-sizing: border-box;
}


.oxfam-proyectos-hero,
.oxfam-proyectos-intro,
.oxfam-proyectos-loop {

    width: 100%;
    max-width: 100%;

    overflow-x: clip;
}


/* =========================================================
   03. HERO
   ========================================================= */

.oxfam-proyectos-hero {

    position: relative;

    min-height:
        clamp(500px, 37vw, 650px);

    display: flex;
    align-items: center;

    overflow: hidden;

    background:
        var(--ox-green-deep);
}


/* =========================================================
   FOTO HERO
   ========================================================= */

.oxfam-proyectos-hero__media {

    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
}


.oxfam-proyectos-hero__image {

    display: block;

    width: 100% !important;
    height: 100% !important;

    max-width: none !important;

    object-fit: cover;

    /*
     * Mantiene la fotografía natural
     * y evita un corte demasiado bajo.
     */

    object-position:
        center 38%;
}


/* =========================================================
   OVERLAY HERO
   ========================================================= */

.oxfam-proyectos-hero__overlay {

    position: absolute;
    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(15,63,31,.05) 0%,
            rgba(15,63,31,.11) 34%,
            rgba(15,63,31,.66) 62%,
            rgba(15,63,31,.96) 100%
        );
}


/* Círculo decorativo */

.oxfam-proyectos-hero__overlay::after {

    content: "";

    position: absolute;

    right: -8%;
    bottom: -27%;

    width: 46%;

    aspect-ratio: 1;

    border-radius: 50%;

    background:
        rgba(190,206,69,.09);
}


/* Forma decorativa adicional */

.oxfam-proyectos-hero__overlay::before {

    content: "";

    position: absolute;

    top: -14%;
    right: 6%;

    width: 29%;
    height: 46%;

    background:
        rgba(68,132,26,.12);

    transform:
        rotate(29deg);

    pointer-events: none;
}


/* =========================================================
   CONTENIDO HERO
   ========================================================= */

.oxfam-proyectos-hero__content {

    position: relative;

    z-index: 2;

    width:
        min(620px,42vw);

    max-width:
        calc(100% - 80px);

    margin-left: auto;

    margin-right:
        clamp(48px,6vw,110px);

    color:
        #FFFFFF;
}


/* =========================================================
   EYEBROW
   ========================================================= */

.oxfam-proyectos-hero__eyebrow {

    display: inline-flex;

    align-items: center;

    gap: 9px;

    width: fit-content;

    margin:
        0 0 18px;

    padding:
        9px 15px;

    border:
        1px solid
        rgba(190,206,69,.62);

    border-radius:
        999px;

    background:
        rgba(35,91,19,.57);

    color:
        var(--ox-lime);

    font-family:
        "T-StarPro",
        "T-Star Pro",
        Arial,
        sans-serif;

    font-size:
        12px;

    font-weight:
        800;

    line-height:
        1;

    letter-spacing:
        .04em;

    text-transform:
        uppercase;

    backdrop-filter:
        blur(4px);
}


.oxfam-proyectos-hero__eyebrow::before {

    content: "";

    width: 7px;
    height: 7px;

    flex: 0 0 7px;

    border-radius:
        50%;

    background:
        var(--ox-lime);
}


/* =========================================================
   TÍTULO HERO
   ========================================================= */

.oxfam-proyectos-hero__title {

    width: 100%;

    margin:
        0 0 20px !important;

    padding:
        0 !important;

    color:
        #FFFFFF !important;

    font-family:
        "Titulares OXFAM",
        "Arial Black",
        Arial,
        sans-serif !important;

    font-size:
        clamp(48px,4.7vw,76px);

    font-weight:
        700;

    line-height:
        .92;

    letter-spacing:
        -.035em;

    text-transform:
        uppercase;

    white-space:
        normal;

    word-break:
        normal;

    text-wrap:
        balance;
}


/* =========================================================
   DESCRIPCIÓN HERO
   ========================================================= */

.oxfam-proyectos-hero__lead {

    max-width:
        555px;

    margin:
        0;

    color:
        rgba(255,255,255,.96);

    font-family:
        "T-StarPro",
        "T-Star Pro",
        Roboto,
        Arial,
        sans-serif;

    font-size:
        clamp(17px,1.32vw,21px);

    line-height:
        1.48;
}


/* Línea lima */

.oxfam-proyectos-hero__accent {

    width: 68px;
    height: 5px;

    margin-top:
        25px;

    border-radius:
        999px;

    background:
        var(--ox-lime);
}


/* =========================================================
   04. INTRO
   ========================================================= */

.oxfam-proyectos-intro {

    position: relative;

    padding:
        clamp(52px,5vw,78px)
        clamp(24px,7vw,110px);

    background:
        var(--ox-soft);
}


/* Decoración muy sutil */

.oxfam-proyectos-intro::after {

    content: "";

    position: absolute;

    right: -80px;
    bottom: -120px;

    width: 260px;
    height: 260px;

    border-radius:
        50%;

    background:
        rgba(190,206,69,.06);

    pointer-events: none;
}


.oxfam-proyectos-intro__inner {

    position: relative;

    z-index: 2;

    width:
        min(1180px,100%);

    margin:
        0 auto;

    display: grid;

    grid-template-columns:
        minmax(290px,.85fr)
        minmax(340px,1.15fr);

    align-items:
        center;

    gap:
        clamp(38px,6vw,90px);
}


/* =========================================================
   INTRO KICKER
   ========================================================= */

.oxfam-proyectos-kicker {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    margin-bottom:
        16px;

    color:
        var(--ox-green);

    font-family:
        "T-StarPro",
        "T-Star Pro",
        Arial,
        sans-serif;

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        .05em;

    text-transform:
        uppercase;
}


.oxfam-proyectos-kicker::before {

    content: "";

    width: 8px;
    height: 8px;

    border-radius:
        50%;

    background:
        var(--ox-lime);
}


/* =========================================================
   INTRO TÍTULO
   ========================================================= */

.oxfam-proyectos-intro h2 {

    margin:
        0 !important;

    color:
        var(--ox-green-dark);

    font-family:
        "Titulares OXFAM",
        "Arial Black",
        Arial,
        sans-serif !important;

    font-size:
        clamp(37px,3.65vw,58px);

    font-weight:
        700;

    line-height:
        .94;

    letter-spacing:
        -.02em;

    text-transform:
        uppercase;
}


.oxfam-proyectos-intro h2 span {

    display: block;

    color:
        var(--ox-green);
}


/* =========================================================
   INTRO TEXTO
   ========================================================= */

.oxfam-proyectos-intro__copy {

    position: relative;

    padding-left:
        32px;

    border-left:
        5px solid
        var(--ox-lime);
}


.oxfam-proyectos-intro__copy p {

    margin:
        0;

    color:
        var(--ox-text);

    font-family:
        "T-StarPro",
        "T-Star Pro",
        Roboto,
        Arial,
        sans-serif;

    font-size:
        19px;

    line-height:
        1.6;
}


/* =========================================================
   05. SECCIÓN LOOP
   ========================================================= */

.oxfam-proyectos-loop {

    padding:
        12px
        clamp(20px,4vw,65px)
        82px;

    background:
        var(--ox-soft);
}


/* =========================================================
   GRID
   ========================================================= */

.oxfam-proyectos-loop
.elementor-loop-container {

    display: grid !important;

    grid-template-columns:
        repeat(3,minmax(0,1fr)) !important;

    column-gap:
        28px !important;

    row-gap:
        28px !important;

    align-items:
        stretch !important;

    width:
        100% !important;

    margin:
        0 !important;
}


/* =========================================================
   LOOP ITEM
   ========================================================= */

.oxfam-proyectos-loop
.e-loop-item {

    display: flex !important;

    flex-direction:
        column !important;

    width:
        100% !important;

    min-width:
        0 !important;

    height:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;
}


/* =========================================================
   WRAPPERS DE ELEMENTOR
   ========================================================= */

.oxfam-proyectos-loop
.e-loop-item > .elementor-element,

.oxfam-proyectos-loop
.e-loop-item > .e-con {

    display: flex !important;

    flex-direction:
        column !important;

    flex:
        1 1 auto !important;

    width:
        100% !important;

    height:
        100% !important;
}


.oxfam-proyectos-loop
.elementor-widget-shortcode {

    display: flex !important;

    flex-direction:
        column !important;

    flex:
        1 1 auto !important;

    width:
        100% !important;

    height:
        100% !important;
}


.oxfam-proyectos-loop
.elementor-widget-shortcode
> .elementor-widget-container {

    display: flex !important;

    flex-direction:
        column !important;

    flex:
        1 1 auto !important;

    width:
        100% !important;

    height:
        100% !important;
}


/* =========================================================
   06. TARJETA
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card {

    position: relative;

    display: flex !important;

    flex-direction:
        column !important;

    flex:
        1 1 auto !important;

    width:
        100% !important;

    height:
        100% !important;

    overflow:
        hidden;

    background:
        #FFFFFF;

    border:
        1px solid
        rgba(35,91,19,.10);

    border-radius:
        22px;

    box-shadow:
        0 14px 34px
        rgba(28,66,30,.075);

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}


/* pequeño acento inferior */

.oxfam-proyectos-loop
.oxfam-pro-card::after {

    content: "";

    position: absolute;

    right: -46px;
    bottom: -53px;

    width: 125px;
    height: 125px;

    border-radius:
        50%;

    background:
        rgba(190,206,69,.10);

    pointer-events:
        none;
}


/* Hover */

.oxfam-proyectos-loop
.oxfam-pro-card:hover {

    transform:
        translateY(-5px);

    border-color:
        rgba(68,132,26,.22);

    box-shadow:
        0 21px 46px
        rgba(29,74,32,.12);
}


/* =========================================================
   LINK DE LA TARJETA
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__link {

    display: flex !important;

    flex-direction:
        column !important;

    flex:
        1 1 auto !important;

    width:
        100% !important;

    height:
        100% !important;

    color:
        inherit !important;

    text-decoration:
        none !important;
}


/* =========================================================
   07. IMAGEN
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__media {

    position:
        relative;

    flex:
        0 0 auto;

    width:
        100%;

    aspect-ratio:
        16 / 10;

    overflow:
        hidden;

    background:
        var(--ox-soft-green);
}


.oxfam-proyectos-loop
.oxfam-pro-card__media::after {

    content: "";

    position:
        absolute;

    inset:
        0;

    z-index:
        2;

    pointer-events:
        none;

    background:
        linear-gradient(
            180deg,
            transparent 72%,
            rgba(18,63,34,.09)
        );
}


.oxfam-proyectos-loop
.oxfam-pro-card__image {

    display:
        block;

    width:
        100% !important;

    height:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    object-fit:
        cover;

    object-position:
        center;

    transition:
        transform .65s ease;
}


.oxfam-proyectos-loop
.oxfam-pro-card:hover
.oxfam-pro-card__image {

    transform:
        scale(1.028);
}


/* =========================================================
   PLACEHOLDER SIN IMAGEN
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__image-placeholder {

    display: flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        100%;

    height:
        100%;

    background:
        linear-gradient(
            135deg,
            var(--ox-green),
            var(--ox-green-deep)
        );

    color:
        #FFFFFF;

    font-family:
        "Titulares OXFAM",
        Arial,
        sans-serif;

    font-size:
        28px;
}


/* =========================================================
   08. CUERPO DE TARJETA
   ALTURA UNIFORME
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__body {

    position:
        relative;

    display:
        flex !important;

    flex-direction:
        column !important;

    flex:
        1 1 auto !important;

    width:
        100%;

    /*
     * Igualamos visualmente todas las tarjetas.
     */

    height:
        335px !important;

    min-height:
        335px !important;

    max-height:
        335px !important;

    padding:
        24px 25px 26px;

    overflow:
        hidden;
}


/* =========================================================
   META
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__meta {

    position:
        relative;

    z-index:
        3;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        10px;

    flex:
        0 0 auto;

    width:
        100%;

    margin-bottom:
        18px;
}


/* Etiqueta Proyecto */

.oxfam-proyectos-loop
.oxfam-pro-card__type {

    display:
        inline-flex;

    align-items:
        center;

    min-height:
        29px;

    padding:
        7px 11px;

    border-radius:
        999px;

    background:
        var(--ox-green);

    color:
        #FFFFFF;

    font-family:
        "T-StarPro",
        "T-Star Pro",
        Arial,
        sans-serif;

    font-size:
        10px;

    font-weight:
        900;

    line-height:
        1;

    letter-spacing:
        .04em;

    text-transform:
        uppercase;
}


/* Fecha */

.oxfam-proyectos-loop
.oxfam-pro-card__date {

    color:
        var(--ox-muted);

    font-family:
        "T-StarPro",
        "T-Star Pro",
        Roboto,
        Arial,
        sans-serif;

    font-size:
        12px;

    line-height:
        1.2;

    white-space:
        nowrap;
}


/* =========================================================
   09. TÍTULO DE PROYECTO
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__title {

    position:
        relative;

    z-index:
        3;

    width:
        100%;

    margin:
        0 0 20px !important;

    padding:
        0 !important;

    color:
        var(--ox-green-dark) !important;

    font-family:
        "Titulares OXFAM",
        "Arial Black",
        Arial,
        sans-serif !important;

    font-size:
        clamp(23px,1.7vw,30px) !important;

    font-weight:
        700 !important;

    line-height:
        1.04 !important;

    letter-spacing:
        -.015em;

    overflow-wrap:
        anywhere;

    /*
     * Evita títulos excesivamente largos
     * alterando el tamaño de las tarjetas.
     */

    display:
        -webkit-box;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        6;

    overflow:
        hidden;
}


/* =========================================================
   10. CTA
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__cta {

    position:
        relative;

    z-index:
        3;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    width:
        fit-content;

    margin-top:
        auto !important;

    color:
        var(--ox-pink);

    font-family:
        "T-StarPro",
        "T-Star Pro",
        Arial,
        sans-serif;

    font-size:
        12px;

    font-weight:
        900;

    line-height:
        1;

    letter-spacing:
        .015em;

    text-transform:
        uppercase;
}


.oxfam-proyectos-loop
.oxfam-pro-card__cta svg {

    width:
        17px;

    height:
        17px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        2;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;

    transition:
        transform .2s ease;
}


.oxfam-proyectos-loop
.oxfam-pro-card:hover
.oxfam-pro-card__cta svg {

    transform:
        translateX(4px);
}


/* =========================================================
   11. CARGAR MÁS
   ========================================================= */

.oxfam-proyectos-loop
.e-load-more-anchor {

    grid-column:
        1 / -1 !important;
}


.oxfam-proyectos-loop
.elementor-button,

.oxfam-proyectos-loop
.e-load-more-button {

    min-height:
        50px !important;

    margin-top:
        34px !important;

    padding:
        13px 27px !important;

    border:
        0 !important;

    border-radius:
        999px !important;

    background:
        var(--ox-green) !important;

    color:
        #FFFFFF !important;

    font-family:
        "Titulares OXFAM",
        "Arial Black",
        Arial,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        700 !important;

    line-height:
        1 !important;

    text-transform:
        uppercase;

    box-shadow:
        0 10px 25px
        rgba(68,132,26,.17);

    transition:
        background-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}


.oxfam-proyectos-loop
.elementor-button:hover,

.oxfam-proyectos-loop
.e-load-more-button:hover {

    background:
        var(--ox-pink) !important;

    transform:
        translateY(-2px);

    box-shadow:
        0 14px 30px
        rgba(228,57,137,.18);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1024px) {


    /* HERO */

    .oxfam-proyectos-hero {

        min-height:
            540px;
    }


    .oxfam-proyectos-hero__content {

        width:
            min(520px,56vw);

        margin-right:
            42px;
    }


    .oxfam-proyectos-hero__title {

        font-size:
            clamp(43px,5.9vw,60px);
    }


    .oxfam-proyectos-hero__lead {

        font-size:
            17px;
    }


    /* INTRO */

    .oxfam-proyectos-intro__inner {

        grid-template-columns:
            1fr;

        gap:
            28px;
    }


    .oxfam-proyectos-intro__copy {

        padding-left:
            26px;
    }


    /* GRID */

    .oxfam-proyectos-loop
    .elementor-loop-container {

        grid-template-columns:
            repeat(2,minmax(0,1fr)) !important;

        gap:
            22px !important;
    }


    /* TARJETA */

    .oxfam-proyectos-loop
    .oxfam-pro-card__body {

        height:
            345px !important;

        min-height:
            345px !important;

        max-height:
            345px !important;

        padding:
            22px 22px 24px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__title {

        font-size:
            24px !important;
    }

}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {


    /* =====================================================
       HERO
       ===================================================== */

    .oxfam-proyectos-hero {

        min-height:
            510px;

        align-items:
            flex-end;
    }


    .oxfam-proyectos-hero__image {

        /*
         * En móvil damos prioridad
         * al sector central de la fotografía.
         */

        object-position:
            45% center;
    }


    .oxfam-proyectos-hero__overlay {

        background:
            linear-gradient(
                180deg,
                rgba(15,63,31,.06) 0%,
                rgba(15,63,31,.17) 31%,
                rgba(15,63,31,.82) 65%,
                rgba(15,63,31,.98) 100%
            );
    }


    .oxfam-proyectos-hero__overlay::before {

        display:
            none;
    }


    .oxfam-proyectos-hero__content {

        width:
            calc(100% - 40px);

        max-width:
            none;

        margin:
            0 20px 38px;
    }


    .oxfam-proyectos-hero__eyebrow {

        margin-bottom:
            13px;

        padding:
            8px 12px;

        font-size:
            9.5px;
    }


    .oxfam-proyectos-hero__title {

        margin-bottom:
            15px !important;

        font-size:
            clamp(34px,9.5vw,43px);

        line-height:
            .94;
    }


    .oxfam-proyectos-hero__lead {

        max-width:
            100%;

        font-size:
            16px;

        line-height:
            1.45;
    }


    .oxfam-proyectos-hero__accent {

        width:
            50px;

        height:
            4px;

        margin-top:
            19px;
    }


    /* =====================================================
       INTRO
       ===================================================== */

    .oxfam-proyectos-intro {

        padding:
            42px 20px;
    }


    .oxfam-proyectos-intro h2 {

        font-size:
            clamp(32px,9vw,42px);

        line-height:
            .95;
    }


    .oxfam-proyectos-intro__copy {

        padding-left:
            18px;

        border-left-width:
            4px;
    }


    .oxfam-proyectos-intro__copy p {

        font-size:
            16px;

        line-height:
            1.5;
    }


    /* =====================================================
       LOOP
       ===================================================== */

    .oxfam-proyectos-loop {

        padding:
            6px 16px 55px;
    }


    .oxfam-proyectos-loop
    .elementor-loop-container {

        grid-template-columns:
            minmax(0,1fr) !important;

        gap:
            16px !important;
    }


    /*
     * En móvil dejamos altura natural.
     * Así nunca se generan grandes huecos
     * debajo de títulos cortos.
     */

    .oxfam-proyectos-loop
    .oxfam-pro-card__body {

        height:
            auto !important;

        min-height:
            280px !important;

        max-height:
            none !important;

        padding:
            20px 20px 22px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__media {

        aspect-ratio:
            16 / 9;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__meta {

        margin-bottom:
            16px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__type {

        min-height:
            27px;

        padding:
            6px 10px;

        font-size:
            9px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__date {

        font-size:
            11px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__title {

        margin-bottom:
            20px !important;

        font-size:
            clamp(21px,6vw,25px) !important;

        line-height:
            1.05 !important;

        -webkit-line-clamp:
            7;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__cta {

        font-size:
            11px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card {

        border-radius:
            20px;
    }

}


/* =========================================================
   MÓVIL PEQUEÑO
   ========================================================= */

@media (max-width: 420px) {


    .oxfam-proyectos-hero {

        min-height:
            500px;
    }


    .oxfam-proyectos-hero__content {

        width:
            calc(100% - 34px);

        margin:
            0 17px 34px;
    }


    .oxfam-proyectos-hero__title {

        font-size:
            clamp(31px,9vw,38px);
    }


    .oxfam-proyectos-hero__lead {

        font-size:
            15px;
    }


    .oxfam-proyectos-intro {

        padding:
            38px 17px;
    }


    .oxfam-proyectos-loop {

        padding-right:
            12px;

        padding-left:
            12px;
    }


    .oxfam-proyectos-loop
    .elementor-loop-container {

        gap:
            14px !important;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__body {

        min-height:
            265px !important;

        padding:
            18px 18px 20px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__meta {

        flex-wrap:
            wrap;

        gap:
            8px;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__date {

        white-space:
            normal;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card__title {

        font-size:
            clamp(20px,5.7vw,23px) !important;

        line-height:
            1.06 !important;
    }

}


/* =========================================================
   ACCESIBILIDAD
   ========================================================= */

.oxfam-proyectos-loop
.oxfam-pro-card__link:focus-visible {

    outline:
        3px solid
        var(--ox-lime);

    outline-offset:
        3px;
}


/* =========================================================
   REDUCIR MOVIMIENTO
   ========================================================= */

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

    .oxfam-proyectos-loop
    .oxfam-pro-card,

    .oxfam-proyectos-loop
    .oxfam-pro-card__image,

    .oxfam-proyectos-loop
    .oxfam-pro-card__cta,

    .oxfam-proyectos-loop
    .oxfam-pro-card__cta svg,

    .oxfam-proyectos-loop
    .elementor-button,

    .oxfam-proyectos-loop
    .e-load-more-button {

        transition:
            none !important;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card:hover,

    .oxfam-proyectos-loop
    .elementor-button:hover,

    .oxfam-proyectos-loop
    .e-load-more-button:hover {

        transform:
            none !important;
    }


    .oxfam-proyectos-loop
    .oxfam-pro-card:hover
    .oxfam-pro-card__image {

        transform:
            none !important;
    }

}/* End custom CSS */