/* Complete Custom CSS for UMASINGH EDTECH */

/* CSS Custom Properties / Variables */
:root {
  --primary-color: #0d6efd;
  --primary-dark: #0056b3;
  --secondary-color: #6c757d;
  --success-color: #198754;
  --warning-color: #ffc107;
  --danger-color: #dc3545;
  --info-color: #0dcaf0;
  --dark-color: #212529;
  --light-color: #f8f9fa;
  --white: #ffffff;

  /* Additional Colors */
  --gradient-primary: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
  --gradient-warning: linear-gradient(135deg, var(--warning-color), #ffb300);
  --shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);

  /* Typography */
  --font-family-base: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Spacing */
  --section-padding: 5rem 0;
  --element-margin: 1.5rem;

  /* Transitions */
  --transition-base: all 0.3s ease;
  --transition-fast: all 0.15s ease-in-out;
  --transition-slow: all 0.5s ease;

  /* Border Radius */
  --border-radius-sm: 0.25rem;
  --border-radius: 0.375rem;
  --border-radius-lg: 0.5rem;
  --border-radius-xl: 1rem;
  --border-radius-pill: 50rem;
}

/* Reset and Base Styles */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
}

body {
  font-family: var(--font-family-base);
  font-weight: var(--font-weight-normal);
  line-height: 1.6;
  color: #333;
  padding-top: 76px;
  background-color: var(--white);
  overflow-x: hidden;
}

/* Typography Enhancements */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: var(--font-weight-bold);
  line-height: 1.2;
  margin-bottom: 1rem;
  color: currentColor;
}

.display-1 { font-size: 5rem; }
.display-2 { font-size: 4.5rem; }
.display-3 { font-size: 4rem; }
.display-4 { font-size: 3.5rem; }
.display-5 { font-size: 3rem; }
.display-6 { font-size: 2.5rem; }

.lead {
  font-size: 1.25rem;
  font-weight: var(--font-weight-normal);
  line-height: 1.6;
}

/* Links */
a {
  color: var(--primary-color);
  text-decoration: none;
  transition: var(--transition-fast);
}
a:hover {
  color: var(--primary-dark);
  text-decoration: none;
}

/* Navbar Styles */
.navbar {
  transition: var(--transition-base);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  z-index: 1030;
}
.navbar.scrolled {
  background-color: rgba(255, 255, 255, 0.95) !important;
  box-shadow: var(--shadow-sm);
}
.navbar-brand {
  font-size: 1.5rem;
  font-weight: var(--font-weight-bold);
  color: var(--primary-color) !important;
  transition: var(--transition-fast);
}
.navbar-brand:hover {
  color: var(--primary-dark) !important;
  transform: translateY(-1px);
}
.navbar-brand i { color: var(--warning-color); }
.nav-link {
  font-weight: var(--font-weight-medium);
  color: var(--dark-color) !important;
  position: relative;
  padding: 0.5rem 1rem !important;
  margin: 0 0.25rem;
  border-radius: var(--border-radius);
  transition: var(--transition-base);
}
.nav-link:hover {
  color: var(--primary-color) !important;
  background-color: rgba(13, 110, 253, 0.1);
  transform: translateY(-1px);
}
.nav-link.active {
  color: var(--primary-color) !important;
  background-color: rgba(13, 110, 253, 0.1);
  font-weight: var(--font-weight-semibold);
}
.nav-link.active::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 2px;
  background: var(--gradient-primary);
  border-radius: 1px;
}
.navbar-toggler { border: none; padding: 0.25rem 0.5rem; transition: var(--transition-fast); }
.navbar-toggler:focus { box-shadow: none; }
.navbar-toggler:hover { background-color: rgba(13, 110, 253, 0.1); }

/* Hero Carousel Styles */
.hero-carousel {
  position: relative;
  height: 100vh;
  min-height: 600px;
  overflow: hidden;
}
.carousel-item {
  height: 100vh;
  min-height: 600px;
  position: relative;
}
.carousel-bg {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
.carousel-overlay {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: linear-gradient(135deg, rgba(13, 110, 253, 0.8) 0%, rgba(255, 193, 7, 0.6) 100%);
}
.carousel-content {
  position: relative; z-index: 2;
  height: 100%;
  display: flex;
  align-items: center;
}
.carousel-indicators { bottom: 30px; }
.carousel-indicators button {
  width: 14px; height: 14px; border-radius: 50%;
  margin: 0 8px; border: 2px solid rgba(255, 255, 255, 0.5);
  background-color: transparent; transition: var(--transition-base);
}
.carousel-indicators button.active {
  background-color: var(--warning-color);
  border-color: var(--warning-color);
  transform: scale(1.2);
}
.carousel-control-prev,
.carousel-control-next {
  width: 60px; height: 60px; top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.3);
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  transition: var(--transition-base);
}
.carousel-control-prev { left: 30px; }
.carousel-control-next { right: 30px; }
.carousel-control-prev:hover,
.carousel-control-next:hover {
  background: rgba(0, 0, 0, 0.6);
  border-color: var(--warning-color);
  transform: translateY(-50%) scale(1.1);
}
.carousel-control-prev-icon,
.carousel-control-next-icon { width: 24px; height: 24px; }

