/* FCK Theme — Main Stylesheet */

/* ─── @font-face: Circe ──────────────────────── */

@font-face {
    font-family: 'Circe';
    src: url('../fonts/Circe-Thin.woff2') format('woff2'),
         url('../fonts/Circe-Thin.woff')  format('woff');
    font-weight: 100;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Circe';
    src: url('../fonts/Circe-ExtraLight.woff2') format('woff2'),
         url('../fonts/Circe-ExtraLight.woff')  format('woff');
    font-weight: 200;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Circe';
    src: url('../fonts/Circe-Light.woff2') format('woff2'),
         url('../fonts/Circe-Light.woff')  format('woff');
    font-weight: 300;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Circe';
    src: url('../fonts/Circe-Regular.woff2') format('woff2'),
         url('../fonts/Circe-Regular.woff')  format('woff');
    font-weight: 400;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Circe';
    src: url('../fonts/Circe-Bold.woff2') format('woff2'),
         url('../fonts/Circe-Bold.woff')  format('woff');
    font-weight: 700;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Circe';
    src: url('../fonts/Circe-ExtraBold.woff2') format('woff2'),
         url('../fonts/Circe-ExtraBold.woff')  format('woff');
    font-weight: 800;
    font-style:  normal;
    font-display: swap;
}

/* ─── @font-face: Circe Rounded ─────────────── */

@font-face {
    font-family: 'Circe Rounded';
    src: url('../fonts/CirceRounded-ExtraLight.woff2') format('woff2'),
         url('../fonts/CirceRounded-ExtraLight.woff')  format('woff');
    font-weight: 200;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Circe Rounded';
    src: url('../fonts/CirceRounded-Regular.woff2') format('woff2'),
         url('../fonts/CirceRounded-Regular.woff')  format('woff');
    font-weight: 400;
    font-style:  normal;
    font-display: swap;
}

@font-face {
    font-family: 'Circe Rounded';
    src: url('../fonts/CirceRounded-AltBold.woff2') format('woff2'),
         url('../fonts/CirceRounded-AltBold.woff')  format('woff');
    font-weight: 700;
    font-style:  normal;
    font-display: swap;
}

:root {
    /* ── Brand palette tokens ── */
    --palette-blue-900: #005a78;
    --palette-cyan-600: #007d9b;
    --palette-green-600: #00916e;
    --palette-gold-500: #ffbe14;

    /* ── Neutral palette tokens ── */
    --palette-white: #ffffff;
    --palette-gray-900: #1e1e1e;
    --palette-gray-700: #6b7280;
    --palette-gray-600: #888888;
    --palette-gray-500: #aaaaaa;
    --palette-gray-300: #d8d8d8;
    --palette-gray-200: #e0e0e0;
    --palette-gray-100: #e8e8e8;
    --palette-gray-50:  #e8e8e8;

    /* ── Semantic color tokens ── */
    --color-text-primary: var(--palette-blue-900);
    --color-text-body:    var(--palette-blue-900);
    --color-text-muted:   var(--palette-gray-600);
    --color-text-subtle:  var(--palette-gray-500);
    --color-text-inverse: var(--palette-white);

    --color-bg-primary: var(--palette-white);
    --color-bg-subtle:  var(--palette-gray-50);

    --color-border-default: var(--palette-blue-900);
    --color-border-subtle:  rgba(0, 90, 120, 0.15);
    --color-border-muted:   rgba(0, 90, 120, 0.2);

    --color-action-primary:       var(--palette-blue-900);
    --color-action-primary-hover: rgba(0, 90, 120, 0.85);
    --color-action-focus-ring:    rgba(0, 90, 120, 0.4);

    /* ── Typography ── */
    --font-main:    'Circe Rounded', 'Circe', sans-serif;
    --font-heading: 'Circe Rounded', 'Circe', sans-serif;

    /* ── Font sizes ── */
    --font-size-2xs:  11px;
    --font-size-xs:   12px;
    --font-size-sm:   13px;
    --font-size-md:   14px;
    --font-size-base: 15px;
    --font-size-lg:   16px;
    --font-size-xl:   18px;
    --font-size-2xl:  20px;
    --font-size-3xl:  22px;
    --font-size-4xl:  24px;
    --font-size-5xl:  28px;
    --font-size-6xl:  32px;
    --font-size-7xl:  36px;

    /* ── Line heights ── */
    --line-height-none:    1;
    --line-height-tighter: 1.1;
    --line-height-tight:   1.2;
    --line-height-snug:    1.3;
    --line-height-normal:  1.4;
    --line-height-relaxed: 1.5;
    --line-height-loose:   1.65;

    /* ── Letter spacing ── */
    --letter-spacing-tight:  -0.25px;
    --letter-spacing-normal: 0;
    --letter-spacing-wide:   0.5px;
    --letter-spacing-wider:  0.75px;
    --letter-spacing-widest: 1px;

    /* ── Heading rhythm — отступы вокруг заголовков ── */
    --heading-margin-top-h1: 0;
    --heading-margin-top-h2: 0;
    --heading-margin-top-h3: 48px;
    --heading-margin-top-h4: 32px;

    --heading-margin-bottom-h1: 32px;
    --heading-margin-bottom-h2: 48px;
    --heading-margin-bottom-h3: 24px;
    --heading-margin-bottom-h4: 16px;

    /* ── Spacing tokens ── */
    --space-xs:   4px;
    --space-sm:   8px;
    --space-md:   16px;
    --space-lg:   24px;
    --space-xl:   32px;
    --space-2xl:  48px;
    --space-3xl:  64px;
    --space-4xl:  96px;

    --container-padding-mobile:  24px;
    --container-padding-tablet:  60px;
    --container-padding-desktop: 140px;

    /* ── Border-radius tokens ── */
    --radius-xs:     4px;
    --radius-sm:     12px;
    --radius-md:     16px;
    --radius-lg:     20px;
    --radius-pill:   60px;
    --radius-circle: 50%;

    /* ── Z-index scale ── */
    --z-base: 0;
    --z-dropdown: 100;
    --z-sticky-header: 200;
    --z-overlay: 900;
    --z-modal: 1000;
    --z-toast: 1100;

    /* ── Section spacing tokens ── */
    --section-spacing-desktop: 96px;
    --section-spacing-tablet:  64px;
    --section-spacing-mobile:  48px;

    --section-spacing-tight-desktop: 64px;
    --section-spacing-tight-tablet:  48px;
    --section-spacing-tight-mobile:  32px;

    /* ── Section background tokens ── */
    --color-section-bg-primary: #ffffff;
    --color-section-bg-subtle:  #e8e8e8;

    /* ── Legacy spacing (migrate to --space-*) ── */
    --spacing-base: 1rem;
    --spacing-xs:   calc(var(--spacing-base) * 0.25);
    --spacing-sm:   calc(var(--spacing-base) * 0.5);
    --spacing-md:   calc(var(--spacing-base) * 1.5);
    --spacing-lg:   calc(var(--spacing-base) * 2);
    --spacing-xl:   calc(var(--spacing-base) * 4);

    --container-width: 1200px;
    --border-radius:   6px;
    --transition:      0.2s ease;
}

/* ─── Reset ─────────────────────────────────── */

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-main);
    color: var(--color-text-primary);
    background-color: var(--color-bg-primary);
    line-height: var(--line-height-loose);
    min-width: 368px;
}

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

a {
    color: var(--color-text-primary);
    text-decoration: none;
    transition: color var(--transition);
}

a:hover {
    color: #007d9b;
}

ul {
    list-style: none;
}

/* ─── Container ──────────────────────────────── */

.container {
    width: 100%;
    max-width: var(--container-width);
    margin-inline: auto;
    padding-inline: var(--spacing-md);
}

/* ─── Type Scale ────────────────────────────── */

.text-display {
    font-family: var(--font-heading);
    font-size: var(--font-size-7xl);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-widest);
    font-weight: 400;
    text-transform: uppercase;
}

.text-h1 {
    font-family: var(--font-heading);
    font-size: var(--font-size-7xl);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-widest);
    font-weight: 400;
    text-transform: uppercase;
    margin-top: var(--heading-margin-top-h1);
    margin-bottom: var(--heading-margin-bottom-h1);
}

.text-h2 {
    font-family: var(--font-heading);
    font-size: var(--font-size-6xl);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-widest);
    font-weight: 400;
    text-transform: uppercase;
    margin-top: var(--heading-margin-top-h2);
    margin-bottom: var(--heading-margin-bottom-h2);
}

.text-h3 {
    font-family: var(--font-heading);
    font-size: var(--font-size-4xl);
    line-height: var(--line-height-snug);
    letter-spacing: var(--letter-spacing-widest);
    font-weight: 400;
    text-transform: uppercase;
    margin-top: var(--heading-margin-top-h3);
    margin-bottom: var(--heading-margin-bottom-h3);
}

.text-h4 {
    font-family: var(--font-heading);
    font-size: var(--font-size-2xl);
    line-height: var(--line-height-snug);
    letter-spacing: var(--letter-spacing-wide);
    font-weight: 400;
    text-transform: uppercase;
    margin-top: var(--heading-margin-top-h4);
    margin-bottom: var(--heading-margin-bottom-h4);
}

/* Модификаторы: обнуление margin-top для первого элемента */
.text-h3:first-child,
.text-h4:first-child,
.text-h3.is-first,
.text-h4.is-first {
    margin-top: 0;
}

.text-body-lg {
    font-family: var(--font-heading);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
    font-weight: 400;
}

.text-body {
    font-family: var(--font-main);
    font-size: var(--font-size-base);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
    font-weight: 400;
}

.text-body-long {
    font-family: var(--font-main);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-loose);
    letter-spacing: var(--letter-spacing-normal);
    font-weight: 400;
}

.text-small {
    font-family: var(--font-heading);
    font-size: var(--font-size-md);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
    font-weight: 400;
}

.text-caption {
    font-family: var(--font-heading);
    font-size: var(--font-size-sm);
    line-height: var(--line-height-snug);
    letter-spacing: var(--letter-spacing-wider);
    font-weight: 400;
}

.text-label {
    font-family: var(--font-heading);
    font-size: var(--font-size-md);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-widest);
    font-weight: 400;
    text-transform: uppercase;
}

.text-micro {
    font-family: var(--font-heading);
    font-size: var(--font-size-2xs);
    line-height: var(--line-height-none);
    letter-spacing: var(--letter-spacing-widest);
    font-weight: 400;
    text-transform: uppercase;
}

.text-number {
    font-family: var(--font-heading);
    font-size: var(--font-size-4xl);
    line-height: var(--line-height-none);
    letter-spacing: var(--letter-spacing-normal);
    font-weight: 700;
}

/* ── Type Scale: responsive ── */

@media (max-width: 768px) {
    :root {
        --font-size-7xl: 28px;
        --font-size-6xl: 24px;
        --font-size-5xl: 22px;
        --font-size-4xl: 20px;
        --font-size-2xl: 18px;

        --heading-margin-bottom-h1: 24px;
        --heading-margin-bottom-h2: 32px;
        --heading-margin-bottom-h3: 16px;
        --heading-margin-bottom-h4: 12px;

        --heading-margin-top-h3: 32px;
        --heading-margin-top-h4: 24px;
    }
}

@media (max-width: 480px) {
    :root {
        --font-size-7xl: 24px;
        --font-size-6xl: 22px;
    }
}

/* ─── Section Header (eyebrow + title + subtitle) ── */

.section-header {
    text-align: center;
    margin-bottom: var(--heading-margin-bottom-h2);
}

.section-header__eyebrow {
    margin-bottom: 12px;
}

.section-header__title {
    margin: 0 0 8px;
}

.section-header__subtitle {
    margin: 0;
}

.section-header--left {
    text-align: left;
}

/* ─── Section Rhythm & Backgrounds ──────────── */

.section--bg-subtle {
    background-color: var(--color-section-bg-subtle);
}

/* ── Base button classes ── */

.btn-gradient-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 28px;
    border: none;
    border-radius: var(--radius-pill);
    background: linear-gradient(90deg, #007d9b 12%, #00916e 59%, #ffbe14 96%);
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-inverse);
    text-decoration: none;
    cursor: pointer;
    transition: opacity var(--transition), transform var(--transition);
}

/* Hover на базовой утилите намеренно статичен — ни opacity, ни transform.
   Причина: opacity: 0.9 делала градиент полупрозрачным, из-за чего подложка
   (белый фон карточки/гипотетический контекст) просвечивала по краям и создавала
   цветовые артефакты, особенно на жёлтой части градиента. Контекстные классы
   (.ns-hero__btn, .shre-hero__btn, .hero__card-btn) определяют свой hover при необходимости. */
.btn-gradient-pill:focus-visible {
    outline: 2px solid var(--color-action-focus-ring);
    outline-offset: 3px;
}

.btn-gradient-pill[disabled] {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

.btn-outline-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 24px;
    border: 1.333px solid var(--color-border-default);
    border-radius: var(--radius-pill);
    background: transparent;
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-action-primary);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition), color var(--transition);
}

.btn-outline-pill:hover {
    background-color: var(--color-action-primary);
    color: var(--color-text-inverse);
}

.btn-outline-pill:focus-visible {
    outline: 2px solid var(--color-action-focus-ring);
    outline-offset: 3px;
}

.btn-outline-pill--inverse {
    border-color: var(--color-text-inverse);
    color: var(--color-text-inverse);
}

.btn-outline-pill--inverse:hover {
    background-color: var(--color-text-inverse);
    color: var(--color-action-primary);
}

/* ─── Typography ─────────────────────────────── */

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 400;
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
}

h1 { font-size: clamp(2rem, 4vw, 3rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); }
h3 { font-size: clamp(1.25rem, 2.5vw, 1.75rem); }

p { margin-bottom: var(--spacing-base); }

/* ─── Site Header ────────────────────────────── */
/*
 * Figma: height 72px, white bg, border-bottom 1px rgba(0,90,120,0.5)
 * Inner container: max-width 1440px, padding 0 140px
 * Logo: icon 47×28 + text stack | Nav: pill links | Button: gradient
 */

.site-header {
    background-color: #ffffff;
    border-bottom: 1px solid rgba(0, 90, 120, 0.5);
    position: sticky;
    top: 0;
    z-index: 100;
    width: 100%;
}

.site-header__inner {
    max-width: 1440px;
    margin-inline: auto;
    padding: 0 140px;
    height: 72px;
    display: flex;
    align-items: center;
    gap: 36px;
}

/* ── Логотип ── */

.site-header__logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    flex-shrink: 0;
    width: 254px;
}

.site-header__logo-img {
    display: block;
    width: 47px;
    height: 28px;
    flex-shrink: 0;
}

.site-header__logo-text {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.site-header__logo-name {
    display: block;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-none);
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    white-space: nowrap;
}

.site-header__logo-tagline {
    display: block;
    font-family: var(--font-heading);
    font-size: 11px;
    font-weight: 400;
    line-height: var(--line-height-none);
    color: var(--color-text-primary);
    white-space: nowrap;
}

/* ── Навигация ── */

.site-header__nav {
    flex: 1 1 auto;
    margin: 0 30px;
}

.site-header__nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-header__nav-list li {
    margin: 0;
    display: flex;
    align-items: center;
}

/* Вертикальный разделитель между пунктами меню.
   Height 14px, 1px ширина. Чтобы избежать sub-pixel rendering разницы между линиями
   (когда 1px округляется по-разному в зависимости от x-позиции), форсируем
   GPU-композитинг через transform: translateZ(0). */
.site-header__nav-list li + li::before {
    content: '';
    display: block;
    width: 1px;
    height: 14px;
    margin-right: 16px;
    margin-left: 16px;
    background-color: var(--color-border-default);
    flex-shrink: 0;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.site-header__nav-list a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 25px;
    padding: 1px 0;
    border: none;
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    text-decoration: none;
    white-space: nowrap;
    transition: font-weight 0.15s ease;
}

/* Скрытый bold-дубликат резервирует ширину, чтобы layout не сдвигался */
.site-header__nav-list a::after {
    content: attr(data-text);
    font-weight: 700;
    height: 0;
    visibility: hidden;
    overflow: hidden;
    pointer-events: none;
    display: block;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 12px;
}

.site-header__nav-list a:hover,
.site-header__nav-list .current-menu-item > a {
    font-weight: 700;
}

