/* ===========================
   Detail (страница вопроса)
   =========================== */

@media (max-width: 991.98px){
  .hero-area.pt-40px { padding-top: 28px !important; }
  .hero-area.pb-40px { padding-bottom: 28px !important; }

  .hero-content .section-title { font-size: 22px; line-height: 1.25; }
  .hero-content .section-title br { display:none; }
  .hero-content p br { display:none; }

  .question-area.pt-40px { padding-top: 24px !important; }
  .question-area.pb-40px { padding-bottom: 24px !important; }

  /* мета и теги не должны разъезжаться */
  .question-highlight .meta > div { padding-right: 12px !important; margin-bottom: 6px; }

  /* футер qa: действия не ломают строку */
  .qa-footer { flex-wrap: wrap; gap: 10px; }
  .qa-footer .qa-right {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 10px;
  }
}

/* контент вопроса/ответа: ничего не вылазит за экран */
.post-content, .answer-body{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* картинки/видео/iframe */
.post-content img, .answer-body img{
  max-width: 100% !important;
  height: auto !important;
}
.post-content iframe, .answer-body iframe,
.post-content video, .answer-body video{
  max-width: 100% !important;
}

/* таблицы из TinyMCE — частый убийца адаптива */
.post-content table, .answer-body table{
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.post-content table td, .answer-body table td,
.post-content table th, .answer-body table th{
  white-space: nowrap; /* чтобы таблица прокручивалась, а не ломала верстку */
}

/* если есть pre/code — прокрутка, а не вылаз */
.post-content pre, .answer-body pre{
  max-width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* аккуратнее со списками/цитатами на мобиле (иногда дают лишний горизонтальный скролл) */
.post-content ul, .answer-body ul,
.post-content ol, .answer-body ol{
  padding-left: 1.2rem;
}
.post-content blockquote, .answer-body blockquote{
  margin-left: 0;
  margin-right: 0;
}



/* ====== IMG: по центру + по бокам blur на всю ширину ====== */

.post-content .qa-img-blur,
.answer-body .qa-img-blur,
.question-post-body .qa-img-blur{
  position:relative;
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  overflow:hidden;
  border-radius:12px;
  margin:10px 0;
  line-height:0;
}

.post-content .qa-img-blur::before,
.answer-body .qa-img-blur::before,
.question-post-body .qa-img-blur::before{
  content:"";
  position:absolute;
  inset:-24px;
  background-image: var(--qa-bg);
  background-size:cover;
  background-position:center;
  filter: blur(18px);
  transform: scale(1.15);
  opacity:.95;
}

.post-content .qa-img-blur > img,
.answer-body .qa-img-blur > img,
.question-post-body .qa-img-blur > img{
  position:relative;
  z-index:1;
  width:auto !important;
  max-width:min(100%, 460px) !important;
  height:auto !important;
  max-height:320px !important;
  display:block !important;
  margin:0 !important;
  border-radius:12px;
}
