* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

img {
  max-width: 100%;
}

a,
a:hover,
a:focus,
a:visited,
a:active {
  text-decoration: none;
}

p,
ul,
li {
  padding: 0;
  margin: 0;
}

body {
  font-family: "Lato", sans-serif;
  overflow-x:hidden;
}
 

.navbar .navbar-brand img{ width: 200px; height: auto;}

.custom-nav{ transition: 0.3s ease; background: #191919 !important;}

.custom-nav .navbar-nav .nav-item a{ color: #fff;}

#nav-enquiry {display: none ;}

@media (max-width:992px) {
  #nav-enquiry1 {display: none;}
  #nav-enquiry {display: block ;}
}

/* SLIDER MAIN */
#slider{
    width:100%;
    position:relative;
    overflow:hidden;
}




/* DARK OVERLAY */
#slider .dark-layer{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,0.45);
    z-index:1;
}

/* TEXT OVERLAY */
#slider .slider-overlay{
    position:absolute;
    top:50%;
    left:8%;
    transform:translateY(-50%);
    z-index:2;
    color:#fff;
    max-width:550px;
}

/* HEADING */
#slider .slider-overlay h1{
    font-size:52px;
    font-weight:700;
    line-height:1.2;
    margin-bottom:18px;
}

/* PARAGRAPH */
#slider .slider-overlay p{
    font-size:20px;
    line-height:1.5;
    margin-bottom:30px;
}

/* BUTTON */
#slider .slider-overlay .btn{
    display:inline-block;
    padding:12px 28px;
    border:2px solid #fff;
    color:#fff;
    text-decoration:none;
    transition:0.3s ease;
}

#slider .slider-overlay .btn:hover{
    background:#fff;
    color:#000;
}

/* ----------- TABLET RESPONSIVE ----------- */
@media (max-width: 992px){

    #slider .imgs img{
    width:100%;
    height:100vh;
    object-fit:cover;
    display:block;
}

    #slider .slider-overlay{
        left:5%;
        max-width:420px;
    }

    #slider .slider-overlay h1{
        font-size:38px;
    }

    #slider .slider-overlay p{
        font-size:17px;
    }
}

/* ----------- MOBILE RESPONSIVE ----------- */
@media (max-width: 576px){

    #slider .imgs img{
        height:80vh;
    }

    #slider .slider-overlay{
        top:55%;
        left:5%;
        transform:translateY(-50%);
        max-width:90%;
    }

    #slider .slider-overlay h1{
        font-size:28px;
        line-height:1.3;
    }

    #slider .slider-overlay p{
        font-size:15px;
    }

    #slider .slider-overlay .btn{
        padding:10px 15px;
        font-size:14px;
    }
}

/* ----------- VERY SMALL DEVICES ----------- */
@media (max-width: 380px){
    #slider .imgs img{ height:70vh; }
    #slider .slider-overlay h1{ font-size:24px; }
}






