/* Шрифты лежат на самом сайте: без обращений к Google, которые в России бывают медленными */
@font-face { font-family: "Unbounded"; src: url("fonts/unbounded-cyr.woff2") format("woff2"); font-weight: 200 900; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Unbounded"; src: url("fonts/unbounded-lat.woff2") format("woff2"); font-weight: 200 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Golos Text"; src: url("fonts/golos-cyr.woff2") format("woff2"); font-weight: 400 900; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; src: url("fonts/golos-lat.woff2") format("woff2"); font-weight: 400 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Макет: ночное зимнее небо (60%) · снежные карточки и текст (30%) · красный только для заявки + золото для выделений (10%) */
:root {
  --night: #0A1838;      /* основа фона */
  --night-2: #112A5C;    /* второй уровень фона */
  --night-3: #1A3A7A;    /* рамки, плашки */
  --snow: #F5F8FF;       /* основной текст на тёмном, светлые карточки */
  --ice: #C8D7F4;        /* второстепенный текст на тёмном (контраст ~11:1) */
  --ink: #0A1838;        /* текст на светлом */
  --ink-2: #3B4C72;      /* второстепенный текст на светлом (контраст ~8:1) */
  --red: #E0202B;        /* ТОЛЬКО кнопки заявки и нос оленёнка */
  --red-hover: #FF3B45;
  --gold: #FFC93C;       /* выделения, акцентные слова, цифры */
  --gold-soft: rgba(255, 201, 60, .38);
  --display: "Unbounded", "Arial Black", Arial, sans-serif;
  --body: "Golos Text", "Segoe UI", Arial, sans-serif;
  --r: 22px;
  color-scheme: dark;
}

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--night);
  color: var(--snow);
  font: 400 clamp(16px, 1.05vw + 10px, 18px)/1.6 var(--body);
  overflow-x: hidden;
}
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 60; background: var(--night); }
* { box-sizing: border-box; }
img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 6px; }

#snow { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
main, .top, .foot { position: relative; z-index: 1; }

.wrap {
  max-width: 1200px; margin: 0 auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}
@media (min-width: 720px) { .wrap { padding-left: max(32px, env(safe-area-inset-left, 0px)); padding-right: max(32px, env(safe-area-inset-right, 0px)); } }

/* ---------- Типографика ---------- */
.eyebrow {
  margin: 0 0 14px; font: 700 13px/1.3 var(--body); letter-spacing: .14em; text-transform: uppercase; color: var(--gold);
  display: flex; align-items: center; gap: 10px;
}
.eyebrow::before { content: "✶"; font-size: 15px; letter-spacing: 0; }
.h2 {
  margin: 0 0 18px; font: 800 clamp(28px, 4.4vw, 56px)/1.08 var(--display); letter-spacing: -.02em; text-wrap: balance; max-width: 22ch;
}
.h2 em, .hero-title em { font-style: normal; color: var(--gold); }
.sub { margin: 0 0 40px; max-width: 62ch; color: var(--ice); font-size: 1.08em; }
h3 { font: 700 clamp(18px, 1.5vw, 21px)/1.25 var(--display); margin: 0 0 10px; letter-spacing: -.01em; text-wrap: balance; }

