/*====================================================
EXECUTIVE MEMBERS
====================================================*/

.executive-members{
    padding:110px 0;
    background:linear-gradient(180deg,#f7fbf8,#ffffff);
}

.executive-members .container{
    max-width:1200px;
    margin:auto;
}


/*====================================================
SECTION HEADING
====================================================*/

.section-heading{
    text-align:center;
    margin-bottom:70px;
}

.section-heading .section-tag{

    display:inline-block;

    padding:8px 20px;

    background:#eaf6ef;

    color:#0B6E3E;

    border-radius:40px;

    font-size:.85rem;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

}

.section-heading h2{

    margin:22px 0 15px;

    font-size:3rem;

    color:#12392C;

    font-weight:800;

}

.section-heading p{

    max-width:760px;

    margin:auto;

    color:#67766F;

    line-height:1.9;

}


/*====================================================
CHAIRMAN SHOWCASE
====================================================*/

.chairman-showcase{

    display:grid;

    grid-template-columns:360px 1fr;

    gap:70px;

    align-items:center;

    background:linear-gradient(135deg,#0B6E3E,#157848);

    border-radius:35px;

    padding:55px;

    color:#fff;

    margin-bottom:90px;

    box-shadow:0 35px 80px rgba(11,110,62,.18);

}

.chairman-image{

    display:flex;

    justify-content:center;

}

.chairman-image img{

    width:280px;

    height:280px;

    border-radius:50%;

    object-fit:cover;

    border:8px solid rgba(255,255,255,.18);

    box-shadow:0 15px 45px rgba(0,0,0,.25);

}

.office-label{

    display:inline-block;

    padding:10px 22px;

    background:#D9B54A;

    color:#14342B;

    border-radius:30px;

    font-weight:700;

    margin-bottom:18px;

}

.chairman-details h2{

    font-size:2.8rem;

    line-height:1.2;

    margin-bottom:20px;

}

.chairman-details p{

    color:#E6F5EC;

    line-height:2;

    max-width:700px;

}

.chairman-highlights{

    display:grid;

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

    gap:18px;

    margin-top:35px;

}

.chairman-highlights div{

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

    padding:18px;

    border-radius:16px;

    backdrop-filter:blur(6px);

    font-weight:600;

}

.chairman-highlights i{

    color:#FFD86A;

    margin-right:10px;

}


/*====================================================
SECTION TITLE
====================================================*/

.section-subtitle{

    text-align:center;

    margin:90px 0 40px;

    font-size:2rem;

    color:#12392C;

    font-weight:800;

}
/*====================================================
PRINCIPAL OFFICERS
====================================================*/

.principal-grid{

    display:grid;

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

    gap:30px;

    margin-bottom:90px;

}

.principal-card{

    background:#fff;

    border-radius:24px;

    padding:35px 25px;

    text-align:center;

    border:1px solid rgba(11,110,62,.08);

    box-shadow:0 18px 45px rgba(0,0,0,.06);

    transition:.35s;

}

.principal-card:hover{

    transform:translateY(-10px);

    box-shadow:0 28px 60px rgba(0,0,0,.12);

}

.principal-card img{

    width:130px;

    height:130px;

    border-radius:50%;

    object-fit:cover;

    border:5px solid #D9B54A;

    margin-bottom:20px;

}

.principal-card h4{

    color:#14342B;

    font-size:1.18rem;

    line-height:1.45;

    margin-bottom:12px;

}

.principal-card span{

    display:inline-block;

    background:#0B6E3E;

    color:#fff;

    padding:9px 18px;

    border-radius:30px;

    font-size:.82rem;

    font-weight:700;

}



/*====================================================
EXECUTIVE COMMITTEE
====================================================*/

.committee-grid{

    display:grid;

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

    gap:18px;

}

.committee-member{

    display:flex;

    align-items:center;

    gap:18px;

    background:#fff;

    padding:18px 22px;

    border-radius:18px;

    border-left:5px solid #0B6E3E;

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

    transition:.3s;

}

.committee-member:hover{

    transform:translateX(8px);

    border-left-color:#D9B54A;

    box-shadow:0 20px 45px rgba(0,0,0,.10);

}

.committee-member img{

    width:72px;

    height:72px;

    border-radius:50%;

    object-fit:cover;

    border:3px solid #D9B54A;

    flex-shrink:0;

}

.committee-member h4{

    margin:0 0 6px;

    color:#14342B;

    font-size:1rem;

    line-height:1.4;

}

.committee-member span{

    display:inline-block;

    color:#0B6E3E;

    font-weight:700;

    font-size:.9rem;

}



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

@media(max-width:991px){

.chairman-showcase{

grid-template-columns:1fr;

text-align:center;

padding:40px;

}

.chairman-image{

margin-bottom:20px;

}

.chairman-highlights{

grid-template-columns:1fr;

}

.principal-grid{

grid-template-columns:1fr;

}

.committee-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.section-heading h2{

font-size:2.2rem;

}

.chairman-details h2{

font-size:2rem;

}

.chairman-image img{

width:220px;

height:220px;

}

}
/*==============================
FINAL POLISH
==============================*/

/* Chairman */

.chairman-showcase{

    background:linear-gradient(135deg,#0B6E3E,#0E7A45);

    overflow:hidden;

}

.chairman-details h2{

    color:#ffffff !important;

    font-size:3.2rem;

    font-weight:800;

}

.chairman-details p{

    font-size:1.08rem;

}

.chairman-image img{

    width:320px;

    height:320px;

    border:8px solid rgba(255,255,255,.18);

    box-shadow:0 35px 60px rgba(0,0,0,.25);

}

/* Remove pale square */

.chairman-image{

    background:none !important;

}

/* Principal */

.principal-card{

    padding:25px;

}

.principal-card img{

    width:150px;

    height:150px;

}

.principal-card h4{

    min-height:58px;

    display:flex;

    align-items:center;

    justify-content:center;

}

.principal-card:hover{

    transform:translateY(-12px) scale(1.02);

}

/* Committee */

.committee-member{

    padding:22px;

}

.committee-member img{

    width:82px;

    height:82px;

}

.committee-member h4{

    font-size:1.05rem;

}

.committee-member span{

    font-size:.95rem;

}

/* Better hover */

.committee-member:hover{

    background:#f7fcf8;

}

/*==================================================
OUR COMMITMENT
==================================================*/

.leadership-message{

    padding:100px 0;

    background:#f8fbf9;

}

.leadership-wrapper{

    display:grid;

    grid-template-columns:2fr 1fr;

    gap:60px;

    align-items:center;

}

.leadership-content .section-tag{

    display:inline-block;

    background:#EAF6EF;

    color:#0B6E3E;

    padding:8px 18px;

    border-radius:30px;

    font-size:.8rem;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    margin-bottom:18px;

}

.leadership-content h2{

    font-size:3rem;

    line-height:1.2;

    color:#14342B;

    margin:20px 0;

}

.leadership-content p{

    color:#66756D;

    line-height:1.9;

    font-size:1.05rem;

    margin-bottom:35px;

}

/*=========================
COMMITMENT GRID
=========================*/

.commitment-grid{

    display:grid;

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

    gap:20px;

}

.commitment-item{

    display:flex;

    align-items:center;

    gap:15px;

    background:#fff;

    padding:20px;

    border-radius:18px;

    box-shadow:0 10px 30px rgba(0,0,0,.06);

    transition:.35s;

}

.commitment-item:hover{

    transform:translateY(-6px);

}

.commitment-item i{

    width:55px;

    height:55px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#0B6E3E;

    color:#fff;

    font-size:1.2rem;

}

.commitment-item span{

    color:#14342B;

    font-weight:700;

}

/*=========================
BADGE
=========================*/

.leadership-badge{

    background:#fff;

    border-radius:28px;

    padding:50px 35px;

    text-align:center;

    box-shadow:0 20px 55px rgba(0,0,0,.08);

    border:2px solid rgba(217,181,74,.35);

}

.badge-icon{

    width:90px;

    height:90px;

    margin:0 auto 25px;

    border-radius:50%;

    background:#0B6E3E;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:2rem;

}

.leadership-badge h3{

    color:#14342B;

    margin-bottom:15px;

    font-size:2rem;

}

.leadership-badge p{

    color:#66756D;

    line-height:1.8;

}

.badge-divider{

    width:90px;

    height:4px;

    background:#D9B54A;

    margin:25px auto;

    border-radius:20px;

}

.leadership-badge small{

    color:#0B6E3E;

    font-weight:700;

    text-transform:uppercase;

}

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

@media(max-width:991px){

.leadership-wrapper{

grid-template-columns:1fr;

}

.commitment-grid{

grid-template-columns:1fr;

}

}
/*====================================================
PREMIUM INTERACTIONS & ANIMATIONS
====================================================*/

/* Smooth transitions */

.chairman-showcase,
.principal-card,
.committee-member,
.commitment-item,
.leadership-badge,
.chairman-image img,
.principal-card img,
.committee-member img{

    transition:all .45s ease;

}

/*=========================================
CHAIRMAN
=========================================*/

.chairman-showcase{

    position:relative;

    overflow:hidden;

}

.chairman-showcase:hover{

    transform:translateY(-8px);

    box-shadow:0 40px 90px rgba(11,110,62,.25);

}

/* Animated light sweep */

.chairman-showcase::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:50%;

    height:100%;

    background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.18),
    transparent);

    transition:1s;

}

