/* RP Ecosystem — responsive safety overrides (fixes.css)
 * Загружается ПОСЛЕ site.css. Только защита от overflow и ограничения шрифтов
 * под реальные viewport'ы. Не меняет дизайн-направление.
 */

/* === Global overflow safety === */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* === Cover title size cap === */
/* site.css задаёт огромный font-size — ограничиваем для нормальных экранов */
.cover .cover-title,
.cover-title {
  font-size: clamp(2.25rem, 6vw, 5rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.03em !important;
  max-width: 100% !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  hyphens: none;
}

@media (max-width: 768px) {
  .cover .cover-title,
  .cover-title { font-size: clamp(1.75rem, 8vw, 3rem) !important; }
}

/* Cover container — never exceed viewport, no padding from --pad-x var */
.cover {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box;
}
.cover .wrap {
  max-width: min(1200px, 100%) !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box;
}
.cover-body, .cover-foot, .cover-meta {
  max-width: 100% !important;
  box-sizing: border-box;
}

/* === Chapter headings cap === */
.chap-open h2,
.chap-open h2 em,
.chap-open h2 .alt {
  font-size: clamp(2rem, 5vw, 3.5rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  max-width: 100% !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  hyphens: none;
}

@media (max-width: 768px) {
  .chap-open h2,
  .chap-open h2 em,
  .chap-open h2 .alt {
    font-size: clamp(1.5rem, 7vw, 2.2rem) !important;
  }
}

/* Chapter open wrap — guarantee mobile side padding so chap-no/h2 не вылезают */
.chap-open { padding-left: 0 !important; padding-right: 0 !important; }
.chap-open .wrap {
  padding-left: 24px !important;
  padding-right: 24px !important;
  max-width: min(1200px, 100%) !important;
  box-sizing: border-box;
}
.chap-open .chap-no,
.chap-open .chap-intro,
.chap-open p {
  max-width: 100% !important;
  overflow-wrap: break-word !important;
}

/* === Pull-quote break === */
.pullquote-break .pq, .pq {
  font-size: clamp(1.8rem, 4.5vw, 3rem) !important;
  line-height: 1.15 !important;
}

/* === Container width safety === */
.wrap {
  max-width: min(1200px, 100% - 32px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
  box-sizing: border-box;
}

/* === Cover meta grid stacks on small viewports === */
@media (max-width: 768px) {
  .cover-meta { display: flex !important; flex-direction: column !important; gap: 8px; }
  .cover-foot { flex-direction: column; gap: 8px; align-items: flex-start !important; }
}

/* === Nav links responsive === */
@media (max-width: 900px) {
  .nav-links { display: none; }
}

/* === Sticky narrative facts: stack on mobile === */
@media (max-width: 980px) {
  .sn-grid { grid-template-columns: 1fr !important; gap: 32px; }
  .sn-left { position: relative !important; top: auto !important; }
}

/* === Group spread: stack on mobile === */
@media (max-width: 900px) {
  .gs-grid { display: flex !important; flex-direction: column !important; gap: 24px; }
  .gs-card { grid-column: auto !important; }
  .gs-flow { grid-column: auto !important; }
}

/* === Ledger: stack on mobile === */
@media (max-width: 900px) {
  .ledger-grid { grid-template-columns: 1fr !important; gap: 24px; }
  .ledger-detail { position: relative !important; top: auto !important; }
}

/* === AI module grid: cap columns on small === */
@media (max-width: 720px) {
  .ai-grid { grid-template-columns: 1fr !important; }
  .pack-row { grid-template-columns: 1fr !important; }
  .h-subs { grid-template-columns: 1fr !important; }
}

/* === TOC rows responsive === */
@media (max-width: 720px) {
  .toc-row {
    display: grid !important;
    grid-template-columns: 40px 1fr !important;
    grid-template-rows: auto auto;
  }
  .toc-row .ts { grid-column: 2; }
  .toc-row .tp { grid-column: 2; }
}

/* === Module book head stacks === */
@media (max-width: 900px) {
  .b-head {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .b-letter, .b-meta, .b-price {
    grid-column: 1;
  }
  /* Chapter 06 head — title + description should stack on mobile */
  .modules-h .head {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  .modules-h .head h2 {
    font-size: clamp(1.6rem, 6vw, 2.4rem) !important;
    line-height: 1.05 !important;
    overflow-wrap: break-word !important;
  }
  .modules-h .head p {
    font-size: 15px !important;
    max-width: 100% !important;
  }
}

/* === Reading progress bar safe z-index === */
#read-progress { z-index: 9999 !important; }

/* === Progress-rail полностью отключён — занимал место и налегал на TOC === */
.progress-rail { display: none !important; }

/* === Images: never overflow === */
img, svg { max-width: 100%; height: auto; }

/* === Marquee — keep its overflow contained === */
.marquee { overflow: hidden; }

/* === Sticky CTA — compact floating button across ALL viewports ===
 * Дефолтный вариант (подпись «Документ · 01/2026 / Единая экосистема Red
 * Petroleum» + кнопка) закрывал контент при чтении. Делаем её FAB-style:
 * только круглая красная кнопка «Встреча →» в правом нижнем углу.
 */
.sticky-cta {
  position: fixed !important;
  bottom: 20px !important;
  right: 20px !important;
  left: auto !important;
  transform: translateY(120%) !important;
  background: transparent !important;
  padding: 0 !important;
  gap: 0 !important;
  border-radius: 999px !important;
  max-width: none !important;
  box-sizing: border-box;
}
.sticky-cta.show { transform: translateY(0) !important; }
.sticky-cta > div:first-child { display: none !important; }
.sticky-cta .btn {
  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
}

@media (max-width: 720px) {
  .sticky-cta { bottom: 14px !important; right: 14px !important; }
}