.hero-section{

background:linear-gradient(135deg,#0B5ED7,#001B44);

position:relative;

padding:32px 0;
padding-bottom:73px;

}
.course-summary{

margin-top:-70px;

position:relative;

z-index:99;

}
.summary-card{
    background: linear-gradient(135deg, #1d5bbf 0%, #0b3d91 100%);
    border-radius: 24px;
    padding: 30px;
    border: 1px solid rgba(255,255,255,0.15);
    box-shadow: 0 15px 35px rgba(0,0,0,.20);
     position:relative;
    overflow:hidden;
}
.summary-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:1px;
    background:rgba(255,255,255,.35);
}
.summary-item{
    display:flex;
    align-items:center;
    gap:18px;
}

.summary-icon{
    width:65px;
    height:65px;
    border-radius:16px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:28px;
    flex-shrink:0;
}

.summary-item h5{
    font-size:24px;
    font-weight:700;
    margin-bottom:4px;
       color:#fff;
}

.summary-item p{
    margin:0;
   color:rgba(255,255,255,.85);
    font-size:15px;
}
.summary-item i{
    color:#FFD54F;
}

.eligibility-area{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.eligibility-area span{
    background:rgba(255,255,255,.15);
    color:#fff;
    border:1px solid rgba(255,255,255,.20);
    transition:.3s;
}

.eligibility-area span:hover{
    background:#FFD54F;
    color:#0b3d91;
    border-color:#FFD54F;
}

.hero-section::before{

content:"";

position:absolute;

width:500px;

height:500px;

background:rgba(255,255,255,.05);

border-radius:50%;

top:-120px;

right:-120px;

filter:blur(30px);

}

.course-badge{

display:inline-block;

padding:8px 20px;

background:rgba(255,255,255,.15);

border-radius:50px;

backdrop-filter:blur(8px);

font-weight:600;

}

.hero-title{

font-size:58px;

font-weight:800;

line-height:1.2;

}

.hero-title span{

color:#FFD54F;

}

.hero-desc{

font-size:18px;

line-height:1.8;

color:#E8EAF6;

}

.hero-tags{

display:flex;

flex-wrap:wrap;

gap:10px;

}

.hero-tags span{

padding:8px 18px;

background:rgba(255,255,255,.12);

border-radius:30px;

backdrop-filter:blur(8px);

}

.stat-card{

background:rgba(255,255,255,.08);

border-radius:20px;

padding:18px;

text-align:center;

backdrop-filter:blur(12px);

transition:.4s;

}

.stat-card:hover{

transform:translateY(-8px);

background:#fff;

color:#0B5ED7;

}

.stat-card h3{

font-weight:800;

}

.hero-image img{

max-width:90%;

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

}

.floating{

position:absolute;

background:#fff;

padding:10px 18px;

border-radius:40px;

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

font-weight:600;

animation:float 4s infinite;

}

.python{



left:7%;
bottom: 419px;

}

.html{

    top: 428px;
    right: 0;

}

.css{

bottom:180px;

left:0;

}

.js{

    top: 31px;
    right: 0%;
}

.react{

    bottom: 263px;
    right: 1%;

}

.sql{

    bottom: 78px;
    left: 10%;
}



.django{
       bottom: 531px;
    left: 46%;
}
@keyframes float{

0%{transform:translateY(0);}

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

100%{transform:translateY(0);}

}

.scroll-down{

position:absolute;

bottom:25px;

left:50%;

transform:translateX(-50%);

color:#fff;

font-size:35px;

animation:bounce 2s infinite;

}

@keyframes bounce{

0%,100%{

transform:translate(-50%,0);

}

50%{

transform:translate(-50%,10px);

}

}

@media(max-width:992px){

.hero-title{

font-size:40px;

}

.hero-desc{

font-size:16px;

}

.hero-image{

margin-top:40px;

}

.floating{

display:none;

}

}

.course-highlights{

background:rgba(255,255,255,.10);

backdrop-filter:blur(15px);

border-radius:18px;

padding:22px;

display:flex;

justify-content:space-between;

align-items:center;

border:1px solid rgba(255,255,255,.12);

}

.highlight-item{

display:flex;

align-items:center;

gap:15px;

color:#fff;

}

.highlight-item i{

font-size:34px;

color:#FFD54F;

}

.highlight-item h5{

margin:0;

font-weight:700;

font-size:22px;

}

.highlight-item small{

color:#d9d9d9;

font-size:14px;

}

.divider{

width:1px;

height:55px;

background:rgba(255,255,255,.2);

}

.eligibility-strip{

display:flex;

flex-wrap:wrap;

align-items:center;

gap:12px;

background:rgba(255,255,255,.08);

padding:16px 22px;

border-radius:16px;

}

.eligibility-strip .title{

color:#FFD54F;

font-weight:700;

margin-right:8px;

}

.eligibility-strip span{

background:rgba(255,255,255,.12);

color:#fff;

padding:8px 16px;

border-radius:30px;

font-size:14px;

}
.eligibility-area{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:nowrap;      /* Keep all in one row */
    overflow-x:auto;       /* Prevent wrapping if space is less */
}

.eligibility-area span{
    padding:8px 14px;
    border:1px solid rgba(255,255,255,.35);
    border-radius:6px;
    color:#fff;
    white-space:nowrap;    /* Prevent text from breaking */
    font-size:11px;
}
@media(max-width:991px){

.course-highlights{

flex-wrap:wrap;

gap:20px;

}

.divider{

display:none;

}

}
/* -----/*==========================================
ABOUT PYTHON SECTION
==========================================*/

.about-python{
    background: linear-gradient(180deg,#f7fbff 0%,#ffffff 100%);
    padding:100px 0;
    position:relative;
    overflow:hidden;
}

/* Background Dot Pattern */

.about-python::before{

content:"";

position:absolute;

width:100%;

height:100%;

left:0;

top:0;

background-image:radial-gradient(rgba(13,110,253,.08) 1px, transparent 1px);

background-size:26px 26px;

opacity:.7;

pointer-events:none;

}

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

.section-badge{

display:inline-block;

padding:10px 22px;

background: #3775da;
    color: #eceff5;

font-weight:600;

border-radius:40px;

font-size:15px;

}

.section-title{

font-size:44px;

font-weight:800;

color:#0D47A1;

}

.section-subtitle{

max-width:760px;

margin:auto;

font-size:18px;

color:#01070d;

line-height:1.8;

}

/*==================================
LEFT CARD
==================================*/

.about-left{

background:linear-gradient(135deg,#0d47a1,#1565c0);

border-radius:28px;

padding:45px;

overflow:hidden;

  height:520px;
    min-height:520px;

display:flex;

justify-content:center;

align-items:center;

position:relative;

box-shadow:0 25px 60px rgba(13,71,161,.18);

}

/* Animated Blobs */

.about-left::before{

content:"";

position:absolute;

width:280px;

height:280px;

background:rgba(255,255,255,.08);

border-radius:50%;

top:-80px;

left:-80px;

animation:blob1 8s infinite;

}

.about-left::after{

content:"";

position:absolute;

width:220px;

height:220px;

background:rgba(255,255,255,.06);

border-radius:50%;

bottom:-70px;

right:-60px;

animation:blob2 10s infinite;

}

/* Image */

.about-img{

max-width:95%;

position:relative;

z-index:2;

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

}
.about-left .image-glow{

position:absolute;

width:260px;

height:260px;

background:rgba(255,255,255,.12);

border-radius:50%;

filter:blur(40px);

left:50%;

top:50%;

transform:translate(-50%,-50%);

animation:pulseGlow 4s infinite;

}

@keyframes pulseGlow{

0%,100%{

transform:translate(-50%,-50%) scale(1);

}

50%{

transform:translate(-50%,-50%) scale(1.08);

}

}
/*==================================
RIGHT CARD
==================================*/

.about-right{

background:linear-gradient(180deg,#ffffff,#fbfcff);

border-radius:28px;

padding:45px;


    height:520px;
    min-height:520px;

display:flex;

flex-direction:column;

justify-content:center;

box-shadow:0 20px 50px rgba(0,0,0,.08);

position:relative;

overflow:hidden;

}

/* Decorative Circle */

.about-right::before{

content:"";

position:absolute;

width:260px;

height:260px;

background:#EEF5FF;

border-radius:50%;

right:-120px;

top:-120px;

}

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

.about-right h3{

font-size:36px;

font-weight:800;

color:#222;

position:relative;

z-index:2;

}

.about-right h3 span{

color:#0d6efd;

}

.title-line{

width:80px;

height:5px;

background:#0d6efd;

border-radius:20px;

margin:20px 0 30px;

}

.about-right p{

font-size:17px;

line-height:1.9;

color:#666;

position:relative;

z-index:2;
text-align: justify;

}

/*==================================
Quick Benefits
==================================*/

.quick-benefits{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:15px;

margin-top:25px;

margin-bottom:25px;

position:relative;

z-index:2;

}

.quick-benefits div{

background:#F7FAFF;

padding:15px 18px;

border-radius:15px;

font-weight:600;

transition:.35s;

border:1px solid #eef3fa;
animation:fadeUp .8s ease both;

}
.quick-benefits div:nth-child(2){

animation-delay:.2s;

}

.quick-benefits div:nth-child(3){

animation-delay:.4s;

}

.quick-benefits div:nth-child(4){

animation-delay:.6s;

}

.quick-benefits div:nth-child(5){

animation-delay:.8s;

}

.quick-benefits div:nth-child(6){

animation-delay:1s;

}

@keyframes fadeUp{

from{

opacity:0;

transform:translateY(20px);

}

to{

opacity:1;

transform:translateY(0);

}

}

.quick-benefits div:hover{

background:#0d6efd;

color:#fff;

transform:translateY(-6px);

}

.quick-benefits i{

color:#0d6efd;

margin-right:8px;

}

.quick-benefits div:hover i{

color:#FFD54F;

}

/*==================================
Slider Card
==================================*/

.benefit-slider{
    width:520px;
    max-width:100%;
    margin-top:25px;
}

.pythonSwiper{
    overflow:hidden;
     margin-top:auto;
}


.benefit-slide{

    background: linear-gradient(135deg,#0D47A1,#1565C0);
    border-radius:18px;
    padding:20px;
    color:#fff;
    position:relative;
    overflow:hidden;
   
    width:520px;          /* Increase width */

    height:125px;         /* Reduce height */

    padding:18px 22px;    /* Reduce padding */
      display:flex;

    flex-direction:column;

    justify-content:center;
    box-shadow:0 12px 30px rgba(13,71,161,.20);
    transition:.35s;

}

.benefit-slide:hover{

    transform:translateY(-6px);

}

.benefit-slide::before{

    content:"";
    position:absolute;
    width:90px;
    height:90px;
    background:rgba(255,255,255,.08);
    border-radius:50%;
    right:-20px;
    top:-20px;

}

.benefit-icon{

    width:45px;
    height:45px;
    border-radius:12px;
    background:rgba(255,255,255,.15);
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:10px;

}

.benefit-icon i{

    font-size:20px;
    color:#FFD54F;

}

.benefit-slide h5{

    font-size:20px;
    font-weight:700;
    margin-bottom:4px;

}

.benefit-slide p{

    font-size:14px;
    line-height:1.4;
    color:#EAF3FF;
    margin-bottom:0;
        margin:0;

}

/* Pagination */

.pythonSwiper .swiper-pagination{

    position:relative;
    margin-top:18px;

}

.pythonSwiper .swiper-pagination-bullet{

    width:10px;
    height:10px;
    background:#b5c8f5;
    opacity:1;

}

.pythonSwiper .swiper-pagination-bullet-active{

    width:28px;
    border-radius:20px;
    background:#0D6EFD;

}

/*==================================
Floating Tech
==================================*/

.tech-tag{

position:absolute;

padding:10px 18px;

background:rgba(255,255,255,.15);

backdrop-filter:blur(10px);

border:1px solid rgba(255,255,255,.2);

color:#fff;

border-radius:40px;

font-weight:600;

font-size:14px;

animation:float 4s infinite;

z-index:10;

}



/*==================================
Animations
==================================*/

@keyframes float{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

}

@keyframes blob1{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(30px);

}

}

@keyframes blob2{

0%,100%{

transform:translateX(0);

}

50%{

transform:translateX(-30px);

}

}

/*==================================
Responsive
==================================*/

@media(max-width:991px){

.about-left,

.about-right{

min-height:auto;

padding:30px;

}

.quick-benefits{

grid-template-columns:1fr;

}

.section-title{

font-size:34px;

}

.about-right h3{

font-size:30px;

}

.tech-tag{

display:none;

}

}


.swiper-pagination{
    position:relative;
    margin-top:20px;
}

.swiper-pagination-bullet{
    width:10px;
    height:10px;
    background:#b6c9f8;
    opacity:1;
    transition:.3s;
}

.swiper-pagination-bullet-active{
    width:28px;
    border-radius:20px;
    background:#0d6efd;
}
.benefit-slide{

transition:.4s;

}

.benefit-slide:hover{

transform:translateY(-8px);

}
/*---------------------------------------step 2 end here----------------------------------------------*/
/*---------------------------------------step 3 learning journy----------------------------------------------*/
/*=========================================
LEARNING JOURNEY
==========================================*/
/*=========================================
LEARNING TREE
==========================================*/

.learning-tree{
    position:relative;
    overflow:hidden;
    padding:90px 0;

    background:linear-gradient(
        135deg,
        #dbeafe 0%,
        #eef6ff 25%,
        #f8fbff 55%,
        #e7f2ff 100%
    );

    background-size:300% 300%;
    animation:bgGradient 15s ease infinite;
}
.learning-tree::before{
    content:"";
    position:absolute;
    inset:0;

    background:
    linear-gradient(135deg,
    rgba(255,255,255,.30),
    rgba(224,238,255,.22));

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

    z-index:0;
}

/* Decorative Background */
.learning-tree .container{
    position:relative;
    z-index:2;
}
.learning-tree::after{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    right:-120px;
    top:-100px;

    background:rgba(255,255,255,.35);

    border-radius:50%;
    filter:blur(5px);

    z-index:1;
}

/* Glass Circles */
.glass-circle{

    position:absolute;

    border-radius:50%;

    background:linear-gradient(
    135deg,
    rgba(79,142,247,.28),
    rgba(255,255,255,.55));

    backdrop-filter:blur(30px);

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

    border:1px solid rgba(255,255,255,.5);

    box-shadow:
    0 15px 35px rgba(21,101,192,.15);

    z-index:1;

}

/* Top Left */
.circle1{

width:220px;
height:220px;

left:40px;
top:80px;

}

.circle2{

width:280px;
height:280px;

right:40px;
top:40px;

}

.circle3{

width:180px;
height:180px;

right:120px;
bottom:50px;

}


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

.tree-wrapper{

position:relative;

display:flex;

flex-direction:column;

align-items:center;

z-index:2;

}

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

.root-card{

    background:rgba(255,255,255,.75);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.6);

    box-shadow:
    0 15px 40px rgba(0,0,0,.08);
width:220px;



color:#0D47A1;

padding:30px;

border-radius:24px;

text-align:center;



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

}

.root-card img{

margin-bottom:15px;

}

.root-card h4{

font-weight:700;

margin-bottom:5px;

}

.root-card span{

font-size:14px;

opacity:.9;

}

/*================ BRANCH LINE =================*/

.tree-line.vertical{

width:4px;

height:60px;

background:linear-gradient(#1565C0,#42A5F5);

position:relative;

}

.tree-line.vertical::after{

content:"";

position:absolute;

width:14px;

height:14px;

border-radius:50%;

background:#fff;

border:4px solid #1565C0;

left:-5px;

animation:moveDown 3s linear infinite;

}

/* Horizontal */

.tree-line.horizontal{

width:700px;

height:4px;

background:linear-gradient(90deg,#1565C0,#42A5F5);

position:relative;

margin-bottom:45px;

}

.tree-line.horizontal::after{

content:"";

position:absolute;

width:18px;

height:18px;

border-radius:50%;

background:#fff;

border:4px solid #1565C0;

top:-7px;

left:0;

animation:moveHorizontal 4s linear infinite;

}

/*================ BRANCH =================*/

.tree-branches{

display:flex;

justify-content:center;

gap:50px;

margin-bottom:40px;

}

/*================ CARD =================*/

.tree-card{

width:182px;
height: 151;

padding:8px;

border-radius:20px;

background:#fff;

text-align:center;

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

transition:.35s;

position:relative;

overflow:hidden;

}

.tree-card::before{

content:"";

position:absolute;

width:120px;

height:120px;

border-radius:50%;

background:#EAF3FF;

top:-40px;

right:-40px;

}

.tree-card:hover{

transform:translateY(-8px);

box-shadow:0 20px 45px rgba(13,71,161,.15);

}

.tree-card img{

position:relative;

z-index:2;

margin-bottom:0px;


}

.tree-card h5{

position:relative;

z-index:2;

font-weight:700;

color:#0D47A1;

}

.tree-card small{

position:relative;

z-index:2;

color:#666;

}

/*================ Bottom =================*/

.tree-line.small{

height:45px;

margin-bottom:25px;

}

.bottom-card{

display:flex;

gap:20px;

flex-wrap:wrap;

justify-content:center;

}

.bottom-card .tree-card{

width:180px;
height: 160px;

padding:10px;

}

/* Placement */

.placement{

/*background:linear-gradient(135deg,#0D47A1,#1565C0);*/

color:#0D47A1;

    font-size: 1.20rem;


}

.placement h5{

color:#0D47A1;

    font-size: 1.20rem;


}

/*================ Animation =================*/

@keyframes floatCard{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

}

@keyframes moveDown{

0%{

top:0;

opacity:1;

}

100%{

top:100%;

opacity:0;

}

}

@keyframes moveHorizontal{

0%{

left:0;

}

100%{

left:100%;

}

}

/*================ Mobile =================*/

@media(max-width:992px){

.tree-line.horizontal{

display:none;

}

.tree-branches{

flex-direction:column;

align-items:center;

gap:25px;

}

.bottom-card{

flex-direction:column;

align-items:center;

}

.root-card{

width:190px;

}

.tree-card{

width:280px;

}

.bottom-card .tree-card{

width:280px;

}

}
@keyframes bgGradient{

    0%{
        background-position:0% 50%;
    }

    50%{
        background-position:100% 50%;
    }

    100%{
        background-position:0% 50%;
    }

}
/*---------------------------------------step 3 end here----------------------------------------------*/
/*==================================
COURSE MODAL
==================================*/

.course-modal{

border:none;

border-radius:25px;

overflow:hidden;

}

.course-modal-header{

background:linear-gradient(135deg,#0D47A1,#1565C0);

color:#fff;

padding:30px;

}

.modal-course-img{

width:220px;

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

}

.course-duration{

background:#EAF4FF;

padding:12px 20px;

border-radius:30px;

font-weight:600;

display:inline-block;

}

.module-list{

list-style:none;

padding:0;

margin:0;

}

.module-list li{

padding:12px 0;

border-bottom:1px dashed #ddd;

position:relative;

padding-left:35px;

font-size:16px;

}

.module-list li::before{

content:"✓";

position:absolute;

left:0;

top:10px;

width:22px;

height:22px;

background:#0D6EFD;

color:#fff;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

font-size:13px;

}

.course-highlight{

display:flex;

gap:15px;

flex-wrap:wrap;

margin-top:20px;

}

.course-highlight div{

background:#F5F9FF;

padding:12px 18px;

border-radius:12px;

font-size:14px;

font-weight:600;

}

.course-highlight i{

color:#0D6EFD;

margin-right:8px;

}

@keyframes floatCourse{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

}
.month-img{
   width: 336px;
    height: 179px;
    object-fit: cover;
     border-radius:16px;

    border:2px solid #EAF2FF;
}
.month-header{

    background:linear-gradient(135deg,#0D47A1,#c06415);

    color:#fff;

    text-align:center;

    padding:0px;

    font-size:22px;

    font-weight:700;

    letter-spacing:1px;
     border-radius: 41px;

}
.month-header1{

    background:linear-gradient(135deg,#0D47A1,#c06415);

    color:#fff;

    text-align:center;

    padding:0px;

    font-size:22px;

    font-weight:700;

    letter-spacing:1px;
    border-radius: 41px;
}
.month-card{

    background:#fff;

    border:2px solid #E3ECFF;

    border-radius:22px;

    overflow:hidden;

    padding:18px;

    height:100%;

    transition:.35s ease;

    box-shadow:0 8px 25px rgba(13,71,161,.08);

    position:relative;

}

.month-card:hover{

    transform:translateY(-8px);

    border-color:#1565C0;

    box-shadow:0 20px 40px rgba(13,71,161,.18);

}
/*==========================
Card Footer
==========================*/

.card-footer-area{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-top:20px;

    gap:15px;

}

.duration{

    display:flex;

    align-items:center;

    gap:8px;

    font-weight:600;

    color:#555;

    font-size:16px;

}

.duration i{

    color:#1565C0;

    font-size:18px;

}

.curriculum-btn{

    display:inline-flex;

    align-items:center;

    gap:8px;

    background:linear-gradient(135deg,#1565C0,#0D47A1);

    color:#fff;

    padding:10px 18px;

    border-radius:10px;

    text-decoration:none;

    font-weight:600;

    font-size:14px;

    transition:.3s;

}

.curriculum-btn:hover{

    color:#fff;

    transform:translateY(-2px);

    box-shadow:0 8px 20px rgba(13,71,161,.25);

}

.curriculum-btn i{

    transition:.3s;

}

.curriculum-btn:hover i{

    transform:translateX(5px);

}
/*-------------------------------------------------------------step 4 end*/
.skills-section{
        position:relative;
    
    background:
        radial-gradient(circle at 50% 35%, rgba(32,92,190,.40), transparent 35%),
        radial-gradient(circle at 0% 100%, rgba(120,180,255,.20), transparent 30%),
        radial-gradient(circle at 100% 0%, rgba(120,180,255,.20), transparent 30%),
        linear-gradient(135deg,#F8FBFF 0%,#EAF3FF 45%,#FDFEFF 100%);

    overflow:hidden;

}
.skills-section::before{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    left:-70px;
    top:60px;

    border-radius:50%;
    background:rgba(255,255,255,.28);
    border:1px solid rgba(255,255,255,.45);

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

    box-shadow:0 20px 45px rgba(0,0,0,.08);
}

/* Right Top Glow */
.skills-section::after{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:-90px;
    top:100px;

    border-radius:50%;
    background:rgba(255,255,255,.25);
    border:1px solid rgba(255,255,255,.45);

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

    box-shadow:0 20px 45px rgba(0,0,0,.08);
}

/* Keep content above the background */
.skills-section .container{
    position:relative;
    z-index:2;
}
.small-circle{
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.35);
    border:1px solid rgba(255,255,255,.5);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    z-index:1;
}

.circle1{
    width:60px;
    height:60px;
    left:40px;
    top:350px;
}

.circle2{
    width:80px;
    height:80px;
    right:90px;
    bottom:70px;
}

.circle3{
    width:35px;
    height:35px;
    left:160px;
    top:130px;
}

.circle4{
    width:40px;
    height:40px;
    right:300px;
    top:220px;
}
.dot-grid{
    position:absolute;
    width:70px;
    height:70px;
    background-image:radial-gradient(rgba(255,255,255,.7) 2px, transparent 2px);
    background-size:14px 14px;
    z-index:1;
}

.left-grid{
    left:170px;
    top:140px;
}

.right-grid{
    right:140px;
    bottom:160px;
}
.skillsSwiper{

    padding:20px 0;

}

.skill-box{

    background:#fff;

    border-radius:22px;

    height:126px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    transition:.35s;

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

}

.skill-box:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 45px rgba(13,71,161,.18);

}

.skill-box img{

    width:65px;

    height:65px;

    object-fit:contain;

    margin-bottom:18px;

    transition:.35s;

}

.skill-box:hover img{

    transform:scale(1.15);

}

.skill-box h6{

    font-weight:700;

    font-size:18px;

}

.start-btn{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:15px 35px;

    background:linear-gradient(135deg,#1565C0,#4F7DF3);

    color:#fff;

    border-radius:50px;

    text-decoration:none;

    font-weight:600;

}

.start-btn:hover{

    color:#fff;

}
/*------------------------------------------------------------------------------step 5 end here*/
.success-card{
    background:#fff;
    border-radius:25px;
    padding:30px;
    text-align:center;
    position:relative;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(13,71,161,.08);
    transition:.4s;

    height:420px;

    /* Remove this */
    /* width:350px; */

    width:100%;

    display:flex;
    flex-direction:column;
    align-items:center;
}
.success-card:hover{

transform:translateY(-8px);

}

.salary-badge{

position:absolute;

top:18px;

right:18px;

background:#1565C0;

color:#fff;

padding:10px 22px;

border-radius:40px;

font-weight:700;

}

.student-wrapper{

width:280px;

height:280px;

margin:auto;

position:relative;

}

.student-img{

width:120px;

height:120px;

border-radius:50%;

border:6px solid #EAF2FF;

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

z-index:10;

background:#fff;

}

.orbit{

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

border:2px dashed #d9e8ff;

border-radius:50%;

animation:rotateOrbit 20s linear infinite;

}

.orbit1{

width:220px;

height:220px;

}

.orbit2{

width:180px;

height:180px;

animation-direction:reverse;

}

.orbit-item{

position:absolute;

width:75px;

height:75px;

border-radius:50%;

background:#EEF5FF;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

font-size:24px;

color:#1565C0;

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

transition:.3s;

}

.orbit-item small{

font-size:11px;

margin-top:4px;

font-weight:600;

color:#333;

line-height:1.2;

}

.orbit-item:hover{

background:#1565C0;

color:#fff;

transform:scale(1.1);

}

.qualification{

top:-5px;

left:50%;

transform:translateX(-50%);

}

.course{

right:-5px;

top:50%;

transform:translateY(-50%);

}

.company{

bottom:-5px;

left:50%;

transform:translateX(-50%);

}

.role{

left:-5px;

top:50%;

transform:translateY(-50%);

}

.student-name{

margin-top:18px;

margin-bottom:auto;

font-weight:700;

font-size:20px;

}
.story-btn{

display:inline-flex;

align-items:center;

justify-content:center;

margin-top:auto;

margin-bottom:5px;

padding:10px 24px;

min-width:180px;

height:48px;

border-radius:30px;

background:linear-gradient(135deg,#1565C0,#4F7DF3);

color:#fff;

text-decoration:none;

font-size:15px;

font-weight:600;

transition:.35s;

box-shadow:0 8px 20px rgba(21,101,192,.25);

}

.story-btn:hover{

color:#fff;

transform:translateY(-3px);

box-shadow:0 12px 25px rgba(21,101,192,.35);

}

@keyframes rotateOrbit{

from{

transform:translate(-50%,-50%) rotate(0deg);

}

to{

transform:translate(-50%,-50%) rotate(360deg);

}
}


.student-img img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.4s;

}

.success-card:hover .student-img img{

    transform:scale(1.08);

}

.student-name{

    margin:20px 0;

    font-weight:700;

}

.career-path{

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:10px;

    margin:25px 0;

}

.step{

    display:flex;

    flex-direction:column;

    align-items:center;

    font-size:13px;

    font-weight:600;

}

.step .icon{

    width:52px;

    height:52px;

    border-radius:50%;

    background:#EEF5FF;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:22px;

    margin-bottom:8px;

}



.success .icon{

    background:#DFF8E6;

}




@keyframes moveArrow{

    0%,100%{

        transform:translateX(0);

    }

    50%{

        transform:translateX(6px);

    }

}

@keyframes pulse{

    0%,100%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.08);

    }

}
.successSwiper .swiper-slide{

width:340px;

}
/*----------------------------------------------------------step 6 end here*/

/*==================================
VIDEO SLIDER
==================================*/

.video-card{

    background:#fff;

    border-radius:20px;

    overflow:hidden;

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

    transition:.35s;

    height:100%;

}

.video-card video{

    width:100%;

    height:260px;

    object-fit:cover;

    display:block;

}


.video-card img{

    width:100%;

    height:420px;

    object-fit:cover;

    transition:.4s;

}

.video-card:hover{

    transform:translateY(-8px);

}

.video-card:hover img{

    transform:scale(1.05);

}

.play-icon{

    position:absolute;

    top:50%;

    left:50%;

    transform:translate(-50%,-50%);

    width:80px;

    height:80px;

    border-radius:50%;

    background:rgba(255,255,255,.92);

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:40px;

    color:#1565C0;

    transition:.35s;

}

.video-card:hover .play-icon{

    transform:translate(-50%,-50%) scale(1.15);

}
/*==================================
VIDEO FEEDBACK
==================================*/
/*=====================================
VIDEO FEEDBACK
======================================*/

.learnerVideoSwiper{

    width:100%;
    overflow:hidden;
    padding-bottom:30px;
     padding:10px 0 30px;
}
.learnerVideoSwiper .swiper-wrapper{
    align-items:stretch;
}
.learnerVideoSwiper .swiper-slide{

    display:flex;
    justify-content:center;
 align-items:center;
    height:auto;
}

.video-feedback-card{

    width:100%;
    max-width:520px;
      margin:auto;
    background:#fff;

    border-radius:18px;

    overflow:hidden;

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

    transition:.3s;

}

.video-feedback-card:hover{

    transform:translateY(-8px);

}

.video-feedback-card video{

    width:100%;

    height:240px;

    object-fit:cover;

    display:block;

    background:#000;

}

.video-info{

    padding:18px;

    text-align:center;

}

.video-info h5{

    font-size:24px;

    font-weight:700;

}

.video-info span{

    color:#1565C0;

    font-weight:600;

}
/* .swiper-slide{
    flex-shrink:0;
    width:auto;
    height:auto;
    position:relative;
    transition-property:transform;
    display:block;
} */

/*---------------------------------------------------------------end here*/
/*==================================
Application Process
==================================*/

.application-section{

background:#F8FBFF;

position:relative;

overflow:hidden;

}

.application-section::before{

content:"";

position:absolute;

width:320px;

height:320px;

background:rgba(13,110,253,.05);

border-radius:50%;

top:-120px;

left:-120px;

}

.application-section::after{

content:"";

position:absolute;

width:280px;

height:280px;

background:rgba(13,110,253,.05);

border-radius:50%;

bottom:-120px;

right:-120px;

}

.process-card{

background:#fff;

border-radius:20px;

padding:35px 25px;

text-align:center;

position:relative;

height:100%;

transition:.35s;

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

overflow:hidden;

}

.process-card:hover{

transform:translateY(-12px);

box-shadow:0 25px 45px rgba(13,71,161,.18);

}

.step-number{

position:absolute;

top:15px;

right:18px;

width:36px;

height:36px;

background:#1565C0;

color:#fff;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

font-weight:700;

}

.process-icon{

width:85px;

height:85px;

margin:auto;

border-radius:50%;

background:#EEF5FF;

display:flex;

justify-content:center;

align-items:center;

font-size:34px;

color:#1565C0;

margin-bottom:25px;

transition:.35s;

}

.process-card:hover .process-icon{

transform:rotate(12deg) scale(1.1);

background:#1565C0;

color:#fff;

}

.process-card h5{

font-weight:700;

margin-bottom:15px;

}

.process-card p{

color:#666;

margin-bottom:0;

line-height:1.7;

}

.apply-btn{

border:none;

padding:16px 45px;

border-radius:50px;

background:linear-gradient(135deg,#1565C0,#4F7DF3);

color:#fff;

font-weight:700;

font-size:18px;

transition:.35s;

}

.apply-btn:hover{

transform:translateY(-4px);

box-shadow:0 15px 35px rgba(13,71,161,.25);

}
/*====================================
Apply Modal
====================================*/

.apply-modal{

border:none;

border-radius:25px;

overflow:hidden;

}

.modal-left{

background:linear-gradient(135deg,#0D47A1,#1565C0);

padding:45px 35px;

height:100%;

color:#fff;

position:relative;

overflow:hidden;

}

.left-overlay{

position:absolute;

width:250px;

height:250px;

background:rgba(255,255,255,.08);

border-radius:50%;

right:-80px;

top:-80px;

}

.left-overlay::after{

content:"";

position:absolute;

width:220px;

height:220px;

background:rgba(255,255,255,.06);

border-radius:50%;

left:-150px;

bottom:-280px;

}

.left-icon{

width:80px;

height:80px;

background:rgba(255,255,255,.15);

display:flex;

align-items:center;

justify-content:center;

font-size:34px;

border-radius:20px;

margin-bottom:25px;

}

.modal-left h2{

font-weight:700;

margin-bottom:20px;

}

.modal-left p{

opacity:.9;

}

.contact-item{

display:flex;

align-items:flex-start;

gap:15px;

margin-top:25px;

}

.contact-item i{

font-size:22px;

background:rgba(255,255,255,.15);

padding:12px;

border-radius:12px;

}

.contact-item h6{

margin-bottom:3px;

}

.contact-item p{

margin:0;

font-size:14px;

}

.modal-right{

padding:45px;

background:#fff;

}

.modal-right h3{

font-weight:700;

}

.form-control,

.form-select{

height:52px;

border-radius:12px;

}

textarea.form-control{

height:auto;

}

.submit-btn{

width:100%;

border:none;

padding:16px;

border-radius:12px;

background:linear-gradient(135deg,#1565C0,#4F7DF3);

color:#fff;

font-weight:700;

transition:.35s;

}

.submit-btn:hover{

transform:translateY(-3px);

box-shadow:0 12px 25px rgba(13,71,161,.25);

}
/*====================================
Success Modal
====================================*/

.success-modal{

border:none;

border-radius:25px;

overflow:hidden;

padding:25px;

}

.success-icon{

width:100px;

height:100px;

margin:auto;

background:linear-gradient(135deg,#16C47F,#39D98A);

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

font-size:48px;

color:#fff;

margin-bottom:25px;

animation:pop .6s;

}

.success-modal h3{

font-weight:700;

margin-bottom:15px;

}

.success-modal p{

color:#666;

line-height:1.8;

margin-bottom:25px;

}

.success-btn{

background:linear-gradient(135deg,#1565C0,#4F7DF3);

color:#fff;

padding:14px 40px;

border-radius:50px;

font-weight:600;

border:none;

}

.success-btn:hover{

background:#1565C0;

color:#fff;

}

@keyframes pop{

0%{

transform:scale(.3);

opacity:0;

}

80%{

transform:scale(1.15);

}

100%{

transform:scale(1);

opacity:1;

}

}
/*---------------------------------------------------application end here*/

/*==========================
FAQ
==========================*/

.faq-section{

background:#F8FBFF;

position:relative;

overflow:hidden;

}

.custom-faq .accordion-item{

border:none;

margin-bottom:18px;

border-radius:16px;

overflow:hidden;

box-shadow:0 12px 25px rgba(0,0,0,.05);

}

.custom-faq .accordion-button{

padding:20px;

font-weight:600;

font-size:17px;

background:#fff;

box-shadow:none;

}

.custom-faq .accordion-button:not(.collapsed){

background:linear-gradient(135deg,#1565C0,#0D47A1);

color:#fff;

}

.custom-faq .accordion-body{

padding:20px;

background:#fff;

line-height:1.8;

color:#555;

}

.custom-faq .accordion-button:focus{

box-shadow:none;

}

.faq-image{

position:relative;

padding:30px;

}

.faq-image img{

max-width:90%;

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

position:relative;

z-index:2;

}

.floating-circle{

position:absolute;

border-radius:50%;

background:rgba(21,101,192,.08);

animation:floatCircle 6s infinite ease-in-out;

}

.one{

width:180px;

height:180px;

top:20px;

left:20px;

}

.two{

width:120px;

height:120px;

bottom:40px;

right:40px;

animation-delay:2s;

}

@keyframes floatImage{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-15px);

}

}

@keyframes floatCircle{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(25px);

}

}





/*==================================
      TESTIMONIAL SECTION
==================================*/
.testimonial-section{

    position:relative;
    overflow:hidden;

   background:
        radial-gradient(circle at 50% 35%, rgba(32,92,190,.35), transparent 35%),
        radial-gradient(circle at 0% 100%, rgba(120,180,255,.18), transparent 30%),
        radial-gradient(circle at 100% 0%, rgba(120,180,255,.18), transparent 30%),
        linear-gradient(135deg,#F8FBFF 0%,#EAF3FF 45%,#FDFEFF 100%);

}
/* Large Glass Circle - Left */
.testimonial-section::before{
    content:"";
    position:absolute;

    width:220px;
    height:220px;

    left:-70px;
    top:80px;

    border-radius:50%;

    background:rgba(255,255,255,.30);
    border:1px solid rgba(255,255,255,.45);

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

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

    z-index:1;
}

/* Large Glass Circle - Right */
.testimonial-section::after{
    content:"";
    position:absolute;

    width:260px;
    height:260px;

    right:-90px;
    top:120px;

    border-radius:50%;

    background:rgba(255,255,255,.28);
    border:1px solid rgba(255,255,255,.45);

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

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

    z-index:1;
}

/* Keep Content Above Background */
.testimonial-section .container{
    position:relative;
    z-index:2;
}
.testimonial-circle{
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.35);
    border:1px solid rgba(255,255,255,.5);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    z-index:1;
}

.tc1{
    width:60px;
    height:60px;
    top:120px;
    left:140px;
}

.tc2{
    width:40px;
    height:40px;
    right:180px;
    top:280px;
}

.tc3{
    width:80px;
    height:80px;
    left:120px;
    bottom:100px;
}

.tc4{
    width:50px;
    height:50px;
    right:120px;
    bottom:60px;
}
.testimonial-dots{
    position:absolute;
    width:80px;
    height:80px;
    background-image:radial-gradient(rgba(255,255,255,.75) 2px, transparent 2px);
    background-size:14px 14px;
    opacity:.8;
    z-index:1;
}

.left-dots{
    left:160px;
    top:170px;
}

.right-dots{
    right:140px;
    bottom:120px;
}
.testimonialSwiper{

    padding:30px 10px 60px;
 overflow:hidden;
}
.testimonialSwiper .swiper-slide{
    height:auto;
}
.testimonial-item{

    width:100%;
    max-width:100%;
    padding:10px;

}

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

.testimonial-header{

    display:flex;

    align-items:center;

    gap:18px;

    margin-bottom:18px;
    

}

.testimonial-header img{

     width:65px;

    height:65px;

    border-radius:50%;

    object-fit:cover;

    border:4px solid #fff;

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

}

.testimonial-header h5{

    margin-bottom:2px;

    font-weight:700;

    font-size:20px;

}

.testimonial-header span{

    display:block;

    color:#1565C0;

    font-size:15px;

    margin-bottom:4px;

}

.rating{

    color:#FFC107;

    font-size:18px;

    letter-spacing:2px;

}

/*=========================
DIALOGUE BOX
==========================*/

.testimonial-box{

    position:relative;

    background:#fff;
       width:95%;
    margin: auto;
    max-width:100%;

    border:1px solid #e8e8e8;

    border-radius:16px;

    /* padding:35px 28px 25px; */
    padding: 28px 22px;

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

    min-height:120px;

    transition:.35s;

}

.testimonialSwiper .swiper-wrapper{
    align-items:stretch;
}
.testimonial-box:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(21,101,192,.18);

}

/* Triangle */

.testimonial-box::before{

    content:"";

    position:absolute;

    top:-10px;

    left:35px;

    width:20px;

    height:20px;

    background:#fff;

    border-left:1px solid #e8e8e8;

    border-top:1px solid #e8e8e8;

    transform:rotate(45deg);

}

.testimonial-box p{

    margin:0;

    line-height:1.7;

    color:#555;

    font-size:15px;

}

/*=========================
SWIPER PAGINATION
==========================*/

.testimonialSwiper .swiper-pagination-bullet{

    width:12px;

    height:12px;

    background:#c8d9ff;

    opacity:1;

}

.testimonialSwiper .swiper-pagination-bullet-active{

    width:30px;

    border-radius:20px;

    background:#1565C0;

}

/*=========================
RESPONSIVE
==========================*/

@media(max-width:768px){

.testimonial-header{

    flex-direction:column;

    text-align:center;

}

.testimonial-box{

    min-height:auto;

}

.testimonial-box::before{

    left:50%;

    transform:translateX(-50%) rotate(45deg);

}

}
/*==================================
GALLERY
==================================*/

.gallery-section {
    position:relative;
    overflow:hidden;
    padding:90px 0;
    background:
        radial-gradient(circle at 50% 35%, rgba(32,92,190,.35), transparent 35%),
        radial-gradient(circle at 0% 100%, rgba(120,180,255,.18), transparent 30%),
        radial-gradient(circle at 100% 0%, rgba(120,180,255,.18), transparent 30%),
        linear-gradient(135deg,#F8FBFF 0%,#EAF3FF 45%,#FDFEFF 100%);
}
/* Left Glass Circle */
.gallery-section::before{
    content:"";
    position:absolute;

    width:220px;
    height:220px;

    left:-70px;
    top:80px;

    border-radius:50%;

    background:rgba(255,255,255,.30);
    border:1px solid rgba(255,255,255,.45);

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

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

    z-index:1;
}

/* Right Glass Circle */
.gallery-section::after{
    content:"";
    position:absolute;

    width:260px;
    height:260px;

    right:-90px;
    top:120px;

    border-radius:50%;

    background:rgba(255,255,255,.28);
    border:1px solid rgba(255,255,255,.45);

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

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

    z-index:1;
}

/* Keep content above background */
.gallery-section .container{
    position:relative;
    z-index:2;
}
.gallery-circle{
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.35);
    border:1px solid rgba(255,255,255,.5);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    z-index:1;
}

.gc1{
    width:60px;
    height:60px;
    top:120px;
    left:120px;
}

.gc2{
    width:40px;
    height:40px;
    top:220px;
    right:180px;
}

.gc3{
    width:80px;
    height:80px;
    bottom:90px;
    left:80px;
}

.gc4{
    width:50px;
    height:50px;
    bottom:60px;
    right:120px;
}
.gallery-dots{
    position:absolute;
    width:80px;
    height:80px;

    background-image:
    radial-gradient(rgba(255,255,255,.75) 2px, transparent 2px);

    background-size:14px 14px;

    opacity:.8;

    z-index:1;
}

.dots-left{
    left:170px;
    top:180px;
}

.dots-right{
    right:150px;
    bottom:120px;
}
.gallery-filter button{

    border:none;

    background:#fff;

    padding:10px 24px;

    margin:6px;

    border-radius:50px;

    font-weight:600;

    transition:.3s;

    box-shadow:0 5px 15px rgba(0,0,0,.06);

}

.gallery-filter button.active,

.gallery-filter button:hover{

    background:#1565C0;

    color:#fff;

}

.gallery-card{

    position:relative;

    overflow:hidden;

    border-radius:20px;

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

}

.gallery-card img{

    width:100%;

    /* height:260px; */
     height: 197px;

    object-fit:cover;

    transition:.5s;

}

.gallery-card:hover img{

    transform:scale(1.1);

}

.gallery-overlay{

    position:absolute;

    inset:0;

    background:rgba(21,101,192,.65);

    display:flex;

    justify-content:center;

    align-items:center;

    opacity:0;

    transition:.4s;

}

.gallery-card:hover .gallery-overlay{

    opacity:1;

}

.gallery-overlay i{

    color:#fff;

    font-size:40px;

}
/*==================================
NEXT BATCH SECTION
==================================*/

.next-batch-section{

    position: relative;
    overflow: hidden;


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

}

.next-batch-section::before{

    content:"";

    position:absolute;

    width:350px;

    height:350px;

     background:url("assets/images/testimonial-bg.png") no-repeat center;

    border-radius:50%;

    top:-120px;

    right:-120px;

}

.next-batch-section::after{

    content:"";

    position:absolute;

    width:250px;

    height:250px;

    background:rgba(255,193,7,.10);

    border-radius:50%;

    bottom:-100px;

    left:-100px;

}

/* Main Card */



/* Hover Effect */

/* Main Card */

.next-batch-card{

    position:relative;
    z-index:2;

    background:#fff;

    border-radius:30px;

    padding:55px;

    border:1px solid rgba(255,255,255,.9);

    box-shadow:
        0 15px 35px rgba(15,54,110,.08),
        0 30px 70px rgba(15,54,110,.10),
        0 60px 120px rgba(15,54,110,.08);

    transition:all .4s ease;

    overflow:hidden;

}

/* Hover Effect */

.next-batch-card:hover{

    transform:translateY(-8px);

    box-shadow:
        0 25px 60px rgba(15,54,110,.12),
        0 45px 100px rgba(15,54,110,.15);

}
.next-batch-card::before{

    content:"";

    position:absolute;

    width:300px;
    height:300px;

    top:-180px;
    right:-150px;

    background:radial-gradient(
        rgba(66,133,244,.12),
        transparent 70%);

    border-radius:50%;

    z-index:0;

}

.next-batch-card::after{

    content:"";

    position:absolute;

    width:250px;
    height:250px;

    left:-120px;
    bottom:-120px;

    background:radial-gradient(
        rgba(255,193,7,.12),
        transparent 70%);

    border-radius:50%;

    z-index:0;

}

/* Keep all content above the glow */
.next-batch-card > *{

    position:relative;

    z-index:2;

}

/* Badge */

.batch-badge{

    display:inline-flex;

    align-items:center;

    gap:8px;

    background:#1565C0;

    color:#fff;

    padding:10px 22px;

    border-radius:50px;

    font-weight:600;

    margin-bottom:25px;

}

.batch-badge i{

    color:#FFD54F;

}

/* Heading */

.batch-left h2{

    font-size:42px;

    font-weight:700;

    margin-bottom:18px;

    color:#1d1d1d;

}

.batch-left p{

    color:#666;

    line-height:1.8;

    margin-bottom:30px;

}

/* Image */

.batch-image{

    max-width:90%;

    animation:floatImage 3s ease-in-out infinite;

}

@keyframes floatImage{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

    100%{

        transform:translateY(0);

    }

}

/* Countdown */

.countdown-wrapper{

    display:flex;

    justify-content:center;

    gap:18px;

    flex-wrap:wrap;

}

.time-box{

    width:110px;

    height:110px;

    background:#1565C0;

    color:#fff;

    border-radius:20px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    box-shadow:0 15px 30px rgba(21,101,192,.20);

    transition:.35s;

}

.time-box:hover{

    transform:translateY(-8px);

}

.time-box h2{

    font-size:34px;

    font-weight:700;

    margin-bottom:5px;

}

.time-box span{

    font-size:15px;

}

/* Batch Info */

.info-card{

    display:flex;

    align-items:center;

    gap:15px;

    background:#f8fbff;

    padding:18px;

    border-radius:18px;

    transition:.3s;

}

.info-card:hover{

    background:#1565C0;

    color:#fff;

    transform:translateY(-5px);

}

.info-card:hover h6,

.info-card:hover p,

.info-card:hover i{

    color:#fff;

}

.info-card i{

    font-size:30px;

    color:#1565C0;

}

.info-card h6{

    margin:0;

    font-weight:700;

}

.info-card p{

    margin:0;

    color:#666;

}

/* Progress */

.seat-progress span{

    font-weight:600;

}

.progress{

    height:12px;

    border-radius:50px;

    overflow:hidden;

}

.progress-bar{

    background:linear-gradient(90deg,#1565C0,#4FC3F7);

    border-radius:50px;

}

/* Buttons */

.btn-warning{

    background:#FF9800;

    border:none;

    color:#fff;

    font-weight:600;

    padding:14px 30px;

}

.btn-warning:hover{

    background:#f57c00;

}

.btn-outline-light{

    border:2px solid #1565C0;

    color:#f2f4f7;

    font-weight:600;

    padding:14px 30px;

}

.btn-outline-light12{

    border:2px solid #1565C0;

    color:#1565C0;

    font-weight:600;

    padding:14px 30px;

}
.btn-outline-light12:hover{

    background:#1565C0;

    color:#fff;

}
.btn-outline-light:hover{

    background:#1565C0;

    color:#fff;

}

/* Rating */

.batch-rating{

    color:#FFC107;

    font-size:18px;

}

.batch-rating span{

    color:#555;

    font-size:15px;

    margin-left:10px;

    font-weight:600;

}

/* Responsive */

@media(max-width:991px){

.next-batch-card{

    padding:35px;

}

.batch-left{

    text-align:center;

    margin-bottom:40px;

}

.batch-image{

    max-width:280px;

}

.batch-left h2{

    font-size:34px;

}

}

@media(max-width:576px){

.time-box{

    width:75px;

    height:75px;

}

.time-box h2{

    font-size:22px;

}

.time-box span{

    font-size:12px;

}

.batch-left h2{

    font-size:28px;

}

}
.time-box{

    animation:pulseBox 2s infinite;

}

@keyframes pulseBox{

    0%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.06);

    }

    100%{

        transform:scale(1);

    }

}
/*=====================================
        LEARNING ROADMAP
======================================*/

.roadmap-section{
    position:relative;
    background:#f8fbff;
    overflow:hidden;
}

.roadmap-section::before{
    content:"";
    position:absolute;
    top:-120px;
    right:-120px;
    width:320px;
    height:320px;
    border-radius:50%;
    background:rgba(21,101,192,.05);
}

.roadmap-section::after{
    content:"";
    position:absolute;
    left:-120px;
    bottom:-120px;
    width:260px;
    height:260px;
    border-radius:50%;
    background:rgba(21,101,192,.05);
}

/*=========================
Timeline
=========================*/

.roadmap-line{

    position:relative;

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin:60px auto 70px;

    max-width:900px;

}

.roadmap-line::before{

    content:"";

    position:absolute;

    width:100%;

    height:4px;

    background:#d7e6ff;

    top:50%;

    left:0;

    transform:translateY(-50%);

    z-index:1;

}

.roadmap-step{

    width:70px;

    height:70px;

    background:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:26px;

    font-weight:700;

    color:#1565C0;

    border:5px solid #1565C0;

    position:relative;

    z-index:2;

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

}

/*=========================
Card
=========================*/

.roadmap-card{

    position:relative;

    background:#fff;

    border-radius:24px;

    padding:22px;

    height:98%;

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

    transition:.35s;

    border:1px solid #edf2ff;
  
}

.roadmap-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 50px rgba(21,101,192,.15);

}

/*=========================
Month Badge
=========================*/

.month-badge{

    position:absolute;

    top:18px;

    left:18px;

    color:#fff;

    padding:8px 18px;

    border-radius:30px;

    font-size:14px;

    font-weight:700;

}

/*=========================
Level Badge
=========================*/

.level-badge{

    position:absolute;

    top:20px;

    right:20px;

    padding:7px 16px;

    border-radius:20px;

    font-size:13px;

    font-weight:600;

}

.beginner{

    background:#eef4ff;

    color:#1565C0;

}

.intermediate{

    background:#e8fff1;

    color:#198754;

}

.advanced{

    background:#fff2e5;

    color:#fd7e14;

}

/*=========================
Image
=========================*/

.roadmap-image{

    width:100%;

    height:220px;

    object-fit:contain;

    margin-top:45px;



}

/*=========================
Heading
=========================*/

.roadmap-card h4{

    font-size:23px;
    font-weight:700;

    margin-bottom:15px;

    color:#1b1b1b;

}

.roadmap-card p{

    color:#666;

    line-height:1.8;



}

/*=========================
Skills
=========================*/

.roadmap-skills{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-top:20px;

}

.roadmap-skills span{

    background:#f4f8ff;

    color:#1565C0;

    padding:8px 14px;

    border-radius:30px;

    font-size:14px;

    font-weight:600;

}

/*=========================
Footer
=========================*/

.roadmap-footer{

    margin-top:30px;

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.duration{

    display:flex;

    align-items:center;

    gap:8px;

    font-weight:600;

    color:#444;

}

.duration i{

    color:#1565C0;

    font-size:20px;

}

.roadmap-footer .btn{

    border-radius:30px;

    padding:10px 24px;

    font-weight:600;

}

/*=========================
Responsive
=========================*/

@media(max-width:991px){

.roadmap-line{

    display:none;

}

.roadmap-card{

    margin-bottom:30px;

}

}

@media(max-width:576px){

.roadmap-card h4{

    font-size:24px;

}

.roadmap-footer{

    flex-direction:column;

    gap:15px;

    align-items:flex-start;

}

.roadmap-footer .btn{

    width:100%;

}

}
.month-badge{

    position:absolute;

    top:18px;

    left:18px;

    color:#fff;

    padding:10px 22px;

    font-size:14px;

    font-weight:700;

    border-radius:30px;

    letter-spacing:.5px;

    box-shadow:0 8px 18px rgba(0,0,0,.15);

}

.roadmap-card:nth-child(1) .month-badge,
.bg-primary{

    background:linear-gradient(90deg,#1565C0,#4F8EF7);

}

.roadmap-card:nth-child(2) .month-badge,
.bg-success{

    background:linear-gradient(90deg,#1EA85C,#46D987);

}

.roadmap-card:nth-child(3) .month-badge,
.bg-warning{

    background:linear-gradient(90deg,#F57C00,#FFA726);

}
.roadmap-card{

    position:relative;


    border-radius:25px;

    background:#fff;

    border:1px solid #edf3ff;

    box-shadow:0 20px 45px rgba(0,0,0,.08);

}

.roadmap-card::before{

    content:"";

    position:absolute;

    width:180px;

    height:180px;

    background:rgba(21,101,192,.04);

    border-radius:50%;

    top:-70px;

    right:-60px;

}

.roadmap-card::after{

    content:"";

    position:absolute;

    width:120px;

    height:120px;

    background:rgba(79,142,247,.05);

    border-radius:50%;

    bottom:-50px;

    left:-40px;

}
.roadmap-image{

    width:100%;



    object-fit:contain;

    background:#f7fbff;

    border-radius:20px;

    padding:4px;

    margin-top:55px;

}
.roadmap-card h4{

    font-size:23px;

    font-weight:700;

    margin-bottom:12px;

    color:#16213E;

}
.roadmap-skills{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

}

.roadmap-skills span{

    background:#eef5ff;

    color:#1565C0;

    padding:8px 15px;

    border-radius:30px;

    font-size:14px;

    font-weight:600;

    transition:.3s;

}

.roadmap-skills span:hover{

    background:#1565C0;

    color:#fff;

}
.roadmap-footer .btn{

    border-radius:35px;

    padding:11px 24px;

    font-weight:600;

    transition:.35s;

}

.roadmap-footer .btn:hover{

    transform:translateY(-3px);

    box-shadow:0 10px 25px rgba(21,101,192,.30);

}
.roadmap-line::before{

    background:linear-gradient(90deg,

    #1565C0,

    #4F8EF7,

    #1EA85C,

    #FFA726);

}

.roadmap-step{

    transition:.35s;

}

.roadmap-step:hover{

    transform:scale(1.12);

}
@keyframes float{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}

.roadmap-image{

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

}
.roadmap-section{

background:

linear-gradient(180deg,#f8fbff,#ffffff);

position:relative;

overflow:hidden;

}
/*==================================
      FLOATING WHATSAPP
==================================*/

.whatsapp-float{

    position:fixed;

    right:25px;
    bottom:79px;

    width:65px;
    height:65px;

    border-radius:50%;

    background:#25D366;

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

    color:#fff;
    font-size:34px;

    text-decoration:none;

    box-shadow:0 10px 25px rgba(37,211,102,.45);

    z-index:9999;

    transition:.35s;

    animation:whatsappPulse 2s infinite;

}

.whatsapp-float:hover{

    transform:scale(1.1);

    color:#fff;

    background:#1EBE5D;

}

@keyframes whatsappPulse{

    0%{
        box-shadow:0 0 0 0 rgba(37,211,102,.6);
    }

    70%{
        box-shadow:0 0 0 18px rgba(37,211,102,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(37,211,102,0);
    }

}

/* Mobile */

@media(max-width:768px){

.whatsapp-float{

    width:55px;
    height:55px;

    right:18px;
    bottom:80px !important;

    font-size:30px;

}

}
/* Next Batch Floating Button */
.floating-batch{
    position:fixed;
    right:25px;
    bottom:4px;

    display:flex;
    align-items:center;
    gap:10px;

    background:linear-gradient(135deg,#1565C0,#4285F4);
    color:#fff;

    padding:12px 18px;
    border-radius:50px;

    text-decoration:none;

    box-shadow:0 15px 35px rgba(21,101,192,.30);

    z-index:999;

    transition:.35s;
}

.floating-batch:hover{
    transform:translateY(-5px);
}

.floating-batch i{
    font-size:26px;
}

.floating-batch .text{
    line-height:1.2;
}

.floating-batch .text small{
    display:block;
    font-size:11px;
    opacity:.85;
}

.floating-batch .text strong{
    font-size:15px;
}

.navbar { padding: 12px 0; } .navbar-brand img { max-height: 45px; width: auto; } .navbar-nav .nav-link { font-weight: 500; margin-left: 15px; transition: 0.3s ease; } .navbar-nav .nav-link:hover, .navbar-nav .nav-link.active { color: #0d6efd; }