/* =====================================================================
   CHUM 2.0
   HOMEPAGE PRODUCT DISCOVERY
   PREMIUM ECOMMERCE CONTENT + LIQUID GLASS CONTROLS

   FILE:
   public/assets/css/product-cards.css

   DESIGN PRINCIPLES
   ---------------------------------------------------------------------
   1. Product/content remains clear and sharp.
   2. Liquid Glass is reserved for functional controls.
   3. Large desktop uses four substantial cards.
   4. No tiny 8px commerce copy.
   5. No washed-out card backgrounds.
   6. Glass controls have a visible optical rim even on white surfaces.
   ===================================================================== */


/* =====================================================================
   SECTION
   ===================================================================== */

.chum-compare-section {
    position: relative;

    width: 100%;

    padding:
        64px
        0
        82px;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f8fafb 0%,
            #f4f7f9 100%
        );

    color:
        #111820;
}


/* =====================================================================
   CONTAINER
   ===================================================================== */

.chum-compare-container {
    position: relative;

    z-index: 2;

    width:
        min(
            1760px,
            calc(100% - 72px)
        );

    margin:
        0
        auto;
}


/* =====================================================================
   SECTION HEADER
   ===================================================================== */

.chum-compare-header {
    margin-bottom:
        30px;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        40px;
}


.chum-compare-heading {
    max-width:
        880px;
}


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

.chum-compare-eyebrow {
    display:
        inline-flex;

    align-items:
        center;

    min-height:
        27px;

    margin-bottom:
        9px;

    padding:
        0
        10px;

    border:
        1px solid
        rgba(
            232,
            65,
            100,
            0.15
        );

    border-radius:
        999px;

    background:
        rgba(
            255,
            255,
            255,
            0.56
        );

    color:
        #e84164;

    font-size:
        10px;

    font-weight:
        850;

    letter-spacing:
        0.09em;

    text-transform:
        uppercase;
}


/* =====================================================================
   MAIN HEADING
   ===================================================================== */

.chum-compare-heading h2 {
    margin:
        0;

    color:
        #0d141b;

    font-size:
        clamp(
            37px,
            3vw,
            50px
        );

    font-weight:
        820;

    line-height:
        1.02;

    letter-spacing:
        -0.048em;
}


.chum-compare-heading p {
    max-width:
        820px;

    margin:
        12px
        0
        0;

    color:
        #596672;

    font-size:
        14px;

    line-height:
        1.65;
}


/* =====================================================================
   EXPLORE CONTROL
   ===================================================================== */

.chum-discovery-view-all,
.chum-discovery-view-all:link,
.chum-discovery-view-all:visited {
    position:
        relative;

    isolation:
        isolate;

    min-height:
        46px;

    padding:
        0
        18px;

    flex-shrink:
        0;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        9px;

    overflow:
        hidden;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.98
        );

    border-radius:
        14px;

    background:
        rgba(
            255,
            255,
            255,
            0.14
        );

    -webkit-backdrop-filter:
        blur(22px)
        saturate(190%)
        brightness(1.08);

    backdrop-filter:
        blur(22px)
        saturate(190%)
        brightness(1.08);

    box-shadow:
        0
        0
        0
        1px
        rgba(
            42,
            57,
            68,
            0.09
        ),

        inset
        0
        1px
        0
        rgba(
            255,
            255,
            255,
            1
        ),

        inset
        0
        -1px
        0
        rgba(
            63,
            78,
            89,
            0.08
        ),

        0
        9px
        22px
        rgba(
            22,
            36,
            46,
            0.08
        );

    color:
        #111820 !important;

    font-size:
        11px;

    font-weight:
        780;

    text-decoration:
        none !important;

    transition:
        transform
        180ms ease,
        box-shadow
        180ms ease,
        background
        180ms ease;
}


.chum-discovery-view-all::before {
    content:
        "";

    position:
        absolute;

    z-index:
        1;

    top:
        1px;

    left:
        12px;

    right:
        12px;

    height:
        1px;

    pointer-events:
        none;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffffff,
            transparent
        );
}


.chum-discovery-view-all svg {
    width:
        15px;

    height:
        15px;

    transition:
        transform
        170ms ease;
}


