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

.services-section{

    padding:140px 20px;

    position:relative;

    max-width:1400px;

    width:100%;

    margin:auto;

   
}

.section-header{

    text-align:center;

    max-width:750px;

    margin:0 auto 80px;
}

.section-tag{

    display:inline-block;

    color:#EF443B;

    font-size:14px;

    font-weight:600;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-bottom:15px;
}

.section-header h2{

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

    font-size:56px;

    margin-bottom:20px;
}

.section-header p{

    color:#bdbdbd;

    line-height:1.8;

    font-size:17px;
}

/* GRID */

.services-grid{

    display:grid;

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

    gap:30px;
}

/* CARD */

.service-card{

    position:relative;

    padding:40px;

    border-radius:24px;

    background:
    rgba(255,255,255,.03);

    backdrop-filter:
    blur(18px);

    border:
    1px solid rgba(239,68,59,.08);

    overflow:hidden;

    transition:.45s ease;
}

/* Glow Border */

.service-card::before{

    content:"";

    position:absolute;

    inset:0;

    background:
    linear-gradient(
        135deg,
        rgba(239,68,59,.20),
        transparent,
        transparent
    );

    opacity:0;

    transition:.4s;
}

.service-card:hover::before{

    opacity:1;
}

.service-card:hover{

    transform:
    translateY(-12px);

    border:
    1px solid rgba(239,68,59,.35);

    box-shadow:
    0 0 35px
    rgba(239,68,59,.12);
}

/* ICON */

.service-icon{

    width:75px;

    height:75px;

    border-radius:18px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:
    rgba(239,68,59,.08);

    margin-bottom:25px;

    color:#EF443B;

    font-size:28px;

    transition:.4s;
}

.service-card:hover .service-icon{

    transform:
    rotate(8deg)
    scale(1.1);
}

/* TITLE */

.service-card h3{

    font-family:'Montserrat';

    font-size:24px;

    margin-bottom:18px;

    color:white;
}

/* TEXT */

.service-card p{

    color:#c8c8c8;

    line-height:1.9;

    font-size:15px;
}

.reveal-up{

    opacity:0;

    transform:
    translateY(50px);

    transition:
    .8s ease;
}

/* =====================================
   SERVICES RESPONSIVE
===================================== */


/* Large Laptop */
@media (max-width:1200px){

    .services-section{

        padding:110px 0;
    }


    .services-grid{

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

        gap:25px;
    }


    .service-card{

        padding:35px;
    }


    .service-card h3{

        font-size:22px;
    }

}


/* Tablet */
@media (max-width:900px){

    .section-header{

        margin-bottom:60px;
        padding:0 20px;
    }


    .section-header h2{

        font-size:42px;
    }


    .section-header p{

        font-size:15px;
    }


    .services-grid{

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

        gap:20px;
    }


    .service-card{

        padding:28px;
    }


    .service-icon{

        width:65px;
        height:65px;
        font-size:24px;
    }


}


/* Mobile */
@media (max-width:650px){


    .services-section{

        padding:80px 0;
    }


    .section-header{

        text-align:left;

        margin-bottom:45px;
    }


    .section-header h2{

        font-size:34px;

    }


    .section-header p{

        line-height:1.7;
    }


    .services-grid{

        grid-template-columns:1fr;

        gap:20px;
    }


    .service-card{

        padding:25px;

        border-radius:20px;
    }


    .service-card h3{

        font-size:20px;

    }


    .service-card p{

        font-size:14px;

        line-height:1.8;
    }


    .service-icon{

        width:60px;
        height:60px;

        margin-bottom:20px;

    }

}


/* Small Mobile */
@media (max-width:400px){


    .section-header h2{

        font-size:30px;

    }


    .service-card{

        padding:22px;
    }


}