/* =========================================================
   ZAN PEARL - WHY CHOOSE US
========================================================= */

:root{
    --why-deep:#044C48;
    --why-blue:#005EA8;
    --why-ocean:#006B63;

    --why-gold:#D6A529;
    --why-gold-light:#F1D46E;

    --why-dark:#102B47;
    --why-text:#657987;

    --why-white:#FFFFFF;
    --why-soft:#F8FBFC;
    --why-border:#E7ECEF;
}


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

.zp-why{
    position:relative;

    width:100%;

    padding:95px 0 100px;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 50% 46%,
            rgba(0,166,214,.06),
            transparent 27%
        ),
        #ffffff;

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

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

    margin:0 auto;

    display:grid;

    grid-template-columns:
        minmax(0,.95fr)
        minmax(320px,.70fr)
        minmax(0,1.05fr);

    align-items:center;

    gap:55px;
}


/* =========================================================
   LEFT
========================================================= */

.zp-why-kicker{
    position:relative;

    display:inline-block;

    margin-bottom:18px;

    color:var(--why-blue);

    font-size:11px;

    font-weight:900;

    letter-spacing:3px;

    text-transform:uppercase;
}

.zp-why-kicker:after{
    content:'';

    position:absolute;

    left:0;
    bottom:-8px;

    width:55px;
    height:2px;

    background:
        linear-gradient(
            90deg,
            var(--why-blue) 0 62%,
            var(--why-gold) 62% 100%
        );
}


/* TITLE */

.zp-why-left h2{
    max-width:500px;

    margin:20px 0 0;

    color:var(--why-deep);

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

    font-size:48px;

    line-height:1.12;

    letter-spacing:-2.3px;

    font-weight:800;
}

.zp-why-left h2 span{
    color:var(--why-gold);
}


/* INTRO */

.zp-why-intro{
    max-width:510px;

    margin:24px 0 28px;

    color:var(--why-text);

    font-size:13px;

    line-height:1.85;
}


/* CHECKLIST */

.zp-why-checks{
    margin:0;
    padding:0;

    list-style:none;
}

.zp-why-checks li{
    margin:14px 0;

    display:flex;

    align-items:center;

    gap:11px;

    color:var(--why-dark);

    font-size:12px;

    font-weight:600;
}

.zp-why-checks li > span{
    width:25px;
    height:25px;

    flex:none;

    display:flex;

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

    border-radius:50%;

    background:var(--why-deep);

    color:var(--why-gold-light);

    font-size:9px;

    box-shadow:
        0 5px 14px
        rgba(0,39,85,.15);
}


/* =========================================================
   CENTER TRAVEL ILLUSTRATION
========================================================= */

