.hero-grid {
  background:
    radial-gradient(circle at top left, rgba(255, 223, 0, 0.24), transparent 25%),
    radial-gradient(circle at bottom right, rgba(79, 179, 232, 0.18), transparent 24%),
    linear-gradient(135deg, #0f3a1b 0%, #0a7a33 48%, #0d5421 100%);
}

.hero-screen {
  min-height: calc(100vh - 72px);
  display: flex;
  align-items: center;
}

.carousel-stage {
  perspective: 1400px;
  perspective-origin: center;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 410px;
}

.carousel-shell {
  position: relative;
  width: clamp(190px, 28vw, 250px);
  height: clamp(268px, 36vw, 344px);
  margin: 0 auto;
  transform-style: preserve-3d;
  cursor: grab;
  user-select: none;
  will-change: transform;
  touch-action: none;
}

.carousel-shell.is-dragging {
  cursor: grabbing;
}

.carousel-item {
  position: absolute;
  inset: 0;
  border-radius: 24px;
  overflow: hidden;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.26);
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #0f3a1b;
}

.carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.04);
  pointer-events: none;
}

.carousel-caption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 0.9rem 0.95rem 1rem;
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.72));
  color: white;
}

.carousel-caption h3 {
  font-size: clamp(0.95rem, 1vw + 0.65rem, 1.15rem);
  line-height: 1.12;
  max-width: 13ch;
}

.carousel-caption p {
  font-size: 0.68rem;
}

@media (max-width: 1024px) {
  .carousel-stage {
    min-height: 365px;
  }

  .carousel-shell {
    width: clamp(190px, 52vw, 255px);
    height: clamp(260px, 68vw, 335px);
  }
}

@media (max-width: 768px) {
  .hero-screen {
    min-height: auto;
    align-items: stretch;
  }

  .carousel-stage {
    min-height: 325px;
  }

  .carousel-shell {
    width: clamp(185px, 62vw, 235px);
    height: clamp(250px, 76vw, 305px);
  }

  .carousel-caption {
    padding: 0.8rem 0.85rem 0.95rem;
  }

  .carousel-caption h3 {
    max-width: 14ch;
  }
}