/*
 * ABDS Builder Kit — оформлення статті блогу, зібраної блоками iDance Builder.
 *
 * Підключається лише на сторінці статті (і в редакторі запису), тому правила не мають
 * окремої мітки сторінки: будь-який рядок статті стає вузькою колонкою для читання.
 *
 * Чим керує редактор:
 *   Заголовок H1                 → назва статті (дату під нею набір ставить сам)
 *   Зображення                   → обкладинка 16:9
 *   Заголовок H2 + Текст         → розділ статті
 *   Банер-CTA, фон «accent»      → вузький банер запису посеред тексту (один рядок і кнопка)
 *   Банер-CTA, фон «soft»/«dark» → великий блок запису наприкінці
 *   FAQ                          → гармошка запитань (розмітку для пошуковиків набір додає сам)
 */

/* ---------- колонка для читання ---------- */
.isb-content > .isb-sec > .isb-row { max-width: calc(780px + 2 * var(--k-gutter)); margin-left: auto; margin-right: auto; }
.isb-content > .isb-sec.isb-pad-compact > .isb-row,
.isb-content > .isb-sec.isb-pad-normal > .isb-row { padding-top: clamp(16px, 2.2vw, 24px); padding-bottom: clamp(16px, 2.2vw, 24px); }
.isb-content > .isb-sec:first-child > .isb-row { padding-top: clamp(18px, 3vw, 34px); }
.isb-content > .isb-sec:last-child > .isb-row { padding-bottom: clamp(28px, 4vw, 48px); }
.isb-content > .isb-sec:not(.isb-bg-img)::before { content: none; }

/* ---------- шапка статті ---------- */
.isb-content h1.isb-heading { margin: 0; max-width: none; font-size: clamp(30px, 3.4vw + 17px, 54px); line-height: 1.08; letter-spacing: -.024em; color: var(--k-text); }
.isb-content .abds-post-meta { margin: 14px 0 0; color: var(--k-gold); text-transform: uppercase; letter-spacing: .14em; font-size: 12px; font-weight: 800; line-height: 1.4; }
.isb-content .isb-el-image { margin-top: clamp(20px, 3vw, 32px); }
.isb-content .isb-el-image:first-child { margin-top: 0; }
.isb-content .isb-el-image + .isb-el-text { margin-top: clamp(22px, 3.4vw, 36px); }
.isb-content .isb-el-heading + .isb-el-text { margin-top: clamp(12px, 1.6vw, 18px); }