.zp-why-illustration{
    position:relative;

    min-height:540px;

    display:flex;

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


/* BACKGROUND CIRCLE */

.zp-illustration-circle{
    position:absolute;

    width:360px;
    height:360px;

    border-radius:50%;

    background:
        linear-gradient(
            145deg,
            #EEF7FC,
            #F9FCFD
        );
}


/* dotted orbit */

.zp-illustration-circle:before{
    content:'';

    position:absolute;

    inset:25px;

    border:
        2px dashed
        rgba(0,94,168,.14);

    border-radius:50%;
}


/* PLANE */

.zp-plane-icon{
    position:absolute;

    top:95px;
    right:28px;

    width:54px;
    height:54px;

    display:flex;

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

    border-radius:50%;

    background:#fff;

    color:var(--why-blue);

    font-size:22px;

    transform:rotate(-15deg);

    box-shadow:
        0 10px 30px
        rgba(0,39,85,.10);

    z-index:4;
}


/* MAP */

.zp-map-icon{
    position:absolute;

    top:135px;
    left:15px;

    width:64px;
    height:64px;

    display:flex;

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

    border-radius:18px;

    background:
        linear-gradient(
            145deg,
            var(--why-gold-light),
            var(--why-gold)
        );

    color:var(--why-deep);

    font-size:25px;

    transform:rotate(-8deg);

    z-index:5;
}


/* LOCATION */

.zp-location-icon{
    position:absolute;

    top:265px;
    right:3px;

    width:48px;
    height:48px;

    display:flex;

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

    border-radius:50%;

    background:var(--why-ocean);

    color:#fff;

    font-size:18px;

    box-shadow:
        0 10px 26px
        rgba(0,166,214,.25);

    z-index:5;
}


/* TRAVELER */

.zp-traveler{
    position:absolute;

    left:50%;
    top:94px;

    width:175px;
    height:340px;

    transform:translateX(-55%);

    z-index:7;
}


/* HEAD */

.zp-traveler-head{
    position:absolute;

    top:0;
    left:50%;

    width:82px;
    height:82px;

    transform:translateX(-50%);

    display:flex;

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

    border:
        7px solid
        var(--why-gold);

    border-radius:50%;

    background:#F2C59D;

    color:var(--why-deep);

    font-size:33px;

    box-shadow:
        0 9px 22px
        rgba(0,39,85,.10);
}


/* hat */

.zp-traveler-head:before{
    content:'';

    position:absolute;

    top:-22px;
    left:50%;

    width:105px;
    height:30px;

    transform:translateX(-50%);

    border-radius:
        50%
        50%
        35%
        35%;

    background:var(--why-gold);
}


/* BODY */

.zp-traveler-body{
    position:absolute;

    top:76px;
    left:50%;

    width:150px;
    height:220px;

    transform:translateX(-50%);

    display:flex;

    flex-direction:column;

    align-items:center;

    padding-top:55px;

    border-radius:
        55px
        55px
        32px
        32px;

    background:
        linear-gradient(
            145deg,
            var(--why-blue),
            var(--why-deep)
        );

    color:#fff;

    box-shadow:
        0 18px 45px
        rgba(0,39,85,.16);
}

.zp-traveler-body:before,
.zp-traveler-body:after{
    content:'';

    position:absolute;

    bottom:-105px;

    width:46px;
    height:125px;

    border-radius:
        5px
        5px
        18px
        18px;

    background:var(--why-deep);
}

.zp-traveler-body:before{
    left:23px;
}

.zp-traveler-body:after{
    right:23px;
}

.zp-traveler-body > i{
    width:52px;
    height:44px;

    display:flex;

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

    border-radius:10px;

    background:
        rgba(255,255,255,.12);

    color:var(--why-gold-light);

    font-size:23px;
}

.zp-traveler-body > span{
    margin-top:15px;

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

    font-size:9px;

    font-weight:900;

    letter-spacing:3px;
}


/* SUITCASE */

.zp-suitcase{
    position:absolute;

    right:22px;
    bottom:57px;

    width:110px;
    height:165px;

    display:flex;

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

    border-radius:20px;

    background:var(--why-deep);

    border:
        4px solid
        var(--why-gold);

    color:var(--why-gold-light);

    z-index:9;

    box-shadow:
        0 18px 35px
        rgba(0,39,85,.17);
}

.zp-suitcase > i{
    font-size:48px;
}

.zp-suitcase-handle{
    position:absolute;

    top:-42px;

    width:45px;
    height:44px;

    border:
        5px solid
        var(--why-deep);

    border-bottom:0;

    border-radius:
        9px
        9px
        0
        0;
}

.zp-suitcase:before,
.zp-suitcase:after{
    content:'';

    position:absolute;

    bottom:-11px;

    width:15px;
    height:15px;

    border-radius:50%;

    background:var(--why-deep);
}

.zp-suitcase:before{
    left:16px;
}

.zp-suitcase:after{
    right:16px;
}


/* SHADOW */

.zp-illustration-shadow{
    position:absolute;

    bottom:35px;
    left:50%;

    width:330px;
    height:36px;

    transform:translateX(-50%);

    border-radius:50%;

    background:
        rgba(0,39,85,.08);

    filter:blur(4px);
}


/* =========================================================
   RIGHT FEATURES
========================================================= */

.zp-why-right{
    display:flex;

    flex-direction:column;
}

.zp-why-feature{
    display:grid;

    grid-template-columns:82px 1fr;

    align-items:center;

    gap:24px;

    padding:22px 0;
}


/* ICON CIRCLE */

.zp-why-feature-icon{
    width:82px;
    height:82px;

    display:flex;

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

    border:
        1px solid
        #E7ECEF;

    border-radius:50%;

    background:#fff;

    color:var(--why-blue);

    font-size:29px;

    box-shadow:
        0 15px 40px
        rgba(0,39,85,.08);

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease;
}

.zp-why-feature:hover
.zp-why-feature-icon{
    transform:translateY(-5px);

    background:var(--why-deep);

    color:var(--why-gold-light);
}


/* RIGHT TEXT */

.zp-why-feature h3{
    margin:0 0 8px;

    color:var(--why-deep);

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

    font-size:19px;

    line-height:1.25;

    font-weight:800;
}

.zp-why-feature p{
    max-width:440px;

    margin:0;

    color:var(--why-text);

    font-size:11px;

    line-height:1.8;
}


/* DIVIDER */

.zp-why-divider{
    height:1px;

    margin-left:105px;

    background:var(--why-border);
}


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

@media(max-width:1150px){

    .zp-why-container{
        grid-template-columns:
            1fr
            .75fr
            1fr;

        gap:30px;
    }

    .zp-why-left h2{
        font-size:40px;
    }

    .zp-illustration-circle{
        width:300px;
        height:300px;
    }

}


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

@media(max-width:950px){

    .zp-why{
        padding:75px 0;
    }

    .zp-why-container{
        grid-template-columns:1fr 1fr;

        gap:50px;
    }

    .zp-why-left{
        grid-column:1;
    }

    .zp-why-illustration{
        grid-column:2;

        min-height:500px;
    }

    .zp-why-right{
        grid-column:1 / -1;

        display:grid;

        grid-template-columns:
            repeat(3,1fr);

        gap:20px;
    }

    .zp-why-feature{
        grid-template-columns:1fr;

        padding:20px;

        border:
            1px solid
            var(--why-border);

        border-radius:16px;
    }

    .zp-why-divider{
        display:none;
    }

}


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

@media(max-width:650px){

    .zp-why{
        padding:60px 0 70px;
    }

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

        grid-template-columns:1fr;

        gap:35px;
    }

    .zp-why-left,
    .zp-why-illustration,
    .zp-why-right{
        grid-column:1;
    }

    .zp-why-left h2{
        font-size:34px;

        letter-spacing:-1.4px;
    }

    .zp-why-intro{
        font-size:11px;
    }

    .zp-why-illustration{
        min-height:500px;

        transform:scale(.88);
    }

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

    .zp-why-feature{
        grid-template-columns:70px 1fr;
    }

    .zp-why-feature-icon{
        width:70px;
        height:70px;

        font-size:24px;
    }

}



