/* ==========================================
   BENEFITS
========================================== */

.tpc-benefits{

    padding:20px 0;

}

.tpc-section-title{

    text-align:center;

    max-width:700px;

    margin:auto auto 70px;

}

.tpc-section-title span{

    color:#22C55E;

    font-weight:700;

    font-size:13px;

    letter-spacing:1px;

}

.tpc-section-title h2{

    font-size:46px;

    margin:18px 0;

}

.tpc-section-title p{

    color:#64748B;

    font-size:18px;

}

.tpc-benefits-grid{

    display:grid;

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

    gap:30px;

}

.tpc-benefit{

    background:#fff;

    border-radius:24px;

    padding:35px;

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

    text-align:center;

}

.tpc-icon{

    width:70px;

    height:70px;

    margin:auto auto 25px;

    border-radius:18px;

    background:#ECFDF3;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:32px;

}

.tpc-benefit h3{

    margin-bottom:15px;

}

.tpc-benefit p{

    color:#64748B;

}

/* ==========================================
   BENEFITS - RESPONSIVE
========================================== */

@media (max-width: 1024px) {

    .tpc-benefits-grid{
        grid-template-columns:repeat(2,1fr);
        gap:24px;
    }

    .tpc-section-title h2{
        font-size:38px;
    }

}

@media (max-width: 768px) {

    .tpc-benefits{
        padding:5px 0;
    }

    .tpc-section-title{
        max-width:100%;
        margin:0 auto 40px;
        padding:0 20px;
    }

    .tpc-section-title h2{
        font-size:32px;
        line-height:1.2;
        word-break:break-word;
        overflow-wrap:anywhere;
    }

    .tpc-section-title p{
        font-size:16px;
        line-height:1.6;
    }

    .tpc-benefits-grid{
        grid-template-columns:1fr;
        gap:20px;
        padding:0 20px;
    }

    .tpc-benefit{
        padding:28px 24px;
    }

    .tpc-icon{
        width:60px;
        height:60px;
        font-size:28px;
        margin-bottom:20px;
    }

}

@media (max-width: 480px) {

    .tpc-section-title{
        padding:0 16px;
    }

    .tpc-section-title span{
        font-size:12px;
    }

    .tpc-section-title h2{
        font-size:28px;
        line-height:1.25;
    }

    .tpc-section-title p{
        font-size:15px;
    }

    .tpc-benefits-grid{
        padding:0 16px;
    }

    .tpc-benefit{
        padding:24px 20px;
        border-radius:20px;
    }

}