/* =========================================================
   WeWolf — Proyectos
   ========================================================= */

.project-list { margin-top: 40px; display: flex; flex-direction: column; gap: 32px; }

.project { display: flex; flex-wrap: wrap; overflow: hidden; border-radius: var(--radius-lg); scroll-margin-top: 96px; }
.project:hover { transform: translateY(-4px); }

.project__media {
  flex: 1 1 440px; min-width: 0; min-height: 340px; position: relative;
  background: var(--slate-ink-2); border-right: 1.5px solid var(--border-strong);
}
.project__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.project__media figcaption {
  position: absolute; left: 16px; bottom: 14px;
  font-family: var(--font-mono); font-size: 12px; color: var(--moon-silver);
  background: rgba(10, 14, 23, .7); padding: 4px 8px; border-radius: 6px;
}

.project__body { flex: 1 1 440px; min-width: 0; padding: 40px; display: flex; flex-direction: column; gap: 22px; }
.project__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.project__meta { margin: 0 0 6px; font-family: var(--font-mono); font-size: 13px; color: var(--dim); }
.project__title { font-size: clamp(40px, 5vw, 56px); letter-spacing: -.045em; line-height: 1; }
.project__desc { margin: 12px 0 0; color: var(--dim); font-size: 17px; }
.project__stack { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }

/* Participantes */
.team__label {
  margin: 0 0 12px;
  font: 11px var(--font-pixel); letter-spacing: .12em; text-transform: uppercase; color: var(--dim);
}
.team { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border); }
.team li {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 0; border-bottom: 1px solid var(--border);
}
.team__who { display: flex; align-items: center; gap: 12px; font-weight: 500; }
.team__role { color: var(--dim); font-size: 13px; font-weight: 400; }

@media (max-width: 720px) {
  .project__media { border-right: 0; border-bottom: 1.5px solid var(--border-strong); min-height: 240px; }
  .project__body { padding: 28px 24px; }
}