/* ── Бургер (скрыт на десктопе) ── */

.site-header__burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: var(--space-xs); /* 4px — было 5px, привели к 4pt шкале */
    width: 32px;
    height: 32px;
    padding: var(--space-xs);
    border: none;
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    order: 10;
}

.site-header__burger-line {
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--palette-blue-900);
    border-radius: 1px;
    transition: transform var(--transition), opacity var(--transition);
}

/* Анимация крестика */
.site-header__burger[aria-expanded="true"] .site-header__burger-line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.site-header__burger[aria-expanded="true"] .site-header__burger-line:nth-child(2) {
    opacity: 0;
}

.site-header__burger[aria-expanded="true"] .site-header__burger-line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* ── Кнопка «Поддержать» + dropdown ── */

.site-header__support {
    position: relative;
    flex-shrink: 0;
}

.site-header__support-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 178px;
    height: 41px;
    padding: 0 20px;
    border: 1.333px solid var(--color-border-default);
    border-radius: 20px;
    background: linear-gradient(90deg, #007d9b 16%, #00916e 54%, #ffbe14 100%);
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    cursor: pointer;
    white-space: nowrap;
    transition: border-radius var(--transition), background var(--transition), border-color var(--transition);
    position: relative;
    z-index: 201;
}

.site-header__support-btn:hover,
.site-header__support-btn:focus-visible {
    background: var(--palette-blue-900); /* #005a78 — solid blue при hover */
    border-color: var(--palette-blue-900);
    outline: none;
}

/* Кнопка при открытом дропдауне: нижние углы прямые, обводка по бокам и сверху */
.site-header__support-btn[aria-expanded="true"] {
    border-radius: 20px 20px 0 0;
    border: 1.333px solid var(--color-border-default);
    border-bottom: none;
}

.site-header__support-arrow {
    font-size: 10px;
    line-height: var(--line-height-none);
    transition: transform var(--transition);
}

.site-header__support-btn[aria-expanded="true"] .site-header__support-arrow {
    transform: rotate(180deg);
}

/* Dropdown panel */

.site-header__dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    background: #ffffff;
    border: 1.333px solid var(--color-border-default);
    border-top: none;
    border-radius: 0 0 20px 20px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-4px);
    transition: opacity var(--transition), transform var(--transition);
    z-index: 200;
}

.site-header__dropdown[aria-hidden="false"] {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.site-header__dropdown-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    height: 41px;
    text-decoration: none;
    transition: background-color var(--transition);
}

.site-header__dropdown-item--bordered {
    border-bottom: 1.333px solid var(--color-border-default);
}

.site-header__dropdown-item:last-child {
    height: 39px;
}

.site-header__dropdown-item:hover {
    background-color: #e8e8e8;
}

.site-header__dropdown-dot {
    display: none;
}

.site-header__dropdown-item-name {
    display: block;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    white-space: nowrap;
}

/* ── Header адаптив ── */

@media (max-width: 1280px) {
    .site-header__inner {
        padding: 0 60px;
        gap: 24px;
    }
}

@media (max-width: 1100px) {
    .site-header__logo-text {
        display: none;
    }

    .site-header__logo {
        width: auto;
    }
}

@media (max-width: 1024px) {
    .site-header__inner {
        padding: 0 40px;
        gap: 16px;
    }

    .site-header__nav-list {
        gap: 0;
    }

    .site-header__nav-list li + li::before {
        margin-right: 8px;
        margin-left: 8px;
    }

    .site-header__nav-list a {
        padding: 2px 0;
        font-size: 11px;
        letter-spacing: 0.5px;
    }

    .site-header__support-btn {
        width: auto;
        padding: 0 16px;
        font-size: 11px;
    }
}

@media (max-width: 768px) {
    .site-header__inner {
        padding: 0 24px;
        height: 60px;
    }

    .site-header__logo {
        width: auto;
        flex: 1 1 auto;
    }

    /* Показать бургер */
    .site-header__burger {
        display: flex;
    }

    /* Навигация — мобильное меню */
    .site-header__nav {
        position: fixed;
        top: 60px;
        left: 0;
        right: 0;
        bottom: 0;
        /* На десктопе у .site-header__nav margin: 0 30px — без сброса на мобайле он
           сжимает fullscreen-меню на 60px по горизонтали. */
        margin: 0;
        background: #ffffff;
        padding: 32px 24px;
        z-index: 150;
        overflow-y: auto;
        /* скрыто по умолчанию */
        opacity: 0;
        pointer-events: none;
        transform: translateY(-8px);
        transition: opacity var(--transition), transform var(--transition);
    }

    .site-header__nav.is-open {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .site-header__nav-list {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .site-header__nav-list li {
        border-bottom: 1px solid rgba(0, 90, 120, 0.1);
    }

    /* Скрыть вертикальные разделители в мобильном меню */
    .site-header__nav-list li + li::before {
        display: none;
    }

    .site-header__nav-list a {
        display: flex;
        justify-content: flex-start;
        height: auto;
        padding: 14px 0;
        border: none;
        border-radius: 0;
        font-size: 14px;
        letter-spacing: 1px;
        color: var(--color-text-primary);
    }

    .site-header__nav-list a:hover,
    .site-header__nav-list .current-menu-item > a {
        background-color: transparent;
        color: var(--color-text-primary);
    }
}

@media (max-width: 480px) {
    .site-header__inner {
        padding: 0 16px;
    }

    .site-header__logo-tagline {
        display: none;
    }

    .site-header__support-btn {
        width: auto;
        padding: 0 12px;
        height: 32px;
        font-size: 10px;
    }
}

/* ─── Main Content ───────────────────────────── */

.site-main {
    min-height: 60vh;
}

/* page-new-seniors — full-width, стили в секции ниже */
.page-new-seniors {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* О фонде — full-width обёртка, контент ограничивается внутри секций */
.page-about {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* ─── Footer ─────────────────────────────────── */
/*
 * Figma: linear-gradient(121.32deg, #007d9b 1.77%, #00916e 69.02%, #ffbe14 106.74%)
 * Desktop: 1440px wide, padding 40px 140px, grid 280px|524px|1fr, gap 48px
 * Font: Circe Rounded — локальные файлы (woff/woff2)
 */

.site-footer {
    background: linear-gradient(121.32deg, #007d9b 1.77%, #00916e 69.02%, #ffbe14 106.74%);
    color: #ffffff;
    font-family: var(--font-main);
    width: 100%;
}

.site-footer a {
    color: #ffffff;
    text-decoration: none;
    transition: opacity var(--transition);
}

.site-footer a:hover {
    opacity: 0.7;
    color: #ffffff;
}

/* Центрирующая обёртка (max-width 1440px из Figma) */
.footer__inner {
    max-width: 1440px;
    margin-inline: auto;
    padding: 48px 140px 0;
}

/* ── Три колонки: 280px | 1fr | 1fr, gap 48px ── */

.footer__cols {
    display: grid;
    grid-template-columns: 280px 1fr 1fr;
    gap: 96px;
    padding-bottom: 36px;
    border-bottom: 1.333px solid rgba(255, 255, 255, 0.8);
}

/* ── Колонка 1: Бренд ── */

.footer__col {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg); /* 24px */
}

.footer__logo-link {
    display: inline-flex;
    line-height: 0;
}

.footer__logo-img {
    width: 47px;
    height: 28px;
    display: block;
}

.footer__brand-text {
    display: flex;
    flex-direction: column;
    gap: 0;
    line-height: var(--line-height-tight);
}

.footer__brand-name {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    line-height: var(--line-height-tight);
    margin-bottom: 0;
}

.footer__brand-tagline {
    font-size: 14px;
    font-weight: 400;
    color: #ffffff;
    line-height: var(--line-height-normal);
    margin-bottom: 0;
}

.footer__copyright {
    font-size: 14px;
    font-weight: 400;
    color: #ffffff;
    line-height: var(--line-height-loose);
    margin-bottom: 0;
}

/* Два варианта копирайта: desktop — внутри brand-колонки, mobile — в самом низу
   футера. Между ними переключаемся по ширине экрана. */
.footer__copyright--mobile {
    display: none;
}

/* ── Колонка 2: Документы ── */

.footer__col-heading {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    line-height: normal;
    margin-bottom: 0;
}

/* wp_nav_menu output + static fallback */
.footer__doc-list,
.footer__doc-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.footer__doc-list li {
    margin: 0;
}

.footer__doc-list a {
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-relaxed);
    color: #ffffff;
    display: block;
}

/* ── Колонка 3: Контакты + соцсети ── */

.footer__emails {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 11px;
    min-height: 42px;
}

.footer__email-link {
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-relaxed);
    color: #ffffff;
    display: block;
}

.footer__social {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg); /* 24px */
}

.footer__social-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.footer__social-list li {
    margin: 0;
}

.footer__social-link {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-relaxed);
    color: #ffffff;
    height: auto;
}

.footer__social-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

/* ── Нижняя полоса (высота 84px, flex по центру) ── */

.footer__bottom,
.footer__bottom p,
.footer__bottom span,
.footer__age-badge {
    opacity: 0.8;
}

.footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
    min-height: 84px;
    padding: 20px 0;
}

.footer__age {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}

.footer__age-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border-radius: 20px;
    border: 1.333px solid #ffffff;
    background: transparent;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    white-space: nowrap;
}

.footer__age-text {
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-loose);
    color: #ffffff;
    margin-bottom: 0;
}

.footer__requisites {
    text-align: right;
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-loose);
    color: #ffffff;
    margin-left: auto;
    flex-shrink: 1;
}

.footer__requisites p {
    margin-bottom: 0;
    line-height: var(--line-height-loose);
}

/* ── Footer адаптив ── */

/* Промежуточный: уменьшение padding под header */
@media (max-width: 1280px) {
    .footer__inner {
        padding: 48px 60px 0;
    }
}

/* Планшет: бренд на всю ширину, документы + контакты рядом */
@media (max-width: 1023px) {
    .footer__inner {
        padding: 40px 40px 0;
    }

    .footer__cols {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }

    .footer__col--brand {
        grid-column: 1 / -1;
    }

    .footer__bottom {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .footer__requisites {
        text-align: right;
        align-self: flex-end;
    }
}

/* Мобильный: всё в одну колонку */
@media (max-width: 767px) {
    .footer__inner {
        padding: 32px 24px 24px;
    }

    .footer__cols {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .footer__col--brand {
        grid-column: auto;
    }

    .footer__col-heading {
        font-size: 16px;
        white-space: nowrap;
    }

    .footer__email-link {
        white-space: nowrap;
    }

    /* Перекидываем копирайт с brand-колонки (верх футера) в самый низ. */
    .footer__copyright--desktop {
        display: none;
    }

    .footer__copyright--mobile {
        display: block;
        text-align: center;
        padding-top: 20px;
        opacity: 0.8;
    }
}

/* ─── Buttons ────────────────────────────────── */

/* ─── Accessibility ──────────────────────────── */

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

:focus-visible {
    outline: 2px solid var(--color-action-focus-ring);
    outline-offset: 3px;
}

/* ─── Hero + Программы (объединённый блок) ───── */

.hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(139.95deg, #007d9b 10.58%, #00916e 37.21%, #ffbe14 79.44%);
}

/* ── Текст миссии ── */

.hero__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-lg); /* 24px — было 25px */
    max-width: 1440px;
    margin: 0 auto;
    padding: 80px 140px 50px;
    text-align: center;
}

.hero__label {
    /* Font-стили — от .text-label */
    display: block;
    color: #ffffff;
}

.hero__title {
    /* Font-стили — от .text-h1. line-height override: глобальный tight (1.2)
       слишком тесен для multi-line uppercase-кириллицы — акценты «Й/Ё» наезжают
       на низ предыдущей строки. */
    line-height: var(--line-height-snug);
    color: #ffffff;
    margin: 0;
}

.hero__subtitle {
    /* Font-стили — от .text-body-lg */
    color: #ffffff;
    max-width: 1061px;
    margin: 0;
}

/* ── Карточки программ ── */

.hero__cards {
    position: relative;
    z-index: 2;
    display: flex;
    gap: 40px;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 140px 80px;
}

.hero__card {
    flex: 1;
    background: #ffffff;
    border-radius: var(--radius-lg); /* 20px */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--space-xl); /* 32px — было 35px, привели к 8pt шкале */
}

/* ── Галерея в карточке ── */

.hero__card-gallery {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.hero__card-gallery-track {
    display: flex;
    width: 100%;
    transition: transform 0.4s ease;
}

.hero__card-gallery-slide {
    flex: 0 0 100%;
    width: 100%;
}

.hero__card-gallery-img {
    display: block;
    width: 100%;
    height: 367px;
    object-fit: cover;
}

/* Стрелки галереи — поверх фото, по центру вертикально */
.hero__card-gallery-nav {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    pointer-events: none;
    z-index: 2;
}

.hero__card-gallery-arrow {
    /* Default: белый фон + синяя обводка + синяя иконка.
       Hover: заливка #e8e8e8 + синяя обводка + синяя иконка. */
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--color-border-default);
    background: #ffffff;
    color: var(--color-text-primary);
    cursor: pointer;
    padding: 0;
    pointer-events: auto;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
    font-size: 10px;
    line-height: var(--line-height-none);
}

.hero__card-gallery-arrow svg {
    width: 9px;
    height: auto;
}

/* Невидимая расширенная область клика 44×44 поверх кнопки — улучшает тач-доступность. */
.hero__card-gallery-arrow::after {
    content: '';
    position: absolute;
    inset: -11px;
    border-radius: 50%;
}

.hero__card-gallery-arrow:hover,
.hero__card-gallery-arrow:focus-visible {
    background: #e8e8e8;
    border-color: var(--color-border-default); /* синяя обводка */
    color: var(--color-text-primary);          /* синяя иконка */
    outline: none;
}

/* ── Тело карточки ── */

.hero__card-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-lg); /* 24px */
    padding: 0;
    margin-top: var(--space-lg); /* 24px */
    flex: 1;
    width: 100%;
}

.hero__card-logo-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    width: 100%;
}

.hero__card-logo {
    max-width: 229px;
    max-height: 200px;
    width: auto;
    object-fit: contain;
}

/* Логотип «Новые старшие» — компактная иконка */
.hero__card:nth-child(2) .hero__card-logo {
    max-width: 120px;
    max-height: 128px;
}

.hero__card-title {
    /* Font-стили — от .text-h3 */
    color: var(--color-text-primary);
    margin: 0;
}

.hero__card-text {
    /* Font-стили — от .text-body-lg */
    color: var(--color-text-primary);
    max-width: 450px;
    margin: 0;
}

.hero__card-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    border: 1.333px solid var(--color-border-default);
    border-radius: 20px;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    text-decoration: none;
    background: #ffffff;
    margin-top: auto;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.hero__card-btn:hover,
