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


.treatments-section {

    padding: 90px 0;

    background: #dceded;

}



.section-header {

    text-align: center;

    max-width: 700px;

    margin: 0 auto 50px;

}



.section-header h2 {

    font-size: 42px;

    font-weight: 700;

    color: #0f172a;

    margin-bottom: 15px;

}



.section-header p {

    font-size: 17px;

    color: #64748b;

}





/* GRID */


.treatments-grid {

    display: grid;

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

    gap: 30px;

}





/* CARD */


.treatment-card {

    background: #f7f4f4;

    padding: 35px 30px;

    border-radius: 22px;

    text-align: center;

    box-shadow:
        0 15px 40px rgba(0, 0, 0, .06);

    transition: .35s ease;

    border: 1px solid transparent;

}





.treatment-card:hover {

    transform: translateY(-10px);

    border-color: #14B8A6;

    box-shadow:
        0 20px 50px rgba(0, 0, 0, .12);

}





/* ICON */


.treatment-icon {

    width: 75px;

    height: 75px;

    margin: 0 auto 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 38px;

    background: #ecfeff;

    border-radius: 50%;

}





.treatment-card h3 {

    font-size: 24px;

    color: #0f172a;

    margin-bottom: 15px;

}





.treatment-card p {

    color: #64748b;

    line-height: 1.7;

    margin-bottom: 25px;

}





/* LINK */


.treatment-link {

    color: #14B8A6;

    font-weight: 600;

    text-decoration: none;

}



.treatment-link:hover {

    color: #0f766e;

}





/* RESPONSIVE */


@media(max-width:991px) {


    .treatments-grid {

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

    }


}



@media(max-width:600px) {


    .treatments-grid {

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

    }


    .section-header h2 {

        font-size: 32px;

    }

    .treatment-card {
        padding: 20px 14px;
    }

    .treatment-icon {
        width: 50px;
        height: 50px;
        font-size: 24px;
        margin-bottom: 12px;
    }

    .treatment-card h3 {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .treatment-card p {
        font-size: 13px;
        line-height: 1.5;
        margin-bottom: 15px;
    }


}