/* ============================================================
   design-cases.css — КАРКАС страниц кейсов (/cases/<slug>)
   Порядок: base.css -> design-cases.css -> common.css
   Даёт ту же базу, что и постраничные design-* (тёмный фон, цвет
   текста, флюидный масштаб font-size:1.33vw — от него все em),
   плюс стили футера. Контент кейса верстается классами common.css
   (.section, .main-container, .text header-h1/h2/h3, .main-button, .input).
   ============================================================ */

/* --- База страницы (аналог .root--u-* из design-index): фон/цвет/масштаб --- */
.root--cases {
  background-size: auto;
  background-image: linear-gradient(rgba(23, 8, 31, 1) 0%, rgba(23, 8, 31, 1) 100%);
  background-repeat: no-repeat;
  background-position: left 0px top 0px;
  background-attachment: scroll;
  color: rgba(219, 219, 219, 1);
  display: flex;
  flex-direction: column;
  font-size: 1.33vw;
  min-height: 100vh;
}

/* (ограничение ширины h1/h2 вынесено в common.css — общее для всего сайта) */

/* --- ФУТЕР (извлечён из design-index.css, с адаптивом) --- */
.guarantee__criteria-block,
.footer__menu-col {display: flex; flex-direction: column; align-items: flex-start; row-gap: 0.94em;}
.terms__features,
.system__fact,
.footer__contacts-info {display: flex; flex-direction: column; align-items: flex-start; row-gap: 0.63em;}
.terms__month-list,
.system__card-body-a,
.system__card-body-b,
.footer__contacts,
.footer__cta-col {display: flex; flex-direction: column; align-items: flex-start; row-gap: 1.88em;}
.terms__feature-text,
.system__feature-text-a,
.system__feature-text-b,
.footer__cta-text {width: 100%;}
.pricing__bg,
.footer__bg-left,
.footer__bg-right {position: absolute; bottom: 0px; width: 100%; height: auto;}
.site-footer {margin-top: 4.7em; margin-bottom: 0px;}
.footer__inner {align-items: flex-start; display: flex; flex-direction: column; padding-bottom: 4.7em;}
.footer__columns {display: flex; align-items: flex-start;}
.footer__logo {width: 7.83em; height: 2.19em;}
.footer__socials {display: flex; align-items: flex-start; column-gap: 0.94em;}
.footer__social-icon {width: auto; height: 1.57em;}
.footer__cta {display: flex; align-items: center; column-gap: 1.88em;}
.footer__menus {display: flex; align-items: flex-start; column-gap: 5.64em;}
.footer__menu-list {display: flex; flex-direction: column; align-items: flex-start; row-gap: 0.63em; color: rgba(219, 219, 219, 0.6);}
.footer__nav-column {display: flex; flex-direction: column; align-items: flex-start; width: 50%; row-gap: 2.72em;}
@media (max-width: 479px) {
  .guarantee__criteria-block,
.lead-form__col,
.pain__cards,
.system__roles,
.system__cards,
.footer__contacts {row-gap: 3.63em;}
  .guarantee__note,
.hero__benefits,
.system__card-body-a,
.system__card-col-b,
.footer__menu-col {row-gap: 2.72em;}
  .pricing__content,
.hero__row,
.footer__columns {flex-direction: column; row-gap: 5.45em;}
  .terms__month-list,
.hero__content,
.pain__content,
.system__content,
.footer__inner,
.footer__cta-col {row-gap: 5.45em;}
  .terms__month-item,
.system__fact,
.system__do-a,
.footer__contacts-info,
.footer__menu-list,
.popup-order2__body,
.popup-order__body,
.popup-questions__body {row-gap: 1.82em;}
  .footer__logo {width: 22.7em; height: 6.36em;}
  .footer__socials {column-gap: 2.72em;}
  .footer__social-icon {height: 4.54em;}
  .footer__cta {flex-direction: column; row-gap: 1.82em;}
}

/* --- Фиксы каркаса кейса --- */
/* Логотип футера вписывать целиком (в design-index есть, тут не было → кропился) */
.image__img--s2-iboleqi9a { object-fit: contain; }
/* Прижать футер к низу, когда контента мало (root--cases — flex-column, min-height:100vh) */
.js-site-footer { margin-top: auto; }

/* --- Текстовые страницы (политика, блог) --- */
.legal { max-width: 52em; color: rgba(219, 219, 219, 0.85); font-family: "TildaSans Light"; line-height: 1.6; }
.legal h2 { font-family: "Comfortaa Bold"; color: #fff; font-size: 1.4em; margin: 1.6em 0 0.6em; }
.legal p { margin: 0 0 1em; }
.legal ul { margin: 0 0 1em 1.2em; }
.legal li { margin-bottom: 0.4em; }
.legal a { color: rgba(202, 251, 0, 1); }

/* --- Витрина кейсов /cases: фильтр + сетка карточек --- */
.cases-filter { display: flex; flex-wrap: wrap; gap: 0.6em; margin: 0; }
.cases-chip { padding: 0.5em 1.1em; border: 1px solid rgba(255,255,255,0.25); border-radius: 999px;
  color: rgba(219,219,219,0.85); background: transparent; cursor: pointer; font-family: "TildaSans Medium"; font-size: 0.9em; }
.cases-chip:hover { border-color: rgba(202,251,0,0.6); }
.cases-chip--active { background: rgba(202,251,0,1); color: rgba(23,8,31,1); border-color: rgba(202,251,0,1); }
/* Сетка и сама карточка кейса (.cases-grid/.case-card*) — ОБЩИЕ, в common.css (секция 5) */

/* Хиро на страницах-каркасах (кейсы, блог, политика) — без нижнего отступа */
.root--cases .section-top { margin-bottom: 0; }

/* H1 объединён с контентом (кейсы/блог) — отступ под заголовком */
.root--cases .section-top .main-container { display: flex; flex-direction: column; row-gap: 1.25em; }

/* --- Мобильная адаптация текста страниц-каркасов (аналог @media на главных:
       корень 1.33vw мелкий, поэтому текст масштабируем крупным em) --- */
@media (max-width: 479px) {
  .legal { font-size: 2.9em; }
  .cases-filter { gap: 1.2em; margin-bottom: 3em; }
  .cases-chip { font-size: 2.4em; }
  .root--cases .section-top .main-container { row-gap: 3em; }
}