.demo-mode-banner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  max-width: 1268px;
  margin: 0 auto 20px;
  padding: 13px 16px;
  border: 1px solid #f0c36d;
  border-radius: 13px;
  background: #fff9e9;
  color: #5b460f;
  font-size: 14px;
  line-height: 1.45;
}

.demo-mode-banner strong {
  flex: 0 0 auto;
  color: #7a5700;
}

.demo-mode-banner span {
  display: block;
}

.demo-cleanup-form {
  flex: 0 0 auto;
}

.demo-cleanup-form .danger {
  border: 1px solid #ef4444;
  white-space: nowrap;
}

.demo-cleanup-status {
  display: block;
  margin-top: 8px;
  color: #9a3412;
  font-weight: 700;
}

.demo-locked .primary,
.demo-locked .secondary,
.demo-locked .danger {
  position: relative;
}

.demo-mode-toast {
  position: fixed;
  z-index: 1000;
  right: 24px;
  bottom: 24px;
  max-width: min(390px, calc(100vw - 32px));
  padding: 13px 16px;
  border-radius: 12px;
  background: #173f3b;
  box-shadow: 0 14px 34px rgb(3 31 28 / .24);
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity .18s ease, transform .18s ease;
}

.demo-mode-toast.visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 760px) {
  .demo-mode-banner { flex-direction: column; margin-bottom: 16px; padding: 12px 14px; }
  .demo-mode-toast { right: 16px; bottom: 16px; }
}
/* Витрина покупки в демо: посетитель уже посмотрел продукт, теперь ему надо просто
   выбрать. Полный комплект выделен — он и правда выгоднее втрое. */
.buy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:20px}
.buy-card{position:relative;margin-bottom:0;display:flex;flex-direction:column;gap:8px}
.buy-card h2{margin:0}
.buy-card .hint{margin:0}
.buy-card form{margin-top:auto;padding-top:6px}
.buy-price{margin:0;font-size:30px;font-weight:900;letter-spacing:-.04em}
.buy-card-best{border-color:var(--brand);background:linear-gradient(135deg,#f2fdfa,#fff)}
.buy-badge{position:absolute;top:14px;right:14px;padding:4px 10px;border-radius:999px;background:var(--brand);color:#052d29;font-size:12px;font-weight:800}
.buy-compare{color:#0f766e;font-weight:700}
@media(max-width:760px){.buy-grid{grid-template-columns:1fr}}
/* Витрина «Что входит»: не список подряд, а три группы по три карточки —
   подписчикам, вам, и что делаем дальше мы. Человек уже пощупал продукт,
   ему нужно увидеть объём, а не прочитать перечисление. */
.buy-includes .hint{margin-top:0}
.buy-group{margin:22px 0 10px;color:var(--brand-dark);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.buy-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.buy-features>div{padding:15px 16px;border:1px solid #dce9e8;border-radius:13px;background:#fff}
.buy-features strong{display:block;margin-bottom:6px;color:#0f766e;font-size:14px}
.buy-features span{display:block;color:#546a78;font-size:13px;line-height:1.45}
.buy-guide{color:var(--brand-dark);font-weight:800;text-decoration:none;border-bottom:1px solid #8eddd2}
.buy-guide:hover{color:#075f58}
@media(max-width:900px){.buy-features{grid-template-columns:1fr}}
