#context-menu {
  display: none !important;
}

/* --------------------- */

.navbar-nav > li > a {
  color: #000000;
  font-weight: bold;
}
.nav > li > a:hover {
  border-radius: 7px;
}
.page-banner {
  margin-bottom: 50px !important;
}
.super_container{
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border-radius: 0px 0px 10px 10px;
}
/* ------------------------- */


:root{
  --glass: rgba(255,255,255,0.07);
  --card-radius: 18px;
  --accent1: linear-gradient(135deg,#ff9a9e 0%,#fad0c4 100%);
  --accent2: linear-gradient(135deg,#a18cd1 0%,#fbc2eb 100%);
  --accent3: linear-gradient(135deg,#89f7fe 0%,#66a6ff 100%);
  --accent4: linear-gradient(135deg,#f6d365 0%,#fda085 100%);
}


/* Hero */
.hero{
  padding:5rem 1rem;
  text-align:center;
}
.hero h1{
  font-size:2.6rem;
  font-weight:700;
  letter-spacing: -0.02em;
  margin-bottom:.6rem;
}
.hero p.lead{opacity:0.9}

/* Courses full width row */
.courses-row{padding:2rem 0 4rem 0}

.course-card{
  border-radius:var(--card-radius);
  overflow:hidden;
  padding:2rem;
  min-height:360px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  box-shadow: 0 10px 30px rgba(2,6,23,0.6), inset 0 -1px 0 rgba(255,255,255,0.03);
  transition:transform .45s cubic-bezier(.2,.9,.2,1), box-shadow .45s;
  transform-origin:center;
  background:var(--glass);
  border:1px solid rgba(255,255,255,0.04);
  backdrop-filter: blur(6px) saturate(120%);
}

.course-card:hover{transform:translateY(-10px) scale(1.01); box-shadow: 0 18px 40px rgba(2,6,23,0.8);color:#000000;}

.card-top{display:flex; align-items:center; gap:1rem}
.card-icon{
  width:68px; height:68px; border-radius:14px; display:grid; place-items:center; font-size:1.6rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.35); border:1px solid rgba(255,255,255,0.04);
}

.card-title{font-size:1.35rem; font-weight:700; margin-bottom:0.2rem}
.card-sub{font-size:.92rem; opacity:.9}

.pill{display:inline-block; padding:6px 10px; border-radius:999px; font-weight:600; font-size:.85rem}

.course-fee{font-weight:800; font-size:1.15rem}

.modules{margin-top:1rem;overflow:auto; padding-right:6px}
.modules ul{padding-left:1rem}

.btn-course{
  border-radius:999px;
  padding:10px 18px;
  font-weight:700;
  box-shadow: 0 8px 20px rgba(2,6,23,0.5);
}

/* gradient accents */
.accent-1{background:var(--accent1);}
.accent-2{background:var(--accent2);}
.accent-3{background:var(--accent3);}
.accent-4{background:var(--accent4);}

/* small overlay shapes */
.shape{
  position:absolute; right:-40px; top:-40px; width:160px; height:160px; opacity:.13; transform:rotate(25deg);
  filter: blur(20px);
}

/* animation on scroll */
.animate{
  opacity:0; transform:translateY(30px) scale(.98);
  transition:all .7s cubic-bezier(.2,.9,.2,1);
}
.animate.in-view{opacity:1; transform:translateY(0) scale(1);} 

/* floating accent */
@keyframes floaty{0%{transform:translateY(0)}50%{transform:translateY(-8px)}100%{transform:translateY(0)}}
.float{animation:floaty 6s ease-in-out infinite}

/* responsive tweaks */
@media (max-width:991px){
  .hero h1{font-size:2rem}
  .course-card{min-height:320px}
}
@media (max-width:575px){
  .hero{padding:3rem 1rem}
  .course-card{padding:1.25rem}
}

/* custom scrollbar for modules */
.modules::-webkit-scrollbar{width:6px}
.modules::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(255,255,255,0.12),rgba(255,255,255,0.06)); border-radius:10px}






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






.course-card {
  border: none;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  animation: fadeInUp 1s ease forwards;
}
.course-card:hover {
  transform: translateY(-10px) scale(1.05);
  box-shadow: 0 15px 30px rgba(0,0,0,0.25);
}
.course-img {
  object-fit: cover;
}
.card-body {
  text-align: center;
  background: linear-gradient(135deg, #f9d4ec, #f7e7ff);
  padding: 25px;
}
.course-title {
  font-size: 18px;
  font-weight: 700;
  color: #5a2a7a;
  margin-bottom: 10px;
}
.course-price {
  font-size: 18px;
  font-weight: bold;
  color: #d63384;
  background: #fff;
  padding: 6px 15px;
  border-radius: 50px;
  display: inline-block;
  animation: pulse 2s infinite;
}
/* Animations */
@keyframes fadeInUp {
  0% {opacity: 0; transform: translateY(40px);}
  100% {opacity: 1; transform: translateY(0);}
}
@keyframes pulse {
  0%, 100% {transform: scale(1);}
  50% {transform: scale(1.1);}
}






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





.navbar {
  margin-bottom: 0px;
}
#navbar {
  margin-top: 20px;
}
.navbar-default .navbar-nav > li > a {
  color: #000;
  font-weight: bold;
}





/*-------------------------*/
.breadcrumb {
  background-color: transparent !important;
}
.bc_new {
  position: relative;
  background-position: center center;
  background-size: 100% auto;
  padding: 60px 0px;
  background-repeat: no-repeat;
  overflow-x: hidden;
}
.bc_new > .row{
  position: relative;
  z-index: 1;
}
.bc_new::after {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-color: rgba(0, 0, 0, 0.5);
}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
  .bc_new {
    background-position: center 20%;
    background-size: 200% auto;
  }
  .super_container {
    width: 100% !important;
  }
}
/*-------------------------*/




  
  /* TEXT REVEAL */
  .super-text-reveal-load {
    position: relative;
    width: 100%;
    height: auto;
  }
  .super-text-reveal-mask{
    position: absolute;
    content: "";
    width:100%;
    height: 100%;
    background-color: #ffffff;
    box-shadow: -40px 0px 20px #ffffff;
    top: 0px;
    right: 0px;
    z-index: 2000;
  }
  .super-text-reveal-exe {
    animation: revealtext 1s ease-in-out;
    animation-fill-mode: forwards;
  }
  @keyframes revealtext {
    from {
      width: 100%;
      border-left: 0px solid #808080;
    }
    to {
      width: 0%;
      border-left: 0px solid #808080;
    }
  }
  /* TEXT REVEAL */