/* ============================================================
   Аделина · Маленький рай — дизайн-система сайта
   Палитра, типографика и компоненты. Тёплое дерево + глубокий клэй.
   Меняете палитру здесь (--переменные) — меняется весь сайт.
   ============================================================ */

:root {
  /* Фоны / поверхности — тёплые, но ДЕСАТУРИРОВАННЫЕ (не жёлто-бежевые) */
  --cream:   #F8F5EF;   /* фон страницы — тёплый бумажный, почти белый */
  --sand:    #ECE6DA;   /* секции-полосы — тёплый камень/грейж, без желтизны */
  --card:    #FFFFFF;   /* карточки — чистый белый */
  --line:    #E4DCCC;   /* границы */

  /* Дерево / тёмные секции */
  --wood:    #5C3A22;   /* тёплый орех (бордюры/ghost-кнопка) */
  --wood-900:#241A12;   /* тёмные секции, логотип */
  --gold:    #C99B6B;   /* медовый акцент на тёмном */

  /* Текст */
  --ink:     #2E2820;   /* основной текст */
  --head:    #34271B;   /* заголовки */
  --muted:   #6E6757;   /* подписи */

  /* Акцент — глубокий клэй/терракота (сильный, не робкий) */
  --clay:    #A8431F;
  --clay-700:#8A3417;   /* hover */
  --clay-soft: rgba(168,67,31,.10);

  --blue:    #2F6088;   /* только бассейн, дозированно */

  /* Типографика */
  --serif:  'Spectral', Georgia, serif;
  --sans:   'Onest', system-ui, sans-serif;
  --script: 'Caveat', cursive;

  --maxw: 1320px;
}

/* ---------- Кнопки ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--sans); font-weight: 600; font-size: 16px; line-height: 1;
  color: #fff; background: var(--clay); border: none;
  padding: 16px 26px; border-radius: 12px; text-decoration: none; cursor: pointer;
  transition: background .16s ease, transform .16s ease;
}
.btn:hover { background: var(--clay-700); }
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 3px solid var(--clay-soft); outline-offset: 2px; }
.btn--lg { font-size: clamp(15px, 2vw, 17px); padding: 17px 28px; border-radius: 13px;
  box-shadow: 0 14px 30px -12px rgba(168,67,31,.6); }
.btn--sm { font-size: 14px; padding: 12px 18px; border-radius: 10px; white-space: nowrap; }
.btn--block { width: 100%; }
.btn--ghost { background: transparent; color: var(--head); border: 1.5px solid var(--wood); box-shadow: none; }
.btn--ghost:hover { background: rgba(92,58,34,.08); }
.btn--on-dark { color: #F8F3E8; background: rgba(255,255,255,.10); border: 1.5px solid rgba(255,255,255,.55); }
.btn--on-dark:hover { background: rgba(255,255,255,.2); }

/* ---------- Надзаголовок (eyebrow) ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: 11px;
  font-family: var(--sans); font-weight: 600; font-size: 13px; line-height: 1;
  letter-spacing: .16em; text-transform: uppercase; color: var(--clay);
}
.eyebrow--gold { color: var(--gold); }
.eyebrow--blue { color: var(--blue); }
.eyebrow-bar { width: 28px; height: 2px; background: currentColor; border-radius: 2px; flex: 0 0 auto; }

/* ---------- Заголовки / лид ---------- */
.h2 { font-family: var(--serif); font-weight: 600; font-size: clamp(28px, 4vw, 42px);
  line-height: 1.12; letter-spacing: -.01em; color: var(--head); margin: 14px 0 12px; }
.h2--mt0 { margin-top: 0; }
.h2--mb0 { margin-bottom: 0; }
.h2--xl { font-size: clamp(30px, 5vw, 52px); line-height: 1.08; color: inherit; margin: 0 auto; max-width: 760px; }
.lead { font-family: var(--sans); font-weight: 400; font-size: 17px; line-height: 1.6;
  color: var(--muted); margin: 0; }
.lead--mb { margin-bottom: 24px; }
.lead--mb-xl { margin-bottom: 40px; max-width: 560px; }

/* ---------- Интро секции ---------- */
.sec-intro { max-width: 640px; margin-bottom: clamp(24px, 3vw, 34px); }

/* ---------- Строка-факт (иконка + текст) ---------- */
.info-row { display: flex; align-items: center; gap: 12px; }
.card-ico { width: 44px; height: 44px; border-radius: 11px; background: #EBE7D2; color: var(--wood);
  display: flex; align-items: center; justify-content: center; margin-bottom: 14px; flex: 0 0 auto; }

