/*=========================================================
    PROJECT : Hope & Harmony Spectrum Inc.
    FILE    : why-us.css
    PURPOSE : Why-us Section
=========================================================*/
/*=========================================================
                WHY CHOOSE US
=========================================================*/

.why-us{

    background:var(--white);

}

.why-wrapper{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.why-image{

    height:100%;

}

.why-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    border-radius:30px;

    box-shadow:var(--shadow-lg);

}

.why-features{

    display:grid;

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

    gap:25px 35px;

    margin:40px 0;

}

.why-item{

    display:flex;

    gap:20px;

    align-items:flex-start;

}

.why-icon{

    width:65px;

    height:65px;

    border-radius:18px;

    background:rgba(39,93,169,.10);

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    transition:var(--transition);

}

.why-icon i{

    font-size:1.5rem;

    color:var(--primary-color);

}

.why-item:hover .why-icon{

    background:var(--primary-color);

    transform:translateY(-4px);

}

.why-item:hover .why-icon i{

    color:var(--white);

}

.why-item h3{

    margin-bottom:10px;

}