Desktop/wide stylesheet for cluesbysam.com - though I've not made it responsive…

cluesbysam.css

@media (min-width: 721px) {

  .card-grid {
      gap: 0.8rem;
  }

  .card {
      width: calc(80vw / 4);
  }

  .card-back {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 0.5rem;
      grid-template-areas:
          "a d"
          "b d"
          "c d";

  }

  .card-back p.face {
      grid-area: a;
      font-size: 24px;
      line-height: 24px;
  }

  div.name {
      grid-area: b;
      line-height: 20px;
  }

  .card p.profession {
      grid-area: c;
      font-size: 18px;
      line-height: 24px;
  }

  .card-back p.hint {
      grid-area: d;
      font-size: 14px;
      line-height: 14px;
      text-wrap: balance;
  }

  .card-back hr {
      display: none;
  }

  .card-back h3.name {
      font-size: 20px;
      line-height: 20px;
  }
}