/* Start:/bitrix/templates/eshop_bootstrap_v4/components/bitrix/news.detail/bootstrap_v4/style.css?178152721933941*/
/* ============================================================
   Редизайн СТАТЬИ блога invprom.ru — заскоуплено под .rd-blog
   Источник дизайна: work/mockup/invprom-blog-article-auto.html
   НЕТ глобальных *{} и body{}. :root → .rd-blog{--...}.
   Прозу внутри .single-text-blog стилизуем через .rd-blog .single-text-blog *
   (DETAIL_TEXT из БД выводится дословно — его HTML не меняем, только оформляем).
   ============================================================ */

.rd-blog{
  --rdb-blue:#1B43B5;--rdb-blue2:#2C5BE0;--rdb-blueDk:#14328A;
  --rdb-ink:#11151a;--rdb-steel:#56606c;--rdb-soft:#EEF2FD;--rdb-softbd:#D6E0F7;--rdb-line:#e9edf2;
  color:var(--rdb-ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
.rd-blog *{box-sizing:border-box}
.rd-blog a{color:inherit;text-decoration:none}
.rd-blog .rdb-wrap{max-width:1240px;margin:0 auto;padding:0 40px}
.rd-blog .rdb-grad{background:linear-gradient(135deg,var(--rdb-blue2),var(--rdb-blue) 55%,var(--rdb-blueDk))}

/* progress bar */
.rd-blog .rdb-prog{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--rdb-blue2),var(--rdb-blue));z-index:40;transition:width .1s}

