html > body > #grid .team {
  /** Required arguments with purportedly ridiculous defaults */
  --element-padding: 50px;
  --element-background-opaque: red;
  --element-gap: 100px;

  /** Optional arguments with sensible defaults */
  --element-border-radius: none;
  --element-box-shadow: none;

  display: flex;
  gap: var(--element-gap);
  flex-wrap: wrap;
  width: 100%;

  > article {
    max-width: 15rem;
    width: max-content;

    display: flex;
    flex-direction: column;
    gap: var(--element-gap);

    overflow: hidden;
    background-image: var(--background);
    background-size: cover;
    border-radius: var(--element-border-radius);
    box-shadow: var(--element-box-shadow);
    text-align: center;

    padding: var(--element-padding);

    position: relative;

    &:before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      height: 1000px;
      width: 1000px;
      background: var(--element-background-opaque);
      backdrop-filter: blur(5px) grayscale(50%);
      z-index: 1;
    }

    > * {
      z-index: 2;
      position: relative;
    }

    > a {
      > div {
        display: grid;
        gap: var(--element-gap);

        > img {
          width: 100%;
          border-radius: 49%;
        }
      }
    }
  }
}