.hero__card-btn:active,
.hero__card-btn:focus-visible {
    background: linear-gradient(90deg, #007d9b 0%, #00916e 50%, #ffbe14 100%);
    border-color: transparent;
    color: #ffffff;
}

/* ── Hero + Программы — адаптив ── */

@media (max-width: 1280px) {
    .hero__content {
        padding: 60px 60px 40px;
    }

    .hero__cards {
        padding: 0 60px 60px;
        gap: 30px;
    }

    .hero__card {
        padding: 25px;
    }

    .hero__card-gallery-img {
        height: 280px;
    }
}

@media (max-width: 768px) {
    .hero__content {
        padding: 50px 24px 30px;
    }

    .hero__title {
        font-size: 24px;
    }

    .hero__cards {
        flex-direction: column;
        padding: 0 16px 40px;
        gap: 20px;
    }

    .hero__card {
        padding: 16px;
    }

    /* На мобильных фото адаптивное по ширине */
    .hero__card-gallery-img {
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .hero__card-body {
        gap: 16px;
        margin-top: 16px;
    }

    .hero__card-logo-wrap {
        height: 140px;
    }

    .hero__card-logo {
        max-height: 140px;
        max-width: 180px;
    }

    .hero__card:nth-child(2) .hero__card-logo {
        max-width: 100px;
        max-height: 110px;
    }
}

@media (max-width: 480px) {
    .hero__content {
        padding: 40px 16px 24px;
        gap: 16px;
    }

    .hero__title {
        font-size: 20px;
    }

    .hero__subtitle {
        font-size: 14px;
        line-height: var(--line-height-normal);
    }

    .hero__cards {
        padding: 0 12px 32px;
        gap: 16px;
    }

    .hero__card {
        padding: 12px;
    }

    .hero__card-body {
        gap: 12px;
        margin-top: 12px;
    }

    .hero__card-logo-wrap {
        height: 110px;
    }

    .hero__card-logo {
        max-height: 110px;
        max-width: 160px;
    }

    .hero__card:nth-child(2) .hero__card-logo {
        max-width: 80px;
        max-height: 90px;
    }

    .hero__card-title {
        font-size: 18px;
    }

    .hero__card-text {
        font-size: 14px;
        line-height: var(--line-height-normal);
    }

    .hero__card-btn {
        padding: 7px 12px;
        font-size: 12px;
    }
}

/* ─── Section: О фонде + О ЦК (горизонтальная раскладка) ─── */

/* Разделители сверху/снизу — <hr class="section-divider"> в front-page.php.
   Не дублируем border-top/border-bottom, иначе линии складываются в «жирную» полосу. */

.section-about-row__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    /* 3 row-tracks: заголовок / body / кнопка. Обе колонки — subgrid этих строк,
       чтобы тексты и кнопки выравнивались независимо от того, в сколько строк
       перенёсся заголовок. */
    grid-template-rows: auto 1fr auto;
    max-width: 1440px;
    margin-inline: auto;
    padding: 0 140px;
}

/* Desktop: subgrid. На мобайле (≤768px) отключается в media-query ниже. */
.section-about-fund,
.section-about-ck {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: 1 / -1;
    row-gap: 20px;
    justify-items: center;
}

/* __inner — только для обратной совместимости DOM/reveal. Убираем из layout,
   чтобы title/text/btn были прямыми детьми section и попали в subgrid-треки. */
.section-about-fund__inner,
.section-about-ck__inner {
    display: contents;
}

/* Оба H2 выровнены по верху subgrid-ячейки row 1 — тексты ниже начинаются
   на одной линии (subgrid обеспечивает), а сами заголовки начинаются строго
   с одной верхней линии. */
.section-about-fund__title,
.section-about-ck__title {
    align-self: start;
}

/* ── О фонде ── */

.section-about-fund {
    background-color: #ffffff;
    padding: 180px 48px 160px 0;
    border-right: 1px solid var(--color-border-default);
}

/* .section-about-fund__inner — display:contents (см. блок subgrid выше).
   Старые grid/height правила не нужны: title/text/btn попадают
   напрямую в subgrid-треки родителя. */

.section-about-fund__label {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
}

.section-about-fund__title {
    /* Font-стили — от .text-h2 */
    color: var(--color-text-primary);
}

.section-about-fund__text {
    /* Font-стили — от .text-body */
    color: var(--color-text-primary);
    text-align: center;
}

.section-about-fund__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 24px;
    margin-top: auto;
    border: 1.333px solid var(--color-border-default);
    border-radius: 20px;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.section-about-fund__btn:hover {
    background-color: var(--palette-blue-900);
    color: #ffffff;
}

/* ── О ЦК ── */

.section-about-ck {
    background-color: #ffffff;
    padding: 180px 0 160px 48px;
}

/* .section-about-ck__inner — display:contents (см. блок subgrid выше). */

.section-about-ck__label {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
}

.section-about-ck__title {
    /* Font-стили — от .text-h2 */
    color: var(--color-text-primary);
    text-align: center;
}

.section-about-ck__text {
    /* Font-стили — от .text-body */
    color: var(--color-text-primary);
    text-align: center;
}

.section-about-ck__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    height: 40px;
    padding: 0 24px;
    border: 1.333px solid var(--color-border-default);
    border-radius: 20px;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.section-about-ck__btn:hover {
    background-color: var(--palette-blue-900);
    color: #ffffff;
}

/* ── О фонде + О ЦК — адаптив ── */

@media (max-width: 1280px) {
    .section-about-row__inner {
        padding: 0 60px;
    }
}

@media (max-width: 768px) {
    .section-about-row__inner {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        padding: 0 24px;
    }

    /* На мобайле одна колонка — subgrid не нужен, иначе обе секции попадают в одни row-tracks и накладываются. */
    .section-about-fund,
    .section-about-ck {
        display: block;
        grid-template-rows: none;
        grid-row: auto;
    }

    .section-about-fund__inner,
    .section-about-ck__inner {
        display: grid;
        grid-template-rows: auto 1fr auto;
        justify-items: center;
        gap: 20px;
        text-align: center;
        height: 100%;
    }

    .section-about-fund__title,
    .section-about-ck__title {
        align-self: auto;
        text-align: center;
    }

    .section-about-fund {
        border-right: none;
        padding: 48px 24px;
        border-bottom: 1px solid var(--color-border-default);
    }

    .section-about-ck {
        padding: 48px 24px;
    }

    .section-about-fund__text,
    .section-about-ck__text {
        text-align: center;
    }
}

/* ─── Section: Партнёры и со-основатели ──────── */

.section-partners {
    background-color: #ffffff;
    padding: var(--section-spacing-desktop) 140px;
}

.section-partners__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 35px;
    max-width: 1160px;
    margin: 0 auto;
}

.section-partners__title {
    /* Font-стили — от .text-h2 */
    color: var(--color-text-primary);
    text-align: center;
}

.section-partners__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px 25px; /* row-gap уменьшен ×2, column-gap оставлен */
    width: 100%;
}

.section-partners__card {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 140px;
    border-radius: 20px;
    overflow: hidden;
}

/* Обёртка <picture> от EWWW: должна занимать всю карточку, чтобы
   проценты max-width/max-height у логотипа считались от карточки,
   а не от самого picture (который иначе схлопывается до размера img). */
