/* ============================================================================
   zabolevaniya.css — страница «Заболевания / Цистит» Уролесан (Figma 1876:3005, 1920×10153).
   Длинная статья: сплит-hero (фото + product-shot) · тело (statya.css) · таблица · форма.
   Поверх base.css + chrome.css + statya.css (тело) + gde-kupit.css (форма). rem = px/16.
   ============================================================================ */
main{
  background: #FBFBFB;
}
/* H1 «Цистит…» — по истине Figma 82px / lh 90px, ширина текст-бокса 1330px даёт переносы
   как в макете, по центру страницы (раунд 2 Веры: кегль+переносы+центрирование). */
.st__title--long {
  max-width: 83.125rem;
  margin-inline: auto;
  font-size: 5.125rem;
  line-height: 1.098;
} /* 82px / 90px, box 1330px */

/* Скоуп страницы (#cistit) — тело переиспользует .st__body из statya.css, но у Заболеваний
   СВОЙ ритм части элементов (в макете списки — строки текста 33px, не пункты 45px как в Статье;
   крошки — 3 пункта adjacent-парами по 24px). Перекрываем НЕ трогая Статью. */
#cistit .st__body li {
  margin-bottom: 0;
} /* списки Заболеваний = 33px строки (истина), без +12 пункта Статьи */
#cistit .st__crumbs {
  gap: 1.5rem;
} /* 24px: истина крошек Заболеваний (Главная→Заболевания 103) */

/* мета-строка «Заболевания»: только «Поделиться», выровнено влево (раунд 2, шильдик убран) */
.st__meta--share-left {
  justify-content: flex-start;
}

/* сплит-hero: фото слева + product-shot справа */
.zab-hero {
  margin: 2.5rem auto 0;
  max-width: 110rem;
  display: grid;
  grid-template-columns: 1240fr 502fr;
  gap: 1.125rem;
}
.zab-hero__img,
.zab-hero__callout {
  position: relative;
  border-radius: 1.625rem;
  /* overflow: hidden; */
}
.zab-hero__img > img,
.zab-hero__callout > .zab-hero__bg {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.zab-hero__box {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-51%, -49%);
  height: auto;
  width: 36.875rem;
  aspect-ratio: 590/380
  pointer-events: none;
  max-width: unset;
} /* коробка ≈0.67 высоты плашки (381/570, правка Веры С3); ширина по аспекту, overflow плашки клипует края */

/* таблица чувствительности E. coli — стили по макету node 1933:2217 (раунд 2 Веры):
   зелёная шапка с белым текстом, строки-карточки светло-серые со скруглением, без линий-границ. */
.zab-table {
  width: 100%;
  margin: 1rem 0 1.5rem;
  border-collapse: separate;
  border-spacing: 0 0.5rem;
  font-family: var(--wm-font);
  font-size: 1.3125rem;
  color: #333131;
} /* 21px */
.zab-table th,
.zab-table td {
  text-align: left;
  padding: 1.4375rem 2rem;
  vertical-align: top;
  border: 0;
  line-height: 1.24;
}
.zab-table thead th {
  background: #6fba52;
  font-weight: 500;
  color: #fff;
} /* зелёная шапка, белый текст */
.zab-table thead th:first-child {
  border-top-left-radius: 1.25rem;
  border-bottom-left-radius: 1.25rem;
}
.zab-table thead th:last-child {
  border-top-right-radius: 1.25rem;
  border-bottom-right-radius: 1.25rem;
}
.zab-table tbody td {
  background: #f4f4f3;
  font-weight: 500;
} /* строки-карточки светло-серые */
.zab-table tbody td:first-child {
  border-top-left-radius: 1.25rem;
  border-bottom-left-radius: 1.25rem;
}
.zab-table tbody td:last-child {
  border-top-right-radius: 1.25rem;
  border-bottom-right-radius: 1.25rem;
}