.chum-discovery-view-all:hover {
    transform:
        translateY(-2px);

    background:
        rgba(
            255,
            255,
            255,
            0.26
        );

    box-shadow:
        0
        0
        0
        1px
        rgba(
            42,
            57,
            68,
            0.12
        ),

        inset
        0
        1px
        0
        #ffffff,

        0
        13px
        28px
        rgba(
            22,
            36,
            46,
            0.12
        );
}


.chum-discovery-view-all:hover svg {
    transform:
        translateX(3px);
}


/* =====================================================================
   FILTER ROW
   ===================================================================== */

.chum-discovery-filter {
    width:
        100%;

    margin-bottom:
        28px;

    padding:
        2px
        0;

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

    overflow-x:
        auto;

    scrollbar-width:
        none;
}


.chum-discovery-filter::-webkit-scrollbar {
    display:
        none;
}


/* =====================================================================
   FILTER CONTROL
   ===================================================================== */

.chum-discovery-filter-button {
    position:
        relative;

    isolation:
        isolate;

    min-height:
        39px;

    flex-shrink:
        0;

    padding:
        0
        16px;

    overflow:
        hidden;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.95
        );

    border-radius:
        999px;

    background:
        rgba(
            255,
            255,
            255,
            0.20
        );

    -webkit-backdrop-filter:
        blur(16px)
        saturate(175%);

    backdrop-filter:
        blur(16px)
        saturate(175%);

    box-shadow:
        0
        0
        0
        1px
        rgba(
            49,
            65,
            76,
            0.07
        ),

        inset
        0
        1px
        0
        #ffffff,

        0
        5px
        13px
        rgba(
            25,
            39,
            49,
            0.055
        );

    color:
        #35424d;

    cursor:
        pointer;

    font-size:
        11px;

    font-weight:
        680;

    transition:
        transform
        160ms ease,
        color
        160ms ease,
        background
        160ms ease;
}


.chum-discovery-filter-button:hover {
    transform:
        translateY(-1px);

    color:
        #111820;

    background:
        rgba(
            255,
            255,
            255,
            0.36
        );
}


.chum-discovery-filter-button.is-active {
    border-color:
        rgba(
            255,
            255,
            255,
            0.35
        );

    background:
        linear-gradient(
            135deg,
            #f14c70,
            #df365e
        );

    color:
        #ffffff;

    box-shadow:
        inset
        0
        1px
        0
        rgba(
            255,
            255,
            255,
            0.28
        ),

        0
        8px
        18px
        rgba(
            232,
            65,
            100,
            0.20
        );
}


/* =====================================================================
   PRODUCT SCROLLER
   ===================================================================== */

.chum-product-scroller {
    width:
        100%;

    overflow:
        visible;
}


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

   LARGE SCREEN = 4 LARGE PRODUCT CARDS
   ===================================================================== */

.chum-product-grid {
    width:
        100%;

    display:
        grid;

    grid-template-columns:
        repeat(
            4,
            minmax(
                0,
                1fr
            )
        );

    gap:
        22px;
}


.chum-product-card.is-hidden {
    display:
        none;
}


/* =====================================================================
   CARD
   CLEAN CONTENT SURFACE — NOT GLASS
   ===================================================================== */

.chum-product-card {
    position:
        relative;

    min-width:
        0;

    min-height:
        590px;

    overflow:
        hidden;

    display:
        flex;

    flex-direction:
        column;

    border:
        1px solid
        #e0e6ea;

    border-radius:
        22px;

    background:
        #ffffff;

    box-shadow:
        0
        7px
        24px
        rgba(
            17,
            31,
            41,
            0.055
        );

    transition:
        transform
        220ms
        cubic-bezier(
            0.2,
            0.8,
            0.2,
            1
        ),
        box-shadow
        220ms ease,
        border-color
        220ms ease;
}


.chum-product-card:hover {
    transform:
        translateY(-6px);

    border-color:
        #d1d9df;

    box-shadow:
        0
        22px
        46px
        rgba(
            17,
            31,
            41,
            0.12
        );
}


/* =====================================================================
   CARD TOP ACTIONS
   ===================================================================== */