.section-partners__card picture {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-partners__card-logo {
    max-width: 80%;
    max-height: 60%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.section-partners__card-logo--small {
    max-width: 62%;
    max-height: 45%;
}

.section-partners__card-logo--large {
    max-width: 100%;
    max-height: 100%;
}

.section-partners__card-name {
    /* Fallback для карточек без логотипа. Font-стили — от .text-h4 (20px uppercase). */
    color: var(--color-text-primary);
    text-align: center;
}

/* ── Партнёры — адаптив ── */

@media (max-width: 1280px) {
    .section-partners {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 768px) {
    .section-partners {
        padding: var(--section-spacing-mobile) 24px;
    }

    .section-partners__title {
        font-size: 24px;
    }

    .section-partners__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px 16px; /* row-gap уменьшен, column-gap оставлен */
    }

    .section-partners__card {
        height: 100px;
    }

    .section-partners__card-name {
        font-size: 24px;
    }
}

@media (max-width: 480px) {
    .section-partners__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .section-partners__card {
        height: 80px;
    }
}

/* ─── Page Banner (градиентная плашка-заголовок) ─────────────────────────── */
/* Общий компонент для внутренних страниц. Партиал: template-parts/page-banner.php
   ACF: page_banner_title, page_banner_subtitle (group_page_banner). */

.page-banner {
    background: linear-gradient(48.14deg, #007d9b 9.34%, #00916e 60.52%, #ffbe14 100.36%);
    width: 100%;
}

.page-banner__inner {
    max-width: 1440px;
    margin-inline: auto;
    padding: var(--section-spacing-desktop) 140px;
    display: flex;
    justify-content: center;
}

.page-banner__content {
    max-width: 540px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
}

.page-banner__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    line-height: var(--line-height-none);
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}

.page-banner__subtitle {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: #ffffff;
    max-width: 524px;
    margin: 0;
}

/* ─── Page: О фонде ─────────────────────────── */

/* ── Структура и управление ── */

.about-structure {
    background-color: #ffffff;
    max-width: 1440px;
    margin-inline: auto;
    padding: var(--section-spacing-desktop) 140px;
}

.about-structure__inner {
    max-width: 1160px;
    margin: 0 auto;
}

/* .about-structure__header — margin/text-align moved to .section-header */

.about-structure__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin handled by .section-header__title */
}

.about-structure__subtitle {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0 auto;
    max-width: 700px;
    /* margin-bottom handled by .section-header wrapper */
}

/* Орг-схема */

.about-orgchart {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

.about-orgchart__row {
    width: 100%;
}

.about-orgchart__row--founder {
    display: flex;
}

.about-orgchart__node {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 18px;
    border-radius: 20px;
    text-align: center;
}

.about-orgchart__node--founder {
    background-color: var(--palette-blue-900);
    width: 100%;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.about-orgchart__node--council {
    background-color: var(--palette-blue-900);
    width: 100%;
}

.about-orgchart__node--director {
    background-color: var(--palette-blue-900);
    width: 100%;
}

.about-orgchart__node--trustees {
    background-color: var(--palette-blue-900);
    width: 100%;
}

.about-orgchart__node-label {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
    display: block;
}

.about-orgchart__node-name {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    display: block;
}

/* Вертикальный разъём от учредителя */
.about-orgchart__connectors {
    display: none;
}

.about-orgchart__row--level2 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 40px;
    position: relative;
    margin-top: 25px;
}

/* Горизонтальная линия между колонками — скрыта */
.about-orgchart__row--level2::before {
    display: none;
}

.about-orgchart__col {
    display: flex;
    flex-direction: column;
    position: relative;
}

/* Вертикальная линия от горизонтали вниз к узлу — скрыта */
.about-orgchart__col::before {
    display: none;
}

.about-orgchart__node {
    margin-top: 0;
}

.about-orgchart__members {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 24px;
}

.about-orgchart__member {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background-color: #ffffff;
    border: 1px solid var(--color-border-default);
    border-radius: 20px;
    padding: 10px 15px;
    min-height: 62px;
}

.about-orgchart__member--tall {
    /* Попечители — многострочные карточки. Aligniment и padding те же,
       что в базовом правиле — модификатор оставлен для возможных будущих отличий. */
}

.about-orgchart__member-avatar {
    width: 36px;
    height: 36px;
    border-radius: 18px;
    background-color: #f2f2f2;
    border: 1px solid #e0e0e0;
    flex-shrink: 0;
    overflow: hidden;
    position: relative;
}

.about-orgchart__member-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.about-orgchart__member-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.about-orgchart__member-role {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    display: block;
}

.about-orgchart__member-name {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    display: block;
}

/* Директор: подчинённые */
.about-orgchart__col--wide .about-orgchart__members + .about-orgchart__members {
    margin-top: 20px;
    padding-left: 0;
    position: relative;
}

.about-orgchart__col--wide .about-orgchart__members + .about-orgchart__members::before {
    display: none;
}

/* ── Структура — адаптив ── */

@media (max-width: 1280px) {
    .page-banner__inner,
    .about-structure,
    .about-history,
    .about-partnership,
    .about-contacts {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 1100px) {
    .about-orgchart__row--level2 {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 20px;
    }

    .about-orgchart__node--founder {
        width: 100%;
    }
}

@media (max-width: 768px) {

    .page-banner__inner {
        padding: var(--section-spacing-mobile) 24px;
    }

    .page-banner__title {
        font-size: 28px;
    }

    .page-banner__subtitle {
        font-size: 16px;
    }

    .about-structure {
        padding: var(--section-spacing-mobile) 24px;
    }

    .about-history,
    .about-partnership,
    .about-contacts {
        padding: var(--section-spacing-mobile) 24px;
    }

    .about-orgchart__row--level2 {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .about-orgchart__row--level2::before {
        display: none;
    }

    .about-orgchart__col::before {
        display: none;
    }

    .about-orgchart__node {
        margin-top: 0;
    }

    .about-orgchart__connectors {
        display: none;
    }

    /* C: сброс отступа подчинённых директора */
    .about-orgchart__col--wide .about-orgchart__members--subordinates {
        padding-left: 0;
    }

    .about-orgchart__col--wide .about-orgchart__members + .about-orgchart__members::before {
        display: none;
    }
}

/* ── Управляющие компании ── */
/* Секция между «Структура» и «История»: серый bleed-фон во всю ширину,
   центрированный заголовок и две колонки с вертикальным разделителем.
   Без жёстких карточек — минимализм по дизайн-системе. */

.about-management {
    background-color: var(--color-bg-subtle, #f6f9fb);
    padding: var(--space-3xl, 64px) 24px;
}
.about-management__inner {
    max-width: 880px;
    margin: 0 auto;
}
.about-management__title {
    text-align: center;
    margin: 0 0 var(--space-2xl, 48px);
}
.about-management__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    align-items: start;
}
/* Вертикальная линия-разделитель между двумя колонками */
.about-management__card + .about-management__card {
    border-left: 1px solid var(--color-border-subtle, rgba(0, 90, 120, 0.18));
}
.about-management__card {
    padding: var(--space-sm, 8px) var(--space-2xl, 48px);
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs, 4px);
}

/* Программа = eyebrow-label, мелким сверху */
.about-management__program {
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--color-text-secondary, #6b8a96);
    margin: 0;
}
/* УК = крупный заголовок, главное название */
.about-management__company {
    font-size: 28px;
    line-height: 1.2;
    font-weight: 400;
    color: var(--color-text-primary, #005a78);
    margin: 0;
}

@media (max-width: 768px) {
    .about-management { padding: var(--space-2xl, 48px) 24px; }
    .about-management__title { margin-bottom: var(--space-xl, 32px); }
    .about-management__grid {
        grid-template-columns: 1fr;
        gap: var(--space-lg, 24px);
    }
    /* На мобиле разделитель — горизонтальный, между двумя ячейками */
    .about-management__card + .about-management__card {
        border-left: none;
        border-top: 1px solid var(--color-border-subtle, rgba(0, 90, 120, 0.18));
        padding-top: var(--space-lg, 24px);
    }
    .about-management__card { padding-inline: 0; }
    .about-management__company { font-size: 22px; }
}

/* ── История ── */

.about-history {
    background-color: #ffffff;
    max-width: 1440px;
    margin-inline: auto;
    padding: var(--section-spacing-desktop) 140px;
}

.about-history__inner {
    display: flex;
    gap: 80px;
    max-width: 1160px;
    margin: 0 auto;
    align-items: flex-start;
}

.about-history__sidebar {
    flex: 0 0 300px;
    position: sticky;
    top: 100px;
    align-self: flex-start;
}

.about-history__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin-bottom приходит от .text-h2 */
}

.about-history__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0;
}

.about-history__timeline {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3xl); /* 64px — просторный ритм между событиями */
    padding-left: 60px; /* место для вертикальной линии (30px) + визуальный отступ до текста */
    position: relative;
}

/* Вертикальная линия timeline — фирменный градиент cyan → green → gold.
   top/bottom 20px — чтобы линия начиналась/заканчивалась на уровне дефисов, не раньше/позже. */
.about-history__timeline::before {
    content: '';
    position: absolute;
    left: 30px;
    top: 20px;
    bottom: 20px;
    width: 1px;
    background: linear-gradient(180deg, #007d9b 0%, #00916e 50%, #ffbe14 100%);
}

.about-history__item {
    position: relative;
    padding-bottom: 0;
}

/* Горизонтальный дефис у каждого года — пересекает вертикальную линию СЕРЕДИНОЙ.
   Вертикальная линия на timeline x=30, дефис 20px → центр на x=30, края x=20 и x=40.
   Item начинается на timeline x=60, значит item-relative left = 20-60 = -40px. */
.about-history__item::before {
    content: '';
    position: absolute;
    left: -40px;
    top: 20px;         /* визуальный центр цифры года (lh ~1.1, ~40px высота) */
    width: 20px;
    height: 1px;
    background: var(--color-text-primary);
}

/* По умолчанию у элементов нет собственных коннекторов (единая линия на timeline). */
.about-history__item::after {
    display: none;
}

/* Маска у последнего элемента — закрывает «хвост» градиентной линии ниже последнего дефиса.
   Линия timeline идёт до низа контейнера (bottom: 20px), но контент последнего item-а продолжается
   ниже его дефиса — получается видимый кусок линии под годом. Этот overlay закрашивает его
   цветом фона секции .about-history (который белый, см. line 2374). */
.about-history__item:last-child::after {
    content: '';
    display: block;
    position: absolute;
    left: -31px;          /* на пиксель шире линии для захвата antialias */
    top: 21px;            /* сразу под дефисом (дефис top:20, height:1) */
    bottom: -20px;        /* заход за нижний край на всякий случай */
    width: 3px;
    background: var(--color-bg-primary); /* #ffffff — совпадает с .about-history */
    z-index: 1;
}

.about-history__year {
    display: block;
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: 0.5px;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-sm); /* 8px */
}

.about-history__item-title {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 var(--space-md); /* 16px */
    overflow-wrap: break-word;
    word-break: break-word;
}

.about-history__item-text {
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* ── История — адаптив ── */

@media (max-width: 1280px) {
    .about-history {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 768px) {
    .about-history {
        padding: var(--section-spacing-mobile) 24px;
    }

    .about-history__inner {
        flex-direction: column;
        gap: 32px;
    }

    .about-history__sidebar {
        flex: none;
        position: static;
    }

    .about-history__timeline {
        gap: var(--space-2xl); /* 48px — плотнее ритм на мобилке */
        padding-left: 40px;    /* меньше отступа для вертикальной линии */
    }

    .about-history__timeline::before {
        left: 20px;
    }

    .about-history__item::before {
        /* Вертикальная линия на timeline x=20, дефис 16px центрирован:
           края timeline x=12 и x=28, item x = timeline x − 40 → -28 и -12. */
        left: -28px;
        width: 16px;
    }

    /* Маска у последнего элемента — на мобильной раскладке линия на timeline x=20,
       item-relative left = 20 − 40 = -20 (с запасом на пиксель = -21). */
    .about-history__item:last-child::after {
        left: -21px;
    }

    .about-history__year {
        font-size: 26px;
    }
}

/* ── Партнёрство ── */

.about-partnership {
    /* Фон задаёт класс .section--bg-subtle (в HTML), правило скрытия дивайдеров
       автоматически уберёт линии сверху/снизу от этой секции. */
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
}

.about-partnership__inner {
    display: flex;
    gap: 123px;
    max-width: 1160px;
    margin-inline: auto;
    align-items: flex-start;
}

.about-partnership__sidebar {
    flex: 0 0 289px;
}

.about-partnership__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin-bottom приходит от .text-h2 */
}

.about-partnership__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0 0 40px;
}

.about-partnership__note {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}

.about-partnership__grid {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}

.about-partnership__card {
    /* Базовый градиент — fallback на случай >4 карточек. Для первых четырёх
       ниже заданы индивидуальные градиенты от «холодного» к «тёплому». */
    background: linear-gradient(72deg, #007d9b 9.34%, #00916e 60.52%, #ffbe14 100.36%);
    border: none;
    border-radius: 20px;
    padding: 25px;
    backdrop-filter: none;
}

/* Индивидуальные градиенты: cyan (1) → green (2) → teal-lime (3) → gold (4).
   Белый текст остаётся читаемым: у карточек 2–4 светлые стоп-точки сдвинуты
   вправо-вниз (70%+), чтобы ядро текста оставалось на более тёмных оттенках. */
.about-partnership__card:nth-child(1) {
    background: linear-gradient(135deg, #007d9b 0%, #00916e 100%);
}

.about-partnership__card:nth-child(2) {
    background: linear-gradient(135deg, #007d9b 0%, #00916e 70%, #7db84a 100%);
}

.about-partnership__card:nth-child(3) {
    background: linear-gradient(135deg, #00916e 0%, #4aab6e 70%, #a0b830 100%);
}

.about-partnership__card:nth-child(4) {
    background: linear-gradient(135deg, #00916e 0%, #4aab6e 50%, #ffbe14 110%);
}

.about-partnership__card-icon {
    display: block;
    width: 22px;
    height: 22px;
    background: none;
    border-radius: 0;
    line-height: var(--line-height-none);
}

.about-partnership__card-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.about-partnership__card-title {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 20px;
}

.about-partnership__card-text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: #ffffff;
    margin: 0;
}

/* ── Партнёрство — адаптив ── */

@media (max-width: 1280px) {
    .about-partnership {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 1024px) {
    .about-partnership__inner {
        flex-direction: column;
        gap: 32px;
    }

    .about-partnership__sidebar {
        flex: none;
    }
}

@media (max-width: 768px) {
    .about-partnership {
        padding: var(--section-spacing-mobile) 24px;
    }

    .about-partnership__grid {
        grid-template-columns: 1fr;
    }
}

/* ── Контакты и реквизиты ── */

.about-contacts {
    background-color: #ffffff;
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
}

.about-contacts__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.about-contacts__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin приходит от .text-h2 */
}

.about-contacts__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

.about-contacts__block {
    background-color: #ffffff;
    border: 1px solid var(--color-border-default);
    border-radius: 20px;
    padding: 32px;
}

.about-contacts__block-heading {
    display: block;
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    margin-bottom: 20px;
}

.about-contacts__dl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 32px;
    margin: 0;
    padding: 0;
}

.about-contacts__dl-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.about-contacts__dl-row--wide {
    grid-column: 1 / -1;
}

/* Вариант «список» — один столбец, формат «Подпись: значение» в одну строку */
.about-contacts__dl--list {
    display: block;
}

.about-contacts__dl--list .about-contacts__dl-row {
    display: block;
    padding: 6px 0;
}

.about-contacts__dl--list .about-contacts__dl-row dt,
.about-contacts__dl--list .about-contacts__dl-row dd {
    display: inline;
    font-size: 15px;
}

.about-contacts__dl--list .about-contacts__dl-row dt::after {
    content: ": ";
}

@media (max-width: 640px) {
    .about-contacts__dl {
        grid-template-columns: 1fr;
    }
    .about-contacts__dl-row--wide {
        grid-column: auto;
    }
}

.about-contacts__dl-row dt {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-primary);
}

.about-contacts__dl-row dd {
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0;
}

.about-contacts__dl-row dd a {
    color: var(--color-text-primary);
    text-decoration: none;
}

.about-contacts__dl-row dd a:hover {
    opacity: 0.7;
}

/* Кнопка «Скачать» внутри карточки */
.about-contacts__card-action {
    margin-top: 24px;
}

/* Блок «Директор» внутри карточки «Контакты» */
.about-contacts__person {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid var(--color-border-default);
}

.about-contacts__person .about-contacts__block-heading {
    margin-bottom: 8px;
}

.about-contacts__person-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
}

.about-contacts__person-name {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    display: block;
}

.about-contacts__person-email,
.about-contacts__person-phone,
.about-contacts__person-telegram {
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    text-decoration: none;
    display: block;
}

.about-contacts__person-telegram {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.about-contacts__person-telegram-icon {
    flex-shrink: 0;
}

.about-contacts__person-email:hover,
.about-contacts__person-phone:hover,
.about-contacts__person-telegram:hover {
    opacity: 0.7;
}

.about-contacts__person-avatar {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background-color: #e0e0e0;
    flex-shrink: 0;
    overflow: hidden;
}

.about-contacts__person-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ── Контакты — адаптив ── */

@media (max-width: 1280px) {
    .about-contacts {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 768px) {
    .about-contacts {
        padding: var(--section-spacing-mobile) 24px;
    }

    .about-contacts__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .about-contacts__card-action {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .about-contacts__person {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ── А+B: Типографика на 480px ── */

@media (max-width: 480px) {
    .page-banner__title {
        font-size: 24px;
    }

    .page-banner__subtitle {
        font-size: 15px;
        line-height: var(--line-height-normal);
    }

    .about-structure__title,
    .about-history__title,
    .about-partnership__title,
    .about-contacts__title {
        font-size: 20px;
    }
}

/* ─── Animations ─────────────────────────────── */

/* Scroll reveal */
.reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Stagger для групп карточек */
.reveal-group .reveal:nth-child(1) { transition-delay: 0s; }
.reveal-group .reveal:nth-child(2) { transition-delay: 0.1s; }
.reveal-group .reveal:nth-child(3) { transition-delay: 0.2s; }
.reveal-group .reveal:nth-child(4) { transition-delay: 0.3s; }
.reveal-group .reveal:nth-child(5) { transition-delay: 0.4s; }
.reveal-group .reveal:nth-child(6) { transition-delay: 0.5s; }
.reveal-group .reveal:nth-child(7) { transition-delay: 0.6s; }
.reveal-group .reveal:nth-child(8) { transition-delay: 0.7s; }
/* 9-й и далее — без увеличения задержки (чтобы последний не появлялся через секунду) */
.reveal-group .reveal:nth-child(n+9) { transition-delay: 0.8s; }

/* Hover: карточки партнёрства */
/* Sticky header shadow */
.site-header {
    transition: box-shadow 0.3s ease;
}

.site-header.header-scrolled {
    box-shadow: 0 1px 12px rgba(0, 0, 0, 0.06);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .site-header {
        transition: none;
    }
}

/* ─── Section: Документы ─────────────────────── */

.page-documents {
    padding: 0;
}

/* ── Основная секция ── */

.section-documents {
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
}

.section-documents__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.section-documents__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.section-documents__grid > .doc-card:last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

.section-documents__empty {
    font-family: var(--font-heading);
    font-size: 16px;
    color: var(--color-text-primary);
    text-align: center;
}

/* ── Карточка документа ── */

.doc-card {
    background: #ffffff;
    border: 1px solid var(--color-border-default);
    border-radius: 12px;
    padding: 28px 24px 24px;
    height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
}

.doc-card__header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.doc-card__icon {
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--color-text-primary);
}

.doc-card__title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 16px;
    line-height: var(--line-height-snug);
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}

.doc-card__actions {
    display: flex;
    gap: 12px;
    margin-top: auto;
}

.doc-card__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid var(--color-border-default);
    background: transparent;
    color: var(--color-text-primary);
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.doc-card__btn:hover {
    background: var(--palette-blue-900);
    color: #fff;
}

/* ── Документы: адаптив ── */

@media (max-width: 1280px) {
    .section-documents {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 768px) {
    .section-documents {
        padding: var(--section-spacing-mobile) 24px;
    }

    .section-documents__grid {
        grid-template-columns: 1fr;
    }
}

/* ─── PDF Viewer Modal ─── */

.pdf-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
}

.pdf-modal[aria-hidden="false"] {
    display: flex;
}

.pdf-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 30, 40, 0.7);
    backdrop-filter: blur(4px);
    cursor: pointer;
}

.pdf-modal__window {
    position: relative;
    width: 100%;
    max-width: 1000px;
    height: 85vh;
    background: #ffffff;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 30, 40, 0.4);
    animation: pdfModalIn 0.25s ease-out;
}

@keyframes pdfModalIn {
    from { opacity: 0; transform: translateY(20px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

.pdf-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--color-border-subtle);
    flex-shrink: 0;
}

.pdf-modal__title {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1.3;
    margin: 0;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pdf-modal__close {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1.5px solid var(--color-border-default);
    background: transparent;
    color: var(--color-text-primary);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.pdf-modal__close:hover {
    background: var(--palette-blue-900);
    color: #ffffff;
}

.pdf-modal__close svg {
    width: 20px;
    height: 20px;
}

.pdf-modal__body {
    flex: 1;
    min-height: 0;
    background: #f2f2f2;
    overflow: hidden;
}

.pdf-modal__iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.pdf-modal__footer {
    display: flex;
    justify-content: flex-end;
    padding: var(--space-md) var(--space-lg); /* 16px 24px */
    border-top: 1px solid var(--color-border-subtle); /* rgba(0, 90, 120, 0.15) */
    flex-shrink: 0;
}

body.pdf-modal-open {
    overflow: hidden;
}

@media (max-width: 768px) {
    .pdf-modal {
        padding: 0;
    }

    .pdf-modal__window {
        max-width: 100%;
        height: 100vh;
        border-radius: 0;
    }

    .pdf-modal__title {
        font-size: 14px;
    }
}

/* ─── Section: Отчёты ─── */

.section-reports {
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
}

.section-reports__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.section-reports__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}

/* ── Отчёты: пустое состояние ── */

.reports-empty {
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
    text-align: center;
}

.reports-empty__inner {
    max-width: 560px;
    margin: 0 auto;
}

.reports-empty__icon {
    margin-bottom: var(--space-lg);
    opacity: 0.6;
    /* Цвет для SVG stroke="currentColor" */
    color: var(--color-text-primary);
}

.reports-empty__title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 28px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin-bottom приходит от .text-h1 */
}

.reports-empty__description {
    font-family: var(--font-heading);
    font-size: 16px;
    line-height: var(--line-height-loose);
    color: var(--color-text-muted);
    margin: 0 0 var(--space-lg);
}

.reports-empty__list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-xl);
    font-family: var(--font-heading);
    font-size: 15px;
    line-height: 2;
    color: var(--color-text-body);
}

.reports-empty__list li::before {
    content: '— ';
    color: var(--color-text-muted);
}

.reports-empty__contact {
    font-family: var(--font-heading);
    font-size: 14px;
    color: var(--color-text-muted);
    margin: 0;
}

.reports-empty__contact a {
    color: var(--color-text-primary);
    text-decoration: none;
    border-bottom: 1px solid var(--color-border-subtle);
    transition: var(--transition);
}

.reports-empty__contact a:hover {
    border-bottom-color: var(--color-text-primary);
}

/* ── Отчёты: адаптив ── */

@media (max-width: 1280px) {
    .section-reports {
        padding: var(--section-spacing-tablet) 60px;
    }

    .reports-empty {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 768px) {
    .section-reports {
        padding: var(--section-spacing-mobile) 24px;
    }

    .section-reports__grid {
        grid-template-columns: 1fr;
    }

    .reports-empty {
        padding: var(--section-spacing-mobile) 24px;
    }

    .reports-empty__title {
        font-size: 22px;
    }
}

/* ─── Section: Контакты ─── */

.contacts {
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
}

.contacts__inner {
    max-width: 1160px;
    margin: 0 auto;
}

/* ── Карточки контактов ── */

.contacts__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: var(--space-2xl);
}

.contacts-card {
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-md); /* 16px */
    padding: var(--space-xl) var(--space-lg); /* 32px 24px — было 32px 28px, выровняли правый padding */
    display: flex;
    flex-direction: column;
    gap: var(--space-sm); /* 8px — было 12px; 12 не на шкале, 8 ближайший */
}

.contacts-card__icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--color-border-default);
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-xs);
    color: var(--color-text-primary);
}

.contacts-card__label {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 14px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}

.contacts-card__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-relaxed);
    margin: 0;
}

.contacts-card__links {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contacts-card__link {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.contacts-card__link:hover {
    opacity: 0.7;
}

.contacts-card__social-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.contacts-card__social-link:hover {
    opacity: 0.7;
}

.contacts-card__social-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(22%) sepia(80%) saturate(1200%) hue-rotate(170deg) brightness(90%);
}

/* ── Реквизиты ── */

.contacts__requisites {
    padding: var(--section-spacing-desktop) var(--container-padding-desktop);
}

.contacts__requisites-inner {
    max-width: var(--container-width);
    margin-inline: auto;
}

.contacts__requisites-title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 24px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin-bottom приходит от .text-h2 */
}

.contacts__requisites-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 48px;
}

.contacts__req-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.contacts__req-label {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.contacts__req-value {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-normal);
}

/* ── Контакты: адаптив ── */

