/* КультФонд — основные стили шаблона. Bootstrap 5.3.8 + Font Awesome 7 Free.
   Здесь нет собственных цветов, градиентов и шрифтов: всё берётся из variables.css.
   Префикс cf- изолирует оформление шаблона от стилей компонентов и модулей Joomla.
   Свои правки добавляйте в custom.css: он подключается последним. */

/* ─────────────────────────────────────────────────────────────────────
   1. Основа
   ───────────────────────────────────────────────────────────────────── */
html { scroll-padding-top: calc(var(--cf-nav-height) + 16px); }
.cf-layout { background: var(--cf-paper); color: var(--cf-ink); font-family: var(--cf-font); font-size: 16px; line-height: 1.5; font-variant-numeric: lining-nums tabular-nums; }
.cf-container.container-xxl { max-width: 1320px; padding-inline: 24px; }
.cf-main { min-height: 40vh; }

.cf-topbar a, .cf-nav a, .cf-mobile-nav a, .cf-home a, .cf-site-footer a { color: inherit; text-decoration: none; }
.cf-topbar img, .cf-home img { display: block; max-width: 100%; }
.cf-home :where(h1, h2, h3, p, ul), .cf-topbar :where(p, ul), .cf-site-footer :where(h2, p) { margin: 0; }

:where(a, button):focus-visible { outline: 3px solid var(--cf-gold); outline-offset: 4px; }

.cf-skip { position: absolute; top: -100px; left: 15px; z-index: 1100; padding: 12px; background: var(--cf-paper); color: var(--cf-ink); }
.cf-skip:focus { top: 15px; }

/* ─────────────────────────────────────────────────────────────────────
   2. Кнопки
   ───────────────────────────────────────────────────────────────────── */
.btn.cf-btn { display: inline-flex; justify-content: space-between; align-items: center; gap: 26px; min-height: 56px; padding: 15px 22px; border: 1px solid var(--cf-gold-button-line); border-radius: 10px; background: var(--cf-gold-gradient); color: var(--cf-ink); box-shadow: var(--cf-gold-button-shadow); font-family: var(--cf-font); font-size: 14px; font-weight: 600; line-height: 1.35; text-align: left; text-decoration: none; }
.btn.cf-btn:hover, .btn.cf-btn:focus-visible { transform: translateY(-3px); background: var(--cf-gold-button-hover); color: var(--cf-ink); box-shadow: var(--cf-gold-hover-shadow); }
.btn.cf-blue-btn { background: var(--cf-blue-gradient); border-color: var(--cf-blue-button-line); color: var(--cf-white); box-shadow: var(--cf-blue-button-shadow); }
.btn.cf-blue-btn:hover, .btn.cf-blue-btn:focus-visible { background: var(--cf-blue-button-hover); color: var(--cf-white); }
.btn.cf-account { background: var(--cf-account-gradient); border-color: var(--cf-account-border); color: var(--cf-account-text); font-weight: 500; letter-spacing: .3px; }
.btn.cf-account:hover, .btn.cf-account:focus-visible { background: var(--cf-blue-button-hover); color: var(--cf-account-text); }
.cf-arrow { display: inline-block; flex-shrink: 0; font-size: 19px; transform: rotate(-45deg); }

/* ─────────────────────────────────────────────────────────────────────
   3. Шапка: логотип, контакты, кабинет
   ───────────────────────────────────────────────────────────────────── */
.cf-topbar { background: var(--cf-header-background); color: var(--cf-ink); }
.cf-topbar__inner { min-height: 100px; padding-block: 16px; }
.cf-brand { gap: 13px; min-width: 0; }
.cf-brand__logo { flex: none; width: 68px; height: 68px; padding: 3px; object-fit: contain; }
.cf-brand__name { display: block; color: var(--cf-brand); font-size: 27px; line-height: 1.1; letter-spacing: -1px; }
.cf-brand-dot { color: var(--cf-brand-dot); }
.cf-brand__desc { display: block; margin-top: 6px; color: var(--cf-muted); font-size: 11px; line-height: 1.35; }
.cf-header-right { gap: 26px; }
.cf-phone { color: var(--cf-brand); font-size: 17px; font-weight: 500; letter-spacing: .5px; }
.cf-messengers { gap: 12px; margin-top: 6px; color: var(--cf-muted); font-size: 11px; }
.cf-messengers a:hover { color: var(--cf-blue); }
.cf-icon-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: var(--cf-brand); font-size: 21px; }
.cf-icon-btn:hover { color: var(--cf-blue); }

