:root{

--primary:#003b95;
--secondary:#0d6efd;
--accent:#ffc107;
--dark:#1f2937;
--light:#f8f9fa;

}

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

body{
font-family:'Poppins',sans-serif;
overflow-x:hidden;
}

/* TOPBAR */

.topbar{
background:var(--primary);
padding:10px 0;
color:#fff;
font-size:14px;
}

.topbar-content{
display:flex;
justify-content:space-between;
align-items:center;
}

.topbar a{
color:white;
text-decoration:none;
margin-right:20px;
}

/* NAVBAR */

.navbar{
background:white;
box-shadow:0 5px 20px rgba(0,0,0,.08);
}

.navbar-brand{
display:flex;
align-items:center;
font-size:28px;
font-weight:700;
}

.navbar-brand img{
height:55px;
margin-right:10px;
}

.nav-link{
font-weight:600;
margin-left:10px;
}

.nav-link:hover{
color:var(--primary)!important;
}

.admission-btn{
background:var(--accent);
padding:10px 20px;
border-radius:30px;
font-weight:600;
}

/* FOOTER */

footer{
background:#101828;
color:white;
padding:60px 0 20px;
}

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

footer ul li{
margin-bottom:10px;
}

footer a{
color:white;
text-decoration:none;
}

footer a:hover{
color:var(--accent);
}

/* WHATSAPP */

.whatsapp-btn{
position:fixed;
right:20px;
bottom:20px;
width:60px;
height:60px;
background:#25D366;
color:white;
display:flex;
justify-content:center;
align-items:center;
font-size:30px;
border-radius:50%;
z-index:999;
text-decoration:none;
}

/* MOBILE */

@media(max-width:768px){

.topbar-content{
flex-direction:column;
gap:8px;
text-align:center;
}

.navbar-brand{
font-size:22px;
}

}
/* HERO */

.hero{
height:90vh;
background:
linear-gradient(rgba(0,0,0,.65),
rgba(0,0,0,.65)),
url('../images/hero.jpg');
background-size:cover;
background-position:center;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
position:relative;
}

.hero-content{
max-width:100%;
}

.hero-badge{
background:#ffc107;
color:#000;
padding:10px 20px;
border-radius:30px;
font-weight:600;
display:inline-block;
margin-bottom:20px;
}

.hero h1{
font-size:72px;
font-weight:800;
margin-bottom:20px;
}

.hero p{
font-size:20px;
margin-bottom:30px;
}

.hero-btns{
display:flex;
justify-content:center;
gap:15px;
}

/* FLOATING */

.floating-features{
margin-top:-60px;
position:relative;
z-index:10;
}

.feature-card{
background:white;
padding:30px;
border-radius:15px;
box-shadow:0 10px 30px rgba(0,0,0,.1);
text-align:center;
transition:.3s;
}

.feature-card:hover{
transform:translateY(-10px);
}

.feature-card i{
font-size:45px;
color:#003b95;
margin-bottom:15px;
}

/* WELCOME */

.welcome{
padding:100px 0;
}

.section-tag{
color:#003b95;
font-weight:700;
text-transform:uppercase;
}

.welcome h2{
font-size:42px;
font-weight:800;
margin:15px 0;
}

.welcome-list{
padding-left:20px;
margin-top:20px;
}

/* HIGHLIGHTS */

.highlights{
padding:80px 0;
background:#003b95;
color:white;
}

.counter-box h2{
font-size:55px;
font-weight:800;
}

/* WHY US */

.why-us{
padding:100px 0;
background:#f8f9fa;
}

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

.section-heading h2{
font-size:42px;
font-weight:800;
}

.why-card{
background:white;
padding:35px;
border-radius:15px;
text-align:center;
height:100%;
box-shadow:0 5px 20px rgba(0,0,0,.08);
transition:.3s;
}

.why-card:hover{
transform:translateY(-10px);
}

.why-card i{
font-size:50px;
color:#003b95;
margin-bottom:15px;
}

.page-banner{
height:350px;

background:
linear-gradient(
rgba(0,0,0,.6),
rgba(0,0,0,.6)
),
url('../images/banner.jpg');

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

display:flex;
align-items:center;
justify-content:center;

text-align:center;

color:white;
}

.page-banner h1{
font-size:60px;
font-weight:800;
}

.principal-section{
    padding:100px 0;
    background:#f8fafc;
}

.principal-card{
    background:#fff;
    border-radius:25px;
    padding:50px;
    box-shadow:0 15px 40px rgba(0,0,0,0.08);
    position:relative;
    overflow:hidden;
}

.principal-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:8px;
    height:100%;
    background:#0d6efd;
}

.principal-img{
    position:relative;
}

.principal-img img{
    width:100%;
    max-width:320px;
    border-radius:20px;
    box-shadow:0 15px 35px rgba(0,0,0,0.15);
    transition:.4s;
}

.principal-img img:hover{
    transform:translateY(-8px);
}

.small-title{
    display:inline-block;
    background:#eaf2ff;
    color:#0d6efd;
    padding:8px 18px;
    border-radius:30px;
    font-size:13px;
    font-weight:700;
    letter-spacing:1px;
    margin-bottom:15px;
}

.principal-card h2{
    font-size:42px;
    font-weight:700;
    margin-bottom:20px;
    color:#1a1a1a;
}

.principal-card p{
    font-size:16px;
    line-height:1.9;
    color:#666;
}

.principal-card h5{
    color:#0d6efd;
    font-weight:700;
}

@media(max-width:768px){

    .principal-card{
        padding:30px;
    }

    .principal-card h2{
        font-size:30px;
        margin-top:20px;
    }

}
.page-banner{
    height:500px;
    background:url('../images/hero/1.png') center center/cover no-repeat;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}

.page-banner .overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.55);
}

.banner-content{
    position:relative;
    z-index:2;
    color:#fff;
}

.banner-content h1{
    font-size:70px;
    font-weight:800;
    margin-bottom:15px;
}

.banner-content p{
    font-size:22px;
}