.brand-subtitle{ color: #666; max-width: 700px; margin: 10px auto 0; font-size: 18px;}
.brand-card{ background: rgba(255, 255, 255, 0.75); backdrop-filter: blur(12px); margin-bottom: 20px; padding: 35px 25px; border-radius: 20px; text-align: center; box-shadow: 0 10px 35px rgba(0,0,0,0.08); transition: 0.3s ease; position: relative;}
.brand-card:hover{ transform: translateY(-10px); box-shadow: 0 18px 45px rgba(0,0,0,0.14);}
.brand-logo{ width: 95px; height: 95px; background: #fff; border-radius: 16px; margin: auto; display: flex; align-items: center; justify-content: center; overflow: hidden; box-shadow: 0 10px 20px rgba(0,0,0,0.08); transition: 0.3s ease;}
.brand-card:hover .brand-logo{ transform: scale(1.08);}
.brand-logo img{ width: 75%; object-fit: contain;}
.brand-name{ margin-top: 18px; font-weight: 700; color: #ff5656; font-size: 22px;}
.brand-role{ color: #333; font-size: 16px; margin-top: 5px;}





#multi-bottom-form .multi-container { width: 550px; margin: 50px auto; border-radius: 20px; background: white; box-shadow: 0 10px 25px rgba(0,0,0,0.1); overflow: hidden; }
#multi-bottom-form .multi-header { background: #8c53fe; color: #fff; text-align: center; padding: 25px; font-size: 20px; }
#multi-bottom-form .step-indicator { text-align: center; margin: 15px 0; }
#multi-bottom-form .step-dot { height: 12px; width: 12px; background: #ccc; display: inline-block; border-radius: 50%; margin: 0 4px; }
#multi-bottom-form .step-dot.active { background: #8c53fe; }
#multi-bottom-form .form-step { display: none; padding: 30px; }
#multi-bottom-form .form-step.active { display: block; }
#multi-bottom-form .step-title { text-align: center; margin-bottom: 20px; font-size: 20px; }
#multi-bottom-form .input-box { width: 100%; padding: 12px; border-radius: 8px; border: 1px solid #ccc; font-size: 15px; outline: none; }
#multi-bottom-form .input-box:focus { border-color: #8c53fe; }
#multi-bottom-form .btn { width: 100%; padding: 12px; border-radius: 8px; border: none; cursor: pointer; font-size: 16px; }
#multi-bottom-form .next-btn, .submit-btn { background: #8c53fe; color: white; }
#multi-bottom-form .back-btn { background: #ccc; }
#multi-bottom-form .btn-flex { display: flex; gap: 10px; }
@media (max-width: 992px){ 
    #multi-bottom-form .multi-container { width: 100%; }
}





.primary-btn{ background: #ff5656; color: #fff; padding: 10px 26px; border-radius: 8px; transition: 0.3s;}

.primary-btn:hover{ background: #fff; transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0, 51, 204, 0.3);}

.outline-btn{ border: 2px solid #ff5656; color: #ff5656; padding: 10px 26px; border-radius: 8px; transition: 0.3s;}

.outline-btn:hover{ background: #ff5656; color: #fff; transform: translateY(-3px);}

.section-padding{ padding: 80px 0;}

.section-title{ font-weight: 700; font-size: 32px; margin-bottom: 18px;}

.section-text{ max-width: 750px; margin: auto; font-size: 18px; color: #555;}

.info-box{color:#fff; background: linear-gradient(135deg, #e0d1ff, #8c52fd) !important;min-height: 260px;}
.info-box img{ width: 100px; height: auto; margin-bottom: 30px; filter: invert(1);}

.info-box, .benefit-box, .step-box{ background: #fff; padding: 25px; border-radius: 12px; text-align: center; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06); transition: 0.3s;}

.info-box:hover, .benefit-box:hover, .step-box:hover{ transform: translateY(-6px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);}

.form-box{ padding: 40px; background: #fff; border-radius: 12px; box-shadow: 0 4px 25px rgba(0, 0, 0, 0.09); transition: 0.3s;}

.form-box:hover{ transform: scale(1.01);}

.footer{ padding: 30px; background: #111; color: #fff;}

.steps-flow{ position: relative;}

.steps-wrapper{ display: flex; justify-content: space-between; align-items: center; margin-top: 60px; gap: 20px; position: relative;}

/* .steps-wrapper::before{ content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 12px; background: url('https://i.ibb.co/fQ31z9Q/zigzag.png') repeat-x center; opacity: 0.5; transform: translateY(-50%);}

*/ .step-item{ text-align: center; width: 16%; position: relative;}

.step-shape{ width: 110px; height: 110px; background: linear-gradient(135deg, #e0d1ff, #8c52fd); transform: rotate(45deg); margin: auto; border-radius: 20px; display: flex; align-items: center; justify-content: center; transition: 0.4s ease; box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);}

.step-shape img{ width: 45px; height: 45px; transform: rotate(-45deg);}

.step-shape:hover{ transform: rotate(45deg) scale(1.08); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);}

.step-top-text{ margin-top: 30px; font-weight: 700; color: #1fa9d8; font-size: 17px;}

.step-bottom-text{ font-size: 14px; color: #ffffff; opacity: 0.9;}

@media (max-width: 992px){ .steps-wrapper{ flex-wrap: wrap; justify-content: center; gap: 30px;}
.step-item{ width: 40%;}}

@media (max-width: 576px){ .step-item{ width: 80%;}}




/* quickcontact */
.quickcontact { width: 45px; position: fixed; top: 77%; right: 15px; z-index: 102; }


/* modal */

.modal form.row { row-gap: 20px; }
.modal .form-control { border-radius: 0px; border: none; box-shadow: none; background-color: #f1f1f1; }
.modal .form-control:focus { border-color: #000; }
.modal .submit { background-color: #ff5656; color: #fff; font-weight: 500px; padding: 10px; border: 0; transition: .5; }
.modal .submit:hover { background-color: #000; }












#members { padding: 50px 0; font-family: Arial, sans-serif; background-color: #f8f8f8; }
.team-row { display: flex; justify-content: space-between; margin-bottom: 40px; }
.team-member { display: flex; align-items: center; width: 100%; height: 250px; margin: 0 10px; padding: 15px; border-radius: 100px; background-color: #fff; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05); }
.profile-img-container { width: 400px; height: 230px; border-radius: 50%; overflow: hidden; margin-right: 15px; box-shadow: 0 0 0 5px rgba(230, 230, 230, 0.5);  }
.profile-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.member-info { flex-grow: 1; }
.member-name { margin: 0 0 5px 0; font-size: 18px; font-weight: bold; color: #333; }
.member-designation { margin: 0 0 8px 0; font-size: 14px; color: #ff5656; font-weight: 600; }
.member-description { margin: 0 0 10px 0; font-size: 12px; color: #666; line-height: 1.4; }
.social-links { margin-top: 5px; display: flex; gap: 8px; }
.social-links a { color: #aaa; font-size: 16px; transition: color 0.3s ease; }
.social-links a:hover { color: #007bff; }
.team-section { position: relative; overflow: hidden; padding: 60px 0 60px 0; }
@media (max-width: 992px) {
    .team-member { width: calc(50% - 20px); margin-bottom: 20px; display: ruby; text-align: center; padding: 30px 10px; height:100%; }
    .team-row { flex-wrap: wrap; justify-content: center; }

	#members { padding: 60px 15px; }

	.profile-img-container { width: 150px; height: 150px; }
	.social-links{ justify-content: center; }
}



/* =========== MISSION SECTION =========== */
.mission-section {
    background: #f5f7ff;
    padding: 80px 20px;
}

.center-title {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    color: #ff5656;
    margin-bottom: 50px;
}

.mission-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

.mission-card {
    background: #fff;
    padding: 25px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: 0.3s;
}

.mission-card:hover {
    transform: translateY(-5px);
}

.mission-card img {
    width: 60px;
    margin-bottom: 15px;
}

.mission-card h3 {
    font-size: 20px;
    color: #000;
    margin-bottom: 10px;
}

.mission-card p {
    font-size: 15px;
    color: #555;
}






    :root{--btn-padding: 10px 20px;--btn-radius:34px;--btn-font-size:16px;--animation-duration:4s;--slide-duration:650ms;--glow-intensity:10px}
    .slide-btn{position:fixed;right:0;top:90%;transform:translateY(-50%) translateX(120%);display:inline-flex;align-items:center;gap:10px;padding:var(--btn-padding);border-radius:var(--btn-radius) 0 0 var(--btn-radius);font-size:var(--btn-font-size);font-weight:600;color:#06111a;text-decoration:none;border:none;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.45);outline:none;z-index:9999;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:transform var(--slide-duration) cubic-bezier(.2,.9,.2,1),box-shadow .2s ease;background:linear-gradient(90deg,#ff7a18,#af002d)}
    .slide-btn.slide-in{transform:translateY(-50%) translateX(0)}
    .slide-btn:hover{transform:translateY(-50%) translateX(0) scale(1.02);box-shadow:0 10px 30px rgba(0,0,0,.5)}
    .slide-btn:active{transform:translateY(-50%) translateX(0) scale(.98)}
    .slide-btn:focus{outline:3px solid rgba(255,255,255,.12);outline-offset:4px}
   @keyframes colorCycle{
      0%{background:linear-gradient(90deg,#A64BD9,#F36DD2);}
      20%{background:linear-gradient(90deg,#F36DD2,#F8C28E);}
      40%{background:linear-gradient(90deg,#F8C28E,#27C4F0);}
      60%{background:linear-gradient(90deg,#27C4F0,#693DA0);}
      80%{background:linear-gradient(90deg,#693DA0,#A64BD9);}
      100%{background:linear-gradient(90deg,#A64BD9,#F36DD2);}
    }
    
    @keyframes glowPulse{
      0%{box-shadow:0 6px 18px rgba(0,0,0,.45),0 0 0 rgba(0,0,0,0);filter:saturate(1)}
      50%{box-shadow:0 14px 36px rgba(0,0,0,.55),0 0 var(--glow-intensity) rgba(255,255,255,.06);filter:saturate(1.08)}
      100%{box-shadow:0 6px 18px rgba(0,0,0,.45),0 0 0 rgba(0,0,0,0);filter:saturate(1)}
    }

    .slide-btn.slide-in.bling{animation:colorCycle var(--animation-duration) linear infinite,glowPulse calc(var(--animation-duration)*1.2) ease-in-out infinite}
    .slide-btn .icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.85);font-size:14px;font-weight:700;color:#0b1220;box-shadow:0 2px 8px rgba(0,0,0,.18) inset}
    @media(max-width:520px){.slide-btn{padding:10px 14px;font-size:14px;border-radius:26px 0 0 26px}.slide-btn .icon{width:30px;height:30px;font-size:13px}}
    @media(prefers-reduced-motion:reduce){.slide-btn,.slide-btn.slide-in{transition:none;transform:none}.slide-btn{right:8px;bottom:24px;top:auto}.slide-btn.bling,.slide-btn{animation:none}}










/* =========== BANNER =========== */
.program-banner {
    background: #8c53fe;
    padding: 100px 20px;
    text-align: center;
    color: #fff;
}

.program-banner h1 {
    font-size: 40px;
    font-weight: 700;
}

.program-banner p {
    font-size: 18px;
    margin-top: 10px;
    opacity: 0.9;
}

/* =========== OVERVIEW SECTION =========== */
.program-overview {
    padding: 70px 20px;
        text-align: center;
}

.program-overview .container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.section-title {
    font-size: 32px;
    font-weight: 600;
    color: #ff5656;
    margin-bottom: 20px;
}

.overview-text {
    font-size: 17px;
    color: #555;
    line-height: 1.7;
    max-width: 900px;
}

/* =========== HIGHLIGHT CARDS =========== */
.highlight-section {
    background: #f7f9ff;
    padding: 70px 20px;
}

.highlight-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.highlight-card {
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
    transition: 0.3s;
}

.highlight-card:hover {
    transform: translateY(-6px);
}

.highlight-card img {
    width: 70px;
    margin-bottom: 15px;
}

.highlight-card h3 {
    font-size: 20px;
    color: #000;
    margin-bottom: 10px;
}

.highlight-card p {
    font-size: 15px;
    color: #555;
}

/* =========== VALUES SECTION =========== */
.values-section {
    padding: 80px 20px;
}

.center {
    text-align: center;
}

.values-grid {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.value-card {
    background: #fff;
    padding: 18px 20px;
    border-left: 5px solid #8c53fe;
    border-radius: 10px;
    font-size: 16px;
    color: #333;
    box-shadow: 0 6px 18px rgba(0,0,0,0.1);
    display: flex;
    align-items: center;
    gap: 10px;
}

.value-card span {
    font-size: 20px;
    font-weight: 700;
    color: #8c53fe;
}

/* =========== FOOTER =========== */
.footer {
    background: #8c53fe;
    padding: 15px;
    text-align: center;
    color: #fff;
    font-size: 14px;
}

/* =========== RESPONSIVE =========== */
@media (max-width: 968px) {
    .highlight-grid,
    .values-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .program-banner h1 {
        font-size: 32px;
    }
}

@media (max-width: 600px) {
    .highlight-grid,
    .values-grid {
        grid-template-columns: 1fr;
    }

    .program-banner h1 {
        font-size: 28px;
    }
}















/* =========== BANNER =========== */
.benefits-banner {
    background: #8c53fe;
    padding: 100px 20px;
    text-align: center;
    color: #fff;
}

.benefits-banner h1 {
    font-size: 40px;
    font-weight: 700;
}

.benefits-banner p {
    font-size: 18px;
    margin-top: 10px;
    opacity: 0.9;
}

/* =========== BENEFITS GRID =========== */
.benefits-section {
    padding: 80px 20px;
}

.container {
    max-width: 1200px;
    margin: auto;
}

.section-title {
    font-size: 32px;
    font-weight: 600;
    color: #ff5656;
    margin-bottom: 40px;
}

.benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.benefit-card {
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
    transition: 0.3s;
}

.benefit-card:hover {
    transform: translateY(-6px);
}

.benefit-card img {
    width: 70px;
    margin-bottom: 15px;
}

.benefit-card h3 {
    font-size: 20px;
    color: #000;
    margin-bottom: 10px;
}

.benefit-card p {
    font-size: 15px;
    color: #555;
}

/* =========== COMPARISON TABLE =========== */
.comparison-section {
    background: #f7f9ff;
    padding: 80px 20px;
}

.center {
    text-align: center;
}

.comparison-table {
    width: 100%;
    max-width: 700px;
    margin: 40px auto 0;
    border-collapse: collapse;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

.comparison-table th,
.comparison-table td {
    padding: 15px 20px;
    border-bottom: 1px solid #eee;
    font-size: 16px;
}

.comparison-table th {
    background: #8c53fe;
    color: #fff;
    font-weight: 600;
}

.comparison-table td {
    color: #333;
}

.comparison-table tr:last-child td {
    border-bottom: none;
}


/* =========== FOOTER =========== */
.footer {
    background: #8c53fe;
    text-align: center;
    padding: 15px;
    color: #fff;
    font-size: 14px;
}

/* =========== RESPONSIVE =========== */
@media (max-width: 968px) {
    .benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .benefits-grid {
        grid-template-columns: 1fr;
    }

    .benefits-banner h1 {
        font-size: 30px;
    }
}












.hiw-banner {
    background: #8c53fe;
    padding: 100px 20px;
    text-align: center;
    color: #fff;
}

.hiw-banner h1 {
    font-size: 40px;
    font-weight: 700;
}

.hiw-banner p {
    font-size: 18px;
    margin-top: 10px;
    opacity: 0.9;
}

/* =========== TIMELINE SECTION =========== */
.timeline-section {
    padding: 80px 20px;
}

.container {
    max-width: 1100px;
    margin: auto;
}

.section-title {
    font-size: 32px;
    font-weight: 600;
    color: #ff5656;
    margin-bottom: 40px;
    text-align: center;
}

/* Timeline layout */
.timeline {
    position: relative;
    padding-left: 30px;
    margin-left: 20px;
    border-left: 4px solid #8c53fe;
}

/* Timeline Item */
.timeline-box {
    display: flex;
    gap: 25px;
    margin-bottom: 40px;
    position: relative;
}

.timeline-box .icon {
    width: 60px;
    height: 60px;
    background: #fff;
    border: 3px solid #8c53fe;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: -50px;
    top: 0;
}

.timeline-box .icon img {
    width: 30px;
}

.timeline-box .content {
    background: #fff;
    padding: 20px 25px;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
    width: 100%;
}

.timeline-box h3 {
    font-size: 20px;
    color: #000;
    margin-bottom: 8px;
}

.timeline-box p {
    font-size: 15px;
    color: #444;
    line-height: 1.6;
}

/* =========== FOOTER =========== */
.footer {
    background: #8c53fe;
    padding: 15px;
    text-align: center;
    color: #fff;
    font-size: 14px;
}



/* =========== RESPONSIVE =========== */
@media (max-width: 768px) {

    .hiw-banner h1 {
        font-size: 32px;
    }

    .timeline {
        padding-left: 0;
        border-left: none;
    }

    .timeline-box {
        flex-direction: column;
        padding-left: 0;
        margin-left: 0;
    }

    .timeline-box .icon {
        position: relative;
        left: 0;
        margin-bottom: 15px;
    }
}










