.project-carousel-title h3 {
  display: -webkit-box;
  overflow: hidden;
  max-width: min(1180px, calc(100% - 56px));
  margin-inline: auto;
  font-size: clamp(30px, 2.65vw, 44px);
  line-height: 1.08;
  text-wrap: balance;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.project-carousel-title span {
  display: -webkit-box;
  overflow: hidden;
  max-width: min(1050px, calc(100% - 56px));
  margin: 10px auto 0;
  line-height: 1.5;
  text-wrap: balance;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

@media (max-width: 900px) {
  .project-carousel-title h3,
  .project-carousel-title span {
    max-width: var(--container);
  }

  .project-carousel-title h3 {
    font-size: clamp(28px, 8vw, 40px);
  }
}