/* Custom Styles for B.Sc. AI & ML Program Banner and Layout (2026 Update) */

/* Hero Banner Section Base Styles */
.programOverviewWrap {
  background-image: url(../img/bsc-ai-bann.png) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  padding: 70px 0 35px 0 !important;
  position: relative !important;
  overflow: hidden !important;
  margin-top: 80px;
}

/* Subtle left-to-right overlay gradient so text remains readable without obscuring the background image */
.programOverviewWrap::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0.1) 100%) !important; */
  z-index: 1;
  pointer-events: none;
}

.poContent {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 30px !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Text Area Layout */
.poContentTxt {
  flex: 1 !important;
  min-width: 300px !important;
  max-width: 580px !important;
}

/* Title Typography */
.poContentTxt h1 {
  font-size: 40px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.5px !important;
  color: #ffffff !important;
  margin-bottom: 15px !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.4) !important;
}

/* Yellow Sub-heading */
.poContentTxt h1 span {
  display: inline-block;
  background: linear-gradient(90deg, #FCBD12, #FCBD12) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  margin-top: 8px !important;
  letter-spacing: -0.2px !important;
}

/* Sub-headline description text */
.poContentTxt h3 {
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  color: #FCBD12 !important;
  margin-top: 12px !important;
  margin-bottom: 25px !important;
  max-width: 560px !important;
  letter-spacing: 0.3px !important;
}

/* Breadcrumb Styling */
.bread-crumb {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
  margin-bottom: 25px !important;
  padding: 0 !important;
  list-style: none !important;
}

.bread-crumb li {
  font-size: 13px !important;
  color: rgba(255, 255, 255, 0.5) !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.bread-crumb li a {
  color: rgba(255, 255, 255, 0.75) !important;
  transition: color 0.2s ease !important;
  text-decoration: none !important;
}

.bread-crumb li a:hover {
  color: #FCBD12 !important;
}

.bread-crumb li:before {
  display: none !important;
}

.bread-crumb li + li::before {
  display: inline-block !important;
  content: "/" !important;
  color: rgba(255, 255, 255, 0.35) !important;
  margin-right: 8px !important;
  position: static !important;
}

/* CTA Buttons layout */
.hBtnHM {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  margin-top: 25px !important;
}

.hBtnHM a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  /* height: 48px !important; */
  padding: 10px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  margin: 0 !important;
}

/* Global CTA buttons - Replaces red with a premium gold gradient pill */
a.hBtnRed {
  background: linear-gradient(135deg, #FCBD12 0%, #FCBD12 100%) !important;
  color: #000000 !important; /* Dark text for readability & premium look */
  font-weight: 700 !important;
  border: none !important;
  border-radius: 30px !important; /* Rounded pill look */
  padding: 12px 36px !important; /* Balanced padding */
  box-shadow: 0 4px 15px rgba(252, 189, 18, 0.2) !important;
  text-shadow: none !important;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  display: inline-block !important;
  text-align: center !important;
  text-decoration: none !important;
}

a.hBtnRed:hover {
  background: linear-gradient(135deg, #FCBD12 0%, #FCBD12 100%) !important;
  color: #000000 !important;
  box-shadow: 0 6px 20px rgba(252, 189, 18, 0.35) !important;
  transform: translateY(-2px) !important;
  text-decoration: none !important;
}

/* Specific banner Apply Now CTA style overrides */
.hBtnHM a.hBtnRed {
  background: linear-gradient(135deg, #FCBD12 0%, #FCBD12 100%) !important;
  color: #000000 !important;
  border: none !important;
  border-radius: 30px !important; /* Match pill look */
  padding: 12px 36px !important;
  box-shadow: 0 4px 15px rgba(252, 189, 18, 0.2) !important;
}

.hBtnHM a.hBtnRed:hover {
  background: linear-gradient(135deg, #FCBD12 0%, #FCBD12 100%) !important;
  color: #000000 !important;
  box-shadow: 0 6px 20px rgba(252, 189, 18, 0.35) !important;
  transform: translateY(-2px) !important;
}

.hBtnHM a.hBtn {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

.hBtnHM a.hBtn:hover {
  background: rgba(255, 255, 255, 0.15) !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
  transform: translateY(-2px) !important;
}


/* Premium Glassmorphic Form Card */
.poContent #Enqui2 {
  flex: 0 0 480px !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  z-index: 10 !important;
}

.poContent .getinTouchForm {
  background: rgba(0, 0, 0, 0.8) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 12px !important;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.5) !important;
  padding: 24px 20px !important;
  position: relative;
  overflow: hidden;
}

.poContent .getinTouchForm .row {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-left: -6px !important;
  margin-right: -6px !important;
}

/* Display fields 2-per-row on wider screens */
.poContent .getinTouchForm .row .form-group {
  flex: 0 0 50% !important;
  max-width: 50% !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  margin-bottom: 12px !important;
}

/* Hide form group wrappers that contain hidden inputs to keep grid neat */
.poContent .getinTouchForm .row .form-group:has(input[type="hidden"]) {
  display: none !important;
}

/* Ensure checkbox and submit area span full width (100%) */
.poContent .getinTouchForm .row > div:not(.form-group) {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
}

/* Inputs & Form controls styling */
.poContent .form-control {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  height: 42px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  transition: all 0.2s ease !important;
}

.poContent .form-control::placeholder {
  color: #ffffff !important;
  opacity: 0.85 !important;
}

.poContent .form-control::-webkit-input-placeholder {
  color: #ffffff !important;
  opacity: 0.85 !important;
}

.poContent .form-control::-moz-placeholder {
  color: #ffffff !important;
  opacity: 0.85 !important;
}

.poContent .form-control:-ms-input-placeholder {
  color: #ffffff !important;
  opacity: 0.85 !important;
}

.poContent .form-control:focus {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-color: #FCBD12 !important;
  box-shadow: 0 0 0 2px rgba(252, 189, 18, 0.15) !important;
  outline: none !important;
}

.poContent select.form-control option {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* Checkbox & Consent text alignment and size */
.poContent #Enqui2 p {
  color: rgba(255, 255, 255, 0.75) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  text-align: left !important;
  margin-top: 8px !important;
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
}

.poContent #Enqui2 p input[type="checkbox"] {
  margin-top: 2px !important;
  width: 13px !important;
  height: 13px !important;
  cursor: pointer !important;
  accent-color: #FCBD12 !important;
}

/* Submit Button */
.poContent #Enqui2 #submitBtn {
  display: block !important;
  width: 100% !important;
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 4px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 10px !important;
  text-align: center !important;
  box-shadow: 0 4px 12px rgba(102, 0, 0, 0.3) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.poContent #Enqui2 #submitBtn:hover {
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  box-shadow: 0 5px 15px rgba(102, 0, 0, 0.45) !important;
  transform: translateY(-1px) !important;
}


/* --- Header & Mobile Navigation Fixes --- */

/* Make mobile menu button visible (dark color on light header background) */
#menu-btn {
  color: #1a1a1a !important;
}

#menu-btn::before {
  color: #1a1a1a !important;
}


/* --- Mobile Responsive Rules --- */
@media (max-width: 993px) {
  /* Hide mobile menu by default when closed to match home page flow */
  header:not(.menu-open) #mainmenu {
    display: none !important;
  }

  /* Decrease logo size on tablet/mobile screens */
  div#logo img {
    max-width: 300px !important;
  }
  
  /* Decrease header CTA buttons size and padding on tablet screens */
  header .btn-main {
    font-size: 11px !important;
    padding: 6px 12px !important;
  }

  .poContent {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 35px !important;
  }
  
  .poContentTxt {
    max-width: 100% !important;
    text-align: center !important;
  }
  
  .bread-crumb {
    justify-content: center !important;
  }
  
  .hBtnHM {
    flex-wrap: wrap !important;
    justify-content: center !important;
  }
  
  .poContent #Enqui2 {
    flex: 1 1 auto !important;
  }
}

@media (max-width: 575px) {
  .programOverviewWrap {
    padding: 110px 0 50px 0 !important;
  }
  
  .poContentTxt h1 {
    font-size: 30px !important;
  }
  
  .poContentTxt h1 span {
    font-size: 18px !important;
  }
  
  /* Buttons stacked full width on mobile screens for modern feel */
  .hBtnHM {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  
  .hBtnHM a {
    width: 100% !important;
  }
  
  /* Revert form fields to 1-per-row (full-width) on small mobile screens for optimal spacing */
  .poContent .getinTouchForm .row .form-group {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

section:has(.featureWrap) {
  background-color: #fbfbfb !important;
  background-image: 
    linear-gradient(30deg, #f5f5f5 12%, transparent 12.5%, transparent 87%, #f5f5f5 87.5%, #f5f5f5),
    linear-gradient(150deg, #f5f5f5 12%, transparent 12.5%, transparent 87%, #f5f5f5 87.5%, #f5f5f5),
    linear-gradient(30deg, #f5f5f5 12%, transparent 12.5%, transparent 87%, #f5f5f5 87.5%, #f5f5f5),
    linear-gradient(150deg, #f5f5f5 12%, transparent 12.5%, transparent 87%, #f5f5f5 87.5%, #f5f5f5),
    linear-gradient(60deg, #f5f5f5 25%, transparent 25.5%, transparent 75%, #f5f5f5 75.5%, #f5f5f5),
    linear-gradient(60deg, #f5f5f5 25%, transparent 25.5%, transparent 75%, #f5f5f5 75.5%, #f5f5f5) !important;
  background-size: 40px 70px !important;
  background-position: 0 0, 0 0, 20px 35px, 20px 35px, 0 0, 20px 35px !important;
  padding: 60px 0 !important;
}

ul.eligibilityList {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

.eligibilityList li {
  flex: 1 1 200px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  border-radius: 12px !important;
  padding: 24px 40px 24px 20px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  overflow: hidden !important;
  border-top: 4px solid #660000 !important;
  border-right: none !important;
}

.eligibilityList li:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 20px 40px rgba(102, 0, 0, 0.08) !important;
  border-top-color: #660000 !important;
}

/* Style paragraphs inside the highlights cards */
.eligibilityList li p:first-child,
.eligibilityList li p b {
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: #666666 !important;
  font-weight: 700 !important;
  margin-bottom: 6px !important;
}

.eligibilityList li p:not(:first-child) {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

/* Day & Time card custom spacing */
.eligibilityList li:nth-child(5) p:not(:first-child) {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  margin-bottom: 4px !important;
}

/* Custom premium icons at the top right of each highlight card */
.eligibilityList li::after {
  font-family: "FontAwesome" !important;
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  font-size: 20px !important;
  color: rgba(102, 0, 0, 0.15) !important;
  transition: all 0.3s ease !important;
}

.eligibilityList li:hover::after {
  color: rgba(102, 0, 0, 0.25) !important;
  transform: scale(1.15) !important;
}

.eligibilityList li:nth-child(1)::after {
  content: "\f073" !important; /* Calendar */
}
.eligibilityList li:nth-child(2)::after {
  content: "\f156" !important; /* Rupee */
}
.eligibilityList li:nth-child(3)::after {
  content: "\f109" !important; /* Laptop */
}
.eligibilityList li:nth-child(4)::after {
  content: "\f0ac" !important; /* Globe */
}
.eligibilityList li:nth-child(5)::after {
  content: "\f017" !important; /* Clock */
}

/* Responsive updates for mobile and tablet */
@media (max-width: 993px) {
  ul.eligibilityList {
    display: flex !important;
    gap: 15px !important;
  }
  
  .eligibilityList li {
    flex: 1 1 calc(50% - 10px) !important;
    padding: 20px 35px 20px 15px !important;
    border-bottom: none !important;
  }
}

@media (max-width: 575px) {
  .eligibilityList li {
    flex: 1 1 100% !important;
  }
}

/* --- Learning & Career Centre Section (Premium Design) --- */
.careerCentreSection {
  padding: 80px 0 !important;
  background: linear-gradient(135deg, #000000 0%, #000000 100%) !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Add a subtle geometric grid overlay inside the dark section */
.careerCentreSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px) !important;
  background-size: 20px 20px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.careerCentreWrap {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 50px !important;
  position: relative !important;
  z-index: 2 !important;
}

.careerCentreInfo {
  flex: 1 1 50% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-self: flex-start !important;
}

@media (min-width: 994px) {
  .careerCentreInfo {
    position: sticky !important;
    top: 100px !important;
  }
}

.ccTagline {
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color: #FCBD12 !important; /* Gold accent color */
  margin-bottom: 15px !important;
  display: inline-block !important;
}

.careerCentreInfo h2 {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1.25 !important;
  margin: 0 0 20px 0 !important;
}

.ccDescription {
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: rgba(255, 255, 255, 0.8) !important;
  margin: 0 !important;
}

.careerCentreHighlights {
  flex: 1 1 50% !important;
  display: flex !important;
  align-items: center !important;
}

.ccHighlightsList {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
  width: 100% !important;
}

.ccHighlightsList li {
  display: flex !important;
  align-items: center !important;
  gap: 15px !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding: 16px 20px !important;
  border-radius: 12px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.ccHighlightsList li:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: #FCBD12 !important;
  transform: translateX(8px) !important;
}

.ccHighlightsList li i {
  font-size: 18px !important;
  color: #FCBD12 !important;
  width: 24px !important;
  text-align: center !important;
}

.ccHighlightsList li span {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
}

/* Responsive Rules for the Career Centre Section */
@media (max-width: 993px) {
  .careerCentreSection {
    padding: 60px 0 !important;
  }

  .careerCentreWrap {
    flex-direction: column !important;
    gap: 35px !important;
  }

  .careerCentreInfo {
    align-self: auto !important;
  }
  
  .careerCentreInfo h2 {
    font-size: 28px !important;
  }
}

@media (max-width: 575px) {
  .careerCentreSection {
    padding: 50px 0 !important;
  }
  
  .careerCentreInfo h2 {
    font-size: 24px !important;
  }
  
  .ccDescription {
    font-size: 14px !important;
  }
  
  .ccHighlightsList li {
    padding: 12px 15px !important;
  }
  
  .ccHighlightsList li span {
    font-size: 13px !important;
  }
}

/* ================================================================
   Key Benefits Section – Premium Design with Geometric Background
   ================================================================ */

.keyBenefitsSection {
  padding: 80px 0 !important;
  position: relative !important;
  overflow: hidden !important;
  background-color: #f5f5f5 !important;
  background-image:
    url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%230056b3' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
}

/* Decorative gradient orb – top-left */
.keyBenefitsSection::before {
  content: "" !important;
  position: absolute !important;
  top: -120px !important;
  left: -120px !important;
  width: 350px !important;
  height: 350px !important;
  background: radial-gradient(circle, rgba(102, 0, 0, 0.08) 0%, transparent 70%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Decorative gradient orb – bottom-right */
.keyBenefitsSection::after {
  content: "" !important;
  position: absolute !important;
  bottom: -100px !important;
  right: -100px !important;
  width: 300px !important;
  height: 300px !important;
  background: radial-gradient(circle, rgba(102, 0, 0, 0.06) 0%, transparent 70%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.keyBenefitsSection > .container {
  position: relative !important;
  z-index: 1 !important;
}

/* --- Section Header --- */
.kbSectionHeader {
  text-align: center !important;
  margin-bottom: 50px !important;
}

.kbTagline {
  display: inline-block !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: #660000 !important;
  background: rgba(102, 0, 0, 0.08) !important;
  padding: 6px 18px !important;
  border-radius: 50px !important;
  margin-bottom: 18px !important;
}

.kbSectionHeader h3 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #000000 !important;
  line-height: 1.3 !important;
  margin: 0 auto !important;
  max-width: 750px !important;
  position: relative !important;
  padding-bottom: 20px !important;
}

/* Gradient underline accent */
.kbSectionHeader h3::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 80px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #660000, #660000) !important;
}

/* --- Benefits Card Grid --- */
.kbGrid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
  margin-bottom: 60px !important;
}

.kbGrid .kbCard:last-child:nth-child(odd) {
  grid-column: 1 / -1 !important;
  max-width: 600px !important;
  margin: 0 auto !important;
}

/* --- Benefit Card --- */
.kbCard {
  display: flex !important;
  align-items: flex-start !important;
  gap: 20px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-left: 4px solid #660000 !important;
  border-radius: 14px !important;
  padding: 28px 24px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Shimmer sweep on hover */
.kbCard::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(90deg, transparent, rgba(102, 0, 0, 0.03), transparent) !important;
  transition: left 0.6s ease !important;
  pointer-events: none !important;
}

.kbCard:hover::before {
  left: 100% !important;
}

.kbCard:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 16px 40px rgba(102, 0, 0, 0.1) !important;
  border-left-color: #660000 !important;
}

/* Icon */
.kbCardIcon {
  flex-shrink: 0 !important;
  width: 52px !important;
  height: 52px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  box-shadow: 0 4px 12px rgba(102, 0, 0, 0.25) !important;
  transition: all 0.3s ease !important;
}

.kbCard:hover .kbCardIcon {
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  box-shadow: 0 4px 12px rgba(102, 0, 0, 0.25) !important;
  transform: scale(1.08) !important;
}

.kbCardIcon i {
  font-size: 20px !important;
  color: #ffffff !important;
}

/* Card text */
.kbCardBody h5 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #000000 !important;
  margin: 0 0 8px 0 !important;
  line-height: 1.35 !important;
  padding: 0 !important;
}

.kbCardBody p {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: #444444 !important;
  margin: 0 !important;
}

/* --- Program Highlights Block --- */
.phSection {
  background: linear-gradient(0deg, rgb(102 0 0 / 67%), rgb(102 0 0 / 59%)), url(../img/pro-high-iiitv.jpg) !important;
  /* background: linear-gradient(0deg, rgba(102, 0, 0, 0.8), rgba(102, 0, 0, 0.8)), url(../img/grd-iiitv.jpg) !important; */
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border-radius: 18px !important;
  padding: 40px 45px !important;
  position: relative !important;
  overflow: hidden !important;
  background-attachment: fixed !important;
}

.phSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px) !important;
  background-size: 18px 18px !important;
  pointer-events: none !important;
}

.phSection h3 {
  font-size: 24px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin: 0 0 25px 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

.phList {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 14px !important;
  position: relative !important;
  z-index: 1 !important;
}

.phList li {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.92) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 14px 18px !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
  background-image: none !important;
  padding-left: 18px !important;
}

.phList li:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(252, 189, 18, 0.4) !important;
  transform: translateX(5px) !important;
}

.phList li i {
  color: #FCBD12 !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
}

/* --- Responsive: Key Benefits Section --- */
@media (max-width: 993px) {
  .keyBenefitsSection {
    padding: 60px 0 !important;
  }

  .kbGrid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .kbGrid .kbCard:last-child:nth-child(odd) {
    max-width: 100% !important;
  }

  .kbSectionHeader h3 {
    font-size: 26px !important;
  }

  .phList {
    grid-template-columns: 1fr !important;
  }

  .phSection {
    padding: 30px 25px !important;
  }
}

@media (max-width: 575px) {
  .keyBenefitsSection {
    padding: 45px 0 !important;
  }

  .kbSectionHeader h3 {
    font-size: 22px !important;
  }

  .kbSectionHeader {
    margin-bottom: 30px !important;
  }

  .kbCard {
    flex-direction: column !important;
    gap: 14px !important;
    padding: 22px 18px !important;
  }

  .kbGrid {
    margin-bottom: 40px !important;
  }

  .phSection h3 {
    font-size: 20px !important;
  }

  .phList li {
    font-size: 13px !important;
    padding: 12px 14px !important;
  }
}

/* ================================================================
   Program Objectives Section – Premium Dark Design
   ================================================================ */

.progObjSection {
  padding: 40px 0 !important;
  position: relative !important;
  overflow: hidden !important;
  background: #660000 !important;
}

.progObjSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image:
    url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.025' fill-rule='evenodd'%3E%3Cpath d='M20 0L40 20L20 40L0 20z'/%3E%3C/g%3E%3C/svg%3E") !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.progObjSection::after {
  content: "" !important;
  position: absolute !important;
  top: -80px !important;
  right: -80px !important;
  width: 300px !important;
  height: 300px !important;
  background: radial-gradient(circle, rgba(102, 0, 0, 0.12) 0%, transparent 65%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.progObjSection > .container {
  position: relative !important;
  z-index: 1 !important;
}

.poSectionHeader {
  text-align: center !important;
  margin-bottom: 50px !important;
}

.poTagline {
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2.5px !important;
  color: #FCBD12 !important;
  background: rgba(252, 189, 18, 0.1) !important;
  padding: 6px 20px !important;
  border-radius: 50px !important;
  border: 1px solid rgba(252, 189, 18, 0.2) !important;
  margin-bottom: 18px !important;
}

.poSectionHeader h4 {
  font-size: 34px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  position: relative !important;
  padding-bottom: 22px !important;
}

.poSectionHeader h4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 70px !important;
  height: 3px !important;
  border-radius: 3px !important;
  background: linear-gradient(90deg, #FCBD12, #660000) !important;
}

.poLayout {
  display: flex !important;
  align-items: stretch !important;
  gap: 45px !important;
}

.poImageCol {
  flex: 0 0 38% !important;
  max-width: 38% !important;
  position: relative !important;
}

.poImageWrap {
  position: relative !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  height: 100% !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4) !important;
}

@media (min-width: 994px) {
  .poImageWrap {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
}

.poImageWrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.poImageOverlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, 0.7) 100%) !important;
  pointer-events: none !important;
}

.poListCol {
  flex: 1 !important;
}

.poObjectivesList {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.poObjectivesList li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 18px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  padding: 22px 24px !important;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
  background-image: none !important;
  padding-left: 24px !important;
}

.poObjectivesList li:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(252, 189, 18, 0.3) !important;
  transform: translateX(6px) !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2) !important;
}

.poNum {
  flex-shrink: 0 !important;
  width: 40px !important;
  height: 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #FCBD12 !important;
  background: rgba(252, 189, 18, 0.1) !important;
  border: 1px solid rgba(252, 189, 18, 0.2) !important;
  border-radius: 10px !important;
  transition: all 0.3s ease !important;
}

.poObjectivesList li:hover .poNum {
  background: linear-gradient(135deg, #FCBD12 0%, #FCBD12 100%) !important;
  color: #000000 !important;
  border-color: transparent !important;
  box-shadow: 0 4px 12px rgba(252, 189, 18, 0.3) !important;
  transform: scale(1.08) !important;
}

.poObjectivesList li p {
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: rgba(255, 255, 255, 0.82) !important;
  margin: 0 !important;
}

@media (max-width: 993px) {
  .progObjSection {
    padding: 60px 0 !important;
  }

  .poLayout {
    flex-direction: column !important;
    gap: 30px !important;
  }

  .poImageCol {
    flex: 1 1 auto !important;
    max-width: 100% !important;
  }

  .poImageWrap {
    max-height: 300px !important;
  }

  .poSectionHeader h4 {
    font-size: 28px !important;
  }
}

@media (max-width: 575px) {
  .progObjSection {
    padding: 45px 0 !important;
  }

  .poSectionHeader h4 {
    font-size: 24px !important;
  }

  .poSectionHeader {
    margin-bottom: 30px !important;
  }

  .poObjectivesList li {
    padding: 16px 16px !important;
    gap: 14px !important;
  }

  .poObjectivesList li p {
    font-size: 13px !important;
  }

  .poNum {
    width: 34px !important;
    height: 34px !important;
    font-size: 12px !important;
  }
}

/* ================================================================
   Course Eligibility Section – Premium Modern Accordion Design
   ================================================================ */

.eligibilitySection {
  padding: 40px 0 !important;
  background-color: #fbfbfb !important; /* Premium soft gray-blue */
  position: relative !important;
  overflow: hidden !important;
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* Subtle dot grid overlay */
.eligibilitySection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(102, 0, 0, 0.04) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.eligibilitySection > .container {
  position: relative !important;
  z-index: 2 !important;
}

.eligibilitySection h4.head4 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #000000 !important;
  line-height: 1.3 !important;
  position: relative !important;
  padding-bottom: 15px !important;
  margin-bottom: 40px !important;
  display: inline-block !important;
  border-bottom: none !important;
}

.eligibilitySection h4.head4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 60px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #660000, #660000) !important;
}

.eligibilitySection #eligibilityAccordion {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.eligibilitySection #eligibilityAccordion .accordion-item {
  background-color: #ffffff !important;
  border: 1px solid rgba(102, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(102, 0, 0, 0.02) !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
}

.eligibilitySection #eligibilityAccordion .accordion-item:hover {
  border-color: rgba(102, 0, 0, 0.18) !important;
  box-shadow: 0 10px 30px rgba(102, 0, 0, 0.05) !important;
}

.eligibilitySection #eligibilityAccordion .accordion-header {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.eligibilitySection #eligibilityAccordion .accordion-button {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 22px 28px !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  transition: all 0.3s ease !important;
}

/* Custom styling for active (expanded) state */
.eligibilitySection #eligibilityAccordion .accordion-button:not(.collapsed) {
  background-color: rgba(102, 0, 0, 0.03) !important;
  color: #660000 !important;
  border-bottom: 1px solid rgba(102, 0, 0, 0.08) !important;
}

