/* =====================================================================
   Nitin J Shetty & Co. — Team Leads section + smooth transitions
   Added Sep 2026. Loaded after nitin-shetty.css on index.php.
   Theme colour: #f4bd18 (same as the rest of the site)
   ===================================================================== */

/* ---------- Team Leads section (sits below Our Partners) ---------- */
.home-teamleads-bg {
  background: #ffffff;
  padding: 50px 0 40px;
}

/* ---------- Photo hover: gentle lift + mustard ring (Partners & Team Leads) ---------- */
.home-partners-bg .partners-box img {
  -webkit-transition: transform .6s cubic-bezier(.22, 1, .36, 1), box-shadow .6s cubic-bezier(.22, 1, .36, 1), filter .4s ease;
  transition: transform .6s cubic-bezier(.22, 1, .36, 1), box-shadow .6s cubic-bezier(.22, 1, .36, 1), filter .4s ease;
  will-change: transform;
}

/* hover effects only on devices with a mouse, so they don't 'stick' after a tap on phones */
@media (hover: hover) {
  .home-partners-bg .partners-box:hover img {
    -webkit-transform: translateY(-6px) scale(1.03);
    transform: translateY(-6px) scale(1.03);
    box-shadow: 0 0 0 5px #f4bd18, 0 22px 38px -16px rgba(0, 0, 0, .45);
  }

  .home-partners-bg .partners-box:hover h3 {
    color: #b8860b;
  }
}

.home-partners-bg .partners-box h3 {
  -webkit-transition: color .4s ease;
  transition: color .4s ease;
}

/* ---------- Scroll reveal (class is added by JS only, so content never hides without JS) ---------- */
.njs-reveal {
  opacity: 0;
  -webkit-transform: translateY(30px);
  transform: translateY(30px);
  -webkit-transition: opacity .8s cubic-bezier(.22, 1, .36, 1), -webkit-transform .9s cubic-bezier(.22, 1, .36, 1);
  transition: opacity .8s cubic-bezier(.22, 1, .36, 1), transform .9s cubic-bezier(.22, 1, .36, 1);
  -webkit-transition-delay: var(--njs-d, 0s);
  transition-delay: var(--njs-d, 0s);
}

.njs-reveal.njs-in {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}

/* ---------- Profile pop-ups: smoother open (Partners & Team Leads only) ---------- */
#Nitin.modal.fade .modal-dialog,
#Sunitha.modal.fade .modal-dialog,
#Sriram.modal.fade .modal-dialog,
#Dhanush.modal.fade .modal-dialog,
#Lakshmi.modal.fade .modal-dialog,
#Joel.modal.fade .modal-dialog,
#Mahesh.modal.fade .modal-dialog,
#Joystan.modal.fade .modal-dialog,
#Sampath.modal.fade .modal-dialog {
  -webkit-transform: translateY(40px) scale(.96);
  transform: translateY(40px) scale(.96);
  -webkit-transition: -webkit-transform .5s cubic-bezier(.22, 1, .36, 1);
  transition: transform .5s cubic-bezier(.22, 1, .36, 1);
}

#Nitin.modal.show .modal-dialog,
#Sunitha.modal.show .modal-dialog,
#Sriram.modal.show .modal-dialog,
#Dhanush.modal.show .modal-dialog,
#Lakshmi.modal.show .modal-dialog,
#Joel.modal.show .modal-dialog,
#Mahesh.modal.show .modal-dialog,
#Joystan.modal.show .modal-dialog,
#Sampath.modal.show .modal-dialog {
  -webkit-transform: none;
  transform: none;
}

/* ---------- Team Lead pop-up content ---------- */
.modal-body .tl-designation {
  font-weight: 600;
  color: #565656;
  border-left: 3px solid #f4bd18;
  padding-left: 10px;
  text-align: left;
}

.modal-body .tl-quote {
  font-style: italic;
  font-size: 16px;
  color: #434141;
  background: #fdf6de;
  border-left: 3px solid #f4bd18;
  padding: 10px 14px;
  text-align: left;
}

.modal-body .tl-list {
  padding-left: 18px;
  margin-bottom: 1rem;
}

.modal-body .tl-list li {
  margin-bottom: 6px;
  line-height: 22px;
}

.modal-body .tl-list li::marker {
  color: #f4bd18;
}

/* ---------- Accessibility: respect reduced-motion settings ---------- */
@media (prefers-reduced-motion: reduce) {
  .njs-reveal { opacity: 1; transform: none; transition: none; }
  .home-partners-bg .partners-box img,
  .home-partners-bg .partners-box:hover img { transition: none; transform: none; }
}
