/* Основной сайт bankrot-feniks.ru — перенос с Creatium.
   Три раскладки, как на других лендингах проекта:
   ПК ≥1280px — раскладка оригинала (контейнер 1170, zero-рамка 1200);
   планшет 768–1279px — своя композиция на 768 (у оригинала планшета нет);
   телефон ≤767px — раскладка оригинала, зафиксирована на 375px по центру (контейнер 375, zero-рамка 320).
   Уже 375px телефонная композиция ужимается зумом (90-common.js). */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'Fira Sans', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #333;
  background: #fff;
}
p, h1, h2, h3, h4, ul, ol { margin: 0; padding: 0; }
img { display: block; max-width: none; }
a { color: inherit; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; padding: 0; }
.serif { font-family: 'Oranienbaum', serif; font-weight: 400; }

/* Раскладки: .d — ПК; .m — телефон и планшет (пока у секции нет своего планшетного блока);
   .p — только телефон; .t — только планшет */
@media (max-width: 1279px) { .d { display: none !important; } }
@media (min-width: 1280px) { .m { display: none !important; } }
@media (min-width: 768px) { .p { display: none !important; } }
@media (max-width: 767px), (min-width: 1280px) { .t { display: none !important; } }

/* Контейнер потоковых секций */
.wrap { position: relative; width: 1170px; margin: 0 auto; }
@media (max-width: 1279px) { .wrap { width: 375px; padding: 0 15px; } }
@media (min-width: 768px) and (max-width: 1279px) { .wrap { width: 768px; padding: 0 24px; } }

/* Рамка zero-секций (свободное позиционирование): дети — absolute от рамки */
.zf { position: relative; width: 1200px; height: 100%; margin: 0 auto; }
@media (max-width: 1279px) { .zf { width: 320px; } }

section { position: relative; overflow: hidden; }

/* Золотая кнопка (Creatium btn-legacy) */
.btn {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: #cbb17d; color: #5e4b25;
  border-radius: 5px; box-shadow: 0 4px 0 0 #8d7038;
  font-size: 16px; line-height: 22.8571px; text-align: center;
  transition: filter .2s;
}
.btn b { font-weight: 700; text-transform: uppercase; }
.btn:hover { filter: brightness(1.05); }

