/* =========================================================
   Home page styles — Наш Игропром
   Дизайн вдохновлён kri.dev: крупные «бренд-блоки», скруглённые
   карточки 16px, оранжевый акцент, читаемый светлый/тёмный режим.

   ВАЖНО: в этом файле используется ТОЛЬКО flexbox — никакого CSS Grid.
   ========================================================= */

/* ---------- Theme tokens ---------- */
:root[data-theme="light"] {
    --igp-bg:            #f6f6f6;
    --igp-surface:       #ffffff;
    --igp-surface-alt:   #ededed;
    --igp-text:          #272727;
    --igp-text-muted:    #6b6b6b;
    --igp-border:        #e4e4e4;
    --igp-accent:        #d32029;
    --igp-accent-hover:  #b3171f;
    --igp-secondary:     #f39852;
    --igp-on-accent:     #ffffff;
    --igp-shadow:        0 6px 24px rgba(0, 0, 0, 0.06);
    --igp-header-bg:     rgba(255, 255, 255, 0.95);
    --igp-header-border: #ececec;

    /* Доп. токены для токенизации legacy-CSS (см. spec 2026-06-07) */
    --igp-shadow-color:  rgba(0, 0, 0, 0.1);
    --igp-shadow-strong: 0 4px 15px rgba(0, 0, 0, 0.1);
    --igp-overlay:       #dcdcdc;
    --igp-overlay-soft:  rgba(0, 0, 0, 0.05);
    --igp-success:       #2ecc71;
    --igp-muted-btn:     #a19f9f;
    --igp-input-bg:      #ffffff;

    /* Ошибки валидации (ACF-форма add-game) */
    --igp-error:         #d32029;
    --igp-error-text:    #b3171f;
    --igp-error-bg:      #ffe6e6;
    --igp-error-border:  #f0a9ac;
}

:root[data-theme="dark"] {
    --igp-bg:            #181818;
    --igp-surface:       #232323;
    --igp-surface-alt:   #2c2c2c;
    --igp-text:          #f3f3f3;
    --igp-text-muted:    #b1b1b1;
    --igp-border:        #353535;
    --igp-accent:        #ff4a52;
    --igp-accent-hover:  #ff6a72;
    --igp-secondary:     #f39852;
    --igp-on-accent:     #ffffff;
    --igp-shadow:        0 6px 24px rgba(0, 0, 0, 0.45);
    --igp-header-bg:     rgba(24, 24, 24, 0.95);
    --igp-header-border: #2b2b2b;

    /* Доп. токены для токенизации legacy-CSS (см. spec 2026-06-07) */
    --igp-shadow-color:  rgba(0, 0, 0, 0.5);
    --igp-shadow-strong: 0 4px 15px rgba(0, 0, 0, 0.5);
    --igp-overlay:       #2c2c2c;
    --igp-overlay-soft:  rgba(255, 255, 255, 0.06);
    --igp-success:       #2ecc71;
    --igp-muted-btn:     #5a5a5a;
    --igp-input-bg:      #2a2a2a;

    /* Ошибки валидации (ACF-форма add-game): читаемый красный на тёмном фоне */
    --igp-error:         #ff5a60;
    --igp-error-text:    #ff9ea2;
    --igp-error-bg:      rgba(255, 74, 82, 0.12);
    --igp-error-border:  #ff5a60;
}

/* ---------- Reset within home only ---------- */
.home-main,
.home-header,
.home-header__mobile {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--igp-text);
    -webkit-font-smoothing: antialiased;
    box-sizing: border-box;
}

.home-main *,
.home-main *::before,
.home-main *::after,
.home-header *,
.home-header *::before,
.home-header *::after {
    box-sizing: border-box;
}

body:has(.home-main) {
    background: var(--igp-bg);
}

/* На светлой теме страницы белый bg — на главной задаём свой. */
body.home {
    background: var(--igp-bg) !important;
    /* style.css темы добавляет 106px padding-top под старый ndg-header,
       у нас свой sticky-header — сбрасываем. */
    padding-top: 0 !important;
}

/* Скрыть старую шапку только на главной, она нам не нужна. */
body.home > .ndg-header { display: none !important; }

/* ---------- Layout container ---------- */
.home-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 24px;
}

.home-section {
    padding: 72px 0;
}

/* =========================================================
   Заголовки — единая шкала
   Шрифт Molot (есть только weight 400), но визуально жирный.
   Запрашиваем weight 600 — браузер возьмёт ближайший доступный.
   H0  hero               clamp(64px,14vw,200px)
   H1  section title      clamp(32px,4.4vw,56px)
   H2  hero subtitle      clamp(24px,2.6vw,36px)
   H3  card / FAQ         clamp(18px,1.4vw,20px)
   ========================================================= */

/* Заголовки разделов — Molot. Заголовки внутри карточек и FAQ-вопросы —
   Inter (Molot не читается на мелком тексте, превращается в кашу). */
.home-section__title,
.home-festival__title,
.home-hero__title,
.home-nominations__title {
    font-family: 'Molot', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 500;
}
.home-faq__question {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
}

.home-section__title,
.home-festival__title {
    font-size: clamp(32px, 4.4vw, 56px);
    line-height: 1.05;
    letter-spacing: -0.01em;
    text-align: center;
    margin: 0 0 24px;
    color: var(--igp-text);
    text-transform: uppercase;
}

.home-section__title--left { text-align: left; }

