/* ==========================================================================
   SEO Разум — дизайн-система «AI-tech» v1.0
   Единый источник стилей для всех типов страниц seo-mind42.ru.
   Документация и живые примеры: /brandbook/
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. ТОКЕНЫ
   -------------------------------------------------------------------------- */
:root {
    /* Бренд: холодная бирюза → циан (ядро «AI-tech») */
    --brand-50:  #ecfeff;
    --brand-100: #cffafe;
    --brand-200: #a5f3fc;
    --brand-300: #67e8f9;
    --brand-400: #22d3ee;
    --brand-500: #06b6d4;
    --brand-600: #0891b2;
    --brand-700: #0e7490;
    --brand-800: #155e75;
    --brand-900: #164e63;

    /* Тил — второй тон бренда, из исторического градиента сайта */
    --teal-300: #5eead4;
    --teal-400: #2dd4bf;
    --teal-500: #14b8a6;
    --teal-600: #0d9488;
    --teal-700: #0f766e;

    /* Акцент действия: сигнальный лайм из новой редакционной палитры. */
    --accent-300: #edffad;
    --accent-400: #d8ff59;
    --accent-500: #c7ef45;
    --accent-600: #abd92c;
    --accent-700: #48630a;

    /* ИИ-сущности: холодный циан вместо старого фиолетового. */
    --ai-100: #e5fbfc;
    --ai-400: #74e9f2;
    --ai-500: #39d8e8;
    --ai-600: #126f78;

    /* Нейтрали: «ink» — сине-графитовая шкала */
    --ink-950: #070d18;
    --ink-900: #0b1220;
    --ink-800: #16202f;
    --ink-700: #24324a;
    --ink-600: #3b4a63;
    --ink-500: #4b5b72;
    --ink-400: #708095;
    --ink-300: #94a3b8;
    --ink-200: #cbd5e1;
    --ink-150: #dde5ee;
    --ink-100: #e8eef5;
    --ink-50:  #f4f7fb;
    --white:   #ffffff;

    /* Семантика */
    --success-500: #059669;
    --success-50:  #ecfdf5;
    --warn-500:    #d97706;
    --warn-50:     #fffbeb;
    --danger-500:  #dc2626;
    --danger-50:   #fef2f2;
    --info-500:    #0284c7;
    --info-50:     #f0f9ff;

    /* Роли */
    --bg-page:      #f2f5f2;
    --bg-surface:   var(--white);
    --bg-subtle:    var(--ink-50);
    --bg-inverse:   var(--ink-900);
    --text-primary: var(--ink-900);
    --text-body:    var(--ink-700);
    --text-muted:   var(--ink-500);
    --text-faint:   var(--ink-400);
    --text-invert:  var(--white);
    --border:       var(--ink-150);
    --border-strong:var(--ink-200);
    --link:         var(--brand-700);
    --link-hover:   var(--brand-800);

    /* Градиенты */
    --grad-brand: linear-gradient(135deg, #0891b2 0%, #0d9488 100%);
    --grad-brand-soft: linear-gradient(135deg, var(--brand-50) 0%, #eefdf8 100%);
    --grad-ink: linear-gradient(150deg, #0b1220 0%, #123141 60%, #0f3b3f 100%);
    --grad-accent: linear-gradient(135deg, #e4ff79 0%, var(--accent-400) 48%, var(--accent-600) 100%);

    /* Типографика */
    --font-heading: 'Wix Madefor Display', 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-body:    'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono:    'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regular, Menlo, monospace;

    --fs-display: clamp(2.1rem, 1.45rem + 2.6vw, 3.25rem);
    --fs-h1:      clamp(1.85rem, 1.35rem + 2vw, 2.75rem);
    --fs-h2:      clamp(1.45rem, 1.2rem + 1.1vw, 1.95rem);
    --fs-h3:      clamp(1.2rem, 1.08rem + 0.5vw, 1.45rem);
    --fs-h4:      1.075rem;
    --fs-lead:    clamp(1.05rem, 1rem + 0.35vw, 1.2rem);
    --fs-body:    1.0625rem;   /* 17px базово, в лонгриде — 19px */
    --fs-sm:      0.9375rem;
    --fs-xs:      0.8125rem;

    --lh-tight: 1.18;
    --lh-snug:  1.35;
    --lh-base:  1.65;
    --lh-prose: 1.75;

    /* Пространство (шаг 4px) */
    --sp-1: 0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;  --sp-4: 1rem;
    --sp-5: 1.25rem;  --sp-6: 1.5rem;   --sp-8: 2rem;     --sp-10: 2.5rem;
    --sp-12: 3rem;    --sp-16: 4rem;    --sp-20: 5rem;

    /* Геометрия */
    --radius-sm: 8px;
    --radius:    12px;
    --radius-lg: 18px;
    --radius-xl: 24px;
    --radius-pill: 999px;

    --shadow-xs: 0 1px 2px rgba(11, 18, 32, .06);
    --shadow-sm: 0 2px 6px rgba(11, 18, 32, .06);
    --shadow-md: 0 6px 20px rgba(11, 18, 32, .08);
    --shadow-lg: 0 16px 42px rgba(11, 18, 32, .12);
    --shadow-brand: 0 10px 30px rgba(8, 145, 178, .18);
    --shadow-accent: 0 10px 26px rgba(134, 178, 28, .24);

    --container: 1220px;
    --container-narrow: 820px;
    --measure: 72ch;           /* длина строки лонгрида */
    --header-h: 72px;

    --ease: cubic-bezier(.4, 0, .2, 1);
    --t-fast: .15s var(--ease);
    --t-base: .25s var(--ease);
}

/* --------------------------------------------------------------------------
   2. БАЗА
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
    font-size: 16px;
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-h) + 16px);
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: var(--font-body);
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    color: var(--text-body);
    background: var(--bg-page);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-family: var(--font-heading);
    color: var(--text-primary);
    font-weight: 800;
    line-height: var(--lh-tight);
    letter-spacing: -0.015em;
}
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); font-weight: 700; }
h4 { font-size: var(--fs-h4); font-weight: 700; }

p { margin: 0 0 var(--sp-4); }

a { color: var(--link); text-decoration: none; transition: color var(--t-fast); }
a:hover { color: var(--link-hover); }

img, svg, video { max-width: 100%; height: auto; display: block; }

ul, ol { margin: 0 0 var(--sp-4); padding-left: 1.35em; }
li { margin-bottom: var(--sp-2); }

strong, b { font-weight: 700; color: var(--text-primary); }

code, kbd, pre, samp { font-family: var(--font-mono); font-size: .92em; }

hr { border: 0; border-top: 1px solid var(--border); margin: var(--sp-10) 0; }

button, input, select, textarea { font: inherit; color: inherit; }

:focus-visible {
    outline: 3px solid var(--brand-400);
    outline-offset: 2px;
    border-radius: 4px;
}

::selection { background: var(--brand-200); color: var(--ink-900); }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link {
    position: absolute; left: -9999px; top: 0; z-index: 999;
    background: var(--ink-900); color: var(--white);
    padding: var(--sp-3) var(--sp-5); border-radius: 0 0 var(--radius) 0;
}
.skip-link:focus { left: 0; color: var(--white); }

/* --------------------------------------------------------------------------
   3. РАСКЛАДКА
   -------------------------------------------------------------------------- */
.container {
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 var(--sp-5);
}
.container--narrow { max-width: var(--container-narrow); }

.page { min-height: 60vh; padding-bottom: var(--sp-16); }

.layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 336px;
    gap: var(--sp-8);
    align-items: start;
}
.layout--wide { grid-template-columns: minmax(0, 1fr) 300px; }
.layout--single { grid-template-columns: minmax(0, 1fr); }

.stack > * + * { margin-top: var(--sp-8); }
.stack--tight > * + * { margin-top: var(--sp-5); }

.section { margin: var(--sp-12) 0; }
.section:first-child { margin-top: var(--sp-8); }

.section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
}
.section-head__title {
    font-size: var(--fs-h2);
    display: flex; align-items: center; gap: var(--sp-3);
}
.section-head__title::before {
    content: '';
    width: 6px; height: 1.1em;
    border-radius: var(--radius-pill);
    background: var(--grad-brand);
    flex: none;
}
.section-head__sub { margin: var(--sp-2) 0 0; color: var(--text-muted); font-size: var(--fs-sm); }
.section-head__link { font-weight: 600; font-size: var(--fs-sm); white-space: nowrap; }

@media (max-width: 1024px) {
    .layout, .layout--wide { grid-template-columns: minmax(0, 1fr); }
}

/* --------------------------------------------------------------------------
   4. ШАПКА И НАВИГАЦИЯ
   -------------------------------------------------------------------------- */
.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255, 255, 255, .88);
    backdrop-filter: saturate(160%) blur(12px);
    -webkit-backdrop-filter: saturate(160%) blur(12px);
    border-bottom: 1px solid var(--border);
}
.site-header__inner {
    display: flex;
    align-items: center;
    gap: var(--sp-6);
    min-height: var(--header-h);
    padding: var(--sp-3) 0;
}

.brand { display: flex; align-items: center; gap: var(--sp-3); flex: none; }
.brand__mark {
    width: 44px; height: 44px; flex: none;
    border-radius: 12px;
    object-fit: contain;
    box-shadow: 0 6px 16px rgba(7, 21, 27, .16);
}
.brand__name {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin: 0;
}
.brand__name a { color: var(--ink-900); }
.brand__name a:hover { color: var(--brand-700); }
.brand__tagline {
    display: block;
    font-size: var(--fs-xs);
    color: var(--text-muted);
    margin-top: 2px;
}

.nav { margin-left: auto; }
.nav__list {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
    list-style: none;
    margin: 0; padding: 0;
}
.nav__link {
    display: block;
    padding: var(--sp-2) var(--sp-4);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: var(--fs-sm);
    color: var(--ink-600);
    transition: background var(--t-fast), color var(--t-fast);
}
.nav__link:hover { background: var(--brand-50); color: var(--brand-800); }
.nav__link.is-active { background: var(--brand-50); color: var(--brand-800); }
.nav__link.is-active::after {
    content: '';
    display: block;
    height: 2px; margin-top: 4px;
    border-radius: var(--radius-pill);
    background: var(--grad-brand);
}

.header-search { flex: none; }
.header-search__form { position: relative; display: flex; }
.header-search__input {
    width: 220px;
    padding: var(--sp-2) var(--sp-3) var(--sp-2) 2.2rem;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-pill);
    background: var(--bg-subtle) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234b5b72' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat .65rem 50% / 1.05rem;
    font-size: var(--fs-sm);
    transition: border-color var(--t-fast), background-color var(--t-fast), width var(--t-base);
}
.header-search__input:focus { outline: none; border-color: var(--brand-400); background-color: var(--white); width: 260px; }

