/* =============================================================
   Podvorye Theme
   ============================================================= */

/* Manrope — self-hosted (без CDN). Вариативный 200–800, сабсеты latin/cyrillic. */
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/templates/podvorye/assets/fonts/manrope/manrope-cyrillic-ext.woff2') format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/templates/podvorye/assets/fonts/manrope/manrope-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/templates/podvorye/assets/fonts/manrope/manrope-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/templates/podvorye/assets/fonts/manrope/manrope-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* --- Base --- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:        #1C0E09;
  --bg-alt:    #1c0f09;
  --bg-card:   #2e1a10;
  --accent:    #da3c3c;
  --gold:      #c9a96e;
  --cream:     #f5e9d0;
  --text:      #d8c8a8;
  --muted:     #8a6e50;
  --border:    rgba(201,169,110,.18);
  --radius:    8px;
  --hdr-h:     76px;
  --font:      'Manrope', sans-serif;
  --frame:     32px;            /* рамка героя = боковой отступ секций под него */
}

html { scroll-behavior: smooth; }
body { font-family: var(--font); font-size: 16px; line-height: 1.7; color: var(--text); background: var(--bg); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--gold); text-decoration: none; transition: color .2s; }
a:hover { color: var(--accent); }
h1,h2,h3,h4 { font-family: var(--font); color: var(--cream); line-height: 1.25; }
h1 { font-size: clamp(2rem,5vw,3.5rem); }
h2 { font-size: clamp(1.6rem,3.5vw,2.4rem); }
h3 { font-size: clamp(1.15rem,2vw,1.5rem); }

.container { max-width: 1500px; margin: 0 auto; padding: 0 24px; }

/* =============================================================
   HEADER
   ============================================================= */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 200;
  padding: 4px var(--frame) 0;    /* воздух сверху, выровнен по рамке героя */
  background: transparent;
  transition: background .3s, padding .3s;
}
.site-header.scrolled {
  padding: 0;                     /* при скролле — плоская плашка у верха, без капсулы */
  background: #1C0E09;
  box-shadow: 0 10px 30px rgba(0,0,0,.3);
}

.header-row {
  display: flex;
  align-items: center;
  height: var(--hdr-h);
  gap: 32px;
}

/* Logo */
.logo { flex-shrink: 0; }
.logo img { height: 50px; width: auto; }

