/* ============================================================
   WeMakeTheme — FlexTime
   Цвета, типографика, сетка, компоненты, адаптив
   ============================================================ */

/* ---------- CSS Custom Properties ---------- */
:root {
    --c-black: #0d0d0d;
    --c-dark: #1a1a1a;
    --c-dark-alt: #232323;
    --c-grey-bg: #f2f2f2;
    /* Секции как в эталонном макете Tilda (t050 + t820 «Особые возможности») */
    --c-section-soft-bg: #f1f2f4;
    --c-border-card: #e0e6ed;
    /* Волна t796 над блоком selection (как в эталонном макете Tilda) */
    --wave-selection-h: clamp(48px, 4vw, 80px);
    --wave-t796-green: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 200' preserveAspectRatio='none'%3E%3Cpath fill='%2366c92a' d='M1280 200H0V0l1280 195.5v4.5z'/%3E%3C/svg%3E");
    --c-white: #ffffff;
    --c-green: #66c92a;
    --c-green-dark: #3abf3f;
    --c-text: #333333;
    --c-text-light: #888888;
    --c-border: #e0e0e0;
    /* Линии блока disclaimer — приглушённый зелёный (как на макете) */
    --disclaimer-line: #c5e0b4;
    --font: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --radius: 12px;
    --radius-sm: 8px;
    --transition: .25s ease;
    --container: 1200px;
    --gap: 1.5rem;
    --wave-help-if-h: 72px;
    /* Верхняя волна секции (та же форма path, что у help-if::before) */
    --wave-top-svg-white: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 96' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0,96 L0,48 Q240,8 480,48 T960,48 T1440,48 L1440,96 Z'/%3E%3C/svg%3E");
    --wave-top-svg-grey-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 96' preserveAspectRatio='none'%3E%3Cpath fill='%23f2f2f2' d='M0,96 L0,48 Q240,8 480,48 T960,48 T1440,48 L1440,96 Z'/%3E%3C/svg%3E");
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, ul, ol, figure, blockquote { margin: 0; padding: 0; }
ul, ol { list-style: none; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; height: auto; }
button, input, textarea, select { font: inherit; color: inherit; }

/* ---------- Base ---------- */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
    font-family: var(--font);
    font-size: 16px;
    line-height: 1.6;
    color: var(--c-text);
    background: var(--c-white);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

/* ---------- Utility ---------- */
.visually-hidden {
    position: absolute; width: 1px; height: 1px;
    margin: -1px; padding: 0; overflow: hidden;
    clip: rect(0,0,0,0); border: 0; white-space: nowrap;
}
.container {
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 var(--gap);
}
.accent { color: var(--c-green); }
.section-title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 42px; font-weight: 900;
    text-align: center;
    margin-bottom: 1.5rem;
    line-height: 1.2;
}

/* ---------- Buttons ---------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .85rem 2rem;
    border-radius: 100px;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-weight: 400; font-size: 20px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
    white-space: nowrap;
}
.btn--primary {
    background: var(--c-green); color: var(--c-white); border-color: var(--c-green);
}
.btn--primary:hover, .btn--primary:focus-visible {
    background: var(--c-green-dark); border-color: var(--c-green-dark); color: var(--c-white);
}
.btn--outline {
    background: transparent; color: var(--c-white); border-color: var(--c-white);
}
.btn--outline:hover, .btn--outline:focus-visible {
    background: var(--c-white); color: var(--c-black);
}
.btn--outline-light {
    background: transparent; color: var(--c-white); border-color: var(--c-white);
}
.btn--outline-light:hover, .btn--outline-light:focus-visible {
    background: var(--c-white); color: var(--c-dark);
}

/* ---------- Checkbox (кастомный вид на тёмном и светлом фоне) ---------- */
.checkbox {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    font-size: 14px;
    line-height: 1.45;
    cursor: pointer;
    color: var(--c-text-light);
}
/* Текст не перекрывает hit-target нативного чекбокса (flex-порядок отрисовки) */
.checkbox > span {
    position: relative;
    z-index: 0;
    min-width: 0;
}
.checkbox input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    z-index: 1;
    width: 1.125rem;
    height: 1.125rem;
    min-width: 1.125rem;
    margin: 0.12rem 0 0;
    flex-shrink: 0;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 4px;
    background: var(--c-white);
    cursor: pointer;
    transition: border-color var(--transition), background-color var(--transition), box-shadow var(--transition);
    box-sizing: border-box;
    vertical-align: top;
}
.checkbox input[type="checkbox"]:hover {
    border-color: rgba(0, 0, 0, .35);
}
.checkbox input[type="checkbox"]:focus {
    outline: none;
}
.checkbox input[type="checkbox"]:focus-visible {
    box-shadow: 0 0 0 2px rgba(102, 201, 42, .45);
    border-color: var(--c-green);
}
.checkbox input[type="checkbox"]:checked {
    background-color: var(--c-green);
    border-color: var(--c-green);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1 5l3 3 7-7'/%3E%3C/svg%3E");
    background-size: 10px 8px;
    background-position: center;
    background-repeat: no-repeat;
}
.checkbox input[type="checkbox"]:checked:focus-visible {
    box-shadow: 0 0 0 2px rgba(102, 201, 42, .5);
}
/* Тёмные секции: светлая рамка у невыбранного; :not(:checked) — чтобы не перебить :checked-стили (зелёный фон + галочка) */
.site-footer .checkbox input[type="checkbox"]:not(:checked),
.contact-form__checks .checkbox input[type="checkbox"]:not(:checked),
.inv-form .checkbox input[type="checkbox"]:not(:checked) {
    border-color: rgba(255, 255, 255, .45);
    background-color: rgba(255, 255, 255, .98);
}
.site-footer .checkbox input[type="checkbox"]:not(:checked):hover,
.contact-form__checks .checkbox input[type="checkbox"]:not(:checked):hover,
.inv-form .checkbox input[type="checkbox"]:not(:checked):hover {
    border-color: rgba(255, 255, 255, .65);
}
.checkbox a { color: var(--c-green); text-decoration: underline; }
.checkbox a:hover { text-decoration: none; }

/* Слои: формы над обычным контентом; видеовиджет 10180 (см. video-widget.css) — над формами; шапка 10200 и моб. оверлей 20000 — выше виджета */
form.contact-form,
form.subscribe-form,
form.inv-form {
    position: relative;
    z-index: 10050;
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
    position: sticky; top: 0; z-index: 10200;
    color: var(--c-white);
    padding: .6rem var(--gap);
    display: flex; justify-content: center;
    background: transparent;
}
.site-header__inner {
    display: flex; align-items: center; gap: 1.5rem;
    width: 100%;
    max-width: var(--container);
    background: rgba(30,34,40,.92);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-radius: 50px;
    padding: .5rem 1.5rem .5rem 1.2rem;
    border: 1px solid rgba(255,255,255,.06);
}
.site-header__logo { flex-shrink: 0; display: flex; align-items: center; }
.logo-img { display: block; height: 48px; width: auto; }

.site-header__nav { margin-left: auto; }
.site-header__cta {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px; font-weight: 400; padding: .6rem 1.6rem;
}

/* Main navigation */
.main-nav { display: flex; gap: 2rem; }
.main-nav__link {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px; font-weight: 500; color: var(--c-white);
    transition: color var(--transition);
}
.main-nav__link:hover, .main-nav__link:focus-visible { color: var(--c-green); }

/* Burger */
.site-header__burger {
    display: none; flex-direction: column; gap: 5px;
    background: none; border: none; cursor: pointer; padding: .5rem;
}
.site-header__burger span {
    display: block; width: 24px; height: 2px; background: var(--c-white);
    border-radius: 2px; transition: transform var(--transition), opacity var(--transition);
}

/* Mobile menu */
.mobile-menu {
    position: fixed; inset: 0; z-index: 20000;
    pointer-events: none; visibility: hidden;
    transition: visibility .3s;
}
.mobile-menu.is-open { pointer-events: auto; visibility: visible; }
.mobile-menu__overlay {
    position: absolute; inset: 0;
    background: rgba(0,0,0,.6); opacity: 0;
    transition: opacity .3s;
}
.mobile-menu.is-open .mobile-menu__overlay { opacity: 1; }
.mobile-menu__body {
    position: absolute; top: 0; right: 0;
    width: 280px; max-width: 80vw; height: 100%;
    background: var(--c-dark); padding: 2rem 1.5rem;
    transform: translateX(100%); transition: transform .3s ease;
    display: flex; flex-direction: column; gap: 2rem;
}
.mobile-menu.is-open .mobile-menu__body { transform: translateX(0); }
.mobile-menu__close {
    align-self: flex-end; background: none; border: none;
    color: var(--c-white); font-size: 2rem; cursor: pointer; line-height: 1;
}
.mobile-menu__list { display: flex; flex-direction: column; gap: 1.2rem; }
.mobile-menu__list a {
    color: var(--c-white); font-size: 1.1rem; font-weight: 600;
    transition: color var(--transition);
}
.mobile-menu__list a:hover { color: var(--c-green); }
.mobile-menu__cta { text-align: center; }

/* ============================================================
   HERO
   ============================================================ */
.hero {
    background: #0a0a0a;
    color: var(--c-white);
    text-align: center;
    /* Нижний отступ: «воздух» между карточками преимуществ и волной help-if */
    padding: 0 0 5.5rem;
    position: relative;
    overflow: hidden;
}
.hero::before,
.hero::after {
    content: '';
    position: absolute;
    top: -20%; left: -20%; width: 140%; height: 140%;
    pointer-events: none;
    z-index: 0;
}
.hero::before {
    background:
        radial-gradient(ellipse 40% 50% at 60% 35%, rgba(30,140,50,.5) 0%, transparent 70%),
        radial-gradient(ellipse 30% 40% at 25% 65%, rgba(20,100,35,.35) 0%, transparent 70%);
    animation: heroPulse1 7s ease-in-out infinite alternate;
}
.hero::after {
    background:
        radial-gradient(ellipse 35% 45% at 75% 60%, rgba(25,110,40,.4) 0%, transparent 70%),
        radial-gradient(ellipse 45% 35% at 20% 30%, rgba(35,130,45,.3) 0%, transparent 70%),
        radial-gradient(ellipse 25% 30% at 50% 75%, rgba(20,90,30,.25) 0%, transparent 70%);
    animation: heroPulse2 9s ease-in-out infinite alternate;
}
/* .mobile-menu — вне этого правила: иначе перебивается position:fixed и меню режется overflow hero */
/* .site-header — вне правила: иначе перебивается position:sticky и z-index шапки */
.hero > *:not(.mobile-menu):not(.site-header) { position: relative; z-index: 1; }

@keyframes heroPulse1 {
    0%   { opacity: .5; transform: scale(1); }
    50%  { opacity: 1;  transform: scale(1.12); }
    100% { opacity: .35; transform: scale(.95); }
}
@keyframes heroPulse2 {
    0%   { opacity: .35; transform: scale(1.08); }
    50%  { opacity: .75; transform: scale(.92); }
    100% { opacity: .5;  transform: scale(1.15); }
}
.hero .site-header {
    margin-bottom: 2.5rem;
}

