
:root{
 --kf-primary:#052047;
 --kf-accent:#e8a838;
 --kf-bg:#f7f9fc;
 --kf-radius:18px;
 --kf-shadow:0 10px 30px rgba(5,32,71,.08);
}
.kf-hero{
background:linear-gradient(135deg,#052047,#18457b);
padding:80px 0 120px;
text-align:center;
color:#fff;
}
.kf-hero h1{font-size:48px;font-weight:700;margin:10px 0}
.kf-hero p{max-width:700px;margin:auto;opacity:.9}
.kf-badge{
display:inline-block;padding:8px 18px;border-radius:40px;
background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2)
}
.kf-leadership{margin-top:-70px}
.kf-card{
background:#fff;border-radius:var(--kf-radius);
box-shadow:var(--kf-shadow);
padding:30px;text-align:center;height:100%;
transition:.3s;
}
.kf-card:hover{transform:translateY(-6px)}
.kf-photo-lg{width:170px;height:170px;border-radius:50%;object-fit:cover;border:5px solid #fff;box-shadow:0 8px 20px rgba(0,0,0,.15)}
.kf-title{color:var(--kf-primary);font-size:28px;font-weight:700;margin-bottom:8px}
.kf-sub{color:var(--kf-accent);font-weight:600}
.kf-section{padding:70px 0}
.kf-section-head{text-align:center;margin-bottom:40px}
.kf-section-head h2{font-size:36px;color:var(--kf-primary)}
.kf-coord-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:25px;
}
.kf-coord-card{
display:flex;align-items:center;gap:18px;
padding:20px;background:#fff;border-radius:16px;
box-shadow:var(--kf-shadow);
transition:.3s;
}
.kf-coord-card:hover{transform:translateY(-4px)}
.kf-photo-sm{width:90px;height:90px;border-radius:50%;object-fit:cover}
.kf-class{color:var(--kf-accent);font-size:13px;font-weight:700;text-transform:uppercase}
.kf-name{font-size:20px;color:var(--kf-primary);font-weight:600}
@media(max-width:991px){
.kf-hero{padding:60px 0 90px}
.kf-hero h1{font-size:38px}
.kf-photo-lg{width:140px;height:140px}
}
@media(max-width:767px){
.kf-hero{padding:50px 15px 80px}
.kf-hero h1{font-size:30px}
.kf-section{padding:45px 0}
.kf-leadership{margin-top:-45px}
.kf-card{padding:22px}
.kf-coord-card{flex-direction:column;text-align:center}
.kf-photo-sm{width:80px;height:80px}
}

/* ===========================================
   PART 2A : CBSE & ACTIVITY COORDINATORS
=========================================== */

.kf-dual-grid{
    display:grid;
    grid-template-columns:350px 1fr;
    gap:30px;
    align-items:stretch;
}

.kf-profile-card{
    background:#fff;
    border-radius:18px;
    padding:30px;
    box-shadow:0 10px 35px rgba(5,32,71,.08);
    text-align:center;
    height:100%;
    transition:.35s;
}

.kf-profile-card:hover{
    transform:translateY(-6px);
}

.kf-profile-card img{
    width:150px;
    height:150px;
    border-radius:50%;
    object-fit:cover;
    border:5px solid #fff;
    box-shadow:0 8px 20px rgba(0,0,0,.15);
    margin-bottom:20px;
}

.kf-role{
    font-size:13px;
    color:#E8A838;
    text-transform:uppercase;
    font-weight:700;
    letter-spacing:1px;
}

.kf-profile-card h3{
    font-size:28px;
    color:#052047;
    margin:8px 0;
    font-weight:700;
}

.kf-activity-card{

    background:#fff;
    border-radius:18px;
    padding:30px;
    box-shadow:0 10px 35px rgba(5,32,71,.08);

}

.kf-activity-title{

    display:flex;
    align-items:center;
    margin-bottom:25px;

}

.kf-activity-icon{

    width:55px;
    height:55px;
    border-radius:15px;
    background:#f7a400;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:24px;
    margin-right:18px;

}

.kf-activity-title h3{

    margin:0;
    color:#052047;
    font-size:30px;
    font-weight:700;

}