/* Nav */
.main-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
}
.nav-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  color: rgba(245,233,208,.84);
  font-size: .96rem;
  font-weight: 600;
  border-radius: var(--radius);
  transition: color .2s, background .2s;
  white-space: nowrap;
}
.nav-link:hover { color: #f6aa1c; background: rgba(201,169,110,.11); }
.nav-caret { font-size: .65rem; opacity: .7; }

.nav-item { position: relative; }
.nav-drop {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  background: rgba(28,14,9,.97);
  backdrop-filter: blur(10px);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  min-width: 220px;
  padding: 6px;
  display: none;
  z-index: 300;
  box-shadow: 0 16px 40px rgba(0,0,0,.5);
}
.nav-item.has-drop:hover .nav-drop { display: block; }
.nav-drop a {
  display: block;
  padding: 8px 14px;
  border-radius: 6px;
  font-size: .85rem;
  color: var(--text);
  transition: background .15s, color .15s;
}
.nav-drop a:hover { background: rgba(201,169,110,.1); color: #f6aa1c; }

/* Header contacts */
.header-contacts {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}
.hdr-phone {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,248,232,.93);
  font-size: .92rem;
  font-weight: 600;
  white-space: nowrap;
}
.hdr-phones { display: flex; flex-direction: row; align-items: center; gap: 18px; }
.hdr-phone svg { color: #f6aa1c; flex-shrink: 0; }
.hdr-phone:hover { color: #f6aa1c; }
.hdr-wa {
  display: none;                  /* WhatsApp в хедере скрыт */
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: #25d366;
  color: #fff;
  flex-shrink: 0;
  transition: transform .2s, background .2s;
}
.hdr-wa svg { width: 17px; height: 17px; }
.hdr-wa:hover { background: #1ebe5d; color: #fff; transform: scale(1.05); }
/* Плашки мессенджеров в шапке (MAX, WhatsApp) — после телефонов */
.hdr-msgs { display: flex; align-items: center; gap: 8px; }
.hdr-msg {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0;
  transition: background .2s, transform .2s;
}
.hdr-msg svg { width: 22px; height: 22px; }
.hdr-msg:hover { transform: translateY(-1px); }
.hdr-msg--wa  { background: rgba(37,211,102,.14); }
.hdr-msg--wa svg { color: #25d366; width: 25px; height: 25px; }  /* иконка крупнее, плашка 38×38 без изменений */
.hdr-msg--wa:hover { background: rgba(37,211,102,.24); }
.hdr-msg--max { background: rgba(94,68,255,.26); }
.hdr-msg--max:hover { background: rgba(94,68,255,.36); }
.hdr-msg--max svg { border-radius: 7px; }

/* Мобильная шапка: два телефона (одна иконка) + WhatsApp перед бургером (показ ≤1024) */
.hdr-mob { display: none; }
.hdr-mob-phones { display: inline-flex; align-items: center; gap: 5px; }
.hdr-mob-phones > svg { color: #f6aa1c; flex-shrink: 0; }
.hdr-mob-nums { display: flex; flex-direction: column; line-height: 1.18; }
.hdr-mob-nums a { color: rgba(255,248,232,.93); font-size: .92rem; font-weight: 600; white-space: nowrap; letter-spacing: -0.5px; }
.hdr-mob-nums a:hover { color: #f6aa1c; }
.hdr-mob-wa { display: inline-flex; align-items: center; flex-shrink: 0; }
.hdr-mob-max { display: inline-flex; align-items: center; flex-shrink: 0; }
.hdr-mob-max svg { border-radius: 7px; }

.btn-book {
  display: inline-flex;
  align-items: center;
  padding: 11px 24px;
  background: #f6aa1c;
  color: #1C0E09;
  font-size: .85rem;
  font-weight: 700;
  border-radius: var(--radius);
  white-space: nowrap;
  transition: background .2s;
}
.btn-book:hover { background: #e0950f; color: #1C0E09; }

/* Mobile toggle */
.nav-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  border-radius: var(--radius);
  transition: background .2s;
}
.nav-toggle:hover { background: rgba(255,255,255,.08); }
.nav-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--cream);
  border-radius: 2px;
  transition: transform .25s, opacity .25s;
}

/* Drawer overlay */
.nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 298;
  backdrop-filter: blur(2px);
}
.nav-overlay.open { display: block; }

/* Drawer */
.nav-drawer {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: min(320px, 85vw);
  background: #150A06;
  z-index: 299;
  transform: translateX(100%);
  transition: transform .32s cubic-bezier(.4,0,.2,1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.nav-drawer.open { transform: translateX(0); }

.nav-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  flex-shrink: 0;
}
.drawer-logo { height: 38px; width: auto; }
.drawer-close {
  background: rgba(255,255,255,.06);
  border: none;
  border-radius: 8px;
  color: var(--cream);
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background .2s;
}
.drawer-close:hover { background: rgba(255,255,255,.12); }

.drawer-nav {
  flex: 1;
  overflow-y: auto;
  padding: 12px 0;
}

.drawer-link {
  display: block;
  padding: 13px 24px;
  color: rgba(245,233,208,.85);
  font-size: 1rem;
  font-weight: 500;
  border-bottom: 1px solid rgba(255,255,255,.025);
  transition: color .15s, background .15s;
}
.drawer-link:hover { color: #f6aa1c; background: rgba(201,169,110,.06); }

.drawer-group { border-bottom: 1px solid rgba(255,255,255,.025); }
/* Заголовок группы: слева кликабельная ссылка на страницу, справа стрелка-разворот */
.drawer-group-head { display: flex; align-items: stretch; }
.drawer-group-title { flex: 1 1 auto; border-bottom: none; }
.drawer-group-title.is-disabled { opacity: .55; cursor: default; }
.drawer-group-title.is-disabled:hover { color: rgba(245,233,208,.85); background: none; }
.drawer-group-toggle {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  background: none;
  border: none;
  color: rgba(245,233,208,.6);
  cursor: pointer;
  transition: color .15s;
}
.drawer-group-toggle:hover { color: #f6aa1c; }
.drawer-chevron { transition: transform .25s; flex-shrink: 0; }
.drawer-group.open .drawer-chevron { transform: rotate(180deg); }

.drawer-sub {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
  background: rgba(0,0,0,.2);
}
.drawer-group.open .drawer-sub { max-height: 600px; }
.drawer-sub a {
  display: block;
  padding: 10px 24px 10px 36px;
  color: var(--muted);
  font-size: .9rem;
  transition: color .15s;
  border-bottom: 1px solid rgba(255,255,255,.03);
}
.drawer-sub a:last-child { border: none; }
.drawer-sub a:hover { color: #f6aa1c; }

.drawer-footer {
  padding: 20px;
  border-top: 1px solid rgba(255,255,255,.05);
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-shrink: 0;
}
.drawer-phone {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--cream);
  font-size: 1rem;
  font-weight: 600;
}
.drawer-phone svg { color: #f6aa1c; flex-shrink: 0; }
.drawer-phone:hover { color: #f6aa1c; }
.drawer-msgs { display: flex; gap: 10px; flex-wrap: wrap; }
.drawer-msg {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 14px; border-radius: 12px;
  color: var(--cream); font-size: .92rem; font-weight: 600;
  transition: background .2s;
}
.drawer-msg svg { width: 22px; height: 22px; flex-shrink: 0; }
.drawer-msg:hover { color: var(--cream); }
.drawer-msg--wa  { background: rgba(37,211,102,.14); }
.drawer-msg--wa svg { color: #25d366; }
.drawer-msg--wa:hover  { background: rgba(37,211,102,.24); }
.drawer-msg--max { background: rgba(94,68,255,.26); }
.drawer-msg--max:hover { background: rgba(94,68,255,.36); }
.drawer-msg--max svg { border-radius: 7px; }
.drawer-book {
  display: block;
  text-align: center;
  padding: 12px;
  background: #f6aa1c;
  color: #1C0E09;
  font-weight: 700;
  font-size: .95rem;
  border-radius: var(--radius);
  transition: background .2s;
  margin-top: 4px;
}
.drawer-book:hover { background: #e0950f; color: #1C0E09; }

/* =============================================================
   HERO — full screen like dacha
   ============================================================= */
.hero {
  position: relative;
  min-height: 100vh;
  background: #1C0E09;            /* коричневая рамка-фон */
  padding: 84px var(--frame) var(--frame);   /* воздух сверху под хедер */
  display: flex;
  flex-direction: column;
}
.hero-inner {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  border-radius: 40px;
  overflow: hidden;
  background-color: #1C0E09;
  background-size: cover;
  background-position: center 45%;
  background-repeat: no-repeat;
}
.hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(18,10,5,.68);   /* ровное затемнение одним цветом */
}
.hero-body {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: calc(var(--hdr-h) + 10px);
  padding-bottom: 96px;
  text-align: center;
}
.hero-body .container { width: 100%; }

.hero-kicker {
  font-size: .92rem;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 5px;
  font-weight: 700;
}
.hero-title {
  color: #fff;
  font-size: clamp(3.2rem, 6.6vw, 6rem);
  line-height: 1;
  margin-bottom: 16px;
  text-shadow: 0 16px 44px rgba(0,0,0,.38);
}
.hero-sub {
  color: #f6aa1c;
  font-family: var(--font);
  font-size: clamp(1.2rem, 1.9vw, 1.6rem);
  font-style: normal;
  margin-bottom: 24px;
}
.hero-text {
  color: #fff;
  font-size: clamp(1.12rem, 1.5vw, 1.32rem);
  line-height: 1.7;
  max-width: 880px;
  margin: 0 auto 24px;
  text-shadow: 0 8px 26px rgba(0,0,0,.42);
}
.hero-phones {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 4px;
}
.hero-phone {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 11px 22px;
  font-size: 1.12rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: .02em;
  background: rgba(28,15,9,.45);
  border: 1px solid rgba(246,170,28,.5);
  border-radius: 999px;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  text-shadow: 0 6px 18px rgba(0,0,0,.4);
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.hero-phone svg { flex-shrink: 0; color: #f6aa1c; transition: color .2s; }
.hero-phone:hover { background: #f6aa1c; color: #1C0E09; border-color: #f6aa1c; transform: translateY(-2px); text-shadow: none; }
.hero-phone:hover svg { color: #1C0E09; }

/* Booking bar */
.hero-book-bar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 200;
  background: transparent;
  padding: 0 0 18px;   /* холдер: только нижний отступ; ширина — как у .container контента */
}
/* Жёлтая капсула бара — на форме, чтобы её края совпадали с контентом (внутри паддинга .container) */
.book-form {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 12px;
  flex-wrap: wrap;
  border-radius: 18px;
  padding: 16px 22px;
  box-shadow: 0 14px 40px rgba(0,0,0,.3);
}
/* Фон + блюр капсулы — на псевдоэлементе, чтобы сама .book-form НЕ становилась
   containing-block для position:fixed (иначе выпадашки дат/гостей привязываются к капсуле).
   Так блюр работает и на мобиле, а попапы остаются привязаны к экрану. */
.book-form::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(246,170,28,.66);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}
.book-form > * { position: relative; }
.book-field {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 150px;
  background: rgba(255,255,255,.82);
  border-radius: 12px;
  padding: 8px 14px;
}
.bf-text { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.bf-icon { width: 20px; height: 20px; color: #1C0E09; opacity: .7; flex-shrink: 0; pointer-events: none; }
.book-field label {
  font-size: .6rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(34,9,1,.55);
  font-weight: 700;
}
.book-field input,
.book-field select {
  background: transparent;
  border: none;
  color: #1C0E09;
  font-size: .95rem;
  font-weight: 600;
  padding: 0;
  outline: none;
  font-family: inherit;
  width: 100%;
  min-width: 0;
  -webkit-appearance: none;
  appearance: none;
}
.book-field input::placeholder { color: rgba(34,9,1,.45); font-weight: 500; }
.book-field input:focus,
.book-field select:focus { border-color: #1C0E09; }
.book-field input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(.7); }
.book-sep { color: #1C0E09; font-size: 1.2rem; display: flex; align-items: center; }
.book-btn {
  align-self: stretch;            /* высота как у плашек */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 30px;
  background: #1C0E09;
  color: #f6aa1c;
  font-size: .9rem;
  font-weight: 700;
  border: 1.5px solid #1C0E09;
  border-radius: 12px;
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s, color .2s;
  font-family: inherit;
}
.book-btn:hover { background: #f6aa1c; color: #1C0E09; }
/* CTA «Забронировать» на детальной номера: жёлтая, на всю ширину, текст по центру */
.rb-cta { display: flex; width: 100%; justify-content: center; text-align: center; background: #f6aa1c; color: #1C0E09; border-color: #f6aa1c; }
.rb-cta:hover { background: #e0950f; color: #1C0E09; border-color: #e0950f; }

/* =============================================================
   SERVICES SECTION
   ============================================================= */
.services-section {
  background: #1C0E09;
}

.services-inner {
  display: grid;
  grid-template-columns: 1fr 1.15fr;   /* слева текст+видео, справа фото */
  gap: clamp(30px, 4vw, 60px);
  align-items: start;
}

/* левая колонка: текст + видео */
.services-left { margin-top: 100px; }   /* смещение вниз на десктопе */
.services-left .eyebrow { display: block; margin-bottom: 16px; letter-spacing: .2em; }
.services-left h2 {
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.08;
  margin-bottom: 20px;
}
.services-sub {
  color: rgba(216,200,168,.72);
  font-size: 1.12rem;
  line-height: 1.75;
}
.services-video { margin-top: 56px; }
.svid-frame {
  display: block; position: relative; width: 100%; padding: 0;
  border: none; border-radius: 28px; overflow: hidden; cursor: pointer;
  aspect-ratio: 16 / 9; background: #000;
}
.svid-frame img { display: block; width: 100%; height: 100%; object-fit: cover; }
.svid-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.35)); }
.svid-play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2;
  width: 76px; height: 76px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--accent); color: #fff; border: 2px solid var(--accent);
  padding-left: 4px; transition: background .2s, border-color .2s, transform .2s;
}
.svid-frame:hover .svid-play { background: #c22f2f; border-color: #c22f2f; color: #fff; transform: translate(-50%,-50%) scale(1.06); }
.svid-play svg { display: block; }

/* правая колонка: две под-колонки со смещением (стаггер) */
.services-right {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 34px;
  align-items: start;
}
.srv-col { display: flex; flex-direction: column; gap: 48px; }
.srv-col--down { margin-top: 48px; }   /* асимметрия — колонка ниже */

.scat {
  display: block;
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  aspect-ratio: 4/5;
  text-decoration: none;
  background: rgba(255,255,255,.04);
  isolation: isolate;
}
.scat img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .45s, filter .45s;
  display: block;
  filter: saturate(.96) contrast(1.02);
}
.scat:hover img { transform: scale(1.045); filter: saturate(1.04) contrast(1.04); }
.scat::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18,9,4,.06) 0%, rgba(18,9,4,.08) 44%, rgba(18,9,4,.78) 100%);
  z-index: 1;
  transition: background .3s;
}
.scat:hover::after {
  background:
    linear-gradient(180deg, rgba(18,9,4,.02) 0%, rgba(18,9,4,.08) 38%, rgba(18,9,4,.84) 100%);
}
.scat-title {
  position: absolute;
  bottom: 22px; left: 24px; right: 18px;
  text-align: left;
  z-index: 2;
  color: #fff;
  font-family: var(--font);
  font-size: clamp(1.2rem, 1.5vw, 1.7rem);
  font-weight: 300;
  letter-spacing: .01em;
  line-height: 1.1;
  text-shadow: 0 8px 20px rgba(0,0,0,.52);
}

@media (max-width: 900px) {
  .services-inner { grid-template-columns: 1fr; gap: 34px; }
  .srv-col--down { margin-top: 0; }     /* на мобиле смещение убираем */
  .services-left { margin-top: 0; }
  .services-video { margin-top: 28px; }
}
@media (max-width: 600px) {
  .services-section { padding-top: 58px; padding-bottom: 62px; }
  .services-left h2 { font-size: clamp(1.85rem, 9vw, 2.35rem); margin-bottom: 14px; }
  .services-sub { font-size: 1rem; line-height: 1.68; }
  .services-right { gap: 12px; }
  .srv-col { gap: 12px; }
  .scat { border-radius: 22px; }
  .scat-title { bottom: 16px; left: 18px; right: 14px; font-size: 1.1rem; }
}

/* =============================================================
   BUTTONS
   ============================================================= */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  border-radius: var(--radius);
  font-size: .9rem;
  font-weight: 600;
  cursor: pointer;
  border: none;
  text-decoration: none;
  transition: background .2s, color .2s;
}
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover { background: #c22f2f; color: #fff; }
.btn-outline { background: transparent; color: var(--gold); border: 1px solid var(--gold); }
.btn-outline:hover { background: var(--gold); color: var(--bg); }

/* =============================================================
   SECTIONS
   ============================================================= */
.section { padding: 80px 0; }
.section-alt { background: rgba(0,0,0,.25); }
.section-head { text-align: center; margin-bottom: 52px; }
.eyebrow {
  display: inline-block;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 12px;
}
.section-head h2 { margin-bottom: 14px; }
.section-head p { color: var(--muted); max-width: 540px; margin: 0 auto; }

/* Grid */
.grid { display: grid; gap: 24px; }
.grid-2 { grid-template-columns: repeat(2,1fr); }
.grid-3 { grid-template-columns: repeat(3,1fr); }
.grid-4 { grid-template-columns: repeat(4,1fr); }

/* Cards */
.card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: transform .2s, box-shadow .2s;
}
.card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,0,0,.4); }
.card img { width: 100%; height: 220px; object-fit: cover; }
.card-body { padding: 20px; }
.card-body h3 { margin-bottom: 8px; font-size: 1.1rem; }
.card-body p { color: var(--muted); font-size: .875rem; margin-bottom: 16px; }
.card-price { color: var(--gold); font-weight: 700; }

/* Reviews */
.review-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 24px;
}
.review-stars { color: var(--gold); letter-spacing: 2px; margin-bottom: 12px; }
.review-text { color: var(--muted); font-size: .875rem; font-style: italic; margin-bottom: 16px; }
.review-author { display: flex; align-items: center; gap: 10px; }
.review-avatar {
  width: 38px; height: 38px;
  background: var(--accent);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; color: #fff; flex-shrink: 0;
}
.review-author b { color: var(--cream); font-size: .875rem; }

/* Gallery strip */
.gallery-strip { display: grid; grid-template-columns: repeat(6,1fr); gap: 4px; }
.gallery-strip a { display: block; overflow: hidden; border-radius: 4px; }
.gallery-strip img { width: 100%; height: 130px; object-fit: cover; transition: transform .3s; cursor: pointer; }
.gallery-strip a:hover img { transform: scale(1.05); }

/* ====== GALLERY SECTION (Фотогалерея) ====== */
.gallery-section { background: #1C0E09; }
.gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.gallery-cell { display: block; overflow: hidden; border-radius: 18px; aspect-ratio: 4 / 3; }
.gallery-cell img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; cursor: pointer; }
.gallery-cell:hover img { transform: scale(1.05); }
@media (max-width: 900px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; } }
@media (max-width: 600px) { .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

/* =============================================================
   MODAL (бронирование)
   ============================================================= */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.75);
  z-index: 500;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.modal-overlay.open { display: flex; }
.modal-box {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 36px;
  max-width: 420px;
  width: 100%;
  position: relative;
}
.modal-box h3 { font-family: var(--font); color: var(--cream); font-size: 1.5rem; }
.modal-close {
  position: absolute;
  top: 14px; right: 16px;
  background: none; border: none;
  color: var(--muted); font-size: 1.8rem;
  cursor: pointer; line-height: 1;
  transition: color .2s;
}
.modal-close:hover { color: var(--cream); }

/* =============================================================
   FOOTER
   ============================================================= */
.site-footer {
  background: var(--bg);                       /* обычный коричневый фон сайта */
  padding: var(--frame) 0 0;                   /* только верхний отступ; по бокам и снизу — без отступа */
}
.footer-inner {
  background: #150A06;                          /* панель чуть темнее фона */
  border-radius: 40px 40px 0 0;                /* скругление только сверху; нижние углы прямые */
  padding-top: 56px;
  padding-bottom: 52px;
}
.footer-grid {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 40px 60px;
  padding-bottom: 25px;
}
.foot-col { display: flex; flex-direction: column; gap: 12px; }
.foot-contacts-col { gap: 14px; }
.foot-org-col { gap: 16px; }
.foot-nav { gap: 11px; }
.foot-link { display: inline-flex; align-items: center; gap: 10px; color: var(--text); font-size: .92rem; transition: color .2s; }
.foot-link::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #f6aa1c; flex-shrink: 0; }
.foot-link:hover { color: #f6aa1c; }
.foot-logo img { height: 96px; width: auto; }
.foot-phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-size: .95rem;
  font-weight: 600;
}
.foot-phone svg { color: #f6aa1c; flex-shrink: 0; }
.foot-phone:hover { color: #f6aa1c; }
.foot-phone-lbl { color: var(--muted); font-size: .78rem; font-weight: 400; }
.foot-msgs { display: flex; gap: 10px; margin-top: 6px; }
.foot-msg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  transition: background .2s, transform .2s;
}
.foot-msg:hover { transform: translateY(-2px); }
.foot-msg--wa  { background: rgba(37,211,102,.12); }
.foot-msg--wa:hover  { background: rgba(37,211,102,.2); }
.foot-msg--wa svg { color: #25d366; }
.foot-msg--tg  { background: rgba(34,158,217,.12); }
.foot-msg--tg:hover  { background: rgba(34,158,217,.2); }
.foot-msg--tg svg { color: #229ed9; }
.foot-msg--max { background: rgba(94,68,255,.26); }
.foot-msg--max:hover { background: rgba(94,68,255,.36); }
.foot-msg--max svg { border-radius: 7px; }
.foot-bottom {
  padding: 0;
  color: var(--muted);
  font-size: .8rem;
}
.foot-bottom-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 28px;
  flex-wrap: wrap;
}
.foot-legal { display: flex; align-items: center; gap: 14px 24px; flex-wrap: wrap; }
.foot-policy { color: var(--muted); transition: color .2s; }
.foot-policy:hover { color: #f6aa1c; }
.foot-legal-col .foot-policy { font-size: .92rem; }
.foot-copy { color: var(--muted); font-size: .8rem; margin-top: 6px; }

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 1024px) {
  .grid-4 { grid-template-columns: repeat(2,1fr); }
}

/* Шапка переключается в мобильный вид раньше — в ней много элементов (2 телефона, меню, кнопка) */
@media (max-width: 1024px) {
  .nav-toggle { display: flex; }
  .main-nav { display: none; }        /* на мобиле используем drawer */
  .hdr-phones { display: none; }      /* телефоны с номерами — в выезжающем меню */
  .hdr-msgs { display: none; }        /* мессенджеры — в выезжающем меню */
  .btn-book { display: none; }
  .hdr-mob { display: flex; align-items: center; gap: 12px; }
  .header-row { justify-content: space-between; gap: 20px; }
  .logo { flex-shrink: 0; }
  .header-contacts { margin-left: auto; gap: 6px; align-items: center; }
  /* убираем лишние боковые отступы шапки (была рамка --frame + паддинг .container) */
  .site-header { padding-left: 0; padding-right: 0; }
  .site-header .container { padding-left: 14px; padding-right: 14px; }
}

@media (max-width: 768px) {
  :root { --hdr-h: 62px; --frame: 16px; }

  .logo img { height: 48px; }
  .hdr-wa { width: 34px; height: 34px; }

  /* Капсула — меньше внешний отступ на мобиле */
  .site-header { padding: 8px 0 0; }
  .site-header .container { padding-left: 12px; padding-right: 12px; }

  /* Hero */
  .hero {
    min-height: 90svh;
    padding: 78px 0 var(--frame);   /* убраны только боковые отступы — фон до краёв; верх/низ как было */
  }
  .hero-inner { background-position: 55% center; border-radius: 28px; }
  .hero-overlay {
    background: rgba(18,10,5,.68);
  }
  .hero-body {
    padding-top: calc(var(--hdr-h) + 10px);
    padding-bottom: 80px;
  }
  .hero-kicker {
    font-size: .76rem;
    letter-spacing: .18em;
    margin-bottom: 10px;
  }
  .hero-title {
    font-size: clamp(2.6rem, 11vw, 3.8rem);
    margin-bottom: 12px;
  }
  .hero-sub {
    font-size: 1.12rem;
    margin-bottom: 16px;
  }
  .hero-text {
    font-size: 1.02rem;
    line-height: 1.6;
    max-width: 27rem;
    margin-bottom: 18px;
  }
  .hero-phone {
    font-size: 1rem;
  }

  /* Липкая капсула брони — до краёв (без боковых/нижнего отступа), низ прямой */
  .hero-book-bar { padding-bottom: 0; }
  .hero-book-bar .container { padding-left: 0; padding-right: 0; }

  /* Booking form — 2 колонки: Заезд|Выезд, Гости|Кнопка */
  .book-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    align-items: stretch;
    border-radius: 18px 18px 0 0;   /* нижние углы прямые */
    padding: 13px 12px;             /* меньше воздуха внутри, по бокам сильнее */
  }
  .book-sep { display: none; }
  .book-field { min-width: 0; flex: none; }
  .book-btn {
    align-self: stretch;
    width: 100%;
    padding: 11px 10px;
    font-size: .86rem;
  }

  /* Sections */
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .gallery-strip { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { flex-direction: column; align-items: flex-start; gap: 30px; }
  .section { padding: 52px 0; }

  /* Booking widget mobile */
  .book-cal-popup { left: 8px; right: 8px; }
  .bcp-months { grid-template-columns: 1fr; }
}

/* =============================================================
   BOOKING WIDGET (calendar + results)
   ============================================================= */

/* Date inputs styled same as existing inputs */
.book-date-inp { cursor: pointer; }
.book-date-inp:focus { border-color: #1C0E09; outline: none; }

/* Guests dropdown */
.book-gdrop {
  position: absolute;
  bottom: calc(100% + 6px);
  top: auto;
  left: 0;
  background: #1e1008;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  z-index: 300;
  min-width: 220px;
  box-shadow: 0 8px 32px rgba(0,0,0,.6);
}
.bgd-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; font-size: 14px; color: var(--cream); }
.bgd-ctrl { display: flex; align-items: center; gap: 12px; }
.bgd-ctrl button { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--border); background: transparent; color: var(--cream); font-size: 18px; cursor: pointer; transition: background .15s; }
.bgd-ctrl button:hover { background: rgba(201,169,110,.15); }
.bgd-ctrl span { font-size: 16px; font-weight: 700; min-width: 20px; text-align: center; }

/* Calendar popup */
.book-cal-popup {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  width: 700px;
  max-width: calc(100vw - 24px);
  background: #fff;
  border-radius: 16px;
  padding: 50px 26px 18px;
  z-index: 400;
  box-shadow: 0 12px 48px rgba(0,0,0,.28);
  border: 1px solid #e8dcc8;
}
.bcp-close {
  position: absolute;
  top: 14px; right: 16px;
  width: 30px; height: 30px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: #b29670;
  font-size: 22px; line-height: 1;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: color .15s, background .15s, transform .2s;
  z-index: 5;
}
.bcp-close:hover { background: #f3ece0; color: #7a6040; transform: rotate(90deg); }
.bcp-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; gap: 8px; }
.bcp-nav button { background: #f5efe4; border: 1px solid #e0d4c0; border-radius: 8px; width: 32px; height: 32px; color: #7a6040; font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s; }
.bcp-nav button:hover { background: #ede0cc; }
.bcp-nav span { font-size: 14px; font-weight: 700; color: #2a1800; text-align: center; }
.bcp-months { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.bcp-mtitle { font-size: 13px; font-weight: 700; color: #2a1800; text-align: center; margin-bottom: 10px; letter-spacing: .01em; }
.bcp-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 3px; }
.bcp-dow { font-size: 10px; font-weight: 700; text-align: center; color: #b09070; padding: 3px 0 7px; text-transform: uppercase; letter-spacing: .05em; }
.bcp-dow.we { color: #c9a030; }
.bcp-day { border-radius: 6px; padding: 4px 2px 3px; text-align: center; cursor: pointer; min-height: 40px; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: background .12s; }
.bcp-day:hover:not(.past):not(.closed):not(.empty) { background: #f5ede0; }
.bcp-day.empty { cursor: default; }
.bcp-day.past { cursor: default; opacity: .28; }
.bcp-day.closed { cursor: default; opacity: .22; text-decoration: line-through; }
.bcp-day.today .bcp-num { color: var(--gold); font-weight: 800; }
.bcp-day.we .bcp-num { color: #b07820; }
.bcp-day.sel-in, .bcp-day.sel-out { background: #c9a030 !important; border-radius: 6px; }
.bcp-day.sel-in .bcp-num, .bcp-day.sel-out .bcp-num { color: #fff !important; font-weight: 700; }
.bcp-day.sel-in .bcp-price, .bcp-day.sel-out .bcp-price { color: rgba(255,255,255,.8) !important; }
.bcp-day.in-range { background: #fdf5e8; border-radius: 0; }
.bcp-num { font-size: 13px; color: #1a0e00; line-height: 1.2; font-weight: 500; }
.bcp-price { font-size: 9.5px; color: #8a6a40; margin-top: 2px; white-space: nowrap; font-weight: 500; }
.bcp-hint { font-size: 12px; color: #9a7a50; text-align: center; margin-top: 12px; padding-top: 12px; border-top: 1px solid #ede0cc; }
.bcp-total-n { color: #2a1800; font-weight: 700; }
.bcp-total-sum { color: #b07820; font-weight: 800; font-size: 14px; }

/* Календарь как центрированная модалка (каталог/номер) */
.book-cal-backdrop { display: none; position: fixed; inset: 0; background: rgba(12,7,4,.6); z-index: 390; }
.cal-open .book-cal-backdrop { display: block; }
.book-cal-modal {
  position: fixed; left: 50%; top: 50%; right: auto; bottom: auto;
  transform: translate(-50%, -50%);
  width: min(700px, calc(100vw - 24px)); max-height: 88vh; overflow-y: auto; z-index: 400;
}

/* Mobile: один месяц */
@media (max-width: 640px) {
  /* Календарь — центрированная модалка на весь экран, не зависит от бара */
  .book-cal-popup {
    position: fixed;
    left: 10px; right: 10px;
    top: 50%; bottom: auto;
    transform: translateY(-50%);
    width: auto;
    max-height: 88vh; overflow-y: auto;
    padding: 44px 12px 14px;
  }
  .bcp-months { grid-template-columns: 1fr; }
  .bcp-months .bcp-month:last-child { display: none; }
  .bcp-day { min-height: 38px; }
  .bcp-num { font-size: 12px; }
  .bcp-price { font-size: 9px; }
  /* «Гости» — панель над баром, шириной во весь экран, не уезжает за край */
  .book-gdrop {
    position: fixed;
    left: 12px; right: 12px;
    bottom: 200px; top: auto;
    width: auto; min-width: 0;
    z-index: 350;
  }
  /* блюр капсулы теперь на .book-form::before — он не делает капсулу containing-block,
     поэтому fixed-выпадашки остаются привязаны к экрану. Блюр можно держать и на мобиле. */
}

/* при открытом мобильном меню бар бронирования прячем (чтоб не лез поверх) */
body.nav-open .hero-book-bar { display: none; }

/* ФИКС мобильного drawer на скролле: .site-header.scrolled имеет backdrop-filter,
   который делает шапку containing-block для position:fixed → drawer (лежит внутри
   header) после скролла привязывался к шапке и схлопывался. При открытом меню
   снимаем фильтр с шапки — drawer/overlay снова фиксируются к экрану. */
body.nav-open .site-header,
body.nav-open .site-header.scrolled {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Results section */
.book-results-section { background: var(--bg-alt); border-top: 1px solid var(--border); padding: 32px 0; }
.brs-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.brs-head span { font-size: 1.1rem; font-weight: 700; color: var(--cream); font-family: var(--font); }
.brs-head button { background: transparent; border: 1px solid var(--border); border-radius: 50%; width: 28px; height: 28px; color: var(--muted); cursor: pointer; font-size: 14px; }
.brs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.brs-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.brs-img { height: 160px; overflow: hidden; }
.brs-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.brs-card:hover .brs-img img { transform: scale(1.04); }
.brs-body { padding: 16px; }
.brs-name { font-size: 16px; font-weight: 700; color: var(--cream); font-family: var(--font); margin-bottom: 6px; }
.brs-desc { font-size: 13px; color: var(--muted); margin-bottom: 14px; line-height: 1.5; }
.brs-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.brs-price { font-size: 20px; font-weight: 700; color: var(--gold); }
.brs-nights { font-size: 12px; color: var(--muted); }
.brs-loading, .brs-empty { grid-column: 1/-1; text-align: center; color: var(--muted); padding: 32px; font-size: 15px; }

/* ====== USLUGI SECTION (Наши услуги) ====== */
.uslugi-section {
  background: #1C0E09;
  padding: 90px 0 100px;
}
.uslugi-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 46px;
}
.uslugi-head h2 {
  margin: 0;
  max-width: 16ch;
  color: #f4e8d8;
  font-family: var(--font);
  font-size: clamp(1.9rem, 3.4vw, 3rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.01em;
}
.uslugi-tags {
  max-width: 560px;
  text-align: right;
  line-height: 1.9;
}
.uslugi-tag {
  display: inline-block;
  white-space: nowrap;        /* пункт не разрывается посреди фразы */
  margin-left: 20px;          /* промежуток между пунктами */
  color: rgba(232,220,200,.78);
  font-size: .95rem;
  font-weight: 500;
}
.uslugi-tag::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 9px;
  border-radius: 50%;
  background: #f6aa1c;        /* жёлтый кружок-маркер */
  vertical-align: middle;
  position: relative;
  top: -1px;
}

.uslugi-rows {
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.uslugi-row {
  display: flex;
  gap: 34px;
}
.uslugi-card {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  height: clamp(250px, 25vw, 380px);
  border-radius: 28px;
  overflow: hidden;
  background: #2a160c;
  isolation: isolate;
}
.uslugi-card--wide { flex: 1.9 1 0; }
a.uslugi-card { display: block; text-decoration: none; cursor: pointer; }
.uslugi-card img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .45s, filter .45s;
  filter: saturate(.98) contrast(1.02);
}
.uslugi-card:hover img {
  transform: scale(1.04);
  filter: saturate(1.05) contrast(1.04);
}
.uslugi-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(18,9,4,.06) 0%, rgba(18,9,4,.08) 44%, rgba(18,9,4,.78) 100%);
  transition: background .3s;
}
.uslugi-card:hover::after {
  background:
    linear-gradient(180deg, rgba(18,9,4,.02) 0%, rgba(18,9,4,.08) 38%, rgba(18,9,4,.84) 100%);
}
.uslugi-card-name {
  position: absolute;
  bottom: 22px; left: 24px; right: 18px;
  text-align: left;
  z-index: 2;
  color: #fff;
  font-family: var(--font);
  font-size: clamp(1.2rem, 1.5vw, 1.7rem);
  font-weight: 300;
  letter-spacing: .01em;
  line-height: 1.1;
  text-shadow: 0 8px 20px rgba(0,0,0,.52);
}
@media (max-width: 900px) {
  .uslugi-section { padding: 70px 0 76px; }
  .uslugi-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 32px;
  }
  .uslugi-tags { text-align: left; max-width: none; }
  .uslugi-rows { gap: 12px; }
  .uslugi-row { flex-wrap: wrap; gap: 12px; }
  .uslugi-card { flex: 0 0 calc(50% - 6px); height: clamp(180px, 40vw, 260px); }
  .uslugi-card--wide { flex: 0 0 100%; }
}
@media (max-width: 560px) {
  .uslugi-section { padding: 56px 0 60px; }
  .uslugi-card { border-radius: 22px; height: 44vw; }
  .uslugi-card--wide { flex-basis: 100%; height: 54vw; }
  .uslugi-card-name { bottom: 16px; left: 18px; right: 14px; font-size: 1.1rem; }
}

/* ====== AMENITIES SECTION (Удобства) ====== */
.amenities-section {
  background: #1C0E09;
  padding: 84px 0 92px;
}
.amenities-head {
  text-align: center;
  max-width: 980px;
  margin: 0 auto 46px;
}
.amenities-head .eyebrow {
  color: #f6aa1c;
  letter-spacing: .22em;
  margin-bottom: 14px;
  font-weight: 700;
}
.amenities-head h2 {
  color: #f4e8d8;
  font-family: var(--font);
  font-size: clamp(1.85rem, 3vw, 2.7rem);
  font-weight: 800;
  line-height: 1.12;
  margin: 0;
  letter-spacing: 0;
}
.amenities-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  max-width: 1040px;
  margin: 0 auto;
}
.amenity {
  display: grid;
  grid-template-columns: 54px 1fr;
  align-items: center;
  gap: 18px;
  min-height: 118px;
  padding: 18px;
}
.amenity-ico {
  width: 54px;
  height: 54px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f6aa1c;
}
.amenity-ico svg {
  display: block;
  width: 40px;
  height: 40px;
  stroke-width: 1.25;
}
.amenity-text {
  color: #e8dcc8;
  font-size: .98rem;
  line-height: 1.55;
  font-weight: 600;
  margin: 0;
}
@media (max-width: 900px) {
  .amenities-section { padding: 68px 0 74px; }
  .amenities-head { margin-bottom: 34px; }
  .amenities-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .amenities-section { padding: 56px 0 62px; }
  .amenities-head .eyebrow {
    font-size: .68rem;
    letter-spacing: .18em;
  }
  .amenities-head h2 {
    font-size: clamp(1.6rem, 7.5vw, 2.15rem);
  }
  .amenities-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .amenity {
    grid-template-columns: 44px 1fr;
    min-height: 92px;
    padding: 18px;
    gap: 14px;
  }
  .amenity-ico {
    width: 44px;
    height: 44px;
  }
  .amenity-ico svg {
    width: 28px;
    height: 28px;
  }
  .amenity-text {
    font-size: .92rem;
  }
}

/* ====== ABOUT SECTION (История) ====== */
.about-section {
  background: #1C0E09;
  padding: 92px 0 100px;
}
.about-head {
  margin-bottom: clamp(34px, 4vw, 54px);
}
.about-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(42px, 6vw, 86px);
  align-items: center;
}
.about-col {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.about-col-media {
  padding-top: 0;
}
.about-section .eyebrow {
  color: #f6aa1c;
  letter-spacing: .22em;
  font-weight: 700;
  margin-bottom: 10px;
}
.about-section h2 {
  font-family: var(--font);
  font-size: clamp(1.9rem, 3vw, 3rem);
  font-weight: 700;
  color: #f4e8d8;
  line-height: 1.14;
  margin: 0;
  letter-spacing: 0;
}
.about-p {
  color: rgba(216,200,168,.72);
  font-size: clamp(.98rem, 1.15vw, 1.06rem);
  line-height: 1.82;
  margin: 0;
}
.about-photo {
  border-radius: 28px;
  overflow: hidden;
  background: #2a160c;
}
.about-photo img {
  width: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(.98) contrast(1.02);
}
.about-photo-1 img,
.about-photo-2 img { height: 400px; }   /* одинаковая высота фото */
@media (max-width: 900px) {
  .about-section { padding: 70px 0 78px; }
  .about-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }
  .about-col-media {
    display: grid;
    grid-template-columns: 1fr;
  }
  .about-photo-1 img,
  .about-photo-2 img {
    height: auto;
    aspect-ratio: 16 / 10;
  }
  .about-p-2 {
    padding-left: 0;
    border-left: 0;
  }
}
@media (max-width: 560px) {
  .about-section { padding: 58px 0 64px; }
  .about-col { gap: 22px; }
  .about-section .eyebrow {
    font-size: .68rem;
    letter-spacing: .18em;
  }
  .about-section h2 {
    font-size: clamp(1.7rem, 8vw, 2.25rem);
  }
  .about-p {
    font-size: .94rem;
    line-height: 1.68;
  }
  .about-photo { border-radius: 22px; }
  .about-photo-1 img,
  .about-photo-2 img {
    aspect-ratio: 4 / 3;
  }
}

/* ====== REVIEWS SECTION (Отзывы) ====== */
.reviews-section {
  background: #1C0E09;
  padding: 100px 0;
}
.reviews-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}
.reviews-eyebrow {
  display: block;
  color: #f6aa1c;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-size: .72rem;
  font-weight: 700;
  margin-bottom: 12px;
}
.reviews-head h2 {
  font-family: var(--font);
  color: #f4e8d8;
  font-size: clamp(1.75rem, 3vw, 2.65rem);
  line-height: 1.1;
  font-weight: 800;
  margin: 0;
}
.reviews-viewport { overflow: hidden; }
.reviews-track {
  --rg: clamp(18px, 1.6vw, 26px);
  position: relative;            /* offsetLeft карточек считается от трека (целые px) */
  display: flex;
  column-gap: var(--rg);
  transition: transform .5s cubic-bezier(.4,0,.2,1);
  will-change: transform;
}
.review-card {
  flex: 0 0 calc(50% - var(--rg) / 2);   /* два отзыва в ряд */
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 30px 30px 26px;
  border: 1px solid rgba(244,232,216,.16);   /* бледная тонкая обводка */
  border-radius: 22px;
  background: transparent;
}
.review-stars { color: #f6aa1c; letter-spacing: 3px; font-size: 1.2rem; margin-bottom: 18px; }
.review-body {
  color: rgba(232,220,200,.84);
  font-size: clamp(.98rem, 1.1vw, 1.08rem);
  line-height: 1.7;
  margin: 0 0 22px;
  padding: 0;
  border: 0;
  flex: 1;                       /* тянем тело — футер прижат вниз, ровные карточки */
}
.review-foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}
.review-author { display: block; color: #f4e8d8; font-weight: 700; font-size: 1rem; }
.review-author-meta { display: block; color: rgba(232,220,200,.5); font-weight: 500; font-size: .85rem; margin-top: 3px; }
.review-quote {
  flex-shrink: 0;
  width: 74px;
  height: 74px;
  color: rgba(244,232,216,.1);     /* залитая кавычка, очень бледная */
  align-self: flex-end;            /* низ кавычки остаётся на уровне имени */
}
.review-quote svg { display: block; width: 100%; height: 100%; }

/* полоски-индикаторы по центру (активная жёлтая) */
.reviews-bars {
  display: flex;
  justify-content: center;
  gap: 9px;
  margin-top: 30px;
}
.reviews-bar {
  width: 30px;
  height: 4px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(244,232,216,.22);
  cursor: pointer;
  transition: background .25s, width .25s;
}
.reviews-bar:hover { background: rgba(244,232,216,.4); }
.reviews-bar.is-active { background: #f6aa1c; width: 44px; }
.reviews-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.05);   /* почти невидимый фон */
  color: #fff;
  padding: 9px 16px;
  border-radius: var(--radius);
  font-weight: 700;
  text-decoration: none;
  font-size: .95rem;
  transition: background .2s;
}
.reviews-btn:hover { background: rgba(255,255,255,.09); color: #fff; }
.reviews-btn-y { display: block; flex-shrink: 0; width: 32px; height: 32px; }
@media (max-width: 900px) {
  .reviews-section { padding: 60px 0; }
}
@media (max-width: 640px) {
  .reviews-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .review-card { flex-basis: 100%; padding: 24px 22px 22px; }   /* на узких — один в ряд */
  .reviews-head h2 { font-size: clamp(1.55rem, 7vw, 2.05rem); }
  .review-body { font-size: .95rem; line-height: 1.62; }
}

/* ====== STATS SECTION (Цифры) ====== */
.stats-section { background: #1C0E09; padding: 56px 0; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; text-align: center; }
.stat-value { font-family: var(--font); color: #f6aa1c; font-size: 3rem; font-weight: 700; line-height: 1; }
.stat-label { color: rgba(232,220,200,.7); font-size: .9rem; margin-top: 10px; }
@media (max-width: 600px) { .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 34px 16px; } }

/* ====== CONTACTS SECTION (Контакты, главная) ====== */
/* всё заскоуплено под .contacts-section, чтобы стили страницы /kontakty не текли сюда */
.contacts-section { background: #1C0E09; padding: 120px 0; }
.contacts-section .contacts-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.45fr);
  gap: clamp(24px, 3vw, 48px);
  align-items: stretch;
}
.contacts-section .contacts-info {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.contacts-section .contacts-h2 {
  text-align: left;
  font-size: clamp(1.9rem, 3vw, 2.7rem);
  color: #f4e8d8;
  font-weight: 800;
  margin: 0 0 24px;
}
.contacts-section .contacts-phones { display: flex; flex-direction: column; gap: 14px; }
.contacts-section .contacts-phone {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  width: fit-content;
  color: #f4e8d8;
  font-size: 1.55rem;
  font-weight: 700;
  transition: color .2s;
}
.contacts-section .contacts-phone svg { width: 27px; height: 27px; color: #f6aa1c; flex-shrink: 0; }
.contacts-section .contacts-phone:hover { color: #f6aa1c; }
.contacts-section .contacts-phone-lbl {
  font-size: .9rem;
  font-weight: 500;
  color: rgba(232,220,200,.5);
  letter-spacing: .02em;
}
.contacts-section .contacts-addr {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: rgba(232,220,200,.85);
  font-size: 1.18rem;
  margin: 0;
}
.contacts-section .contacts-addr svg { width: 25px; height: 25px; color: #f6aa1c; flex-shrink: 0; margin-top: 3px; }
.contacts-section .contacts-msgs { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.contacts-section .contacts-msg {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  padding: 13px 22px 13px 16px;
  border-radius: 14px;
  color: #f4e8d8;
  font-size: 1.12rem;
  font-weight: 600;
  transition: background .2s, transform .2s;
}
.contacts-section .contacts-msg svg { width: 34px; height: 34px; flex-shrink: 0; }
.contacts-section .contacts-msg:hover { transform: translateY(-1px); color: #f4e8d8; }
.contacts-section .contacts-msg--wa     { background: rgba(37,211,102,.12); }
.contacts-section .contacts-msg--wa:hover { background: rgba(37,211,102,.22); }
.contacts-section .contacts-msg--wa svg { color: #25D366; }
.contacts-section .contacts-msg--tg     { background: rgba(34,158,217,.12); }
.contacts-section .contacts-msg--tg:hover { background: rgba(34,158,217,.22); }
.contacts-section .contacts-msg--tg svg { color: #229ED9; }
.contacts-section .contacts-msg--max     { background: rgba(94,68,255,.12); }
.contacts-section .contacts-msg--max:hover { background: rgba(94,68,255,.22); }
.contacts-section .contacts-msg--max svg { border-radius: 9px; }
.contacts-section .contacts-mapwrap { display: flex; }
.contacts-section .contacts-map {
  width: 100%;
  min-height: 420px;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
}
.contacts-section .contacts-map iframe { display: block; width: 100%; height: 100%; min-height: 420px; border: 0;
  filter: invert(1) hue-rotate(180deg) brightness(.95) contrast(.9); /* грубая «тёмная» карта через инверсию (пробный вариант) */ }
@media (max-width: 860px) {
  .contacts-section { padding: 70px 0; }
  .contacts-section .contacts-layout { grid-template-columns: 1fr; gap: 22px; }
  .contacts-section .contacts-map, .contacts-section .contacts-map iframe { min-height: 320px; }
}

/* подсветка бара бронирования при клике CTA в шапке */
.hero-book-bar.flash .book-form { animation: bookBarFlash 1s ease; }
@keyframes bookBarFlash {
  0%, 100% { box-shadow: 0 14px 40px rgba(0,0,0,.3); }
  25%, 60% { box-shadow: 0 14px 40px rgba(0,0,0,.3), 0 0 0 3px rgba(34,9,1,.7) inset; }
}

/* =============================================================
   ROOMS — выдача (/rooms) и карточка номера (/rooms/{slug})
   ============================================================= */
.rooms-page, .room-page { padding: 48px 0 72px; }
.crumbs { font-size: .82rem; color: var(--muted); margin-bottom: 14px; }
.crumbs a { color: var(--muted); }
.crumbs a:hover { color: var(--gold); }
.crumbs span { margin: 0 6px; opacity: .5; }
/* Компактные крошки карточки номера */
.crumbs-tight { font-size: .74rem; margin-bottom: 10px; }
.crumbs-tight span { margin: 0 5px; }
/* Заголовок над фото — плотнее */
.room-head .room-title { margin-bottom: 28px; }

.rooms-h1 { font-size: clamp(1.9rem, 3vw, 2.7rem); line-height: 1.1; margin: 6px 0 26px; color: #f3e9dd; }
.rooms-sub { color: var(--muted); margin-bottom: 24px; }
/* Крошки на странице номеров — золотом; отступ над виджетом Контура (.kbw) */
.rooms-page .crumbs a { color: var(--gold); }
.kbw { margin-top: 18px; }

/* ===== Каталог: контраст по-страничному (фон темнее, карточки выходят вперёд) ===== */
.rooms-page { background: #1C0E09; }

/* Панель поиска */
.search-panel {
  display: grid; grid-template-columns: 1.2fr 1.2fr auto auto auto; gap: 14px; align-items: end;
  background: #2e1a10; border: 1px solid rgba(201,163,94,.20); border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.4); padding: 18px; margin-bottom: 22px;
}
.sp-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.sp-label { font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; color: var(--gold); font-weight: 700; }
.sp-input {
  background: #150a05; border: 1px solid rgba(201,163,94,.28); border-radius: 10px;
  padding: 12px 14px; color: var(--cream); font-family: inherit; font-size: .95rem; text-align: left;
}
.sp-date { cursor: pointer; min-width: 130px; }
.sp-date:hover { border-color: rgba(201,163,94,.55); }
.sp-input:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; border-color: var(--gold); }
.sp-ph { color: var(--muted); }
.sp-step {
  display: inline-flex; align-items: center; gap: 4px; background: #150a05;
  border: 1px solid rgba(201,163,94,.28); border-radius: 10px; padding: 5px 6px;
}
.sp-step button {
  width: 32px; height: 32px; border-radius: 8px; border: none; background: rgba(201,163,94,.12);
  color: var(--cream); font-size: 20px; line-height: 1; cursor: pointer; transition: background .15s;
}
.sp-step button:hover:not(:disabled) { background: rgba(201,163,94,.28); }
.sp-step button:disabled { opacity: .28; cursor: not-allowed; }
.sp-step.is-off { opacity: .55; }
.sp-step span { min-width: 26px; text-align: center; font-weight: 700; color: var(--cream); }
.rb-field-note { font-size: .68rem; color: var(--muted); margin-top: 4px; }
.sp-submit { padding: 13px 30px; align-self: end; height: 46px; }

/* Панель поиска /rooms = тот же .book-form, что нижний бар брони на главной.
   Отличия: инлайн (не fixed), отступ снизу, более плотный жёлтый (под баром на главной — блюр героя,
   тут тёмный фон страницы), и выпадашка гостей открывается ВНИЗ (панель вверху страницы). */
.rooms-search { margin-bottom: 22px; }
.rooms-search::before { background: rgba(246,170,28,.95); -webkit-backdrop-filter: none; backdrop-filter: none; }
/* десктоп: выпадашка гостей открывается ВНИЗ (панель вверху страницы); на мобиле — барное fixed-поведение */
@media (min-width: 601px) {
  .rooms-gdrop { bottom: auto; top: calc(100% + 6px); }
}

/* Строка результата */
.search-state {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin-bottom: 24px; font-size: .9rem; color: var(--muted);
}
.ss-avail { font-weight: 700; }
.ss-avail.ok { color: #9fd49f; }
.ss-avail.no { color: var(--accent); }
.ss-dates { color: var(--text); }
.ss-reset { color: var(--gold); margin-left: auto; border-bottom: 1px dashed rgba(201,163,94,.5); }
.ss-reset:hover { color: var(--cream); }

.rooms-empty { color: var(--muted); padding: 40px 0; font-size: 1.02rem; }
.rooms-empty .ss-reset { margin-left: 10px; }

/* Грид карточек */
.rooms-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.room-card {
  display: flex; flex-direction: column; background: #2e1a10;
  border: 1px solid transparent; border-radius: 24px; overflow: hidden;
  transition: transform .2s, border-color .2s;
}
.room-card:hover { transform: translateY(-4px); border-color: #f6aa1c; }
.room-card-img { position: relative; display: block; aspect-ratio: 4/3; overflow: hidden; background: #150a05; }
.room-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.room-card:hover .room-card-img img { transform: scale(1.05); }
.room-card-noimg { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--muted); font-size: .85rem; }
.room-card-badge {
  position: absolute; top: 10px; left: 10px; background: rgba(218,60,60,.92);
  color: #fff; font-size: .72rem; font-weight: 700; padding: 4px 11px; border-radius: 20px;
}
.room-card-body { padding: 18px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.room-card-name { font-size: 1.18rem; font-weight: 600; color: var(--cream); }
.room-card:hover .room-card-name { color: #f6aa1c; }
.room-card-meta { display: flex; gap: 14px; font-size: .82rem; color: #f6aa1c; }
.room-card-desc { font-size: .88rem; color: var(--text); opacity: .85; }
.room-card-bottom { margin-top: auto; display: flex; flex-direction: column; gap: 12px; }
.room-card-amen { display: flex; align-items: center; gap: 8px; }
.rca-ico { width: 30px; height: 30px; padding: 6px; border-radius: 9px; color: #f6aa1c;
  background: #1C0E09; border: none; display: inline-flex; }
.rca-ico svg { width: 100%; height: 100%; }
.rca-more { font-size: .8rem; color: var(--gold); font-weight: 700; align-self: center; }
.room-card-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px;
  padding-top: 12px; border-top: 1px solid rgba(201,163,94,.14); }
.room-card-price strong { display: block; color: #f6aa1c; font-size: 1.2rem; font-weight: 700; }
.room-card-price small { font-size: .72rem; color: var(--muted); }
.room-card-more { font-size: .82rem; color: var(--cream); white-space: nowrap; }
.room-card:hover .room-card-more { color: #f6aa1c; }

/* Адаптив панели поиска */
@media (max-width: 900px) {
  .search-panel { grid-template-columns: 1fr 1fr; }
  .sp-submit { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .search-panel { grid-template-columns: 1fr 1fr; gap: 12px; padding: 14px; }
  .search-panel .sp-field:nth-child(1), .search-panel .sp-field:nth-child(2) { grid-column: span 1; }
}

/* ===== Страница номера (контраст по-страничному) ===== */
.room-page { background: #1C0E09; }
.room-layout {
  display: grid; grid-template-columns: 1fr 420px; gap: 0 36px; align-items: start;
  grid-template-areas: "head head" "gallery book" "main book";
}
.room-head { grid-area: head; }
.room-gallery { grid-area: gallery; margin-bottom: 26px; }
.room-main { grid-area: main; }
.room-book { grid-area: book; }
.rg-main { aspect-ratio: 16/10; border-radius: 30px; overflow: hidden; background: #150a05; border: none; position: relative; }
.rg-main img { width: 100%; height: 100%; object-fit: cover; }
/* Кроссфейд: новый кадр проявляется поверх старого */
.rg-main .rg-fade { position: absolute; inset: 0; opacity: 0; transition: opacity .55s ease; }
.rg-main .rg-fade.show { opacity: 1; }
.rg-thumbs-row { position: relative; margin-top: 12px; }
.rg-thumbs { display: flex; gap: 10px; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; -ms-overflow-style: none; }
.rg-thumbs::-webkit-scrollbar { display: none; }
.rg-thumb { flex: 0 0 calc((100% - 30px) / 4); aspect-ratio: 5 / 2; border-radius: 12px; overflow: hidden; border: 2px solid transparent; padding: 0; cursor: pointer; background: none; }
.rg-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 38px; height: 38px; border-radius: 50%;
  background: #f6aa1c; border: none; color: #1C0E09;
  display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 3;
  box-shadow: 0 4px 14px rgba(0,0,0,.4);
  transition: background .2s, transform .2s;
}
.rg-nav:hover { background: #ffb733; transform: translateY(-50%) scale(1.08); }
.rg-nav svg { width: 19px; height: 19px; }
.rg-prev { left: 6px; }
.rg-next { right: 6px; }
.rg-thumb.active { border-color: #f6aa1c; }
.rg-thumb img { width: 100%; height: 100%; object-fit: cover; }
.room-title { font-size: 2rem; margin-bottom: 14px; color: var(--cream); }
.room-facts { display: flex; gap: 20px; flex-wrap: wrap; align-items: center; color: var(--cream); font-size: 1.08rem; font-weight: 600; margin-bottom: 28px; }
.room-fact { display: inline-flex; align-items: center; gap: 11px; background: transparent; border: none; padding: 0; }
.rf-ico { width: 42px; height: 42px; flex-shrink: 0; border-radius: 12px; background: #150A06; color: #f6aa1c; display: inline-flex; align-items: center; justify-content: center; }
.rf-ico svg { width: 22px; height: 22px; }
/* Контент под фото — отдельные тёмные контейнеры (описание / удобства) с отступом между ними */
.room-block { background: #150A06; border-radius: 22px; padding: 34px 36px; margin-bottom: 16px; box-shadow: none; border: none; }
.room-block:last-child { margin-bottom: 0; }
.room-desc { color: var(--text); line-height: 1.85; margin: 0; }
.room-h2 { font-size: 1.5rem; margin: 0 0 18px; color: var(--cream); }
.room-amenities { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 18px; }
.room-amenity { display: flex; align-items: center; gap: 10px; font-size: .84rem; line-height: 1.3; color: var(--text);
  background: transparent; border: none; padding: 6px 0; }
.ra-ico { width: 26px; height: 26px; flex-shrink: 0; color: #f6aa1c; display: inline-flex; }
.ra-ico svg { width: 100%; height: 100%; }

/* ===== Карточка брони (герой страницы) ===== */
.room-book { position: sticky; top: calc(var(--hdr-h) + 16px); }
.room-book-box {
  position: relative; background: #2e1a10;
  border: 1px solid rgba(246,170,28,.7); border-radius: 30px; padding: 34px;
  overflow: hidden;
}
.room-book-box::before { display: none; }
/* Больше воздуха внутри панели брони */
.room-book-box .rb-field { gap: 9px; }
.room-book-box .rb-fields { gap: 20px; }
.room-book-box .sp-input { padding: 16px 18px; }
.room-book-box .sp-step { padding: 9px 9px; }
.room-book-box .rb-price { margin-bottom: 26px; padding-bottom: 24px; }
.room-book-box .rb-form { gap: 15px; margin-top: 26px; padding-top: 26px; }
.room-book-box .rb-form input,
.room-book-box .rb-form textarea { padding: 15px 16px; }
.room-book-box .rb-avail { margin-top: 22px; padding: 15px 16px; }
/* Поля панели брони — без обводки в покое, ховер дат оставляем */
.room-book-box .sp-input,
.room-book-box .sp-step,
.room-book-box .rb-form input,
.room-book-box .rb-form textarea { border-color: transparent; }
.room-book-box .sp-date:hover { border-color: rgba(201,163,94,.55); }

.rb-price { margin-bottom: 22px; padding-bottom: 20px; border-bottom: 1px solid rgba(201,163,94,.16); }
.rb-price strong { font-size: 1.8rem; color: #f6aa1c; font-weight: 800; }
.rb-price .rb-from { font-size: .8em; font-weight: 400; color: #f6aa1c; margin-left: 0; }
.rb-price span { color: var(--muted); margin-left: 7px; font-size: .95rem; }
.rb-price small { display: block; color: var(--muted); font-size: .76rem; margin-top: 2px; }

.rb-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.rb-field { display: flex; flex-direction: column; gap: 6px; }
.rb-label { font-size: .66rem; text-transform: uppercase; letter-spacing: .1em; color: var(--gold); font-weight: 700; }
.rb-field .sp-input { width: 100%; }
.rb-field .sp-step { justify-content: space-between; }

.rb-avail { margin-top: 14px; padding: 10px 14px; border-radius: 10px; font-size: .9rem; font-weight: 700; text-align: center; }
.rb-avail.ok   { color: #9fd49f; background: rgba(120,180,120,.12); border: 1px solid rgba(120,180,120,.30); }
.rb-avail.no   { color: #f1a08a; background: rgba(218,60,60,.12);  border: 1px solid rgba(218,60,60,.30); }
.rb-avail.warn { color: #e8c98a; background: rgba(201,163,94,.10); border: 1px solid rgba(201,163,94,.28); }
.rb-avail.load { color: var(--muted); background: rgba(255,255,255,.04); }

.rb-form[hidden], .rb-avail[hidden] { display: none !important; }
.rb-form { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(201,163,94,.16); }
.rb-form input, .rb-form textarea {
  background: #150a05; border: 1px solid rgba(201,163,94,.26); border-radius: 10px;
  padding: 11px 13px; color: var(--cream); font-family: inherit; font-size: .92rem; width: 100%;
}
.rb-form input::placeholder, .rb-form textarea::placeholder { color: var(--muted); }
.rb-form input:focus-visible, .rb-form textarea:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; border-color: var(--gold); }
.rb-submit { width: 100%; margin-top: 2px; }
.rb-agree { font-size: .72rem; color: var(--muted); text-align: center; margin: 2px 0 0; }
.rb-note { font-size: .86rem; color: var(--muted); margin-top: 14px; text-align: center; }

.rb-success { background: rgba(120,180,120,.14); border: 1px solid rgba(120,180,120,.4); border-radius: 12px; padding: 14px; margin-bottom: 16px; }
.rb-success strong { color: #9fd49f; display: block; margin-bottom: 4px; }
.rb-success p { font-size: .85rem; color: var(--text); margin: 0; }
.rb-error { background: rgba(218,60,60,.12); border: 1px solid rgba(218,60,60,.4); border-radius: 12px;
  padding: 12px 14px; margin-bottom: 16px; font-size: .86rem; color: #f1a08a; }
.rb-form-err { margin: 0; font-size: .82rem; color: #f1a08a; text-align: center; }
.rb-form-err[hidden] { display: none; }

/* Подсветка виджета брони по клику «Забронировать» в шапке (не на главной) */
@keyframes ctaFlash { 0% { box-shadow: 0 0 0 0 rgba(214,179,109,.65); } 100% { box-shadow: 0 0 0 16px rgba(214,179,109,0); } }
.cta-flash { animation: ctaFlash 1s ease-out 2; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
  .room-card:hover { transform: none; }
  .room-card:hover .room-card-img img { transform: none; }
}
.bcp-loading { text-align: center; padding: 20px; color: rgba(0,0,0,.35); }

@media (max-width: 860px) {
  .room-layout { grid-template-columns: 1fr; grid-template-areas: "head" "gallery" "book" "main"; }
  .room-page { padding: 22px 0 64px; }
  .room-block { padding: 24px; }
  .room-amenities { grid-template-columns: repeat(2, 1fr); }
  .room-head .room-title { font-size: 1.5rem; margin-bottom: 12px; }
  /* Бронь — обычным блоком в потоке, сразу под галереей */
  .room-book { position: static; margin: 4px 0 18px; }
  /* Превью галереи на мобиле — вдвое выше (5/2 → 5/4) */
  .rg-thumb { aspect-ratio: 5 / 4; }
}

/* =============================================================
   FIX: внутренние страницы — отступ под фикс-шапку + плотная шапка
   ============================================================= */
body:not([data-page="home"]) main { padding-top: calc(var(--hdr-h) + 28px); }
body:not([data-page="home"]) .header-row {
  background: rgba(28,14,9,.85);
}

/* FIX: мостик под выпадашкой — hover не рвётся на зазоре trigger→меню */
.nav-item.has-drop::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  height: 10px;
}

/* Предупреждение на поле даты, если не выбрано (всплывает над полем) */
.book-field { position: relative; }
.book-warn {
  display: none;
  position: absolute;
  bottom: calc(100% + 9px);
  left: 0;
  background: #3a1d14;
  color: #ffd9c2;
  border: 1px solid #d9785a;
  font-size: 11.5px;
  font-weight: 600;
  padding: 6px 11px;
  border-radius: 8px;
  white-space: nowrap;
  box-shadow: 0 8px 22px rgba(0,0,0,.4);
  z-index: 60;
}
.book-warn::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 18px;
  border: 5px solid transparent;
  border-top-color: #d9785a;
}
.book-field-warn .book-warn { display: block; }
.book-field-warn .book-date-inp { border-color: #d9785a !important; }

/* ====== MAP SECTION (Как проехать) ====== */
/* «Как проехать» — раскладка как у «Контактов»: слева заголовок+SVG+адрес, справа карта */
.map-section { background: var(--bg); padding: 120px 0; }
.map-section .map-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.55fr) minmax(0, 1.9fr);
  gap: clamp(24px, 3vw, 48px);
  align-items: stretch;
}
.map-section .map-info { display: flex; flex-direction: column; gap: 18px; padding-top: 35px; }
.map-section .map-h2 { text-align: left; font-size: clamp(1.9rem, 3vw, 2.7rem); color: #f4e8d8; font-weight: 800; margin: 0 0 26px; }
.map-section .map-addr-row { display: flex; align-items: center; gap: 20px; }
.map-section .map-marker { flex-shrink: 0; line-height: 0; }
.map-section .map-marker svg { display: block; width: 52px; height: auto; }
.map-section .map-addr { color: rgba(232,220,200,.92); font-size: 1.5rem; font-weight: 400; line-height: 1.35; margin: 0; }
.map-section .map-addr span { display: block; }
.map-section .map-mapwrap { display: flex; }
.map-section .map-frame { width: 100%; min-height: 420px; height: 100%; border-radius: 20px; overflow: hidden; border: 0; }
.map-section .map-frame iframe { display: block; width: 100%; height: 100%; min-height: 420px; border: 0;
  filter: invert(1) hue-rotate(180deg) brightness(.95) contrast(.9); /* тёмная карта, как в контактах */ }
@media (max-width: 860px) {
  .map-section { padding: 70px 0; }
  .map-section .map-layout { grid-template-columns: 1fr; gap: 22px; }
  .map-section .map-info { padding-top: 0; }
  .map-section .map-marker svg { width: 40px; }
  .map-section .map-addr { font-size: 1.2rem; }
  .map-section .map-frame, .map-section .map-frame iframe { min-height: 320px; }
}

/* Footer: колонка «Оцените нас» */
.foot-rate {
  display: flex;
  gap: 10px;
  align-items: center;
  width: fit-content;
  padding: 7px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.04);
}
.foot-rate-y { background: #fc3f1d; color: #fff; width: 30px; height: 30px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-weight: 800; flex-shrink: 0; }
.foot-rate-body { min-width: 0; }
.foot-rate-top { display: flex; align-items: center; gap: 8px; }
.foot-rate-val { color: var(--cream); font-weight: 700; }
.foot-rate-stars { color: #f6aa1c; font-size: 1rem; letter-spacing: 1px; }
.foot-rate-cap { color: var(--muted); font-size: .54rem; margin-top: 0; }
.foot-org { display: flex; flex-direction: column; gap: 3px; color: var(--muted); font-size: .82rem; line-height: 1.5; }
.foot-org-title { color: var(--cream); font-weight: 600; }

/* ============================================================
   КОНТАКТЫ / обычные страницы
   ============================================================ */
.contacts-page, .page-default { background: #1C0E09; padding: 26px 0 64px; }
/* Страница контактов = та же секция, что на главной (крошки сверху, без двойного паддинга) */
.contacts-page--like-section .contacts-section { padding: 62px 0 0; background: transparent; }
@media (max-width: 860px) { .contacts-page--like-section .contacts-section { padding-top: 14px; } }
/* /kontakty — на десктопе больше воздуха под контентом (+50px к базовым 64) */
@media (min-width: 861px) { .contacts-page { padding-bottom: 114px; } }
.container--narrow { max-width: 820px; }

.contacts-h1, .page-title { font-size: 2rem; color: var(--cream); margin: 4px 0 24px; }

.contacts-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 32px; align-items: start; }
.contacts-info { display: flex; flex-direction: column; gap: 18px; }

.ct-cards { display: flex; flex-direction: column; gap: 12px; }
.ct-card {
  display: flex; align-items: center; gap: 14px; padding: 16px 18px;
  background: #2e1a10; border: 1px solid rgba(201,163,94,.18); border-radius: 14px;
  box-shadow: 0 8px 24px rgba(0,0,0,.35); transition: transform .18s, border-color .18s;
}
a.ct-card:hover { transform: translateY(-2px); border-color: rgba(201,163,94,.5); }
.ct-card--static { cursor: default; }
.ct-ico { width: 44px; height: 44px; flex-shrink: 0; padding: 11px; border-radius: 12px;
  color: var(--gold); background: rgba(201,163,94,.10); border: 1px solid rgba(201,163,94,.20); }
.ct-ico svg { width: 100%; height: 100%; display: block; }
.ct-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ct-label { font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; color: var(--gold); font-weight: 700; }
.ct-val { font-size: 1.1rem; color: var(--cream); font-weight: 600; line-height: 1.25; }

.ct-mess { display: flex; gap: 12px; flex-wrap: wrap; }
.ct-btn { display: inline-flex; align-items: center; gap: 9px; padding: 12px 22px; border-radius: 12px;
  font-weight: 700; font-size: .95rem; color: #fff; transition: filter .15s, transform .15s; }
.ct-btn svg { width: 20px; height: 20px; }
.ct-btn:hover { filter: brightness(1.08); transform: translateY(-2px); }
.ct-wa { background: #25925a; }
.ct-tg { background: #2f9bd6; }

.ct-req { font-size: .82rem; color: var(--muted); margin: 4px 0 0; }

.contacts-map { min-height: 480px; height: 100%; border-radius: 16px; overflow: hidden; }
.contacts-map iframe { display: block; width: 100%; height: 100%; min-height: 480px; border: 0; }

/* Обычная страница (юр-тексты и т.п.) */
.page-content { color: var(--text); line-height: 1.8; }
.page-content h2 { color: var(--cream); font-size: 1.4rem; margin: 28px 0 12px; }
.page-content h3 { color: var(--cream); font-size: 1.15rem; margin: 22px 0 10px; }
.page-content p { margin: 0 0 14px; }
.page-content a { color: var(--gold); border-bottom: 1px solid rgba(201,163,94,.4); }
.page-content ul, .page-content ol { margin: 0 0 14px; padding-left: 22px; }
.page-content li { margin-bottom: 7px; }

@media (max-width: 860px) {
  .contacts-grid { grid-template-columns: 1fr; gap: 22px; }
  .contacts-map, .contacts-map iframe { min-height: 340px; }
  .contacts-h1, .page-title { font-size: 1.6rem; }
}

/* ====== Страница услуги (баня/беседка/чан) ====== */
.service-page { background: #1C0E09; padding: 26px 0 64px; }
.service-cta { text-align: center; }
.sc-title { color: var(--gold); font-weight: 700; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; margin: 0 0 14px; }
.sc-call { display: block; width: 100%; font-size: 1.05rem; margin-bottom: 10px; }
.sc-msgs { display: flex; gap: 10px; margin: 12px 0 14px; }
.sc-msg {
  flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 12px; border-radius: 12px; color: var(--cream); font-size: .92rem; font-weight: 600;
  transition: background .2s;
}
.sc-msg svg { width: 22px; height: 22px; flex-shrink: 0; }
.sc-msg:hover { color: var(--cream); }
.sc-msg--wa  { background: rgba(37,211,102,.14); }
.sc-msg--wa:hover  { background: rgba(37,211,102,.24); }
.sc-msg--max { background: rgba(94,68,255,.26); }
.sc-msg--max:hover { background: rgba(94,68,255,.36); }
.sc-msg--max svg { border-radius: 7px; }
.service-cta .rb-agree { margin: 0; }

/* Прайс-таблица в контенте услуги/страницы */
.price-table { width: 100%; border-collapse: collapse; margin: 0 0 18px; }
.price-table td { padding: 11px 0; border-bottom: 1px solid rgba(201,163,94,.14); color: var(--text); font-size: .95rem; }
.price-table tr:last-child td { border-bottom: none; }
.price-table td:last-child { text-align: right; color: var(--gold); font-weight: 700; white-space: nowrap; }
.price-note { color: var(--muted); font-size: .85rem; margin: -6px 0 18px; }

/* Детальная услуга — контент (описание + характеристики) в тёмном контейнере, списки с иконками */
.service-content { background: #150A06; border-radius: 24px; padding: 34px 36px; }
.service-content > :first-child { margin-top: 0; }
.service-content > :last-child { margin-bottom: 0; }
.service-content ul { list-style: none; padding-left: 0; margin: 0 0 6px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 24px; }
.service-content li { display: flex; align-items: flex-start; gap: 11px; margin: 0; line-height: 1.3; }
.service-content .li-ico { width: 26px; height: 26px; flex-shrink: 0; color: #f6aa1c; display: inline-flex; margin-top: 1px; }
.service-content .li-ico svg { width: 100%; height: 100%; }
.service-content .li-txt { flex: 1; }
/* больше воздуха между разделами (H2-секциями) */
.service-content h2 { margin-top: 42px; }
.service-content h2:first-child { margin-top: 0; }
.service-content h2:has(+ ul) { margin-bottom: 22px; }  /* больше воздуха под заголовком секции с иконками */
@media (max-width: 900px) { .service-content ul { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .service-content { padding: 22px; } .service-content ul { grid-template-columns: 1fr; } }

/* Кликабельная карточка рейтинга в футере */
a.foot-rate { transition: opacity .15s; }
a.foot-rate:hover { opacity: .8; }

/* ====== VIDEO SECTION ====== */
.video-frame {
  display: block; position: relative; width: 100%; max-width: 880px;
  margin: 0 auto; padding: 0; border: 1px solid var(--border);
  border-radius: var(--radius); overflow: hidden; cursor: pointer;
  background: var(--bg-card); aspect-ratio: 16 / 9;
  box-shadow: 0 8px 24px rgba(0,0,0,.35); transition: border-color .2s, transform .2s, box-shadow .2s;
}
.video-frame:hover { border-color: rgba(201,169,110,.45); transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0,0,0,.45); }
.video-frame img { display: block; width: 100%; height: 100%; object-fit: cover; }
.video-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.35)); }
.video-play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2;
  width: 76px; height: 76px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: rgba(35,20,13,.72); color: var(--gold); border: 2px solid var(--gold);
  padding-left: 4px; transition: background .2s, transform .2s;
}
.video-frame:hover .video-play { background: var(--gold); color: var(--bg); transform: translate(-50%,-50%) scale(1.06); }
.video-play svg { display: block; }

/* модалка видео */
body.video-modal-open { overflow: hidden; }
.video-modal[hidden] { display: none; }
.video-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 24px; }
.video-modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.82); }
.video-modal-body {
  position: relative; z-index: 1; width: 100%; max-width: 960px; aspect-ratio: 16 / 9;
  background: #000; border-radius: var(--radius); overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.6);
}
.video-modal-slot { width: 100%; height: 100%; }
.video-modal-slot video { display: block; width: 100%; height: 100%; }
.video-modal-close {
  position: absolute; top: -44px; right: 0; z-index: 2; width: 36px; height: 36px; line-height: 1;
  font-size: 28px; color: var(--cream); background: none; border: none; cursor: pointer; opacity: .85;
}
.video-modal-close:hover { opacity: 1; color: var(--gold); }
@media (max-width: 600px) {
  .video-play { width: 60px; height: 60px; }
  .video-modal { padding: 12px; }
  .video-modal-close { top: -40px; }
}

/* Кнопку брони в шапке прячем на страницах номера/услуги — там свой блок брони */
body[data-page="room"] .btn-book,
body[data-page="service"] .btn-book,
body[data-page="room"] .drawer-book,
body[data-page="service"] .drawer-book { display: none !important; }

/* ====== Карточка брони на странице номера/услуги (факты внутри, центр кнопки) ====== */
.room-book-box .rb-facts { margin: 0 0 22px; gap: 12px 20px; font-size: 1rem; }
.room-book-box .rb-cta { display: flex; width: 100%; justify-content: center; margin: 0; }
@media (max-width: 860px) {
  .room-book-box { padding: 22px; border-radius: 22px; }
  .room-book-box .rb-price { margin-bottom: 14px; padding-bottom: 14px; }
  .room-book-box .rb-price strong { font-size: 1.55rem; }
  .room-book-box .rb-facts { margin-bottom: 16px; gap: 9px 16px; font-size: .92rem; }
  .room-book-box .rb-cta { width: 100%; }
}

/* Нерабочий (отключённый) пункт меню — тот же вид/цвет, просто не кликается */
.nav-link.is-disabled { cursor: default; pointer-events: none; }