/* Страница «О проекте»: компактный hero без блока преимуществ */
.about-hero {
    padding-bottom: 3rem;
}
.about-hero .hero__inner {
    padding-bottom: 1rem;
}
.about-hero__lead {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(18px, 2.5vw, 22px);
    font-weight: 400;
    line-height: 1.5;
    color: #ffffff;
    max-width: 42rem;
    margin: 0 auto;
}
.about-body {
    padding: 3rem 0 4.5rem;
    background: var(--c-white);
    color: var(--c-text);
}
.about-body__inner {
    max-width: 720px;
    margin: 0 auto;
}
.about-body__inner p {
    font-size: clamp(16px, 1.2vw, 18px);
    line-height: 1.65;
    margin: 0 0 1.25rem;
}
.about-body__inner p:last-child {
    margin-bottom: 0;
}

/* Страница «Заказчикам»: hero B2B (двухколоночный блок) */
.customers-hero.hero.about-hero {
    padding-bottom: 4rem;
}
.customers-hero .hero__inner {
    text-align: left;
    padding-bottom: 0;
}
.customers-hero-b2b__grid {
    display: grid;
    gap: 2.25rem;
    align-items: start;
    /* Ячейки сетки по умолчанию имеют min-width: auto — вложенная сетка карточек
       может не сжиматься и «выпирать» вправо за пределы .container на узких экранах */
    min-width: 0;
}
@media (min-width: 1024px) {
    .customers-hero-b2b__grid {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
        gap: 2.5rem 3rem;
    }
}
.customers-hero-b2b__badge {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin: 0 0 1.25rem;
    padding: .4rem .95rem .45rem .75rem;
    border-radius: 100px;
    background: rgba(102, 201, 42, 0.14);
    border: 1px solid rgba(102, 201, 42, 0.35);
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: rgba(180, 235, 140, 0.98);
}
.customers-hero-b2b__badge-icon {
    flex-shrink: 0;
    display: block;
}
.customers-hero-b2b__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(28px, 4.2vw, 44px);
    font-weight: 900;
    font-style: normal;
    line-height: 1.12;
    text-transform: none;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0 0 1rem;
    max-width: 17em;
}
.customers-hero-b2b__title-accent {
    color: var(--c-green);
}
.customers-hero-b2b__sub {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(17px, 2vw, 20px);
    font-weight: 400;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.78);
    margin: 0 0 1.75rem;
    max-width: 26rem;
}
.customers-hero-b2b__cta {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: 1.35rem;
    padding-left: 1.75rem;
    padding-right: 1.5rem;
    box-shadow: 0 4px 28px rgba(102, 201, 42, 0.38);
}
.customers-hero-b2b__cta:hover,
.customers-hero-b2b__cta:focus-visible {
    box-shadow: 0 6px 32px rgba(102, 201, 42, 0.48);
}
.customers-hero-b2b__cta-arrow {
    flex-shrink: 0;
}
.customers-hero-b2b__trust {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.75rem;
}
.customers-hero-b2b__trust li {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.88);
}
.customers-hero-b2b__trust img {
    flex-shrink: 0;
    display: block;
}
.customers-hero-b2b__cards {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    /* Сброс UA/WebKit для списков: иначе padding-inline-start у ul даёт лишний отступ слева без пары справа */
    padding-inline: 0;
    -webkit-padding-start: 0;
    -webkit-padding-end: 0;
}
@media (min-width: 480px) {
    .customers-hero-b2b__cards {
        /* minmax(0,1fr) вместо 1fr — иначе min-content дочерних карточек раздувает колонки */
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}
.customers-hero-b2b__card {
    min-width: 0;
    margin: 0;
    padding: 1.25rem 1.2rem 1.35rem;
    border-radius: var(--radius);
    background: rgba(35, 39, 46, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    /* Длинные строки из CMS (|raw) иначе вылезают вправо; при overflow-x на body визуально «съедается» только правый край */
    overflow-wrap: anywhere;
    word-wrap: break-word;
}
.customers-hero-b2b__card-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--c-green);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}
.customers-hero-b2b__card-icon svg {
    display: block;
}
.customers-hero-b2b__card-title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(15px, 1.5vw, 17px);
    font-weight: 800;
    line-height: 1.25;
    color: #fff;
    margin: 0 0 .5rem;
    max-width: 100%;
    overflow-wrap: anywhere;
}
.customers-hero-b2b__card-text {
    font-family: var(--font);
    font-size: 13px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.58);
    margin: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}