.chairman-showcase:hover::before{

    left:150%;

}

/* Chairman photo */

.chairman-showcase:hover .chairman-image img{

    transform:scale(1.06) rotate(-2deg);

}

/*=========================================
PRINCIPAL CARDS
=========================================*/

.principal-card{

    position:relative;

    overflow:hidden;

}

.principal-card:hover{

    transform:translateY(-14px);

    box-shadow:0 35px 70px rgba(0,0,0,.14);

}

/* Shine */

.principal-card::before{

    content:"";

    position:absolute;

    top:0;

    left:-150%;

    width:70%;

    height:100%;

    background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.45),
    transparent);

    transition:.9s;

}

.principal-card:hover::before{

    left:170%;

}

/* Image */

.principal-card:hover img{

    transform:scale(1.12);

}

/* Name */

.principal-card:hover h4{

    color:#0B6E3E;

}

/*=========================================
COMMITTEE MEMBERS
=========================================*/

.committee-member{

    position:relative;

    overflow:hidden;

}

.committee-member:hover{

    transform:translateX(12px);

    border-left-color:#D9B54A;

    box-shadow:0 20px 45px rgba(0,0,0,.10);

    background:#FCFFFD;

}

/* Shine */

.committee-member::before{

    content:"";

    position:absolute;

    top:0;

    left:-150%;

    width:60%;

    height:100%;

    background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.50),
    transparent);

    transition:.8s;

}

