/* EUROSPACE HOME FEED V2
 *
 * Width exactly follows footer v6.5:
 * desktop 80%
 * 901-1180: 88%
 * 641-900: 94%
 * <=640: calc(100% - 24px)
 */

.es-home-feed {
    padding:
        42px
        0
        54px;

    background:
        #f7f2ef;

    overflow:
        hidden;
}

.es-home-feed__inner {
    width:
        80%;

    max-width:
        none;

    margin-inline:
        auto;

    padding:
        0;

    box-sizing:
        border-box;
}

.es-home-feed-row
+ .es-home-feed-row {
    margin-top:
        34px;
}

.es-home-feed-row__head {
    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        18px;

    margin-bottom:
        13px;
}

.es-home-feed-row__head h2 {
    margin:
        0;

    color:
        #4f291e;

    font-size:
        clamp(
            28px,
            2.25vw,
            42px
        );

    line-height:
        1;
}

.es-home-feed-row__actions {
    display:
        flex;

    align-items:
        center;

    gap:
        7px;
}

.es-home-feed-row__actions > a {
    margin-right:
        6px;

    color:
        #603123;

    font-size:
        clamp(
            12px,
            .78vw,
            15px
        );

    font-weight:
        700;

    text-decoration:
        underline;

    text-underline-offset:
        3px;

    white-space:
        nowrap;
}

.es-home-feed-arrow {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        38px;

    height:
        38px;

    flex:
        0
        0
        38px;

    padding:
        0;

    border:
        1px solid
        rgba(
            96,
            49,
            35,
            .32
        );

    border-radius:
        50%;

    background:
        #fff;

    color:
        #603123;

    cursor:
        pointer;

    font-size:
        18px;

    transition:
        background-color
        .15s
        ease,
        border-color
        .15s
        ease;
}

.es-home-feed-arrow:hover {
    background:
        #eee5e0;

    border-color:
        rgba(
            96,
            49,
            35,
            .52
        );
}

.es-home-feed-track {
    width:
        100%;

    box-sizing:
        border-box;

    display:
        grid;

    grid-auto-flow:
        column;

    gap:
        16px;

    overflow-x:
        auto;

    overflow-y:
        hidden;

    scroll-behavior:
        smooth;

    scroll-snap-type:
        x
        mandatory;

    scrollbar-width:
        none;

    -webkit-overflow-scrolling:
        touch;
}

.es-home-feed-track::-webkit-scrollbar {
    display:
        none;
}


/* =========================================================
   PROMOTIONS — one large old-site-style carousel
   ========================================================= */

.es-home-feed-track--promos {
    grid-auto-columns:
        100%;

    gap:
        0;
}

.es-home-promo-card {
    position:
        relative;

    width:
        100%;

    aspect-ratio:
        3.18
        /
        1;

    min-height:
        260px;

    max-height:
        470px;

    overflow:
        hidden;

    border:
        0;

    border-radius:
        0;

    background:
        #4f291e;

    scroll-snap-align:
        start;

    scroll-snap-stop:
        always;
}

.es-home-promo-card > img,
.es-home-promo-card__fallback {
    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;
}

.es-home-promo-card__fallback {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    background:
        linear-gradient(
            125deg,
            #70402f,
            #3d2017
        );

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

    font-size:
        clamp(
            50px,
            7vw,
            110px
        );

    font-weight:
        800;

    letter-spacing:
        .05em;
}

.es-home-promo-card__shade {
    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            90deg,
            rgba(
                68,
                31,
                20,
                .90
            )
            0%,
            rgba(
                68,
                31,
                20,
                .72
            )
            34%,
            rgba(
                68,
                31,
                20,
                .30
            )
            63%,
            rgba(
                68,
                31,
                20,
                .06
            )
            100%
        );
}

.es-home-promo-card__content {
    position:
        absolute;

    z-index:
        2;

    left:
        clamp(
            26px,
            5.2vw,
            82px
        );

    top:
        50%;

    width:
        min(
            660px,
            46%
        );

    transform:
        translateY(
            -50%
        );

    color:
        #fff;
}

.es-home-promo-card__content h3 {
    margin:
        0
        0
        16px;

    color:
        #fff;

    font-size:
        clamp(
            27px,
            2.55vw,
            48px
        );

    line-height:
        1.06;

    text-transform:
        uppercase;
}