.customers-hero-b2b__notes {
    margin-top: 2.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.customers-hero-b2b__notes p {
    font-family: var(--font);
    font-size: 12px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.42);
    margin: 0 0 .35rem;
}
.customers-hero-b2b__notes p:last-child {
    margin-bottom: 0;
}
@media (max-width: 1023px) {
    /* Одна колонка явно — одинаковая ширина строк hero и списка карточек на планшетах/телефонах */
    .customers-hero-b2b__grid {
        grid-template-columns: minmax(0, 1fr);
    }
    .customers-hero.hero.about-hero {
        padding-bottom: 3.25rem;
    }
    .customers-hero-b2b__title {
        max-width: none;
    }
    .customers-hero-b2b__sub {
        max-width: none;
    }
}
@media (max-width: 479px) {
    .customers-hero-b2b__trust {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem;
    }
}
/* Сравнение вариантов трудоустройства (страница «Заказчикам») */
.employment-compare {
    position: relative;
    z-index: 2;
    background: var(--c-white);
    padding: 3.5rem 0 4rem;
    color: var(--c-text);
}
.employment-compare__title {
    margin-bottom: 0.75rem;
}
.employment-compare__lead {
    text-align: center;
    max-width: 36rem;
    margin: 0 auto 2rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(16px, 1.8vw, 19px);
    font-weight: 400;
    line-height: 1.5;
    color: var(--c-text-light);
}
.employment-compare__scroll {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    margin: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    border-radius: 16px;
    border: 1px solid var(--c-border-card);
    background: var(--c-white);
    box-shadow:
        0 8px 32px rgba(13, 13, 13, 0.07),
        0 2px 8px rgba(13, 13, 13, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: box-shadow 0.3s ease, border-color 0.25s ease;
}
.employment-compare__scroll:focus-visible {
    outline: 2px solid var(--c-green);
    outline-offset: 3px;
}
@media (hover: hover) and (pointer: fine) {
    .employment-compare__scroll:hover {
        border-color: rgba(102, 201, 42, 0.35);
        box-shadow:
            0 14px 44px rgba(13, 13, 13, 0.1),
            0 4px 14px rgba(102, 201, 42, 0.08),
            inset 0 1px 0 rgba(255, 255, 255, 0.95);
    }
}
.employment-compare__table {
    width: 100%;
    min-width: 720px;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 16px;
    overflow: hidden;
    font-family: var(--font);
    font-size: 14px;
    line-height: 1.45;
}
.employment-compare__table thead th {
    background: linear-gradient(180deg, #141414 0%, var(--c-black) 100%);
    color: var(--c-white);
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-align: center;
    vertical-align: middle;
    padding: 1rem 0.85rem;
    border-bottom: none;
    transition: background 0.25s ease, color 0.2s ease;
}
.employment-compare__table thead th:first-child {
    text-align: left;
    padding-left: 1.25rem;
}
@media (hover: hover) and (pointer: fine) {
    .employment-compare__table thead th:not(.employment-compare__th-platform):hover {
        background: linear-gradient(180deg, #1a1f1a 0%, #121212 100%);
        color: #fff;
    }
}
.employment-compare__table thead th.employment-compare__th-platform {
    background: linear-gradient(180deg, #74d03a 0%, var(--c-green) 45%, #5ab028 100%);
    color: var(--c-white);
    padding: 1rem 1rem 1.1rem;
    position: relative;
    transition: filter 0.25s ease, background 0.25s ease;
}
@media (hover: hover) and (pointer: fine) {
    .employment-compare__table thead th.employment-compare__th-platform:hover {
        filter: brightness(1.06) saturate(1.05);
    }
}
.employment-compare__th-platform-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    text-align: center;
}
.employment-compare__th-platform-title {
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
}
.employment-compare__th-badge {
    display: inline-block;
    padding: 0.2rem 0.65rem 0.28rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.38);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.95);
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.2s ease;
}
@media (hover: hover) and (pointer: fine) {
    .employment-compare__table thead th.employment-compare__th-platform:hover .employment-compare__th-badge {
        background: rgba(255, 255, 255, 0.34);
        border-color: rgba(255, 255, 255, 0.55);
    }
}
.employment-compare__table tbody tr:not(:last-child) th,
.employment-compare__table tbody tr:not(:last-child) td {
    border-bottom: 1px solid var(--c-border-card);
}
.employment-compare__table tbody th {
    background: var(--c-white);
    text-align: left;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-weight: 800;
    font-size: 14px;
    color: var(--c-text);
    padding: 1rem 1rem 1rem 1.25rem;
    vertical-align: middle;
    width: 22%;
    transition: background-color 0.22s ease, color 0.2s ease, box-shadow 0.22s ease;
}
.employment-compare__table tbody td {
    background: var(--c-white);
    text-align: center;
    color: var(--c-text);
    padding: 1rem 0.85rem;
    vertical-align: middle;
    transition: background-color 0.22s ease, color 0.2s ease, box-shadow 0.22s ease;
}
.employment-compare__table tbody td.employment-compare__cell-platform {
    background: linear-gradient(90deg, rgba(102, 201, 42, 0.11) 0%, rgba(102, 201, 42, 0.06) 100%);
    text-align: left;
    padding: 1rem 1.1rem;
    border-left: 1px solid rgba(102, 201, 42, 0.28);
    box-shadow: inset 0 0 0 0 transparent;
}
.employment-compare__platform-cell {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    text-align: left;
}
.employment-compare__check {
    flex-shrink: 0;
    margin-top: 2px;
    display: block;
    transition: transform 0.22s ease, filter 0.22s ease;
}
@media (hover: hover) and (pointer: fine) {
    .employment-compare__table tbody tr:hover th {
        background: #f0f3f6;
    }
    .employment-compare__table tbody tr:hover td:not(.employment-compare__cell-platform) {
        background: #f0f3f6;
        color: var(--c-black);
    }
    .employment-compare__table tbody tr:hover td.employment-compare__cell-platform {
        background: linear-gradient(90deg, rgba(102, 201, 42, 0.22) 0%, rgba(102, 201, 42, 0.12) 100%);
        box-shadow: inset 4px 0 0 0 var(--c-green);
    }
    .employment-compare__table tbody tr:hover .employment-compare__check {
        transform: scale(1.12);
        filter: drop-shadow(0 2px 4px rgba(102, 201, 42, 0.35));
    }
}
@media (prefers-reduced-motion: reduce) {
    .employment-compare__scroll,
    .employment-compare__table thead th,
    .employment-compare__th-badge,
    .employment-compare__table tbody th,
    .employment-compare__table tbody td,
    .employment-compare__check {
        transition: none;
    }
}
@media (prefers-reduced-motion: reduce) and (hover: hover) and (pointer: fine) {
    .employment-compare__table tbody tr:hover .employment-compare__check {
        transform: none;
        filter: none;
    }
}
@media (max-width: 767px) {
    .employment-compare {
        padding: 2.5rem 0 3rem;
    }
    /* Без отрицательных margin: отступы только от .container — слева и справа одинаково */
    .employment-compare__scroll {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
        border-radius: 12px;
        box-shadow:
            0 8px 28px rgba(13, 13, 13, 0.08),
            0 2px 8px rgba(13, 13, 13, 0.04);
    }
    .employment-compare__table {
        min-width: 720px;
        font-size: 13px;
        border-radius: 12px;
        box-shadow: none;
    }
    .employment-compare__table thead th,
    .employment-compare__table tbody th,
    .employment-compare__table tbody td {
        padding: 0.85rem 0.65rem;
    }
    .employment-compare__table tbody th {
        padding-left: 1rem;
    }
    /* Воздух у правого края при прокрутке до конца */
    .employment-compare__table thead th:last-child,
    .employment-compare__table tbody td:last-child {
        padding-right: 1rem;
    }
}

/* «Как это работает» — страница «Заказчикам» */
.customers-how {
    position: relative;
    z-index: 2;
    background: var(--c-section-soft-bg);
    padding: 3.75rem 0 4.25rem;
    color: var(--c-text);
}
.customers-how__title {
    margin-bottom: 0.75rem;
}
.customers-how__lead {
    text-align: center;
    max-width: 34rem;
    margin: 0 auto 2.75rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(16px, 1.8vw, 19px);
    font-weight: 400;
    line-height: 1.5;
    color: var(--c-text-light);
}
.customers-how__track {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    position: relative;
}
.customers-how__track::before {
    content: '';
    position: absolute;
    left: 7%;
    right: 7%;
    top: 36px;
    height: 3px;
    background: linear-gradient(
        90deg,
        rgba(102, 201, 42, 0.2),
        rgba(102, 201, 42, 0.75) 50%,
        rgba(102, 201, 42, 0.2)
    );
    border-radius: 2px;
    z-index: 0;
    pointer-events: none;
}
.customers-how__step {
    flex: 1;
    position: relative;
    z-index: 1;
    text-align: center;
    min-width: 0;
    padding: 0 0.2rem;
}
.customers-how__icon-wrap {
    position: relative;
    width: 72px;
    height: 72px;
    margin: 0 auto 1.15rem;
    border-radius: 16px;
    background: linear-gradient(145deg, #7dd94a 0%, var(--c-green) 45%, #52b022 100%);
    box-shadow:
        0 8px 22px rgba(102, 201, 42, 0.32),
        0 2px 6px rgba(0, 0, 0, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.customers-how__step-num {
    position: absolute;
    top: -6px;
    right: -6px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--c-black);
    color: #fff;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
    z-index: 2;
}
.customers-how__icon svg {
    display: block;
}
.customers-how__step-title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(13px, 1.15vw, 16px);
    font-weight: 800;
    line-height: 1.28;
    margin: 0 0 0.45rem;
    color: var(--c-black);
}
.customers-how__step-text {
    font-family: var(--font);
    font-size: clamp(12px, 1.1vw, 13px);
    line-height: 1.45;
    margin: 0;
    color: var(--c-text-light);
}
@media (hover: hover) and (pointer: fine) {
    .customers-how__step:hover .customers-how__icon-wrap {
        transform: translateY(-4px);
        box-shadow:
            0 14px 32px rgba(102, 201, 42, 0.4),
            0 4px 12px rgba(0, 0, 0, 0.14);
    }
}
@media (prefers-reduced-motion: reduce) {
    .customers-how__icon-wrap {
        transition: none;
    }
}
@media (prefers-reduced-motion: reduce) and (hover: hover) and (pointer: fine) {
    .customers-how__step:hover .customers-how__icon-wrap {
        transform: none;
    }
}
@media (max-width: 960px) {
    .customers-how__track {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    .customers-how__track::before {
        left: 35px;
        right: auto;
        top: 40px;
        bottom: 40px;
        width: 3px;
        height: auto;
        background: linear-gradient(
            180deg,
            rgba(102, 201, 42, 0.2),
            rgba(102, 201, 42, 0.75) 50%,
            rgba(102, 201, 42, 0.2)
        );
    }
    .customers-how__step {
        display: grid;
        grid-template-columns: 72px 1fr;
        grid-template-rows: auto auto;
        column-gap: 1.15rem;
        row-gap: 0.3rem;
        text-align: left;
        padding: 0 0 1.5rem;
    }
    .customers-how__step:last-child {
        padding-bottom: 0;
    }
    .customers-how__icon-wrap {
        grid-row: 1 / span 2;
        margin: 0;
        align-self: start;
    }
    .customers-how__step-title {
        align-self: end;
    }
    .customers-how__step-text {
        align-self: start;
    }
}
@media (max-width: 480px) {
    .customers-how {
        padding: 2.75rem 0 3.25rem;
    }
    .customers-how__lead {
        margin-bottom: 2rem;
    }
    .customers-how__track::before {
        left: 34px;
    }
}

#content > section.customers-section,
.customers-section {
    position: relative;
    z-index: 2;
    background: var(--c-grey-bg);
    /* Было 4rem сверху/снизу — уменьшено в 3 раза (и десктоп, и мобильные) */
    padding: calc(4rem / 3) 0;
}
.customers-section__lead {
    text-align: center;
    max-width: 40rem;
    margin: 0 auto 2rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(17px, 2vw, 20px);
    font-weight: 400;
    line-height: 1.5;
    color: var(--c-text);
}

/* Калькулятор экономии (страница «Заказчикам», в стиле блоков сравнения / карточек темы) */
.savings-calc {
    position: relative;
    z-index: 2;
    background: var(--c-section-soft-bg);
    padding: 0;
    color: var(--c-text);
    border-top: 1px solid var(--c-border-card);
}
/* Внутренний контейнер — белая панель с обводкой и тенью, как employment-compare */
.savings-calc > .container {
    background: var(--c-white);
    border: 1px solid var(--c-border-card);
    border-radius: 20px;
    padding: 2.5rem var(--gap) 3rem;
    box-shadow:
        0 8px 32px rgba(13, 13, 13, 0.07),
        0 2px 8px rgba(13, 13, 13, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.savings-calc__title {
    margin-bottom: 0.65rem;
}
.savings-calc__lead {
    text-align: center;
    max-width: 36rem;
    margin: 0 auto 2rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(16px, 1.8vw, 18px);
    line-height: 1.5;
    color: var(--c-text-light);
}
.savings-calc__inputs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem 1.25rem;
    margin-bottom: 2rem;
}
.savings-calc__field {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
    padding: 1.1rem 1.15rem 1.15rem;
    background: #f0f4f8;
    border-radius: 14px;
    border: 1px solid rgba(224, 230, 237, 0.95);
    transition: border-color 0.22s ease, box-shadow 0.22s ease;
}
.savings-calc__field:focus-within {
    border-color: rgba(102, 201, 42, 0.45);
    box-shadow: 0 4px 16px rgba(102, 201, 42, 0.1);
}
@media (hover: hover) and (pointer: fine) {
    .savings-calc__field:hover {
        border-color: rgba(102, 201, 42, 0.35);
    }
}
.savings-calc__label {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--c-black);
}
.savings-calc__hint {
    font-size: 12px;
    color: var(--c-text-light);
    line-height: 1.35;
    margin-bottom: 0.15rem;
}
.savings-calc__input {
    width: 100%;
    padding: 0.65rem 0.85rem;
    border: 1px solid var(--c-border-card);
    border-radius: var(--radius-sm);
    font-family: var(--font);
    font-size: 16px;
    color: var(--c-text);
    background: var(--c-white);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.savings-calc__input:focus {
    outline: none;
    border-color: var(--c-green);
    box-shadow: 0 0 0 2px rgba(102, 201, 42, 0.25);
}
.savings-calc__cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1.75rem;
}
.savings-calc__card {
    border-radius: 14px;
    padding: 1.35rem 1.35rem 1.25rem;
    border: 1px solid var(--c-border-card);
    box-shadow: 0 6px 24px rgba(13, 13, 13, 0.06);
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.savings-calc__card--trad {
    background: #f0f4f8;
    border-color: rgba(224, 230, 237, 0.95);
}
.savings-calc__card--flex {
    background: linear-gradient(165deg, rgba(102, 201, 42, 0.14) 0%, rgba(102, 201, 42, 0.05) 100%);
    border-color: rgba(102, 201, 42, 0.32);
}
.savings-calc__card-title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(16px, 1.5vw, 18px);
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 1rem;
    color: var(--c-black);
}
.savings-calc__lines {
    list-style: none;
    margin: 0;
    padding: 0;
}
.savings-calc__line {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(224, 230, 237, 0.85);
    font-size: 13px;
    line-height: 1.35;
}
.savings-calc__line:last-of-type {
    border-bottom: none;
}
.savings-calc__line-name {
    color: var(--c-text);
    min-width: 0;
}
.savings-calc__line-note {
    font-size: 11px;
    font-weight: 500;
    color: var(--c-text-light);
}
.savings-calc__line-val {
    flex-shrink: 0;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--c-black);
}
.savings-calc__deadline {
    margin: 0.85rem 0 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--c-text-light);
}
.savings-calc__deadline--accent {
    color: var(--c-green);
}
.savings-calc__total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding-top: 1rem;
    border-top: 2px solid var(--c-border-card);
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
}
.savings-calc__total strong {
    font-size: clamp(17px, 2vw, 20px);
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    color: var(--c-black);
}
.savings-calc__card--trad .savings-calc__total {
    margin-top: 0;
}
.savings-calc__total--flex {
    border-top-color: rgba(102, 201, 42, 0.35);
}
.savings-calc__total--flex strong {
    color: var(--c-green);
}
.savings-calc__delta {
    text-align: center;
    padding: 1.75rem 1.25rem 1.5rem;
    background: linear-gradient(180deg, rgba(102, 201, 42, 0.06) 0%, rgba(240, 244, 248, 0.65) 100%);
    border-radius: 14px;
    border: 1px solid rgba(102, 201, 42, 0.22);
}
.savings-calc__delta-label {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: var(--c-text);
    margin: 0 0 0.5rem;
}
.savings-calc__delta-value {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(26px, 4vw, 34px);
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    color: var(--c-green);
    margin: 0 0 1.15rem;
    line-height: 1.15;
}
.savings-calc__cta {
    margin-bottom: 0.85rem;
}
.savings-calc__disclaimer {
    font-size: 12px;
    line-height: 1.45;
    color: var(--c-text-light);
    margin: 0;
    max-width: 36rem;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 1024px) {
    .savings-calc__inputs {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    /* Вертикальные margin только на мобильных; десктоп — без изменений */
    .savings-calc,
    #savings-calculator {
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 1rem;
        margin-right: 1rem;
    }
    .savings-calc > .container {
        padding: 2rem 1.25rem 2.5rem;
        border-radius: 18px;
    }
}
@media (max-width: 560px) {
    .savings-calc > .container {
        padding: 1.75rem 1rem 2rem;
        border-radius: 16px;
    }
    .savings-calc__inputs {
        grid-template-columns: 1fr;
    }
    .savings-calc__cards {
        grid-template-columns: 1fr;
    }
    .savings-calc__line {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.2rem;
    }
}

.customers-cta {
    padding: 3.5rem 0 4.5rem;
    background: var(--c-white);
    color: var(--c-text);
}
.customers-cta__inner {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}
.customers-cta__lead {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(17px, 2vw, 20px);
    line-height: 1.5;
    margin: 0 0 1.75rem;
}
.customers-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    justify-content: center;
    align-items: center;
}
.customers-cta__link {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: var(--c-green);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.customers-cta__link:hover,
.customers-cta__link:focus-visible {
    color: var(--c-green-dark);
    text-decoration: none;
}

.hero__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 40px; font-weight: 900;
    font-style: normal;
    line-height: 1.2;
    text-transform: uppercase;
    color: #ffffff;
    margin-bottom: 1rem;
}
.hero__title .accent { color: var(--c-green); font-style: normal; }
.hero__subtitle {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 32px; font-weight: 400; line-height: 1.56;
    color: #ffffff;
    margin-bottom: .5rem;
}
.hero__subtitle strong { color: var(--c-green); font-style: normal; font-weight: 700; }
.hero__lead {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 24px; font-weight: 400; line-height: 1.2;
    color: #ffffff;
    margin-bottom: 1.5rem;
}
.hero__cta {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px; font-weight: 400;
}

