/* =========================================================
   ZAN PEARL - POPULAR SAFARIS
========================================================= */

:root{
    --zs-deep:#004d47;
    --zs-blue:#005f57;
    --zs-ocean:#087a70;

    --zs-gold:#FFD21A;
    --zs-gold-light:#ff4b55;

    --zs-white:#FFFFFF;
    --zs-dark:#355f5b;
    --zs-muted:#687975;
    --zs-border:#dce7e3;
}


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

.zp-safaris{
    width:100%;

    padding:90px 0 100px;

    background:#ffffff;

    color:var(--zs-dark);
}

.zp-safaris-container{
    width:min(1380px,calc(100% - 60px));

    margin:0 auto;
}


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

.zp-safari-heading{
    margin-bottom:40px;

    display:flex;
    align-items:flex-end;
    justify-content:space-between;

    gap:50px;
}

.zp-safari-label{
    display:inline-block;

    margin-bottom:9px;

    padding:7px 11px;

    border-radius:7px;

    background:#fff1f2;

    color:var(--zs-gold);

    font-size:9px;
    font-weight:900;

    letter-spacing:1.3px;

    text-transform:uppercase;
}

.zp-safari-heading h2{
    margin:0;

    color:var(--zs-deep);

    font-family:'Manrope',sans-serif;

    font-size:44px;
    line-height:1.1;

    letter-spacing:-2px;

    font-weight:800;
}

.zp-safari-heading h2 span{
    color:var(--zs-gold);
}

.zp-safari-heading-right{
    max-width:430px;
}

.zp-safari-heading-right p{
    margin:0;

    color:var(--zs-muted);

    font-size:11px;

    line-height:1.75;
}

.zp-safari-heading-right a{
    display:inline-flex;

    align-items:center;

    gap:7px;

    margin-top:12px;

    color:var(--zs-deep);

    font-size:9px;

    font-weight:900;
}

.zp-safari-heading-right a i{
    color:var(--zs-gold);
}


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

.zp-safari-grid{
    display:grid;

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

    gap:24px;
}


/* =========================================================
   CARD
========================================================= */

.zp-safari-card{
    min-width:0;

    overflow:hidden;

    border-radius:17px;

    background:#fff;

    border:
        1px solid
        #EDF1F3;

    box-shadow:
        0 12px 35px
        rgba(0,77,71,.07);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.zp-safari-card:hover{
    transform:translateY(-6px);

    box-shadow:
        0 20px 48px
        rgba(0,77,71,.14);
}


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

.zp-safari-image{
    position:relative;

    width:100%;
    height:250px;

    display:block;

    overflow:hidden;

    border-radius:
        17px
        17px
        0
        0;

    background:#eef3f1;
}

.zp-safari-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

    transition:
        transform .55s ease;
}

.zp-safari-card:hover
.zp-safari-image img{
    transform:scale(1.06);
}

.zp-safari-placeholder{
    width:100%;
    height:100%;

    display:flex;

    align-items:center;
    justify-content:center;

    background:
        linear-gradient(
            135deg,
            #eef3f1,
            #dce7e3
        );

    color:#687975;

    font-size:34px;
}


/* =========================================================
   BADGES
========================================================= */

.zp-safari-featured,
.zp-safari-popular{
    position:absolute;

    z-index:5;

    top:15px;

    padding:7px 11px;

    border-radius:7px;

    font-size:8px;

    font-weight:900;
}

.zp-safari-featured{
    left:15px;

    background:var(--zs-blue);

    color:#fff;
}

.zp-safari-popular{
    left:15px;

    top:48px;

    background:
        linear-gradient(
            135deg,
            var(--zs-gold-light),
            var(--zs-gold)
        );

    color:var(--zs-deep);
}


/* HEART */

.zp-safari-heart{
    position:absolute;

    z-index:5;

    top:15px;
    right:15px;

    width:34px;
    height:34px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#fff;

    color:var(--zs-deep);

    font-size:12px;

    box-shadow:
        0 5px 15px
        rgba(0,77,71,.10);
}


/* =========================================================
   META OVER IMAGE
========================================================= */

.zp-safari-image-meta{
    position:absolute;

    z-index:6;

    left:16px;
    right:16px;
    bottom:0;

    min-height:42px;

    padding:0 14px;

    display:flex;

    align-items:center;
    justify-content:center;

    gap:10px;

    border-radius:
        11px
        11px
        0
        0;

    background:
        linear-gradient(
            135deg,
            var(--zs-gold-light),
            var(--zs-gold)
        );

    color:var(--zs-deep);

    font-size:8px;

    font-weight:700;
}

.zp-safari-image-meta span{
    min-width:0;

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;
}