.es-home-promo-card__content p {
    display:
        -webkit-box;

    margin:
        0
        0
        24px;

    overflow:
        hidden;

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

    font-size:
        clamp(
            14px,
            1.08vw,
            20px
        );

    line-height:
        1.45;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        3;
}

.es-home-promo-card__more {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        22px;

    min-width:
        178px;

    min-height:
        48px;

    box-sizing:
        border-box;

    padding:
        10px
        18px;

    border:
        1.5px solid
        rgba(
            255,
            255,
            255,
            .94
        );

    border-radius:
        8px;

    background:
        rgba(
            74,
            35,
            24,
            .18
        );

    color:
        #fff;

    text-decoration:
        none;

    font-weight:
        700;

    transition:
        background-color
        .15s
        ease;
}

.es-home-promo-card__more:hover {
    background:
        rgba(
            255,
            255,
            255,
            .14
        );
}

.es-home-promo-dots {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        7px;

    min-height:
        28px;

    padding-top:
        9px;
}

.es-home-promo-dot {
    width:
        10px;

    height:
        10px;

    padding:
        0;

    border:
        1px solid
        #6e4333;

    border-radius:
        999px;

    background:
        transparent;

    cursor:
        pointer;

    transition:
        width
        .16s
        ease,
        background-color
        .16s
        ease;
}

.es-home-promo-dot.is-active {
    width:
        42px;

    background:
        #6e4333;
}


/* =========================================================
   NEWS — many compact cards inside same site width
   ========================================================= */

.es-home-feed-track--news {
    grid-auto-columns:
        calc(
            (
                100%
                - 64px
            )
            / 5
        );

    padding-bottom:
        5px;
}

.es-home-news-card {
    display:
        grid;

    grid-template-columns:
        86px
        minmax(
            0,
            1fr
        );

    gap:
        12px;

    min-width:
        0;

    min-height:
        104px;

    box-sizing:
        border-box;

    padding:
        10px;

    border:
        1px solid
        #dfd2cc;

    border-radius:
        12px;

    background:
        #fff;

    color:
        #4f291e;

    text-decoration:
        none;

    scroll-snap-align:
        start;

    transition:
        background-color
        .15s
        ease,
        border-color
        .15s
        ease;
}

.es-home-news-card:hover {
    background:
        #f1ebe7;

    border-color:
        #ccb8ae;
}

.es-home-news-card__image {
    width:
        86px;

    height:
        82px;

    overflow:
        hidden;

    border-radius:
        8px;

    background:
        #eee5e0;
}

.es-home-news-card__image img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;
}

.es-home-news-card__image.is-empty {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #8d7469;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        .05em;
}

.es-home-news-card__body {
    min-width:
        0;

    align-self:
        center;
}

.es-home-news-card h3 {
    display:
        -webkit-box;

    margin:
        0
        0
        5px;

    overflow:
        hidden;

    color:
        #4f291e;

    font-size:
        clamp(
            13px,
            .84vw,
            16px
        );

    font-weight:
        700;

    line-height:
        1.23;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        2;
}

.es-home-news-card p {
    display:
        -webkit-box;

    margin:
        0;

    overflow:
        hidden;

    color:
        #78645b;

    font-size:
        clamp(
            11px,
            .68vw,
            13px
        );

    line-height:
        1.32;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        2;
}

.es-home-feed-loading,
.es-home-feed-empty {
    min-height:
        96px;

    display:
        flex;

    align-items:
        center;

    padding:
        0
        15px;

    color:
        #8a756b;

    font-size:
        13px;
}


/* Footer width parity */

@media (
    min-width:
        1181px
) {
    .es-home-feed__inner {
        width:
            80%;
    }
}

@media (
    min-width:
        901px
)
and (
    max-width:
        1180px
) {
    .es-home-feed__inner {
        width:
            88%;
    }

    .es-home-feed-track--news {
        grid-auto-columns:
            calc(
                (
                    100%
                    - 48px
                )
                / 4
            );
    }

    .es-home-promo-card {
        aspect-ratio:
            2.75
            /
            1;
    }
}

