/* =========================
   HERO
========================= */

.service-hero{
    padding:80px 0 60px;

    background:
    linear-gradient(
        135deg,
        #F0FDFA,
        #FFFFFF
    );
}

.service-label{
    display:inline-block;

    padding:8px 18px;

    border-radius:30px;

    background:
    rgba(14,159,141,.08);

    color:#0E9F8D;

    font-size:12px;
    font-weight:700;

    letter-spacing:1px;

    margin-bottom:18px;
}

.service-hero h1{
    font-size:56px;

    font-weight:800;

    margin-bottom:18px;
}

.service-hero p{
    max-width:800px;

    font-size:18px;

    line-height:1.9;

    color:#6B7280;
}


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

.service-page{
    padding:80px 0;
}

.service-row{
    display:flex;

    align-items:center;

    gap:70px;

    margin-bottom:100px;
}

.service-row.reverse{
    flex-direction:row-reverse;
}


/* IMAGE */
.service-image{
    flex:1;
}

.service-image img{
    width:90%;
    max-height:450px;
    object-fit:cover;

    border-radius:28px;

    box-shadow:
    0 20px 40px rgba(0,0,0,.08);
}


/* CONTENT */
.service-content{
    flex:1;
}

.service-content span{
    display:inline-block;

    color:#0E9F8D;

    font-size:13px;

    font-weight:700;

    letter-spacing:1px;

    margin-bottom:12px;
}

.service-content h2{
    font-size:40px;

    font-weight:800;

    color:#111827;

    margin-bottom:18px;
}

.service-content p{
    font-size:16px;

    line-height:1.9;

    color:#6B7280;
}

.service-content ul{
    margin-top:20px;

    padding-left:20px;
}

.service-content li{
    margin-bottom:10px;

    color:#374151;
}


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

@media(max-width:768px){

    .service-hero{
        padding:50px 0 40px;
    }

    .service-hero h1{
        font-size:34px;
    }

    .service-hero p{
        font-size:15px;
    }

    .service-row,
    .service-row.reverse{
        flex-direction:column;

        gap:24px;

        margin-bottom:60px;
    }

    .service-image img{
        height:240px;
    }

    .service-content h2{
        font-size:28px;
    }

}