.nav-toggle {
    display: none;
    margin-left: auto;
    width: 44px; height: 44px;
    align-items: center; justify-content: center;
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    cursor: pointer;
}
.nav-toggle__bar, .nav-toggle__bar::before, .nav-toggle__bar::after {
    content: ''; display: block;
    width: 20px; height: 2px;
    background: var(--ink-700);
    border-radius: 2px;
    transition: transform var(--t-base), opacity var(--t-fast);
}
.nav-toggle__bar::before { transform: translateY(-6px); }
.nav-toggle__bar::after  { transform: translateY(4px); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar::before { transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar::after  { transform: translateY(-2px) rotate(-45deg); }

@media (max-width: 900px) {
    .nav-toggle { display: flex; }
    .nav, .header-search {
        display: none;
        width: 100%;
        margin: 0;
        order: 3;
    }
    .site-header__inner { flex-wrap: wrap; }
    .site-header.is-open .nav,
    .site-header.is-open .header-search { display: block; padding-bottom: var(--sp-4); }
    .site-header.is-open .nav__list { flex-direction: column; align-items: stretch; }
    .site-header.is-open .nav__link { padding: var(--sp-3) var(--sp-4); }
    .header-search__input, .header-search__input:focus { width: 100%; }
}

/* Полоса прогресса чтения */
.read-progress {
    position: fixed; top: 0; left: 0; right: 0;
    height: 3px; z-index: 200;
    background: transparent;
    pointer-events: none;
}
.read-progress__bar {
    height: 100%; width: 0;
    background: var(--grad-brand);
    transition: width .1s linear;
}

/* --------------------------------------------------------------------------
   5. ПОДВАЛ
   -------------------------------------------------------------------------- */
.site-footer {
    margin-top: var(--sp-16);
    background: var(--grad-ink);
    color: var(--ink-200);
    padding: var(--sp-12) 0 var(--sp-6);
}
.site-footer a { color: var(--brand-200); }
.site-footer a:hover { color: var(--white); }
.site-footer__grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr;
    gap: var(--sp-8);
}
.site-footer h4 {
    color: var(--white);
    font-size: 1rem;
    margin-bottom: var(--sp-4);
    letter-spacing: .01em;
}
.site-footer p { color: var(--ink-300); font-size: var(--fs-sm); }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: var(--sp-2); font-size: var(--fs-sm); }
.site-footer__bottom {
    margin-top: var(--sp-10);
    padding-top: var(--sp-5);
    border-top: 1px solid rgba(255, 255, 255, .12);
    display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-6);
    justify-content: space-between;
    font-size: var(--fs-xs);
    color: var(--ink-400);
}
/* Кнопка Дзен-канала в подвале */
.zen-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-3);
    margin-top: var(--sp-4);
    padding: .6rem 1rem .6rem .6rem;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: var(--radius-md, 14px);
    background: rgba(255, 255, 255, .06);
    color: var(--white) !important;
    text-decoration: none;
    transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.zen-btn:hover {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 255, 255, .32);
    color: var(--white) !important;
    transform: translateY(-1px);
}
.zen-btn__logo { display: inline-flex; flex: none; }
.zen-btn__logo svg { display: block; border-radius: 6px; }
.zen-btn__text { display: flex; flex-direction: column; line-height: 1.25; }
.zen-btn__text b { font-size: var(--fs-sm); font-weight: 700; }
.zen-btn__text small { font-size: var(--fs-xs); color: var(--ink-300); }
.zen-btn__arrow { margin-left: var(--sp-1); opacity: .7; }
/* Дзен в сайдбаре статей */
.cta-box__dzen {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-top: var(--sp-4);
    padding: .6rem .8rem;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: var(--radius-sm, 10px);
    background: rgba(255, 255, 255, .06);
    color: var(--white) !important;
    text-decoration: none;
    transition: background .18s ease, border-color .18s ease;
}
.cta-box__dzen:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .32); color: var(--white) !important; }
.cta-box__dzen-logo { display: inline-flex; flex: none; }
.cta-box__dzen-logo svg { display: block; }
.cta-box__dzen-text { display: flex; flex-direction: column; line-height: 1.25; flex: 1; }
.cta-box__dzen-text b { font-size: var(--fs-sm); }
.cta-box__dzen-text small { font-size: var(--fs-xs); color: rgba(255, 255, 255, .6); }
/* Кнопка Дзен-канала в ряду «Поделиться» */
.share__btn--dzen { background: #000; border-color: #000; color: #fff; }
.share__btn--dzen:hover { background: #222; border-color: #222; color: #fff; }
@media (max-width: 800px) {
    .site-footer__grid { grid-template-columns: 1fr; gap: var(--sp-6); }
}

/* --------------------------------------------------------------------------
   6. КНОПКИ
   -------------------------------------------------------------------------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-2);
    padding: .7rem 1.35rem;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: var(--fs-sm);
    line-height: 1.2;
    text-align: center;
    cursor: pointer;
    transition: transform var(--t-fast), box-shadow var(--t-base), background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }

/* Основное действие сайта (навигация, «читать») */
.btn--primary { background: var(--grad-brand); color: var(--white); box-shadow: var(--shadow-brand); }
.btn--primary:hover { color: var(--white); box-shadow: 0 14px 34px rgba(8, 145, 178, .26); }

/* Конверсия: сигнальный лайм, только для целевого действия */
.btn--cta { background: var(--grad-accent); color: var(--ink-900); box-shadow: var(--shadow-accent); }
.btn--cta:hover { color: var(--ink-900); box-shadow: 0 14px 32px rgba(134, 178, 28, .32); }

.btn--ghost { background: var(--white); color: var(--ink-700); border-color: var(--border-strong); }
.btn--ghost:hover { border-color: var(--brand-400); color: var(--brand-800); background: var(--brand-50); }

.btn--quiet { background: transparent; color: var(--brand-700); padding-left: 0; padding-right: 0; }
.btn--quiet:hover { color: var(--brand-900); }

.btn--lg { padding: .95rem 1.9rem; font-size: 1.05rem; }
.btn--sm { padding: .45rem .9rem; font-size: var(--fs-xs); }
.btn--block { display: flex; width: 100%; }

/* --------------------------------------------------------------------------
   7. БЕЙДЖИ, ЧИПЫ, МЕТА
   -------------------------------------------------------------------------- */
.badge {
    display: inline-flex; align-items: center; gap: var(--sp-2);
    padding: .3rem .7rem;
    border-radius: var(--radius-pill);
    background: var(--brand-50);
    color: var(--brand-800);
    font-size: var(--fs-xs);
    font-weight: 700;
    line-height: 1.3;
    white-space: nowrap;
}
.badge--ai      { background: var(--ai-100); color: var(--ai-600); }
.badge--accent  { background: #efffbd; color: var(--accent-700); }
.badge--success { background: var(--success-50); color: var(--success-500); }
.badge--danger  { background: var(--danger-50); color: var(--danger-500); }
.badge--neutral { background: var(--ink-100); color: var(--ink-600); }
.badge--glass   { background: rgba(255,255,255,.18); color: var(--white); backdrop-filter: blur(8px); }

.meta {
    display: flex; flex-wrap: wrap; align-items: center;
    gap: var(--sp-2) var(--sp-4);
    font-size: var(--fs-xs);
    color: var(--text-muted);
}
.meta__item { display: inline-flex; align-items: center; gap: var(--sp-1); }
.meta--invert, .meta--invert .meta__item { color: rgba(255, 255, 255, .88); }

.chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.chip {
    display: inline-flex; align-items: center; gap: var(--sp-2);
    padding: .45rem .85rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    background: var(--white);
    color: var(--ink-600);
    font-size: var(--fs-xs);
    font-weight: 600;
    transition: all var(--t-fast);
}
.chip:hover { border-color: var(--brand-400); color: var(--brand-800); background: var(--brand-50); }
.chip.is-active { background: var(--grad-brand); border-color: transparent; color: var(--white); }
.chip__count { color: inherit; opacity: .65; font-weight: 500; }

/* --------------------------------------------------------------------------
   8. КАРТОЧКИ
   -------------------------------------------------------------------------- */
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: transform var(--t-base), box-shadow var(--t-base), border-color var(--t-base);
}
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--brand-200); }
.card__media { position: relative; aspect-ratio: 16 / 9; background: var(--grad-brand-soft); overflow: hidden; }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.card:hover .card__media img { transform: scale(1.04); }
.card__media--empty {
    display: flex; align-items: center; justify-content: center;
    font-size: 2.4rem; color: var(--brand-600);
    background: var(--grad-brand-soft);
}
.card__media.is-fallback {
    background:
        radial-gradient(circle at 78% 24%, rgba(57,216,232,.2), transparent 38%),
        linear-gradient(145deg, #07151b, #0d5558);
}
.card__media.is-fallback img { display: none; }
.card__media.is-fallback::before {
    content: '';
    position: absolute;
    z-index: 1;
    left: 50%; top: 50%;
    width: 74px; height: 74px;
    transform: translate(-50%, -50%);
    background: url('/assets/brand/seo-razum-mark.svg') center / contain no-repeat;
    filter: drop-shadow(0 12px 18px rgba(0,0,0,.24));
}
.card__flag {
    position: absolute; top: var(--sp-3); left: var(--sp-3);
    padding: .3rem .7rem;
    border-radius: var(--radius-pill);
    background: rgba(11, 18, 32, .72);
    color: var(--white);
    font-size: var(--fs-xs);
    font-weight: 700;
    backdrop-filter: blur(6px);
}
.card__body { display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-5); flex: 1; }
.card__top { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.card__title {
    font-size: 1.05rem;
    line-height: var(--lh-snug);
    font-weight: 700;
}
.card__title a { color: var(--text-primary); }
.card__title a:hover { color: var(--brand-700); }
.card__excerpt {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--fs-sm);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.card__foot {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--sp-3);
    margin-top: auto;
    padding-top: var(--sp-3);
    border-top: 1px solid var(--border);
}
.card__more { font-weight: 700; font-size: var(--fs-sm); display: inline-flex; align-items: center; gap: var(--sp-2); }
.card__more span { transition: transform var(--t-fast); }
.card:hover .card__more span { transform: translateX(3px); }

/* Карточка целиком — ссылка */
a.card { color: inherit; }
a.card:hover { color: inherit; }

.grid { display: grid; gap: var(--sp-5); }
.grid--2 { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.grid--3 { grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fill, minmax(212px, 1fr)); }

/* Карточка раздела */
.topic-card {
    display: flex; flex-direction: column; gap: var(--sp-3);
    padding: var(--sp-5);
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    transition: transform var(--t-base), box-shadow var(--t-base), border-color var(--t-base);
}
.topic-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--brand-300); }
.topic-card__icon {
    width: 46px; height: 46px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--radius);
    background: var(--grad-brand-soft);
    font-size: 1.35rem;
}
.topic-card__title { font-size: 1.05rem; color: var(--text-primary); }
.topic-card__desc { margin: 0; font-size: var(--fs-sm); color: var(--text-muted); }
.topic-card__count { margin-top: auto; font-size: var(--fs-xs); font-weight: 700; color: var(--brand-700); }

/* Карточка инструмента / нейросети */
.tool-card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: var(--sp-4);
    align-items: start;
    padding: var(--sp-5);
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    transition: transform var(--t-base), box-shadow var(--t-base), border-color var(--t-base);
}
.tool-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); border-color: var(--brand-200); }
.tool-card__logo {
    width: 52px; height: 52px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--radius);
    background: var(--grad-brand-soft);
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--brand-700);
    overflow: hidden;
}
.tool-card__name { font-size: 1.05rem; margin-bottom: var(--sp-1); }
.tool-card__desc { margin: 0 0 var(--sp-3); font-size: var(--fs-sm); color: var(--text-muted); }
.tool-card__facts { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); font-size: var(--fs-xs); color: var(--text-muted); }
.tool-card__fact b { color: var(--text-primary); }

/* --------------------------------------------------------------------------
   9. HERO
   -------------------------------------------------------------------------- */
.hero {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-xl);
    background: var(--grad-ink);
    color: var(--white);
    padding: var(--sp-12) var(--sp-8);
    margin-top: var(--sp-8);
    isolation: isolate;
}
.hero::before {
    content: '';
    position: absolute; inset: -40% -10% auto -10%;
    height: 140%;
    background:
        radial-gradient(48% 60% at 18% 22%, rgba(34, 211, 238, .38) 0%, transparent 62%),
        radial-gradient(42% 55% at 82% 18%, rgba(20, 184, 166, .34) 0%, transparent 60%),
        radial-gradient(38% 48% at 62% 88%, rgba(139, 92, 246, .22) 0%, transparent 62%);
    z-index: -1;
}
.hero::after {
    content: '';
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: radial-gradient(70% 70% at 50% 40%, #000 30%, transparent 100%);
    -webkit-mask-image: radial-gradient(70% 70% at 50% 40%, #000 30%, transparent 100%);
    z-index: -1;
}
.hero__inner { max-width: 760px; }
.hero--center { text-align: center; }
.hero--center .hero__inner { margin: 0 auto; }
.hero__title {
    font-size: var(--fs-display);
    color: var(--white);
    margin: var(--sp-4) 0 var(--sp-4);
}
.hero__lead {
    font-size: var(--fs-lead);
    color: rgba(255, 255, 255, .84);
    margin-bottom: var(--sp-6);
    max-width: 60ch;
}
.hero--center .hero__lead { margin-left: auto; margin-right: auto; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.hero--center .hero__actions { justify-content: center; }

.hero-stats {
    display: flex; flex-wrap: wrap; gap: var(--sp-8);
    margin-top: var(--sp-8);
    padding-top: var(--sp-6);
    border-top: 1px solid rgba(255, 255, 255, .14);
}
.hero--center .hero-stats { justify-content: center; }
.hero-stat__value {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--white);
    line-height: 1.1;
}
.hero-stat__label { font-size: var(--fs-xs); color: rgba(255, 255, 255, .7); }

/* Компактный заголовок раздела/страницы */
.page-hero {
    background: var(--grad-brand-soft);
    border: 1px solid var(--brand-100);
    border-radius: var(--radius-lg);
    padding: var(--sp-8);
    margin-top: var(--sp-6);
}
.page-hero__title { font-size: var(--fs-h1); margin-bottom: var(--sp-3); }
.page-hero__lead { color: var(--text-muted); font-size: var(--fs-lead); max-width: 68ch; margin: 0; }
.page-hero__stats { display: flex; flex-wrap: wrap; gap: var(--sp-6); margin-top: var(--sp-6); }
.page-hero__stat { display: flex; flex-direction: column; }
.page-hero__stat b { font-family: var(--font-heading); font-size: 1.35rem; color: var(--brand-800); }
.page-hero__stat span { font-size: var(--fs-xs); color: var(--text-muted); }

@media (max-width: 640px) {
    .hero { padding: var(--sp-8) var(--sp-5); border-radius: var(--radius-lg); }
    .hero-stats { gap: var(--sp-5); }
    .page-hero { padding: var(--sp-6) var(--sp-5); }
}

/* --------------------------------------------------------------------------
   10. ХЛЕБНЫЕ КРОШКИ, ПАГИНАЦИЯ, ПУСТЫЕ СОСТОЯНИЯ
   -------------------------------------------------------------------------- */
.breadcrumbs {
    display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2);
    padding: var(--sp-5) 0 0;
    font-size: var(--fs-xs);
    color: var(--text-muted);
}
.breadcrumbs a { color: var(--text-muted); }
.breadcrumbs a:hover { color: var(--brand-700); }
.breadcrumbs__sep { color: var(--ink-300); }
.breadcrumbs__current { color: var(--ink-700); font-weight: 600; }

.pagination {
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
    gap: var(--sp-2);
    margin-top: var(--sp-10);
}
.pagination__item {
    min-width: 42px;
    padding: .5rem .8rem;
    text-align: center;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--white);
    color: var(--ink-600);
    font-weight: 600;
    font-size: var(--fs-sm);
    transition: all var(--t-fast);
}
.pagination__item:hover { border-color: var(--brand-400); color: var(--brand-800); }
.pagination__item.is-active { background: var(--grad-brand); border-color: transparent; color: var(--white); }
.pagination__gap { color: var(--ink-300); padding: 0 var(--sp-1); }