@media (max-width: 1280px) {
    .contacts {
        padding: var(--section-spacing-tablet) 60px;
    }

    .contacts__requisites {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 1024px) {
    .contacts__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .contacts {
        padding: var(--section-spacing-mobile) 24px;
    }

    .contacts__requisites {
        padding: var(--section-spacing-mobile) 24px;
    }

    .contacts__grid {
        grid-template-columns: 1fr;
        margin-bottom: 40px;
    }

    .contacts__requisites-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .contacts__requisites-title {
        font-size: 20px;
    }
}

/* ─── Page: Новые старшие ─── */

/* ── NS Hero ── */

.ns-hero {
    background: linear-gradient(62.84deg, #007d9b 9.34%, #00916e 60.52%, #ffbe14 100.36%);
    width: 100%;
}

.ns-hero__inner {
    max-width: 1440px;
    margin-inline: auto;
    padding: var(--section-spacing-desktop) 140px;
    display: flex;
    align-items: center;
    gap: 64px;
}

.ns-hero__label {
    display: inline-block;
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 20px;
}

.ns-hero__title {
    font-family: var(--font-heading);
    font-size: 42px;
    font-weight: 400;
    color: #ffffff;
    line-height: var(--line-height-tighter);
    text-transform: uppercase;
    /* margin-bottom приходит от .text-h1 */
}

.ns-hero__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    line-height: var(--line-height-loose);
    margin: 0 0 32px;
    max-width: 480px;
}

/* Hero-кнопка на градиенте: по умолчанию прозрачная с белой обводкой,
   на hover/focus/active — заливается белым, текст становится #005a78.
   align-self: flex-start — чтобы кнопка не стретчилась на всю ширину
   flex-родителя .ns-hero__content (534px), а была по ширине контента. */
.ns-hero__btn {
    color: #ffffff;
    background: transparent;
    border: 1px solid #ffffff;
    align-self: flex-start;
}

.ns-hero__btn:hover,
.ns-hero__btn:focus,
.ns-hero__btn:active {
    background: #ffffff;
    color: var(--color-text-primary);
}

/* ── Hero Media (правая колонка) ── */

.ns-hero__content {
    flex: 0 0 534px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 320px;
}

.ns-hero__media {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ns-hero__image {
    width: 100%;
    height: auto;
    max-width: 520px;
    border-radius: var(--radius-md);
    object-fit: cover;
}

/* ── Hero Media Slider (универсальный: ШРЭ + Новые старшие) ── */

.hero-media-slider {
    position: relative;
    width: 100%;
    max-width: 520px;
    /* aspect-ratio и overflow задаются на __viewport — чтобы стрелки (позиционированные
       снаружи через negative left/right) не обрезались. */
}

/* Viewport — прослойка между слайдером и треком с overflow: hidden.
   Трек translateX'ом двигается ВНУТРИ viewport'а, поэтому overflow должен быть
   на неподвижном viewport, а не на треке (иначе клип двигается вместе с треком
   и следующие слайды пропадают за ним). */
.hero-media-slider__viewport {
    width: 100%;
    aspect-ratio: 520 / 400;
    border-radius: var(--radius-xs);
    overflow: hidden;
}

.hero-media-slider__track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-media-slider__slide {
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
}

.hero-media-slider__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Стрелки слайдера — видны только когда есть несколько слайдов.
   Default: прозрачный фон + белая обводка + белая иконка.
   Hover: заливка #e8e8e8 + синяя обводка + синяя иконка. */
.hero-media-slider__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 29px;
    height: 29px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid #ffffff;
    border-radius: var(--radius-circle);
    color: #ffffff;
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.hero-media-slider__arrow:hover,
.hero-media-slider__arrow:focus-visible {
    background: #e8e8e8;
    border-color: var(--color-border-default);
    color: var(--color-text-primary);
    outline: none;
}

.hero-media-slider__arrow--prev {
    left: -44px; /* снаружи слева: -29(кнопка) - 15(отступ) */
}

.hero-media-slider__arrow--next {
    right: -44px; /* снаружи справа */
}

.hero-media-slider__arrow svg {
    display: block;
    width: 9px;
    height: auto;
}

@media (max-width: 768px) {
    .hero-media-slider {
        max-width: 400px;
    }
    /* На мобильных стрелки возвращаются внутрь — иначе уходят за экран */
    .hero-media-slider__arrow--prev {
        left: var(--space-md);
    }
    .hero-media-slider__arrow--next {
        right: var(--space-md);
    }
}

@media (max-width: 480px) {
    .hero-media-slider {
        max-width: 320px;
    }
}

/* ── NS Donation ── */

.ns-donation {
    padding: var(--section-spacing-tight-desktop) 140px;
    display: flex;
    justify-content: center;
}

.ns-donation__inner {
    max-width: 720px;
    width: 100%;
}

.ns-donation__widget {
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    padding: 40px 32px;
}

/* ── NS Impact (Что меняет ЦК) ── */

.ns-impact {
    padding: var(--section-spacing-desktop) 140px;
}

.ns-impact__inner {
    max-width: 1160px;
    margin: 0 auto;
    text-align: center;
}

/* Ярлык секции — Figma «AG мелкий»: 12px/18px, uppercase, letter-spacing 0.1em */
/* Ярлык секции — только отличия от .text-label + .section-header__eyebrow:
   - color (страховка, .text-label цвет не задаёт)
   Всё остальное (font-size 14px, weight 400, uppercase, letter-spacing, line-height, family)
   наследуется от утилиты .text-label. */
.ns-impact__label {
    color: var(--color-text-primary);
}

/* Заголовок секции — только отличия от .text-h2 + .section-header__title:
   - line-height 1.2 (tight) — Figma спец, .text-h2 даёт 1.4 (normal)
   - margin-bottom 16px — Figma спец, .section-header__title даёт 8px
   Всё остальное (font-size 32px, weight 400, uppercase, family) наследуется от .text-h2. */
.ns-impact__title {
    line-height: var(--line-height-tight);
    margin: 0 0 16px;
    color: var(--color-text-primary);
}

/* Интро — только отличия от .text-body-lg + .section-header__subtitle:
   - line-height normal (1.4 → 22.4px) — Figma спец 22px, утилита даёт relaxed (1.5 → 24px)
   - max-width / margin / color — контекст секции
   Всё остальное (font 16px, weight 400, family Circe Rounded, letter-spacing 0) — из утилиты. */
.ns-impact__subtitle {
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    max-width: 720px;
    margin: 0 auto 40px;
}

/* Section-header wrapper: убираем внешний margin, т.к. subtitle уже даёт 40px до grid */
.ns-impact .section-header {
    margin-bottom: 0;
}

.ns-impact__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    text-align: left;
}

/* Карточка — Figma: radius 20, padding 20 со всех сторон, solid обводка #005a78 (ДС-токен).
   Статична: без hover-теней, без transition. */
.ns-impact-card {
    position: relative; /* anchor для ::after стрелки */
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-lg);
    padding: 20px;
    display: flex;
    flex-direction: column;
    color: var(--color-text-primary);
    /* gap не используется — ритмика через индивидуальные margin-bottom */
}

/* SVG-шеврон между карточками 1→2, 2→3, 3→4. Figma: 10×20, stroke 1 #005a78.
   Две линии под 90° (dx=dy=8 → 45° каждая → вершина 90°). Цвет зашит в stroke data-URI.
   Позиция: right: -16px + translate(50%, -50%) → центр стрелки ровно в середине 32px-gap'а. */
.ns-impact__grid .ns-impact-card:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -16px;
    top: 50%;
    transform: translate(50%, -50%);
    width: 10px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 20' fill='none' stroke='%23005a78' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='1 2 9 10 1 18'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    pointer-events: none;
}

/* Тэг колонки — Figma: 12/18 uppercase, без обводки (просто текст).
   line-height-relaxed (1.5) → 12 × 1.5 = 18px ровно. */
.ns-impact-card__tag {
    display: inline-block;
    font-family: var(--font-main);
    font-size: var(--font-size-xs);
    line-height: var(--line-height-relaxed);
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    align-self: flex-start;
    margin-bottom: 16px;
}

/* Заголовок колонки — 16px uppercase, weight 400, line-height normal (1.4) для воздуха между строк */
.ns-impact-card__title {
    font-family: var(--font-main);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-normal);
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    margin: 0 0 16px;
}

/* Описание — Figma: 12/18 regular (тот же набор, что у тэга, но без uppercase) */
.ns-impact-card__text {
    font-family: var(--font-main);
    font-size: var(--font-size-xs);
    line-height: var(--line-height-relaxed);
    font-weight: 400;
    color: var(--color-text-primary);
    margin: 0;
}

/* ── NS Program (О программе) ── */

.ns-program {
    padding: var(--section-spacing-desktop) 140px;
}

.ns-program__inner {
    max-width: 1160px;
    margin: 0 auto;
}

/* Header секции — центрированный label + H2 */
.ns-program__header {
    text-align: center;
    margin-bottom: 40px;
}

/* .text-label уже даёт 14/normal uppercase — контекст только margin */
.ns-program__label {
    display: inline-block;
    color: var(--color-text-primary);
    margin-bottom: 8px;
}

.ns-program__title {
    color: var(--color-text-primary);
    margin: 0;
    /* font-size/weight — от .text-h2 (32px) */
}

/* 3-колонный grid: описание | ближайшее событие | подписка */
.ns-program__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: stretch;
}

/* Колонка 1: описание — текст начинается с левого края, вертикально-центрирован */
.ns-program__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
    padding: 0 8px; /* лёгкий inset от края до карточек */
}

.ns-program__text {
    font-family: var(--font-main);
    font-size: var(--font-size-md);
    line-height: var(--line-height-relaxed);
    font-weight: 400;
    color: var(--color-text-primary);
    margin: 0;
}

/* ── Карточки (Ближайшее событие / Подписка) ── */

.ns-program-card {
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-lg);
    padding: 32px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
    color: var(--color-text-primary);
}

.ns-program-card__tag {
    font-family: var(--font-main);
    font-size: var(--font-size-xs);
    line-height: var(--line-height-relaxed);
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0;
}

.ns-program-card__title {
    font-family: var(--font-main);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-normal);
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

.ns-program-card__text {
    font-family: var(--font-main);
    font-size: var(--font-size-md);
    line-height: var(--line-height-normal);
    font-weight: 400;
    color: var(--color-text-primary);
    margin: 0;
}

.ns-program-card__btn {
    margin-top: auto; /* прижимает кнопку вниз, если карточка выше соседней */
}

/* ── NS Winners (Истории победителей) ── */

.ns-winners {
    padding: var(--section-spacing-desktop) 140px;
    overflow: hidden;
}

.ns-winners__inner {
    max-width: 1160px; /* Совпадает с .ns-impact__inner / .ns-program__inner / .ns-contacts__inner — единая ширина контента на странице NS */
    margin-inline: auto;
}

.ns-winners__header {
    text-align: center;
    margin-bottom: 40px;
}

.ns-winners__label {
    display: block;
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 8px;
}

/* Row с H2 и CTA/счётчиком справа — новый anchor для position: absolute */
.ns-winners__title-row {
    position: relative;
}

.ns-winners__title {
    color: var(--color-text-primary);
    /* font-size, weight, transform — от .text-h2 */
}

/* Счётчик справа сверху (фоллбэк — если PDF не загружен в ACF) */
.ns-winners__count {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-family: var(--font-main);
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* CTA-кнопка «Скачать все проекты» справа сверху — когда PDF загружен */
.ns-winners__cta {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px;
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--color-text-primary);
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 400;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: background 0.2s ease, color 0.2s ease;
}

.ns-winners__cta:hover {
    background: var(--palette-blue-900);
    color: #ffffff;
}

/* ── Slider wrapper ── */

.ns-winners__slider {
    position: relative;
    /* Flex раскладка убрана — стрелки теперь абсолютно позиционированы слева/справа
       от track'а (вылезают в 140px padding секции), track занимает всю ширину inner */
}

.ns-winners__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 29px;
    height: 29px;
    border-radius: var(--radius-circle);
    border: 1px solid var(--color-border-default);
    background: #ffffff;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.ns-winners__arrow::after {
    content: '';
    position: absolute;
    inset: -11px;
    border-radius: 50%;
}

.ns-winners__arrow--prev { left: -52px; }
.ns-winners__arrow--next { right: -52px; }

.ns-winners__arrow:hover,
.ns-winners__arrow:focus-visible {
    background: #e8e8e8;
    border-color: var(--color-border-default);
    color: var(--color-text-primary);
    outline: none;
}

.ns-winners__track {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding: 4px 0;
    /* скрыть скроллбар */
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.ns-winners__track::-webkit-scrollbar {
    display: none;
}

/* ── Winner card (по макету Figma) ── */

.ns-winner-card {
    flex: 0 0 calc((100% - 60px) / 4);
    min-width: 240px;
    background: #ffffff;
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
}

.ns-winner-card__image {
    width: 100%;
    height: 160px;
    background: #e8edf0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-main);
    font-size: 13px;
    color: var(--palette-gray-500);
    overflow: hidden;
}

.ns-winner-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ns-winner-card__body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex: 1;
    /* gap убран — отступы между элементами заданы индивидуальными margin-bottom'ами
       для более контролируемой вертикальной ритмики (город → заголовок → текст → кнопка) */
}

.ns-winner-card__city {
    font-family: var(--font-main);
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-primary);
    margin: 0 0 16px;
}

.ns-winner-card__title {
    font-family: var(--font-main);
    font-size: 15px;
    font-weight: 400; /* Глобальное правило heading weight 400 — см. design-system §Типографика */
    color: var(--color-text-primary);
    margin: 0 0 20px;
    line-height: var(--line-height-snug);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ns-winner-card__author {
    font-family: var(--font-main);
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-snug);
    margin: -12px 0 16px; /* компенсируем margin-bottom заголовка для более плотной группировки */
    letter-spacing: 0.2px;
}

.ns-winner-card__text {
    font-family: var(--font-main);
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-relaxed);
    margin: 0 0 24px;
    flex: 1;
}

.ns-winner-card__btn {
    display: inline-block;
    font-family: var(--font-main);
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-primary);
    background: transparent;
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-pill);
    padding: 8px 20px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    align-self: flex-start;
    margin-top: auto;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}

.ns-winner-card__btn:hover,
.ns-winner-card__btn:focus-visible {
    background: var(--palette-blue-900);
    color: #ffffff;
    outline: none;
}

/* ── NS Winner Modal (Подробнее о проекте) ── */

.ns-winner-modal {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal, 1000);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.ns-winner-modal[aria-hidden="false"] {
    display: flex;
}

.ns-winner-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 90, 120, 0.55);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.ns-winner-modal__dialog {
    position: relative;
    z-index: 1;
    background: #ffffff;
    border-radius: var(--radius-md);
    max-width: 640px;
    width: 100%;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 48px 40px 40px;
    box-shadow: 0 20px 50px rgba(0, 90, 120, 0.2);
    animation: ns-winner-modal-in 0.2s ease;
}

@keyframes ns-winner-modal-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.ns-winner-modal__close {
    position: absolute;
    top: var(--space-md); /* 16px */
    right: var(--space-md);
    width: 44px; /* было 36px — выровняли до WCAG touch target 44×44 */
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--color-border-subtle);
    border-radius: var(--radius-circle);
    color: var(--color-text-primary);
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.ns-winner-modal__close:hover,
.ns-winner-modal__close:focus-visible {
    background: var(--palette-blue-900);
    border-color: var(--palette-blue-900);
    color: #ffffff;
    outline: none;
}

.ns-winner-modal__header {
    margin-bottom: var(--space-lg); /* 24px */
    padding-bottom: var(--space-lg); /* 24px — было 20px, выровняли с margin для симметрии */
    border-bottom: 1px solid var(--color-border-subtle);
}

.ns-winner-modal__city {
    display: inline-block;
    font-family: var(--font-main);
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-primary);
    opacity: 0.7;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: var(--space-sm); /* 8px */
}

.ns-winner-modal__title {
    font-family: var(--font-main);
    font-size: 22px;
    font-weight: 400; /* было 700 — соответствие дизайн-системе (заголовки 400) */
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: var(--line-height-snug);
    margin: 0 0 var(--space-sm); /* 8px */
}

.ns-winner-modal__author {
    font-family: var(--font-main);
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-primary);
    opacity: 0.75;
    margin: 0;
    line-height: var(--line-height-snug);
}

.ns-winner-modal__body {
    font-family: var(--font-main);
    font-size: 15px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-loose);
}

.ns-winner-modal__body p {
    margin: 0 0 16px;
}

.ns-winner-modal__body p:last-child {
    margin-bottom: 0;
}

/* Блокировка скролла body при открытой модалке */
body.ns-winner-modal-open {
    overflow: hidden;
}

@media (max-width: 768px) {
    .ns-winner-modal {
        padding: 16px;
    }
    .ns-winner-modal__dialog {
        padding: 40px 24px 24px;
    }
    .ns-winner-modal__title {
        font-size: 18px;
    }
    .ns-winner-modal__body {
        font-size: 14px;
    }
}

/* ── NS Contacts (Команда проекта) ── */

.ns-contacts {
    padding: var(--section-spacing-desktop) 140px;
}

.ns-contacts__inner {
    max-width: 1160px;
    margin: 0 auto;
}

/* Header секции — центрированный label + H2 (как в макете) */
.ns-contacts__header {
    text-align: center;
    margin-bottom: 40px;
}

/* .text-label уже даёт 14/normal uppercase — контекст только margin */
.ns-contacts__label {
    display: inline-block;
    color: var(--color-text-primary);
    margin-bottom: 8px;
}

