src/styles/not-found.module.scss
.section {
  margin: var(--space-32) 0;
}

.wrapper {
  width: min(100%, 66rem);
  padding: var(--space-8);
  margin-inline: auto;
  display: flex;
  gap: var(--space-18);
  align-items: center;
}

.figure {
  flex: 1;

  display: flex;
  align-items: center;
  justify-content: center;

  a {
    max-width: 26rem;
    width: 100%;
    height: auto;
    aspect-ratio: 1 /1;
    transition: 0.3s transform;

    &:hover {
      transform: translateY(calc(-1 * var(--space-2)));
    }
  }

  img {
    width: 100%;
    height: 100%;
  }
}

.article {
  flex: 1;

  h2 {
    font-size: var(--font-size-6xl);
    margin-bottom: var(--space-6);
  }

  p {
    margin-bottom: var(--space-6);
  }

  .message {
    padding: var(--space-4);
    font-size: var(--font-size-xs);
    line-height: var(--line-height-base);
    background: var(--colors-gray-200);
    border-radius: var(--radii-sm);

    a {
      font-weight: var(--font-weight-bold);
      text-decoration: underline;
      margin-inline: var(--space-1);
    }
  }
}

.links {
  margin-bottom: var(--space-12);
  display: flex;
  gap: var(--space-2);
  align-items: center;

  a {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radii-sm);
    font-size: var(--font-size-xs);
    display: block;
    transition: 0.15s all;

    &:first-child {
      color: var(--colors-white);
      background: var(--colors-red-light);

      &:hover {
        background: var(--colors-red-medium);
      }
    }

    &:last-child {
      color: var(--colors-red-light);
      box-shadow: inset 0 0 0 1px var(--colors-red-medium);

      &:hover {
        background: var(--colors-red-medium);
        color: var(--colors-white);
      }
    }
  }
}
@media screen and (max-width: 768px) {
  .section {
    margin: var(--space-20) 0;
  }

  .wrapper {
    padding: 0 var(--space-16);
  }

  .figure {
    display: none;
  }
}

@media screen and (max-width: 400px) {
  .links {
    flex-direction: column;

    a {
      width: 100%;
      text-align: center;
    }
  }
}
