/* Forces all portfolio items to have the same shape */
.portfolio-wrap-img {
  width: 100%;
  aspect-ratio: 4 / 3; /* Standard rectangle. Use 1 / 1 for squares */
  overflow: hidden;
  display: flex;
  align-items: center; /* Vertically center */
  justify-content: center; /* Horizontally center */
  background-color: #f4f6f9; /* Light gray background for contrast */
  border-radius: 8px; /* Optional: rounded corners */
}

/* Ensures the image fits inside without stretching */
.portfolio-wrap-img img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain; /* Shows full image with whitespace around it */
  transition: transform 0.3s;
}

/* Optional: Add a subtle shadow to mobile screenshots so they pop */
.portfolio-wrap-img img {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Hover effect zoom */
.portfolio-entry:hover .portfolio-wrap-img img {
  transform: scale(1.05);
}