.committee-member:hover::before{

    left:170%;

}

/* Photo */

.committee-member:hover img{

    transform:scale(1.12);

}

/* Text */

.committee-member:hover h4{

    color:#0B6E3E;

}

/*=========================================
COMMITMENT CARDS
=========================================*/

.commitment-item:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 40px rgba(0,0,0,.08);

}

.commitment-item:hover i{

    transform:rotate(12deg) scale(1.08);

}

/*=========================================
BADGE
=========================================*/

.leadership-badge:hover{

    transform:translateY(-10px);

    box-shadow:0 35px 65px rgba(0,0,0,.12);

}

.leadership-badge:hover .badge-icon{

    transform:rotate(360deg);

}

.badge-icon{

    transition:1s;

}

/*=========================================
SECTION TITLES
=========================================*/

.section-subtitle{

    position:relative;

    display:inline-block;

    left:50%;

    transform:translateX(-50%);

}

.section-subtitle::after{

    content:"";

    position:absolute;

    bottom:-10px;

    left:50%;

    transform:translateX(-50%);

    width:0;

    height:4px;

    background:#D9B54A;

    border-radius:20px;

    transition:.35s;

}

.section-subtitle:hover::after{

    width:90%;

}

/*=========================================
BUTTONS
=========================================*/

.office-label{

    transition:.35s;

}

.office-label:hover{

    transform:scale(1.08);

    box-shadow:0 10px 25px rgba(217,181,74,.35);

}

/*=========================================
ICONS
=========================================*/

.commitment-item i,
.chairman-highlights i{

    transition:.35s;

}

.commitment-item:hover i,
.chairman-highlights div:hover i{

    transform:scale(1.2);

}

/*=========================================
LINKS
=========================================*/

.principal-card,
.committee-member{

    cursor:pointer;

}
/*==================================================
PREMIUM FINAL POLISH
==================================================*/

/* ===== Executive Background ===== */

.executive-members{
    position:relative;
    overflow:hidden;
}

.executive-members::before{
    content:"";
    position:absolute;
    width:700px;
    height:700px;
    background:radial-gradient(circle,
    rgba(11,110,62,.05),
    transparent 72%);
    top:-260px;
    right:-260px;
    border-radius:50%;
}

.executive-members::after{
    content:"";
    position:absolute;
    width:450px;
    height:450px;
    background:radial-gradient(circle,
    rgba(217,181,74,.08),
    transparent 72%);
    bottom:-180px;
    left:-120px;
    border-radius:50%;
}

.executive-members .container{
    position:relative;
    z-index:2;
}


/*==================================================
SECTION TITLE
==================================================*/

.section-heading h2{

    position:relative;

    display:inline-block;

    padding-bottom:18px;

}