/* ─────────────────────────────────────────────────────────────────────
   4. Десктопное меню (закрепляется при прокрутке)
   ───────────────────────────────────────────────────────────────────── */
.cf-nav { z-index: 1030; background: var(--cf-header-background); border-bottom: 1px solid var(--cf-header-line); }
.cf-menu { --bs-nav-link-padding-x: 0; --bs-nav-link-padding-y: 8px; --bs-nav-link-color: var(--cf-ink); --bs-nav-link-hover-color: var(--cf-blue); --bs-nav-link-font-size: clamp(13px, 1.2vw, 18px); --bs-nav-link-font-weight: 500; justify-content: space-between; align-items: center; gap: 24px; padding-block: 17px; margin-inline: auto; border-top: 1px solid var(--cf-nav-line); letter-spacing: .15px; }
.cf-menu > .nav-item > .nav-link { position: relative; }
.cf-menu > .nav-item > .nav-link::before { content: ''; position: absolute; inset: auto 0 2px; height: 2px; background: var(--cf-gold); transform: scaleX(0); transform-origin: left; }
.cf-menu > .nav-item > .nav-link:hover::before, .cf-menu > .nav-item > .nav-link.active::before { transform: scaleX(1); }
.cf-menu .nav-link.active { color: var(--cf-blue); }
.cf-menu .dropdown-menu { --bs-dropdown-bg: var(--cf-surface); --bs-dropdown-border-color: var(--cf-card-line); --bs-dropdown-border-radius: 12px; --bs-dropdown-link-color: var(--cf-ink); --bs-dropdown-link-hover-bg: var(--cf-paper); --bs-dropdown-link-hover-color: var(--cf-blue); --bs-dropdown-link-active-bg: var(--cf-paper); --bs-dropdown-link-active-color: var(--cf-blue); --bs-dropdown-font-size: 15px; --bs-dropdown-padding-y: 8px; box-shadow: var(--cf-card-shadow); }
.cf-menu .dropdown-item { padding-block: 9px; }

/* ─────────────────────────────────────────────────────────────────────
   5. Мобильное меню: боковая панель Bootstrap Offcanvas
   ───────────────────────────────────────────────────────────────────── */
.cf-mobile-nav { --bs-offcanvas-width: min(100%, 440px); --bs-offcanvas-bg: var(--cf-paper); --bs-offcanvas-color: var(--cf-ink); --bs-offcanvas-padding-x: 20px; --bs-offcanvas-padding-y: 12px; --bs-offcanvas-border-width: 0; font-family: var(--cf-font); }
.cf-mobile-nav__header { min-height: 84px; background: var(--cf-header-background); border-bottom: 1px solid var(--cf-header-line); }
.cf-mobile-brand { gap: 12px; color: var(--cf-brand); font-size: 22px; font-weight: 700; line-height: 1.1; letter-spacing: -.5px; }
.cf-mobile-brand img { flex: none; width: 52px; height: 52px; object-fit: contain; }
.cf-mobile-nav__close { margin-left: auto; font-size: 28px; }
.cf-mobile-nav__links a, .cf-mobile-nav__links span { position: relative; display: block; padding: 18px 20px; border-bottom: 1px solid var(--cf-nav-line); color: var(--cf-ink); font-size: clamp(17px, 5vw, 20px); font-weight: 500; line-height: 1.25; }
.cf-mobile-nav__links a:hover { color: var(--cf-blue); }
.cf-mobile-nav__links a.active { color: var(--cf-blue); }
.cf-mobile-nav__links a.active::after { content: ''; position: absolute; bottom: -1px; left: 20px; width: 62px; height: 3px; background: var(--cf-gold); }
.cf-mobile-nav__links .cf-mobile-nav__sub { padding-left: 38px; font-size: clamp(16px, 4.4vw, 18px); font-weight: 400; }
.cf-mobile-nav__links .cf-mobile-nav__level-3 { padding-left: 56px; }
.cf-mobile-nav__account { padding: 20px; }
.cf-mobile-nav__account .btn.cf-btn { font-size: 16px; }
.cf-mobile-contacts { display: grid; gap: 14px; padding: 22px 20px 26px; background: var(--cf-footer-bg); color: var(--cf-footer-text); }
.cf-mobile-contacts__phones { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 18px; }
.cf-mobile-contacts__phones a { color: var(--cf-footer-label); }
.cf-mobile-contacts__social { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 14px; }
.cf-mobile-contacts__social a { color: var(--cf-footer-title); }
.offcanvas-backdrop { --bs-backdrop-bg: var(--cf-mobile-overlay); --bs-backdrop-opacity: 1; }