.kf-section-box{

    margin-bottom:30px;

}

.kf-section-label{

    display:inline-block;
    background:#052047;
    color:#fff;
    padding:8px 18px;
    border-radius:30px;
    font-size:13px;
    text-transform:uppercase;
    margin-bottom:20px;
    letter-spacing:1px;

}

.kf-activity-grid{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;

}

.kf-member{

    display:flex;
    align-items:center;
    background:#f8f9fc;
    border-radius:15px;
    padding:15px;
    transition:.3s;

}

.kf-member:hover{

    background:#eef3fa;
    transform:translateY(-3px);

}

.kf-member img,
.kf-member .placeholder{

    width:75px;
    height:75px;
    border-radius:50%;
    object-fit:cover;
    margin-right:15px;
    flex-shrink:0;

}

.placeholder{

    display:flex;
    justify-content:center;
    align-items:center;
    background:#ddd;
    color:#888;
    font-size:34px;

}

.kf-member h5{

    margin:0;
    color:#052047;
    font-size:18px;
    font-weight:600;

}

@media(max-width:991px){

.kf-dual-grid{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.kf-profile-card{

padding:20px;

}

.kf-profile-card img{

width:120px;
height:120px;

}

.kf-profile-card h3{

font-size:24px;

}

.kf-activity-title h3{

font-size:24px;

}

.kf-activity-grid{

grid-template-columns:1fr;

}

.kf-member{

padding:12px;

}

.kf-member img,
.kf-member .placeholder{

width:65px;
height:65px;

}

.kf-member h5{

font-size:16px;

}

}
/*=========================================
      SUBJECT HEADS
==========================================*/

.kf-subject-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
gap:25px;
margin-top:40px;
}

.kf-subject-card{

background:#fff;
border-radius:18px;
padding:25px;
text-align:center;
box-shadow:0 10px 35px rgba(5,32,71,.08);
transition:.35s;
height:100%;

}

.kf-subject-card:hover{

transform:translateY(-8px);

}

.kf-subject-photo{

width:110px;
height:110px;
border-radius:50%;
object-fit:cover;
margin:auto;
display:block;
border:5px solid #fff;
box-shadow:0 8px 20px rgba(0,0,0,.15);

}

.kf-subject-badge{

display:inline-block;
margin-top:18px;
padding:7px 18px;
background:#052047;
color:#fff;
font-size:13px;
font-weight:700;
letter-spacing:1px;
text-transform:uppercase;
border-radius:30px;

}

.kf-subject-name{

margin-top:18px;
font-size:24px;
font-weight:700;
color:#052047;

}

.kf-subject-role{

color:#e8a838;
font-size:14px;
font-weight:600;
margin-top:6px;

}

.kf-subject-card.red .kf-subject-badge{
background:#d63031;
}

.kf-subject-card.blue .kf-subject-badge{
background:#0984e3;
}

.kf-subject-card.green .kf-subject-badge{
background:#00b894;
}

.kf-subject-card.orange .kf-subject-badge{
background:#e17055;
}

.kf-subject-card.purple .kf-subject-badge{
background:#6c5ce7;
}

.kf-subject-card.teal .kf-subject-badge{
background:#00cec9;
}

@media(max-width:991px){

.kf-subject-grid{

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

}

}

@media(max-width:767px){

.kf-subject-grid{

grid-template-columns:1fr;

}

.kf-subject-card{

padding:20px;

}

.kf-subject-photo{

width:90px;
height:90px;

}

.kf-subject-name{

font-size:20px;

}

}
/*=========================================
      CLASS COORDINATORS
==========================================*/

.kf-class-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:25px;
margin-top:40px;

}

.kf-class-card{

background:#fff;
border-radius:20px;
padding:25px;
text-align:center;
box-shadow:0 10px 35px rgba(5,32,71,.08);
transition:.35s;
height:100%;

}

.kf-class-card:hover{

transform:translateY(-8px);

}

.kf-class-photo{

width:110px;
height:110px;
border-radius:50%;
object-fit:cover;
margin:auto;
display:block;
border:5px solid #fff;
box-shadow:0 8px 20px rgba(0,0,0,.15);

}