.chum-product-card-top {
    position:
        absolute;

    z-index:
        15;

    top:
        14px;

    left:
        14px;

    right:
        14px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    pointer-events:
        none;
}


/* =====================================================================
   COMPARE CHIP
   ===================================================================== */

.chum-live-compare-chip {
    min-height:
        28px;

    padding:
        0
        10px;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        7px;

    border:
        1px solid
        rgba(
            216,
            224,
            230,
            0.90
        );

    border-radius:
        9px;

    background:
        rgba(
            255,
            255,
            255,
            0.93
        );

    color:
        #34414c;

    font-size:
        9px;

    font-weight:
        820;

    letter-spacing:
        0.055em;

    text-transform:
        uppercase;

    box-shadow:
        0
        4px
        11px
        rgba(
            18,
            32,
            42,
            0.055
        );
}


.chum-live-compare-chip > span {
    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        #139b68;

    box-shadow:
        0
        0
        0
        3px
        rgba(
            19,
            155,
            104,
            0.10
        );
}


/* =====================================================================
   WISHLIST
   LIQUID GLASS
   ===================================================================== */

.chum-product-wishlist {
    position:
        relative;

    isolation:
        isolate;

    width:
        40px;

    height:
        40px;

    padding:
        0;

    pointer-events:
        auto;

    display:
        grid;

    place-items:
        center;

    overflow:
        hidden;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.98
        );

    border-radius:
        13px;

    background:
        rgba(
            255,
            255,
            255,
            0.16
        );

    -webkit-backdrop-filter:
        blur(20px)
        saturate(190%)
        brightness(1.07);

    backdrop-filter:
        blur(20px)
        saturate(190%)
        brightness(1.07);

    box-shadow:
        0
        0
        0
        1px
        rgba(
            39,
            55,
            66,
            0.10
        ),

        inset
        0
        1px
        0
        #ffffff,

        inset
        0
        -1px
        0
        rgba(
            55,
            70,
            80,
            0.07
        ),

        0
        7px
        16px
        rgba(
            20,
            34,
            44,
            0.10
        );

    color:
        #25313a;

    cursor:
        pointer;

    transition:
        transform
        160ms ease,
        color
        160ms ease,
        background
        160ms ease;
}


.chum-product-wishlist::before {
    content:
        "";

    position:
        absolute;

    top:
        1px;

    left:
        7px;

    right:
        7px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffffff,
            transparent
        );

    pointer-events:
        none;
}


.chum-product-wishlist svg {
    position:
        relative;

    z-index:
        2;

    width:
        19px;

    height:
        19px;
}


.chum-product-wishlist:hover {
    transform:
        translateY(-2px);

    color:
        #e84164;

    background:
        rgba(
            255,
            255,
            255,
            0.28
        );
}


.chum-product-wishlist.is-active {
    color:
        #e84164;
}


.chum-product-wishlist.is-active path {
    fill:
        currentColor;
}


/* =====================================================================
   PRODUCT IMAGE AREA
   ===================================================================== */

.chum-product-image {
    position:
        relative;

    width:
        100%;

    height:
        335px;

    padding:
        28px
        25px
        8px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    overflow:
        hidden;

    background:
        linear-gradient(
            180deg,
            #fcfdfe,
            #f7f9fa
        );

    text-decoration:
        none !important;
}


.chum-product-image::after {
    content:
        "";

    position:
        absolute;

    left:
        22%;

    right:
        22%;

    bottom:
        14px;

    height:
        26px;

    border-radius:
        50%;

    pointer-events:
        none;

    background:
        radial-gradient(
            ellipse,
            rgba(
                15,
                28,
                38,
                0.08
            ),
            transparent
            72%
        );

    filter:
        blur(9px);
}


.chum-product-image img {
    position:
        relative;

    z-index:
        2;

    display:
        block;

    width:
        100%;

    height:
        100%;

    padding:
        12px;

    object-fit:
        contain;

    background:
        transparent;

    mix-blend-mode:
        multiply;

    transition:
        transform
        280ms
        cubic-bezier(
            0.2,
            0.8,
            0.2,
            1
        );
}


.chum-product-card:hover
.chum-product-image img {
    transform:
        scale(1.045);
}


