:root{
    --bg:#02040c;
    --panel:rgba(3,9,25,.72);
    --cyan:#19d8ff;
    --blue:#3267ff;
    --pink:#ff2bd6;
    --violet:#8c3cff;
    --text:#f2f8ff;
    --muted:#89a9c9;

    /* =========================================================
       TYPOGRAPHY DESIGN TOKENS
       ========================================================= */
    --font-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-display: 'Space Grotesk', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-accent: 'Caveat', cursive;

    /* Responsive Fluid Type Scale via clamp() */
    --text-xs: clamp(0.6875rem, 0.8vw, 0.75rem);       /* 11px - 12px */
    --text-sm: clamp(0.8125rem, 0.9vw, 0.875rem);      /* 13px - 14px */
    --text-base: clamp(0.9375rem, 1.1vw, 1.0625rem);   /* 15px - 17px */
    --text-lg: clamp(1.0625rem, 1.3vw, 1.1875rem);     /* 17px - 19px */
    --text-xl: clamp(1.25rem, 1.8vw, 1.5rem);          /* 20px - 24px */
    --text-2xl: clamp(1.375rem, 2.3vw, 1.75rem);       /* 22px - 28px */
    --text-3xl: clamp(1.625rem, 3.2vw, 2.25rem);       /* 26px - 36px */
    --text-4xl: clamp(2rem, 4vw, 2.75rem);             /* 32px - 44px */
    --text-5xl: clamp(2.25rem, 5.5vw, 3.75rem);        /* 36px - 60px */

    /* Font Weights */
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;
    --weight-extrabold: 800;

    /* Line Heights */
    --lh-tight: 1.15;
    --lh-snug: 1.25;
    --lh-normal: 1.5;
    --lh-relaxed: 1.65;

    /* Letter Spacing */
    --tracking-tighter: -0.03em;
    --tracking-tight: -0.015em;
    --tracking-normal: 0em;
    --tracking-wide: 0.04em;
    --tracking-wider: 0.08em;
    --tracking-widest: 0.15em;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:var(--font-body);
    font-size:var(--text-base);
    font-weight:var(--weight-regular);
    line-height:var(--lh-relaxed);
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
}

a{
    color:inherit;
}


/* =========================================================
   BACKGROUND
   ========================================================= */

.fx,
.fx>*{
    position:fixed;
    inset:0;
    pointer-events:none;
}

.fx{
    z-index:-5;
    background:#01030a;
    overflow:hidden;
}

.stars{
    background-image:
        radial-gradient(#fff 1px,transparent 1px),
        radial-gradient(#19cfff 1px,transparent 1px);
    background-size:145px 145px,245px 245px;
    opacity:.45;
    animation:stars 30s linear infinite;
}

.scan{
    background:linear-gradient(
        transparent 50%,
        rgba(0,215,255,.035) 50%
    );
    background-size:100% 5px;
    opacity:.5;
}

.nebula{
    filter:blur(45px);
    border-radius:50%;
    width:50vw;
    height:35vw;
    inset:auto;
}

.n1{
    left:-18%;
    top:20%;
    background:#004cff;
    opacity:.18;
    animation:drift 13s ease-in-out infinite;
}

.n2{
    right:-18%;
    top:12%;
    background:#e000b7;
    opacity:.15;
    animation:drift 17s ease-in-out infinite reverse;
}

.planet{
    left:-190px;
    bottom:4%;
    width:510px;
    height:510px;
    border-radius:50%;
    background:
        radial-gradient(
            circle at 35% 32%,
            #4adfff,
            #1641c7 34%,
            #030a36 70%
        );
    box-shadow:
        0 0 70px #076eff,
        0 0 160px rgba(0,110,255,.35);
    animation:floatPlanet 9s ease-in-out infinite;
}

.rings{
    width:560px;
    height:220px;
    border:1px solid rgba(26,201,255,.55);
    border-radius:50%;
    left:-40px;
    bottom:16%;
    transform:rotate(-25deg);
    box-shadow:0 0 20px rgba(20,184,255,.3);
    animation:orbit 12s linear infinite;
}

.r2{
    left:auto;
    right:-100px;
    bottom:25%;
    width:700px;
    height:270px;
    border-color:rgba(255,34,213,.45);
    animation-duration:18s;
}

.binary{
    position:absolute!important;
    inset:auto!important;
    color:#1d9eff;
    font:12px/2 Oxanium;
    letter-spacing:5px;
    opacity:.18;
    white-space:nowrap;
}

.b1{
    left:12%;
    top:14%;
}

.b2{
    right:10%;
    top:35%;
    color:#ff32d7;
}

.particles i{
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    background:#19d8ff;
    box-shadow:
        0 0 18px 6px rgba(25,216,255,.35);
    animation:particle 7s ease-in-out infinite;
}

.particles i:nth-child(1){
    left:22%;
    top:23%;
}

.particles i:nth-child(2){
    left:31%;
    top:13%;
    animation-delay:-2s;
}

.particles i:nth-child(3){
    right:24%;
    top:19%;
    background:#ff38dc;
}

.particles i:nth-child(4){
    right:16%;
    top:48%;
    background:#a54aff;
}

.particles i:nth-child(5){
    left:9%;
    bottom:20%;
    background:#fff;
}

.particles i:nth-child(6){
    right:33%;
    bottom:13%;
    animation-delay:-3s;
}

.particles i:nth-child(7){
    left:48%;
    top:27%;
    background:#ff31d8;
}

.particles i:nth-child(8){
    right:8%;
    bottom:16%;
    background:#20caff;
}


/* =========================================================
   HEADER
   ========================================================= */

header{
    position:fixed;
    z-index:50;
    top:0;
    left:0;
    right:0;
    height:88px;
    padding:12px 30px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:
        linear-gradient(
            180deg,
            rgba(1,4,13,.94),
            rgba(1,4,13,.45)
        );
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(38,194,255,.12);
}

.brand{
    display:flex;
    align-items:center;
    gap:12px;
}

.logos{
    display:flex;
    gap:6px;
}

.logos img{
    width:42px;
    height:42px;
    object-fit:contain;
    filter:drop-shadow(
        0 0 8px rgba(0,195,255,.3)
    );
}

.brand b{
    display:block;
    font-size:17px;
}

.brand small{
    display:block;
    font-size:11px;
    color:#b6d3e9;
    margin-top:3px;
}

nav{
    display:flex;
    align-items:center;
    gap:27px;
}

nav a{
    text-decoration:none;
    font-size:14px;
    font-weight:600;
    position:relative;
    padding:12px 0;
}

nav a:not(.cta):after{
    content:"";
    position:absolute;
    bottom:3px;
    left:0;
    right:100%;
    height:2px;
    background:var(--cyan);
    box-shadow:0 0 12px var(--cyan);
    transition:.25s;
}

nav a:hover:after,
nav a.active:after{
    right:0;
}

.cta{
    padding:13px 24px!important;
    border-radius:30px;
    background:
        linear-gradient(
            90deg,
            #214eff,
            #ff29b5
        );
    box-shadow:0 0 25px rgba(107,39,255,.5);
    transition:.25s;
}

.cta:hover{
    transform:translateY(-2px);
    box-shadow:0 0 40px rgba(255,42,189,.55);
}

.hamb{
    display:none;
    background:none;
    border:0;
}

.hamb span{
    display:block;
    width:25px;
    height:2px;
    background:#fff;
    margin:5px;
}


/* =========================================================
   HERO
   ========================================================= */

.hero{
    min-height:620px;
    padding:145px 30px 30px;
    position:relative;
    display:flex;
    justify-content:center;
    overflow:hidden;
}

.hero-inner{
    text-align:center;
    max-width:900px;
    position:relative;
    z-index:2;
}


/* =========================================================
   INTERACTIVE INSTITUTION TITLE
   ========================================================= */

.institution-title{
    position:relative;
    width:90%;
    max-width:100px;
    margin:0 auto 28px;
    padding:28px 45px;
    text-align:center;
    cursor:default;
    z-index:5;

    border:1px solid rgba(25,216,255,.28);
    border-radius:18px;

    background:
        linear-gradient(
            135deg,
            rgba(10,35,75,.45),
            rgba(35,5,65,.32)
        );

    box-shadow:
        0 0 20px rgba(25,216,255,.08),
        inset 0 0 25px rgba(25,216,255,.04);

    backdrop-filter:blur(8px);

    transition:
        transform .35s cubic-bezier(.2,.8,.2,1),
        border-color .35s ease,
        box-shadow .35s ease;
}

.institution-title::before{
    content:"";
    position:absolute;
    inset:-1px;
    border-radius:inherit;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(25,216,255,.8),
            transparent,
            rgba(255,43,214,.8),
            transparent
        );

    background-size:250% 100%;

    z-index:-1;
    opacity:.35;

    animation:institutionBorder 5s linear infinite;
}

.institution-title:hover{
    transform:
        translateY(-5px)
        scale(1.025);

    border-color:rgba(25,216,255,.75);

    box-shadow:
        0 0 25px rgba(25,216,255,.22),
        0 0 55px rgba(140,60,255,.12),
        inset 0 0 30px rgba(25,216,255,.07);
}

.institution-title h2{
    margin:0;

    font-family: "Coften", sans-serif !important;
    font-size:clamp(26px,4vw,44px);
    font-weight:900;
    letter-spacing:3px;
    line-height:1.1;

    background:
        linear-gradient(
            90deg,
            #ffffff,
            #6feaff,
            #ffffff,
            #c45cff,
            #ffffff
        );

    background-size:250% auto;

    color:transparent;
    -webkit-background-clip:text;
    background-clip:text;

    text-shadow:
        0 0 18px rgba(25,216,255,.25);

    animation:institutionText 6s linear infinite;
}

.institution-title p{
    margin:11px auto 0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 30px;

    font-family:var(--font-display),Oxanium,sans-serif;
    font-size:clamp(12px,1.5vw,17px);
    font-weight:800;

    letter-spacing:3.5px;
    line-height:1.4;

    border-radius:25px;
    background:linear-gradient(135deg, rgba(0,217,255,.12), rgba(255,43,214,.1));
    border:1px solid rgba(0,217,255,.42);
    box-shadow:
        0 0 18px rgba(0,217,255,.18),
        inset 0 0 14px rgba(255,43,214,.12);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);

    background-image:linear-gradient(90deg, #00f0ff 0%, #7eeaff 25%, #ff2bd6 55%, #c084fc 80%, #00f0ff 100%);
    background-size:250% auto;
    color:transparent;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;

    filter:drop-shadow(0 0 12px rgba(0,217,255,.5));
    animation:deptGlow 5s linear infinite;
    transition:all .35s cubic-bezier(.2,.8,.2,1);
}

.institution-title:hover p{
    letter-spacing:5px;
    border-color:rgba(255,43,214,.7);
    box-shadow:
        0 0 28px rgba(255,43,214,.35),
        0 0 45px rgba(0,217,255,.25),
        inset 0 0 18px rgba(0,217,255,.18);
    transform:scale(1.04);
    filter:drop-shadow(0 0 16px rgba(255,43,214,.6));
}

@keyframes deptGlow{
    0%{
        background-position:0% 50%;
    }
    100%{
        background-position:250% 50%;
    }
}

.institution-title::after{
    content:"";

    position:absolute;
    top:0;
    left:-100%;

    width:45%;
    height:100%;

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

    transform:skewX(-20deg);

    animation:institutionShine 4.5s ease-in-out infinite;

    pointer-events:none;
}


/* =========================================================
   HERO CONTENT
   ========================================================= */

.eyebrow,
.kicker{
    font:600 12px Oxanium;
    letter-spacing:5px;
    color:#8edfff;
}

.eyebrow{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:14px;
}

.eyebrow span{
    width:48px;
    height:1px;
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--cyan)
        );
}