.ns-contacts__title {
    color: var(--color-text-primary);
    margin: 0;
    /* font-size/weight — от .text-h2 (32px) */
}

.ns-contacts__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    text-align: center;
    margin: 16px 0 0;
}

.ns-contacts__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

/* Single-card variant — одна карточка, по левому краю, шириной в одну из двух карточек
   (совпадает с размером карточки в 2-колоночной раскладке на ШРЭ: calc(50% - 12px gap/2)) */
.ns-contacts__grid--single {
    grid-template-columns: 1fr;
    max-width: calc(50% - 12px);
    margin: 0;
}

/* .ns-contact-card — удалён (v1.0.100). Заменён на универсальный компонент .team-card.
   См. определение выше в разделе «Team Card». */

/* ── NS Responsive ── */

@media (max-width: 1280px) {
    .ns-hero__inner {
        padding-left: 60px;
        padding-right: 60px;
    }

    .ns-donation,
    .ns-impact,
    .ns-program,
    .ns-winners,
    .ns-contacts {
        padding-left: 60px;
        padding-right: 60px;
    }

    .ns-donation {
        padding-top: var(--section-spacing-tight-desktop);
        padding-bottom: var(--section-spacing-tight-desktop);
    }

    .ns-impact,
    .ns-program,
    .ns-winners,
    .ns-contacts {
        padding-top: var(--section-spacing-tablet);
        padding-bottom: var(--section-spacing-tablet);
    }

    .ns-hero__content {
        flex: 0 0 440px;
    }
}

@media (max-width: 1024px) {
    .ns-hero__inner {
        flex-direction: column;
        gap: 32px;
    }

    .ns-hero__content {
        flex: none;
        min-height: auto;
    }

    .ns-hero__image {
        max-width: 400px;
    }

    .ns-winner-card {
        flex: 0 0 calc((100% - 40px) / 3);
    }

    .ns-impact__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* При 2 колонках стрелки теряют смысл (карточки переносятся) */
    .ns-impact__grid .ns-impact-card:not(:last-child)::after {
        display: none;
    }

    .ns-program__grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .ns-program__content {
        padding: 0;
    }
}

@media (max-width: 768px) {
    .ns-hero__inner {
        padding: 48px 24px 40px;
    }

    .ns-donation,
    .ns-impact,
    .ns-program,
    .ns-winners,
    .ns-contacts {
        padding-left: 24px;
        padding-right: 24px;
    }

    .ns-donation {
        padding-top: var(--section-spacing-tight-mobile);
        padding-bottom: var(--section-spacing-tight-mobile);
    }

    .ns-impact,
    .ns-program,
    .ns-winners,
    .ns-contacts {
        padding-top: var(--section-spacing-mobile);
        padding-bottom: var(--section-spacing-mobile);
    }

    .ns-hero__title {
        font-size: 28px;
    }

    .ns-hero__image {
        max-width: 320px;
    }

    .ns-impact__grid {
        grid-template-columns: 1fr;
    }

    .ns-impact__title,
    .ns-winners__title {
        font-size: 24px;
    }

    .ns-program__title,
    .ns-contacts__title {
        font-size: 22px;
    }

    .ns-contacts__grid {
        grid-template-columns: 1fr;
    }

    .ns-contacts__grid--single {
        max-width: 100%;
    }

    /* title-row на мобилке — flex-колонка, чтобы статичный CTA/count встал под title */
    .ns-winners__title-row {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .ns-winners__count,
    .ns-winners__cta {
        position: static;
        transform: none;
        margin-top: 12px;
    }

    .ns-winners__arrow {
        display: none;
    }

    .ns-winner-card {
        flex: 0 0 260px;
        min-width: 220px;
    }
}

/* ─── Page: ШРЭ (Школа Региональных Экспертов) ─ */

.page-shre {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* ── Hero ── */

.shre-hero {
    background: linear-gradient(62.84deg, #007d9b 9.34%, #00916e 60.52%, #ffbe14 100.36%);
    width: 100%;
    border-bottom: 1px solid #e0e0e0;
}

.shre-hero__inner {
    max-width: 1440px;
    margin-inline: auto;
    padding: var(--section-spacing-desktop) 140px;
    display: flex;
    align-items: center;
    gap: 64px;
}

.shre-hero__content {
    flex: 0 0 534px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
}

.shre-hero__label {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff;
}

.shre-hero__title {
    font-family: var(--font-heading);
    font-size: 42px;
    font-weight: 400;
    line-height: var(--line-height-tighter);
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}

.shre-hero__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: #ffffff;
    margin: 0;
    max-width: 520px;
}

/* Hero-кнопка на градиенте: по умолчанию прозрачная с белой обводкой,
   на hover/focus/active — заливается белым, текст становится #005a78 */
.shre-hero__btn {
    color: #ffffff;
    background: transparent;
    border: 1px solid #ffffff;
    align-self: flex-start;
}

.shre-hero__btn:hover,
.shre-hero__btn:focus,
.shre-hero__btn:active {
    background: #ffffff;
    color: var(--color-text-primary);
}

.shre-hero__media {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shre-hero__image {
    width: 100%;
    height: auto;
    max-width: 520px;
    border-radius: var(--radius-md);
    display: block;
    object-fit: cover;
}

.shre-hero__placeholder {
    width: 100%;
    height: 100%;
    background-color: #d8d8d8;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-heading);
    font-size: 16px;
    color: rgba(255, 255, 255, 0.6);
}

/* ── Hero — адаптив ── */

@media (max-width: 1280px) {
    .shre-hero__inner {
        padding: var(--section-spacing-tablet) 60px;
    }

    .shre-hero__content {
        flex: 0 0 420px;
    }
}

@media (max-width: 768px) {
    .shre-hero__inner {
        flex-direction: column;
        padding: 40px 24px 56px;
        gap: 32px;
    }

    .shre-hero__content {
        flex: none;
        min-height: auto;
        gap: 24px;
    }

    .shre-hero__media {
        flex: none;
        width: 100%;
        min-height: 200px;
    }

    .shre-hero__title {
        font-size: 28px;
    }
}

/* ─── Section: Форма пожертвования GIVR ─── */

.section-donation {
    padding: var(--section-spacing-tight-desktop) 0;
}

.section-donation__widget {
    max-width: 720px;
    margin: 0 auto;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    padding: 40px 32px;
}

/* ── Section: Форма пожертвования: адаптив ── */

@media (max-width: 768px) {
    .section-donation {
        padding: 48px 0;
    }
    .section-donation__widget {
        max-width: 100%;
    }
}

/* ── Что меняет ЦК (Impact) ── */

.shre-impact {
    background-color: #ffffff;
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
    border-bottom: 1px solid var(--color-border-default);
}

.shre-impact__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.shre-impact__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: center;
    /* margin-bottom приходит от .text-h2 */
}

.shre-impact__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0 auto 40px;
    max-width: 666px;
    text-align: center;
}

.shre-impact__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg); /* 24px — было 25px */
}

.shre-impact__card {
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-lg); /* 20px */
    padding: var(--space-xl) var(--space-xl) var(--space-2xl); /* 32px 32px 48px — было 33 33 40 */
    display: flex;
    flex-direction: column;
}

.shre-impact__card-header {
    display: flex;
    align-items: center;
    gap: var(--space-lg); /* 24px — было 20px */
    margin-bottom: var(--space-lg); /* 24px — было 25px */
}

.shre-impact__card-num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid var(--color-border-default);
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 400;
    color: var(--color-text-primary);
    flex-shrink: 0;
    padding-top: 4px;
}

.shre-impact__card-meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.shre-impact__card-label {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-primary);
}

.shre-impact__card-value {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-none);
    letter-spacing: 1px;
    text-transform: uppercase;
}

.shre-impact__card-text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0;
    flex: 1;
}

.shre-impact__card-badge {
    display: block;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.75px;
    margin-bottom: 25px;
}

/* ── Impact — адаптив ── */

@media (max-width: 1280px) {
    .shre-impact {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 1024px) {
    .shre-impact__cards {
        grid-template-columns: 1fr;
        max-width: 480px;
    }
}

@media (max-width: 768px) {
    .shre-impact {
        padding: 48px 24px 56px;
    }

    .shre-impact__title {
        font-size: 24px;
    }
}

/* ── Что уже поддержали (Results) ── */

.shre-results {
    background-color: #ffffff;
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
    border-bottom: 1px solid var(--color-border-default);
}

.shre-results__inner {
    max-width: 1160px;
    margin: 0 auto;
    display: flex;
    gap: 64px;
    align-items: flex-start;
}

.shre-results__sidebar {
    flex: 0 0 548px;
    position: relative;
}

.shre-results__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin-bottom приходит от .text-h2 */
}

.shre-results__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0 0 40px;
    max-width: 529px;
}

/* .shre-results__link оставлен как BEM-контекстный hook без своих стилей —
   все свойства (height, padding, radius, hover) приходят от утилиты .btn-outline-pill */

.shre-results__card {
    flex: 1;
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-lg); /* 20px */
    padding: var(--space-lg) var(--space-xl) var(--space-xl); /* 24px 32px 32px — было 24 30 30 */
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
}

.shre-results__card-badge {
    display: block;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    margin-bottom: 18px;
}

.shre-results__card-heading {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 25px;
    line-height: var(--line-height-tighter);
}

.shre-results__stats {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.shre-results__stat {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 14px 0;
    border-bottom: 1px solid var(--color-border-default);
}

.shre-results__stat:first-child {
    padding-top: 0;
}

.shre-results__stat:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.shre-results__stat-num {
    flex: 0 0 90px;
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-none);
    letter-spacing: 1px;
    text-transform: uppercase;
}

.shre-results__stat-text {
    flex: 1;
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    line-height: var(--line-height-relaxed);
    color: var(--color-text-primary);
}

/* ── Results — адаптив ── */

@media (max-width: 1280px) {
    .shre-results {
        padding: var(--section-spacing-tablet) 60px;
    }

    .shre-results__sidebar {
        flex: 0 0 420px;
    }
}

@media (max-width: 1024px) {
    .shre-results__inner {
        flex-direction: column;
        gap: 32px;
    }

    .shre-results__sidebar {
        flex: none;
    }
}

@media (max-width: 768px) {
    .shre-results {
        padding: 48px 24px 56px;
    }

    .shre-results__title {
        font-size: 24px;
    }

    .shre-results__card-heading {
        font-size: 20px;
    }

    .shre-results__stat-num {
        flex: 0 0 60px;
        font-size: 24px;
    }
}

/* ── Ключевые благотворители (Donors) ── */

.shre-donors {
    background-color: #ffffff;
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
    border-bottom: 1px solid var(--color-border-default);
}

.shre-donors__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.shre-donors__grid {
    display: grid;
    grid-template-columns: 1fr 360px 360px;
    grid-template-rows: auto auto;
    column-gap: 40px;
    row-gap: 24px;
}

/* Title — row 1, col 1. Intro и оба col идут в row 2 на одной линии. */
.shre-donors__title {
    grid-column: 1 / 2;
    grid-row: 1;
    margin: 0; /* сброс h2 default margins */
}

.shre-donors__intro {
    grid-column: 1 / 2;
    grid-row: 2;
}

/* Колонки в DOM: 1=h2, 2=.intro, 3=компании, 4=частные.
   Используем :nth-child, т.к. :nth-of-type считает по тегу (все div) и приводит
   к коллизии: оба __col попадают в одну grid-ячейку и накладываются. */
.shre-donors__col:nth-child(3) {
    grid-column: 2 / 3;
    grid-row: 2;
}

.shre-donors__col:nth-child(4) {
    grid-column: 3 / 4;
    grid-row: 2;
}

/* Колонка-intro (1-я) */

.shre-donors__intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: left;
    gap: 16px;
}

.shre-donors__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* margin приходит от .text-h2 */
}

.shre-donors__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0;
}

.shre-donors__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 360px;
    padding: 14px 24px;
    border: 1px solid var(--color-border-default);
    border-radius: 20px;
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.75px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    text-decoration: none;
    text-align: center;
    line-height: var(--line-height-snug);
    margin-top: auto;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.shre-donors__cta:hover {
    background-color: var(--palette-blue-900);
    color: #ffffff;
}

/* Колонки списков (2-я, 3-я) */

.shre-donors__col {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.shre-donors__col-title {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 360px;
    height: 40px;
    padding: 0 30px;
    background-color: var(--palette-blue-900);
    border-radius: 20px;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.75px;
    text-transform: uppercase;
    color: #ffffff;
    text-align: center;
    line-height: var(--line-height-none);
    box-sizing: border-box;
}

.shre-donors__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.shre-donors__item {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 360px;
    height: 62px;
    border: 1px solid var(--color-border-default);
    border-radius: 20px;
    padding: 0 20px 0 20px;
    box-sizing: border-box;
}

/* Аватарки */

.shre-donors__item-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #d8d8d8;
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Square-вариант для логотипов компаний: шире (80×40) и прямоугольный,
   чтобы горизонтально-ориентированные логотипы помещались целиком */
.shre-donors__item-avatar--square {
    width: 80px;
    border-radius: 4px;
    background-color: #ffffff; /* логотипы обычно на белом — избегаем серого фона под лого */
}

.shre-donors__item-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Для прямоугольного square-варианта — contain (не обрезать лого), padding вокруг */
.shre-donors__item-avatar--square img {
    object-fit: contain;
    padding: 4px;
    box-sizing: border-box;
}

.shre-donors__item-placeholder {
    font-family: var(--font-heading);
    font-size: 10px;
    font-weight: 400;
    color: #999999;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.shre-donors__item-name {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.75px;
    line-height: var(--line-height-snug);
}

/* ── Donors — адаптив ── */

@media (max-width: 1280px) {
    .shre-donors {
        padding: var(--section-spacing-tablet) 60px;
    }

    .shre-donors__grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }

    /* Tablet: сбрасываем desktop-specific grid-row/column assignments.
       Используем ту же специфичность :nth-child(N), что у desktop-правил,
       иначе они перебивают сброс за счёт большей специфичности. */
    .shre-donors__title,
    .shre-donors__col:nth-child(3),
    .shre-donors__col:nth-child(4) {
        grid-column: auto;
        grid-row: auto;
    }

    .shre-donors__title {
        grid-column: 1 / -1; /* title на всю ширину */
    }

    .shre-donors__intro {
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .shre-donors__col-title,
    .shre-donors__item {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .shre-donors {
        padding: 48px 24px 56px;
    }

    .shre-donors__title {
        font-size: 24px;
    }

    .shre-donors__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .shre-donors__intro {
        grid-column: auto;
    }

    .shre-donors__cta {
        max-width: 100%;
    }
}

/* ── Программа ШРЭ (Program) ── */

.shre-program {
    background-color: #ffffff;
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
    border-bottom: 1px solid var(--color-border-default);
}

.shre-program__inner {
    max-width: 1160px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}

.shre-program__sidebar {
    display: flex;
    flex-direction: column;
}

.shre-program__badge {
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    margin-bottom: 16px;
}

.shre-program__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: var(--line-height-tighter);
    /* margin-bottom приходит от .text-h2 */
}

.shre-program__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    margin: 0;
}

.shre-program__mission {
    margin: 24px 0;
}

.shre-program__mission p {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-relaxed);
    color: var(--color-text-primary);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Контейнер кнопок */

.shre-program__buttons {
    display: flex;
    flex-direction: row;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 32px;
}

.shre-program__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border: 1.333px solid var(--color-border-default);
    border-radius: 25px;
    background: transparent;
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.75px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    text-decoration: none;
    text-align: center;
    line-height: var(--line-height-snug);
    transition: background-color 0.2s ease, color 0.2s ease;
}

.shre-program__btn:hover {
    background-color: var(--palette-blue-900);
    color: #ffffff;
}

/* Правая карточка «О программе в цифрах» */

.shre-program__card {
    border: 1.333px solid var(--color-border-default);
    border-radius: 20px;
    padding: 40px;
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
}

.shre-program__card-title {
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 32px;
}

.shre-program__stats {
    display: flex;
    flex-direction: column;
}

.shre-program__stat-row {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 20px 0;
    border-bottom: 1px solid var(--color-border-default);
}

.shre-program__stat-row:first-child {
    padding-top: 0;
}

