* {
    padding: 0;
    margin: 0;
}

/* header-section */
.admission-header {
    padding: clamp(40px, 8vw, 80px) clamp(20px, 5vw, 50px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    color: black;
    text-align: center;
}

.admission-header h1 {
    font-size: clamp(36px, 5vw, 50px);
    font-weight: 700;
    line-height: 1.2;
}

.admission-header p {
    font-size: clamp(16px, 3vw, 20px);
    font-weight: 400;
    line-height: 1.5;
    color: #44474D;
    max-width: 800px;
}

/* admission-steps section */
.admission-process {
    padding: clamp(40px, 8vw, 80px) clamp(20px, 5vw, 50px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(30px, 5vw, 45px);
    background-color: #F7F8FA;
}

.admission-process h2{
    font-size: clamp(32px, 5vw, 40px);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}

.admission-process > p {
    font-size: clamp(16px, 3vw, 20px);
    line-height: 1.5;
    color: #44474D;
    text-align: center;
}

.admission-process .steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    width: 100%;
    max-width: 1200px;
}

.admission-process article {
    display: flex;
    flex-direction: column;
    padding: 35px 25px;
    gap: 20px;
    position: relative;
    background-color: #fff;
    border: 1px solid #C4C6CE;
    border-radius: 8px; /* Added slight rounding to match other pages */
}

.admission-process .step-number {
    position: absolute;
    top: -1px;
    left: -1px;
    height: 25px;
    width: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #B71502;
    color: #fff;
    border-top-left-radius: 8px; /* Curve the red box with the card corner */
}

.admission-process article h3 {
    font-size: clamp(20px, 4vw, 25px);
    line-height: 1.2;
    font-weight: 600;
    color: #000615;
}

.admission-process article p {
    font-size: 15px;
    line-height: 20px;
    color: #44474D;
}


/* verification section */
.verification {
    padding: clamp(40px, 8vw, 80px) clamp(20px, 5vw, 50px);
    border-top: 1px solid #C4C6CE;
    border-bottom: 1px solid #C4C6CE;
    display: flex;
    justify-content: center;
    background-color: #0B1F3A;
}

.verification .card-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(20px, 4vw, 40px);
    width: 100%;
    max-width: 1200px;
}

.verification .card-container .card {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: clamp(20px, 4vw, 32px);
    border: 1px solid #C4C6CE;
    background-color: #fff;
    border-radius: 8px;
}

.verification .card-container header {
    display: flex;
    align-items: center;
    gap: 8px;
}

.verification h2 {
    font-size: clamp(24px, 4vw, 32px);
    line-height: 1.2;
    font-weight: 700;
} 

.verification .card-container .card ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: 20px;
}

.verification .card-container .card ul p{
    font-size: 16px;
    line-height: 1.5;
    color: #44474D;
}

.verification .card-container .divider {
    width: 100%;
    height: 1px;
    background-color: #C4C6CE;
}

/* fee-structure section */
.fees {
    padding: clamp(40px, 8vw, 80px) clamp(20px, 5vw, 50px);
    background-color: #F7F8FA;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(30px, 5vw, 40px);
}

.fees header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
}

.fees h2 {
    font-size: clamp(32px, 5vw, 36px);
    line-height: 1.2;
    font-weight: 700;
}

.fees header p {
    font-size: clamp(16px, 3vw, 18px);
    line-height: 1.5;
    color: #44474D;
    max-width: 700px;
}

.table-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(20px, 5vw, 40px);
    width: 100%;
    max-width: 1200px;
}

table {
    border: #000615 1px solid;
    border-collapse: collapse;
    width: 100%;
    background-color: #ffffff;
}

table th, table td {
    border: #000615 1px solid;
    text-align: center;
    padding: clamp(8px, 2vw, 10px);
    font-size: clamp(14px, 2.5vw, 18px);
}

table caption {
    font-size: clamp(18px, 4vw, 22px);
    line-height: 1.2;
    font-weight: 600;
    color: #000615;
    margin-bottom: 20px;
}

/* ==============================================================
   RESPONSIVE MEDIA QUERIES (TABLET & MOBILE) 
============================================================== */

@media (max-width: 1023px) {
    /* Tablet adjustments: Stack 2-column grids into 1 */
    .verification .card-container {
        grid-template-columns: 1fr;
    }

    .table-container {
        grid-template-columns: 1fr; 
    }
}

@media (max-width: 767px) {
    /* Mobile adjustments: Stack 3-column grids into 1 */
    .admission-process .steps {
        grid-template-columns: 1fr;
    }
}