.hero h1{
    font:
        900 clamp(60px,9vw,112px)/.88
        Oxanium;
    margin:25px 0 20px;
}

.hero h1 em{
    display:block;
    color:#f0f7ff;
    font-style:normal;
    text-shadow:0 0 35px rgba(65,146,255,.3);
}

.hero h1 strong{
    display:block;
    background:
        linear-gradient(
            90deg,
            #6442ff,
            #ff26bf
        );
    color:transparent;
    background-clip:text;
    -webkit-background-clip:text;
    text-shadow:0 0 35px rgba(177,38,255,.3);
}

.lead{
    font-size:18px;
    color:#a7c5df;
    max-width:690px;
    margin:0 auto 20px;
}

.date-line{
    font:600 12px Oxanium;
    letter-spacing:2px;
    color:#6dd6ff;
}

.hero-buttons{
    display:flex;
    justify-content:center;
    gap:14px;
    margin-top:30px;
}

.hero-buttons>a:not(.cta),
.event-btn{
    padding:13px 22px;
    border:1px solid #208cff;
    border-radius:25px;
    text-decoration:none;
    background:rgba(4,18,44,.65);
    box-shadow:
        inset 0 0 20px rgba(0,154,255,.07);
}

.hero-orb{
    position:absolute;
    right:5%;
    bottom:13%;
    width:210px;
    height:210px;
    border-radius:50%;
    border:1px solid rgba(25,216,255,.4);
    background:
        radial-gradient(
            circle,
            rgba(8,53,109,.65),
            rgba(1,7,23,.4)
        );
    box-shadow:
        0 0 50px rgba(0,129,255,.2);
    display:grid;
    place-items:center;
    animation:orb 7s ease-in-out infinite;
}

.hero-orb img{
    width:115px;
    opacity:.85;
}

.hero-orb span{
    position:absolute;
    bottom:-28px;
    font:10px Oxanium;
    color:#64d8ff;
    white-space:nowrap;
    letter-spacing:2px;
}

.hero-orb b{
    position:absolute;
    top:-35px;
    font:700 12px Oxanium;
    color:#ff5fe2;
}


/* =========================================================
   GENERAL SECTIONS
   ========================================================= */

.section,
.prize-section{
    max-width:1160px;
    margin:auto;
    padding:55px 30px;
}

.section h2,
.prize-section h2,
.final h2,
.registration h2{
    font:
        800 clamp(32px,5vw,62px)
        Oxanium;
    line-height:1.05;
    margin:13px 0;
}

.section h2 span,
.prize-section h2 span,
.final h2 span,
.registration h2 span{
    color:var(--cyan);
}

.section>p,
.prize-section>p{
    color:#91aac3;
}

.event-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    margin-top:25px;
}

.event{
    border:1px solid rgba(35,182,255,.5);
    border-radius:24px;
    overflow:hidden;
    background:
        linear-gradient(
            145deg,
            rgba(5,24,54,.83),
            rgba(2,7,23,.75)
        );
    box-shadow:0 0 35px rgba(0,113,255,.08);
}

.event:nth-child(2){
    border-color:rgba(255,42,210,.5);
    box-shadow:0 0 35px rgba(255,20,211,.08);
}

.event-img{
    height:210px;
    background:
        linear-gradient(
            135deg,
            #071c46,
            #030817
        );
    position:relative;
    overflow:hidden;
}

.event-img:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            120deg,
            transparent,
            rgba(0,220,255,.16),
            transparent
        );
    transform:translateX(-100%);
    animation:sheen 5s infinite;
}

.event-img.campus{
    background-image:
        linear-gradient(
            rgba(0,10,30,.3),
            rgba(0,5,20,.55)
        ),
        url('https://codingclubai-ds.github.io/Coding-Club-Event---1-Web/assets/campus-building.png');

    background-size:cover;
    background-position:center;
}

.event-img.aerial{
    background-image:
        linear-gradient(
            rgba(0,10,30,.25),
            rgba(0,5,20,.6)
        ),
        url('https://codingclubai-ds.github.io/Coding-Club-Event---1-Web/assets/campus-aerial.png');

    background-size:cover;
    background-position:center;
}

.event-img span{
    position:absolute;
    top:18px;
    left:18px;
    width:72px;
    height:72px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:rgba(1,8,23,.82);
    border:1px solid var(--cyan);
    box-shadow:0 0 20px rgba(0,206,255,.25);
    font:
        700 16px Oxanium;
    text-align:center;
}

.event-img small{
    font-size:8px;
    color:#8ee7ff;
}

.event-body{
    padding:26px;
}

.tag{
    font:
        700 11px Oxanium;
    letter-spacing:3px;
    color:#35d7ff;
}

.tag.pink{
    color:#ff6be3;
}

.event h3{
    font:
        800 34px Oxanium;
    margin:8px 0;
}

.event p{
    color:#a1bdd5;
}

.facts{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin:20px 0;
}

.facts span{
    border:1px solid rgba(57,165,255,.22);
    border-radius:12px;
    padding:12px 8px;
    font:
        700 18px Oxanium;
    text-align:center;
    background:rgba(0,17,41,.5);
}

.facts small{
    display:block;
    font:
        10px Oxanium;
    color:#7898b6;
    margin-top:4px;
}

.chips{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.chips b{
    font-size:11px;
    color:#bcd7eb;
    border:1px solid rgba(90,158,211,.18);
    padding:7px 9px;
    border-radius:15px;
}

.location{
    margin:18px 0;
    color:#79d9ff;
    font-size:12px;
}

.event-btn{
    display:inline-block;
    color:#eaf7ff;
}

.pink-btn{
    border-color:#cf35e7;
}


/* =========================================================
   PRIZES
   ========================================================= */

.prize-section{
    text-align:center;
}

.prizes{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    border:1px solid #316fff;
    border-radius:22px;
    background:rgba(4,13,36,.65);
    overflow:hidden;
    margin-top:25px;
}

.prizes div{
    padding:28px 10px;
    border-right:1px solid rgba(77,139,255,.18);
}

.prizes div:last-child{
    border:0;
}

.prizes b{
    display:block;
    color:#68d9ff;
    font:11px Oxanium;
}

.prizes strong{
    display:block;
    margin-top:8px;
    font:800 24px Oxanium;
}

.prizes div:first-child strong{
    color:#ffd22d;
}

.benefits{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:10px;
    margin-top:12px;
}

.benefits span{
    padding:15px;
    border:1px solid rgba(50,173,255,.15);
    border-radius:14px;
    background:rgba(4,15,35,.45);
    font-size:13px;
}

.benefits small{
    display:block;
    color:#7896b4;
    margin-top:4px;
}


/* =========================================================
   CAMPUS
   ========================================================= */

.campus-card{
    display:grid;
    grid-template-columns:1.2fr 1fr;
    border:1px solid rgba(33,189,255,.35);
    border-radius:24px;
    overflow:hidden;
    background:rgba(3,14,33,.7);
    margin-top:25px;
}

.campus-card img{
    width:100%;
    height:340px;
    object-fit:cover;
    filter:saturate(.75) contrast(1.1);
}

.campus-card>div{
    padding:35px;
}

.campus-card h3{
    font:
        700 28px Oxanium;
}

.campus-card p{
    color:#8eaac2;
    line-height:1.7;
}

.venue{
    display:grid;
    grid-template-columns:1fr 1.5fr;
    gap:13px;
    font-size:13px;
}

.venue span{
    color:#8ec7e7;
}


/* =========================================================
   FAQ
   ========================================================= */

.faq-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:25px;
}

.faq details{
    border:1px solid rgba(49,159,255,.22);
    border-radius:14px;
    background:rgba(4,13,32,.62);
    padding:18px 20px;
}

.faq summary{
    cursor:pointer;
    font-weight:600;
}

.faq p{
    color:#8ca8c1;
    line-height:1.6;
}


/* =========================================================
   TEAM
   ========================================================= */

.team-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
    margin-top:25px;
}

.person{
    border:1px solid rgba(54,172,255,.22);
    border-radius:18px;
    overflow:hidden;
    background:rgba(3,12,29,.72);
    transition:.3s;
}

.person:hover{
    transform:translateY(-6px);
    border-color:#24c9ff;
    box-shadow:0 0 28px rgba(20,193,255,.13);
}

.person img{
    width:100%;
    height:230px;
    object-fit:cover;
    display:block;
    filter:saturate(.8) contrast(1.05);
}

.person b,
.person small,
.person em{
    display:block;
    margin-left:15px;
}

.person b{
    margin-top:15px;
    font-size:16px;
}

.person small{
    margin-top:5px;
    color:#46d5ff;
    font:
        700 10px Oxanium;
}

.person em{
    margin-top:7px;
    margin-bottom:15px;
    color:#7898b3;
    font-style:normal;
    font-size:11px;
}


/* =========================================================
   CONTACT
   ========================================================= */

.contact-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-top:25px;
}

.contact-grid>div{
    padding:22px;
    border:1px solid rgba(53,169,255,.2);
    border-radius:17px;
    background:rgba(3,12,29,.65);
}

.contact-grid b{
    display:block;
    font:
        10px Oxanium;
    color:#36d2ff;
    letter-spacing:2px;
}

.contact-grid strong{
    display:block;
    font:
        700 20px Oxanium;
    margin:12px 0;
}

.contact-grid span,
.contact-grid a{
    display:block;
    color:#88a9c3;
    font-size:12px;
    line-height:1.5;
}

.contact-grid a{
    color:#61d9ff;
    text-decoration:none;
    margin-top:10px;
}


/* =========================================================
   FINAL
   ========================================================= */

.final{
    text-align:center;
    padding:65px 30px;
    background:
        radial-gradient(
            circle at center,
            rgba(29,58,166,.22),
            transparent 60%
        );
}

.final p{
    color:#8ba8c0;
    max-width:650px;
    margin:0 auto 25px;
}