/* Hero Content Animations */
@keyframes slideUp { from {opacity:0; transform:translateY(50px);} to {opacity:1; transform:translateY(0);} }
@keyframes slideInLeft { from {opacity:0; transform:translateX(-50px);} to {opacity:1; transform:translateX(0);} }
@keyframes slideInRight { from {opacity:0; transform:translateX(50px);} to {opacity:1; transform:translateX(0);} }
@keyframes fadeIn { from {opacity:0;} to {opacity:1;} }
@keyframes pulse { 0%,100%{transform:scale(1);} 50%{transform:scale(1.05);} }
@keyframes bounce {
  0%,20%,53%,80%,100% { transform: translateY(0); }
  40%,43% { transform: translateY(-10px); }
  70% { transform: translateY(-5px); }
  90% { transform: translateY(-2px); }
}
.animate-slide-up { animation: slideUp 0.8s ease-out forwards; opacity: 0; }
.animate-slide-left { animation: slideInLeft 0.8s ease-out forwards; opacity: 0; }
.animate-slide-right { animation: slideInRight 0.8s ease-out forwards; opacity: 0; }
.animate-fade-in { animation: fadeIn 0.8s ease-out forwards; opacity: 0; }
.animate-pulse { animation: pulse 2s ease-in-out infinite; }
.animate-bounce { animation: bounce 2s ease-in-out infinite; }

/* Page Header */
.page-header {
  padding: 150px 0 100px;
  background: var(--gradient-primary);
  position: relative; overflow: hidden;
}
.page-header::before {
  content: "";
  position: absolute; top:0; left:0; right:0; bottom:0;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 20"><defs><linearGradient id="a" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" style="stop-color:rgb(255,255,255);stop-opacity:0.1" /><stop offset="100%" style="stop-color:rgb(255,255,255);stop-opacity:0" /></linearGradient></defs><rect width="100" height="20" fill="url(%23a)"/></svg>')
    repeat-x;
  opacity: 0.2;
}
.page-header::after {
  content: "";
  position: absolute; bottom:-1px; left:0; right:0;
  height: 50px; background: var(--white);
  clip-path: polygon(0 100%, 100% 70%, 100% 100%);
}

/* Buttons */
.btn {
  font-weight: var(--font-weight-medium);
  padding: 0.75rem 1.5rem;
  border-radius: var(--border-radius);
  transition: var(--transition-base);
  border: none;
  text-transform: none;
  letter-spacing: 0.025em;
  position: relative; overflow: hidden; z-index: 1;
}
.btn::before {
  content: "";
  position: absolute; top:0; left:0; width:100%; height:100%;
  background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transform: translateX(-100%);
  transition: transform 0.6s;
  z-index: -1;
}
.btn:hover::before { transform: translateX(100%); }
.btn-primary {
  background: var(--gradient-primary);
  color: var(--white);
  box-shadow: 0 4px 15px rgba(13, 110, 253, 0.3);
}
.btn-primary:hover {
  background: var(--gradient-primary);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(13, 110, 253, 0.4);
  color: var(--white);
}
.btn-warning {
  background: var(--gradient-warning);
  color: var(--dark-color);
  box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3);
}
.btn-warning:hover {
  background: var(--gradient-warning);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(255, 193, 7, 0.4);
  color: var(--dark-color);
}
.btn-outline-primary { border: 2px solid var(--primary-color); color: var(--primary-color); background: transparent; }
.btn-outline-primary:hover {
  background: var(--primary-color); color: var(--white);
  transform: translateY(-2px); box-shadow: 0 6px 20px rgba(13, 110, 253, 0.3);
}
.btn-outline-light { border: 2px solid rgba(255,255,255,0.8); color: rgba(255,255,255,0.9); background: transparent; }
.btn-outline-light:hover {
  background: var(--white); color: var(--primary-color); border-color: var(--white); transform: translateY(-2px);
}
.btn-lg { padding: 1rem 2rem; font-size: 1.125rem; }
.btn-sm { padding: 0.5rem 1rem; font-size: 0.875rem; }

/* Cards */
.card {
  border: none;
  border-radius: var(--border-radius-lg);
  box-shadow: var(--shadow-sm);
  transition: var(--transition-base);
  overflow: hidden;
  background: var(--white);
}
.card:hover { box-shadow: var(--shadow); }
.card-header { background: transparent; border-bottom: 1px solid rgba(0,0,0,0.1); padding: 1.5rem; }
.card-body { padding: 1.5rem; }
.card-footer {
  background: rgba(248, 249, 250, 0.5);
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding: 1.5rem;
}

/* Hover Effects */
.hover-lift { transition: var(--transition-base); }
.hover-lift:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg) !important; }
.hover-scale { transition: var(--transition-base); }
.hover-scale:hover { transform: scale(1.03); }

/* Icon Styles */
.icon-circle {
  width: 70px; height: 70px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.75rem; margin: 0 auto 1rem; position: relative; overflow: hidden;
}
.icon-circle::before {
  content: ""; position: absolute; top:-50%; left:-50%;
  width:200%; height:200%;
  background: linear-gradient(45deg, transparent, rgba(255,255,255,0.1), transparent);
  transform: rotate(45deg);
  transition: var(--transition-slow);
}
.icon-circle:hover::before { animation: shimmer 1.5s ease-in-out; }
@keyframes shimmer {
  0%   { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
  100% { transform: translateX(100%) translateY(100%) rotate(45deg); }
}
.feature-icon { width: 35px; height: 35px; display:flex; align-items:center; justify-content:center; font-size:1rem; border-radius: var(--border-radius); }
.stat-icon { width:50px; height:50px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; border-radius:50%; margin:0 auto 1rem; }

/* Service Cards */
.service-preview { transition: var(--transition-base); height:100%; border:2px solid transparent; }
.service-preview:hover { border-color: var(--primary-color); transform: translateY(-5px); }
.service-card {
  transition: var(--transition-base);
  border: 1px solid rgba(0, 0, 0, 0.1);
  background: var(--white);
  position: relative; overflow: hidden;
}
.service-card::before {
  content: ""; position:absolute; top:0; left:0; width:100%; height:4px;
  background: var(--gradient-primary);
  transform: scaleX(0); transform-origin: left; transition: var(--transition-base);
}
.service-card:hover::before { transform: scaleX(1); }
.service-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg); }