.kf-class-badge{

display:inline-block;
margin-top:18px;
padding:8px 20px;
background:#052047;
color:#fff;
border-radius:30px;
font-size:13px;
font-weight:700;
letter-spacing:1px;
text-transform:uppercase;

}

.kf-class-name{

margin-top:16px;
font-size:22px;
font-weight:700;
color:#052047;

}

.kf-class-role{

margin-top:6px;
color:#e8a838;
font-size:14px;
font-weight:600;

}


/*=========================================
      TIME TABLE
==========================================*/
.col-lg-6,
.col-md-6{
    display:flex;
}

.kf-time-info{
    flex:1;
    min-width:0;
}
.kf-time-card{

display:flex;
    align-items:center;
    gap:18px;
    padding:18px 22px;
    background:#fff;
    border-radius:18px;
    border:1px solid #edf2f7;
    box-shadow:0 10px 35px rgba(5,32,71,.08);
    transition:.35s ease;
    height:100%;
    width:100%;

}

.kf-time-card:hover{
transform:translateY(-6px);
    box-shadow:0 18px 45px rgba(5,32,71,.15);

}

.kf-time-photo{

width:90px;
height:90px;
border-radius:50%;
object-fit:cover;
margin-right:20px;

}

.kf-time-name{
font-size:32px;
    white-space:normal;
    line-height:1.3;
    font-weight:700;
    color:#052047;

}

.kf-time-role{

display:inline-block;
    background:#18b6c9;
    color:#fff;
    font-size:13px;
    padding:5px 14px;
    border-radius:30px;
    margin-bottom:10px;
    font-weight:600;

}


/*=========================
 Responsive
=========================*/

@media(max-width:991px){

.kf-class-grid{

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

}

}

@media(max-width:767px){

.kf-class-grid{

grid-template-columns:1fr;

}

.kf-time-grid{

grid-template-columns:1fr;

}

.kf-time-card{
width:100%;
    min-height:120px;
flex-direction:column;
    text-align:center;
    padding:20px;

}

.kf-time-photo{

margin-right:0;
margin-bottom:15px;
 width:90px;
    height:90px;

}

.kf-class-photo{

width:90px;
height:90px;

}

.kf-class-name{

font-size:22px;

}

.kf-time-name{

font-size:20px;

}

}
/*==================================================
                HOUSE IN-CHARGES
===================================================*/

.kf-house-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:30px;
    margin-top:40px;
}

.kf-house-card{
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 12px 35px rgba(5,32,71,.08);
    transition:.35s;
}

.kf-house-card:hover{
    transform:translateY(-8px);
}

.kf-house-header{
    padding:22px;
    color:#fff;
    text-align:center;
}

.kf-house-header h3{
    margin:0;
    font-size:24px;
    font-weight:700;
}

.kf-house-header p{
    margin:5px 0 0;
    font-size:13px;
    opacity:.9;
}

.kf-house-body{
    padding:22px;
}

.kf-house-member{
    display:flex;
    align-items:center;
    margin-bottom:18px;
}

.kf-house-member:last-child{
    margin-bottom:0;
}

.kf-house-photo{
    width:75px;
    height:75px;
    border-radius:50%;
    object-fit:cover;
    border:3px solid #fff;
    box-shadow:0 6px 18px rgba(0,0,0,.15);
    margin-right:15px;
}

.kf-house-name{
    font-size:18px;
    font-weight:700;
    color:#052047;
}

.kf-house-role{
    color:#888;
    font-size:13px;
}

/* House Colors */

