:root { 
  --brand: #0d6efd; 
  --muted: #6c757d; 
}

/* GLOBAL */
body { 
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; 
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

/* ANIMATIONS */
@keyframes fadeOut {
  to { opacity: 0; visibility: hidden; }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes zoomIn {
  from { transform: scale(0.4); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* NAVBAR */
.navbar-brand strong { 
  color: var(--brand);
}
.navbar-nav .nav-link {
  text-decoration: none;
  color: inherit;
}
.navbar-nav .nav-link:hover {
  font-size: 1rem;
  padding: 8px 12px;
  color:var(--brand);
  text-decoration: none;
}

/* HERO SECTION */
.hero {
  background: linear-gradient(
      120deg, 
      rgba(13,110,253,0.10), 
      rgba(0,123,255,0.03)
    ), 
    url('') center/cover no-repeat;
  min-height: 68vh; 
  display: flex; 
  align-items: center;
}

.hero .card { 
  background: rgba(255,255,255,0.9); 
  box-shadow: 0 8px 30px rgba(18,38,63,0.08);
}

/* HOVER CARDS */
.service-card:hover { 
  transform: translateY(-6px); 
  transition: all .25s ease; 
  cursor: pointer;
}

.team-img {
  width: 70%;
  height: 220px;
  object-fit: cover;
  border-radius: 12px;
  transition: 0.25s ease;
  cursor:pointer;
  display:block;
  margin:0 auto;
}

.team-img:hover { 
  transform: translateY(-6px); 
}



/* CTA SECTION */
.cta { 
  background: linear-gradient(90deg, var(--brand), #0069d9); 
  color: #fff; 
  width:100%;
  height:auto;
  display:block;
}

/* FOOTER */
footer { 
  background: #0b1720; 
  color: #cbd5e1; 
  justify-content: center;
  
}


/* BADGE */
.badge-brand { 
  background: linear-gradient(90deg, #0d6efd, #0069d9);
}

/* FIXED IMAGE INSIDE CARDS */
.card img {   
  width: 90%; 
  border-radius: 10px;
  display: block;
  margin: 0 auto;
}

/* BACK TO TOP */
/* Floating Back To Top Button (Corner) */
#backToTopBtn {
  position: fixed;
  bottom: 18px;
  right: 20px;
  z-index: 999;
  background: #0d6efd;
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 45px;
  height: 45px;
  font-size: 20px;
  cursor: pointer;
  transition: 0.3s;
}
#backToTopBtn:hover {
  background: #084298;
}



/* make sure it doesn't overlap mobile controls too close to bottom */
@media (max-width: 576px) {
  #backToTopBtn {
    right: 12px;
    bottom: 18px;
    width: 44px;
    height: 44px;
  }
}





/* -------------------------
   RESPONSIVE FIXES
--------------------------*/

/* Mobile (0–576px) */
@media (max-width: 576px) {

  .hero {
    min-height: 56vh;
    text-align: center;
    padding: 20px;
  }

  h1, h2, h3 {
    font-size: 1.5rem;
  }

  .navbar-brand {
    font-size: 1rem;
  }

  .team-img {
    height: 180px;
  }

  section {
    padding: 35px 0;
  }
}

/* Tablets (576–768px) */
@media (max-width: 768px) {

  .team-img {
    height: 200px;
  }

  .hero {
    padding: 40px 20px;
    text-align: center;
  }
}

/* Tablets Landscape (768–992px) */
@media (max-width: 992px) {

  .hero img {
    margin-top: 20px;
  }

  .navbar-nav .nav-link {
    padding: 12px;
  }
}

/* Large Screens (1200px+) */
@media (min-width: 1200px) {
  .container {
    max-width: 1180px;
  }
}
.nav-link {
  cursor: pointer;
  pointer-events: auto;
}

footer a {
  text-decoration: none;
  color:#0d6efd;
  transition: 0.3s;
}

footer a:hover {
  color:var(--brand);       /* hover pe blue */
  padding-left: 5px;    /* thoda slide left animation */
  text-decoration: none;
}
footer p a {
  color: #ffffff;
}

footer p a:hover {
  color: #0d6efd;
  text-decoration: none;
}

/* Footer Quick Links Hover */
.footer-link {
  color: #0d6efd;
  transition: 0.3s ease;
  text-decoration: none;
}

.footer-link:hover {
  color: #fff;        /* Hover pe Blue */
  padding-left: 6px;     /* Slide Animation */
  text-decoration: none;
}

.img-fluid {
  height: 450px; /* jitni height chahiye */
  object-fit: cover; /* image ko crop karke perfect fit karega */
}
@media (min-width: 992px) {
  body {
    min-width: 1200px;
  }
}