/* ─────────────────────────────────────────────────────────────────────
   6. Главная: первый экран
   ───────────────────────────────────────────────────────────────────── */
.cf-home { background: var(--cf-paper); color: var(--cf-ink); }
.cf-home .cf-kicker { display: block; margin-bottom: 15px; font-size: 10px; font-weight: 600; letter-spacing: 2px; color: var(--cf-kicker); }
.cf-home .cf-section-space { padding-block: 54px 46px; }

.cf-hero { position: relative; overflow: hidden; isolation: isolate; padding: 48px 0 37px; background: var(--cf-hero-overlay), var(--cf-hero-image, url('../images/sapphire-gold.webp')) center 46% / cover; border-bottom: 1px solid var(--cf-hero-line); }
.cf-hero::before { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background-image: var(--cf-hero-sheen); background-size: 230% 100%; opacity: .6; }
.cf-hero__inner { position: relative; z-index: 1; }
.cf-hero__overline { gap: 17px; margin-bottom: 25px; color: var(--cf-overline); font-size: 10px; letter-spacing: 3px; text-align: center; }
.cf-hero__overline > span { flex-shrink: 0; width: 45px; height: 1px; background: var(--cf-overline-rule); }
.cf-home .cf-hero h1 { position: relative; font-size: clamp(54px, 8.5vw, 122px); font-weight: 800; line-height: .93; letter-spacing: -5px; text-transform: uppercase; text-align: center; }
.cf-outline-title { display: block; margin-bottom: 6px; color: transparent; -webkit-text-stroke: 1px var(--cf-title-outline); text-shadow: var(--cf-outline-shadow); font-size: .78em; letter-spacing: 2px; }
.cf-home .cf-hero h1 strong { display: block; background-image: var(--cf-title-gradient); background-size: 220% 100%; background-clip: text; -webkit-background-clip: text; color: transparent; font-weight: 800; filter: var(--cf-title-shadow); }
.cf-hero__details { max-width: 990px; margin: 26px auto 30px; text-align: center; }
.cf-hero__details p { color: var(--cf-hero-copy); font-size: 16px; line-height: 1.55; }
.cf-hero-glow { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .25; background: var(--cf-glow); pointer-events: none; }
.cf-glow-left { width: 390px; height: 390px; top: 130px; left: -285px; }
.cf-glow-right { width: 370px; height: 370px; right: -310px; bottom: 100px; }

.cf-stage-window { position: relative; isolation: isolate; max-width: 1120px; height: 390px; margin-inline: auto; overflow: hidden; border: 1px solid var(--cf-stage-line); border-radius: 24px; box-shadow: var(--cf-stage-shadow); }
.cf-stage-window > img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.cf-stage-shadow { position: absolute; inset: 0; background: var(--cf-stage-overlay); pointer-events: none; }
.cf-stage-caption { position: absolute; bottom: 23px; left: 32px; right: 32px; gap: 20px; color: var(--cf-stage-caption); font-size: 9px; letter-spacing: 2px; }
.cf-stage-tag { position: absolute; bottom: 63px; padding: 8px 14px; border: 1px solid var(--cf-stage-tag-line); border-radius: 50px; background: var(--cf-stage-tag); color: var(--cf-stage-caption); backdrop-filter: blur(8px); font-size: 10px; }
.cf-tag-left { left: 32px; }
.cf-tag-right { right: 32px; }
.cf-stage-orbit { position: absolute; inset: 12px; border: 1px solid var(--cf-stage-inner-line); border-radius: 17px; pointer-events: none; }
.cf-home .cf-scroll-cue { position: relative; z-index: 1; width: 38px; height: 38px; margin: 25px auto 0; border: 1px solid var(--cf-scroll-line); border-radius: 50%; color: var(--cf-scroll); font-size: 18px; }