.empty-state {
    text-align: center;
    padding: var(--sp-16) var(--sp-6);
    background: var(--bg-surface);
    border: 1px dashed var(--border-strong);
    border-radius: var(--radius-lg);
}
.empty-state__icon { font-size: 2.6rem; margin-bottom: var(--sp-4); }
.empty-state h3 { margin-bottom: var(--sp-3); }
.empty-state p { color: var(--text-muted); max-width: 46ch; margin: 0 auto var(--sp-6); }

/* --------------------------------------------------------------------------
   11. САЙДБАР И ВИДЖЕТЫ
   -------------------------------------------------------------------------- */
.sidebar { display: flex; flex-direction: column; gap: var(--sp-5); }
/* Виджеты в сайдбаре не сжимаются: иначе flex схлопывает блок с внутренней
   прокруткой (оглавление) почти до нуля, когда содержимое выше контейнера. */
.sidebar > * { flex: 0 0 auto; }

@media (min-width: 1025px) {
    .sidebar {
        position: sticky;
        top: calc(var(--header-h) + var(--sp-4));
        align-self: start;
        max-height: calc(100vh - var(--header-h) - var(--sp-6));
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: var(--ink-200) transparent;
        padding-right: var(--sp-1);
    }
    .sidebar::-webkit-scrollbar { width: 6px; }
    .sidebar::-webkit-scrollbar-thumb { background: var(--ink-200); border-radius: var(--radius-pill); }
    .sidebar::-webkit-scrollbar-track { background: transparent; }
}

.widget {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-5);
}
.widget__title {
    display: flex; align-items: center; gap: var(--sp-2);
    font-size: 1rem;
    margin-bottom: var(--sp-4);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--border);
}
.widget--sticky { max-height: 38vh; overflow-y: auto; scrollbar-width: thin; }
.widget--dark { background: var(--grad-ink); border-color: transparent; color: var(--ink-200); }
.widget--dark .widget__title { color: var(--white); border-bottom-color: rgba(255,255,255,.14); }
.widget--dark p { color: var(--ink-300); font-size: var(--fs-sm); }

.rank-list { display: flex; flex-direction: column; gap: var(--sp-1); }
.rank-item {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: var(--sp-3);
    padding: var(--sp-3);
    margin: 0 calc(var(--sp-3) * -1);
    border-radius: var(--radius-sm);
    transition: background var(--t-fast);
}
.rank-item:hover { background: var(--bg-subtle); }
.rank-item__num {
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: var(--fs-sm);
    color: var(--brand-500);
    line-height: 1.45;
}
.rank-item__title {
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.45;
    margin-bottom: 2px;
}
.rank-item:hover .rank-item__title { color: var(--brand-700); }
.rank-item__meta { font-size: var(--fs-xs); color: var(--text-faint); display: flex; gap: var(--sp-3); }

.link-list { display: flex; flex-direction: column; }
.link-list a {
    padding: var(--sp-3) 0;
    border-bottom: 1px solid var(--border);
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--ink-700);
    display: flex; justify-content: space-between; gap: var(--sp-3);
}
.link-list a:last-child { border-bottom: 0; }
.link-list a:hover { color: var(--brand-700); }
.link-list__count { color: var(--text-faint); font-weight: 500; }

/* Оглавление */
.toc__list { list-style: none; margin: 0; padding: 0; }
.toc__list li { margin: 0; }
.toc__link {
    display: block;
    padding: .4rem 0 .4rem var(--sp-3);
    border-left: 2px solid var(--border);
    font-size: var(--fs-sm);
    line-height: 1.4;
    color: var(--text-muted);
    transition: all var(--t-fast);
}
.toc__link:hover { color: var(--brand-700); border-left-color: var(--brand-300); }
.toc__link.is-active { color: var(--brand-800); border-left-color: var(--brand-500); font-weight: 600; background: var(--brand-50); }
.toc__link--h3 { padding-left: var(--sp-6); font-size: var(--fs-xs); }
.toc__link--h4 { padding-left: var(--sp-8); font-size: var(--fs-xs); color: var(--text-faint); }
.toc__empty { color: var(--text-faint); font-size: var(--fs-sm); margin: 0; }

/* Боковой CTA (конверсия) */
.cta-box {
    background: var(--grad-ink);
    border-radius: var(--radius-lg);
    padding: var(--sp-6);
    color: var(--white);
    position: relative;
    overflow: hidden;
}
.cta-box::before {
    content: '';
    position: absolute; inset: auto -30% -60% -30%; height: 120%;
    background: radial-gradient(50% 60% at 50% 20%, rgba(34,211,238,.35), transparent 70%);
}
.cta-box > * { position: relative; }
.cta-box__kicker { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .08em; color: var(--brand-200); font-weight: 700; }
.cta-box__title { color: var(--white); font-size: 1.2rem; margin: var(--sp-2) 0 var(--sp-3); }
.cta-box__text { color: rgba(255,255,255,.8); font-size: var(--fs-sm); margin-bottom: var(--sp-5); }
.cta-box__note { font-size: var(--fs-xs); color: rgba(255,255,255,.55); margin: var(--sp-3) 0 0; }

/* --------------------------------------------------------------------------
   12. ЛОНГРИД (тело статьи)
   Правило: строка не длиннее 72 символов, 19px, интерлиньяж 1.75.
   -------------------------------------------------------------------------- */
.prose {
    font-size: 1.1875rem;      /* 19px */
    line-height: var(--lh-prose);
    color: var(--ink-700);
    max-width: var(--measure);
}
.prose > * + * { margin-top: var(--sp-5); }
.prose p { margin: 0; }
.prose section { display: contents; }

.prose h2 {
    font-size: var(--fs-h2);
    margin-top: var(--sp-12);
    padding-top: var(--sp-2);
    scroll-margin-top: calc(var(--header-h) + 20px);
}
.prose h2::before {
    content: '';
    display: block;
    width: 52px; height: 4px;
    margin-bottom: var(--sp-4);
    border-radius: var(--radius-pill);
    background: var(--grad-brand);
}
.prose h3 { font-size: var(--fs-h3); margin-top: var(--sp-8); scroll-margin-top: calc(var(--header-h) + 20px); }
.prose h4 { font-size: var(--fs-h4); margin-top: var(--sp-6); color: var(--ink-800); }

.prose a { color: var(--link); text-decoration: underline; text-decoration-color: var(--brand-200); text-underline-offset: 3px; text-decoration-thickness: 2px; }
.prose a:hover { color: var(--link-hover); text-decoration-color: var(--brand-500); }

.prose ul, .prose ol { padding-left: 1.4em; }
.prose li { margin-bottom: var(--sp-3); }
.prose li::marker { color: var(--brand-500); font-weight: 700; }
.prose ul > li { list-style: none; position: relative; padding-left: 1.1em; margin-left: -1.4em; }
.prose ul > li::before {
    content: '';
    position: absolute; left: 0; top: .62em;
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--brand-500);
}
.prose ul ul > li::before { background: var(--teal-400); }

.prose blockquote {
    margin: var(--sp-8) 0;
    padding: var(--sp-5) var(--sp-6);
    border-left: 4px solid var(--brand-500);
    border-radius: 0 var(--radius) var(--radius) 0;
    background: var(--brand-50);
    color: var(--ink-800);
    font-size: 1.075rem;
}
.prose blockquote p:last-child { margin-bottom: 0; }

.prose img { border-radius: var(--radius); box-shadow: var(--shadow-sm); margin: var(--sp-8) auto; }
.prose figure { margin: var(--sp-8) 0; }
.prose figcaption { font-size: var(--fs-xs); color: var(--text-faint); text-align: center; margin-top: var(--sp-2); }

.prose code {
    padding: .15em .4em;
    border-radius: 5px;
    background: var(--ink-100);
    color: var(--brand-900);
    font-size: .88em;
}
.prose pre {
    margin: var(--sp-6) 0;
    padding: var(--sp-5);
    border-radius: var(--radius);
    background: var(--ink-900);
    color: #dbeafe;
    overflow-x: auto;
    font-size: .92rem;
    line-height: 1.6;
}
.prose pre code { background: none; color: inherit; padding: 0; }

/* Таблицы: всегда прокручиваются в своём контейнере */
.table-scroll { overflow-x: auto; margin: var(--sp-8) 0; border-radius: var(--radius); border: 1px solid var(--border); -webkit-overflow-scrolling: touch; }
.prose table, .table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    background: var(--white);
    font-size: var(--fs-sm);
}
.prose table { margin: 0; }
.prose thead th, .table thead th {
    background: var(--ink-50);
    color: var(--ink-800);
    font-family: var(--font-heading);
    font-weight: 700;
    text-align: left;
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border-strong);
    white-space: nowrap;
}
.prose td, .prose th, .table td, .table th {
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border);
    vertical-align: top;
    line-height: 1.55;
}
.prose tbody tr:last-child td, .table tbody tr:last-child td { border-bottom: 0; }
.prose tbody tr:hover, .table tbody tr:hover { background: var(--brand-50); }
.table__num { font-family: var(--font-mono); white-space: nowrap; }
.table__best { background: var(--success-50); font-weight: 700; color: var(--success-500); }

/* Первый абзац статьи крупнее — «зацеп» */
.prose > p:first-of-type { font-size: 1.24rem; color: var(--ink-800); }

@media (max-width: 640px) {
    .prose { font-size: 1.0625rem; }
    .prose > p:first-of-type { font-size: 1.125rem; }
}

/* --------------------------------------------------------------------------
   13. КОНТЕНТНЫЕ БЛОКИ (вставляются в текст статьи)
   -------------------------------------------------------------------------- */
