/* =========================

   BUTTONS

========================= */


.btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 170px;
    height: 50px;
    padding: 0 1rem;
    background: #002d52;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 2px;
    border-radius: 4px;
    transition: all 0.3s ease;
    font-size: 16px;
}





.btn-primary:hover {

    background-color: #1e40af;

}



/* =========================

   HERO SECTION

========================= */



.hero {

    background: #f8fafc;

    text-align: center;

    padding: 100px 20px;

}



.hero h1 {

    font-size: 48px;

    font-weight: 800;

}



/* =========================

   COURSE CARD

========================= */



.course-card {

    border: 1px solid #eee;

    border-radius: 12px;

    overflow: hidden;

    transition: 0.3s;

    background: #fff;

}



.course-card:hover {

    transform: translateY(-5px);

    box-shadow: 0 10px 25px rgba(0,0,0,0.08);

}



.course-card img {

    width: 100%;

}



/* =========================

   TESTIMONIAL

========================= */



.testimonial {

    background: #f9f9f9;

    padding: 25px;

    border-radius: 10px;

}



/* =========================

   CTA SECTION

========================= */



.cta {

    background: #2563eb;

    color: #fff;

    text-align: center;

    padding: 80px 20px;

}