/* ---------- текст ---------- */
.isb-content h2.isb-heading { margin: clamp(10px, 1.6vw, 18px) 0 0; max-width: none; font-size: clamp(23px, 1.4vw + 18px, 34px); line-height: 1.15; letter-spacing: -.018em; color: var(--k-text); }
.isb-content h3.isb-heading { margin: 0; font-size: clamp(19px, .8vw + 16px, 25px); line-height: 1.2; color: var(--k-text); }
.isb-content .isb-text { color: #e6d9d1; line-height: 1.7; }
.isb-content .isb-text :is(p, li) { font-size: clamp(17px, .25vw + 16px, 19px); }
.isb-content .isb-text :is(p, ul, ol, h2, h3, h4) { max-width: none; }
.isb-content .isb-text p + p { margin-top: 1.05em; }
.isb-content .isb-text :is(ul, ol) { margin: 1em 0 0; gap: 10px; }
.isb-content .isb-text :is(ul, ol) + p { margin-top: 1.05em; }
.isb-content .isb-text h3 { margin: 1.5em 0 .5em; font-size: clamp(19px, .8vw + 16px, 25px); line-height: 1.2; color: var(--k-text); }
.isb-content .isb-text h4 { margin: 1.3em 0 .4em; color: var(--k-text); }
.isb-content .isb-text > :first-child { margin-top: 0; }
.isb-content .isb-text blockquote { margin: 1.4em 0; padding: clamp(18px, 3vw, 30px); border: 1px solid var(--k-line); border-radius: var(--k-r-sm); background: var(--k-glass-soft); color: var(--k-text); }
.isb-content .isb-text img { max-width: 100%; height: auto; border-radius: var(--k-r-sm); border: 1px solid var(--k-line); }
.isb-content .isb-text table { width: 100%; border-collapse: collapse; margin: 1em 0 0; }
.isb-content .isb-text :is(th, td) { padding: 12px 14px; border-bottom: 1px solid var(--k-line); text-align: left; }

/* ---------- запитання ---------- */
.isb-content .isb-el-heading + .isb-el-faq { margin-top: clamp(14px, 2vw, 22px); }
.isb-content .isb-faq-a { font-size: 16px; }

/* ---------- банер запису посеред статті: фон «accent» ---------- */
.isb-content .isb-banner { text-align: left; }
.isb-content .isb-banner-accent {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px;
  padding: clamp(16px, 2.4vw, 24px) clamp(18px, 2.6vw, 28px);
  border: 1px solid rgba(255, 179, 106, .38); border-radius: var(--k-r);
  background: linear-gradient(135deg, rgba(255, 179, 106, .16), rgba(240, 95, 87, .08));
}
.isb-content .isb-banner-accent .isb-eyebrow { flex: 1 0 100%; }
.isb-content .isb-banner-accent .isb-banner-title { flex: 1 1 240px; margin: 0; font-size: clamp(17px, .4vw + 15.5px, 20px); line-height: 1.35; letter-spacing: 0; font-weight: 700; color: var(--k-text); }
.isb-content .isb-banner-accent .isb-banner-text { flex: 1 0 100%; margin: 0; font-size: 16px; line-height: 1.6; color: var(--k-muted); }
.isb-content .isb-banner-accent .isb-btn { flex: 0 0 auto; min-height: 48px; padding: 11px 24px; }

/* ---------- блок запису наприкінці: фон «soft» або «dark» ---------- */
.isb-content :is(.isb-banner-soft, .isb-banner-dark) {
  display: grid; gap: 14px; justify-items: start; padding: clamp(20px, 3vw, 34px);
  border: 1px solid rgba(255, 179, 106, .38); border-radius: var(--k-r);
  background: linear-gradient(180deg, rgba(255, 179, 106, .14), rgba(255, 255, 255, .05));
}
.isb-content .isb-banner-dark { background: var(--isb-dark-bg); border-color: var(--k-line); }
.isb-content :is(.isb-banner-soft, .isb-banner-dark) .isb-banner-title { margin: 0; font-size: clamp(21px, 1.2vw + 17px, 30px); line-height: 1.15; letter-spacing: -.018em; font-weight: 800; color: var(--k-text); }
.isb-content :is(.isb-banner-soft, .isb-banner-dark) .isb-banner-text { margin: 0; font-size: 16px; line-height: 1.6; color: var(--k-muted); }
.isb-content .isb-banner .isb-btn { background: linear-gradient(135deg, var(--k-gold), var(--k-accent), var(--k-accent-2)); color: #1a0d08; text-decoration: none; }

/* ---------- після статті: попередня / наступна, «Читайте також» ---------- */
.isb-content.abds-post-after { padding: 0 var(--k-gutter) var(--k-sec-y); }
.abds-post-after__in { max-width: 780px; margin: 0 auto; }
.isb-content .abds-post-nav { margin-top: 0; }
.isb-content a.abds-post-nav__item {
  display: grid; gap: 6px; align-content: start; padding: 16px 18px; border: 1px solid var(--k-line); border-radius: var(--k-r-sm);
  background: var(--k-glass-soft); color: var(--k-text); text-decoration: none; transition: border-color .2s ease;
}
.isb-content a.abds-post-nav__item:hover { border-color: rgba(255, 179, 106, .45); }
.isb-content .abds-related__title { color: var(--k-text); }

@media (max-width: 560px) {
  .isb-content .isb-banner-accent .isb-btn { width: 100%; }
}

/* шлях назад — по лівому краю колонки статті */
.abds-crumbs:has(+ #isb-main) { max-width: 820px; }
@media (min-width: 700px) { .abds-crumbs:has(+ #isb-main) { max-width: 836px; } }
@media (min-width: 980px) { .abds-crumbs:has(+ #isb-main) { max-width: 844px; padding-left: 32px; padding-right: 32px; } }