.cf-gold-sparks { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.cf-gold-sparks > span { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: var(--cf-spark); box-shadow: var(--cf-spark-shadow); opacity: .22; }
.cf-gold-sparks > span:nth-child(1) { left: 6%; top: 18%; animation-delay: -1s; }
.cf-gold-sparks > span:nth-child(2) { left: 17%; top: 40%; animation-delay: -4s; }
.cf-gold-sparks > span:nth-child(3) { left: 28%; top: 9%; animation-delay: -2s; }
.cf-gold-sparks > span:nth-child(4) { left: 43%; top: 32%; animation-delay: -6s; }
.cf-gold-sparks > span:nth-child(5) { left: 61%; top: 12%; animation-delay: -3s; }
.cf-gold-sparks > span:nth-child(6) { left: 82%; top: 26%; animation-delay: -5s; }
.cf-gold-sparks > span:nth-child(7) { left: 94%; top: 43%; animation-delay: -1s; }
.cf-gold-sparks > span:nth-child(8) { left: 8%; top: 68%; animation-delay: -3s; }
.cf-gold-sparks > span:nth-child(9) { left: 88%; top: 79%; animation-delay: -6s; }
.cf-gold-sparks > span:nth-child(10) { left: 23%; top: 88%; animation-delay: -4s; }
.cf-gold-sparks > span:nth-child(11) { left: 70%; top: 92%; animation-delay: -2s; }
.cf-gold-sparks > span:nth-child(12) { left: 49%; top: 96%; animation-delay: -5s; }

/* ─────────────────────────────────────────────────────────────────────
   7. Главная: направления, преимущества
   ───────────────────────────────────────────────────────────────────── */
.cf-discipline-strip { padding-block: 20px; border-block: 1px solid var(--cf-strip-line); background: var(--cf-strip-bg); }
.cf-directions { gap: 12px 20px; padding: 0; color: var(--cf-strip-text); font-size: 10px; font-weight: 400; letter-spacing: 1.4px; }
.cf-directions li { display: inline-flex; align-items: center; gap: 20px; }
.cf-directions i { color: var(--cf-strip-gold); font-size: 12px; }

.cf-pillars { padding-block: 40px 35px; }
.cf-pillar-row { --bs-gutter-x: 35px; --bs-gutter-y: 26px; }
.cf-pillar { height: 100%; border-right: 1px solid var(--cf-pillar-line); padding-right: 25px; }
.cf-pillar-row > div:last-child .cf-pillar { border-right: 0; }
.cf-pillar-icon { display: flex; align-items: center; width: 36px; height: 36px; margin-bottom: 14px; color: var(--cf-pillar-icon); font-size: 29px; }
.cf-pillars h2 { min-height: 45px; margin-bottom: 9px; color: var(--cf-pillar-title); font-size: 17px; font-weight: 600; line-height: 1.25; letter-spacing: 0; }
.cf-pillars p { color: var(--cf-muted); font-size: 12px; line-height: 1.55; }

/* ─────────────────────────────────────────────────────────────────────
   8. Главная: форматы участия
   ───────────────────────────────────────────────────────────────────── */
.cf-formats { scroll-margin-top: calc(var(--cf-nav-height) + 16px); }
.cf-section-heading { position: relative; margin-bottom: 28px; padding: 25px 28px; border: 2px solid transparent; border-radius: 20px; background: var(--cf-format-heading-bg) padding-box, var(--cf-format-heading-border) border-box; box-shadow: var(--cf-format-heading-shadow); text-align: center; }
.cf-section-heading::after { content: ''; position: absolute; inset: 7px; border: 1px solid var(--cf-format-heading-inner); border-radius: 12px; pointer-events: none; }
.cf-section-heading h2 { color: var(--cf-format-heading-text); font-size: 44px; font-weight: 600; line-height: 1.12; letter-spacing: -1px; text-shadow: var(--cf-format-heading-text-shadow); }
.cf-gold-dot { color: var(--cf-format-dot); }
.cf-format-row { --bs-gutter-x: 26px; --bs-gutter-y: 24px; }
.cf-format-card { display: flex; flex-direction: column; width: 100%; padding: 30px 34px 0; overflow: hidden; border: 1px solid var(--cf-card-line); border-radius: 24px; box-shadow: var(--cf-card-shadow); }
.cf-live-format { background: var(--cf-live-background); color: var(--cf-live-text); }
.cf-online-format { background: var(--cf-online-background); color: var(--cf-online-text); }
.cf-format-label { font-size: 9px; font-weight: 400; line-height: 1.5; letter-spacing: 2px; }
.cf-live-format .cf-format-label { color: var(--cf-live-label); }
.cf-online-format .cf-format-label { color: var(--cf-online-label); }
.cf-format-card h3 { margin: 17px 0 25px; font-size: 49px; font-weight: 600; line-height: 1.05; letter-spacing: -2px; }
.cf-live-format h3 { color: var(--cf-live-heading); }
.cf-online-format h3 { color: var(--cf-online-heading); }
.cf-format-card ul { display: flex; flex-direction: column; gap: 12px; min-height: 185px; margin: 0 0 24px; padding: 0; list-style: none; font-size: 15px; line-height: 1.5; }
.cf-format-card li { position: relative; padding-left: 25px; }
.cf-list-icon { position: absolute; top: .55em; left: 0; color: transparent; -webkit-text-stroke: .8px var(--cf-bullet); font-size: 10px; }
.cf-format-card .btn.cf-btn { width: 100%; margin-top: auto; margin-bottom: 26px; border-radius: 3px; }
.cf-format-image { height: 280px; margin-inline: -34px; overflow: hidden; }
.cf-format-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 43%; }

