/* Start:/bitrix/components/ranx/block.landing/templates/100_10_custom/style.css?17881065826915*/
/* 100_10_custom — Обо мне: Первый экран (пилот, минимальная версия).
   Локальный namespace: .wstudio-about10-*. Токены — общий --wstudio-* слой
   (templates/ranx-landing/assets/css/custom.css), не переопределяются здесь.
   Правило 7a: селекторы на голые p/ul — только с классом-предком блока. */

/* Générик-баг Ranx: class.php:1170-1171 вешает инлайн
   style="background-color:..." на корневой div БЕЗУСЛОВНО при любом
   ненулевом BG_COLOR, без проверки isEnabledSection — вкладка «Дизайн»
   отправляет скрытые дефолтные значения при сохранении ЛЮБОГО поля (даже
   отступа), давая белый фон и светлый-на-белом текст. !important —
   единственный способ перебить непомеченный инлайн-стиль без правки
   общего для всех блоков class.php (вне периметра этой работы). Поля
   вкладки «Дизайн» дополнительно скрыты через _EXCLUDE в .block.php.
   См. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about10 {
    background-color: transparent !important;
}

.wstudio-about10 .wstudio-about10__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-7, 48px);
    align-items: start;
}

@media (min-width: 768px) {
    .wstudio-about10 .wstudio-about10__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about10 .wstudio-about10__container {
        padding-inline: var(--wstudio-space-7, 48px);
        grid-template-columns: 0.95fr 1.05fr;
    }

    .wstudio-about10 .wstudio-about10__facts {
        grid-column: 1 / -1;
    }
}

.wstudio-about10 .wstudio-about10__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about10 .wstudio-about10__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-size: var(--wstudio-fs-h1, clamp(2.5rem, 1rem + 5vw, 5.5rem));
    line-height: 1.1;
    margin: 0 0 var(--wstudio-space-5, 24px);
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about10 .wstudio-about10__lead {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-4, 20px);
    margin: 0 0 var(--wstudio-space-6, 32px);
    /* Цвет/шрифт — и на контейнере (для сырого текста без <p>), и повторно
       на вложенном <p> ниже (для текста, который WYSIWYG обернул в <p>).
       ИСПРАВЛЕНО 2026-08-30 (2-й заход): предыдущая версия ставила цвет
       ТОЛЬКО на контейнер, рассчитывая на наследование, — но прямое правило
       темы Ranx ".block p{color:#666;font-size:15px}" всегда побеждает
       унаследованное значение, независимо от специфичности предка (прямое
       совпадение > наследование). Поэтому когда контент обёрнут в <p>, он
       снова становится тёмным/мельче — именно это заметил пользователь на
       100_15_custom. Решение — Правило 7a по букве: специфичность ВЫШЕ темы
       нужна у селектора НА САМОМ p, не только у контейнера-предка. Цвет —
       --wstudio-color-text (не -secondary) по прямому запросу пользователя
       2026-08-30, см. DECISIONS.md. */
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about10 .wstudio-about10__lead p {
    margin: 0;
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about10 .wstudio-about10__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wstudio-space-3, 16px);
}

.wstudio-about10 .wstudio-about10__scene {
    position: relative;
    aspect-ratio: 3 / 4;
    max-width: 420px;
    margin: 0 auto;
}

.wstudio-about10 .wstudio-about10__photo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--wstudio-space-3, 16px);
    width: 100%;
    height: 100%;
    border-radius: var(--wstudio-radius-lg, 24px);
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    background: var(--wstudio-color-bg-panel, rgba(255, 255, 255, 0.03));
    overflow: hidden;
    color: var(--wstudio-color-accent-violet, #8A5CF6);
}

.wstudio-about10 .wstudio-about10__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.wstudio-about10 .wstudio-about10__photo-silhouette {
    width: 96px;
    height: 96px;
    fill: none;
    stroke: currentColor;
    stroke-opacity: 0.5;
    stroke-width: 4;
}

.wstudio-about10 .wstudio-about10__photo-monogram {
    font-family: var(--wstudio-font-heading, inherit);
    font-size: 1.5rem;
    font-weight: 700;
}

.wstudio-about10 .wstudio-about10__photo-caption {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-text-tertiary, inherit);
}

.wstudio-about10 .wstudio-about10__facts {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-4, 20px);
    margin: 0;
    padding: var(--wstudio-space-5, 24px) 0 0;
    list-style: none;
    border-top: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
}

@media (min-width: 640px) {
    .wstudio-about10 .wstudio-about10__facts {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

.wstudio-about10 .wstudio-about10__fact {
    font-size: var(--wstudio-fs-body, 1rem);
    color: var(--wstudio-color-text-secondary, inherit);
}

@media (prefers-reduced-motion: reduce) {
    .wstudio-about10 * {
        animation: none !important;
        transition: none !important;
    }
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_11_custom/style.css?17881065849127*/
/* 100_11_custom — Обо мне: История eXtreme. Локальный namespace:
   .wstudio-about11-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx (INDENT_TOP/BOT_DEFAULT в .block.php),
   свой padding-block здесь не добавляется (иначе задвоение с прототипом,
   см. постмортем 100_10_custom, DECISIONS.md 2026-08-30). */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about11 {
    background-color: transparent !important;
}

.wstudio-about11 .wstudio-about11__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-7, 48px);
}

@media (min-width: 768px) {
    .wstudio-about11 .wstudio-about11__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about11 .wstudio-about11__container {
        padding-inline: var(--wstudio-space-7, 48px);
        grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
        align-items: center;
        column-gap: var(--wstudio-space-8, 64px);
    }
}

.wstudio-about11 .wstudio-about11__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about11 .wstudio-about11__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-4, 20px);
}

.wstudio-about11 .wstudio-about11__badges {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wstudio-space-2, 8px);
    margin-bottom: var(--wstudio-space-5, 24px);
}

