/* ============================================================
   Статья блога The Idol — слой поверх info.css (грузится только
   на is_singular('post'), см. inc_auto/theme/enqueue-info.php).
   Источник: design-source/project/blog-statya.html <style>,
   токены — переменные .info-scope (info.css). Скоуп .info-scope.
   Контент — стандартные Гутенберг-блоки: p/h2/h3/ul/ol/quote/image
   стилизуются селекторами .article-body без кастомных блоков.
   ============================================================ */

/* ---------- Reading progress ---------- */
.info-scope .progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--accent);z-index:100;transition:width .12s linear}

/* ---------- Article head ---------- */
.info-scope .article-head{max-width:760px;margin:0 auto;padding:18px 0 0}
.info-scope .article-head .post__meta{font-size:12px}
.info-scope .article-head .post__cat{color:var(--gold-ink)}
.info-scope .article-title{font-family:var(--f-display);font-weight:500;font-size:clamp(34px,5.2vw,58px);line-height:1.05;letter-spacing:.004em;color:var(--ink-strong);margin:20px 0 0;text-wrap:balance;text-transform:none}
.info-scope .article-dek{font-size:clamp(19px,2.2vw,22px);line-height:1.55;color:var(--muted);margin:24px 0 0;max-width:62ch;text-wrap:pretty}

/* ---------- Byline ---------- */
.info-scope .byline{display:flex;align-items:center;gap:16px;margin:34px 0 0;padding:22px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.info-scope .byline__ava{width:50px;height:50px;border-radius:50%;flex:none}
.info-scope .byline__who{display:flex;flex-direction:column;gap:3px}
.info-scope .byline__name{font-family:var(--f-display);font-weight:700;font-size:15px;color:var(--ink)}
.info-scope .byline__role{font-size:13px;color:var(--muted)}
.info-scope .byline__share{margin-left:auto;display:flex;align-items:center;gap:10px}
.info-scope .byline__share .lbl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-soft);font-family:var(--f-display);font-weight:600}
.info-scope .byline__share a{width:40px;height:40px;border:1px solid var(--line);display:grid;place-items:center;border-radius:50%;color:var(--ink);transition:.2s}
.info-scope .byline__share a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.info-scope .byline__share svg{width:17px;height:17px}

/* ---------- Cover ---------- */
.info-scope .article-cover{margin:38px 0 6px}
.info-scope .article-cover img{width:100%;height:auto}
.info-scope .article-cover .ph{aspect-ratio:16/8}
.info-scope figcaption{font-size:13px;color:var(--muted-soft);margin-top:12px;font-family:var(--f-display);letter-spacing:.01em;line-height:1.4}

/* ---------- Layout: body + sticky TOC ---------- */
.info-scope .article-grid{display:grid;grid-template-columns:minmax(0,1fr) 248px;gap:76px;align-items:start;max-width:1120px;margin:46px auto 0}
.info-scope .article-body{max-width:720px}

.info-scope .toc{position:sticky;top:118px}
.info-scope .toc__title{font-family:var(--f-display);font-weight:600;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-soft);margin:0 0 16px}
.info-scope .toc ul{display:flex;flex-direction:column;margin:0;padding:0;list-style:none;--ul-pd:0;--ul-gap:0;--li-pd-l:0;--li-display:block;--li-custom-marker-display:none}
.info-scope .toc li{padding:0}
.info-scope .toc a{display:block;padding:8px 0 8px 18px;border-left:2px solid var(--line-soft);color:var(--muted);font-size:14px;line-height:1.4;transition:.2s;text-decoration:none}
.info-scope .toc a:hover{color:var(--ink)}
.info-scope .toc a.is-active{color:var(--ink-strong);border-color:var(--accent);font-weight:600}