/* H3 — карточки и FAQ */
.home-stages__step-title,
.home-stages__vtitle,
.home-stages__gtitle,
.home-faq__question {
    font-size: clamp(18px, 1.4vw, 20px);
    line-height: 1.3;
    color: var(--igp-text);
}

/* ---------- Buttons ----------
   Единый стиль для всех CTA на главной: фирменный красный --igp-accent.
   Модификатор --primary оставлен ради backward-совместимости, но даёт
   тот же результат, что и базовый .home-btn — никаких разных «оранжевых»
   и хардкод-цветов больше нет.

   Структура: пилюля (radius 999), фирменный фон, мягкая «летающая» тень
   акцентом, стрелка → справа от текста через ::after, плавный подъём
   при hover + углубление тени + сдвиг стрелки. */
.home-btn,
.home-btn--primary,
.home-btn--accent {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 28px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.01em;
    text-decoration: none;
    border: 0;
    cursor: pointer;
    background: var(--igp-accent);
    color: var(--igp-on-accent);
    box-shadow:
        0 8px 20px color-mix(in srgb, var(--igp-accent) 30%, transparent),
        0 1px 0 rgba(255,255,255,0.15) inset;
    transition:
        transform .25s cubic-bezier(.2, .8, .2, 1),
        background .2s ease,
        box-shadow .25s ease;
    overflow: hidden;
    isolation: isolate;
}

/* Лёгкая «sheen» подсветка, проходящая по кнопке при hover. */
.home-btn::before,
.home-btn--primary::before,
.home-btn--accent::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        110deg,
        transparent 0%,
        rgba(255,255,255,0.18) 50%,
        transparent 100%
    );
    transform: translateX(-100%);
    transition: transform .6s ease;
    pointer-events: none;
    z-index: -1;
}

.home-btn:hover,
.home-btn--primary:hover,
.home-btn--accent:hover {
    background: var(--igp-accent-hover);
    color: var(--igp-on-accent);
    transform: translateY(-2px);
    box-shadow:
        0 14px 32px color-mix(in srgb, var(--igp-accent) 40%, transparent),
        0 1px 0 rgba(255,255,255,0.15) inset;
}
.home-btn:hover::before,
.home-btn--primary:hover::before,
.home-btn--accent:hover::before {
    transform: translateX(100%);
}

.home-btn:active,
.home-btn--primary:active,
.home-btn--accent:active {
    transform: translateY(0);
    box-shadow:
        0 4px 12px color-mix(in srgb, var(--igp-accent) 30%, transparent),
        0 1px 0 rgba(255,255,255,0.15) inset;
}

/* ---------- Cards ---------- */
.home-card {
    background: var(--igp-surface);
    border: 1px solid var(--igp-border);
    border-radius: 24px;
    padding: 32px;
    box-shadow: var(--igp-shadow);
}

/* =========================================================
   Header
   ========================================================= */
/* Sticky header. Фиксируется на верх viewport при скролле; класс
   is-scrolled добавляется JS при scrollY > 8 и углубляет тень. */
.home-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--igp-header-bg);
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid transparent;
    transition: border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.home-header.is-scrolled {
    border-bottom-color: var(--igp-header-border);
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}

.home-header__inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 14px 24px;
    display: flex;
    align-items: center;
    gap: 24px;
}

.home-header__logo {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    color: var(--igp-text); /* подпись «НАШ» через currentColor */
    text-decoration: none;
}
.home-header__logo-svg {
    height: 44px;
    width: auto;
    display: block;
}

/* Навигация по центру: margin: 0 auto в flex-контейнере раздаёт
   свободное пространство поровну слева (от логотипа) и справа (до actions).
   Логотип и actions имеют фиксированную ширину — nav встаёт ровно по центру. */
.home-header__nav { margin: 0 auto; }
.home-header__menu {
    display: flex;
    align-items: center;
    gap: 28px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.home-header__menu-item a {
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--igp-text);
    text-decoration: none;
    padding: 8px 0;
    border-bottom: 2px solid transparent;
    transition: color .2s ease, border-color .2s ease;
}
.home-header__menu-item a:hover {
    color: var(--igp-accent);
    border-bottom-color: var(--igp-accent);
}

/* ---------- Desktop submenu (dropdown) ---------- */
.home-header__menu-item--has-submenu {
    position: relative;
}
.home-header__submenu-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--igp-text);
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    padding: 8px 0;
    margin: 0;
    cursor: pointer;
    transition: color .2s ease, border-color .2s ease;
}
.home-header__submenu-toggle:hover,
.home-header__submenu-toggle[aria-expanded="true"] {
    color: var(--igp-accent);
    border-bottom-color: var(--igp-accent);
}
.home-header__submenu-caret {
    transition: transform .2s ease;
    flex-shrink: 0;
}
.home-header__submenu-toggle[aria-expanded="true"] .home-header__submenu-caret {
    transform: rotate(180deg);
}

.home-header__submenu {
    position: absolute;
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(-6px);
    min-width: 200px;
    margin: 0;
    padding: 8px;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #ffffff;
    border: 1px solid var(--igp-border);
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 100;
}
/* admin-theme.css перебивает background всех ul в тёмной теме через
   `html body.admin-theme-dark ul { background-color: transparent !important }`.
   Наш submenu — ul, поэтому добивает специфичность + !important. */