.wstudio-about11 .wstudio-about11__badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    color: var(--wstudio-color-text-secondary, inherit);
    background: var(--wstudio-color-bg-panel, rgba(255, 255, 255, 0.03));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-sm, 8px);
}

.wstudio-about11 .wstudio-about11__text {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-4, 20px);
    max-width: 58ch;
    /* Цвет/шрифт — и на контейнере, и повторно на вложенном <p> ниже —
       см. полное объяснение (2-й заход фикса, прямое правило темы Ranx
       ".block p" побеждает наследование от контейнера) в
       100_10_custom/style.css. Цвет — --wstudio-color-text (не -secondary)
       по прямому запросу пользователя 2026-08-30, см. DECISIONS.md. */
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about11 .wstudio-about11__text p {
    margin: 0;
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about11 .wstudio-about11__scene {
    position: relative;
}

.wstudio-about11 .wstudio-about11__terminal {
    margin-bottom: var(--wstudio-space-4, 20px);
    background: var(--wstudio-color-bg-panel, rgba(255, 255, 255, 0.03));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-md, 16px);
    overflow: hidden;
}

.wstudio-about11 .wstudio-about11__terminal-bar {
    display: flex;
    align-items: center;
    gap: var(--wstudio-space-2, 8px);
    padding: var(--wstudio-space-2, 8px) var(--wstudio-space-4, 20px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border-bottom: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
}

.wstudio-about11 .wstudio-about11__terminal-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--wstudio-color-text-tertiary, currentColor);
    opacity: 0.6;
}

.wstudio-about11 .wstudio-about11__terminal-title {
    margin-left: var(--wstudio-space-2, 8px);
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    color: var(--wstudio-color-text-tertiary, inherit);
}