/* =====================================================================
   FALLBACK IMAGE
   ===================================================================== */

.chum-product-image-empty,
.chum-image-error-fallback {
    width:
        100%;

    height:
        100%;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    color:
        #7e8993;
}


.chum-product-image-empty svg,
.chum-image-error-fallback svg {
    width:
        70px;

    height:
        70px;

    color:
        #aab4bc;
}


.chum-product-image-empty span,
.chum-image-error-fallback span {
    font-size:
        11px;

    font-weight:
        650;
}


/* =====================================================================
   CONTENT
   ===================================================================== */

.chum-product-content {
    flex:
        1;

    padding:
        19px
        20px
        20px;

    display:
        flex;

    flex-direction:
        column;

    background:
        #ffffff;
}


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

.chum-product-meta {
    min-height:
        21px;

    margin-bottom:
        8px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        10px;
}


.chum-product-brand {
    color:
        #e84164;

    font-size:
        11px;

    font-weight:
        850;

    letter-spacing:
        0.07em;

    text-transform:
        uppercase;
}


.chum-product-category {
    min-width:
        0;

    overflow:
        hidden;

    color:
        #79848e;

    font-size:
        11px;

    font-weight:
        520;

    white-space:
        nowrap;

    text-overflow:
        ellipsis;
}


/* =====================================================================
   TITLE
   ===================================================================== */

.chum-product-title {
    min-height:
        54px;

    margin:
        0
        0
        13px;

    color:
        #0d151c;

    font-size:
        18px;

    font-weight:
        780;

    line-height:
        1.36;

    letter-spacing:
        -0.018em;
}


.chum-product-title a,
.chum-product-title a:link,
.chum-product-title a:visited {
    color:
        #0d151c !important;

    text-decoration:
        none !important;
}


.chum-product-title a:hover {
    color:
        #e84164 !important;
}


/* =====================================================================
   COMPARISON INFORMATION
   ===================================================================== */

.chum-home-comparison-info {
    margin-top:
        1px;

    padding:
        9px
        0
        5px;

    border:
        0;
}


.chum-home-comparison-label {
    margin-bottom:
        4px;

    color:
        #77838d;

    font-size:
        11px;

    line-height:
        1.35;
}


.chum-home-comparison-value {
    color:
        #34414b;

    font-size:
        12px;

    font-weight:
        520;

    line-height:
        1.45;
}


.chum-home-comparison-value strong {
    color:
        #1b1c64;

    font-size:
        13px;

    font-weight:
        830;
}


/* =====================================================================
   QUICK SPECS
   ===================================================================== */

.chum-card-specs {
    min-height:
        34px;

    margin-top:
        7px;

    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        6px;
}


.chum-card-specs span {
    padding:
        5px
        8px;

    border:
        1px solid
        #e2e8ec;

    border-radius:
        7px;

    background:
        #f8fafb;

    color:
        #46535d;

    font-size:
        9px;

    font-weight:
        680;
}


/* =====================================================================
   VIEW / COMPARE
   TRUE RECTANGULAR LIQUID GLASS CONTROL

   IMPORTANT:
   Even when this button sits on white, the double optical rim remains
   visible because of the outer hairline + inner light.
   ===================================================================== */