/* ─────────────────────────────────────────────────────────────────────
   9. Главная: о фонде и ВКонтакте
   ───────────────────────────────────────────────────────────────────── */
.cf-about-row { --bs-gutter-x: 90px; --bs-gutter-y: 28px; margin-inline: 0; }
.cf-about-row > div:first-child { padding-left: 0; }
.cf-about-row > div:last-child { padding-right: 0; }
.cf-about-title { position: relative; }
.cf-about-title h2 { color: var(--cf-heading); font-size: clamp(40px, 4.6vw, 65px); font-weight: 500; line-height: 1.1; letter-spacing: -2px; }
.cf-about-title h2 > span { color: var(--cf-about-accent); }
.cf-about-star { display: inline-block; width: 115px; height: 115px; margin-top: 25px; fill: none; stroke: var(--cf-about-star); stroke-width: .9; transform: rotate(12deg); }
.cf-about-copy > p { max-width: 480px; margin-bottom: 17px; color: var(--cf-muted); font-size: 15px; line-height: 1.5; }
.cf-about-copy .cf-large-copy { margin-bottom: 22px; color: var(--cf-heading); font-size: 28px; font-weight: 400; line-height: 1.25; letter-spacing: -1px; }
.cf-about-copy .btn.cf-btn { margin-top: 8px; }

.cf-social-wrap { margin-top: 30px; margin-bottom: 65px; }
.cf-social-section { padding: 48px 50px; border: 1px solid var(--cf-social-line); border-radius: 24px; background: var(--cf-social-overlay), var(--cf-hero-image, url('../images/sapphire-gold.webp')) center / cover; box-shadow: var(--cf-social-shadow); }
.cf-social-section .cf-kicker { color: var(--cf-social-kicker); }
.cf-social-section h2 { color: var(--cf-social-heading); font-size: 44px; font-weight: 500; line-height: 1.05; letter-spacing: -2px; }
.cf-social-section p { margin: 18px 0 24px; color: var(--cf-social-text); font-size: 14px; }
.cf-social-mark { position: relative; width: fit-content; margin-inline: auto 35px; color: transparent; -webkit-text-stroke: 1px var(--cf-social-mark); font-size: 120px; font-weight: 800; line-height: 1; letter-spacing: -12px; transform: rotate(-8deg); }
.cf-social-mark > .cf-arrow { position: absolute; top: -45px; right: -25px; font-size: 54px; color: var(--cf-social-mark); -webkit-text-stroke: 0; letter-spacing: 0; }

/* ─────────────────────────────────────────────────────────────────────
   10. Внутренние страницы: статьи, модули, подменю
   ───────────────────────────────────────────────────────────────────── */
.cf-content-section { padding-block: 40px 56px; }
.cf-content-section--tint { background: var(--cf-strip-bg); border-top: 1px solid var(--cf-strip-line); }
.cf-content-section :where(h1, h2, h3, h4, h5, h6) { color: var(--cf-heading); letter-spacing: -.5px; }
.cf-content-section h1 { font-size: clamp(30px, 4vw, 44px); font-weight: 600; line-height: 1.12; }
.cf-content-section img { max-width: 100%; height: auto; }
.cf-content-section a:not(.btn) { color: var(--cf-blue); }
.cf-content-section a:not(.btn):hover { color: var(--cf-blue-dark); }

.cf-module { margin-bottom: 28px; padding: 24px; border: 1px solid var(--cf-card-line); border-radius: 16px; background: var(--cf-surface); box-shadow: var(--cf-card-shadow); }
.cf-module__title { margin-bottom: 14px; color: var(--cf-heading); font-size: 20px; font-weight: 600; }