/* Custom chevron styling or styling bootstrap chevron */
.eligibilitySection #eligibilityAccordion .accordion-button::after {
  filter: grayscale(1) brightness(0.2) !important;
  transition: transform 0.3s ease !important;
}

.eligibilitySection #eligibilityAccordion .accordion-button:not(.collapsed)::after {
  filter: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230056b3'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E") !important;
}

.eligibilitySection #eligibilityAccordion .accordion-collapse {
  border: none !important;
}

.eligibilitySection #eligibilityAccordion .accordion-body {
  padding: 28px 28px 32px 28px !important;
  background-color: #ffffff !important;
}

/* Bullet list styling */
.eligibilitySection .sub-items {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.eligibilitySection .sub-items li {
  position: relative !important;
  padding-left: 28px !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: #444444 !important;
  margin: 0 !important;
}

.eligibilitySection .sub-items li::before {
  content: "\f058" !important; /* FontAwesome check-circle */
  font-family: "FontAwesome" !important;
  position: absolute !important;
  left: 0 !important;
  top: 3px !important;
  color: #660000 !important; /* primary brand blue */
  font-size: 16px !important;
  line-height: 1 !important;
  transition: all 0.2s ease !important;
}

.eligibilitySection .sub-items li:hover::before {
  color: #FCBD12 !important; /* Turn gold on hover of row/item for micro-animation feel */
  transform: scale(1.15) !important;
}

.eligibilitySection .sub-items li p {
  margin: 0 !important;
  display: inline !important;
  color: #444444 !important;
}

.eligibilitySection .sub-items li a {
  color: #660000 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-bottom: 1px dotted #660000 !important;
  transition: all 0.2s ease !important;
}

.eligibilitySection .sub-items li a:hover {
  color: #FCBD12 !important;
  border-bottom-color: #FCBD12 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .eligibilitySection {
    padding: 60px 0 !important;
  }
  
  .eligibilitySection h4.head4 {
    font-size: 26px !important;
    margin-bottom: 30px !important;
  }

  .eligibilitySection #eligibilityAccordion .accordion-button {
    padding: 18px 20px !important;
    font-size: 16px !important;
  }

  .eligibilitySection #eligibilityAccordion .accordion-body {
    padding: 20px !important;
  }
}