/* ============================================================
   ADVANTAGES (карточки внутри hero)
   ============================================================ */
.advantages {
    background: transparent;
    padding: 2rem 0 1rem;
    width: 100%;
}
.advantages__list {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem;
}
.advantages__item {
    background: var(--c-green);
    border-radius: var(--radius);
    padding-bottom: 6px;
    text-align: center; color: var(--c-text);
}
.advantages__item-inner {
    background: var(--c-white);
    border-radius: var(--radius);
    padding: 2rem 1.2rem 1.5rem;
    display: flex; flex-direction: column; align-items: center; gap: 1rem;
    height: 100%;
}
.advantages__icon img { width: 48px; height: 48px; }
.advantages__item p {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 18px; font-weight: 400; font-style: normal;
    line-height: 1.3; color: var(--c-text);
}

/* ============================================================
   HELP-IF
   ============================================================ */
.help-if {
    position: relative;
    z-index: 2;
    background: var(--c-white);
    padding: 4rem 0;
    margin-top: 0;
}
/* Верхняя волна: общая геометрия; заливка — переменная (hero→help-if: белая; help-if→how-it: фон секции) */
.help-if::before,
.how-it-works::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: calc(-1 * var(--wave-help-if-h));
    height: var(--wave-help-if-h);
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 100%;
}
.help-if::before {
    background-image: var(--wave-top-svg-white);
}
/* Стык с help-if: серая волна как у фона блока; z-index выше help-if, чтобы перекрыть белый низ */
.how-it-works::before {
    background-image: var(--wave-top-svg-grey-bg);
}
/* «Шахматная доска»: две колонки, в каждой строке ровно одна карточка — слева / справа по очереди */
.help-if__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem 2rem;
    align-items: start;
    counter-reset: none;
    width: 100%;
    list-style: none;
    padding: 0;
}
.help-if__item:nth-child(1) { grid-column: 1; grid-row: 1; justify-self: start; }
.help-if__item:nth-child(2) { grid-column: 2; grid-row: 2; justify-self: end; }
.help-if__item:nth-child(3) { grid-column: 1; grid-row: 3; justify-self: start; }
.help-if__item:nth-child(4) { grid-column: 2; grid-row: 4; justify-self: end; }
.help-if__item:nth-child(5) { grid-column: 1; grid-row: 5; justify-self: start; }
.help-if__item {
    display: flex; align-items: flex-start; gap: 1rem;
    min-width: 0;
    padding: 1.25rem 1.5rem;
    border-radius: var(--radius);
    background: var(--c-white);
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
/* t920__symbol: в tilda-blocks — font-weight:700 + sans-serif; на странице — #67c92a + opacity 0.2 */
.help-if__num {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 72px;
    font-weight: 700;
    line-height: 1;
    color: rgba(103, 201, 42, 0.2);
    flex-shrink: 0;
    min-width: 64px;
}
@media (min-width: 1024px) {
    .help-if__num { font-size: 104px; }
}
.help-if__item p {
    font-size: 22px; font-weight: 500; line-height: 1.3;
    min-width: 0;
}

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.how-it-works {
    position: relative;
    z-index: 3;
    background: var(--c-grey-bg);
    padding: 4rem 0;
}
.how-it-works__lead {
    text-align: center;
    width: 100%;
    max-width: none;
    margin: 0 auto 2rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px; font-weight: 400; line-height: 1.4;
    color: var(--c-text);
}
.features-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}
/* Карточки как в эталонном макете Tilda (t858): белый фон, тёмный текст */
.features-grid__card {
    background: var(--c-white);
    border-radius: var(--radius);
    padding: 1.5rem;
    display: flex; flex-direction: column; align-items: center;
    text-align: center; gap: .75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
    transition: box-shadow var(--transition);
}
.features-grid__card:hover {
    box-shadow: 0 6px 24px rgba(0,0,0,.1);
}
.features-grid__icon img {
    width: 48px;
    height: 48px;
    object-fit: contain;
}
.features-grid__card p {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--c-text);
}

/* ============================================================
   SPECIAL
   ============================================================ */
/* Фон #f1f2f4, заголовок чёрный, маркеры — check5.svg как на t820 */
.special {
    background: var(--c-section-soft-bg);
    color: var(--c-black);
    padding: 3rem 0 4rem;
}
.special .section-title {
    color: var(--c-black);
}
.special .section-title .accent {
    color: var(--c-black);
}
.special__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem 2rem;
    width: 100%;
    max-width: none;
    margin: 0;
    list-style: none;
}
.special__item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin: 0;
    padding: 0;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--c-black);
}
.special__icon {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
}
.special__icon img {
    display: block;
    width: 30px;
    height: 30px;
}
.special__text {
    min-width: 0;
}

/* ============================================================
   SELECTION (flextime: t796 волна + t017 + t1070, фон #66c92a)
   ============================================================ */
.selection {
    position: relative;
    z-index: 4;
    background: var(--c-green);
    padding: 4rem 0;
}
/* Верхняя граница: зелёная волна t796 (переход от #f1f2f4) */
.selection::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: calc(-1 * var(--wave-selection-h));
    height: var(--wave-selection-h);
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 100%;
    background-image: var(--wave-t796-green);
}
.selection .section-title {
    color: var(--c-white);
}
.selection .section-title .accent {
    color: var(--c-white);
}
.selection__lead {
    text-align: center;
    margin-bottom: 2rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 26px;
    font-weight: 500;
    line-height: 1.3;
    color: rgba(255, 255, 255, .95);
}
.selection__cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    width: 100%;
    max-width: none;
    margin: 0 auto 2rem;
}
.selection-card {
    background: var(--c-white);
    border: 1px solid var(--c-border-card);
    border-radius: 9px;
    padding: 2rem;
    box-shadow: 0 0 20px rgba(0, 0, 0, .1);
}
.selection-card__icon {
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
}
.selection-card__icon img {
    max-width: 50px;
    height: auto;
    object-fit: contain;
}
.selection-card__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 25px;
    font-weight: 700;
    margin-bottom: .25rem;
    line-height: 1.1;
    color: var(--c-text);
    text-align: center;
}
.selection-card__sub {
    font-size: 14px;
    color: var(--c-text-light);
    margin-bottom: 1rem;
    text-align: center;
}
.selection-card__list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.selection-card__list li {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--c-text);
    text-align: left;
}
.selection-card__list img.selection-card__check {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 3px;
}
.selection-card__note {
    margin-top: 1rem;
    font-size: 16px;
    color: var(--c-text-light);
    text-align: center;
}
.selection__action {
    text-align: center;
}
/* Кнопка как на оригинале (t142): чёрная «капсула» */
.selection__action .btn {
    background: var(--c-black);
    color: var(--c-white);
    border-color: var(--c-black);
}
.selection__action .btn:hover,
.selection__action .btn:focus-visible {
    background: #2a2a2a;
    border-color: #2a2a2a;
    color: var(--c-white);
}

/* ============================================================
   SUPPORT (t1066: слева текст + иконки, справа фото; на мобиле фото сверху)
   ============================================================ */
.support {
    padding: 4rem 0;
    background: var(--c-white);
}
.support__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: center;
}
.support__text {
    text-align: left;
    min-width: 0;
}
.support__title {
    text-align: left;
    margin-bottom: 1rem;
}
.support__title-part {
    color: var(--c-black);
}
.support__title-accent {
    color: var(--c-green);
}
.support__lead {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 26px;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: .75rem;
    color: var(--c-text);
}
.support__brand {
    font-weight: 900;
    white-space: nowrap;
}
.support__brand-green {
    color: var(--c-green);
    font-weight: 900;
}
.support__list {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    list-style: none;
    margin-left: 0;
    padding: 0;
}
.support__item {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.35;
    color: var(--c-text);
}
.support__item-icon {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    object-fit: contain;
}
.support__figure {
    margin: 0;
    min-width: 0;
}
.support__img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}

/* ============================================================
   CTA DEMO — светлая секция, тёмная карточка с градиентом как в hero
   ============================================================ */
.cta-demo {
    background: var(--c-white);
    color: var(--c-text);
    padding: 3rem 0 3.5rem;
}
/* Карточка = .container: та же ширина полосы, что у cta-zoom и шапки */
.cta-demo__inner.container {
    position: relative;
    overflow: hidden;
    background: #0a0a0a;
    color: var(--c-white);
    text-align: center;
    border-radius: 30px;
    padding: 3rem 2rem 3.25rem;
    width: 100%;
    max-width: var(--container);
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}
/* Тот же приём, что у .hero: два слоя радиальных градиентов + heroPulse */
.cta-demo__inner.container::before,
.cta-demo__inner.container::after {
    content: '';
    position: absolute;
    top: -20%;
    left: -20%;
    width: 140%;
    height: 140%;
    pointer-events: none;
    z-index: 0;
}
.cta-demo__inner.container::before {
    background:
        radial-gradient(ellipse 40% 50% at 60% 35%, rgba(30, 140, 50, .5) 0%, transparent 70%),
        radial-gradient(ellipse 30% 40% at 25% 65%, rgba(20, 100, 35, .35) 0%, transparent 70%);
    animation: heroPulse1 7s ease-in-out infinite alternate;
}
.cta-demo__inner.container::after {
    background:
        radial-gradient(ellipse 35% 45% at 75% 60%, rgba(25, 110, 40, .4) 0%, transparent 70%),
        radial-gradient(ellipse 45% 35% at 20% 30%, rgba(35, 130, 45, .3) 0%, transparent 70%),
        radial-gradient(ellipse 25% 30% at 50% 75%, rgba(20, 90, 30, .25) 0%, transparent 70%);
    animation: heroPulse2 9s ease-in-out infinite alternate;
}
.cta-demo__inner.container > * {
    position: relative;
    z-index: 1;
}
/* Типографика как в эталонном макете Tilda (t396): заголовок 40px / основной 30px / строка 24px bold uppercase */
.cta-demo__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 40px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
    margin: 0 auto 1.25rem;
    max-width: none;
    color: var(--c-green);
}
.cta-demo__lead {
    max-width: none;
    width: 100%;
    margin: 0 auto;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 30px;
    font-weight: 400;
    line-height: 1.2;
    color: #ffffff;
}
.cta-demo__note {
    max-width: none;
    width: 100%;
    margin: 1.25rem auto 0;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    color: #ffffff;
}
.cta-demo__btn {
    margin-top: 1.5rem;
    font-size: 20px;
}

@media (max-width: 1199px) {
    .cta-demo__title { font-size: 30px; }
    .cta-demo__lead { font-size: 22px; }
    .cta-demo__note { font-size: 20px; }
}

/* ============================================================
   CONTACT FORM
   ============================================================ */