.chum-compare-button,
.chum-compare-button:link,
.chum-compare-button:visited {
    position:
        relative;

    isolation:
        isolate;

    width:
        fit-content !important;

    min-width:
        165px;

    min-height:
        47px;

    margin-top:
        auto;

    padding:
        0
        18px;

    align-self:
        flex-start;

    display:
        inline-flex !important;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    overflow:
        hidden;

    /*
       Visible outer glass edge.
    */

    border:
        1.5px solid
        rgba(
            255,
            255,
            255,
            0.98
        ) !important;

    border-radius:
        13px;

    /*
       Almost transparent.
       This is intentionally not a solid white button.
    */

    background:
        rgba(
            255,
            255,
            255,
            0.06
        ) !important;

    -webkit-backdrop-filter:
        blur(24px)
        saturate(195%)
        brightness(1.08);

    backdrop-filter:
        blur(24px)
        saturate(195%)
        brightness(1.08);

    /*
       The first shadow creates a darker hairline outside the white
       glass border so the rectangle remains visible over white.
    */

    box-shadow:
        0
        0
        0
        1px
        rgba(
            39,
            54,
            65,
            0.13
        ),

        inset
        0
        1px
        0
        rgba(
            255,
            255,
            255,
            1
        ),

        inset
        0
        -1px
        0
        rgba(
            48,
            64,
            76,
            0.11
        ),

        inset
        1px
        0
        0
        rgba(
            255,
            255,
            255,
            0.62
        ),

        inset
        -1px
        0
        0
        rgba(
            255,
            255,
            255,
            0.30
        ),

        0
        9px
        20px
        rgba(
            20,
            34,
            44,
            0.10
        ) !important;

    color:
        #0d151c !important;

    font-size:
        12px;

    font-weight:
        800;

    line-height:
        1;

    text-decoration:
        none !important;

    transition:
        transform
        170ms ease,
        background
        170ms ease,
        box-shadow
        170ms ease;
}


/* top optical highlight */

.chum-compare-button::before {
    content:
        "";

    position:
        absolute;

    z-index:
        1;

    top:
        1px;

    left:
        13px;

    right:
        13px;

    height:
        1px;

    pointer-events:
        none;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(
                255,
                255,
                255,
                1
            ),
            transparent
        );
}


/* lens reflection */

.chum-compare-button::after {
    content:
        "";

    position:
        absolute;

    z-index:
        0;

    top:
        -18px;

    left:
        8%;

    width:
        74%;

    height:
        36px;

    border-radius:
        50%;

    pointer-events:
        none;

    background:
        radial-gradient(
            ellipse,
            rgba(
                255,
                255,
                255,
                0.48
            ),
            transparent
            72%
        );

    filter:
        blur(5px);
}


.chum-compare-button > * {
    position:
        relative;

    z-index:
        2;
}


.chum-compare-button svg {
    width:
        15px;

    height:
        15px;

    flex-shrink:
        0;

    transition:
        transform
        170ms ease;
}


.chum-compare-button:hover {
    transform:
        translateY(-2px);

    background:
        rgba(
            255,
            255,
            255,
            0.20
        ) !important;

    box-shadow:
        0
        0
        0
        1px
        rgba(
            39,
            54,
            65,
            0.16
        ),

        inset
        0
        1px
        0
        #ffffff,

        inset
        0
        -1px
        0
        rgba(
            48,
            64,
            76,
            0.09
        ),

        0
        13px
        27px
        rgba(
            20,
            34,
            44,
            0.14
        ) !important;
}


.chum-compare-button:hover svg {
    transform:
        translateX(3px);
}


/* =====================================================================
   JOURNEY / TRAVEL CARD
   ===================================================================== */

.chum-journey-card {
    background:
        #ffffff;
}


.chum-journey-visual {
    position:
        relative;

    width:
        100%;

    height:
        335px;

    display:
        block;

    overflow:
        hidden;

    background:
        linear-gradient(
            145deg,
            #dbeefa,
            #e8edf9
        );
}


.chum-travel-card-sky {
    position:
        relative;

    width:
        100%;

    height:
        100%;

    overflow:
        hidden;
}


.chum-travel-sun {
    position:
        absolute;

    top:
        42px;

    right:
        45px;

    width:
        66px;

    height:
        66px;

    border-radius:
        50%;

    background:
        #ffc34e;

    box-shadow:
        0
        0
        0
        15px
        rgba(
            255,
            195,
            78,
            0.13
        );
}


.chum-travel-plane {
    position:
        absolute;

    top:
        102px;

    left:
        50%;

    width:
        125px;

    height:
        125px;

    color:
        #1b1c64;

    transform:
        translateX(-50%)
        rotate(-7deg);

    filter:
        drop-shadow(
            0
            13px
            14px
            rgba(
                27,
                28,
                100,
                0.14
            )
        );

    transition:
        transform
        280ms ease;
}


.chum-journey-card:hover
.chum-travel-plane {
    transform:
        translateX(-46%)
        translateY(-7px)
        rotate(-5deg);
}