/* About Page Styles */
.about-image-section { position: relative; }
.about-image-section .floating-card {
  position: absolute; bottom:30px; right:30px; max-width:250px;
  background: var(--white); border-radius: var(--border-radius-lg);
  box-shadow: var(--shadow-lg); z-index: 10;
}
.about-image { position: relative; overflow: hidden; border-radius: var(--border-radius-lg); }
.image-overlay {
  position: absolute; top:0; left:0; right:0; bottom:0;
  background: rgba(0, 0, 0, 0.5);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition: var(--transition-base); border-radius: var(--border-radius-lg);
}
.about-image:hover .image-overlay { opacity: 1; }
.play-button .btn { width:80px; height:80px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:1.5rem; }

/* Team Cards */
.team-card { transition: var(--transition-base); text-align: center; }
.team-card:hover { transform: translateY(-10px); }
.team-image { position: relative; overflow: hidden; border-radius: 50%; margin:0 auto 1.5rem; width:220px; height:220px; }
.team-image img { transition: var(--transition-base); width:100%; height:100%; object-fit: cover; }
.team-card:hover .team-image img { transform: scale(1.1); }

/* Process Steps */
.process-step { position: relative; padding: 2rem 1rem; }
.step-number {
  width: 60px; height: 60px; background: var(--gradient-primary);
  color: var(--white); border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; font-weight: var(--font-weight-bold);
  margin:0 auto 1.5rem; position: relative; z-index: 2;
}
.process-step::after {
  content:""; position:absolute; top:30px; left:50%;
  width:2px; height:calc(100% - 60px);
  background: linear-gradient(to bottom, var(--primary-color), transparent);
  transform: translateX(-50%); z-index: 1;
}
.process-step:last-child::after { display:none; }

/* Statistics Counter */
.counter { font-weight: var(--font-weight-bold); color: var(--warning-color); transition: var(--transition-base); }

/* Core Values */
.value-card {
  transition: var(--transition-base);
  border: 1px solid rgba(0, 0, 0, 0.1);
  background: var(--white);
  position: relative; overflow: hidden;
}
.value-card::before {
  content:""; position:absolute; top:-50%; left:-50%; width:200%; height:200%;
  background: radial-gradient(circle, rgba(13,110,253,0.05), transparent);
  transform: scale(0); transition: var(--transition-slow); border-radius:50%;
}
.value-card:hover::before { transform: scale(1); }
.value-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }

/* Footer Styles */
footer {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  color: rgba(255, 255, 255, 0.8);
  margin-top: auto; position: relative; overflow: hidden;
}
footer::before {
  content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
}
.footer-section h5,
.footer-section h6 {
  color: var(--white);
  font-weight: var(--font-weight-semibold);
  margin-bottom: 1.5rem; position: relative;
}
.footer-section h5::after,
.footer-section h6::after {
  content:""; position:absolute; bottom:-8px; left:0; width:30px; height:2px;
  background: var(--gradient-primary); border-radius: 1px;
}
.footer-section ul li { margin-bottom: 0.75rem; padding-left: 0; }
.footer-section ul li a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none; transition: var(--transition-fast); position: relative;
}
.footer-section ul li a:hover { color: var(--white); padding-left: 5px; }
.footer-section ul li a::before {
  content:""; position:absolute; left:-10px; top:50%; transform: translateY(-50%);
  width:4px; height:4px; background: var(--primary-color); border-radius: 50%;
  opacity:0; transition: var(--transition-fast);
}
.footer-section ul li a:hover::before { opacity:1; left:-8px; }