.section-heading h2::after{

    content:"";

    position:absolute;

    width:90px;

    height:4px;

    border-radius:20px;

    left:50%;

    bottom:0;

    transform:translateX(-50%);

    background:linear-gradient(90deg,#0B6E3E,#D9B54A);

}



/*==================================================
CHAIRMAN CARD
==================================================*/

.chairman-showcase{

    position:relative;

    overflow:hidden;

}

.chairman-showcase::before{

    content:"";

    position:absolute;

    width:550px;

    height:550px;

    border-radius:50%;

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

    right:-180px;

    top:-180px;

}

.chairman-showcase::after{

    content:"";

    position:absolute;

    width:180px;

    height:6px;

    background:#D9B54A;

    left:55px;

    bottom:45px;

    border-radius:20px;

}


/* Gold ribbon */

.office-label{

    box-shadow:0 10px 25px rgba(217,181,74,.35);

}


/* Chairman photo */

.chairman-image img{

    transition:.45s;

}

.chairman-showcase:hover .chairman-image img{

    transform:scale(1.06) rotate(-1deg);

}


/*==================================================
HIGHLIGHT BOXES
==================================================*/

.chairman-highlights div{

    transition:.35s;

}

.chairman-highlights div:hover{

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

    transform:translateY(-6px);

}



/*==================================================
PRINCIPAL OFFICERS
==================================================*/

.principal-card{

    position:relative;

    overflow:hidden;

}

.principal-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:5px;

    background:linear-gradient(90deg,#0B6E3E,#D9B54A);

}

.principal-card:hover img{

    transform:scale(1.08);

}

.principal-card img{

    transition:.4s;

}



/*==================================================
COMMITTEE DIRECTORY
==================================================*/

.committee-member:nth-child(even){

    border-left:5px solid #D9B54A;

}

.committee-member:nth-child(odd){

    border-left:5px solid #0B6E3E;

}

.committee-member{

    position:relative;

}

.committee-member::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:0;

    height:3px;

    background:#D9B54A;

    transition:.4s;

}

.committee-member:hover::after{

    width:100%;

}

.committee-member:hover img{

    transform:scale(1.1);

}

.committee-member img{

    transition:.4s;

}



/*==================================================
SUB TITLES
==================================================*/

.section-subtitle{

    position:relative;

    display:inline-block;

    left:50%;

    transform:translateX(-50%);

    padding:0 35px;

}

.section-subtitle::before,

.section-subtitle::after{

    content:"";

    position:absolute;

    top:50%;

    width:70px;

    height:2px;

    background:#0B6E3E;

}

.section-subtitle::before{

    right:100%;

}

.section-subtitle::after{

    left:100%;

}



/*==================================================
CARD SHADOWS
==================================================*/

.principal-card,

.committee-member{

    box-shadow:
    0 10px 30px rgba(0,0,0,.05);

}

.principal-card:hover,

.committee-member:hover{

    box-shadow:
    0 25px 55px rgba(0,0,0,.12);

}



/*==================================================
SMOOTH FADE
==================================================*/

.chairman-showcase,
.principal-card,
.committee-member{

    animation:fadeUp .8s ease both;

}

@keyframes fadeUp{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:translateY(0);

}

}



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

@media(max-width:768px){

.chairman-showcase{

padding:35px;

}

.chairman-details h2{

font-size:2.3rem;

}

.section-heading h2{

font-size:2.2rem;

}

.principal-card{

padding:25px;

}

.committee-member{

padding:18px;

}

}
/*==================================================
EXECUTIVE PAGE MOBILE RESPONSIVE
==================================================*/

@media (max-width: 992px){

/* Section */

.executive-members{

    padding:70px 0;

}

.section-heading{

    margin-bottom:45px;

    padding:0 18px;

}

.section-heading h2{

    font-size:2.2rem;

    line-height:1.2;

}

.section-heading p{

    font-size:.95rem;

    line-height:1.8;

}


/*==================================
CHAIRMAN
==================================*/

.chairman-showcase{

    grid-template-columns:1fr;

    gap:35px;

    padding:35px 28px;

    text-align:center;

    border-radius:25px;

}

.chairman-image{

    display:flex;

    justify-content:center;

}

.chairman-image img{

    width:220px;

    height:220px;

}

.chairman-details{

    text-align:center;

}

.chairman-details h2{

    font-size:2rem;

    line-height:1.25;

}

.chairman-details p{

    margin:18px auto;

}

.office-label{

    margin:auto auto 18px;

}

.chairman-highlights{

    grid-template-columns:1fr;

    gap:15px;

}


/*==================================
PRINCIPAL OFFICERS
==================================*/

.principal-grid{

    grid-template-columns:1fr;

    gap:25px;

}

.principal-card{

    padding:28px;

}

.principal-card img{

    width:120px;

    height:120px;

}

.principal-card h4{

    font-size:1.1rem;

}


/*==================================
COMMITTEE
==================================*/

.committee-grid{

    grid-template-columns:1fr;

    gap:16px;

}

.committee-member{

    padding:16px;

    gap:15px;

}

.committee-member img{

    width:65px;

    height:65px;

}

.committee-member h4{

    font-size:.95rem;

    line-height:1.4;

}

.committee-member span{

    font-size:.82rem;

}


/*==================================
SUBTITLE
==================================*/

.section-subtitle{

    font-size:1.6rem;

    margin:65px 0 30px;

}

.section-subtitle::before,

.section-subtitle::after{

    display:none;

}

}