/* Выделение важного: золотой «маркер» снизу */
[hidden] { display: none !important; }
/* на тёмном: золотой текст + золотая черта под строкой */
mark {
  background: linear-gradient(transparent 88%, var(--gold) 88%) no-repeat 0 0 / 100% 100%;
  color: var(--gold); font-weight: 700; padding: 0 .04em; border-radius: 0;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
/* на светлых карточках: жёлтый маркер под нижней половиной строки, текст тёмный */
.plan mark, .inc mark, .faq mark, .why-card mark, .place mark { color: var(--ink); padding: 0 .08em; background-image: linear-gradient(transparent 52%, #FFD866 52%, #FFD866 96%, transparent 96%); }
.in mark, mark.in { animation: draw 1.1s .25s cubic-bezier(.6,.1,.2,1) both; }
@keyframes draw { from { background-size: 0 100%; } to { background-size: 100% 100%; } }

/* ---------- Кнопки ---------- */
.btn {
  --h: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: var(--h); padding: 0 24px; border-radius: 999px; border: 0; cursor: pointer;
  font: 700 16px/1.1 var(--body); text-decoration: none; text-align: center;
  transition: transform .2s, box-shadow .2s, background .2s;
}
.btn:hover { transform: translateY(-2px); }
.btn-sm { --h: 40px; padding: 0 18px; font-size: 15px; }
.btn-lg { --h: 60px; padding: 0 32px; font-size: 17px; }
.btn-block { width: 100%; }
.btn-red { background: var(--red); color: #fff; box-shadow: 0 10px 30px -8px rgba(224, 32, 43, .7), inset 0 -3px 0 rgba(0,0,0,.18); position: relative; overflow: hidden; }
.btn-red:hover { background: var(--red-hover); box-shadow: 0 14px 36px -8px rgba(255, 59, 69, .8); }
.btn-red::after { /* бегущий блик */
  content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.45) 50%, transparent 70%);
  transform: translateX(-120%); animation: shine 3.6s 1.5s infinite;
}
@keyframes shine { 0%, 70% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
.btn-ghost { background: transparent; color: var(--snow); box-shadow: inset 0 0 0 2px var(--gold); }
.btn-ghost:hover { background: rgba(255, 201, 60, .12); }
.btn-max { background: var(--snow); color: var(--ink); }

/* ---------- Шапка и гирлянда ---------- */
.top { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; background: rgba(10, 24, 56, .88); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid rgba(200, 215, 244, .14); }
.garland {
  height: 16px; position: relative; overflow: hidden;
  background: radial-gradient(circle at 50% -26px, transparent 30px, rgba(200,215,244,.35) 31px, transparent 32px) 0 0 / 46px 16px repeat-x;
}
.garland::before, .garland::after {
  content: ""; position: absolute; inset: 0; top: 3px;
  background:
    radial-gradient(circle 5px at 11px 6px, #FF4D57 90%, transparent) 0 0 / 92px 16px repeat-x,
    radial-gradient(circle 5px at 57px 6px, var(--gold) 90%, transparent) 0 0 / 92px 16px repeat-x;
  filter: drop-shadow(0 0 5px currentColor);
  animation: twinkle 1.4s steps(2) infinite;
}
.garland::after {
  background:
    radial-gradient(circle 5px at 34px 9px, #6FE3FF 90%, transparent) 0 0 / 92px 16px repeat-x,
    radial-gradient(circle 5px at 80px 9px, #8CFF9E 90%, transparent) 0 0 / 92px 16px repeat-x;
  animation-delay: .7s;
}
@keyframes twinkle { 0% { opacity: 1; } 50% { opacity: .25; } }
.top-row { display: flex; align-items: center; gap: 24px; min-height: 64px; }
.logo { display: flex; align-items: center; gap: 10px; text-decoration: none; flex-shrink: 0; }
.logo-star { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--gold); color: var(--ink); font-size: 22px; animation: spin 12s linear infinite; }
.logo-text { display: flex; flex-direction: column; line-height: 1; }
.logo-text b { font: 800 15px/1.1 var(--display); }
.logo-text i { font: 900 17px/1.1 var(--display); font-style: normal; color: var(--gold); letter-spacing: .12em; }
.nav { display: flex; gap: 22px; margin-left: auto; }
.nav a { text-decoration: none; font-weight: 600; color: var(--ice); font-size: 15px; }
.nav a:hover { color: var(--snow); }
.top-actions { display: flex; align-items: center; gap: 10px; }
.top-phone { font: 700 16px var(--body); text-decoration: none; white-space: nowrap; margin-right: 6px; }
@media (max-width: 1080px) { .nav { display: none; } .top-actions { margin-left: auto; } }
@media (max-width: 720px) { .top-phone, .top-actions .btn-max { display: none; } .top-row { min-height: 58px; } }

/* ---------- Первый экран ---------- */
.hero { padding-block: clamp(32px, 6vw, 80px) 40px; position: relative; overflow: hidden; }
.hero::before { /* северное сияние */
  content: ""; position: absolute; inset: -20% -10% auto; height: 90%; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 50% at 25% 30%, rgba(80, 140, 255, .35), transparent 70%), radial-gradient(40% 40% at 80% 20%, rgba(255, 201, 60, .18), transparent 70%);
  animation: aurora 12s ease-in-out infinite alternate;
}
@keyframes aurora { to { transform: translate3d(4%, 3%, 0) scale(1.08); } }
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.hero-copy { min-width: 0; }
.hero-title { margin: 0 0 22px; font-family: var(--display); letter-spacing: -.035em; line-height: .98; }
.ht-line { display: block; animation: rise .9s cubic-bezier(.2,.8,.2,1) both; }
.ht-line:nth-child(1) { font-size: clamp(40px, 5.8vw, 84px); font-weight: 900; }
.ht-and { font-size: clamp(28px, 4.2vw, 60px); font-weight: 800; color: var(--gold); animation-delay: .12s; }
.ht-small { font-size: clamp(22px, 3vw, 38px); font-weight: 700; letter-spacing: -.01em; margin-top: 10px; color: var(--ice); animation-delay: .24s; }
@keyframes rise { from { opacity: 0; transform: translateY(40px); } }
.lead { font-size: clamp(17px, 1.4vw, 21px); max-width: 52ch; margin: 0 0 30px; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 28px; }
.countdown { display: flex; flex-wrap: wrap; gap: 12px; }
.cd-item { display: flex; align-items: center; gap: 12px; padding: 10px 18px 10px 12px; border-radius: 18px; background: rgba(17, 42, 92, .75); border: 1px solid rgba(200, 215, 244, .2); }
.cd-item b { font: 800 30px/1 var(--display); color: var(--gold); min-width: 2ch; text-align: center; font-variant-numeric: tabular-nums; }
.cd-item span { font-size: 14px; line-height: 1.3; color: var(--ice); }
.hero-visual { position: relative; min-width: 0; }
.arch {
  max-width: 100%; border-radius: 32px; overflow: hidden; position: relative;
  box-shadow: 0 0 0 8px var(--night-2), 0 0 0 10px var(--gold), 0 30px 80px -20px rgba(0,0,0,.7);
  animation: float 7s ease-in-out infinite;
}
.arch img { width: 100%; height: auto; }
@keyframes float { 50% { transform: translateY(-12px); } }
.badge-spin { position: absolute; left: -24px; bottom: 30px; width: 132px; height: 132px; border-radius: 50%; background: var(--gold); color: var(--ink); display: grid; place-items: center; box-shadow: 0 16px 40px -10px rgba(0,0,0,.6); }
.badge-spin svg { position: absolute; inset: 0; animation: spin 16s linear infinite; }
.badge-spin text { font: 700 10.5px var(--body); letter-spacing: .1em; text-transform: uppercase; fill: var(--ink); }
.badge-spin span { font: 900 34px/1 var(--display); text-align: center; }
.badge-spin small { display: block; font: 700 12px var(--body); text-transform: uppercase; letter-spacing: .1em; }
@keyframes spin { to { transform: rotate(360deg); } }

.stats { list-style: none; padding: 0; margin: clamp(40px, 6vw, 72px) 0 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; border-radius: var(--r); overflow: hidden; }
.stats li { background: rgba(17, 42, 92, .8); padding: 24px 22px; display: flex; flex-direction: column; gap: 6px; }
.stats b { font: 900 clamp(32px, 4vw, 52px)/1 var(--display); color: var(--gold); font-variant-numeric: tabular-nums; letter-spacing: -.03em; }
.stats span { color: var(--ice); font-size: 15px; line-height: 1.35; }

@media (max-width: 860px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-visual { max-width: 400px; justify-self: center; width: 100%; }
  .ht-line:nth-child(1) { font-size: clamp(40px, 11vw, 76px); }
  .ht-and { font-size: clamp(28px, 8vw, 56px); }
  .arch { border-radius: 26px; }
  .badge-spin { width: 104px; height: 104px; left: -6px; bottom: 6px; }
  .badge-spin span { font-size: 26px; }
  .stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) { .hero-cta .btn { width: 100%; } }

/* ---------- Бегущая строка ---------- */
.ticker { position: relative; z-index: 1; background: var(--gold); color: var(--ink); overflow: hidden; transform: rotate(-1.5deg); margin: 20px -10px; padding-block: 12px; }
.ticker-track { display: flex; width: max-content; animation: tick 28s linear infinite; }
.ticker span { font: 900 clamp(20px, 3vw, 34px)/1 var(--display); text-transform: uppercase; white-space: nowrap; padding-right: .5em; }
@keyframes tick { to { transform: translateX(-50%); } }

/* ---------- Общие секции ---------- */
.sec { padding-block: clamp(64px, 9vw, 120px); position: relative; }
.sec-deep { background: linear-gradient(180deg, var(--night-2), var(--night)); }
.center { display: flex; justify-content: center; margin-top: 40px; }

/* Появление блоков: видны по умолчанию; скрываются только те, что ниже экрана, и проявляются при прокрутке */
.rv { transition: opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1); }
.rv.wait { opacity: 0; transform: translateY(36px) scale(.98); }

/* Почему по-настоящему */
.why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.why-photo { grid-row: span 2; margin: 0; align-self: center; border-radius: var(--r); overflow: hidden; }
.why-photo img { width: 100%; height: auto; }
.why-card { background: var(--snow); color: var(--ink); border-radius: var(--r); padding: 28px; position: relative; }
.why-card p { margin: 0; color: var(--ink-2); }
.ico { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--night); color: var(--gold); font-size: 22px; margin-bottom: 16px; }
@media (max-width: 960px) { .why-grid { grid-template-columns: 1fr 1fr; } .why-photo { grid-row: auto; grid-column: 1 / -1; max-width: 560px; justify-self: center; } }
@media (max-width: 560px) { .why-grid { grid-template-columns: 1fr; } }

/* Шаги */
.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; position: relative; }
.steps::before { content: ""; position: absolute; left: 4%; right: 4%; top: 34px; border-top: 3px dashed rgba(255, 201, 60, .55); }
.steps li { position: relative; padding: 0 4px; }
.num {
  position: relative; display: grid; place-items: center; width: 68px; height: 68px; margin-bottom: 18px;
  font: 900 28px/1 var(--display); color: var(--ink); background: var(--gold); border-radius: 50%;
  box-shadow: 0 0 0 8px var(--night-2), 0 0 30px rgba(255, 201, 60, .55);
}
.steps p { margin: 0; color: var(--ice); font-size: 16px; }
@media (max-width: 960px) {
  .steps { grid-template-columns: 1fr; gap: 26px; }
  .steps::before { left: 33px; right: auto; top: 10px; bottom: 10px; border-top: 0; border-left: 3px dashed rgba(255, 201, 60, .55); }
  .steps li { display: grid; grid-template-columns: 68px 1fr; column-gap: 20px; }
  .steps .num { grid-row: span 2; margin: 0; }
}

/* Цены */
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.plan {
  background: var(--snow); color: var(--ink); border-radius: 28px; padding: 30px 28px 28px; display: flex; flex-direction: column; gap: 16px; position: relative;
  transition: transform .3s, box-shadow .3s;
}
.plan:hover { transform: translateY(-6px) rotate(-.4deg); box-shadow: 0 30px 60px -20px rgba(0,0,0,.6); }
.plan::before { /* «билет»: вырезы по бокам */
  content: ""; position: absolute; left: -12px; right: -12px; top: 118px; height: 24px;
  background: radial-gradient(circle 12px at 0 50%, var(--night) 98%, transparent) left / 50% 100% no-repeat, radial-gradient(circle 12px at 100% 50%, var(--night) 98%, transparent) right / 50% 100% no-repeat;
}
.plan header { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; min-height: 88px; border-bottom: 2px dashed #C8D2E8; padding-bottom: 18px; }
.plan h3 { font-size: clamp(24px, 2.4vw, 30px); margin: 0; }
.dur { font: 700 14px var(--body); background: var(--night); color: var(--gold); padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
.plan-desc { margin: 0; color: var(--ink-2); min-height: 3.2em; }
.checks { list-style: none; padding: 0; margin: 0 0 auto; display: grid; gap: 8px; }
.checks li { padding-left: 32px; position: relative; font-weight: 500; }
.checks li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 22px; height: 22px; border-radius: 50%; background: var(--night); color: var(--gold); display: grid; place-items: center; font-size: 13px; font-weight: 800; }
.price { margin: 8px 0 0; font: 900 clamp(38px, 4vw, 50px)/1 var(--display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.price small { font: 700 18px var(--body); color: var(--ink-2); letter-spacing: 0; }
.price span { color: var(--night-3); }
.plan-mid { background: linear-gradient(180deg, #FFF6D9, var(--snow) 40%); box-shadow: 0 0 0 3px var(--gold), 0 24px 60px -20px rgba(255, 201, 60, .5); }
.notes { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 26px; }
.notes p { margin: 0; display: flex; gap: 14px; align-items: flex-start; padding: 20px 22px; border-radius: 18px; background: rgba(17, 42, 92, .85); border: 1px solid rgba(200, 215, 244, .2); }
.note-ico { flex: 0 0 30px; height: 30px; border-radius: 50%; background: var(--gold); color: var(--ink); display: grid; place-items: center; font-weight: 900; }
@media (max-width: 960px) { .plans { grid-template-columns: 1fr; max-width: 520px; margin-inline: auto; } .notes { grid-template-columns: 1fr; } .plan-desc { min-height: 0; } .plan header { min-height: 0; } .plan::before { display: none; } }

/* Что входит */
.sec-gold { background: radial-gradient(80% 60% at 50% 0%, rgba(255, 201, 60, .14), transparent 70%); }
.inc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 36px; }
.inc { background: var(--snow); color: var(--ink); border-radius: var(--r); padding: 26px 24px; border-top: 6px solid var(--gold); }
.inc p { margin: 0; color: var(--ink-2); }
.inc-final { margin: 36px 0 0; font: 800 clamp(20px, 2.4vw, 30px)/1.25 var(--display); text-align: center; color: var(--gold); text-wrap: balance; }
@media (max-width: 960px) { .inc-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .inc-grid { grid-template-columns: 1fr; } }

/* Места */
.places { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.place { background: var(--snow); color: var(--ink); border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; transition: transform .3s; }
.place:hover { transform: translateY(-6px); }
.place img { width: 100%; height: auto; }
.place-body { padding: 22px 24px 26px; }
.place-body p { margin: 0; color: var(--ink-2); }
.tag { display: inline-block; font: 700 12px var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--night-3); margin-bottom: 8px; }
@media (max-width: 900px) { .places { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; } }

/* Дополнительно */
.extras-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(24px, 5vw, 72px); align-items: start; }
.extras { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.extras li { padding: 20px 22px 20px 66px; border-radius: 18px; background: rgba(245, 248, 255, .06); border: 1px solid rgba(200, 215, 244, .2); position: relative; transition: background .25s, border-color .25s; }
.extras li:hover { background: rgba(255, 201, 60, .1); border-color: var(--gold); }
.extras li::before { content: "+"; position: absolute; left: 18px; top: 18px; width: 32px; height: 32px; border-radius: 50%; background: var(--gold); color: var(--ink); display: grid; place-items: center; font: 900 20px/1 var(--display); }
.extras h3 { font-size: 18px; margin-bottom: 4px; }
.extras p { margin: 0; color: var(--ice); font-size: 16px; }
@media (max-width: 900px) { .extras-grid { grid-template-columns: 1fr; } }

/* Фото */
.polaroids { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; padding-top: 10px; }
.pol { margin: 0; background: var(--snow); color: var(--ink); padding: 12px 12px 18px; border-radius: 6px; box-shadow: 0 24px 50px -16px rgba(0,0,0,.7); transition: transform .4s; }
.pol:nth-child(1) { transform: rotate(-3deg); }
.pol:nth-child(2) { transform: rotate(2deg) translateY(18px); }
.pol:nth-child(3) { transform: rotate(-1.5deg); }
.pol:hover { transform: rotate(0) scale(1.04); z-index: 2; }
.pol img { width: 100%; height: auto; border-radius: 3px; }
.pol figcaption { font: 600 16px/1.35 var(--body); padding-top: 12px; text-align: center; }
@media (max-width: 760px) { .polaroids { grid-template-columns: 1fr; max-width: 380px; margin-inline: auto; } .pol:nth-child(2) { transform: rotate(2deg); } }

/* Отзывы — «телефоны» */
.reviews { display: flex; gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 10px 4px 26px; scrollbar-color: var(--gold) transparent; }
.phone {
  flex: 0 0 auto; width: clamp(210px, 22vw, 250px); padding: 9px; align-self: flex-start; border: 0; cursor: zoom-in; scroll-snap-align: start;
  border-radius: 34px; background: #05102A; box-shadow: 0 0 0 2px var(--night-3), 0 24px 50px -16px rgba(0,0,0,.8); transition: transform .3s;
}
.phone:hover { transform: translateY(-8px) rotate(-1deg); }
.phone img { width: 100%; height: auto; border-radius: 26px; }
.lightbox { border: 0; padding: 0; background: transparent; max-width: min(92vw, 460px); max-height: 92vh; overflow: visible; }
.lightbox::backdrop { background: rgba(5, 12, 30, .85); }
.lightbox img { max-height: 88vh; width: auto; border-radius: 22px; }
.lb-close { position: absolute; top: -14px; right: -14px; width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--gold); color: var(--ink); font-size: 18px; font-weight: 800; cursor: pointer; }

/* FAQ */
.faq-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(24px, 5vw, 72px); align-items: start; }
.faq { display: grid; gap: 10px; }
.faq details { background: var(--snow); color: var(--ink); border-radius: 18px; overflow: hidden; }
.faq summary { list-style: none; cursor: pointer; padding: 20px 64px 20px 22px; font: 700 17px/1.35 var(--body); position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 18px; top: 50%; translate: 0 -50%; width: 32px; height: 32px; border-radius: 50%; background: var(--night); color: var(--gold); display: grid; place-items: center; font: 800 20px/1 var(--display); transition: rotate .3s; }
.faq details[open] summary::after { rotate: 45deg; }
.faq p { margin: 0; padding: 0 22px 22px; color: var(--ink-2); }
@media (max-width: 900px) { .faq-grid { grid-template-columns: 1fr; } }

/* Заявка */
.sec-order { background: radial-gradient(70% 70% at 80% 30%, rgba(224, 32, 43, .18), transparent 70%), linear-gradient(180deg, var(--night), var(--night-2)); }
.order-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.contacts { display: grid; gap: 12px; }
.contact { display: grid; gap: 2px; padding: 16px 20px; border-radius: 16px; background: rgba(245, 248, 255, .06); border: 1px solid rgba(200, 215, 244, .2); }
.contact span { font: 700 12px var(--body); text-transform: uppercase; letter-spacing: .12em; color: var(--ice); }
.contact a, .contact p { font: 800 20px/1.3 var(--display); text-decoration: none; margin: 0; user-select: all; }
.contact p.todo { font: 500 16px var(--body); user-select: auto; }
.todo { color: var(--gold); text-decoration: underline dashed 1px; text-underline-offset: 3px; }
.form { background: var(--snow); color: var(--ink); border-radius: 30px; padding: clamp(24px, 3vw, 40px); display: grid; gap: 6px; box-shadow: 0 0 0 3px var(--gold), 0 40px 80px -30px rgba(0,0,0,.8); position: relative; }
.form h3 { font-size: clamp(24px, 2.6vw, 32px); margin: 0; }
.form-sub { margin: 0 0 12px; color: var(--ink-2); }
.form label { font-weight: 700; font-size: 15px; margin-top: 8px; }
.form input[type="text"], .form input[type="tel"], .form select {
  width: 100%; min-height: 54px; padding: 0 18px; border-radius: 14px; border: 2px solid #C8D2E8; background: #fff; color: var(--ink);
  font: 500 17px var(--body); color-scheme: light; transition: border-color .2s, box-shadow .2s;
}
.form input::placeholder { color: #6D7A99; }
.form input:focus, .form select:focus { outline: none; border-color: var(--night-3); box-shadow: 0 0 0 4px rgba(26, 58, 122, .18); }
.form .invalid { border-color: var(--red) !important; }
.agree { display: flex !important; gap: 12px; align-items: flex-start; font-weight: 500 !important; margin: 14px 0 10px !important; cursor: pointer; }
.agree input { width: 22px; height: 22px; accent-color: var(--night-3); flex-shrink: 0; margin: 1px 0 0; }
.agree .todo { color: var(--night-3); }
.form-error { margin: 0 0 8px; color: #B0101A; font-weight: 700; }
.form-legal { margin: 8px 0 0; font-size: 13px; color: var(--ink-2); text-align: center; }
.form-ok { position: absolute; inset: 0; border-radius: 30px; background: var(--snow); display: grid; place-content: center; text-align: center; gap: 10px; padding: 32px; }
.form-ok b { font: 800 26px/1.2 var(--display); color: var(--ink); }
.form-ok p { margin: 0; color: var(--ink-2); }
@media (max-width: 900px) { .order-grid { grid-template-columns: 1fr; } }

/* Подвал */
.foot { padding-block: 40px 120px; border-top: 1px solid rgba(200, 215, 244, .14); background: var(--night); }
.foot-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; color: var(--ice); font-size: 15px; }
.foot-row p { margin: 0; }
.to-top { margin-left: auto; font-weight: 700; color: var(--gold); text-decoration: none; }
@media (min-width: 721px) { .foot { padding-bottom: 40px; } }

/* Нижняя панель на телефоне */
.mbar { display: none; }
@media (max-width: 720px) {
  .mbar {
    position: fixed; z-index: 70; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1fr 1.6fr; gap: 8px;
    padding: 10px max(12px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
    background: rgba(10, 24, 56, .95); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid rgba(200, 215, 244, .2);
  }
  .mbar a { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; border-radius: 14px; text-decoration: none; font-weight: 700; font-size: 15px; background: rgba(245, 248, 255, .1); }
  .mbar a.mbar-cta { background: var(--red); color: #fff; }
}

/* Всплывающая подсказка */
.toast { position: fixed; z-index: 90; left: 50%; bottom: calc(90px + env(safe-area-inset-bottom, 0px)); translate: -50% 0; max-width: calc(100% - 32px); background: var(--snow); color: var(--ink); padding: 12px 20px; border-radius: 14px; font-weight: 600; box-shadow: 0 16px 40px -10px rgba(0,0,0,.6); text-align: center; }

/* ---------- Оленёнок Огонёк ---------- */
#deer { position: fixed; left: 0; top: 0; z-index: 40; width: var(--deer, 116px); cursor: pointer; will-change: transform; filter: drop-shadow(0 12px 18px rgba(0,0,0,.45)); touch-action: manipulation; }
#deer.hide { opacity: 0; }
.deer-bob { animation: bob 2.6s ease-in-out infinite; }
#deer.flying .deer-bob { animation: none; }
@keyframes bob { 50% { transform: translateY(-6px); } }
.deer-svg { display: block; width: 100%; height: auto; overflow: visible; }
.deer-svg .head { transform-box: view-box; transform-origin: 100px 170px; transition: transform .25s; }
.deer-svg .pupil { transition: transform .08s linear; }
.deer-svg .lid { transform-box: fill-box; transform-origin: center top; transform: scaleY(0); transition: transform .12s ease-in; }
.deer-svg .eye.shut .lid { transform: scaleY(1); }
.deer-svg .brow { transition: transform .15s; }
#deer.wink-l .brow-l, #deer.wink-r .brow-r { transform: translateY(5px); }
#deer.happy .mouth { d: path("M84 155 Q100 175 116 155"); }
.deer-svg .nose { transform-box: fill-box; transform-origin: center; animation: nose 1.8s ease-in-out infinite; }
@keyframes nose { 0%, 100% { filter: drop-shadow(0 0 4px #FF2D38); } 50% { filter: drop-shadow(0 0 16px #FF2D38) drop-shadow(0 0 28px rgba(255, 45, 56, .7)); transform: scale(1.06); } }
.deer-svg .ears ellipse { transform-box: fill-box; transform-origin: center; }
#deer:hover .deer-svg .ears { animation: wiggle .5s ease-in-out 2; }
@keyframes wiggle { 50% { transform: rotate(-4deg); } }
.deer-bubble {
  position: absolute; bottom: 100%; margin-bottom: 6px; width: max-content; max-width: 220px; padding: 10px 14px; border-radius: 16px;
  background: var(--snow); color: var(--ink); font: 700 14px/1.3 var(--body); box-shadow: 0 10px 30px -8px rgba(0,0,0,.6);
  opacity: 0; transform: translateY(8px) scale(.9); transition: opacity .25s, transform .25s; pointer-events: none;
}
.deer-bubble::after { content: ""; position: absolute; top: 100%; width: 14px; height: 14px; background: var(--snow); transform: translateY(-7px) rotate(45deg); }
#deer.side-left .deer-bubble { left: 30%; }
#deer.side-left .deer-bubble::after { left: 18px; }
#deer.side-right .deer-bubble { right: 30%; }
#deer.side-right .deer-bubble::after { right: 18px; }
#deer.talk .deer-bubble { opacity: 1; transform: none; }
.spark { position: fixed; z-index: 39; pointer-events: none; color: var(--gold); font-size: 16px; line-height: 1; text-shadow: 0 0 8px var(--gold); animation: spark .9s ease-out forwards; }
@keyframes spark { to { opacity: 0; transform: translateY(14px) scale(.3) rotate(90deg); } }
@media (max-width: 1400px) { #deer { --deer: 96px; } }
@media (max-width: 720px) { #deer { --deer: 70px; } .deer-bubble { max-width: 170px; font-size: 13px; } }

/* ---------- Снег на рогах ---------- */
.deer-svg .snowcap path { fill: #fff; stroke: #CFE0FA; stroke-width: 1.2; }
.deer-svg .snowfall circle { fill: #fff; stroke: #BFD4F6; stroke-width: .8; opacity: 0; }
#deer.shake .snowfall circle { animation: flakeoff 1.1s ease-in forwards; }
#deer.shake .snowfall circle:nth-child(2) { animation-delay: .12s; }
#deer.shake .snowfall circle:nth-child(3) { animation-delay: .22s; }
#deer.shake .snowfall circle:nth-child(4) { animation-delay: .3s; }
@keyframes flakeoff { 0% { opacity: 1; transform: translate(0, 0); } 100% { opacity: 0; transform: translate(6px, 46px); } }

/* ---------- Логотип (как на ksbravostyle.ru: красный круг со снежинкой) ---------- */
.lg-mark { width: 44px; height: 44px; flex-shrink: 0; }
.lg-text { display: flex; flex-direction: column; font: 900 15px/1 var(--display); text-transform: uppercase; letter-spacing: -.01em; color: var(--ink); }
.lg-text small { font: 800 9px/1 var(--body); letter-spacing: .2em; color: var(--red); margin-bottom: 3px; }
.lg-text i { font-style: normal; color: var(--red); }

/* ---------- Блок основателей ---------- */
.founders { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(24px, 5vw, 64px); align-items: center; }
.founders-photo { margin: 0; border-radius: 28px; overflow: hidden; box-shadow: 0 0 0 8px #fff, 0 0 0 10px var(--gold), 0 30px 70px -24px rgba(10, 24, 56, .45); }
.founders-photo img { width: 100%; height: auto; }
.founders-names { display: grid; gap: 12px; margin: 24px 0 0; }
.founders-names div { padding: 16px 20px; border-radius: 18px; background: #fff; border: 1px solid #DCE6F7; }
.founders-names b { display: block; font: 800 19px/1.25 var(--display); }
.founders-names span { color: var(--ink-2); font-size: 15px; }
@media (max-width: 900px) { .founders { grid-template-columns: 1fr; } .founders-photo { max-width: 460px; justify-self: center; } }

/* ---------- Город ---------- */
.city-box { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(24px, 4vw, 56px); align-items: start; }
.city-box p { margin: 0 0 14px; color: var(--ink-2); max-width: 62ch; }
.city-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.city-facts li { padding: 16px 20px 16px 56px; border-radius: 18px; background: #fff; border: 1px solid #DCE6F7; position: relative; font-weight: 600; }
.city-facts li::before { content: "✓"; position: absolute; left: 16px; top: 15px; width: 26px; height: 26px; border-radius: 50%; background: var(--red); color: #fff; display: grid; place-items: center; font-size: 14px; font-weight: 800; }
@media (max-width: 900px) { .city-box { grid-template-columns: 1fr; } }
.city-links { flex-basis: 100%; font-size: 13px; line-height: 1.7; }
.city-links a { text-decoration: none; opacity: .85; }
.city-links a:hover { opacity: 1; text-decoration: underline; }

/* ---------- Мелочи ---------- */
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.top-phones { display: flex; flex-direction: column; line-height: 1.15; margin-right: 6px; }
.top-phone2 { font: 700 16px var(--body); text-decoration: none; white-space: nowrap; } /* оба номера одного размера */
@media (max-width: 720px) { .top-phones { display: none; } }
.contact a + a { margin-top: 2px; }
.cookie { position: fixed; z-index: 80; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); max-width: 560px; margin: 0 auto; display: flex; gap: 14px; align-items: center; padding: 14px 16px 14px 20px; border-radius: 18px; background: #fff; color: var(--ink); box-shadow: 0 20px 50px -14px rgba(10, 24, 56, .45); border: 1px solid #DCE6F7; font-size: 14px; line-height: 1.4; }
.cookie p { margin: 0; }
@media (max-width: 720px) { .cookie { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); flex-direction: column; align-items: stretch; } }

/* =====================================================================
   Светлая тема «Зимнее утро»: снежно-белый фон, тёмно-синий текст,
   красный — кнопки заявки, золото — плашки и цифры. Тёмным остаётся подвал.
   ===================================================================== */
:root { --bg: #F4F8FF; --bg-2: #E8F0FD; --line: #DCE6F7; --accent: #1C4FB8; color-scheme: light; }
body { background: var(--bg); color: var(--ink); }
body::before { background: var(--bg); }
.h2 em, .hero-title em { color: var(--red); }
.sub { color: var(--ink-2); }
.eyebrow { color: #B4141E; }
mark { color: var(--ink); padding: 0 .08em; background-image: linear-gradient(transparent 52%, #FFD866 52%, #FFD866 96%, transparent 96%); }
:focus-visible { outline-color: var(--accent); }

.top { background: rgba(255, 255, 255, .9); border-bottom-color: var(--line); }
.garland { background: radial-gradient(circle at 50% -26px, transparent 30px, rgba(28, 79, 184, .25) 31px, transparent 32px) 0 0 / 46px 16px repeat-x; }
.nav a { color: var(--ink-2); }
.nav a:hover { color: var(--ink); }
.btn-ghost { color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); }
.btn-ghost:hover { background: rgba(10, 24, 56, .06); }
.btn-max { background: var(--night); color: #fff; }

.hero::before { background: radial-gradient(60% 50% at 25% 30%, rgba(120, 170, 255, .28), transparent 70%), radial-gradient(40% 40% at 80% 20%, rgba(255, 201, 60, .25), transparent 70%); }
.ht-and { color: var(--red); }
.ht-small { color: var(--accent); }
.cd-item { background: #fff; border-color: var(--line); box-shadow: 0 8px 24px -16px rgba(10, 24, 56, .35); }
.cd-item b { color: var(--red); }
.cd-item span { color: var(--ink-2); }
.arch { box-shadow: 0 0 0 8px #fff, 0 0 0 10px var(--gold), 0 30px 70px -24px rgba(10, 24, 56, .45); }
.stats { gap: 12px; overflow: visible; }
.stats li { background: #fff; border: 1px solid var(--line); border-radius: 20px; }
.stats b { color: var(--red); }
.stats span { color: var(--ink-2); }

.sec-deep { background: linear-gradient(180deg, var(--bg-2), var(--bg)); }
.sec-gold { background: radial-gradient(80% 60% at 50% 0%, rgba(255, 201, 60, .25), transparent 70%); }
.why-card, .inc, .place, .faq details, .plan { background: #fff; box-shadow: 0 14px 40px -24px rgba(10, 24, 56, .35); border: 1px solid var(--line); }
.plan::before { background: radial-gradient(circle 12px at 0 50%, var(--bg) 98%, transparent) left / 50% 100% no-repeat, radial-gradient(circle 12px at 100% 50%, var(--bg) 98%, transparent) right / 50% 100% no-repeat; }
.plan:hover { box-shadow: 0 30px 60px -24px rgba(10, 24, 56, .4); }
.plan-mid { background: linear-gradient(180deg, #FFF6D9, #fff 40%); }
.num { box-shadow: 0 0 0 8px var(--bg-2), 0 0 26px rgba(255, 201, 60, .55); }
.steps p { color: var(--ink-2); }
.notes p { background: #fff; border-color: var(--line); }
.inc-final { color: var(--red); }
.extras li { background: #fff; border-color: var(--line); }
.extras li:hover { background: #FFF8E2; }
.extras p { color: var(--ink-2); }
.pol { box-shadow: 0 24px 50px -20px rgba(10, 24, 56, .45); border: 1px solid var(--line); }
.phone { box-shadow: 0 0 0 2px #C8D7F4, 0 24px 50px -20px rgba(10, 24, 56, .5); }
.lightbox::backdrop { background: rgba(10, 24, 56, .7); }
.sec-order { background: radial-gradient(70% 70% at 80% 30%, rgba(224, 32, 43, .1), transparent 70%), linear-gradient(180deg, var(--bg), var(--bg-2)); }
.contact { background: #fff; border-color: var(--line); }
.contact span { color: var(--ink-2); }
.form { box-shadow: 0 0 0 3px var(--gold), 0 40px 80px -36px rgba(10, 24, 56, .5); }
.form-legal a { color: inherit; }
.agree a { color: var(--accent); }

.foot { color: var(--snow); }
.foot .lg-text { color: #fff; }
.foot a { color: inherit; }
.mbar { background: rgba(255, 255, 255, .96) !important; border-top-color: var(--line) !important; }
.mbar a { background: var(--bg-2) !important; color: var(--ink); }
.mbar a.mbar-cta { background: var(--red) !important; color: #fff; }
#deer { filter: drop-shadow(0 12px 16px rgba(10, 24, 56, .28)); }
.deer-bubble { box-shadow: 0 10px 30px -8px rgba(10, 24, 56, .35); border: 1px solid var(--line); }
.spark { color: #F2A600; text-shadow: 0 0 6px rgba(242, 166, 0, .6); }

/* Мягче и спокойнее (отзыв: «много красного и жирного — будто давят»): красный — только кнопки заявки,
   акценты — снежно-синие и золотые, заголовки на ступень тоньше, выделения без крика */
.h2 em, .hero-title em, .ht-and, .inc-final { color: var(--accent); }
.eyebrow { color: var(--accent); }
.stats b, .cd-item b { color: var(--accent); font-weight: 800; }
.city-facts li::before { background: var(--accent); }
.ht-line:nth-child(1) { font-weight: 800; }
.ht-and { font-weight: 700; }
.h2 { font-weight: 700; }
h3 { font-weight: 600; }
.price { font-weight: 800; }
.ticker span { font-weight: 700; }
mark { font-weight: 600; }
.btn-red::after { animation-duration: 6s; }
.sub, .lead { color: #2E3F66; }

/* =====================================================================
   Волшебное оформление (по видео): снежные сугробы на стыках разделов,
   заиндевевшие карточки со снежной шапкой, мягкое «всплытие» блоков.
   Убраны «рыночные» детали: жёлтая бегущая строка, блик на кнопках, вращение значка.
   ===================================================================== */
.sec::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 34px; pointer-events: none; z-index: 1; background: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1200 40%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0 40V20C60 10 110 24 170 18C240 9 290 26 360 17C430 8 480 24 560 16C640 8 700 26 780 18C850 11 910 24 980 16C1050 9 1120 22 1200 14V40Z%27 fill=%27%23DCE7F7%27/%3E%3Cpath d=%27M0 40V24C70 15 120 28 180 22C250 14 300 29 370 21C440 13 490 28 570 20C650 13 710 29 790 22C860 15 920 28 990 20C1060 14 1130 26 1200 19V40Z%27 fill=%27%23fff%27/%3E%3Cg fill=%27%23fff%27 stroke=%27%23C9DAF2%27 stroke-width=%27.8%27%3E%3Ccircle cx=%27140%27 cy=%2712%27 r=%272%27/%3E%3Ccircle cx=%27420%27 cy=%279%27 r=%271.6%27/%3E%3Ccircle cx=%27690%27 cy=%2713%27 r=%272.2%27/%3E%3Ccircle cx=%27950%27 cy=%278%27 r=%271.7%27/%3E%3Ccircle cx=%271130%27 cy=%2711%27 r=%271.9%27/%3E%3C/g%3E%3C/svg%3E") center bottom / 100% 100% no-repeat; }
.sec-order::after { display: none; }
.hero { padding-bottom: 64px; }
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 40px; pointer-events: none; background: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1200 40%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0 40V20C60 10 110 24 170 18C240 9 290 26 360 17C430 8 480 24 560 16C640 8 700 26 780 18C850 11 910 24 980 16C1050 9 1120 22 1200 14V40Z%27 fill=%27%23DCE7F7%27/%3E%3Cpath d=%27M0 40V24C70 15 120 28 180 22C250 14 300 29 370 21C440 13 490 28 570 20C650 13 710 29 790 22C860 15 920 28 990 20C1060 14 1130 26 1200 19V40Z%27 fill=%27%23fff%27/%3E%3Cg fill=%27%23fff%27 stroke=%27%23C9DAF2%27 stroke-width=%27.8%27%3E%3Ccircle cx=%27140%27 cy=%2712%27 r=%272%27/%3E%3Ccircle cx=%27420%27 cy=%279%27 r=%271.6%27/%3E%3Ccircle cx=%27690%27 cy=%2713%27 r=%272.2%27/%3E%3Ccircle cx=%27950%27 cy=%278%27 r=%271.7%27/%3E%3Ccircle cx=%271130%27 cy=%2711%27 r=%271.9%27/%3E%3C/g%3E%3C/svg%3E") center bottom / 100% 100% no-repeat; }
.why-card, .inc, .extras li, .stats li, .notes p, .city-facts li { position: relative; border: 1px solid #fff; box-shadow: 0 0 0 1px #D9E5F5, 0 16px 36px -24px rgba(28, 79, 184, .45); }
.why-card::after, .inc::after, .extras li::after, .stats li::after { content: ""; position: absolute; left: 14px; right: 14px; top: -9px; height: 16px; pointer-events: none; background: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 200 16%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0 14C6 6 14 4 22 7C30 2 42 2 50 7C58 3 70 2 78 6C88 1 100 2 108 7C118 3 130 2 138 6C148 2 160 3 168 7C178 3 190 4 200 12V16H0Z%27 fill=%27%23fff%27 stroke=%27%23D3E1F4%27 stroke-width=%27.8%27/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.stats { overflow: visible; margin-top: 56px; }
.ticker { display: none; }
.orn { display: flex; align-items: center; justify-content: center; gap: 18px; max-width: 520px; margin: 8px auto 0; color: #B8964F; font-size: 20px; position: relative; z-index: 2; }
.orn::before, .orn::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, #CBB07A); }
.orn::after { background: linear-gradient(90deg, #CBB07A, transparent); }
.btn-red::after { display: none; }
.badge-spin svg, .logo-star { animation: none; }
.rv { transition: opacity 1.1s cubic-bezier(.16, 1, .3, 1), transform 1.1s cubic-bezier(.16, 1, .3, 1), filter 1.1s cubic-bezier(.16, 1, .3, 1); }
.rv.wait { opacity: 0; transform: translateY(48px) scale(.96); filter: blur(4px); }

/* Волшебные версии (не убирать, а сделать новогодними, с подсветкой):
   бегущая строка — ночная лента с тёплым свечением гирлянды, снежинками и ёлочками с игрушками;
   блик на кнопке — золотая искра; кружок «15 лет» — мерцающий ореол, медленное вращение, веточка с шариками */
.ticker { display: block; transform: none; margin: 12px 0 0; padding-block: 11px; position: relative; z-index: 2;
  background: linear-gradient(90deg, #1B2550, #2B3C78 50%, #1B2550); color: #FFF4D6;
  border-block: 1px solid rgba(232, 205, 140, .55); box-shadow: 0 0 26px rgba(255, 212, 120, .22); }
.ticker-track { animation-duration: 60s; }
.ticker span { display: inline-flex; align-items: center; font: 600 clamp(16px, 2vw, 22px)/1 var(--display); text-transform: none; letter-spacing: .05em;
  text-shadow: 0 0 8px rgba(255, 222, 150, .75), 0 0 20px rgba(255, 196, 90, .4); animation: tglow 3.2s ease-in-out infinite; }
.ticker i { font-style: normal; color: #CFE3FF; margin: 0 .45em; text-shadow: 0 0 10px rgba(190, 220, 255, .95); display: inline-block; animation: tflake 6s linear infinite; }
.tk-tree { width: 1.35em; height: 1.5em; margin: 0 .6em 0 .2em; filter: drop-shadow(0 0 6px rgba(255, 215, 120, .55)); animation: twink 2.4s ease-in-out infinite; }
@keyframes tglow { 50% { text-shadow: 0 0 12px rgba(255, 230, 170, .95), 0 0 30px rgba(255, 196, 90, .6); } }
@keyframes tflake { to { transform: rotate(360deg); } }
@keyframes twink { 50% { filter: drop-shadow(0 0 12px rgba(255, 225, 140, .95)); } }
.orn { display: none; }
.btn-red::after { display: block; background: linear-gradient(110deg, transparent 38%, rgba(255, 238, 190, .65) 48%, rgba(255, 255, 255, .9) 50%, rgba(255, 238, 190, .65) 52%, transparent 62%); animation: shine 5.5s 1.5s infinite; }
.btn-red { animation: bglow 3.6s ease-in-out infinite; }
@keyframes bglow { 50% { box-shadow: 0 10px 30px -8px rgba(224, 32, 43, .55), 0 0 22px rgba(255, 205, 120, .55); } }
.badge-spin { background: radial-gradient(circle at 35% 30%, #FFE7A3, #F5C04A 60%, #E3A92B); box-shadow: 0 0 0 6px rgba(255, 255, 255, .85), 0 0 34px rgba(255, 200, 90, .55); animation: halo 3.4s ease-in-out infinite; }
.badge-spin > svg:not(.badge-fir) { animation: spin 30s linear infinite; }
.badge-spin span { text-shadow: 0 0 10px rgba(255, 255, 255, .8); }
.badge-fir { position: absolute; left: -26px; top: -30px; width: 96px; height: 64px; inset: auto; transform: rotate(-12deg); animation: none !important; filter: drop-shadow(0 4px 6px rgba(10, 24, 56, .25)); }
@keyframes halo { 50% { box-shadow: 0 0 0 6px rgba(255, 255, 255, .95), 0 0 56px rgba(255, 210, 110, .85), 0 0 90px rgba(190, 220, 255, .45); } }

/* =====================================================================
   «Серебро Снегурочки» с золотом + картинки разделов с dedum.tilda.ws
   ледяной фон, сапфировый синий, золото лент и огней; красный — только в картинках (мешок, шуба)
   ===================================================================== */
:root { --bg: #EEF4FC; --bg-2: #E2ECF8; --line: #D6E3F4; --ink: #1E2B4A; --ink-2: #4A5A7A; --accent: #2D4A9A;
  --gold: #E3C06A; --gold-deep: #A47B2C; --red: #2F55B5; --red-hover: #3A64C8; }
body { background: var(--bg); }
.eyebrow { color: var(--gold-deep); }
.h2 em, .hero-title em, .inc-final { color: var(--accent); }
mark { background-image: linear-gradient(transparent 55%, #F6E4AE 55%, #F6E4AE 95%, transparent 95%); }
.btn-red { background: linear-gradient(180deg, #3A62C4, #24418F); color: #fff; box-shadow: 0 0 0 1px rgba(227, 192, 106, .55), 0 12px 30px -10px rgba(36, 65, 143, .6); }
.btn-red:hover { background: linear-gradient(180deg, #4570D2, #2A4BA0); }
@keyframes bglow { 50% { box-shadow: 0 0 0 1px rgba(227, 192, 106, .8), 0 12px 30px -10px rgba(36, 65, 143, .6), 0 0 24px rgba(240, 205, 120, .6); } }
.mbar a.mbar-cta { background: linear-gradient(180deg, #3A62C4, #24418F) !important; }
.form { box-shadow: 0 0 0 2px #E8CF8E, 0 40px 80px -36px rgba(30, 43, 74, .45); }
.num, .note-ico, .extras li::before { background: linear-gradient(180deg, #F3DC9A, #DDB55C); }
.checks li::before, .faq summary::after, .dur, .ico { background: #24418F; color: #F3DC9A; }
.city-facts li::before { background: #2D4A9A; }
.stats b, .cd-item b { color: var(--accent); }

/* фоны разделов (на телефоне — свои, высокие) */
.sec { background-size: cover; background-position: center top; background-repeat: no-repeat; }
#why { background-image: url("/assets/img/bg/why.webp"); }
#steps { background-image: url("/assets/img/bg/steps.webp"); background-position: center bottom; padding-bottom: clamp(220px, 30vw, 420px); }
#prices { background-image: url("/assets/img/bg/prices.webp"); }
#included { background-image: url("/assets/img/bg/included.webp"); background-position: center bottom; padding-bottom: clamp(200px, 26vw, 380px); }
#places { background-image: url("/assets/img/bg/places.webp"); }
#extras { background-image: url("/assets/img/bg/extras.webp"); background-position: left bottom; }
#reviews { background-image: url("/assets/img/bg/reviews.webp"); }
#faq { background-image: url("/assets/img/bg/faq.webp"); background-position: left bottom; }
#order { background-image: url("/assets/img/bg/order.webp"); background-position: center bottom; }
@media (max-width: 860px) {
  #why { background-image: url("/assets/img/bg/why-m.webp"); }
  #steps { background-image: url("/assets/img/bg/steps-m.webp"); padding-bottom: clamp(64px, 9vw, 120px); }
  #prices { background-image: url("/assets/img/bg/prices-m.webp"); }
  #included { background-image: url("/assets/img/bg/included-m.webp"); padding-bottom: clamp(64px, 9vw, 120px); }
  #places { background-image: url("/assets/img/bg/places-m.webp"); }
  #extras { background-image: url("/assets/img/bg/extras-m.webp"); }
  #reviews, #faq, #order { background-size: 220% auto; background-position: center bottom; background-color: var(--bg); }
}
.sec-deep, .sec-gold, .sec-order { background-color: transparent; }
#steps .steps li, #steps .num + h3 { position: relative; }
#steps .steps li { background: rgba(255, 255, 255, .86); border-radius: 18px; padding: 18px 16px; border: 1px solid #fff; box-shadow: 0 0 0 1px #D9E5F5, 0 16px 36px -24px rgba(28, 79, 184, .45); }
#steps .steps::before { display: none; }
.extras li, .faq details, .contact, .notes p { background: rgba(255, 255, 255, .9); }

/* первый экран: ночное небо с героями (компьютер), на телефоне — фото героев под текстом */
.hero { background: #0F1C46 url("/assets/img/bg/hero.webp") right bottom / cover no-repeat; color: #fff; padding-bottom: 90px; }
.hero::before { background: linear-gradient(90deg, rgba(10, 20, 55, .82) 0%, rgba(10, 20, 55, .55) 42%, rgba(10, 20, 55, 0) 70%); inset: 0; height: auto; animation: none; z-index: 0; }
.hero > .wrap { position: relative; z-index: 1; }
.hero .hero-title { color: #fff; text-shadow: 0 2px 18px rgba(5, 12, 40, .5); }
.hero .ht-and { color: #F3D58A; }
.hero .ht-small { color: #CFE0FF; }
.hero .lead { color: #E8EEFF; }
.hero .eyebrow { color: #F3D58A; }
.hero mark { color: #FFE9AE; background-image: linear-gradient(transparent 88%, rgba(233, 196, 106, .9) 88%); }
.hero .btn-ghost { color: #fff; box-shadow: inset 0 0 0 2px rgba(243, 213, 138, .9); }
.hero .btn-ghost:hover { background: rgba(255, 255, 255, .1); }
.hero .cd-item { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .28); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.hero .cd-item b { color: #F3D58A; }
.hero .cd-item span { color: #DCE6FA; }
.hero .stats li { background: rgba(255, 255, 255, .92); }
@media (min-width: 861px) { .hero .arch { visibility: hidden; } .hero-visual { min-height: 420px; } }
@media (max-width: 860px) { .hero { background-image: none; } .hero::before { background: none; } .hero::after { display: none; } }

/* картинки и текст не спорят: иллюстрации шагов и мешка — под карточками, текст на картинках — на ледяной подложке */
@media (min-width: 861px) {
  #steps { background-size: 100% auto; background-color: #D8E8FC; padding-bottom: 31vw; }
  #included { background-size: 100% auto; background-color: #E1EDFB; padding-bottom: 33vw; }
}
.inc-final { display: table; margin: 36px auto 0; padding: 12px 26px; border-radius: 999px; background: rgba(255, 255, 255, .88); box-shadow: 0 0 0 1px #D9E5F5, 0 14px 30px -20px rgba(28, 79, 184, .5); }
#extras .extras-grid > div:first-child, #faq .faq-grid > div:first-child, #order .order-copy {
  background: rgba(255, 255, 255, .84); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border-radius: 26px; padding: clamp(20px, 2.6vw, 34px); border: 1px solid #fff; box-shadow: 0 0 0 1px #D9E5F5, 0 20px 44px -28px rgba(28, 79, 184, .5); }
#extras .extras-grid > div:first-child .sub, #faq .faq-grid > div:first-child .sub { margin-bottom: 0; }
#order .contacts .contact { background: rgba(255, 255, 255, .95); }

/* олень сидит спокойно: не подпрыгивает и не перелетает (моргает, следит глазами, звенит и ведёт к заявке по щелчку) */
.deer-bob { animation: none; }
/* =====================================================================
   Правки по замечаниям (02.11): снег только на картинках, без шва между разделами,
   без маркера, ювелирная снежинка вместо значков, текст не на фото
   ===================================================================== */
.sec::after, .hero::after { display: none !important; }
.why-card::after, .inc::after, .extras li::after, .stats li::after { display: none !important; }
mark, .hero mark, .plan mark, .inc mark, .faq mark, .why-card mark, .place mark { background: none !important; color: inherit; font-weight: 600; padding: 0; animation: none; }
.hero mark { color: #FFE9AE; }
/* фон над картинкой плавно перетекает в неё — без полосы-«второго слайда» */
@media (min-width: 861px) {
  #steps { background: url("/assets/img/bg/steps.webp") center bottom / 100% auto no-repeat, linear-gradient(180deg, var(--bg) 0%, #D8E8FC 55%); }
  #included { background: url("/assets/img/bg/included.webp") center bottom / 100% auto no-repeat, linear-gradient(180deg, var(--bg) 0%, #E1EDFB 55%); }
}
/* ювелирная снежинка — вместо ёлочек в бегущей строке и значков в карточках */
.gem { display: inline-block; width: 1.25em; height: 1.25em; vertical-align: -.2em; }
.ticker .gem { width: 1.4em; height: 1.4em; margin: 0 .7em; filter: drop-shadow(0 0 6px rgba(255, 220, 140, .7)); animation: twink 2.6s ease-in-out infinite; }
.tk-tree, .ticker i { display: none; }
.ico { background: radial-gradient(circle at 40% 35%, #FFFFFF, #E7F0FD); border: 1px solid #E6D29A; border-radius: 50%; box-shadow: 0 6px 16px -8px rgba(36, 65, 143, .45); }
.ico .gem { width: 28px; height: 28px; }
/* «Дополнительно»: коробка с лентой слева открыта, текст и список — справа */
#extras .extras-grid > div:first-child { background: none; -webkit-backdrop-filter: none; backdrop-filter: none; border: 0; box-shadow: none; padding: 0; }
@media (min-width: 901px) {
  #extras .extras-grid { grid-template-columns: 1fr 1fr; }
  #extras .extras-grid > div:first-child, #extras .extras { grid-column: 2; }
}
@media (max-width: 900px) { #extras { background-position: center top; } }
/* «Заявка»: картинка с героями — сверху, текст, контакты и форма — ниже, на снегу */
#order { background: url("/assets/img/bg/order.webp") center top / 100% auto no-repeat, linear-gradient(180deg, transparent 0, transparent 50%, #E9F0FB 66%, var(--bg) 100%); background-color: var(--bg); padding-top: clamp(260px, 44vw, 720px); }
#order .order-copy { background: rgba(255, 255, 255, .9); }
@media (max-width: 860px) { #order { background-size: 100% auto; padding-top: 70vw; } }
/* шаги на телефоне — одинаковые отступы */
@media (max-width: 960px) {
  #steps .steps { gap: 14px; }
  #steps .steps li { grid-template-columns: 56px 1fr; column-gap: 14px; align-items: center; padding: 16px; margin: 0; }
  #steps .steps .num { width: 56px; height: 56px; font-size: 24px; margin: 0; box-shadow: none; }
  #steps .steps h3, #steps .steps p { margin: 0; }
  #steps .steps h3 { margin-bottom: 4px; }
}
/* гирлянда сверху — тёплые золотые и белые огоньки, без разноцветных */
.garland::before { background: radial-gradient(circle 4px at 11px 6px, #FFE7A6 90%, transparent) 0 0 / 92px 16px repeat-x, radial-gradient(circle 4px at 57px 6px, #F2C96B 90%, transparent) 0 0 / 92px 16px repeat-x; filter: drop-shadow(0 0 5px rgba(255, 214, 120, .9)); }
.garland::after { background: radial-gradient(circle 4px at 34px 9px, #FFF8E6 90%, transparent) 0 0 / 92px 16px repeat-x, radial-gradient(circle 4px at 80px 9px, #E8C26A 90%, transparent) 0 0 / 92px 16px repeat-x; filter: drop-shadow(0 0 5px rgba(255, 230, 170, .9)); }
.garland::before, .garland::after { animation: twinkle 2.4s ease-in-out infinite; }

/* =====================================================================
   Общий вид 03.11: Playfair Display в заголовках, спокойная шкала размеров;
   без снега, гирлянды и снежинок; золотые рамки карточек; мягкие переходы разделов;
   всплытие без размытия; отзывы цитатами; «Браво…»
   ===================================================================== */
@font-face { font-family: "Playfair Display"; src: url("fonts/playfair-cyr.woff2") format("woff2"); font-weight: 400 900; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Playfair Display"; src: url("fonts/playfair-lat.woff2") format("woff2"); font-weight: 400 900; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+20BD, U+2122, U+2212; }
@font-face { font-family: "Playfair Display"; src: url("fonts/playfair-cyr-italic.woff2") format("woff2"); font-weight: 400 900; font-style: italic; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Playfair Display"; src: url("fonts/playfair-lat-italic.woff2") format("woff2"); font-weight: 400 900; font-style: italic; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC, U+20BD, U+2122, U+2212; }
:root { --serif: "Playfair Display", Georgia, "Times New Roman", serif; }
.h2, .hero-title, h3, .price, .stats b, .cd-item b, .form h3, .inc-title, .quote blockquote, .bravo, .num { font-family: var(--serif); letter-spacing: 0; }
.h2 { font-size: clamp(30px, 3.6vw, 46px); font-weight: 600; line-height: 1.15; max-width: 24ch; }
.h2 em, .hero-title em { font-style: italic; font-weight: 500; }
h3 { font-size: clamp(19px, 1.5vw, 22px); font-weight: 600; line-height: 1.3; }
.ht-line:nth-child(1) { font-size: clamp(42px, 5.4vw, 76px); font-weight: 700; }
.ht-and { font-size: clamp(32px, 4vw, 54px); font-weight: 500; font-style: italic; }
.ht-small { font-size: clamp(22px, 2.4vw, 32px); font-weight: 500; margin-top: 8px; }
.hero-title { line-height: 1.05; }
.lead { font-size: clamp(18px, 1.5vw, 22px); line-height: 1.5; max-width: 34ch; }
.stats b { font-size: clamp(30px, 3.2vw, 44px); font-weight: 700; }
.stats span { font-size: 15px; }
.price { font-weight: 700; }
.eyebrow::before { content: none; }
.eyebrow { font-size: 12px; letter-spacing: .18em; }

/* без снега, гирлянды и снежинок */
#snow, .garland { display: none !important; }
.ico, .gem { display: none !important; }

/* всплытие — спокойное, без размытия */
.rv { transition: opacity .6s ease-out, transform .6s ease-out; }
.rv.wait { opacity: 0; transform: translateY(16px); filter: none; }

/* карточки — в тонкой золотой рамке, как кнопки первого экрана */
.why-card, .plan, .inc, .place, .extras li, #steps .steps li, .quote, .stats li, .notes p, .contact, .faq details, .city-facts li {
  border: 0 !important; box-shadow: 0 0 0 1px rgba(227, 192, 106, .75), 0 14px 34px -24px rgba(36, 65, 143, .45) !important; }
.plan-mid { box-shadow: 0 0 0 2px #E3C06A, 0 24px 50px -26px rgba(36, 65, 143, .5) !important; }

/* мягкие переходы между разделами: края фона растворяются в общем ледяном */
.sec > .wrap { position: relative; z-index: 1; }
body .sec::before, body .sec::after { content: ""; display: block !important; position: absolute; left: 0; right: 0; height: 140px; pointer-events: none; z-index: 0; background: none; }
body .sec::before { top: 0; background: linear-gradient(var(--bg), rgba(238, 244, 252, 0)); }
body .sec::after { bottom: 0; top: auto; background: linear-gradient(rgba(238, 244, 252, 0), var(--bg)); }
body .hero::after { content: ""; display: block !important; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; pointer-events: none; background: linear-gradient(rgba(238, 244, 252, 0), var(--bg)); }
.hero .stats { position: relative; z-index: 2; }

/* бегущая строка «Браво…» */
.ticker span { font-family: var(--serif); font-style: italic; font-weight: 500; font-size: clamp(18px, 2.2vw, 26px); letter-spacing: .02em; }
.spk { width: .8em; height: .8em; margin: 0 1em; fill: #F3DC9A; vertical-align: .05em; filter: drop-shadow(0 0 6px rgba(255, 220, 140, .9)); animation: twink 2.6s ease-in-out infinite; }

/* разнообразие разделов: шаги, цены и отзывы — по центру */
#steps .wrap > .eyebrow, #prices .wrap > .eyebrow, #reviews .wrap > .eyebrow { justify-content: center; text-align: center; }
#steps .wrap > .h2, #prices .wrap > .h2, #reviews .wrap > .h2, #steps .wrap > .sub, #prices .wrap > .sub, #reviews .wrap > .sub { text-align: center; margin-inline: auto; }
.inc-title { text-align: center; font-size: clamp(24px, 2.6vw, 32px); margin: 56px 0 6px; }
#prices .inc-grid { margin-top: 24px; }

/* отзывы цитатами */
.quotes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; max-width: 1000px; margin: 0 auto; }
.quote { margin: 0; background: rgba(255, 255, 255, .94); border-radius: 22px; padding: 30px 30px 22px; display: flex; flex-direction: column; gap: 18px; }
.quote blockquote { margin: 0; font-size: clamp(18px, 1.5vw, 21px); font-style: italic; line-height: 1.5; color: var(--ink); }
.quote figcaption { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; color: var(--ink-2); font-size: 14px; margin-top: auto; }
.shot { border: 0; background: none; color: var(--accent); font: 600 14px var(--body); cursor: pointer; padding: 4px 0; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 760px) { .quotes { grid-template-columns: 1fr; } .quote { padding: 24px 22px 18px; } }

/* «Браво празднику! Браво радости! Браво детству!» над формой */
.bravo { margin: 0 0 12px; font-style: italic; font-weight: 500; font-size: clamp(18px, 1.8vw, 22px); color: var(--gold-deep); }

/* первый экран: головы героев целиком (картинку не режем сверху); цифры — число и слово одним шрифтом */
.hero { background-position: 72% 18%; }
.stats b { white-space: nowrap; font-size: clamp(28px, 2.8vw, 40px); }
/* отзывы-скриншоты по центру (если не помещаются — листаются, начало не обрезается) */
.reviews > :first-child { margin-left: auto; }
.reviews > :last-child { margin-right: auto; }
/* =====================================================================
   03.11, вечер: «Заявка» по логике (заголовок над героями → форма → наши контакты),
   вторая бегущая строка, «Дополнительно» с одной картинкой, кнопки без красного
   ===================================================================== */
/* кнопки: никакого красного — только сапфир и тёплое золото, и в покое, и при наведении */
.btn-red, .btn-red:focus { box-shadow: 0 0 0 1px rgba(227, 192, 106, .6), 0 12px 30px -12px rgba(36, 65, 143, .55); }
.btn-red:hover { box-shadow: 0 0 0 1px rgba(227, 192, 106, .9), 0 14px 32px -12px rgba(36, 65, 143, .6), 0 0 20px rgba(240, 205, 120, .45); }
@keyframes bglow { 0%, 100% { box-shadow: 0 0 0 1px rgba(227, 192, 106, .6), 0 12px 30px -12px rgba(36, 65, 143, .55); } 50% { box-shadow: 0 0 0 1px rgba(227, 192, 106, .9), 0 12px 30px -12px rgba(36, 65, 143, .55), 0 0 22px rgba(240, 205, 120, .55); } }

/* «Дополнительно»: спокойный фон, слева заголовок и чёткая картинка в золотой рамке, справа список */
#extras { background: linear-gradient(180deg, var(--bg), #E6EEFA 50%, var(--bg)) !important; }
#extras .extras-grid { grid-template-columns: .95fr 1.05fr; align-items: center; }
#extras .extras-grid > div:first-child, #extras .extras { grid-column: auto !important; }
.extras-photo { margin: 26px 0 0; border-radius: 24px; overflow: hidden; box-shadow: 0 0 0 1px rgba(227, 192, 106, .8), 0 24px 50px -28px rgba(30, 43, 74, .55); max-width: 520px; }
.extras-photo img { width: 100%; height: auto; display: block; }
@media (max-width: 900px) { #extras .extras-grid { grid-template-columns: 1fr; } .extras-photo { max-width: 560px; } }

/* вторая бегущая строка */
.ticker-2 { margin: 0; }

/* «Заявка»: заголовок вверху над героями, под героями форма, после формы — наши контакты */
#order { padding-top: clamp(40px, 5vw, 80px) !important; }
.order-wrap { display: flex; flex-direction: column; align-items: center; }
.order-head { text-align: center; max-width: 760px; margin-bottom: clamp(200px, calc(40vw - 180px), 560px);
  background: rgba(255, 255, 255, .82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); border-radius: 26px; padding: clamp(18px, 2.4vw, 30px) clamp(20px, 3vw, 40px);
  box-shadow: 0 0 0 1px rgba(227, 192, 106, .75), 0 20px 44px -28px rgba(28, 79, 184, .5); }
.order-head .h2 { margin: 0 auto 10px; max-width: none; }
.order-head .sub { margin: 0 auto; }
#order .form { width: 100%; max-width: 560px; }
.order-contacts { text-align: center; margin-top: 34px; }
.order-contacts p { margin: 0 0 12px; color: var(--ink-2); font-weight: 600; }
.oc-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.oc { display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px; border-radius: 999px; background: rgba(255, 255, 255, .95); color: var(--ink); font-weight: 700; text-decoration: none;
  box-shadow: 0 0 0 1px rgba(227, 192, 106, .75), 0 10px 24px -18px rgba(28, 79, 184, .5); }
.oc:hover { background: #fff; box-shadow: 0 0 0 1px #E3C06A, 0 0 16px rgba(240, 205, 120, .45); }
@media (max-width: 860px) { .order-head { margin-bottom: 48vw; } }

/* 03.11, ночь: зимние фоны для «Дополнительно» и «Моментов»; «Заявка» — форма справа на картинке, без серого низа */
#extras { background: url("/assets/img/bg/prices.webp") center / cover no-repeat !important; }
#photos { background: url("/assets/img/bg/faq.webp") left bottom / cover no-repeat; }
@media (max-width: 860px) {
  #extras { background-image: url("/assets/img/bg/prices-m.webp") !important; }
  #photos { background-size: 220% auto; background-position: left bottom; background-color: var(--bg); }
}
#order { background: url("/assets/img/bg/order.webp") 26% center / cover no-repeat !important; padding: clamp(56px, 7vw, 110px) 0 !important; }
body #order::before, body #order::after { display: none !important; }
.order-wrap { display: grid !important; grid-template-columns: 1fr minmax(0, 580px); gap: 0 32px; align-items: start; }
.order-wrap > * { grid-column: 2; }
.order-head { margin-bottom: 18px !important; text-align: left; }
.order-head .h2, .order-head .sub { margin-left: 0; }
#order .form { max-width: none; }
.order-contacts { text-align: left; margin-top: 18px; background: rgba(255, 255, 255, .86); border-radius: 22px; padding: 16px 20px; box-shadow: 0 0 0 1px rgba(227, 192, 106, .75); }
.oc-row { justify-content: flex-start; }
@media (max-width: 960px) {
  .order-wrap { grid-template-columns: 1fr; }
  .order-wrap > * { grid-column: 1; }
  #order { background-position: 30% top !important; padding-top: 52vw !important; }
}

/* «Заявка» компактнее: блок ниже — картинка почти не увеличивается, обе фигуры видны слева от формы */
@media (min-width: 961px) {
  .order-wrap { grid-template-columns: 1fr minmax(0, 470px) !important; }
  #order { background-position: 0% 30% !important; padding: 48px 0 !important; }
  .order-head { padding: 16px 22px !important; margin-bottom: 12px !important; }
  .order-head .h2 { font-size: 30px !important; }
  .order-head .sub { font-size: 15px !important; line-height: 1.45; }
  #order .form { padding: 20px 24px !important; gap: 2px !important; }
  #order .form h3 { font-size: 22px !important; }
  #order .form label { margin-top: 4px !important; font-size: 14px !important; }
  #order .form input[type="text"], #order .form input[type="tel"], #order .form select { min-height: 44px !important; }
  .order-contacts { margin-top: 12px !important; padding: 12px 16px !important; }
  .oc { min-height: 38px !important; padding: 0 14px !important; font-size: 14px; }
}
/* =====================================================================
   «Заявка» как первый экран, только зеркально: заголовок сверху по центру,
   слева фото героев целиком (картинка по ширине, без обрезки), справа форма — без рамок и плашек
   ===================================================================== */
#order { background: linear-gradient(90deg, rgba(238, 244, 252, 0) 56%, rgba(238, 244, 252, .9) 67%, rgba(238, 244, 252, .96) 100%),
    url("/assets/img/bg/order.webp") center top / 100% auto no-repeat, #E9F0FA !important;
  min-height: 67vw; padding: clamp(28px, 3vw, 48px) 0 clamp(40px, 4vw, 64px) !important; }
.order-wrap { display: grid !important; grid-template-columns: 1fr minmax(0, min(33vw, 540px)) !important; gap: 0 32px; align-items: start; }
.order-wrap > * { grid-column: 2; }
.order-wrap > .order-head { grid-column: 1 / -1 !important; text-align: center; background: none !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  padding: 0 !important; margin: 0 auto clamp(18px, 2vw, 30px) !important; max-width: 820px; }
.order-head .h2 { font-size: clamp(30px, 3.4vw, 46px) !important; margin: 0 auto 8px !important; text-shadow: 0 2px 16px rgba(255, 255, 255, .9); }
.order-head .sub { font-size: clamp(16px, 1.3vw, 19px) !important; margin: 0 auto !important; color: var(--ink); text-shadow: 0 1px 10px rgba(255, 255, 255, .95); }
#order .form { background: none !important; box-shadow: none !important; padding: 0 !important; border: 0 !important; }
#order .form h3 { font-size: clamp(22px, 1.8vw, 26px) !important; }
#order .form label { margin-top: 6px !important; font-size: 15px !important; }
.order-contacts { background: none !important; box-shadow: none !important; padding: 0 !important; margin-top: 18px !important; }
@media (max-width: 960px) {
  #order { background: url("/assets/img/bg/order.webp") center top / 100% auto no-repeat, linear-gradient(180deg, #E9F0FA, var(--bg)) !important; min-height: 0; padding-top: 24px !important; }
  .order-wrap { grid-template-columns: 1fr !important; }
  .order-wrap > * { grid-column: 1 !important; }
  .order-wrap > .order-head { margin-bottom: 50vw !important; }
  #order .form { background: rgba(255, 255, 255, .92) !important; border-radius: 22px; padding: 20px !important; }
}
/* «Заявка» на телефоне: заголовок на светлом фоне, под ним герои, затем форма */
@media (max-width: 960px) {
  #order { background: url("/assets/img/bg/order.webp") center 210px / 100% auto no-repeat, linear-gradient(180deg, #EEF4FC, #E9F0FA) !important; }
  .order-wrap > .order-head { min-height: 170px; margin-bottom: calc(67vw + 10px) !important; }
  .order-head .h2 { font-size: 28px !important; }
}
/* «Заявка»: подзаголовок крупнее, подписи под формой читаются на любом фоне */
.order-head .sub { font-size: clamp(18px, 1.6vw, 22px) !important; font-weight: 600; font-style: italic; font-family: var(--serif); color: var(--accent) !important; }
.order-contacts p { color: var(--ink) !important; font-size: 16px; text-shadow: 0 0 8px #fff, 0 0 16px #fff, 0 0 2px #fff; }
@media (min-width: 961px) { #order { background: linear-gradient(90deg, rgba(238, 244, 252, 0) 52%, rgba(238, 244, 252, .9) 63%, rgba(238, 244, 252, .96) 100%), url("/assets/img/bg/order.webp") center top / 100% auto no-repeat, #E9F0FA !important; } }
/* =====================================================================
   Мобильная версия (разбор 03.11): шапка без обрезки, ленты вместо длинных столбиков,
   читаемые подписи, крупные цели для пальца, олень поменьше
   ===================================================================== */
@media (max-width: 720px) {
  .top-row { gap: 10px; }
  .lg-mark { width: 36px; height: 36px; }
  .lg-text { font-size: 13px; }
  .lg-text small { font-size: 8.5px; }
  .top-actions .btn-red { --h: 38px; padding: 0 14px; font-size: 14px; white-space: nowrap; }
  .top-actions { flex-shrink: 0; }

  .eyebrow, .tag { font-size: 13px; }
  .sub { font-size: 17px; }

  /* ленты, которые листаются пальцем: тарифы, места праздника, фото */
  .plans, .places, .polaroids { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px;
    margin: 0 -16px !important; padding: 8px 16px 22px !important; max-width: none !important; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .plans::-webkit-scrollbar, .places::-webkit-scrollbar, .polaroids::-webkit-scrollbar { display: none; }
  .plans > *, .places > *, .polaroids > * { flex: 0 0 84%; scroll-snap-align: center; }
  .polaroids > * { flex-basis: 78%; }
  .plan:hover, .place:hover { transform: none; }
  .swipe-hint { display: block; text-align: center; font-size: 14px; color: var(--ink-2); margin: -6px 0 10px; }

  /* «В любую программу входит» — две колонки, компактно */
  #prices .inc-grid { grid-template-columns: 1fr 1fr !important; gap: 10px; }
  #prices .inc { padding: 16px 14px; }
  #prices .inc h3 { font-size: 16px; }
  #prices .inc p { font-size: 14px; }

  /* контакты под формой — по две в ряд */
  .oc-row { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; }
  .oc { justify-content: center; padding: 0 10px !important; font-size: 14px; min-height: 46px !important; }
  .order-contacts p { text-align: center; }

  /* ссылки в подвале и в согласии — удобно попасть пальцем */
  .foot a { display: inline-block; padding: 6px 0; }
  .agree a { padding: 3px 0; }

  /* олень меньше и не мешает тексту */
  #deer { --deer: 54px !important; }
  .deer-bubble { font-size: 12px; max-width: 150px; }
}
@media (min-width: 721px) { .swipe-hint { display: none; } }
/* почта под формой на телефоне — на всю ширину, чтобы адрес не обрезался */
@media (max-width: 720px) { .oc-row .oc:last-child { grid-column: 1 / -1; } }
/* телефон: цифры первого экрана — две равные колонки по центру, ничего не вылезает за край */
@media (max-width: 860px) {
  .hero .stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .hero .stats li { min-width: 0; padding: 16px 14px; }
  .stats b { font-size: clamp(22px, 6.4vw, 28px) !important; white-space: normal; }
  .stats span { font-size: 14px; }
}
/* «Заявка»: на компьютере фото — фоном, на телефоне — картинкой сразу под заголовком, без пустоты */
.order-photo { display: none; }
@media (max-width: 960px) {
  #order { background: linear-gradient(180deg, #EEF4FC, #E9F0FA) !important; padding-top: 28px !important; }
  .order-wrap > .order-head { min-height: 0 !important; margin-bottom: 14px !important; }
  .order-photo { display: block; grid-column: 1 / -1; width: calc(100% + 32px); max-width: none; height: auto; margin: 0 -16px 18px; }
}
/* проба (03.11): заголовок одним шрифтом, ключевые слова — цветом шубы и мешка Деда Мороза (кармин) */
:root { --carmine: #8B1A22; }
.h2-accent, .h2-accent .hl { font-style: normal; font-weight: 700; }
.h2-accent .hl { color: var(--carmine); }
/* «5 шагов до настоящей сказки»: два цвета — синий и кармин, один прямой шрифт */
.h2-accent .hl-blue { color: #2D55B8; }
#steps .h2-accent { margin-bottom: 36px; }
/* =====================================================================
   Меню: пункт про аниматоров (animatorybravo.ru) и меню-бургер на телефоне и планшете
   ===================================================================== */
.nav-anim { color: var(--accent) !important; }
.nav-phones { display: none; }
.burger { display: none; }
@media (min-width: 1081px) and (max-width: 1360px) { .nav { gap: 16px; } .nav a { font-size: 14px; } .nav-anim { max-width: 190px; line-height: 1.2; } }
@media (max-width: 1080px) {
  .top-row { position: relative; }
  .burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 11px; margin-left: 6px; border: 0; border-radius: 12px; background: rgba(36, 65, 143, .08); cursor: pointer; order: 3; flex-shrink: 0; }
  .burger span { display: block; height: 2px; border-radius: 2px; background: var(--ink); transition: transform .25s, opacity .2s; }
  .top.menu-open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .top.menu-open .burger span:nth-child(2) { opacity: 0; }
  .top.menu-open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .top-actions { margin-left: auto; order: 2; }
  .nav { display: none !important; }
  .top.menu-open .nav { display: flex !important; flex-direction: column; gap: 0; position: absolute; left: 0; right: 0; top: 100%; margin: 0;
    background: #fff; border-radius: 0 0 22px 22px; padding: 8px 20px 18px; box-shadow: 0 0 0 1px rgba(227, 192, 106, .7), 0 24px 40px -20px rgba(30, 43, 74, .45); z-index: 60; }
  .top.menu-open .nav a { font: 600 18px/1.3 var(--body); color: var(--ink); padding: 14px 2px; border-bottom: 1px solid #E6EDF8; text-decoration: none; }
  .top.menu-open .nav a.nav-anim { color: var(--accent) !important; }
  .top.menu-open .nav-phones { display: flex; flex-direction: column; padding-top: 6px; }
  .top.menu-open .nav-phones a { border-bottom: 0 !important; padding: 8px 2px !important; font-weight: 700 !important; }
}
/* компьютер: ссылки на аниматоров и мероприятия — тонкой строкой над шапкой; в меню их не дублируем */
.top-links { display: flex; justify-content: flex-end; gap: 26px; padding-top: 6px; font-size: 13px; }
.top-links a { color: var(--accent); text-decoration: none; font-weight: 600; }
.top-links a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 1081px) { .nav .nav-anim { display: none; } }
@media (max-width: 1080px) { .top-links { display: none; } }
/* подвал: другие проекты «Браво» — внизу, чтобы не уводить человека до заявки */
.foot-projects { flex-basis: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; padding-top: 6px; }
.foot-projects p { margin: 0 8px 0 0; color: #fff; font-weight: 700; }
.foot-projects small { font-weight: 400; color: var(--ice); }
.foot-projects a { display: inline-flex; align-items: center; min-height: 42px; padding: 0 18px; border-radius: 999px; text-decoration: none; color: #fff; font-weight: 600; box-shadow: inset 0 0 0 1px rgba(227, 192, 106, .7); }
.foot-projects a:hover { background: rgba(255, 255, 255, .08); }
@media (max-width: 720px) { .foot-projects { flex-direction: column; align-items: stretch; } .foot-projects a { justify-content: center; } }
/* кнопки других проектов — заметные: светлые, с золотой кромкой */
.foot-projects a { flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; min-height: 58px; padding: 8px 22px !important; border-radius: 16px;
  background: linear-gradient(180deg, #FFFFFF, #EEF3FC); color: var(--ink) !important; box-shadow: 0 0 0 2px #E3C06A, 0 10px 24px -14px rgba(0, 0, 0, .6); }
.foot-projects a b { font: 700 17px/1.2 var(--serif); color: var(--carmine); }
.foot-projects a span { font-size: 14px; color: var(--ink-2); }
.foot-projects a:hover { background: #fff; box-shadow: 0 0 0 2px #F3DC9A, 0 0 18px rgba(240, 205, 120, .55); }
@media (max-width: 720px) { .foot-projects a { align-items: center; text-align: center; } }
/* синий в заголовках — глубже (на телефоне выглядел голубым); телефон: кнопка из шапки уходит — бургер помещается */
.h2-accent .hl-blue { color: #1F3F8F; }
@media (max-width: 720px) { .top-actions .btn-red { display: none; } .burger { margin-left: auto; } }
/* =====================================================================
   Телефон: волшебство как на компьютере — яркая картинка блока полосой внизу
   (подарки, путь шагов, ёлки), бледная мобильная подложка — под ней; ленты всегда видны
   ===================================================================== */
@media (max-width: 860px) {
  #why { background: url("/assets/img/bg/why.webp") center bottom / 100% auto no-repeat, url("/assets/img/bg/why-m.webp") center top / cover no-repeat !important; padding-bottom: 46vw !important; }
  #steps { background: url("/assets/img/bg/steps.webp") center bottom / 100% auto no-repeat, url("/assets/img/bg/steps-m.webp") center top / cover no-repeat !important; padding-bottom: 46vw !important; }
  #prices { background: url("/assets/img/bg/included.webp") center bottom / 100% auto no-repeat, url("/assets/img/bg/prices-m.webp") center top / cover no-repeat !important; padding-bottom: 52vw !important; }
  #places { background: url("/assets/img/bg/places.webp") center bottom / 100% auto no-repeat, url("/assets/img/bg/places-m.webp") center top / cover no-repeat !important; padding-bottom: 46vw !important; }
  #extras { background: url("/assets/img/bg/extras.webp") center bottom / 100% auto no-repeat, url("/assets/img/bg/extras-m.webp") center top / cover no-repeat !important; padding-bottom: 52vw !important; }
  #reviews { background: url("/assets/img/bg/reviews.webp") center bottom / 100% auto no-repeat, linear-gradient(180deg, var(--bg), #DCE8FA) !important; padding-bottom: 42vw !important; }
  body .sec::before, body .sec::after { height: 48px !important; }
  /* в лентах карточки видны всегда, без «всплытия» */
  .plans .rv.wait, .places .rv.wait, .polaroids .rv.wait { opacity: 1 !important; transform: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; }
  html { scroll-behavior: auto; }
}

/* бегущая строка и мерцание кнопок — надёжно на всех телефонах:
   свечение текста неподвижное (iPhone не рисует огромный слой с анимированной тенью), двигается только лента;
   при включённом «уменьшении движения» строка плывёт очень медленно, кнопки мерцают мягко, а не замирают */
.ticker span { animation: none !important; text-shadow: 0 0 8px rgba(255, 222, 150, .7); }
.ticker .spk { filter: none !important; animation: spkfade 2.6s ease-in-out infinite !important; }
@keyframes spkfade { 50% { opacity: .45; } }
.ticker-track { will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .ticker-track { animation-duration: 120s !important; animation-iteration-count: infinite !important; }
  .btn-red::after { animation-duration: 7s !important; animation-iteration-count: infinite !important; }
  .btn-red { animation-duration: 5s !important; animation-iteration-count: infinite !important; }
  .ticker .spk { animation-duration: 3s !important; animation-iteration-count: infinite !important; }
}

/* =====================================================================
   Телефон: без пустых полос между блоками — нижняя картинка блока частично
   уходит под содержимое, место под неё и верхние отступы меньше
   ===================================================================== */
@media (max-width: 860px) {
  #why, #steps, #places { padding-bottom: 20vw !important; }
  #prices, #extras { padding-bottom: 22vw !important; }
  #reviews { padding-bottom: 16vw !important; }
  #why, #steps, #prices, #places, #extras, #photos, #reviews { padding-top: 44px !important; }
  #photos { padding-bottom: 40px !important; }
}
/* форма: согласие на рассылку — по желанию, мельче основного */
.agree.agree-opt { margin-top: 0 !important; font-size: 14px; color: var(--ink-2); }
/* форма: блок согласий (как на lvbravo.ru) — плотнее, необязательные мельче */
.agrees { margin: 14px 0 10px; }
.agrees .agree { margin: 0 0 8px !important; font-size: 14px; line-height: 1.4; }
