/* modes of bg */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Segoe UI',sans-serif;
}

/* BACKGROUND */

.modes-bg{
position:relative;
padding:60px 20px;
display:flex;
justify-content:center;
background:
radial-gradient(circle at 20% 30%, rgba(0,255,255,0.2), transparent 40%),
radial-gradient(circle at 80% 70%, rgba(255,0,255,0.2), transparent 40%),
#0f172a;
}

/* grid */

.modes-bg::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-image:
linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
background-size:50px 50px;
z-index:0;
}

/* wrapper */

.wrapper-modes{
position:relative;
z-index:2;
width:100%;
max-width:1100px;
text-align:center;
}

/* heading */

.wrapper-modes h2{
color:white;
margin-bottom:40px;
font-size:32px;
}

/* section */

.section-modes{
display:flex;
gap:30px;
justify-content:center;
flex-wrap:wrap;
}

/* card */

.card-modes{
flex:1 1 350px;
max-width:420px;
padding:35px;
border-radius:18px;
background:rgba(255,255,255,0.08);
backdrop-filter:blur(12px);
border:1px solid rgba(255,255,255,0.15);
text-align:center;
color:white;
transition:0.4s;
}

.card-modes:hover{
transform:translateY(-10px);
box-shadow:0 30px 60px rgba(0,0,0,0.5);
}

/* illustration */

.card-modes img{
width:160px;
max-width:100%;
margin:0 auto;
margin-bottom:20px;

}

/* title */

.card-modes h3{
font-size:22px;
margin-bottom:10px;
color:#FFF
}

/* description */

.card-modes p{
font-size:15px;
line-height:1.6;
opacity:0.9;
color:#FFF
}

/* MOBILE */

@media (max-width:768px){

.wrapper-modes h2{
font-size:26px;
}

.section-modes{
gap:20px;
}

.card-modes{
padding:25px;
}

.card-modes img{
width:130px;
}

}

.tab-wraper{
    background-color:#f4f6f8; 
    padding-bottom:100px;
}

/* tabs */

.tabs-ai-grid-bg{
background-image:
linear-gradient(rgba(190, 200, 255, 0.2) 1px, transparent 1px),
linear-gradient(90deg, rgba(190, 200, 255, 0.2  ) 1px, transparent 1px);
background-size:80px 80px;
padding: 70px 0 20px 0;
text-align: center;
}