.wstudio-about11 .wstudio-about11__terminal-body {
    padding: var(--wstudio-space-3, 16px) var(--wstudio-space-4, 20px);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.wstudio-about11 .wstudio-about11__terminal-body p {
    margin: 0;
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.75rem;
    line-height: 1.6;
    color: var(--wstudio-color-text-tertiary, inherit);
}

@media (max-width: 1023px) {
    .wstudio-about11 .wstudio-about11__terminal-body p {
        font-size: 0.6875rem;
    }
}

.wstudio-about11 .wstudio-about11__graph {
    display: block;
    width: 100%;
    height: auto;
}

.wstudio-about11 .wstudio-about11__links line {
    stroke: var(--wstudio-color-line, rgba(255, 255, 255, 0.16));
    stroke-width: 1.5;
    transition: stroke var(--wstudio-dur-slide, 620ms) var(--wstudio-ease-standard, ease),
        opacity var(--wstudio-dur-slide, 620ms) var(--wstudio-ease-standard, ease);
}

.wstudio-about11 .wstudio-about11__scene.is-transformed .wstudio-about11__links line {
    stroke: var(--wstudio-about11-gradient);
    opacity: 0.9;
}

.wstudio-about11 .wstudio-about11__node circle {
    fill: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    stroke: var(--wstudio-color-text-tertiary, currentColor);
    stroke-width: 1.5;
    transition: fill var(--wstudio-dur-slide, 620ms) var(--wstudio-ease-standard, ease),
        stroke var(--wstudio-dur-slide, 620ms) var(--wstudio-ease-standard, ease),
        opacity var(--wstudio-dur-slide, 620ms) var(--wstudio-ease-standard, ease);
}

.wstudio-about11 .wstudio-about11__scene.is-transformed .wstudio-about11__node circle {
    fill: var(--wstudio-color-accent-blue, #3D7CFF);
    stroke: var(--wstudio-color-accent-violet, #8A5CF6);
    opacity: 0.35;
}

.wstudio-about11 .wstudio-about11__scene.is-transformed .wstudio-about11__node--hub circle {
    opacity: 1;
}

.wstudio-about11 .wstudio-about11__node-label {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 11px;
}

.wstudio-about11 .wstudio-about11__node-label--a {
    fill: var(--wstudio-color-text-tertiary, currentColor);
    opacity: 1;
    transition: opacity var(--wstudio-dur-slide, 620ms) var(--wstudio-ease-standard, ease);
}

.wstudio-about11 .wstudio-about11__node-label--b {
    fill: var(--wstudio-color-text, currentColor);
    font-weight: 500;
    opacity: 0;
    transition: opacity var(--wstudio-dur-slide, 620ms) var(--wstudio-ease-standard, ease);
}

.wstudio-about11 .wstudio-about11__scene.is-transformed .wstudio-about11__node-label--a {
    opacity: 0;
}

.wstudio-about11 .wstudio-about11__scene.is-transformed .wstudio-about11__node-label--b {
    opacity: 1;
}

/* prefers-reduced-motion: JS-observer (script.js) не запускается вовсе —
   финальное состояние Studio показывается сразу через !important,
   не дожидаясь класса .is-transformed. 1-в-1 с about.css. */
@media (prefers-reduced-motion: reduce) {
    .wstudio-about11 .wstudio-about11__links line,
    .wstudio-about11 .wstudio-about11__node circle,
    .wstudio-about11 .wstudio-about11__node-label--a,
    .wstudio-about11 .wstudio-about11__node-label--b {
        transition: none !important;
    }

    .wstudio-about11 .wstudio-about11__links line {
        stroke: var(--wstudio-about11-gradient) !important;
        opacity: 0.9 !important;
    }

    .wstudio-about11 .wstudio-about11__node circle {
        fill: var(--wstudio-color-accent-blue, #3D7CFF) !important;
        stroke: var(--wstudio-color-accent-violet, #8A5CF6) !important;
        opacity: 0.35 !important;
    }

    .wstudio-about11 .wstudio-about11__node--hub circle {
        opacity: 1 !important;
    }

    .wstudio-about11 .wstudio-about11__node-label--a {
        opacity: 0 !important;
    }

    .wstudio-about11 .wstudio-about11__node-label--b {
        opacity: 1 !important;
    }
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_12_custom/style.css?17881065876095*/
/* 100_12_custom — Обо мне: Профессиональный путь. Локальный namespace:
   .wstudio-about12-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx, свой padding-block не добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about12 {
    background-color: transparent !important;
}

.wstudio-about12 .wstudio-about12__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about12 .wstudio-about12__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about12 .wstudio-about12__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about12 .wstudio-about12__intro {
    max-width: 60ch;
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about12 .wstudio-about12__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about12 .wstudio-about12__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0;
}

.wstudio-about12 .wstudio-about12__layout {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-7, 48px);
}

/* Список годов скрыт до 1024px — на карточках уже есть свой год. */
.wstudio-about12 .wstudio-about12__years {
    display: none;
}

@media (min-width: 1024px) {
    .wstudio-about12 .wstudio-about12__layout {
        flex-direction: row;
        align-items: stretch;
        gap: var(--wstudio-space-8, 64px);
    }

    .wstudio-about12 .wstudio-about12__years {
        display: block;
        flex: 0 0 200px;
    }

    .wstudio-about12 .wstudio-about12__years-sticky {
        position: sticky;
        top: 96px;
    }
}

.wstudio-about12 .wstudio-about12__years-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-1, 4px);
}

.wstudio-about12 .wstudio-about12__year-link {
    display: block;
    padding: var(--wstudio-space-2, 8px) 0 var(--wstudio-space-2, 8px) var(--wstudio-space-4, 16px);
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    color: var(--wstudio-color-text-tertiary, inherit);
    border-left: 2px solid var(--wstudio-color-line, rgba(255, 255, 255, 0.16));
    transition: color var(--wstudio-dur-base, 260ms) var(--wstudio-ease-standard, ease),
        border-color var(--wstudio-dur-base, 260ms) var(--wstudio-ease-standard, ease);
}

.wstudio-about12 .wstudio-about12__year-link.is-active {
    color: var(--wstudio-color-text, inherit);
    border-left-color: var(--wstudio-color-accent-blue, #3D7CFF);
}

@media (prefers-reduced-motion: reduce) {
    .wstudio-about12 .wstudio-about12__year-link {
        transition: none;
    }
}

.wstudio-about12 .wstudio-about12__events {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-6, 32px);
    flex: 1;
    min-width: 0;
}

.wstudio-about12 .wstudio-about12__event {
    padding: var(--wstudio-space-6, 32px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-md, 16px);
    /* Якорный переход не должен прятаться под прилипающей шапкой сайта. */
    scroll-margin-top: 96px;
}

.wstudio-about12 .wstudio-about12__event-year {
    margin: 0 0 var(--wstudio-space-2, 8px);
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    letter-spacing: 0.04em;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
}

.wstudio-about12 .wstudio-about12__event-title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 700;
    font-size: var(--wstudio-fs-h3, clamp(1.25rem, 1rem + 1.5vw, 1.75rem));
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about12 .wstudio-about12__event-text {
    /* Цвет/шрифт — и на контейнере, и повторно на вложенном <p> ниже —
       см. полное объяснение (2-й заход фикса, прямое правило темы Ranx
       ".block p" побеждает наследование от контейнера) в
       100_10_custom/style.css. Цвет — --wstudio-color-text (не -secondary)
       по прямому запросу пользователя 2026-08-30, см. DECISIONS.md. */
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about12 .wstudio-about12__event-text p {
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about12 .wstudio-about12__event-text p:last-child {
    margin-bottom: 0;
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_13_custom/style.css?17881065906048*/
/* 100_13_custom — Обо мне: Маркетинг + технологии + бизнес. Локальный
   namespace: .wstudio-about13-*. Токены — общий --wstudio-* слой
   (custom.css), не переопределяются здесь. Правило 7a: селекторы на голые
   p/ul — только с классом-предком блока. Вертикальные отступы блока —
   штатные indent-top/indent-bot классы Ranx, свой padding-block не
   добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about13 {
    background-color: transparent !important;
}

.wstudio-about13 .wstudio-about13__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about13 .wstudio-about13__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about13 .wstudio-about13__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about13 .wstudio-about13__intro {
    max-width: 68ch;
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about13 .wstudio-about13__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about13 .wstudio-about13__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-4, 20px);
}

.wstudio-about13 .wstudio-about13__lead {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-3, 16px);
    /* Цвет/шрифт — и на контейнере, и повторно на вложенном <p> ниже —
       см. полное объяснение (2-й заход фикса, прямое правило темы Ranx
       ".block p" побеждает наследование от контейнера) в
       100_10_custom/style.css. Цвет — var(--wstudio-color-text), не
       -secondary, как в прототипе — по прямому запросу пользователя. */
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about13 .wstudio-about13__lead p {
    margin: 0;
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about13 .wstudio-about13__grid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-5, 24px);
    margin-bottom: var(--wstudio-space-7, 48px);
}

@media (min-width: 768px) {
    .wstudio-about13 .wstudio-about13__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--wstudio-space-6, 32px);
    }

    /* Соединяющая линия между карточками — декоративный ::before, никогда
       не попадает в accessibility tree, отдельный aria-hidden не нужен. */
    .wstudio-about13 .wstudio-about13__grid::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 6%;
        right: 6%;
        height: 1px;
        background: linear-gradient(90deg, transparent, var(--wstudio-color-line, rgba(255, 255, 255, 0.16)) 15%, var(--wstudio-color-line, rgba(255, 255, 255, 0.16)) 85%, transparent);
        z-index: 0;
    }
}

.wstudio-about13 .wstudio-about13__card {
    position: relative;
    z-index: 1;
    padding: var(--wstudio-space-6, 32px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-md, 16px);
}

.wstudio-about13 .wstudio-about13__card-label {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 700;
    font-size: var(--wstudio-fs-h3, clamp(1.25rem, 1rem + 1.5vw, 1.75rem));
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about13 .wstudio-about13__card-text {
    /* Цвет — var(--wstudio-color-text) (не -secondary), тот же приём и то же
       обоснование, что .wstudio-about13__lead выше — включая повторное
       объявление на вложенном <p>. */
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about13 .wstudio-about13__card-text p {
    margin: 0;
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about13 .wstudio-about13__formula {
    text-align: center;
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 700;
    font-size: clamp(1.25rem, 1rem + 1.5vw, 1.875rem);
    line-height: 1.4;
    /* Формула — не DESC/PREVIEW_TEXT (générик SUBTITLE + хардкод-префикс),
       цвет прототипа (--color-text-secondary) не тронут по этой причине —
       правило "ярче" 2026-08-30 касается только тела текста, выводимого
       через générик HTML-поля. */
    color: var(--wstudio-color-text-secondary, inherit);
    margin: 0;
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_14_custom/style.css?17881065924716*/
/* 100_14_custom — Обо мне: Карта компетенций. Локальный namespace:
   .wstudio-about14-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx, свой padding-block не добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about14 {
    background-color: transparent !important;
}

.wstudio-about14 .wstudio-about14__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about14 .wstudio-about14__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about14 .wstudio-about14__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about14 .wstudio-about14__intro {
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about14 .wstudio-about14__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about14 .wstudio-about14__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0;
}

/* Решение прототипа: без аккордеона на любом разрешении — десктоп 2×2,
   планшет тоже 2 колонки, мобильный 1 колонка, всё содержимое видно сразу. */
.wstudio-about14 .wstudio-about14__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-5, 24px);
}

@media (min-width: 768px) {
    .wstudio-about14 .wstudio-about14__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--wstudio-space-6, 32px);
    }
}

.wstudio-about14 .wstudio-about14__module {
    padding: var(--wstudio-space-6, 32px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-md, 16px);
}

.wstudio-about14 .wstudio-about14__module-title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 700;
    font-size: var(--wstudio-fs-h3, clamp(1.25rem, 1rem + 1.5vw, 1.75rem));
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about14 .wstudio-about14__module-text {
    /* Цвет/шрифт — и на контейнере, и повторно на вложенном <p> ниже —
       см. полное объяснение (2-й заход фикса, прямое правило темы Ranx
       ".block p" побеждает наследование от контейнера) в
       100_10_custom/style.css. Цвет — var(--wstudio-color-text). */
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-4, 20px);
}

.wstudio-about14 .wstudio-about14__module-text p {
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about14 .wstudio-about14__module-text p:last-child {
    margin-bottom: 0;
}

.wstudio-about14 .wstudio-about14__tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wstudio-space-2, 8px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.wstudio-about14 .wstudio-about14__tags li {
    padding: 4px 10px;
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.75rem;
    color: var(--wstudio-color-text-secondary, inherit);
    background: var(--wstudio-color-bg-panel, rgba(255, 255, 255, 0.03));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-sm, 8px);
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_15_custom/style.css?17881065956499*/
/* 100_15_custom — Обо мне: Личная ответственность за проект. Локальный
   namespace: .wstudio-about15-*. Токены — общий --wstudio-* слой
   (custom.css), не переопределяются здесь. Правило 7a: селекторы на голые
   p/ul/ol — только с классом-предком блока. Вертикальные отступы блока —
   штатные indent-top/indent-bot классы Ranx, свой padding-block не
   добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about15 {
    background-color: transparent !important;
}

.wstudio-about15 .wstudio-about15__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about15 .wstudio-about15__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about15 .wstudio-about15__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about15 .wstudio-about15__intro {
    max-width: 60ch;
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about15 .wstudio-about15__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about15 .wstudio-about15__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0;
}

/* Текст первым в DOM (диаграмма декоративна и aria-hidden — порядок для
   неё не принципиален), колонки 50/50 на ≥1024px — 1-в-1 прототип. */
.wstudio-about15 .wstudio-about15__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-6, 32px);
}

@media (min-width: 1024px) {
    .wstudio-about15 .wstudio-about15__layout {
        grid-template-columns: 1fr 1fr;
        align-items: center;
        gap: var(--wstudio-space-8, 64px);
    }
}

.wstudio-about15 .wstudio-about15__text {
    /* Цвет/шрифт — и на контейнере, и повторно на вложенном <p> ниже —
       прямое правило темы Ranx ".block p{color:#666;font-size:15px}"
       побеждает наследование от контейнера-предка (совпадающее правило на
       самом элементе всегда сильнее наследования, независимо от
       специфичности предка) — без повторного объявления на "... p" текст
       в <p> оставался тёмным/мельче, именно это заметил пользователь
       2026-08-30 на живом сайте. Цвет — var(--wstudio-color-text). */
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-4, 20px);
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about15 .wstudio-about15__text p {
    margin: 0;
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about15 .wstudio-about15__diagram {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wstudio-space-5, 24px);
    padding: var(--wstudio-space-6, 32px);
    background: var(--wstudio-color-bg-panel, rgba(255, 255, 255, 0.03));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-lg, 24px);
}