/* Врезка-подсказка */
.callout {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: var(--sp-4);
    margin: var(--sp-8) 0;
    padding: var(--sp-5) var(--sp-6);
    border-radius: var(--radius);
    border: 1px solid var(--brand-200);
    background: var(--brand-50);
    font-size: 1.0625rem;
    line-height: 1.65;
}
.callout__icon { font-size: 1.4rem; line-height: 1.2; }
.callout__title { font-size: 1rem; margin-bottom: var(--sp-2); }
.callout p:last-child { margin-bottom: 0; }
.callout--warn    { border-color: #fcd9a5; background: var(--warn-50); }
.callout--danger  { border-color: #fecaca; background: var(--danger-50); }
.callout--success { border-color: #a7f3d0; background: var(--success-50); }
.callout--ai      { border-color: #ddd6fe; background: var(--ai-100); }

/* Совместимость с уже опубликованным контентом */
.prose .custom-info-block,
.prose .custom-warning-block {
    margin: var(--sp-8) 0;
    padding: var(--sp-5) var(--sp-6);
    border-radius: var(--radius);
    border-left: 4px solid var(--brand-500);
    background: var(--brand-50);
}
.prose .custom-warning-block { border-left-color: var(--accent-500); background: var(--warn-50); }
.prose .custom-info-block p:last-child,
.prose .custom-warning-block p:last-child { margin-bottom: 0; }

/* Ключевые выводы / TL;DR */
.keypoints {
    margin: var(--sp-8) 0;
    padding: var(--sp-6);
    border-radius: var(--radius-lg);
    background: var(--white);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-xs);
}
.keypoints__title {
    font-size: 1.05rem;
    margin-bottom: var(--sp-4);
}
.keypoints ul { margin: 0; padding: 0; list-style: none; }
.keypoints li {
    position: relative;
    padding-left: 1.9rem;
    margin-bottom: var(--sp-3);
    font-size: 1.0625rem;
    line-height: 1.6;
}
.keypoints li:last-child { margin-bottom: 0; }
.prose .keypoints { max-width: var(--measure); }
.prose .keypoints ul { padding-left: 0; }
.prose .keypoints ul > li { list-style: none; position: relative; padding-left: 1.9rem; margin-left: 0; }
.prose .keypoints ul > li::before,
.keypoints li::before {
    content: '';
    position: absolute; left: 0; top: .35em;
    width: 1.15rem; height: 1.15rem;
    border-radius: 50%;
    background: var(--brand-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") no-repeat 50% / .8rem;
}

/* Плюсы и минусы */
.proscons { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--sp-4); margin: var(--sp-8) 0; }
.proscons__col { padding: var(--sp-5); border-radius: var(--radius); border: 1px solid var(--border); background: var(--white); }
.proscons__col--pro { border-color: #a7f3d0; background: var(--success-50); }
.proscons__col--con { border-color: #fecaca; background: var(--danger-50); }
.proscons__title { display: flex; align-items: center; gap: var(--sp-2); font-size: 1rem; margin-bottom: var(--sp-3); }
.proscons__col--pro .proscons__title { color: var(--success-500); }
.proscons__col--con .proscons__title { color: var(--danger-500); }
.proscons ul { margin: 0; padding-left: 1.2em; font-size: var(--fs-sm); }
.proscons li { margin-bottom: var(--sp-2); }

/* Пошаговый разбор */
.steps { counter-reset: step; margin: var(--sp-8) 0; display: grid; gap: var(--sp-4); }
.step {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: var(--sp-4);
    padding: var(--sp-5);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.step__num {
    counter-increment: step;
    width: 44px; height: 44px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--radius-sm);
    background: var(--grad-brand);
    color: var(--white);
    font-family: var(--font-heading);
    font-weight: 800;
}
.step__num::before { content: counter(step); }
.step__title { font-size: 1.05rem; margin-bottom: var(--sp-2); }
.step p { margin: 0; font-size: var(--fs-sm); color: var(--text-muted); }

/* FAQ */
.faq { margin: var(--sp-8) 0; display: grid; gap: var(--sp-3); }
.faq__item {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--white);
    overflow: hidden;
}
.faq__item[open] { border-color: var(--brand-300); box-shadow: var(--shadow-xs); }
.faq__q {
    display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4);
    padding: var(--sp-4) var(--sp-5);
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 1.0625rem;
    color: var(--text-primary);
    cursor: pointer;
    list-style: none;
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q::after {
    content: '+';
    font-size: 1.4rem;
    color: var(--brand-600);
    transition: transform var(--t-base);
    flex: none;
}
.faq__item[open] .faq__q::after { transform: rotate(45deg); }
.faq__a { padding: 0 var(--sp-5) var(--sp-5); font-size: var(--fs-body); color: var(--text-body); }
.faq__a p:last-child { margin-bottom: 0; }

/* Списки внутри готовых блоков не должны подхватывать оформление списков
   лонгрида: у блоков свои маркеры и отступы. */
.prose .proscons ul,
.prose .callout ul,
.prose .clodex-block ul,
.prose .step ul,
.prose .faq__a ul,
.prose .toplist-item ul {
    padding-left: 1.35em;
}
.prose .proscons ul > li,
.prose .callout ul > li,
.prose .clodex-block ul > li,
.prose .step ul > li,
.prose .faq__a ul > li,
.prose .toplist-item ul > li {
    list-style: disc;
    position: static;
    padding-left: 0;
    margin-left: 0;
}
.prose .proscons ul > li::before,
.prose .callout ul > li::before,
.prose .clodex-block ul > li::before,
.prose .step ul > li::before,
.prose .faq__a ul > li::before,
.prose .toplist-item ul > li::before {
    content: none;
}

/* Промо-блок в тексте (конверсия) */
.promo {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--sp-6);
    margin: var(--sp-10) 0;
    padding: var(--sp-6);
    border-radius: var(--radius-lg);
    background: linear-gradient(120deg, #ecfeff 0%, #f0fdfa 55%, #fffbeb 100%);
    border: 1px solid var(--brand-200);
}
.promo__kicker { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--brand-700); }
.promo__title { font-size: 1.2rem; margin: var(--sp-2) 0 var(--sp-2); }
.promo__text { margin: 0; font-size: var(--fs-sm); color: var(--ink-600); }
.promo__gain { color: var(--accent-700); font-weight: 700; }
.promo__note { margin: var(--sp-3) 0 0; font-size: var(--fs-xs); color: var(--text-faint); }
.promo--dark { background: var(--grad-ink); border-color: transparent; }
.promo--dark .promo__kicker { color: var(--brand-200); }
.promo--dark .promo__title { color: var(--white); }
.promo--dark .promo__text { color: rgba(255,255,255,.78); }
.promo--dark .promo__note { color: rgba(255,255,255,.5); }
@media (max-width: 720px) {
    .promo { grid-template-columns: minmax(0, 1fr); }
    .promo .btn { width: 100%; }
}

/* --------------------------------------------------------------------------
   14. СТРАНИЦА СТАТЬИ
   -------------------------------------------------------------------------- */
.article { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
.article__head { padding: var(--sp-8) var(--sp-8) var(--sp-6); border-bottom: 1px solid var(--border); }
.article__cover { position: relative; aspect-ratio: 21 / 9; background: var(--grad-ink); }
.article__cover img { width: 100%; height: 100%; object-fit: cover; }
.article__title { font-size: var(--fs-h1); margin: var(--sp-4) 0 var(--sp-5); }
.article__lead { font-size: var(--fs-lead); color: var(--ink-600); max-width: var(--measure); margin: 0 0 var(--sp-5); }
.article__meta { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); font-size: var(--fs-xs); color: var(--text-muted); }
.article__meta b { color: var(--ink-700); font-weight: 600; }
.article__body { padding: var(--sp-8); }
.article__foot { padding: 0 var(--sp-8) var(--sp-8); display: grid; gap: var(--sp-6); }

.tags { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.tag {
    padding: .35rem .75rem;
    border-radius: var(--radius-pill);
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    color: var(--ink-600);
    font-size: var(--fs-xs);
    font-weight: 600;
}

.share { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); }
.share__label { font-size: var(--fs-sm); font-weight: 700; color: var(--ink-700); }
.share__btn {
    display: inline-flex; align-items: center; gap: var(--sp-2);
    padding: .5rem .95rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--ink-600);
    font-size: var(--fs-xs);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--t-fast);
}
.share__btn:hover { border-color: var(--brand-400); color: var(--brand-800); background: var(--brand-50); }

.author-card {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: var(--sp-5);
    padding: var(--sp-6);
    border-radius: var(--radius);
    background: var(--bg-subtle);
    border: 1px solid var(--border);
}
.author-card__avatar {
    width: 64px; height: 64px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--grad-brand);
    color: var(--white);
    font-size: 1.6rem;
}
.author-card__name { font-size: 1.05rem; margin-bottom: var(--sp-2); }
.author-card p { font-size: var(--fs-sm); color: var(--text-muted); margin-bottom: var(--sp-3); }
.author-card__facts { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); font-size: var(--fs-xs); color: var(--text-muted); }

.article-nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--sp-4); margin-top: var(--sp-8); }
.article-nav__link {
    padding: var(--sp-5);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--white);
    transition: all var(--t-base);
}
.article-nav__link:hover { border-color: var(--brand-300); box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.article-nav__dir { font-size: var(--fs-xs); color: var(--text-faint); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.article-nav__title { font-size: var(--fs-sm); font-weight: 700; color: var(--text-primary); margin-top: var(--sp-2); line-height: 1.45; }
.article-nav__link--next { text-align: right; }

@media (max-width: 640px) {
    .article__head, .article__body, .article__foot { padding-left: var(--sp-5); padding-right: var(--sp-5); }
    .article__head { padding-top: var(--sp-6); }
    .article__body { padding-top: var(--sp-6); }
    .author-card { grid-template-columns: minmax(0, 1fr); }
}

/* --------------------------------------------------------------------------
   15. ШАБЛОН «ОБЗОР СЕРВИСА»
   -------------------------------------------------------------------------- */
.verdict {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 230px;
    gap: var(--sp-6);
    padding: var(--sp-6);
    margin-bottom: var(--sp-8);
    border-radius: var(--radius-lg);
    background: var(--white);
    border: 1px solid var(--brand-200);
    box-shadow: var(--shadow-sm);
}
.verdict__label { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--brand-700); }
.verdict__title { font-size: 1.3rem; margin: var(--sp-2) 0 var(--sp-3); }
.verdict__text { margin: 0; font-size: var(--fs-body); color: var(--text-body); }
.verdict__facts { display: grid; gap: var(--sp-2); margin-top: var(--sp-4); font-size: var(--fs-sm); }
.verdict__fact { display: flex; gap: var(--sp-2); }
.verdict__fact b { color: var(--ink-800); }
.verdict__side {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--sp-3);
    padding: var(--sp-5);
    border-radius: var(--radius);
    background: var(--grad-brand-soft);
    text-align: center;
}
.score {
    width: 92px; height: 92px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--white);
    border: 5px solid var(--brand-500);
    font-family: var(--font-heading);
}
.score__value { font-size: 1.7rem; font-weight: 800; color: var(--brand-800); line-height: 1; }
.score__max { font-size: var(--fs-xs); color: var(--text-faint); }
.rating { display: flex; gap: 2px; color: var(--accent-500); font-size: 1.05rem; }
@media (max-width: 720px) { .verdict { grid-template-columns: minmax(0, 1fr); } }

.criteria { display: grid; gap: var(--sp-3); margin: var(--sp-8) 0; }
.criterion { display: grid; grid-template-columns: 190px minmax(0, 1fr) 46px; gap: var(--sp-4); align-items: center; font-size: var(--fs-sm); }
.criterion__name { font-weight: 600; color: var(--ink-700); }
.criterion__bar { height: 9px; border-radius: var(--radius-pill); background: var(--ink-100); overflow: hidden; }
.criterion__fill { height: 100%; border-radius: var(--radius-pill); background: var(--grad-brand); }
.criterion__value { font-family: var(--font-mono); font-weight: 600; color: var(--brand-800); text-align: right; }
@media (max-width: 600px) { .criterion { grid-template-columns: minmax(0, 1fr) 46px; } .criterion__bar { grid-column: 1 / -1; } }

/* --------------------------------------------------------------------------
   16. ШАБЛОН «ПОДБОРКА ТОП-N»
   -------------------------------------------------------------------------- */
.toplist { display: grid; gap: var(--sp-5); margin: var(--sp-8) 0; }
.toplist-item {
    position: relative;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: var(--sp-5);
    padding: var(--sp-6);
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    scroll-margin-top: calc(var(--header-h) + 20px);
    transition: box-shadow var(--t-base), border-color var(--t-base);
}
.toplist-item:hover { box-shadow: var(--shadow-md); border-color: var(--brand-200); }
.toplist-item--top { border-color: var(--accent-400); box-shadow: 0 0 0 3px #efffbd; }
.toplist-item__rank {
    width: 64px; height: 64px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--radius);
    background: var(--grad-brand);
    color: var(--white);
    font-family: var(--font-heading);
    font-size: 1.6rem;
    font-weight: 800;
}
.toplist-item--top .toplist-item__rank { background: var(--grad-accent); color: var(--ink-900); }
.toplist-item__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-3); }
.toplist-item__name { font-size: 1.2rem; }
.toplist-item__body { font-size: var(--fs-body); }
.toplist-item__body p:last-child { margin-bottom: 0; }
.toplist-item__facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--sp-3);
    margin: var(--sp-4) 0;
    padding: var(--sp-4);
    border-radius: var(--radius);
    background: var(--bg-subtle);
    font-size: var(--fs-sm);
}
.toplist-item__fact span { display: block; font-size: var(--fs-xs); color: var(--text-faint); }
.toplist-item__fact b { color: var(--ink-800); }
.toplist-item__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-4); }
@media (max-width: 640px) {
    .toplist-item { grid-template-columns: minmax(0, 1fr); padding: var(--sp-5); }
    .toplist-item__rank { width: 46px; height: 46px; font-size: 1.2rem; }
}

/* Быстрый переход по подборке */
.jumplist { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-6) 0; }

/* --------------------------------------------------------------------------
   17. БЛОКИ CLODEX (партнёрские таблицы цен в теле статьи)
   -------------------------------------------------------------------------- */
.prose .clodex-block {
    margin: var(--sp-10) 0;
    padding: var(--sp-6);
    border: 1px solid var(--brand-200);
    border-radius: var(--radius-lg);
    background: var(--white);
    box-shadow: var(--shadow-xs);
}
.prose .clodex-block h2 { margin: 0 0 var(--sp-4); font-size: var(--fs-h3); padding-top: 0; }
.prose .clodex-block h2::before { display: none; }
.prose .clodex-scroll { overflow-x: auto; border-radius: var(--radius); border: 1px solid var(--border); }
.prose .clodex-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: var(--fs-sm); }
.prose .clodex-table caption { text-align: left; font-family: var(--font-heading); font-weight: 700; padding: 0 0 var(--sp-3); color: var(--ink-800); }
.prose .clodex-table th, .prose .clodex-table td { padding: var(--sp-3) var(--sp-4); border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.prose .clodex-table th { background: var(--ink-50); font-family: var(--font-heading); border-bottom-color: var(--border-strong); }
.prose .clodex-note, .prose .clodex-disclosure { margin: var(--sp-3) 0 0; font-size: var(--fs-xs); color: var(--text-faint); }
.prose .clodex-cta { background: linear-gradient(120deg, #ecfeff 0%, #fffbeb 100%); border-color: var(--brand-200); }
.prose .clodex-button {
    display: inline-flex; align-items: center; gap: var(--sp-2);
    margin-top: var(--sp-3);
    padding: .8rem 1.5rem;
    border-radius: var(--radius-sm);
    background: var(--grad-accent);
    color: var(--ink-900) !important;
    font-family: var(--font-heading);
    font-weight: 700;
    text-decoration: none;
    box-shadow: var(--shadow-accent);
    transition: transform var(--t-fast), box-shadow var(--t-base);
}
.prose .clodex-button:hover { transform: translateY(-1px); box-shadow: 0 14px 32px rgba(134, 178, 28, .32); }
.prose .clodex-price-lines { white-space: nowrap; font-family: var(--font-mono); }

/* --------------------------------------------------------------------------
   18. ПОИСК, 404, О ПРОЕКТЕ
   -------------------------------------------------------------------------- */
.search-hero { padding: var(--sp-10) 0 var(--sp-6); }
.search-box { display: flex; gap: var(--sp-3); max-width: 640px; }
.search-box__input {
    flex: 1;
    padding: .85rem 1.1rem;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-sm);
    background: var(--white);
    font-size: var(--fs-body);
    transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.search-box__input:focus { outline: none; border-color: var(--brand-400); box-shadow: 0 0 0 4px var(--brand-50); }
.search-result { padding: var(--sp-5) 0; border-bottom: 1px solid var(--border); }
.search-result:last-child { border-bottom: 0; }
.search-result__title { font-size: 1.15rem; margin-bottom: var(--sp-2); }
.search-result__snippet { font-size: var(--fs-sm); color: var(--text-muted); margin: 0 0 var(--sp-2); }
.search-result mark { background: #fef08a; color: var(--ink-900); padding: 0 .15em; border-radius: 3px; }

.error-page { text-align: center; padding: var(--sp-20) 0 var(--sp-16); }
.error-page__code {
    font-family: var(--font-heading);
    font-size: clamp(4.5rem, 3rem + 9vw, 9rem);
    font-weight: 800;
    line-height: 1;
    background: var(--grad-brand);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.error-page__title { margin: var(--sp-4) 0 var(--sp-3); }
.error-page__text { color: var(--text-muted); max-width: 52ch; margin: 0 auto var(--sp-8); }
.error-page__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); justify-content: center; margin-bottom: var(--sp-12); }

.about-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--sp-5); margin: var(--sp-8) 0; }
.fact-tile {
    padding: var(--sp-6);
    border-radius: var(--radius-lg);
    background: var(--white);
    border: 1px solid var(--border);
    text-align: center;
}
.fact-tile__value { font-family: var(--font-heading); font-size: 2rem; font-weight: 800; color: var(--brand-700); line-height: 1.1; }
.fact-tile__label { font-size: var(--fs-sm); color: var(--text-muted); margin-top: var(--sp-2); }

/* --------------------------------------------------------------------------
   19. БРЕНДБУК (страница /brandbook/)
   -------------------------------------------------------------------------- */
.bb-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--sp-4); }
.bb-swatch { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; background: var(--white); }
.bb-swatch__chip { height: 84px; }
.bb-swatch__meta { padding: var(--sp-3); font-size: var(--fs-xs); }
.bb-swatch__name { font-weight: 700; color: var(--ink-800); display: block; }
.bb-swatch__hex { font-family: var(--font-mono); color: var(--text-faint); }
.bb-block { padding: var(--sp-6); background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.bb-rules { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--sp-4); }
.bb-rule { padding: var(--sp-5); border-radius: var(--radius); border: 1px solid var(--border); background: var(--white); }
.bb-rule--do  { border-left: 4px solid var(--success-500); }
.bb-rule--dont{ border-left: 4px solid var(--danger-500); }
.bb-visual-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); gap: var(--sp-5); align-items: stretch; }
.bb-visual-grid .bb-rules { grid-template-columns: minmax(0, 1fr); }
.bb-logo-lockup {
    display: grid;
    grid-template-columns: 108px minmax(0, 1fr);
    gap: var(--sp-5);
    align-items: center;
    margin-bottom: var(--sp-8);
    padding-bottom: var(--sp-6);
    border-bottom: 1px solid var(--border);
}
.bb-logo-lockup img { width: 108px; height: 108px; }
.bb-logo-lockup span { display: block; color: var(--text-faint); font-family: var(--font-mono); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .08em; }
.bb-logo-lockup strong { display: block; margin-top: var(--sp-1); font-family: var(--font-heading); font-size: 1.25rem; }
.bb-logo-lockup p { margin: var(--sp-2) 0 0; color: var(--text-muted); font-size: var(--fs-sm); }
.bb-hero-art { width: min(520px, 100%); margin: var(--sp-5) auto 0; filter: drop-shadow(0 22px 34px rgba(7, 21, 27, .17)); }
@media (max-width: 800px) { .bb-visual-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 520px) { .bb-logo-lockup { grid-template-columns: 72px minmax(0, 1fr); } .bb-logo-lockup img { width: 72px; height: 72px; } }
.bb-code {
    display: block;
    padding: var(--sp-4);
    border-radius: var(--radius);
    background: var(--ink-900);
    color: #a5f3fc;
    font-family: var(--font-mono);
    font-size: var(--fs-xs);
    overflow-x: auto;
    line-height: 1.6;
    white-space: pre;
}