@media (
    min-width:
        641px
)
and (
    max-width:
        900px
) {
    .es-home-feed__inner {
        width:
            94%;
    }

    .es-home-feed-track--news {
        grid-auto-columns:
            calc(
                (
                    100%
                    - 32px
                )
                / 3
            );
    }

    .es-home-promo-card {
        aspect-ratio:
            2.25
            /
            1;
    }

    .es-home-promo-card__content {
        width:
            58%;
    }
}

@media (
    max-width:
        640px
) {
    .es-home-feed {
        padding:
            30px
            0
            38px;
    }

    .es-home-feed__inner {
        width:
            calc(
                100%
                - 24px
            );
    }

    .es-home-feed-row
    + .es-home-feed-row {
        margin-top:
            28px;
    }

    .es-home-feed-row__head {
        gap:
            10px;

        margin-bottom:
            10px;
    }

    .es-home-feed-row__head h2 {
        font-size:
            clamp(
                27px,
                8vw,
                36px
            );
    }

    .es-home-feed-row__actions > a {
        display:
            none;
    }

    .es-home-feed-arrow {
        width:
            36px;

        height:
            36px;

        flex-basis:
            36px;
    }

    .es-home-promo-card {
        aspect-ratio:
            1.5
            /
            1;

        min-height:
            270px;
    }

    .es-home-promo-card__shade {
        background:
            linear-gradient(
                90deg,
                rgba(
                    68,
                    31,
                    20,
                    .88
                )
                0%,
                rgba(
                    68,
                    31,
                    20,
                    .68
                )
                58%,
                rgba(
                    68,
                    31,
                    20,
                    .34
                )
                100%
            );
    }

    .es-home-promo-card__content {
        left:
            20px;

        width:
            calc(
                100%
                - 40px
            );
    }

    .es-home-promo-card__content h3 {
        font-size:
            clamp(
                24px,
                7vw,
                32px
            );
    }

    .es-home-promo-card__content p {
        font-size:
            14px;

        -webkit-line-clamp:
            3;
    }

    .es-home-promo-card__more {
        min-width:
            160px;

        min-height:
            44px;
    }

    .es-home-feed-track--news {
        grid-auto-columns:
            86%;

        gap:
            12px;
    }

    .es-home-news-card {
        grid-template-columns:
            88px
            minmax(
                0,
                1fr
            );

        min-height:
            108px;
    }

    .es-home-news-card__image {
        width:
            88px;

        height:
            86px;
    }

    .es-home-news-card h3 {
        font-size:
            15px;
    }

    .es-home-news-card p {
        font-size:
            12px;
    }
}


/* =========================================================
   EUROSPACE HOME FEED V3 — NEWS ONLY
   ========================================================= */

.es-home-feed-row--promos {
    display: none !important;
}

.es-home-feed-row--news {
    margin-top: 0 !important;
}

.es-home-feed {
    padding:
        38px
        0
        48px !important;
}

.es-home-feed-track--news {
    width: 100% !important;
    max-width: 100% !important;
}

/* five */
@media (
    min-width: 1381px
) {
    .es-home-feed-track--news {
        grid-auto-columns:
            calc(
                (
                    100%
                    - 64px
                )
                / 5
            ) !important;
    }
}

/* four */
@media (
    min-width: 1081px
)
and (
    max-width: 1380px
) {
    .es-home-feed-track--news {
        grid-auto-columns:
            calc(
                (
                    100%
                    - 48px
                )
                / 4
            ) !important;
    }
}

/* three */
@media (
    min-width: 761px
)
and (
    max-width: 1080px
) {
    .es-home-feed-track--news {
        grid-auto-columns:
            calc(
                (
                    100%
                    - 32px
                )
                / 3
            ) !important;
    }
}

/* two */
@media (
    min-width: 521px
)
and (
    max-width: 760px
) {
    .es-home-feed-track--news {
        grid-auto-columns:
            calc(
                (
                    100%
                    - 16px
                )
                / 2
            ) !important;
    }
}

/* mobile swipe */
@media (
    max-width: 520px
) {
    .es-home-feed {
        padding:
            28px
            0
            36px !important;
    }

    .es-home-feed-track--news {
        grid-auto-columns:
            86% !important;
    }
}