.wstudio-about15 .wstudio-about15__hub {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--wstudio-space-4, 20px) var(--wstudio-space-6, 32px);
    background: var(--wstudio-gradient-accent, linear-gradient(135deg, #3D7CFF, #8A5CF6));
    border-radius: var(--wstudio-radius-md, 16px);
    box-shadow: var(--wstudio-glow-soft, 0 0 48px rgba(121, 166, 255, 0.22));
}

.wstudio-about15 .wstudio-about15__hub-name {
    margin: 0;
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h3, clamp(1.25rem, 1rem + 1.5vw, 1.75rem));
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about15 .wstudio-about15__hub-role {
    margin: 0;
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    color: rgba(244, 246, 250, 0.85);
}

.wstudio-about15 .wstudio-about15__stages {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--wstudio-space-2, 8px);
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: wstudio-about15-stage;
    width: 100%;
    max-width: 720px;
}

.wstudio-about15 .wstudio-about15__stages li {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--wstudio-space-3, 16px);
    padding: var(--wstudio-space-2, 8px) var(--wstudio-space-3, 16px);
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.8125rem;
    color: var(--wstudio-color-text-secondary, inherit);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-sm, 8px);
    counter-increment: wstudio-about15-stage;
}

.wstudio-about15 .wstudio-about15__stages li::before {
    content: counter(wstudio-about15-stage, decimal-leading-zero);
    flex: none;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
}

