@charset "UTF-8";
/* line 1, _settings.scss */
:root {
--bg:var(--draft-bg, #ffffff);
--bg-is-light:var(--draft-bg-is-light, true);
--bg-minor-shade:var(--draft-bg-minor-shade, #f7f7f7);
--bg-minor-shade-is-light:var(--draft-bg-minor-shade-is-light, true);
--bg-major-shade:var(--draft-bg-major-shade, #ededed);
--bg-major-shade-is-light:var(--draft-bg-major-shade-is-light, true);
--bg-half-shade:var(--draft-bg-half-shade, #808080);
--bg-half-shade-is-dark:var(--draft-bg-half-shade-is-dark, true);
--color-btn-bg:var(--draft-color-btn-bg, #003c96);
--color-btn-bg-is-dark:var(--draft-color-btn-bg-is-dark, true);
--color-btn-bg-minor-shade:var(--draft-color-btn-bg-minor-shade, #004ab8);
--color-btn-bg-minor-shade-is-dark:var(--draft-color-btn-bg-minor-shade-is-dark, true);
--color-btn-bg-major-shade:var(--draft-color-btn-bg-major-shade, #0058dc);
--color-btn-bg-major-shade-is-dark:var(--draft-color-btn-bg-major-shade-is-dark, true);
--color-btn-bg-half-shade:var(--draft-color-btn-bg-half-shade, #4a92ff);
--color-btn-bg-half-shade-is-dark:var(--draft-color-btn-bg-half-shade-is-dark, true);
--color-accent-text:var(--draft-color-accent-text, #003c96);
--color-accent-text-is-dark:var(--draft-color-accent-text-is-dark, true);
--color-accent-text-minor-shade:var(--draft-color-accent-text-minor-shade, #004ab8);
--color-accent-text-minor-shade-is-dark:var(--draft-color-accent-text-minor-shade-is-dark, true);
--color-accent-text-major-shade:var(--draft-color-accent-text-major-shade, #0058dc);
--color-accent-text-major-shade-is-dark:var(--draft-color-accent-text-major-shade-is-dark, true);
--color-accent-text-half-shade:var(--draft-color-accent-text-half-shade, #4a92ff);
--color-accent-text-half-shade-is-dark:var(--draft-color-accent-text-half-shade-is-dark, true);
--color-text-dark:var(--draft-color-text-dark, #333333);
--color-text-dark-is-dark:var(--draft-color-text-dark-is-dark, true);
--color-text-dark-minor-shade:var(--draft-color-text-dark-minor-shade, #474747);
--color-text-dark-minor-shade-is-dark:var(--draft-color-text-dark-minor-shade-is-dark, true);
--color-text-dark-major-shade:var(--draft-color-text-dark-major-shade, #5c5c5c);
--color-text-dark-major-shade-is-dark:var(--draft-color-text-dark-major-shade-is-dark, true);
--color-text-dark-half-shade:var(--draft-color-text-dark-half-shade, #999999);
--color-text-dark-half-shade-is-dark:var(--draft-color-text-dark-half-shade-is-dark, true);
--color-text-light:var(--draft-color-text-light, #ffffff);
--color-text-light-is-light:var(--draft-color-text-light-is-light, true);
--color-text-light-minor-shade:var(--draft-color-text-light-minor-shade, #f7f7f7);
--color-text-light-minor-shade-is-light:var(--draft-color-text-light-minor-shade-is-light, true);
--color-text-light-major-shade:var(--draft-color-text-light-major-shade, #ededed);
--color-text-light-major-shade-is-light:var(--draft-color-text-light-major-shade-is-light, true);
--color-text-light-half-shade:var(--draft-color-text-light-half-shade, #808080);
--color-text-light-half-shade-is-dark:var(--draft-color-text-light-half-shade-is-dark, true);
--icons_pack:var(--draft-icons_pack, minimal);
--controls-btn-border-radius:var(--draft-controls-btn-border-radius, 6px);
--color-notice-warning:var(--draft-color-notice-warning, #fff3cd);
--color-notice-warning-is-light:var(--draft-color-notice-warning-is-light, true);
--color-notice-warning-minor-shade:var(--draft-color-notice-warning-minor-shade, #fff0be);
--color-notice-warning-minor-shade-is-light:var(--draft-color-notice-warning-minor-shade-is-light, true);
--color-notice-warning-major-shade:var(--draft-color-notice-warning-major-shade, #ffecac);
--color-notice-warning-major-shade-is-light:var(--draft-color-notice-warning-major-shade-is-light, true);
--color-notice-warning-half-shade:var(--draft-color-notice-warning-half-shade, #e6b000);
--color-notice-warning-half-shade-is-dark:var(--draft-color-notice-warning-half-shade-is-dark, true);
--color-notice-success:var(--draft-color-notice-success, #d4edda);
--color-notice-success-is-light:var(--draft-color-notice-success-is-light, true);
--color-notice-success-minor-shade:var(--draft-color-notice-success-minor-shade, #cae9d2);
--color-notice-success-minor-shade-is-light:var(--draft-color-notice-success-minor-shade-is-light, true);
--color-notice-success-major-shade:var(--draft-color-notice-success-major-shade, #bee4c7);
--color-notice-success-major-shade-is-light:var(--draft-color-notice-success-major-shade-is-light, true);
--color-notice-success-half-shade:var(--draft-color-notice-success-half-shade, #429e58);
--color-notice-success-half-shade-is-dark:var(--draft-color-notice-success-half-shade-is-dark, true);
--color-notice-error:var(--draft-color-notice-error, #f8d7da);
--color-notice-error-is-light:var(--draft-color-notice-error-is-light, true);
--color-notice-error-minor-shade:var(--draft-color-notice-error-minor-shade, #f6ccd0);
--color-notice-error-minor-shade-is-light:var(--draft-color-notice-error-minor-shade-is-light, true);
--color-notice-error-major-shade:var(--draft-color-notice-error-major-shade, #f3bcc1);
--color-notice-error-major-shade-is-light:var(--draft-color-notice-error-major-shade-is-light, true);
--color-notice-error-half-shade:var(--draft-color-notice-error-half-shade, #c52330);
--color-notice-error-half-shade-is-dark:var(--draft-color-notice-error-half-shade-is-dark, true);
--color-notice-info:var(--draft-color-notice-info, #cce5ff);
--color-notice-info-is-light:var(--draft-color-notice-info-is-light, true);
--color-notice-info-minor-shade:var(--draft-color-notice-info-minor-shade, #bedeff);
--color-notice-info-minor-shade-is-light:var(--draft-color-notice-info-minor-shade-is-light, true);
--color-notice-info-major-shade:var(--draft-color-notice-info-major-shade, #acd4ff);
--color-notice-info-major-shade-is-light:var(--draft-color-notice-info-major-shade-is-light, true);
--color-notice-info-half-shade:var(--draft-color-notice-info-half-shade, #006fe6);
--color-notice-info-half-shade-is-dark:var(--draft-color-notice-info-half-shade-is-dark, true);
--font-family:var(--draft-font-family, Roboto);
--font-size:var(--draft-font-size, 16px);
--font-family-heading:var(--draft-font-family-heading, 'Fira Sans');
--heading-ratio:var(--draft-heading-ratio, 2);
--heading-weight:var(--draft-heading-weight, 600);
--collection_count:var(--draft-collection_count, 12);
--search_count:var(--draft-search_count, 15);
--blog_size:var(--draft-blog_size, 3);
--product_not_available:var(--draft-product_not_available, shown);
--layout-content-max-width:var(--draft-layout-content-max-width, 1408px);
--delta_sidebar:var(--draft-delta_sidebar, 2);
--sidebar_index_show:var(--draft-sidebar_index_show, false);
--sidebar_index_position:var(--draft-sidebar_index_position, left);
--sidebar_collection_show:var(--draft-sidebar_collection_show, true);
--sidebar_collection_position:var(--draft-sidebar_collection_position, left);
--sidebar_cart_show:var(--draft-sidebar_cart_show, false);
--sidebar_cart_position:var(--draft-sidebar_cart_position, left);
--sidebar_product_show:var(--draft-sidebar_product_show, false);
--sidebar_product_position:var(--draft-sidebar_product_position, left);
--sidebar_blog_show:var(--draft-sidebar_blog_show, false);
--sidebar_blog_position:var(--draft-sidebar_blog_position, left);
--sidebar_article_show:var(--draft-sidebar_article_show, false);
--sidebar_article_position:var(--draft-sidebar_article_position, left);
--sidebar_page_show:var(--draft-sidebar_page_show, false);
--sidebar_page_position:var(--draft-sidebar_page_position, left);
--sidebar_compare_show:var(--draft-sidebar_compare_show, false);
--sidebar_compare_position:var(--draft-sidebar_compare_position, left);
--sidebar_search_show:var(--draft-sidebar_search_show, false);
--sidebar_search_position:var(--draft-sidebar_search_position, left);
--feedback_captcha_enabled:var(--draft-feedback_captcha_enabled, true);
--favorite_enabled:var(--draft-favorite_enabled, false); }
/* line 4, theme.scss */
.outside-widgets .delete-widget-link {
display: none; }
/* line 8, theme.scss */
.outside-widgets .add-widget-link {
display: none; }
/* =========================================================
ARTICLE SYSTEM
Markom 772839
========================================================= */
/* =========================================================
BASE
========================================================= */
/* line 21, theme.scss */
.article {
min-width: 0; }
/* ---------- H1 статьи ---------- */
/* line 28, theme.scss */
.article > .heading,
.article h1.heading {
width: 100%;
max-width: 760px;
margin-left: auto;
margin-right: auto;
font-size: clamp(2.1rem, 3.6vw, 3.2rem);
line-height: 1.08;
font-weight: 400;
letter-spacing: -0.02em; }
/* ---------- Основной текст ---------- */
/* line 45, theme.scss */
.article-content {
width: 100%;
max-width: 720px;
margin-left: auto;
margin-right: auto;
min-width: 0;
font-size: 1.125rem;
line-height: 1.72; }
/* ---------- Абзацы ---------- */
/* line 61, theme.scss */
.article-content p {
margin-top: 0;
margin-bottom: 1.45rem; }
/* ---------- Вводный абзац ---------- */
/* line 69, theme.scss */
.article-content .article-lead {
margin-bottom: 2.5rem;
font-size: 1.25em;
line-height: 1.55; }
/* ---------- H2 ---------- */
/* line 79, theme.scss */
.article-content h2 {
margin-top: 4.75rem;
margin-bottom: 1.5rem;
font-size: clamp(1.85rem, 3vw, 2.25rem);
line-height: 1.15;
font-weight: 500;
letter-spacing: -0.018em;
scroll-margin-top: 120px; }
/* ---------- H3 ---------- */
/* line 94, theme.scss */
.article-content h3 {
margin-top: 3.25rem;
margin-bottom: 1.15rem;
font-size: clamp(1.4rem, 2vw, 1.65rem);
line-height: 1.25;
font-weight: 500;
letter-spacing: -0.01em;
scroll-margin-top: 120px; }
/* ---------- H4 ---------- */
/* line 109, theme.scss */
.article-content h4 {
margin-top: 2.5rem;
margin-bottom: 1rem;
font-size: 1.2rem;
line-height: 1.3;
font-weight: 600; }
/* ---------- Списки ---------- */
/* line 121, theme.scss */
.article-content ul,
.article-content ol {
margin-top: 0;
margin-bottom: 1.5rem;
padding-left: 1.5rem; }
/* line 128, theme.scss */
.article-content li {
margin-bottom: 0.55rem; }
/* ---------- Ссылки ---------- */
/* line 135, theme.scss */
.article-content a {
text-decoration-thickness: 1px;
text-underline-offset: 0.18em; }
/* =========================================================
ARTICLE LAYOUT
========================================================= */
/* line 145, theme.scss */
.article-layout {
width: 100%; }
/* =========================================================
TABLE OF CONTENTS
========================================================= */
/* line 154, theme.scss */
.article-toc {
box-sizing: border-box; }
/* line 158, theme.scss */
.article-toc__list,
.article-toc__sublist {
margin: 0; }
/* line 163, theme.scss */
.article-toc a {
color: inherit;
text-decoration: none; }
/* =========================================================
IMAGES — BASE
========================================================= */
/* line 173, theme.scss */
.article-content img {
display: block;
width: 100%;
max-width: 100%;
height: auto;
margin-top: 2.75rem;
margin-bottom: 2.75rem;
border-radius: var(--img-border-radius, 0); }
/* ---------- Figure ---------- */
/* line 189, theme.scss */
.article-content figure {
margin: 3rem 0; }
/* line 193, theme.scss */
.article-content figure img {
margin: 0; }
/* line 197, theme.scss */
.article-content figcaption {
margin-top: 0.8rem;
font-size: 0.85em;
line-height: 1.45;
opacity: 0.65; }
/* =========================================================
IMAGE SIZES
small = 420px
medium = 560px
large = 760px
wide = 900px
full = 1200px
========================================================= */
/* ---------- Small ---------- */
/* line 220, theme.scss */
.article-content .article-image--small {
width: 100%;
max-width: 420px;
margin: 2.25rem auto; }
/* ---------- Medium ---------- */
/* line 230, theme.scss */
.article-content .article-image--medium {
width: 100%;
max-width: 560px;
margin: 2.5rem auto; }
/* ---------- Large ---------- */
/* line 240, theme.scss */
.article-content .article-image--large {
width: 100%;
max-width: 760px;
margin: 3rem auto; }
/* ---------- Wide ---------- */
/* line 250, theme.scss */
.article-content .article-image--wide {
width: 100%;
max-width: 900px;
margin: 3rem auto; }
/* ---------- Full ---------- */
/* line 260, theme.scss */
.article-content .article-image--full {
width: 100%;
max-width: 1200px;
margin: 3rem auto; }
/* ---------- IMG внутри размерных Figure ---------- */
/* line 270, theme.scss */
.article-content .article-image--small img,
.article-content .article-image--medium img,
.article-content .article-image--large img,
.article-content .article-image--wide img,
.article-content .article-image--full img {
display: block;
width: 100%;
height: auto;
margin: 0;
border-radius: var(--img-border-radius, 0); }
/* =========================================================
ARTICLE GALLERY
========================================================= */
/* line 290, theme.scss */
.article-gallery {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
width: 100%;
max-width: 900px;
margin: 2.5rem auto 3rem; }
/* line 302, theme.scss */
.article-gallery__item {
margin: 0; }
/* line 306, theme.scss */
.article-gallery__item img {
display: block;
width: 100%;
height: 100%;
margin: 0;
object-fit: cover;
border-radius: var(--img-border-radius, 0); }
/* ---------- Галерея из 5 изображений ---------- */
/* line 322, theme.scss */
.article-gallery--5 .article-gallery__item:first-child {
grid-column: 1 / -1; }
/* ---------- Компактная галерея ---------- */
/* line 329, theme.scss */
.article-gallery--compact {
max-width: 720px; }
/* =========================================================
VIDEO
========================================================= */
/* line 338, theme.scss */
.article-video {
width: 100%;
max-width: 900px;
margin: 3.5rem auto 0;
aspect-ratio: 16 / 9;
overflow: hidden;
border-radius: var(--img-border-radius, 0); }
/* line 351, theme.scss */
.article-video iframe {
display: block;
width: 100%;
height: 100%;
border: 0; }
/* =========================================================
QUOTE
========================================================= */
/* line 365, theme.scss */
.article-content blockquote,
.article-content .article-quote {
margin: 3.5rem 0;
padding-left: 1.75rem;
border-left: 2px solid currentColor;
font-size: 1.2em;
line-height: 1.55; }
/* line 377, theme.scss */
.article-content blockquote p:last-child,
.article-content .article-quote p:last-child {
margin-bottom: 0; }
/* =========================================================
TIP
========================================================= */
/* line 387, theme.scss */
.article-content .article-tip {
margin: 3rem 0;
padding: 1.75rem 2rem;
background: rgba(0, 0, 0, 0.035);
border-radius: var(--img-border-radius, 0); }
/* line 397, theme.scss */
.article-content .article-tip__title {
margin-bottom: 0.7rem;
font-size: 0.95rem;
line-height: 1.3;
font-weight: 600; }
/* line 405, theme.scss */
.article-content .article-tip p:last-child {
margin-bottom: 0; }
/* =========================================================
NOTE
========================================================= */
/* line 414, theme.scss */
.article-content .article-note {
margin: 3rem 0;
padding: 1.75rem 2rem;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: var(--img-border-radius, 0); }
/* line 424, theme.scss */
.article-content .article-note__title {
margin-bottom: 0.7rem;
font-size: 0.95rem;
line-height: 1.3;
font-weight: 600; }
/* line 432, theme.scss */
.article-content .article-note p:last-child {
margin-bottom: 0; }
/* =========================================================
RELATED
========================================================= */
/* line 441, theme.scss */
.article-content .article-related {
margin: 3.5rem 0;
padding-top: 1.5rem;
border-top: 1px solid rgba(0, 0, 0, 0.15); }
/* line 449, theme.scss */
.article-content .article-related__title {
margin-bottom: 0.9rem;
font-size: 0.9rem;
line-height: 1.3;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em; }
/* =========================================================
TABLES
========================================================= */
/* line 465, theme.scss */
.article-content .table-wrapper {
width: 100%;
margin: 3rem 0;
overflow-x: auto;
-webkit-overflow-scrolling: touch; }
/* line 474, theme.scss */
.article-content table {
width: 100%;
min-width: 600px;
border-collapse: collapse; }
/* line 481, theme.scss */
.article-content th,
.article-content td {
padding: 0.9rem 1rem;
text-align: left;
vertical-align: top;
border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
/* =========================================================
DESKTOP
========================================================= */
@media screen and (min-width: 1100px) {
/* ---------------------------------------------------------
Layout
TOC | gap | ARTICLE | gap | empty right column
Центральная колонка статьи всегда остается по центру.
--------------------------------------------------------- */
/* line 506, theme.scss */
.article-layout {
display: grid;
grid-template-columns: minmax(220px, 1fr) minmax(0, 720px) minmax(220px, 1fr);
column-gap: 110px;
width: 100%;
max-width: none;
margin-left: auto;
margin-right: auto;
align-items: start; }
/* ---------- H1 ---------- */
/* line 528, theme.scss */
.article > .heading,
.article h1.heading {
width: 720px;
max-width: 720px;
margin-left: auto;
margin-right: auto; }
/* ---------- Article ---------- */
/* line 540, theme.scss */
.article-layout .article-content {
grid-column: 2;
width: 100%;
max-width: 720px;
margin: 0; }
/* =======================================================
TOC
======================================================= */
/* line 554, theme.scss */
.article-layout .article-toc {
grid-column: 1;
justify-self: end;
align-self: start;
position: sticky;
top: 120px;
width: 220px;
max-width: 220px;
margin: 0;
padding: 0 12px 0 0;
background: transparent;
border: 0;
border-radius: 0;
font-size: 0.9rem;
line-height: 1.4; }
/* line 578, theme.scss */
.article-toc__title {
margin-bottom: 1.25rem;
font-size: 0.76rem;
line-height: 1.3;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.09em;
opacity: 0.6; }
/* line 591, theme.scss */
.article-toc__list {
margin: 0;
padding-left: 0;
list-style: none; }
/* line 598, theme.scss */
.article-toc__sublist {
margin: 0.6rem 0 0;
padding-left: 1rem;
list-style: none; }
/* line 605, theme.scss */
.article-toc__item {
margin: 0 0 0.85rem;
padding: 0; }
/* line 610, theme.scss */
.article-toc__subitem {
margin: 0 0 0.55rem; }
/* line 614, theme.scss */
.article-toc a {
position: relative;
display: block;
max-width: 100%;
opacity: 0.44;
font-weight: 400;
overflow-wrap: break-word;
word-break: normal;
transition: opacity 0.2s ease, transform 0.2s ease; }
/* line 632, theme.scss */
.article-toc a:hover {
opacity: 0.72; }
/* line 636, theme.scss */
.article-toc a.is-active {
opacity: 1;
font-weight: 500;
transform: translateX(4px); }
/* line 644, theme.scss */
.article-toc a.is-active::before {
content: "";
position: absolute;
left: -12px;
top: 0.25em;
width: 1px;
height: 1em;
background: currentColor; }
/* =======================================================
IMAGE SIZES
======================================================= */
/* line 663, theme.scss */
.article-layout .article-content .article-image--small {
width: 420px;
max-width: 420px;
margin-left: auto;
margin-right: auto; }
/* line 671, theme.scss */
.article-layout .article-content .article-image--medium {
width: 560px;
max-width: 560px;
margin-left: auto;
margin-right: auto; }
/* line 679, theme.scss */
.article-layout .article-content .article-image--large {
width: 760px;
max-width: 760px;
margin-left: -20px;
margin-right: -20px; }
/* line 687, theme.scss */
.article-layout .article-content .article-image--wide {
width: 900px;
max-width: 900px;
margin-left: -90px;
margin-right: -90px; }
/* line 695, theme.scss */
.article-layout .article-content .article-image--full {
width: 1200px;
max-width: 1200px;
margin-left: -240px;
margin-right: -240px; }
/* =======================================================
GALLERY
======================================================= */
/* line 708, theme.scss */
.article-layout .article-content .article-gallery {
width: 900px;
max-width: 900px;
margin-left: -90px;
margin-right: -90px; }
/* line 716, theme.scss */
.article-layout .article-content .article-gallery--compact {
width: 720px;
max-width: 720px;
margin-left: 0;
margin-right: 0; }
/* =======================================================
VIDEO
======================================================= */
/* line 729, theme.scss */
.article-layout .article-content .article-video {
width: 900px;
max-width: 900px;
margin-left: -90px;
margin-right: -90px; } }
/* =========================================================
TABLET
========================================================= */
@media screen and (max-width: 1099px) {
/* line 745, theme.scss */
.article-layout {
display: block; }
/* line 749, theme.scss */
.article-layout .article-content {
width: 100%;
max-width: 720px;
margin-left: auto;
margin-right: auto; }
/* ---------- TOC ---------- */
/* line 760, theme.scss */
.article-toc {
position: static;
width: 100%;
max-width: 720px;
margin: 0 auto 3rem;
padding: 1.4rem 1.25rem;
background: #f7f7f5;
border-radius: var(--img-border-radius, 2px); }
/* line 774, theme.scss */
.article-toc__title {
margin-bottom: 1rem;
font-size: 1rem;
font-weight: 600;
text-transform: none;
letter-spacing: normal;
opacity: 1; }
/* line 786, theme.scss */
.article-toc__list {
padding-left: 1.35rem;
list-style: decimal; }
/* line 792, theme.scss */
.article-toc__sublist {
margin-top: 0.5rem;
padding-left: 1.3rem;
list-style: decimal; }
/* line 799, theme.scss */
.article-toc__item {
margin-bottom: 0.7rem; }
/* line 803, theme.scss */
.article-toc__subitem {
margin-bottom: 0.5rem; }
/* line 807, theme.scss */
.article-toc a {
opacity: 1;
transform: none; }
/* line 812, theme.scss */
.article-toc a.is-active {
font-weight: inherit;
transform: none; }
/* line 817, theme.scss */
.article-toc a.is-active::before {
display: none; }
/* ---------- Изображения ---------- */
/* line 824, theme.scss */
.article-content .article-image--large,
.article-content .article-image--wide,
.article-content .article-image--full {
width: 100%;
max-width: 100%;
margin-left: auto;
margin-right: auto; }
/* ---------- Галереи ---------- */
/* line 837, theme.scss */
.article-gallery,
.article-gallery--compact {
width: 100%;
max-width: 100%;
margin-left: auto;
margin-right: auto; }
/* ---------- Видео ---------- */
/* line 849, theme.scss */
.article-video {
width: 100%;
max-width: 100%;
margin-top: 2.5rem; } }
/* =========================================================
MOBILE
========================================================= */
@media screen and (max-width: 767px) {
/* line 864, theme.scss */
.article > .heading,
.article h1.heading {
font-size: clamp(2rem, 10vw, 2.8rem);
line-height: 1.08; }
/* line 870, theme.scss */
.article-content {
font-size: 1rem;
line-height: 1.68; }
/* line 875, theme.scss */
.article-content .article-lead {
font-size: 1.15em; }
/* line 879, theme.scss */
.article-content h2 {
margin-top: 3.75rem;
margin-bottom: 1.25rem;
font-size: 1.75rem; }
/* line 886, theme.scss */
.article-content h3 {
margin-top: 2.75rem;
margin-bottom: 1rem;
font-size: 1.4rem; }
/* ---------- TOC ---------- */
/* line 896, theme.scss */
.article-toc {
margin-bottom: 3rem;
padding: 1.4rem 1.25rem; }
/* ---------- Все изображения вписываются в экран ---------- */
/* line 904, theme.scss */
.article-content .article-image--small,
.article-content .article-image--medium,
.article-content .article-image--large,
.article-content .article-image--wide,
.article-content .article-image--full {
width: 100%;
max-width: 100%;
margin-top: 2rem;
margin-bottom: 2rem; }
/* ---------- Галереи ---------- */
/* line 919, theme.scss */
.article-gallery {
grid-template-columns: 1fr;
gap: 0.75rem;
margin-top: 2rem;
margin-bottom: 2.5rem; }
/* line 928, theme.scss */
.article-gallery--5 .article-gallery__item:first-child {
grid-column: auto; }
/* ---------- Tip / Note ---------- */
/* line 935, theme.scss */
.article-content .article-tip,
.article-content .article-note {
margin: 2.5rem 0;
padding: 1.4rem 1.25rem; } }
/* =========================================================
ARTICLE IMAGE — DESKTOP HOVER
========================================================= */
@media screen and (min-width: 1100px) {
/* line 947, theme.scss */
.article-content figure,
.article-gallery__item {
overflow: hidden; }
/* line 952, theme.scss */
.article-content figure img,
.article-gallery__item img {
transition: transform 0.35s ease;
will-change: transform; }
/* line 958, theme.scss */
.article-content figure:hover img,
.article-gallery__item:hover img {
transform: scale(1.035); } }
/* line 964, theme.scss */
.article-content > p:first-child {
margin-bottom: 2.5rem;
font-size: 1.25em;
line-height: 1.55; }
/* ---------------------------------------------------------
2. Обычные изображения из визуального редактора InSales
автоматически получают размер Medium = 560px.
Поддерживаются типичные варианты HTML:
![]()
![]()
![]()
Специальные figure-классы small / medium / large / wide
и изображения внутри галерей этим правилом не затрагиваются.
--------------------------------------------------------- */
/* line 985, theme.scss */
.article-content > img,
.article-content > p > img,
.article-content > p > a > img {
display: block;
width: 100%;
max-width: 560px;
height: auto;
margin: 2.5rem auto;
border-radius: var(--img-border-radius, 0); }
/* ---------------------------------------------------------
3. Легкое увеличение обычных изображений на десктопе
--------------------------------------------------------- */
@media screen and (min-width: 1100px) {
/* line 1006, theme.scss */
.article-content > img,
.article-content > p > img,
.article-content > p > a > img {
transition: transform 0.35s ease;
will-change: transform; }
/* line 1013, theme.scss */
.article-content > img:hover,
.article-content > p > img:hover,
.article-content > p > a > img:hover {
transform: scale(1.035); } }
/* ---------------------------------------------------------
4. На телефоне обычные изображения занимают доступную ширину
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
/* line 1028, theme.scss */
.article-content > img,
.article-content > p > img,
.article-content > p > a > img {
width: 100%;
max-width: 100%;
margin-top: 2rem;
margin-bottom: 2rem; } }
/* =========================================================
BLOG LIST — EDITORIAL GRID
Системный виджет не изменяем
========================================================= */
/* =========================================================
BLOG TITLE
========================================================= */
/* line 1049, theme.scss */
.blog-list + * {
min-width: 0; }
/* line 1053, theme.scss */
.tagcloud-block + .blog-list {
margin-top: 0; }
/* =========================================================
TAG CLOUD
========================================================= */
/* line 1062, theme.scss */
.tagcloud-block {
margin-bottom: 3.5rem;
padding: 0; }
/* line 1067, theme.scss */
.tagcloud {
display: flex;
flex-wrap: wrap;
gap: 0.5rem; }
/* line 1074, theme.scss */
.tagcloud-block .button {
margin: 0;
padding: 0.45rem 0.85rem;
background: transparent !important;
border: 1px solid rgba(0, 0, 0, 0.12);
border-radius: 999px;
color: inherit !important;
font-size: 0.82rem;
line-height: 1.25;
font-weight: 400;
opacity: 0.68;
transition: opacity 0.2s ease, border-color 0.2s ease, background 0.2s ease; }
/* line 1098, theme.scss */
.tagcloud-block .button:not(.active):hover {
opacity: 1;
border-color: var(--color-btn-bg);
background: var(--color-btn-bg) !important;
color: var(--color-btn-color) !important; }
/* line 1107, theme.scss */
.tagcloud-block .button.active {
opacity: 1;
border-color: currentColor;
background: transparent !important;
font-weight: 500; }
/* =========================================================
BLOG GRID
========================================================= */
/* line 1122, theme.scss */
.blog-list.grid-list {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 4rem 2rem;
width: 100%; }
/* =========================================================
ARTICLE CARD
========================================================= */
/* line 1137, theme.scss */
.blog-list.grid-list .blog-list__item {
display: flex !important;
flex-direction: column;
min-width: 0;
gap: 0;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important; }
/* =========================================================
IMAGE
========================================================= */
/* line 1158, theme.scss */
.blog-list.grid-list .blog-list__item-photo {
width: 100%;
margin-bottom: 1.35rem;
overflow: hidden;
border-radius: var(--img-border-radius, 0); }
/* line 1168, theme.scss */
.blog-list.grid-list
.blog-list__item-photo
.img-ratio__inner {
overflow: hidden;
border-radius: inherit; }
/* line 1176, theme.scss */
.blog-list.grid-list
.blog-list__item-photo
a {
display: block;
width: 100%;
height: 100%;
overflow: hidden; }
/* line 1187, theme.scss */
.blog-list.grid-list
.blog-list__item-photo
img {
display: block;
width: 100%;
height: 100%;
margin: 0;
object-fit: cover;
border-radius: inherit;
transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
will-change: transform; }
/* =========================================================
DATE
========================================================= */
/* line 1212, theme.scss */
.blog-list.grid-list .blog-list__item-date {
display: none !important; }
/* =========================================================
TITLE
========================================================= */
/* line 1221, theme.scss */
.blog-list.grid-list .blog-list__item-title {
margin: 0 0 0.85rem;
padding: 0 !important;
font-size: clamp(1.2rem, 1.5vw, 1.45rem);
line-height: 1.22;
font-weight: 500;
letter-spacing: -0.015em;
transition: transform 0.3s ease; }
/* line 1235, theme.scss */
.blog-list.grid-list
.blog-list__item-title
a {
color: inherit !important;
text-decoration: none; }
/* =========================================================
ANNOUNCEMENT
========================================================= */
/* line 1247, theme.scss */
.blog-list.grid-list .blog-list__item-description {
min-width: 0;
max-width: 34em;
margin: 0;
padding: 0 !important;
font-size: 0.95rem;
line-height: 1.55;
opacity: 0.72; }
/* =========================================================
ARTICLE TAGS
========================================================= */
/* line 1266, theme.scss */
.blog-list.grid-list .blog-list__item-tag-list {
display: flex;
flex-wrap: wrap;
gap: 0.35rem 0.8rem;
margin-top: 1.15rem;
padding: 0 !important; }
/* line 1277, theme.scss */
.blog-list.grid-list .blog-list__item-tag {
margin: 0;
color: inherit;
font-size: 0.78rem;
line-height: 1.3;
text-decoration: none;
opacity: 0.5;
transition: opacity 0.2s ease; }
/* line 1292, theme.scss */
.blog-list.grid-list .blog-list__item-tag:hover {
opacity: 1; }
/* =========================================================
DESKTOP HOVER
========================================================= */
@media screen and (min-width: 1100px) {
/* line 1303, theme.scss */
.blog-list.grid-list
.blog-list__item:hover
.blog-list__item-photo
img {
transform: scale(1.035); }
/* line 1310, theme.scss */
.blog-list.grid-list
.blog-list__item:hover
.blog-list__item-title {
transform: translateY(-2px); } }
/* =========================================================
TABLET
========================================================= */
@media screen and (max-width: 1099px) {
/* line 1325, theme.scss */
.blog-list.grid-list {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 3.5rem 1.5rem; }
/* line 1331, theme.scss */
.blog-list.grid-list .blog-list__item-title {
font-size: 1.3rem; } }
/* =========================================================
MOBILE
========================================================= */
@media screen and (max-width: 767px) {
/* line 1344, theme.scss */
.tagcloud-block {
margin-bottom: 2.5rem; }
/* line 1348, theme.scss */
.tagcloud {
gap: 0.45rem; }
/* line 1352, theme.scss */
.tagcloud-block .button {
padding: 0.5rem 0.8rem;
font-size: 0.8rem; }
/* line 1359, theme.scss */
.blog-list.grid-list {
grid-template-columns: 1fr !important;
gap: 3rem; }
/* line 1366, theme.scss */
.blog-list.grid-list .blog-list__item-photo {
margin-bottom: 1.2rem; }
/* line 1371, theme.scss */
.blog-list.grid-list .blog-list__item-title {
margin-bottom: 0.75rem;
font-size: 1.4rem;
line-height: 1.2; }
/* line 1379, theme.scss */
.blog-list.grid-list .blog-list__item-description {
max-width: none;
font-size: 1rem;
line-height: 1.6; } }