/* v2.1 из Figma 4mCqNu9Bquq6CXXcKUzmBP (узел 6002:276), десктоп 1440.
   Цвета и размеры сняты с макета. Правим здесь. */

@font-face { font-family: "X5 Sans"; font-weight: 300; src: url(fonts/X5Sans-Light.ttf); }
@font-face { font-family: "X5 Sans"; font-weight: 400; src: url(fonts/X5Sans-Regular.ttf); }
@font-face { font-family: "X5 Sans"; font-weight: 500; src: url(fonts/X5Sans-Medium.ttf); }
@font-face { font-family: "X5 Sans"; font-weight: 600 700; src: url(fonts/X5Sans-Bold.ttf); }

:root {
  --green: #1BDB0C;
  --green-text: #1AC20D;   /* зелёный текст на светлом и в фонде */
  --green-dark: #185912;
  --dark: #000F03;          /* фон страницы, глубже, как низ KV в обложке */
  --ink: #202020;
  --grey: #F2F2F2;
  --muted: #5E5E5E;
  --blue: #B3CEF9;          /* сотрудники X5 */
  --pink: #F073C7;          /* топ-гости */
  --r-section: 64px;
  --pad-x: 80px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: "X5 Sans", Arial, sans-serif; color: #FFFFFF; background: var(--dark); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { display: block; }
/* Колонка 1440 без обрезки: свечения и нити выходят за неё на широких экранах.
   Горизонтальный скролл запрещён на уровне страницы */
html, body { overflow-x: clip; }
.wrap { max-width: 1440px; margin: 0 auto; position: relative; }

/* Крупный заголовок 128/124 */
.display { font-size: 128px; line-height: 124px; letter-spacing: -0.045em; font-weight: 400; }
.display .g { color: var(--green); }
.display .g2 { color: var(--green-text); }

/* Кнопки */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border-radius: 999px; font-weight: 500; white-space: nowrap; transition: transform .15s, background .15s; }
.btn:hover { transform: translateY(-1px); }
.btn--green { background: var(--green); color: var(--ink); }
.btn--ghost { border: 1.5px solid rgba(255,255,255,.4); color: #FFFFFF; }
.btn--dark { background: var(--ink); color: #FFFFFF; }
.btn .arr { font-weight: 700; }

/* Блёстки */
.spark { position: absolute; background: url(img/kv/sparkle-02.png) center/contain no-repeat; mix-blend-mode: screen; pointer-events: none; animation: twinkle 3.2s ease-in-out infinite; }
.glint { background: none; mix-blend-mode: screen; }
@keyframes twinkle { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .45; transform: scale(.8); } }

/* 1. Обложка ------------------------------------------------------------- */
.top { background: none; }

/* Низ KV растворяется в фоне страницы, под ним видно свечение следующего блока */
.hero { --kv-h: 1020px; position: relative; height: 1013px; overflow: hidden; }
.hero__kv { position: absolute; left: 0; top: 0; width: 100%; height: var(--kv-h); object-fit: cover;
  -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent 100%); mask-image: linear-gradient(180deg, #000 72%, transparent 100%); }
/* Логотип KV отдельным слоем. Блок повторяет кадр KV (object-fit: cover, по центру):
   --s = масштаб картинки 2880×2040, логотип стоит в её координатах (x 1018, y 1060, ширина 850.5) */
.hero__brand { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: var(--kv-h); container-type: size; pointer-events: none; }
.hero__logo, .hero__glow { position: absolute; --s: max(100cqw / 2880, 100cqh / 2040);
  left: calc(50cqw - 422 * var(--s)); top: calc(50cqh + 40 * var(--s)); width: calc(850.5 * var(--s)); height: calc(336 * var(--s)); }
/* Свечение как на KV: плотный белый ореол у края букв, мягко уходит на ~20 px картинки */
.hero__glow { filter: drop-shadow(0 0 calc(4 * var(--s)) #FFFFFF) drop-shadow(0 0 calc(8 * var(--s)) rgba(255,255,255,.8)); }
/* Затемнение сверху под хедером */
.hero__shade { position: absolute; left: 0; right: 0; top: 0; height: 320px; background: linear-gradient(180deg, rgba(0,12,0,.82) 0%, rgba(0,12,0,.55) 40%, rgba(0,12,0,0) 100%); pointer-events: none; }

/* Таймер: крупные тонкие цифры с подписями */
.timer { position: absolute; z-index: 2; left: 0; right: 0; top: 812px; display: flex; justify-content: center; align-items: flex-start; gap: 28px; color: #FFFFFF; }
.timer__unit { display: flex; flex-direction: column; align-items: center; min-width: 104px; }
.timer__n { font-size: 80px; line-height: 80px; font-weight: 300; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.timer__l { margin-top: 8px; font-size: 13px; line-height: 16px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.timer__sep { font-size: 48px; line-height: 80px; font-weight: 300; color: rgba(255,255,255,.35); }
.header { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; height: 56px; margin: 40px var(--pad-x) 0; }
.header > * { filter: drop-shadow(0 32px 32px #010B01); }
.header__logo { width: 200px; height: 53px; }
.nav { display: flex; gap: 36px; padding: 14px 28px; border-radius: 999px; background: rgba(5,33,15,.72); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(14px); }
.nav a { font-size: 16px; line-height: 19.2px; font-weight: 500; color: rgba(255,255,255,.85); }
.nav a:hover { color: #FFFFFF; }
.header .btn { height: 48px; padding: 0 24px; font-size: 16px; }

/* Дата и место под логотипом KV */
.hero__info { position: absolute; z-index: 2; left: 0; right: 0; top: 724px; display: flex; flex-direction: column; align-items: center; gap: 22px; padding: 0 20px; text-align: center; }
.hero__sub { font-size: 42px; line-height: 46px; font-weight: 400; letter-spacing: -.01em; color: #FFFFFF; text-shadow: 0 0 22px rgba(255,255,255,.35); }
/* Дата и место крупно */
.hero__meta { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px 40px; }
.meta-big { display: inline-flex; align-items: center; gap: 12px; font-size: 30px; line-height: 36px; font-weight: 500; letter-spacing: -.01em; color: #FFFFFF; white-space: nowrap;
  text-shadow: 0 0 14px rgba(255,255,255,.35); }
/* Тонкая белая иконка без подложки, со свечением как у логотипа KV */
.meta-big svg { flex: none; width: 30px; height: 30px; color: #FFFFFF; stroke-width: 1.6;
  filter: drop-shadow(0 0 2px #FFFFFF) drop-shadow(0 0 6px rgba(255,255,255,.55)); }
.hero__cta { position: absolute; z-index: 2; left: 0; right: 0; top: 930px; display: flex; justify-content: center; gap: 12px; }
.hero__cta .btn { height: 56px; padding: 0 30px; font-size: 20px; }

/* 2. О мероприятии --------------------------------------------------------- */
/* снизу место под подарок, который свисает ниже текста */
.about { padding: 88px var(--pad-x) 260px; }
.statement { display: flex; flex-wrap: wrap; column-gap: 28px; row-gap: 6px; align-items: flex-start; max-width: 1180px; }
.statement span { display: block; }
.statement .b { font-weight: 500; }
/* Светлые кружки: на них видно цепочку, на которой висит игрушка */
/* Игрушка висит из «дырки»: обрезка капсулой выше кружка, низ игрушки выступает наружу */
.pill { position: relative; z-index: 1; width: 104px; height: 104px; margin-top: 10px; border-radius: 52px; background: radial-gradient(circle at 50% 35%, #FFFFFF, #DDE8DA); box-shadow: 0 0 40px rgba(27,219,12,.25); }
.pill__hang { position: absolute; left: 0; top: 0; width: 104px; border-radius: 52px; overflow: hidden; }
.pill img { position: absolute; max-width: none; }
.when-where { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 24px 64px; margin-top: 48px; }
.when-where dt { font-size: 15px; line-height: 18px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--green); }
.when-where dd { margin-top: 10px; font-size: 52px; line-height: 56px; font-weight: 400; letter-spacing: -.03em; }
.about__row { position: relative; z-index: 1; display: flex; align-items: center; min-height: 437px; margin-top: 40px; padding-left: 544px; }
/* Подарок по центру между текстом и блоком сеансов */
.about__gift { position: absolute; left: 0; top: 233px; width: 440px; filter: drop-shadow(0 30px 60px rgba(27,219,12,.25)); }
.about__story { width: 736px; }
.about__story p { font-size: 34px; line-height: 46px; letter-spacing: -.01em; font-weight: 500; }
.about__story .btn { margin-top: 32px; height: 56px; padding: 0 28px; font-size: 20px; }

/* Блики и боке из KV */
.kvs { position: absolute; pointer-events: none; mix-blend-mode: screen; }
/* Все блики KV мерцают, задержки и длительность разные, чтобы не мигали в такт */
.kvs { animation: twinkle 4s ease-in-out infinite; }

/* Тёмные секции. isolation + z-index:-1 держат свечения над фоном, но под контентом */
/* Стекло: размытие фона, блик сверху слева, градиентная кромка, внутренняя подсветка */
.glass { position: relative; isolation: isolate; overflow: hidden;
  background: linear-gradient(150deg, rgba(255,255,255,.11) 0%, rgba(255,255,255,.035) 38%, rgba(255,255,255,.02) 62%, rgba(27,219,12,.06) 100%);
  border: 0; -webkit-backdrop-filter: blur(28px) saturate(170%); backdrop-filter: blur(28px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 0 40px rgba(255,255,255,.03), 0 30px 80px rgba(0,0,0,.45); }
.glass::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(120% 70% at 0% 0%, rgba(255,255,255,.14), rgba(255,255,255,0) 55%); }
.glass::after { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none;
  background: linear-gradient(160deg, rgba(255,255,255,.5), rgba(255,255,255,.12) 35%, rgba(255,255,255,.04) 65%, rgba(27,219,12,.35));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }

/* Блоки не разделяем скруглёнными плашками */
.dark { position: relative; isolation: isolate; background: var(--dark); color: #FFFFFF; overflow: hidden; }
/* Блоки между обложкой и «Красной площадью» прозрачные и без обрезки: свечения
   лежат на общем фоне страницы и перетекают между блоками без швов */
.about, .program, .reg, .fund, .faq, .route { background: none; border-radius: 0; overflow: visible; isolation: auto; }
.glow { position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.glow--g { filter: blur(128px); background: radial-gradient(closest-side, rgba(27,219,12,.18), rgba(27,219,12,.12) 35%, rgba(27,219,12,.035) 70%, transparent); }
.glow--d { filter: blur(128px); background: radial-gradient(closest-side, rgba(24,89,18,.5), rgba(24,89,18,.35) 35%, rgba(24,89,18,.1) 70%, transparent); }

/* 3. Программа ------------------------------------------------------------- */
.program { padding: 88px var(--pad-x) 120px; }
.program__head { margin-left: 544px; }
.program__story { margin-top: 32px; font-size: 32px; line-height: 44.8px; letter-spacing: -.01em; font-weight: 500; }
.legend { display: flex; gap: 28px; margin-top: 18px; font-size: 20px; line-height: 24px; color: rgba(255,255,255,.8); }
.legend sup { font-size: 12px; margin-left: 6px; }
.c-green { color: var(--green); }
.c-blue { color: var(--blue); }
.c-pink { color: var(--pink); }
.table { position: relative; margin-top: 92px; }
/* Нить из бусин от края до края, игрушки подвешены к ней */
.strand { position: absolute; left: -50px; top: -50px; width: 1540px; max-width: none; pointer-events: none; }
/* Игрушки привязаны к нити: координаты считаются от её левого края, верха и ширины.
   Коэффициенты сняты с десктопа (нить 1540 px с отступом −50, −50), поэтому на любой
   ширине игрушка висит в той же точке нити. На десктопе переменные дают те же px */
.reg, .fund { --sl: -50px; --st: -50px; --sw: 1540px; }
.reg .strand, .fund .strand { left: var(--sl); top: var(--st); width: var(--sw); }
/* у звезды нить спускается слева направо, у луны тот же слой отражён: справа налево */
.strand--ltr { transform: rotate(4deg); }
.strand--rtl { transform: scaleX(-1) rotate(4deg); }
/* Подвесные игрушки покачиваются от точки подвеса */
.hang { position: absolute; pointer-events: none; transform-origin: 50% 0; animation: sway 6s ease-in-out infinite; }
@keyframes sway { 0%, 100% { transform: rotate(-2.5deg); } 50% { transform: rotate(2.5deg); } }
/* Разделители пунктиром из точек, как в макете */
.row { display: flex; align-items: center; height: 116px; background: radial-gradient(circle at 1px 1px, rgba(255,255,255,.2) .9px, transparent 1.2px) 0 0 / 13.5px 2px repeat-x; }
.row:first-child { background: none; }
.row__time { width: 640px; font-size: 82px; line-height: 82px; letter-spacing: -.03em; }
.row--closed .row__time { color: rgba(255,255,255,.5); }
.row__aud { width: 300px; font-size: 20px; line-height: 26px; font-weight: 500; }
.row__status { margin-left: auto; }
.row__status .btn { height: 52px; padding: 0 26px; font-size: 17px; }
.row__note { padding: 0 26px; font-size: 16px; font-weight: 500; color: rgba(255,255,255,.6); }

/* 4. Регистрация ----------------------------------------------------------- */
.reg { position: relative; padding: 240px var(--pad-x) 120px; }
/* Игрушки по бокам от звезды: сердце слева, звёздочка справа, точки подвеса посчитаны по кривой нити */
.reg__side { position: absolute; pointer-events: none; }
.reg__side--l { left: calc(var(--sl) + var(--sw) * .58584); top: calc(var(--st) + var(--sw) * .1335); width: calc(var(--sw) * .14); }
.reg__side--r { left: calc(var(--sl) + var(--sw) * .87533); top: calc(var(--st) + var(--sw) * .0965); width: calc(var(--sw) * .1); }
.reg__ticket-deco { position: absolute; left: calc(var(--sl) + var(--sw) * .72532); top: calc(var(--st) + var(--sw) * .12727); width: calc(var(--sw) * .18442); }
.reg__row { display: flex; gap: 64px; margin-top: 126px; }
.reg__left { width: 560px; }
.step { position: relative; padding: 32px 0; }
/* Разделитель: тонкая линия, к краям уходит в прозрачность */
.step + .step { border-top: 1px solid transparent; border-image: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.5) 18%, rgba(255,255,255,.5) 82%, rgba(255,255,255,0)) 1; }
.step__t { font-size: 46px; line-height: 50px; letter-spacing: -.02em; font-weight: 700; }
.step__d { margin-top: 10px; max-width: 480px; font-size: 20px; line-height: 29px; color: rgba(255,255,255,.62); }
.reg__right { width: 656px; }
/* «Добавить в календарь» под билетом */
.addcal { margin-top: 32px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.addcal__label { font-size: 15px; line-height: 18px; font-weight: 500; color: rgba(255,255,255,.65); }
.addcal__row { display: flex; gap: 10px; }
.addcal__row a { display: inline-flex; align-items: center; gap: 8px; height: 39px; padding: 0 18px 0 14px; border: 1.5px solid rgba(255,255,255,.4); border-radius: 999px; color: #FFFFFF; font-size: 15px; font-weight: 500; }
.addcal__row a:hover { border-color: #FFFFFF; }
.addcal__row img { width: 16px; height: 16px; }
/* Подставка билета чуть светлее фона, чтобы не терялась */
.stand { width: 656px; padding: 0 16px 16px; border-radius: 48px; }
.stand__head { padding: 28px 32px 20px; text-align: center; }
.stand__title { font-size: 40px; line-height: 44px; font-weight: 400; letter-spacing: -.035em; color: #FFFFFF; }
.stand__title span { color: var(--green); }
/* Заглушка формы Афиши: в бою здесь iframe */
.afisha { padding: 30px 32px; background: #FFFFFF; border-radius: 30px; font-family: Inter, Arial, sans-serif; color: #1A1A1A; }
.afisha h3 { font-size: 22px; line-height: 28px; font-weight: 700; }
.afisha__sub { margin-top: 6px; font-size: 14px; color: #7A7A7A; }
.afisha__chips { display: flex; gap: 8px; margin-top: 20px; }
.afisha__chips span { padding: 12px 16px; border: 1px solid #DADADA; border-radius: 10px; font-size: 14px; }
.afisha__chips .on { background: #1A1A1A; border-color: #1A1A1A; color: #FFFFFF; }
.afisha__qty { display: flex; justify-content: space-between; margin-top: 20px; padding: 14px 0; border-bottom: 1px solid #EEEEEE; font-size: 15px; }
.afisha__field { margin-top: 10px; height: 50px; padding: 0 14px; display: flex; align-items: center; border: 1px solid #DADADA; border-radius: 10px; font-size: 15px; color: #9A9A9A; }
.afisha__qty + .afisha__field { margin-top: 12px; }
.afisha__check { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: 12px; color: #7A7A7A; }
.afisha__check i { width: 16px; height: 16px; border: 1px solid #BDBDBD; border-radius: 4px; }
.afisha__field + .afisha__check { margin-top: 12px; }
.afisha__btn { margin-top: 20px; height: 56px; display: flex; align-items: center; justify-content: center; background: var(--green); border-radius: 12px; font-size: 16px; font-weight: 700; color: var(--ink); }
.afisha__hint { margin-top: 14px; font-size: 13px; color: #9A9A9A; text-align: center; }

/* 5. Фонд ------------------------------------------------------------------ */
.fund { padding: 204px var(--pad-x) 120px; }
.fund__deco { position: absolute; left: calc(var(--sl) + var(--sw) * .037662); top: calc(var(--st) + var(--sw) * .076623); width: calc(var(--sw) * .19481); pointer-events: none; }
.fund__titles { position: relative; padding-top: 38px; text-align: center; }
/* Карточка фонда по образцу конференции, цвета и свет из KV */
.fundcard { max-width: 1180px; margin: 64px auto 0; padding: 64px 64px 60px; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; align-items: center; border-radius: 44px; }
.fundcard__main { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.fundcard__stats { display: grid; gap: 40px; padding-left: 56px; border-left: 1px solid rgba(255,255,255,.18); }
.stat dt { font-size: 64px; line-height: 1; font-weight: 400; letter-spacing: -.04em; color: #FFFFFF; }
.stat dd { margin-top: 10px; font-size: 18px; line-height: 24px; color: rgba(255,255,255,.7); }
/* зелёное свечение сверху, как на конференции, поверх стекла */
.fundcard.glass { background: radial-gradient(64% 120% at 50% 0%, rgba(27,219,12,.22), rgba(27,219,12,0) 70%), linear-gradient(150deg, rgba(255,255,255,.10), rgba(255,255,255,.02) 50%, rgba(27,219,12,.05)); }
.fundcard__logo { width: 300px; height: auto; margin-bottom: 28px; }
.fundcard h3 { font-size: 40px; line-height: 46px; letter-spacing: -.02em; font-weight: 700; max-width: 22em; }
.fundcard p { margin-top: 18px; max-width: 46em; font-size: 20px; line-height: 30px; color: rgba(255,255,255,.78); }
.fundcard__actions { margin-top: 36px; display: flex; align-items: center; gap: 28px; }
.fundcard__actions .btn { height: 64px; padding: 0 36px; font-size: 20px; }

/* 6. Вопрос-ответ ---------------------------------------------------------- */
.faq { position: relative; padding: 88px var(--pad-x) 120px; }
.faq__head { display: flex; justify-content: space-between; align-items: flex-end; padding-top: 38px; }
.faq__q3d { position: relative; width: 160px; height: 160px; }
.faq__q3d img { position: absolute; left: -62px; top: -63px; width: 284px; }
.acc { margin-top: 60px; }
.acc details { padding: 36px 0; background: radial-gradient(circle at .5px .5px, rgba(255,255,255,.25) .6px, transparent .9px) 0 0 / 9px 1px repeat-x; }
.acc details:first-child { background: none; }
.acc summary { display: flex; align-items: center; justify-content: space-between; gap: 28px; list-style: none; cursor: pointer; }
.acc summary::-webkit-details-marker { display: none; }
.acc summary h3 { width: 960px; font-size: 46px; line-height: 55.2px; letter-spacing: -.03em; font-weight: 500; }
.acc .tg { flex: none; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; border: 1.5px solid rgba(255,255,255,.35); border-radius: 50%; font-size: 34px; font-weight: 500; }
.acc .tg::before { content: "+"; }
.acc details[open] .tg { background: var(--green); border-color: var(--green); color: var(--ink); }
.acc details[open] .tg::before { content: "−"; }
.acc p { margin-top: 18px; width: 760px; font-size: 22px; line-height: 32px; color: rgba(255,255,255,.62); }

/* 7. Как добраться + 8. Футер ---------------------------------------------- */
.bottom { background: none; }
.route { padding: 88px var(--pad-x) 120px; }
.route__head { position: relative; }

/* Как на конференции: карта слева, плашки с подробностями справа */
.route__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 36px; align-items: start; margin-top: 60px; }
.map { position: relative; display: block; border-radius: 32px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 30px 90px rgba(0,0,0,.4); }
.map img { width: 100%; height: auto; transition: transform .6s ease; }
.map:hover img { transform: scale(1.02); }
.map__hint { position: absolute; right: 20px; bottom: 20px; padding: 12px 22px; border-radius: 999px; background: var(--green); color: var(--ink); font-size: 16px; font-weight: 700; box-shadow: 0 8px 26px rgba(0,0,0,.35); }
/* Ориентиры и метка катка поверх 3D-карты */
.map__label { position: absolute; transform: translate(-50%, -50%); padding: 6px 12px; border-radius: 999px; background: rgba(0,15,3,.72); border: 1px solid rgba(255,255,255,.18); font-size: 13px; font-weight: 500; color: rgba(255,255,255,.85); white-space: nowrap; pointer-events: none; }
.map__pin { position: absolute; display: flex; flex-direction: column; align-items: center; transform: translate(-50%, -100%); pointer-events: none; }
.map__pin b { order: -1; margin-bottom: 8px; padding: 8px 14px; border-radius: 12px; background: var(--green); color: var(--ink); font-size: 15px; font-weight: 700; white-space: nowrap; box-shadow: 0 8px 24px rgba(0,0,0,.4); }
.map__pin i { width: 18px; height: 18px; border-radius: 50%; background: var(--green); border: 3px solid #FFFFFF; box-shadow: 0 0 0 8px rgba(27,219,12,.3), 0 0 30px rgba(27,219,12,.8); }
.route__list { display: grid; gap: 12px; }
.route__item { padding: 24px 28px; border-radius: 24px; }
.route__item dt { font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--green); }
.route__item dd { margin-top: 10px; font-size: 20px; line-height: 29px; }
.route__item dd strong { font-weight: 700; }
.metro-way { display: flex; align-items: center; gap: 12px; }
.metro-way + .metro-way { margin-top: 10px; }
/* Время пешком: Яндекс Карты, проверено 10.11.2026 */
.metro-time { margin-left: auto; padding-left: 12px; font-size: 16px; color: rgba(255,255,255,.6); white-space: nowrap; }
.metro-line { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-size: 14px; font-weight: 700; color: #FFFFFF; }

/* KV футера растворяется сверху в прозрачность: свечения над ним переходят без ступеньки */
.footer { height: 847px; padding: 346px 160px 60px; background: none; overflow: hidden; }
.footer::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url(img/footer-kv.jpg) center/cover;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 240px); mask-image: linear-gradient(180deg, transparent 0, #000 240px); }
.footer__row { display: flex; justify-content: space-between; align-items: flex-start; margin-top: 32px; padding-top: 36px; }
.footer__legal { font-size: 18px; color: rgba(255,255,255,.8); }
.footer__legal small { display: block; margin-top: 18px; font-size: 14px; }
.footer__links { display: flex; gap: 36px; font-size: 18px; font-weight: 500; color: rgba(255,255,255,.8); }
.footer__links a:hover { color: #FFFFFF; }
/* Юридическое: оператор ПДн и документы */
.footer__docs { margin-top: 28px; font-size: 14px; line-height: 20px; color: rgba(255,255,255,.6); }
.footer__docs span { display: flex; flex-wrap: wrap; gap: 8px 32px; margin-top: 8px; }
.footer__docs a { color: rgba(255,255,255,.8); text-decoration: underline; text-underline-offset: 3px; }
.footer__docs a:hover { color: #FFFFFF; }
.reg__legal { margin-top: 16px; font-size: 13px; line-height: 18px; color: rgba(255,255,255,.55); }
.reg__legal a, .cookie a { color: rgba(255,255,255,.85); text-decoration: underline; text-underline-offset: 3px; }

/* Баннер cookie: тёмное стекло, как меню в шапке */
.cookie { position: fixed; z-index: 50; left: 50%; bottom: 24px; transform: translateX(-50%); width: min(960px, calc(100% - 32px));
  display: flex; align-items: center; gap: 24px; padding: 20px 24px; border-radius: 24px;
  background: rgba(5,33,15,.88); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(14px); box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.cookie[hidden] { display: none; }
.cookie p { flex: 1; font-size: 14px; line-height: 20px; color: rgba(255,255,255,.8); }
.cookie__btns { display: flex; gap: 10px; flex: none; }
.cookie .btn { height: 44px; padding: 0 22px; font-size: 15px; cursor: pointer; font-family: inherit; background-clip: padding-box; }
.cookie .btn--ghost { background: none; }
.cookie .btn--green { border: 0; }

/* Широкие экраны: края KV и концы нитей растворяются в фоне, без резких границ */
@media (min-width: 1441px) {
  .hero__kv {
    -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent 100%), linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(180deg, #000 72%, transparent 100%), linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
    mask-composite: intersect; }
  .footer::before {
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 240px), linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(180deg, transparent 0, #000 240px), linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
    mask-composite: intersect; }
  .strand { -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
}

/* Адаптив --------------------------------------------------------------------
   Десктоп 1440 выше не трогаем. Декор (свечения, блики, звёзды) стоит в px по сетке 1440,
   поэтому на узких экранах уменьшаем его через zoom: координаты и размеры сжимаются пропорционально */
.spark--m { display: none; }
/* Блики только для планшета */
.spark--t { display: none; }
.nw { white-space: nowrap; }
/* Принудительный перенос строки в заголовке, только на телефоне */
.br-m { display: none; }

/* Планшет и небольшие ноутбуки */
@media (max-width: 1279px) {
  :root { --pad-x: 40px; }
  .glow, .kvs, .spark, .hang { zoom: .71; }
  .spark--d { display: none; }
  .spark--t { display: block; }
  .display { font-size: 96px; line-height: 94px; }
  .about { padding-bottom: 24px; }
  /* Кнопка в хедере дублирует «Зарегистрироваться» в обложке */
  .header .btn { display: none; }

  .hero { height: 74vw; }
  .hero { --kv-h: 70.8vw; }
  .hero__info { top: 50.6vw; gap: 1.4vw; }
  .hero__sub { font-size: 2.9vw; line-height: 1.1; }
  .meta-big { font-size: 2.1vw; line-height: 1.2; gap: .8vw; }
  .meta-big svg { width: 2.1vw; height: 2.1vw; }
  .timer { top: 57vw; gap: 18px; }
  .timer__unit { min-width: 84px; }
  .timer__n { font-size: clamp(44px, 5.6vw, 80px); line-height: 1; }
  .timer__sep { font-size: 36px; line-height: 1.2; }
  .hero__cta { top: 67.4vw; }
  .hero__cta .btn { height: 52px; font-size: 18px; }

  .statement { column-gap: 22px; }
  .when-where { margin-top: 44px; gap: 20px 48px; }
  .when-where dd { font-size: 40px; line-height: 44px; }
  .pill { zoom: .75; }
  .about__row { min-height: 0; padding-left: 0; gap: 40px; margin-top: 56px; }
  .about__gift { position: static; flex: none; width: 34%; }
  .about__story { width: auto; flex: 1; }
  .about__story p { font-size: 28px; line-height: 38px; }

  .program__head { margin-left: 0; }
  .program__story { font-size: 26px; line-height: 36px; }
  .table { margin-top: 64px; }
  .row { height: 96px; }
  .row__time { width: auto; flex: 1; font-size: 64px; line-height: 1; }

  .reg, .fund { --sl: -3.5vw; --st: -3.5vw; --sw: 107vw; }
  .reg { padding-top: 200px; }
  .reg__row { flex-direction: column; align-items: center; gap: 48px; margin-top: 64px; }
  .reg__left, .reg__right { width: 100%; max-width: 656px; }
  .stand { width: 100%; }
  .step__t { font-size: 40px; line-height: 44px; }

  .fund { padding-top: 180px; }
  .fundcard { margin-top: 48px; padding: 48px 40px 44px; grid-template-columns: minmax(0, 1fr) 220px; gap: 36px; }
  .fundcard__stats { padding-left: 36px; }
  .stat dt { font-size: 48px; }
  .stat dd { font-size: 16px; line-height: 22px; }
  .fundcard h3 { font-size: 34px; line-height: 40px; }

  .faq__q3d { zoom: .75; }
  .acc summary h3 { width: auto; flex: 1; font-size: 36px; line-height: 44px; }
  .acc p { width: auto; max-width: 760px; font-size: 20px; line-height: 30px; }

  .route__grid { gap: 24px; margin-top: 48px; }
  .route__item dd { font-size: 18px; line-height: 27px; }

  .footer { height: auto; padding: 300px var(--pad-x) 56px; }
}

/* Меню не помещается рядом с логотипом и кнопкой */
@media (max-width: 1199px) {
  .nav { display: none; }
}

/* Узкий планшет: обложка выше, чтобы таймер и кнопки не наезжали на логотип KV */
@media (min-width: 768px) and (max-width: 1023px) {
  .hero { height: 780px; }
  .hero { --kv-h: 740px; }
  .hero__info { top: 524px; gap: 12px; }
  .hero__sub { font-size: 28px; }
  .meta-big { font-size: 20px; gap: 8px; }
  .meta-big svg { width: 22px; height: 22px; }
  .timer { top: 586px; }
  .hero__cta { top: 694px; }
  .kvs:not(.kvs--tw) { display: none; }
}

@media (max-width: 899px) {
  .route__grid { grid-template-columns: 1fr; }
  .fundcard { grid-template-columns: 1fr; }
  .fundcard__stats { grid-template-columns: 1fr 1fr; padding: 28px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.18); }
  .about__row { flex-direction: column; align-items: flex-start; }
  .about__gift { width: 300px; align-self: center; }
}

/* Телефон */
@media (max-width: 767px) {
  :root { --pad-x: 20px; }
  .glow { zoom: .42; }
  .kvs, .spark { display: none; }
  .spark--m { display: block; zoom: 1; }
  .hang { zoom: .4; }
  .display { font-size: 58px; line-height: 58px; letter-spacing: -.04em; }

  .header { height: 44px; margin: 20px var(--pad-x) 0; }
  .header__logo { width: 140px; height: 37px; }
  .header .btn { height: 40px; padding: 0 16px; font-size: 14px; }

  .hero { height: 820px; }
  .hero { --kv-h: 600px; }
  .hero__shade { height: 200px; }
  .hero__info { top: 428px; gap: 14px; }
  .hero__sub { font-size: 22px; line-height: 26px; }
  .hero__meta { flex-direction: column; gap: 8px; }
  .meta-big { font-size: 20px; line-height: 26px; gap: 10px; }
  .meta-big svg { width: 22px; height: 22px; }
  .timer { top: 532px; gap: 6px; }
  .timer__unit { min-width: 60px; }
  .timer__n { font-size: 40px; }
  .timer__l { margin-top: 6px; font-size: 10px; letter-spacing: .1em; }
  .timer__sep { font-size: 24px; line-height: 40px; }
  .hero__cta { top: 628px; flex-direction: column; align-items: center; gap: 10px; }
  .hero__cta .btn { width: 280px; height: 52px; font-size: 17px; }

  .about { padding-top: 40px; }
  .statement { column-gap: 10px; row-gap: 2px; font-size: 40px; line-height: 44px; }
  .when-where { flex-direction: column; gap: 18px; margin-top: 28px; }
  .when-where dt { font-size: 12px; }
  .when-where dd { margin-top: 6px; font-size: 28px; line-height: 32px; }
  .pill { zoom: .4; }
  /* игрушка после «страны,» переезжает в начало строки «который» */
  .statement .br-m { display: block; flex-basis: 100%; height: 0; }
  .about__row { margin-top: 32px; gap: 24px; }
  .about__gift { width: 220px; margin: -24px 0 -40px; }
  .about__story p { font-size: 21px; line-height: 29px; }
  .about__story .btn { margin-top: 24px; height: 52px; font-size: 17px; padding: 0 24px; }

  .program { padding: 64px var(--pad-x) 72px; }
  .program__story { margin-top: 18px; font-size: 20px; line-height: 28px; }
  .table { margin-top: 36px; }
  .row { height: 76px; gap: 12px; background-size: 9px 2px; }
  .row__time { font-size: 29px; letter-spacing: -.02em; white-space: nowrap; }
  .row__status .btn { height: 44px; padding: 0 16px; font-size: 15px; }

  /* нить шире экрана; сдвиг подобран так, чтобы игрушка попала в кадр */
  .reg { --sl: -50vw; --st: -6vw; --sw: 160vw; }
  .reg__side--r { display: none; }
  .fund { --sl: -4vw; --st: -6vw; --sw: 160vw; }
  .reg { padding: 200px var(--pad-x) 72px; }
  .reg__row { gap: 32px; margin-top: 32px; }
  .step { padding: 22px 0; }
  .step__t { font-size: 28px; line-height: 32px; }
  .step__d { margin-top: 8px; font-size: 17px; line-height: 25px; }
  .stand { padding: 0 8px 8px; border-radius: 32px; }
  .stand__head { padding: 22px 12px 16px; }
  .stand__title { font-size: 28px; line-height: 32px; }
  .afisha { padding: 22px 18px; border-radius: 24px; }
  .afisha h3 { font-size: 19px; line-height: 24px; }
  .afisha__chips { flex-wrap: wrap; }
  .addcal__row { flex-wrap: wrap; justify-content: center; }

  /* заголовок ниже луны: луна растёт вместе с шириной экрана */
  .fund { padding: max(150px, 46vw) var(--pad-x) 72px; }
  .fund__titles { padding-top: 24px; }
  .fundcard { margin-top: 32px; padding: 36px 20px 28px; border-radius: 28px; gap: 28px; }
  .fundcard__stats { gap: 16px; padding-top: 24px; }
  .stat dt { font-size: 36px; }
  .stat dd { font-size: 14px; line-height: 19px; }
  .map__label { font-size: 10px; padding: 3px 8px; }
  .map__pin b { font-size: 12px; padding: 5px 10px; margin-bottom: 5px; }
  .map__pin i { width: 12px; height: 12px; border-width: 2px; box-shadow: 0 0 0 5px rgba(27,219,12,.3); }
  .fundcard__logo { width: 200px; margin-bottom: 20px; }
  .fundcard h3 { font-size: 24px; line-height: 30px; }
  .fundcard p { margin-top: 14px; font-size: 16px; line-height: 24px; }
  .fundcard__actions { margin-top: 28px; width: 100%; }
  .fundcard__actions .btn { width: 100%; height: 56px; font-size: 18px; }

  .faq { padding: 64px var(--pad-x) 72px; }
  .faq__head { padding-top: 0; }
  .faq__q3d { zoom: .5; }
  .acc { margin-top: 28px; }
  .acc details { padding: 22px 0; }
  .acc summary { gap: 16px; }
  .acc summary h3 { font-size: 22px; line-height: 28px; letter-spacing: -.01em; }
  .acc .tg { width: 44px; height: 44px; font-size: 24px; }
  .acc p { margin-top: 12px; font-size: 16px; line-height: 24px; }

  .route { padding: 64px var(--pad-x) 72px; }
  .route__grid { margin-top: 28px; gap: 16px; }
  .map { border-radius: 24px; }
  .map__hint { right: 12px; bottom: 12px; padding: 10px 16px; font-size: 14px; }
  .route__item { padding: 20px; border-radius: 20px; }
  .route__item dd { font-size: 17px; line-height: 25px; }
  .metro-time { font-size: 14px; }

  .footer { padding: 200px var(--pad-x) 40px; }
  .footer::before { background-size: auto 100%; }
  .footer__row { flex-direction: column; gap: 24px; padding-top: 24px; }
  .footer__legal { font-size: 16px; }
  .footer__links { flex-wrap: wrap; gap: 14px 24px; font-size: 16px; }
}

/* Юридическое и cookie на телефоне */
@media (max-width: 767px) {
  .footer__docs span { flex-direction: column; gap: 10px; margin-top: 12px; }
  .cookie { flex-direction: column; align-items: stretch; gap: 14px; bottom: 12px; padding: 16px; border-radius: 20px; }
  .cookie p { font-size: 13px; line-height: 18px; }
  .cookie .btn { flex: 1; }
}