.contact { padding: 4rem 0; background: var(--c-dark); color: var(--c-white); }
.contact .section-title {
    color: var(--c-white);
    font-size: 42px; font-weight: 900;
}
.contact .section-title .accent { color: var(--c-green); }
.contact-form {
    max-width: none;
    width: 100%;
    margin: 0 auto;
    display: flex; flex-direction: column; gap: 1rem;
}
.contact-form__fields {
    display: flex; flex-direction: column; gap: .75rem;
}
.contact-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
    align-items: stretch;
}
.contact-form__field {
    min-width: 0;
}
.contact-form__input--phone-mask {
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}
.contact-form__input {
    width: 100%;
    padding: .85rem 1rem;
    border: 1px solid var(--c-border);
    border-radius: var(--radius-sm);
    background: var(--c-white);
    color: var(--c-text);
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 16px;
    transition: border-color var(--transition), box-shadow var(--transition);
}
.contact-form__input::placeholder {
    color: var(--c-text-light);
}
.contact-form__input:focus {
    outline: none;
    border-color: var(--c-green);
    box-shadow: 0 0 0 2px rgba(102, 201, 42, .2);
}
.contact-form__textarea { resize: vertical; min-height: 80px; }
/* Строка: чекбоксы слева, кнопка справа — grid, без наложения flex-элементов */
.contact-form__checks-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 1rem 1.5rem;
}
.contact-form__checks {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    min-width: 0;
}
.contact-form__checks .checkbox { color: rgba(255,255,255,.6); }
.contact-form__checks .checkbox a { color: var(--c-green); }
.contact-form__submit {
    justify-self: end;
    align-self: end;
}
@media (max-width: 599px) {
    .contact-form__checks-row {
        grid-template-columns: 1fr;
    }
    .contact-form__submit {
        justify-self: end;
    }
}

/* ============================================================
   CTA ZOOM (зелёный блок = .container: та же ширина, что у шапки)
   ============================================================ */
.cta-zoom {
    background: transparent;
    padding: 3rem 0;
    text-align: center;
}
/* Фон на элементе с .container — полоса не уже внутренней колонки */
.cta-zoom__panel.container {
    width: 100%;
    max-width: var(--container);
    margin-left: auto;
    margin-right: auto;
    background: var(--c-green);
    padding: 2.5rem 2rem 2.75rem;
    border-radius: 20px;
    box-sizing: border-box;
}
.cta-zoom__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1.35rem;
    max-width: 56rem;
    margin: 0 auto;
}
.cta-zoom__title {
    font-family: var(--font);
    font-size: clamp(18px, 2.8vw, 28px);
    font-weight: 800;
    line-height: 1.25;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.cta-zoom__title-light {
    color: #fff;
}
.cta-zoom__title-dark {
    color: #000;
}
/* Как в эталонном макете Tilda (tn_text_1745829999782): Nunito 30px / 400 / #fff / lh 1.2 */
.cta-zoom__text {
    margin: 0;
    max-width: 58rem;
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 30px;
    font-weight: 400;
    line-height: 1.2;
    color: #ffffff;
}
.cta-zoom__action {
    margin-top: 0.25rem;
}
.cta-zoom .btn.cta-zoom__btn {
    border: 2px solid #000;
    background: #000;
    color: #fff;
    font-family: var(--font);
    font-weight: 600;
    font-size: 14px;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 0.85rem 2.25rem;
    border-radius: 100px;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
}
.cta-zoom .btn.cta-zoom__btn:hover,
.cta-zoom .btn.cta-zoom__btn:focus-visible {
    background: #1a1a1a;
    border-color: #1a1a1a;
    color: #fff;
}

/* ============================================================
   DISCLAIMER STRIP (юр. текст КГД — белый фон; линии по ширине .container)
   ============================================================ */
.disclaimer-strip {
    background: var(--c-white);
    margin-top: clamp(0.75rem, 2vw, 1.5rem);
    margin-bottom: clamp(3rem, 7vw, 5.5rem);
}
.disclaimer-strip__inner {
    border-top: 1px solid var(--disclaimer-line);
    border-bottom: 1px solid var(--disclaimer-line);
    padding-top: clamp(2.5rem, 5vw, 4rem);
    padding-bottom: clamp(2.5rem, 5vw, 4rem);
}
.disclaimer-strip__text {
    width: 100%;
    font-family: var(--font);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.7;
    letter-spacing: 0.01em;
    color: var(--c-text);
    text-align: left;
}
.disclaimer-strip__text p {
    margin: 0;
}
.disclaimer-strip__text p + p {
    margin-top: 1.25rem;
}
.disclaimer-strip__text strong {
    font-weight: 700;
    color: var(--c-dark);
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
    background: var(--c-black); color: var(--c-white);
    padding: 3rem 0 1.5rem;
}
.site-footer__top {
    display: grid; grid-template-columns: 1fr 1fr; gap: 3rem;
    margin-bottom: 2rem;
}
.site-footer__logo { display: inline-block; margin-bottom: 1rem; }
.site-footer__contacts { font-style: normal; font-size: 14px; line-height: 1.8; }
.site-footer__contacts a { color: var(--c-green); }
.site-footer__contacts a:hover { text-decoration: underline; }

.site-footer__heading {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px; font-weight: 600; margin-bottom: 1rem; line-height: 1.3;
}

/* Subscribe form */
.subscribe-form {
    display: flex; flex-direction: column; gap: .6rem;
}
.subscribe-form__input {
    width: 100%; padding: .7rem .9rem;
    border: 1px solid rgba(255,255,255,.2); border-radius: var(--radius-sm);
    background: transparent; color: var(--c-white);
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 14px;
}
.subscribe-form__input::placeholder { color: rgba(255,255,255,.4); }
.subscribe-form__input:focus { outline: none; border-color: var(--c-green); }
.subscribe-form__checks { display: flex; flex-direction: column; gap: .4rem; }
.subscribe-form__submit { align-self: flex-start; }

/* Footer bottom */
.site-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); padding-top: 1.5rem; }
.site-footer__disclaimer {
    font-size: 14px; color: rgba(255,255,255,.6); line-height: 1.6;
    max-width: 800px; margin-bottom: 1rem;
}
.site-footer__divider { border: none; border-top: 1px solid rgba(255,255,255,.1); margin: 1rem 0; }
.site-footer__legal {
    display: flex; flex-wrap: wrap; gap: .5rem 2rem;
    font-size: 14px; color: rgba(255,255,255,.4);
}
.site-footer__legal a:hover { color: var(--c-green); }

/* ============================================================
   RESPONSIVE
   ============================================================ */

/* Tablet — до 1024px */
@media (max-width: 1024px) {
    .advantages__list { grid-template-columns: repeat(2, 1fr); }
    .features-grid { grid-template-columns: repeat(2, 1fr); }
    .site-footer__top { grid-template-columns: 1fr; gap: 2rem; }
    .cta-zoom__text { font-size: 22px; }
}