/* ---------- Prose (стандартные Гутенберг-блоки) ---------- */
.info-scope .article-body p{font-size:19px;line-height:1.78;color:#363636;margin:0 0 1.25em}
.info-scope .article-body p:last-child{margin-bottom:0}
.info-scope .article-body strong{color:var(--ink-strong);font-weight:600}
.info-scope .article-body p a,.info-scope .article-body li a,.info-scope .article-body a.lnk{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.info-scope .article-body p a:hover,.info-scope .article-body li a:hover,.info-scope .article-body a.lnk:hover{color:var(--ink-strong)}
.info-scope .article-body h2{font-family:var(--f-display);font-weight:700;font-size:clamp(25px,3vw,30px);line-height:1.18;letter-spacing:.004em;color:var(--ink-strong);margin:58px 0 16px;scroll-margin-top:118px;text-wrap:balance;text-transform:none}
.info-scope .article-body h2 .num{color:var(--gold-ink);font-weight:600;font-size:.62em;letter-spacing:.16em;display:block;margin-bottom:10px}
.info-scope .article-body h3{font-family:var(--f-display);font-weight:700;font-size:20px;line-height:1.3;margin:38px 0 12px;color:var(--ink);text-transform:none}
.info-scope .article-body .lead-in{font-size:21px!important;line-height:1.65!important;color:var(--ink)!important}

/* ---------- Lists (Гутенберг ul/ol; маркеры темы отключены через переменные) ---------- */
.info-scope .article-body ul,.info-scope .article-body ol,.info-scope .art-list{margin:6px 0 1.5em;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px;--ul-pd:0;--ul-gap:0;--li-pd-l:0;--li-display:block;--li-custom-marker-display:none}
.info-scope .article-body li,.info-scope .art-list li{position:relative;padding-left:34px;font-size:18px;line-height:1.6;color:#363636}
.info-scope .article-body ul li::before,.info-scope .art-list li::before{content:"";position:absolute;left:2px;top:11px;width:9px;height:9px;background:var(--ink);transform:rotate(45deg);display:block;border-radius:0}
.info-scope .article-body ol{counter-reset:art}
.info-scope .article-body ol>li{counter-increment:art}
.info-scope .article-body ol>li::before{content:counter(art,decimal-leading-zero);position:absolute;left:0;top:2px;width:auto;height:auto;background:none;transform:none;display:block;border-radius:0;font-family:var(--f-display);font-weight:600;font-size:14px;letter-spacing:.1em;color:var(--gold-ink)}
.info-scope .article-body li strong{color:var(--ink-strong)}

/* ---------- Numbered capsule (ol с классом capsule) ----------
   Контент li — нативный rich-text Гутенберга (<strong>заголовок</strong><br>описание):
   номер — абсолютный counter слева, контент — обычный поток с отступом. */
.info-scope .article-body ol.capsule,.info-scope .capsule{margin:10px 0 8px;border-top:1px solid var(--line);gap:0}
.info-scope .capsule__item{display:grid;grid-template-columns:56px 1fr;gap:20px;align-items:baseline}
.info-scope .article-body ol.capsule>li,.info-scope .capsule__item{padding:22px 4px;border-bottom:1px solid var(--line-soft)}
.info-scope .article-body ol.capsule>li{padding-left:56px;font-size:16px;line-height:1.55;color:var(--muted)}
.info-scope .article-body ol.capsule>li::before{left:2px;top:26px}
.info-scope .article-body ol.capsule>li>strong{display:block;font-family:var(--f-display);font-weight:700;font-size:19px;line-height:1.3;color:var(--ink-strong);margin:0 0 5px}
.info-scope .article-body ol.capsule>li>br{display:none}
.info-scope .capsule__n{font-family:var(--f-display);font-weight:600;font-size:14px;letter-spacing:.1em;color:var(--gold-ink);padding-top:4px}
.info-scope .capsule__t{font-family:var(--f-display);font-weight:700;font-size:19px;color:var(--ink-strong);margin:0 0 5px}
.info-scope .capsule__d{font-size:16px;line-height:1.55;color:var(--muted);margin:0}

/* ---------- Pull quote (стандартный Гутенберг-quote) ---------- */
.info-scope .article-body blockquote,.info-scope .pullquote{margin:50px 0;padding:6px 0 6px 34px;border-left:2px solid var(--ink);background:none}
.info-scope .article-body blockquote p,.info-scope .pullquote p{font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:clamp(24px,3.2vw,30px);line-height:1.34;color:var(--ink-strong);margin:0}
.info-scope .article-body blockquote cite,.info-scope .pullquote .cite{display:block;margin-top:16px;font-family:var(--f-display);font-style:normal;font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-soft)}

/* ---------- Figure (Гутенберг image) ---------- */
.info-scope .article-body figure,.info-scope .fig{margin:42px 0}
.info-scope .article-body figure img{width:100%;height:auto}
.info-scope .fig .ph{aspect-ratio:3/2}
.info-scope .fig--wide{width:min(1120px,calc(100% + 248px + 76px))}
@media(max-width:1080px){.info-scope .fig--wide{width:100%}}

/* ---------- Key takeaways (врезка, класс на group/list) ---------- */
.info-scope .takeaways{border:1px solid var(--line);background:var(--surface);padding:34px 38px;margin:48px 0}
.info-scope .takeaways__h{display:flex;align-items:center;gap:12px;font-family:var(--f-display);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-strong);margin:0 0 22px}
.info-scope .takeaways__h svg{width:22px;height:22px;color:var(--gold-ink)}
.info-scope .article-body .takeaways ul,.info-scope .takeaways ul{display:flex;flex-direction:column;gap:14px;margin:0}
.info-scope .takeaways li{display:flex;gap:14px;font-size:16px;line-height:1.5;color:var(--ink);padding-left:0}
.info-scope .article-body .takeaways ul li::before,.info-scope .takeaways li::before{display:none}
.info-scope .takeaways .mk{flex:none;width:20px;height:20px;color:var(--gold-ink);margin-top:1px}

/* ---------- Из каталога The Idol (живая секция, single-post.php) ----------
   Статичные shop-карточки заменены живой секцией: карточки и карусель —
   стили/JS темы (preview-product, embla). Здесь только отступы и фиксы скоупа. */
.info-scope .from-catalog{padding-bottom:0}
.info-scope .from-catalog .section-head{margin-bottom:8px}
.info-scope .from-catalog .section-head .eyebrow{color:var(--gold-ink)}
.info-scope .from-catalog__row{margin-top:44px}
.info-scope .from-catalog__row + .from-catalog__row{margin-top:104px} /* запас под стрелки над рядом */
.info-scope .from-catalog__label{display:block;margin-bottom:24px;color:var(--muted-soft)}
/* стрелки темы позиционируются от верха слайдера (-140px рассчитан под
   section-title блока bestsellers) — здесь над рядом только мелкий label,
   поднимаем так, чтобы кнопки (~64px) не наезжали на карточки */
.info-scope .from-catalog .slider{--embla-controls-inset:-92px auto auto auto}
/* меньше 4 товаров — сетка вместо карусели */
.info-scope .from-catalog__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
/* info.css стилизует .btn под инфо-страницы — внутри карточки товара
   возвращаем кнопке вид темы (переменные темы, как в собранном CSS) */
.info-scope .preview-product .btn{display:flex;gap:var(--btn-gap,16px);height:auto;min-height:var(--btn-height,57px);padding:0 var(--btn-horizontal-pd,32px);border:var(--btn-border,1px solid var(--color-gray-stroke));color:var(--btn-text-color,var(--color-black));font-family:var(--font,inherit);font-weight:var(--btn-font-weight,500);font-size:var(--btn-font-size,18px);letter-spacing:normal;text-transform:var(--btn-transform,none)}

/* ---------- Tags + author ---------- */
.info-scope .tagrow{display:flex;flex-wrap:wrap;gap:10px;margin:52px 0 0;padding-top:30px;border-top:1px solid var(--line-soft)}
.info-scope .tag{font-family:var(--f-display);font-size:12px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;padding:8px 15px;border:1px solid var(--line);color:var(--muted);transition:.2s;text-decoration:none}
.info-scope .tag:hover{border-color:var(--ink);color:var(--ink)}
.info-scope .author-card{display:flex;gap:26px;align-items:flex-start;border:1px solid var(--line);padding:32px 34px;margin-top:30px}
.info-scope .author-card .ava{width:72px;height:72px;border-radius:50%;flex:none}
.info-scope .author-card__name{font-family:var(--f-display);font-weight:700;font-size:18px;color:var(--ink-strong);margin:0}
.info-scope .author-card__role{font-size:13px;color:var(--gold-ink);font-family:var(--f-display);font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin:6px 0 12px}
.info-scope .author-card__bio{font-size:15px;line-height:1.6;color:var(--muted);margin:0}

.info-scope .avatar-ph{background:repeating-linear-gradient(135deg,#efece4 0 8px,#e6e2d8 8px 16px)}

/* ---------- Responsive ---------- */
@media(max-width:1080px){
  .info-scope .article-grid{grid-template-columns:1fr;gap:0;max-width:760px}
  .info-scope .toc{display:none}
}
@media(max-width:760px){
  .info-scope .from-catalog__grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .info-scope .article-body p,.info-scope .article-body li,.info-scope .art-list li{font-size:17px}
  .info-scope .capsule__item{grid-template-columns:42px 1fr;gap:14px}
  .info-scope .article-body ol.capsule>li{padding-left:42px}
  .info-scope .author-card{flex-direction:column;gap:18px}
  .info-scope .takeaways{padding:26px 22px}
  .info-scope .byline{flex-wrap:wrap}
  .info-scope .byline__share{margin-left:0;width:100%}
}