/* =========================================================
   REGISTRATION
   ========================================================= */

.registration{
    max-width:900px;
    margin:0 auto 55px;
    padding:40px 30px;
    text-align:center;
    border:1px solid #703cff;
    border-radius:28px;
    background:
        linear-gradient(
            120deg,
            rgba(8,21,57,.78),
            rgba(40,5,48,.72)
        );
    box-shadow:0 0 70px rgba(91,40,255,.12);
}

.reg-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
    margin-top:28px;
}

.reg-grid a{
    padding:22px;
    text-align:left;
    border:1px solid rgba(46,181,255,.25);
    border-radius:17px;
    background:rgba(2,12,29,.7);
    text-decoration:none;
}

.reg-grid b,
.reg-grid span,
.reg-grid em{
    display:block;
}

.reg-grid b{
    font:
        700 17px Oxanium;
}

.reg-grid span{
    font-size:12px;
    color:#8ca9c2;
    margin-top:8px;
}

.reg-grid em{
    font-style:normal;
    color:#36d7ff;
    margin-top:14px;
    font-weight:700;
}


/* =========================================================
   FOOTER
   ========================================================= */

footer{
    padding:28px 30px;
    border-top:1px solid rgba(50,165,255,.15);
    display:flex;
    justify-content:space-between;
    color:#6886a2;
    font:
        10px Oxanium;
    letter-spacing:1px;
}


/* =========================================================
   PURE VISUAL AI MOTION
   ========================================================= */

.fx{
    overflow:hidden;
    isolation:isolate;
}

.fx>*{
    pointer-events:none;
}

.visual-orbs,
.visual-cubes,
.visual-hexes,
.circuit-field{
    position:absolute;
    inset:0;
    z-index:2;
}

.visual-orb{
    position:absolute;
    width:12px;
    height:12px;
    border-radius:50%;
    background:#64efff;
    box-shadow:
        0 0 8px #64efff,
        0 0 25px #00aaff,
        0 0 55px rgba(0,180,255,.7);
    animation:
        orbFloat var(--d)
        ease-in-out infinite;
    animation-delay:var(--delay);
}

.visual-orb.pink{
    background:#ff61e7;
    box-shadow:
        0 0 8px #ff61e7,
        0 0 25px #ff1fd1,
        0 0 55px rgba(255,31,209,.65);
}

.visual-cube{
    position:absolute;
    width:56px;
    height:56px;
    transform-style:preserve-3d;
    animation:
        cubeDrift var(--d)
        linear infinite;
    animation-delay:var(--delay);
    filter:
        drop-shadow(
            0 0 12px
            rgba(20,215,255,.45)
        );
}

.visual-cube::before,
.visual-cube::after{
    content:"";
    position:absolute;
    inset:0;
    border:1px solid rgba(56,224,255,.65);
    background:
        linear-gradient(
            135deg,
            rgba(20,210,255,.07),
            rgba(150,40,255,.03)
        );
    box-shadow:
        inset 0 0 18px
        rgba(30,220,255,.08);
}

.visual-cube::after{
    transform:rotate(45deg) scale(.72);
    border-color:rgba(255,60,220,.55);
    box-shadow:
        0 0 15px
        rgba(255,40,220,.2);
}

.hex{
    position:absolute;
    width:70px;
    height:80px;
    clip-path:
        polygon(
            25% 3%,
            75% 3%,
            100% 50%,
            75% 97%,
            25% 97%,
            0 50%
        );
    border:1px solid rgba(40,220,255,.55);
    background:rgba(0,100,180,.05);
    filter:
        drop-shadow(
            0 0 12px
            rgba(30,220,255,.35)
        );
    animation:
        hexFloat var(--d)
        ease-in-out infinite;
    animation-delay:var(--delay);
}

.hex::after{
    content:"";
    position:absolute;
    inset:10px;
    clip-path:inherit;
    border:1px solid rgba(255,50,215,.5);
    background:rgba(150,20,255,.035);
}

.circuit{
    position:absolute;
    width:150px;
    height:90px;
    opacity:.32;
    animation:
        circuitFloat var(--d)
        ease-in-out infinite;
    animation-delay:var(--delay);
}

.circuit::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            transparent 0 18%,
            rgba(20,220,255,.55) 18% 19%,
            transparent 19% 43%,
            rgba(20,220,255,.5) 43% 44%,
            transparent 44% 70%,
            rgba(255,40,220,.5) 70% 71%,
            transparent 71%
        ),
        linear-gradient(
            0deg,
            transparent 0 27%,
            rgba(20,220,255,.45) 27% 29%,
            transparent 29% 61%,
            rgba(255,40,220,.45) 61% 63%,
            transparent 63%
        );
    mask-image:
        radial-gradient(
            ellipse,
            #000 35%,
            transparent 72%
        );
}

.circuit::after{
    content:"";
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    left:18%;
    top:25%;
    background:#48e9ff;
    box-shadow:
        40px 30px #b56aff,
        90px -5px #ff50df,
        125px 42px #48e9ff,
        65px 65px #ff50df;
    filter:
        drop-shadow(
            0 0 7px currentColor
        );
}

.brain-visual{
    position:absolute;
    width:190px;
    height:155px;
    left:50%;
    top:41%;
    transform:translate(-50%,-50%);
    z-index:2;
    color:#43eaff;
    opacity:.18;
    filter:
        drop-shadow(
            0 0 18px #00cfff
        );
    animation:
        brainPulse 5s ease-in-out infinite;
}

.brain-visual svg{
    width:100%;
    height:100%;
}

.ai-core{
    position:absolute;
    left:50%;
    top:43%;
    width:86px;
    height:86px;
    transform:translate(-50%,-50%);
    z-index:3;
    border-radius:50%;
    border:1px solid rgba(70,230,255,.45);
    box-shadow:
        0 0 25px rgba(0,200,255,.28),
        inset 0 0 25px rgba(0,200,255,.14);
    background:
        radial-gradient(
            circle,
            rgba(50,230,255,.18),
            rgba(100,30,255,.08) 45%,
            transparent 70%
        );
    animation:
        coreFloat 6s ease-in-out infinite;
}

.ai-core:before,
.ai-core:after{
    content:"";
    position:absolute;
    border:1px solid rgba(255,55,220,.45);
    border-radius:50%;
    inset:-18px;
    animation:
        coreRing 8s linear infinite;
}

.ai-core:after{
    inset:-32px;
    border-color:rgba(50,220,255,.3);
    animation-duration:12s;
    animation-direction:reverse;
}

.ai-core span,
.ai-core i,
.ai-core b{
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#63edff;
    box-shadow:0 0 12px #63edff;
}

.ai-core span{
    left:17px;
    top:27px;
}

.ai-core i{
    right:17px;
    top:42px;
    background:#ff52dc;
    box-shadow:0 0 12px #ff52dc;
}

.ai-core b{
    left:38px;
    bottom:14px;
}


/* =========================================================
   SECTION SPACING
   ========================================================= */

@media (min-width:801px){

    .hero{
        min-height:620px;
        padding-bottom:30px;
    }

    .experience{
        padding-top:45px;
        padding-bottom:55px;
    }
}


/* =========================================================
   FACULTY & COORDINATORS
   ========================================================= */

.faculty-section{
    width:100%;
}

.team-section-title{
    width:100%;
    text-align:center;
    margin:35px 0 28px;
    color:#7eeaff;
    font:
        700 48px Oxanium,sans-serif;
    letter-spacing:5px;
    text-shadow:
        0 0 12px rgba(25,216,255,.65);
    position:relative;
}

.faculty-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(280px, 340px));
    justify-content:center;
    gap:24px;
    max-width:1100px;
    margin:0 auto;
    width:100%;
}

/* =========================================================
   FACULTY HIERARCHICAL TREE STRUCTURE
   ========================================================= */

.faculty-tree{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
    max-width:1400px;
    margin:0 auto;
    position:relative;
}

.tree-level{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    width:100%;
}

.tree-root-level{
    z-index:3;
    position:relative;
}

.tree-root-level .faculty-card{
    width:340px;
    max-width:340px;
    border-width:1.5px;
    border-color:rgba(168,80,255,.85);
    box-shadow:
        0 0 35px rgba(168,80,255,.25),
        0 14px 35px rgba(0,0,0,.65);
}

.tree-branch-level{
    display:flex;
    justify-content:center;
    gap:40px;
    width:100%;
    z-index:3;
    position:relative;
}

.tree-branch-level .faculty-card{
    width:330px;
    max-width:330px;
    flex:0 0 330px;
}

/* Cyber Tree Connector Lines */
.tree-connector{
    position:relative;
    width:100%;
    height:70px;
    pointer-events:none;
    z-index:1;
}

/* Center vertical stem coming down from HOD */
.connector-stem-top{
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:2px;
    height:35px;
    background:linear-gradient(180deg, rgba(168,80,255,.95), rgba(0,217,255,.95));
    box-shadow:0 0 10px rgba(0,217,255,.7);
}