.zp-safari-image-meta i{
    margin-right:4px;

    color:var(--zs-deep);
}

.zp-safari-meta-divider{
    width:1px;

    height:18px;

    flex:none;

    background:
        rgba(0,77,71,.27);
}


/* =========================================================
   BODY
========================================================= */

.zp-safari-body{
    padding:
        19px
        18px
        20px;
}


/* REVIEWS */

.zp-safari-review{
    display:flex;

    align-items:center;

    gap:11px;

    margin-bottom:12px;
}

.zp-safari-review > span{
    color:#657681;

    font-size:8px;
}

.zp-safari-stars{
    display:flex;

    gap:2px;

    color:var(--zs-gold);

    font-size:9px;
}


/* TITLE */

.zp-safari-body h3{
    min-height:58px;

    margin:0;

    color:var(--zs-dark);

    font-family:'Manrope',sans-serif;

    font-size:15px;

    line-height:1.48;

    font-weight:800;
}

.zp-safari-body h3 a{
    color:inherit;
}

.zp-safari-body h3 a:hover{
    color:var(--zs-blue);
}


/* =========================================================
   CARD FOOTER
========================================================= */

.zp-safari-footer{
    margin-top:16px;

    padding-top:15px;

    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:12px;

    border-top:
        1px solid
        var(--zs-border);
}


/* PRICE */

.zp-safari-price{
    min-width:0;
}

.zp-safari-price small{
    display:block;

    margin-bottom:3px;

    color:#8B989F;

    font-size:7px;
}

.zp-safari-price strong{
    color:var(--zs-deep);

    font-family:'Manrope',sans-serif;

    font-size:15px;

    line-height:1;

    font-weight:800;
}

.zp-safari-price > span{
    margin-left:2px;

    color:#7A8992;

    font-size:7px;
}


/* BOOK BUTTON */

.zp-safari-book{
    min-height:38px;

    padding:
        0
        5px
        0
        14px;

    display:flex;

    align-items:center;

    gap:10px;

    border:
        1px solid
        var(--zs-blue);

    border-radius:50px;

    color:var(--zs-deep);

    background:#fff;

    font-size:9px;

    font-weight:800;

    transition:.25s;
}

.zp-safari-book > span{
    width:28px;
    height:28px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:var(--zs-blue);

    color:#fff;

    font-size:8px;

    transition:.25s;
}

.zp-safari-book:hover{
    background:var(--zs-deep);

    border-color:var(--zs-deep);

    color:#fff;
}

.zp-safari-book:hover > span{
    background:var(--zs-gold);

    color:var(--zs-deep);
}


/* =========================================================
   EMPTY
========================================================= */

.zp-safari-empty{
    grid-column:1 / -1;

    padding:45px;

    text-align:center;

    color:#81919A;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1180px){

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

}


@media(max-width:900px){

    .zp-safari-heading{
        align-items:flex-start;

        flex-direction:column;

        gap:15px;
    }

    .zp-safari-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}


@media(max-width:620px){

    .zp-safaris{
        padding:65px 0 75px;
    }

    .zp-safaris-container{
        width:calc(100% - 30px);
    }

    .zp-safari-heading h2{
        font-size:33px;

        letter-spacing:-1px;
    }

    .zp-safari-grid{
        grid-template-columns:1fr;
    }

    .zp-safari-image{
        height:255px;
    }

}


/* =========================================================
   ZURI JOURNEYS - SAFARIS FINAL BRAND COLORS
========================================================= */

.zp-safaris{
    background:#ffffff !important;
}

.zp-safari-label{
    color:#FFD21A !important;
    border-color:rgba(239,23,35,.25) !important;
    background:#ffffff !important;
}

.zp-safari-heading h2{
    color:#004d47 !important;
}

.zp-safari-heading h2 span{
    color:#FFD21A !important;
}

.zp-safari-heading-right p{
    color:#60716d !important;
}

.zp-safari-heading-right a{
    color:#004d47 !important;
}

.zp-safari-heading-right a i{
    color:#FFD21A !important;
}

/* cards */
.zp-safari-card{
    background:#ffffff !important;
    border:1px solid #e1e8e6 !important;
    box-shadow:0 10px 30px rgba(0,77,71,.08) !important;
}

/* badges */
.zp-safari-featured{
    background:#005f57 !important;
    color:#ffffff !important;
}

.zp-safari-popular{
    background:#FFD21A !important;
    color:#ffffff !important;
}

/* heart */
.zp-safari-heart{
    background:#ffffff !important;
    color:#005f57 !important;
    border-color:#dbe5e2 !important;
}

.zp-safari-heart i{
    color:#005f57 !important;
}

