/* Immediate fixes for teamwork grid (applies without SASS build)
   Purpose: match portfolio grid styling and correct caption alignment/hover
*/

/* Use the teamwork id to keep this scoped and high-specificity */
#teamwork .portfolio-item {
  margin: 0 0 30px;
}

#teamwork .portfolio-link {
  position: relative !important;
  display: block !important;
  max-width: 400px !important;
  margin: 0 auto !important;
  cursor: pointer !important;
}

#teamwork .portfolio-link img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

#teamwork .portfolio-hover {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transition: opacity 0.5s ease !important;
  opacity: 0 !important;
  background: rgba(254, 209, 54, 0.08) !important; /* fallback for $primary */
}

#teamwork .portfolio-link:hover .portfolio-hover,
#teamwork .portfolio-hover:hover {
  opacity: 1 !important;
}

#teamwork .portfolio-hover-content {
  font-size: 20px !important;
  position: absolute !important;
  top: 50% !important;
  left: 0 !important;
  width: 100% !important;
  transform: translateY(-50%) !important;
  text-align: center !important;
  color: #fff !important;
}

#teamwork .portfolio-caption {
  max-width: 400px !important;
  margin: 0 auto !important;
  padding: 25px !important;
  text-align: center !important;
  background-color: #ffffff !important;
}

#teamwork .portfolio-caption h4 {
  margin: 0 !important;
  text-transform: none !important;
}

#teamwork .portfolio-caption p {
  font-size: 16px !important;
  font-style: italic !important;
  margin: 0 !important;
}