.shre-program__stat-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.shre-program__stat-num {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-none);
    letter-spacing: 1px;
    text-transform: uppercase;
    flex: 0 0 80px;
}

.shre-program__stat-text {
    flex: 1;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    line-height: var(--line-height-relaxed);
    color: var(--color-text-primary);
}

/* ── Program — адаптив ── */

@media (max-width: 1280px) {
    .shre-program {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 992px) {
    .shre-program__inner {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .shre-program__card {
        max-width: 548px;
    }
}

@media (max-width: 768px) {
    .shre-program {
        padding: 48px 24px 56px;
    }

    .shre-program__title {
        font-size: 24px;
    }

    .shre-program__stat-num {
        font-size: 28px;
        flex: 0 0 64px;
    }

    .shre-program__btn {
        width: 100%;
    }
}

/* ── Контакты команды (Contacts) ── */

.shre-contacts {
    background-color: #ffffff;
    width: 100%;
    padding: var(--section-spacing-desktop) 140px;
    border-bottom: 1px solid #e0e0e0;
}

.shre-contacts__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.shre-contacts__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: center;
    /* margin-bottom приходит от .text-h2 */
}

.shre-contacts__text {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    text-align: center;
    margin: 0 0 32px;
}

.shre-contacts__grid {
    display: flex;
    gap: 24px;
}

/* ── Team Card (универсальный компонент — член команды) ────────────────────── */

.team-card {
    flex: 1;
    border: 1px solid var(--color-border-default);
    border-radius: 20px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 0;
    background: var(--color-bg-primary);
}

.team-card__avatar {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-circle);
    background-color: var(--palette-gray-200); /* #e0e0e0 */
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-main);
    font-size: 12px;
    font-weight: 400;
    color: var(--palette-gray-500);
}

.team-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.team-card__name {
    font-family: var(--font-main);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-normal);
    margin: 16px 0 0;
}

.team-card__role {
    font-family: var(--font-main);
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    color: var(--color-text-primary);
    letter-spacing: 0.75px;
    text-transform: uppercase;
    margin: 4px 0 0;
}

.team-card__contacts {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 24px;
}

.team-card__contact {
    font-family: var(--font-main);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--line-height-normal);
    color: var(--color-text-primary);
    text-decoration: none;
    transition: opacity 0.2s ease;
    word-break: break-word;
}

.team-card__contact:hover,
.team-card__contact:focus-visible {
    opacity: 0.6;
    outline: none;
}

/* ── Contacts — адаптив ── */

@media (max-width: 1280px) {
    .shre-contacts {
        padding: var(--section-spacing-tablet) 60px;
    }
}

@media (max-width: 768px) {
    .shre-contacts {
        padding: 48px 24px 56px;
    }

    .shre-contacts__title {
        font-size: 24px;
    }

    .shre-contacts__grid {
        flex-direction: column;
    }
}

/* ── ШРЭ — reduced motion ── */

@media (prefers-reduced-motion: reduce) {
    .shre-impact__card,
    .shre-donors__item {
        transition: none;
    }
}

/* ─── GIVR Widget: override стилей ─── */
/* Стили сброшены — виджет рендерится стандартно (тема extended). */
/* ─── Конец GIVR Widget overrides ─── */

/* ─── Page: Что такое целевой капитал ─── */

.page-what-is-ck {
    padding: 0;
    max-width: 100%;
    margin: 0;
}

/* ── CK Page Header ── */

/* ── CK Explain Cards (сетка 2×2) ── */

.ck-cards {
    padding: var(--space-xl) 140px var(--section-spacing-desktop); /* 32px top — было 40px, привели к 8pt шкале */
}

.ck-cards__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.ck-cards__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.ck-explain-card {
    position: relative;
    padding: var(--space-xl); /* 32px — было 36px/32px, выровняли по шкале */
    border: 1.5px solid transparent;
    border-radius: var(--radius-lg); /* 20px */
    background:
        linear-gradient(#ffffff, #ffffff) padding-box,
        linear-gradient(90deg, #007d9b 0%, #00916e 50%, #ffbe14 100%) border-box;
}

/* Заголовок карточки (контейнер вокруг H3) */
.ck-explain-card__header {
    margin-bottom: 24px;
}

.ck-explain-card__title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 20px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
    line-height: var(--line-height-snug);
}

/* Текст карточки */
.ck-explain-card__text {
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-loose);
    margin: 0 0 12px;
}

.ck-explain-card__text:last-child {
    margin-bottom: 0;
}

/* Акцентная финальная фраза (карточка 4) */
.ck-explain-card__final {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-normal);
    margin: 16px 0 0;
}

/* Нумерованный список в карточке 2 */

.ck-explain-card__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ck-explain-card__list li {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.ck-explain-card__num {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--color-border-default);
    background: transparent;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
}

.ck-explain-card__list li p {
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-loose);
    margin: 0;
    padding-top: 6px;
}

/* Адаптив explain-карточек */
@media (max-width: 768px) {
    .ck-explain-card {
        padding: 28px 24px 24px;
    }
}

/* ── CK Flow (Как работает — поток шагов) ──
   Full-bleed светло-серый фон (#f2f2f2, «Donation BG» из палитры нейтральных).
   Секция не имеет max-width, поэтому фон тянется на всю ширину viewport. */

.ck-flow {
    /* Фон задаёт класс .section--bg-subtle (в HTML), правило скрытия дивайдеров
       автоматически уберёт линии сверху/снизу от этой секции. */
    padding: var(--section-spacing-desktop) 140px;
}

.ck-flow__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.ck-flow__title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 32px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: center;
    /* margin-bottom приходит от .text-h2 → var(--heading-margin-bottom-h2) */
}

/* subtitle удалён по требованию заказчика */

/* ── Два grid-ряда: верхний repeat(4, 1fr), нижний repeat(3, 1fr).
   Разные сетки → карточки нижнего ряда ~на 35% шире, при этом оба ряда
   занимают одну ширину контейнера (макет дизайнера). ── */

.ck-flow__row {
    display: grid;
    gap: 24px;
}

.ck-flow__row--top {
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: 24px;
}

.ck-flow__row--bottom {
    grid-template-columns: repeat(3, 1fr);
}

/* ── Карточка шага: белый фон + градиентный контур (идентично CK Explain Card) ──
   Техника: двойной background — padding-box (белая заливка) + border-box (градиент
   на border'е). Совместимо с border-radius, не требует псевдоэлементов. */

.ck-flow-card {
    position: relative;
    padding: var(--space-lg); /* 24px — было 28px/24px, выровняли по 8pt шкале */
    border: 1.5px solid transparent;
    border-radius: var(--radius-sm); /* 12px */
    background:
        linear-gradient(#ffffff, #ffffff) padding-box,
        linear-gradient(90deg, #007d9b 0%, #00916e 50%, #ffbe14 100%) border-box;
    display: flex;
    flex-direction: column;
    gap: 12px; /* intentional — плотное расстояние между number-bubble и заголовком */
    /* Без теней, без hover-эффектов — карточка статична */
}

/* ── Номер шага: outlined-круг #005a78 ── */

.ck-flow-card__num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--color-border-default);
    background: transparent;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;  /* Circe Rounded: доступны только 200/400/700, 500 не существует */
    color: var(--color-text-primary);
    flex-shrink: 0;
}

/* ── Стрелки › между карточками в обоих рядах.
   Верхний ряд: 1→2, 2→3, 3→4. Нижний: 5→6, 6→7.
   :not(:last-child) в контексте любого .ck-flow__row ставит ::after на все
   карточки кроме последней в своём ряду (т.е. не на 4-й и не на 7-й).
   Позиционирование: right:-12px + translateX(50%) → центр стрелки в центре gap'а. ── */

.ck-flow__row .ck-flow-card:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -12px;
    top: 50%;
    transform: translate(50%, -50%);
    width: 8px;
    height: 15px;
    background: url("data:image/svg+xml,%3Csvg width='8' height='15' viewBox='0 0 11 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.357575 0.349585L10.1367 10.3496L0.357575 20.3496' stroke='%23005a78'/%3E%3C/svg%3E") no-repeat center / contain;
    pointer-events: none;
}

/* ── Заголовок: UPPERCASE, 13px, #005a78 (соответствует прежнему стилю flow-card title) ── */

.ck-flow-card__title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 13px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: var(--line-height-snug);
    margin: 0;
}

/* ── Описание: body 13px, обычный вес, #005a78 ── */

.ck-flow-card__text {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-relaxed);
    margin: 0;
}

/* ── CK Exhibition (Виртуальная выставка) ── */

.ck-exhibition {
    padding: var(--section-spacing-desktop) 140px;
}

.ck-exhibition__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.ck-exhibition__title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 28px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: var(--line-height-tight);
    max-width: 800px;
    margin-inline: auto;
    /* margin/text-align handled by .section-header */
}

.ck-exhibition__eyebrow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.ck-exhibition__eyebrow span {
    font-family: var(--font-heading);
    font-size: var(--font-size-md);
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing-widest);
    line-height: var(--line-height-normal);
}

.ck-exhibition__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.ck-exhibit-card {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid var(--color-border-default);
    border-radius: 20px;
    padding: 32px;
    text-decoration: none;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    position: relative;
}

.ck-exhibit-card:hover {
    box-shadow: 0 6px 24px rgba(0, 90, 120, 0.1);
    transform: translateY(-2px);
}

.ck-exhibit-card__title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 17px;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    line-height: var(--line-height-snug);
    margin: 0 0 12px;
}

.ck-exhibit-card__desc {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-relaxed);
    margin: 0;
    flex: 1;
}

.ck-exhibit-card__arrow {
    font-size: 20px;
    color: var(--color-text-primary);
    margin-top: 16px;
    align-self: flex-end;
    transition: transform 0.2s ease;
}

.ck-exhibit-card:hover .ck-exhibit-card__arrow {
    transform: translateX(4px);
}

/* ── CK FAQ ── */

.ck-faq {
    padding: var(--section-spacing-desktop) 140px;
}

.ck-faq__inner {
    max-width: 1160px;
    margin-inline: auto;
}

.ck-faq__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 32px;
    text-align: center;
}

.ck-faq__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-md); /* 16px — было 12px, выровняли по 8pt шкале */
}

.ck-faq-item {
    border: 1px solid var(--color-border-default);
    border-radius: var(--radius-pill); /* 60px */
    overflow: hidden;
    transition: border-radius 0.3s ease;
    background: #ffffff;
}

.ck-faq-item.is-open {
    border-radius: var(--radius-lg); /* 20px — было 24px, токен ближе */
}

.ck-faq-item__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: var(--space-md) var(--space-lg); /* 16px 24px — было 18px 28px, выровняли по шкале */
    background: none;
    border: none;
    cursor: pointer;
    gap: var(--space-lg); /* 24px — было 20px */
    text-align: left;
    transition: background-color 0.2s ease;
}

.ck-faq-item__header:hover {
    background-color: rgba(0, 90, 120, 0.04);
}

.ck-faq-item__question {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-normal);
}

.ck-faq-item__toggle {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--color-border-default);
    position: relative;
    transition: transform 0.3s ease;
}

.ck-faq-item__toggle::before,
.ck-faq-item__toggle::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: var(--palette-blue-900);
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.ck-faq-item__toggle::before {
    width: 14px;
    height: 1.5px;
    transform: translate(-50%, -50%);
}

.ck-faq-item__toggle::after {
    width: 1.5px;
    height: 14px;
    transform: translate(-50%, -50%);
}

.ck-faq-item.is-open .ck-faq-item__toggle::after {
    transform: translate(-50%, -50%) rotate(90deg);
    opacity: 0;
}

.ck-faq-item__answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
}

.ck-faq-item.is-open .ck-faq-item__answer {
    border-top: 1px solid var(--color-border-default);
    margin: 0 var(--space-lg); /* 24px — совпадает с padding header'а */
}

.ck-faq-item__answer-inner {
    padding: var(--space-lg) 0; /* 24px top и bottom — было 20px/24px, симметрично и на шкале */
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 400;
    color: var(--color-text-primary);
    line-height: var(--line-height-loose);
}

/* ── CK Responsive ── */

@media (max-width: 1280px) {
    .ck-flow,
    .ck-exhibition,
    .ck-faq {
        padding: var(--section-spacing-tablet) 60px;
    }

    .ck-cards {
        padding: 40px 60px var(--section-spacing-tablet);
    }
}

@media (max-width: 1024px) {
    /* На планшете оба ряда — одинаковые 2 колонки (разница ширин только на desktop) */
    .ck-flow__row--top,
    .ck-flow__row--bottom {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .ck-flow__row--top {
        margin-bottom: 16px;
    }

    /* Стрелки скрываются в обоих рядах — при 2 колонках карточки переносятся, логика 1→4 / 5→7 теряется */
    .ck-flow__row .ck-flow-card:not(:last-child)::after {
        display: none;
    }
}

@media (max-width: 768px) {
    .ck-cards,
    .ck-flow,
    .ck-exhibition,
    .ck-faq {
        padding-left: 24px;
        padding-right: 24px;
    }

    .ck-cards__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .ck-flow__title,
    .ck-faq__title {
        font-size: 24px;
    }

    .ck-flow__row--top,
    .ck-flow__row--bottom {
        grid-template-columns: 1fr;
    }

    .ck-exhibition__title {
        font-size: 22px;
    }

    .ck-exhibition__grid {
        grid-template-columns: 1fr;
    }

    .ck-faq-item {
        border-radius: var(--radius-pill); /* 60px — единый pill на всех breakpoint'ах */
    }

    .ck-faq-item.is-open {
        border-radius: var(--radius-md); /* 16px mobile */
    }

    .ck-faq-item__header {
        padding: var(--space-md); /* 16px all sides */
    }

    .ck-faq-item__question {
        font-size: 14px;
    }

    .ck-faq-item.is-open .ck-faq-item__answer {
        margin: 0 var(--space-md); /* 16px */
    }

    .ck-faq-item__toggle {
        width: 36px; /* совпадает с desktop — было 34px */
        height: 36px;
    }

    .ck-faq-item__answer-inner {
        padding: var(--space-md) 0; /* 16px top и bottom */
        font-size: 14px;
    }
}

/* ─── Utility: Admin warning (только для залогиненных админов) ─── */

.admin-warning {
    max-width: 1160px;
    margin: var(--space-lg) auto;
    padding: var(--space-md) var(--space-lg);
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: var(--radius-xs);
    color: #664d03;
    font-family: sans-serif;
    font-size: 14px;
    line-height: var(--line-height-normal);
}

.admin-warning a {
    color: inherit;
    text-decoration: underline;
}

.admin-warning code {
    font-family: monospace;
    background: rgba(102, 77, 3, 0.08);
    padding: 1px 4px;
    border-radius: 2px;
}

/* ─── Utility: Section Divider ─── */

.section-divider {
    width: 100%;
    height: 1px;
    background: var(--color-border-default);
    border: none;
    margin: 0;
}

/* Если разделитель касается секции с собственной заливкой — скрываем.
   Два типа цветных секций:
     - .section--bg-subtle   — серый фон (.ck-flow, .ns-program, .ns-donation, .about-partnership и т.д.)
     - .section--bg-gradient — градиент (.hero, .ns-hero, .shre-hero, .page-banner)
   Любой из этих фонов сам по себе визуально разграничивает секции — лишняя линия не нужна. */
.section--bg-subtle + .section-divider,
.section-divider:has(+ .section--bg-subtle),
.section--bg-gradient + .section-divider,
.section-divider:has(+ .section--bg-gradient) {
    display: none;
}

/* ─── Page: Styleguide ─────────────────────────── */

.page-styleguide {
    padding: 0;
    max-width: 100%;
    margin: 0;
}

.sg-section {
    padding: 48px 140px;
}

.sg-section--header {
    background: linear-gradient(62.84deg, #007d9b 9.34%, #00916e 60.52%, #ffbe14 100.36%);
    padding: 60px 140px;
}

.sg-section--gray {
    background: #e8e8e8;
}

.sg-section__inner {
    max-width: 1160px;
    margin: 0 auto;
}

.sg-page-title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 12px;
}

.sg-page-desc {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    line-height: var(--line-height-loose);
    margin: 0;
}

.sg-page-desc code {
    background: rgba(255, 255, 255, 0.15);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 14px;
}

.sg-section__title {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 32px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-border-subtle);
}