/* --------------------------------------------------------------------------
   20. УТИЛИТЫ И ПЕЧАТЬ
   -------------------------------------------------------------------------- */
.u-muted { color: var(--text-muted); }
.u-small { font-size: var(--fs-sm); }
.u-xs { font-size: var(--fs-xs); }
.u-center { text-align: center; }
.u-mt-0 { margin-top: 0; }
.u-mt-4 { margin-top: var(--sp-4); }
.u-mt-8 { margin-top: var(--sp-8); }
.u-mb-0 { margin-bottom: 0; }
.u-nowrap { white-space: nowrap; }
.u-mono { font-family: var(--font-mono); }
.u-flex { display: flex; gap: var(--sp-3); flex-wrap: wrap; align-items: center; }
.u-between { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-4); flex-wrap: wrap; }
.u-hide-mobile { }
@media (max-width: 640px) { .u-hide-mobile { display: none !important; } }

@media print {
    .site-header, .site-footer, .sidebar, .share, .promo, .cta-box, .read-progress, .article-nav { display: none !important; }
    body { background: #fff; font-size: 12pt; }
    .layout { grid-template-columns: 1fr; }
    .article, .card { border: 0; box-shadow: none; }
    .prose { max-width: none; font-size: 12pt; }
    a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
}

/* --------------------------------------------------------------------------
   21. ШАБЛОН «ЛЕНДИНГ» (услуга или партнёрское предложение)
   Одна колонка без сайдбара: у страницы ровно одно целевое действие.
   -------------------------------------------------------------------------- */
.landing { max-width: 960px; margin: 0 auto; }

.landing-hero {
    position: relative;
    overflow: hidden;
    margin-top: var(--sp-6);
    padding: var(--sp-12) var(--sp-8);
    border-radius: var(--radius-xl);
    background: var(--grad-ink);
    color: var(--white);
    isolation: isolate;
}
.landing-hero::before {
    content: '';
    position: absolute; inset: -30% -20% auto -20%; height: 130%;
    background:
        radial-gradient(45% 55% at 25% 25%, rgba(34, 211, 238, .38) 0%, transparent 62%),
        radial-gradient(40% 50% at 78% 20%, rgba(245, 158, 11, .22) 0%, transparent 60%);
    z-index: -1;
}
.landing-hero__title { color: var(--white); font-size: var(--fs-display); margin: var(--sp-4) 0; max-width: 20ch; }
.landing-hero__lead { color: rgba(255, 255, 255, .85); font-size: var(--fs-lead); max-width: 56ch; margin-bottom: var(--sp-6); }
.landing-hero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center; }
.landing-hero__note { font-size: var(--fs-xs); color: rgba(255, 255, 255, .6); margin: var(--sp-4) 0 0; }

.benefits {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: var(--sp-4);
    margin: var(--sp-8) 0;
}
.benefit {
    padding: var(--sp-5);
    border-radius: var(--radius-lg);
    background: var(--bg-surface);
    border: 1px solid var(--border);
}
.benefit__icon {
    width: 42px; height: 42px;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: var(--sp-3);
    border-radius: var(--radius-sm);
    background: var(--grad-brand-soft);
    font-size: 1.25rem;
}
.benefit__title { font-size: 1.05rem; margin-bottom: var(--sp-2); }
.benefit p { margin: 0; font-size: var(--fs-sm); color: var(--text-muted); }

/* Финальный экран: последняя точка конверсии */
.landing-final {
    margin: var(--sp-12) 0 var(--sp-8);
    padding: var(--sp-10) var(--sp-8);
    border-radius: var(--radius-xl);
    background: var(--grad-brand-soft);
    border: 1px solid var(--brand-200);
    text-align: center;
}
.landing-final__title { font-size: var(--fs-h2); margin-bottom: var(--sp-3); }
.landing-final__text { max-width: 56ch; margin: 0 auto var(--sp-6); color: var(--text-muted); }
.landing-final__note { font-size: var(--fs-xs); color: var(--text-faint); margin: var(--sp-4) 0 0; }

/* Плашка действия на телефоне: появляется, когда экранный CTA уехал вверх */
.sticky-cta {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 90;
    display: none;
    align-items: center;
    gap: var(--sp-4);
    padding: var(--sp-3) var(--sp-4);
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--border);
    box-shadow: 0 -6px 24px rgba(11, 18, 32, .1);
    transform: translateY(110%);
    transition: transform var(--t-base);
}
.sticky-cta.is-visible { transform: translateY(0); }
.sticky-cta__text { flex: 1; font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.4; }
.sticky-cta__text b { display: block; color: var(--text-primary); font-size: var(--fs-sm); }
@media (max-width: 720px) {
    .sticky-cta { display: flex; }
    body.has-sticky-cta { padding-bottom: 84px; }
    .landing-hero { padding: var(--sp-8) var(--sp-5); }
    .landing-final { padding: var(--sp-8) var(--sp-5); }
}

/* --------------------------------------------------------------------------
   22. ШАБЛОН «ПАРТНЁРСКИЙ МАТЕРИАЛ»
   Читаемость лонгрида плюс сквозная конверсия: оффер-полоса под заголовком,
   промо в трёх точках текста, финальный экран, плашка действия на телефоне.
   -------------------------------------------------------------------------- */
.offer-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--sp-6);
    margin: 0 0 var(--sp-8);
    padding: var(--sp-5) var(--sp-6);
    border-radius: var(--radius-lg);
    background: var(--grad-ink);
    color: var(--white);
    position: relative;
    overflow: hidden;
}
.offer-bar::before {
    content: '';
    position: absolute; inset: -60% -20% auto -20%; height: 200%;
    background:
        radial-gradient(40% 60% at 20% 30%, rgba(34, 211, 238, .34) 0%, transparent 65%),
        radial-gradient(36% 55% at 85% 25%, rgba(245, 158, 11, .2) 0%, transparent 62%);
}
.offer-bar > * { position: relative; }
.offer-bar__kicker {
    font-size: var(--fs-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--brand-200);
}
.offer-bar__title { color: var(--white); font-size: 1.2rem; margin: var(--sp-2) 0; }
.offer-bar__text { margin: 0; color: rgba(255, 255, 255, .82); font-size: var(--fs-sm); }
.offer-bar__note { margin: var(--sp-3) 0 0; font-size: var(--fs-xs); color: rgba(255, 255, 255, .55); }
@media (max-width: 720px) {
    .offer-bar { grid-template-columns: minmax(0, 1fr); padding: var(--sp-5); }
    .offer-bar .btn { width: 100%; }
}

/* ==========================================================================
   23. ГЛАВНАЯ V2 — «РЕДАКЦИОННАЯ ЛАБОРАТОРИЯ»
   Домашняя страница говорит на языке сигналов, систем и проверяемых данных.
   Палитра: графит + петрол + сигнальный лайм. Компоненты статей не затронуты.
   ========================================================================== */
.page-home {
    --home-ink: #07151b;
    --home-ink-2: #0b2529;
    --home-teal: #0d5558;
    --home-cyan: #39d8e8;
    --home-lime: #d8ff59;
    --home-paper: #f2f5f2;
    --home-coral: #ff7657;
    background:
        radial-gradient(circle at 6% 8%, rgba(57, 216, 232, .08), transparent 25rem),
        var(--home-paper);
}
.page-home .page { padding-bottom: 0; }
.page-home .site-header {
    background: rgba(242, 245, 242, .9);
    border-bottom-color: rgba(7, 21, 27, .09);
}
.page-home .nav__link.is-active {
    background: rgba(216, 255, 89, .42);
    color: var(--home-ink);
}
.page-home .nav__link.is-active::after { background: var(--home-ink); }
.page-home .brand__mark {
    border-radius: 12px;
    outline: 1px solid rgba(7, 21, 27, .1);
}
.home-shell { position: relative; }

/* Hero */
.home-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(390px, .94fr);
    grid-template-areas:
        "copy visual"
        "metrics metrics";
    min-height: 690px;
    margin-top: 28px;
    padding: clamp(40px, 5vw, 72px) clamp(28px, 5vw, 70px) 0;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 36px;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(55% 70% at 82% 32%, rgba(57, 216, 232, .18), transparent 68%),
        radial-gradient(35% 55% at 14% 20%, rgba(216, 255, 89, .12), transparent 70%),
        linear-gradient(142deg, #061318 0%, #09252a 54%, #0a3437 100%);
    box-shadow: 0 28px 90px rgba(7, 21, 27, .14);
}
.home-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: .33;
    background-image:
        linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
    background-size: 54px 54px;
    mask-image: linear-gradient(to bottom, #000, transparent 86%);
    -webkit-mask-image: linear-gradient(to bottom, #000, transparent 86%);
}
.home-hero::after {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    right: -230px;
    top: -300px;
    z-index: -1;
    border: 1px solid rgba(216, 255, 89, .3);
    border-radius: 50%;
    box-shadow:
        0 0 0 52px rgba(216, 255, 89, .025),
        0 0 0 104px rgba(57, 216, 232, .025);
}
.home-hero__copy {
    grid-area: copy;
    position: relative;
    z-index: 3;
    align-self: center;
    max-width: 660px;
    padding: 0 0 42px;
}
.home-hero__topline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 22px;
    margin-bottom: clamp(38px, 5vw, 66px);
    font-family: var(--font-mono);
    font-size: .72rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.home-hero__edition { color: var(--home-lime); }
.home-hero__updated {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255,255,255,.56);
}
.home-hero__updated::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--home-cyan);
    box-shadow: 0 0 12px var(--home-cyan);
}
.home-hero__kicker {
    margin: 0 0 14px;
    color: rgba(255,255,255,.55);
    font-family: var(--font-mono);
    font-size: .72rem;
    letter-spacing: .14em;
}
.home-hero__title {
    max-width: 12ch;
    margin: 0;
    color: #f7faf6;
    font-size: clamp(3rem, 5.3vw, 5.35rem);
    font-weight: 700;
    line-height: .94;
    letter-spacing: -.055em;
}
.home-hero__title span {
    color: var(--home-lime);
    font-style: italic;
    font-weight: 600;
}
.home-hero__lead {
    max-width: 59ch;
    margin: 28px 0 0;
    color: rgba(244, 250, 248, .73);
    font-size: clamp(1rem, .96rem + .28vw, 1.18rem);
    line-height: 1.72;
}
.home-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}
.home-btn {
    min-height: 52px;
    padding: .85rem 1.35rem;
    border-radius: 999px;
    font-size: .92rem;
    letter-spacing: -.01em;
}
.home-btn span { font-size: 1.05em; }
.home-btn--lime {
    color: var(--home-ink);
    background: var(--home-lime);
    border-color: var(--home-lime);
    box-shadow: 0 14px 32px rgba(216, 255, 89, .13);
}
.home-btn--lime:hover {
    color: var(--home-ink);
    background: #e5ff88;
    box-shadow: 0 18px 40px rgba(216, 255, 89, .2);
}
.home-btn--glass {
    color: #f7faf6;
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .2);
    backdrop-filter: blur(10px);
}
.home-btn--glass:hover {
    color: var(--home-lime);
    border-color: rgba(216, 255, 89, .54);
    background: rgba(216, 255, 89, .07);
}
.home-hero__note {
    display: flex;
    align-items: baseline;
    gap: 9px;
    margin: 22px 0 0;
    color: rgba(255,255,255,.42);
    font-size: .78rem;
}
.home-hero__note span { color: var(--home-lime); font-size: .54rem; }