.chum-travel-cloud {
    position:
        absolute;

    width:
        82px;

    height:
        23px;

    border-radius:
        30px;

    background:
        rgba(
            255,
            255,
            255,
            0.79
        );

    box-shadow:
        27px
        -12px
        0
        rgba(
            255,
            255,
            255,
            0.79
        );
}


.chum-travel-cloud.cloud-one {
    left:
        30px;

    bottom:
        54px;
}


.chum-travel-cloud.cloud-two {
    right:
        42px;

    bottom:
        39px;

    transform:
        scale(0.77);
}


.chum-journey-description {
    min-height:
        54px;

    margin-bottom:
        8px;

    color:
        #596672;

    font-size:
        12px;

    line-height:
        1.55;
}


.chum-product-mobile-hint {
    display:
        none;
}


/* =====================================================================
   LARGE LAPTOP
   ===================================================================== */

@media (max-width: 1500px) {

    .chum-compare-container {
        width:
            calc(
                100% - 52px
            );
    }


    .chum-product-grid {
        gap:
            18px;
    }


    .chum-product-card {
        min-height:
            550px;
    }


    .chum-product-image,
    .chum-journey-visual {
        height:
            300px;
    }


    .chum-product-title {
        font-size:
            16px;
    }

}


/* =====================================================================
   LAPTOP
   ===================================================================== */

@media (max-width: 1200px) {

    .chum-compare-container {
        width:
            calc(
                100% - 40px
            );
    }


    .chum-product-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(
                    0,
                    1fr
                )
            );
    }


    .chum-product-image,
    .chum-journey-visual {
        height:
            285px;
    }

}


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

@media (max-width: 850px) {

    .chum-compare-section {
        padding:
            46px
            0
            58px;
    }


    .chum-compare-container {
        width:
            calc(
                100% - 28px
            );
    }


    .chum-compare-header {
        flex-direction:
            column;

        align-items:
            flex-start;

        gap:
            18px;
    }


    .chum-discovery-view-all {
        display:
            none;
    }


    .chum-product-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );

        gap:
            14px;
    }


    .chum-product-image,
    .chum-journey-visual {
        height:
            265px;
    }

}


/* =====================================================================
   MOBILE
   ===================================================================== */

@media (max-width: 575px) {

    .chum-compare-section {
        padding:
            36px
            0
            44px;
    }


    .chum-compare-container {
        width:
            100%;

        padding:
            0
            13px;
    }


    .chum-compare-heading h2 {
        font-size:
            31px;
    }


    .chum-compare-heading p {
        font-size:
            12px;
    }


    .chum-discovery-filter {
        width:
            calc(
                100% + 13px
            );

        margin-right:
            -13px;

        padding-right:
            16px;
    }


    .chum-product-scroller {
        width:
            calc(
                100% + 26px
            );

        margin:
            0
            -13px;

        padding:
            2px
            13px
            15px;

        overflow-x:
            auto;

        overflow-y:
            hidden;

        scrollbar-width:
            none;

        scroll-snap-type:
            x proximity;
    }


    .chum-product-scroller::-webkit-scrollbar {
        display:
            none;
    }


    .chum-product-grid {
        width:
            max-content;

        display:
            flex;

        gap:
            13px;
    }


    .chum-product-card {
        width:
            min(
                86vw,
                350px
            );

        min-height:
            540px;

        flex:
            0
            0
            min(
                86vw,
                350px
            );

        scroll-snap-align:
            start;
    }


    .chum-product-image,
    .chum-journey-visual {
        height:
            285px;
    }


    .chum-product-content {
        padding:
            17px;
    }


    .chum-product-title {
        font-size:
            16px;
    }


    .chum-compare-button {
        min-width:
            155px;

        min-height:
            45px;
    }


    .chum-product-mobile-hint {
        display:
            block;

        margin-top:
            7px;

        color:
            #77838d;

        font-size:
            10px;

        text-align:
            center;
    }

}


/* =====================================================================
   REDUCED MOTION
   ===================================================================== */

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

    .chum-product-card,
    .chum-product-image img,
    .chum-product-wishlist,
    .chum-discovery-filter-button,
    .chum-discovery-view-all,
    .chum-compare-button,
    .chum-travel-plane {
        transition:
            none !important;
    }

}