/* services-section.css */

/* סינון רק בתוך הסקשן #services כדי למנוע התנגשות */
#services .service-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-top: 3rem;
}

#services .service-card {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow-light);
  transition: transform var(--transition-speed) ease,
              box-shadow var(--transition-speed) ease;
  text-decoration: none;
  color: inherit;
}

#services .service-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--box-shadow);
}

/* תמונה בגודל אחיד, עם object-fit cover */
#services .service-card img {
  display: block;
  width: 100%;
  height: 200px;
  object-fit: cover;
  transition: transform 2s ease-in-out;
  transform-origin: center center;
}

#services .service-card:hover img {
 transform: scale(1.6);
}

/* כותרת + תיאור בשכבה מעל התמונה */
#services .service-card .card-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.85);
  padding: 1rem;
  box-sizing: border-box;
  z-index: 1;
  transition: background var(--transition-speed) ease;
}

#services .service-card:hover .card-content {
  background: rgba(255, 255, 255, 0.95);
}

#services .service-card .card-content h3 {
  margin: 0 0 0.5rem;
  font-size: 1.3rem;
  color: var(--primary-color);
}

#services .service-card .card-content p {
  margin: 0;
  font-size: 1rem;
  color: var(--text-color);
}

/* רספונסיביות */
@media (max-width: 768px) {
  #services .service-cards {
    grid-template-columns: 1fr;
  }
  #services .service-card img {
    height: 180px;
  }
}