/* =========================================================
   WHY CHOOSE US - PROFESSIONAL CENTER ILLUSTRATION
========================================================= */

.zp-why-illustration{
    position:relative;

    min-height:570px;

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

    isolation:isolate;
}


/* SOFT BACKGROUND */

.zp-why-art-bg{
    position:absolute;

    left:50%;
    top:50%;

    width:440px;
    height:440px;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(0,166,214,.10) 0%,
            rgba(0,94,168,.055) 48%,
            rgba(0,39,85,.02) 68%,
            transparent 69%
        );

    z-index:-2;
}


/* DOTTED TRAVEL CIRCLE */

.zp-why-art-bg::before{
    content:"";

    position:absolute;

    inset:35px;

    border:2px dashed rgba(0,94,168,.13);

    border-radius:50%;
}


/* GOLD DECORATION */

.zp-why-art-bg::after{
    content:"";

    position:absolute;

    width:75px;
    height:75px;

    left:15px;
    top:105px;

    border-radius:
        22px
        22px
        22px
        6px;

    transform:rotate(-10deg);

    background:
        linear-gradient(
            135deg,
            #F1D46E,
            #D6A529
        );

    opacity:.85;
}


/* ACTUAL CARTOON */

.zp-why-art-image{
    position:relative;

    z-index:4;

    display:block;

    width:auto;
    max-width:390px;

    height:535px;

    object-fit:contain;

    object-position:center bottom;

    filter:
        drop-shadow(
            0 22px 18px
            rgba(0,39,85,.10)
        );
}