/* Попапы (механика — base.js; содержимое попапов — parts/90-modals.*) */
.modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(0, 0, 0, .6); overflow-y: auto; }
.modal[hidden] { display: none; }
.modal__box { position: relative; max-width: 100%; margin: auto; }
.modal__x { position: absolute; top: -36px; right: -6px; width: 32px; height: 32px; font-size: 32px; line-height: 32px; color: #fff; }
.modal__video { width: min(90vw, 960px); aspect-ratio: 16 / 9; background: #000; }
.modal__video iframe { width: 100%; height: 100%; border: 0; display: block; }
.modal__img { max-width: 90vw; max-height: 85vh; }
html.modal-open { overflow: hidden; }


/* ===== 00-hero.css ===== */
/* --- Десктоп: zero-секция, координаты от рамки 1200 --- */
.s00d { height: 850px; background: url(assets/img/bg.webp) 50% 50% / 2233px 1495px no-repeat; }
.s00d .zf > * { position: absolute; z-index: 2; }
.s00d__photo { left: 620.5px; top: 111px; width: 610px; height: 737px; z-index: 1 !important; }
.s00d__logo { left: 43.5px; top: 30.5px; width: 69.5px; height: 38.5px; }
.s00d__sep { left: 127.5px; top: 16px; width: 2px; height: 67px; background: rgba(213, 193, 151, .5); }
.s00d__tag { left: 143px; top: 16px; width: 153px; font-size: 14px; line-height: 22.4px; color: #000; opacity: .66; }
.s00d__rate { top: 25px; width: 128.5px; height: 53px; }
.s00d__rate img { width: 100%; height: 100%; }
.s00d__rate--ya { left: 558px; }
.s00d__rate--gis { left: 706.5px; }
.s00d__phone { left: 855px; top: 24px; width: 185.5px; text-align: right; font-size: 20px; line-height: 32px; }
.s00d__phone a { color: #e6a219; }
.s00d__hours { left: 855px; top: 60px; width: 185.5px; text-align: right; font-size: 12px; line-height: 19.2px; color: #000; opacity: .66; }

.burger { display: flex; align-items: flex-start; justify-content: center; background: #cbb17d; border-radius: 25px; }
.burger svg { fill: #fff; }
.s00d__burger { left: 1094.5px; top: 32.5px; width: 64px; height: 38px; padding-top: 8px; }
.s00d__burger svg { width: 15.75px; height: 18px; }

.s00d__title { left: 33.5px; top: 159px; width: 1130px; font-size: 64px; line-height: 76.8px; color: #000; }
.s00d__title u, .s00m__title u { color: #b8954e; }
.s00d__dash { left: 33.5px; top: 420.5px; width: 24px; height: 2px; }
.s00d__lead { left: 67.5px; top: 409.5px; width: 1096px; font-size: 18px; line-height: 28.8px; color: #000; opacity: .5; }
.s00d__cta { left: 38.5px; top: 528px; width: 265px; height: 80px; }
.s00d__tap { left: 323.5px; top: 528px; width: 32px; height: 32px; }
.s00d__test { left: 365.5px; top: 528px; width: 793px; font-size: 16px; line-height: 24px; color: #000; opacity: .66; }

/* Карточки преимуществ (общие для десктопа и мобайла) */
.hcard { position: absolute; background: #fff; border-radius: 5px; box-shadow: 0 13px 31px -13px rgba(0, 0, 0, .14); }
.hcard > * { position: absolute; }
.hcard img { left: 0; bottom: 0; }
.hcard__t, .hcard__d { font-size: 14px; line-height: 22.4px; color: #333; }
.s00d__c1 { left: 33.5px; top: 658px; width: 352px; height: 175px; }
.s00d__c1 img { width: 100px; height: 127px; }
.s00d__c1 p { left: 110.5px; width: 226.5px; }
.s00d__c2 { left: 395.5px; top: 658px; width: 367px; height: 175px; }
.s00d__c2 img { width: 121.5px; height: 131.5px; }
.s00d__c2 p { left: 131.5px; width: 220.5px; }
.s00d__c3 { left: 772.5px; top: 658px; width: 391px; height: 175px; }
.s00d__c3 img { width: 113px; height: 141.5px; }
.s00d__c3 p { left: 132.5px; width: 243.5px; }
.s00d .hcard__t { top: 28px; }
.s00d .hcard__d { top: 83px; }

/* --- Мобайл: шапка закреплена сверху --- */
.s00m-bar { height: 51.28125px; }
.s00m-bar__in {
  position: fixed; z-index: 100; top: 0; left: 0; right: 0; height: 51.28125px; background: #fafafa;
}
.s00m-bar__in > * { position: absolute; }
/* Колонки Creatium: 24.225% / 51.408% / 24.366% от ряда 355px; композиция 375px по центру.
   Без vw: под зумом (экраны уже 375px) vw считается от реального экрана и разъезжается */
.s00m-bar__in { --row: 355px; --x0: calc(50% - 177.5px); }
.s00m-bar__logo { left: calc(var(--x0) + 15px); top: 12.5px; width: 46.5px; height: 26px; }
.s00m-bar__ya, .s00m-bar__gis { top: 11px; width: calc(var(--row) * .51408 / 2 - 20px); }
.s00m-bar__ya img, .s00m-bar__gis img { width: 100%; height: auto; }
.s00m-bar__ya { left: calc(var(--x0) + var(--row) * .24225 + 10px); }
.s00m-bar__gis { left: calc(var(--x0) + var(--row) * (.24225 + .51408 / 2) + 10px); }
.s00m-bar__burger { left: calc(var(--x0) + var(--row) * .75634 + 15px); top: 10px; width: calc(var(--row) * .24366 - 30px); height: 31.5px; padding-top: 8px; }
.s00m-bar__burger svg { width: 11.375px; height: 13px; }

/* --- Мобайл: первый экран, колонка 300px --- */
.s00m { background: url(assets/img/bgcc.webp) 50% 0 / cover no-repeat; }
.s00m__col { width: 300px; margin: 0 auto; padding: 12px 0 29.5px; }
.s00m__title { margin: 0 5px; font-size: 28px; line-height: 33.6px; text-align: center; color: #000; }
.s00m__lead { margin: 7px 5px 10px; font-size: 14px; line-height: 22.4px; text-align: center; color: #000; opacity: .5; }
.s00m__photo { position: relative; height: 249px; }
.s00m__photo > picture > img { position: absolute; left: 10px; top: -5px; width: 280px; height: 254px; }
.s00m__info { position: absolute; left: 45px; top: 150px; width: 50px; height: 43px; padding: 8px 0 0 11.5px; }
.s00m__info img { width: 27px; height: 27px; }
.s00m__test { display: flex; margin: 0 5px; padding: 12px; background: rgba(252, 251, 249, .7); }
.s00m__test img { width: 27px; height: 27px; flex: none; }
.s00m__test p { padding-left: 10px; font-size: 12px; line-height: 19.2px; color: #000; opacity: .66; }
.s00m__cta { width: 290px; height: 80px; margin: 0 5px 10px; }
.s00m .hcard { position: relative; width: 300px; }
.s00m .hcard__d { line-height: 21px; }
.s00m__c1 { height: 158px; margin-bottom: 11px; }
.s00m__c1 img { width: 93px; height: 149px; }
.s00m__c1 .hcard__t { left: 113px; top: 25px; width: 182px; }
.s00m__c1 .hcard__d { left: 113px; top: 80px; width: 182px; }
.s00m__c2 { height: 173px; margin-bottom: 11px; }
.s00m__c2 img { width: 102.5px; height: 161.5px; }
.s00m__c2 .hcard__t { left: 112.5px; top: 19px; width: 182.5px; }
.s00m__c2 .hcard__d { left: 112.5px; top: 74px; width: 182.5px; }
.s00m__c3 { height: 160.5px; }
.s00m__c3 img { width: 92.5px; height: 151.5px; }
.s00m__c3 .hcard__t { left: 117.5px; top: 27.5px; width: 177.5px; }
.s00m__c3 .hcard__d { left: 117.5px; top: 82px; width: 177.5px; }

/* --- Планшет 768–1279: композиция 768px по центру (у оригинала планшета нет — свой дизайн по мотивам ПК) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  /* Шапка: логотип, рейтинги, телефон, меню — в одну строку на 720px */
  .s00m-bar { height: 64px; }
  .s00m-bar__in { height: 64px; display: flex; align-items: center; gap: 0; padding: 0 calc(50% - 360px); }
  .s00m-bar__in > * { position: static; }
  .s00m-bar__logo { width: 69.5px; height: 38.5px; margin-right: auto; }
  .s00m-bar__ya, .s00m-bar__gis { width: 112px; margin-right: 14px; }
  .s00m-bar__phone { margin: 0 20px 0 auto; text-align: right; font-size: 18px; line-height: 24px; }
  .s00m-bar__phone a { color: #e6a219; }
  .s00m-bar__phone span { display: block; font-size: 12px; line-height: 16px; color: #000; opacity: .66; }
  .s00m-bar__burger { width: 64px; height: 38px; padding-top: 10px; }
  .s00m-bar__burger svg { width: 15.75px; height: 18px; }

  /* Первый экран: текст слева 420px, фото справа, три карточки в ряд */
  .s00m__col { position: relative; display: grid; grid-template-columns: repeat(3, 232px); column-gap: 12px; width: 720px; padding: 44px 0 40px; }
  /* Левая колонка — каждый блок на всю строку сетки, ширина текста 430px; карточки — по одной колонке, в один ряд */
  .s00m__title, .s00m__lead, .s00m__test, .s00m__cta { grid-column: 1 / -1; position: relative; z-index: 2; max-width: 430px; margin-left: 0; margin-right: 0; text-align: left; }
  .s00m__title { font-size: 40px; line-height: 48px; }
  .s00m__lead { margin: 18px 0 26px; font-size: 16px; line-height: 25.6px; }
  .s00m__photo { position: absolute; z-index: 1; right: -24px; top: 24px; width: 330px; height: 398px; }
  .s00m__photo > picture > img { left: 0; top: 0; width: 330px; height: 398px; }
  .s00m__info { display: none; }
  .s00m__test { margin-bottom: 20px; padding: 14px; background: rgba(252, 251, 249, .8); }
  .s00m__test p { font-size: 14px; line-height: 21px; }
  .s00m__cta { width: 265px; margin-bottom: 34px; }
  /* Карточки: картинка сверху слева, текст под ней */
  .s00m .hcard { position: relative; z-index: 2; width: 232px; height: auto; min-height: 250px; margin: 0; padding: 16px 16px 18px; }
  .s00m .hcard > * { position: static; }
  .s00m .hcard img { display: block; width: auto !important; height: 96px !important; margin: 0 0 12px; }
  .s00m .hcard__t, .s00m .hcard__d { width: auto !important; }
  .s00m .hcard__d { margin-top: 6px; line-height: 21px; }
}


/* ===== 01-stories.css ===== */
/* --- Десктоп: колонка 900 по центру контейнера 1170 --- */
.s01d { padding: 40px 0 47px; }
.s01d__col { width: 900px; margin: 0 auto; }
.s01d__title { margin: 0 5px; padding-top: 10px; font-size: 48px; line-height: 57.6px; text-align: center; color: #000; }
.s01d__sub { margin: 10px 5px 0; font-size: 18px; line-height: 28.8px; text-align: center; color: #000; opacity: .5; }

/* Карточка истории: белая, тень Creatium; колонки по центру по вертикали */
.s01d__card {
  display: flex; align-items: center;
  margin-top: 34px; padding: 19px 0 20px;
  background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14);
}
.s01d__sub + .s01d__card { margin-top: 38px; }
/* фото слева: колонки 38.8152% / 61.1848% от 900, внутренние отступы 20 */
.s01d__card--l .s01d__pic { flex: 0 0 38.8152%; padding: 0 20px; }
.s01d__card--l .s01d__body { flex: 0 0 61.1848%; padding: 0 20px; }
/* фото справа: поле 54 слева / 20 справа, колонки 61.9712% / 38.0288% от 826 */
.s01d__card--r { padding-left: 54px; padding-right: 20px; }
.s01d__card--r .s01d__body { flex: 0 0 61.9712%; }
.s01d__card--r .s01d__pic { flex: 0 0 38.0288%; }
.s01d__pic img { width: calc(100% - 10px); height: auto; margin: 5px; aspect-ratio: 299 / 325; }
.s01d__card--r .s01d__pic img { aspect-ratio: 304 / 331; }

.s01d__h { margin: 10px 5px; font-size: 30px; line-height: 36px; color: #000; }
.s01d__who { display: flex; align-items: center; padding: 10px 5px 0; }
.s01d__who > img { flex: none; width: 58px; height: 58px; }
.s01d__who > div { padding-left: 17px; }
.s01d__name { font-size: 18px; line-height: 21.6px; color: #333; }
.s01d__role { font-size: 14px; line-height: 22.4px; color: #333; opacity: .5; }
.s01d__quote { display: flex; align-items: flex-start; padding: 8px 5px 10px 41px; }
.s01d__q { flex: none; width: 20px; height: 23px; }
.s01d__q img { width: 20px; height: 16.281px; margin-top: 3.64px; }
.s01d__quote p { padding-left: 10px; font-size: 14px; line-height: 22.4px; color: #333; opacity: .66; }

/* --- Мобайл: колонка 300 по центру (как widget-max-width Creatium) --- */
.s01m { padding: 40px 0 47px; }
.s01m .wrap { padding: 0 20px; }
.s01m__col { max-width: 300px; margin: 0 auto; }
.s01m__title { margin: 0 5px; padding-top: 10px; font-size: 24px; line-height: 28.8px; text-align: center; color: #000; }
.s01m__sub { margin: 10px 5px 0; font-size: 14px; line-height: 22.4px; text-align: center; color: #000; opacity: .5; }
.s01m__card {
  margin-top: 25px; padding: 10px;
  background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14);
}
.s01m__sub + .s01m__card { margin-top: 28px; }
.s01m__pic { width: 100%; height: auto; aspect-ratio: 280 / 198; margin-bottom: 5px; }
.s01m__body { padding: 10px 17px; }
.s01m__h { margin: 0 5px 10px; font-size: 20px; line-height: 24px; color: #000; }
.s01m__who { display: flex; align-items: center; padding: 10px 5px 0; }
.s01m__who > img { flex: none; width: 58px; height: 58px; }
.s01m__who > div { padding-left: 17px; }
.s01m__name { font-size: 16px; line-height: 19.2px; color: #333; }
.s01m__role { font-size: 14px; line-height: 22.4px; color: #333; opacity: .5; }
.s01m__q { padding: 10px 5px; }
.s01m__q img { width: 16.094px; height: 13.063px; }
.s01m__text { margin: 0 5px; padding-bottom: 5px; font-size: 14px; line-height: 22.4px; color: #333; opacity: .67; }

/* --- Планшет 768–1279: карточки историй горизонтально на 720px, фото чередуется как на ПК (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s01m { padding: 56px 0; }
  .s01m .wrap { padding: 0 24px; }
  .s01m__col { max-width: 720px; }
  .s01m__title { max-width: 640px; margin: 0 auto; font-size: 34px; line-height: 1.2; }
  .s01m__sub { font-size: 16px; line-height: 25.6px; }
  .s01m__card { display: flex; align-items: flex-start; }
  .s01m__card:nth-of-type(2) { flex-direction: row-reverse; }
  .s01m__pic { flex: 0 0 300px; width: 300px; margin: 16px; border-radius: 4px; }
  .s01m__body { flex: 1 1 auto; padding: 22px 12px 18px; }
  .s01m__h { font-size: 22px; line-height: 1.2; }
}


/* ===== 02-maxim.css ===== */
/* --- Общее: тёмный фон (cover) и кнопка консультации --- */
.s02d, .s02m { background: #1b222c url(assets/img/bguu.webp) 50% 50% / cover no-repeat; color: #fff; }
.s02__cta {
  width: 100%; height: 74.313px; padding: 0;
  font-size: 14px; line-height: 20px;
}
.s02__cta:hover { filter: none; background: #c2a366; color: #fff; }
.s02__cta:active { background: #b99650; color: #fff; box-shadow: inset 0 4px 0 0 #8d7038; }

/* --- Десктоп: сетка 46.087% / 53.913% от 1180, фото — свободный слой, выходит за секцию --- */
.s02d { overflow: visible; }
.s02d__grid { display: flex; align-items: flex-start; margin: 0 -5px; padding: 94px 0 122px; }
.s02d__left { position: relative; flex: 0 0 46.087%; height: 437px; padding: 0 10px; }
.s02d__photo {
  position: absolute; left: -300px; top: -110px;
  /* бокс как в оригинале: 1068.5×1325.5 — это натуральные пропорции картинки (0.806), без искажения */
  width: 1068.5px; height: 1325.5px; max-width: none;
  pointer-events: none;
}
.s02d__right { flex: 0 0 53.913%; padding: 0 10px; }
.s02d__title { margin: 0 5px; padding-top: 10px; font-size: 48px; line-height: 57.6px; color: #fff; }
.s02d__sub { margin: 10px 5px 0; font-size: 18px; line-height: 28.8px; color: #fff; opacity: .5; }
.s02d__me { width: 400px; max-width: 100%; margin: 0 auto; padding: 20px 5px 10px; }
.s02d__hello { padding-top: 10px; font-size: 20px; line-height: 24px; color: #fff; }
.s02d__name { font-size: 35px; line-height: 42px; color: #cbb17d; }
.s02d__iam { padding: 10px 0; font-size: 16px; line-height: 25.6px; color: #fff; }
.s02d__text { padding: 10px 0; font-size: 14px; line-height: 22.4px; color: #fff; opacity: .66; }
.s02d .s02__cta { margin: 10px 0; }

/* --- Мобайл: колонка 300 --- */
.s02m { padding: 54px 0 122px; }
.s02m .wrap { padding: 0 20px; }
.s02m__col { max-width: 300px; margin: 0 auto; }
.s02m__col > p { margin: 0 5px; color: #fff; }
.s02m__title { padding-top: 10px; font-size: 24px; line-height: 28.8px; }
.s02m__sub { padding: 10px 0; font-size: 14px; line-height: 22.4px; opacity: .5; }
.s02m__hello { padding-top: 10px; font-size: 14px; line-height: 16.8px; }
.s02m .s02m__name { font-size: 22px; line-height: 26.4px; color: #cbb17d; }
.s02m__iam { padding-top: 10px; font-size: 14px; line-height: 22.4px; }
.s02m__text { padding: 10px 0; font-size: 14px; line-height: 22.4px; opacity: .66; }
.s02m__zero { position: relative; height: 386px; }
.s02m__photo { position: absolute; left: -45px; top: 13px; width: 370px; height: 384px; max-width: none; pointer-events: none; }
.s02m__info { position: absolute; left: 55px; top: 290px; width: 50px; height: 43px; padding: 8px 0 0 11.5px; }
.s02m__info img { width: 27px; height: 27px; }
.s02m .s02__cta { width: calc(100% - 10px); margin: 10px 5px; }

/* --- Планшет 768–1279: как на ПК — фото слева у нижнего края, текст и кнопка справа; сетка 300 + 400 (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s02m { padding: 64px 0 0; }
  .s02m .wrap { padding: 0 24px; }
  .s02m__col { display: grid; grid-template-columns: 300px 400px; column-gap: 20px; max-width: 720px; }
  .s02m__col > p, .s02m .s02__cta { grid-column: 2; }
  .s02m__title { font-size: 32px; line-height: 1.2; }
  .s02m__sub { font-size: 16px; line-height: 25.6px; }
  .s02m__hello { padding-top: 14px; font-size: 16px; line-height: 19.2px; }
  .s02m .s02m__name { font-size: 26px; line-height: 31.2px; }
  .s02m__iam { font-size: 16px; line-height: 25.6px; }
  .s02m__text { font-size: 15px; line-height: 24px; }
  .s02m .s02__cta { width: 290px; margin: 10px 5px 56px; }
  /* фото не заходит на колонку текста: правый край 316px < 344px (начало текста); пропорции 370:384 */
  .s02m__zero { grid-column: 1; grid-row: 1 / span 8; align-self: end; height: 353px; }
  .s02m__photo { left: -24px; top: auto; bottom: 0; width: 340px; height: 353px; }
  .s02m__info { display: none; }
}


/* ===== 03-quiz.css ===== */
/* --- Секция 03: заголовок и первый вопрос квиза (.fq-inline — стили ниже; подзаголовок «Пройдите тест…» убран 07.10.2026) --- */
.s03 { padding: 70px 0 50px; }
.s03__title { margin: 0 5px; padding-top: 10px; font-size: 48px; line-height: 57.6px; text-align: center; color: #000; }
@media (max-width: 1279px) {
  .s03 { padding-top: 80px; }
  .s03__col { max-width: 300px; margin: 0 auto; }
  .s03__title { font-size: 24px; line-height: 28.8px; }
}

/* ===== Квиз на весь экран (.fq) — по образцу Правэкса, в цветах Феникса (07.10.2026) =====
   Экран поверх страницы на всех раскладках. Колонка квиза: ПК и планшет — 550px, телефон — 375px (как вся телефонная раскладка).
   Карточка шага (.fq-card с шапкой прогресса) та же и в секции 03 — там стоит первый вопрос. */
html.fq-open { overflow: hidden; }
.fq { position: fixed; inset: 0; z-index: 1000; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; background: #f4f2ee; outline: 0; }
.fq[hidden] { display: none; }
.fq__top { position: absolute; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; height: 72px; padding: 0 24px; }
.fq__logo { width: 70px; height: auto; }
.fq__x { width: 44px; height: 44px; border-radius: 50%; font-size: 34px; line-height: 44px; color: #5e4b25; transition: background-color .2s; }
.fq__in { display: flex; flex-direction: column; justify-content: center; width: 550px; min-height: 100%; margin: 0 auto; padding: 84px 0 40px; }

/* Смена шага: уехал влево — приехал справа */
.fq__step.is-out { animation: fqOut .2s ease-in forwards; }
.fq__step.is-in { animation: fqIn .22s ease-out; }
@keyframes fqOut { to { transform: translateX(-60px); opacity: 0; } }
@keyframes fqIn { from { transform: translateX(60px); opacity: 0; } }

/* Шапка: «← Назад», «Вопрос N из 6», полоса и сегменты прогресса */
.fq-head { margin-bottom: 20px; }
.fq-head__row { position: relative; display: flex; align-items: center; justify-content: center; min-height: 24px; margin-bottom: 8px; }
.fq-back { position: absolute; left: 0; top: 50%; transform: translateY(-50%); padding: 4px 0; font-size: 14px; color: #8d7038; }
.fq-count { font-size: 14px; line-height: 1.4; color: #777; }
.fq-count b { color: #333; }
.fq-bar { height: 6px; margin-bottom: 10px; overflow: hidden; border-radius: 3px; background: #e6dfd0; }
.fq-bar i { display: block; height: 100%; border-radius: 3px; background: #cbb17d; transition: width .4s; }
.fq-segs { display: flex; gap: 6px; }
.fq-segs i { flex: 1; height: 5px; border-radius: 3px; background: #d8d2c6; }
.fq-segs i.is-on { background: #cbb17d; }

/* Карточка шага */
.fq-card { padding: 30px 28px; border-radius: 10px; background: #fff; box-shadow: 0 2px 14px rgba(94, 75, 37, .1); color: #333; }
.fq-card--center { text-align: center; }
.fq-label { margin-bottom: 8px; font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; color: #a8853f; }
.fq-q { margin-bottom: 22px; font-family: 'Oranienbaum', serif; font-size: 30px; font-weight: 400; line-height: 1.2; color: #222; }
.fq-q--files { font-size: 27px; }
.fq-q--accent { margin-bottom: 12px; color: #8d7038; }

.fq-opt { display: flex; align-items: center; gap: 14px; width: 100%; margin-bottom: 10px; padding: 15px 18px; border: 1px solid #ddd; border-radius: 6px; background: #fff; font-size: 16px; line-height: 1.35; text-align: left; color: #333; transition: border-color .2s, background-color .2s; }
.fq-opt.is-sel { border-color: #cbb17d; background: #f8f0e0; }
.fq-rb { position: relative; flex: 0 0 22px; height: 22px; border: 2px solid #ccc; border-radius: 50%; transition: border-color .2s; }
.fq-opt.is-sel .fq-rb { border-color: #c2a366; }
.fq-opt.is-sel .fq-rb::after { content: ''; position: absolute; inset: 4px; border-radius: 50%; background: #c2a366; }

/* Кнопка — золотая кнопка сайта (.btn) с бегущим бликом, как у Правэкса */
.fq-btn {
  position: relative; display: block; width: 100%; margin-top: 20px; padding: 17px 16px; overflow: hidden;
  border-radius: 5px; background: #cbb17d; color: #5e4b25; box-shadow: 0 4px 0 #8d7038;
  font-size: 16px; font-weight: 700; line-height: 1.3; letter-spacing: .03em; text-align: center; text-transform: uppercase;
  transition: filter .2s;
}
.fq-btn::after { content: ''; position: absolute; top: 0; left: -100%; width: 60%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent); animation: fqShine 3s ease-in-out infinite; pointer-events: none; }
@keyframes fqShine { 0% { left: -100%; } 60%, 100% { left: 140%; } }
.fq-btn:active { transform: translateY(2px); box-shadow: 0 2px 0 #8d7038; }
.fq-btn:disabled { background: #e2ded6; color: #9b968c; box-shadow: none; filter: none; transform: none; cursor: default; }
.fq-btn:disabled::after { content: none; }
.fq-warn { margin-top: 14px; font-size: 14px; line-height: 1.4; text-align: center; color: #d0342c; }
.fq-warn::before { content: '● '; }

/* Шаг лид-магнита */
.fq-hook { margin: -8px 0 18px; font-size: 16px; font-weight: 700; color: #d0342c; }
.fq-hook u { color: #8d7038; }
.fq-books { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; }
.fq-book { display: flex; align-items: center; gap: 12px; font-size: 15px; line-height: 1.35; }
.fq-book img { flex: 0 0 76px; width: 76px; height: auto; }
.fq-single { display: flex; align-items: center; gap: 24px; }
.fq-nums { flex: 1; display: flex; flex-direction: column; gap: 14px; list-style: none; counter-reset: fqn; }
.fq-nums li { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; line-height: 1.4; counter-increment: fqn; }
.fq-nums li::before { content: counter(fqn); flex: 0 0 22px; font-family: 'Oranienbaum', serif; font-size: 34px; line-height: .85; text-align: center; color: #c2a366; }
.fq-single__img { flex: 0 0 150px; width: 150px; height: auto; }

/* Шаг телефона */
.fq-desc { margin-bottom: 22px; font-size: 16px; line-height: 1.5; color: #444; }
.fq-msgs { display: flex; gap: 10px; margin-bottom: 20px; }
.fq-msg { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 8px; border: 2px solid #ddd; border-radius: 8px; background: #fff; font-size: 14px; font-weight: 700; color: #333; transition: border-color .2s, background-color .2s; }
.fq-msg.is-sel { border-color: #cbb17d; background: #f8f0e0; }
.fq-msg img, .fq-msg svg, .fq-msg__sms { display: block; width: 40px; height: 40px; border-radius: 10px; }
.fq-msg__sms { display: flex; align-items: center; justify-content: center; background: #cbb17d; color: #fff; font-size: 12px; font-weight: 900; }
.fq-in-label { display: block; margin-bottom: 8px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: #666; }
.fq-phone { display: block; width: 100%; margin-bottom: 16px; padding: 15px 16px; border: 2px solid #ddd; border-radius: 6px; outline: 0; background: #fff; color: #222; font: 400 20px/1.2 'Fira Sans', sans-serif; }
.fq-phone:focus { border-color: #cbb17d; }
.fq-phone.is-error { border-color: #d0342c; }
.fq-agree { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; line-height: 1.4; color: #666; cursor: pointer; }
.fq-agree input { flex: 0 0 18px; width: 18px; height: 18px; margin: 1px 0 0; accent-color: #c2a366; }
.fq-agree a { color: #8d7038; }
.fq-agree.is-error { color: #d0342c; }

/* Наведение — только мышью: на телефоне :hover «залипает» после касания,
   и вариант под пальцем на следующем шаге выглядел бы уже выбранным */
@media (hover: hover) {
  .fq__x:hover { background: rgba(203, 177, 125, .2); }
  .fq-back:hover { color: #5e4b25; text-decoration: underline; }
  .fq-opt:hover { border-color: #cbb17d; background: #fdfaf3; }
  .fq-opt.is-sel:hover { background: #f8f0e0; }
  .fq-btn:hover { filter: brightness(1.05); }
  .fq-btn:disabled:hover { filter: none; }
  .fq-msg:hover { border-color: #cbb17d; }
}

/* Первый вопрос в секции 03: карточка на белом фоне — с рамкой */
.s03 .fq-inline { width: 550px; margin: 44px auto 0; }
.s03 .fq-inline .fq-card { border: 1px solid #ece4d3; box-shadow: 0 10px 30px rgba(94, 75, 37, .08); }

/* Телефон: колонка 375px, как вся телефонная раскладка (уже 375px — общий зум страницы) */
@media (max-width: 767px) {
  .fq__top { height: 60px; padding: 0 15px; }
  .fq__logo { width: 56px; }
  .fq__in { width: 375px; padding: 64px 15px 24px; }
  .fq-card { padding: 22px 18px; }
  .fq-q { margin-bottom: 18px; font-size: 25px; }
  .fq-q--files { font-size: 22px; }
  .fq-q--accent { margin-bottom: 10px; }
  .fq-opt { padding: 13px 14px; font-size: 15px; }
  .fq-books { grid-template-columns: 1fr; gap: 12px; }
  .fq-book { font-size: 14px; }
  .fq-book img { flex-basis: 54px; width: 54px; }
  .fq-single { flex-direction: column-reverse; gap: 18px; }
  .fq-single__img { flex: none; width: 130px; }
  .fq-desc { font-size: 15px; }
  .fq-msgs { gap: 8px; }
  .s03 .fq-inline { width: 345px; margin: 26px -22.5px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .fq__step.is-out, .fq__step.is-in, .fq-btn::after { animation: none; }
}

/* --- Планшет 768–1279: заголовок шире, первый вопрос квиза как на ПК — 550px (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s03 { padding: 64px 0 56px; }
  .s03__col { max-width: 720px; }
  .s03__title { max-width: 640px; margin: 0 auto; font-size: 36px; line-height: 1.2; }
  .s03 .fq-inline { margin-top: 36px; }
}


/* ===== 04-moshenniki.css ===== */
/* --- 04. Схемы мошенников (тёмная, потоковая) --- */
.s04d, .s04m { background: #161c24; color: #fff; }
.s04-card { border: 1px solid #38485c; border-radius: 5px; background: rgba(255, 255, 255, .1); box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14); }
.s04-card__d { font-size: 14px; line-height: 1.6; opacity: .66; }
.s04d__btn, .s04m__btn { height: 56.84px; }
/* ховер как у кнопки оригинала (css34) */
.s04d__btn:hover, .s04m__btn:hover { filter: none; background: #c2a366; color: #fff; }

/* Десктоп. Цепи, книга и белая карточка вылезают за секцию, как в оригинале:
   вверх на 4px (в секцию 03) и вниз на 65px (в секцию 05) — поэтому overflow-y видимый,
   а по горизонтали обрезка (clip не даёт горизонтального скролла). */
.s04d { position: relative; z-index: 1; overflow: visible; overflow-x: clip; }
.s04d .wrap { padding: 72px 0 65px; }
.s04d__title { padding: 10px 5px 0; font-size: 48px; line-height: 1.2; text-align: center; }
.s04d__sub { padding: 10px 5px 17px; font-size: 18px; line-height: 1.6; text-align: center; opacity: .5; }

.s04d__cards { width: 900px; margin: 0 auto; padding: 10px 0; }
.s04d__c { display: flex; align-items: center; padding: 19px 0 20px; }
.s04d__c + .s04d__c { margin-top: 34px; }
.s04d__pic, .s04d__txt { flex: none; }
.s04d__c1 .s04d__pic, .s04d__c3 .s04d__pic { width: 348.55px; padding: 5px 25px; }
.s04d__c1 .s04d__pic img, .s04d__c3 .s04d__pic img { width: 298.55px; height: 200.69px; }
.s04d__c1 .s04d__txt, .s04d__c3 .s04d__txt { width: 549.44px; padding: 0 25px; }
.s04d .s04-card__t { padding: 10px 0; font-size: 30px; line-height: 1.2; }
.s04d .s04-card__d { padding: 10px 0; }
.s04d__c3 .s04-card__t { padding-top: 0; }
.s04d__c3 .s04-card__d { padding-bottom: 0; }
.s04d__c2 { padding: 19px 20px 20px 54px; }
.s04d__c2 .s04d__txt { width: 497.64px; padding: 0 5px; }
.s04d__c2 .s04d__pic { width: 326.34px; padding: 5px; }
.s04d__c2 .s04d__pic img { width: 316.34px; height: 213.22px; }

.s04d__low { margin-top: 108px; padding: 10px 0; }
.s04d__right { width: 709.2px; margin-left: 455.78px; padding-bottom: 339px; }
.s04d__h2 { padding: 10px 5px 0; font-size: 48px; line-height: 1.2; }
.s04d__sub2 { padding: 10px 5px 17px; font-size: 18px; line-height: 1.6; opacity: .5; }

/* Слои: координаты от .wrap (x) и от верха секции (y) */
.s04d__book, .s04d__mini, .s04d__form, .s04d__deco { position: absolute; }
.s04d__deco { pointer-events: none; }
.s04d__book { left: -465px; top: 1081.75px; width: 907.77px; height: 969.73px; z-index: 8; pointer-events: none; }
.s04d__mini { left: 493px; top: 1761.75px; width: 450px; height: 124.17px; z-index: 9; }
.s04d__mini > * { position: absolute; }
.s04d__mini img { left: 4px; top: -35.42px; width: 163.48px; height: 156.45px; }
.s04d__mini p { left: 181.13px; top: 29px; width: 251.86px; font-size: 14px; line-height: 1.6; opacity: .66; }
.s04d__form {
  left: -5px; top: 1985.75px; width: 1130px; height: 224.84px; z-index: 10;
  padding: 32px 50px 10px 49px; background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14); color: #000;
}
.s04d__form-t { padding: 10px 5px; font-size: 30px; line-height: 1.2; text-align: center; }
.s04d__form-f { width: 1026px; padding: 30px 0 40px; }
.s04d__btn { width: 590px; margin: 0 auto; }
.s04d__chain1 { left: 1035px; top: -4.25px; width: 578.44px; height: 689.52px; z-index: 11; }
.s04d__chain2 { left: -455px; top: 545.75px; width: 227.23px; height: 590.59px; z-index: 12; }
.s04d__glow { left: 1135px; top: 635.75px; width: 840px; height: 1312.5px; z-index: 13; }

/* Мобайл: колонка 300px по центру (на 320 — 280px) */
.s04m { padding: 22px 0 55px; }
.s04m .wrap { padding: 10px 20px; }
.s04m__col { max-width: 300px; margin: 0 auto; }
.s04m__title { padding: 10px 5px 0; font-size: 24px; line-height: 1.2; text-align: center; }
.s04m__sub { padding: 10px 5px 21px; font-size: 14px; line-height: 1.6; text-align: center; opacity: .5; }
.s04m__c { padding: 10px; }
.s04m__c + .s04m__c { margin-top: 18px; }
.s04m__c > img { width: calc(100% - 10px); height: auto; aspect-ratio: 268 / 191.7; margin: 5px; }
.s04m__txt { max-width: 215px; margin: 0 auto; padding: 10px 0; }
.s04m .s04-card__t { padding: 10px 5px; font-size: 20px; line-height: 1.2; }
.s04m .s04-card__d { padding: 10px 5px; }
.s04m__h2 { margin-top: 45px; padding: 10px 5px 0; font-size: 24px; line-height: 1.2; text-align: center; }
.s04m__sub2 { padding: 10px 5px 17px; font-size: 14px; line-height: 1.6; text-align: center; opacity: .5; }
.s04m__mini { padding: 10px 10px 0; }
.s04m__mini p { padding: 10px 5px 6px; font-size: 14px; line-height: 1.6; text-align: center; opacity: .66; }
.s04m__mini img { width: 193px; height: 185px; margin: 10px auto 0; }
.s04m__zero { position: relative; height: 617px; }
.s04m__book { position: absolute; left: -200px; top: -100px; width: 507.58px; height: 542.61px; pointer-events: none; }
.s04m__form {
  position: absolute; left: 8px; top: 400px; width: 275px; height: 215.84px;
  padding: 27px 16px 30px 10px; background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14); color: #000;
}
.s04m__form-t { padding: 10px 5px; font-size: 20px; line-height: 1.2; text-align: center; }
.s04m__btn { width: 239px; margin: 0 auto; }

/* --- Планшет 768–1279: карточки схем горизонтально (как на ПК), блок инструкции в две колонки:
       книга слева, текст и мини-карточка справа, форма на всю ширину (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s04m { padding: 48px 0 64px; }
  .s04m .wrap { padding: 10px 24px; }
  .s04m__col { display: grid; grid-template-columns: 300px 1fr; column-gap: 24px; max-width: 720px; }
  .s04m__col > * { grid-column: 1 / -1; }
  .s04m__title { max-width: 640px; margin: 0 auto; font-size: 34px; }
  .s04m__sub { font-size: 16px; }
  .s04m__c { display: flex; align-items: center; padding: 12px; }
  .s04m__c:nth-of-type(2) { flex-direction: row-reverse; }
  .s04m__c > img { flex: 0 0 300px; width: 300px; margin: 0; border-radius: 4px; }
  .s04m__txt { flex: 1 1 auto; max-width: none; margin: 0; padding: 6px 18px; }
  .s04m .s04-card__t { font-size: 24px; }
  /* блок инструкции: книга — колонка 1, текст — колонка 2 */
  .s04m__zero { display: contents; }
  /* книга крупнее, слегка выходит за левый край (как на ПК); пропорции 507.58:542.61 */
  .s04m__book { grid-column: 1; grid-row: 6 / span 3; position: static; width: 374px; height: 400px; margin-left: -62px; align-self: center; }
  .s04m__h2, .s04m__sub2, .s04m__mini { grid-column: 2; text-align: left; }
  .s04m__h2 { margin-top: 56px; font-size: 30px; text-align: left; }
  .s04m__sub2 { font-size: 16px; text-align: left; }
  .s04m__mini { display: flex; align-items: center; gap: 8px; padding: 6px 12px 0; }
  .s04m__mini p { flex: 1 1 auto; padding: 10px 0 16px; text-align: left; }
  .s04m__mini p br { display: none; }   /* одно предложение: мобильные переносы на планшете рвут строки */
  .s04m__mini img { flex: 0 0 auto; width: 150px; height: 143.7px; margin: 0; }
  .s04m__form { grid-column: 1 / -1; position: static; width: 100%; height: auto; margin-top: 28px; padding: 26px 24px 32px; }
}


/* ===== 05-maxim.css ===== */
/* --- 05. Максим Русяновский (zero-секция). z-index:0 — карточка из секции 04 ложится поверх --- */
.s05d, .s05m {
  z-index: 0; color: #000;
  background: linear-gradient(rgba(255, 255, 255, .76), rgba(255, 255, 255, .76)), url(assets/img/group_64.webp) 50% 50% / 3584px 1659px no-repeat #fff;
}
.s05d .zf > *, .s05m .zf > * { position: absolute; }
.s05d__ask, .s05m__ask { height: 56.84px; }
.s05d__ask:hover, .s05m__ask:hover { filter: none; background: #c2a366; color: #fff; }

/* Десктоп: координаты от рамки 1200 */
.s05d { height: 1163px; }
.s05d__photo { left: 469px; top: 70px; width: 767.34px; height: auto; }
.s05d__col { left: 28.5px; top: 160px; width: 1140px; padding: 10px 0; }
.s05d__title { padding: 10px 5px 0; font-size: 40px; line-height: 1.2; }
.s05d__sub { padding: 10px 5px 0; font-size: 20px; line-height: 1.6; opacity: .5; }
.s05d__text { margin-top: 20px; padding: 10px 5px 0; font-size: 14px; line-height: 1.6; opacity: .5; }
.s05d__since { margin-top: 20px; padding: 10px 5px 0; font-size: 20px; line-height: 1.6; opacity: .5; }
.s05d__stats { display: flex; align-items: center; width: 1150px; margin: 0 -5px; padding-bottom: 10px; }
.s05d__stat { flex: none; padding: 0 10px; }
.s05d__stat--1 { width: 215.33px; }
.s05d__stat--2 { width: 203.98px; }
.s05d__num { display: flex; justify-content: center; padding: 10px 5px; }
.s05d__stat--1 img { width: 159px; height: 66px; }
.s05d__stat--2 img { width: 155px; height: 66px; }
.s05d__stat p { padding: 0 5px 10px; font-size: 14px; line-height: 1.5; text-align: center; color: #333; opacity: .66; }
.s05d__ask { width: 353.33px; margin: 20px 0 20px 10px; }

/* Мобайл: рамка 320 */
.s05m { height: 1280px; }
.s05m__col { left: 20.5px; top: 50px; width: 280px; padding: 10px 0; }
.s05m__title { padding: 10px 5px 0; font-size: 24px; line-height: 1.2; }
.s05m__sub { padding: 10px 5px 0; font-size: 14px; line-height: 1.6; opacity: .5; }
.s05m__text { margin-top: 20px; padding: 10px 5px 0; font-size: 14px; line-height: 1.6; opacity: .5; }
.s05m__since { margin-top: 20px; padding: 10px 5px 0; font-size: 14px; line-height: 1.6; opacity: .5; }
.s05m__stats { display: flex; align-items: flex-start; }
.s05m__stat { flex: none; padding: 0 5px; }
.s05m__stat--1 { width: 139.08px; }
.s05m__stat--2 { width: 126.91px; }
.s05m__stat img { margin: 10px 5px; }
.s05m__stat--1 img { width: 119.08px; height: 49.42px; }
.s05m__stat--2 img { width: 106.91px; height: 45.52px; }
.s05m__stat p { padding: 0 5px 10px; font-size: 12px; line-height: 1.6; text-align: center; color: #333; opacity: .66; }
.s05m__ask { width: 270px; margin: 10px 5px; }
.s05m__zero { position: relative; z-index: 1; height: 399px; }
.s05m__zero > * { position: absolute; }
.s05m__photo { left: -8.98px; top: -11px; width: 288.98px; height: 409.97px; }
.s05m__info { left: 55px; top: 160px; width: 50px; height: 43px; padding: 8px 0 0 11.5px; }
.s05m__info img { width: 27px; height: 27px; }

/* --- Планшет 768–1279: рамка 720px; текст на всю ширину (переносы <br> из оригинала ложатся без висячих слов),
   внизу слева «с 2015 года», цифры и кнопка, справа фото у нижнего края (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s05m { height: auto; }
  .s05m .zf { width: 720px; }
  .s05m .zf > .s05m__col { position: relative; left: auto; top: auto; width: 720px; padding: 64px 0 56px; }
  .s05m__title, .s05m__sub, .s05m__text, .s05m__since, .s05m__stats, .s05m__ask { position: relative; z-index: 2; }
  .s05m__title { max-width: 640px; }
  .s05m__since, .s05m__stats, .s05m__ask { max-width: 420px; }
  .s05m__title { font-size: 32px; line-height: 1.2; }
  .s05m__sub { font-size: 16px; }
  .s05m__text { margin-top: 12px; font-size: 15px; }
  .s05m__since { margin-top: 12px; }
  .s05m__stat--1 { width: 170px; }
  .s05m__stat--2 { width: 160px; }
  .s05m__stat p { font-size: 13px; }
  .s05m__ask { margin-top: 14px; }
  .s05m__zero { position: absolute; z-index: 1; right: 0; bottom: 0; width: 280px; height: 397px; }
  .s05m__photo { left: 0; top: 0; width: 280px; height: 397px; }
  .s05m__info { display: none; }
}


/* ===== 06-zashchita.css ===== */
/* --- 06. «Помогаем нашим клиентам…» (потоковая) --- */
.s06 { padding: 86px 0 52px; background: #fff; }
.s06__head { padding: 10px 0; }
.s06__title { padding: 5px; font-size: 48px; line-height: 1.1; text-align: center; color: #333; }
.s06__sub { padding: 10px 5px 0; font-size: 23px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s06__cards { display: flex; gap: 30px; margin: 10px 0; }
.s06__card { flex: 1 1 0; padding: 20px 5px; background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(23, 19, 9, .14); }
.s06__card img { margin: 0 auto 10px; }
.s06__card img.d { width: 320px; height: 213px; }
.s06__card p { padding: 10px 30px 0 40px; font-size: 14px; line-height: 1.6; color: #000; opacity: .5; }

@media (max-width: 1279px) {
  .s06__head { max-width: 300px; margin: 0 auto; }
  .s06__title { font-size: 24px; line-height: 1.1; }
  .s06__sub { font-size: 16px; line-height: 1.6; }
  .s06__cards { flex-direction: column; gap: 20px; }
  .s06__card { flex: none; padding: 10px 5px 20px; }
  /* как в оригинале: картинка в натуральную ширину, но не шире карточки */
  .s06__card img.m { max-width: calc(100% - 10px); height: auto; }
  .s06__m1 { width: 421px; aspect-ratio: 325 / 209; }
  .s06__m2 { width: 560px; aspect-ratio: 325 / 247; }
  .s06__m3 { width: 560px; aspect-ratio: 325 / 209; }
  .s06__card p { padding: 10px 30px 0; }
}

/* --- Планшет 768–1279: три карточки в ряд на 720px (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s06 { padding: 64px 0 48px; }
  .s06__head { max-width: 600px; }
  .s06__title { font-size: 36px; line-height: 1.15; }
  .s06__sub { font-size: 18px; }
  .s06__cards { flex-direction: row; gap: 16px; margin-top: 24px; }
  .s06__card { flex: 1 1 0; padding: 10px 10px 20px; }
  /* одна пропорция у всех трёх картинок: обрезка cover, без искажения */
  .s06__card img.m { width: 100%; max-width: none; height: auto; aspect-ratio: 325 / 209; object-fit: cover; border-radius: 3px; }
  .s06__card p { padding: 12px 8px 0; }
}


/* ===== 07-konsultaciya.css ===== */
/* --- Общее: список с галочками, тёмная карточка заявки, ховер кнопки как у Creatium --- */
.s07-list { list-style: none; }
.s07-list li { color: #ababab; background: url(assets/img/001_tick_mark_1.webp) 0 50% / 24px 24px no-repeat; min-height: 24px; padding-left: 40px; }
.s07-card { position: absolute; background: #2b3644; border: 1px solid #38485c; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14); }
.s07-card > * { position: absolute; }
.s07-btn:hover { filter: none; background: #c2a366; color: #fff; }
.s07-btn:active { background: #b99650; color: #fff; box-shadow: inset 0 4px 0 0 #8d7038; }

/* --- Десктоп: zero-секция, координаты от рамки 1200 --- */
.s07d { height: 1004px; }
.s07d .zf > * { position: absolute; }
.s07d__bg { left: -221.5px; top: 33.5px; width: 1626.156px; height: 969.08px; }
.s07d__title { left: 38.5px; top: 160px; width: 353.328px; font-size: 48px; line-height: 1.2; color: #fff; }
.s07d__sub { left: 38.5px; top: 413.375px; width: 353.328px; font-size: 20px; line-height: 1.6; color: #fff; opacity: .5; }
.s07d__list { left: 38.5px; top: 472.375px; width: 353.328px; font-size: 16px; line-height: 1.6; }
.s07d__list li + li { margin-top: 24px; }
.s07d__card { left: 800.156px; top: 165.719px; width: 363.328px; height: 603.281px; }
/* дети карточки — от внутреннего края рамки 1px */
.s07d__ct { left: 35px; top: 124px; width: 286.328px; font-size: 30px; line-height: 1.2; text-align: center; color: #fff; }
.s07d__cd { left: 35px; top: 231px; width: 286.328px; font-size: 16px; line-height: 1.6; text-align: center; color: #fff; opacity: .5; }
.s07d__btn { left: 35px; top: 399.969px; width: 286.328px; height: 74.313px; font-size: 14px; line-height: 1.428571429; }

/* --- Мобайл: zero-секция, рамка 320 --- */
.s07m { height: 1265px; }
.s07m__box {
  position: absolute; left: 18.25px; top: 0; width: 283.5px; height: 1228.141px;
  background: url(assets/img/bgpopo.webp) 50% 50% / cover; border-radius: 13px;
}
.s07m__box > * { position: absolute; }
.s07m__title { left: 10px; top: 40px; width: 263.5px; font-size: 24px; line-height: 1.2; color: #fff; }
.s07m__sub { left: 10px; top: 136.391px; width: 263.5px; font-size: 14px; line-height: 1.6; color: #fff; opacity: .5; }
.s07m__list { left: 10px; top: 185.781px; width: 263.5px; font-size: 14px; line-height: 1.6; }
.s07m__list li + li { margin-top: 14.4px; }
.s07m__photo { left: -10.5px; top: 505.5px; width: 303px; height: 365px; }
.s07m__card { left: 15px; top: 870.5px; width: 253.5px; height: 359.891px; }
.s07m__ct { left: 14px; top: 30px; width: 218.5px; font-size: 20px; line-height: 1.2; text-align: center; color: #fff; }
.s07m__cd { left: 14px; top: 88px; width: 218.5px; font-size: 14px; line-height: 1.6; text-align: center; color: #fff; opacity: .5; }
.s07m__btn { left: 14px; top: 249.344px; width: 218.5px; height: 68.547px; font-size: 12px; line-height: 1.428571429; }

/* --- Планшет 768–1279: тёмный блок 720px; сверху текст и список слева, фото справа;
       снизу карточка заявки на всю ширину — текст слева, кнопка справа (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s07m { height: auto; padding: 40px 0; }
  .s07m .zf { width: 720px; }
  .s07m .zf > .s07m__box { position: relative; left: auto; top: auto; display: grid; grid-template-columns: 1fr 280px; column-gap: 20px; width: 720px; height: auto; padding: 44px 32px 32px; }
  .s07m__box > * { position: static; left: auto; top: auto; width: auto; }
  .s07m__title, .s07m__sub, .s07m__list { grid-column: 1; }
  .s07m__title { font-size: 32px; }
  .s07m__sub { margin-top: 14px; font-size: 15px; }
  .s07m__list { margin-top: 16px; font-size: 15px; }
  .s07m__photo { grid-column: 2; grid-row: 1 / span 3; align-self: end; width: 280px; height: 337px; margin-bottom: -2px; }
  .s07m__card { grid-column: 1 / -1; position: relative; display: grid; grid-template-columns: 1fr 260px; column-gap: 24px; align-items: center; height: auto; margin-top: 0; padding: 24px 24px 26px; }
  .s07m__card > * { position: static; width: auto; }
  .s07m__ct { grid-column: 1; font-size: 22px; text-align: left; }
  .s07m__cd { grid-column: 1; margin-top: 8px; text-align: left; }
  .s07m__btn { grid-column: 2; grid-row: 1 / span 2; width: 260px; }
}


/* ===== 08-samotek.css ===== */
/* --- Общее --- */
.s08-ico { width: 25px; height: 25px; }
.s08-btn:hover { filter: none; background: #c2a366; color: #fff; }
.s08-btn:active { background: #b99650; color: #fff; box-shadow: inset 0 4px 0 0 #8d7038; }

/* --- Десктоп: zero-секция, координаты от рамки 1200.
   Картинка (1050px) выше секции (872px): низ со свечением и ножками стола лежит поверх секции 09,
   как в оригинале (там слой картинки z-index 8 поверх контейнера следующей секции). Поэтому
   по вертикали не обрезаем, а по горизонтали — clip (без горизонтального скролла). --- */
.s08d { height: 872px; overflow: clip visible; z-index: 1; }
.s08d .zf > * { position: absolute; }
.s08d__bg { left: -157.375px; top: 0; width: 1514.766px; height: 1050.52px; }
.s08d__title { left: 35px; top: 75px; width: 1130px; font-size: 48px; line-height: 1.1; text-align: center; color: #333; }
.s08d__sub { left: 35px; top: 142.797px; width: 1130px; font-size: 20px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s08d__eg { left: 40px; top: 229.797px; width: 396.984px; font-size: 30px; line-height: 1.2; color: #000; }
.s08d__i1 { left: 40px; top: 285.797px; }
.s08d__i2 { left: 40px; top: 397.156px; }
.s08d__i3 { left: 40px; top: 474.719px; }
.s08d__p1, .s08d__p2, .s08d__p3 { left: 77px; width: 359.984px; font-size: 16px; line-height: 1.2; color: #333; }
.s08d__p1 { top: 285.797px; }
.s08d__p1d { left: 77px; top: 309.984px; width: 359.984px; font-size: 14px; line-height: 1.6; color: #333; opacity: .66; }
.s08d__p2 { top: 397.156px; }
.s08d__p3 { top: 474.719px; }
.s08d__btn { left: 40px; top: 572.281px; width: 271.063px; height: 80.047px; }

/* --- Мобайл: zero-секция, рамка 320 --- */
.s08m { height: 843px; }
.s08m .zf > * { position: absolute; }
.s08m__title { left: 26.5px; top: 55px; width: 270px; font-size: 24px; line-height: 1.1; text-align: center; color: #333; }
.s08m__sub { left: 26.5px; top: 149.172px; width: 270px; font-size: 14px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s08m__eg { left: 31.5px; top: 213.953px; width: 260px; font-size: 20px; line-height: 1.2; color: #000; }
.s08m__i1 { left: 31.5px; top: 257.953px; }
.s08m__i2 { left: 31.5px; top: 366.922px; }
.s08m__i3 { left: 31.5px; top: 437.313px; }
.s08m__p1, .s08m__p2, .s08m__p3 { left: 68.5px; width: 223px; font-size: 14px; line-height: 1.2; color: #333; }
.s08m__p1 { top: 257.953px; }
.s08m__p1d { left: 68.5px; top: 279.75px; width: 223px; font-size: 14px; line-height: 1.6; color: #333; opacity: .66; }
.s08m__p2 { top: 366.922px; }
.s08m__p3 { top: 437.313px; }
.s08m__btn { left: 31.5px; top: 524.5px; width: 260px; height: 80.047px; }
.s08m__bg { left: -43.5px; top: 601px; width: 424px; height: 242px; }

/* --- Планшет 768–1279: сетка 720px — иконки | текст | ноутбук; заголовок и подзаголовок по центру (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s08m { height: auto; }
  /* minmax(0, 1fr): иначе колонку раздувает натуральная ширина картинки ноутбука и сетка вылезает за экран */
  .s08m .zf { display: grid; grid-template-columns: 25px 312px minmax(0, 1fr); column-gap: 12px; width: 720px; padding: 56px 0; }
  /* сброс только позиционирования (та же специфичность, что у мобильного absolute); ширины — явно в каждом правиле ниже */
  .s08m .zf > * { position: static; }
  .s08m__title { grid-row: 1; grid-column: 1 / -1; max-width: 560px; margin: 0 auto; font-size: 34px; text-align: center; width: auto; }
  .s08m__title br { display: none; }
  .s08m__sub { grid-row: 2; grid-column: 1 / -1; max-width: 560px; margin: 12px auto 30px; font-size: 16px; width: auto; }
  .s08m__eg { grid-row: 3; grid-column: 1 / 3; margin-bottom: 14px; font-size: 24px; width: auto; }
  .s08m__i1 { grid-row: 4; grid-column: 1; }
  .s08m__p1 { grid-row: 4; grid-column: 2; align-self: center; font-size: 15px; width: auto; }
  .s08m__p1d { grid-row: 5; grid-column: 2; margin: 4px 0 18px; font-size: 15px; width: auto; }
  .s08m__i2 { grid-row: 6; grid-column: 1; }
  .s08m__p2 { grid-row: 6; grid-column: 2; margin-bottom: 18px; font-size: 15px; width: auto; }
  .s08m__i3 { grid-row: 7; grid-column: 1; }
  .s08m__p3 { grid-row: 7; grid-column: 2; font-size: 15px; width: auto; }
  .s08m__btn { grid-row: 8; grid-column: 1 / 3; width: 265px; margin-top: 26px; }
  .s08m__bg { grid-row: 3 / span 6; grid-column: 3; align-self: center; width: 100%; min-width: 0; height: auto; aspect-ratio: 424 / 242; }
}


/* ===== 09-etapy.css ===== */
/* --- Секция «Этапы»: тёмная, потоковая (контейнер .wrap) --- */
.s09 { background: #161c24; color: #fff; padding: 60px 0 22px; }
.s09d, .s09m { padding: 10px 0; }
.s09__title { padding: 10px 5px 0; font-size: 48px; line-height: 1.2; text-align: center; }
.s09__sub { padding: 10px 5px 17px; font-size: 18px; line-height: 1.6; text-align: center; opacity: .5; }

/* --- Карточка этапа: фото слева, текст справа по центру фото.
   Отступы — как у вложенных виджетов Creatium (карточка 6 + сетка 9/10 + колонка 20 + картинка 5) минус рамка 1px --- */
.s09c {
  display: flex; align-items: center; padding: 19px 15.016px 20px 20px;
  background: rgba(255, 255, 255, .1); border: 1px solid #38485c; border-radius: 5px;
  box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14);
}
.s09c + .s09c { margin-top: 34px; }
.s09c__img { flex: none; width: 470px; height: auto; }
.s09c__body { width: 576px; margin-left: auto; }
.s09c__meta { display: flex; align-items: center; height: 55.141px; margin-bottom: 6px; }
.s09c__stage { width: 90.391px; height: 35.141px; }
.s09c__time {
  margin-left: 40.594px; padding-left: 26px; font-size: 14px; line-height: 1.6;
  background: url(assets/img/framech.webp) 0 3.562px / 16px 16px no-repeat;
}
.s09c__t { padding: 5px; font-size: 30px; line-height: 1.2; }
.s09c__d { padding: 10px 5px 6px; font-size: 14px; line-height: 1.6; opacity: .66; }
.s09c__list { list-style: none; padding: 10px 5px 18px; }
.s09c__list li {
  min-height: 19px; padding-left: 28px; font-size: 12px; line-height: 1.6; color: #ababab;
  background: url(assets/img/001_tick_mark_1.webp) 0 50% / 19px 19px no-repeat;
}
.s09c__list li + li { margin-top: 15.39px; }
.s09c__list a { color: #e61919; text-decoration: underline; }
.s09c__res {
  width: 449.5px; margin: 10px 0 0 5px; padding: 20px 25px; border-radius: 5px;
  background: #cbb17d; font-size: 14px; line-height: 1.6; color: #5e4b25;
}
/* «Важно»: иконка непрозрачная, текст — 66% (в оригинале прозрачность только у текста) */
.s09c__note {
  padding: 10px 5px 10px 30px; font-size: 12px; line-height: 1.6; color: rgba(255, 255, 255, .66);
  background: url(assets/img/framef.webp) 5px 12.281px / 19px 19px no-repeat;
}

/* Различия карточек десктопа */
.s09d .s09c--1 .s09c__img { width: 475px; height: 441px; border-radius: 10px; }
.s09d .s09c--2 .s09c__img { width: 475px; height: 441px; }
.s09d .s09c--3 .s09c__img { height: 461px; }
.s09d .s09c--4 .s09c__img { height: 505px; }
.s09d .s09c--5 .s09c__img { height: 502px; }
.s09d .s09c--6 .s09c__img { height: 414px; }
.s09d .s09c--7 .s09c__img { height: 344px; }
.s09d .s09c--1 .s09c__body { width: 584px; }
.s09d .s09c--1 .s09c__time { margin-left: 42.359px; }
.s09c--1 .s09c__t { padding-bottom: 0; }
.s09c--1 .s09c__list, .s09c--4 .s09c__list { padding-bottom: 10px; }
.s09d .s09c--3 .s09c__res { width: 452.5px; }
.s09d .s09c--6 .s09c__res { width: 448.484px; }
.s09d .s09c--7 .s09c__res { width: 419.5px; }

/* --- Мобайл: фото сверху на всю ширину (не шире натуральных 560px), текст — колонкой 280px по центру --- */
.s09m .s09__title { font-size: 24px; line-height: 1.2; }
.s09m .s09__sub { font-size: 14px; line-height: 1.6; }
.s09m .s09c { display: block; padding: 10px 10px 25px; }
.s09m .s09c + .s09c { margin-top: 15px; }
/* Creatium на узком экране отдаёт файл 323×254 (на 375 — ровно 254px высоты), на широком — 560×440 */
.s09m .s09c__img { width: 560px; max-width: 100%; height: auto; aspect-ratio: 323 / 254; object-fit: cover; margin: 0 auto; }
.s09m .s09c--1 .s09c__img { width: 300px; height: 220px; aspect-ratio: auto; border-radius: 10px; }
.s09m .s09c__body { width: auto; max-width: 280px; margin: 15px auto 0; }
.s09m .s09c__meta { margin-bottom: 0; }
.s09m .s09c__time { margin-left: 28.672px; }
.s09m .s09c__t { font-size: 20px; line-height: 1.2; }
.s09m .s09c--6 .s09c__t, .s09m .s09c--7 .s09c__t { padding-bottom: 20px; }
.s09m .s09c__res { width: auto; margin: 0; padding: 12px 15px 10px; }
.s09m .s09c--7 .s09c__res { padding: 20px 15px; }
.s09m .s09c__note { padding-bottom: 0; }

/* --- Планшет 768–1279: карточки этапов горизонтально, как на ПК — фото 280×220 слева, текст справа (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s09m .s09__title { max-width: 640px; margin: 0 auto; font-size: 34px; }
  .s09m .s09__title br { display: none; }   /* мобильный перенос давал строку из одного слова */
  .s09m .s09__sub { font-size: 16px; }
  .s09m .s09c { display: flex; align-items: flex-start; gap: 24px; padding: 16px 16px 22px; }
  .s09m .s09c__img, .s09m .s09c--1 .s09c__img { flex: 0 0 280px; width: 280px; height: 220px; max-width: none; aspect-ratio: auto; object-fit: cover; margin: 0; border-radius: 8px; }
  .s09m .s09c__body { flex: 1 1 auto; max-width: none; margin: 0; }
  .s09m .s09c__t { font-size: 22px; }
}


/* ===== 10-stadii.css ===== */
/* --- Десктоп: контейнер 1170, три карточки 370 с шагом 400 --- */
.s10 { padding: 39px 0 11px; }
.s10__title { padding: 5px; font-size: 48px; line-height: 1.1; text-align: center; color: #333; }
.s10__sub { padding: 10px 5px 0; font-size: 20px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s10__sub strong { font-weight: 700; }
.s10__cards { display: flex; gap: 30px; margin: 28px 0 74px; }
.s10__card {
  flex: 0 0 370px; padding: 11px 5px 20px; background: #fff; border-radius: 5px;
  box-shadow: 0 4px 31px -4px rgba(23, 19, 9, .14);
}
.s10__pic { display: block; padding: 0 5px 10px; }
.s10__pic img { width: 320px; height: 240px; margin: 0 auto; }
.s10__h { padding: 10px 5px 0; font-size: 24px; line-height: 1.2; text-align: center; color: #000; }
.s10__t { padding: 10px 5px 0; font-size: 14px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s10__t strong { font-weight: 700; }

/* --- Мобайл: карточки столбиком на всю ширину контейнера, картинка 1.4:1 до 560px --- */
@media (max-width: 1279px) {
  .s10__title { font-size: 24px; line-height: 1.1; }
  .s10__sub { font-size: 14px; line-height: 1.6; }
  .s10__cards { flex-direction: column; }
  .s10__card { flex: none; }
  .s10__pic img { width: 100%; max-width: 560px; height: auto; aspect-ratio: 325 / 232; }
  .s10__h { font-size: 20px; line-height: 1.2; }
}

/* --- Планшет 768–1279: три карточки в ряд на 720px (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s10 { padding: 56px 0 8px; }
  .s10__title { max-width: 640px; margin: 0 auto; font-size: 34px; }
  .s10__sub { font-size: 16px; }
  .s10__cards { flex-direction: row; gap: 16px; margin: 28px 0 56px; }
  .s10__card { flex: 1 1 0; min-width: 0; padding: 10px 5px 18px; }
  .s10__pic img { width: 100%; height: auto; aspect-ratio: 325 / 232; object-fit: cover; }
  .s10__h { font-size: 20px; }
  /* переносы из оригинала рассчитаны на другие ширины — в узкой карточке дают висячие слова */
  .s10__h br, .s10__t br { display: none; }
}


/* ===== 11-otzyvy.css ===== */
/* ===== Общее: карточка видеоотзыва (постер Kinescope + плашка «Процедура завершена») ===== */
.s11-v { position: relative; padding: 10px 5px; }
.s11-v--tall { padding-bottom: 0; }
.s11-v--qh { padding: 5px 5px 18px; }
.s11-v__btn { position: relative; display: block; width: 100%; padding-top: 177.78%; border-radius: 12px; overflow: hidden; background: #e9e9ee; }
.s11-v--tall .s11-v__btn { padding-top: 182.76%; }
.s11-v__btn img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.s11-v__play {
  position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px;
  display: flex; align-items: center; justify-content: center; border-radius: 50%;
  background: rgba(97, 97, 252, .64); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); transition: background-color .2s;
}
.s11-v__play svg { width: 36px; height: 36px; fill: #fff; stroke: rgba(17, 17, 17, .16); stroke-width: 1; }
.s11-v__btn:hover .s11-v__play, .s11-v__btn:focus-visible .s11-v__play { background: #6161fc; }
/* плашка: в оригинале висит на 130px выше низа карточки */
.s11-v__plate {
  position: absolute; left: 50%; top: calc(100% - 130px); width: 260px; margin-left: -130px; padding: 12px 0;
  background: #12161d; border-radius: 5px; color: #fff; font-size: 16px; line-height: 1.5; text-align: center;
}

/* ===== Десктоп ===== */
.s11d { padding: 37px 0 73px; }
.s11d .wrap { padding: 10px 5px; }
.s11d__title { padding: 5px; font-size: 48px; line-height: 1.1; text-align: center; color: #333; }

/* слайдер со стрелками и точками (Creatium slider1) */
.s11d-sl { position: relative; padding: 10px 5px; }
.s11d-sl--video { margin-top: 30px; }
.s11d-sl--rev { margin-bottom: 10px; }
.s11d-sl__view { position: relative; margin: 0 52px; overflow: hidden; touch-action: pan-y; }
.s11d-sl--video .s11d-sl__view { height: 622.45px; }
.s11d-sl--rev .s11d-sl__view { height: 630px; }
.s11d-sl__track, .s11m-sl__track { display: flex; height: 100%; will-change: transform; }
.s11d-sl__slide, .s11m-sl__slide { flex: 0 0 100%; min-width: 0; }
.s11d-sl__arr {
  position: absolute; z-index: 2; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(51, 51, 51, .2); border-radius: 50%; color: #333; opacity: .8; transition: opacity .2s;
}
.s11d-sl__arr:hover { opacity: 1; }
.s11d-sl__arr svg { width: 8.3333px; height: 13.3333px; fill: currentColor; }
.s11d-sl__arr--prev { left: 5px; }
.s11d-sl__arr--prev svg { margin-right: 2.6667px; }
.s11d-sl__arr--next { right: 5px; }
.s11d-sl__arr--next svg { margin-left: 2.6667px; }
.s11d-sl--video .s11d-sl__arr { top: 301.225px; }
.s11d-sl--rev .s11d-sl__arr { top: 305px; }
.s11d-dots { display: flex; align-items: flex-start; justify-content: center; height: 22.84375px; margin-top: 8px; padding-top: 7.78px; }
.s11d-dots-i { width: 8px; height: 8px; border-radius: 50%; background: rgba(51, 51, 51, .2); transition: background-color .3s; }
.s11d-dots-i + .s11d-dots-i { margin-left: 5.3333px; }
.s11d-dots-i.is-active { background: #b8954e; }

/* слайд видео: сетка 3 колонки по 352 (паддинги колонок 10) */
.s11d-vs { display: flex; padding: 10px 5px; }
.s11d-vs__col { flex: none; width: 352px; padding: 0 10px; }
.s11d-vs__col:first-child { margin-left: -10px; }

/* блок текстовых отзывов */
.s11d__title2 { margin-top: 10px; padding: 5px; font-size: 48px; line-height: 1.1; text-align: center; color: #333; }
.s11d__sub { padding: 10px 5px 0; font-size: 20px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s11d__sub strong, .s11m__sub strong { font-weight: 700; }
.s11d__sub strong strong, .s11m__sub strong strong { font-weight: 900; }
.s11d__rates { position: relative; display: flex; justify-content: center; gap: 40px; margin-top: 20px; padding: 20px 0 33px; }
.s11d__rate { display: flex; justify-content: center; width: 380px; height: 146px; padding: 10px 5px; background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14); }
.s11d__rate img { width: 305px; height: 126px; }
.s11d__tap { position: absolute; left: 915px; top: 76px; width: 160px; height: 60px; }

/* слайд отзывов: 4 колонки разной ширины, как в сетке Creatium (23.61 / 24.26 / 24.72 / 27.41 % от 1056) */
.s11d-rs { display: flex; align-items: flex-start; padding: 5px; }
.s11d-rs--2 { padding-top: 10px; }
.s11d-rs__col { flex: none; padding: 0 10px; }
.s11d-rs__col:nth-child(1) { width: 249.336px; margin-left: -10px; }
.s11d-rs__col:nth-child(2) { width: 256.213px; }
.s11d-rs__col:nth-child(3) { width: 261.048px; }
.s11d-rs__col:nth-child(4) { width: 289.403px; }
.s11d-r { padding: 30px; background: #fff; border-radius: 5px; }
.s11d-rs--2 .s11d-r { padding: 30px 10px; }
.s11d-r__who { display: flex; align-items: center; padding-top: 4px; }
.s11d-r__ava { flex: none; width: 67px; height: 67px; }
.s11d-r__meta { flex: 1; min-width: 0; padding-left: 21px; }
.s11d-r__name { padding: 10px 5px 0; font-size: 12px; line-height: 1.6; color: #333; }
.s11d-r__name strong { font-weight: 700; }
.s11d-r__date { padding: 0 5px 5px; font-size: 12px; line-height: 1.6; color: #333; opacity: .66; }
.s11d-r__stars { width: 91px; max-width: calc(100% - 10px); height: auto; aspect-ratio: 91 / 15; margin: 0 5px 10px; }
.s11d-r__body { display: flex; align-items: flex-start; padding-top: 4px; }
.s11d-r__body img { flex: none; width: 20px; height: 16.5px; margin-top: 4px; }
.s11d-r__body p { flex: 1; min-width: 0; padding-left: 10px; font-size: 13px; line-height: 1.6; color: #333; opacity: .66; }
.s11d-rs--2 .s11d-r__body p { font-size: 12px; line-height: 1.6; }

/* ===== Мобайл: колонка до 300px по центру ===== */
.s11m { padding: 37px 0 73px; }
.s11m .wrap { padding: 0 20px; }
.s11m__col { max-width: 300px; margin: 0 auto; padding: 10px 0; }
.s11m__title { padding: 5px; font-size: 26px; line-height: 1.1; text-align: center; color: #333; }
.s11m-sl { padding: 10px 5px; }
.s11m-sl--video { margin-top: 16px; }
.s11m-sl--rev { padding: 5px; }
.s11m-sl__view { overflow: hidden; touch-action: pan-y; }
.s11m-sl--video .s11m-sl__view { height: 525.72px; }
.s11m-sl--rev .s11m-sl__view { height: 415px; }
.s11m .s11-v__plate { font-size: 14px; line-height: 1.5; }

/* нумерованная пагинация (Creatium slider2) */
.s11m-pg { position: relative; display: flex; justify-content: space-between; margin-bottom: 25px; }
.s11m-pg::before { content: ''; position: absolute; left: 0; top: 50%; width: 100%; height: 2px; margin-top: -1px; background: rgba(51, 51, 51, .15); }
.s11m-pg-i {
  position: relative; flex: 0 1 40px; height: 40px; min-width: 0;
  border: 2px solid rgba(51, 51, 51, .15); border-radius: 50%; background: #fff; color: #000;
  font-size: 16px; line-height: 36px; text-align: center;
}
.s11m-pg-i span { display: block; }
.s11m-pg-i.is-active { background: #cbb17d; border-color: transparent; color: #fff; }
.s11m-pg-i.is-active::after {
  content: ''; position: absolute; left: 50%; bottom: -5px; width: 10px; height: 10px; margin-left: -5px;
  background: #cbb17d; transform: rotate(45deg);
}

.s11m__title2 { padding: 5px; font-size: 24px; line-height: 1.1; text-align: center; color: #333; }
.s11m__sub { padding: 10px 5px 0; font-size: 14px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s11m__rates { display: flex; gap: 20px; padding: 10px 5px; }
.s11m__rate { flex: 1; min-width: 0; padding: 10px 5px; background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14); }
.s11m__rate img { width: 100%; height: auto; aspect-ratio: 305 / 126; }

.s11m-r { padding: 2px 10px 3px; background: #fff; border-radius: 5px; }
.s11m-r__who { display: flex; align-items: center; }
.s11m-r__ava { flex: none; width: 60px; height: 60px; }
.s11m-r__meta { flex: 1; min-width: 0; padding-left: 10px; }
.s11m-r__name { padding: 10px 5px 0; font-size: 13px; line-height: 1.6; color: #333; }
.s11m-r__name strong { font-weight: 700; }
.s11m-r__date { padding: 0 5px 5px; font-size: 11px; line-height: 1.6; color: #333; opacity: .66; }
.s11m-r__stars { width: 91px; height: 15px; margin: 0 5px 10px; }
.s11m-r__q { width: 17.5px; height: 14.5px; margin: 10px 5px 0; }
.s11m-r__text { padding-bottom: 16px; font-size: 13px; line-height: 1.6; color: #333; opacity: .66; }

/* --- Планшет 768–1279: слайдеры по две карточки (листание по одной — шаг считает 11-otzyvy.js),
       колонка 720px, плашки рейтингов не шире 480px (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s11m { padding: 56px 0 64px; }
  .s11m .wrap { padding: 0 24px; }
  .s11m__col { max-width: 720px; }
  .s11m__title { max-width: 640px; margin: 0 auto; font-size: 34px; }
  .s11m__title2 { max-width: 560px; margin: 0 auto; font-size: 30px; }
  .s11m__sub { font-size: 16px; }
  .s11m-sl__slide { flex: 0 0 50%; padding: 0 8px; }
  .s11m-sl--video { margin-bottom: 28px; }
  .s11m-sl--video .s11-v { width: 280px; margin: 0 auto; }   /* родной размер карточки ролика */
  .s11m-sl--rev .s11m-sl__view { height: auto; }
  .s11m__rates { max-width: 480px; margin: 0 auto; }
}


/* ===== 12-garantiya.css ===== */
/* Общие стили текста «двойной гарантии» */
.s12__title { padding: 5px; color: #333; }
.s12__lead { padding: 10px 5px 0; color: #000; opacity: .5; }
.s12__lead strong { font-weight: 700; }
.s12__item { display: flex; align-items: flex-start; padding: 10px 5px; }
.s12__item > img { flex: none; }
.s12__item > div { flex: 1; min-width: 0; padding-left: 14px; }
.s12__h { padding: 10px 5px 0; color: #000; }
.s12__k { padding: 10px 5px 0; color: #333; }
.s12__k strong { font-weight: 700; }
.s12__t { padding: 2px 5px 10px; font-size: 14px; line-height: 1.6; color: #333; opacity: .66; }

/* --- Десктоп: zero-секция, координаты от рамки 1200 --- */
.s12d { height: 750px; background: #fff; }
.s12d .zf > * { position: absolute; }
.s12d__dok { left: -130px; top: 60.5px; width: 629px; height: 629px; z-index: 1; }
.s12d__col { left: 486.5px; top: 50px; width: 677px; z-index: 2; }
.s12d .s12__title { font-size: 48px; line-height: 1.1; }
.s12d .s12__lead { font-size: 20px; line-height: 1.6; }
.s12d .s12__item > img { width: 50px; height: 50px; }
.s12d .s12__h { font-size: 24px; line-height: 1.2; }
.s12d .s12__k { font-size: 16px; line-height: 1.6; }

/* --- Мобайл: zero-секция, рамка 320 --- */
.s12m { height: 1360px; background: #fff; }
.s12m .zf > * { position: absolute; }
.s12m__col { left: 21px; top: 20px; width: 278.5px; z-index: 2; }
.s12m__dok { left: 5px; top: 680px; width: 310px; height: 310px; z-index: 1; }
.s12m .s12__title { font-size: 24px; line-height: 1.1; text-align: center; }
.s12m .s12__lead { font-size: 14px; line-height: 1.6; text-align: center; }
.s12m .s12__item > img { width: 44px; height: 44px; }
.s12m .s12__h { font-size: 18px; line-height: 1.2; }
.s12m .s12__k { font-size: 14px; line-height: 1.6; }

/* --- Планшет 768–1279: как на ПК — договор слева 320px, текст справа (у оригинала планшета нет).
       Сброс позиционирования — той же специфичности, что мобильный absolute; ширины заданы явно --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s12m { height: auto; }
  .s12m .zf { display: grid; grid-template-columns: 320px minmax(0, 1fr); column-gap: 32px; align-items: center; width: 720px; padding: 64px 0; }
  .s12m .zf > * { position: static; }
  .s12m__dok { grid-column: 1; grid-row: 1; width: 320px; height: 320px; }
  .s12m__col { grid-column: 2; grid-row: 1; width: auto; }
  .s12m .s12__title { font-size: 30px; text-align: left; }
  .s12m .s12__lead { font-size: 15px; text-align: left; }
  .s12m .s12__h { font-size: 20px; }
}


/* ===== 13-founders.css ===== */
/* --- 13. Основатели: десктоп (потоковая секция, внутри — блок со свободным позиционированием).
   Фон с силуэтами, как в оригинале, заходит на 57.5px вверх — на низ секции 12 --- */
.s13d { padding: 60px 0 27px; background: #161c24; color: #fff; overflow: visible; overflow-x: clip; }
.s13d .wrap { padding: 10px 0 50px; }
.s13d__zero { position: relative; height: 676px; }
.s13d__bg { position: absolute; left: -190px; top: -127.5px; width: 1490px; height: 753px; }
.s13d__frame { position: absolute; left: 20px; top: -60px; width: 1100px; }
.s13d__title { padding: 5px; font-size: 48px; line-height: 1.1; text-align: center; }
.s13d__sub { padding: 10px 5px 0; margin-bottom: 30px; font-size: 20px; line-height: 1.6; text-align: center; opacity: .66; }
.s13d__grid { display: flex; align-items: center; margin: 0 -5px; padding: 10px 0; }
.s13d__col { width: 50%; padding: 0 10px; }
.s13d__col--video { padding: 5px 15px 104px 150px; }
.s13d__ava { margin: 10px 5px 15px; width: 77px; height: 77px; border-radius: 50%; }
.s13d__quote { display: flex; padding: 8px 5px 10px 10px; }
.s13d__quote img { flex: none; width: 20px; height: 16.2264px; margin-top: 3.67px; }
.s13d__quote p { padding-left: 10px; font-size: 14px; line-height: 1.6; opacity: .66; }

.s13d__docs { display: flex; align-items: flex-end; margin: 0 -5px; padding: 10px 0; }
.s13d__doc { padding: 0 10px; }
.s13d__doc--1, .s13d__doc--4 { width: 22.913%; }
.s13d__doc--2 { width: 22.2351%; }
.s13d__doc--3 { width: 31.9388%; }
.s13d__doc button { display: block; width: 100%; padding: 10px 5px 0; cursor: zoom-in; }
.s13d__doc img { width: 100%; }
.s13d__doc--1 img { height: 326.48px; }
.s13d__doc--2 img { height: 317.48px; }
.s13d__doc--3 img { height: 264.89px; }
.s13d__doc--4 img { height: 329.48px; }
.s13d__doc p { padding: 10px 5px 0; font-size: 24px; line-height: 1.2; text-align: center; }

/* Кнопка видео (общая для десктопа и мобайла) */
.s13-play { position: relative; display: block; width: 116px; height: 116px; margin: 0 auto; border-radius: 50%; background: #fff; }
.s13-play svg { position: absolute; left: 44.71px; top: 38.67px; width: 33.83px; height: 38.67px; fill: #b8954e; }

/* --- 13. Основатели: мобайл. Карточка с фото заходит на предыдущую секцию на 379.5px, как в оригинале --- */
.s13m { padding: 60px 0 27px; background: #161c24; color: #fff; overflow: visible; overflow-x: clip; }
.s13m .wrap { padding-top: 10px; padding-bottom: 10px; }
.s13m__zero { position: relative; z-index: 5; height: 460px; }
.s13m__bg { position: absolute; left: 34px; top: -449.5px; width: 272.69px; height: 897.97px; }
.s13m__frame { position: absolute; left: 55.27px; top: -419.5px; width: 240px; display: flex; flex-direction: column; } /* flex: чтобы отступы картинок не схлопывались */
.s13m__title { padding: 5px; font-size: 24px; line-height: 1.1; }
.s13m__sub { padding: 10px 5px 0; margin-bottom: 19px; font-size: 14px; line-height: 1.6; opacity: .66; }
.s13m__ava { margin: 10px 5px 15px; width: 59px; height: 59px; border-radius: 50%; }
.s13m__q { margin: 10px 5px 0; width: 19.08px; height: 15.89px; }
.s13m__text { padding: 4px 5.5px 10px 5px; font-size: 14px; line-height: 1.6; opacity: .66; }
/* padding-right 5.5 (ширина 229.5 вместо 230): у оригинала строка «Как птица Феникс, возродившаяся» = 230.37px и переносится,
   у нашего Fira Sans она 229.95px и влезала бы — без этого перенос строк разъезжается */
.s13m__play { margin: 15px auto 10px; }

.s13m__slider { padding: 10px 5px; }
.s13m__view { overflow: hidden; touch-action: pan-y; }
.s13m__track { display: flex; transition: transform .3s ease; }
.s13m__slide { flex: 0 0 100%; min-width: 0; }
.s13m__slide button { display: block; width: 100%; padding: 10px 5px 0; cursor: zoom-in; }
.s13m__slide img { margin: 0 auto; max-width: 100%; }
.s13m__slide--1 img { width: 183px; height: 249px; }
.s13m__slide--2 img { width: 179.9px; height: 245.84px; }
.s13m__slide--3 img { width: 100%; height: auto; aspect-ratio: 325 / 248; }
.s13m__slide--4 img { width: 176.69px; height: 242.94px; }
.s13m__slide p { padding: 10px 5px 0; font-size: 18px; line-height: 1.2; text-align: center; }

.s13-dots { display: flex; justify-content: center; align-items: flex-start; height: 22.84px; margin-top: 20px; padding-top: 5.78px; }
.s13-dots button { width: 12px; height: 12px; margin: 0 6px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 50%; transition: background-color .3s; }
.s13-dots button.is-active { background: #cbb17d; }
.s13-dots button:hover { transform: scale(1.15); }

/* --- Планшет 768–1279: карточка основателей в потоке, без нахлёста на секцию 12 (на телефоне она
       заходит вверх на ~420px — в оригинале там пустой низ секции 12); две колонки на фоне с ПК.
       Документы — все четыре в ряд, как на ПК; автолистание не сдвигает ряд (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s13m { padding: 56px 0 48px; }
  .s13m__zero { height: auto; padding: 40px 32px 36px; border-radius: 13px; background: #1f2630 url(assets/img/bg_video.webp) 50% 50% / cover; }
  .s13m__bg { display: none; }
  .s13m__frame { position: static; display: grid; grid-template-columns: minmax(0, 1fr) 350px; grid-template-rows: auto auto 1fr; column-gap: 32px; width: auto; }
  .s13m__title { grid-column: 1; grid-row: 1; font-size: 30px; }
  .s13m__sub { grid-column: 1; grid-row: 2; font-size: 15px; }
  .s13m__play { grid-column: 1; grid-row: 3; align-self: center; justify-self: start; margin: 10px 5px; }
  .s13m__ava { grid-column: 2; grid-row: 1; align-self: end; }
  .s13m__q { grid-column: 2; grid-row: 2; }
  .s13m__text { grid-column: 2; grid-row: 3; }
  .s13m__slider { margin-top: 32px; }
  .s13m__track { transform: none !important; }
  .s13m__slide { flex: 0 0 25%; }
  .s13m__slide--1 img, .s13m__slide--2 img, .s13m__slide--4 img { width: auto; max-width: 100%; height: 220px; }
  .s13m__slide--3 img { margin-top: 41px; }
  .s13-dots { display: none; }
}


/* ===== 14-team.css ===== */
/* --- 14. Команда: десктоп. Декор (скрепка, молоток, визитки) выходит за верх секции на секции 13 и 12 — как в оригинале --- */
.s14d { padding: 60px 0 29px; background: #161c24; color: #fff; overflow: visible; overflow-x: clip; }
.s14d__title { padding: 5px; font-size: 48px; line-height: 1.1; text-align: center; }
.s14d__cards { display: flex; gap: 30px; }
.s14d__card { width: calc(100% / 3 - 20px); padding: 20px 5px; text-align: center; }
.s14d__card img { margin: 10px auto; width: 350px; height: 312.98px; }
.s14d__name { padding: 10px 5px 0; font-size: 30px; line-height: 1.2; color: #cbb17d; }
.s14d__role { padding: 10px 5px 0; font-size: 16px; line-height: 1.6; }
.s14d__exp { padding: 11px 5px 10px; font-size: 14px; line-height: 1.6; }
.s14d__exp span, .s14m__exp span { color: #acacac; }
.s14d__desc { padding: 0 5px 10px; font-size: 14px; line-height: 1.6; opacity: .66; }
.s14d__deco { position: relative; z-index: 5; height: 57px; }
.s14d__deco img { position: absolute; }
.s14d__clip { left: 1200px; top: -251px; width: 280px; height: 305px; }
.s14d__hammer { left: -440px; top: -1460px; width: 356.16px; height: 649.22px; }
.s14d__cards-img { left: 1100px; top: -2290px; width: 509.97px; height: 534.95px; }

/* --- 14. Команда: мобайл, слайдер (JS — в 13-founders.js) --- */
.s14m { padding: 60px 0 29px; background: #161c24; color: #fff; }
.s14m .wrap { padding-top: 10px; }
.s14m__col { max-width: 300px; margin: 0 auto; }
.s14m__title { padding: 5px; font-size: 24px; line-height: 1.1; text-align: center; }
.s14m__slider { padding: 10px 5px; }
.s14m__view { overflow: hidden; touch-action: pan-y; }
.s14m__track { display: flex; align-items: flex-start; transition: transform .3s ease; }
.s14m__slide { flex: 0 0 100%; min-width: 0; text-align: center; }
.s14m__slide img { margin: 10px auto 0; width: 280px; height: 219.78px; max-width: 100%; }
.s14m__slide .s14m__ph1 { height: 220px; }
.s14m__name { padding: 19px 5px 0; font-size: 20px; line-height: 1.2; color: #cbb17d; }
.s14m__role { padding: 10px 5px 0; font-size: 14px; line-height: 1.6; }
.s14m__exp { padding: 11px 5px 10px; font-size: 14px; line-height: 1.6; }
.s14m__desc { padding: 0 5px; font-size: 14px; line-height: 1.6; opacity: .66; }

.s14-dots { display: flex; justify-content: center; align-items: flex-start; height: 22.84px; margin-top: 20px; padding-top: 5.78px; }
.s14-dots button { width: 12px; height: 12px; margin: 0 6px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 50%; transition: background-color .3s; }
.s14-dots button.is-active { background: #cbb17d; }
.s14-dots button:hover { transform: scale(1.15); }

/* --- Планшет 768–1279: три карточки команды в ряд, как на ПК; автолистание не сдвигает ряд (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s14m { padding: 56px 0 48px; }
  .s14m__col { max-width: 720px; }
  .s14m__title { max-width: 560px; margin: 0 auto; font-size: 32px; }
  .s14m__track { transform: none !important; }
  .s14m__slide { flex: 0 0 33.333%; padding: 0 8px; }
  .s14m__slide img, .s14m__slide .s14m__ph1 { width: 100%; height: auto; aspect-ratio: 280 / 219.78; }
  .s14m .s14-dots { display: none; }
}


/* ===== 15-faq.css ===== */
/* --- 15. FAQ: аккордеон (раскрытие — 15-faq.js) --- */
.s15 { padding: 21px 0 12px; background: #fff; color: #333; }
.s15__in { padding: 20px 0 10px; }
.s15__title { padding: 5px; font-size: 48px; line-height: 1.1; text-align: center; color: #333; }
.s15__sub { padding: 10px 5px 0; margin-bottom: 32px; font-size: 20px; line-height: 1.6; text-align: center; color: #000; opacity: .5; }
.s15__list { padding: 10px 5px; }
.s15__item { padding: 5px 5px 19px; }
.s15__box { padding: 0 25px; background: #fff; border-radius: 5px; box-shadow: 0 6.6667px 20px 0 rgba(52, 60, 68, .1); color: #191919; }
.s15__h { margin: 0; font-size: 14px; font-weight: 400; line-height: 1.6; }
.s15__q {
  position: relative; display: block; width: 100%; padding: 15px 20px 15px 5px;
  font-size: 14px; line-height: 1.6; letter-spacing: 1.6px; text-transform: uppercase; text-align: left;
  color: rgba(25, 25, 25, .66);
}
.s15__ic { position: absolute; right: 0; top: 50%; width: 12.25px; height: 14px; margin-top: -8px; transition: all .2s ease-in-out; }
.s15__ic svg { display: block; width: 100%; height: 100%; fill: #191919; }
.s15__q[aria-expanded="true"] .s15__ic { margin-top: -6px; transform: rotate(180deg); }
.s15__a { border-top: 1px solid rgba(0, 0, 0, .1); padding: 15px 0; overflow: hidden; }
.s15__a.is-anim { transition: height .4s cubic-bezier(.37, 0, .63, 1), padding .4s cubic-bezier(.37, 0, .63, 1); }
.s15__p { padding: 5px; font-size: 14px; line-height: 1.5; color: rgba(51, 51, 51, .66); }
.s15__p--np { padding-bottom: 0; }
.s15__ul { padding: 10px 5px 10px 26px; list-style: disc; font-size: 14px; line-height: 1.6; color: rgba(51, 51, 51, .66); }
.s15__ul--2 { padding-top: 8px; }
.s15__ul li { padding-left: 5px; }
.s15__ul li + li { margin-top: 3.5px; }
.s15__ul--2 li + li { margin-top: 0; }

@media (max-width: 1279px) {
  .s15__in { max-width: 300px; margin: 0 auto; }
  .s15__title { font-size: 24px; line-height: 1.1; }
  .s15__sub { margin-bottom: 24px; font-size: 14px; line-height: 1.6; }
}

/* --- Планшет 768–1279: аккордеон 640px по центру (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s15 { padding: 40px 0 32px; }
  .s15__in { max-width: 640px; }
  .s15__title { font-size: 34px; }
  .s15__sub { margin-bottom: 28px; font-size: 16px; }
}


/* ===== 16-konsultaciya.css ===== */
/* --- Десктоп: zero-секция 690px, рамка 1200 --- */
/* Фон-статуя в оригинале — слой 1580 шириной, высотой по пропорции (725.86px) от y=50,
   поэтому нижние ~86px заходят на верхний отступ следующей секции (там прозрачно).
   Обрезаем по горизонтали отдельной обёрткой, по вертикали выпускаем. */
.s16d { height: 690px; overflow: visible; }
.s16d__bgclip { position: absolute; left: 0; right: 0; top: 50px; height: 725.859px; overflow: hidden; pointer-events: none; }
.s16d__bg { position: absolute; left: calc(50% - 770px); top: 0; width: 1580px; height: 725.859px; }
.s16d .zf { z-index: 1; }
.s16d__frame { position: absolute; left: 28.5px; top: 118.5px; width: 1140px; }
.s16d__title { padding: 5px; font-size: 48px; line-height: 1.1; color: #333; text-align: center; }
.s16d__card {
  margin-top: 37px; padding: 32px 50px 10px 49px;
  background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14);
}
.s16d__h { padding: 10px 5px; font-size: 30px; line-height: 1.2; color: #000; text-align: center; }
.s16d__lead { padding: 2px 5px 0; font-size: 16px; line-height: 1.6; color: #000; opacity: .5; text-align: center; }
.s16d__lead strong { font-weight: 700; }
.s16d__form { margin-right: 5px; padding: 20px 0; }
.s16d__btnwrap { display: flex; justify-content: center; padding: 0 5px 10px; }
.s16d__btn { padding: 17px 34px; line-height: 1.428571; white-space: nowrap; }
.s16d__cb {
  display: flex; align-items: center; width: 345px; margin: 16px auto 0;
  padding: 6px 5px 0 0; border: 2px dotted #8fa1ba; border-radius: 11px;
}
.s16d__cbimg { width: 36.158%; padding: 0 5px; flex: none; }
.s16d__cbimg img { width: 111.484px; height: 54.234px; }
.s16d__cbtxt { flex: 1; padding: 0 5px 2px; }
.s16d__cbtxt p { font-size: 16px; line-height: 1.6; color: #333; }

/* --- Мобайл: zero-секция 650px, рамка 320 --- */
.s16m { height: 650px; }
.s16m__card {
  position: absolute; left: 21.5px; top: 20px; width: 280px; padding: 32px 10px 10px;
  background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14);
}
.s16m__title { padding: 5px; font-size: 24px; line-height: 1.1; color: #333; text-align: center; }
.s16m__h { margin-top: 20px; padding: 10px 5px; font-size: 20px; line-height: 1.2; color: #000; text-align: center; }
.s16m__lead { padding: 2px 5px 0; font-size: 14px; line-height: 1.6; color: #000; opacity: .5; text-align: center; }
.s16m__lead strong { font-weight: 700; }
.s16m__form { margin-right: 5px; padding: 20px 5px 30px; }
.s16m__btn { width: 100%; padding: 17px 30px; line-height: 1.428571; white-space: nowrap; }
.s16m__cb {
  display: flex; align-items: center;
  padding: 6px 5px 0 0; border: 2px dotted #8fa1ba; border-radius: 11px;
}
.s16m__cbimg { width: 36.158%; padding: 0 5px; flex: none; }
.s16m__cbimg img { width: 80.75px; height: 39.359px; }
.s16m__cbtxt { flex: 1; padding: 0 5px 2px; }
.s16m__cbtxt p { font-size: 14px; line-height: 1.6; color: #333; }

/* --- Планшет 768–1279: карточка 600px по центру, справа Фемида с фона ПК (у оригинала планшета нет).
       Фон 1100×505 лежит на рамке композиции 720px и прижат к её правому краю — край светлой подложки
       совпадает с краем композиции и на 1024 не торчит посреди экрана --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s16m { height: auto; padding: 32px 0 40px; background: #fff; }
  .s16m .zf { width: 720px; padding: 24px 0; background: url(assets/img/mask_groupg.webp) right 0 / 1100px 505px no-repeat; }
  .s16m__card { position: relative; left: auto; top: auto; width: 600px; margin: 0 auto; padding: 36px 40px 30px; }
  .s16m__title { font-size: 34px; }
  .s16m__h { margin-top: 12px; font-size: 24px; }
  .s16m__lead { font-size: 15px; }
  .s16m__form { margin: 0 auto; width: 320px; padding: 22px 0 22px; }
  .s16m__cb { width: 260px; margin: 0 auto; }
}


/* ===== 17-ofisy.css ===== */
/* --- Офисы: десктоп --- */
.s17 { padding: 121px 0 40px; }
.s17__wrap { padding-top: 10px; }
.s17__title { padding: 10px 5px 11px; font-size: 48px; line-height: 1.2; color: #000; text-align: center; }
.s17__grid { margin-top: 40px; padding: 0 5px 10px; background: #fff; }
.s17__row { display: flex; align-items: flex-start; margin: 0 -10px; }
.s17__col { padding: 0 10px; }
.s17__col--spb { width: 29.9145%; }
.s17__col--msk { width: 32.8205%; }
.s17__col--vrn { width: 37.265%; }
.s17__card { padding: 10px 5px; background: #fff; border-radius: 5px; box-shadow: 0 4px 31px -4px rgba(0, 0, 0, .14); }
.s17__name { padding: 10px 5px; font-size: 16px; line-height: 1.6; color: #333; }
.s17__name strong { font-weight: 700; }
.s17__call { padding: 10px 5px; }
.s17__callrow { display: flex; align-items: center; margin: 0 -10px; }
.s17__ask { flex: none; width: 46.8614%; padding: 0 10px; }
.s17__col--msk .s17__ask { width: 47.0648%; }
.s17__ask p { padding: 2px 5px 0; font-size: 16px; line-height: 1.6; color: #000; opacity: .5; }
.s17__phones { flex: 1; min-width: 0; padding: 0 10px; }
.s17__phones p { padding: 0 5px; font-size: 18px; line-height: 1.6; }
.s17__phones a { color: #e6a219; text-decoration: underline; }
.s17__addr { display: flex; align-items: center; padding: 10px 0 10px 5px; }
.s17__col--msk .s17__addr { padding-right: 5px; }
.s17__mail { display: flex; align-items: flex-start; padding: 10px 5px; }
.s17__addr img, .s17__mail img { flex: none; width: 27px; height: 27px; }
.s17__addr p, .s17__mail p { flex: 1; min-width: 0; padding-left: 10px; font-size: 16px; line-height: 1.6; color: #333; }
.s17__mail a { color: inherit; text-decoration: none; }
.s17__map { padding: 5px; }
.s17__map--gap { margin-top: 6px; }
/* Яндекс.Карта (виджет-iframe). Точка и масштаб — как в оригинале (data-params карт Creatium) */
.s17__map iframe { display: block; width: 100%; height: 150px; border: 0; }

/* --- Офисы: мобайл (карточки столбиком) --- */
@media (max-width: 1279px) {
  .s17 { padding: 16px 0 40px; }
  .s17__title { font-size: 24px; line-height: 1.2; }
  .s17__grid { margin-top: 24px; }
  .s17__row { display: block; margin: 0; }
  .s17__col { width: auto !important; padding: 0; }
  .s17__col--spb, .s17__col--msk { padding-bottom: 12px; }
  .s17__callrow { display: block; margin: 0; }
  .s17__ask, .s17__col--msk .s17__ask { width: auto; padding: 0; }
  .s17__ask p { font-size: 14px; line-height: 1.6; }
  .s17__phones { padding: 0; }
}

/* --- Планшет 768–1279: три офиса в ряд, внутри карточки — как на телефоне (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s17 { padding: 48px 0 40px; }
  .s17__title { max-width: 560px; margin: 0 auto; font-size: 34px; }
  .s17__row { display: flex; align-items: stretch; margin: 0 -8px; }
  .s17__col { width: 33.333% !important; padding: 0 8px; }
  .s17__col--spb, .s17__col--msk { padding-bottom: 0; }
  .s17__card { height: 100%; }
  .s17__name { font-size: 14px; }
  .s17__phones p { font-size: 16px; }
  .s17__addr p, .s17__mail p { font-size: 14px; }
}


/* ===== 18-podval.css ===== */
/* --- Подвал: десктоп --- */
.s18 { position: relative; display: block; padding: 25px 0; background: #202020; color: #fff; }
.s18__warn { padding: 10px 5px; font-size: 20px; line-height: 1.6; color: #fff; text-align: center; }
.s18__grid { padding: 5px 5px 10px; }
.s18__row { display: flex; align-items: center; }
.s18__c1 { width: 28.4971%; }
.s18__c1 p { padding: 2px 5px 0; font-size: 14px; line-height: 1.6; color: #fff; opacity: .5; }
.s18__c2 { width: 24.1404%; }
/* Как у Creatium (обе раскладки): кнопка-ссылка 35px (5 + 25 + 5), текст на 9px от верха.
   На десктопе две ссылки задают высоту ряда — 70px */
.s18__lnk { display: flex; justify-content: center; align-items: flex-start; height: 35px; padding: 9px 5px 0; }
.s18__lnk a { display: block; font-size: 12px; line-height: 1.428571; color: #8fa1ba; text-decoration: underline; }
.s18__c3 { display: flex; align-items: center; width: 22.3624%; padding: 0 5px 10px; }
.s18__join { width: 57.2048%; padding: 10px 5px 0; }
.s18__join p { font-size: 14px; line-height: 1.6; color: #fff; opacity: .66; }
.s18__soc { width: 42.7952%; padding: 5px; }
/* Кружок VK как у Creatium: 28×28, золотой; глиф FA5 «vk» 17.6px, белый */
.s18__vk { position: relative; display: block; width: 28px; height: 28px; margin: 0 5px; border-radius: 25px; background: #cbb17d; }
.s18__vk svg { position: absolute; left: 4.1px; top: 5.288px; width: 19.8px; height: 17.6px; fill: #fff; }
.s18__c4 { width: 25%; }
.s18__phone { padding: 0 5px; font-size: 20px; line-height: 1.6; text-align: right; }
.s18__phone a { color: #e61919; text-decoration: underline; }
.s18__hours { padding: 0 5px 10px; font-size: 12px; line-height: 1.6; color: #fff; opacity: .66; text-align: right; }
.s18__note { padding: 10px 5px; font-size: 14px; line-height: 1.6; color: #fff; opacity: .49; text-align: center; }
.s18__req { padding: 0 5px; font-size: 14px; line-height: 1.6; color: #fff; opacity: .5; text-align: center; }
.s18__req strong { font-weight: 700; }
.s18__seo { padding: 10px 5px 0; }
.s18__seo h1 { font-size: 12px; line-height: 1.6; font-weight: 400; color: #fff; opacity: .3; text-align: center; }

/* --- Подвал: телефон (всё столбиком, по центру; иконка VK — слева, как в оригинале).
   На планшете — ряд как на ПК в 720px, см. блок ниже --- */
@media (max-width: 767px) {
  .s18__row, .s18__c3 { display: block; }
  .s18__c1, .s18__c2, .s18__c3, .s18__c4, .s18__join, .s18__soc { width: auto; }
  .s18__c1 p, .s18__join p, .s18__phone, .s18__hours { text-align: center; }
}

/* --- Планшет 768–1279: сетка 2×2 вместо ряда из четырёх колонок (в 720px он тесный):
       сверху копирайт | телефон, снизу ссылки в строку | соцсети (у оригинала планшета нет) --- */
@media (min-width: 768px) and (max-width: 1279px) {
  .s18__warn { font-size: 17px; }
  .s18__row { display: grid; grid-template-columns: 1fr 1fr; row-gap: 10px; align-items: center; }
  .s18__c1, .s18__c2, .s18__c3, .s18__c4 { width: auto; }
  .s18__c1 { grid-column: 1; grid-row: 1; }
  .s18__c4 { grid-column: 2; grid-row: 1; }
  .s18__c2 { grid-column: 1; grid-row: 2; display: flex; gap: 22px; }
  .s18__c2 .s18__lnk { justify-content: flex-start; }
  .s18__c3 { grid-column: 2; grid-row: 2; justify-content: flex-end; padding-bottom: 0; }
  .s18__join, .s18__soc { width: auto; }
  .s18__join p { text-align: right; }
}


/* ===== 90-common.css ===== */
/* Подложки как у Creatium: у попапа квиза — чёрная 50%, у бокового меню — тёплая */
.modal { background: rgba(0, 0, 0, .5); }
.modal--side { background: rgba(51, 50, 47, .5); }

/* Боковое меню: панель 200px справа */
.modal--side { padding: 0; justify-content: flex-end; align-items: stretch; }
.side {
  width: 200px; height: 100%; background: #f4f4f4; box-shadow: 4px 0 24px 0 rgba(0, 0, 0, .1);
  overflow-y: auto; animation: side-in .25s ease-out;
}
@keyframes side-in { from { transform: translateX(100%); } }
.side__head { position: relative; height: 43.4px; border-bottom: 1px solid #dcdcdc; margin-bottom: 15px; }
.side__x {
  position: absolute; top: 6px; right: 10px; width: 14.4px; height: 24px;
  font: 24px/24px 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #000;
}
.side__a {
  display: flex; align-items: center; justify-content: center; width: 170px; min-height: 34px; margin: 0 15px 10px;
  padding: 6px 0; border: 1px solid #f4f4f4; font-size: 14px; line-height: 20px; color: #000; text-align: center; text-decoration: none;
}
.side__a:hover { border-color: #dcdcdc; }

/* Cookie-плашка */
.cookie {
  position: fixed; z-index: 900; left: 15px; bottom: 10px; width: 40%;
  padding: 10px 20px; border-radius: 5px; background: rgba(255, 255, 255, .75);
  font-size: 11px; line-height: 15.7143px; color: #333;
}
.cookie[hidden] { display: none; }
.cookie__x { position: absolute; top: 4px; right: 7px; width: 9.6px; height: 14px; }
.cookie__x svg { display: block; fill: #333; }
@media (max-width: 1279px) { .cookie { left: 5%; width: 90%; } }

/* Якоря меню: плавная прокрутка, на мобайле — с учётом закреплённой шапки */
html { scroll-behavior: smooth; }
@media (max-width: 1279px) { [id] { scroll-margin-top: 51px; } }

/* Якоря меню — пустые блоки перед секциями (у zero-секций десктоп и мобайл — разные блоки) */
.anchor { display: block; height: 0; }

/* Нижняя плашка (Creatium: fixed bottom, z 800, появление после 800px прокрутки, slideDown 500мс).
   Фон прозрачный — видна только кнопка 290×80; высота плашки 120px, как в оригинале */
.stick { position: fixed; z-index: 800; left: 0; right: 0; bottom: 0; padding: 20px 0; pointer-events: none;
  transform: translateY(100%); visibility: hidden; transition: transform .5s ease, visibility 0s linear .5s; }
.stick.is-on { transform: none; visibility: visible; pointer-events: auto; transition: transform .5s ease; }
.stick__btn { width: 290px; height: 80px; margin: 0 auto; padding: 17px 0; }
/* Отличие от оригинала (осознанное): там cookie-плашка (z 900) закрывает кнопку нижней плашки до закрытия cookie.
   Здесь, пока видна нижняя плашка, cookie поднимается над ней — обе кнопки нажимаются */
.cookie { transition: bottom .5s ease; }
.stick.is-on ~ .cookie { bottom: 130px; }

/* Поповер «i» (Creatium popover1): белая карточка 154×60, радиус 4, стрелка вверх к кнопке */
.pop { position: absolute; z-index: 60; width: 154px; padding: 1px 1px 1px; background: #fff; border-radius: 4px; box-shadow: 0 4px 16px rgba(0, 0, 0, .12); }
.pop[hidden] { display: none; }
.pop::before { content: ''; position: absolute; left: 50%; top: -6px; margin-left: -6px; border: 6px solid transparent; border-top: 0; border-bottom-color: #fff; }
.pop img { width: 146.9px; height: 57.6px; }