.cf-submenu { margin-block: 24px 4px; border-block: 1px solid var(--cf-strip-line); background: var(--cf-strip-bg); }
.cf-submenu__list { padding: 0; list-style: none; }
.cf-submenu__link { display: block; padding: 14px 18px; color: var(--cf-strip-text); font-size: 15px; font-weight: 500; text-decoration: none; }
a.cf-submenu__link:hover, .cf-submenu__link.is-active { color: var(--cf-blue); }
.cf-submenu__link.is-active { font-weight: 700; }
.cf-submenu__divider { width: 1px; height: 22px; background: var(--cf-strip-line); }

.breadcrumb { --bs-breadcrumb-divider-color: var(--cf-strip-gold); --bs-breadcrumb-item-active-color: var(--cf-muted); font-size: 14px; }
.pagination { --bs-pagination-color: var(--cf-blue); --bs-pagination-hover-color: var(--cf-blue-dark); --bs-pagination-active-bg: var(--cf-blue); --bs-pagination-active-border-color: var(--cf-blue); --bs-pagination-focus-color: var(--cf-blue-dark); --bs-pagination-border-color: var(--cf-card-line); }
.btn-primary { --bs-btn-bg: var(--cf-blue); --bs-btn-border-color: var(--cf-blue); --bs-btn-hover-bg: var(--cf-blue-dark); --bs-btn-hover-border-color: var(--cf-blue-dark); --bs-btn-active-bg: var(--cf-blue-dark); --bs-btn-active-border-color: var(--cf-blue-dark); }
.form-control:focus, .form-select:focus { border-color: var(--cf-gold); box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color); }

/* ─────────────────────────────────────────────────────────────────────
   11. Подвал и кнопка «Мерцание»
   ───────────────────────────────────────────────────────────────────── */
.cf-site-footer { padding-block: 50px 24px; background: var(--cf-footer-bg); color: var(--cf-footer-text); font-size: 12px; }
.cf-footer-row { --bs-gutter-x: 65px; --bs-gutter-y: 25px; margin-inline: 0; }
.cf-footer-row > div:first-child { padding-left: 0; }
.cf-footer-row > div:last-child { padding-right: 0; }
.cf-site-footer h2 { margin-bottom: 18px; color: var(--cf-footer-title); font-size: 19px; font-weight: 500; line-height: 1.2; }
.cf-site-footer p { margin-bottom: 14px; line-height: 1.75; }
.cf-site-footer p span { display: block; margin-bottom: 3px; color: var(--cf-footer-label); }
.cf-site-footer p a:hover, .cf-footer-end a:hover { color: var(--cf-footer-title); }
.cf-footer-social { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; color: var(--cf-footer-title); }
.cf-footer-end { gap: 25px; margin-top: 35px; padding-top: 15px; border-top: 1px solid var(--cf-footer-line); font-size: 11px; }
.cf-footer-end a:first-of-type { margin-left: auto; }
.cf-motion-control { padding: 12px 20px 18px; text-align: center; background: var(--cf-footer-bg); }
.cf-motion-control button { padding: 7px 15px; border: 1px solid var(--cf-motion-line); border-radius: 20px; background: transparent; color: var(--cf-motion-text); font: 11px/1.5 var(--cf-font); }

/* ─────────────────────────────────────────────────────────────────────
   11а. Служебные страницы: ошибка и «сайт закрыт»
   Берут оформление первого экрана (.cf-hero), поэтому выглядят как часть сайта.
   ───────────────────────────────────────────────────────────────────── */
.cf-error { padding-block: 64px 72px; color: var(--cf-hero-copy); text-align: center; }
.cf-error .cf-container { position: relative; z-index: 1; }
.cf-error a { text-decoration: none; }
.cf-error__brand { gap: 12px; margin-bottom: 34px; color: var(--cf-title-outline); font-size: 22px; font-weight: 700; letter-spacing: -.5px; }
.cf-error__brand img { border-radius: 12px; object-fit: contain; }
.cf-error__code { display: block; background-image: var(--cf-title-gradient); background-clip: text; -webkit-background-clip: text; color: transparent; filter: var(--cf-title-shadow); font-size: clamp(88px, 20vw, 200px); font-weight: 800; line-height: .95; letter-spacing: -6px; }
.cf-error h1 { margin: 14px 0 12px; color: var(--cf-format-heading-text); font-size: clamp(26px, 4vw, 40px); font-weight: 600; line-height: 1.15; letter-spacing: -.5px; }
.cf-error p { max-width: 560px; margin: 0 auto 28px; }
.cf-error .btn.cf-btn { min-width: 220px; }

