.case-study {
  --gutter: var(--space-l);
  --flow-space: var(--space-s);

  display: grid;
  grid-template-rows: auto 1fr;
  font-weight: 200;
  color: var(--color-light);
  text-decoration: none;

  figure {
    margin-inline: 0;
  }

  .case-study--content {
    transition: transform 0.2s ease-out;

    h2 {
      text-transform: uppercase;
      font-size: var(--size-step--1);
      letter-spacing: 0.15em;
      font-weight: var(--font-light);
    }
  }

  &:hover .case-study--content {
    transform: translateY(-1rem);
  }
}

li:has(.case-study) {
  .case-study {
    height: 100%;
  }
}

.case-study--page {
  .banner {
    margin: 0;

    img {
      margin-inline: auto;
    }
  }

  .case-study--summary {
    --wrapper-max-width: calc(800px + 2 * var(--gutter));
  }

  .case-study--meta-data {
    padding-block: var(--space-l);
    border-top: 1px solid var(--color-tint);
    border-bottom: 1px solid var(--color-tint);
  }

  .case-study--meta-data dt {
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    font-size: var(--size-step--1);
    letter-spacing: 0.15em;
    font-weight: var(--font-light);
    color: var(--item-color);
  }

  dd {
    margin: 0;
  }

  .case-study--meta-data-logo {
    flex-basis: 25%;
  }
}

.featured-case-studies {
  padding-block-end: var(--space-xl);
}