/* ================================================================
   Course Structure Section – Premium Geometric Accordion & Table Design
   ================================================================ */

.courseStructureSection {
  padding: 40px 0 !important;
  background: linear-gradient(135deg, #ffffff 0%, #f8f8f8 100%) !important;
  position: relative !important;
  overflow: hidden !important;
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* Premium diamond geometric pattern overlay */
.courseStructureSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 0L40 20L20 40L0 20Z' fill='none' stroke='%230056b3' stroke-opacity='0.025' stroke-width='1'/%3E%3C/svg%3E") !important;
  background-size: 40px 40px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.courseStructureSection > .container {
  position: relative !important;
  z-index: 2 !important;
}

.courseStructureSection h4.head4 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #000000 !important;
  line-height: 1.3 !important;
  position: relative !important;
  padding-bottom: 15px !important;
  margin-bottom: 40px !important;
  display: inline-block !important;
  border-bottom: none !important;
}

.courseStructureSection h4.head4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 60px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #660000, #660000) !important;
}

.courseStructureSection #structureAccordion {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.courseStructureSection #structureAccordion .accordion-item {
  background-color: #ffffff !important;
  border: 1px solid rgba(102, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(102, 0, 0, 0.02) !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
}

.courseStructureSection #structureAccordion .accordion-item:hover {
  border-color: rgba(102, 0, 0, 0.18) !important;
  box-shadow: 0 10px 30px rgba(102, 0, 0, 0.05) !important;
}

.courseStructureSection #structureAccordion .accordion-header {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.courseStructureSection #structureAccordion .accordion-button {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 22px 28px !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  transition: all 0.3s ease !important;
}

/* Custom styling for active (expanded) state */
.courseStructureSection #structureAccordion .accordion-button:not(.collapsed) {
  background-color: rgba(102, 0, 0, 0.03) !important;
  color: #660000 !important;
  border-bottom: 1px solid rgba(102, 0, 0, 0.08) !important;
}

/* Custom chevron styling or styling bootstrap chevron */
.courseStructureSection #structureAccordion .accordion-button::after {
  filter: grayscale(1) brightness(0.2) !important;
  transition: transform 0.3s ease !important;
}

.courseStructureSection #structureAccordion .accordion-button:not(.collapsed)::after {
  filter: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230056b3'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E") !important;
}

.courseStructureSection #structureAccordion .accordion-collapse {
  border: none !important;
}

.courseStructureSection #structureAccordion .accordion-body {
  padding: 28px 28px 32px 28px !important;
  background-color: #ffffff !important;
}

/* Premium Table Styling */
.courseStructureSection .table-responsive {
  border-radius: 8px !important;
  overflow: hidden !important;
  border: 1px solid rgba(102, 0, 0, 0.1) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
}

.courseStructureSection table.table {
  width: 100% !important;
  margin-bottom: 0 !important;
  border-collapse: collapse !important;
  background-color: #ffffff !important;
}

.courseStructureSection table.table-bordered th,
.courseStructureSection table.table-bordered td {
  border: none !important;
  border-bottom: 1px solid #f5f5f5 !important;
  padding: 14px 20px !important;
  vertical-align: middle !important;
}

.courseStructureSection table.table th {
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  border-bottom: none !important;
}

.courseStructureSection table.table td {
  color: #333333 !important;
  font-size: 15px !important;
}

/* Style for first column (Course Code) */
.courseStructureSection table.table th:first-child,
.courseStructureSection table.table td:first-child {
  width: 160px !important;
  font-weight: 600 !important;
}

.courseStructureSection table.table td:first-child {
  color: #660000 !important;
}

/* Alternate row colors */
.courseStructureSection table.table tbody tr:nth-child(even) {
  background-color: #fbfbfb !important;
}

/* Row Hover state */
.courseStructureSection table.table tbody tr:hover {
  background-color: rgba(102, 0, 0, 0.02) !important;
}

/* Style for Elective headers/subsections inside the table */
.courseStructureSection table.table td[colspan] {
  background-color: #f5f5f5 !important;
  color: #660000 !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 10px 20px !important;
  border-bottom: 1px solid #cccccc !important;
  width: auto !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .courseStructureSection {
    padding: 60px 0 !important;
  }
  
  .courseStructureSection h4.head4 {
    font-size: 26px !important;
    margin-bottom: 30px !important;
  }

  .courseStructureSection #structureAccordion .accordion-button {
    padding: 18px 20px !important;
    font-size: 16px !important;
  }

  .courseStructureSection #structureAccordion .accordion-body {
    padding: 20px !important;
  }
  
  .courseStructureSection table.table-bordered th,
  .courseStructureSection table.table-bordered td {
    padding: 10px 14px !important;
  }
  
  .courseStructureSection table.table td {
    font-size: 13px !important;
  }
  
  .courseStructureSection table.table th {
    font-size: 12px !important;
  }
  
  .courseStructureSection table.table th:first-child,
  .courseStructureSection table.table td:first-child {
    width: 110px !important;
  }
}

/* ================================================================
   Program Outcomes Section – Premium Dark Geometric 3-Column Card Design
   ================================================================ */

.outcomesSection {
  background: #660000 !important;
  padding: 40px 0 !important;
  position: relative !important;
  overflow: hidden !important;
  border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
  counter-reset: outcome-counter; /* CSS counter for card numbers */
}

/* Geometric radial grid pattern overlay */
.outcomesSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* Subtle glowing abstract shapes/orbs */
.outcomesSection::after {
  content: "" !important;
  position: absolute !important;
  bottom: -200px !important;
  right: -100px !important;
  width: 500px !important;
  height: 500px !important;
  background: radial-gradient(circle, rgba(102, 0, 0, 0.12) 0%, transparent 70%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.outcomesSection > .container {
  position: relative !important;
  z-index: 2 !important;
}

/* Reset internal bootstrap bg-color properties */
.outcomesSection div.bg-color {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
}

/* Full width column flow on desktop */
@media (min-width: 992px) {
  .outcomesSection .col-lg-6 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* Title Styling */
.outcomesSection h4.head4 {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin-bottom: 40px !important;
  position: relative !important;
  padding-bottom: 18px !important;
  display: inline-block !important;
  border-bottom: none !important;
  letter-spacing: -0.5px !important;
}

.outcomesSection h4.head4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 80px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #FCBD12, #660000) !important;
}

/* Hide empty headings on the right column */
.outcomesSection h3.mb-3 {
  display: none !important;
}

/* Remove default styles and margins on the grid row */
.outcomesSection .row.g-4 {
  margin-top: 0 !important;
}

/* Modern CSS Grid for Outcomes Lists */
.outcomesSection .ul-style-2 {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}

/* Transform list items into interactive cards with matched height */
.outcomesSection .ul-style-2 li {
  position: relative !important;
  counter-increment: outcome-counter;
  padding: 60px 24px 30px 24px !important; /* Top padding adjusted for number indicator */
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 16px !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, 0.8) !important;
  margin: 0 !important;
  background-image: none !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15) !important;
  display: flex !important;
  align-items: flex-start !important;
  min-height: 180px !important;
}

/* Custom large glowing numbered indicators disabled */
.outcomesSection .ul-style-2 li::after {
  content: none !important;
  display: none !important;
}

