body{
    font-family:'Poppins',sans-serif;
    margin:0;
    padding:0;
    background:#f5f7fa;
}

.navbar{
    box-shadow:0 3px 15px rgba(0,0,0,0.1);
}

.hero{
    height:300px;
    background:url('../images/hero-banner.jpg');
    background-size:cover;
    background-position:center;
    color:white;
    text-align:center;
    display:flex;
    align-items:center;
    justify-content:center;
}

.hero h1{
    font-size:55px;
    font-weight:bold;
}

.btn-primary{
    padding:12px 25px;
    border-radius:30px;
}

.course-card{
    border-radius:20px;
    box-shadow:0 0 20px rgba(0,0,0,.1);
    transition:.3s;
}

.course-card:hover{
    transform:translateY(-10px);
}

footer{
    background:#0d6efd;
    color:white;
    padding:30px;
}
/*==============================
        TEAM SECTION
================================*/

.team-section {
    background: #f7fbff;
    padding: 10px 0;
}

.team-card {
    background: #ffffff;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
    transition: all 0.5s ease;
    cursor: pointer;
    position: relative;
    height: 70%;
}

/* Hover Effect */

.team-card:hover {
    transform: translateY(-15px);
    box-shadow: 0 25px 50px rgba(13, 110, 253, 0.25);
}


/*==============================
        IMAGE SECTION
================================*/

.team-image {
    height: 2300px;
    overflow: hidden;
    background: linear-gradient(135deg, #0d6efd, #00c6ff);
}

.team-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.6s ease;
}

/* Image Zoom Effect */

.team-card:hover .team-image img {
    transform: scale(1.1);
}


/*==============================
        CONTENT SECTION
================================*/

.team-content {
    padding: 15px;
    text-align: center;
}

.team-content h4 {
    font-size: 14px;
    font-weight: 700;
    color: #222;
    margin-bottom: 8px;
}

.team-content span {
    display: block;
    color: #0d6efd;
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 15px;
}

.team-content p {
    color: #777;
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 20px;
}


/*==============================
        SOCIAL ICONS
================================*/

.team-social {
    margin-top: 15px;
}

.team-social a {
    display: inline-block;
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    border-radius: 50%;
    background: #0d6efd;
    color: #ffffff;
    margin: 0 5px;
    transition: all 0.4s ease;
    text-decoration: none;
    font-size: 16px;
}

/* Social Icon Hover */

.team-social a:hover {
    background: #ffc107;
    color: #000;
    transform: rotate(360deg);
}


/*==============================
        GLOWING BORDER EFFECT
================================*/

.team-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 25px;
    padding: 2px;
    background: linear-gradient(
        45deg,
        #0d6efd,
        #00c6ff,
        #ffc107
    );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;
    mask-composite: exclude;

    opacity: 0;
    transition: 0.5s;
}

.team-card:hover::before {
    opacity: 1;
}


/*==============================
        FLOATING IMAGE EFFECT
================================*/

.team-image {
    animation: floating 4s ease-in-out infinite;
}

@keyframes floating {

    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-8px);
    }

    100% {
        transform: translateY(0px);
    }
}


/*==============================
        RESPONSIVE DESIGN
================================*/

@media (max-width: 992px) {

    .team-image {
        height: 280px;
    }

}

@media (max-width: 768px) {

    .team-section {
        padding: 50px 0;
    }

    .team-content h4 {
        font-size: 20px;
    }

    .team-image {
        height: 260px;
    }

}

@media (max-width: 576px) {

    .team-image {
        height: 240px;
    }

    .team-content {
        padding: 20px;
    }

}