/* breadcrumb wrap spacing */
.rd-blog .rdb-crumbs{padding:16px 0 0}
.rd-blog .rdb-crumbnav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--rdb-steel)}
.rd-blog .rdb-crumbnav a{color:var(--rdb-steel)}
.rd-blog .rdb-crumbnav a:hover{color:var(--rdb-blue)}
.rd-blog .rdb-crumbnav .sep{color:#c3ccda}
.rd-blog .rdb-crumbnav b{color:var(--rdb-ink);font-weight:600}

/* article hero */
.rd-blog .rdb-ahero{position:relative;overflow:hidden;background:radial-gradient(120% 130% at 85% 0%,#16233f,#0d1426 60%,#0a1020);color:#fff}
.rd-blog .rdb-ahero.has-photo{background-size:cover;background-position:center}
.rd-blog .rdb-ahero .rdb-wrap{padding:46px 40px 44px;position:relative;z-index:1;max-width:980px;margin:0 auto}
.rd-blog .rdb-ahero .rdb-glow{position:absolute;z-index:0;right:-120px;top:-120px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(44,91,224,.45),transparent 68%);pointer-events:none}
.rd-blog .rdb-acat{display:inline-flex;align-items:center;gap:8px;font:800 12px 'Inter',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#9fc0ff;background:rgba(110,150,230,.16);border:1px solid rgba(140,175,255,.30);border-radius:999px;padding:7px 13px;margin-bottom:18px}
.rd-blog .rdb-acat svg{width:15px;height:15px}
.rd-blog .rdb-ahero h1{font:800 39px 'Manrope','Inter',sans-serif;letter-spacing:-.025em;line-height:1.12;margin:0 0 18px;color:#fff}
.rd-blog .rdb-ameta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:14px;color:#aeb9d0;font-weight:600}
.rd-blog .rdb-ameta .av{display:flex;align-items:center;gap:10px}
.rd-blog .rdb-ameta .av .pp{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#3a63d8,#1b3a8f);display:flex;align-items:center;justify-content:center;font:800 14px 'Manrope','Inter',sans-serif;color:#fff;overflow:hidden;flex:none}
.rd-blog .rdb-ameta .av .pp img{width:100%;height:100%;object-fit:cover;display:block}
.rd-blog .rdb-ameta .av b{color:#fff;font-weight:700}
.rd-blog .rdb-ameta .dot{width:4px;height:4px;border-radius:50%;background:#4a5675}

/* layout */
.rd-blog .rdb-layout{display:grid;grid-template-columns:minmax(0,1fr) 312px;gap:48px;align-items:start;padding:48px 0;max-width:1240px;margin:0 auto}
.rd-blog .rdb-article{min-width:0}

/* ---- прозовая стилизация DETAIL_TEXT (контент из БД, HTML не меняем) ---- */
.rd-blog .single-text-blog{font-size:16px;line-height:1.72;color:#33404d}
.rd-blog .single-text-blog h2{font:800 26px 'Manrope','Inter',sans-serif;letter-spacing:-.02em;line-height:1.2;margin:38px 0 14px;color:var(--rdb-blue);scroll-margin-top:90px}
/* буквица (drop cap) у первого вводного абзаца */
.rd-blog .single-text-blog>p:first-of-type::first-letter{font:800 3.1em/.82 'Manrope','Inter',sans-serif;float:left;margin:.05em .09em 0 0;color:var(--rdb-blue)}
.rd-blog .single-text-blog h3{font:800 19px 'Manrope','Inter',sans-serif;letter-spacing:-.01em;margin:26px 0 10px;color:var(--rdb-ink);scroll-margin-top:90px}
.rd-blog .single-text-blog p{font-size:16px;line-height:1.72;color:#33404d;margin:0 0 14px}
.rd-blog .single-text-blog p b,.rd-blog .single-text-blog p strong,.rd-blog .single-text-blog li b,.rd-blog .single-text-blog li strong{color:var(--rdb-ink)}
.rd-blog .single-text-blog a{color:var(--rdb-blue);font-weight:600;border-bottom:1px solid rgba(27,67,181,.25);transition:.2s}
.rd-blog .single-text-blog a:hover{border-bottom-color:var(--rdb-blue)}
.rd-blog .single-text-blog ul,.rd-blog .single-text-blog ol{margin:0 0 16px 2px;padding-left:20px}
.rd-blog .single-text-blog li{font-size:16px;line-height:1.66;color:#33404d;margin-bottom:8px}

/* таблицы: JS оборачивает <table> в .rdb-tbl-wrap; стилизуем и обёртку, и таблицу */
.rd-blog .single-text-blog .rdb-tbl-wrap{overflow-x:auto;margin:20px 0 24px;border:1px solid var(--rdb-line);border-radius:16px;-webkit-overflow-scrolling:touch}
.rd-blog .single-text-blog table{border-collapse:collapse;width:100%;font-size:14px;min-width:560px}
.rd-blog .single-text-blog caption{caption-side:top;text-align:left;font:800 13px 'Inter',sans-serif;color:var(--rdb-steel);padding:14px 18px 0}
.rd-blog .single-text-blog thead th{background:#0e1320;color:#fff;font:700 13px 'Inter',sans-serif;text-align:left;padding:12px 14px;white-space:nowrap}
.rd-blog .single-text-blog tbody td,.rd-blog .single-text-blog td{padding:11px 14px;border-top:1px solid var(--rdb-line);color:#33404d;line-height:1.45;vertical-align:top}
.rd-blog .single-text-blog tbody td:first-child{font-weight:700;color:var(--rdb-ink)}
.rd-blog .single-text-blog tbody tr:nth-child(even){background:#fafbfe}
.rd-blog .single-text-blog tbody tr:hover{background:var(--rdb-soft)}

/* blockquote */
.rd-blog .single-text-blog blockquote{margin:24px 0;padding:20px 24px;background:#f4f7ff;border-left:4px solid var(--rdb-blue);border-radius:0 14px 14px 0;font-style:italic;color:#2c3744}
.rd-blog .single-text-blog blockquote p{font-size:16px;line-height:1.65;margin-bottom:10px}
.rd-blog .single-text-blog blockquote div{font-style:normal;color:var(--rdb-blue);font-weight:700}

/* figure / inline svg */
.rd-blog .single-text-blog figure{margin:24px 0}
.rd-blog .single-text-blog figure svg{width:100%;height:auto;border:1px solid var(--rdb-line);border-radius:14px}
.rd-blog .single-text-blog figcaption{font-size:13px;color:#8a93a0;margin-top:8px;font-style:italic;line-height:1.5}

/* легаси-блоки внутри DETAIL_TEXT, скрытые JS-ом (Содержание/Автор) — на случай если JS не отработал, оставляем как есть */
.rd-blog .single-text-blog .rdb-legacy-hidden{display:none}

/* sidebar */
.rd-blog .rdb-side{position:sticky;top:24px;display:flex;flex-direction:column;gap:20px}
.rd-blog .rdb-toc{border:1px solid var(--rdb-line);border-radius:16px;padding:20px 22px}
.rd-blog .rdb-toc .h{font:800 13px 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--rdb-steel);margin-bottom:14px}
.rd-blog .rdb-toc a{display:block;font-size:14px;line-height:1.4;color:#3a424c;padding:7px 0 7px 14px;border-left:2px solid var(--rdb-line);transition:.2s}
.rd-blog .rdb-toc a:hover{color:var(--rdb-blue);border-left-color:var(--rdb-blue)}
.rd-blog .rdb-toc a.on{color:var(--rdb-blue);border-left-color:var(--rdb-blue);font-weight:700}
.rd-blog .rdb-sidecta{border-radius:18px;padding:24px 22px;color:#fff;position:relative;overflow:hidden}
.rd-blog .rdb-sidecta .rdb-glow{position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 70%)}
.rd-blog .rdb-sidecta b{font:800 18px 'Manrope','Inter',sans-serif;display:block;margin-bottom:8px;position:relative}
.rd-blog .rdb-sidecta p{font-size:13.5px;line-height:1.55;color:#dbe6ff;margin-bottom:16px;position:relative}
.rd-blog .rdb-sidecta .b1{display:flex;align-items:center;justify-content:center;gap:9px;background:#fff;color:var(--rdb-blue);font-weight:700;font-size:14.5px;padding:12px;border-radius:11px;position:relative;margin-bottom:10px}
.rd-blog .rdb-sidecta .b1 svg{width:17px;height:17px}
.rd-blog .rdb-sidecta .b2{display:block;text-align:center;font:800 19px 'Manrope','Inter',sans-serif;color:#fff;position:relative}
.rd-blog .rdb-sidecta .b2sub{display:block;text-align:center;font-size:12px;color:#bcccec;margin-top:2px;position:relative}

/* author box (единый из шаблона) */
.rd-blog .rdb-author{display:flex;gap:18px;align-items:flex-start;border:1px solid var(--rdb-line);border-radius:18px;padding:24px 26px;margin-top:34px;background:#fbfcfe}
.rd-blog .rdb-author .pic{width:64px;height:64px;flex:none;border-radius:50%;background:linear-gradient(135deg,#3a63d8,#1b3a8f);display:flex;align-items:center;justify-content:center;font:800 18px 'Manrope','Inter',sans-serif;color:#fff;text-align:center;overflow:hidden}
.rd-blog .rdb-author .pic img{width:100%;height:100%;object-fit:cover;display:block}
.rd-blog .rdb-author .nm{font:800 17px 'Manrope','Inter',sans-serif;margin-bottom:2px}
.rd-blog .rdb-author .ro{font-size:13.5px;color:var(--rdb-blue);font-weight:700;margin-bottom:8px}
.rd-blog .rdb-author p{font-size:14.5px;line-height:1.6;color:var(--rdb-steel);margin:0}
.rd-blog .rdb-author .addr{user-select:all;-webkit-user-select:all;color:var(--rdb-blue);font-weight:700;cursor:text}

/* CTA band */
.rd-blog .rdb-ctaband{position:relative;overflow:hidden;border-radius:24px;color:#fff;padding:42px 44px;display:flex;align-items:center;gap:30px;flex-wrap:wrap;margin-top:34px}
.rd-blog .rdb-ctaband .rdb-glow{position:absolute;z-index:0;left:-100px;bottom:-140px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 70%)}
.rd-blog .rdb-ctaband .ct{position:relative;z-index:1}
.rd-blog .rdb-ctaband h2{font:800 26px 'Manrope','Inter',sans-serif;letter-spacing:-.02em;margin:0 0 8px;color:#fff}
.rd-blog .rdb-ctaband p{font-size:15.5px;color:#dbe6ff;max-width:520px;line-height:1.55;margin:0}
.rd-blog .rdb-ctaband .acts{position:relative;z-index:1;margin-left:auto;display:flex;gap:12px;flex-wrap:wrap}
.rd-blog .rdb-cbtn{display:inline-flex;align-items:center;gap:10px;padding:15px 24px;border-radius:13px;font-weight:700;font-size:15.5px;white-space:nowrap;transition:transform .2s,filter .2s}
.rd-blog .rdb-cbtn svg{width:18px;height:18px}
.rd-blog .rdb-cbtn.wht{background:#fff;color:var(--rdb-blue);box-shadow:0 12px 30px rgba(0,0,0,.18)}
.rd-blog .rdb-cbtn.ghost{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.4)}
.rd-blog .rdb-cbtn.wht:hover{transform:translateY(-2px);filter:brightness(1.05)}
.rd-blog .rdb-cbtn.ghost:hover{background:rgba(255,255,255,.2)}
.rd-blog .rdb-cbtn.wht{position:relative;overflow:hidden;isolation:isolate}
.rd-blog .rdb-cbtn.wht::after{content:"";position:absolute;top:0;left:-130%;width:60%;height:100%;z-index:1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);transition:left .6s cubic-bezier(.16,1,.3,1);pointer-events:none}
.rd-blog .rdb-cbtn.wht:hover::after{left:130%}
.rd-blog .rdb-cbtn.wht>*{position:relative;z-index:2}

@media(max-width:980px){
  .rd-blog .rdb-layout{grid-template-columns:1fr;gap:0;padding:32px 0}
  .rd-blog .rdb-side{position:static;display:none}
}
@media(max-width:760px){
  .rd-blog .rdb-wrap{padding:0 18px}
  .rd-blog .rdb-ahero .rdb-wrap{padding:36px 18px 34px}
  .rd-blog .rdb-ahero h1{font-size:27px}
  .rd-blog .single-text-blog h2{font-size:22px}
  .rd-blog .rdb-ctaband{flex-direction:column;align-items:flex-start;padding:28px 22px}
  .rd-blog .rdb-ctaband .acts{margin-left:0}
}

/* ============================================================
   АВТОРСКИЕ КОМПОНЕНТЫ внутри DETAIL_TEXT — для «доведения статей до идеала».
   Автор пишет минимум семантического HTML, иконки/галочки/«+» рисует CSS.
   Все классы — только потомки .rd-blog .single-text-blog (вне блога не влияют).
   Документация по разметке: fixes/04_blog_article_authoring_guide.md
   ============================================================ */

/* TL;DR — «Коротко для тех, кто спешит» */
.rd-blog .single-text-blog .tldr{border:1px solid var(--rdb-softbd);border-radius:18px;background:linear-gradient(135deg,#f4f7ff,#eaf0ff 75%);padding:22px 24px;margin:8px 0 28px}
.rd-blog .single-text-blog .tldr .h{display:flex;align-items:center;gap:9px;font:800 15px 'Manrope','Inter',sans-serif;color:var(--rdb-blueDk);margin:0 0 14px}
.rd-blog .single-text-blog .tldr .h::before{content:"";width:20px;height:20px;flex:none;background:var(--rdb-blue);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3a7 7 0 0 1 4 12.7V18H8v-2.3A7 7 0 0 1 12 3z' fill='%23000'/%3E%3Cpath d='M9 21h6' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3a7 7 0 0 1 4 12.7V18H8v-2.3A7 7 0 0 1 12 3z' fill='%23000'/%3E%3Cpath d='M9 21h6' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat}
.rd-blog .single-text-blog .tldr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.rd-blog .single-text-blog .tldr li{position:relative;padding-left:28px;font-size:15px;line-height:1.5;color:#2c3744;margin:0}
.rd-blog .single-text-blog .tldr li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;background:var(--rdb-blue);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 13l4 4L19 7' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 13l4 4L19 7' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.rd-blog .single-text-blog .tldr li b{color:var(--rdb-ink)}

/* Callout — заметка/предупреждение */
.rd-blog .single-text-blog .note{position:relative;border-left:4px solid var(--rdb-blue);background:#f6f8fe;border-radius:0 14px 14px 0;padding:16px 20px 16px 50px;margin:20px 0 24px}
.rd-blog .single-text-blog .note::before{content:"i";position:absolute;left:18px;top:16px;width:22px;height:22px;border-radius:50%;background:var(--rdb-blue);color:#fff;font:800 14px 'Manrope','Inter',sans-serif;display:flex;align-items:center;justify-content:center}
.rd-blog .single-text-blog .note p{margin:0;font-size:15px;line-height:1.6;color:#2c3744}
.rd-blog .single-text-blog .note.warn{border-left-color:#d68a16;background:#fdf7ec}
.rd-blog .single-text-blog .note.warn::before{content:"!";background:#d68a16}

/* FAQ — аккордеон на нативном <details> (раскрытый текст в DOM = индексируется) */
.rd-blog .single-text-blog .faq details{border:1px solid var(--rdb-line);border-radius:14px;margin-bottom:12px;background:#fff;transition:border-color .2s,box-shadow .2s}
.rd-blog .single-text-blog .faq details[open]{border-color:var(--rdb-softbd);box-shadow:0 12px 34px rgba(20,40,80,.08)}
.rd-blog .single-text-blog .faq summary{list-style:none;cursor:pointer;padding:18px 20px;font:800 16px 'Manrope','Inter',sans-serif;color:var(--rdb-ink);display:flex;align-items:center;gap:14px}
.rd-blog .single-text-blog .faq summary::-webkit-details-marker{display:none}
.rd-blog .single-text-blog .faq summary::after{content:"+";margin-left:auto;width:26px;height:26px;flex:none;border-radius:8px;background:var(--rdb-soft);border:1px solid var(--rdb-softbd);display:flex;align-items:center;justify-content:center;color:var(--rdb-blue);font:700 18px/1 'Inter',sans-serif;transition:transform .25s}
.rd-blog .single-text-blog .faq details[open] summary::after{transform:rotate(45deg)}
.rd-blog .single-text-blog .faq .a{padding:0 20px 18px;font-size:15px;line-height:1.7;color:#33404d}
.rd-blog .single-text-blog .faq .a b{color:var(--rdb-ink)}

/* ============================================================
   НОВЫЕ АВТОРСКИЕ КОМПОНЕНТЫ (доп. к TL;DR/note/FAQ) — внутри DETAIL_TEXT.
   Бейджи-семафор, формула, сетка карточек «отрасль → марка».
   Те же --rdb-*, шрифты Manrope/Inter, радиусы 14/16px, брейкпоинт 760.
   Контраст текста бейджей >= WCAG AA 4.5:1 (читатели 40+).
   Документация по разметке: fixes/04_blog_article_authoring_guide.md
   Внедрено 2026-06-15 по ТЗ zadachi_office/TZ_programmistu_CSS_blog_klassy_2026-06-05.md
   ============================================================ */

/* Бейджи-семафор — затемнённый текст на светлом фоне (контраст >= AA) */
.rd-blog .single-text-blog .badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;font:700 13px 'Inter',sans-serif;line-height:1.2;border:1px solid transparent;white-space:nowrap;vertical-align:middle}
.rd-blog .single-text-blog .badge::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.rd-blog .single-text-blog .badge.ok{background:#E7F6EC;color:#0F6D31;border-color:#BFE6CC}
.rd-blog .single-text-blog .badge.warn{background:#FBF1DC;color:#8A5300;border-color:#EEDCAE}
.rd-blog .single-text-blog .badge.no{background:#FBE9EA;color:#B01722;border-color:#F1C9CC}
.rd-blog .single-text-blog .badge.info{background:#E2F4F7;color:#0A5563;border-color:#BFE2E8}

/* Формула — выделенный центрированный блок (фон/бордер/радиус как у .note) */
.rd-blog .single-text-blog .formula{margin:20px 0 24px;padding:18px 24px;background:#f6f8fe;border-left:4px solid var(--rdb-blue);border-radius:0 14px 14px 0;text-align:center;font:700 18px 'Manrope','Inter',sans-serif;letter-spacing:-.01em;color:var(--rdb-ink)}
.rd-blog .single-text-blog .formula .sub{display:block;margin-top:8px;font:600 13px 'Inter',sans-serif;color:var(--rdb-steel);letter-spacing:0}

/* Сетка карточек «отрасль → марка» — 2 кол → 1 при <=760px */
.rd-blog .single-text-blog .cardgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}
.rd-blog .single-text-blog .card{border:1px solid var(--rdb-line);border-radius:16px;overflow:hidden;background:#fff;transition:border-color .2s,box-shadow .2s}
.rd-blog .single-text-blog .card:hover{border-color:var(--rdb-softbd);box-shadow:0 12px 34px rgba(20,40,80,.08)}
.rd-blog .single-text-blog .card .h{padding:12px 16px;font:800 15px 'Manrope','Inter',sans-serif;color:#fff;background:var(--rdb-blue)}
.rd-blog .single-text-blog .card.cyan .h{background:#0E6E7E}
.rd-blog .single-text-blog .card.steel .h{background:var(--rdb-steel)}
.rd-blog .single-text-blog .card.red .h{background:#B01722}
.rd-blog .single-text-blog .card .b{padding:14px 16px;font-size:14px;line-height:1.6;color:#33404d}
.rd-blog .single-text-blog .card .b p{margin:0 0 8px;font-size:14px}
.rd-blog .single-text-blog .card .b p:last-child{margin:0}
.rd-blog .single-text-blog .card .b b{color:var(--rdb-ink)}
@media(max-width:760px){
  .rd-blog .single-text-blog .cardgrid{grid-template-columns:1fr}
}

/* ============================================================
   UX4 — 4 новых компонента статьи блога. Скоуп .rd-blog.
   (1) аватар эксперта в цитате  (2) моб. панель «Содержание»
   (3) связанные из кластера     (4) кнопки шеринга
   Внедрено 2026-06-15.
   ============================================================ */

/* (1) ФОТО ЭКСПЕРТА В ЦИТАТЕ — аватар у строки автора (последний div). */
.rd-blog .single-text-blog blockquote>div:last-child{display:flex;align-items:center;gap:12px}
.rd-blog[style*="--rdb-qpic"] .single-text-blog blockquote>div:last-child::before,
.rd-blog .single-text-blog blockquote.has-pic>div:last-child::before{
  content:"";width:50px;height:50px;flex:none;border-radius:50%;
  background-image:var(--rdb-qpic);background-size:cover;background-position:center;
  box-shadow:0 0 0 3px #fff,0 0 0 4px var(--rdb-softbd)}
@media(max-width:760px){
  .rd-blog[style*="--rdb-qpic"] .single-text-blog blockquote>div:last-child::before,
  .rd-blog .single-text-blog blockquote.has-pic>div:last-child::before{width:44px;height:44px}
}

/* (2) МОБИЛЬНАЯ КНОПКА «СОДЕРЖАНИЕ» + ПАНЕЛЬ (видна только <=980px) */
.rd-blog .rdb-tocfab{display:none}
@media(max-width:980px){
  .rd-blog .rdb-tocfab{display:inline-flex;position:fixed;left:50%;bottom:20px;transform:translateX(-50%);
    z-index:60;align-items:center;gap:9px;padding:13px 20px;border-radius:999px;border:none;cursor:pointer;
    color:#fff;font:700 14.5px 'Manrope','Inter',sans-serif;
    background:linear-gradient(135deg,var(--rdb-blue2),var(--rdb-blue) 60%,var(--rdb-blueDk));
    box-shadow:0 12px 30px rgba(20,40,90,.34)}
  .rd-blog .rdb-tocfab svg{width:18px;height:18px}
}
.rd-blog .rdb-tocov{position:fixed;inset:0;z-index:61;background:rgba(10,16,32,.5);opacity:0;visibility:hidden;transition:opacity .25s}
.rd-blog .rdb-tocov.on{opacity:1;visibility:visible}
.rd-blog .rdb-tocsheet{position:fixed;left:0;right:0;bottom:0;z-index:62;background:#fff;
  border-radius:20px 20px 0 0;padding:8px 18px max(18px,env(safe-area-inset-bottom)) 18px;
  max-height:72vh;overflow:auto;-webkit-overflow-scrolling:touch;
  transform:translateY(100%);transition:transform .3s cubic-bezier(.16,1,.3,1);
  box-shadow:0 -12px 40px rgba(10,16,32,.22)}
.rd-blog .rdb-tocsheet.on{transform:translateY(0)}
.rd-blog .rdb-tocsheet .grip{width:42px;height:4px;border-radius:99px;background:var(--rdb-line);margin:8px auto 14px}
.rd-blog .rdb-tocsheet .h{font:800 13px 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--rdb-steel);margin:0 0 8px}
.rd-blog .rdb-tocsheet a{display:block;font-size:15px;line-height:1.45;color:#3a424c;padding:12px 0 12px 14px;border-left:2px solid var(--rdb-line);transition:.2s}
.rd-blog .rdb-tocsheet a:active,.rd-blog .rdb-tocsheet a:hover{color:var(--rdb-blue);border-left-color:var(--rdb-blue)}

/* (3) СВЯЗАННЫЕ ИЗ КЛАСТЕРА */
.rd-blog .rdb-relwrap{margin-top:44px}
.rd-blog .rdb-relhead{margin:0 0 18px}
.rd-blog .rdb-relhead h2{font:800 24px 'Manrope','Inter',sans-serif;letter-spacing:-.02em;line-height:1.2;margin:0 0 4px;color:var(--rdb-ink)}
.rd-blog .rdb-relhead p{font-size:14.5px;color:var(--rdb-steel);margin:0}
.rd-blog .rdb-related{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.rd-blog .rdb-rcard{display:block;border:1px solid var(--rdb-line);border-radius:16px;overflow:hidden;background:#fff;transition:transform .2s,box-shadow .2s,border-color .2s}
.rd-blog .rdb-rcard:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(20,40,80,.10);border-color:var(--rdb-softbd)}
.rd-blog .rdb-rcard .ph{position:relative;aspect-ratio:16/10;background-size:cover;background-position:center}
.rd-blog .rdb-rcard .ph.noimg{display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--rdb-blue2),var(--rdb-blue) 60%,var(--rdb-blueDk))}
.rd-blog .rdb-rcard .ph.noimg svg{width:42px;height:42px;color:rgba(255,255,255,.85)}
.rd-blog .rdb-rcard .bd{padding:14px 16px 16px}
.rd-blog .rdb-rcard .cat{display:inline-block;font:800 11px 'Inter',sans-serif;letter-spacing:.05em;text-transform:uppercase;color:var(--rdb-blue);background:var(--rdb-soft);border:1px solid var(--rdb-softbd);border-radius:999px;padding:4px 10px;margin-bottom:9px}
.rd-blog .rdb-rcard .ti{font:700 15.5px 'Manrope','Inter',sans-serif;line-height:1.3;color:var(--rdb-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rd-blog .rdb-rcard:hover .ti{color:var(--rdb-blue)}
@media(max-width:760px){ .rd-blog .rdb-related{grid-template-columns:repeat(2,1fr);gap:14px} }
@media(max-width:460px){ .rd-blog .rdb-related{grid-template-columns:1fr} }

/* (4) КНОПКИ ШЕРИНГА */
.rd-blog .rdb-share{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:30px 0 4px}
.rd-blog .rdb-share .lbl{font:800 12px 'Inter',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--rdb-steel);margin-right:4px}
.rd-blog .rdb-sbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:40px;padding:0 14px;border-radius:11px;border:1px solid var(--rdb-line);background:#fff;cursor:pointer;
  font:700 13.5px 'Inter',sans-serif;color:var(--rdb-ink);transition:transform .18s,box-shadow .18s,border-color .18s,background .18s}
.rd-blog .rdb-sbtn svg{width:18px;height:18px;flex:none}
.rd-blog .rdb-sbtn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(20,40,80,.10);border-color:var(--rdb-softbd)}
.rd-blog .rdb-sbtn.tg:hover{background:#229ED9;border-color:#229ED9;color:#fff}
.rd-blog .rdb-sbtn.wa:hover{background:#25D366;border-color:#25D366;color:#fff}
.rd-blog .rdb-sbtn.em:hover{background:var(--rdb-blue);border-color:var(--rdb-blue);color:#fff}
.rd-blog .rdb-sbtn.vk:hover{background:#0077FF;border-color:#0077FF;color:#fff}
.rd-blog .rdb-sbtn.copy:hover{background:var(--rdb-ink);border-color:var(--rdb-ink);color:#fff}
.rd-blog .rdb-sbtn.done{background:#1f9d55;border-color:#1f9d55;color:#fff}
.rd-blog .rdb-toast{position:fixed;left:50%;bottom:80px;transform:translateX(-50%) translateY(10px);z-index:70;
  background:var(--rdb-ink);color:#fff;font:700 13.5px 'Inter',sans-serif;padding:11px 18px;border-radius:11px;
  box-shadow:0 12px 30px rgba(10,16,32,.3);opacity:0;visibility:hidden;transition:opacity .22s,transform .22s}
.rd-blog .rdb-toast.on{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
@media(max-width:760px){
  .rd-blog .rdb-share{gap:8px}
  .rd-blog .rdb-sbtn .t{display:none}
  .rd-blog .rdb-sbtn{width:42px;padding:0}
  .rd-blog .rdb-sbtn.copy{width:auto;padding:0 14px}
  .rd-blog .rdb-sbtn.copy .t{display:inline}
}

/* ============================================================
   ИНТЕРАКТИВНЫЕ КАЛЬКУЛЯТОРЫ статьи блога — скоуп .rd-blog.
   (1) калькулятор веса проката  (2) PREN-калькулятор нержавейки
   Монтируются JS-ом в маркеры [data-rdb-calc] внутри DETAIL_TEXT.
   Внедрено 2026-06-15.
   ============================================================ */
.rd-blog .single-text-blog .rdb-calc{border:1px solid var(--rdb-softbd);border-radius:18px;background:linear-gradient(135deg,#f4f7ff,#eef3ff 75%);padding:22px 24px;margin:24px 0 28px}
.rd-blog .single-text-blog .rdb-calc .ch{display:flex;align-items:center;gap:10px;font:800 17px 'Manrope','Inter',sans-serif;color:var(--rdb-blueDk);margin:0 0 16px}
.rd-blog .single-text-blog .rdb-calc .ch svg{width:22px;height:22px;flex:none;color:var(--rdb-blue)}
.rd-blog .single-text-blog .rdb-calc .cgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.rd-blog .single-text-blog .rdb-calc .cfield{display:flex;flex-direction:column;gap:5px;min-width:0}
.rd-blog .single-text-blog .rdb-calc .cfield.full{grid-column:1/-1}
.rd-blog .single-text-blog .rdb-calc label{font:700 12.5px 'Inter',sans-serif;color:var(--rdb-steel)}
.rd-blog .single-text-blog .rdb-calc input,
.rd-blog .single-text-blog .rdb-calc select{width:100%;height:44px;padding:0 13px;border:1px solid var(--rdb-line);border-radius:11px;background:#fff;font:600 15px 'Inter',sans-serif;color:var(--rdb-ink);transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.rd-blog .single-text-blog .rdb-calc select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%2356606c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px;padding-right:38px;cursor:pointer}
.rd-blog .single-text-blog .rdb-calc input:focus,
.rd-blog .single-text-blog .rdb-calc select:focus{outline:none;border-color:var(--rdb-blue);box-shadow:0 0 0 3px rgba(27,67,181,.13)}
.rd-blog .single-text-blog .rdb-calc input.err{border-color:#B01722;box-shadow:0 0 0 3px rgba(176,23,34,.12)}
.rd-blog .single-text-blog .rdb-calc .cgo{margin-top:16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;height:46px;padding:0 26px;border:none;border-radius:12px;cursor:pointer;color:#fff;font:800 15px 'Manrope','Inter',sans-serif;background:linear-gradient(135deg,var(--rdb-blue2),var(--rdb-blue) 60%,var(--rdb-blueDk));box-shadow:0 10px 26px rgba(20,40,90,.26);transition:transform .18s,filter .18s}
.rd-blog .single-text-blog .rdb-calc .cgo:hover{transform:translateY(-2px);filter:brightness(1.05)}
.rd-blog .single-text-blog .rdb-calc .cgo svg{width:18px;height:18px}
.rd-blog .single-text-blog .rdb-calc .cres{margin-top:18px;border-radius:14px;background:#fff;border:1px solid var(--rdb-softbd);overflow:hidden;display:none}
.rd-blog .single-text-blog .rdb-calc .cres.on{display:block}
.rd-blog .single-text-blog .rdb-calc .cres .rrow{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:14px 18px}
.rd-blog .single-text-blog .rdb-calc .cres .rrow+.rrow{border-top:1px solid var(--rdb-line)}
.rd-blog .single-text-blog .rdb-calc .cres .rk{font:700 14px 'Inter',sans-serif;color:var(--rdb-steel)}
.rd-blog .single-text-blog .rdb-calc .cres .rv{font:800 22px 'Manrope','Inter',sans-serif;letter-spacing:-.01em;color:var(--rdb-blue);white-space:nowrap}
.rd-blog .single-text-blog .rdb-calc .cres .rv .u{font-size:14px;color:var(--rdb-steel);font-weight:700;margin-left:3px}
.rd-blog .single-text-blog .rdb-calc .cres .rrow.tot{background:var(--rdb-soft)}
.rd-blog .single-text-blog .rdb-calc .cres .rrow.tot .rv{color:var(--rdb-blueDk);font-size:24px}
.rd-blog .single-text-blog .rdb-calc .cres .rzone{padding:14px 18px;border-top:1px solid var(--rdb-line);font-size:14.5px;line-height:1.5;color:#2c3744}
.rd-blog .single-text-blog .rdb-calc .cres .rzone .badge{margin-bottom:8px}
.rd-blog .single-text-blog .rdb-calc .ccta{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font:700 14px 'Inter',sans-serif;color:var(--rdb-blue);border-bottom:1px solid rgba(27,67,181,.3);padding-bottom:1px}
.rd-blog .single-text-blog .rdb-calc .ccta:hover{border-bottom-color:var(--rdb-blue)}
.rd-blog .single-text-blog .rdb-calc .ccta svg{width:15px;height:15px}
.rd-blog .single-text-blog .rdb-calc .cerr{display:none;margin-top:12px;font:700 13px 'Inter',sans-serif;color:#B01722}
.rd-blog .single-text-blog .rdb-calc .cerr.on{display:block}
.rd-blog .single-text-blog .rdb-calc .cnote{margin:14px 0 0;font:500 12.5px 'Inter',sans-serif;line-height:1.5;color:#8a93a0}
@media(max-width:760px){
  .rd-blog .single-text-blog .rdb-calc{padding:18px 16px}
  .rd-blog .single-text-blog .rdb-calc .cgrid{grid-template-columns:1fr}
  .rd-blog .single-text-blog .rdb-calc .cgo{width:100%}
}

/* ============================================================
   КНОПКА «СКАЧАТЬ PDF» (печать) + глобальный @media print.
   Внедрено 2026-06-15.
   ============================================================ */
.rd-blog .rdb-sbtn.rdb-pdf:hover{background:var(--rdb-blue);border-color:var(--rdb-blue);color:#fff}

@media print{
  header, footer, .rdb-prog, .rdb-tocfab, .rdb-tocov, .rdb-tocsheet,
  .rdb-share, .rdb-relwrap, .rdb-ctaband, .rdb-sidecta, .rdb-toast,
  .rd-blog .rdb-side, .rd-blog .rdb-calc .cgo, .rd-blog .rdb-calc .ccta,
  .rd-blog .single-text-blog .faq summary::after{display:none !important}
  .rd-blog .rdb-ahero{background:none !important;color:#000 !important;overflow:visible}
  .rd-blog .rdb-ahero .rdb-glow{display:none !important}
  .rd-blog .rdb-ahero h1{color:#000 !important}
  .rd-blog .rdb-acat{color:#000 !important;background:none !important;border-color:#999 !important}
  .rd-blog .rdb-ameta{color:#333 !important}
  .rd-blog .rdb-ameta .av b{color:#000 !important}
  .rd-blog .rdb-layout{display:block !important;padding:0 !important}
  .rd-blog .rdb-wrap{max-width:100% !important;padding:0 !important}
  .rd-blog .single-text-blog,.rd-blog .single-text-blog p,
  .rd-blog .single-text-blog li,.rd-blog .single-text-blog td{color:#000 !important}
  .rd-blog .single-text-blog h2{color:#000 !important}
  .rd-blog .single-text-blog .faq details{border-color:#999 !important;box-shadow:none !important}
  .rd-blog .single-text-blog .rdb-tbl-wrap{overflow:visible !important;border-color:#999 !important}
  .rd-blog .single-text-blog thead th{background:#ddd !important;color:#000 !important}
  .rd-blog .single-text-blog .rdb-calc{background:#fff !important;border-color:#999 !important}
  .rd-blog .rdb-author{border-color:#999 !important;background:#fff !important}
}

/* End */
/* /bitrix/templates/eshop_bootstrap_v4/components/bitrix/news.detail/bootstrap_v4/style.css?178152721933941 */