/*=====================================
        GOOGLE FONT
======================================*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Noto+Sans+Devanagari:wght@400;500;600;700&display=swap');

/*=====================================
            RESET
======================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{

    font-family:'Poppins',sans-serif;

    background:#ffffff;

    color:#333;

    overflow-x:hidden;

}

a{

    text-decoration:none;

}

ul{

    list-style:none;

}

img{

    max-width:100%;

    display:block;

}


/*=====================================
        ROOT COLORS
======================================*/

:root{

    --primary:#312E81;

    --primary-dark:#1E1B4B;

    --primary-light:#4338CA;

    --cyan:#06B6D4;

    --cyan-light:#67E8F9;

    --white:#ffffff;

    --light:#F8FAFC;

    --text:#374151;

}

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

.college-header{
    width:100%;
    min-height:120px;
    padding:15px 60px;
    display:flex;
    align-items:center;

    background:linear-gradient(
        135deg,
        var(--primary-dark),
        var(--primary),
        var(--primary-light)
    );

    border-bottom:4px solid var(--cyan);
}




/*=====================================
              LOGO
======================================*/

.college-logo{
    width:120px;
    flex-shrink:0;
}

.college-logo img{
    width:120px;
    height:120px;
    object-fit:contain;
    transition:.35s;
}

.college-logo img:hover{
    transform:scale(1.05);
}


/*=====================================
          COLLEGE INFORMATION
======================================*/
/*=====================================
        CLIENT TOP LINE
======================================*/

.college-top-line{
    font-family:'Noto Sans Devanagari',sans-serif;
    color:#FBBF24;
    font-size:15px;
    font-weight:600;
    margin-bottom:6px;
    line-height:1.5;
}

.college-info{
    flex:1;
    padding:0 30px;
    text-align:center;
}

.college-info h1{
    font-family:'Noto Sans Devanagari',sans-serif;
    font-size:31px;
    font-weight:700;
    color:var(--white);
    margin-bottom:8px;
}

.college-info p{
    font-family:'Noto Sans Devanagari',sans-serif;
    color:#E5E7EB;
    font-size:16px;
    margin-bottom:6px;
}

.college-info span{
    color:var(--cyan-light);
    font-size:14px;
    font-weight:500;
}
/*=====================================
            NAVBAR
======================================*/

.navbar{

    width:100%;

    position:sticky;

    top:0;

    z-index:1000;

    background:rgba(49,46,129,.35);

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    border-bottom:1px solid rgba(103,232,249,.25);

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

    transition:.35s;

}

/*=====================================
        NAV CONTAINER
======================================*/

.nav-container{

    width:90%;

    max-width:1300px;

    margin:auto;

    display:flex;

    justify-content:center;

    align-items:center;

    height:70px;

}

/*=====================================
            NAVIGATION
======================================*/

nav{

    width:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

/*=====================================
            MENU
======================================*/

.nav-links{

    display:flex;

    align-items:center;

    gap:40px;

}

.nav-links li{

    list-style:none;

}

.nav-links a{

    position:relative;

    color:#ffffff;

    font-size:16px;

    font-weight:500;

    letter-spacing:.3px;

    transition:.35s;

}

/*=====================================
        HOVER UNDERLINE
======================================*/

.nav-links a::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:-8px;

    transform:translateX(-50%);

    width:0;

    height:2px;

    background:#06B6D4;

    border-radius:20px;

    transition:.35s;

}

.nav-links a:hover::after,

.nav-links a.active::after{

    width:100%;

}

.nav-links a:hover,

.nav-links a.active{

    color:#67E8F9;

}

/*=====================================
        HAMBURGER
======================================*/

.hamburger{

    display:none;

    color:#ffffff;

    font-size:30px;

    cursor:pointer;

    transition:.3s;

}

.hamburger:hover{

    color:#67E8F9;

}

/*=====================================
        STICKY EFFECT
======================================*/

.navbar.scrolled{

    background:rgba(30,27,75,.95);

    backdrop-filter:none;

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

}

/*=====================================
        SMOOTH TRANSITION
======================================*/

.nav-links a,

.phone,

.hamburger{

    transition:all .3s ease;

}

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

.footer{
    background:#1E1B4B;
    color:#CBD5E1;
    padding:80px 0 25px;
}


/*=========================================
                CONTAINER
=========================================*/

.footer .container{
    max-width:1300px;
    margin:auto;
    padding:0 20px;
}


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

.footer-grid{
    display:grid;
    grid-template-columns:2fr 1fr 1.3fr 1fr;
    gap:45px;
}


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

.footer-box img{
    width:110px;
    height:110px;
    object-fit:contain;
    margin-bottom:20px;
    transition:.4s;
}

.footer-box img:hover{
    transform:scale(1.05);
}

.footer-box h3{
    color:#fff;
    font-size:22px;
    margin-bottom:18px;
    font-weight:600;
}

.footer-box h4{
    color:#fff;
    font-size:20px;
    margin-bottom:22px;
    position:relative;
}

.footer-box h4::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-8px;
    width:45px;
    height:3px;
    background:#06B6D4;
    border-radius:20px;
}

.footer-box p{
    line-height:1.8;
    margin-bottom:12px;
    color:#CBD5E1;
    font-size:15px;
}


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

.footer-box ul{
    list-style:none;
    padding:0;
    margin:0;
}

.footer-box ul li{
    margin-bottom:15px;
}

.footer-box ul li a{
    color:#CBD5E1;
    text-decoration:none;
    transition:.3s;
}

.footer-box ul li a:hover{
    color:#06B6D4;
    padding-left:8px;
}


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

.footer-box i{
    color:#06B6D4;
    margin-right:10px;
}


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

.social-links{
    display:flex;
    gap:15px;
    margin-top:25px;
}

.social-links a{
    width:45px;
    height:45px;
    background:rgba(255,255,255,.08);
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#fff;
    text-decoration:none;
    transition:.35s;
}

.social-links a:hover{
    background:#06B6D4;
    color:#0B2E4F;
    transform:translateY(-5px);
}


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

.footer-bottom{
    margin-top:60px;
    padding-top:25px;
    border-top:1px solid rgba(255,255,255,.15);
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:15px;
}

.footer-bottom p{
    color:#94A3B8;
    font-size:15px;
    margin:0;
}

.footer-bottom a{
    text-decoration:none;
}

.footer-bottom strong{
    color:#FBBF24;
    transition:.3s;
}

.footer-bottom strong:hover{
    color:#06B6D4;
}