@layer components {
  .contact-card {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: var(--space-7);
  }

  .contact__intro {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    color: var(--color-gray-dark);
  }

  @media (max-width: 1024px) {
    .contact-card {
      grid-template-columns: 1fr;
      gap: var(--space-6);
    }
  }
}