.section--hero-about {
  padding-top: var(--space-16);
  padding-bottom: var(--space-12);
}

.hero-about-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  gap: var(--space-8);
  align-items: center;
}

.hero-about-text {
  max-width: 38rem;
}

.hero-about-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.hero-about-visual {
  max-width: 28rem;
  margin-left: auto;
}

.hero-about-board {
  transform: perspective(900px) rotateX(8deg) rotateY(-12deg);
  transform-origin: center;
}

.about-grid-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.about-team-visual img,
.about-puzzle-visual img {
  border-radius: var(--radius-lg);
}

.about-support-banner {
  margin-top: var(--space-4);
}

.about-support-actions {
  flex-wrap: wrap;
}

@media (max-width: 1023px) {
  .hero-about-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .hero-about-visual {
    order: -1;
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  .section--hero-about {
    padding-top: var(--space-12);
    padding-bottom: var(--space-8);
  }

  .about-grid-two {
    grid-template-columns: minmax(0, 1fr);
  }
}