/* PLANE FLOATING ICON */

.zp-why-art-plane{
    position:absolute;

    z-index:6;

    top:85px;
    right:20px;

    width:64px;
    height:64px;

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

    border-radius:50%;

    background:#fff;

    color:#005EA8;

    font-size:23px;

    box-shadow:
        0 14px 35px
        rgba(0,39,85,.10);

    transform:rotate(-12deg);
}


/* LOCATION FLOATING ICON */

.zp-why-art-location{
    position:absolute;

    z-index:6;

    right:0;
    top:285px;

    width:57px;
    height:57px;

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

    border-radius:50%;

    background:#006B63;

    color:#fff;

    font-size:20px;

    box-shadow:
        0 13px 30px
        rgba(0,166,214,.25);
}


/* FLOOR SHADOW */

.zp-why-illustration::after{
    content:"";

    position:absolute;

    z-index:-1;

    left:50%;
    bottom:16px;

    width:340px;
    height:38px;

    transform:translateX(-50%);

    border-radius:50%;

    background:rgba(0,39,85,.08);

    filter:blur(9px);
}


/* =========================================================
   REMOVE OLD CSS ILLUSTRATION
========================================================= */

.zp-illustration-circle,
.zp-plane-icon,
.zp-location-icon,
.zp-map-icon,
.zp-traveler,
.zp-suitcase,
.zp-illustration-shadow{
    display:none !important;
}


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

@media(max-width:1150px){

    .zp-why-art-image{
        max-width:330px;
        height:490px;
    }

    .zp-why-art-bg{
        width:370px;
        height:370px;
    }

}


@media(max-width:950px){

    .zp-why-illustration{
        min-height:520px;
    }

}


@media(max-width:650px){

    .zp-why-illustration{
        min-height:470px;

        transform:none;
    }

    .zp-why-art-image{
        max-width:300px;
        height:440px;
    }

    .zp-why-art-bg{
        width:330px;
        height:330px;
    }

    .zp-why-art-plane{
        right:15px;

        width:52px;
        height:52px;

        font-size:18px;
    }

    .zp-why-art-location{
        right:5px;

        width:48px;
        height:48px;

        font-size:17px;
    }

}


/* ==========================================================
   GO ZANZIBAR FINAL WHY CHOOSE US
   GREEN + RED + ORANGE + WHITE ONLY
========================================================== */

section.zp-why{
    background:#FFFFFF !important;
}

/* LEFT */
section.zp-why .zp-why-kicker{
    color:#F20D18 !important;
    background:rgba(242,13,24,.06) !important;
    border:1px solid rgba(242,13,24,.16) !important;
}

section.zp-why .zp-why-left h2{
    color:#044C48 !important;
}

section.zp-why .zp-why-left h2 span{
    color:#F20D18 !important;
}

section.zp-why .zp-why-intro{
    color:#5F716E !important;
}

/* CHECKS */
section.zp-why .zp-why-checks li{
    color:#044C48 !important;
}

section.zp-why .zp-why-checks li > span{
    background:#006B63 !important;
    border-color:#006B63 !important;
    color:#FFFFFF !important;
}

section.zp-why .zp-why-checks li > span i{
    color:#FFFFFF !important;
}

/* CENTER IMAGE */
section.zp-why .zp-why-illustration{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:540px !important;
}

section.zp-why .zp-why-image-wrap{
    position:relative !important;
    width:100% !important;
    max-width:440px !important;
    height:540px !important;
}

section.zp-why .zp-why-image-wrap > img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    border-radius:32px !important;
    border:6px solid #FFFFFF !important;
    box-shadow:0 24px 60px rgba(4,76,72,.18) !important;
}