/* Mobile — до 768px */
@media (max-width: 768px) {
    :root { --gap: 1rem; --wave-help-if-h: 48px; }

    .site-header__nav,
    .site-header__cta { display: none; }
    /* Логотип слева, бургер у правого края «капсулы» (nav/cta скрыты — в потоке только два блока) */
    .site-header__inner { justify-content: space-between; }
    .site-header__burger {
        display: flex;
        margin-left: auto;
        flex-shrink: 0;
    }

    .hero { padding: 3rem 0 4rem; }
    .hero__title { font-size: 26px; }
    .hero__subtitle { font-size: 22px; }
    .hero__lead { font-size: 18px; }

    .section-title { font-size: 30px; }

    .advantages__list { grid-template-columns: 1fr 1fr; gap: .75rem; }
    .advantages__item p { font-size: 14px; }

    /* Узкий экран: одна колонка, порядок 01→02→… без шахмат */
    .help-if__list {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    .help-if__item:nth-child(1),
    .help-if__item:nth-child(2),
    .help-if__item:nth-child(3),
    .help-if__item:nth-child(4),
    .help-if__item:nth-child(5) {
        grid-column: 1;
        grid-row: auto;
        justify-self: stretch;
    }
    .help-if__num { font-size: 48px; }
    .help-if__item p { font-size: 18px; }

    .features-grid { grid-template-columns: 1fr; }
    .features-grid__card p { font-size: 16px; }

    .special__grid { grid-template-columns: 1fr; }
    .special__item { font-size: 16px; }

    .selection__cards { grid-template-columns: 1fr; }
    .selection__lead { font-size: 20px; }
    .selection-card__title { font-size: 20px; }
    .selection-card__list li { font-size: 16px; }

    .support__inner { grid-template-columns: 1fr; }
    .support__figure { order: -1; }
    .support__lead { font-size: 20px; }
    .support__item { font-size: 18px; }

    .contact-form__row { grid-template-columns: 1fr; }

    /* Мобильные: боковые внешние отступы у секции (десктоп без изменений) */
    .cta-demo {
        margin-left: 1rem;
        margin-right: 1rem;
    }
    .cta-demo__inner.container { padding: 2rem 1.25rem 2.5rem; border-radius: 24px; }
    .cta-demo__title { font-size: 30px; }
    .cta-demo__lead { font-size: 22px; }
    .cta-demo__note { font-size: 20px; }

    .cta-zoom {
        padding: 2rem 0;
        margin-left: 1rem;
        margin-right: 1rem;
    }
    .cta-zoom__panel.container { padding: 2rem 1.25rem 2.25rem; border-radius: 16px; }
    .cta-zoom__title { font-size: clamp(16px, 4vw, 22px); }
    .cta-zoom__text { font-size: 20px; max-width: none; }

    .btn { font-size: 16px; }

    .site-footer__legal { flex-direction: column; gap: .4rem; }
}

/* Small mobile — до 480px */
@media (max-width: 480px) {
    .advantages__list { grid-template-columns: 1fr; }
    .hero__title { font-size: 22px; }
    .hero__subtitle { font-size: 18px; }
    .hero__lead { font-size: 16px; }
    .section-title { font-size: 24px; }
    .help-if__num { font-size: 36px; }
    .help-if__item p { font-size: 16px; }
    .btn { padding: .75rem 1.5rem; font-size: 14px; }
    .cta-demo__inner.container { padding: 1.75rem 1rem 2rem; border-radius: 20px; }
    .cta-demo__title { font-size: 25px; }
    .cta-demo__lead { font-size: 18px; }
    .cta-demo__note { font-size: 18px; }
    .cta-demo__btn { font-size: 16px; }
    .cta-zoom__panel.container { padding: 1.75rem 1rem 2rem; border-radius: 14px; }
    .cta-zoom__title { font-size: 15px; }
    .cta-zoom__text { font-size: 18px; }
    .cta-zoom__inner { gap: 1.1rem; }
}

/* ============================================================
   Страница «Исполнителям» (/ispolnitel) — вёрстка по эталону Tilda
   ============================================================ */
.page-ispolnitel {
    font-family: 'Nunito Sans', Arial, sans-serif;
}

/* ——— Hero (t396 #0e0e0e) ——— */
.isp-hero {
    position: relative;
    background: #0e0e0e;
    color: #fff;
    text-align: center;
    overflow: hidden;
    min-height: 550px;
    padding: 0 0 2.5rem;
}
.isp-hero .site-header {
    margin-bottom: 0;
    position: relative;
    z-index: 10200;
}
.isp-hero__decor {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}
.isp-hero__ellipse {
    position: absolute;
    max-width: none;
    height: auto;
    user-select: none;
}
.isp-hero__ellipse--left {
    width: 1222px;
    left: 50%;
    margin-left: calc(-600px - 585px);
    top: 93px;
    opacity: 1;
}
.isp-hero__ellipse--glow {
    width: 802px;
    left: 50%;
    margin-left: calc(-600px + 180px);
    top: 93px;
    opacity: 0.5;
}
.isp-hero__ellipse--right {
    width: 1222px;
    left: 50%;
    margin-left: calc(-600px + 580px);
    top: -428px;
    opacity: 1;
}
.isp-hero__inner {
    position: relative;
    z-index: 1;
    padding-top: 1.5rem;
}
.isp-hero__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 40px;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
    margin: 0 0 0.5rem;
}
.isp-hero__title-line--white { color: #fff; }
.isp-hero__title-line--green { color: #67c92a; }
.isp-hero__subtitle {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.3;
    color: #fff;
    margin: 0 0 1rem;
}
.isp-hero__lead {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.2;
    color: #fff;
    max-width: 502px;
    margin: 0 auto 1.75rem;
}
.isp-hero__stores {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.85rem 1.25rem;
}
/* Бейджи SVG альбомные (~242×153); не задаём квадрат — иначе картинка «плавает» внизу и кажется мелкой */
.isp-hero__store {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 1 auto;
    line-height: 0;
    /* Отступы между бейджами — gap у .isp-hero__stores; у ссылки лёгкий внутренний зазор, не «холст» SVG */
    padding: 2px;
}
.isp-hero__store img {
    display: block;
    width: clamp(168px, 22vw, 232px);
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

@media screen and (max-width: 1199px) {
    .isp-hero { min-height: 500px; }
    .isp-hero__title { font-size: 35px; }
}
@media screen and (max-width: 959px) {
    .isp-hero { min-height: 500px; }
    .isp-hero__title { font-size: 30px; line-height: 1.1; }
    .isp-hero__subtitle { font-size: 25px; line-height: 1.2; }
    .isp-hero__ellipse--left { margin-left: -80%; opacity: 0.35; }
    .isp-hero__ellipse--right { display: none; }
    .isp-hero__ellipse--glow { margin-left: -35%; opacity: 0.35; }
    .isp-hero__store img {
        width: clamp(160px, 36vw, 210px);
    }
}
/* Мобильная версия: бейджи магазинов столбиком, ссылки остаются кликабельными */
@media screen and (max-width: 768px) {
    .isp-hero__stores {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: center;
        gap: 0.35rem;
    }
    .isp-hero__store {
        display: flex;
        justify-content: center;
    }
}
@media screen and (max-width: 639px) {
    .isp-hero { min-height: 520px; }
    .isp-hero__title { font-size: 25px; line-height: 1.1; }
    .isp-hero__subtitle { font-size: 20px; }
    .isp-hero__lead { font-size: 18px; }
}
@media screen and (max-width: 479px) {
    .isp-hero { min-height: 480px; }
    .isp-hero__title { font-size: 20px; line-height: 1.2; }
    .isp-hero__subtitle { font-size: 18px; }
    .isp-hero__lead { font-size: 18px; max-width: 267px; }
    .isp-hero__stores {
        gap: 0.65rem 0.75rem;
        padding: 0 0.25rem;
    }
    .isp-hero__store img {
        width: min(100%, 200px);
    }
}

/* ——— Блок «Управляйте заработком» (t1000): текст + список в одной колонке, иллюстрация справа в .container ——— */
.isp-earn {
    position: relative;
    padding: 135px 0 90px;
    background: var(--c-section-soft-bg);
    overflow: hidden;
}
/* Сетка: текст ~36% / иллюстрация ~64% — PNG 1490×1414 внутри колонки масштабируется по ширине (раньше 47/53 давало ~587px при 1200px контейнере). */
.isp-earn__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 0.36fr) minmax(0, 0.64fr);
    gap: 2rem 2.5rem;
    align-items: center;
}
.isp-earn__text {
    min-width: 0;
}
.isp-earn__intro {
    margin-bottom: 0;
}
.isp-earn__title {
    font-size: 40px;
    line-height: 38px;
    font-weight: 900;
    color: #000;
    margin: 0 0 1rem;
}
.isp-earn__descr {
    font-size: 20px;
    line-height: 24px;
    font-weight: 400;
    color: #000;
    margin: 0;
}
.isp-earn__list {
    list-style: none;
    margin: 1.35rem 0 0;
    padding: 0;
}
.isp-earn__visual {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.isp-earn__img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    margin-left: auto;
    object-fit: contain;
}
.isp-earn__item {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 18px;
    line-height: 1.55;
    color: #000;
    margin-bottom: 0.65rem;
}
.isp-earn__item--lead {
    margin-bottom: 0.75rem;
}
.isp-earn__lead-text {
    font-weight: 700;
}
.isp-earn__item .isp-earn__check {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 3.5px;
}
.isp-earn__item span:last-child {
    line-height: 24px;
}
.isp-earn__item:nth-child(4) span:last-child {
    line-height: 22px;
}

@media screen and (max-width: 960px) {
    .isp-earn { padding: 45px 0 45px; }
    .isp-earn__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .isp-earn__visual {
        order: 2;
        max-width: min(100%, 600px);
        margin: 0 auto;
    }
    .isp-earn__text {
        order: 1;
    }
    .isp-earn__title { font-size: 26px; line-height: 1.15; }
}

/* ——— С чего начать (t502) ——— */
.isp-steps {
    padding: 90px 0 90px;
    background: #fff;
}
.isp-steps__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 40px;
    font-weight: 900;
    text-align: center;
    color: #000;
    margin: 0 auto 105px;
}
.isp-steps__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 90px 48px;
    counter-reset: isp-step;
}
.isp-steps__item {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
}
.isp-steps__num {
    flex-shrink: 0;
    display: block;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #67c92a;
    color: #fff;
    position: relative;
}
.isp-steps__num::before {
    counter-increment: isp-step;
    content: counter(isp-step);
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
    font-weight: 600;
    font-family: 'Nunito Sans', Arial, sans-serif;
}
.isp-steps__text {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.35;
    color: #000;
    font-family: 'Nunito Sans', Arial, sans-serif;
}

@media screen and (max-width: 960px) {
    .isp-steps { padding: 45px 0 45px; }
    .isp-steps__title {
        font-size: 26px;
        margin-bottom: 45px;
    }
    .isp-steps__grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .isp-steps__text { font-size: 18px; }
}

@media screen and (max-width: 480px) {
    .isp-steps__title { font-size: 26px; }
}

/* ——— FAQ (t585) ——— */
.isp-faq {
    padding: 90px 0 90px;
    background: #fff;
}
.isp-faq__heading {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 40px;
    font-weight: 800;
    text-align: center;
    color: #000;
    padding-bottom: 50px;
    margin: 0;
}
.isp-faq__list {
    max-width: 100%;
}
.isp-faq__item {
    border-top: 2px solid #eee;
}
/* Снять нативную анимацию раскрытия Chromium (иначе дублируется с нашей) */
.isp-faq__item::details-content {
    transition: none !important;
}
.isp-faq__item:last-child {
    border-bottom: 2px solid #eee;
}
.isp-faq__summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
    list-style: none;
    padding: 1.1rem 0;
    font-size: 20px;
    font-weight: 400;
    color: #000;
    font-family: 'Nunito Sans', Arial, sans-serif;
}
.isp-faq__summary::-webkit-details-marker {
    display: none;
}
.isp-faq__q {
    text-align: left;
}
.isp-faq__icon {
    flex-shrink: 0;
}
.isp-faq__vert {
    transition: opacity 0.25s ease;
}
.isp-faq__item[open] .isp-faq__vert {
    opacity: 0;
}
/* Оболочка под анимацию height — без padding (инаце при height:0 остаётся «хвост» от padding) */
.isp-faq__body {
    padding: 0;
}
.isp-faq__inner {
    padding: 0 0 1.25rem;
}
/* Плавная высота панели (класс вешает app.js при отсутствии prefers-reduced-motion) */
.faq-list--motion .isp-faq__body,
.faq-list--motion .inv-faq__body {
    overflow: hidden;
    transition: height 0.36s cubic-bezier(0.4, 0, 0.2, 1);
}
.isp-faq__inner p {
    font-size: 18px;
    line-height: 1.55;
    font-family: 'Nunito Sans', Arial, sans-serif;
    color: #000;
    margin: 0;
    max-width: 100%;
}

@media screen and (max-width: 960px) {
    .isp-faq { padding: 45px 0 45px; }
}
@media screen and (max-width: 480px) {
    .isp-faq__heading { font-size: 26px; }
    .isp-faq__summary { font-size: 18px; }
}

/* ============================================================
   Страница «Блог» (/blog) — вёрстка по эталону Tilda
   ============================================================ */
.page-blog {
    font-family: 'Nunito Sans', Arial, sans-serif;
}

.blog-hero {
    position: relative;
    overflow: hidden;
    min-height: 620px;
    padding: 0 0 2.5rem;
    display: flex;
    flex-direction: column;
    color: #0d0d0d;
}
.blog-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(to top, #66c92a 33%, #7edb46 100%);
}
.blog-hero .site-header {
    position: relative;
    z-index: 10200;
    margin-bottom: 1.5rem;
}
/* Круги-блобы: как в Tilda #rec1732607771 — три оттенка зелёного, не контрастные «оранж/фиол/синий» */
.blog-hero__decor--blob {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 1;
}
@media (min-width: 1200px) {
    .blog-hero__decor--blob-right {
        width: 230px;
        height: 230px;
        background: #84e24c;
        top: 59px;
        left: calc(50% - 600px + 1087px);
    }
    .blog-hero__decor--blob-left-lg {
        width: 300px;
        height: 300px;
        background: #7dd847;
        top: 279px;
        left: calc(50% - 600px - 290px);
    }
    .blog-hero__decor--blob-left-sm {
        width: 100px;
        height: 100px;
        background: #86e051;
        top: 138px;
        left: calc(50% - 600px - 146px);
    }
}
@media screen and (max-width: 1199px) and (min-width: 960px) {
    .blog-hero__decor--blob-right {
        width: 160px;
        height: 160px;
        background: #84e24c;
        top: 0;
        left: calc(50% - 480px + 848px);
    }
    .blog-hero__decor--blob-left-lg {
        width: 300px;
        height: 300px;
        background: #7dd847;
        top: 210px;
        left: calc(50% - 480px - 210px);
    }
    .blog-hero__decor--blob-left-sm {
        width: 100px;
        height: 100px;
        background: #86e051;
        top: 56px;
        left: calc(50% - 480px - 80px);
    }
}
@media screen and (max-width: 959px) {
    .blog-hero__decor--blob-right {
        width: 150px;
        height: 150px;
        background: #84e24c;
        top: 199px;
        left: calc(50% - 320px + 530px);
    }
    .blog-hero__decor--blob-left-lg {
        width: 200px;
        height: 200px;
        background: #7dd847;
        top: 60px;
        left: calc(50% - 320px - 91px);
    }
    .blog-hero__decor--blob-left-sm {
        width: 100px;
        height: 100px;
        background: #86e051;
        top: 6px;
        left: calc(50% - 320px + 410px);
    }
}
@media screen and (max-width: 639px) {
    .blog-hero__decor--blob-right {
        width: 150px;
        height: 150px;
        top: 199px;
        left: calc(50% - 240px + 530px);
    }
    .blog-hero__decor--blob-left-lg {
        width: 200px;
        height: 200px;
        top: 60px;
        left: calc(50% - 240px - 91px);
    }
    .blog-hero__decor--blob-left-sm {
        top: 44px;
        left: calc(50% - 240px + 423px);
    }
}
@media screen and (max-width: 479px) {
    .blog-hero__decor--blob-right {
        width: 100px;
        height: 100px;
        top: 14px;
        left: calc(50% - 160px + 239px);
    }
    .blog-hero__decor--blob-left-lg {
        width: 150px;
        height: 150px;
        top: 66px;
        left: calc(50% - 160px - 70px);
    }
    .blog-hero__decor--blob-left-sm {
        width: 140px;
        height: 140px;
        top: -80px;
        left: calc(50% - 160px + 497px);
    }
}
.blog-hero__inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    align-items: center;
    gap: 2rem;
    flex: 1;
    padding-top: 0.5rem;
}
.blog-hero__title {
    font-size: clamp(28px, 4vw, 35px);
    font-weight: 900;
    line-height: 1.15;
    text-transform: uppercase;
    color: #000;
    margin: 0 0 1rem;
    max-width: 22rem;
}
/* «Flextime»: белый на зелёном hero, без наследования uppercase у родительского h1 */
.blog-hero__brand {
    color: #fff;
    text-transform: none;
    font-weight: 900;
}
.blog-hero__subtitle {
    font-size: clamp(18px, 2.2vw, 24px);
    font-weight: 400;
    line-height: 1.35;
    color: #000;
    margin: 0;
    max-width: 24rem;
}
.blog-hero__visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 380px;
}
.blog-hero__ellipse {
    position: absolute;
    width: min(100%, 640px);
    height: auto;
    max-width: none;
    right: -5%;
    bottom: -8%;
    user-select: none;
}
/* PNG 800×600: как в Tilda — макап крупно в правой колонке (раньше max 420px сжимал блок) */
.blog-hero__mockup {
    position: relative;
    z-index: 1;
    width: min(100%, 720px);
    height: auto;
    margin: 0 auto;
    user-select: none;
    filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.12));
}