.house-red{
    background:linear-gradient(135deg,#e53935,#b71c1c);
}

.house-blue{
    background:linear-gradient(135deg,#1976d2,#0d47a1);
}

.house-green{
    background:linear-gradient(135deg,#43a047,#1b5e20);
}

.house-purple{
    background:linear-gradient(135deg,#7b1fa2,#4a148c);
}

.house-orange{
    background:linear-gradient(135deg,#ef6c00,#e65100);
}

.house-teal{
    background:linear-gradient(135deg,#009688,#00695c);
}

.house-pink{
    background:linear-gradient(135deg,#d81b60,#880e4f);
}

.house-cyan{
    background:linear-gradient(135deg,#00acc1,#006064);
}

@media(max-width:767px){

.kf-house-grid{
grid-template-columns:1fr;
}

.kf-house-member{
align-items:center;
}

.kf-house-photo{
width:65px;
height:65px;
}

.kf-house-name{
font-size:16px;
}

}
.kf-house-grid{

display:grid;

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

gap:25px;

}

@media(max-width:1200px){

.kf-house-grid{

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

}

}

@media(max-width:992px){

.kf-house-grid{

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

}

}

@media(max-width:768px){

.kf-house-grid{

grid-template-columns:1fr;

}

}
/*=========================================
        OTHER APPOINTMENTS
=========================================*/

.kf-appointment-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:25px;
    margin-top:40px;
}

.kf-appointment-card{
    background:#fff;
    border-radius:18px;
    box-shadow:0 12px 35px rgba(5,32,71,.08);
    padding:22px;
    object-fit:cover;
    display:flex;
    align-items:center;
    transition:.35s;
}

.kf-appointment-card:hover{
    transform:translateY(-6px);
}


.kf-appointment-role{
    color:#e8a838;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:1px;
}

.kf-appointment-name{
    font-size:22px;
    font-weight:700;
    color:#052047;
    margin-top:6px;
}

.kf-appointment-multi{
    margin-top:8px;
}

.kf-appointment-multi div{
    margin-bottom:6px;
    color:#555;
}

@media(max-width:767px){

.kf-appointment-grid{
grid-template-columns:1fr;
}

.kf-appointment-card{
flex-direction:column;
text-align:center;
}

.kf-appointment-photo{
margin-right:0;
margin-bottom:15px;
}

.kf-appointment-name{
font-size:20px;
}

}
/*=========================================
        ADMINISTRATION
=========================================*/

.kf-admin-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:25px;
    margin-top:40px;
}

.kf-admin-card{
    background:#fff;
    border-radius:18px;
    box-shadow:0 12px 35px rgba(5,32,71,.08);
    padding:22px;
    display:flex;
    align-items:center;
    transition:.35s;
}

.kf-admin-card:hover{
    transform:translateY(-6px);
}

.kf-admin-photo{
    width:90px;
    height:90px;
    border-radius:50%;
    object-fit:cover;
    border:4px solid #fff;
    box-shadow:0 8px 18px rgba(0,0,0,.15);
    margin-right:18px;
}

.kf-admin-role{
    color:#e8a838;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:1px;
    font-weight:700;
}

.kf-admin-name{
    margin-top:6px;
    font-size:22px;
    color:#052047;
    font-weight:700;
}

.kf-admin-extra{
    margin-top:8px;
}

.kf-admin-extra div{
    color:#555;
    margin-bottom:5px;
}

@media(max-width:767px){

.kf-admin-grid{

grid-template-columns:1fr;

}

.kf-admin-card{

flex-direction:column;
text-align:center;

}

.kf-admin-photo{

margin-right:0;
margin-bottom:15px;

}

.kf-admin-name{

font-size:20px;

}

}

/* Activity Card */
.kf-activity-card{
    background:#fff;
    border-radius:12px;
    padding:25px;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
}

/* ==========================
   Time Table Incharge
========================== */


.kf-time-table-in-charge-card{
    background:#fff;
    border-radius:15px;
    padding:25px;
    box-shadow:0 8px 25px rgba(0,0,0,0.08);
    margin-bottom:30px;
}

.kf-time-table-in-charge-title{
    display:flex;
    align-items:center;
    gap:15px;
    margin-bottom:25px;
}

.kf-time-table-in-charge-icon{
    width:55px;
    height:55px;
    background:#0d6efd;
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
}

.kf-time-table-in-charge-title h3{
    margin:0;
    font-size:24px;
    font-weight:700;
}

/* 2 Cards in One Row */
.kf-time-table-in-charge-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.kf-time-table-in-charge{
    display:flex;
    align-items:center;
    gap:15px;
    padding:18px;
    border:1px solid #e9e9e9;
    border-radius:12px;
    background:#fafafa;
    transition:0.3s;
}

.kf-time-table-in-charge:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 20px rgba(0,0,0,.08);
}

.kf-time-table-in-charge img{
    width:80px;
    height:80px;
    border-radius:50%;
    object-fit:cover;
    border:3px solid #0d6efd;
}

.kf-time-table-in-charge h5{
    margin:0;
    font-size:18px;
    font-weight:600;
    color:#333;
}

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

    .kf-time-table-in-charge-grid{
        grid-template-columns:repeat(2,1fr);
        gap:15px;
    }

    .kf-time-table-in-charge{
        flex-direction:column;
        text-align:center;
        padding:15px;
    }

    .kf-time-table-in-charge img{
        width:70px;
        height:70px;
    }

    .kf-time-table-in-charge h5{
        font-size:16px;
    }
}

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

    .kf-time-table-in-charge-grid{
        grid-template-columns:1fr;
    }

    .kf-time-table-in-charge{
        flex-direction:row;
        text-align:left;
    }

    .kf-time-table-in-charge img{
        width:60px;
        height:60px;
    }

    .kf-time-table-in-charge h5{
        font-size:15px;
    }

    .kf-time-table-in-charge-title h3{
        font-size:20px;
    }
}
.kf-appointment-photo{
    width:90px;
    height:90px;
    border-radius:50%;
    object-fit:contain;          /* cover ki jagah */
    object-position:center top;  /* face upar rahe */
    background:#fff;
    padding:3px;
    border:4px solid #fff;
    box-shadow:0 8px 18px rgba(0,0,0,.15);
}
.kf-time-table-in-charge img{
    width:80px !important;
    height:80px !important;
    max-width:80px !important;
    min-width:80px !important;
    object-fit:cover !important;
    border-radius:50% !important;
    display:block;
}
/* Wrapper */
.kf-time-table-wrapper{
    background:#fff;
    padding:40px;
    border-radius:18px;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
}

/* Heading */
.kf-time-table-heading{
    display:flex;
    align-items:center;
    gap:15px;
    margin-bottom:30px;
}

.kf-time-table-icon{
    width:55px;
    height:55px;
    border-radius:14px;
    background:linear-gradient(135deg,#0d6efd,#4aa3ff);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:22px;
}

.kf-time-table-heading h3{
    margin:0;
    font-size:28px;
    font-weight:700;
    color:#1d3557;
}

/* Card */
.kf-time-card{
    display:flex;
    align-items:center;
    gap:18px;
    background:#fff;
    border:1px solid #ececec;
    border-radius:18px;
    padding:18px;
    transition:.35s;
    height:100%;
    box-shadow:0 6px 20px rgba(0,0,0,.05);
}

.kf-time-card:hover{
    transform:translateY(-6px);
    box-shadow:0 15px 35px rgba(0,0,0,.12);
}

/* Image */
.kf-time-card img{
    width:50px;
    height:50px;
    border-radius:50%;
    object-fit:cover;
    border:4px solid #0d6efd;
    flex-shrink:0;
}

/* Text */
.kf-time-info span{
    display:inline-block;
    font-size:13px;
    color:#0d6efd;
    background:#eef5ff;
    padding:5px 12px;
    border-radius:30px;
    margin-bottom:8px;
    font-weight:600;
}

.kf-time-info h5{
    margin:0;
    font-size:15px;
    font-weight:700;
    color:#222;
}

/* Responsive */
@media(max-width:768px){

    .kf-time-table-wrapper{
        padding:25px;
    }

    .kf-time-card{
        flex-direction:column;
        text-align:center;
    }

    .kf-time-card img{
        width:80px;
        height:80px;
    }

    .kf-time-info h5{
        font-size:19px;
    }

    .kf-time-table-heading h3{
        font-size:22px;
    }
}
/* Compact Card */
.kf-time-card{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 15px;
    border-radius:12px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
    min-height:80px;
}

/* Smaller Image */
.kf-time-card img{
    width:60px;
    height:60px;
    border-radius:50%;
    object-fit:cover;
    border:2px solid #0d6efd;
    flex-shrink:0;
}

/* Text */
.kf-time-info span{
    font-size:11px;
    padding:3px 8px;
    margin-bottom:4px;
}

.kf-time-info h5{
    font-size:16px;
    margin:0;
    line-height:1.3;
}