/* RED DECORATION */
section.zp-why .zp-why-image-wrap::before{
    content:"" !important;
    position:absolute !important;
    width:105px !important;
    height:105px !important;
    top:-18px !important;
    right:-18px !important;
    border-radius:26px !important;
    background:#F20D18 !important;
    z-index:-1 !important;
}

/* ORANGE DECORATION */
section.zp-why .zp-why-image-wrap::after{
    content:"" !important;
    position:absolute !important;
    width:115px !important;
    height:115px !important;
    left:-18px !important;
    bottom:-18px !important;
    border-radius:50% !important;
    background:#FF6900 !important;
    z-index:-1 !important;
}

/* IMAGE BADGE */
section.zp-why .zp-why-image-badge{
    position:absolute !important;
    left:-38px !important;
    bottom:38px !important;

    display:flex !important;
    align-items:center !important;
    gap:14px !important;

    min-width:240px !important;
    padding:17px 20px !important;

    background:#044C48 !important;
    color:#FFFFFF !important;

    border-radius:17px !important;
    border:4px solid #FFFFFF !important;

    box-shadow:0 15px 35px rgba(4,76,72,.22) !important;
}

section.zp-why .zp-why-image-badge-icon{
    width:48px !important;
    height:48px !important;
    flex:0 0 48px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:50% !important;

    background:#F20D18 !important;
    color:#FFFFFF !important;
}

section.zp-why .zp-why-image-badge-icon i{
    color:#FFFFFF !important;
}

section.zp-why .zp-why-image-badge strong{
    display:block !important;
    color:#FFFFFF !important;
    font-size:16px !important;
}

section.zp-why .zp-why-image-badge div > span{
    display:block !important;
    margin-top:3px !important;
    color:rgba(255,255,255,.78) !important;
    font-size:12px !important;
}

/* RIGHT FEATURES */
section.zp-why .zp-why-feature-icon{
    background:rgba(0,107,99,.08) !important;
    border-color:rgba(0,107,99,.14) !important;
    color:#006B63 !important;
}

section.zp-why .zp-why-feature-icon i{
    color:#006B63 !important;
}

section.zp-why .zp-why-feature:nth-of-type(3) .zp-why-feature-icon{
    background:rgba(242,13,24,.07) !important;
    border-color:rgba(242,13,24,.14) !important;
}

section.zp-why .zp-why-feature:nth-of-type(3) .zp-why-feature-icon i{
    color:#F20D18 !important;
}

section.zp-why .zp-why-feature:nth-of-type(5) .zp-why-feature-icon{
    background:rgba(255,105,0,.08) !important;
    border-color:rgba(255,105,0,.14) !important;
}

section.zp-why .zp-why-feature:nth-of-type(5) .zp-why-feature-icon i{
    color:#FF6900 !important;
}

section.zp-why .zp-why-feature h3{
    color:#044C48 !important;
}

section.zp-why .zp-why-feature p{
    color:#60716E !important;
}

section.zp-why .zp-why-divider{
    background:rgba(4,76,72,.12) !important;
}

/* MOBILE */
@media(max-width:991px){

    section.zp-why .zp-why-illustration{
        min-height:auto !important;
        margin:35px 0 60px !important;
    }

    section.zp-why .zp-why-image-wrap{
        max-width:500px !important;
        height:500px !important;
    }

    section.zp-why .zp-why-image-badge{
        left:20px !important;
        bottom:-30px !important;
    }
}

@media(max-width:575px){

    section.zp-why .zp-why-image-wrap{
        height:410px !important;
    }

    section.zp-why .zp-why-image-wrap > img{
        border-radius:24px !important;
    }

    section.zp-why .zp-why-image-badge{
        left:15px !important;
        right:15px !important;
        bottom:-35px !important;
        min-width:0 !important;
    }
}


/* ==========================================================
   GO ZANZIBAR - WHY CHOOSE US FINAL LAYOUT FIX
========================================================== */

section.zp-why{
    background:#FFFFFF !important;
    padding:90px 0 !important;
    overflow:hidden !important;
}