html body.admin-theme-dark .home-header__submenu,
:root[data-theme="dark"] .home-header__submenu {
    background-color: #232323 !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6);
}
html body.admin-theme-light .home-header__submenu {
    background-color: #ffffff !important;
}
.home-header__menu-item--has-submenu:hover .home-header__submenu,
.home-header__submenu-toggle[aria-expanded="true"] + .home-header__submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
/* Невидимый «мост» между кнопкой и поппапом — чтобы курсор не «проваливался»
   в gap и dropdown не закрывался при движении мыши вниз. */
.home-header__menu-item--has-submenu::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 10px;
}
.home-header__submenu-item a {
    display: block;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    color: var(--igp-text);
    text-decoration: none;
    border-bottom: 0;
    border-radius: 8px;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease;
}
.home-header__submenu-item a:hover {
    background: var(--igp-surface-alt);
    color: var(--igp-accent);
    border-bottom: 0;
}

.home-header__actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-header__cta { padding: 12px 22px; font-size: 14px; }

/* Theme toggle */
.home-theme-toggle {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid var(--igp-border);
    background: var(--igp-surface);
    color: var(--igp-text);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: background .2s ease, border-color .2s ease;
}
.home-theme-toggle:hover { border-color: var(--igp-accent); }
.home-theme-toggle__icon {
    position: absolute;
    inset: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: opacity .2s ease, transform .3s ease;
}
[data-theme="light"] .home-theme-toggle__icon--sun { opacity: 1; transform: rotate(0); }
[data-theme="light"] .home-theme-toggle__icon--moon { opacity: 0; transform: rotate(-90deg); }
[data-theme="dark"]  .home-theme-toggle__icon--sun { opacity: 0; transform: rotate(90deg); }
[data-theme="dark"]  .home-theme-toggle__icon--moon { opacity: 1; transform: rotate(0); }

/* Burger */
.home-header__burger {
    display: none;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid var(--igp-border);
    background: var(--igp-surface);
    color: var(--igp-text);
    cursor: pointer;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0;
}
.home-header__burger span {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--igp-text);
    border-radius: 2px;
}

/* Mobile menu (overlay) */
.home-header__mobile {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: var(--igp-bg);
    padding: 80px 24px 24px;
    overflow-y: auto;
}
.home-header__mobile-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.home-header__mobile-menu a {
    display: block;
    padding: 16px 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--igp-text);
    text-decoration: none;
    border-bottom: 1px solid var(--igp-border);
}

/* ---------- Mobile submenu (accordion) ---------- */
.home-header__mobile-menu-item--has-submenu {
    border-bottom: 1px solid var(--igp-border);
}
.home-header__mobile-submenu-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 16px 0;
    font-family: inherit;
    font-size: 20px;
    font-weight: 700;
    color: var(--igp-text);
    background: transparent;
    border: 0;
    margin: 0;
    text-align: left;
    cursor: pointer;
}
.home-header__mobile-submenu-toggle .home-header__submenu-caret {
    transition: transform .2s ease;
}
.home-header__mobile-submenu-toggle[aria-expanded="true"] .home-header__submenu-caret {
    transform: rotate(180deg);
}
.home-header__mobile-submenu {
    list-style: none;
    margin: 0;
    padding: 0 0 0 16px;
    max-height: 0;
    overflow: hidden;
    transition: max-height .25s ease;
}
.home-header__mobile-submenu-toggle[aria-expanded="true"] + .home-header__mobile-submenu {
    max-height: 600px;
}
.home-header__mobile-submenu a {
    display: block;
    padding: 12px 0;
    font-size: 16px;
    font-weight: 500;
    color: var(--igp-text);
    text-decoration: none;
    border-bottom: 0;
}
.home-header__mobile-submenu a:hover {
    color: var(--igp-accent);
}
.home-header__mobile-submenu li:last-child a {
    padding-bottom: 16px;
}

.home-header__mobile-cta {
    display: inline-flex;
    margin-top: 24px;
    width: 100%;
}
body.home-mobile-open { overflow: hidden; }

/* =========================================================
   Кнопка «Наверх» — fixed справа снизу, показывается JS
   после 1000px скролла и прячется когда виден футер.
   ========================================================= */
.home-to-top {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 55;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 0;
    background: var(--igp-accent);
    color: var(--igp-on-accent);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        0 8px 20px color-mix(in srgb, var(--igp-accent) 35%, transparent),
        0 1px 0 rgba(255,255,255,0.15) inset;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .25s ease, transform .25s ease, background .2s ease, box-shadow .25s ease;
}
.home-to-top[hidden] { display: none; }
.home-to-top.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.home-to-top:hover {
    background: var(--igp-accent-hover);
    box-shadow:
        0 14px 28px color-mix(in srgb, var(--igp-accent) 45%, transparent),
        0 1px 0 rgba(255,255,255,0.15) inset;
}
.home-to-top:active { transform: translateY(2px); }

@media (max-width: 560px) {
    .home-to-top { right: 16px; bottom: 16px; width: 44px; height: 44px; }
}

/* =========================================================
   Hero
   ========================================================= */
.home-hero {
    position: relative;
    /* финальные размеры/паддинги задаются в site.css */
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.home-hero > .home-container {
    width: 100%;
}
.home-hero__inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 24px;
}
.home-hero__title {
    margin: 0;
    font-size: clamp(64px, 14vw, 200px);
    line-height: 0.9;
    font-weight: 500;
    letter-spacing: -0.04em;
    color: var(--igp-text);
    text-transform: uppercase;
    text-align: center;
}