/* Glowing junction node at fork center */
.connector-stem-top::after{
    content:"";
    position:absolute;
    bottom:-4px;
    left:50%;
    transform:translateX(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background:#00d9ff;
    box-shadow:0 0 12px #00d9ff, 0 0 20px #a850ff;
    z-index:2;
}

/* Horizontal connecting branch bar */
.connector-fork{
    position:absolute;
    top:35px;
    left:50%;
    transform:translateX(-50%);
    width:370px;
    height:2px;
    background:linear-gradient(90deg, #19d8ff 0%, #a850ff 50%, #ff2bd6 100%);
    box-shadow:0 0 10px rgba(25,216,255,.6), 0 0 15px rgba(255,43,214,.4);
    border-radius:2px;
}

/* Bottom drop stems to coordinators */
.connector-stems-bottom{
    position:absolute;
    top:35px;
    left:50%;
    transform:translateX(-50%);
    width:370px;
    height:35px;
}

.connector-stems-bottom .stem-bottom.left{
    position:absolute;
    left:0;
    top:0;
    width:2px;
    height:35px;
    background:linear-gradient(180deg, #19d8ff, rgba(25,216,255,.8));
    box-shadow:0 0 8px rgba(25,216,255,.8);
}

.connector-stems-bottom .stem-bottom.left::after{
    content:"";
    position:absolute;
    bottom:-3px;
    left:-3px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#19d8ff;
    box-shadow:0 0 10px #19d8ff;
}

.connector-stems-bottom .stem-bottom.right{
    position:absolute;
    right:0;
    top:0;
    width:2px;
    height:35px;
    background:linear-gradient(180deg, #ff2bd6, rgba(255,43,214,.8));
    box-shadow:0 0 8px rgba(255,43,214,.8);
}

.connector-stems-bottom .stem-bottom.right::after{
    content:"";
    position:absolute;
    bottom:-3px;
    right:-3px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#ff2bd6;
    box-shadow:0 0 10px #ff2bd6;
}

.faculty-card{
    position:relative;
    border-radius:18px;
    overflow:hidden;
    background:rgba(3,12,29,.78);
    display:flex;
    flex-direction:column;
    width:100%;
    max-width:340px;
    margin:0 auto;
    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}

.faculty-card img{
    width:100%;
    height:340px;
    object-fit:cover;
    object-position:center 12%;
    display:block;
    background:#050b18;

    filter:
        saturate(.95)
        contrast(1.05);

    transition:
        transform .4s ease,
        opacity .3s ease;
}

.faculty-card b,
.faculty-card small,
.faculty-card em{
    display:block;
    margin-left:15px;
    margin-right:15px;
}

.faculty-card b{
    margin-top:15px;
    font-size:16px;
}

.faculty-card small{
    margin-top:5px;
    font:
        700 10px Oxanium,sans-serif;
    letter-spacing:.5px;
}

.faculty-card em{
    margin-top:7px;
    margin-bottom:15px;
    color:#7898b3;
    font-style:normal;
    font-size:11px;
}


/* HOD */

.hod-card{
    border-color:rgba(168,80,255,.65);
    box-shadow:
        0 0 28px
        rgba(160,50,255,.12);
}

.hod-card small{
    color:#c477ff;
}


/* WORKSHOP */

.workshop-card{
    border-color:rgba(25,216,255,.65);
    box-shadow:
        0 0 28px
        rgba(25,216,255,.12);
}

.workshop-card small{
    color:#19d8ff;
}


/* HACKATHON */

.hackathon-card{
    border-color:rgba(255,43,214,.65);
    box-shadow:
        0 0 28px
        rgba(255,43,214,.12);
}

.hackathon-card small{
    color:#ff5fe2;
}


/* =========================================================
   REMOVE AI WORKSHOP & AGENTICTHON BADGES
   KEEP HOD BADGE
   ========================================================= */

.workshop-card::before,
.hackathon-card::before{
    content:none !important;
    display:none !important;
}


/* HOD BADGE */

.faculty-card::before{
    position:absolute;
    top:14px;
    left:14px;
    z-index:5;
    padding:7px 12px;
    border-radius:20px;
    font:
        700 9px Oxanium,sans-serif;
    letter-spacing:1.5px;
    backdrop-filter:blur(8px);
}

.hod-card::before{
    content:none !important;
    display:none !important;
}


/* =========================================================
   STUDENT CORE TEAM
   ========================================================= */

.student-title{
    margin-top:42px;
}

.student-core-grid{
    display:grid;
    grid-template-columns:
        repeat(2,minmax(280px,340px));
    justify-content:center;
    gap:15px;
}


/* =========================================================
   FACULTY HOVER
   ========================================================= */

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

.hod-card:hover{
    box-shadow:
        0 0 38px
        rgba(160,50,255,.28);
}

.workshop-card:hover{
    box-shadow:
        0 0 38px
        rgba(25,216,255,.28);
}

.hackathon-card:hover{
    box-shadow:
        0 0 38px
        rgba(255,43,214,.28);
}

.faculty-card:hover img{
    transform:scale(1.03);
}


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

.student-core-grid .person{
    overflow:hidden;
}

.student-core-grid .person img{
    width:100%;
    height:250px;
    display:block;

    object-fit:cover;
    object-position:center top;

    background:#050b18;

    filter:
        saturate(.9)
        contrast(1.05);

    transition:transform .4s ease;
}


/* Individual positioning */

.student-core-grid .person:nth-child(1) img{
    object-position:center 15%;
}

.student-core-grid .person:nth-child(2) img{
    object-position:center 15%;
}

.student-core-grid .person:nth-child(3) img{
    object-position:center 15%;
}

.student-core-grid .person:nth-child(4) img{
    object-position:center top;
}

.student-core-grid .person:nth-child(5) img{
    object-position:center top;
}

.student-core-grid .person:nth-child(6) img{
    object-position:center top;
}

.student-core-grid .person:hover img{
    transform:scale(1.03);
}


/* Faculty positioning */

.hod-card img{
    object-position:center 18%;
}

.workshop-card img{
    object-position:center 12%;
}

.hackathon-card img{
    object-position:center 10%;
}


/* =========================================================
   EXTRA FLOATING VISUAL ELEMENTS
   PURE GRAPHICS — NO TEXT
   ========================================================= */

.floating-rings,
.floating-diamonds,
.energy-nodes,
.orbit-lines{
    position:absolute !important;
    inset:0 !important;
    z-index:2;
    pointer-events:none;
}


/* Rings */

.floating-rings i{
    position:absolute;
    width:55px;
    height:55px;
    border:1px solid rgba(25,216,255,.48);
    border-radius:50%;
    box-shadow:
        0 0 12px rgba(25,216,255,.28),
        inset 0 0 12px rgba(25,216,255,.12);
    animation:
        extraRingFloat 10s ease-in-out infinite,
        extraRingRotate 8s linear infinite;
}

.floating-rings i:nth-child(1){
    left:8%;
    top:32%;
    width:42px;
    height:42px;
}

.floating-rings i:nth-child(2){
    left:25%;
    top:12%;
    width:28px;
    height:28px;
    border-color:rgba(255,43,214,.52);
    animation-delay:-2s;
}

.floating-rings i:nth-child(3){
    right:12%;
    top:30%;
    width:72px;
    height:72px;
    animation-delay:-4s;
}

.floating-rings i:nth-child(4){
    right:27%;
    bottom:18%;
    width:35px;
    height:35px;
    border-color:rgba(255,43,214,.48);
    animation-delay:-6s;
}

.floating-rings i:nth-child(5){
    left:43%;
    bottom:12%;
    width:24px;
    height:24px;
    animation-delay:-8s;
}


/* Diamonds */

.floating-diamonds i{
    position:absolute;
    width:42px;
    height:42px;
    border:1px solid rgba(50,210,255,.5);
    transform:rotate(45deg);
    box-shadow:
        0 0 18px rgba(30,210,255,.2),
        inset 0 0 15px rgba(30,210,255,.07);
    animation:
        extraDiamondFloat 12s ease-in-out infinite;
}

.floating-diamonds i:nth-child(1){
    left:14%;
    top:48%;
}

.floating-diamonds i:nth-child(2){
    right:18%;
    top:17%;
    width:30px;
    height:30px;
    border-color:rgba(255,45,215,.5);
    animation-delay:-3s;
}

.floating-diamonds i:nth-child(3){
    left:34%;
    bottom:10%;
    width:24px;
    height:24px;
    animation-delay:-6s;
}

.floating-diamonds i:nth-child(4){
    right:7%;
    bottom:22%;
    width:52px;
    height:52px;
    border-color:rgba(255,45,215,.42);
    animation-delay:-9s;
}


/* Energy nodes */

.energy-nodes i{
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    background:#52eaff;

    box-shadow:
        0 0 8px #52eaff,
        0 0 22px #00bfff,
        0 0 45px rgba(0,190,255,.45);

    animation:
        extraNodePulse 5s ease-in-out infinite;
}

.energy-nodes i:nth-child(1){
    left:6%;
    top:20%;
}

.energy-nodes i:nth-child(2){
    left:19%;
    top:71%;
    animation-delay:-1s;
}

.energy-nodes i:nth-child(3){
    left:38%;
    top:24%;
    animation-delay:-2s;
}

.energy-nodes i:nth-child(4){
    left:57%;
    top:14%;
    animation-delay:-3s;
}

.energy-nodes i:nth-child(5){
    right:31%;
    top:58%;
    animation-delay:-4s;
}

.energy-nodes i:nth-child(6){
    right:18%;
    top:38%;
    background:#ff58df;

    box-shadow:
        0 0 8px #ff58df,
        0 0 22px #ff20d1,
        0 0 45px rgba(255,30,210,.45);
}

.energy-nodes i:nth-child(7){
    right:8%;
    bottom:17%;
    animation-delay:-2.5s;
}

.energy-nodes i:nth-child(8){
    left:48%;
    bottom:8%;
    background:#ff58df;
    animation-delay:-1.5s;
}


/* Orbit lines */

.orbit-lines i{
    position:absolute;
    width:240px;
    height:90px;
    border:1px solid rgba(30,210,255,.22);
    border-radius:50%;
    transform:rotate(-25deg);

    animation:
        extraOrbitDrift 16s linear infinite;
}

.orbit-lines i:nth-child(1){
    left:-40px;
    top:28%;
}

.orbit-lines i:nth-child(2){
    right:-60px;
    top:54%;
    width:320px;
    height:120px;
    border-color:rgba(255,40,215,.24);
    animation-duration:20s;
    animation-direction:reverse;
}

.orbit-lines i:nth-child(3){
    left:38%;
    bottom:-20px;
    width:300px;
    height:100px;
    border-color:rgba(120,80,255,.2);
    animation-duration:24s;
}


/* =========================================================
   ANIMATIONS
   ========================================================= */

@keyframes stars{
    to{
        background-position:
            900px 900px,
            -700px 500px;
    }
}

@keyframes drift{
    50%{
        transform:
            translate(7vw,4vh)
            scale(1.1);
    }
}

@keyframes floatPlanet{
    50%{
        transform:translateY(-18px);
    }
}

@keyframes orbit{
    to{
        transform:rotate(335deg);
    }
}

@keyframes particle{
    50%{
        transform:
            translateY(-30px)
            scale(1.5);
    }
}

@keyframes orb{
    50%{
        transform:
            translateY(-15px)
            rotate(3deg);
    }
}

@keyframes sheen{
    45%{
        transform:translateX(100%);
    }
}

@keyframes orbFloat{
    0%,100%{
        transform:
            translate3d(0,0,0)
            scale(.8);
        opacity:.35;
    }

    50%{
        transform:
            translate3d(var(--x),var(--y),0)
            scale(1.5);
        opacity:.95;
    }
}

@keyframes cubeDrift{
    0%{
        transform:
            translate3d(0,20vh,0)
            rotateX(0)
            rotateY(0)
            rotateZ(0);
        opacity:0;
    }

    12%{
        opacity:.8;
    }

    50%{
        transform:
            translate3d(7vw,-8vh,0)
            rotateX(180deg)
            rotateY(180deg)
            rotateZ(90deg);
    }

    88%{
        opacity:.7;
    }

    100%{
        transform:
            translate3d(-5vw,-32vh,0)
            rotateX(360deg)
            rotateY(360deg)
            rotateZ(180deg);
        opacity:0;
    }
}

@keyframes hexFloat{
    0%,100%{
        transform:
            translate3d(0,0,0)
            rotate(0deg)
            scale(.8);
        opacity:.2;
    }

    50%{
        transform:
            translate3d(var(--x),var(--y),0)
            rotate(180deg)
            scale(1.15);
        opacity:.65;
    }
}

@keyframes circuitFloat{
    0%,100%{
        transform:
            translate3d(0,0,0)
            rotate(-4deg);
        opacity:.18;
    }

    50%{
        transform:
            translate3d(var(--x),var(--y),0)
            rotate(5deg);
        opacity:.5;
    }
}

@keyframes brainPulse{
    50%{
        transform:
            translate(-50%,-50%)
            scale(1.08);
        opacity:.3;
    }
}

@keyframes coreFloat{
    50%{
        transform:
            translate(-50%,-50%)
            translateY(-12px)
            scale(1.04);
    }
}

@keyframes coreRing{
    to{
        transform:rotate(360deg);
    }
}


/* Institution title animations */

@keyframes institutionBorder{
    0%{
        background-position:0% 50%;
    }

    100%{
        background-position:250% 50%;
    }
}

@keyframes institutionText{
    0%{
        background-position:0% 50%;
    }

    100%{
        background-position:250% 50%;
    }
}

@keyframes institutionShine{
    0%,
    45%{
        left:-100%;
    }

    70%,
    100%{
        left:160%;
    }
}


/* Extra floating animations */

@keyframes extraRingFloat{
    0%,100%{
        transform:translate3d(0,0,0);
        opacity:.25;
    }

    50%{
        transform:translate3d(20px,-30px,0);
        opacity:.8;
    }
}

@keyframes extraRingRotate{
    to{
        rotate:360deg;
    }
}

@keyframes extraDiamondFloat{
    0%,100%{
        transform:
            translate3d(0,0,0)
            rotate(45deg)
            scale(.8);
        opacity:.18;
    }

    50%{
        transform:
            translate3d(25px,-35px,0)
            rotate(225deg)
            scale(1.1);
        opacity:.68;
    }
}

@keyframes extraNodePulse{
    0%,100%{
        transform:scale(.6);
        opacity:.25;
    }

    50%{
        transform:scale(1.7);
        opacity:1;
    }
}

@keyframes extraOrbitDrift{
    0%{
        transform:
            rotate(-25deg)
            translateX(-20px);
    }

    50%{
        transform:
            rotate(-5deg)
            translateX(30px);
    }

    100%{
        transform:
            rotate(-25deg)
            translateX(-20px);
    }
}


/* =========================================================
   DESKTOP / TABLET
   ========================================================= */

@media(max-width:1050px){

    nav{
        gap:14px;
    }

    .hero-orb{
        right:1%;
    }

    .team-grid{
        grid-template-columns:repeat(3,1fr);
    }

    .faculty-grid{
        grid-template-columns:repeat(auto-fit, minmax(260px, 320px));
        justify-content:center;
    }

    .faculty-card img{
        height:320px;
    }

    .student-core-grid .person img{
        height:240px;
    }
}


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

@media(max-width:800px){

    header{
        height:72px;
        padding:10px 15px;
    }

    .brand b{
        font-size:11px;
    }

    .brand small{
        display:none;
    }

    .logos img{
        width:30px;
        height:30px;
    }

    .hamb{
        display:block;
    }

    nav{
        display:none;
        position:absolute;
        top:72px;
        left:0;
        right:0;
        flex-direction:column;
        background:rgba(1,4,13,.97);
        padding:20px;
    }

    .open nav{
        display:flex;
    }

    .hero{
        padding-top:115px;
    }

    .hero-orb{
        opacity:.3;
        right:-80px;
        bottom:10%;
    }

    .event-grid,
    .campus-card,
    .faq-grid,
    .reg-grid{
        grid-template-columns:1fr;
    }

    .prizes,
    .benefits{
        grid-template-columns:repeat(2,1fr);
    }

    .prizes div:nth-child(2){
        border:0;
    }

    .team-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .contact-grid{
        grid-template-columns:1fr 1fr;
    }

    .faculty-grid{
        grid-template-columns:repeat(auto-fit, minmax(260px, 340px));
        justify-content:center;
        max-width:540px;
        margin:0 auto;
    }

    .tree-branch-level{
        flex-direction:column;
        align-items:center;
        gap:32px;
    }

    .tree-root-level .faculty-card,
    .tree-branch-level .faculty-card{
        width:100%;
        max-width:330px;
        flex:1 1 auto;
    }

    .tree-connector{
        height:45px;
    }

    .connector-fork,
    .connector-stems-bottom{
        display:none;
    }

    .connector-stem-top{
        height:45px;
    }

    .faculty-card img{
        height:320px;
        object-position:center 12%;
    }

    .student-core-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .team-section-title{
        font-size:11px;
        letter-spacing:2.5px;
    }

    .brain-visual{
        width:130px;
        height:105px;
        opacity:.11;
    }

    .ai-core{
        width:62px;
        height:62px;
    }

    .visual-cube{
        width:38px;
        height:38px;
    }

    .hex{
        width:48px;
        height:55px;
    }

    .circuit{
        transform:scale(.7);
    }

    .floating-rings i{
        transform:scale(.7);
    }

    .floating-diamonds i{
        transform:
            rotate(45deg)
            scale(.7);
    }

    .orbit-lines i{
        transform:
            rotate(-25deg)
            scale(.65);
    }

    .institution-title{
        margin-bottom:22px;
        padding:12px 18px;
        border-radius:15px;
    }

    .institution-title h2{
        font-size:18px;
        letter-spacing:1.8px;
    }

    .institution-title p{
        font-size:8px;
        letter-spacing:2.2px;
        margin-top:7px;
    }

    .institution-title:hover{
        transform:
            translateY(-3px)
            scale(1.015);
    }
}


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

@media(max-width:500px){

    .hero h1{
        font-size:48px;
    }

    .lead{
        font-size:14px;
    }

    .date-line{
        font-size:9px;
    }

    .hero-buttons{
        flex-direction:column;
    }

    .facts{
        grid-template-columns:1fr;
    }

    .prizes,
    .benefits,
    .team-grid,
    .contact-grid{
        grid-template-columns:1fr;
    }

    .person img{
        height:270px;
    }

    .student-core-grid{
        grid-template-columns:1fr;
    }

    .faculty-card img{
        height:320px;
    }

    .student-core-grid .person img{
        height:300px;
    }

    .institution-title{
        width:94%;
        padding:11px 12px;
    }

    .institution-title h2{
        font-size:15px;
        letter-spacing:1.2px;
    }

    .institution-title p{
        font-size:7px;
        letter-spacing:1.5px;
    }

    footer{
        flex-direction:column;
        gap:10px;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media(prefers-reduced-motion:reduce){

    .visual-orb,
    .visual-cube,
    .hex,
    .circuit,
    .brain-visual,
    .ai-core,
    .ai-core:before,
    .ai-core:after,
    .floating-rings i,
    .floating-diamonds i,
    .energy-nodes i,
    .orbit-lines i,
    .institution-title,
    .institution-title::before,
    .institution-title::after,
    .institution-title h2{
        animation:none!important;
    }
}

/* =========================================================
   PROFESSIONAL WEBSITE TYPOGRAPHY SYSTEM
   Primary Font: Inter (Body, Navigation, Buttons, Forms, Metadata)
   Display Font: Space Grotesk (H1, H2, H3, Stats, Numbers)
   Accent Font:  Caveat (Designer annotations, highlighted callouts)
   ========================================================= */

html, body {
    font-family: var(--font-body);
    font-size: var(--text-base);
    color: var(--text);
    line-height: var(--lh-relaxed);
}

body,
body * {
    font-family: inherit;
}

button,
input,
textarea,
select {
    font: inherit;
}

/* ---------------------------------------------------------
   Headings System (Space Grotesk)
   Desktop: H1 48–64px | H2 32–40px | H3 22–28px
   Tablet:  H1 40–52px | H2 28–36px | H3 20–24px
   Mobile:  H1 32–40px | H2 26–32px | H3 20–24px
   --------------------------------------------------------- */
h1, .hero h1 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: var(--weight-extrabold);
    line-height: var(--lh-tight);
    letter-spacing: var(--tracking-tight);
    color: #ffffff;
}

h2,
.section h2,
.prize-section h2,
.final h2,
.registration h2,
.institution-title h2 {
    font-family: var(--font-display);
    font-size: clamp(1.625rem, 3.5vw, 2.5rem);
    font-weight: var(--weight-bold);
    line-height: var(--lh-snug);
    letter-spacing: var(--tracking-tight);
    color: #ffffff;
}

h3,
.event h3,
.campus-card h3 {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);
    font-weight: var(--weight-semibold);
    line-height: 1.35;
    letter-spacing: var(--tracking-normal);
    color: #ffffff;
}

h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: var(--weight-semibold);
    line-height: 1.4;
    color: #ffffff;
}

/* ---------------------------------------------------------
   Body & Supporting Content (Inter)
   Desktop 16–18px | Tablet 16–17px | Mobile 15–16px
   --------------------------------------------------------- */
p,
.lead,
.faq p,
.section-desc,
.location,
.venue,
.benefits span,
.chips b,
.institution-title p {
    font-family: var(--font-body);
}

.lead {
    font-family: var(--font-body);
    font-size: clamp(1rem, 1.35vw, 1.125rem);
    font-weight: var(--weight-regular);
    line-height: var(--lh-relaxed);
    color: #a7c5df;
}

/* ---------------------------------------------------------
   Navigation (Inter: 14–16px, weight 500–600)
   --------------------------------------------------------- */
nav a,
.nav-links a {
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: var(--weight-medium);
    letter-spacing: 0.01em;
}

/* ---------------------------------------------------------
   Buttons & CTAs (Inter: 14–16px, weight 600–700)
   --------------------------------------------------------- */
button,
input[type="button"],
input[type="submit"],
.cta,
.btn,
.hero-buttons a,
.event-btn {
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: var(--weight-semibold);
    letter-spacing: 0.02em;
}

/* ---------------------------------------------------------
   Labels, Eyebrows & Technical HUD Elements (Inter: 12–14px)
   --------------------------------------------------------- */
.eyebrow,
.kicker,
.tag,
.date-line,
.combo-badge,
.mission-tag,
.card-hud-bar,
.mission-unit-label,
.brand small,
.person small,
.faculty-card small,
.facts small {
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: var(--weight-semibold);
    line-height: 1.35;
}

.eyebrow,
.kicker,
.tag,
.combo-badge {
    letter-spacing: var(--tracking-widest);
    text-transform: uppercase;
}

.date-line {
    letter-spacing: var(--tracking-wider);
}

/* ---------------------------------------------------------
   Numbers, Metrics & Tabular Data (Space Grotesk: 700–800)
   --------------------------------------------------------- */
.digit-current,
.digit-incoming,
#days,
#hours,
#minutes,
#seconds,
.facts span,
.prizes strong,
.contact-grid strong,
.reg-grid b,
.combo-card b,
.stat-number {
    font-family: var(--font-display);
    font-variant-numeric: tabular-nums;
    font-weight: var(--weight-bold);
    letter-spacing: -0.01em;
}

.prizes strong {
    font-size: clamp(1.25rem, 2vw, 1.625rem);
}

/* ---------------------------------------------------------
   Handwritten Designer Accent (Caveat)
   Used ONLY for small highlighted words, annotations, callouts
   --------------------------------------------------------- */
.handwritten-accent,
.annotation {
    font-family: var(--font-accent);
    font-size: 1.3em;
    font-weight: var(--weight-medium);
    color: var(--cyan);
    display: inline-block;
    transform: rotate(-2.5deg);
    vertical-align: baseline;
    margin: 0 4px;
    letter-spacing: 0.01em;
    text-shadow: 0 0 12px rgba(0, 217, 255, 0.45);
    line-height: 1;
}

/* ---------------------------------------------------------
   Important Concept Highlights (Selective Emphasis)
   --------------------------------------------------------- */
.concept-highlight {
    font-weight: var(--weight-bold);
    color: #ffffff;
    background: linear-gradient(90deg, #00d9ff, #d946ef);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 0 20px rgba(0, 217, 255, 0.35);
}

/* ---------------------------------------------------------
   Forms & Inputs (Inter: 14px)
   --------------------------------------------------------- */
input,
textarea,
select,
option {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: var(--weight-regular);
}

label {
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: var(--weight-semibold);
    line-height: 1.4;
}

/* ---------------------------------------------------------
   Cards & Entity Headings
   --------------------------------------------------------- */
.person b,
.faculty-card b,
.brand b {
    font-family: var(--font-display);
    font-weight: var(--weight-semibold);
}

.contact-grid b {
    font-family: var(--font-body);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
}

footer {
    font-family: var(--font-body);
    font-size: 12px;
    letter-spacing: 0.02em;
}
/* =========================================
   REMOVE FACULTY TREE CONNECTOR LINES
   ========================================= */

/* Hide the entire connector between HOD and coordinators */
.faculty-tree .tree-connector {
    display: none !important;
}

/* Remove any possible connector pseudo-elements */
.faculty-tree .tree-connector::before,
.faculty-tree .tree-connector::after,
.faculty-tree .connector-stem-top,
.faculty-tree .connector-fork,
.faculty-tree .connector-stems-bottom,
.faculty-tree .stem-bottom,
.faculty-tree .stem-bottom.left,
.faculty-tree .stem-bottom.right {
    display: none !important;
}

/* Keep the coordinator cards separated cleanly */
.faculty-tree .tree-branch-level {
    margin-top: 35px !important;
}

/* Make sure no lines are generated by the tree levels */
.faculty-tree .tree-level::before,
.faculty-tree .tree-level::after,
.faculty-tree .tree-root-level::before,
.faculty-tree .tree-root-level::after,
.faculty-tree .tree-branch-level::before,
.faculty-tree .tree-branch-level::after {
    content: none !important;
    display: none !important;
}

/* =========================================================
   FINAL ALTERATION — 4 FACULTY / COORDINATOR PHOTOS IN ONE ROW
   ========================================================= */

.faculty-tree{
    width:100%;
    max-width:1450px;
}

.tree-branch-level{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:24px !important;
    width:94% !important;
    max-width:1380px !important;
    margin:40px auto 0 !important;
    align-items:stretch;
}

.tree-branch-level .faculty-card{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    flex:none !important;
}

.tree-branch-level .faculty-card img{
    width:100%;
    height:300px;
    object-fit:cover;
    object-position:center 12%;
}

.tree-branch-level .faculty-card:hover img{
    transform:scale(1.035);
}

.tree-branch-level .faculty-card:hover{
    transform:translateY(-7px);
}

.tree-connector{
    display:none !important;
}

.tree-connector::before,
.tree-connector::after,
.connector-stem-top,
.connector-fork,
.connector-stems-bottom,
.stem-bottom,
.stem-bottom.left,
.stem-bottom.right{
    display:none !important;
}

.faculty-tree .tree-level::before,
.faculty-tree .tree-level::after,
.faculty-tree .tree-root-level::before,
.faculty-tree .tree-root-level::after,
.faculty-tree .tree-branch-level::before,
.faculty-tree .tree-branch-level::after{
    content:none !important;
    display:none !important;
}

@media(max-width:1200px){
    .tree-branch-level{
        width:96% !important;
        gap:18px !important;
    }

    .tree-branch-level .faculty-card img{
        height:280px;
    }
}

@media(max-width:950px){
    .tree-branch-level{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        max-width:700px !important;
        gap:22px !important;
    }
}

@media(max-width:600px){
    .tree-root-level .faculty-card{
        width:92% !important;
        max-width:340px !important;
    }

    .tree-branch-level{
        grid-template-columns:1fr !important;
        width:92% !important;
        max-width:360px !important;
        gap:24px !important;
        margin-top:30px !important;
    }

    .tree-branch-level .faculty-card{
        width:100% !important;
        max-width:none !important;
    }

    .tree-branch-level .faculty-card img{
        height:320px;
    }
}

@media(max-width:400px){
    .tree-root-level .faculty-card{
        width:94% !important;
    }

    .tree-branch-level{
        width:94% !important;
    }

    .tree-branch-level .faculty-card img{
        height:300px;
    }
}



/* =========================================================
   FINAL FIX — FOUR FACULTY / COORDINATOR CARDS IN ONE ROW
   ========================================================= */

.faculty-tree .tree-branch-level{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:22px !important;
    width:94% !important;
    max-width:1380px !important;
    margin:40px auto 0 !important;
    align-items:stretch;
}

.faculty-tree .tree-branch-level .faculty-card{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    flex:initial !important;
    margin:0 !important;
}

.faculty-tree .tree-branch-level .faculty-card img{
    width:100% !important;
    height:300px !important;
    object-fit:cover !important;
    object-position:center 12% !important;
}

.faculty-tree .tree-branch-level .faculty-card:hover{
    transform:translateY(-7px);
}

.faculty-tree .tree-branch-level .faculty-card:hover img{
    transform:scale(1.035);
}

/* Student coordinator cards use the same clean cyan treatment */
.student-coordinator-card{
    border-color:rgba(25,216,255,.65) !important;
    box-shadow:0 0 28px rgba(25,216,255,.12);
}

.student-coordinator-card small{
    color:#19d8ff !important;
}

@media(max-width:1200px){
    .faculty-tree .tree-branch-level{
        width:96% !important;
        gap:18px !important;
    }

    .faculty-tree .tree-branch-level .faculty-card img{
        height:280px !important;
    }
}

@media(max-width:950px){
    .faculty-tree .tree-branch-level{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        max-width:700px !important;
        gap:22px !important;
    }
}

@media(max-width:600px){
    .faculty-tree .tree-branch-level{
        grid-template-columns:1fr !important;
        width:92% !important;
        max-width:360px !important;
        gap:24px !important;
        margin-top:30px !important;
    }

    .faculty-tree .tree-branch-level .faculty-card img{
        height:320px !important;
    }
}

@media(max-width:400px){
    .faculty-tree .tree-branch-level{
        width:94% !important;
    }

    .faculty-tree .tree-branch-level .faculty-card img{
        height:300px !important;
    }
}
/* =========================================================
   REMOVE LINES BETWEEN FACULTY PHOTOS
   ========================================================= */

/* Remove borders from coordinator cards */
.faculty-tree .tree-branch-level .faculty-card,
.faculty-tree .tree-branch-level .person {
    border: none !important;
    outline: none !important;
}

/* Remove any border directly around coordinator images */
.faculty-tree .tree-branch-level .faculty-card img {
    border: none !important;
    outline: none !important;
    display: block;
}

/* Make sure no pseudo-element creates a divider */
.faculty-tree .tree-branch-level .faculty-card::before,
.faculty-tree .tree-branch-level .faculty-card::after,
.faculty-tree .tree-branch-level .person::before,
.faculty-tree .tree-branch-level .person::after {
    border: none !important;
    box-shadow: none !important;
}

/* Keep the cards separated by clean spacing */
.faculty-tree .tree-branch-level {
    gap: 24px !important;
}

/* Keep rounded corners on each photo/card */
.faculty-tree .tree-branch-level .faculty-card {
    border-radius: 18px !important;
    overflow: hidden !important;
}
/* =========================================================
   CHIEF GUESTS — WORKSHOP & AGENTICTHON
   5 CARDS — 2 × 2 + 1 CENTERED BELOW
   ========================================================= */

.chief-guest-section{
    width:100%;
    max-width:1220px;
    margin:0 auto;
    padding:35px 30px 65px;
    position:relative;
}

.chief-guest-title{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin-bottom:28px;
    text-align:center;
    flex-wrap:wrap;
}

.chief-guest-title::before,
.chief-guest-title::after{
    content:"";
    height:1px;
    flex:1;
    max-width:180px;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(25,216,255,.8),
        rgba(255,43,214,.8)
    );
    box-shadow:0 0 10px rgba(25,216,255,.35);
}

.chief-guest-title span{
    font-family:var(--font-display);
    font-size:12px;
    font-weight:800;
    letter-spacing:3px;
    color:#19d8ff;
    text-shadow:0 0 12px rgba(25,216,255,.55);
}

.chief-guest-title strong{
    font-family:var(--font-display);
    font-size:12px;
    font-weight:800;
    letter-spacing:3px;
    background:linear-gradient(
        90deg,
        #19d8ff,
        #8c3cff,
        #ff2bd6
    );
    color:transparent;
    -webkit-background-clip:text;
    background-clip:text;
}

/* 2 cards per row */
.chief-guest-grid{
    width:100%;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
}

/* Four chief guests per row */
.chief-guest-card{
    position:relative;
    width:100%;
    min-height:0;

    display:flex;
    flex-direction:column;
    gap:0;

    padding:0;
    border:1px solid rgba(25,216,255,.45);
    border-radius:24px;

    background:
        linear-gradient(
            135deg,
            rgba(4,18,45,.88),
            rgba(13,5,37,.82)
        );

    box-shadow:
        0 0 30px rgba(25,216,255,.10),
        0 0 65px rgba(140,60,255,.08),
        inset 0 0 35px rgba(25,216,255,.035);

    overflow:hidden;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

/* Remove the old centered fifth-card behavior */
.chief-guest-card:nth-child(5){
    grid-column:auto;
    width:100%;
    justify-self:stretch;
}

/* Moving glow */
.chief-guest-card::before{
    content:"";
    position:absolute;
    top:0;
    left:-30%;
    width:35%;
    height:100%;

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

    transform:skewX(-20deg);
    animation:chiefGuestShine 5s ease-in-out infinite;
    pointer-events:none;
    z-index:3;
}

.chief-guest-card:nth-child(2)::before{animation-delay:1s;}
.chief-guest-card:nth-child(3)::before{animation-delay:2s;}
.chief-guest-card:nth-child(4)::before{animation-delay:3s;}
.chief-guest-card:nth-child(5)::before{animation-delay:4s;}
.chief-guest-card:nth-child(6)::before{animation-delay:5s;}
.chief-guest-card:nth-child(7)::before{animation-delay:6s;}
.chief-guest-card:nth-child(8)::before{animation-delay:7s;}

@keyframes chiefGuestShine{
    0%{left:-35%;}
    45%{left:110%;}
    100%{left:110%;}
}

/* Outer glow line */
.chief-guest-card::after{
    content:"";
    position:absolute;
    inset:0;

    border-radius:inherit;
    border:1px solid transparent;

    background:
        linear-gradient(
            135deg,
            rgba(25,216,255,.5),
            transparent 35%,
            transparent 65%,
            rgba(255,43,214,.5)
        ) border-box;

    -webkit-mask:
        linear-gradient(#fff 0 0) padding-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;
    mask-composite:exclude;

    pointer-events:none;
    z-index:4;
}

.chief-guest-card:hover{
    transform:translateY(-5px);
    border-color:rgba(25,216,255,.75);

    box-shadow:
        0 0 35px rgba(25,216,255,.18),
        0 0 75px rgba(255,43,214,.10),
        inset 0 0 40px rgba(25,216,255,.06);
}

/* Portrait photo */
.chief-guest-photo{
    position:relative;
    width:100%;
    height:230px;

    border-radius:0;
    overflow:hidden;

    border:0;
    border-bottom:2px solid rgba(25,216,255,.65);
    background:#020816;

    box-shadow:
        0 0 20px rgba(25,216,255,.12),
        0 0 40px rgba(140,60,255,.08);
}

.chief-guest-photo::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.02),
            rgba(0,0,0,.38)
        );

    z-index:2;
    pointer-events:none;
}

.chief-guest-photo img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:center;
    transition:transform .5s ease;
}

.chief-guest-card:hover .chief-guest-photo img{
    transform:scale(1.035);
}

/* Information */
.chief-guest-info{
    position:relative;
    z-index:5;
    min-width:0;
    padding:20px 20px 22px;
}

.chief-guest-label{
    display:inline-block;
    padding:5px 11px;
    margin-bottom:10px;

    border:1px solid rgba(255,43,214,.45);
    border-radius:20px;
    background:rgba(255,43,214,.07);

    color:#ff73e7;

    font-family:var(--font-display);
    font-size:8px;
    font-weight:800;
    letter-spacing:2px;

    box-shadow:0 0 15px rgba(255,43,214,.08);
}

.chief-guest-info h2{
    margin:0 0 4px;

    font-family:var(--font-display);
    font-size:clamp(20px,2vw,27px);
    font-weight:800;
    line-height:1.1;
    color:#ffffff;

    text-shadow:0 0 18px rgba(25,216,255,.18);
}

.chief-guest-info h3{
    margin:7px 0 10px;

    font-family:var(--font-display);
    font-size:9px;
    font-weight:800;
    letter-spacing:2px;
    color:#19d8ff;

    text-shadow:0 0 12px rgba(25,216,255,.5);
}

.chief-guest-info p{
    margin:0 0 14px;

    color:#9db9d3;
    font-size:12px;
    line-height:1.55;
}

/* Event Tags */
.chief-guest-events{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.chief-guest-events span{
    padding:6px 9px;

    border:1px solid rgba(25,216,255,.28);
    border-radius:20px;

    background:rgba(25,216,255,.05);
    color:#8eeaff;

    font-family:var(--font-display);
    font-size:7px;
    font-weight:800;
    letter-spacing:1.2px;

    box-shadow:inset 0 0 12px rgba(25,216,255,.04);
}

.chief-guest-events span:nth-child(2){
    border-color:rgba(255,43,214,.35);
    color:#ff7be8;
    background:rgba(255,43,214,.05);
}


/* =========================================================
   CHIEF GUEST — RESPONSIVE
   ========================================================= */

@media(max-width:1100px){
    .chief-guest-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:20px;
    }

    .chief-guest-photo{
        height:260px;
    }

    .chief-guest-info h2{
        font-size:24px;
    }
}

@media(max-width:600px){
    .chief-guest-grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .chief-guest-card,
    .chief-guest-card:nth-child(5){
        width:100%;
        grid-column:auto;
        justify-self:stretch;
    }

    .chief-guest-photo{
        height:300px;
    }

    .chief-guest-info{
        padding:20px;
        text-align:center;
    }

    .chief-guest-events{
        justify-content:center;
    }

    .chief-guest-info h2{
        font-size:28px;
    }

    .chief-guest-info h3{
        font-size:10px;
    }

    .chief-guest-info p{
        font-size:13px;
    }

    .chief-guest-label{
        font-size:8px;
    }
}


/* =========================================================
   END CHIEF GUESTS
   ========================================================= */

/* =========================================================
   ADDITIONAL STAFF — CENTERED BELOW ALL FOUR FACULTY CARDS
   ========================================================= */

.faculty-tree .tree-branch-level .additional-staff-card{
    grid-column:1 / -1 !important;
    justify-self:center !important;
    width:330px !important;
    max-width:330px !important;
    margin:0 auto !important;
}

.faculty-tree .tree-branch-level .additional-staff-card img{
    width:100% !important;
    height:300px !important;
    object-fit:cover !important;
    object-position:center 12% !important;
}

@media(max-width:1200px){
    .faculty-tree .tree-branch-level .additional-staff-card img{
        height:280px !important;
    }
}

@media(max-width:950px){
    .faculty-tree .tree-branch-level .additional-staff-card{
        grid-column:1 / -1 !important;
        width:330px !important;
        max-width:100% !important;
    }
}

@media(max-width:600px){
    .faculty-tree .tree-branch-level .additional-staff-card{
        width:100% !important;
        max-width:330px !important;
    }
}
/* =========================================================
   MEKALA R — PINK STAFF COORDINATOR TITLE
   ========================================================= */

.tree-branch-level .workshop-card:nth-child(3) small {
    color: #19d8ff !important;
}


/* =========================================================
   MAHENDRA ENGINEERING COLLEGE BOX — SIZE UPDATE
   ========================================================= */

.institution-title {
    width: 800px;
    max-width: 90%;
    min-height: 160px;
    padding: 22px 35px;
    margin: 0 auto 28px;
}

/* Keep the college title visually balanced inside the larger box */
.institution-title h2 {
    font-size: clamp(24px, 3.5vw, 42px);
}

/* Larger department pill */
.institution-title p {
    padding: 8px 24px;
}

/* Tablet */
@media (max-width: 800px) {
    .institution-title {
        width: 92%;
        max-width: 92%;
        min-height: 130px;
        padding: 18px 20px;
        margin-bottom: 22px;
    }

    .institution-title h2 {
        font-size: 20px;
    }

    .institution-title p {
        padding: 6px 16px;
    }
}

/* Mobile */
@media (max-width: 500px) {
    .institution-title {
        width: 94%;
        max-width: 94%;
        min-height: 115px;
        padding: 14px 12px;
    }

    .institution-title h2 {
        font-size: 15px;
    }

    .institution-title p {
        padding: 5px 10px;
    }
}


/* =========================================================
   WORKSHOP FACULTY — 3 PHOTOS CENTERED
   ========================================================= */

.workshop-faculty-three {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    width: 100% !important;
    max-width: 1050px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
    align-items: start !important;
}

.workshop-faculty-three .faculty-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

/* Tablet */
@media (max-width: 800px) {
    .workshop-faculty-three {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        max-width: 700px !important;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .workshop-faculty-three {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
    }
}

/* =========================================================
   STUDENT COORDINATORS — 2 PHOTOS CENTERED
   ========================================================= */

.student-coordinator-only-two {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
    width: 100% !important;
    max-width: 700px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
}

.student-coordinator-only-two .student-team-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

@media (max-width: 600px) {
    .student-coordinator-only-two {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
    }
}

/* =========================================================
   FINAL FIX — 3 WORKSHOP FACULTY CARDS CENTERED
   ========================================================= */

.faculty-tree .workshop-faculty-three {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(250px, 1fr)) !important;

    width: 100% !important;
    max-width: 1050px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    gap: 24px !important;

    justify-content: center !important;
    align-items: start !important;
}

.faculty-tree .workshop-faculty-three .faculty-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

/* Keep the photos the same size */
.faculty-tree .workshop-faculty-three .faculty-card img {
    width: 100% !important;
    height: 300px !important;
    object-fit: cover !important;
    object-position: center 12% !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .faculty-tree .workshop-faculty-three {
        grid-template-columns:
            repeat(3, minmax(220px, 1fr)) !important;

        max-width: 900px !important;
        gap: 20px !important;
    }
}


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

@media (max-width: 800px) {

    .faculty-tree .workshop-faculty-three {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        max-width: 700px !important;
        gap: 20px !important;
    }
}


@media (max-width: 600px) {

    .faculty-tree .workshop-faculty-three {
        grid-template-columns: 1fr !important;

        max-width: 350px !important;
        gap: 18px !important;
    }
}

/* =========================================================
   AGENTICTHON — ONLY 3 FACULTY COORDINATORS
   CENTERED
   ========================================================= */

.faculty-tree .agenticthon-faculty-three {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(250px, 1fr)) !important;

    width: 100% !important;

    max-width: 1050px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    gap: 24px !important;

    justify-content: center !important;
    align-items: start !important;
}