@media (min-width: 1024px) {
    .wstudio-about15 .wstudio-about15__stages {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--wstudio-space-2, 8px);
    }
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_16_custom/style.css?17881065974854*/
/* 100_16_custom — Обо мне: Опыт собственного бизнеса. Локальный namespace:
   .wstudio-about16-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx, свой padding-block не добавляется.

   Сознательно НЕ карточная сетка (фон/рамка) — «журнальное» оформление:
   крупный номер + горизонтальный разделитель, 1-в-1 прототип (about.css,
   комментарий: "их нет и выдумывать нельзя" про логотипы/скриншоты). */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about16 {
    background-color: transparent !important;
}

.wstudio-about16 .wstudio-about16__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about16 .wstudio-about16__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about16 .wstudio-about16__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about16 .wstudio-about16__intro {
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about16 .wstudio-about16__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about16 .wstudio-about16__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0;
}

.wstudio-about16 .wstudio-about16__list {
    display: flex;
    flex-direction: column;
}

.wstudio-about16 .wstudio-about16__item {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-4, 20px);
    padding-block: var(--wstudio-space-7, 48px);
    border-top: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
}

.wstudio-about16 .wstudio-about16__item:last-child {
    border-bottom: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
}

@media (min-width: 768px) {
    .wstudio-about16 .wstudio-about16__item {
        flex-direction: row;
        gap: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about16 .wstudio-about16__item-marker {
    flex: none;
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: clamp(2.5rem, 2vw + 2rem, 3.5rem);
    line-height: 1;
    margin: 0;
}

@media (min-width: 768px) {
    .wstudio-about16 .wstudio-about16__item-marker {
        width: 140px;
    }
}

.wstudio-about16 .wstudio-about16__item-body {
    max-width: 68ch;
}

.wstudio-about16 .wstudio-about16__item-meta {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--wstudio-color-text-tertiary, inherit);
    margin: 0 0 var(--wstudio-space-2, 8px);
}

.wstudio-about16 .wstudio-about16__item-title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h3, clamp(1.25rem, 1rem + 1.5vw, 1.75rem));
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-4, 20px);
}

/* Цвет/шрифт — на контейнере (текст без <p>) И повторно на вложенном <p>
   (текст, обёрнутый WYSIWYG в <p> — иначе тема Ranx ".block p{color:#666}"
   перебивает унаследованное значение). См. DECISIONS.md 2026-08-30. */
.wstudio-about16 .wstudio-about16__item-text {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-3, 16px);
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about16 .wstudio-about16__item-text p {
    margin: 0;
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_17_custom/style.css?17881066006030*/
/* 100_17_custom — Обо мне: Масштаб работы. Локальный namespace:
   .wstudio-about17-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx, свой padding-block не добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about17 {
    background-color: transparent !important;
}

.wstudio-about17 .wstudio-about17__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about17 .wstudio-about17__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about17 .wstudio-about17__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

/* Ревизия прототипа (раунд 2): текст слева, цифры справа на ≥1024px. */
.wstudio-about17 .wstudio-about17__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-7, 48px);
}

@media (min-width: 1024px) {
    .wstudio-about17 .wstudio-about17__layout {
        grid-template-columns: 1.2fr 1fr;
        align-items: center;
        gap: var(--wstudio-space-8, 64px);
    }
}

.wstudio-about17 .wstudio-about17__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about17 .wstudio-about17__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-5, 24px);
}

.wstudio-about17 .wstudio-about17__tagline {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    letter-spacing: 0.04em;
    color: var(--wstudio-color-text-secondary, inherit);
    margin: 0 0 var(--wstudio-space-6, 32px);
}

/* Цвет/шрифт — на контейнере (текст без <p>) И повторно на вложенном <p>
   (текст с <p> — иначе тема Ranx перебивает наследование). См. DECISIONS.md
   2026-08-30, "Исправление предыдущего фикса". */
.wstudio-about17 .wstudio-about17__text {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-4, 20px);
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about17 .wstudio-about17__text p {
    margin: 0;
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about17 .wstudio-about17__stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-6, 32px);
    margin-bottom: var(--wstudio-space-7, 48px);
    padding-bottom: var(--wstudio-space-7, 48px);
    border-bottom: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
}

