:root {
    --primary: #c8104d;
    --secondary: #1e88e5;
    --text: #333;
    --light: #f8f9fa;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family: 'Cairo', sans-serif;
    color: var(--text);
    background:#fff;
}

.container{
    width:100%;
    max-width:1400px;
    margin:auto;
    padding:0 24px;
}

.year-tabs{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:50px;
}

.year-tab{
    border:none;
    cursor:pointer;
    padding:12px 24px;
    border-radius:50px;
    background:#f2f5f8;
    color:var(--primary-color);
    font-weight:700;
    transition:.3s;
}

.year-tab.active{
    background:var(--primary-color);
    color:#fff;
}

.programs-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:25px;
}

.program-card{
    background:#c2185b;
    border-radius:24px;
    padding:35px;
    text-align:center;
    box-shadow:0 15px 35px rgba(0,0,0,.05);
}

.program-card h3{
    margin-bottom:20px;
    font-size:22px;
    color:#fff;
}

.stat-number{
    font-size:42px;
    font-weight:800;
    color:#0d6efd;
    background: #fff;
}

/* services section  */


/* =====================================
   SERVICES MATRIX
===================================== */
.services-section{
    padding:5px 0;
    background:#f7f9fc;
}

.services-header{
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:50px;
}

.section-line{
    width:5px;
    height:42px;
    border-radius:20px;
    background:#E04545;
}

.services-header h2{
    font-size:42px;
    font-weight:800;
    color:#2A62B3;
}

.services-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.service-column{
    background:#fff;
    border:1px solid #e5eefc;
    border-radius:24px;
    padding:24px;
    box-shadow:0 10px 30px rgba(42,98,179,.06);
}

.service-category{
    display:flex;
    align-items:center;
    gap:12px;

    margin-bottom:24px;

    font-size:24px;
    font-weight:800;

    color:#2A62B3;
}

.service-category span{
    width:55px;
    height:55px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:16px;

    background:linear-gradient(
        135deg,
        #2A62B3,
        #4B84D6
    );

    color:#fff;

    font-size:24px;

    box-shadow:
        0 10px 20px rgba(42,98,179,.18);
}

.medical{
    color:#E04545;
}

.social{
    color:#2A62B3;
}

.research{
    color:#64748b;
}

.service-item{
    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:16px 18px;
    margin-bottom:14px;

    border-radius:18px;

    background:#c8104d;

    border:1px solid #dbe7fb;

    text-decoration:none;

    transition:.3s ease;

    box-shadow:
        0 4px 12px rgba(42,98,179,.05);
}

.service-item:last-child{
    margin-bottom:0;
}

.service-item:hover{
    transform:translateY(-4px);

    border-color:#2A62B3;

    box-shadow:
        0 12px 30px rgba(42,98,179,.15);
}

.service-name{
    color:#fff;

    font-weight:700;

    line-height:1.5;

    font-size:17px;
}

.service-count{
    min-width:90px;

    padding:8px 16px;

    border-radius:12px;

    background: #fff;
    color:var(--secondary-color);

    font-weight:800;

    border:1px solid rgba(194,24,91,.15);
}

/* Responsive */

@media(max-width:992px){

    .services-grid{
        grid-template-columns:repeat(2,1fr);
        gap:18px;
    }

    .services-header h2{
        font-size:32px;
    }

    .service-column{
        padding:20px;
    }

}

/* Mobile */

@media(max-width:576px){

    .services-grid{
        grid-template-columns:1fr;
    }

    .services-header{
        margin-bottom:30px;
    }

    .services-header h2{
        font-size:28px;
        line-height:1.2;
    }

    .service-category{
        font-size:20px;
    }

    .service-count{
        min-width:80px;
        height:46px;
        font-size:18px;
    }

}