/*==================================================
SMALL PHONES
==================================================*/

@media (max-width:576px){

.executive-members{

    padding:50px 0;

}

.section-heading h2{

    font-size:1.8rem;

}

.section-heading p{

    font-size:.9rem;

}

.chairman-showcase{

    padding:25px 20px;

}

.chairman-image img{

    width:180px;

    height:180px;

}

.chairman-details h2{

    font-size:1.65rem;

}

.office-label{

    font-size:.8rem;

    padding:8px 18px;

}

.chairman-highlights div{

    font-size:.88rem;

    padding:14px;

}

.principal-card{

    padding:22px;

}

.principal-card img{

    width:100px;

    height:100px;

}

.committee-member{

    align-items:center;

}

.committee-member img{

    width:58px;

    height:58px;

}

.committee-member h4{

    font-size:.88rem;

}

.committee-member span{

    font-size:.78rem;

}

}
/*==================================================
ELITE EXECUTIVE SPOTLIGHT EFFECT
==================================================*/

/* Allow cards to expand outside the grid */
.principal-grid,
.committee-grid{
    overflow:visible;
    position:relative;
}

/* Base card animation */
.principal-card,
.committee-member{

    position:relative;
    z-index:1;

    transform-origin:center center;

    transition:
        transform .55s cubic-bezier(.22,.61,.36,1),
        box-shadow .55s ease,
        filter .55s ease,
        opacity .55s ease,
        background .55s ease,
        border-color .55s ease;

}

/* Image animation */

.principal-card img,
.committee-member img{

    transition:
        transform .55s ease,
        box-shadow .55s ease;

}


/*-------------------------------------------------
DIM EVERY OTHER CARD
-------------------------------------------------*/

.principal-grid:hover .principal-card:not(:hover){

    transform:scale(.82);

    opacity:.22;

    filter:blur(2px);

}

.committee-grid:hover .committee-member:not(:hover){

    transform:scale(.82);

    opacity:.22;

    filter:blur(2px);

}


/*-------------------------------------------------
THE STAR OF THE SHOW
-------------------------------------------------*/

.principal-card:hover{

    transform:
        translateY(-18px)
        scale(1.38);

    z-index:99999;

    background:#fff;

    border-color:#D9B54A;

    box-shadow:
        0 45px 120px rgba(0,0,0,.35),
        0 0 50px rgba(11,110,62,.20);

}

.committee-member:hover{

    transform:
        translateY(-12px)
        scale(1.35);

    z-index:99999;

    background:#fff;

    border-left:6px solid #D9B54A;

    box-shadow:
        0 35px 100px rgba(0,0,0,.30),
        0 0 45px rgba(11,110,62,.18);

}


/*-------------------------------------------------
MAKE PHOTO POP
-------------------------------------------------*/

.principal-card:hover img{

    transform:scale(1.28);

    box-shadow:
        0 18px 40px rgba(0,0,0,.25);

}

.committee-member:hover img{

    transform:scale(1.35);

    box-shadow:
        0 12px 30px rgba(0,0,0,.20);

}


/*-------------------------------------------------
TEXT ANIMATION
-------------------------------------------------*/

.principal-card:hover h4,
.committee-member:hover h4{

    color:#0B6E3E;

    transform:translateY(-2px);

    transition:.4s;

}

.principal-card:hover span,
.committee-member:hover span{

    color:#D9B54A;

    font-weight:700;

    letter-spacing:.5px;

}


/*-------------------------------------------------
GREEN GLOW
-------------------------------------------------*/

.principal-card::after,
.committee-member::after{

    content:"";

    position:absolute;

    inset:0;

    border-radius:inherit;

    pointer-events:none;

    opacity:0;

    transition:.5s;

    box-shadow:
        inset 0 0 0 2px rgba(11,110,62,.35),
        0 0 35px rgba(11,110,62,.15);

}

.principal-card:hover::after,
.committee-member:hover::after{

    opacity:1;

}


/*-------------------------------------------------
CURSOR
-------------------------------------------------*/

.principal-card,
.committee-member{

    cursor:pointer;

}