/* «Список литературы» — раскрывающийся аккордеон (раунд 2 Веры, образец node 1933:2177):
   заголовок + шеврон справа, две тонкие линии сверху/снизу, тело = нумерованный список 8 источников.
   Нативный <details>/<summary> — без JS. */
.zab-refs {
  display: block;
  margin: 4rem auto 0;
  max-width: 54.5rem;
  border-top: 1px solid rgba(95, 95, 95, 0.15);
  border-bottom: 1px solid rgba(95, 95, 95, 0.15);
}
.zab-refs__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  list-style: none;
  padding: 1.5rem 0;
  font-family: var(--wm-font);
  font-weight: 500;
  font-size: 1.765rem;
  color: var(--wm-ink);
} /* 28px */
.zab-refs__head::-webkit-details-marker {
  display: none;
}
.zab-refs__chev {
  flex: none;
  width: 1rem;
  height: 1rem;
  margin: 0 0.5rem 0.4rem 0.75rem;
  border-right: 0.1875rem solid var(--wm-ink);
  border-bottom: 0.1875rem solid var(--wm-ink);
  transform: rotate(45deg);
  transition: transform 0.2s ease;
} /* шеврон вниз, справа */
.zab-refs[open] .zab-refs__chev {
  transform: rotate(-135deg);
} /* раскрыто → вверх */
.zab-refs__list {
  margin: 0 0 1.75rem;
  padding-left: 1.75rem;
  font-family: var(--wm-font);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.64;
  color: var(--wm-ink);
} /* 20px */
.zab-refs__list li {
  margin-bottom: 0.75rem;
}
.zab-refs__list a {
  color: inherit;
  text-decoration: none;
  word-break: break-word;
}
@media (hover: hover) { .zab-refs__list a:hover { color: var(--wm-brand); } }

/* ============================================================================
   АДАПТИВ — «Заболевания / Цистит» (2001:7484). Тело/мета/форма — из statya.css.
   Здесь: H1-long, сплит-hero в стопку, таблица, аккордеон литературы. rem=px ниже 1280.
   ============================================================================ */
@media (max-width: 1000px) {
  .st__meta--share-left{
    display: none;
  }
  .st__title--long {
    max-width: none;
    font-size: 56px;
    line-height: 1.1;
  }
  .zab-hero {
    max-width: none;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 40px;
  }
  .zab-hero__box {
    width: 60%;
  }
  .zab-table {
    font-size: 17px;
  }
  .zab-table th,
  .zab-table td {
    padding: 16px 20px;
  }
  .zab-refs {
    max-width: none;
  }
  .zab-refs__head {
    font-size: 24px;
  }
  .zab-refs__list {
    font-size: 18px;
  }
}
@media (max-width: 1000px) {
  .st__title--long {
    max-width: none;
    font-size: 34px;
    line-height: 1.1;
  }
  .zab-hero {
    max-width: none;
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 52px;
  }
  .zab-hero__box {
    width: 66%;
  }
  /* таблица: сжать кегль/паддинги, разрешить перенос — чтобы 3 колонки влезли в 328px */
  .zab-table {
    font-size: 13px;
    margin: 8px 0 16px;
    border-spacing: 0 6px;
  }
  .zab-table th,
  .zab-table td {
    padding: 10px 12px;
    word-break: break-word;
  }
  .zab-refs {
    max-width: none;
    margin-top: 32px;
  }
  .zab-refs__head {
    padding: 16px 0;
    font-size: 20px;
  }
  .zab-refs__chev {
    width: 12px;
    height: 12px;
  }
  .zab-refs__list {
    padding-left: 20px;
    font-size: 15px;
    line-height: 1.5;
  }
}
@media (max-width: 450px) {
  .zab-hero__img{
    border-radius: 10px;
    aspect-ratio: 328/328;
    overflow: hidden;
  }
.zab-hero__callout{
    max-height: 248px;
    overflow: hidden;
    border-radius: 10px;
  }
}