:root{
    --rniit-primary:#123c69;
    --rniit-secondary:#1769aa;
    --rniit-accent:#ffb703;
    --rniit-dark:#071b2f;
    --rniit-light:#f5f8fc;
    --rniit-text:#506176;
    --rniit-white:#fff;
}
html{scroll-behavior:smooth}
body{
    font-family:'Inter',sans-serif;
    color:var(--rniit-text);
    background:#fff;
    overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6{font-family:'Poppins',sans-serif;color:var(--rniit-dark)}
.section-space{padding:90px 0}
.section-kicker{
    color:var(--rniit-secondary);
    font-size:.82rem;
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:10px;
}
.section-title{
    font-size:clamp(2rem,4vw,3rem);
    font-weight:800;
    margin-bottom:15px;
}
.section-text{max-width:720px;margin:auto;line-height:1.8}

/* HERO */
.rniit-hero{
    min-height:680px;
    position:relative;
    display:flex;
    align-items:center;
    background:
      linear-gradient(115deg,rgba(4,20,38,.93),rgba(12,61,105,.70)),
      url('assets/images/hero-banner.jpg') center/cover no-repeat;
    overflow:hidden;
}
.rniit-hero:before{
    content:"";
    position:absolute;
    width:430px;height:430px;
    right:-130px;top:-150px;
    border:1px solid rgba(255,255,255,.20);
    border-radius:50%;
    box-shadow:0 0 0 70px rgba(255,255,255,.03),0 0 0 140px rgba(255,255,255,.02);
}
.hero-content{position:relative;z-index:2}
.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 16px;
    border:1px solid rgba(255,255,255,.25);
    background:rgba(255,255,255,.10);
    backdrop-filter:blur(10px);
    border-radius:50px;
    color:#fff;
    font-weight:600;
}
.hero-title{
    color:#fff;
    font-size:clamp(2.5rem,6vw,5rem);
    font-weight:800;
    line-height:1.08;
    margin:22px 0 18px;
}
.hero-title span{color:var(--rniit-accent)}
.hero-subtitle{
    color:rgba(255,255,255,.86);
    font-size:1.15rem;
    max-width:700px;
    line-height:1.8;
}
.btn-rniit{
    background:var(--rniit-accent);
    border:none;
    color:#17212b;
    font-weight:800;
    padding:13px 24px;
    border-radius:10px;
    transition:.3s;
}
.btn-rniit:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(0,0,0,.20)}
.btn-outline-rniit{
    color:#fff;
    border:1px solid rgba(255,255,255,.5);
    padding:12px 24px;
    border-radius:10px;
    font-weight:700;
    transition:.3s;
}
.btn-outline-rniit:hover{background:#fff;color:var(--rniit-primary);transform:translateY(-3px)}
.hero-stats{
    margin-top:55px;
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}
.hero-stat{
    min-width:155px;
    padding:17px 20px;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.14);
    backdrop-filter:blur(10px);
    border-radius:14px;
    color:#fff;
}
.hero-stat strong{display:block;font-size:1.35rem;color:var(--rniit-accent)}
.hero-stat small{color:rgba(255,255,255,.75)}

/* AFFILIATION */
.affiliation-box{
    margin-top:-55px;
    position:relative;
    z-index:5;
    background:#fff;
    border-radius:20px;
    padding:28px 35px;
    box-shadow:0 18px 50px rgba(14,48,78,.12);
}
.affiliation-box i{font-size:30px;color:var(--rniit-accent)}
.affiliation-box strong{color:var(--rniit-dark)}

