body{

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

background:#f7f9fc;

color:#222;

}

.navbar{

background:#0B3D91;

}

.navbar-brand{

font-size:28px;

font-weight:700;

}

.nav-link{

color:#fff !important;

font-weight:500;

}

.nav-link:hover{

color:#ffc107 !important;

}

.btn-warning{

border-radius:30px;

font-weight:600;

}

footer{

background:#0B3D91;

color:#fff;

padding:40px 0;

margin-top:80px;

}

.section-title{

font-size:40px;

font-weight:700;

color:#0B3D91;

}

.shadow-card{

background:#fff;

border-radius:20px;

padding:30px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.3s;

}

.shadow-card:hover{

transform:translateY(-8px);

}

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

.hero-section{

padding:100px 0;

background:linear-gradient(135deg,#0B3D91,#1456C5);

color:#fff;

overflow:hidden;

}

.hero-title{

font-size:58px;

font-weight:700;

line-height:1.2;

}

.hero-title span{

color:#FFC107;

}

.hero-text{

font-size:20px;

margin-top:25px;

line-height:1.8;

}

.hero-image{

max-width:420px;

animation:float 4s ease-in-out infinite;

}

@keyframes float{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-15px);

}

100%{

transform:translateY(0px);

}

}

@media(max-width:768px){

.hero-section{

text-align:center;

padding:70px 0;

}

.hero-title{

font-size:40px;

}

.hero-text{

font-size:18px;

}

.hero-image{

margin-top:40px;

max-width:300px;

}

}

/*===================================

HERO

====================================*/

.hero-section{

padding:100px 0;

background:linear-gradient(135deg,#0B3D91,#1A5FD1);

color:#fff;

}

.hero-badge{

background:#FFC107;

padding:10px 25px;

border-radius:50px;

font-weight:600;

color:#000;

}

.hero-title{

font-size:60px;

font-weight:700;

line-height:1.3;

}

.hero-title span{

color:#FFC107;

}

.hero-subtitle{

font-size:20px;

line-height:1.8;

margin-top:25px;

}

.hero-btn .btn{

padding:14px 35px;

font-weight:600;

border-radius:40px;

}

.hero-image{

max-width:420px;

animation:float 4s infinite;

}

@keyframes float{

0%{transform:translateY(0);}

50%{transform:translateY(-15px);}

100%{transform:translateY(0);}

}

/*=====================

COUNTER

======================*/

.counter-section{

padding:60px 0;

background:#fff;

}

.counter-box{

padding:30px;

text-align:center;

background:#fff;

border-radius:15px;

box-shadow:0 15px 30px rgba(0,0,0,.08);

transition:.4s;

}

.counter-box:hover{

transform:translateY(-10px);

}

.counter-box h2{

font-size:45px;

color:#0B3D91;

font-weight:700;

}

.counter-box p{

font-size:18px;

margin-top:10px;

}

/*=========================================

WHY STUDY HOPE

==========================================*/

.why-study{

background:#f8f9fc;

}

.section-badge{

background:#FFC107;

padding:8px 20px;

border-radius:40px;

font-weight:600;

color:#000;

}

.section-title{

font-size:42px;

font-weight:700;

color:#0B3D91;

}

.section-subtitle{

font-size:18px;

color:#666;

margin-top:20px;

}

.feature-card{

background:#fff;

padding:35px 25px;

border-radius:18px;

text-align:center;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.35s;

height:100%;

}

.feature-card:hover{

transform:translateY(-10px);

}

.feature-icon{

width:80px;

height:80px;

background:#0B3D91;

border-radius:50%;

margin:auto;

display:flex;

justify-content:center;

align-items:center;

margin-bottom:25px;

}

.feature-icon i{

font-size:36px;

color:#fff;

}

.feature-card h4{

font-size:24px;

font-weight:700;

margin-bottom:15px;

}

.feature-card p{

font-size:16px;

color:#666;

line-height:1.7;

}

/*======================================

COURSES

=======================================*/

.featured-course{

background:#ffffff;

}

.course-card{

background:#fff;

border-radius:20px;

overflow:hidden;

box-shadow:0 15px 35px rgba(0,0,0,.08);

transition:.35s;

height:100%;

}

.course-card:hover{

transform:translateY(-10px);

}

.course-image img{

width:100%;

height:260px;

object-fit:cover;

}

.course-body{

padding:30px;

}

.course-tag{

background:#FFC107;

padding:6px 18px;

border-radius:40px;

font-size:14px;

font-weight:600;

}

.course-body h3{

margin-top:20px;

font-weight:700;

color:#0B3D91;

}

.course-body p{

margin:20px 0;

line-height:1.8;

}

.course-body ul{

padding-left:18px;

line-height:2;

}

.course-body .btn{

margin-top:20px;

border-radius:35px;

padding:12px 25px;

}

/*=======================================

TRUST SECTION

========================================*/

.trust-section{

background:#f8fbff;

}

.trust-card{

background:#fff;

padding:35px;

border-radius:20px;

text-align:center;

box-shadow:0 12px 30px rgba(0,0,0,.08);

transition:.35s;

height:100%;

}

.trust-card:hover{

transform:translateY(-10px);

}

.trust-card i{

font-size:55px;

color:#0B3D91;

margin-bottom:20px;

}

.trust-card h4{

font-size:24px;

font-weight:700;

margin-bottom:15px;

}

.trust-card p{

font-size:16px;

color:#666;

line-height:1.8;

}

/*==========================
TRAINER
==========================*/

.trainer-section{

background:#ffffff;

}

.trainer-image{

max-width:380px;

border-radius:20px;

box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.trainer-list{

list-style:none;

padding:0;

}

.trainer-list li{

padding:10px 0;

font-size:17px;

}

.trainer-list i{

color:#0B3D91;

margin-right:10px;

}

/*==========================
CTA
==========================*/

.cta-section{

padding:80px 0;

background:linear-gradient(135deg,#0B3D91,#1456C5);

color:#fff;

text-align:center;

}

.cta-section h2{

font-size:42px;

font-weight:700;

}

.cta-section p{

font-size:20px;

margin-top:20px;

margin-bottom:30px;

}

.page-banner{

padding:80px 0;

background:linear-gradient(135deg,#0B3D91,#1456C5);

color:#fff;

text-align:center;

}

.contact-box{

padding:35px;

background:#fff;

border-radius:20px;

box-shadow:0 15px 35px rgba(0,0,0,.08);

height:100%;

}

.contact-form{

padding:35px;

background:#fff;

border-radius:20px;

box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.contact-box h5{

margin-top:20px;

color:#0B3D91;

font-weight:600;

}

.contact-box p{

margin-bottom:0;

}