@media (min-width: 768px) and (max-width: 1023px) {
    .wstudio-about17 .wstudio-about17__stats {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* На ≥1024px цифры — вертикальный список с разделителями между ними,
   вместо сетки в 3 столбца. */
@media (min-width: 1024px) {
    .wstudio-about17 .wstudio-about17__stats {
        grid-template-columns: 1fr;
        gap: 0;
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: none;
    }

    .wstudio-about17 .wstudio-about17__stat {
        padding-block: var(--wstudio-space-5, 24px);
        border-bottom: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    }

    .wstudio-about17 .wstudio-about17__stat:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    .wstudio-about17 .wstudio-about17__stat:first-child {
        padding-top: 0;
    }
}

/* Иерархия размеров по убыванию (решение прототипа): крупный/средний/мелкий
   по позиции в списке. На <1024px размер везде одинаковый — иерархия имеет
   смысл только когда цифры идут одна под другой. */
.wstudio-about17 .wstudio-about17__stat-value {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: clamp(2rem, 1.5vw + 1.5rem, 2.75rem);
    line-height: 1.1;
    margin: 0 0 var(--wstudio-space-2, 8px);
}

@media (min-width: 1024px) {
    .wstudio-about17 .wstudio-about17__stat--lg .wstudio-about17__stat-value {
        font-size: clamp(2.5rem, 2vw + 2rem, 3.25rem);
    }

    .wstudio-about17 .wstudio-about17__stat--md .wstudio-about17__stat-value {
        font-size: clamp(2rem, 1.5vw + 1.5rem, 2.5rem);
    }

    .wstudio-about17 .wstudio-about17__stat--sm .wstudio-about17__stat-value {
        font-size: clamp(1.75rem, 1.25vw + 1.25rem, 2.125rem);
    }
}

.wstudio-about17 .wstudio-about17__stat-label {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    color: var(--wstudio-color-text-tertiary, inherit);
    margin: 0;
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_18_custom/style.css?17881065606749*/
/* 100_18_custom — Обо мне: Постоянные клиенты. Локальный namespace:
   .wstudio-about18-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx, свой padding-block не добавляется.

   overflow:hidden — на КОРНЕВОМ классе блока (.wstudio-about18, наш
   собственный, не общий .block/.block-wrap темы) — тикер использует
   width:max-content и уезжает за пределы контейнера, 1-в-1 прототип
   (.about-clients{overflow:hidden}). Проверено ранее (100_12_custom): у
   .block/.block-wrap темы Ranx своего overflow нет, значит наше правило
   ничего чужого не ломает и не конфликтует с position:sticky других
   блоков. */
/* overflow:hidden — своё, декоративный тикер (см. выше). background-color —
   фикс générик-бага Ranx BG_COLOR (class.php:1170-1171), см. DECISIONS.md
   2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about18 {
    overflow: hidden;
    background-color: transparent !important;
}

.wstudio-about18 .wstudio-about18__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about18 .wstudio-about18__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about18 .wstudio-about18__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about18 .wstudio-about18__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-6, 32px);
    margin-bottom: var(--wstudio-space-7, 48px);
}

@media (min-width: 1024px) {
    .wstudio-about18 .wstudio-about18__layout {
        grid-template-columns: 1.3fr 1fr;
        align-items: center;
        gap: var(--wstudio-space-8, 64px);
    }
}

.wstudio-about18 .wstudio-about18__intro {
    max-width: 68ch;
}

.wstudio-about18 .wstudio-about18__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about18 .wstudio-about18__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-4, 20px);
}

/* Цвет/шрифт — на контейнере (текст без <p>) И повторно на вложенном <p>
   (текст с <p> — иначе тема Ranx перебивает наследование). См. DECISIONS.md
   2026-08-30, "Исправление предыдущего фикса". */
.wstudio-about18 .wstudio-about18__text {
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about18 .wstudio-about18__text p {
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about18 .wstudio-about18__text p:last-child {
    margin-bottom: 0;
}

.wstudio-about18 .wstudio-about18__highlight {
    padding: var(--wstudio-space-6, 32px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-lg, 24px);
    text-align: center;
}

.wstudio-about18 .wstudio-about18__highlight-value {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: clamp(3rem, 3vw + 2rem, 4rem);
    line-height: 1;
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about18 .wstudio-about18__highlight-label {
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-label, 0.875rem);
    line-height: 1.5;
    color: var(--wstudio-color-text-secondary, inherit);
    margin: 0;
}

.wstudio-about18 .wstudio-about18__ticker {
    overflow: hidden;
    width: 100%;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

.wstudio-about18 .wstudio-about18__ticker-inner {
    display: flex;
    width: max-content;
    animation: wstudio-about18-scroll 42s linear infinite;
}

.wstudio-about18 .wstudio-about18__ticker:hover .wstudio-about18__ticker-inner,
.wstudio-about18 .wstudio-about18__ticker:focus-within .wstudio-about18__ticker-inner {
    animation-play-state: paused;
}

.wstudio-about18 .wstudio-about18__track {
    display: flex;
    gap: var(--wstudio-space-4, 20px);
    margin: 0;
    padding: 0 var(--wstudio-space-4, 20px) 0 0;
    list-style: none;
    white-space: nowrap;
}

.wstudio-about18 .wstudio-about18__track li {
    padding: var(--wstudio-space-3, 16px) var(--wstudio-space-5, 24px);
    font-family: var(--wstudio-font-body, inherit);
    font-weight: 500;
    font-size: var(--wstudio-fs-body, 1rem);
    color: var(--wstudio-color-text-secondary, inherit);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-sm, 8px);
}

@keyframes wstudio-about18-scroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .wstudio-about18 .wstudio-about18__ticker {
        -webkit-mask-image: none;
        mask-image: none;
    }

    .wstudio-about18 .wstudio-about18__ticker-inner {
        display: block;
        width: auto;
        animation: none;
        transform: none;
    }

    .wstudio-about18 .wstudio-about18__track--b {
        display: none;
    }

    .wstudio-about18 .wstudio-about18__track {
        flex-wrap: wrap;
        white-space: normal;
        padding-right: 0;
    }
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_19_custom/style.css?17881066024373*/
/* 100_19_custom — Обо мне: Образование и сертификации. Локальный
   namespace: .wstudio-about19-*. Токены — общий --wstudio-* слой
   (custom.css), не переопределяются здесь. Правило 7a: селекторы на голые
   p/ul — только с классом-предком блока. Вертикальные отступы блока —
   штатные indent-top/indent-bot классы Ranx, свой padding-block не
   добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about19 {
    background-color: transparent !important;
}

.wstudio-about19 .wstudio-about19__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about19 .wstudio-about19__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about19 .wstudio-about19__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about19 .wstudio-about19__intro {
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about19 .wstudio-about19__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about19 .wstudio-about19__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0;
}

.wstudio-about19 .wstudio-about19__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-6, 32px);
}

@media (min-width: 768px) {
    .wstudio-about19 .wstudio-about19__layout {
        grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
        align-items: start;
    }
}

/* Цвет/шрифт — на контейнере (текст без <p>) И повторно на вложенном <p>
   (текст с <p> — иначе тема Ranx перебивает наследование). См. DECISIONS.md
   2026-08-30, "Исправление предыдущего фикса". */
.wstudio-about19 .wstudio-about19__text {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-4, 20px);
    max-width: 62ch;
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about19 .wstudio-about19__text p {
    margin: 0;
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about19 .wstudio-about19__certs {
    padding: var(--wstudio-space-6, 32px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-md, 16px);
}

.wstudio-about19 .wstudio-about19__certs-label {
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-label, 0.875rem);
    color: var(--wstudio-color-text-tertiary, inherit);
    margin: 0 0 var(--wstudio-space-4, 20px);
}

.wstudio-about19 .wstudio-about19__badges {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-3, 16px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.wstudio-about19 .wstudio-about19__badges li {
    padding: var(--wstudio-space-3, 16px) var(--wstudio-space-4, 20px);
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.875rem;
    letter-spacing: 0.02em;
    color: var(--wstudio-color-text, inherit);
    background: var(--wstudio-color-bg-panel, rgba(255, 255, 255, 0.03));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-sm, 8px);
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_20_custom/style.css?17881066054731*/
/* 100_20_custom — Обо мне: Искусственный интеллект. Локальный namespace:
   .wstudio-about20-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul/ol — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx, свой padding-block не добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about20 {
    background-color: transparent !important;
}

.wstudio-about20 .wstudio-about20__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about20 .wstudio-about20__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about20 .wstudio-about20__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about20 .wstudio-about20__intro {
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about20 .wstudio-about20__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about20 .wstudio-about20__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0;
}

/* Порядок в DOM = порядок чтения (реальный нумерованный список, не
   декоративный) — текст первым, схема из 4 шагов справа на ≥1024px. */
.wstudio-about20 .wstudio-about20__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-6, 32px);
}

@media (min-width: 1024px) {
    .wstudio-about20 .wstudio-about20__layout {
        grid-template-columns: 1.3fr 1fr;
        align-items: start;
        gap: var(--wstudio-space-8, 64px);
    }
}

/* Цвет/шрифт — на контейнере (текст без <p>) И повторно на вложенном <p>
   (текст с <p> — иначе тема Ranx перебивает наследование). См. DECISIONS.md
   2026-08-30, "Исправление предыдущего фикса". */
.wstudio-about20 .wstudio-about20__text {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-4, 20px);
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about20 .wstudio-about20__text p {
    margin: 0;
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.65;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about20 .wstudio-about20__scheme {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-3, 16px);
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: wstudio-about20-step;
}

.wstudio-about20 .wstudio-about20__step {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: var(--wstudio-space-4, 20px) var(--wstudio-space-4, 20px) var(--wstudio-space-4, 20px) var(--wstudio-space-7, 48px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-md, 16px);
    counter-increment: wstudio-about20-step;
}

.wstudio-about20 .wstudio-about20__step-label {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 700;
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    color: var(--wstudio-color-text, inherit);
    text-align: left;
}

.wstudio-about20 .wstudio-about20__step::before {
    content: counter(wstudio-about20-step, decimal-leading-zero);
    position: absolute;
    top: var(--wstudio-space-2, 8px);
    left: var(--wstudio-space-3, 16px);
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.6875rem;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_21_custom/style.css?17881066074108*/
/* 100_21_custom — Обо мне: Принципы работы. Локальный namespace:
   .wstudio-about21-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul/ol — только
   с классом-предком блока. Вертикальные отступы блока — штатные
   indent-top/indent-bot классы Ranx, свой padding-block не добавляется. */

/* Générик-баг Ranx BG_COLOR (class.php:1170-1171) — форсируем прозрачный
   фон, см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about21 {
    background-color: transparent !important;
}

.wstudio-about21 .wstudio-about21__container {
    position: relative;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about21 .wstudio-about21__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about21 .wstudio-about21__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

.wstudio-about21 .wstudio-about21__intro {
    margin-bottom: var(--wstudio-space-7, 48px);
}

.wstudio-about21 .wstudio-about21__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-3, 16px);
}

.wstudio-about21 .wstudio-about21__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0;
}

/* Открытый список карточек, без аккордеона ни на одном разрешении — все
   принципы видны сразу (решение прототипа). */
.wstudio-about21 .wstudio-about21__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wstudio-space-5, 24px);
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 768px) {
    .wstudio-about21 .wstudio-about21__list {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

.wstudio-about21 .wstudio-about21__item {
    display: flex;
    gap: var(--wstudio-space-4, 20px);
    padding: var(--wstudio-space-6, 32px);
    background: var(--wstudio-color-bg-card, rgba(255, 255, 255, 0.05));
    border: 1px solid var(--wstudio-border-hairline, rgba(255, 255, 255, 0.12));
    border-radius: var(--wstudio-radius-md, 16px);
}

.wstudio-about21 .wstudio-about21__item-num {
    flex: none;
    font-family: var(--wstudio-font-mono, monospace);
    font-size: 0.8125rem;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
}

.wstudio-about21 .wstudio-about21__item-title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 700;
    font-size: var(--wstudio-fs-h3, clamp(1.25rem, 1rem + 1.5vw, 1.75rem));
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-2, 8px);
}

/* Цвет/шрифт — на контейнере (текст без <p>) И повторно на вложенном <p>
   (текст с <p> — иначе тема Ranx перебивает наследование). См. DECISIONS.md
   2026-08-30, "Исправление предыдущего фикса". */
.wstudio-about21 .wstudio-about21__item-text {
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about21 .wstudio-about21__item-text p {
    margin: 0;
    font-size: var(--wstudio-fs-body, 1rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

/* End */


/* Start:/bitrix/components/ranx/block.landing/templates/100_22_custom/style.css?17881065664728*/
/* 100_22_custom — Обо мне: Финальный CTA. Локальный namespace:
   .wstudio-about22-*. Токены — общий --wstudio-* слой (custom.css), не
   переопределяются здесь. Правило 7a: селекторы на голые p/ul/ol — только
   с классом-предком блока. Композиция сознательно перекликается с
   100_10_custom (та же фоновая сетка + ambient-свечения), чтобы страница
   «замыкалась» визуально на первый экран (решение прототипа). */

/* background-color — фикс générик-бага Ranx BG_COLOR (class.php:1170-1171),
   см. DECISIONS.md 2026-08-30 «Баг générик BG_COLOR». */
.wstudio-about22 {
    position: relative;
    overflow: hidden;
    text-align: center;
    background-color: transparent !important;
}

.wstudio-about22::before,
.wstudio-about22::after {
    content: '';
    position: absolute;
    z-index: 0;
    pointer-events: none;
    border-radius: 50%;
    filter: blur(60px);
}

.wstudio-about22::before {
    bottom: -12%;
    left: -8%;
    width: 44%;
    aspect-ratio: 1;
    background: radial-gradient(closest-side, var(--wstudio-glow-ambient-blue, rgba(61, 124, 255, 0.35)), transparent 70%);
}

.wstudio-about22::after {
    top: -10%;
    right: -6%;
    width: 36%;
    aspect-ratio: 1;
    background: radial-gradient(closest-side, var(--wstudio-glow-ambient-violet, rgba(139, 92, 246, 0.3)), transparent 70%);
}

.wstudio-about22 .wstudio-about22__container {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: var(--wstudio-container-max, 1440px);
    margin-inline: auto;
    padding-inline: var(--wstudio-space-4, 16px);
}

@media (min-width: 768px) {
    .wstudio-about22 .wstudio-about22__container {
        padding-inline: var(--wstudio-space-6, 32px);
    }
}

@media (min-width: 1024px) {
    .wstudio-about22 .wstudio-about22__container {
        padding-inline: var(--wstudio-space-7, 48px);
    }
}

/* Ширина контента — по ширине контейнера, как у остальных блоков
   100_10…100_21_custom (ни один из них не сужает текст отдельным ch-лимитом
   внутри контейнера). Отклонение от прототипа (там был свой max-width:62ch
   у .about-cta__content) — по прямому запросу пользователя 2026-08-30,
   ради визуальной консистентности ширины текста между всеми 13 блоками
   about.html; about.html/about.css не редактируются. */
.wstudio-about22 .wstudio-about22__content {
    margin-inline: auto;
}

.wstudio-about22 .wstudio-about22__eyebrow {
    font-family: var(--wstudio-font-mono, monospace);
    font-size: var(--wstudio-fs-label, 0.875rem);
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wstudio-color-accent-blue, #3D7CFF);
    margin: 0 0 var(--wstudio-space-4, 20px);
}

.wstudio-about22 .wstudio-about22__title {
    font-family: var(--wstudio-font-heading, inherit);
    font-weight: 800;
    font-size: var(--wstudio-fs-h2, clamp(2rem, 1rem + 3vw, 3.25rem));
    line-height: 1.15;
    color: var(--wstudio-color-text, inherit);
    margin: 0 0 var(--wstudio-space-5, 24px);
}

/* Цвет/шрифт — на контейнере (текст без <p>) И повторно на вложенном <p>
   (текст с <p> — иначе тема Ranx перебивает наследование). См. DECISIONS.md
   2026-08-30, "Исправление предыдущего фикса". Тело текста CTA — светлее
   прототипа (правило от 2026-08-30, --wstudio-color-text не -secondary). */
.wstudio-about22 .wstudio-about22__text {
    display: flex;
    flex-direction: column;
    gap: var(--wstudio-space-3, 12px);
    margin-bottom: var(--wstudio-space-6, 32px);
    font-family: var(--wstudio-font-body, inherit);
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about22 .wstudio-about22__text p {
    margin: 0;
    font-size: var(--wstudio-fs-body-lg, 1.125rem);
    line-height: 1.6;
    color: var(--wstudio-color-text, inherit);
}

.wstudio-about22 .wstudio-about22__actions {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--wstudio-space-3, 12px);
    max-width: 640px;
    margin-inline: auto;
}

/* End */
/* /bitrix/components/ranx/block.landing/templates/100_10_custom/style.css?17881065826915 */
/* /bitrix/components/ranx/block.landing/templates/100_11_custom/style.css?17881065849127 */
/* /bitrix/components/ranx/block.landing/templates/100_12_custom/style.css?17881065876095 */
/* /bitrix/components/ranx/block.landing/templates/100_13_custom/style.css?17881065906048 */
/* /bitrix/components/ranx/block.landing/templates/100_14_custom/style.css?17881065924716 */
/* /bitrix/components/ranx/block.landing/templates/100_15_custom/style.css?17881065956499 */
/* /bitrix/components/ranx/block.landing/templates/100_16_custom/style.css?17881065974854 */
/* /bitrix/components/ranx/block.landing/templates/100_17_custom/style.css?17881066006030 */
/* /bitrix/components/ranx/block.landing/templates/100_18_custom/style.css?17881065606749 */
/* /bitrix/components/ranx/block.landing/templates/100_19_custom/style.css?17881066024373 */
/* /bitrix/components/ranx/block.landing/templates/100_20_custom/style.css?17881066054731 */
/* /bitrix/components/ranx/block.landing/templates/100_21_custom/style.css?17881066074108 */
/* /bitrix/components/ranx/block.landing/templates/100_22_custom/style.css?17881065664728 */