/* Styled indicator icon using FontAwesome */
.outcomesSection .ul-style-2 li::before {
  font-family: "FontAwesome" !important;
  position: absolute !important;
  left: 24px !important;
  top: 24px !important;
  color: #FCBD12 !important; /* Brand Gold */
  font-size: 24px !important;
  display: inline-block !important;
  transition: all 0.3s ease !important;
}

/* Specific icons for each outcomes card */
.outcomesSection .col-lg-6:first-child .ul-style-2 li:nth-child(1)::before {
  content: "\f19d" !important; /* fa-graduation-cap */
}
.outcomesSection .col-lg-6:first-child .ul-style-2 li:nth-child(2)::before {
  content: "\f121" !important; /* fa-code */
}
.outcomesSection .col-lg-6:first-child .ul-style-2 li:nth-child(3)::before {
  content: "\f201" !important; /* fa-line-chart */
}
.outcomesSection .col-lg-6:last-child .ul-style-2 li:nth-child(1)::before {
  content: "\f0eb" !important; /* fa-lightbulb-o */
}
.outcomesSection .col-lg-6:last-child .ul-style-2 li:nth-child(2)::before {
  content: "\f12e" !important; /* fa-puzzle-piece */
}
.outcomesSection .col-lg-6:last-child .ul-style-2 li:nth-child(3)::before {
  content: "\f24e" !important; /* fa-balance-scale */
}

/* Card hover animation states */
.outcomesSection .ul-style-2 li:hover {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
  border-color: rgba(252, 189, 18, 0.3) !important;
  transform: translateY(-6px) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3) !important;
}

/* Card hover animation states for icons */
.outcomesSection .ul-style-2 li:hover::before {
  color: #ffffff !important;
  transform: scale(1.15) !important;
}

/* Responsive adjustments */
@media (max-width: 1199px) {
  .outcomesSection .ul-style-2 li {
    min-height: 200px !important;
  }
}

@media (max-width: 991px) {
  .outcomesSection {
    padding: 60px 0 !important;
  }

  .outcomesSection h4.head4 {
    font-size: 28px !important;
    margin-bottom: 30px !important;
  }

  .outcomesSection .ul-style-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .outcomesSection .ul-style-2 li {
    min-height: 180px !important;
  }
}

@media (max-width: 768px) {
  .outcomesSection .ul-style-2 {
    grid-template-columns: 1fr !important;
  }

  .outcomesSection .ul-style-2 li {
    min-height: auto !important;
    padding: 65px 20px 24px 20px !important;
  }
}

/* ================================================================
   Fee Structure Section – Premium Clean Modern Table Design
   ================================================================ */

.feeStructureSection {
  padding: 40px 0 !important;
  background: linear-gradient(135deg, #fbfbfb 0%, #f5f5f5 100%) !important;
  position: relative !important;
  overflow: hidden !important;
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* Subtle dot grid overlay */
.feeStructureSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(102, 0, 0, 0.03) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.feeStructureSection > .container {
  position: relative !important;
  z-index: 2 !important;
}

.feeStructureSection h4.head4 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #000000 !important;
  line-height: 1.3 !important;
  position: relative !important;
  padding-bottom: 15px !important;
  margin-bottom: 40px !important;
  display: inline-block !important;
  border-bottom: none !important;
}

.feeStructureSection h4.head4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 60px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #660000, #660000) !important;
}

/* Pricing Table Container styling */
.feeStructureSection .table-responsive {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(102, 0, 0, 0.08) !important;
  box-shadow: 0 10px 30px rgba(102, 0, 0, 0.04) !important;
  margin-bottom: 40px !important;
}

.feeStructureSection table.table {
  width: 100% !important;
  margin-bottom: 0 !important;
  border-collapse: collapse !important;
  background-color: #ffffff !important;
}

.feeStructureSection table.table-bordered td {
  border: none !important;
  border-bottom: 1px solid #f5f5f5 !important;
  padding: 14px 20px !important;
  vertical-align: middle !important;
  color: #333333 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}

/* First Column style (Component name) */
.feeStructureSection table.table td:first-child {
  font-weight: 600 !important;
  color: #000000 !important;
}

/* Header Row style (Sem I, Sem II, etc.) */
.feeStructureSection table tr:first-child td {
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  border-bottom: none !important;
  padding: 16px 20px !important;
}

/* First cell in header row override */
.feeStructureSection table tr:first-child td:first-child {
  color: #ffffff !important;
}

/* Alternate row styling */
.feeStructureSection table.table tbody tr:nth-child(even) {
  background-color: #fbfbfb !important;
}

/* Hover row states */
.feeStructureSection table.table tbody tr:hover {
  background-color: rgba(102, 0, 0, 0.02) !important;
}

/* Total row styling */
.feeStructureSection table tr:nth-last-child(2) td {
  background-color: rgba(102, 0, 0, 0.05) !important;
  color: #660000 !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  border-top: 2px solid rgba(102, 0, 0, 0.15) !important;
  border-bottom: 2px solid rgba(102, 0, 0, 0.15) !important;
}

.feeStructureSection table tr:nth-last-child(2) td:first-child {
  color: #660000 !important;
}

/* Note row styling (Last row td) */
.feeStructureSection table tr:last-child td {
  background-color: #fbfbfb !important;
  padding: 24px 30px !important;
  font-size: 14px !important;
  color: #444444 !important;
  border-bottom: none !important;
}

.feeStructureSection table tr:last-child td:first-child {
  font-weight: normal !important;
}

.feeStructureSection table tr:last-child td b {
  color: #660000 !important;
  font-size: 16px !important;
  display: block !important;
  margin-bottom: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.feeStructureSection table tr:last-child td ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.feeStructureSection table tr:last-child td ul li {
  position: relative !important;
  padding-left: 20px !important;
  line-height: 1.6 !important;
  font-size: 14px !important;
  color: #444444 !important;
}

.feeStructureSection table tr:last-child td ul li::before {
  content: "\f111" !important; /* FontAwesome circle bullet */
  font-family: "FontAwesome" !important;
  position: absolute !important;
  left: 0 !important;
  top: 6px !important;
  font-size: 8px !important;
  color: #FCBD12 !important; /* Brand Gold bullet */
}

/* EMI Badge and CTA Styles */
.feeStructureSection .fee-cta-wrap {
  margin-top: 30px !important;
}

.feeStructureSection .emi-badge {
  display: inline-block !important;
  background: rgba(102, 0, 0, 0.08) !important;
  border: 1px dashed #660000 !important;
  color: #660000 !important;
  border-radius: 8px !important;
  padding: 8px 20px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  margin-bottom: 20px !important;
  text-transform: none !important;
}

.feeStructureSection .apply-btn-wrap {
  display: inline-block !important;
}

/* Style Apply Now button as a premium dark blue CTA */
.feeStructureSection .apply-btn-wrap a.hBtnRed {
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 15px rgba(102, 0, 0, 0.25) !important;
}

.feeStructureSection .apply-btn-wrap a.hBtnRed:hover {
  background: linear-gradient(135deg, #660000 0%, #660000 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 6px 20px rgba(102, 0, 0, 0.35) !important;
  transform: translateY(-2px) !important;
  text-decoration: none !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .feeStructureSection {
    padding: 60px 0 !important;
  }

  .feeStructureSection h4.head4 {
    font-size: 26px !important;
    margin-bottom: 30px !important;
  }

  .feeStructureSection table.table-bordered td {
    padding: 12px 14px !important;
    font-size: 13px !important;
  }

  .feeStructureSection table tr:first-child td {
    padding: 12px 14px !important;
    font-size: 12px !important;
  }

  .feeStructureSection table tr:last-child td {
    padding: 18px 20px !important;
  }

  .feeStructureSection .emi-badge {
    font-size: 14px !important;
    padding: 6px 14px !important;
  }
}

/* ================================================================
   FAQ Section – Premium Accordion Design
   ================================================================ */

.faqSection {
  padding: 40px 0 !important;
  background-color: #fbfbfb !important; /* Premium soft gray-blue */
  position: relative !important;
  overflow: hidden !important;
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* Subtle dot grid overlay */
.faqSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(102, 0, 0, 0.03) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.faqSection > .container {
  position: relative !important;
  z-index: 2 !important;
}

.faqSection h4.head4 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #000000 !important;
  line-height: 1.3 !important;
  position: relative !important;
  padding-bottom: 15px !important;
  margin-bottom: 40px !important;
  display: inline-block !important;
  border-bottom: none !important;
}

.faqSection h4.head4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 60px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #660000, #660000) !important;
}

.faqSection #faqAccordion {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.faqSection #faqAccordion .accordion-item {
  background-color: #ffffff !important;
  border: 1px solid rgba(102, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(102, 0, 0, 0.02) !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
}

.faqSection #faqAccordion .accordion-item:hover {
  border-color: rgba(102, 0, 0, 0.18) !important;
  box-shadow: 0 10px 30px rgba(102, 0, 0, 0.05) !important;
}

.faqSection #faqAccordion .accordion-header {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.faqSection #faqAccordion .accordion-button {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  padding: 22px 28px !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  transition: all 0.3s ease !important;
}