/* CARDS */
.modern-card{
    height:100%;
    background:#fff;
    border:1px solid #e8eef5;
    border-radius:18px;
    padding:30px;
    box-shadow:0 10px 30px rgba(20,55,90,.06);
    transition:.35s ease;
}
.modern-card:hover{
    transform:translateY(-9px);
    box-shadow:0 20px 45px rgba(20,55,90,.13);
}
.icon-box{
    width:62px;height:62px;
    display:grid;place-items:center;
    border-radius:16px;
    background:linear-gradient(135deg,#e8f3ff,#f7fbff);
    color:var(--rniit-secondary);
    font-size:25px;
    margin-bottom:22px;
}
.modern-card h4{font-size:1.15rem;font-weight:700}
.modern-card p{line-height:1.7;margin-bottom:0}

/* TEAM */
.team-card{
    overflow:hidden;
    border-radius:20px;
    background:#fff;
    border:1px solid #e8eef5;
    box-shadow:0 10px 30px rgba(20,55,90,.07);
    transition:.35s;
    height:100%;
}
.team-card:hover{transform:translateY(-10px);box-shadow:0 22px 50px rgba(20,55,90,.14)}
.team-image{height:285px;overflow:hidden;background:#edf3f9}
.team-image img{width:100%;height:100%;object-fit:cover;transition:.5s}
.team-card:hover .team-image img{transform:scale(1.07)}
.team-content{padding:2px}
.team-content h4{font-size:1.12rem;margin-bottom:6px}
.team-content span{font-size:.9rem;color:var(--rniit-secondary);font-weight:600}
.team-social{display:flex;gap:8px;margin-top:17px}
.team-social a{
    width:34px;height:34px;border-radius:50%;
    display:grid;place-items:center;
    background:#f1f6fb;color:var(--rniit-secondary);
    text-decoration:none;transition:.25s
}
.team-social a:hover{background:var(--rniit-primary);color:#fff;transform:translateY(-2px)}

/* COURSES */
.course-card{position:relative;overflow:hidden}
.course-number{
    position:absolute;right:18px;top:13px;
    font-size:3rem;font-weight:800;color:#edf3f8;
}
.course-card h4{position:relative;z-index:1}
.course-card .btn{border-radius:9px}

/* WHY */
.why-section{
    background:linear-gradient(135deg,var(--rniit-dark),var(--rniit-primary));
    color:#fff;
}
.why-section h2,.why-section h3{color:#fff}
.why-item{
    padding:2px 8px;
    border-right:1px solid rgba(255,255,255,.12);
}
.why-item:last-child{border-right:0}
.why-icon{font-size:27px;color:var(--rniit-accent);margin-bottom:13px}

/* CTA */
.admission-cta{
    background:linear-gradient(120deg,#ffb703,#ffd166);
    border-radius:25px;
    padding:5px;
    position:relative;
    overflow:hidden;
}
.admission-cta:after{
    content:"";
    position:absolute;width:240px;height:240px;
    border:35px solid rgba(255,255,255,.16);
    border-radius:50%;right:-70px;top:-100px
}

/* GALLERY */
.gallery-item{
    height:245px;border-radius:18px;overflow:hidden;position:relative;
    box-shadow:0 10px 25px rgba(20,55,90,.09)
}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:.5s}
.gallery-item:after{
    content:"\f00e";
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    position:absolute;inset:0;display:grid;place-items:center;
    background:rgba(7,27,47,.55);color:#fff;font-size:28px;
    opacity:0;transition:.3s
}
.gallery-item:hover img{transform:scale(1.08)}
.gallery-item:hover:after{opacity:1}

/* NOTIFICATION */
.notice-bar{background:var(--rniit-primary);color:#fff}
.notice-label{
    background:var(--rniit-accent);color:#17212b;
    padding:10px 18px;border-radius:9px;font-weight:800;white-space:nowrap
}

/* CONTACT */
.contact-card{
    background:var(--rniit-light);
    border-radius:20px;padding:35px;height:100%
}
.contact-line{display:flex;gap:16px;margin-bottom:23px}
.contact-line .contact-icon{
    min-width:45px;height:45px;display:grid;place-items:center;
    border-radius:12px;background:#fff;color:var(--rniit-secondary);
    box-shadow:0 6px 18px rgba(20,55,90,.07)
}
.contact-line strong{display:block;color:var(--rniit-dark);margin-bottom:4px}
.map-frame{width:100%;height:100%;min-height:360px;border:0;border-radius:20px}

/* WHATSAPP */
.whatsapp-float{
    position:fixed;right:22px;bottom:22px;z-index:999;
    width:58px;height:58px;border-radius:50%;
    display:grid;place-items:center;background:#25D366;color:#fff;
    text-decoration:none;font-size:28px;
    box-shadow:0 10px 30px rgba(0,0,0,.20);
    transition:.3s
}
.whatsapp-float:hover{transform:scale(1.08);color:#fff}

/* RESPONSIVE */
@media(max-width:767px){
    .rniit-hero{min-height:650px}
    .hero-title{font-size:2.55rem}
    .hero-stats{margin-top:35px}
    .hero-stat{min-width:135px}
    .section-space{padding:65px 0}
    .affiliation-box{margin-top:-35px;padding:22px}
    .admission-cta{padding:35px 25px}
    .why-item{border-right:0;border-bottom:1px solid rgba(255,255,255,.12)}
    .why-item:last-child{border-bottom:0}
}

