.cards > a.card {
  background: #0a090a;
  border-color: #695e59;
  color: #f0eee8;
  box-shadow: 0 3px 10px #0002;
}
.cards > a.card .card-copy {
  background: radial-gradient(ellipse at 50% 0%, #292225, #0a090a 78%);
}
.cards > a.card .card-number,
.cards > a.card p { color: #d0c6c6; }
.cards > a.card .card-arrow { color: #e54955; }
.video-art { display: block; background: #100c0d; }
.video-art > img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.video-art .video-play {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  transform: translate(-50%, -50%);
  border: 1px solid #f0eee8b0;
  border-radius: 50%;
  background: #0808089c;
  color: #f0eee8;
  font-size: 19px;
}
.contact {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  align-items: center;
}
.contact-mark {
  display: block;
  width: 180px;
  aspect-ratio: 402 / 407;
  justify-self: center;
  background: #0a090a;
}
.contact-mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.contact-actions { justify-self: end; }
.contact .button.red { border-radius: 9px; }
@media (max-width: 700px) {
  .contact { grid-template-columns: 1fr; gap: 20px; }
  .contact-mark { width: 148px; }
  .contact-actions { justify-self: start; }
}