.blog-feed {
    position: relative;
    z-index: 1;
    background: #66c92a;
    padding: 30px 0 48px;
}
.blog-feed__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.blog-card {
    height: 100%;
    background: #fff;
    border-radius: 35px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
    transition: transform var(--transition), box-shadow var(--transition);
}
.blog-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.1);
}
.blog-card__link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
    padding: 0 1rem 1.25rem;
    box-sizing: border-box;
}
.blog-card__media {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 30px 30px 0 0;
    background: #ffffff;
    margin: 0 -1rem 1rem;
    width: calc(100% + 2rem);
    max-width: calc(100% + 2rem);
}
/* contain: обложки с текстом не обрезаются по краям (cover кадрировал шире формат) */
.blog-card__img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
}
.blog-card__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    color: #000;
    margin: 0 0 0.5rem;
}
.blog-card__excerpt {
    font-size: 15px;
    line-height: 1.45;
    color: #555;
    margin: 0;
    flex: 1;
}

.blog-wave {
    line-height: 0;
    margin: 0;
    padding: 0;
    background: #fff;
}
.blog-wave__img {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: bottom;
}

@media screen and (max-width: 1100px) {
    .blog-feed__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media screen and (max-width: 960px) {
    .blog-hero {
        min-height: auto;
        padding-bottom: 2rem;
    }
    .blog-hero__inner {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .blog-hero__title,
    .blog-hero__subtitle {
        margin-left: auto;
        margin-right: auto;
    }
    .blog-hero__ellipse {
        right: 0;
        bottom: -5%;
    }
}
@media screen and (max-width: 600px) {
    .blog-feed__grid {
        grid-template-columns: 1fr;
    }
    .blog-card {
        border-radius: 24px;
    }
    .blog-card__media {
        border-radius: 24px 24px 0 0;
    }
}

/* ============================================================
   Страница статьи блога (/blog/:slug)
   ============================================================ */
.page-blog-post .blog-article {
    font-family: 'Nunito Sans', Arial, sans-serif;
    background: #fff;
    color: #1a1a1a;
}
.blog-article__wrap {
    padding: 0 0 4rem;
}
.blog-article__inner {
    max-width: 760px;
}
.blog-article__crumbs {
    font-size: 14px;
    color: #555;
    margin: 0 0 1.25rem;
}
.blog-article__crumbs a {
    color: #2d8a3e;
    text-decoration: none;
}
.blog-article__crumbs a:hover {
    text-decoration: underline;
}
.blog-article__crumbs-sep {
    margin: 0 0.35rem;
    opacity: 0.5;
}
.blog-article__crumbs-current {
    color: #888;
}
.blog-article__header {
    margin-bottom: 1.5rem;
}
.blog-article__title {
    font-family: 'Montserrat', 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(26px, 4vw, 40px);
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 0.5rem;
}
.blog-article__meta {
    font-size: 15px;
    color: #666;
    margin: 0;
}
.blog-article__cover {
    margin: 0 0 2rem;
    border-radius: 20px;
    overflow: hidden;
    background: #f0f0f0;
}
.blog-article__cover img {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: bottom;
}
.post-body {
    font-size: 17px;
    line-height: 1.65;
    color: #222;
}
.post-body > *:first-child {
    margin-top: 0;
}
.post-body h2,
.post-body h3,
.post-body h4 {
    font-family: 'Montserrat', 'Nunito Sans', Arial, sans-serif;
    font-weight: 800;
    line-height: 1.25;
    margin: 2rem 0 0.75rem;
}
.post-body h2 { font-size: clamp(22px, 3vw, 28px); }
.post-body h3 { font-size: clamp(19px, 2.5vw, 22px); }
.post-body p {
    margin: 0 0 1rem;
}
.post-body ul,
.post-body ol {
    margin: 0 0 1rem 1.25rem;
    padding: 0;
}
.post-body li {
    margin-bottom: 0.35rem;
}
.post-body a {
    color: #2d8a3e;
    text-decoration: underline;
}
.post-body img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 1rem 0;
}
.post-body blockquote {
    margin: 1.5rem 0;
    padding: 0.75rem 1rem;
    border-left: 4px solid #67c92a;
    background: #f7faf6;
    color: #333;
}
.post-body table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: 15px;
}
.post-body th,
.post-body td {
    border: 1px solid #ddd;
    padding: 0.5rem 0.75rem;
    text-align: left;
}
.post-body code {
    font-family: ui-monospace, monospace;
    font-size: 0.92em;
    background: #f4f4f4;
    padding: 0.1em 0.35em;
    border-radius: 4px;
}

/* ============================================================
   Страница «Инвестиции» (/investicii) — вёрстка по эталону Tilda
   ============================================================ */
.page-investicii { font-family: 'Nunito Sans', Arial, sans-serif; }
.inv-section-title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(26px, 3.5vw, 42px);
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
    margin-bottom: 2.5rem;
}
.inv-section-title--left { text-align: left; }