/* ---------- Поля формы ---------- */
.field { font: 400 15px/1.2 var(--sans); color: var(--head); background: #fff;
  border: 1.5px solid #E0D4BC; border-radius: 12px; padding: 15px 16px; width: 100%; box-sizing: border-box; }
.field:focus { outline: none; border-color: var(--wood); box-shadow: 0 0 0 3px rgba(92,58,34,.14); }

/* ---------- Карточки ---------- */
.card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 24px; }
.card--sm { border-radius: 14px; padding: 20px; }

/* ---------- Чип/бейдж ---------- */
.chip { display: inline-flex; align-items: center; font: 500 13px/1 var(--sans); color: #fff;
  background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.26);
  padding: 10px 14px; border-radius: 999px; backdrop-filter: blur(4px); }

/* ---------- Утилиты ---------- */
.section { padding: clamp(56px, 8vw, 100px) 0; }
/* Большинство секций живут на одном тёплом холсте — но ритм держат «главы» из
   глубокого ореха (цвет стола и балок дома): тёплый крем ↔ насыщенное дерево. */
.section--band { position: relative; background: linear-gradient(rgba(36,23,12,.18), rgba(30,19,10,.32)), url('../web/wood-bg.jpg') center/cover, #4C2F18; color: #FBF5EA; border: none; overflow: hidden; }
.section--band > .wrap { position: relative; z-index: 2; }
.section--dark { background: var(--wood-900); color: #F3EDDF; }

/* Аудитории «Кому подходит» — иконные карточки на дереве (без фото-заглушек) */
.aud-card { background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.12); border-radius: 16px; padding: clamp(20px,2.4vw,28px); }
.aud-card__ico { width: 52px; height: 52px; border-radius: 14px; background: rgba(201,155,107,.16); color: var(--gold); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
.aud-card__t { font-family: var(--serif); font-weight: 600; font-size: 19px; color: #F8F3E8; margin-bottom: 7px; }
.aud-card__d { font: 400 14px/1.55 var(--sans); color: rgba(243,237,223,.72); }

/* Booking — тёплая панель-«стойка»: сплошной тон, приподнятый инсет. */
.booking-panel { background: #FFFFFF; border: 1px solid #E8E0D0;
  border-radius: 26px; padding: clamp(18px,2.6vw,32px); box-shadow: 0 40px 80px -54px rgba(60,40,20,.5); }

/* Режим booking_mode=off: вместо формы/виджета — нейтральная строка (секция и якорь #booking остаются). */
.booking-off-note { font: 400 15px/1.55 var(--sans); color: var(--muted); margin: 0; }

/* Facts — редакторский сплит: реальное фото + факты, вместо плоской сетки карточек */
.facts-split { display: grid; grid-template-columns: 0.82fr 1.18fr; gap: clamp(18px,2.6vw,36px); align-items: stretch; }
.facts-photo { position: relative; border-radius: 22px; overflow: hidden; min-height: 360px; box-shadow: 0 30px 60px -44px rgba(60,40,20,.6); }
.facts-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.facts-photo figcaption { position: absolute; left: 18px; bottom: 16px; z-index: 2;
  font: 600 12px/1.3 var(--sans); letter-spacing: .04em; color: #fff;
  background: rgba(35,21,11,.55); padding: 8px 13px; border-radius: 9px; backdrop-filter: blur(4px); }
.facts-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 55%,rgba(35,21,11,.4) 100%); }
.facts-list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 820px) { .facts-split { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .facts-list { grid-template-columns: 1fr; } }

/* Окружение (вариант C): термы — светлый герой + 4 фото-карточки мест */
.surround-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: stretch; background: #fff; border: 1px solid #E4DCCC; border-radius: 22px; overflow: hidden; margin-bottom: 22px; }
.surround-hero__media { position: relative; min-height: 100%; background: #5E97C4; overflow: hidden; }
.surround-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.surround-hero__media::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg,rgba(20,40,60,.18),transparent 42%,rgba(20,30,38,.22)); pointer-events: none; }
.region-photo-label { position: absolute; top: 12px; left: 12px; z-index: 2; font: 600 9px/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: #fff; background: rgba(20,40,60,.58); border: 1px solid rgba(255,255,255,.32); padding: 5px 8px; border-radius: 999px; backdrop-filter: blur(4px); }
.surround-hero__body { padding: clamp(24px,3vw,44px); }
.surround-stats { display: flex; gap: 24px; flex-wrap: wrap; margin-top: 18px; }
.surround-stat b { display: block; font-family: var(--serif); font-weight: 600; font-size: 22px; color: var(--blue); }
.surround-stat span { font: 500 12px/1.3 var(--sans); color: var(--muted); }
.place-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.place-card { border-radius: 16px; overflow: hidden; border: 1px solid #E4DCCC; background: #fff; }
.place-card__media { position: relative; height: 150px; background: #6F7D59; display: flex; align-items: flex-end; padding: 12px; overflow: hidden; }
.place-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.place-card__media::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg,rgba(18,22,15,.08) 25%,rgba(18,22,15,.68) 100%); pointer-events: none; }
.place-card:hover .place-card__media img { transform: scale(1.025); }
.place-card__cap { display:none; }
.place-card__title { position: relative; z-index: 2; font: 600 13px/1.2 var(--sans); color: #fff; text-shadow: 0 1px 4px rgba(0,0,0,.4); }
.place-card__foot { padding: 13px 15px; font: 600 13px/1 var(--sans); color: var(--clay); display: flex; align-items: center; gap: 6px; }
.surround-note { font: 400 13px/1.5 var(--sans); color: #8A8373; margin: 20px 0 0; }
@media (max-width: 900px) { .surround-hero { grid-template-columns: 1fr; } .surround-hero__media { min-height: 260px; } .place-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .place-grid { grid-template-columns: 1fr; } .surround-hero__media { min-height: 220px; } }

/* Чередующиеся светлые секции — сплошной тёплый песочный тон (без градиентов). */
.section--tint { background: #ECE6DA; }

/* Плёночное зерно по всему сайту — единая «материя», а не плоские заливки.
   Лёгкий фиксированный слой над фоном и контентом (под закреплённой навигацией). */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 39; pointer-events: none;
  opacity: .05; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 140px 140px;
}

/* ---------- Сетки ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 56px); align-items: center; }
.split--300 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 52px); align-items: center; }
@media (max-width: 760px) { .split, .split--300 { grid-template-columns: 1fr; } }
.grid-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)); gap: 16px; }
.grid-photos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)); gap: 18px; }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media (max-width: 1000px) { .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .grid-4 { grid-template-columns: 1fr; } }
.grid-250 { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; }
.grid-300 { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }

/* ---------- Фото-карточка ---------- */
.pcard { border-radius: 18px; overflow: hidden; border: 1px solid var(--line); background: var(--card); }
.pcard__media { overflow: hidden; }
.pcard__media img { width: 100%; height: 100%; object-fit: cover; }
.pcard--43 .pcard__media { aspect-ratio: 4/3; }
.pcard--32 .pcard__media { aspect-ratio: 3/2; }
.pcard--11 .pcard__media { aspect-ratio: 1/1; }
.pcard__body { padding: 20px; }
.pcard__cap { font: 600 12px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--clay); }
.pcard__title { font-family: var(--serif); font-weight: 600; font-size: 20px; color: var(--head); margin: 8px 0 6px; }
.pcard__title--sm { font-size: 19px; margin: 0; }
.pcard__text { font: 400 14px/1.55 var(--sans); color: var(--muted); margin-top: 6px; }

/* ---------- Карточка-факт ---------- */
.fact__title { font-family: var(--serif); font-weight: 600; font-size: 18px; color: var(--head); margin-bottom: 4px; }
.fact__text { font: 400 14px/1.5 var(--sans); color: var(--muted); }

/* ---------- Заголовки/лиды — модификаторы ---------- */
.h2--md { font-size: clamp(28px, 4vw, 40px); }
.h2--light { color: #F8F3E8; }
.lead--wood { font-size: 17px; color: #4A4238; }
.lead--on-dark { font-size: 17px; color: rgba(243,237,223,.82); }

/* ---------- Кнопки-обводки ---------- */
.btn--wood { background: transparent; color: var(--head); border: 1.5px solid var(--wood); box-shadow: none; }
.btn--wood:hover { background: var(--sand); }
.btn--ghost-dark { background: transparent; color: #F3EDDF; border: 1.5px solid rgba(243,237,223,.5); box-shadow: none; }
.btn--ghost-dark:hover { background: rgba(243,237,223,.12); }

/* ---------- Чек-кружок (строка-факт) ---------- */
.tick { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.tick--blue { background: #DCE7EE; color: var(--blue); }
.tick--gold { background: rgba(201,155,107,.22); color: var(--gold); }
.tick-txt { font: 500 16px/1.4 var(--sans); color: var(--head); }
.tick-txt--light { color: #F3EDDF; }

/* ---------- Медиа-обёртки и картинки ---------- */
.media { overflow: hidden; }
.media--43 { aspect-ratio: 4/3; }
.media--32 { aspect-ratio: 3/2; }
.media--11 { aspect-ratio: 1/1; }
.cover { width: 100%; height: 100%; object-fit: cover; }
.fill { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pcard__title-sm { font-family: var(--serif); font-weight: 600; font-size: 19px; color: var(--head); }

/* ---------- Списки-перечни ---------- */
.checklist { display: flex; flex-direction: column; gap: 11px; font: 400 15px/1.45 var(--sans); color: #3A342A; }
.checklist--15 { font-size: 15px; line-height: 1.5; }
.li { display: flex; gap: 10px; }
.li > .m { flex: 0 0 auto; }
.m--ok { color: #8A9A6E; }
.m--sand { color: #B9885B; }
.m--blue { color: var(--blue); }
.m--wood { color: var(--wood); }

/* ---------- Ссылки в подвале ---------- */
.flink { text-decoration: none; color: inherit; transition: color .15s; }
.flink:hover { color: #fff; }
.flink--bright { color: #F3EDDF; }
.flink--bright:hover { color: #fff; }
.foot-head { font: 600 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin-bottom: 16px; }

/* ============================================================
   Уникальные секции (шапка, первый экран, меню, подвал)
   ============================================================ */

/* ---------- Шапка ---------- */
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(243,237,223,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.site-header__bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 72px; }
.header-actions { display: flex; align-items: center; gap: 14px; }
.header-phone { font: 700 15px/1 var(--sans); color: var(--head); text-decoration: none; white-space: nowrap; transition: color .15s; }
.header-phone:hover { color: var(--clay); }
.header-msgrs { display: inline-flex; align-items: center; gap: 9px; padding-left: 14px; border-left: 1px solid var(--line); }
.header-msgrs a { width: 26px; height: 26px; border-radius: 50%; overflow: hidden; display: block; transition: transform .15s; }
.header-msgrs a:hover { transform: translateY(-2px); }
.header-msgrs img { width: 100%; height: 100%; display: block; }
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.logo__badge { width: 40px; height: 40px; border-radius: 10px; background: var(--head); color: #EFE9DC; display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-weight: 600; font-size: 20px; }
.logo__lines { line-height: 1.05; }
.logo__name { display: block; font-family: var(--serif); font-weight: 600; font-size: 16px; color: var(--head); }
.logo__tag { display: block; font-family: var(--sans); font-weight: 600; font-size: 12px; letter-spacing: .02em; line-height: 1.2; color: #B05A33; margin-top: 1px; }
.nav-links { display: flex; gap: 26px; font: 500 14px/1 var(--sans); color: #3A342A; }
.nav-links a { text-decoration: none; transition: color .15s; }
.nav-links a:hover { color: var(--clay); }
.header-actions { display: flex; align-items: center; gap: 16px; }
.phone-link { font: 600 15px/1 var(--sans); color: var(--head); text-decoration: none; white-space: nowrap; }
.hmsgr { width: 32px; height: 32px; border-radius: 50%; overflow: hidden; display: block; transition: transform .15s; }
.hmsgr:hover { transform: translateY(-2px); }
.hmsgr img { width: 100%; height: 100%; display: block; }
.menu__msgrs { display: flex; gap: 12px; margin-top: 18px; }
.menu__msgrs a { width: 48px; height: 48px; border-radius: 50%; overflow: hidden; display: block; }
.menu__msgrs img { width: 100%; height: 100%; display: block; }
.burger { width: 44px; height: 44px; border-radius: 10px; border: 1px solid #E0D4BC; background: var(--card); display: none; flex-direction: column; gap: 4px; align-items: center; justify-content: center; cursor: pointer; }
.burger span { width: 18px; height: 2px; background: var(--head); border-radius: 2px; }

/* ---------- Мобильное меню ---------- */
.menu { position: fixed; inset: 0; z-index: 60; background: var(--wood-900); color: #F3EDDF; display: flex; flex-direction: column; padding: 20px clamp(20px,6vw,32px) 32px; }
.menu__head { display: flex; align-items: center; justify-content: space-between; }
.menu__title { font-family: var(--serif); font-weight: 600; font-size: 18px; }
.menu__close { width: 44px; height: 44px; border-radius: 10px; background: rgba(255,255,255,.12); border: none; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.menu__links { display: flex; flex-direction: column; gap: 2px; margin-top: 28px; flex: 1; }
.menu__links a { font-family: var(--serif); font-weight: 500; font-size: 26px; color: #F8F3E8; padding: 14px 0; border-bottom: 1px solid rgba(243,237,223,.12); text-decoration: none; }
.menu__foot { display: flex; flex-direction: column; gap: 10px; }
.menu__foot a { text-align: center; text-decoration: none; }
.menu__cta { font: 600 16px/1 var(--sans); color: #fff; background: var(--clay); padding: 17px; border-radius: 12px; }
.menu__phone { font: 600 16px/1 var(--sans); color: #F8F3E8; padding: 15px; }

/* ---------- Первый экран ---------- */
.hero { position: relative; min-height: clamp(620px,92vh,900px); display: flex; align-items: center; background: var(--wood-900); overflow: hidden; }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__scrim { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(20,16,10,.8) 0%,rgba(20,16,10,.42) 46%,rgba(20,16,10,.14) 100%),linear-gradient(180deg,rgba(20,16,10,.4) 0%,rgba(20,16,10,.04) 38%,rgba(20,16,10,.66) 100%); }
.hero__inner { position: relative; z-index: 2; width: 100%; padding-top: clamp(56px,10vh,104px); padding-bottom: clamp(56px,10vh,104px); }
.hero__content { max-width: 840px; }
.hero__eyebrow { font: 600 13px/1.4 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: #E8C9B8; }
.hero__title { font-family: var(--serif); font-weight: 600; font-size: clamp(36px,6.4vw,72px); line-height: 1.02; letter-spacing: -.02em; color: #fff; margin: 18px 0 0; }
.hero__text { font: 400 clamp(16px,2.2vw,21px)/1.5 var(--sans); color: rgba(255,255,255,.9); margin: 22px 0 0; max-width: 600px; }
.hero__chips { display: flex; gap: 10px; flex-wrap: wrap; margin: 28px 0 0; }
.hero__price { display: flex; align-items: baseline; gap: 8px; margin-top: 30px; }
.hero__price-note { font: 400 16px/1 var(--sans); color: rgba(255,255,255,.75); }
.hero__price-val { font-family: var(--serif); font-weight: 600; font-size: clamp(34px,5vw,46px); color: #fff; }
.hero__price-unit { font: 400 15px/1 var(--sans); color: rgba(255,255,255,.75); }
.hero__cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; }

/* ---------- Блок брони (сводка) ---------- */
.booking-box { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
/* Сводка под бронью — «полоса доверия», не карточки/кнопки. */
.summary-grid { display: flex; flex-wrap: wrap; gap: 0; margin-top: 26px; border-top: 1px solid var(--line); }
.summary-card { flex: 1 1 180px; background: transparent; border: 0; border-left: 1px solid var(--line); border-radius: 0; padding: 16px 22px; text-align: left; }
.summary-card:first-child { border-left: 0; padding-left: 4px; }
.summary-card .pcard__title-sm { font-size: 16px; }
.summary-card__sub { font: 400 13px/1.4 var(--sans); color: var(--muted); margin-top: 4px; }
@media (max-width: 560px) { .summary-card { flex-basis: 50%; border-left: 0; padding-left: 4px; } }

/* Правила — единая обрамлённая панель строк (симметрично, без осиротевшей карточки). */
.rules-panel { background: var(--card); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.rule-row { display: grid; grid-template-columns: 260px 1fr; gap: 28px; padding: 20px clamp(20px,3vw,30px); border-top: 1px solid var(--line); }
.rule-row:first-child { border-top: 0; }
.rule-row__t { font-family: var(--serif); font-weight: 600; font-size: 17px; color: var(--head); }
.rule-row__d { font: 400 14px/1.55 var(--sans); color: var(--muted); }
@media (max-width: 560px) { .rule-row { grid-template-columns: 1fr; gap: 4px; } }

/* FAQ — узкий левый рельс (меньше пустоты) + широкий аккордеон. */
.faq-grid { display: grid; grid-template-columns: 340px 1fr; gap: clamp(28px,5vw,64px); align-items: start; }
@media (max-width: 860px) { .faq-grid { grid-template-columns: 1fr; } }
.faq-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: clamp(24px,3vw,34px); }
.faq-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(30px,4vw,60px); border-top: 1px solid #E4DCCC; }
.faq-list > div { border-bottom: 1px solid #EFE6D4; }
@media (max-width: 760px) { .faq-list { grid-template-columns: 1fr; } }

/* Отзывы — две половины сливаются без зазора (инь-янь). */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-radius: 22px; overflow: hidden; border: 1px solid var(--line); }
.duo > * { border-radius: 0; border: 0; }
@media (max-width: 760px) { .duo { grid-template-columns: 1fr; } }

/* ---------- Форма заявки ---------- */
.callback-form { display: flex; flex-direction: column; gap: 14px; }
.field-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.consent { display: flex; gap: 11px; align-items: flex-start; cursor: pointer; font: 400 13px/1.55 var(--sans); color: #5A5446; }

/* Блок заявки — без фото: слева контакты, справа форма в карточке */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(26px,4vw,60px); align-items: center; }
.contact-tel { font: 600 23px/1.1 var(--serif); color: var(--head); text-decoration: none; display: inline-block; margin-top: 4px; }
.contact-msgrs { display: flex; gap: 12px; margin-top: 16px; }
.contact-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: clamp(22px,2.8vw,36px); box-shadow: 0 30px 64px -48px rgba(60,40,20,.55); }
/* Финальный блок: фото + слева оффер/кнопка, справа форма-карточка */
.final-cta { position: relative; z-index: 2; display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(28px,5vw,64px); align-items: start; color: #fff; }
.final-cta__sec { padding: clamp(72px,9vw,120px) 0; }
.final-cta__lead { font: 400 clamp(16px,2vw,19px)/1.55 var(--sans); color: rgba(255,255,255,.88); margin: 16px 0 0; max-width: 30ch; }
.final-chips { display: flex; gap: 10px; flex-wrap: wrap; margin: 22px 0 26px; }
.final-cta .form-title { font-family: var(--serif); font-weight: 600; font-size: clamp(20px,2.2vw,26px); color: var(--head); margin: 0; }
.final-cta .form-sub { font: 400 14px/1.55 var(--sans); color: var(--muted); margin: 6px 0 18px; }
@media (max-width: 820px) { .final-cta { grid-template-columns: 1fr; } .final-cta__lead { max-width: none; } }
@media (max-width: 760px) { .contact-grid { grid-template-columns: 1fr; } }
/* Блок заявки — полноширинный двухтоновый баннер (фон до краёв экрана, без боковых пустот). */
.callback-banner { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; }
.callback-aside { position: relative; overflow: hidden; color: #F3EDDF; padding: clamp(26px,3.4vw,50px) clamp(22px,4vw,58px); display: flex; flex-direction: column; justify-content: center; }
.cb-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.callback-aside::after { content: ""; position: absolute; inset: 0; background: linear-gradient(165deg, rgba(22,14,8,.86), rgba(22,14,8,.62)); z-index: 1; }
.callback-aside > * { position: relative; z-index: 2; }
.callback-formwrap { background: #EFE6D4; padding: clamp(26px,3.4vw,50px) clamp(22px,4vw,54px); display: flex; flex-direction: column; justify-content: center; }
.callback-formwrap .form-title { font-family: var(--serif); font-weight: 600; font-size: clamp(22px,2.4vw,28px); color: var(--head); margin: 0 0 6px; }
.callback-formwrap .form-sub { font: 400 14px/1.55 var(--sans); color: var(--muted); margin: 0 0 20px; }
.callback-aside .eyebrow { color: var(--gold); }
.callback-aside .h2 { color: #F8F3E8; }
.callback-aside .lead { color: rgba(243,237,223,.82); }
.callback-cta { background: var(--sand); padding: clamp(34px,5vw,76px) clamp(22px,5vw,80px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; }
.callback-cta .h2 { margin: 0; }
.callback-cta .lead { margin: 0; }
.callback-points { display: flex; flex-direction: column; gap: 12px; margin: 22px 0 0; }
.callback-point { display: flex; align-items: center; gap: 11px; font: 500 15px/1.4 var(--sans); color: #F3EDDF; }
.callback-point svg { flex: 0 0 auto; color: var(--gold); }
.callback-contacts { display: flex; flex-direction: column; gap: 8px; margin-top: 22px; }
.callback-contacts a.tel { font: 600 19px/1.2 var(--serif); color: #fff; text-decoration: none; }
@media (max-width: 820px) { .callback-banner { grid-template-columns: 1fr; } }

/* Модальная форма заявки (вызывается кнопкой, а не скроллом) */
.modal { position: fixed; inset: 0; z-index: 90; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(28,18,10,.62); backdrop-filter: blur(4px); }
.modal--open { display: flex; }
.modal__card { position: relative; background: #fff; border-radius: 20px; padding: clamp(26px,3vw,40px); width: min(460px,100%); max-height: 90vh; overflow: auto; box-shadow: 0 50px 100px -40px rgba(0,0,0,.6); }
.modal__close { position: absolute; top: 14px; right: 14px; width: 38px; height: 38px; border-radius: 50%; border: none; background: #F1ECE2; color: #34271B; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.modal__close:hover { background: #E6DECF; }
.modal__title { font-family: var(--serif); font-weight: 600; font-size: 24px; color: var(--head); margin: 0 0 6px; }
.modal__sub { font: 400 14px/1.55 var(--sans); color: var(--muted); margin: 0 0 20px; }
.consent input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--clay); flex: 0 0 auto; }
.consent a { color: var(--clay); text-decoration: underline; }
.form-msg { display: none; font: 500 15px/1.4 var(--sans); }

/* ---------- Подвал ---------- */
.site-footer { background: var(--wood-900); color: #EFE9DC; padding: clamp(48px,7vw,80px) 0 0; }
.footer__top { display: grid; grid-template-columns: 1.5fr 1.1fr 1fr; gap: clamp(32px,5vw,72px); padding-bottom: 44px; border-bottom: 1px solid rgba(243,237,223,.14); }
@media (max-width: 860px) { .footer__top { grid-template-columns: 1fr 1fr; row-gap: 40px; } }
@media (max-width: 540px) { .footer__top { grid-template-columns: 1fr; } }
.footer__brand { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.footer__badge { width: 42px; height: 42px; border-radius: 11px; background: rgba(255,255,255,.1); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-weight: 600; font-size: 22px; }
.footer__name { display: block; font-family: var(--serif); font-weight: 600; font-size: 18px; color: #F8F3E8; }
.footer__tag { display: block; font: 500 11px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold); margin-top: 3px; }
.footer__about { font: 400 14px/1.6 var(--sans); color: rgba(243,237,223,.7); margin: 0 0 22px; max-width: 300px; }
.footer__btns { display: flex; gap: 10px; margin-top: 18px; }
.fbtn { display: inline-flex; align-items: center; gap: 8px; font: 600 13px/1 var(--sans); padding: 11px 15px; border-radius: 10px; text-decoration: none; transition: background .15s; }
.fbtn--wa { color: var(--wood-900); background: var(--gold); }
.fbtn--wa:hover { background: #d8af80; }
.fbtn--route { color: #F3EDDF; border: 1px solid rgba(243,237,223,.4); }
.fbtn--route:hover { background: rgba(243,237,223,.1); }
.footer__col { display: flex; flex-direction: column; gap: 12px; font: 400 15px/1.4 var(--sans); color: #F3EDDF; }
.footer__col--links { gap: 11px; color: rgba(243,237,223,.8); }
.footer__muted { color: rgba(243,237,223,.75); }
.footer__hours { color: rgba(243,237,223,.5); font-size: 13px; }
.footer__sub-head { font: 600 11px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold); margin-bottom: 11px; }
.msgrs { display: flex; gap: 10px; }
.msgr { display: block; width: 34px; height: 34px; border-radius: 50%; overflow: hidden; box-shadow: 0 4px 10px -4px rgba(0,0,0,.5); transition: transform .15s; }
.msgr:hover { transform: translateY(-2px); }
.msgr img { width: 100%; height: 100%; display: block; }
.footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 14px 28px; padding: 24px 0 36px; }
.footer__bottom-main { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.footer__bottom-main .flink { font: 500 13px/1 var(--sans); color: var(--gold); text-decoration: none; }
.footer__bottom-main .flink:hover { text-decoration: underline; }
.footer__bottom-legal { font: 400 12px/1.5 var(--sans); color: rgba(243,237,223,.38); }
.footer__dev { font: 500 12px/1 var(--sans); letter-spacing: .02em; color: rgba(243,237,223,.45); text-decoration: none; white-space: nowrap; transition: color .15s; }
.footer__dev:hover { color: var(--gold); }
.legal-links { display: flex; gap: 18px; flex-wrap: wrap; font: 400 13px/1.5 var(--sans); color: rgba(243,237,223,.55); }

/* ---------- Cookie ---------- */
.cookie__card { background: var(--card); border: 1px solid #E0D4BC; border-radius: 16px; box-shadow: 0 20px 50px -20px rgba(36,26,18,.55); padding: 18px 20px; }
.cookie__text { font: 400 13px/1.55 var(--sans); color: #5A5446; }
.cookie__text a { color: var(--clay); text-decoration: underline; }
.cookie__row { display: flex; gap: 12px; align-items: center; margin-top: 14px; }
.cookie__accept { font: 600 14px/1 var(--sans); color: #fff; background: var(--clay); border: none; padding: 12px 22px; border-radius: 10px; cursor: pointer; }
.cookie__accept:hover { background: var(--clay-700); }
.cookie__more { font: 500 13px/1 var(--sans); color: var(--muted); text-decoration: none; }
.cookie__more:hover { color: var(--head); }

/* ---------- Мобильная нижняя панель ---------- */
.botbar__ico { width: 48px; height: 48px; border-radius: 12px; border: 1px solid #E0D4BC; background: #FBF6EC; display: flex; align-items: center; justify-content: center; text-decoration: none; }
.botbar__cta { height: 48px; border-radius: 12px; background: var(--clay); color: #fff; font: 600 15px/1 var(--sans); display: flex; align-items: center; justify-content: center; text-decoration: none; }

/* ---------- Страница источников изображений ---------- */
.credits-body { margin: 0; background: #F8F5EF; color: var(--text); font-family: var(--sans); }
.credits-main { padding: clamp(44px,7vw,88px) 0; }
.credits-back { display: inline-flex; margin-bottom: 28px; font: 600 14px/1 var(--sans); color: var(--clay); text-decoration: none; }
.credits-back:hover { text-decoration: underline; text-underline-offset: 3px; }
.credits-intro { max-width: 780px; margin-bottom: 32px; }
.credits-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,320px),1fr)); gap: 18px; }
.credit-card { overflow: hidden; background: #fff; border: 1px solid #E4DCCC; border-radius: 18px; }
.credit-card__image { aspect-ratio: 3/2; overflow: hidden; background: #E9E1D4; }
.credit-card__image img { width: 100%; height: 100%; object-fit: cover; }
.credit-card__body { padding: 20px; }
.credit-card__title { margin: 0 0 10px; font: 600 21px/1.2 var(--serif); color: var(--head); }
.credit-card__meta { margin: 5px 0; font: 400 14px/1.55 var(--sans); color: var(--muted); }
.credit-card__meta strong { color: var(--head); }
.credit-card__link { color: var(--clay); text-underline-offset: 3px; }
.credits-note { margin-top: 26px; padding: 18px 20px; border-radius: 14px; background: #EFE7D8; font: 400 14px/1.6 var(--sans); color: #5A5446; }

/* ===== Интерактив на чистом JS (после отвязки DC-рантайма) ===== */
.menu[hidden] { display: none; }

/* Галерея: вкладки и плитки (значения перенесены из прежних инлайн-стилей) */
.gal-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.gal-tab { font: 600 13px/1 var(--sans); padding: 10px 16px; border-radius: 999px; cursor: pointer; border: 1px solid #E0D4BC; background: #fff; color: #3A342A; }
.gal-tab.is-active { border-color: var(--head); background: var(--head); color: #F8F3E8; }
.gal-panel[hidden] { display: none; }
.gal-tile { position: relative; aspect-ratio: 4/3; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); background: linear-gradient(135deg,#EADFC9,#D8CDB4); cursor: zoom-in; padding: 0; display: block; width: 100%; text-align: left; }
.gal-tile--ph { cursor: default; }
.gal-tile__img { position: absolute; inset: 0; background-size: cover; background-position: center; }
.gal-tile__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 12px 9px; font: 500 12px/1.2 var(--sans); color: #fff; background: linear-gradient(180deg,transparent,rgba(20,16,10,.7)); }
.gal-ph { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 16px; }
.gal-ph__badge { position: absolute; top: 9px; left: 9px; font: 600 9px/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: #8A6A45; background: #FBF6EC; border: 1px solid var(--line); padding: 4px 7px; border-radius: 999px; }
.gal-ph__cap { font: 400 12px/1.35 var(--sans); color: #7C5A39; max-width: 170px; }

/* FAQ (аккордеон) */
.faq-item { border-bottom: 1px solid #EFE6D4; }
.faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 14px; background: none; border: none; padding: 20px 0; cursor: pointer; text-align: left; }
.faq-q__text { font-family: var(--serif); font-weight: 600; font-size: clamp(16px,2.2vw,19px); color: var(--head); }
.faq-q__icon { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; background: #EBE7D2; color: #5C4632; display: flex; align-items: center; justify-content: center; transition: transform .2s; }
.faq-item.is-open .faq-q__icon { background: var(--clay); color: #fff; transform: rotate(180deg); }
.faq-a { font: 400 15px/1.6 var(--sans); color: var(--muted); margin: 0; padding: 0 0 20px; max-width: 720px; }
.faq-item:not(.is-open) .faq-a { display: none; }

/* Видео: CTA hover (ранее инлайн-hover) */
.video-cta { font: 600 12px/1 var(--sans); letter-spacing: .03em; color: #241A12; background: #E8C9B8; padding: 12px 18px; border-radius: 999px; text-decoration: none; }
.video-cta:hover { background: #F0D6B8; }

/* Лайтбокс */
.lightbox { position: fixed; inset: 0; z-index: 70; background: rgba(20,16,10,.92); display: flex; align-items: center; justify-content: center; padding: clamp(12px,4vw,40px); cursor: zoom-out; }
.lightbox[hidden] { display: none; }
.lightbox__fig { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 14px; cursor: default; max-width: min(1100px,90vw); }
.lightbox__img { width: min(1100px,90vw); height: 78vh; background-size: contain; background-repeat: no-repeat; background-position: center; border-radius: 12px; filter: drop-shadow(0 30px 60px rgba(0,0,0,.6)); }
.lightbox__cap { display: flex; align-items: center; gap: 12px; color: #F3EDDF; font: 500 14px/1 var(--sans); }
.lightbox__counter { opacity: .55; }
.lightbox__btn { position: absolute; top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,.14); border: none; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.lightbox__btn:hover { background: rgba(255,255,255,.28); }
.lightbox__btn--prev { left: clamp(8px,3vw,28px); }
.lightbox__btn--next { right: clamp(8px,3vw,28px); }
.lightbox__close { position: absolute; top: 20px; right: 20px; width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.15); border: none; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.lightbox__close:hover { background: rgba(255,255,255,.28); }