/* Custom "Q" Badge styling inside Accordion Button */
.faqSection #faqAccordion .accordion-button::before {
  content: "Q" !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  background: rgba(252, 189, 18, 0.1) !important;
  color: #FCBD12 !important;
  border: 1px solid rgba(252, 189, 18, 0.2) !important;
  border-radius: 50% !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  margin-right: 16px !important;
  flex-shrink: 0 !important;
  transition: all 0.3s ease !important;
}

/* Active (expanded) button state */
.faqSection #faqAccordion .accordion-button:not(.collapsed) {
  background-color: rgba(102, 0, 0, 0.03) !important;
  color: #660000 !important;
  border-bottom: 1px solid rgba(102, 0, 0, 0.08) !important;
}

/* Make active badge glow and turn gold */
.faqSection #faqAccordion .accordion-button:not(.collapsed)::before {
  background: linear-gradient(135deg, #FCBD12 0%, #FCBD12 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 3px 8px rgba(252, 189, 18, 0.3) !important;
}

/* Chevron arrows styling */
.faqSection #faqAccordion .accordion-button::after {
  margin-left: auto !important;
  filter: grayscale(1) brightness(0.2) !important;
  transition: transform 0.3s ease !important;
}

.faqSection #faqAccordion .accordion-button:not(.collapsed)::after {
  filter: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230056b3'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E") !important;
}

.faqSection #faqAccordion .accordion-collapse {
  border: none !important;
}

/* Answer Body padding and alignment */
.faqSection #faqAccordion .accordion-body {
  padding: 22px 28px !important; /* Left padding aligns text nicely under the question */
  background-color: #ffffff !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: #444444 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .faqSection {
    padding: 60px 0 !important;
  }

  .faqSection h4.head4 {
    font-size: 26px !important;
    margin-bottom: 30px !important;
  }

  .faqSection #faqAccordion .accordion-button {
    padding: 18px 20px !important;
    font-size: 15px !important;
  }

  .faqSection #faqAccordion .accordion-button::before {
    width: 24px !important;
    height: 24px !important;
    font-size: 11px !important;
    margin-right: 12px !important;
  }

  .faqSection #faqAccordion .accordion-body {
    padding: 18px 20px 20px 56px !important;
    font-size: 14px !important;
  }
}

/* ================================================================
   Admission Process Section – Premium Light Timeline Design
   ================================================================ */

.admissionSection {
  padding: 40px 0 !important;
  background: linear-gradient(135deg, #fbfbfb 0%, #f5f5f5 100%) !important;
  position: relative !important;
  overflow: hidden !important;
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
  counter-reset: step-counter; /* Initialize step sequence counter */
}

/* Geometric diamond pattern overlay matching course structure */
.admissionSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cpath d='M40 0 L80 40 L40 80 L0 40 Z' fill='none' stroke='rgba(102, 0, 0, 0.025)' stroke-width='1'/%3E%3C/svg%3E") !important;
  background-size: 80px 80px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* Subtle glowing light orb in the background */
.admissionSection::after {
  content: "" !important;
  position: absolute !important;
  top: -200px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, rgba(102, 0, 0, 0.05) 0%, transparent 70%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.admissionSection > .container {
  position: relative !important;
  z-index: 2 !important;
}

/* Remove default vertical border dividers from parent theme */
.admissionSection .row.grid-divider > div {
  border-left: none !important;
  border-right: none !important;
  background: transparent !important;
}

/* Hide grid-divider vertical lines completely */
.admissionSection .row.grid-divider > div::after {
  content: none !important;
  display: none !important;
}

.admissionSection h2.head4 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #000000 !important;
  letter-spacing: -0.5px !important;
  margin-bottom: 60px !important;
  position: relative !important;
  padding-bottom: 18px !important;
  text-align: center !important;
  display: block !important;
  border-bottom: none !important;
}

.admissionSection h2.head4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 80px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #660000, #660000) !important;
}

/* Horizontal Connector Line for Desktop Steps */
@media (min-width: 768px) {
  .admissionSection .row.grid-divider {
    position: relative !important;
  }

  .admissionSection .row.grid-divider::before {
    /* content: "" !important; */
    position: absolute !important;
    top: 85px !important; /* Centered relative to the circular icons */
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(90deg, rgba(102, 0, 0, 0.1), rgba(252, 189, 18, 0.3), rgba(102, 0, 0, 0.1)) !important;
    z-index: 1 !important;
  }
}

/* Step Container Wrapper */
.admissionSection .text-center {
  position: relative !important;
  z-index: 2 !important;
}

/* Auto-incremented sequence numbers (01, 02...) excluding the empty first col */
.admissionSection .row.grid-divider > div:not(.col-md-1) {
  counter-increment: step-counter;
}

.admissionSection .row.grid-divider > div:not(.col-md-1) .text-center::before {
  content: "0" counter(step-counter) !important;
  display: inline-block !important;
  background: #660000 !important; /* Brand Navy */
  color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 11px !important;
  padding: 3px 10px !important;
  border-radius: 20px !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 4px 10px rgba(102, 0, 0, 0.15) !important;
  margin-bottom: 12px !important;
  transition: all 0.3s ease !important;
}

.admissionSection .row.grid-divider > div:not(.col-md-1):hover .text-center::before {
  background: #FCBD12 !important; /* Brand Gold on hover */
  color: #000000 !important;
  box-shadow: 0 4px 12px rgba(252, 189, 18, 0.4) !important;
}

/* Style the Circular Icon Badges */
.admissionSection img.bg-color {
  display: block !important;
  margin: 0 auto 20px auto !important;
  width: 100px !important;
  height: 100px !important;
  padding: 22px !important;
  background: #ffffff !important;
  border: 2px solid rgba(102, 0, 0, 0.08) !important;
  border-radius: 50% !important;
  box-shadow: 0 8px 25px rgba(102, 0, 0, 0.05) !important;
  filter: none !important; /* Disable parent and inline invert filters to keep icon original color */
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

/* Hover effects for circle badges */
.admissionSection .row.grid-divider > div:not(.col-md-1):hover img.bg-color {
  border-color: #FCBD12 !important;
  background: rgba(252, 189, 18, 0.08) !important;
  box-shadow: 0 0 25px rgba(252, 189, 18, 0.25) !important;
  transform: translateY(-6px) !important;
  filter: none !important;
}

/* Step Text Titles styling */
.admissionSection h5 {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #222222 !important;
  line-height: 1.45 !important;
  letter-spacing: -0.2px !important;
  margin-top: 5px !important;
}

/* Responsive Overrides */
@media (max-width: 767px) {
  .admissionSection {
    padding: 60px 0 !important;
  }

  .admissionSection h2.head4 {
    font-size: 28px !important;
    margin-bottom: 40px !important;
  }

  .admissionSection .row.grid-divider {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 20px !important;
  }

  /* Vertical Connector Line for Mobile */
  .admissionSection .row.grid-divider::before {
    /* content: "" !important; */
    position: absolute !important;
    top: 50px !important;
    bottom: 50px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 2px !important;
    background: linear-gradient(180deg, rgba(102, 0, 0, 0.1), rgba(252, 189, 18, 0.3), rgba(102, 0, 0, 0.1)) !important;
    z-index: 1 !important;
  }

  .admissionSection img.bg-color {
    width: 90px !important;
    height: 90px !important;
    padding: 20px !important;
  }

  .admissionSection h5 {
    font-size: 15px !important;
  }
}

/* ================================================================
   Collapsible Certificate Section
   ================================================================ */
.certificate-img-wrap {
  position: relative !important;
  max-width: 800px !important;
  margin: 0 auto !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  max-height: none !important; 
}

.certificate-img-wrap.expanded {
  max-height: none !important; 
}

/* Gradient fade effect at the bottom of the collapsed container */
.certificate-img-wrap::after {
  display: none !important;
}

.certificate-img-wrap.expanded::after {
  opacity: 0 !important;
}

/* CTA Toggle Button */
.view-cert-btn-wrap {
  margin-top: 25px !important;
}

.view-cert-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 24px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 30px !important;
  border: 1px solid #660000 !important;
  background: #ffffff !important;
  color: #660000 !important;
  text-align: center !important;
  display: block !important;
  border-bottom: none !important;
}

.admissionSection h2.head4::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 80px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #660000, #660000) !important;
}