/* Cards */

.faculty-tree .agenticthon-faculty-three .faculty-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}


/* Photos */

.faculty-tree .agenticthon-faculty-three .faculty-card img {
    width: 100% !important;
    height: 300px !important;

    object-fit: cover !important;
    object-position: center 12% !important;

    display: block !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .faculty-tree .agenticthon-faculty-three {
        grid-template-columns:
            repeat(3, minmax(220px, 1fr)) !important;

        max-width: 900px !important;

        gap: 20px !important;
    }
}


/* =========================================================
   SMALL TABLET
   ========================================================= */

@media (max-width: 800px) {

    .faculty-tree .agenticthon-faculty-three {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        max-width: 700px !important;

        gap: 20px !important;
    }
}


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

@media (max-width: 600px) {

    .faculty-tree .agenticthon-faculty-three {
        grid-template-columns: 1fr !important;

        max-width: 350px !important;

        gap: 18px !important;
    }
}
/* STAFF COORDINATOR — BLUE */
.faculty-card small,
.student-team-card small,
.student-coordinator-card small {
    color: #19d8ff !important;
}


/* =========================================================
   CHIEF GUEST PHOTO SIZE
   ========================================================= */

.chief-guest-photo {
    position: relative;
    width: 100%;
    height: 320px;              /* CHANGE PHOTO HEIGHT HERE */

    overflow: hidden;

    border-radius: 0;

    border: 0;
    border-bottom: 2px solid rgba(25, 216, 255, 0.65);

    background: #020816;

    box-shadow:
        0 0 20px rgba(25, 216, 255, 0.12),
        0 0 40px rgba(140, 60, 255, 0.08);
}