/* Каждое слово — на своей строке: НАШ \n ИГРОПРОМ */
.home-hero__word {
    display: block;
    white-space: nowrap;
    /* font-size: 0 убивает остаточные пробелы между inline-block
       детьми, если они вдруг появятся (паранойя — мы их и так не пишем). */
    font-size: 0;
}
.home-hero__word .home-hero__char {
    font-size: clamp(64px, 14vw, 200px);
}

/* Буквы — inline без зазоров. Чтобы transform не «дышал» соседними
   буквами, используем margin: 0 и не накладываем box. */
.home-hero__char {
    display: inline-block;
    position: relative;
    margin: 0;
    will-change: transform, text-shadow, color, filter;
    animation: hero-glitch 20s steps(1, end) infinite;
    animation-delay: var(--char-delay, 0s);
}

/* Глитч: чаще и заметнее. Каждые 5 секунд буква проходит цикл,
   в котором её цвет/смещение моргают как у битого CRT-монитора. */
@keyframes hero-glitch {
    0%, 100% {
        transform: translate(0, 0);
        text-shadow: none;
        color: var(--igp-text);
        filter: none;
    }
    /* короткий «треск» RGB-split — только красный */
    4% {
        transform: translate(-3px, 0);
        text-shadow:
            4px 0 0 var(--igp-accent),
            -4px 0 0 rgba(211, 32, 41, 0.6);
    }
    5% {
        transform: translate(3px, 1px);
        text-shadow:
            -4px 0 0 var(--igp-accent),
            4px 0 0 rgba(211, 32, 41, 0.6);
    }
    6% {
        transform: translate(0, -2px);
        text-shadow:
            3px 1px 0 var(--igp-accent),
            -3px -1px 0 rgba(211, 32, 41, 0.6);
    }
    7% {
        transform: translate(0, 0);
        text-shadow: none;
    }
    /* покой */
    25% {
        transform: translate(0, 0);
        text-shadow: none;
        color: var(--igp-text);
    }
    /* короткий «треск» без перекраски буквы */
    26% {
        transform: translate(2px, -2px);
        text-shadow:
            3px 0 0 var(--igp-accent),
            -3px 0 0 rgba(211, 32, 41, 0.6);
    }
    28% {
        transform: translate(0, 0);
        text-shadow: none;
    }
    /* покой */
    55% {
        transform: translate(0, 0);
        text-shadow: none;
        color: var(--igp-text);
    }
    /* ещё треск — без смены цвета буквы */
    56% {
        transform: translate(-2px, 0);
        text-shadow:
            3px 0 0 var(--igp-accent),
            -3px 0 0 rgba(211, 32, 41, 0.6);
    }
    58% {
        transform: translate(0, 0);
        text-shadow: none;
    }
    /* финальный треск перед циклом */
    78% {
        transform: translate(2px, 0);
        text-shadow:
            -3px 0 0 var(--igp-accent),
            3px 0 0 rgba(211, 32, 41, 0.6);
    }
    79% {
        transform: translate(-2px, 1px);
        text-shadow:
            3px 0 0 var(--igp-accent),
            -3px 0 0 rgba(211, 32, 41, 0.6);
    }
    80% {
        transform: translate(0, 0);
        text-shadow: none;
    }
}

/* На узких экранах разрешаем перенос — иначе заголовок выползет. */
@media (max-width: 720px) {
    .home-hero__title { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
    .home-hero__char { animation: none; }
}

/* Подзаголовок: текст в одну строку с декоративными «усами»-линиями
   по бокам. Премиальная подача — без агрессивного фона-плашки. */
.home-hero__subtitle {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    line-height: 1.3;
    max-width: 100%;
}
.home-hero__subtitle-text {
    font-size: clamp(14px, 1.4vw, 18px);
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--igp-text-muted);
    white-space: nowrap;
}
.home-hero__subtitle-line {
    flex: 0 1 80px;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent 0,
        var(--igp-border) 100%
    );
}
.home-hero__subtitle-line:last-child {
    background: linear-gradient(
        90deg,
        var(--igp-border) 0,
        transparent 100%
    );
}

/* На узких экранах: линии скрываются, текст разрешает перенос. */
@media (max-width: 720px) {
    .home-hero__subtitle-line { display: none; }
    .home-hero__subtitle-text {
        white-space: normal;
        text-align: center;
        letter-spacing: 0.02em;
    }
}
.home-hero__actions { margin-top: 12px; }
.home-hero__lead {
    margin: 8px 0 0;
    font-size: 16px;
    color: var(--igp-text-muted);
    font-style: italic;
}

/* =========================================================
   Participants — flex row, 3 равные карточки
   ========================================================= */
.home-participants__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}
.home-participants__card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    gap: 14px;
    flex: 1 1 280px;
}
.home-participants__icon {
    width: 28px;
    height: 28px;
    border-radius: 0;
    background: transparent;
    border: 0;
    color: var(--igp-accent);
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
}
:root[data-theme="dark"] .home-participants__icon {
    color: var(--igp-text);
}
.home-participants__icon img,
.home-participants__icon svg { width: 28px; height: 28px; object-fit: contain; }
.home-participants__icon-fallback {
    display: inline-block;
    width: 14px; height: 14px;
    border-radius: 50%;
    background: var(--igp-accent);
}
.home-participants__text {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    color: var(--igp-text);
    text-align: left;
}