/* image meta strip */
.zp-safari-image-meta{
    background:#004d47 !important;
    color:#ffffff !important;
}

.zp-safari-image-meta span,
.zp-safari-image-meta i{
    color:#ffffff !important;
}

.zp-safari-meta-divider{
    background:rgba(255,255,255,.32) !important;
}

/* review + stars */
.zp-safari-review span{
    color:#60716d !important;
}

.zp-safari-stars,
.zp-safari-stars i{
    color:#FFD21A !important;
}

/* titles */
.zp-safari-body h3,
.zp-safari-body h3 a{
    color:#004d47 !important;
}

.zp-safari-body h3 a:hover{
    color:#FFD21A !important;
}

/* price */
.zp-safari-price small{
    color:#687975 !important;
}

.zp-safari-price strong{
    color:#004d47 !important;
}

.zp-safari-price span{
    color:#687975 !important;
}

/* book button */
.zp-safari-book{
    border-color:#005f57 !important;
    color:#004d47 !important;
    background:#ffffff !important;
}

.zp-safari-book span{
    background:#FFD21A !important;
    color:#ffffff !important;
}

.zp-safari-book span i{
    color:#ffffff !important;
}

.zp-safari-book:hover{
    background:#005f57 !important;
    border-color:#005f57 !important;
    color:#ffffff !important;
}


/* =========================================================
   ZURI JOURNEYS - SAFARIS FINAL BRAND COLORS
========================================================= */

.zp-safaris{
    background:#ffffff !important;
}

.zp-safari-label{
    color:#FFD21A !important;
    border-color:rgba(239,23,35,.25) !important;
    background:#ffffff !important;
}

.zp-safari-heading h2{
    color:#004d47 !important;
}

.zp-safari-heading h2 span{
    color:#FFD21A !important;
}

.zp-safari-heading-right p{
    color:#60716d !important;
}

.zp-safari-heading-right a{
    color:#004d47 !important;
}

.zp-safari-heading-right a i{
    color:#FFD21A !important;
}

/* cards */
.zp-safari-card{
    background:#ffffff !important;
    border:1px solid #e1e8e6 !important;
    box-shadow:0 10px 30px rgba(0,77,71,.08) !important;
}

/* badges */
.zp-safari-featured{
    background:#005f57 !important;
    color:#ffffff !important;
}

.zp-safari-popular{
    background:#FFD21A !important;
    color:#ffffff !important;
}

/* heart */
.zp-safari-heart{
    background:#ffffff !important;
    color:#005f57 !important;
    border-color:#dbe5e2 !important;
}

.zp-safari-heart i{
    color:#005f57 !important;
}

/* image meta strip */
.zp-safari-image-meta{
    background:#004d47 !important;
    color:#ffffff !important;
}

.zp-safari-image-meta span,
.zp-safari-image-meta i{
    color:#ffffff !important;
}

.zp-safari-meta-divider{
    background:rgba(255,255,255,.32) !important;
}

/* review + stars */
.zp-safari-review span{
    color:#60716d !important;
}

.zp-safari-stars,
.zp-safari-stars i{
    color:#FFD21A !important;
}

/* titles */
.zp-safari-body h3,
.zp-safari-body h3 a{
    color:#004d47 !important;
}

.zp-safari-body h3 a:hover{
    color:#FFD21A !important;
}

/* price */
.zp-safari-price small{
    color:#687975 !important;
}

.zp-safari-price strong{
    color:#004d47 !important;
}

.zp-safari-price span{
    color:#687975 !important;
}

/* book button */
.zp-safari-book{
    border-color:#005f57 !important;
    color:#004d47 !important;
    background:#ffffff !important;
}

.zp-safari-book span{
    background:#FFD21A !important;
    color:#ffffff !important;
}

.zp-safari-book span i{
    color:#ffffff !important;
}

.zp-safari-book:hover{
    background:#005f57 !important;
    border-color:#005f57 !important;
    color:#ffffff !important;
}


/* =========================================================
   ZURI JOURNEYS - HOME SAFARIS READABILITY FIX
========================================================= */

.zp-safari-body h3,
.zp-safari-body h3 a{
    color:#003f3b !important;
    font-size:17px !important;
    line-height:1.45 !important;
    font-weight:800 !important;
}

.zp-safari-review{
    font-size:11px !important;
}

.zp-safari-image-meta span{
    font-size:10px !important;
    line-height:1.4 !important;
}

.zp-safari-price small{
    font-size:10px !important;
}

.zp-safari-price strong{
    font-size:17px !important;
}

.zp-safari-price > span{
    font-size:10px !important;
}

.zp-safari-book{
    font-size:11px !important;
    font-weight:800 !important;
}

