
body{
font-family:'Segoe UI',sans-serif;
}

/* ================= HEADER ================= */

.header{
position:fixed;
width:100%;
z-index:999;
transition:.4s;
padding:18px 0;
background:rgba(0,0,0,0.35);   /* TRANSPARENT */
backdrop-filter: blur(6px);
}

.header.scrolled{
background:#000;   /* SCROLL COLOR */
padding:10px 0;
box-shadow:0 5px 25px rgba(0,0,0,.5);
}

.logo{
height:70px;
transition:.4s;
}

.header.scrolled .logo{
height:55px;
}

.navbar-nav .nav-link{
color:white;
font-weight:600;
margin:0 15px;
position:relative;
text-transform: uppercase;
}

.nav-link.active{
color:#00c6ff !important;
}

.nav-link::after{
content:'';
position:absolute;
width:0;
height:2px;
background:#00c6ff;
left:0;
bottom:-6px;
transition:.4s;
}

.nav-link:hover::after,
.nav-link.active::after{
width:100%;
}

/* MOBILE MENU FIX */

@media(max-width:991px){

.navbar-collapse{
background:#000;
padding:20px;
margin-top:15px;
border-radius:10px;
}

.navbar-nav .nav-link{
margin:12px 0;
}

}

/* ================= HERO ================= */

.hero{
height:75vh;
background:url('image/hero.jpg') center/cover no-repeat;
position:relative;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
padding-top:120px;
}

.hero::before{
content:'';
position:absolute;
width:100%;
height:100%;
background:rgba(0,0,0,.65);
top:0;
left:0;
}

.hero-content{
position:relative;
z-index:2;
max-width:900px;
padding:20px;
}

.hero h1{
font-size:60px;
font-weight:700;
}

.hero p{
font-size:22px;
margin:25px 0 35px;
}

.hero-btn{
background:#00c6ff;
border:none;
padding:15px 40px;
border-radius:40px;
font-weight:600;
transition:.4s;
}

.hero-btn:hover{
background:white;
color:black;
transform:translateY(-5px);
}

/* HERO RESPONSIVE */

@media(max-width:768px){

.hero h1{
font-size:38px;
}

.hero p{
font-size:18px;
}

}
/* ===== PREMIUM FOOTER NEW ===== */