section.zp-why .zp-why-container{
    width:min(1320px, calc(100% - 60px)) !important;
    max-width:1320px !important;
    margin:0 auto !important;

    display:grid !important;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(330px, .92fr)
        minmax(0, 1fr) !important;

    align-items:center !important;
    gap:55px !important;
}

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

section.zp-why .zp-why-left{
    width:100% !important;
    min-width:0 !important;
}

section.zp-why .zp-why-kicker{
    display:inline-flex !important;
    align-items:center !important;

    padding:9px 16px !important;
    margin-bottom:20px !important;

    background:rgba(242,13,24,.06) !important;
    border:1px solid rgba(242,13,24,.16) !important;
    border-radius:9px !important;

    color:#F20D18 !important;

    font-size:12px !important;
    font-weight:700 !important;
    letter-spacing:1.4px !important;
    text-transform:uppercase !important;
}

section.zp-why .zp-why-left h2{
    margin:0 0 22px !important;

    color:#044C48 !important;

    font-size:clamp(38px,3vw,56px) !important;
    line-height:1.08 !important;
    letter-spacing:-1.5px !important;
}

section.zp-why .zp-why-left h2 span{
    color:#F20D18 !important;
}

section.zp-why .zp-why-intro{
    margin:0 0 28px !important;

    color:#5F716E !important;

    font-size:15px !important;
    line-height:1.8 !important;
}

/* CHECK LIST */

section.zp-why .zp-why-checks{
    list-style:none !important;
    padding:0 !important;
    margin:0 !important;

    display:grid !important;
    gap:13px !important;
}

section.zp-why .zp-why-checks li{
    display:flex !important;
    align-items:center !important;
    gap:11px !important;

    color:#044C48 !important;

    font-size:14px !important;
    font-weight:600 !important;
    line-height:1.4 !important;
}

section.zp-why .zp-why-checks li > span{
    width:24px !important;
    height:24px !important;
    flex:0 0 24px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:50% !important;

    background:#006B63 !important;
    border:0 !important;
}

section.zp-why .zp-why-checks li > span i{
    color:#FFFFFF !important;
    font-size:10px !important;
}

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

section.zp-why .zp-why-illustration{
    width:100% !important;
    min-width:0 !important;
    min-height:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    margin:0 !important;
}

section.zp-why .zp-why-image-wrap{
    position:relative !important;

    width:100% !important;
    max-width:390px !important;
    height:480px !important;

    margin:0 auto !important;
}

/* REMOVE OLD DECORATION THAT DISTORTS DESIGN */
section.zp-why .zp-why-image-wrap::before,
section.zp-why .zp-why-image-wrap::after{
    display:none !important;
}

section.zp-why .zp-why-image-wrap > img{
    width:100% !important;
    height:100% !important;

    display:block !important;

    object-fit:cover !important;
    object-position:center !important;

    border:0 !important;
    border-radius:28px !important;

    box-shadow:
        0 22px 50px rgba(4,76,72,.16) !important;
}

/* IMAGE BADGE */

section.zp-why .zp-why-image-badge{
    position:absolute !important;

    left:20px !important;
    right:20px !important;
    bottom:20px !important;

    min-width:0 !important;
    width:auto !important;

    display:flex !important;
    align-items:center !important;
    gap:12px !important;

    padding:14px 16px !important;

    background:rgba(4,76,72,.95) !important;
    border:1px solid rgba(255,255,255,.18) !important;
    border-radius:15px !important;

    box-shadow:0 12px 28px rgba(0,0,0,.16) !important;
}

section.zp-why .zp-why-image-badge-icon{
    width:42px !important;
    height:42px !important;
    flex:0 0 42px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:#F20D18 !important;
    border-radius:50% !important;
}

section.zp-why .zp-why-image-badge-icon i{
    color:#FFFFFF !important;
    font-size:15px !important;
}

section.zp-why .zp-why-image-badge strong{
    display:block !important;

    color:#FFFFFF !important;

    font-size:14px !important;
    line-height:1.3 !important;
}

