@media (max-width: 1199.98px) {
  .hero-slide {
    min-height: clamp(360px, 54vh, 520px);
  }

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

@media (max-width: 991.98px) {
  .hero-slide {
    grid-template-columns: 1fr;
    gap: 10px;
    min-height: auto;
  }

  .hero-slide__media {
    min-height: 240px;
  }

  .hero-slide__media img {
    max-height: 320px;
  }

  .hero-carousel .carousel-control-prev,
  .hero-carousel .carousel-control-next {
    width: 36px;
    height: 36px;
  }

  .user-dashboard-wrap {
    grid-template-columns: 1fr;
  }

  .site-header .navbar-collapse {
    background: var(--color-surface);
    border-radius: 8px;
    padding: 12px;
    margin-top: 8px;
    border: 1px solid var(--color-border);
  }
}

@media (max-width: 767.98px) {
  .hero-slide {
    padding: 14px;
  }

  .hero-slide__content h1,
  .hero-slide__content h2 {
    font-size: 1.45rem;
  }

  .hero-slide__media {
    min-height: 200px;
    padding: 8px;
  }

  .hero-slide__media img {
    max-height: 240px;
  }

  .hero-carousel .carousel-control-prev {
    left: 8px;
  }

  .hero-carousel .carousel-control-next {
    right: 8px;
  }

  .newsletter-box {
    padding: 24px 16px;
  }
}

@media (max-width: 575.98px) {
  .topbar {
    font-size: 12px;
  }

  .product-card__body {
    padding: 12px;
  }

  .section-title {
    font-size: 1.25rem;
  }

  .kpi-grid {
    grid-template-columns: 1fr;
  }
}