/* ========================================== */
/* ESTILOS ESPECÍFICOS: WORKS & PROJECT CARDS */
/* ========================================== */

.project-card {
  background-color: var(--card-surface, #161B22);
  border: 1px solid var(--tech-border, #30363D);
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
              border-color 0.3s ease, 
              box-shadow 0.3s ease;
}

.project-card:hover {
  border-color: var(--accent-cyan, #00E5FF);
  transform: translateY(-4px);
  box-shadow: inset 0 1px 0 rgba(0, 229, 255, 0.4), 0 8px 24px rgba(0, 229, 255, 0.12);
}

.project-thumbnail {
  width: 100%;
  aspect-ratio: 16 / 9;
  background-color: #0D1117;
  border-bottom: 1px solid var(--tech-border, #30363D);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
}

.project-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.project-card:hover .project-thumbnail img {
  transform: scale(1.04);
}