.footer{
background:linear-gradient(120deg,#061421,#0c2438);
color:#cfd8e3;
padding:80px 0 0;
}

.footer-logo{
height:75px;
margin-bottom:20px;

}

.footer h5{
color:white;
margin-bottom:25px;
font-weight:800;
font-size:25px;
}

.footer p{
font-size:15px;
line-height:1.7;
}
a{
    text-decoration: none;
}
.footer-links a{
display:block;
color:#cfd8e3;
text-decoration:none;
margin-bottom:12px;
transition:.3s;
font-size:15px;
}

.footer-links a i{
color:#00c6ff;
margin-right:8px;
}

.footer-links a:hover{
color:#00c6ff;
padding-left:6px;
}

.footer-contact p i{
color:#00c6ff;
margin-right:10px;
}

.footer-social i{
height:40px;
width:40px;
line-height:40px;
background:#132f4c;
text-align:center;
border-radius:50%;
margin-right:8px;
transition:.3s;
}

.footer-social i:hover{
background:#00c6ff;
color:black;
transform:translateY(-4px);
}

.footer-bottom{
border-top:1px solid #193a5b;
margin-top:50px;
padding:18px 0;
font-size:14px;
}

.footer-bottom .right{
text-align:right;
}

@media(max-width:768px){
.footer-bottom .right{
text-align:left;
margin-top:8px;
}
}
/* ================= FOOTER RESPONSIVE ================= */

@media (max-width:991px){

.footer{
padding:60px 0 0;
}

.footer-logo{
height:65px;
}

.footer h5{
font-size:22px;
margin-bottom:18px;
}

.footer-links a{
font-size:14px;
margin-bottom:10px;
}

.footer-contact p{
font-size:14px;
}

.footer-social{
margin-top:15px;
}

.footer-social i{
height:38px;
width:38px;
line-height:38px;
}

}

/* MOBILE VIEW */

@media (max-width:768px){

.footer{
text-align:center;
padding:50px 0 0;
}

.footer .row > div{
margin-bottom:35px;
}

.footer-logo{
height:60px;
}

.footer h5{
font-size:20px;
}

.footer p{
font-size:14px;
}

.footer-links a:hover{
padding-left:0;
}

.footer-social{
display:flex;
justify-content:center;
}

.footer-bottom{
text-align:center;
}

.footer-bottom .right{
text-align:center;
margin-top:5px;
}

}

/* SMALL MOBILE */

@media (max-width:480px){

.footer{
padding:45px 0 0;
}

.footer-logo{
height:55px;
}

.footer h5{
font-size:18px;
}

.footer p,
.footer-links a{
font-size:13px;
}

.footer-social i{
height:35px;
width:35px;
line-height:35px;
font-size:14px;
}

}


/* ===== ABOUT SECTION ===== */


.about{
padding:100px 0;
background:#f4f8fc;
}

.about-title{
text-align:center;
margin-bottom:60px;
position:relative;
}

.about-title h2{
font-size:42px;
font-weight:700;
display:inline-block;
position:relative;
}

.about-title h2:before{
content:'';
position:absolute;
width:80px;
height:3px;
background:#00c6ff;
left:-100px;
top:50%;
}

.about-title h2:after{
content:'';
position:absolute;
width:80px;
height:3px;
background:#00c6ff;
right:-100px;
top:50%;
}

/* IMAGE BORDER FRAME */

.about-img{
position:relative;
padding:15px;
border:3px solid #00c6ff;
border-radius:15px;
}

.about-img img{
width:100%;
border-radius:10px;
}

/* CONTENT DESIGN */

.about-content{
padding-left:40px;
}

.about-content h3{
font-weight:700;
margin-bottom:20px;
font-size:32px;
}

.about-content p{
color:#555;
line-height:1.8;
font-size:16px;
}

.about-feature{
margin-top:25px;
}

.about-feature div{
margin-bottom:15px;
font-weight:600;
}

.about-feature i{
color:#00c6ff;
margin-right:10px;
font-size:18px;
}

.about-btn{
margin-top:25px;
background:#00c6ff;
border:none;
padding:14px 35px;
border-radius:30px;
font-weight:600;
transition:.4s;
}

.about-btn:hover{
background:black;
color:white;
transform:translateY(-4px);
}

/* RESPONSIVE */

@media(max-width:991px){

.about-content{
padding-left:0;
margin-top:40px;
text-align:center;
}

.about-title h2:before,
.about-title h2:after{
display:none;
}

}


/* ===== GOOGLE FONT ===== */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');

.courses{
padding:120px 0;
background:#ede9d87a;
}

.course-title{
text-align:center;
margin-bottom:70px;
}

.course-title h2{
font-size:44px;
font-weight:800;
position:relative;
display:inline-block;
}

.course-title h2:before,
.course-title h2:after{
content:'';
position:absolute;
width:110px;
height:4px;
background:linear-gradient(to right,#00c6ff,#0072ff);
top:50%;
}

.course-title h2:before{ left:-130px; }
.course-title h2:after{ right:-130px; }

.course-category{
font-size:28px;
font-weight:700;
margin:50px 0 25px;
border-left:6px solid #0072ff;
padding-left:15px;
}

/* CARD */

.course-card-new{
background:#34332c38;
padding:40px 25px;
border-radius:18px;
text-align:center;
box-shadow:0 20px 40px rgb(25 53 59 / 40%);
transition:.5s;
position:relative;
overflow:hidden;
height:100%;
}

.course-card-new:hover{
transform:translateY(-12px);
box-shadow:0 30px 60px rgba(0,0,0,.15);
}

.course-card-new:after{
content:'';
position:absolute;
width:0;
height:4px;
background:linear-gradient(to right,#00c6ff,#0072ff);
left:0;
bottom:0;
transition:.4s;
}

.course-card-new:hover:after{
width:100%;
}

.course-icon-new{
height:75px;
width:75px;
line-height:75px;
background:linear-gradient(135deg,#00c6ff,#0072ff);
color:white;
border-radius:50%;
font-size:28px;
margin:0 auto 15px;
}

.course-card-new h4{
font-weight:700;
margin-bottom:10px;
}

.course-card-new p{
font-size:15px;
color:#666;
}

.course-duration-new{
display:inline-block;
margin-top:15px;
background:#eef6ff;
color:#0072ff;
padding:6px 16px;
border-radius:30px;
font-weight:600;
font-size:13px;
}
/* ===== ULTRA PREMIUM CONTACT ===== */

.contact{
padding:120px 0;
background:linear-gradient(135deg,#eef5ff,#ffffff);
}

.contact-title{
text-align:center;
margin-bottom:70px;
}

.contact-title h2{
font-size:46px;
font-weight:800;
letter-spacing:1px;
position:relative;
display:inline-block;
}

.contact-title h2:before,
.contact-title h2:after{
content:'';
position:absolute;
width:100px;
height:4px;
background:linear-gradient(to right,#00c6ff,#0072ff);
top:50%;
}

.contact-title h2:before{ left:-120px; }
.contact-title h2:after{ right:-120px; }

/* ADDRESS CARDS */

.address-card{
background:white;
padding:30px 20px;
border-radius:20px;
text-align:center;
transition:.5s;
box-shadow:0 20px 40px rgba(0,0,0,.08);
height:100%;
position:relative;
overflow:hidden;
}

.address-card:before{
content:'';
position:absolute;
width:100%;
height:4px;
background:linear-gradient(to right,#00c6ff,#0072ff);
left:0;
top:0;
}

.address-card:hover{
transform:translateY(-12px);
box-shadow:0 30px 60px rgba(0,0,0,.15);
}

.address-icon{
height:80px;
width:80px;
line-height:80px;
background:linear-gradient(135deg,#00c6ff,#0072ff);
color:white;
border-radius:50%;
margin:0 auto 15px;
font-size:30px;

}

.address-card h5{
font-weight:700;
margin-bottom:8px;
}

.address-card p{
color:#666;
}

/* MAP */

.map-title{
font-weight:700;
margin-bottom:15px;
font-size:22px;
text-align: center;
}

.map-box{
background:white;
padding:15px;
border-radius:20px;
box-shadow:0 20px 40px rgba(0,0,0,.08);
overflow:hidden;
transition:.5s;
}

.map-box:hover{
transform:scale(1.02);
}

.map-box iframe{
width:100%;
height:420px;
border:0;
border-radius:15px;
}

/* FORM */

.contact-form{
background:white;
padding:45px;
border-radius:20px;
box-shadow:0 20px 40px rgba(0,0,0,.08);
}

.contact-form h4{
font-weight:700;
margin-bottom:25px;
}

.contact-form .form-control{
border-radius:30px;
padding:14px 20px;
border:1px solid #ddd;
margin-bottom:15px;
transition:.3s;
}

.contact-form .form-control:focus{
border-color:#0072ff;
box-shadow:0 0 10px rgba(0,114,255,.2);
}

.contact-btn{
background:linear-gradient(to right,#00c6ff,#0072ff);
border:none;
padding:14px;
border-radius:30px;
width:100%;
font-weight:700;
color:white;
transition:.4s;
}

.contact-btn:hover{
transform:translateY(-3px);
box-shadow:0 15px 30px rgba(0,114,255,.3);
}

/* responsive */

@media(max-width:991px){

.contact-title h2:before,
.contact-title h2:after{
display:none;
}

}