/* Horizontal Connector Line for Desktop Steps */
@media (min-width: 768px) {
  .admissionSection .row.grid-divider {
    position: relative !important;
  }

  .admissionSection .row.grid-divider::before {
    /* content: "" !important; */
    position: absolute !important;
    top: 85px !important; /* Centered relative to the circular icons */
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(90deg, rgba(102, 0, 0, 0.1), rgba(252, 189, 18, 0.3), rgba(102, 0, 0, 0.1)) !important;
    z-index: 1 !important;
  }
}

/* Step Container Wrapper */
.admissionSection .text-center {
  position: relative !important;
  z-index: 2 !important;
}

/* Auto-incremented sequence numbers (01, 02...) excluding the empty first col */
.admissionSection .row.grid-divider > div:not(.col-md-1) {
  counter-increment: step-counter;
}

.admissionSection .row.grid-divider > div:not(.col-md-1) .text-center::before {
  content: "0" counter(step-counter) !important;
  display: inline-block !important;
  background: #660000 !important; /* Brand Navy */
  color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 11px !important;
  padding: 3px 10px !important;
  border-radius: 20px !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 4px 10px rgba(102, 0, 0, 0.15) !important;
  margin-bottom: 12px !important;
  transition: all 0.3s ease !important;
}

.admissionSection .row.grid-divider > div:not(.col-md-1):hover .text-center::before {
  background: #FCBD12 !important; /* Brand Gold on hover */
  color: #000000 !important;
  box-shadow: 0 4px 12px rgba(252, 189, 18, 0.4) !important;
}

/* Style the Circular Icon Badges */
.admissionSection img.bg-color {
  display: block !important;
  margin: 0 auto 20px auto !important;
  width: 100px !important;
  height: 100px !important;
  padding: 22px !important;
  background: #ffffff !important;
  border: 2px solid rgba(102, 0, 0, 0.08) !important;
  border-radius: 50% !important;
  box-shadow: 0 8px 25px rgba(102, 0, 0, 0.05) !important;
  filter: none !important; /* Disable parent and inline invert filters to keep icon original color */
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

/* Hover effects for circle badges */
.admissionSection .row.grid-divider > div:not(.col-md-1):hover img.bg-color {
  border-color: #FCBD12 !important;
  background: rgba(252, 189, 18, 0.08) !important;
  box-shadow: 0 0 25px rgba(252, 189, 18, 0.25) !important;
  transform: translateY(-6px) !important;
  filter: none !important;
}

/* Step Text Titles styling */
.admissionSection h5 {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #222222 !important;
  line-height: 1.45 !important;
  letter-spacing: -0.2px !important;
  margin-top: 5px !important;
}

/* Responsive Overrides */
@media (max-width: 767px) {
  .admissionSection {
    padding: 60px 0 !important;
  }

  .admissionSection h2.head4 {
    font-size: 28px !important;
    margin-bottom: 40px !important;
  }

  .admissionSection .row.grid-divider {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 20px !important;
  }

  /* Vertical Connector Line for Mobile */
  .admissionSection .row.grid-divider::before {
    /* content: "" !important; */
    position: absolute !important;
    top: 50px !important;
    bottom: 50px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 2px !important;
    background: linear-gradient(180deg, rgba(102, 0, 0, 0.1), rgba(252, 189, 18, 0.3), rgba(102, 0, 0, 0.1)) !important;
    z-index: 1 !important;
  }

  .admissionSection img.bg-color {
    width: 90px !important;
    height: 90px !important;
    padding: 20px !important;
  }

  .admissionSection h5 {
    font-size: 15px !important;
  }
}

/* ================================================================
   Collapsible Certificate Section
   ================================================================ */
.certificate-img-wrap {
  position: relative !important;
  max-width: 800px !important;
  margin: 0 auto !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  max-height: none !important; 
}

.certificate-img-wrap.expanded {
  max-height: none !important; 
}

/* Gradient fade effect at the bottom of the collapsed container */
.certificate-img-wrap::after {
  display: none !important;
}

.certificate-img-wrap.expanded::after {
  opacity: 0 !important;
}

/* CTA Toggle Button */
.view-cert-btn-wrap {
  margin-top: 25px !important;
}

.view-cert-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 24px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 30px !important;
  border: 1px solid #660000 !important;
  background: #ffffff !important;
  color: #660000 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  outline: none !important;
}

.view-cert-btn:hover {
  background: #660000 !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 10px rgba(102, 0, 0, 0.15) !important;
}

/* Page-specific scrollbar fix for B.Sc. AI & ML page */
html.bsc-ai-ml-html {
  overflow-y: auto !important;
}

body.bsc-ai-ml-page {
  overflow: visible !important;
}

html.bsc-ai-ml-html::-webkit-scrollbar {
  width: 5px;
}

html.bsc-ai-ml-html::-webkit-scrollbar-track {
  background: #dddddd;
}

html.bsc-ai-ml-html::-webkit-scrollbar-thumb {
  background-color: #ffffff;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

html.bsc-ai-ml-html.dark-scheme::-webkit-scrollbar-track {
  background: var(--bg-dark-1);
}

/* Hero Highlights List (Pointers) */
.hero-highlights {
  display: grid !important;
  grid-template-columns: 1fr !important; /* One pointer per line */
  gap: 10px !important;
  margin-top: 20px !important;
  margin-bottom: 25px !important;
  max-width: 650px !important;
  padding: 0 !important;
  list-style: none !important;
}

.hh-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: all 0.2s ease !important;
}

.hh-item:hover {
  transform: translateX(4px) !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.hh-item i {
  color: #FCBD12 !important; /* Brand Gold */
  font-size: 16px !important;
  width: 20px !important;
  text-align: center !important;
}

.hh-item span {
  color: rgba(255, 255, 255, 0.95) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

/* Floating WhatsApp Icon Positioning Override */
.iiitv-whatsapp-float {
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
}

/* Career Pathways Section Styling */
.careerPathwaysSection {
  padding: 60px 0 !important;
  background: linear-gradient(0deg, rgba(102, 0, 0, 0.85), rgba(102, 0, 0, 0.85)), url(../img/lab-iiitv.jpeg) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  position: relative !important;
  color: #ffffff !important;
}

.careerPathwaysSection::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: radial-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.careerPathwaysSection .container {
  position: relative !important;
  z-index: 2 !important;
}

.cpHeader {
  margin-bottom: 20px !important;
}

.cpHeader h4 {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin-bottom: 6px !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.3) !important;
  text-align: center;
}

.cpSubheading {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #FCBD12 !important; /* Brand Gold */
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  margin: 0 !important;
}

.cpDescription {
  max-width: 720px !important;
  margin: 0 auto 35px auto !important;
}

.cpDescription p {
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: rgba(255, 255, 255, 0.75) !important;
  margin: 0 !important;
}

.cpPointerList {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 15px !important;
  max-width: 800px !important;
  margin: 0 auto !important;
}

.cpPointerItem {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 8px !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.cpPointerItem:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: #FCBD12 !important;
  transform: translateX(5px) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
}

.cpPointerIcon {
  font-size: 18px !important;
  color: #FCBD12 !important; /* Brand Gold */
  display: flex !important;
  align-items: center !important;
  transition: all 0.25s ease !important;
}

.cpPointerItem:hover .cpPointerIcon {
  transform: scale(1.15) !important;
}

.cpPointerText {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #ffffff !important;
  line-height: 1.4 !important;
}

@media (max-width: 767px) {
  .cpPointerList {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .careerPathwaysSection {
    padding: 50px 0 !important;
  }
  .cpHeader h4 {
    font-size: 28px !important;
  }
}

/* ================================================================
   GLOBAL BRAND COLOR SCHEME OVERRIDES (#660000 & #FCBD12)
   ================================================================ */

/* CSS Variable Overrides */
html, body, :root {
  --primary-color: #660000 !important;
  --primary-color-rgb: 102, 0, 0 !important;
  --secondary-color: #FCBD12 !important;
  --secondary-color-rgb: 252, 189, 18 !important;
  --tertiary-color: #660000 !important;
}

/* Background Color Overrides */
body, html {
  background-color: #ffffff !important;
  color: #222222 !important;
}

/* Headings & Text Color Overrides */
h1, h2, h3, h4, h5, h6,
.poContentTxt h1, .poContentTxt h3,
.careerCentreInfo h2, .kbSectionHeader h3,
.accordion-header, .accordion-button {
  color: #660000 !important;
}

/* Link and Hover Color Overrides */
a {
  color: #660000 !important;
}
a:hover, a:focus, a:active {
  color: #FCBD12 !important;
}

/* Main Menu Overrides */
#mainmenu a {
  color: #222222 !important;
}
#mainmenu a:hover {
  color: #660000 !important;
}
#mainmenu li.active > a {
  color: #660000 !important;
}