section.zp-why .zp-why-image-badge div > span{
    display:block !important;

    margin-top:2px !important;

    color:rgba(255,255,255,.76) !important;

    font-size:11px !important;
}

/* ======================================
   RIGHT FEATURES
====================================== */

section.zp-why .zp-why-right{
    width:100% !important;
    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;
}

section.zp-why .zp-why-feature{
    width:100% !important;

    display:grid !important;
    grid-template-columns:58px minmax(0,1fr) !important;
    gap:18px !important;

    align-items:flex-start !important;

    padding:24px 0 !important;
}

section.zp-why .zp-why-feature-icon{
    width:58px !important;
    height:58px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:16px !important;

    background:rgba(0,107,99,.08) !important;
    border:1px solid rgba(0,107,99,.12) !important;
}

section.zp-why .zp-why-feature-icon i{
    color:#006B63 !important;
    font-size:22px !important;
}

/* second icon */
section.zp-why .zp-why-feature:nth-of-type(3) .zp-why-feature-icon{
    background:rgba(242,13,24,.07) !important;
    border-color:rgba(242,13,24,.12) !important;
}

section.zp-why .zp-why-feature:nth-of-type(3) .zp-why-feature-icon i{
    color:#F20D18 !important;
}

/* third icon */
section.zp-why .zp-why-feature:nth-of-type(5) .zp-why-feature-icon{
    background:rgba(255,105,0,.08) !important;
    border-color:rgba(255,105,0,.14) !important;
}

section.zp-why .zp-why-feature:nth-of-type(5) .zp-why-feature-icon i{
    color:#FF6900 !important;
}

section.zp-why .zp-why-feature h3{
    margin:0 0 8px !important;

    color:#044C48 !important;

    font-size:19px !important;
    line-height:1.3 !important;
}

section.zp-why .zp-why-feature p{
    margin:0 !important;

    color:#60716E !important;

    font-size:14px !important;
    line-height:1.7 !important;
}

section.zp-why .zp-why-divider{
    width:100% !important;
    height:1px !important;

    background:rgba(4,76,72,.12) !important;
}

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

@media(max-width:1100px){

    section.zp-why .zp-why-container{
        width:min(940px, calc(100% - 40px)) !important;

        grid-template-columns:1fr 1fr !important;
        gap:45px !important;
    }

    section.zp-why .zp-why-right{
        grid-column:1 / -1 !important;

        display:grid !important;
        grid-template-columns:repeat(3,1fr) !important;
        gap:25px !important;
    }

    section.zp-why .zp-why-divider{
        display:none !important;
    }

    section.zp-why .zp-why-feature{
        display:block !important;
        padding:25px !important;

        background:#F7FAF9 !important;
        border-radius:18px !important;
    }

    section.zp-why .zp-why-feature-icon{
        margin-bottom:18px !important;
    }
}

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

@media(max-width:767px){

    section.zp-why{
        padding:65px 0 !important;
    }

    section.zp-why .zp-why-container{
        width:calc(100% - 30px) !important;

        display:flex !important;
        flex-direction:column !important;
        gap:40px !important;
    }

    section.zp-why .zp-why-left h2{
        font-size:36px !important;
    }

    section.zp-why .zp-why-image-wrap{
        width:100% !important;
        max-width:100% !important;
        height:460px !important;
    }

    section.zp-why .zp-why-right{
        width:100% !important;

        display:flex !important;
        flex-direction:column !important;
        gap:0 !important;
    }

    section.zp-why .zp-why-feature{
        display:grid !important;
        grid-template-columns:55px minmax(0,1fr) !important;
        padding:22px 0 !important;

        background:transparent !important;
    }

    section.zp-why .zp-why-divider{
        display:block !important;
    }
}

@media(max-width:480px){

    section.zp-why .zp-why-image-wrap{
        height:390px !important;
    }

    section.zp-why .zp-why-image-badge{
        left:12px !important;
        right:12px !important;
        bottom:12px !important;
    }
}