/* Tarjeta de proyecto usada en la galería de /proyectos */
.project-card {
  background: var(--card);
  overflow: hidden;
  border: 1px solid rgba(128, 161, 168, .18);
  transition: transform .25s, box-shadow .25s;
}

.project-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 38px rgba(40, 63, 71, .13);
}

.project-card .project-carousel {
  height: 330px;
}

.project-card > div {
  padding: 25px 28px 30px;
}

.project-card span {
  font: 10px "DM Mono";
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
}

.project-card h2 {
  font-size: 37px;
  line-height: 1;
  margin: 11px 0;
}

.project-card p {
  margin: 0;
}

.project-large {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1.45fr .8fr;
  align-items: stretch;
}

.project-large .project-carousel {
  height: 460px;
}

.project-large > div {
  align-self: end;
}

.project-placeholder {
  display: grid;
  place-items: center;
  min-height: 330px;
  border-style: dashed;
  background: transparent;
  text-align: center;
}

.project-placeholder > div {
  padding: 30px;
}

.project-placeholder p {
  max-width: 280px;
}

@media (max-width: 720px) {
  .project-large .project-carousel,
  .project-card .project-carousel {
    height: 300px;
  }

  .project-placeholder {
    min-height: 260px;
  }
}

@media (max-width: 480px) {
  .project-card .project-carousel,
  .project-large .project-carousel {
    height: 245px;
  }

  .project-card > div {
    padding: 22px;
  }

  .project-card h2 {
    font-size: 31px;
  }
}