/* =========================================================
   Stages — общая шапка секции
   ========================================================= */
.home-stages {
    background: var(--igp-surface);
}
.home-stages__header {
    max-width: 900px;
    margin: 0 0 48px;
}
.home-stages__intro {
    margin: 0;
    font-size: 18px;
    font-weight: 500;
    color: var(--igp-text-muted);
    line-height: 1.4;
}

/* Демо-режим: показываем 3 варианта подряд — общий контейнер
   и тонкая плашка с лейблом «Вариант N» сверху каждого. */
.home-stages-demo > .home-stages + .home-stages { margin-top: 8px; }
.home-stages__demo-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--igp-accent);
    color: var(--igp-on-accent);
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 24px;
}

/* =========================================================
   Stages: timeline_horizontal — flex row из 5 шагов
   ========================================================= */
.home-stages--timeline_horizontal .home-stages__timeline {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    position: relative;
    padding-top: 24px;
}

.home-stages--timeline_horizontal .home-stages__timeline::before {
    content: "";
    position: absolute;
    top: 50px;
    left: 10%; right: 10%;
    height: 2px;
    background: var(--igp-border);
    z-index: 0;
}

.home-stages--timeline_horizontal .home-stages__step {
    flex: 1 1 0;
    min-width: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 12px;
    z-index: 1;
}
.home-stages__step-marker {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--igp-bg);
    border: 2px solid var(--igp-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: var(--igp-text);
    transition: background .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.home-stages__step--past .home-stages__step-marker {
    background: var(--igp-accent);
    border-color: var(--igp-accent);
    color: var(--igp-on-accent);
}
.home-stages__step--current .home-stages__step-marker {
    background: var(--igp-accent);
    border-color: var(--igp-accent);
    color: var(--igp-on-accent);
    transform: scale(1.1);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--igp-accent) 18%, transparent);
}
.home-stages__step-num { font-size: 18px; line-height: 1; }

.home-stages__step-body { margin-top: 16px; }
.home-stages__step-title {
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 700;
    color: var(--igp-text);
    line-height: 1.3;
}
.home-stages__step-dates {
    margin: 0 0 8px;
    font-size: 13px;
    color: var(--igp-accent);
    font-weight: 500;
    letter-spacing: 0.02em;
}
.home-stages__step-desc {
    margin: 0;
    font-size: 13px;
    color: var(--igp-text-muted);
    line-height: 1.45;
}

/* =========================================================
   Stages: timeline_vertical — flex column из шагов
   ========================================================= */
.home-stages--timeline_vertical .home-stages__vlist {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    max-width: 760px;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.home-stages--timeline_vertical .home-stages__vlist::before {
    content: "";
    position: absolute;
    left: 23px; top: 12px; bottom: 12px;
    width: 2px;
    background: var(--igp-border);
}
.home-stages__vitem {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 20px;
    padding: 0 0 24px;
}
.home-stages__vitem:last-child { padding-bottom: 0; }

.home-stages__vdot {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--igp-bg);
    border: 2px solid var(--igp-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--igp-text);
    position: relative;
    z-index: 1;
    transition: background .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease;
}
.home-stages__vitem--past .home-stages__vdot,
.home-stages__vitem--current .home-stages__vdot {
    background: var(--igp-accent);
    border-color: var(--igp-accent);
    color: var(--igp-on-accent);
}
.home-stages__vitem--current .home-stages__vdot {
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--igp-accent) 18%, transparent);
}

.home-stages__vcard {
    flex: 1 1 auto;
    min-width: 0;
    background: var(--igp-bg);
    border: 1px solid var(--igp-border);
    border-radius: 18px;
    padding: 18px 22px;
}
.home-stages__vitem--current .home-stages__vcard {
    border-color: var(--igp-accent);
    box-shadow: 0 6px 20px color-mix(in srgb, var(--igp-accent) 15%, transparent);
}
.home-stages__vhead {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.home-stages__vtitle {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: var(--igp-text);
}
.home-stages__vdates {
    font-size: 13px;
    color: var(--igp-accent);
    font-weight: 500;
    letter-spacing: 0.02em;
    white-space: nowrap;
}
.home-stages__vdesc {
    margin: 0;
    font-size: 14px;
    color: var(--igp-text-muted);
    line-height: 1.5;
}

/* =========================================================
   Stages: grid (карточки 3-в-ряд через flex-wrap)
   ========================================================= */
.home-stages--grid .home-stages__grid-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.home-stages__gcard {
    flex: 1 1 280px;
    background: var(--igp-bg);
    border: 1px solid var(--igp-border);
    border-radius: 20px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.home-stages__gcard--past { opacity: 0.75; }
.home-stages__gcard--current {
    border-color: var(--igp-accent);
    box-shadow: 0 6px 20px color-mix(in srgb, var(--igp-accent) 15%, transparent);
}
.home-stages__gnum {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--igp-text-muted);
}
.home-stages__gcard--current .home-stages__gnum,
.home-stages__gcard--past .home-stages__gnum { color: var(--igp-accent); }

.home-stages__gdates {
    font-size: 22px;
    font-weight: 800;
    color: var(--igp-text);
    line-height: 1.1;
    letter-spacing: -0.01em;
}
.home-stages__gtitle {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--igp-text);
}
.home-stages__gdesc {
    margin: 4px 0 0;
    font-size: 14px;
    color: var(--igp-text-muted);
    line-height: 1.5;
}