.sg-subsection__title {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 24px 0 16px;
}

/* Цвета */
.sg-color-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
}

.sg-color-swatch {
    aspect-ratio: 1;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 12px;
    text-align: center;
}

.sg-color-swatch__name {
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
}

.sg-color-swatch code {
    font-size: 11px;
    opacity: 0.8;
}

/* Градиенты */
.sg-gradient-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.sg-gradient-swatch {
    height: 80px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
}

/* Типографика */
.sg-type-sample {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.sg-type-sample__item {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sg-type-sample__label {
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-primary);
    letter-spacing: 0.5px;
}

/* Компоненты (ряд) */
.sg-component-row {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: flex-end;
}

.sg-component-cell {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
}

.sg-component-cell__label {
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-primary);
    letter-spacing: 0.5px;
}

/* Карточки grid */
.sg-cards-grid {
    display: grid;
    gap: 20px;
}

.sg-cards-grid--2 {
    grid-template-columns: repeat(2, 1fr);
}

.sg-cards-grid--3 {
    grid-template-columns: repeat(3, 1fr);
}

/* Тени */
.sg-shadow-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.sg-shadow-swatch {
    background: #ffffff;
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}

.sg-shadow-swatch span {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-primary);
}

.sg-shadow-swatch code {
    font-size: 11px;
    color: var(--color-text-primary);
}

/* Border-radius */
.sg-radius-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

.sg-radius-swatch {
    width: 80px;
    height: 80px;
    border: 1.5px solid var(--color-border-default);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: #ffffff;
}

.sg-radius-swatch code {
    font-size: 12px;
    color: var(--color-text-primary);
    font-weight: 700;
}

.sg-radius-swatch span {
    font-family: var(--font-heading);
    font-size: 10px;
    color: var(--color-text-primary);
}

/* Spacing */
.sg-spacing-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sg-spacing-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sg-spacing-bar {
    height: 20px;
    background: linear-gradient(90deg, #007d9b 0%, #00916e 100%);
    border-radius: 4px;
    min-width: 4px;
}

.sg-spacing-item code {
    font-size: 12px;
    color: var(--color-text-primary);
    min-width: 40px;
}

/* Styleguide адаптив */
@media (max-width: 1280px) {
    .sg-section {
        padding: 40px 60px;
    }
    .sg-section--header {
        padding: 48px 60px;
    }
}

@media (max-width: 768px) {
    .sg-section {
        padding: 32px 24px;
    }
    .sg-section--header {
        padding: 40px 24px;
    }
    .sg-color-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .sg-gradient-grid {
        grid-template-columns: 1fr;
    }
    .sg-shadow-grid {
        grid-template-columns: 1fr;
    }
    .sg-cards-grid--2,
    .sg-cards-grid--3 {
        grid-template-columns: 1fr;
    }
    .sg-component-row {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ─── Page: Legal (юридические документы) ──── */

.legal-page {
    background: var(--color-section-bg-primary);
    padding: var(--section-spacing-desktop) 0;
}

.legal-page__inner {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 24px;
}

.legal-page__header {
    margin-bottom: 48px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--color-border-subtle);
}

.legal-page__title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: var(--line-height-snug);
    /* margin-bottom приходит от .text-h1; 16px для внутреннего контекста legal-page__header */
    margin: 0 0 var(--heading-margin-bottom-h4) 0;
}

.legal-page__date {
    font-family: var(--font-main);
    font-size: 14px;
    color: var(--color-text-muted);
    margin: 0;
}

/* Контент из WYSIWYG — типографика для длинного текста */

.legal-page__content {
    font-family: var(--font-main);
    font-size: 16px;
    line-height: var(--line-height-loose);
    color: var(--color-text-body);
}

.legal-page__content h2 {
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 400;
    color: var(--color-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: var(--line-height-snug);
    margin: 48px 0 16px 0;
}

.legal-page__content h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 32px 0 12px 0;
}

.legal-page__content p {
    margin: 0 0 16px 0;
}

.legal-page__content ul,
.legal-page__content ol {
    margin: 0 0 16px 0;
    padding-left: 24px;
    list-style: revert;
}

.legal-page__content li {
    margin-bottom: 8px;
}

.legal-page__content a {
    color: var(--color-text-primary);
    text-decoration: underline;
}

.legal-page__content strong {
    font-weight: 700;
    color: var(--color-text-primary);
}

.legal-page__footer {
    margin-top: 64px;
    padding-top: 32px;
    border-top: 1px solid var(--color-border-subtle);
    font-size: 14px;
    color: var(--color-text-muted);
}

.legal-page__footer a {
    color: var(--color-text-primary);
    text-decoration: underline;
}

@media (max-width: 1280px) {
    .legal-page {
        padding: var(--section-spacing-tablet) 0;
    }
}

@media (max-width: 768px) {
    .legal-page {
        padding: var(--section-spacing-mobile) 0;
    }

    .legal-page__title {
        font-size: 24px;
    }

    .legal-page__content {
        font-size: 15px;
    }

    .legal-page__content h2 {
        font-size: 18px;
        margin-top: 32px;
    }
}

/* ─── Cookie Banner ────────────────────────── */

.cookie-banner {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: var(--z-modal);
    background: var(--color-section-bg-primary);
    border: 1px solid var(--color-border-muted);
    border-radius: var(--radius-md);
    box-shadow: 0 8px 32px rgba(0, 90, 120, 0.15);
    max-width: 720px;
    margin: 0 auto;
    transform: translateY(120%);
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.cookie-banner.is-visible {
    transform: translateY(0);
}

.cookie-banner__inner {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 20px 24px;
}

.cookie-banner__text {
    flex: 1;
    font-family: var(--font-main);
    font-size: 14px;
    line-height: var(--line-height-relaxed);
    color: var(--color-text-body);
    margin: 0;
}

.cookie-banner__text a {
    color: var(--color-text-primary);
    text-decoration: underline;
}

.cookie-banner__btn {
    flex-shrink: 0;
    height: 44px;
    padding: 0 24px;
    border: 1.333px solid var(--color-border-default);
    border-radius: var(--radius-pill);
    background: transparent;
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--color-text-primary);
    cursor: pointer;
    transition: background-color var(--transition), color var(--transition);
}

.cookie-banner__btn:hover {
    background: var(--color-action-primary);
    color: var(--color-text-inverse);
}

.cookie-banner__btn:focus-visible {
    outline: 2px solid var(--color-action-focus-ring);
    outline-offset: 3px;
}

@media (max-width: 768px) {
    .cookie-banner__inner {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 16px 20px;
    }

    .cookie-banner__btn {
        width: 100%;
    }
}

/* ─── Consent Checkbox ─────────────────────── */

.consent-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}

.consent-checkbox__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.consent-checkbox__box {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    border: 1.5px solid var(--color-border-default);
    border-radius: var(--radius-xs);
    background: var(--color-section-bg-primary);
    position: relative;
    transition: background-color var(--transition);
}

.consent-checkbox__input:checked + .consent-checkbox__box {
    background: var(--color-action-primary);
}

.consent-checkbox__input:checked + .consent-checkbox__box::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 1px;
    width: 5px;
    height: 10px;
    border: solid var(--color-text-inverse);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.consent-checkbox__input:focus-visible + .consent-checkbox__box {
    outline: 2px solid var(--color-action-focus-ring);
    outline-offset: 2px;
}

.consent-checkbox__text {
    font-family: var(--font-main);
    font-size: 13px;
    line-height: var(--line-height-relaxed);
    color: var(--color-text-body);
}

.consent-checkbox__text a {
    color: var(--color-text-primary);
    text-decoration: underline;
}


/* ─── GIVR widget — minimal reset isolation ──────────────────────────── */
/* Наш глобальный `* { margin:0; padding:0 }` обнуляет padding у inputs
   и кнопок внутри GIVR-виджета — поля схлопываются в 0 высоту.
   Восстанавливаем browser-defaults только для form-контролов виджета.
   Цвета, шрифт, размеры, заголовок, gradient submit задаются в кабинете
   GIVR через «Дополнительные стили» — здесь не дублируем. */

.donation-theme-widget-container input,
.donation-theme-widget-container select,
.donation-theme-widget-container textarea,
.donation-theme-widget-container button,
.donation-theme-widget-container label {
    margin: revert;
    padding: revert;
}


/* ═══════════════════════════════════════════════════════════════════════
   Page: Co-founders (/cofounders/)
   Страница «Со-основатели ЦК ШРЭ» — сетка карточек с модалкой цитаты.
   ═══════════════════════════════════════════════════════════════════════ */

.cofounders-page {
    background: var(--color-bg-primary, #ffffff);
}

/* ── Hero ─────────────────────────────────────────────────────────────── */
.cofounders-hero {
    padding: var(--space-3xl, 64px) var(--space-xl, 32px) var(--space-2xl, 48px);
    color: #ffffff;
    background: linear-gradient(139.95deg, #007d9b 0%, #00916e 50%, #ffbe14 100%);
}
.cofounders-hero__inner {
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
}
.cofounders-hero__title {
    color: #ffffff;
    margin: 0 0 var(--space-lg, 24px);
}
.cofounders-hero__subtitle {
    font-size: 18px;
    line-height: 1.5;
    max-width: 780px;
    margin: 0 auto;
    color: #ffffff;
    opacity: 0.92;
}

/* ── Партнёры ─────────────────────────────────────────────────────────── */
.cofounders-partners {
    padding: var(--space-3xl, 64px) var(--space-xl, 32px) var(--space-xl, 32px);
}
.cofounders-partners__inner {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
}
.cofounders-partners__title {
    color: var(--color-text-secondary, #6b8a96);
    margin: 0 0 var(--space-xl, 32px);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.cofounders-partners__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-2xl, 48px);
    align-items: center;
    justify-items: center;
}
.cofounders-partners__item a,
.cofounders-partners__item > div {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80px;
}
.cofounders-partners__logo {
    max-width: 220px;
    max-height: 80px;
    width: auto;
    height: auto;
    object-fit: contain;
}
.cofounders-partners__name {
    font-weight: 700;
    color: var(--color-text-primary, #005a78);
}

/* ── Сетка со-основателей ────────────────────────────────────────────── */
.cofounders-grid-section {
    padding: var(--space-2xl, 48px) var(--space-xl, 32px) var(--space-4xl, 96px);
}
.cofounders-grid-section__inner {
    max-width: 1440px;
    margin: 0 auto;
}
.cofounders-grid-section__title {
    text-align: center;
    margin: 0 0 var(--space-2xl, 48px);
}
.cofounders-grid-section__empty {
    text-align: center;
    color: var(--color-text-secondary, #6b8a96);
    padding: var(--space-2xl, 48px);
}
.cofounders-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-lg, 24px);
}

/* ── Карточка со-основателя ──────────────────────────────────────────── */
/* Без hover-эффекта на саму карточку — она не кликабельна целиком,
   интерактивна только кнопка «+» (см. .cofounder-card__quote-trigger). */
.cofounder-card {
    display: flex;
    flex-direction: column;
    background: var(--color-bg-primary, #ffffff);
    border: 1px solid var(--color-border-subtle, rgba(0, 90, 120, 0.15));
    border-radius: var(--radius-md, 16px);
    overflow: hidden;
}

/* Фото / плейсхолдер с инициалами */
.cofounder-card__photo {
    position: relative;
    margin: 0;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: linear-gradient(135deg, #007d9b, #00916e);
}
.cofounder-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cofounder-card__initials {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 56px;
    font-weight: 200;
    letter-spacing: 0.05em;
}

/* Кнопка «+» в правом нижнем углу фото */
.cofounder-card__quote-trigger {
    position: absolute;
    right: 12px;
    bottom: 12px;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-circle, 50%);
    background: #ffffff;
    color: var(--color-text-primary, #005a78);
    border: 1px solid var(--color-border-default, #005a78);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 90, 120, 0.15);
    transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
.cofounder-card__quote-trigger:hover,
.cofounder-card__quote-trigger:focus-visible {
    background: var(--color-text-primary, #005a78);
    color: #ffffff;
    transform: scale(1.05);
    outline: none;
}
.cofounder-card__quote-trigger[aria-expanded="true"] {
    background: var(--color-text-primary, #005a78);
    color: #ffffff;
    transform: rotate(45deg);
}

/* Подпись карточки */
.cofounder-card__body {
    padding: var(--space-md, 16px);
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.cofounder-card__name {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--color-text-primary, #005a78);
    margin: 0;
}
.cofounder-card__role {
    font-size: 13px;
    line-height: 1.4;
    color: var(--color-text-secondary, #6b8a96);
    margin: 0;
}
.cofounder-card__city {
    font-size: 13px;
    line-height: 1.4;
    color: var(--color-text-secondary, #6b8a96);
    margin: auto 0 0;
    padding-top: 4px;
    font-style: italic;
}

/* ── Адаптив сетки ───────────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .cofounders-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
    .cofounders-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md, 16px); }
    .cofounders-partners__grid { grid-template-columns: 1fr; gap: var(--space-xl, 32px); }
    .cofounders-hero { padding: var(--space-2xl, 48px) var(--space-md, 16px); }
    .cofounders-hero__subtitle { font-size: 16px; }
}
@media (max-width: 480px) {
    .cofounders-grid { grid-template-columns: 1fr; }
    .cofounder-card__name { font-size: 16px; }
    .cofounder-card__initials { font-size: 44px; }
}

/* ── CTA-блок ────────────────────────────────────────────────────────── */
.cofounders-cta {
    padding: var(--space-3xl, 64px) var(--space-xl, 32px) var(--space-4xl, 96px);
    background: var(--color-bg-secondary, #f6f9fb);
}
.cofounders-cta__inner {
    max-width: 1200px;
    margin: 0 auto;
}
.cofounders-cta__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2xl, 48px);
    align-items: start;
}
.cofounders-cta__block {
    text-align: center;
    background: #ffffff;
    border: 1px solid var(--color-border-subtle, rgba(0, 90, 120, 0.15));
    border-radius: var(--radius-md, 16px);
    padding: var(--space-2xl, 48px) var(--space-xl, 32px);
}
.cofounders-cta__text {
    font-size: 18px;
    line-height: 1.5;
    color: var(--color-text-primary, #005a78);
    margin: 0 0 var(--space-lg, 24px);
}
.cofounders-cta__btn {
    display: inline-flex;
    min-width: 220px;
    justify-content: center;
}
@media (max-width: 768px) {
    .cofounders-cta__row { grid-template-columns: 1fr; }
    .cofounders-cta { padding: var(--space-2xl, 48px) var(--space-md, 16px); }
}

/* ── Модальное окно цитаты ───────────────────────────────────────────── */
.cofounder-modal {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal, 1000);
    display: none;
    align-items: center;
    justify-content: center;
    padding: var(--space-md, 16px);
}
.cofounder-modal[aria-hidden="false"] {
    display: flex;
}
.cofounder-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 60, 82, 0.7);
    cursor: pointer;
}
.cofounder-modal__dialog {
    position: relative;
    background: #ffffff;
    border-radius: var(--radius-lg, 20px);
    padding: var(--space-2xl, 48px) var(--space-xl, 32px) var(--space-xl, 32px);
    max-width: 560px;
    width: 100%;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 60, 82, 0.25);
    animation: cofounder-modal-in 0.18s ease;
}
@keyframes cofounder-modal-in {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0)   scale(1);    }
}
.cofounder-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-circle, 50%);
    border: 1px solid var(--color-border-subtle, rgba(0, 90, 120, 0.15));
    background: transparent;
    color: var(--color-text-primary, #005a78);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.cofounder-modal__close:hover,
.cofounder-modal__close:focus-visible {
    background: var(--color-text-primary, #005a78);
    color: #ffffff;
    outline: none;
}
.cofounder-modal__author {
    font-size: 21px;
    font-weight: 700;
    color: var(--color-text-primary, #005a78);
    margin: 0 0 var(--space-md, 16px);
    padding-right: 40px;
}
.cofounder-modal__body {
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-text-primary, #005a78);
}
.cofounder-modal__body p { margin: 0 0 var(--space-md, 16px); }
.cofounder-modal__body p:last-child { margin: 0; }

/* Блокировка фонового скролла при открытой модалке (класс на body) */
body.cofounder-modal-open {
    overflow: hidden;
}