/* Стили страницы «funds». Вынесены из templates/main/funds.html без изменений:
   каскад тот же — <link> стоит там же, где стоял <style>. */
body {
        margin-top: 100px;
    }
    /* Шапка страницы — стиль site2 (крошки + eyebrow + заголовок) */
    .fnd-pagehead { padding-top: 24px; margin-bottom: 44px; }
    .fnd-pagehead .crumbs { display: flex; gap: 8px; align-items: center; font-family: 'Montserrat', sans-serif; font-size: 13px; color: #83879a; margin-bottom: 22px; }
    .fnd-pagehead .crumbs a { color: #83879a; text-decoration: none; padding: 0; }
    .fnd-pagehead .crumbs a:hover { color: #000f9f; font-weight: 400; }
    .fnd-pagehead .crumbs .sep { opacity: .5; }
    .fnd-pagehead .section-head { max-width: 760px; }
    .fnd-pagehead .eyebrow { font-family: 'Montserrat', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #000b73; display: inline-flex; align-items: center; gap: 11px; }
    .fnd-pagehead .eyebrow::before { content: ""; width: 30px; height: 1.5px; background: #000f9f; display: inline-block; }
    .fnd-pagehead .h-sec { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: clamp(28px, 3.6vw, 38px); line-height: 1.08; letter-spacing: -.01em; color: #14161d; margin: 14px 0 0; }
    .fnd-pagehead .muted { font-family: 'Montserrat', sans-serif; margin: 16px 0 0; font-size: 16px; line-height: 1.55; color: #474b58; }

    /* Баннер-карусель (.fbc) — в static/css/fbc.css */
    /* Каталог фондов — сетка карточек .rk-fcard (стиль site2, catalog.css) */
    .rk-catalog { margin-bottom: 0; }
    .rk-pif { padding-top: 50px; }
    .rk-catalog .cat-wrap { padding-inline: 0; }
    .rk-catalog .fcat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; align-items: stretch; padding: 6px 0 4px; }
    /* Карточка не растягивается на всю колонку: при 2 колонках на 1000-1100px
       она раздувалась до 460-510px, а на 600-700px — до 560-660px. */
    .rk-catalog .fcat-grid > .rk-fcard { width: 100%; max-width: 400px; margin-inline: auto; }
    /* Карточки — эффект матового стекла (frosted glass) поверх светового поля */
    .rk-catalog .rk-fcard { background: rgba(255, 255, 255, .55); -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); border: 1px solid rgba(255, 255, 255, .7); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 8px 24px rgba(9, 13, 48, .08); transition: transform .4s cubic-bezier(.22, .61, .36, 1), box-shadow .4s cubic-bezier(.22, .61, .36, 1), border-color .4s ease; will-change: transform; }
    .rk-catalog .rk-fcard:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 18px 44px rgba(9, 13, 48, .14); border-color: rgba(0, 15, 159, .22); transform: translateY(-3px); }
    /* Заголовки групп — как в site2 FundsPage (.group-head + .h-sub + .fg-note) */
    .rk-catalog .group-head { margin-bottom: 0; }
    .rk-catalog .eyebrow { font-family: 'Montserrat', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #000b73; display: inline-flex; align-items: center; gap: 11px; }
    .rk-catalog .eyebrow::before { content: ""; width: 30px; height: 1.5px; background: #000f9f; display: inline-block; }
    .rk-catalog .h-sub { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: clamp(22px, 2.2vw, 38px); line-height: 1.12; letter-spacing: -.01em; color: #14161d; margin: 14px 0 0; }
    .rk-catalog .fg-note { font-family: 'Montserrat', sans-serif; max-width: 70ch; margin: 10px 0 22px; font-size: 15px; line-height: 1.5; color: #474b58; }
    /* На скриншоте site2 нет плашки «Открытый ПИФ» — скрываем её в каталоге */
    .rk-catalog .fc-kind { display: none; }
    /* Блок «Не нашли стратегию?» — site2 .find-cta */
    .find-cta { display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; margin: 0; padding: 30px 34px; border-radius: 18px; border: 1px solid #eaedf4; border-left: 4px solid #000f9f; background: #fff; box-shadow: 0 2px 10px rgba(9, 13, 48, .05); text-decoration: none; transition: box-shadow .3s cubic-bezier(.22, .61, .36, 1); }
    .find-cta:hover { box-shadow: 0 14px 36px rgba(9, 13, 48, .1); }
    .find-cta h3 { font-family: 'Montserrat', sans-serif; font-size: clamp(19px, 2.2vw, 24px); margin: 0 0 6px; color: #14161d; font-weight: 700; }
    .find-cta p { font-family: 'Montserrat', sans-serif; margin: 0; font-size: 14.5px; line-height: 1.5; color: #474b58; max-width: 60ch; }
    .find-cta-btn { flex: none; display: inline-flex; align-items: center; gap: 10px; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 600; color: #fff; background: #000f9f; border-radius: 999px; padding: 16px 30px; transition: background .2s, transform .2s; }
    .find-cta:hover .find-cta-btn { background: #000b73; transform: translateY(-1px); }
    .find-cta-btn svg { width: 16px; height: 16px; }

    /* Общая обёртка новых секций + заголовки (site2) */
    .fnd-wrap { max-width: 1200px; margin: 0 auto; }
    .fnd-become { padding: 50px 0; margin: 0; }
    .fnd-wrap .section-head { max-width: 760px; margin-bottom: 34px; }
    .fnd-wrap .eyebrow { font-family: 'Montserrat', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #000b73; display: inline-flex; align-items: center; gap: 11px; }
    .fnd-wrap .eyebrow::before { content: ""; width: 30px; height: 1.5px; background: #000f9f; display: inline-block; }
    .fnd-wrap .h-sec { font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: clamp(28px, 3.4vw, 38px); line-height: 1.08; letter-spacing: -.02em; color: #14161d; margin: 14px 0 0; }
    .fnd-wrap .muted { color: #474b58; }
    .fnd-wrap .section-head p { margin: 16px 0 0; font-family: 'Montserrat', sans-serif; font-size: 16px; line-height: 1.55; }

    /* О компании (кратко) — блок из site2, по левому краю, без подложки */
    .fnd-about { padding: 50px 0; margin: 0; }
    .btn-ghost { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 15px; padding: 13px 24px; border-radius: 999px; background: transparent; color: #14161d; border: 1.5px solid #dfe3ec; text-decoration: none; transition: border-color .2s, color .2s; white-space: nowrap; }
    .btn-ghost:hover { border-color: #000f9f; color: #000f9f; }
    .btn-ghost svg { width: 16px; height: 16px; }

    /* FAQ — стиль site2, аккордеон на всю ширину; шапка по центру */
    .fnd-faq { padding: 50px 0; margin: 0; }
    /* Заголовок блока вопросов — по левому краю, как у остальных секций страницы. */
    .fnd-faq .section-head { margin-bottom: 40px; }
    .faq2-list { width: 100%; }
    .faq2-item { border-bottom: 1px solid #dfe3ec; }
    .faq2-q { width: 100%; text-align: left; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0; font-family: 'Montserrat', sans-serif; font-size: 17px; font-weight: 600; color: #14161d; background: none; border: none; cursor: pointer; }
    .faq2-ic { flex: none; width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid #dfe3ec; display: flex; align-items: center; justify-content: center; transition: .25s; color: #000f9f; }
    .faq2-ic svg { width: 16px; height: 16px; }
    .faq2-item.open .faq2-ic { background: #000f9f; color: #fff; border-color: #000f9f; transform: rotate(45deg); }
    .faq2-a { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
    .faq2-a-inner { padding: 0 0 22px; font-family: 'Montserrat', sans-serif; font-size: 14.5px; color: #474b58; line-height: 1.6; }
    .faq2-a-inner p { margin: 0 0 12px; }
    .faq2-a-inner p:last-child { margin-bottom: 0; }
    .faq2-a-inner ul { margin: 8px 0 0; padding-left: 20px; }
    .faq2-a-inner li { margin-bottom: 6px; }
    .faq2-a-inner a { color: #000f9f; }

    /* Карточки шагов — 1:1 с детальной страницы фонда (.step-card). Обёртка <a>
       сделана flex-колонкой, чтобы карточки были равной высоты и не вылезали из ряда. */
    /* Пять колонок в ряд делали карточки шага слишком узкими (≈208px на 1400).
       auto-fit сам подбирает число колонок под ширину, минимум 250px. */
    .steps-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 30px; }
    .steps-container > .all-link { display: flex; flex-direction: column; }
    .step-card { flex: 1; background: white; border-radius: 16px; padding: 30px 25px; box-shadow: 0 0 30px rgba(0,0,0,0.08); position: relative; overflow: hidden; transition: transform 0.3s ease; display: flex; flex-direction: column; }
    .step-card:hover { transform: translateY(-5px); }
    .step-number { font-size: 250px; font-weight: 800; color: #1d40b4; opacity: 0.05; position: absolute; top: 16px; right: -25px; line-height: 1; }
    .step-content { position: relative; z-index: 2; flex: 1; display: flex; flex-direction: column; }
    .step-title { font-size: 16px; color: #4a5568; margin: 0 0 15px 0; }
    .step-desc { color: #4a5568; margin: 0 0 15px 0; line-height: 1.5; font-size: 14px; }
    .step-time { display: inline-block; background-color: #1d40b410; color: #000f9f; padding: 5px 12px; border-radius: 20px; font-size: 14px; font-weight: 500; margin-top: auto; align-self: flex-start; }
    .step-card::before { content: ""; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: #000f9f; }
    @media (max-width: 700px) { .step-number { font-size: 160px; top: 0; right: 0; } }
    main {
        margin-bottom: 70px;
    }
    /* Блок ссылок на официальные источники (Банк России / НАУФОР) — как на главной */
    .fnd-about .blocklink-center { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; margin-top: 24px; }
    .fnd-about .blocklink {
        font-size: 14px; display: flex; align-items: center; flex: 1 1 calc(30%); min-width: 300px;
        box-shadow: 0 0 20px rgba(102, 102, 102, 0.1); padding: 20px; border-radius: 13px;
        transition: 0.7s; background-color: #ffffff; justify-content: center; text-decoration: none; color: inherit;
    }
    .fnd-about .blocklink:hover { box-shadow: 0 0 20px rgba(2, 20, 177, 0.1); transform: translateY(-2px); }
    .fnd-about .blocklink .link { flex: 1; text-align: left; margin-left: 20px; }
    .fnd-about .blocklink .CB, .fnd-about .blocklink .naufor { max-width: 100%; height: auto; min-width: 150px; }
    .fnd-about .blocklink .CB { width: 40%; }
    .fnd-about .blocklink .naufor { width: 35%; margin: 20px 0; }
    @media (max-width: 1150px) {
        .fnd-about .blocklink { flex-direction: column; align-items: center; width: 100%; max-width: 800px; }
        .fnd-about .blocklink .link { text-align: center; margin-left: 0; margin-top: 10px; }
        .fnd-about .blocklink .CB { width: 80%; max-width: 250px; }
        .fnd-about .blocklink .naufor { width: 75%; max-width: 230px; }
    }

    /* Адаптив: единые боковые поля 20px, как на остальных страницах.
       Было: main шириной 90% из main.css (поля «плавали» вместе с шириной
       экрана), а каталог фондов — full-bleed без полей вовсе, из-за чего
       карточки упирались в края экрана. Десктоп (>1240) не трогаем. */
    @media (max-width: 1240px) {
        main { width: 100%; max-width: 1200px; padding-inline: 20px; box-sizing: border-box; }
        /* Каталог перестаёт быть full-bleed (100vw): иначе его контент уезжал
           на пол-скроллбара влево относительно заголовка страницы. */
        /* .rk-cta не трогаем: её светлая подложка (.cta-band) должна идти
           край-в-край, как на главной. */
        main .rk-catalog, main .rk-pif, main .rk-promo { width: auto; margin-left: 0; margin-right: 0; }
        .rk-catalog .cat-wrap { padding-inline: 0; }
        .rk-pif .pif-wrap { padding-inline: 0; }
    }
    /* Плашка «Партнёрам»: контент во всю ширину 1200, как у остальных блоков.
       В mech.css у .promo-wrap свои поля 32px — на этой странице они лишние,
       поля даёт main. */
    .rk-promo .promo-wrap { padding-inline: 0; }

    /* Колонка не может быть уже экрана: minmax(300px,…) на узких давал колонку
       300px при доступных ~280 и карточка вылезала за правый край. */
    .rk-catalog .fcat-grid { grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }