.committee-section{
    display:flex;
    justify-content:center;
    align-items:center;
}

/* Card */

.committee-card{

    position:relative;

    width:900px;
    max-width:100%;

    padding:45px;

    border-radius:25px;

    overflow:hidden;

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.15);

    animation:cardShow 1.2s ease;

    box-shadow:
    0 0 20px rgba(0,255,255,.2),
    0 0 80px rgba(0,255,255,.15);
}

/* Animated Border */

.committee-card::before{

    content:"";

    position:absolute;
    inset:-3px;

    background:conic-gradient(
        #00ffff,
        #00ff88,
        #ff00ff,
        #ffcc00,
        #00ffff);

    animation:rotateBorder 6s linear infinite;

    z-index:-2;
}

.committee-card::after{

    content:"";

    position:absolute;
    inset:3px;

    background:#061b30;

    border-radius:22px;

    z-index:-1;
}

/* Floating Glow */

.committee-card .glow{

    position:absolute;

    width:300px;
    height:300px;

    border-radius:50%;

    filter:blur(90px);

    opacity:.3;

    animation:moveGlow 8s infinite alternate;
}

.glow1{
    background:#00ffff;
    top:-100px;
    left:-100px;
}

.glow2{
    background:#ff00cc;
    bottom:-120px;
    right:-120px;
}

/* Title */

.committee-title{

    text-align:center;

    color:white;

    font-size:38px;

    margin-bottom:40px;

    text-transform:uppercase;

    letter-spacing:5px;

    position:relative;

    animation:titleZoom 1s;
}

.committee-title span{

    color:#00ffff;

    text-shadow:
    0 0 10px cyan,
    0 0 30px cyan;
}

/* Animated Line */

.committee-title::after{

    content:"";

    position:absolute;

    width:180px;
    height:4px;

    left:50%;
    bottom:-15px;

    transform:translateX(-50%);

    background:linear-gradient(90deg,
    transparent,
    cyan,
    #00ff88,
    transparent);

    animation:lineGlow 3s linear infinite;
}

/* Members */

.committee-list{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;
}

.member{

    position:relative;

    padding:18px 22px;

    border-radius:14px;

    color:white;

    background:rgba(255,255,255,.06);

    border:1px solid rgba(255,255,255,.12);

    overflow:hidden;

    transition:.45s;

    animation:fadeUp .8s both;
}

/* Different Delay */

.member:nth-child(1){animation-delay:.1s;}
.member:nth-child(2){animation-delay:.2s;}
.member:nth-child(3){animation-delay:.3s;}
.member:nth-child(4){animation-delay:.4s;}
.member:nth-child(5){animation-delay:.5s;}
.member:nth-child(6){animation-delay:.6s;}
.member:nth-child(7){animation-delay:.7s;}
.member:nth-child(8){animation-delay:.8s;}
.member:nth-child(9){animation-delay:.9s;}

.member::before{

    content:"";

    position:absolute;

    left:-150%;
    top:0;

    width:70%;
    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.5),
        transparent);

    transform:skewX(-25deg);
}

/* Hover */

.member:hover{

    transform:translateY(-10px) scale(1.03);

    background:linear-gradient(135deg,#00c9ff,#005eff);

    box-shadow:
    0 0 20px cyan,
    0 0 40px cyan;
}

.member:hover::before{

    animation:shine .8s;
}

.full{

    grid-column:1/3;

    text-align:center;

    font-weight:bold;
}

/* Animations */

@keyframes rotateBorder{

100%{
transform:rotate(360deg);
}

}

@keyframes shine{

100%{
left:170%;
}

}

@keyframes fadeUp{

from{
opacity:0;
transform:translateY(40px);
}

to{
opacity:1;
transform:translateY(0);
}

}

@keyframes titleZoom{

from{
transform:scale(.5);
opacity:0;
}

to{
transform:scale(1);
opacity:1;
}

}

@keyframes lineGlow{

0%{
width:60px;
}

50%{
width:220px;
}

100%{
width:60px;
}

}

@keyframes cardShow{

from{
opacity:0;
transform:scale(.8);
}

to{
opacity:1;
transform:scale(1);
}

}

@keyframes moveGlow{

100%{
transform:translate(80px,60px);
}

}

/* Mobile */

@media(max-width:768px){

.committee-list{

grid-template-columns:1fr;

}

.full{

grid-column:auto;

}

.committee-title{

font-size:28px;

}

.committee-card{

padding:25px;

}

}