/* ─────────────────────────────────────────────────────────────────────
   12. Движение: переходы, золотое мерцание, плавная прокрутка
   Анимации объявлены только там, где они разрешены: у посетителя не включён
   режим «уменьшить движение», а в настройках шаблона мерцание не выключено
   (класс cf-no-shimmer на <html>). Иначе остаётся спокойное статичное состояние.
   ───────────────────────────────────────────────────────────────────── */
@keyframes cf-sparkle { 0%, 100% { opacity: .12; transform: translateY(0) scale(.75); } 50% { opacity: .8; transform: translateY(-7px) scale(1.15); } }
@keyframes cf-title-glimmer { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes cf-light-drift { 0%, 100% { background-position: 0% 50%; opacity: .45; } 50% { background-position: 100% 50%; opacity: .8; } }

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
  .btn.cf-btn { transition: transform .2s, box-shadow .2s; }
  .cf-menu > .nav-item > .nav-link::before { transition: transform .2s; }
  .cf-format-image img { transition: transform .6s; }
  .cf-format-card:hover .cf-format-image img { transform: scale(1.03); }

  html:not(.cf-no-shimmer) .cf-hero::before { animation: cf-light-drift 15s ease-in-out infinite; }
  html:not(.cf-no-shimmer) .cf-home .cf-hero h1 strong { animation: cf-title-glimmer 11s ease-in-out infinite; }
  html:not(.cf-no-shimmer) .cf-gold-sparks > span { animation: cf-sparkle 7s ease-in-out infinite; }
}

/* ─────────────────────────────────────────────────────────────────────
   13. Адаптивность
   ───────────────────────────────────────────────────────────────────── */
@media (max-width: 1199.98px) {
  .cf-header-right { gap: 18px; }
  .cf-header-right .btn.cf-account { padding: 13px 17px; gap: 12px; font-size: 12px; }
  .cf-menu { gap: 14px; }
  .cf-formats .cf-format-card ul { min-height: 220px; font-size: 14px; }
  .cf-section-heading h2 { font-size: 38px; }
}

/* Ниже 992 px вместо десктопного меню работает боковая панель, а шапка закрепляется. */
@media (max-width: 991.98px) {
  html { scroll-padding-top: calc(var(--cf-topbar-mobile-height) + 16px); }
  .cf-topbar { position: sticky; top: 0; z-index: 1030; border-bottom: 1px solid var(--cf-header-line); box-shadow: var(--cf-menu-shadow); }
  .cf-topbar__inner { min-height: var(--cf-topbar-mobile-height); padding-block: 10px; }
  .cf-brand { gap: 10px; }
  .cf-brand__logo { width: 52px; height: 52px; }
  .cf-brand__name { font-size: 24px; letter-spacing: -.6px; }
  .cf-brand__desc { margin-top: 3px; font-size: 10px; }
  .cf-formats { scroll-margin-top: calc(var(--cf-topbar-mobile-height) + 16px); }

  .cf-hero { padding-top: 37px; }
  .cf-hero__overline { font-size: 8px; letter-spacing: 2px; }
  .cf-hero__details p { font-size: 13px; }
  .cf-home .cf-hero h1 { letter-spacing: -3px; }
  .cf-stage-window { height: 330px; }
  .cf-pillar-row { --bs-gutter-x: 18px; }
  .cf-pillar { padding-right: 13px; }
  .cf-pillars h2 { font-size: 15px; }
  .cf-format-card { padding-inline: 24px; }
  .cf-format-card h3 { font-size: 41px; }
  .cf-format-image { margin-inline: -24px; }
  .cf-format-label { letter-spacing: 1.5px; }
  .cf-about-row { --bs-gutter-x: 35px; }
  .cf-about-copy .cf-large-copy { font-size: 24px; }
  .cf-social-section h2 { font-size: 35px; }
  .cf-social-mark { font-size: 90px; margin-right: 15px; }
  .cf-footer-row { --bs-gutter-x: 30px; }
}