/* =========================================================
   Stages: outline_cards — большие цифры 01-05, статусы,
   красная заливка для текущего, progress-bar внизу
   ========================================================= */
.home-stages-ocards {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.home-stages-ocards__row {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.home-stages-ocard {
    flex: 1 1 180px;
    background: var(--igp-surface);
    border: 1px solid var(--igp-border);
    border-radius: 16px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    transition: border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
}
/* Сетка строк внутри карточки — у всех карточек блоки на одной высоте.
   Каждая строка имеет фикс. min-height, а .home-stages-ocard — flex-column,
   так что верхние границы head → dates → title → desc у всех совпадают. */
.home-stages-ocard__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    min-height: clamp(70px, 7vw, 96px);
    flex: 0 0 auto;
}
.home-stages-ocard__num {
    font-size: clamp(64px, 7vw, 96px);
    font-weight: 900;
    line-height: 0.9;
    color: var(--igp-text);
    letter-spacing: -0.03em;
    font-feature-settings: "tnum";
    transition: color .2s ease, opacity .2s ease;
}
/* Компактный круглый badge-иконка в углу карточки этапа.
   Текст состояния — в title/aria-label, в DOM только иконка. */
.home-stages-ocard__badge {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--igp-surface);
    color: var(--igp-text);
    border: 1px solid var(--igp-border);
    cursor: help;
    position: relative;
}
.home-stages-ocard__badge--current {
    background: var(--igp-accent);
    border-color: var(--igp-accent);
    color: #fff;
}
.home-stages-ocard__badge--final {
    background: var(--igp-accent);
    color: #fff;
    border-color: var(--igp-accent);
}
.home-stages-ocard__pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    animation: ocard-live-pulse 1.4s ease-in-out infinite;
}
@keyframes ocard-live-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.4; transform: scale(0.7); }
}

/* Блок дат: фикс. min-height + padding-top, без margin-top:auto, чтобы
   верхняя граница совпадала у всех карточек (а не уезжала вниз при
   отсутствии описания). */
.home-stages-ocard__dates {
    padding-top: 28px;
    font-size: 13px;
    font-weight: 500;
    color: var(--igp-text-muted);
    letter-spacing: 0.02em;
    min-height: 41px;
    box-sizing: border-box;
    flex: 0 0 auto;
}
/* Заголовок: фикс высота под 2 строки, чтобы описание у всех
   началось на одной горизонтальной линии. */
.home-stages-ocard__title {
    margin: 8px 0 0;
    font-size: clamp(15px, 1.2vw, 17px);
    font-weight: 800;
    text-transform: uppercase;
    color: var(--igp-text);
    line-height: 1.2;
    letter-spacing: -0.005em;
    display: flex;
    align-items: flex-start;
    flex: 0 0 auto;
}
.home-stages-ocard__desc {
    margin: 12px 0 0;
    font-size: 12px;
    color: var(--igp-text-muted);
    line-height: 1.45;
    min-height: calc(3 * 1.45em);
    flex: 1 1 auto;
}

/* Состояния. Цвет — только чёрный/красный/muted, ничего больше. */
.home-stages-ocard--past { opacity: 0.55; }

/* Future — обычная карточка, без выделения. */

.home-stages-ocard--current {
    background: var(--igp-surface);
    border-color: var(--igp-accent);
    box-shadow: 0 12px 32px color-mix(in srgb, var(--igp-accent) 18%, transparent);
    transform: translateY(-4px);
}
/* Двойная рамка для акцента — без заливки. */
.home-stages-ocard--current { box-shadow:
    0 0 0 1px var(--igp-accent) inset,
    0 12px 32px color-mix(in srgb, var(--igp-accent) 18%, transparent);
}
.home-stages-ocard--current .home-stages-ocard__num { color: var(--igp-accent); }
.home-stages-ocard--current .home-stages-ocard__dates { color: var(--igp-accent); }
.home-stages-ocard--current .home-stages-ocard__title { color: var(--igp-text); }
.home-stages-ocard--current .home-stages-ocard__desc { color: var(--igp-text-muted); }

/* Footer-progress */
.home-stages-ocards__footer {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--igp-text-muted);
}
.home-stages-ocards__bar {
    flex: 1 1 auto;
    height: 8px;
    border-radius: 4px;
    background: var(--igp-border);
    position: relative;
    overflow: hidden;
}
.home-stages-ocards__bar-fill {
    display: block;
    height: 100%;
    background: var(--igp-accent);
    transition: width .6s ease;
}
.home-stages-ocards__progress-value { white-space: nowrap; }

@media (max-width: 860px) {
    .home-stages-ocard { flex: 1 1 240px; min-height: auto; }
    .home-stages-ocard__num { font-size: 64px; }
}

/* На мобилке карточки идут в столбик — выравнивать в ряд нечего,
   поэтому снимаем все min-height и сжимаем отступы, чтобы убрать
   пустоту между цифрой → датой → заголовком → описанием. */
@media (max-width: 600px) {
    .home-stages-ocard {
        padding: 16px;
        flex: 1 1 100%;
    }
    .home-stages-ocard__head {
        min-height: 0;
    }
    .home-stages-ocard__num {
        font-size: 56px;
        line-height: 1;
    }
    .home-stages-ocard__dates {
        padding-top: 12px;
        min-height: 0;
    }
    .home-stages-ocard__title {
        margin-top: 4px;
        min-height: 0;
    }
    .home-stages-ocard__desc {
        margin-top: 8px;
        min-height: 0;
    }
    .home-stages-ocard--current {
        transform: none;
    }
}