.tabs-ai-grid-bg h1{font-size: 32px; color:#000; font-weight: 500;}
.tabs-ai-grid-bg p{font-size: 18px; color:#333; font-weight: 4  00; margin-bottom: 30px; padding-left:20px; padding-right:20px;}

.tabs{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:10px;
}

.tab-btn{
padding:13px 20px;
border:none;
/* background:#e9eef7; */
background:#ffffff;
cursor:pointer;
font-size:16px;
font-weight: 400;
border-radius:6px;
transition:.3s;
border: 1px solid #cfd8f0;
}

.tab-btn.active{
background:#0400ff;
color:white;
}

.tab-btn:hover{
background:#FFCB05;
}

/* Mobile scroll */
@media (max-width:768px){

.tabs{
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: flex-start;   /* important: start from first tab */
    scroll-behavior: smooth;
    padding-bottom:5px;
}

.tabs::-webkit-scrollbar{
    display:none;
}

.tab-btn{
    flex:0 0 auto;
}

}


/* Content box */
.tab-content{
padding: 25px;
max-width:auto;
border-radius:20px;
background-color: #FFF;
/* box-shadow:0 8px 20px rgba(0,0,0,0.08); */
display:none;
text-align:left;
border: 1px solid #cfd8f0;  
}

.tab-content.active{
display:block;
}

.tab-btn.active:after, .tab-content.active:after {
  content: "";
}

.tab-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.tab-col {
    flex: 1 1 calc(50% - 20px);
    padding: 20px;
    /* background: #f7f7f7; */
    border-radius: 6px;
}
.tab-col-bgcolor{background-color:#f9fbff;}
.tab-col-border{border:1px solid #CCC}
.tab-col ul{ border:0px solid #F00;margin-left:20px}

.tab-col  h1,h2{margin:17px 0; font-family: Arial, Helvetica, sans-serif; font-size: 20px;font-weight: 500;}
.tab-col  h2{ font-size: 18px;}
.tab-col p{margin:0; padding:0;font-family: Arial, Helvetica, sans-serif; font-size:; line-height: 22px; color:#333; font-weight: 300;}

@media (max-width:768px) {
    .tab-col {
        flex: 1 1 100%;
    }
}

/* h3{
margin-top:0;
color:#2d6cdf;
}

ul{
padding-left:18px;
margin:0;
padding:0
} */

.course-meta{
display:flex;
gap:20px;
flex-wrap:wrap;
margin:15px 0;
font-weight:600;
border:1px solid #CCC;
border-radius: 10px;
padding: 20px;
}
.course-meta img{margin-right:5px;}

.learn-btn{
display:inline-block;
margin-top:20px;
padding:12px 36px;
background:#0400ff;
color:white;
text-decoration:none;
border-radius:6px;
transition:.3s;
}
.learn-btn a{color:#FFF}

.learn-btn:hover{
background:#FFCB05;
}
.tab-col a{color:#FFF}




/* Responsive */

@media(max-width:600px){

.tab-content{
padding:25px;
}

.course-meta{
flex-direction:column;
gap:8px;
}

}


.career-domains{
/* background:#0b4ed7; */
/* background-image:url("images/ai-pattern.png"); */
background-size:cover;
padding:80px 20px;
text-align:center;
}

.ai-grid-bg{
background-color:#0b4ed7;
/* grid pattern */
background-image:
linear-gradient(rgba(255,255,255,0.08) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px);
background-size:60px 60px;
}


.tech-squares{

background-color:#0b4ed7;

background-image:
linear-gradient(rgba(255,255,255,0.08) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px);

background-size:50px 50px;

padding:80px 20px;
}

.ai-circuit{

background-color:#0b4ed7;

background-image:
radial-gradient(circle, rgba(255,255,255,0.15) 2px, transparent 2px),
linear-gradient(rgba(255,255,255,0.08) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px);

background-size:40px 40px, 40px 40px, 40px 40px;

padding:80px 20px;

}


.section-title{

color:white;
font-size:36px;
font-weight:700;
margin-bottom:50px;
}

.domain-container{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:30px;
max-width:1100px;
margin:auto;
}

.domain-card{
background:white;
padding:30px 20px;
border-radius:12px;
box-shadow:0 8px 25px rgba(0,0,0,0.15);
transition:0.3s;
}

.domain-card:hover{
transform:translateY(-8px);
}

.domain-card img{
margin:0 auto;
width:100px;
height:100px;
border-radius: 100%;
border:0px double #CCC;
margin-bottom:15px;
}

.domain-card h3{
margin-bottom:10px;
color:#0b4ed7;
font-weight: 500;
}

.domain-card p{

font-size:14px;
margin-bottom:15px;
color:#555;
}

.domain-card a{

display:inline-block;
padding:8px 18px;
background:#0b4ed7;
color:white;
text-decoration:none;
border-radius:5px;
font-size:14px;
}


/* Responsive: 2 cards per row on medium screens */
@media screen and (max-width: 900px) {
  .domain-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Responsive: 1 card per row on small screens */
@media screen and (max-width: 600px) {
  .domain-container {
    grid-template-columns: 1fr;
  }
}






/* testimonials */

 :root {
            --bg: #020c1b;
            --cyan: #00c6ff;
            --panel-w: 550px;
        }

.deep-mind-bg {
    margin: 0;
    /* background: radial-gradient(circle at center, #0a192f 0%, #020c1b 100%); */
    color: #ccd6f6;
    font-family: 'Inter', sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: left;
    justify-content: center;
    /* height: 100vh; */
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 80px 0;
}

        .stage {
            width: var(--panel-w);
            perspective: 2000px;
            position: relative;
        }

        .track {
            display: flex;
            transform-style: preserve-3d;
            /* Transition is managed by JS for the "instant jump" logic */
        }

        .card {
    width: 500px;          /* fixed width */
    height: 300px;         /* fixed height */
    flex-shrink: 0;
    margin: 0 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

.glass-face {
    width: 100%;
    height: 100%;
    padding: 20px;
    
    background: rgb(240, 253, 255);
    backdrop-filter: blur(10px);
    border-radius: 15px;
    display: flex;
    flex-direction: column;       /* stack photo + content vertically */
    align-items: center;          /* center horizontally */
    justify-content: flex-start;  /* start from top */
}


.content {
    text-align: center;           /* center quote and name */
    max-height: 160px;            /* limit height */
    overflow-y: auto;             /* scroll if quote is too long */
}

.content p {
    margin-bottom: 10px;
}

.content .name {
    font-weight: bold;
    font-size: 16px;
}
     .photo-wrapper {
    position: relative;       /* relative for pseudo-element */
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;             /* photo size */
    height: 80px;
    border-radius:;       /* circular photo */
    overflow: hidden;         /* clip scanning line inside photo */
}

.photo-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* border-radius: 50%; */
    
}

/* Scanning line */
.photo-wrapper::after {
    content: '';
    position: absolute;
    top: -50%;                /* start above photo */
    left: 0;
    width: 100%;
    height: 50%;              /* small scanning line */
    background: linear-gradient(transparent, var(--cyan), transparent);
    opacity: 0.3;
    animation: scan 3s infinite linear;
}

/* Animation */
@keyframes scan {
    0% {
        top: -50%;
    }
    100% {
        top: 100%;
    }
}
        .name { color: var(--cyan); font-weight: 800; letter-spacing: 2px; text-transform: uppercase; margin-top: 10px; }

        .nav-dots { margin-top: 50px; display: flex; gap: 12px; }
        .dot {
            width: 10px; height: 10px; border: 1px solid var(--cyan);
            cursor: pointer; transition: 0.3s;
        }
        .dot.active { background: var(--cyan); box-shadow: 0 0 1px var(--cyan); transform: rotate(45deg); }


@media (max-width: 600px) {
    .card {
        width: 90%;
    }
    .photo-wrapper {
        width: 25%;
    }
    .content p {
        font-size: 14px;
    }
}



/* Curriculum */

         
/* *{
margin:0;
padding:0;
box-sizing:border-box;
font-family: 'Segoe UI', sans-serif;
}  */
/* page title */
.page-title{
background:linear-gradient(135deg,#f8f544,#FFCB05);
color:white;
text-align:center;
padding:70px 20px;
}

.page-title h1{
font-size:35px;
margin-bottom:15px;
/* font-weight: 500; */
}

.page-title p{
font-size:18px;
margin-bottom:45px;
}

.page-title > button {
background:rgb(1, 19, 187);
color:#ffffff;
padding:15px 28px;
text-decoration:none;
font-weight:bold;
border-radius:5px;
border:0;
}

.page-data{background-color: #FFF; text-align: left; padding:60px 10px; }
.page-data p{margin-bottom: 10px; font-size: 15px;}
@media(max-width:768px){
.page-title h1{font-size:30px;}
}

.curriculum{
padding:60px 10%;
background:#f4f7fc;
}

.curriculum h1{
text-align:center;
margin-bottom:40px;
/* font-weight: 600;     */
}

.timeline{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:25px;
}


.timeline-card{
background:white;
padding:25px;
border-radius:10px;
box-shadow:0 6px 15px rgba(0,0,0,0.08);
transition:0.3s;
}

.timeline-card:hover{
transform:translateY(-5px);
}

.timeline-card h3{
color:#000000;
margin-bottom:15px;
font-weight: 500;
}

.timeline-card ul{
padding-left:18px;
line-height:1.6;
}


/* PRICING SECTION */
.pricing-section{
padding:100px 10%;
background:linear-gradient(135deg,#1e3c72,#0b4ed7);
color:white;
text-align:center;
}

.pricing-section h1{
font-weight: 500;
}

.pricing-section h2{
font-size:35px;
margin-bottom:50px;
}
.pricing-card p{padding: 3px 0; font-size: 16px;}

.pricing-card{
background:white;
color:#222;
max-width:500px;
margin:auto;
padding:40px 30px;
border-radius:20px;
box-shadow:0 15px 40px rgba(0,0,0,0.2);
position:relative;
transition:0.4s;
}

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

.discount-badge{
position:absolute;
top:-15px;
right:-15px;
background:linear-gradient(90deg,#eeff00,#FFCB05);
color:rgb(0, 0, 0);
padding:10px 15px;
border-radius:50px;
font-size:14px;
font-weight:bold;
box-shadow:0 5px 15px rgba(0,0,0,0.2);
}

.pricing-border{
    border:1px dashed #111; 
    padding:13px 10px !important; 
    border-radius: 8px; 
    width: 70%; margin:0 auto;
    box-shadow: 0 10px 15px #cccccc42;
}

.old-price{
text-decoration:line-through;
color:gray;
font-size:24px;
}

.new-price{
font-size:28px;
font-weight:bold;
color:#1e3c72;
margin:15px 0;
margin-left:10px
}

.pricing-card ul{
list-style:none;
padding:0;
margin:20px 0;
text-align: left;
}

.pricing-card ul li{
margin:10px 0;
}

.installments{background-color:#FFF; 
    padding:3px 0; 
    border-radius:0px; 
    color:green; 
    border:1px dotted #111; 
    width:170px; 
    margin:0 auto;  
    margin-top:-10px;
}

.pricing-btn{
display:inline-block;
margin-top:20px;
padding:12px 25px;
background:linear-gradient(90deg,#00c6ff,#0072ff);
color:rgb(255, 255, 255) !important;
text-decoration:none;
border-radius:30px;
font-weight:bold;
transition:0.3s;
border:0px !important;
font-size:16px;
}

.pricing-btn:hover{
transform:scale(1.1);
}

@media(max-width:768px){
.pricing-section, .curriculum{padding-left:5%; padding-right: 5%;}
.pricing-section h1{font-size:22px; margin-bottom:5px;}
.old-price{font-size:20px;}
.new-price{font-size:24px;}
.pricing-border{width:85%;padding:10px 5px !important;}
.pricing-card{padding-left:15px; padding-right:15px;}
.pricing-card ul li{font-size:14px}
.page-data h1, p{padding-left:10px; padding-right:10px}
}


/* PRICING SECTION ENDS */