/* =========================================================
   ZANZI STROLL - WHY CHOOSE US
   FINAL CLEAN VERSION
========================================================= */

.zp-why{
    --gz-deep:#003B69;
    --gz-blue:#00518A;
    --gz-gold:#F5A000;

    --gz-text:#61717D;
    --gz-white:#FFFFFF;
    --gz-soft:#F7FAFC;
    --gz-border:#DCE6EE;
}


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

.zp-why{
    position:relative;
    width:100%;
    padding:95px 0 100px;
    overflow:hidden;
    background:#ffffff;
}


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

    display:grid;

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

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


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

.zp-why-left{
    position:relative;
    z-index:2;
}


.zp-why-kicker{
    position:relative;
    display:inline-flex;
    align-items:center;

    margin-bottom:18px;

    padding:8px 13px;

    border:1px solid rgba(245,160,0,.28);
    border-radius:7px;

    background:#fff;

    color:var(--gz-gold);

    font-size:10px;
    font-weight:900;
    letter-spacing:2px;
    text-transform:uppercase;
}


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

    position:absolute;

    left:0;
    bottom:-9px;

    width:58px;
    height:2px;

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


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

    margin:20px 0 0;

    color:var(--gz-deep);

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

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

    letter-spacing:-2.2px;

    font-weight:800;
}


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


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

    margin:24px 0 28px;

    color:var(--gz-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:#243746;

    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(--gz-blue);

    color:#fff;

    font-size:9px;
}


.zp-why-checks li i{
    color:#fff;
}


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

.zp-why-illustration{
    position:relative;

    width:100%;
    min-height:510px;

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


/* hide every old illustration element */

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


/* NEW IMAGE CARD */

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

    width:100%;
    max-width:390px;

    margin:auto;
}


.zp-why-image{
    display:block;

    width:100%;
    height:455px;

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

    border-radius:24px;

    border:6px solid #fff;

    box-shadow:
        0 20px 50px
        rgba(0,59,105,.15);
}


/* subtle decoration */

.zp-why-image-card:before{
    content:'';

    position:absolute;

    width:130px;
    height:130px;

    left:-32px;
    top:-30px;

    border-radius:50%;

    background:rgba(0,81,138,.07);

    z-index:-1;
}


.zp-why-image-card:after{
    content:'';

    position:absolute;

    width:100px;
    height:100px;

    right:-25px;
    bottom:-25px;

    border-radius:50%;

    background:rgba(245,160,0,.07);

    z-index:-1;
}


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

.zp-why-image-badge{
    position:absolute;

    left:22px;
    right:22px;
    bottom:18px;

    min-height:72px;

    display:flex;
    align-items:center;

    gap:14px;

    padding:13px 16px;

    border-radius:15px;

    background:rgba(0,59,105,.95);

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


.zp-why-image-badge-icon{
    width:43px;
    height:43px;

    flex:none;

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

    border-radius:50%;

    background:var(--gz-gold);

    color:#fff;
}


.zp-why-image-badge-icon i{
    color:#fff;
    font-size:16px;
}


.zp-why-image-badge div{
    min-width:0;
}


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

    color:#fff;

    font-size:13px;
    line-height:1.3;

    font-weight:800;
}


.zp-why-image-badge div span{
    display:block;

    margin-top:3px;

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

    font-size:10px;
}


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

.zp-why-right{
    display:flex;
    flex-direction:column;

    justify-content:center;
}


.zp-why-feature{
    display:grid;

    grid-template-columns:62px 1fr;

    align-items:center;

    gap:20px;

    padding:23px 0;
}


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

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

    border-radius:16px;

    background:#F0F6FB;

    border:1px solid #DCE6EE;

    color:var(--gz-blue);

    font-size:21px;

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


.zp-why-feature-icon i{
    color:inherit;
}


/* second feature gold */

.zp-why-feature:nth-of-type(3)
.zp-why-feature-icon{
    background:#FFF4DC;

    border-color:#F8DEAB;

    color:var(--gz-gold);
}


/* third feature blue */

