/* Small layout corrections. Brand typography, colors and animation stay in main.css. */
.index-page .hero {
  min-height: 0;
  padding-top: clamp(145px, 18vh, 180px);
  padding-bottom: clamp(60px, 9vh, 96px);
}

.hero .hero-title {
  text-wrap: balance;
}

.hero .hero-description {
  text-wrap: pretty;
}

/* Keep the floating header, with a less intrusive shadow above the content. */
.header .header-pill,
.scrolled .header .header-pill {
  box-shadow: 0 12px 32px rgba(0, 0, 0, .22) !important;
}

/* Prevent flex/grid children from forcing the product tour outside the viewport. */
.sol-showcase-wrapper,
.sol-showcase-card,
.sol-showcase-content,
.offer-display,
.booking-calendly {
  min-width: 0;
}

@media (max-width: 767px) {
  .index-page .hero {
    padding-top: 116px;
    padding-bottom: 54px;
  }

  .hero .hero-title {
    font-size: clamp(32px, 8.6vw, 44px);
    line-height: 1.16;
  }

  .hero .hero-laurel-badge {
    padding-inline: 12px;
    gap: 6px;
    font-size: 12px;
  }

  .hero .hero-laurel-badge .laurel-icon {
    width: 16px;
  }
}