/* Button & CTA Overrides */
.btn-main,
.btn-custom,
.btn-primary,
button[type="submit"],
#brochureSubmitBtn,
#submitBtn {
  background-color: #660000 !important;
  background: #660000 !important;
  color: #ffffff !important;
  border: 1px solid #660000 !important;
  transition: all 0.3s ease !important;
  border-radius: 4px !important;
}

.btn-main:hover,
.btn-custom:hover,
.btn-primary:hover,
button[type="submit"]:hover,
#brochureSubmitBtn:hover,
#submitBtn:hover {
  background-color: #FCBD12 !important;
  background: #FCBD12 !important;
  color: #000000 !important;
  border-color: #FCBD12 !important;
}

/* Specific styling for CTA buttons */
.hBtnHM a.hBtnRed {
  background: #FCBD12 !important;
  color: #000000 !important;
  border: none !important;
  box-shadow: 0 4px 15px rgba(252, 189, 18, 0.2) !important;
}

.hBtnHM a.hBtnRed:hover {
  background: #660000 !important;
  color: #ffffff !important;
  box-shadow: 0 6px 20px rgba(102, 0, 0, 0.35) !important;
}

.hBtnHM a.hBtn {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
  border: 1px solid #ffffff !important;
}

.hBtnHM a.hBtn:hover {
  background: #FCBD12 !important;
  color: #000000 !important;
  border-color: #FCBD12 !important;
}

/* Icon Overrides */
i, i.fa, .fa,
.eligibilityList li::after,
.ccHighlightsList li i {
  color: #FCBD12 !important;
}

.eligibilityList li:hover::after {
  color: #660000 !important;
}

/* Section Backgrounds (Ensuring no other colors like blue are used) */
section, .section-bg {
  background-color: #ffffff !important;
}

/* Dark themed sections (like Career Centre, Objectives, Outcomes) */
.careerCentreSection,
.progObjSection,
.outcomesSection {
  background: #660000 !important; /* Brand Maroon background */
  color: #ffffff !important;
}

.careerPathwaysSection {
  background: linear-gradient(0deg, rgb(102 0 0 / 57%), rgb(102 0 0 / 70%)), url(../img/lab-iiitv.jpeg) !important;
  /* background: linear-gradient(0deg, rgba(102, 0, 0, 0.85), rgba(102, 0, 0, 0.85)), url(../img/lab-iiitv.jpeg) !important; */
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  color: #ffffff !important;
}

.careerCentreSection h1, .careerCentreSection h2, .careerCentreSection h3, .careerCentreSection h4, .careerCentreSection h5, .careerCentreSection h6,
.progObjSection h1, .progObjSection h2, .progObjSection h3, .progObjSection h4, .progObjSection h5, .progObjSection h6,
.outcomesSection h1, .outcomesSection h2, .outcomesSection h3, .outcomesSection h4, .outcomesSection h5, .outcomesSection h6,
.careerPathwaysSection h1, .careerPathwaysSection h2, .careerPathwaysSection h3, .careerPathwaysSection h4, .careerPathwaysSection h5, .careerPathwaysSection h6 {
  color: #FCBD12 !important; /* Gold headings on maroon background */
}

.careerCentreSection::before {
  background-image: radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px) !important;
}

.ccHighlightsList li {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.ccHighlightsList li:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: #FCBD12 !important;
}

/* Light / Patterned backgrounds (like Features, Key Benefits, Timeline, Fees) */
.keyBenefitsSection {
  background-color: #f5f5f5 !important;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23660000' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
}

.keyBenefitsSection::before {
  background: radial-gradient(circle, rgba(102, 0, 0, 0.05) 0%, transparent 70%) !important;
}
.keyBenefitsSection::after {
  background: radial-gradient(circle, rgba(252, 189, 18, 0.04) 0%, transparent 70%) !important;
}

.kbTagline {
  color: #660000 !important;
  background: rgba(102, 0, 0, 0.08) !important;
}

.kbSectionHeader h3::after {
  background: linear-gradient(90deg, #660000, #FCBD12) !important;
}

.eligibilityList li {
  border-top-color: #660000 !important;
}

.eligibilityList li:hover {
  box-shadow: 0 20px 40px rgba(102, 0, 0, 0.08) !important;
  border-top-color: #FCBD12 !important;
}

/* Accordion Component Overrides */
.accordion-button:not(.collapsed) {
  background-color: rgba(102, 0, 0, 0.08) !important;
  color: #660000 !important;
}

/* Table styling overrides */
table, th, td {
  border-color: #dddddd !important;
}
th {
  background-color: #660000 !important;
  color: #ffffff !important;
}
tr:nth-child(even) {
  background-color: #f9f9f9 !important;
}

/* Floating WhatsApp Overrides */
.iiitv-whatsapp-float {
  background-color: #25d366 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3) !important;
}
.iiitv-whatsapp-float span {
  color: #ffffff !important;
}
.iiitv-whatsapp-float i.fa-whatsapp {
  color: #ffffff !important;
}

/* Footer & Subfooter Overrides */
footer {
  background-color: #660000 !important;
  color: #ffffff !important;
}
footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
footer .widget h5 {
  color: #FCBD12 !important;
}
footer a {
  color: #ffffff !important;
}
footer a:hover {
  color: #FCBD12 !important;
}
.subfooter {
  background-color: #660000 !important;
  color: rgba(255, 255, 255, 0.6) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Custom UI elements (Badges, Lists, etc.) */
.de_tab .de_nav li span {
  border-color: #660000 !important;
}
.de_tab .de_nav li.active span {
  background-color: #660000 !important;
  color: #ffffff !important;
}
.badge-custom {
  background-color: #FCBD12 !important;
  color: #000000 !important;
}

/* ================================================================
   HERO BANNER TITLE & TOP BAR CUSTOM COLOR OVERRIDES
   ================================================================ */

/* Ensure hero banner title and description are white and gold */
.poContentTxt h1,
.poContentTxt h1 span,
#wrapper .poContentTxt h1,
#wrapper .poContentTxt h1 span {
  color: #ffffff !important;
  background: none !important;
  -webkit-text-fill-color: #ffffff !important;
}

.poContentTxt h3,
#wrapper .poContentTxt h3 {
  color: #FCBD12 !important;
}

/* Top bar color overrides (Replace blue with brand maroon and keep text/icons white) */
#wrapper > div[style*="background-color: #004f8a"],
#wrapper > div[style*="background-color:#004f8a"],
#wrapper > div:has(.h-phone),
#wrapper > div:has(.h-envelope) {
  background-color: #660000 !important;
}

#wrapper > div[style*="background-color: #004f8a"] a,
#wrapper > div[style*="background-color:#004f8a"] a,
#wrapper > div[style*="background-color: #004f8a"] i,
#wrapper > div[style*="background-color:#004f8a"] i,
#wrapper > div:has(.h-phone) a,
#wrapper > div:has(.h-phone) h5,
#wrapper > div:has(.h-phone) i,
#wrapper > div:has(.h-phone) ::before,
#wrapper > div:has(.h-envelope) a,
#wrapper > div:has(.h-envelope) i {
  color: #ffffff !important;
}

/* Download Brochure Popup Modal Overrides */
.brochure-modal-header {
  background: #660000 !important; /* Brand Maroon background */
  color: #ffffff !important;
}

.brochure-modal-header h2 {
  color: #ffffff !important; /* Force white title */
}

.brochure-modal-header p {
  color: #ffffff !important;
  opacity: 0.9 !important;
}

.brochure-modal .btn-primary {
  background: #660000 !important;
  border-color: #660000 !important;
  color: #ffffff !important;
  box-shadow: 0 10px 20px rgba(102, 0, 0, 0.2) !important;
}

.brochure-modal .btn-primary:hover {
  background: #FCBD12 !important;
  border-color: #FCBD12 !important;
  color: #000000 !important;
  box-shadow: 0 15px 30px rgba(252, 189, 18, 0.3) !important;
}

.brochure-form-field input:focus, 
.brochure-form-field select:focus {
  border-color: #660000 !important;
  box-shadow: 0 0 0 3px rgba(102, 0, 0, 0.1) !important;
}

/* ================================================================
   HERO BANNER BACKGROUND SLIDER
   ================================================================ */
.programOverviewWrap.has-bg-slider {
  background-image: none !important;
}

.banner-slider-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.bg-slide {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transition: opacity 1.5s ease-in-out !important;
  opacity: 0 !important;
  z-index: 0 !important;
}

.bg-slide.active {
  opacity: 1 !important;
}

.bg-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.container-hero-above {
  position: relative !important;
  z-index: 2 !important;
}

.banner-flag {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 3 !important;
  max-width: 200px !important;
  height: auto !important;
  pointer-events: none !important;
}

@media (max-width: 768px) {
  .banner-flag {
    max-width: 90px !important;
  }
}