/* Синяя лента: полоса на всю ширину окна вне листов (после кейсов и после цен). Текст 600 Title белым,
   справа «Оставить заявку» (.btn--ribbon) и «Написать в Telegram» (.btn--ribbon-solid). */

.ribbon { margin: 0 0 var(--sheet-gap); background: var(--blue); color: var(--on-blue); }
.ribbon__in {
  max-width: var(--sheet-max);
  margin: 0 auto;
  padding: 22px 24px 22px calc(24px + var(--bind));
  display: flex; flex-wrap: wrap; align-items: center; gap: 18px 24px;
}
.ribbon p { flex: 1 1 420px; font-size: var(--fs-title); font-weight: 600; line-height: 1.3; }
.ribbon .btn:focus-visible { outline-color: var(--on-blue); }

@media (max-width: 1179px) {
  .ribbon__in { padding-left: calc(var(--edge) + var(--bind) + 12px); padding-right: calc(var(--edge) + 12px); }
}
/* текст строкой, под ним кнопки — без неровного переноса кнопок рядом с текстом */
@media (max-width: 1023px) {
  .ribbon p { flex-basis: 100%; }
}
/* узкий лист: кнопки во всю ширину */
@media (max-width: 719px) {
  .ribbon__in { padding: 20px calc(var(--edge) + 6px) 22px calc(var(--edge) + var(--bind)); }
  .ribbon .btn { flex: 1 1 100%; justify-content: center; min-height: 48px; }
}