.home-hero__visual {
    grid-area: visual;
    position: relative;
    min-height: 510px;
    align-self: end;
}
.home-hero__visual img {
    position: absolute;
    z-index: 2;
    width: min(640px, 126%);
    max-width: none;
    right: -18%;
    bottom: -2%;
    filter: drop-shadow(0 32px 48px rgba(0,0,0,.28));
    animation: atlas-float 7s ease-in-out infinite;
}
.home-hero__orbit {
    position: absolute;
    z-index: 1;
    border: 1px solid rgba(57, 216, 232, .24);
    border-radius: 50%;
    transform: rotate(-18deg);
}
.home-hero__orbit--one { width: 380px; height: 220px; right: 3%; top: 23%; }
.home-hero__orbit--two { width: 290px; height: 410px; right: 10%; top: 10%; transform: rotate(33deg); }
.home-float-label {
    position: absolute;
    z-index: 4;
    display: inline-flex;
    gap: 8px;
    padding: 8px 11px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    color: rgba(255,255,255,.75);
    background: rgba(5, 22, 27, .66);
    backdrop-filter: blur(12px);
    font-family: var(--font-mono);
    font-size: .62rem;
    letter-spacing: .08em;
    box-shadow: 0 10px 24px rgba(0,0,0,.18);
}
.home-float-label b { color: var(--home-lime); font-weight: 500; }
.home-float-label--seo { left: 2%; top: 28%; }
.home-float-label--geo { right: -1%; top: 13%; }
.home-float-label--llm { right: 2%; bottom: 18%; }
.home-signal-card {
    position: absolute;
    z-index: 5;
    left: 0;
    bottom: 5%;
    width: 164px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 14px;
    background: rgba(6, 24, 29, .7);
    backdrop-filter: blur(14px);
    color: #fff;
    box-shadow: 0 18px 40px rgba(0,0,0,.18);
}
.home-signal-card span {
    display: block;
    color: rgba(255,255,255,.48);
    font-size: .64rem;
}
.home-signal-card strong {
    display: block;
    margin: 3px 0 9px;
    color: var(--home-lime);
    font-family: var(--font-heading);
    font-size: 1.45rem;
}
.home-signal-card i {
    display: block;
    height: 5px;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--home-lime) var(--signal), rgba(255,255,255,.12) var(--signal));
}
@keyframes atlas-float {
    0%, 100% { transform: translate3d(0, 0, 0) rotate(-1deg); }
    50% { transform: translate3d(0, -12px, 0) rotate(1deg); }
}

.home-metrics {
    grid-area: metrics;
    position: relative;
    z-index: 5;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0 calc(clamp(28px, 5vw, 70px) * -1);
    border-top: 1px solid rgba(255,255,255,.12);
    background: rgba(2, 14, 18, .34);
    backdrop-filter: blur(14px);
}
.home-metric {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 104px;
    padding: 22px clamp(18px, 3vw, 34px);
    border-right: 1px solid rgba(255,255,255,.1);
}
.home-metric:last-child { border-right: 0; }
.home-metric__num {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(1.5rem, 1.2rem + 1vw, 2.05rem);
    font-weight: 700;
    letter-spacing: -.04em;
}
.home-metric__label {
    color: rgba(255,255,255,.48);
    font-size: .7rem;
    line-height: 1.45;
}
.home-metric--status { justify-content: center; }
.home-metric__pulse {
    width: 11px;
    height: 11px;
    flex: none;
    border-radius: 50%;
    background: var(--home-lime);
    box-shadow: 0 0 0 0 rgba(216, 255, 89, .4);
    animation: home-pulse 2.4s infinite;
}
@keyframes home-pulse {
    0% { box-shadow: 0 0 0 0 rgba(216, 255, 89, .38); }
    70% { box-shadow: 0 0 0 9px rgba(216, 255, 89, 0); }
    100% { box-shadow: 0 0 0 0 rgba(216, 255, 89, 0); }
}

/* Навигационная полоса направлений */
.home-disciplines {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 18px 0 clamp(72px, 9vw, 120px);
    border-block: 1px solid rgba(7, 21, 27, .14);
}
.home-disciplines a {
    display: grid;
    grid-template-columns: 30px 1fr;
    padding: 22px 20px;
    border-right: 1px solid rgba(7, 21, 27, .12);
    color: var(--home-ink);
    transition: background var(--t-base), transform var(--t-base);
}
.home-disciplines a:last-child { border-right: 0; }
.home-disciplines a:hover {
    color: var(--home-ink);
    background: rgba(216, 255, 89, .42);
    transform: translateY(-2px);
}
.home-disciplines span {
    grid-row: 1 / 3;
    color: var(--home-teal);
    font-family: var(--font-mono);
    font-size: .65rem;
}
.home-disciplines strong {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    letter-spacing: -.03em;
}
.home-disciplines small { color: var(--ink-500); font-size: .72rem; }

/* Секции и редакционная сетка */
.home-section { margin: clamp(72px, 10vw, 136px) 0; }
.home-section__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 34px;
}
.home-section__index {
    margin: 0 0 13px;
    color: var(--home-teal);
    font-family: var(--font-mono);
    font-size: .68rem;
    font-weight: 500;
    letter-spacing: .12em;
}
.home-section__head h2 {
    max-width: 18ch;
    color: var(--home-ink);
    font-size: clamp(2rem, 1.55rem + 2vw, 3.45rem);
    line-height: 1;
    letter-spacing: -.055em;
}
.home-section__head > div > p:last-child {
    max-width: 62ch;
    margin: 15px 0 0;
    color: var(--ink-500);
    font-size: .95rem;
}
.home-text-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: none;
    padding-bottom: 5px;
    border-bottom: 1px solid currentColor;
    color: var(--home-ink);
    font-family: var(--font-heading);
    font-size: .88rem;
    font-weight: 700;
}
.home-text-link:hover { color: var(--home-teal); }

.home-editorial-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 18px;
}
.home-editorial-grid .card { grid-column: span 3; border-radius: 20px; }
.home-editorial-grid .card:nth-child(1),
.home-editorial-grid .card:nth-child(6) { grid-column: span 6; }
.home-editorial-grid .card:nth-child(1) .card__title,
.home-editorial-grid .card:nth-child(6) .card__title {
    max-width: 22ch;
    font-size: clamp(1.25rem, 1.05rem + .7vw, 1.65rem);
}
.home-editorial-grid .card:nth-child(1) .card__media,
.home-editorial-grid .card:nth-child(6) .card__media { aspect-ratio: 2 / 1; }
.home-editorial-grid .card__body { padding: 22px; }
.home-editorial-grid .card__media::after,
.home-popular-grid .card__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(7, 21, 27, .13), transparent 55%);
    pointer-events: none;
}
.home-editorial-grid .card:hover,
.home-popular-grid .card:hover {
    transform: translateY(-6px);
    border-color: rgba(13, 85, 88, .35);
    box-shadow: 0 24px 54px rgba(7, 21, 27, .12);
}