/* =========================================================
   Nominations — стопка карточек слева + текст и чипы справа
   ========================================================= */
.home-nominations__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 48px;
}

/* --- Левая колонка: стопка из двух карточек --- */
.home-nominations__visual {
    flex: 1 1 380px;
    min-width: 0;
}
.home-nominations__stack {
    position: relative;
    aspect-ratio: 1 / 1;
}
.home-nominations__card {
    position: absolute;
    background: var(--igp-surface);
    border: 1px solid var(--igp-border);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    /* Анимируем только GPU-friendly свойства, плюс opacity/filter.
       НЕ анимируем top/left — это вызывает reflow и дёрганье. */
    transition:
        transform .9s cubic-bezier(.2, .8, .2, 1),
        opacity .7s ease,
        filter .9s ease;
    will-change: transform, opacity, filter;
}

/* Базовое позиционирование задней карточки — там, где она лежит после reveal.
   До reveal сдвигаем её через transform туда же, где передняя (имитация «копии»). */
.home-nominations__card--back {
    width: 55%;
    aspect-ratio: 3 / 4;
    top: 18%;
    left: 14%;
    background: var(--igp-bg);
    border-color: var(--igp-border);
    z-index: 1;
    transform-origin: 80% 50%;
    /* Сдвиг + поворот, чтобы визуально совпасть с передней (rotate 0). */
    transform: translate(28%, -10%) rotate(10deg);
    opacity: 0;
    filter: blur(0) saturate(1.1);
}
.home-nominations__stack.is-revealed .home-nominations__card--back {
    transform: translate(0, 0) rotate(-6deg);
    opacity: 0.55;
    filter: blur(8px) saturate(1.1);
}
.home-nominations__card--back img {
    /* Лёгкое зеркало по вертикали — задняя картинка как «отражение». */
    transform: scaleY(-1);
}

/* Передняя: стартует ровно (rotate 0), после reveal — слегка отклоняется. */
.home-nominations__card--front {
    width: 60%;
    aspect-ratio: 3 / 4;
    top: 14%;
    left: 28%;
    transform: rotate(0deg);
    z-index: 2;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
    transform-origin: 20% 50%;
}
.home-nominations__stack.is-revealed .home-nominations__card--front {
    transform: rotate(4deg);
}

@media (prefers-reduced-motion: reduce) {
    .home-nominations__card { transition: none; }
}
.home-nominations__card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.home-nominations__trophy {
    width: 60%;
    height: 60%;
}

/* --- Правая колонка: kicker / title / text / chips / CTA --- */
.home-nominations__content {
    flex: 1 1 380px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.home-nominations__kicker {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--igp-text-muted);
}
.home-nominations__title {
    margin: 0;
    font-size: clamp(40px, 5.4vw, 76px);
    line-height: 0.95;
    font-weight: 500;
    letter-spacing: -0.025em;
    color: var(--igp-text);
    /* НЕ uppercase — по референсу заголовок mixed-case */
    text-transform: none;
}
.home-nominations__text {
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: var(--igp-text-muted);
    max-width: 520px;
}

.home-nominations__chips {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.home-nominations__chip {
    padding: 10px 18px;
    border-radius: 999px;
    border: 1px solid var(--igp-border);
    background: var(--igp-surface);
    color: var(--igp-text);
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
    cursor: default;
}
.home-nominations__chip.is-active {
    background: var(--igp-accent);
    color: var(--igp-on-accent);
    border-color: var(--igp-accent);
    font-weight: 600;
}

/* Свёртка длинного списка номинаций. На десктопе видны первые 12,
   на мобиле — первые 6. Кнопка раскрывает скрытые чипы.
   has-extra-desk — есть что скрыть на десктопе (total > 12);
   has-extra-mob  — есть что скрыть на мобиле   (total > 6). */
.home-nominations__chips-wrap.has-extra-desk .home-nominations__chip.is-extra-desk { display: none; }
@media (max-width: 720px) {
    .home-nominations__chips-wrap.has-extra-mob .home-nominations__chip.is-extra-mob { display: none; }
}
.home-nominations__chips-wrap.is-expanded .home-nominations__chip.is-extra-desk,
.home-nominations__chips-wrap.is-expanded .home-nominations__chip.is-extra-mob { display: list-item; }

/* Кнопка «показать ещё» прячется на десктопе, если на десктопе нечего раскрывать.
   На мобиле она нужна (если has-extra-mob). */
.home-nominations__chips-wrap:not(.has-extra-desk) .home-nominations__more-toggle { display: none; }
@media (max-width: 720px) {
    .home-nominations__chips-wrap.has-extra-mob .home-nominations__more-toggle { display: inline-flex; }
}

.home-nominations__more-toggle {
    margin-top: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    border-radius: 10px;
    border: 1px solid var(--igp-border);
    background: transparent;
    color: var(--igp-text-muted);
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.home-nominations__more-toggle:hover {
    color: var(--igp-text);
    border-color: var(--igp-text-muted);
    background: var(--igp-surface-alt);
}
.home-nominations__more-hide { display: none; }
.home-nominations__chips-wrap.is-expanded .home-nominations__more-show { display: none; }
.home-nominations__chips-wrap.is-expanded .home-nominations__more-hide { display: inline; }

.home-nominations__cta {
    align-self: flex-start;
    margin-top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 16px 28px;
    border-radius: 999px;
    background: var(--igp-surface);
    border: 1px solid var(--igp-border);
    color: var(--igp-text);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    transition: background .2s ease, border-color .2s ease, transform .15s ease;
}
.home-nominations__cta:hover {
    background: var(--igp-text);
    color: var(--igp-bg);
    border-color: var(--igp-text);
    transform: translateY(-1px);
}
.home-nominations__cta-arrow {
    transition: transform .2s ease;
}
.home-nominations__cta:hover .home-nominations__cta-arrow {
    transform: translateX(4px);
}

/* =========================================================
   Festival CTA — flex row двух колонок внутри градиентного блока
   ========================================================= */
.home-festival {
    background: var(--igp-surface);
}
.home-festival__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 48px;
    background: var(--igp-surface);
    border: 0;
    color: var(--igp-text);
    overflow: hidden;
}
.home-festival__content {
    flex: 1.6 1 360px;
    min-width: 0;
}
.home-festival__visual {
    flex: 1 1 280px;
    min-width: 0;
    max-width: 480px;
}
.home-festival__title {
    margin: 0 0 28px;
    font-size: clamp(24px, 3vw, 38px);
    line-height: 1.2;
    font-weight: 500;
    color: var(--igp-text);
    text-align: left; /* перебиваем общий center из section__title */
}
.home-festival__title p {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    line-height: inherit;
    color: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
}
.home-festival__title p + p { margin-top: 0.2em; }
.home-festival__content { text-align: left; }

.home-festival__visual img,
.home-festival__placeholder {
    width: 100%;
    border-radius: 24px;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}
.home-festival__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--igp-text-muted);
    font-style: italic;
    background: var(--igp-surface-alt);
}