@media (max-width: 767.98px) {
  .cf-container.container-xxl { padding-inline: 20px; }
  .cf-hero { padding: 27px 0 24px; }
  .cf-hero__overline { font-size: 7px; letter-spacing: 1.1px; gap: 10px; margin-bottom: 23px; }
  .cf-hero__overline > span { width: 16px; }
  .cf-home .cf-hero h1 { font-size: 10.8vw; line-height: 1.02; letter-spacing: -1.8px; }
  .cf-outline-title { letter-spacing: 1px; margin-bottom: 3px; }
  .cf-hero__details { margin-top: 22px; margin-bottom: 26px; }
  .cf-stage-window { height: 285px; border-radius: 18px; }
  .cf-stage-window > img { object-position: 45% center; }
  .cf-stage-orbit { inset: 8px; border-radius: 12px; }
  .cf-stage-caption { left: 18px; right: 18px; bottom: 17px; justify-content: center; font-size: 7px; letter-spacing: 1.5px; }
  .cf-stage-caption > span:last-child { display: none; }
  .cf-stage-tag { bottom: 45px; max-width: 46%; padding: 6px 9px; font-size: 8px; text-align: center; }
  .cf-tag-left { left: 12px; }
  .cf-tag-right { right: 12px; }
  .cf-home .cf-scroll-cue { margin-top: 20px; width: 32px; height: 32px; font-size: 15px; }
  .cf-discipline-strip { padding-block: 15px; }
  .cf-directions { gap: 9px 13px; font-size: 9px; letter-spacing: .8px; }
  .cf-directions li { gap: 13px; }
  .cf-directions i { font-size: 9px; }
  .cf-pillars { padding-block: 30px 10px; }
  .cf-pillar-row { --bs-gutter-x: 20px; }
  .cf-pillar-row > div:nth-child(2) .cf-pillar { border-right: 0; }
  .cf-pillars h2 { font-size: 16px; min-height: 40px; }
  .cf-home .cf-section-space { padding-block: 35px 30px; }
  .cf-section-heading { margin-bottom: 22px; padding: 24px 18px; border-radius: 16px; }
  .cf-section-heading::after { inset: 6px; border-radius: 9px; }
  .cf-section-heading h2 { font-size: 29px; line-height: 1.15; letter-spacing: -.6px; }
  .cf-format-card { padding: 25px 26px 0; border-radius: 20px; }
  .cf-format-label { font-size: 8px; letter-spacing: 1.7px; }
  .cf-format-card h3 { font-size: 43px; margin: 23px 0; }
  .cf-formats .cf-format-card ul { min-height: 0; gap: 13px; font-size: 14px; line-height: 1.55; }
  .cf-format-card .btn.cf-btn { margin-top: 0; }
  .cf-format-image { height: 255px; margin-inline: -26px; }
  .cf-about-title h2 { font-size: 49px; }
  .cf-about-title { padding-bottom: 100px; }
  .cf-about-row > div, .cf-footer-row > div { padding-inline: 0; }
  .cf-about-star { position: absolute; right: 0; bottom: 0; width: 80px; height: 80px; margin-top: 0; }
  .cf-about-copy .cf-large-copy { font-size: 27px; }
  .cf-about-copy > p { font-size: 14px; }
  .cf-social-wrap { margin-top: 25px; margin-bottom: 40px; }
  .cf-social-section { padding: 28px; border-radius: 18px; overflow: hidden; }
  .cf-social-section h2 { font-size: 32px; letter-spacing: -1.3px; }
  .cf-social-section p { font-size: 13px; }
  .cf-site-footer { padding-block: 35px 20px; }
  .cf-footer-row > div:nth-child(2) { border-block: 1px solid var(--cf-footer-line); padding-block: 20px; }
  .cf-footer-social { flex-direction: row; gap: 20px; }
  .cf-footer-end { flex-direction: column; align-items: flex-start; gap: 12px; }
  .cf-footer-end a:first-of-type { margin-left: 0; }
}

@media (max-width: 575.98px) {
  .cf-brand__desc { display: none; }
  .cf-brand__logo { width: 46px; height: 46px; }
  .cf-brand__name { font-size: clamp(19px, 6vw, 24px); }
  .cf-icon-btn { width: 40px; }
}

@media (max-width: 359.98px) {
  .cf-about-title h2 { font-size: 43px; }
  .cf-social-section { padding: 24px; }
  .cf-social-section h2 { font-size: 28px; }
  .cf-home .btn.cf-btn { gap: 12px; padding-inline: 18px; }
}