/* PHOTO INSIDE THE BOX */

.chief-guest-photo img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
    object-position: center center;

    transition: transform 0.5s ease;
}


/* HOVER EFFECT */

.chief-guest-photo:hover img {
    transform: scale(1.04);
}

/* =========================================================
   WORKSHOP STAFF COORDINATORS — BLUE
   ========================================================= */

.workshop-faculty-three .faculty-card small,
.workshop-faculty-three .workshop-card small,
.workshop-faculty-three .hackathon-card small {
    color: #19d8ff !important;
}

/* =========================================================
   FINAL FIXES
   ========================================================= */


/* =========================
   HOD DETAILS
   ========================= */

.hod-card .hod-designation{
    display:block;
    margin-top:4px;
    color:#f2f8ff;
    font-size:16px;
    font-weight:600;
    line-height:1.4;
}

.hod-card .hod-department{
    display:block;
    margin-top:5px;
    margin-bottom:0;
    color:#19d8ff;
    font-size:13px;
    font-style:normal;
    font-weight:600;
    line-height:1.4;
}

.hod-card small{
    display:block;
    margin-top:4px;
}


/* =========================
   CONVENOR BIGGER
   ========================= */

.team-section-title{
    font-size:28px !important;
    font-weight:800 !important;
    letter-spacing:5px !important;
}