/* ——— Hero (тёмный фон + яркие анимированные зелёные свечения, как на оригинале) ——— */
.inv-hero {
    position: relative;
    background: #0e0e0e;
    color: #fff;
    overflow: hidden;
    padding: 0 0 2.5rem;
}
.inv-hero::before,
.inv-hero::after {
    content: '';
    position: absolute;
    inset: -30%;
    pointer-events: none;
    z-index: 0;
}
.inv-hero::before {
    background:
        radial-gradient(ellipse 45% 55% at 55% 40%, rgba(40,170,60,.55) 0%, transparent 65%),
        radial-gradient(ellipse 35% 45% at 20% 70%, rgba(30,140,45,.4) 0%, transparent 65%);
    animation: invPulse1 7s ease-in-out infinite alternate;
}
.inv-hero::after {
    background:
        radial-gradient(ellipse 40% 50% at 80% 55%, rgba(35,150,50,.45) 0%, transparent 65%),
        radial-gradient(ellipse 50% 40% at 15% 35%, rgba(45,160,55,.35) 0%, transparent 65%),
        radial-gradient(ellipse 30% 35% at 50% 80%, rgba(25,120,40,.3) 0%, transparent 65%);
    animation: invPulse2 9s ease-in-out infinite alternate;
}
@keyframes invPulse1 {
    0%   { opacity: .45; transform: scale(1); }
    50%  { opacity: 1;   transform: scale(1.15); }
    100% { opacity: .35; transform: scale(.92); }
}
@keyframes invPulse2 {
    0%   { opacity: .3;  transform: scale(1.1); }
    50%  { opacity: .8;  transform: scale(.88); }
    100% { opacity: .5;  transform: scale(1.18); }
}
.inv-hero > *:not(.mobile-menu):not(.site-header) { position: relative; z-index: 1; }
.inv-hero .site-header { z-index: 10200; margin-bottom: 2rem; }
.inv-hero__decor { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.inv-hero__ellipse { position: absolute; max-width: none; height: auto; user-select: none; }
.inv-hero__ellipse--left { width: 1222px; left: calc(50% - 600px - 585px); top: 93px; opacity: .35; }
.inv-hero__ellipse--right { width: 1222px; left: calc(50% - 600px + 580px); top: -427px; opacity: .2; }
.inv-hero__inner {
    position: relative; z-index: 1;
    padding-bottom: 3rem;
    text-align: center;
}
.inv-hero__title {
    font-size: clamp(26px, 3.5vw, 40px);
    font-weight: 900;
    line-height: 1.2;
    margin: 0 auto 1.25rem;
    max-width: 920px;
}
.inv-hero__lead {
    font-size: clamp(16px, 1.5vw, 20px);
    line-height: 1.55;
    margin: 0 auto 1.5rem;
    color: rgba(255,255,255,.85);
    max-width: 680px;
}
.inv-hero__cta { margin-bottom: .5rem; }
.inv-hero__badges-wrap { position: relative; z-index: 1; padding-bottom: 1rem; }
.inv-badges {
    display: flex; gap: 1.25rem;
    list-style: none; margin: 0; padding: 0;
    flex-wrap: wrap;
}
.inv-badges__item {
    flex: 1 1 0;
    min-width: 200px;
    text-align: center;
    color: #fff;
    background: #000;
    border-radius: 100px;
    padding: 1rem 1.5rem;
    font-size: 16px; line-height: 1.35;
}
.inv-badges__item strong { display: block; font-weight: 800; font-size: 18px; }

/* ——— Преимущества ——— */
.inv-advantages { padding: 4.5rem 0; background: #f1f2f4; }
.inv-adv__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    list-style: none; margin: 0; padding: 0;
}
.inv-adv__card {
    background: #fff;
    border-radius: 20px;
    padding: 2rem 1.5rem;
    box-shadow: 0 8px 28px rgba(0,0,0,.10), 0 2px 8px rgba(0,0,0,.06);
    transition: box-shadow .25s ease, transform .25s ease;
}
.inv-adv__card:hover {
    box-shadow: 0 14px 40px rgba(0,0,0,.14), 0 4px 12px rgba(0,0,0,.08);
    transform: translateY(-3px);
}
.inv-adv__icon { width: 50px; height: 50px; margin-bottom: 1rem; }
.inv-adv__heading { font-size: 20px; font-weight: 800; margin: 0 0 .5rem; }
.inv-adv__card p { font-size: 16px; line-height: 1.5; color: #555; margin: 0; }

/* ——— О компании (t1110: заголовок слева | описание справа, фото снизу) ——— */
.inv-about { padding: 5.5rem 0; background: #fff; }
.inv-about__top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem 3rem;
    align-items: start;
    margin-bottom: 2.5rem;
}
.inv-about__title {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(24px, 2.5vw, 40px);
    font-weight: 900;
    line-height: 1.2;
    color: #000;
    margin: 0;
}
.inv-about__brand { color: #67c92a; }
.inv-about__descr {
    font-size: 17px;
    line-height: 1.65;
    color: #333;
    margin: 0 0 1rem;
}
.inv-about__features {
    list-style: none; padding: 0; margin: 1.25rem 0 0;
    display: flex; flex-direction: column; gap: 1rem;
}
.inv-about__feature {
    display: flex; align-items: flex-start; gap: .6rem;
    font-size: 17px; line-height: 1.55;
}
.inv-about__feature-icon { flex-shrink: 0; margin-top: 4px; }
.inv-about__media { width: 100%; }
.inv-about__media img {
    border-radius: 20px;
    width: 100%;
    height: auto;
    display: block;
}

/* ——— Метрики ——— */
.inv-metrics {
    position: relative;
    padding: 4rem 0;
    background: #0e0e0e;
    color: #fff;
    overflow: hidden;
}
.inv-metrics::before,
.inv-metrics::after {
    content: '';
    position: absolute;
    inset: -40%;
    pointer-events: none;
    z-index: 0;
}
.inv-metrics::before {
    background:
        radial-gradient(ellipse 50% 60% at 30% 50%, rgba(40,170,60,.45) 0%, transparent 65%),
        radial-gradient(ellipse 35% 50% at 75% 40%, rgba(30,140,45,.3) 0%, transparent 65%);
    animation: invMetPulse1 8s ease-in-out infinite alternate;
}
.inv-metrics::after {
    background:
        radial-gradient(ellipse 45% 55% at 65% 55%, rgba(35,150,50,.35) 0%, transparent 65%),
        radial-gradient(ellipse 40% 45% at 15% 50%, rgba(45,160,55,.25) 0%, transparent 65%);
    animation: invMetPulse2 10s ease-in-out infinite alternate;
}
@keyframes invMetPulse1 {
    0%   { opacity: .4;  transform: scale(1); }
    50%  { opacity: .9;  transform: scale(1.12); }
    100% { opacity: .3;  transform: scale(.9); }
}
@keyframes invMetPulse2 {
    0%   { opacity: .25; transform: scale(1.08); }
    50%  { opacity: .7;  transform: scale(.85); }
    100% { opacity: .4;  transform: scale(1.15); }
}
.inv-metrics > * { position: relative; z-index: 1; }
.inv-metrics .inv-section-title { color: #fff; }
.inv-metrics__grid {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 2rem;
    list-style: none; margin: 0; padding: 0;
}
.inv-metrics__item {
    flex: 1 1 180px; max-width: 220px;
    text-align: center;
}
.inv-metrics__val {
    display: block;
    font-size: clamp(28px, 3vw, 42px);
    font-weight: 900;
    color: var(--c-green);
    margin-bottom: .35rem;
}
.inv-metrics__label { font-size: 15px; line-height: 1.4; color: rgba(255,255,255,.75); }

/* ——— Процесс (4 шага) ——— */
.inv-process { padding: 4.5rem 0; background: #f1f2f4; }
.inv-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    list-style: none; margin: 0; padding: 0;
    counter-reset: step;
}
.inv-steps__item {
    background: #fff;
    border-radius: 20px;
    padding: 2rem 1.5rem;
    position: relative;
}
.inv-steps__num {
    display: block;
    font-size: 48px; font-weight: 900;
    color: var(--c-green);
    line-height: 1;
    margin-bottom: .75rem;
}
.inv-steps__heading { font-size: 20px; font-weight: 800; margin: 0 0 .6rem; }
.inv-steps__item p { font-size: 15px; line-height: 1.55; color: #555; margin: 0; }

/* ——— Доверие (фото слева + 2×2 карточки справа) ——— */
.inv-trust { padding: 5.5rem 0; background: #fff; }
.inv-trust__layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    align-items: start;
}
.inv-trust__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    display: block;
}
.inv-trust__heading {
    font-family: 'Nunito Sans', Arial, sans-serif;
    font-size: clamp(24px, 2.5vw, 40px);
    font-weight: 900;
    line-height: 1.2;
    color: #000;
    margin: 0 0 1.5rem;
}
.inv-trust__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    list-style: none; margin: 0; padding: 0;
}
.inv-trust__card {
    background: transparent;
    color: #000;
    padding: 0;
}
.inv-trust__badge {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: var(--c-green);
    color: #fff;
    font-weight: 800; font-size: 15px;
    margin-bottom: .75rem;
}
.inv-trust__card h3 { font-size: 18px; font-weight: 800; margin: 0 0 .35rem; color: #000; }
.inv-trust__card p { font-size: 14px; line-height: 1.55; color: #555; margin: 0; }

/* ——— Защита инвестиций ——— */
.inv-protect { padding: 4.5rem 0; background: #f1f2f4; }
.inv-protect__list {
    list-style: none; margin: 0; padding: 0;
    max-width: 800px; margin: 0 auto;
    display: flex; flex-direction: column; gap: 1.5rem;
}
.inv-protect__item {
    display: flex; gap: 1.25rem; align-items: flex-start;
    background: #fff;
    border-radius: 16px;
    padding: 1.5rem 2rem;
}
.inv-protect__num {
    flex-shrink: 0;
    font-size: 20px; font-weight: 800;
    color: var(--c-green);
    min-width: 48px;
}
.inv-protect__item h3 { font-size: 20px; font-weight: 800; margin: 0 0 .3rem; }
.inv-protect__item p { font-size: 16px; line-height: 1.5; color: #555; margin: 0; }

/* ——— FAQ ——— */
.inv-faq { padding: 4.5rem 0; }
.inv-faq__list { max-width: 800px; margin: 0 auto; }
.inv-faq__item { border-top: 2px solid #eee; }
.inv-faq__item::details-content {
    transition: none !important;
}
.inv-faq__item:last-child { border-bottom: 2px solid #eee; }
.inv-faq__summary {
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    cursor: pointer; list-style: none;
    padding: 1.1rem 0;
    font-size: 20px; font-weight: 400;
    color: #000;
}
.inv-faq__summary::-webkit-details-marker { display: none; }
.inv-faq__q { text-align: left; }
.inv-faq__icon { flex-shrink: 0; transition: transform .25s; }
.inv-faq__vert { transition: opacity 0.25s ease; }
.inv-faq__item[open] .inv-faq__vert { opacity: 0; }
.inv-faq__body { padding: 0; }
.inv-faq__inner { padding: 0 0 1.25rem; }
.inv-faq__inner p { font-size: 17px; line-height: 1.55; color: #333; margin: 0; }

/* ——— CTA партнёрство ——— */
.inv-cta { padding: 4.5rem 0; background: var(--c-green); color: #000; }
.inv-cta__inner {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 3rem; align-items: center;
}
.inv-cta__heading { font-size: clamp(24px, 3vw, 36px); font-weight: 900; line-height: 1.2; margin: 0 0 1rem; }
.inv-cta__text {
    color: var(--c-white);
}
.inv-cta__text p { font-size: 17px; line-height: 1.55; margin: 0 0 1rem; }
.inv-cta__text .btn { margin-top: .5rem; }
/* На зелёном фоне секции стандартный primary совпадает с background — контрастная кнопка */
.inv-cta .btn.btn--primary {
    background: var(--c-black);
    color: var(--c-white);
    border-color: var(--c-black);
}
.inv-cta .btn.btn--primary:hover,
.inv-cta .btn.btn--primary:focus-visible {
    background: var(--c-dark);
    border-color: var(--c-dark);
    color: var(--c-white);
}
.inv-cta__media img { border-radius: 20px; width: 100%; height: auto; }

/* ——— Форма ——— */
.inv-form-section { padding: 4.5rem 0; background: #0e0e0e; color: #fff; }
.inv-form__inner {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 3rem; align-items: start;
}
.inv-form__heading { font-size: clamp(24px, 3vw, 36px); font-weight: 900; line-height: 1.2; margin: 0 0 1rem; }
.inv-form__text p { font-size: 17px; line-height: 1.55; margin: 0 0 1rem; color: rgba(255,255,255,.8); }
.inv-form__phone { font-size: 18px; font-weight: 600; }
.inv-form__phone a { color: #fff; text-decoration: underline; }
.inv-form {
    display: flex; flex-direction: column; gap: .75rem;
}
.inv-form__input {
    width: 100%; padding: .85rem 1.25rem;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 40px;
    background: transparent; color: #fff;
    font-size: 16px;
    transition: border-color .25s;
}
.inv-form__input::placeholder { color: rgba(255,255,255,.5); }
.inv-form__input:focus { outline: none; border-color: var(--c-green); }
.inv-form__select { appearance: none; cursor: pointer; }
.inv-form__select option { background: #1a1a1a; color: #fff; }
.inv-form__checks { display: flex; flex-direction: column; gap: .5rem; }
.inv-form__submit { align-self: flex-start; margin-top: .5rem; }

/* ——— Адаптив investicii ——— */
@media screen and (max-width: 1100px) {
    .inv-adv__grid { grid-template-columns: repeat(2, 1fr); }
    .inv-steps { grid-template-columns: repeat(2, 1fr); }
    .inv-trust__layout { grid-template-columns: 1fr; }
    .inv-trust__photo { max-height: 400px; overflow: hidden; border-radius: 20px; }
}
@media screen and (max-width: 960px) {
    .inv-hero__inner { text-align: center; }
    .inv-hero__title,
    .inv-hero__lead { max-width: 100%; margin-left: auto; margin-right: auto; }
    .inv-about__top { grid-template-columns: 1fr; }
    .inv-cta__inner { grid-template-columns: 1fr; text-align: center; }
    .inv-cta__media { order: -1; }
    .inv-form__inner { grid-template-columns: 1fr; }
}
@media screen and (max-width: 768px) {
    /* Мобильные: верхний отступ секции «О компании» — в 2 раза меньше, чем на десктопе (5.5rem → 2.75rem) */
    .inv-about {
        padding-top: 2.75rem;
    }
    /* Мобильные: верхний отступ «Как проходит инвестирование» — в 2 раза меньше (4.5rem → 2.25rem) */
    .inv-process {
        padding-top: 2.25rem;
    }
    /* Мобильные: тот же верхний отступ, что у .inv-process (4.5rem → 2.25rem) */
    .inv-protect {
        padding-top: 2.25rem;
    }
    /* Мобильные: FAQ — тот же верхний отступ, что у .inv-process */
    .inv-faq {
        padding-top: 2.25rem;
    }
    /* Мобильные: «Преимущества» — тот же верхний отступ, что у .inv-process (4.5rem → 2.25rem) */
    .inv-advantages {
        padding-top: 2.25rem;
    }
    /* Мобильные: «Доверие» — в 2 раза меньше верха, как у .inv-about (5.5rem → 2.75rem) */
    .inv-trust {
        padding-top: 2.75rem;
    }
    /* Мобильные: номер слева, заголовок справа в одной строке; текст карточки на всю ширину */
    .inv-trust__card {
        display: grid;
        grid-template-columns: auto 1fr;
        column-gap: 0.75rem;
        row-gap: 0.5rem;
        align-items: start;
    }
    .inv-trust__badge {
        margin-bottom: 0;
        margin-top: 0.2em;
    }
    .inv-trust__card h3 {
        margin: 0;
    }
    .inv-trust__card p {
        grid-column: 1 / -1;
        margin: 0;
    }
}
@media screen and (max-width: 600px) {
    .inv-adv__grid { grid-template-columns: 1fr; }
    .inv-steps { grid-template-columns: 1fr; }
    .inv-trust__grid { grid-template-columns: 1fr; }
    .inv-trust__layout { grid-template-columns: 1fr; }
    .inv-badges { flex-direction: column; gap: 1rem; }
    .inv-badges__item { min-width: 0; }
    .inv-protect__item { flex-direction: column; gap: .5rem; padding: 1.25rem; }
    .inv-faq__summary { font-size: 18px; }
}