/*
 * AI24Solutions products:
 * horizontal manual scrolling carousel.
 * No autoplay.
 */

.home-products-section .portfolio-heading {
  align-items: flex-end;
  display: flex;
  gap: 24px;
  justify-content: space-between;
}

.home-products-section .portfolio-grid {
  display: flex !important;
  gap: 22px;
  grid-template-columns: none !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-inline: contain;
  padding: 4px 2px 18px;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.home-products-section .portfolio-tile {
  box-sizing: border-box;
  flex: 0 0 370px;
  max-width: 370px;
  scroll-snap-align: start;
}

.portfolio-carousel-controls {
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
}

.portfolio-carousel-button {
  align-items: center;
  appearance: none;
  background: #fff;
  border: 1px solid rgba(16, 24, 40, .13);
  border-radius: 999px;
  color: #101828;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 26px;
  height: 44px;
  justify-content: center;
  line-height: 1;
  padding: 0 0 2px;
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
  width: 44px;
}

.portfolio-carousel-button:hover {
  border-color: rgba(89, 102, 168, .45);
  box-shadow: 0 8px 24px rgba(16, 24, 40, .09);
  transform: translateY(-1px);
}

.portfolio-carousel-button:focus-visible {
  outline: 3px solid rgba(89, 102, 168, .25);
  outline-offset: 2px;
}

.portfolio-tile__icon--voice {
  align-items: center;
  display: flex;
  justify-content: center;
}

.portfolio-tile__voice-mark {
  align-items: center;
  background:
    linear-gradient(
      135deg,
      rgba(89, 102, 168, .12),
      rgba(31, 41, 55, .06)
    );
  border: 1px solid rgba(89, 102, 168, .18);
  border-radius: 12px;
  color: #5966a8;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  height: 42px;
  justify-content: center;
  letter-spacing: .08em;
  width: 42px;
}

@media (max-width: 767px) {
  .home-products-section .portfolio-heading {
    align-items: flex-start;
  }

  .portfolio-carousel-controls {
    display: none;
  }

  .home-products-section .portfolio-grid {
    gap: 16px;
    margin-right: -20px;
    padding-right: 34px;
  }

  .home-products-section .portfolio-tile {
    flex-basis: calc(100vw - 54px);
    max-width: calc(100vw - 54px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-products-section .portfolio-grid {
    scroll-behavior: auto;
  }

  .portfolio-carousel-button {
    transition: none;
  }
}

/* === PRODUCT CARD EQUAL HEIGHT V22 ===
   The tallest product card defines the row height.
   All other cards stretch to that height.
   CTA/actions remain aligned to the bottom.
*/
.home-products-section
.portfolio-grid[data-products-track] {
  align-items: stretch !important;
}

.home-products-section
.portfolio-grid[data-products-track]
> .portfolio-tile {
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  max-height: none !important;
}

.home-products-section
.portfolio-grid[data-products-track]
> .portfolio-tile
.portfolio-tile__actions {
  margin-top: auto !important;
  padding-top: 18px;
}