/* =========================
   HEADER LOGOS FIX
   ========================= */

header .brand .logos{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
}

header .brand .logos img{
    width:42px !important;
    height:42px !important;
    max-width:42px !important;
    max-height:42px !important;
    min-width:0 !important;
    min-height:0 !important;
    object-fit:contain !important;
    display:block !important;
}


/* =========================
   BRAIN SVG FIX
   ========================= */

.fx .brain-visual{
    position:absolute !important;
    width:190px !important;
    height:155px !important;
    left:50% !important;
    top:41% !important;
    transform:translate(-50%,-50%) !important;
    z-index:2 !important;
    color:#43eaff !important;
    opacity:.18 !important;
    pointer-events:none !important;
}

.fx .brain-visual svg{
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    display:block !important;
}

/* =========================
   HOD CARD ALIGNMENT
   ========================= */

.hod-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
}

.hod-card img{
    width:100% !important;
    display:block !important;
    object-fit:cover !important;
}

.hod-card b{
    width:100% !important;
    display:block !important;
    text-align:center !important;
    margin-top:0 !important;
}

.hod-card .hod-designation{
    width:100% !important;
    display:block !important;
    text-align:center !important;
    margin-top:6px !important;
}

.hod-card .hod-department{
    width:100% !important;
    display:block !important;
    text-align:center !important;
    margin-top:5px !important;
}