/* =========================================================
   FAQ — flex column из карточек-аккордеона
   ========================================================= */
.home-faq__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 900px;
    margin: 0 auto;
}
.home-faq__item {
    background: var(--igp-surface);
    border: 1px solid var(--igp-border);
    border-radius: 18px;
    padding: 0;
    overflow: hidden;
}
.home-faq__question {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    font-size: 17px;
    font-weight: 500;
    color: var(--igp-text);
}
.home-faq__question::-webkit-details-marker { display: none; }
.home-faq__chevron {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: var(--igp-surface-alt);
    position: relative;
    transition: transform .2s ease, background .2s ease;
    flex-shrink: 0;
}
.home-faq__chevron::before,
.home-faq__chevron::after {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 12px; height: 2px;
    background: var(--igp-text);
    transform: translate(-50%, -50%);
    border-radius: 1px;
}
.home-faq__chevron::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .2s ease; }
/* При раскрытии — фон тот же, цвет «палочек» тот же, просто
   вертикальная палочка прячется → плюс превращается в минус, а не в «стоп». */
.home-faq__item[open] .home-faq__chevron::after { transform: translate(-50%, -50%) rotate(0deg); opacity: 0; }
.home-faq__answer {
    padding: 0 24px 24px;
    font-size: 15px;
    line-height: 1.6;
    color: var(--igp-text-muted);
}
.home-faq__answer p { margin: 0 0 8px; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1024px) {
    .home-header__menu { gap: 18px; }
    .home-header__menu-item a { font-size: 13px; }
}

@media (max-width: 860px) {
    .home-header__nav,
    .home-header__cta { display: none; }
    .home-header__burger { display: inline-flex; }


    .home-section { padding: 56px 0; }
    .home-hero { padding: 64px 0 56px; }
    .home-hero__title { letter-spacing: -0.03em; }

    /* Этапы: горизонтальный таймлайн на мобиле — стэк */
    .home-stages--timeline_horizontal .home-stages__timeline {
        flex-direction: column;
        gap: 24px;
        padding-top: 0;
    }
    .home-stages--timeline_horizontal .home-stages__timeline::before { display: none; }
    .home-stages--timeline_horizontal .home-stages__step {
        flex: 0 0 auto;
        flex-direction: row;
        align-items: flex-start;
        text-align: left;
        gap: 16px;
        padding: 0;
    }
    .home-stages--timeline_horizontal .home-stages__step-marker { flex-shrink: 0; width: 44px; height: 44px; }
    .home-stages--timeline_horizontal .home-stages__step-body { margin-top: 6px; }

    /* Festival CTA: на мобиле — колонка с центрированием
       (текст, кнопка, изображение). На десктопе остаётся flex row + left-align. */
    .home-festival__inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 32px;
    }
    .home-festival__content {
        /* На десктопе у content flex: 1.6 1 360px. В column-режиме flex-basis
           360px работает как высота — под кнопкой остаётся пустота, картинка
           «улетает» вниз. Сбрасываем flex-basis. */
        flex: 0 0 auto;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .home-festival__title {
        text-align: center;
    }
    .home-festival__visual {
        /* На десктопе у .home-festival__visual flex: 1 1 280px. При смене
           направления на column flex-basis: 280px начинает работать как
           ВЫСОТА — блок растягивается до 280px, картинка внутри ~220px,
           внизу остаётся ~60px пустоты. Сбрасываем flex-basis в auto. */
        flex: 0 0 auto;
        width: 100%;
        max-width: 420px;
    }
}

@media (max-width: 480px) {
    .home-container { padding: 0 16px; }
    .home-card { padding: 24px; }
    .home-hero__title { font-size: clamp(40px, 14vw, 64px); }
}