.concept-carousel {
  --concept-width: clamp(360px, 42vw, 640px);
  --concept-gap: 20px;
  position: relative;
  z-index: 3;
  margin-top: 55px;
}
.concept-viewport {
  width: 100%;
  overflow: hidden;
  touch-action: pan-y pinch-zoom;
}
.concept-track {
  display: flex;
  width: max-content;
  will-change: transform;
}
.concept-group {
  display: flex;
  flex: 0 0 auto;
  gap: var(--concept-gap);
  width: max-content;
  padding: 0 var(--concept-gap) 0 0;
  margin: 0;
  list-style: none;
}
.concept-card {
  flex: 0 0 var(--concept-width);
  width: var(--concept-width);
  aspect-ratio: 16 / 9;
  margin: 0;
  padding: 8px;
  overflow: hidden;
  border: 1px solid #b4b8c980;
  border-radius: 22px;
  background: #11141d;
}
.concept-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 14px;
  background: #08090d;
  user-select: none;
  -webkit-user-drag: none;
}
.concept-controls {
  padding-block: 19px 24px;
}
.concept-caption {
  max-width: 860px;
  color: #b7bac8;
  font-size: 11px;
  line-height: 1.7;
  margin: 0;
}
@media (max-width: 800px) {
  .concept-carousel { --concept-width: 66vw; --concept-gap: 16px; margin-top: 45px; }
  .concept-card { padding: 6px; border-radius: 18px; }
  .concept-card img { border-radius: 11px; }
  .concept-caption { font-size: 10px; }
}
@media (max-width: 520px) {
  .concept-carousel { --concept-width: 88vw; --concept-gap: 12px; margin-top: 38px; }
  .concept-card { padding: 5px; border-radius: 15px; }
  .concept-card img { border-radius: 9px; }
  .concept-controls { padding-block: 16px 20px; }
  .concept-caption { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) { .concept-track { will-change: auto; } }