.hod-card small{
    width:100% !important;
    display:block !important;
    text-align:center !important;
    margin-top:3px !important;
}

.team-section-title{
    font-size:32px !important;
    font-weight:800 !important;
    letter-spacing:5px !important;
}

/* =========================================================
   CONVENOR + HOD — REFERENCE IMAGE ALIGNMENT
   ========================================================= */

.team-section-title{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:36px;
    width:100%;
    margin:35px 0 28px;
    color:#7eeaff;
    font:700 48px Oxanium,sans-serif;
    letter-spacing:5px;
    text-shadow:
        0 0 12px rgba(25,216,255,.65);
}

/* glowing lines beside CONVENOR */
.team-section-title::before,
.team-section-title::after{
    content:"";
    display:block;
    width:130px;
    height:2px;
    border-radius:10px;
    background:linear-gradient(
        90deg,
        transparent,
        #19d8ff,
        #a850ff
    );
    box-shadow:
        0 0 8px rgba(25,216,255,.7);
}

.team-section-title::after{
    background:linear-gradient(
        90deg,
        #ff2bd6,
        #a850ff,
        transparent
    );
}


/* HOD CARD */
.tree-root-level .faculty-card{
    width:410px !important;
    max-width:410px !important;
    border-width:1.5px;
    border-color:rgba(168,80,255,.85);
    box-shadow:
        0 0 35px rgba(168,80,255,.25),
        0 14px 35px rgba(0,0,0,.65);
}


/* HOD PHOTO */
.tree-root-level .faculty-card img{
    width:100% !important;
    height:394px !important;
    object-fit:cover !important;
    object-position:center 12% !important;
    display:block;
}


/* HOD TEXT — LEFT ALIGNED LIKE REFERENCE */
.hod-card{
    text-align:left !important;
}

.hod-card b{
    display:block !important;
    width:auto !important;
    margin-left:22px !important;
    margin-right:15px !important;
    margin-top:17px !important;
    text-align:left !important;
    font-size:18px !important;
}

.hod-card .hod-designation{
    display:block !important;
    width:auto !important;
    margin:8px 15px 0 22px !important;
    text-align:left !important;
    font-size:17px !important;
    line-height:1.4;
}

.hod-card .hod-department{
    display:block !important;
    width:auto !important;
    margin:8px 15px 0 22px !important;
    text-align:left !important;
    font-size:16px !important;
    line-height:1.4;
}

.hod-card small{
    display:block !important;
    width:auto !important;
    margin:6px 15px 0 22px !important;
    text-align:left !important;
    font-size:15px !important;
    line-height:1.35;
}

.hod-card small:last-child{
    margin-bottom:17px !important;
    color:#9fb3c9 !important;
}


/* SPACE BEFORE FACULTY COORDINATORS */
.tree-root-level{
    margin-bottom:55px;
}


/* DESKTOP */
@media(max-width:800px){

    .team-section-title{
        font-size:32px;
        letter-spacing:3px;
        gap:15px;
    }

    .team-section-title::before,
    .team-section-title::after{
        width:55px;
    }

    .tree-root-level .faculty-card{
        width:calc(100% - 30px) !important;
        max-width:410px !important;
    }

    .tree-root-level .faculty-card img{
        height:320px !important;
    }
}

/* =========================================================
   CONVENOR + HOD — EXACT REFERENCE ALIGNMENT
   ========================================================= */

.team-section-title{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:36px;

    margin:35px 0 28px;

    color:#7eeaff;

    font:
        700 48px Oxanium,sans-serif;

    letter-spacing:5px;

    text-shadow:
        0 0 12px rgba(25,216,255,.65);
}


/* LINES BESIDE CONVENOR */

.team-section-title::before,
.team-section-title::after{
    content:"";

    width:130px;
    height:2px;

    flex-shrink:0;

    border-radius:10px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #19d8ff,
            #a850ff
        );

    box-shadow:
        0 0 8px rgba(25,216,255,.7);
}

.team-section-title::after{
    background:
        linear-gradient(
            90deg,
            #ff2bd6,
            #a850ff,
            transparent
        );
}


/* =========================================================
   HOD CARD
   ========================================================= */

.tree-root-level .faculty-card{
    width:410px !important;
    max-width:410px !important;

    border-width:1.5px;

    border-color:
        rgba(168,80,255,.85);

    box-shadow:
        0 0 35px rgba(168,80,255,.25),
        0 14px 35px rgba(0,0,0,.65);
}


/* HOD PHOTO */

.tree-root-level .faculty-card img{
    width:100% !important;
    height:394px !important;

    object-fit:cover !important;
    object-position:center 12% !important;

    display:block;
}


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

.hod-card{
    text-align:left !important;
}

.hod-card b{
    display:block !important;

    margin-top:17px !important;
    margin-left:22px !important;
    margin-right:15px !important;

    text-align:left !important;

    font-size:18px !important;
}

.hod-card .hod-designation{
    display:block !important;

    margin:
        8px 15px 0 22px !important;

    text-align:left !important;

    font-size:17px !important;
    line-height:1.4;
}

.hod-card .hod-department{
    display:block !important;

    margin:
        8px 15px 0 22px !important;

    text-align:left !important;

    font-size:16px !important;
    line-height:1.4;
}

.hod-card small{
    display:block !important;

    margin:
        6px 15px 0 22px !important;

    text-align:left !important;

    font-size:15px !important;
    line-height:1.35;
}

.hod-card small:last-child{
    margin-bottom:17px !important;
    color:#9fb3c9 !important;
}


/* SPACE BELOW HOD */

.tree-root-level{
    margin-bottom:55px;
}


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

@media(max-width:800px){

    .team-section-title{
        font-size:32px;
        letter-spacing:3px;
        gap:15px;
    }

    .team-section-title::before,
    .team-section-title::after{
        width:55px;
    }

    .tree-root-level .faculty-card{
        width:calc(100% - 30px) !important;
        max-width:410px !important;
    }

    .tree-root-level .faculty-card img{
        height:320px !important;
    }
}

/* HOD FINAL ALIGNMENT */

.tree-root-level .faculty-card{
    width:410px !important;
    max-width:410px !important;
}

.tree-root-level .faculty-card img{
    width:100% !important;
    height:394px !important;
    object-fit:cover !important;
    object-position:center 12% !important;
}

.hod-card{
    text-align:left !important;
}

.hod-card b{
    display:block !important;
    margin:17px 15px 0 22px !important;
    font-size:18px !important;
}

.hod-card .hod-designation{
    display:block !important;
    margin:8px 15px 0 22px !important;
    font-size:17px !important;
}

.hod-card .hod-department{
    display:block !important;
    margin:8px 15px 0 22px !important;
    font-size:16px !important;
    color:#19d8ff !important;
    font-style:normal !important;
}

.hod-card small{
    display:block !important;
    margin:6px 15px 0 22px !important;
    font-size:15px !important;
}

.hod-card small:last-child{
    margin-bottom:17px !important;
    color:#9fb3c9 !important;
}

/* =========================================================
   HOD TEXT — LEFT ALIGN LIKE REFERENCE
   ========================================================= */

.hod-card{
    align-items:stretch !important;
    text-align:left !important;
}

/* Name */
.hod-card b{
    display:block !important;
    width:auto !important;
    margin:17px 15px 0 22px !important;
    text-align:left !important;
}

/* Head of Department */
.hod-card .hod-designation{
    display:block !important;
    width:auto !important;
    margin:8px 15px 0 22px !important;
    text-align:left !important;
}

/* Department */
.hod-card .hod-department{
    display:block !important;
    width:auto !important;
    margin:8px 15px 0 22px !important;
    text-align:left !important;
}

/* College */
.hod-card small{
    display:block !important;
    width:auto !important;
    margin:6px 15px 0 22px !important;
    text-align:left !important;
}

/* Autonomous */
.hod-card small:last-child{
    margin-bottom:17px !important;
    text-align:left !important;
    color:#9fb3c9 !important;
}