/* Social Links - Fixed styling */
.social-links { display:flex; gap:1rem; flex-wrap:wrap; margin-top:1rem; }
.social-links a {
  display:inline-flex; align-items:center; justify-content:center;
  width:45px; height:45px; background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.8) !important; border-radius: 50%;
  text-decoration:none; transition: var(--transition-base);
  font-size:1.25rem; position: relative; overflow: hidden;
}
.social-links a::before {
  content:""; position:absolute; top:50%; left:50%; width:0; height:0;
  background: rgba(255,255,255,0.2); border-radius: 50%;
  transform: translate(-50%, -50%); transition: var(--transition-base);
}
.social-links a:hover {
  color:#fff !important; background: var(--primary-color);
  transform: translateY(-3px); box-shadow: 0 8px 25px rgba(13,110,253,0.3);
}
.social-links a:hover::before { width:100%; height:100%; }
/* Specific social platform colors */
.social-links a[title*="Facebook"]:hover,
.social-links a[href*="facebook"]:hover { background:#1877f2; }
.social-links a[title*="Twitter"]:hover,
.social-links a[href*="twitter"]:hover { background:#1da1f2; }
.social-links a[title*="Instagram"]:hover,
.social-links a[href*="instagram"]:hover { background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); }
.social-links a[title*="LinkedIn"]:hover,
.social-links a[href*="linkedin"]:hover { background:#0077b5; }
.social-links a[title*="YouTube"]:hover,
.social-links a[href*="youtube"]:hover { background:#ff0000; }

/* Breadcrumb */
.breadcrumb { background: transparent; padding: 0; margin: 0; }
.breadcrumb-item + .breadcrumb-item::before {
  content: ">"; color: rgba(255, 255, 255, 0.6); font-weight: var(--font-weight-bold);
}
.breadcrumb-item a {
  color: rgba(255, 255, 255, 0.8);
  text-decoration:none; transition: var(--transition-fast);
}
.breadcrumb-item a:hover { color: var(--warning-color); }
.breadcrumb-item.active { color: var(--warning-color); font-weight: var(--font-weight-medium); }

/* Forms */
.form-control,
.form-select {
  border: 2px solid #e9ecef;
  border-radius: var(--border-radius);
  padding: 0.75rem 1rem; font-size: 1rem;
  transition: var(--transition-base);
  background: var(--white);
}
.form-control:focus,
.form-select:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.15);
}
.form-label { font-weight: var(--font-weight-medium); margin-bottom: 0.5rem; color: var(--dark-color); }
.invalid-feedback { display:block; width:100%; margin-top:0.25rem; font-size:0.875rem; color: var(--danger-color); }
.was-validated .form-control:invalid,
.form-control.is-invalid { border-color: var(--danger-color); }
.was-validated .form-control:valid,
.form-control.is-valid { border-color: var(--success-color); }

/* Alerts */
.alert { border-radius: var(--border-radius); border:none; padding:1rem 1.25rem; margin-bottom:1.5rem; }
.alert-success { background: rgba(25,135,84,0.1); color: var(--success-color); border-left: 4px solid var(--success-color); }
.alert-danger { background: rgba(220,53,69,0.1); color: var(--danger-color); border-left: 4px solid var(--danger-color); }
.alert-warning { background: rgba(255,193,7,0.1); color:#856404; border-left:4px solid var(--warning-color); }
.alert-info { background: rgba(13,202,240,0.1); color:#055160; border-left:4px solid var(--info-color); }

/* Testimonials */
.avatar { font-size:1.2rem; font-weight: var(--font-weight-bold); box-shadow: var(--shadow); border:3px solid var(--white); }

/* Loading Animation */
.loading {
  display:inline-block; width:20px; height:20px;
  border:3px solid rgba(255,255,255,0.3); border-radius:50%;
  border-top-color: var(--white); animation: spin 1s ease-in-out infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Back to Top Button */
.back-to-top {
  position:fixed; bottom:30px; right:30px; width:50px; height:50px;
  background: var(--gradient-primary); color: var(--white); border:none; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:1.25rem; cursor:pointer;
  z-index:1000; opacity:0; visibility:hidden; transform: translateY(20px);
  transition: var(--transition-base); box-shadow: var(--shadow-lg);
}
.back-to-top.show { opacity:1; visibility:visible; transform: translateY(0); }
.back-to-top:hover { background: var(--primary-dark); transform: translateY(-2px); box-shadow: 0 8px 25px rgba(13,110,253,0.4); }

/* Utility Classes */
.text-white-75 { color: rgba(255,255,255,0.75) !important; }
.text-white-50 { color: rgba(255,255,255,0.5) !important; }
.bg-gradient-primary { background: var(--gradient-primary) !important; }
.bg-gradient-warning { background: var(--gradient-warning) !important; }
.shadow-custom { box-shadow: var(--shadow-lg) !important; }
.border-radius-custom { border-radius: var(--border-radius-lg) !important; }
.transition-base { transition: var(--transition-base); }

/* Spacing Utilities */
.section-padding { padding: var(--section-padding); }
.element-margin { margin: var(--element-margin); }

/* Custom Scrollbar */
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:#f1f1f1; border-radius:10px; }
::-webkit-scrollbar-thumb { background: var(--gradient-primary); border-radius:10px; border:2px solid #f1f1f1; }
::-webkit-scrollbar-thumb:hover { background: var(--primary-dark); }
::-webkit-scrollbar-corner { background:#f1f1f1; }

/* Firefox scrollbar */
html { scrollbar-width: thin; scrollbar-color: var(--primary-color) #f1f1f1; }

/* Selection */
::selection { background: rgba(13,110,253,0.2); color: var(--dark-color); }
::-moz-selection { background: rgba(13,110,253,0.2); color: var(--dark-color); }

/* Focus Styles */
*:focus { outline: none; }
.btn:focus,
.form-control:focus,
.form-select:focus { box-shadow: 0 0 0 0.2rem rgba(13,110,253,0.25); }

/* Print Styles */
@media print {
  .navbar,
  .carousel-control-prev,
  .carousel-control-next,
  .carousel-indicators,
  .back-to-top,
  .btn,
  .social-links { display:none !important; }
  body { padding-top:0; }
  .page-header { padding:2rem 0; background: var(--white) !important; color: var(--dark-color) !important; }
  .card { border:1px solid #dee2e6 !important; box-shadow:none !important; }
}

/* Responsive Design */
@media (max-width: 1199.98px) {
  .display-1 { font-size: 4rem; }
  .display-2 { font-size: 3.5rem; }
  .display-3 { font-size: 3rem; }
  .display-4 { font-size: 2.5rem; }
  .display-5 { font-size: 2.25rem; }
  .display-6 { font-size: 2rem; }
}
@media (max-width: 991.98px) {
  body { padding-top: 70px; }
  .navbar-brand { font-size: 1.25rem; }
  .hero-carousel, .carousel-item { height: 80vh; min-height: 500px; }
  .display-4 { font-size: 2.25rem; }
  .display-5 { font-size: 2rem; }
  .display-6 { font-size: 1.75rem; }
  .page-header { padding: 120px 0 80px; }
  .icon-circle { width:60px; height:60px; font-size:1.5rem; }
  .carousel-control-prev, .carousel-control-next { width:50px; height:50px; }
  .carousel-control-prev { left:15px; } .carousel-control-next { right:15px; }
}
@media (max-width: 767.98px) {
  .hero-carousel, .carousel-item { height:70vh; min-height:450px; }
  .display-4 { font-size:2rem; }
  .display-5 { font-size:1.75rem; }
  .display-6 { font-size:1.5rem; }
  .page-header { padding:100px 0 60px; }
  .hero-buttons { flex-direction:column; gap:1rem; align-items:center; }
  .hero-buttons .btn { width:100%; max-width:300px; }
  .about-image-section .floating-card { position: static !important; margin-top:1.5rem; max-width:100%; }
  .team-image { width:180px; height:180px; }
  .social-links { justify-content:center; }
  .carousel-control-prev, .carousel-control-next { width:40px; height:40px; }
  .carousel-control-prev { left:10px; } .carousel-control-next { right:10px; }
  .carousel-control-prev-icon, .carousel-control-next-icon { width:16px; height:16px; }
  .process-step::after { display:none; }
  .step-number { width:50px; height:50px; font-size:1.25rem; }
}
@media (max-width: 575.98px) {
  .container { padding-left:15px; padding-right:15px; }
  .hero-carousel, .carousel-item { height:60vh; min-height:400px; }
  .display-4 { font-size:1.75rem; }
  .display-5 { font-size:1.5rem; }
  .display-6 { font-size:1.25rem; }
  .lead { font-size:1.125rem; }
  .btn-lg { padding:0.75rem 1.5rem; font-size:1rem; }
  .icon-circle { width:50px; height:50px; font-size:1.25rem; }
  .stat-icon { width:40px; height:40px; font-size:1.25rem; }
  .team-image { width:150px; height:150px; }
  .back-to-top { bottom:20px; right:20px; width:45px; height:45px; font-size:1rem; }
  .social-links a { width:40px; height:40px; font-size:1.1rem; }
}

/* High DPI / Retina Display Optimizations */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .icon-circle, .stat-icon, .feature-icon {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
}

/* ===================== Dark Mode Support (hardened, no design changes) ===================== */
@media (prefers-color-scheme: dark) {
  body { background-color:#121212; color:#e9ecef; }

  /* Navbar */
  .navbar { background-color: rgba(18,18,18,0.95) !important; border-bottom-color: rgba(255,255,255,0.1); }
  .navbar .nav-link { color: rgba(255,255,255,0.85) !important; }
  .navbar .nav-link:hover,
  .navbar .nav-link.active { color: var(--primary-color) !important; background-color: rgba(13,110,253,0.12); }

  /* Keep brand/link palette the same */
  a { color: var(--primary-color); }
  a:hover { color: var(--primary-dark); }

  /* Surfaces that are light in day mode */
  .bg-white, .bg-light { background-color:#1e1e1e !important; }

  /* Cards and service/value cards */
  .card, .service-card, .value-card {
    background:#1e1e1e !important;
    border-color: rgba(255,255,255,0.1) !important;
    color:#e9ecef !important;
  }
  .card-header, .card-body, .card-footer { color: rgba(255,255,255,0.9); }

  /* Headings on dark cards */
  .card h1, .card h2, .card h3, .card h4, .card h5, .card h6,
  .service-card h1, .service-card h2, .service-card h3, .service-card h4, .service-card h5, .service-card h6,
  .value-card h1, .value-card h2, .value-card h3, .value-card h4, .value-card h5, .value-card h6 {
    color:#ffffff !important;
  }

  /* Paragraphs and lists inside cards/sections */
  .card p, .card .card-text, .card li,
  .service-card p, .service-card .card-text, .service-card li,
  .value-card p, .value-card .card-text, .value-card li {
    color: rgba(255,255,255,0.87) !important;
  }

  /* About section long text */
  .about-section p, .about-section li, .about-section .lead,
  .about-image-section ~ * { color: rgba(233,236,239,0.9) !important; }

  /* Common Bootstrap text utilities that force dark text */
  .text-dark, .text-body, .text-black { color:#e9ecef !important; }
  .text-muted, .text-secondary { color: rgba(233,236,239,0.72) !important; }

  /* Forms in dark mode: readable inputs */
  .form-control, .form-select {
    background:#1b1b1b; color:#e9ecef; border-color:#2b2b2b;
  }
  .form-control::placeholder { color: rgba(233,236,239,0.55); }
  .form-label { color:#e9ecef; }

  /* Buttons already look correct; ensure outline-light contrast */
  .btn-outline-light { color: rgba(255,255,255,0.95) !important; border-color: rgba(255,255,255,0.7) !important; background:transparent !important; }
  .btn-outline-light:hover { background:#fff !important; color: var(--primary-color) !important; border-color:#fff !important; }

  /* Breadcrumb in dark sections stays visible */
  .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,0.55); }
  .breadcrumb-item a { color: rgba(255,255,255,0.8); }
  .breadcrumb-item a:hover { color: var(--warning-color); }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  html { scroll-behavior: auto; }
  .carousel, .carousel-item { transition: none; }
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
  .btn { border: 2px solid currentColor; }
  .card { border: 2px solid currentColor; }
  .form-control, .form-select { border: 2px solid currentColor; }
}

/* Animation Classes */
.animate-on-scroll { opacity:0; transform:translateY(30px); transition: all 0.8s ease-out; }
.animate-on-scroll.animate { opacity:1; transform:translateY(0); }
.animate-delay-1 { animation-delay: 0.1s; }
.animate-delay-2 { animation-delay: 0.2s; }
.animate-delay-3 { animation-delay: 0.3s; }
.animate-delay-4 { animation-delay: 0.4s; }
.animate-delay-5 { animation-delay: 0.5s; }

/* ===== COMPLETE PERFECTED CAROUSEL CSS FOR UMASINGH EDTECH ===== */

/* Hero Carousel Container */
.hero-carousel { position:relative; height:100vh; min-height:600px; overflow:hidden; z-index:1; }
/* Bootstrap Carousel Overrides */
.carousel { height:100%; width:100%; }
.carousel-inner { height:100%; }
/* Individual Carousel Items */
.carousel-item {
  height:100vh; min-height:600px; position:relative;
  background-attachment: fixed; background-size: cover; background-position:center center;
  background-repeat:no-repeat; display:flex; align-items:center; transition: transform 0.6s ease-in-out;
}
/* Background Image Styling */
.carousel-bg {
  position:absolute; top:0; left:0; width:100%; height:100%;
  background-size:cover; background-position:center center; background-repeat:no-repeat; background-attachment:fixed; z-index:1;
}
/* Modern Gradient Overlay */
.carousel-overlay {
  position:absolute; top:0; left:0; width:100%; height:100%;
  background: linear-gradient(135deg, rgba(13,110,253,0.85) 0%, rgba(255,193,7,0.75) 50%, rgba(13,110,253,0.9) 100%);
  z-index:2;
}
/* Alternative overlay patterns */
.carousel-item:nth-child(2) .carousel-overlay { background: linear-gradient(45deg, rgba(25,135,84,0.8) 0%, rgba(13,110,253,0.7) 100%); }
.carousel-item:nth-child(3) .carousel-overlay { background: linear-gradient(-45deg, rgba(220,53,69,0.8) 0%, rgba(255,193,7,0.7) 100%); }
/* Content Container */
.carousel-content {
  position:relative; z-index:3; height:100%;
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:2rem; max-width:100%;
}
/* Enhanced Text Styling */
.carousel-content h1 { text-shadow:2px 2px 4px rgba(0,0,0,0.3); margin-bottom:1.5rem; font-weight:700; line-height:1.1; letter-spacing:-0.02em; }
.carousel-content h2 { text-shadow:1px 1px 2px rgba(0,0,0,0.2); margin-bottom:1.5rem; font-weight:600; }
.carousel-content p { text-shadow:1px 1px 2px rgba(0,0,0,0.2); max-width:800px; margin:0 auto 2rem; font-size:1.125rem; line-height:1.6; }
/* Hero Buttons Container */
.hero-buttons { display:flex; gap:1rem; justify-content:center; align-items:center; flex-wrap:wrap; margin-top:1rem; }
.hero-buttons .btn {
  font-weight:600; padding:1rem 2rem; border-radius:0.5rem; text-transform:uppercase; letter-spacing:0.5px;
  transition:all 0.3s ease; position:relative; overflow:hidden; z-index:1; min-width:180px;
}
.hero-buttons .btn::before {
  content:""; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition:left 0.5s; z-index:-1;
}
.hero-buttons .btn:hover::before { left:100%; }
.hero-buttons .btn:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(0,0,0,0.2); }
/* Enhanced Carousel Indicators */
.carousel-indicators { bottom:30px; z-index:10; margin:0; padding:0; }
.carousel-indicators [data-bs-target] {
  width:16px; height:16px; border-radius:50%; margin:0 8px;
  border:3px solid rgba(255,255,255,0.5); background-color:transparent; opacity:1;
  transition:all 0.3s ease; cursor:pointer; position:relative; box-shadow:0 2px 8px rgba(0,0,0,0.2);
}
.carousel-indicators [data-bs-target]:hover { border-color: rgba(255,255,255,0.8); transform: scale(1.1); }
.carousel-indicators .active { background-color:#ffc107; border-color:#ffc107; transform:scale(1.2); box-shadow:0 0 0 4px rgba(255,193,7,0.3); }
/* Modern Carousel Controls */
.carousel-control-prev, .carousel-control-next {
  width:70px; height:70px; background: rgba(255,255,255,0.1);
  border:2px solid rgba(255,255,255,0.3); border-radius:50%;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  opacity:1; transition: all 0.3s ease; top:50%; transform: translateY(-50%); z-index:10;
}
.carousel-control-prev { left:40px; } .carousel-control-next { right:40px; }
.carousel-control-prev:hover, .carousel-control-next:hover {
  background: rgba(255,255,255,0.2); border-color:#ffc107; transform: translateY(-50%) scale(1.1); box-shadow:0 8px 25px rgba(0,0,0,0.2);
}
.carousel-control-prev:focus, .carousel-control-next:focus { background: rgba(255,255,255,0.2); border-color:#ffc107; }
/* Control Icons */
.carousel-control-prev-icon, .carousel-control-next-icon { width:28px; height:28px; background-size:100% 100%; filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.3)); }
/* Smooth Transitions */
.carousel-item-next, .carousel-item-prev, .carousel-item.active { display:flex; }
.carousel-item-next:not(.carousel-item-start), .active.carousel-item-end { transform: translateX(100%); }
.carousel-item-prev:not(.carousel-item-end), .active.carousel-item-start { transform: translateX(-100%); }
/* Content Animations */
@keyframes slideUpFadeIn { from {opacity:0; transform:translateY(60px);} to {opacity:1; transform:translateY(0);} }
@keyframes slideLeftFadeIn { from {opacity:0; transform:translateX(-60px);} to {opacity:1; transform:translateX(0);} }
@keyframes slideRightFadeIn { from {opacity:0; transform:translateX(60px);} to {opacity:1; transform:translateX(0);} }
@keyframes fadeInScale { from {opacity:0; transform:scale(0.9);} to {opacity:1; transform:scale(1);} }
.animate-slide-up { animation: slideUpFadeIn 0.8s ease-out forwards; opacity:0; }
.animate-slide-left { animation: slideLeftFadeIn 0.8s ease-out forwards; opacity:0; }
.animate-slide-right { animation: slideRightFadeIn 0.8s ease-out forwards; opacity:0; }
.animate-fade-in { animation: fadeInScale 0.8s ease-out forwards; opacity:0; }
/* Staggered Animation Delays */
.carousel-content h1.animate-slide-up { animation-delay:0.2s; }
.carousel-content h2.animate-slide-up { animation-delay:0.4s; }
.carousel-content p.animate-slide-up { animation-delay:0.6s; }
.hero-buttons.animate-slide-up { animation-delay:0.8s; }
/* Parallax Effect Enhancement */
.carousel-item.active .carousel-bg { animation: parallaxZoom 15s ease-in-out infinite; }
@keyframes parallaxZoom { 0%,100%{transform:scale(1);} 50%{transform:scale(1.1);} }
/* Loading State */
.carousel-item.loading { background: linear-gradient(135deg, #0d6efd 0%, #ffc107 100%); }
.carousel-item.loading::after {
  content:""; position:absolute; top:50%; left:50%; width:50px; height:50px;
  border:4px solid rgba(255,255,255,0.3); border-top:4px solid #fff; border-radius:50%;
  transform: translate(-50%,-50%); animation: spin 1s linear infinite;
}
/* Responsive Design */
@media (max-width: 1199.98px) {
  .hero-carousel, .carousel-item { height:90vh; min-height:550px; }
  .carousel-control-prev, .carousel-control-next { width:60px; height:60px; }
  .carousel-control-prev { left:30px; } .carousel-control-next { right:30px; }
}
@media (max-width: 991.98px) {
  .hero-carousel, .carousel-item { height:80vh; min-height:500px; }
  .carousel-content { padding:1.5rem; }
  .carousel-content h1 { font-size:2.5rem; }
  .carousel-control-prev, .carousel-control-next { width:55px; height:55px; }
  .carousel-control-prev { left:20px; } .carousel-control-next { right:20px; }
  .carousel-control-prev-icon, .carousel-control-next-icon { width:24px; height:24px; }
}
@media (max-width: 767.98px) {
  .hero-carousel, .carousel-item { height:70vh; min-height:450px; }
  .carousel-bg { background-attachment: scroll; }
  .carousel-content { padding:1rem; }
  .carousel-content h1 { font-size:2rem; margin-bottom:1rem; }
  .carousel-content h2 { font-size:1.25rem; margin-bottom:1rem; }
  .carousel-content p { font-size:1rem; margin-bottom:1.5rem; }
  .hero-buttons { flex-direction:column; gap:0.75rem; width:100%; }
  .hero-buttons .btn { width:100%; max-width:280px; padding:0.875rem 1.5rem; min-width:auto; }
  .carousel-control-prev, .carousel-control-next { width:50px; height:50px; }
  .carousel-control-prev { left:15px; } .carousel-control-next { right:15px; }
  .carousel-control-prev-icon, .carousel-control-next-icon { width:20px; height:20px; }
  .carousel-indicators { bottom:20px; }
  .carousel-indicators [data-bs-target] { width:12px; height:12px; margin:0 6px; border-width:2px; }
}
@media (max-width: 575.98px) {
  .hero-carousel, .carousel-item { height:60vh; min-height:400px; }
  .carousel-content h1 { font-size:1.75rem; line-height:1.2; }
  .carousel-content h2 { font-size:1.125rem; }
  .carousel-content p { font-size:0.95rem; }
  .hero-buttons .btn { padding:0.75rem 1.25rem; font-size:0.9rem; }
  .carousel-control-prev, .carousel-control-next { width:45px; height:45px; }
  .carousel-control-prev { left:10px; } .carousel-control-next { right:10px; }
  .carousel-control-prev-icon, .carousel-control-next-icon { width:18px; height:18px; }
}
/* High Performance Optimizations */
.carousel-item img, .carousel-bg { image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; }
/* Accessibility Improvements */
@media (prefers-reduced-motion: reduce) {
  .carousel-item, .carousel-control-prev, .carousel-control-next, .carousel-indicators [data-bs-target] { transition:none; }
  .animate-slide-up, .animate-slide-left, .animate-slide-right, .animate-fade-in { animation:none; opacity:1; transform:none; }
  .carousel-item.active .carousel-bg { animation:none; }
}
/* Print Styles */
@media print {
  .carousel-control-prev, .carousel-control-next, .carousel-indicators { display:none !important; }
  .carousel-item { height:auto !important; min-height:auto !important; }
  .carousel-overlay { background: rgba(0,0,0,0.1) !important; }
}
/* Force Hardware Acceleration */
.carousel-item, .carousel-bg, .carousel-overlay, .carousel-content {
  transform: translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden;
}

/* CTA Section Button Fix */

/* Base CTA Section Styling */
.cta-section { padding:4rem 0; position:relative; overflow:hidden; }
.cta-section.bg-primary { background: var(--gradient-primary); }
.cta-section.bg-dark { background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%); }

/* CTA Content Container */
.cta-content { display:flex; align-items:center; gap:2rem; flex-wrap:wrap; }
/* CTA Text Column */
.cta-text { flex:1; min-width:300px; }
.cta-text h3 { font-size:1.75rem; font-weight: var(--font-weight-bold); margin-bottom:0.75rem; line-height:1.3; }
.cta-text p { font-size:1.1rem; line-height:1.6; margin:0; opacity:0.9; }
/* CTA Buttons Container */
.cta-buttons {
  flex-shrink:0; display:flex; gap:1rem; align-items:center; justify-content:flex-end; flex-wrap:wrap; min-width:300px;
}
/* Individual CTA Buttons */
.cta-btn {
  display:inline-flex; align-items:center; justify-content:center;
  padding:0.875rem 1.75rem; font-weight: var(--font-weight-semibold);
  font-size:1rem; border-radius: var(--border-radius); text-decoration:none;
  transition: var(--transition-base); white-space:nowrap; min-width:140px; text-align:center;
  position:relative; overflow:hidden; z-index:1; border:2px solid transparent;
}
/* Primary CTA Button */
.cta-btn.btn-warning { background: var(--gradient-warning); color: var(--dark-color); box-shadow: 0 4px 15px rgba(255,193,7,0.3); border-color: var(--warning-color); }
.cta-btn.btn-warning:hover {
  background: linear-gradient(135deg, #ffb300, #ff8f00); color: var(--dark-color);
  transform: translateY(-2px); box-shadow: 0 6px 20px rgba(255,193,7,0.4);
}
/* Secondary CTA Button */
.cta-btn.btn-outline-light { background:transparent; color: rgba(255,255,255,0.95); border-color: rgba(255,255,255,0.7); }
.cta-btn.btn-outline-light:hover {
  background:#fff; color: var(--primary-color); border-color:#fff; transform: translateY(-2px); box-shadow:0 6px 20px rgba(255,255,255,0.2);
}
/* Large CTA Buttons */
.cta-btn.btn-lg { padding:1rem 2rem; font-size:1.125rem; min-width:160px; }
/* Button Icons */
.cta-btn i { margin-right:0.5rem; font-size:0.9em; }
/* Button Hover Effects */
.cta-btn::before {
  content:""; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition:left 0.6s; z-index:-1;
}
.cta-btn:hover::before { left:100%; }

/* Responsive Design for CTA Sections */
@media (min-width: 1200px) {
  .cta-content { gap:3rem; }
  .cta-buttons { min-width:350px; gap:1.25rem; }
  .cta-btn { min-width:160px; padding:1rem 2rem; }
  .cta-btn.btn-lg { min-width:180px; padding:1.125rem 2.25rem; font-size:1.2rem; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .cta-content { gap:2rem; }
  .cta-buttons { min-width:320px; gap:1rem; }
  .cta-btn { min-width:150px; padding:0.875rem 1.75rem; font-size:0.95rem; }
  .cta-btn.btn-lg { min-width:170px; padding:1rem 2rem; font-size:1.1rem; }
  .cta-text h3 { font-size:1.6rem; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .cta-content { flex-direction:column; text-align:center; gap:2rem; }
  .cta-text { min-width:100%; text-align:center; }
  .cta-buttons { justify-content:center; min-width:100%; gap:1rem; }
  .cta-btn { min-width:140px; padding:0.875rem 1.5rem; }
  .cta-btn.btn-lg { min-width:160px; padding:1rem 1.75rem; }
}
@media (max-width: 767.98px) {
  .cta-section { padding:3rem 0; }
  .cta-content { flex-direction:column; text-align:center; gap:1.5rem; }
  .cta-text { min-width:100%; text-align:center; }
  .cta-text h3 { font-size:1.4rem; margin-bottom:1rem; }
  .cta-text p { font-size:1rem; }
  .cta-buttons { flex-direction:column; width:100%; gap:0.75rem; justify-content:center; }
  .cta-btn { width:100%; max-width:280px; min-width:auto; padding:1rem 1.5rem; justify-content:center; }
  .cta-btn.btn-lg { padding:1.125rem 1.75rem; font-size:1.1rem; }
}
@media (max-width: 575.98px) {
  .cta-section { padding:2.5rem 0; }
  .cta-text h3 { font-size:1.25rem; line-height:1.4; }
  .cta-text p { font-size:0.95rem; }
  .cta-buttons { gap:0.5rem; }
  .cta-btn { max-width:260px; padding:0.875rem 1.25rem; font-size:0.95rem; }
  .cta-btn.btn-lg { padding:1rem 1.5rem; font-size:1rem; }
  .cta-btn i { margin-right:0.375rem; }
}

/* Additional Utility Classes for CTA Sections */
.cta-primary { background: var(--gradient-primary); color: var(--white); }
.cta-dark { background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%); color: var(--white); }
.cta-warning { background: var(--gradient-warning); color: var(--dark-color); }

/* Animation for CTA Sections */
@keyframes ctaSlideUp { from {opacity:0; transform:translateY(20px);} to {opacity:1; transform:translateY(0);} }
.cta-animate { animation: ctaSlideUp 0.6s ease-out forwards; }
.cta-animate .cta-text { animation: ctaSlideUp 0.6s ease-out 0.1s forwards; opacity:0; }
.cta-animate .cta-buttons { animation: ctaSlideUp 0.6s ease-out 0.2s forwards; opacity:0; }

/* Focus States for Accessibility */
.cta-btn:focus { outline:2px solid rgba(255,255,255,0.5); outline-offset:2px; }
.cta-btn.btn-warning:focus { outline-color: rgba(255,193,7,0.7); }

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
  .cta-btn { border-width:3px; }
  .cta-btn.btn-outline-light { border-color: var(--white); }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
  .cta-btn { transition:none; }
  .cta-btn:hover { transform:none; }
  .cta-btn::before { transition:none; }
  .cta-animate, .cta-animate .cta-text, .cta-animate .cta-buttons { animation:none; opacity:1; }
}