#resources {
  display: grid;
  gap: var(--space-xl);
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;
  position: relative;

  &::before {
    background-color: var(--color-background-alt);
    content: "";
    inset: 0;
    left: -100vw;
    position: absolute;
    right: -100vw;
    z-index: -1;
  }
}

.posts {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xl);
}

article {
  border-radius: var(--radius-lg);
  background-color: var(--white);
  padding: 0;

  header {
    border-left: 2px solid var(--color-accent);
    margin: var(--space-xl);
    padding-inline: var(--space-md);

    a {
      font-family: "Antonio", sans-serif;
      font-size: var(--font-size-3xl);
      text-transform: uppercase;
    }
  }

  img {
    border-radius: var(--radius-lg);
    width: 100%;
  }
}