/* ==========================================================================
   Страница-кейс Ванта — цветовая тема (синяя).
   Подключается ПОСЛЕ styles.css и kassir-case.css: переиспользует всю
   структурную вёрстку (шапка, hero, intro, divider, cols, carousel,
   results, other-cases, final-cta) и переопределяет только цвета/контент,
   специфичные для этого кейса.
   ========================================================================== */

:root {
  --case-divider-line: linear-gradient(
    90deg,
    rgba(17, 26, 63, 0) 0%,
    #002262 17%,
    #3e81ff 34%,
    #ffffff 50.481%,
    #3e81ff 67%,
    #002262 84%,
    rgba(17, 26, 63, 0) 100%
  );
  /* Уточнено попиксельно по рендеру Figma: светло-голубой → насыщенный синий
     (без чистого белого) — иначе цвет был еле заметен на сайте. */
  --case-gold-text: linear-gradient(175deg, #bfe4ff 0%, #4db8ff 100%);
}

/* ---------- Ряд чипов после hero (599:2097) — нет у кейса Kassir ---------- */
.case-chips {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 20px clamp(24px, 5.56vw, 80px);
}

.case-chips__row,
.case-chips__award {
  display: flex;
  width: min(843px, 100%);
}

.case-chips__row {
  gap: 12px;
}

.case-chips__row span,
.case-chips__award span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  border: 1px solid transparent;
  border-radius: 20px;
  white-space: nowrap;
  /* градиентная обводка (синий диагональный градиент, как у кнопок карусели) */
  background:
    linear-gradient(#0d0d0d, #0d0d0d) padding-box,
    linear-gradient(135deg, #bbe3ff 0%, #35acfe 100%) border-box;
}

.case-chips__row span {
  color: #ffffff;
  font-size: 12px;
  line-height: 16px;
}

.case-chips__award span {
  color: var(--text-muted, #bcbcbc);
  font-size: 16px;
  line-height: 20px;
}

/* ---------- Кнопки карусели — синий градиент вместо жёлтого ---------- */
.carousel-btn {
  background:
    linear-gradient(#0d0d0d, #0d0d0d) padding-box,
    linear-gradient(135deg, #bbe3ff 0%, #35acfe 100%) border-box;
}

/* ---------- Финальный блок (синяя тема) ---------- */
.case-final .final-cta__text h2 {
  background-image: linear-gradient(167.353deg, #c9e4ff 0%, #4fb8ff 100%);
}

.case-final__photo {
  border: 1px solid transparent;
  background:
    linear-gradient(#0d0d0d, #0d0d0d) padding-box,
    linear-gradient(180deg, #ffffff 0%, #35acfe 100%) border-box;
}

/* Уточнено попиксельно по рендеру Figma (599:2249) — обводка кнопки на
   самом деле диагональный градиент (светло-голубой → насыщенный синий),
   а не плоский белый, как было раньше. */
.case-final .final-cta__button {
  border: 1px solid transparent;
  background:
    linear-gradient(#0d0d0d, #0d0d0d) padding-box,
    linear-gradient(135deg, #ceeaff 0%, #25a4fe 100%) border-box;
}