/*-------------------------------------------------
DISABLE HUGE ZOOM ON MOBILE
-------------------------------------------------*/

@media(max-width:768px){

.principal-grid:hover .principal-card:not(:hover),
.committee-grid:hover .committee-member:not(:hover){

    transform:none;
    opacity:1;
    filter:none;

}

.principal-card:hover,
.committee-member:hover{

    transform:translateY(-6px) scale(1.04);

}

}
/*==================================================
FINAL EXECUTIVE DESIGN OVERRIDE
Paste this at the VERY BOTTOM of executives.css
==================================================*/


/*==================================================
PRINCIPAL OFFICERS
==================================================*/

.principal-card{

    background:linear-gradient(135deg,#0B6E3E,#16915A) !important;

    color:#fff;

    border:none;

    border-radius:22px;

    padding:35px;

    box-shadow:
        0 20px 45px rgba(11,110,62,.25);

}

.principal-card h4{

    color:#fff !important;

    font-size:1.3rem;

    margin-top:20px;

}

.principal-card span{

    color:#F2D16B !important;

    font-weight:600;

}

.principal-card img{

    width:170px;

    height:170px;

    object-fit:cover;

    border-radius:50%;

    border:5px solid rgba(255,255,255,.30);

    box-shadow:0 15px 30px rgba(0,0,0,.20);

}



/*==================================================
EXECUTIVE COMMITTEE
==================================================*/

.committee-member{

    background:linear-gradient(135deg,#148653,#0B6E3E) !important;

    color:#fff;

    border:none !important;

    border-radius:18px;

    padding:22px;

    min-height:130px;

    gap:20px;

    align-items:center;

    box-shadow:
        0 15px 35px rgba(11,110,62,.20);

}

.committee-member h4{

    color:#fff !important;

    font-size:1.05rem;

    line-height:1.4;

}

.committee-member span{

    color:#F2D16B !important;

    font-size:.9rem;

    font-weight:600;

}

.committee-member img{

    width:90px;

    height:90px;

    object-fit:cover;

    border-radius:50%;

    border:4px solid rgba(255,255,255,.35);

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

}



/*==================================================
HOVER EFFECT
==================================================*/

.principal-card:hover{

    background:linear-gradient(135deg,#18A05F,#0B6E3E) !important;

    transform:translateY(-15px) scale(1.12);

    box-shadow:
        0 35px 80px rgba(11,110,62,.45);

}

.committee-member:hover{

    background:linear-gradient(135deg,#18A05F,#0B6E3E) !important;

    transform:translateY(-10px) scale(1.10);

    box-shadow:
        0 30px 70px rgba(11,110,62,.40);

}

.principal-card:hover img,
.committee-member:hover img{

    transform:scale(1.15);

}



/*==================================================
MOBILE
==================================================*/

@media(max-width:768px){

.principal-card{

    padding:28px;

}

.principal-card img{

    width:150px;

    height:150px;

}

.committee-grid{

    gap:20px;

}

.committee-member{

    padding:20px;

    min-height:120px;

}

.committee-member img{

    width:80px;

    height:80px;

}

.committee-member h4{

    font-size:1rem;

}

.committee-member span{

    font-size:.88rem;

}

}



/*==================================================
SMALL PHONES
==================================================*/

@media(max-width:480px){

.principal-card{

    padding:24px;

}

.principal-card img{

    width:130px;

    height:130px;

}

.committee-member{

    padding:18px;

    gap:16px;

}

.committee-member img{

    width:75px;

    height:75px;

}

.committee-member h4{

    font-size:.95rem;

}

.committee-member span{

    font-size:.82rem;

}

}
/*==================================================
LEADERSHIP HIERARCHY COLORS
==================================================*/


/*=====================================
CHAIRMAN
(Dark Emerald)
=====================================*/

.chairman-showcase{

    background:linear-gradient(135deg,#065B32,#0B6E3E) !important;

}



/*=====================================
PRINCIPAL OFFICERS
(Rich Green)
=====================================*/

.principal-card{

    background:linear-gradient(135deg,#0E7A45,#16915A) !important;

    border:1px solid rgba(255,255,255,.15);

}

.principal-card:hover{

    background:linear-gradient(135deg,#0B6E3E,#1AA363) !important;

}



/*=====================================
EXECUTIVE COMMITTEE
(Mint Green)
=====================================*/

.committee-member{

    background:linear-gradient(135deg,#25B876,#1FA76A) !important;

    border:1px solid rgba(255,255,255,.18);

}

.committee-member:hover{

    background:linear-gradient(135deg,#18A05F,#148653) !important;

}



/*=====================================
TEXT
=====================================*/

.principal-card h4,
.committee-member h4{

    color:#fff !important;

}

.principal-card span,
.committee-member span{

    color:#FFE28A !important;

}



/*=====================================
PHOTOS
=====================================*/

.principal-card img,
.committee-member img{

    border:4px solid rgba(255,255,255,.35);

}



/*=====================================
GOLD GLOW
=====================================*/

.principal-card:hover,
.committee-member:hover{

    box-shadow:
        0 0 0 2px rgba(255,226,138,.35),
        0 30px 80px rgba(11,110,62,.35);

}



/*=====================================
SUBTLE GRADIENT OVERLAY
=====================================*/

.principal-card::before,
.committee-member::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:100%;

    background:linear-gradient(
        rgba(255,255,255,.08),
        transparent 40%
    );

    border-radius:inherit;

    pointer-events:none;

}
/*==================================================
EXECUTIVE COMMITTEE - CHAIRMAN STYLE
==================================================*/

.committee-member{

    background:linear-gradient(135deg,#065B32,#0B6E3E) !important;

    color:#ffffff !important;

    border:none !important;

    border-radius:18px;

    box-shadow:
        0 18px 40px rgba(11,110,62,.30);

}

.committee-member h4{

    color:#ffffff !important;

    font-weight:700;

}

.committee-member span{

    color:#F2D16B !important;

    font-weight:600;

}

.committee-member img{

    border:4px solid rgba(255,255,255,.35);

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

}


/* Premium hover */

.committee-member:hover{

    background:linear-gradient(135deg,#087541,#0B6E3E) !important;

    transform:translateY(-12px) scale(1.10);

    box-shadow:
        0 35px 90px rgba(11,110,62,.45);

}

.committee-member:hover h4{

    color:#ffffff !important;

}

.committee-member:hover span{

    color:#FFE28A !important;

}
/*==================================================
LARGER EXECUTIVE COMMITTEE CARDS
==================================================*/

.committee-member{

    display:flex;

    align-items:center;

    gap:25px;

    padding:18px 22px;

    min-height:150px;

    border-radius:20px;

}

/* Bigger photo */

.committee-member img{

    width:110px !important;

    height:110px !important;

    min-width:110px;

    object-fit:cover;

    border-radius:50%;

    border:5px solid rgba(255,255,255,.35);

    box-shadow:
        0 12px 30px rgba(0,0,0,.25);

}

/* Shorter text section */

.committee-member div{

    flex:1;

}

.committee-member h4{

    font-size:1.15rem;

    margin-bottom:8px;

    line-height:1.3;

}

.committee-member span{

    font-size:.95rem;

    display:block;

}
/*==================================================
FINAL EXECUTIVE COMMITTEE OVERRIDE
==================================================*/

/* Grid */
.committee-grid{
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:28px;
    margin-top:40px;
}

/* Card */
.committee-member{

    display:flex !important;
    align-items:center;
    gap:22px;

    background:linear-gradient(135deg,#065B32,#0B6E3E) !important;

    border:none !important;

    border-radius:22px;

    padding:22px 25px;

    min-height:165px;

    overflow:hidden;

    transition:.45s ease;

    box-shadow:
        0 20px 45px rgba(11,110,62,.25);

}

/* Bigger photo */
.committee-member img{

    width:125px !important;
    height:125px !important;

    min-width:125px;

    object-fit:cover;

    border-radius:50%;

    border:5px solid rgba(255,255,255,.35);

    box-shadow:
        0 15px 35px rgba(0,0,0,.25);

    transition:.45s;

}

/* Text */

.committee-member div{

    flex:1;

}

.committee-member h4{

    color:#fff !important;

    font-size:1.15rem;

    line-height:1.35;

    margin-bottom:8px;

}

.committee-member span{

    color:#FFE28A !important;

    font-size:.95rem;

    font-weight:600;

}


/* Hover */

.committee-member:hover{

    transform:
        translateY(-12px)
        scale(1.08);

    background:linear-gradient(135deg,#087541,#0B6E3E);

    box-shadow:
        0 35px 90px rgba(11,110,62,.45);

}

.committee-member:hover img{

    transform:scale(1.12);

}


/*==================================================
TABLETS
==================================================*/

@media(max-width:991px){

.committee-grid{

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

}

.committee-member{

    min-height:155px;

}

.committee-member img{

    width:110px !important;
    height:110px !important;
    min-width:110px;

}

}


/*==================================================
MOBILE
==================================================*/

@media(max-width:768px){

.committee-grid{

    grid-template-columns:1fr;

    gap:22px;

}

.committee-member{

    padding:20px;

    min-height:145px;

    gap:18px;

}

.committee-member img{

    width:95px !important;
    height:95px !important;
    min-width:95px;

}

.committee-member h4{

    font-size:1rem;

}

.committee-member span{

    font-size:.88rem;

}

}
/*==================================================
FINAL EXECUTIVE COMMITTEE PHOTO UPGRADE
==================================================*/

/* Bigger Committee Cards */
.committee-member{

    min-height:180px !important;

    padding:25px 28px !important;

    gap:28px !important;

    border-radius:22px;

}

/* SAME PHOTO SIZE AS PRINCIPAL OFFICERS */
.committee-member img{

    width:170px !important;

    height:170px !important;

    min-width:170px !important;

    object-fit:cover;

    border-radius:50%;

    border:5px solid rgba(255,255,255,.35);

    box-shadow:
        0 15px 35px rgba(0,0,0,.25);

    transition:.45s;

}

/* Text section */

.committee-member div{

    flex:1;

}

.committee-member h4{

    font-size:1.25rem !important;

    line-height:1.4;

    margin-bottom:10px;

}

.committee-member span{

    font-size:1rem !important;

    font-weight:600;

}

/* Hover */

.committee-member:hover{

    transform:translateY(-10px) scale(1.05);

}

.committee-member:hover img{

    transform:scale(1.08);

}


/*==================================================
TABLETS
==================================================*/

@media(max-width:991px){

.committee-member{

    min-height:170px !important;

}

.committee-member img{

    width:145px !important;

    height:145px !important;

    min-width:145px !important;

}

}


/*==================================================
MOBILE
==================================================*/

@media(max-width:768px){

.committee-member{

    min-height:160px !important;

    padding:22px !important;

}

.committee-member img{

    width:120px !important;

    height:120px !important;

    min-width:120px !important;

}

.committee-member h4{

    font-size:1.08rem !important;

}

.committee-member span{

    font-size:.92rem !important;

}

}
/*==================================================
FIX CHAIRMAN GOLD LINE ON MOBILE
==================================================*/

@media (max-width:768px){

.chairman-showcase::after{

    width:100px;
    left:50%;
    transform:translateX(-50%);
    bottom:22px;

}

}

@media (max-width:480px){

.chairman-showcase::after{

    display:none;

}

}
.principal-card,
.committee-member{
    position:relative;
    overflow:hidden;
}
/*==================================================
CINEMATIC FINISH
==================================================*/

/* Elegant card borders */

.principal-card,
.committee-member{

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(6px);

}

/* Premium glass shine */

.principal-card::before,
.committee-member::before{

    content:"";

    position:absolute;

    top:0;
    left:-120%;

    width:70%;
    height:100%;

    background:linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,.18),
        transparent
    );

    transform:skewX(-25deg);

    transition:.9s;

}

.principal-card:hover::before,
.committee-member:hover::before{

    left:170%;

}


/* Better hover */

.principal-card:hover,
.committee-member:hover{

    transform:translateY(-10px);

    box-shadow:
        0 35px 70px rgba(0,0,0,.20),
        0 20px 45px rgba(11,110,62,.35);

}


/* Images */

.principal-card img,
.committee-member img{

    transition:
        transform .45s,
        box-shadow .45s,
        border-color .45s;

}

.principal-card:hover img,
.committee-member:hover img{

    transform:scale(1.05);

    border-color:#ffffff;

    box-shadow:
        0 20px 45px rgba(0,0,0,.30);

}


/* Gold titles */

.principal-card span,
.committee-member span{

    letter-spacing:.6px;

}


/* Better spacing */

.committee-grid{

    margin-top:50px;

}

.principal-grid{

    margin-top:40px;

}


/* Section headings */

.section-subtitle{

    position:relative;

    display:inline-block;

    margin-bottom:40px;

    padding-bottom:18px;

}

.section-subtitle::after{

    content:"";

    position:absolute;

    left:50%;

    transform:translateX(-50%);

    bottom:0;

    width:90px;

    height:4px;

    border-radius:50px;

    background:linear-gradient(
        90deg,
        transparent,
        #D9B54A,
        transparent
    );

}


/* Smooth page appearance */

.executive-members{

    animation:fadeExecutive .8s ease;

}

@keyframes fadeExecutive{

    from{

        opacity:0;

        transform:translateY(30px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/* Chairman photo */

.chairman-image img{

    transition:
        transform .5s,
        box-shadow .5s;

}

.chairman-image:hover img{

    transform:scale(1.03);

    box-shadow:
        0 25px 55px rgba(0,0,0,.30);

}


/* Highlight badges */

.chairman-highlights span{

    transition:.35s;

}

.chairman-highlights span:hover{

    background:#D9B54A;

    color:#0B6E3E;

    transform:translateY(-4px);

}