.zp-why-feature:nth-of-type(5)
.zp-why-feature-icon{
    background:#F0F6FB;

    border-color:#DCE6EE;

    color:var(--gz-blue);
}


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

    background:var(--gz-blue);

    border-color:var(--gz-blue);

    color:#fff;
}


.zp-why-feature:nth-of-type(3):hover
.zp-why-feature-icon{
    background:var(--gz-gold);

    border-color:var(--gz-gold);

    color:#fff;
}


/* TEXT */

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

    color:var(--gz-deep);

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

    font-size:18px;
    line-height:1.3;

    font-weight:800;
}


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

    margin:0;

    color:var(--gz-text);

    font-size:11px;
    line-height:1.8;
}


/* divider */

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

    margin-left:82px;

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


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

@media(max-width:1150px){

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

        gap:30px;
    }

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

    .zp-why-image{
        height:420px;
    }

}


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

@media(max-width:950px){

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


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

        gap:45px;
    }


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


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

        min-height:auto;
    }


    .zp-why-image-card{
        max-width:420px;
    }


    .zp-why-image{
        height:450px;
    }


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

        display:grid;

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

        gap:18px;
    }


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

        align-content:start;

        padding:22px;

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

        border-radius:17px;

        background:#fff;
    }


    .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.3px;
    }


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


    .zp-why-illustration{
        min-height:auto;
    }


    .zp-why-image-card{
        max-width:100%;
    }


    .zp-why-image{
        height:390px;

        border-radius:19px;

        border-width:4px;
    }


    .zp-why-image-badge{
        left:14px;
        right:14px;
        bottom:14px;

        min-height:65px;

        padding:11px 13px;
    }


    .zp-why-image-badge-icon{
        width:39px;
        height:39px;
    }


    .zp-why-right{
        display:flex;

        flex-direction:column;

        gap:0;
    }


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

        gap:15px;

        padding:20px 0;

        border:0;

        border-radius:0;
    }


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

        border-radius:14px;

        font-size:18px;
    }


    .zp-why-divider{
        display:block;

        margin-left:69px;
    }

}


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

@media(max-width:420px){

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


    .zp-why-image{
        height:350px;
    }


    .zp-why-image-badge{
        left:10px;
        right:10px;
        bottom:10px;
    }

}

/* =========================================================
   ZANZI STROLL - READABILITY AND ACCESSIBILITY
   Preserve original layout and breakpoints
========================================================= */
.zp-why{
    font-family:"Manrope","Inter","Segoe UI",Arial,sans-serif;
    color:#243746;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
.zp-why-kicker{
    color:#003B69;
    background:#FFF4DC;
    border-color:#F8DEAB;
    font-size:11px;
    letter-spacing:1.3px;
}
.zp-why-left h2 span{color:#F5A000;}
.zp-why-intro{font-size:15px;line-height:1.8;}
.zp-why-checks li{font-size:14px;line-height:1.55;color:#243746;}
.zp-why-checks li > span{background:#00518A;}
.zp-why-image-badge-icon{background:#F5A000;color:#022B4D;}
.zp-why-image-badge-icon i{color:#022B4D;}
.zp-why-image-badge strong{font-size:14px;}
.zp-why-image-badge div span{font-size:12px;line-height:1.45;}
.zp-why-feature p{font-size:13px;line-height:1.75;}
.zp-why-feature-icon{background:#F0F6FB;border-color:#DCE6EE;color:#00518A;}
.zp-why-feature:nth-of-type(3) .zp-why-feature-icon{background:#FFF4DC;border-color:#F8DEAB;color:#B46C00;}
.zp-why-feature:hover .zp-why-feature-icon{background:#00518A;border-color:#00518A;color:#fff;}
.zp-why-feature:nth-of-type(3):hover .zp-why-feature-icon{background:#F5A000;border-color:#F5A000;color:#022B4D;}
@media(max-width:650px){
    .zp-why-intro{font-size:14px;}
    .zp-why-checks li{font-size:13px;}
    .zp-why-feature p{font-size:13px;}
    .zp-why-image-badge div span{font-size:11px;}
}