/* Разделы как bento-карта */
.home-topic-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 16px;
}
.home-topic-grid .topic-card {
    position: relative;
    grid-column: span 3;
    min-height: 220px;
    padding: 25px;
    border-radius: 20px;
    overflow: hidden;
}
.home-topic-grid .topic-card:nth-child(1),
.home-topic-grid .topic-card:nth-child(2) { grid-column: span 6; min-height: 260px; }
.home-topic-grid .topic-card:nth-child(1) {
    color: #fff;
    background: var(--home-ink);
    border-color: var(--home-ink);
}
.home-topic-grid .topic-card:nth-child(2) {
    background: var(--home-lime);
    border-color: var(--home-lime);
}
.home-topic-grid .topic-card::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    right: -50px;
    bottom: -60px;
    border: 1px solid rgba(13, 85, 88, .17);
    border-radius: 50%;
    box-shadow: 0 0 0 28px rgba(13, 85, 88, .035);
}
.home-topic-grid .topic-card:nth-child(1)::after {
    border-color: rgba(216, 255, 89, .28);
    box-shadow: 0 0 0 28px rgba(216, 255, 89, .04);
}
.home-topic-grid .topic-card:nth-child(1) .topic-card__title { color: #fff; }
.home-topic-grid .topic-card:nth-child(1) .topic-card__desc { color: rgba(255,255,255,.58); }
.home-topic-grid .topic-card:nth-child(1) .topic-card__count { color: var(--home-lime); }
.home-topic-grid .topic-card:nth-child(1) .topic-card__icon { background: rgba(255,255,255,.08); }
.home-topic-grid .topic-card:nth-child(2) .topic-card__icon { background: rgba(7,21,27,.08); }
.home-topic-grid .topic-card__icon {
    position: relative;
    z-index: 1;
    width: 52px;
    height: 52px;
    border-radius: 50%;
}
.home-topic-grid .topic-card__title {
    position: relative;
    z-index: 1;
    margin-top: auto;
    font-size: 1.22rem;
}
.home-topic-grid .topic-card__desc,
.home-topic-grid .topic-card__count { position: relative; z-index: 1; }

/* Связка SEO → GEO → LLM → WEB */
.home-system {
    position: relative;
    display: grid;
    grid-template-columns: .82fr 1.18fr;
    gap: clamp(34px, 6vw, 88px);
    margin: clamp(84px, 12vw, 150px) 0;
    padding: clamp(40px, 6vw, 76px);
    border-radius: 32px;
    overflow: hidden;
    color: rgba(255,255,255,.7);
    background:
        radial-gradient(circle at 80% 10%, rgba(57,216,232,.13), transparent 32%),
        var(--home-ink);
}
.home-system::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .24;
    background-image: radial-gradient(rgba(255,255,255,.22) 1px, transparent 1px);
    background-size: 22px 22px;
    mask-image: linear-gradient(90deg, transparent, #000);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000);
}
.home-system > * { position: relative; z-index: 1; }
.home-system .home-section__index { color: var(--home-lime); }
.home-system__intro h2 {
    margin: 0 0 25px;
    color: #fff;
    font-size: clamp(2.2rem, 1.7rem + 2vw, 3.8rem);
    line-height: .98;
    letter-spacing: -.055em;
}
.home-system__intro h2 span { color: var(--home-cyan); }
.home-system__intro > p:not(.home-section__index) { max-width: 48ch; line-height: 1.7; }
.home-text-link--light { margin-top: 18px; color: var(--home-lime); }
.home-text-link--light:hover { color: #fff; }
.home-system__map {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.home-system-node {
    position: relative;
    z-index: 2;
    min-height: 190px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 18px;
    background: rgba(255,255,255,.055);
    backdrop-filter: blur(8px);
    transition: transform var(--t-base), border-color var(--t-base), background var(--t-base);
}
.home-system-node:hover {
    transform: translateY(-4px);
    border-color: rgba(216,255,89,.45);
    background: rgba(216,255,89,.06);
}
.home-system-node span {
    color: rgba(255,255,255,.42);
    font-family: var(--font-mono);
    font-size: .62rem;
    letter-spacing: .08em;
}
.home-system-node strong {
    display: block;
    margin: 22px 0 7px;
    color: var(--home-lime);
    font-family: var(--font-heading);
    font-size: 2.3rem;
    line-height: 1;
}
.home-system-node:nth-child(2) strong { color: var(--home-cyan); }
.home-system-node:nth-child(3) strong { color: #fff; }
.home-system-node:nth-child(4) strong { color: var(--home-coral); }
.home-system-node p { margin: 0; color: rgba(255,255,255,.56); font-size: .78rem; line-height: 1.55; }
.home-system__path {
    position: absolute;
    inset: 50% 15% auto;
    z-index: 1;
    height: 1px;
    background: linear-gradient(90deg, var(--home-lime), var(--home-cyan), var(--home-coral));
}
.home-system__path i {
    position: absolute;
    top: -4px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 15px rgba(255,255,255,.65);
}
.home-system__path i:nth-child(1) { left: 0; }
.home-system__path i:nth-child(2) { left: 33%; }
.home-system__path i:nth-child(3) { left: 66%; }
.home-system__path i:nth-child(4) { right: 0; }

.page-home .promo {
    border: 1px solid rgba(13, 85, 88, .2);
    border-radius: 22px;
    background:
        linear-gradient(110deg, rgba(57,216,232,.09), rgba(216,255,89,.28)),
        #fff;
    box-shadow: 0 18px 50px rgba(7,21,27,.08);
}

/* Популярное */
.home-section--popular {
    position: relative;
    padding: clamp(34px, 5vw, 64px);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 32px;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 4%, rgba(57, 216, 232, .14), transparent 28rem),
        radial-gradient(circle at 7% 96%, rgba(216, 255, 89, .08), transparent 24rem),
        var(--home-ink);
    box-shadow: 0 26px 70px rgba(7, 21, 27, .12);
}
.home-section--popular::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .18;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(135deg, #000, transparent 72%);
    -webkit-mask-image: linear-gradient(135deg, #000, transparent 72%);
}
.home-section--popular > * { position: relative; z-index: 1; }
.home-section--popular .home-section__index { color: var(--home-lime); }
.home-section--popular .home-section__head h2 { color: #f7faf6; }
.home-section--popular .home-section__head > div > p:last-child { color: rgba(255,255,255,.56); }
.home-popular-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    counter-reset: popular-card;
}
.home-popular-grid .card {
    counter-increment: popular-card;
    display: flex;
    flex-direction: column;
    min-width: 0;
    border-color: rgba(255,255,255,.12);
    border-radius: 20px;
    background: rgba(255,255,255,.065);
    box-shadow: inset 0 1px rgba(255,255,255,.04);
    backdrop-filter: blur(8px);
}
.home-popular-grid .card::before {
    content: "0" counter(popular-card);
    position: absolute;
    z-index: 4;
    top: 14px;
    right: 14px;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(216,255,89,.52);
    border-radius: 50%;
    color: var(--home-lime);
    background: rgba(7,21,27,.72);
    font-family: var(--font-mono);
    font-size: .66rem;
    letter-spacing: .04em;
    backdrop-filter: blur(10px);
}
.home-popular-grid .card:hover {
    border-color: rgba(216,255,89,.45);
    background: rgba(255,255,255,.085);
    box-shadow: 0 22px 48px rgba(0,0,0,.22);
}
.home-popular-grid .card__media {
    min-height: 0;
    aspect-ratio: 16 / 7;
    background: var(--home-teal);
}
.home-popular-grid .card__media img {
    filter: grayscale(1) contrast(1.08) brightness(.68) sepia(.55) hue-rotate(128deg) saturate(1.8);
    opacity: .82;
}
.home-popular-grid .card:hover .card__media img {
    transform: scale(1.035);
    filter: grayscale(.82) contrast(1.08) brightness(.75) sepia(.45) hue-rotate(128deg) saturate(1.65);
}
.home-popular-grid .card__media::after {
    background:
        linear-gradient(135deg, rgba(57,216,232,.2), rgba(216,255,89,.1)),
        linear-gradient(to top, rgba(7,21,27,.58), transparent 66%);
}
.home-popular-grid .card__body {
    min-height: 230px;
    padding: 22px;
    gap: 15px;
}
.home-popular-grid .badge {
    color: var(--home-ink);
    background: var(--home-lime);
}
.home-popular-grid .card__top .meta__item { color: rgba(255,255,255,.56); }
.home-popular-grid .card__excerpt { display: none; }
.home-popular-grid .card__title {
    font-size: clamp(1rem, .94rem + .22vw, 1.14rem);
    line-height: 1.38;
}
.home-popular-grid .card__title a { color: #f7faf6; }
.home-popular-grid .card__title a:hover { color: var(--home-lime); }
.home-popular-grid .card__foot {
    margin-top: auto;
    border-top-color: rgba(255,255,255,.12);
}
.home-popular-grid .card__foot .meta__item { color: rgba(255,255,255,.48); }
.home-popular-grid .card__more { color: var(--home-lime); }

/* Опорные принципы */
.home-principles__grid {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: clamp(34px, 7vw, 96px);
    align-items: start;
}
.home-principles__lead > p {
    margin: 0;
    color: var(--home-ink);
    font-family: var(--font-heading);
    font-size: clamp(1.25rem, 1rem + .8vw, 1.75rem);
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: -.025em;
}
.home-principles__quote {
    margin-top: 34px;
    padding: 24px 0 0 28px;
    border-top: 1px solid rgba(7,21,27,.18);
    border-left: 4px solid var(--home-lime);
    color: var(--ink-500);
    font-size: .92rem;
    line-height: 1.65;
}
.home-principles__checklist { border-top: 1px solid rgba(7,21,27,.17); }
.home-principles__checklist article {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 16px;
    padding: 20px 0;
    border-bottom: 1px solid rgba(7,21,27,.14);
}
.home-principles__checklist article > span {
    color: var(--home-teal);
    font-family: var(--font-mono);
    font-size: .68rem;
}
.home-principles__checklist h3 { margin: 0 0 4px; font-size: 1.02rem; }
.home-principles__checklist p { margin: 0; color: var(--ink-500); font-size: .82rem; line-height: 1.55; }

/* Финальный манифест */
.home-manifesto {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 28px;
    align-items: end;
    margin: clamp(80px, 12vw, 150px) 0 64px;
    padding: clamp(36px, 6vw, 74px);
    border-radius: 30px;
    background: var(--home-lime);
    color: var(--home-ink);
}
.home-manifesto > p {
    grid-column: 1 / -1;
    margin: 0;
    font-family: var(--font-mono);
    font-size: .7rem;
    letter-spacing: .12em;
}
.home-manifesto h2 {
    max-width: 15ch;
    color: var(--home-ink);
    font-size: clamp(2.2rem, 1.55rem + 2.8vw, 4.6rem);
    line-height: .98;
    letter-spacing: -.06em;
}
.home-manifesto h2 span { color: var(--home-teal); font-style: italic; }
.home-btn--dark {
    color: #fff;
    background: var(--home-ink);
    border-color: var(--home-ink);
}
.home-btn--dark:hover { color: var(--home-lime); background: var(--home-ink-2); }

@media (max-width: 1100px) {
    .home-hero { grid-template-columns: minmax(0, 1fr) 380px; }
    .home-hero__visual img { width: 600px; right: -34%; }
    .home-editorial-grid .card { grid-column: span 4; }
    .home-editorial-grid .card:nth-child(1),
    .home-editorial-grid .card:nth-child(6) { grid-column: span 6; }
    .home-popular-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .home-hero {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "copy" "visual" "metrics";
        padding-bottom: 0;
    }
    .home-hero__copy { max-width: 720px; padding-bottom: 10px; }
    .home-hero__title { max-width: 11ch; }
    .home-hero__visual { min-height: 430px; }
    .home-hero__visual img { width: min(620px, 95%); right: 0; left: 50%; transform: translateX(-50%); }
    .home-hero__visual img { animation-name: atlas-float-tablet; }
    @keyframes atlas-float-tablet {
        0%, 100% { transform: translate3d(-50%, 0, 0) rotate(-1deg); }
        50% { transform: translate3d(-50%, -10px, 0) rotate(1deg); }
    }
    .home-float-label--seo { left: 10%; }
    .home-float-label--geo { right: 9%; }
    .home-float-label--llm { right: 11%; }
    .home-signal-card { left: 8%; }
    .home-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-metric:nth-child(2) { border-right: 0; }
    .home-metric:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.1); }
    .home-disciplines { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-disciplines a:nth-child(2) { border-right: 0; }
    .home-disciplines a:nth-child(-n+2) { border-bottom: 1px solid rgba(7,21,27,.12); }
    .home-editorial-grid .card,
    .home-editorial-grid .card:nth-child(1),
    .home-editorial-grid .card:nth-child(6) { grid-column: span 6; }
    .home-topic-grid .topic-card,
    .home-topic-grid .topic-card:nth-child(1),
    .home-topic-grid .topic-card:nth-child(2) { grid-column: span 6; min-height: 230px; }
    .home-system { grid-template-columns: minmax(0, 1fr); }
    .home-principles__grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 680px) {
    .home-hero {
        margin-top: 14px;
        padding: 30px 20px 0;
        border-radius: 24px;
    }
    .home-hero__topline { margin-bottom: 42px; }
    .home-hero__kicker { letter-spacing: .1em; }
    .home-hero__title { font-size: clamp(2.65rem, 12vw, 4rem); }
    .home-hero__lead { font-size: .98rem; line-height: 1.63; }
    .home-hero__actions { flex-direction: column; align-items: stretch; }
    .home-btn { width: 100%; }
    .home-hero__note { align-items: flex-start; }
    .home-hero__visual { min-height: 340px; }
    .home-hero__visual img { width: 118%; bottom: 0; }
    .home-hero__orbit { opacity: .55; }
    .home-float-label { font-size: .52rem; padding: 6px 8px; }
    .home-float-label--seo { left: 0; top: 30%; }
    .home-float-label--geo { right: 0; top: 10%; }
    .home-float-label--llm { right: 2%; bottom: 16%; }
    .home-signal-card { left: 0; bottom: 2%; width: 138px; }
    .home-metrics { margin: 0 -20px; }
    .home-metric { min-height: 94px; padding: 17px 14px; gap: 9px; }
    .home-metric__num { font-size: 1.35rem; }
    .home-metric__label { font-size: .61rem; }
    .home-disciplines { margin-bottom: 74px; }
    .home-disciplines a { padding: 17px 10px; grid-template-columns: 24px 1fr; }
    .home-disciplines strong { font-size: 1.08rem; }
    .home-disciplines small { font-size: .62rem; }
    .home-section__head { align-items: flex-start; flex-direction: column; }
    .home-section__head h2 { font-size: clamp(2rem, 10vw, 3rem); }
    .home-editorial-grid { grid-template-columns: minmax(0, 1fr); }
    .home-editorial-grid .card,
    .home-editorial-grid .card:nth-child(1),
    .home-editorial-grid .card:nth-child(6) { grid-column: auto; }
    .home-editorial-grid .card:nth-child(1) .card__media,
    .home-editorial-grid .card:nth-child(6) .card__media { aspect-ratio: 16 / 9; }
    .home-topic-grid { grid-template-columns: minmax(0, 1fr); }
    .home-topic-grid .topic-card,
    .home-topic-grid .topic-card:nth-child(1),
    .home-topic-grid .topic-card:nth-child(2) { grid-column: auto; min-height: 210px; }
    .home-system { margin-inline: -4px; padding: 34px 20px; border-radius: 24px; }
    .home-system__map { grid-template-columns: minmax(0, 1fr); }
    .home-system-node { min-height: 164px; }
    .home-system__path { display: none; }
    .home-popular-grid { grid-template-columns: minmax(0, 1fr); }
    .home-section--popular { padding: 28px 18px; border-radius: 24px; }
    .home-popular-grid .card__body { min-height: 210px; }
    .home-manifesto { grid-template-columns: minmax(0, 1fr); padding: 34px 22px; border-radius: 24px; }
    .home-manifesto h2 { font-size: clamp(2.15rem, 11vw, 3.45rem); }
}

/* ==========================================================================
   24. ПАРТНЁРСКАЯ СИСТЕМА V2 — «SIGNAL ACCESS»
   Единый визуальный слой для всего раздела ИИ: категория, статья, обзоры,
   подборки, ценовые таблицы и CTA. Палитра совпадает с главной и логотипом.
   ========================================================================== */
.page-partner {
    --partner-ink: #07151b;
    --partner-ink-2: #0b2529;
    --partner-teal: #0d5558;
    --partner-cyan: #39d8e8;
    --partner-lime: #d8ff59;
    --partner-paper: #f2f5f2;
    --partner-coral: #ff7657;
    background:
        radial-gradient(circle at 4% 9%, rgba(57, 216, 232, .09), transparent 25rem),
        radial-gradient(circle at 96% 32%, rgba(216, 255, 89, .08), transparent 22rem),
        var(--partner-paper);
}
.page-partner .site-header {
    background: rgba(242, 245, 242, .92);
    border-bottom-color: rgba(7, 21, 27, .1);
}
.page-partner .nav__link.is-active {
    color: var(--partner-ink);
    background: rgba(216, 255, 89, .45);
}
.page-partner .nav__link.is-active::after { background: var(--partner-ink); }
.page-partner .breadcrumbs { color: rgba(7, 21, 27, .58); }
.page-partner .breadcrumbs a { color: rgba(7, 21, 27, .58); }
.page-partner .breadcrumbs__current { color: var(--partner-ink); }
.page-partner .read-progress__bar { background: linear-gradient(90deg, var(--partner-cyan), var(--partner-lime)); }

/* Заголовок партнёрской статьи */
.page-partner .article {
    border-color: rgba(7, 21, 27, .1);
    border-radius: 28px;
    box-shadow: 0 18px 54px rgba(7, 21, 27, .08);
}
.page-partner .article__head.partner-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(230px, .5fr);
    min-height: 500px;
    padding: clamp(34px, 5vw, 64px);
    border: 0;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(52% 70% at 90% 35%, rgba(57, 216, 232, .2), transparent 70%),
        radial-gradient(42% 60% at 12% 0%, rgba(216, 255, 89, .1), transparent 72%),
        linear-gradient(143deg, var(--partner-ink) 0%, var(--partner-ink-2) 55%, #0a393c 100%);
}
.page-partner .article__head.partner-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: .28;
    background-image:
        linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(90deg, transparent, #000 65%);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 65%);
}
.partner-hero__copy { position: relative; z-index: 2; align-self: center; min-width: 0; }
.partner-hero__eyebrow {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 22px;
    margin: 0 0 26px;
    color: var(--partner-cyan);
    font-family: var(--font-mono);
    font-size: .72rem;
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.partner-hero__eyebrow span:last-child { color: var(--partner-lime); }
.page-partner .partner-hero .article__title {
    max-width: 19ch;
    margin: 0 0 24px;
    color: #fff;
    font-size: clamp(2.35rem, 2rem + 1.35vw, 3.45rem);
    line-height: 1.01;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.page-partner .partner-hero .article__lead {
    max-width: 61ch;
    margin-bottom: 26px;
    color: rgba(255,255,255,.75);
    font-size: 1.03rem;
    line-height: 1.62;
}
.page-partner .partner-hero .article__meta {
    gap: 10px 24px;
    color: rgba(255,255,255,.58);
    font-family: var(--font-mono);
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .035em;
}
.page-partner .partner-hero .article__meta b { color: #fff; font-weight: 500; }
.partner-hero__disclosure {
    max-width: 66ch;
    margin: 24px 0 0;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.48);
    font-size: .72rem;
    line-height: 1.55;
}
.partner-hero__visual { position: relative; min-height: 360px; align-self: stretch; }
.partner-hero__index {
    position: absolute;
    top: 0;
    right: 0;
    color: rgba(255,255,255,.55);
    font-family: var(--font-mono);
    font-size: .66rem;
    letter-spacing: .11em;
}
.partner-hero__mark {
    position: absolute;
    z-index: 3;
    left: 50%;
    top: 50%;
    width: 132px;
    height: 132px;
    transform: translate(-50%, -50%) rotate(-4deg);
    filter: drop-shadow(0 20px 28px rgba(0,0,0,.28));
}
.partner-hero__orbit {
    position: absolute;
    left: 50%; top: 50%;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    transform: translate(-50%, -50%) rotate(-18deg);
}
.partner-hero__orbit--one { width: 254px; height: 254px; }
.partner-hero__orbit--two { width: 318px; height: 184px; transform: translate(-50%, -50%) rotate(28deg); }
.partner-hero__node { position: absolute; z-index: 4; width: 13px; height: 13px; border-radius: 50%; box-shadow: 0 0 0 6px rgba(255,255,255,.06); }
.partner-hero__node--cyan { left: 8%; top: 29%; background: var(--partner-cyan); }
.partner-hero__node--lime { right: 7%; top: 45%; background: var(--partner-lime); }
.partner-hero__node--coral { left: 27%; bottom: 12%; background: var(--partner-coral); }
.partner-hero__label {
    position: absolute;
    z-index: 5;
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(7,21,27,.68);
    color: rgba(255,255,255,.7);
    font-family: var(--font-mono);
    font-size: .58rem;
    letter-spacing: .08em;
    backdrop-filter: blur(8px);
}
.partner-hero__label--models { top: 19%; left: -2%; }
.partner-hero__label--access { right: -2%; bottom: 18%; color: var(--partner-lime); }

/* Ритм и читабельность лонгрида */
.page-partner .article__body { padding: clamp(26px, 4vw, 46px); }
.page-partner .article__foot { padding-inline: clamp(26px, 4vw, 46px); padding-bottom: clamp(28px, 4vw, 46px); }
.page-partner .prose h2::before { background: linear-gradient(90deg, var(--partner-cyan), var(--partner-lime)); }
.page-partner .prose a { color: #126f78; text-decoration-color: rgba(57,216,232,.55); }
.page-partner .prose li::marker,
.page-partner .prose ul > li::before { color: var(--partner-teal); background: var(--partner-cyan); }
.page-partner .toc__link.is-active {
    color: var(--partner-ink);
    border-left-color: var(--partner-lime);
    background: rgba(216,255,89,.2);
}

/* Все конверсионные компоненты говорят на одном визуальном языке */
.page-partner .offer-bar {
    margin-bottom: 42px;
    padding: 26px 28px;
    border: 1px solid rgba(57,216,232,.22);
    border-radius: 20px;
    background: linear-gradient(135deg, #09252a 0%, #0d5558 100%);
    box-shadow: 0 16px 36px rgba(7,21,27,.12);
}
.page-partner .offer-bar::before {
    inset: -80% -10% auto 35%;
    background:
        radial-gradient(42% 58% at 38% 34%, rgba(57,216,232,.28), transparent 70%),
        radial-gradient(32% 48% at 85% 45%, rgba(216,255,89,.19), transparent 72%);
}
.page-partner .offer-bar__kicker,
.page-partner .promo__kicker,
.page-partner .cta-box__kicker { color: var(--partner-lime); font-family: var(--font-mono); }
.page-partner .offer-bar__title { font-size: 1.32rem; }
.page-partner .offer-bar__text { max-width: 62ch; }
.page-partner .btn--cta,
.page-partner .clodex-button {
    border-color: transparent;
    background: var(--grad-accent);
    color: var(--partner-ink) !important;
    text-decoration: none !important;
    box-shadow: var(--shadow-accent);
}
.page-partner .btn--cta:hover,
.page-partner .clodex-button:hover { color: var(--partner-ink) !important; text-decoration: none !important; }
.page-partner .promo,
.page-partner .prose .clodex-block {
    border-color: rgba(13,85,88,.2);
    background: linear-gradient(135deg, rgba(57,216,232,.1), rgba(216,255,89,.12));
}
.page-partner .promo { border-left: 4px solid var(--partner-cyan); }
.page-partner .promo__kicker { color: var(--partner-teal); }
.page-partner .promo__gain { color: #48630a; }
.page-partner .prose .clodex-cta { border-left: 4px solid var(--partner-lime); }
.page-partner .prose .clodex-table th { background: rgba(13,85,88,.07); }
.page-partner .cta-box {
    border: 1px solid rgba(57,216,232,.18);
    border-radius: 22px;
    background: linear-gradient(145deg, var(--partner-ink) 0%, var(--partner-ink-2) 55%, var(--partner-teal) 145%);
}
.page-partner .cta-box::before { background: radial-gradient(50% 60% at 50% 20%, rgba(57,216,232,.28), transparent 70%); }
.page-partner .landing-final {
    position: relative;
    overflow: hidden;
    border-color: rgba(13,85,88,.18);
    background:
        radial-gradient(circle at 92% 15%, rgba(57,216,232,.16), transparent 14rem),
        linear-gradient(135deg, #edf8f5, #f5ffdc);
}
.page-partner .landing-final__title { color: var(--partner-ink); }
.page-partner .sticky-cta {
    border-top-color: rgba(57,216,232,.2);
    background: rgba(7,21,27,.96);
}
.page-partner .sticky-cta__text { color: rgba(255,255,255,.58); }
.page-partner .sticky-cta__text b { color: #fff; }
.page-partner .landing-hero {
    border: 1px solid rgba(57,216,232,.16);
    border-radius: 30px;
    background:
        radial-gradient(48% 66% at 84% 26%, rgba(57,216,232,.22), transparent 70%),
        radial-gradient(38% 54% at 10% 0%, rgba(216,255,89,.11), transparent 72%),
        linear-gradient(143deg, var(--partner-ink), var(--partner-ink-2) 58%, var(--partner-teal));
    box-shadow: 0 22px 64px rgba(7,21,27,.14);
}
.page-partner .landing-hero::before {
    background:
        radial-gradient(45% 55% at 25% 25%, rgba(57,216,232,.3), transparent 62%),
        radial-gradient(40% 50% at 78% 20%, rgba(216,255,89,.16), transparent 60%);
}
.page-partner .benefit { border-color: rgba(7,21,27,.11); }
.page-partner .benefit__icon { background: rgba(57,216,232,.11); }

/* Категория ИИ как самостоятельная партнёрская витрина */
.partner-category-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.16fr) minmax(330px, .84fr);
    gap: clamp(28px, 5vw, 70px);
    min-height: 510px;
    padding: clamp(38px, 6vw, 76px);
    border: 0;
    border-radius: 34px;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(48% 68% at 83% 37%, rgba(57,216,232,.2), transparent 68%),
        linear-gradient(143deg, var(--partner-ink), #0a2d31 64%, var(--partner-teal));
    box-shadow: 0 25px 74px rgba(7,21,27,.14);
}
.partner-category-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .28;
    background-image:
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: linear-gradient(90deg, transparent 8%, #000 90%);
    -webkit-mask-image: linear-gradient(90deg, transparent 8%, #000 90%);
}
.partner-category-hero__copy { align-self: center; position: relative; z-index: 2; }
.partner-category-hero__eyebrow {
    margin: 0 0 26px;
    color: var(--partner-cyan);
    font-family: var(--font-mono);
    font-size: .72rem;
    letter-spacing: .12em;
}
.partner-category-hero .page-hero__title {
    max-width: 12ch;
    margin: 0 0 24px;
    color: #fff;
    font-size: clamp(3rem, 2rem + 3.2vw, 5.7rem);
    line-height: .94;
    letter-spacing: -.055em;
    text-wrap: balance;
}
.partner-category-hero .page-hero__lead { color: rgba(255,255,255,.72); font-size: 1.03rem; line-height: 1.65; }
.partner-category-hero .page-hero__stats { gap: 28px; margin-top: 30px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); }
.partner-category-hero .page-hero__stat b { color: #fff; font-family: var(--font-mono); font-size: 1.3rem; }
.partner-category-hero .page-hero__stat span { color: rgba(255,255,255,.5); text-transform: uppercase; letter-spacing: .06em; }
.partner-category-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 18px; margin-top: 30px; }
.partner-category-hero__actions > span { max-width: 29ch; color: rgba(255,255,255,.45); font-size: .7rem; line-height: 1.45; }
.partner-category-hero__visual { position: relative; min-height: 360px; }
.partner-category-hero__visual img {
    position: absolute;
    z-index: 3;
    left: 50%; top: 50%;
    width: 150px; height: 150px;
    transform: translate(-50%, -50%) rotate(3deg);
    filter: drop-shadow(0 24px 32px rgba(0,0,0,.3));
}
.partner-category-hero__ring {
    position: absolute;
    left: 50%; top: 50%;
    width: 340px; height: 250px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 50%;
    transform: translate(-50%, -50%) rotate(-24deg);
}
.partner-category-hero__code {
    position: absolute;
    right: 0; top: 0;
    color: rgba(255,255,255,.5);
    font-family: var(--font-mono);
    font-size: .66rem;
    letter-spacing: .1em;
}
.partner-category-hero__chip {
    position: absolute;
    z-index: 4;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(7,21,27,.74);
    color: #fff;
    font-family: var(--font-mono);
    font-size: .62rem;
    letter-spacing: .08em;
    backdrop-filter: blur(8px);
}
.partner-category-hero__chip--one { left: 2%; top: 24%; color: var(--partner-cyan); }
.partner-category-hero__chip--two { right: 0; top: 43%; color: var(--partner-lime); }
.partner-category-hero__chip--three { left: 20%; bottom: 11%; color: var(--partner-coral); }

/* Карточки библиотеки: единый индекс и спокойная обработка разнородных обложек */
.card__signal {
    color: var(--partner-teal);
    font-family: var(--font-mono);
    font-size: .68rem;
    font-weight: 500;
    letter-spacing: .08em;
}
.card--partner { border-color: rgba(7,21,27,.11); border-radius: 20px; }
.card--partner:hover { border-color: rgba(13,85,88,.42); box-shadow: 0 16px 36px rgba(7,21,27,.1); }
.card--partner .card__media::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(145deg, rgba(7,21,27,.06), rgba(13,85,88,.18));
    mix-blend-mode: multiply;
}
.card--partner .card__media.is-fallback::after { mix-blend-mode: normal; background: linear-gradient(145deg, transparent, rgba(57,216,232,.08)); }
.card--partner .card__flag { background: var(--partner-lime); color: var(--partner-ink); }
.card--partner .card__more { color: var(--partner-teal); }
.page-partner-category .search-box__input:focus { border-color: var(--partner-cyan); box-shadow: 0 0 0 4px rgba(57,216,232,.12); }

@media (max-width: 1024px) {
    .page-partner .article__head.partner-hero { grid-template-columns: minmax(0, 1.35fr) minmax(210px, .65fr); }
    .partner-category-hero { grid-template-columns: minmax(0, 1fr) 300px; }
}

@media (max-width: 800px) {
    .page-partner .article__head.partner-hero,
    .partner-category-hero { grid-template-columns: minmax(0, 1fr); }
    .page-partner .article__head.partner-hero { min-height: 0; }
    .partner-hero__visual { min-height: 270px; }
    .partner-category-hero__visual { min-height: 280px; }
    .partner-category-hero { min-height: 0; }
}

@media (max-width: 600px) {
    .page-partner .article { border-radius: 22px; }
    .page-partner .article__head.partner-hero { padding: 30px 22px 22px; }
    .page-partner .partner-hero .article__title { font-size: clamp(2.05rem, 9.4vw, 2.8rem); max-width: none; }
    .partner-hero__eyebrow { margin-bottom: 20px; }
    .partner-hero__visual { min-height: 200px; margin: 6px -8px 0; }
    .partner-hero__orbit--one { width: 210px; height: 210px; }
    .partner-hero__orbit--two { width: 270px; height: 150px; }
    .partner-hero__mark { width: 110px; height: 110px; }
    .partner-hero__label--models { left: 0; }
    .partner-hero__label--access { right: 0; }
    .page-partner .article__body,
    .page-partner .article__foot { padding-left: 20px; padding-right: 20px; }
    .page-partner .offer-bar { padding: 22px 20px; }
    .partner-category-hero { margin-top: 16px; padding: 34px 22px 24px; border-radius: 24px; }
    .partner-category-hero .page-hero__title { max-width: none; font-size: clamp(2.65rem, 13vw, 4rem); }
    .partner-category-hero .page-hero__stats { gap: 18px 24px; }
    .partner-category-hero__actions { align-items: stretch; flex-direction: column; }
    .partner-category-hero__actions .btn { width: 100%; }
    .partner-category-hero__visual { min-height: 230px; }
    .partner-category-hero__ring { width: 280px; height: 190px; }
    .partner-category-hero__visual img { width: 118px; height: 118px; }
    .page-partner .sticky-cta { gap: 10px; padding: 10px 12px; }
    .page-partner .sticky-cta .btn { padding-inline: 14px; font-size: .72rem; }
}