/* ============================================================
   Caramel resort — таплинк / посадочная страница
   Палитра: карамель/янтарь + крем + тёплый коричневый
   ============================================================ */

:root{
  /* ── Палитра по брендбуку: глубокий синий + солнечный оранжевый + золото + бирюза ── */
  --cream:      #FBF6EF;
  --cream-2:    #F4ECDD;
  --caramel:    #D96C1B;   /* деловой бренд-оранжевый (акценты, иконки, кнопки) */
  --caramel-2:  #C05F18;   /* глубже — для градиентов */
  --caramel-lt: #F58840;   /* яркий бренд-оранжевый — на тёмном (hero) */
  --gold:       #FDC755;   /* бренд-золото */
  --blue:       #005C92;   /* бренд-синий (вода) */
  --ink:        #0C3F5E;   /* глубокий синий для заголовков */
  --brown:      #353A3F;   /* основной текст (холодный тёмный) */
  --brown-soft: #5C666E;   /* приглушённый текст */
  --teal:       #2EA7A0;   /* бренд-бирюза (волны) */
  --wa:         #25D366;
  --wa-dark:    #128C4B;
  --white:      #ffffff;
  --shadow-sm:  0 4px 14px rgba(20,46,70,.08);
  --shadow:     0 14px 40px rgba(20,46,70,.14);
  --shadow-lg:  0 24px 60px rgba(20,46,70,.20);
  --radius:     20px;
  --radius-sm:  12px;
  --maxw:       1140px;
  --serif:      'Playfair Display', Georgia, serif;
  --sans:       'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--sans);
  color:var(--brown);
  background:var(--cream);
  line-height:1.6;
  font-size:17px;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:700; line-height:1.15; margin:0 0 .5em; color:var(--ink); }
p{ margin:0 0 1em; }
ul{ margin:0; padding:0; list-style:none; }

.container{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 20px; }

.section{ padding:68px 0; }
.section--alt{ background:var(--cream-2); }

.kicker{
  text-transform:uppercase; letter-spacing:.18em; font-size:.74rem; font-weight:800;
  color:var(--caramel); margin-bottom:.6em;
}
.head{ text-align:center; max-width:680px; margin:0 auto 42px; }
.head h2{ font-size:clamp(1.7rem, 4.5vw, 2.7rem); }
.head__note{ color:var(--brown-soft); font-size:.98rem; }

/* ---------- Кнопки ---------- */
.btn{
  --bg:var(--caramel); --fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  background:var(--bg); color:var(--fg);
  font-family:var(--sans); font-weight:700; font-size:1rem;
  padding:.85em 1.5em; border:none; border-radius:999px; cursor:pointer;
  box-shadow:var(--shadow-sm); transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); box-shadow:var(--shadow); }
.btn:active{ transform:translateY(0); }
.btn .ic{ width:1.15em; height:1.15em; }
.btn--lg{ font-size:1.08rem; padding:1.02em 1.9em; }
.btn--sm{ font-size:.9rem; padding:.62em 1.1em; }
.btn--wa{ --bg:var(--wa); --fg:#063a1e; }
.btn--wa:hover{ background:#1fc15c; }
.btn--ghost{ --bg:transparent; --fg:#fff; box-shadow:none; border:1.5px solid rgba(255,255,255,.7); }
.btn--ghost:hover{ background:rgba(255,255,255,.14); }
.btn--soft{ --bg:#fff; --fg:var(--caramel); border:1.5px solid rgba(185,110,31,.28); }
.btn--soft:hover{ background:#fff8ef; }

/* ---------- Шапка ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  transition:background .25s ease, box-shadow .25s ease, padding .25s ease;
  padding:14px 0;
}
.nav__inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.nav.is-scrolled{ background:rgba(251,246,239,.92); backdrop-filter:blur(10px); box-shadow:var(--shadow-sm); padding:8px 0; }
.brand{ display:inline-flex; align-items:center; gap:10px; }
.brand__mark{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; padding:5px; background:#fff; border-radius:12px; overflow:hidden; box-shadow:var(--shadow-sm); }
.brand__mark img{ width:100%; height:100%; object-fit:contain; display:block; }
.brand__text{ font-family:var(--serif); font-weight:700; font-size:1.45rem; line-height:1; color:#fff; display:flex; flex-direction:column; }
.brand__text small{ font-family:var(--sans); font-weight:700; font-size:.5rem; letter-spacing:.2em; white-space:nowrap; text-transform:uppercase; opacity:.85; margin-top:3px; }
.nav.is-scrolled .brand__text{ color:var(--brown); }
.nav__links{ display:none; gap:26px; }
.nav__links a{ font-weight:600; font-size:.96rem; color:#fff; opacity:.92; transition:opacity .2s; }
.nav__links a:hover{ opacity:1; }
.nav.is-scrolled .nav__links a{ color:var(--brown); }
.nav__right{ display:flex; align-items:center; gap:10px; }
.langsw{ display:inline-flex; align-items:center; gap:2px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.24); border-radius:999px; padding:3px; backdrop-filter:blur(6px); }
.nav.is-scrolled .langsw{ background:rgba(12,63,94,.06); border-color:rgba(12,63,94,.12); }
.langsw__btn{ border:0; background:none; cursor:pointer; font-family:var(--sans); font-size:1.05rem; line-height:1; padding:.28em .42em; border-radius:999px; filter:saturate(1.05); opacity:.72; transition:opacity .2s, background .2s, transform .15s; }
.langsw__btn:hover{ opacity:1; transform:translateY(-1px); }
.nav.is-scrolled .langsw__btn{ color:var(--ink); }
.langsw__btn--main{ opacity:1; outline:2px solid var(--gold); outline-offset:1px; }
.langsw__btn.is-active{ background:#fff; opacity:1; box-shadow:var(--shadow-sm); }
.nav.is-scrolled .langsw__btn.is-active{ background:var(--blue); color:#fff; }
.nav__cta{ box-shadow:var(--shadow); display:none; }
@media (min-width:560px){ .nav__cta{ display:inline-flex; } }

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; color:#fff; overflow:hidden; }
.hero__bg{ position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.05); animation:zoom 18s ease-in-out infinite alternate; }
@keyframes zoom{ to{ transform:scale(1.14); } }
.hero__scrim{ position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(40,25,10,.55) 0%, rgba(40,25,10,.30) 35%, rgba(46,32,20,.78) 100%);
}
.hero__inner{ position:relative; z-index:2; padding-top:96px; padding-bottom:60px; max-width:760px; }
.hero__eyebrow{ text-transform:uppercase; letter-spacing:.26em; font-size:.72rem; font-weight:800; color:var(--caramel-lt); margin-bottom:.7em; }
.hero__title{ font-size:clamp(3.4rem, 13vw, 6.6rem); color:#fff; margin:0 0 .12em; letter-spacing:.5px; text-shadow:0 6px 30px rgba(0,0,0,.3); }
.hero__emblem{ width:clamp(92px, 24vw, 120px); height:auto; display:block; margin:0 0 14px; filter:drop-shadow(0 8px 22px rgba(0,0,0,.4)); }
.hero__brand{ font-family:var(--serif); font-weight:700; color:#fff; line-height:1; margin:0 0 .35em; display:flex; flex-direction:column;
  font-size:clamp(3rem, 11vw, 5.4rem); letter-spacing:.5px; text-shadow:0 6px 30px rgba(0,0,0,.35); }
.hero__brand small{ font-family:var(--sans); font-weight:700; font-size:clamp(.74rem,2.4vw,.96rem); letter-spacing:.34em; text-transform:uppercase; opacity:.95; margin-top:.55em; text-shadow:0 2px 12px rgba(0,0,0,.45); }
.visually-hidden{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.hero__lead{ font-size:clamp(1.15rem, 3.4vw, 1.7rem); font-weight:600; margin-bottom:.4em; }
.hero__lead b{ color:var(--caramel-lt); }
.hero__sub{ font-size:1.02rem; max-width:46ch; color:rgba(255,255,255,.9); margin-bottom:1.7em; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:2em; }

.quick{ display:flex; flex-wrap:wrap; gap:10px 22px; }
.quick a{ display:inline-flex; align-items:center; gap:.55em; font-weight:600; font-size:.92rem; color:#fff; }
.quick__ic{ width:38px; height:38px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.16); backdrop-filter:blur(4px); transition:transform .2s, background .2s; }
.quick a:hover .quick__ic{ transform:translateY(-3px); background:rgba(255,255,255,.28); }
.quick__ic .ic{ width:18px; height:18px; }
.q-wa{ background:rgba(37,211,102,.9); color:#053; }
.q-ig{ background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366); color:#fff; }

.hero__scroll{ position:absolute; left:50%; bottom:22px; transform:translateX(-50%); z-index:2; width:26px; height:42px; border:2px solid rgba(255,255,255,.6); border-radius:14px; }
.hero__scroll span{ position:absolute; left:50%; top:8px; width:4px; height:8px; background:#fff; border-radius:2px; transform:translateX(-50%); animation:scroll 1.6s infinite; }
@keyframes scroll{ 0%{ opacity:0; top:8px; } 40%{ opacity:1; } 80%{ opacity:0; top:22px; } }

/* ---------- Полоса преимуществ ---------- */
.stats{ background:var(--blue); color:#fff; }
.stats__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; padding:26px 20px; }
.stat{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:2px; }
.stat__ic{ font-size:1.6rem; line-height:1; margin-bottom:4px; }
.stat b{ font-size:1.02rem; }
.stat small{ font-size:.8rem; opacity:.85; }

/* ---------- О курорте ---------- */
.about__grid{ display:grid; gap:34px; align-items:center; }
.about__media{ position:relative; }
.about__media img{ width:100%; border-radius:var(--radius); box-shadow:var(--shadow); aspect-ratio:4/3; object-fit:cover; }
.about__badge{ position:absolute; left:16px; bottom:16px; background:#fff; color:var(--caramel); font-weight:800; font-size:.82rem; padding:.5em 1em; border-radius:999px; box-shadow:var(--shadow-sm); }
.about__text h2{ font-size:clamp(1.7rem,4.6vw,2.6rem); }
.ticks{ margin:1.2em 0 1.6em; display:grid; gap:.6em; }
.ticks li{ position:relative; padding-left:1.9em; font-weight:600; }
.ticks li::before{ content:""; position:absolute; left:0; top:.1em; width:1.25em; height:1.25em; border-radius:50%;
  background:var(--wa) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/72% no-repeat; }

/* ---------- Сетки карточек ---------- */
.grid{ display:grid; gap:22px; }
.grid--3{ grid-template-columns:1fr; }
.grid--4{ grid-template-columns:1fr; }

.card{ background:#fff; border-radius:var(--radius); padding:30px 26px; box-shadow:var(--shadow-sm); border:1px solid rgba(185,110,31,.08); transition:transform .2s, box-shadow .2s; }
.card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.card__ic{ display:inline-flex; width:56px; height:56px; border-radius:16px; align-items:center; justify-content:center; background:linear-gradient(135deg,#fbe6c8,#f3cf9c); color:var(--caramel); margin-bottom:16px; }
.card__ic svg{ width:28px; height:28px; }
.card h3{ font-size:1.22rem; margin-bottom:.35em; }
.card p{ color:var(--brown-soft); font-size:.96rem; margin:0; }

/* ---------- Цены ---------- */
.price{ position:relative; background:#fff; border-radius:var(--radius); padding:30px 24px; text-align:center; box-shadow:var(--shadow-sm); border:1px solid rgba(185,110,31,.10); display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s; }
.price:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.price h3{ font-size:1.25rem; margin-bottom:.4em; }
.price__desc{ color:var(--brown-soft); font-size:.92rem; min-height:3em; }
.price__val{ font-size:1.0rem; color:var(--brown-soft); margin:.4em 0 1.1em; }
.price__val b{ font-family:var(--serif); font-size:1.7rem; color:var(--caramel); display:inline; }
.price .btn{ margin-top:auto; width:100%; }
.price--feat{ border:2px solid var(--caramel-lt); box-shadow:var(--shadow); }
.price__tag{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--caramel); color:#fff; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; padding:.42em 1em; border-radius:999px; }
.price__cat{ color:var(--brown-soft); font-size:.86rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; margin:-.1em 0 1em; }
.price__rates{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 1.2em; }
.rate{ background:var(--cream); border:1px solid rgba(185,110,31,.10); border-radius:var(--radius-sm); padding:12px 8px 14px; display:flex; flex-direction:column; align-items:center; gap:1px; }
.rate__when{ font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--caramel); margin-bottom:6px; }
.rate b{ font-family:var(--serif); font-size:1.18rem; color:var(--brown); line-height:1.1; }
.rate small{ font-size:.72rem; color:var(--brown-soft); margin-bottom:5px; }
.rate small:last-child{ margin-bottom:0; }

/* ---------- Услуги на территории ---------- */
.services{ margin-top:30px; background:#fff; border:1px solid rgba(185,110,31,.10); border-radius:var(--radius); padding:26px 24px; box-shadow:var(--shadow-sm); }
.services__title{ font-size:1.2rem; margin-bottom:1em; text-align:center; }
.services__list{ display:grid; grid-template-columns:1fr; gap:10px 28px; }
.services__list li{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; padding-bottom:9px; border-bottom:1px dashed rgba(185,110,31,.20); }
.services__list li span{ font-weight:600; }
.services__list li b{ font-weight:700; color:var(--caramel); white-space:nowrap; }
.services__extra{ margin-top:16px; text-align:center; color:var(--brown-soft); font-size:.92rem; }
.reviews__more{ text-align:center; margin-top:26px; }
.reviews__more a{ color:var(--caramel); font-weight:700; }
.reviews__more a:hover{ text-decoration:underline; }

/* ---------- Лечебная вода ---------- */
.water__grid{ display:grid; gap:30px; align-items:start; }
.water__text p{ color:var(--brown-soft); margin:0 0 1em; }
.water__text b{ color:var(--brown); }
.water__sub{ font-weight:700; color:var(--brown); margin-top:1.2em; }
.water__text .ticks{ margin:.6em 0 1.3em; }
.water__note{ font-size:.9rem; font-style:italic; opacity:.9; border-left:3px solid var(--caramel-lt); padding-left:14px; }
.water__card{ background:#fff; border:1px solid rgba(185,110,31,.12); border-radius:var(--radius); padding:24px 22px; box-shadow:var(--shadow-sm); }
.water__card h3{ font-size:1.15rem; margin-bottom:.7em; }
.water__facts{ display:grid; }
.water__facts li{ display:flex; justify-content:space-between; gap:14px; align-items:baseline; padding:11px 0; border-bottom:1px dashed rgba(185,110,31,.2); }
.water__facts li:last-child{ border-bottom:0; padding-bottom:0; }
.water__facts li span{ color:var(--brown-soft); font-size:.92rem; }
.water__facts li b{ text-align:right; color:var(--brown); font-weight:700; font-size:.95rem; }

/* ---------- FAQ ---------- */
.faq__list{ max-width:820px; margin:0 auto; display:grid; gap:12px; }
.faq__item{ background:#fff; border:1px solid rgba(185,110,31,.12); border-radius:var(--radius-sm); box-shadow:var(--shadow-sm); overflow:hidden; }
.faq__item summary{ cursor:pointer; list-style:none; padding:18px 22px; font-weight:700; color:var(--brown); display:flex; justify-content:space-between; align-items:center; gap:14px; }
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary::after{ content:"+"; font-size:1.5rem; color:var(--caramel); line-height:1; flex:none; transition:transform .2s; }
.faq__item[open] summary::after{ transform:rotate(45deg); }
.faq__item p{ margin:0; padding:0 22px 20px; color:var(--brown-soft); }

/* ---------- Меню ---------- */
.menu__grid{ display:grid; gap:18px; grid-template-columns:1fr; }
.menu__card{ margin:0; }
.menu__card button{ display:block; width:100%; padding:0; border:0; background:none; cursor:pointer; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .2s, box-shadow .2s; }
.menu__card button:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.menu__card img{ width:100%; height:auto; display:block; }
.menu__card figcaption{ margin-top:9px; text-align:center; font-size:.9rem; font-weight:600; color:var(--brown-soft); }
.karaoke{ display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-top:30px; background:#fff; border:1px solid rgba(0,92,146,.12); border-radius:var(--radius); padding:22px 26px; box-shadow:var(--shadow-sm); }
.karaoke__ic{ flex:none; width:60px; height:60px; border-radius:16px; display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#cdeeec,#a7e0db); color:var(--teal); }
.karaoke__ic svg{ width:30px; height:30px; }
.karaoke__text{ flex:1 1 240px; }
.karaoke__text h3{ margin:0 0 .3em; }
.karaoke__text p{ margin:0; color:var(--brown-soft); }
.karaoke .btn{ flex:none; }
@media (min-width:700px){ .menu__grid{ grid-template-columns:1fr 1fr; gap:24px; } }

/* ---------- Галерея ---------- */
.gallery__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.ph{ border:none; padding:0; margin:0; cursor:pointer; border-radius:var(--radius-sm); overflow:hidden; background:#eadfce; box-shadow:var(--shadow-sm); aspect-ratio:1/1; }
.ph img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.ph:hover img{ transform:scale(1.08); }
.ph--big{ grid-column:span 2; aspect-ratio:16/10; }

/* ---------- CTA баннер ---------- */
.cta{ position:relative; color:#fff; text-align:center; overflow:hidden; }
.cta__bg{ position:absolute; inset:0; background-size:cover; background-position:center; }
.cta__scrim{ position:absolute; inset:0; background:linear-gradient(135deg, rgba(217,108,27,.85), rgba(11,61,92,.86)); }
.cta__inner{ position:relative; z-index:2; padding:74px 20px; max-width:640px; }
.cta__inner h2{ color:#fff; font-size:clamp(1.8rem,5vw,2.8rem); }
.cta__inner p{ color:rgba(255,255,255,.92); margin-bottom:1.5em; }

/* ---------- Отзывы ---------- */
.review{ background:#fff; border-radius:var(--radius); padding:28px 26px; box-shadow:var(--shadow-sm); margin:0; border:1px solid rgba(185,110,31,.08); }
.review__stars{ color:#F2A93B; letter-spacing:2px; margin-bottom:.5em; }
.review blockquote{ margin:0 0 .9em; font-size:1.02rem; color:var(--brown); }
.review figcaption{ font-weight:800; color:var(--caramel); }

/* ---------- Как добраться ---------- */
.location__grid{ display:grid; gap:32px; align-items:center; }
.contacts{ display:grid; gap:18px; margin:1.4em 0 1.6em; }
.contacts li{ display:flex; gap:14px; align-items:flex-start; }
.contacts__ic{ flex:none; width:44px; height:44px; border-radius:12px; background:linear-gradient(135deg,#fbe6c8,#f3cf9c); color:var(--caramel); display:inline-flex; align-items:center; justify-content:center; }
.contacts__ic svg{ width:22px; height:22px; }
.contacts b{ color:var(--brown); }
.contacts a{ color:var(--caramel); font-weight:700; }
.location__btns{ display:flex; flex-wrap:wrap; gap:12px; }
.location__map{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.location__map iframe{ width:100%; height:340px; border:0; display:block; }

/* ---------- Подвал ---------- */
.footer{ background:var(--brown); color:#e9ddcd; padding:54px 0 26px; }
.footer__grid{ display:grid; gap:30px; }
.footer .brand--footer .brand__text{ color:#fff; }
.footer__brand p{ color:#c4b4a2; max-width:36ch; margin-top:14px; font-size:.95rem; }
.footer__col h4{ color:#fff; font-family:var(--sans); font-weight:800; font-size:.82rem; text-transform:uppercase; letter-spacing:.12em; margin-bottom:1em; }
.footer__col li{ margin-bottom:.6em; }
.footer__col a{ color:#d8c8b6; transition:color .2s; }
.footer__col a:hover{ color:var(--caramel-lt); }
.footer__bottom{ display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; border-top:1px solid rgba(255,255,255,.12); margin-top:34px; padding-top:20px; font-size:.85rem; color:#b3a18f; }

/* ---------- Плавающая кнопка WhatsApp ---------- */
.fab{ position:fixed; right:18px; bottom:18px; z-index:60; width:58px; height:58px; border-radius:50%; background:var(--wa); color:#fff; display:inline-flex; align-items:center; justify-content:center; box-shadow:0 10px 30px rgba(18,140,75,.45); transition:transform .2s; }
.fab:hover{ transform:scale(1.08); }
.fab svg{ width:30px; height:30px; }
.fab__pulse{ position:absolute; inset:0; border-radius:50%; background:var(--wa); z-index:-1; animation:pulse 2.2s infinite; }
@keyframes pulse{ 0%{ transform:scale(1); opacity:.6; } 70%{ transform:scale(1.7); opacity:0; } 100%{ opacity:0; } }

/* ---------- Лайтбокс ---------- */
.lightbox{ position:fixed; inset:0; z-index:90; background:rgba(20,12,4,.92); display:none; align-items:center; justify-content:center; padding:24px; }
.lightbox.is-open{ display:flex; }
.lightbox__img{ max-width:92vw; max-height:86vh; border-radius:10px; box-shadow:var(--shadow-lg); }
.lightbox__close{ position:absolute; top:16px; right:22px; background:none; border:none; color:#fff; font-size:2.6rem; line-height:1; cursor:pointer; }
.lightbox__nav{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.12); color:#fff; border:none; width:48px; height:48px; border-radius:50%; font-size:1.3rem; cursor:pointer; transition:background .2s; }
.lightbox__nav:hover{ background:rgba(255,255,255,.25); }
.lightbox__prev{ left:14px; }
.lightbox__next{ right:14px; }

/* ---------- Появление при скролле ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.reveal.is-visible{ opacity:1; transform:none; }

/* ============================================================
   Адаптив
   ============================================================ */
@media (min-width:560px){
  .stats__grid{ grid-template-columns:repeat(4,1fr); }
  .grid--4{ grid-template-columns:repeat(2,1fr); }
  .gallery__grid{ grid-template-columns:repeat(3,1fr); }
  .ph--big{ grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
}
@media (min-width:768px){
  body{ font-size:18px; }
  .section{ padding:88px 0; }
  .services__list{ grid-template-columns:repeat(2,1fr); }
  .water__grid{ grid-template-columns:1.45fr 1fr; gap:48px; }
  .grid--3{ grid-template-columns:repeat(3,1fr); }
  .about__grid{ grid-template-columns:1.05fr 1fr; gap:54px; }
  .location__grid{ grid-template-columns:1fr 1.1fr; }
  .footer__grid{ grid-template-columns:1.6fr 1fr 1fr; }
  .footer__brand p{ font-size:1rem; }
  .location__map iframe{ height:420px; }
}
@media (min-width:900px){
  .nav__links{ display:flex; }
  .grid--4{ grid-template-columns:repeat(4,1fr); }
  .fab{ width:64px; height:64px; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* ============================================================
   Калькулятор брони (квиз-модалка)
   ============================================================ */
.bcalc{ position:fixed; inset:0; z-index:95; background:rgba(20,12,4,.92);
  display:none; align-items:flex-start; justify-content:center; padding:24px 16px; overflow-y:auto; }
.bcalc.is-open{ display:flex; }
.bcalc [hidden]{ display:none !important; }   /* .btn/.bc-field задают display и перебили бы атрибут hidden */
.bcalc__dialog{ position:relative; width:100%; max-width:560px; margin:auto;
  background:var(--cream); border-radius:var(--radius); box-shadow:var(--shadow-lg);
  display:flex; flex-direction:column; max-height:calc(100svh - 48px); overflow:hidden;
  animation:bcIn .28s ease; }
@keyframes bcIn{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
.bcalc__close{ position:absolute; top:10px; right:14px; z-index:3; background:none; border:none;
  color:var(--brown-soft); font-size:2.1rem; line-height:1; cursor:pointer; padding:4px 8px; border-radius:8px; }
.bcalc__close:hover{ color:var(--caramel); background:rgba(185,110,31,.08); }

.bcalc__head{ padding:22px 24px 16px; border-bottom:1px solid rgba(185,110,31,.14); background:var(--cream); }
.bcalc__kicker{ margin:0 0 .35em; text-transform:uppercase; letter-spacing:.16em; font-size:.7rem; font-weight:800; color:var(--caramel); }
.bcalc__title{ margin:0 0 .55em; font-size:1.4rem; color:var(--ink); }
.bcalc__progress{ display:flex; gap:6px; margin:0; padding:0; list-style:none; }
.bcalc__progress li{ flex:1; height:5px; border-radius:999px; background:rgba(185,110,31,.18); transition:background .25s; }
.bcalc__progress li.is-done{ background:var(--caramel-lt); }
.bcalc__progress li.is-current{ background:var(--caramel); }

.bcalc__body{ padding:22px 24px; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.bcalc__step{ display:none; }
.bcalc__step.is-active{ display:block; animation:bcStep .25s ease; }
@keyframes bcStep{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

/* ── Поля ── */
.bc-field{ display:block; }
.bc-label{ display:block; font-weight:600; font-size:.92rem; color:var(--brown); margin-bottom:.45em; }
.bc-input{ width:100%; background:#fff; border:1.5px solid rgba(185,110,31,.28); border-radius:var(--radius-sm);
  padding:.72em .9em; font-family:var(--sans); font-size:1rem; color:var(--brown); }
.bc-input:focus{ outline:none; border-color:var(--caramel); box-shadow:0 0 0 3px rgba(217,108,27,.15); }
.bc-hint{ margin:14px 0 0; font-size:.86rem; color:var(--brown-soft); line-height:1.5; }
.bc-dates{ display:grid; gap:14px; }
@media (min-width:480px){ .bc-dates{ grid-template-columns:1fr 1fr; } }
.bc-dates [hidden]{ display:none; }

/* ── Радио-карточки (формат / номер) ── */
.bc-options{ display:grid; gap:12px; }
@media (min-width:480px){ .bc-options--2{ grid-template-columns:1fr 1fr; } }
.bc-card{ position:relative; display:flex; flex-direction:column; gap:3px; cursor:pointer;
  background:#fff; border:1.5px solid rgba(185,110,31,.20); border-radius:var(--radius-sm);
  padding:14px 16px; transition:border-color .18s, box-shadow .18s, background .18s; }
.bc-card:hover{ border-color:var(--caramel-lt); }
.bc-card input{ position:absolute; opacity:0; width:0; height:0; }
.bc-card.is-selected{ border-color:var(--caramel); background:#fff8ef; box-shadow:0 0 0 3px rgba(217,108,27,.12); }
.bc-card:has(input:checked){ border-color:var(--caramel); background:#fff8ef; box-shadow:0 0 0 3px rgba(217,108,27,.12); }
.bc-card__t{ font-weight:700; color:var(--ink); }
.bc-card__d{ font-size:.85rem; color:var(--brown-soft); }
.bc-card__price{ margin-top:4px; font-weight:700; color:var(--caramel); font-size:.92rem; }

/* ── Степперы (гости / часы / кровати) ── */
.bc-counter{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:12px 0; border-bottom:1px dashed rgba(185,110,31,.2); }
.bc-counter:first-child{ padding-top:0; }
.bc-counter__label{ font-weight:600; color:var(--brown); }
.bc-stepper{ display:inline-flex; align-items:center; gap:10px; }
.bc-stepper__btn{ width:36px; height:36px; flex:none; border-radius:50%; border:1.5px solid rgba(185,110,31,.28);
  background:#fff; color:var(--caramel); font-size:1.3rem; line-height:1; cursor:pointer; display:inline-flex;
  align-items:center; justify-content:center; transition:background .15s, border-color .15s; }
.bc-stepper__btn:hover{ background:#fff8ef; border-color:var(--caramel); }
.bc-stepper__btn:disabled{ opacity:.4; cursor:default; }
.bc-stepper__val{ min-width:1.6em; text-align:center; font-weight:700; font-size:1.05rem; color:var(--brown); }

/* ── Возраст детей ── */
.bc-ages{ margin-top:16px; }
.bc-ages__grid{ display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); }
.bc-age{ display:flex; align-items:center; justify-content:space-between; gap:8px;
  background:#fff; border:1.5px solid rgba(185,110,31,.20); border-radius:var(--radius-sm); padding:8px 10px; }
.bc-age span{ font-size:.84rem; color:var(--brown-soft); }
.bc-age select{ border:none; background:none; font-family:var(--sans); font-size:.95rem; font-weight:700; color:var(--brown); cursor:pointer; }
.bc-age select:focus{ outline:none; }

/* ── Доп. услуги ── */
.bc-addons{ display:grid; gap:10px; margin-top:6px; }
.bc-addon{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:#fff; border:1.5px solid rgba(185,110,31,.16); border-radius:var(--radius-sm); padding:12px 14px; }
.bc-addon__main{ display:flex; flex-direction:column; gap:1px; }
.bc-addon__name{ font-weight:700; color:var(--brown); }
.bc-addon__unit{ font-size:.8rem; color:var(--brown-soft); }
.bc-addon__check{ width:24px; height:24px; flex:none; cursor:pointer; accent-color:var(--caramel); }

/* ── Сводка ── */
.bc-summary{ display:grid; gap:0; }
.bc-summary__row{ display:flex; justify-content:space-between; align-items:baseline; gap:14px;
  padding:9px 0; border-bottom:1px dashed rgba(185,110,31,.2); }
.bc-summary__row:first-child{ padding-top:0; }
.bc-summary__k{ color:var(--brown-soft); font-size:.92rem; }
.bc-summary__v{ font-weight:700; color:var(--brown); text-align:right; }
.bc-summary__total{ border-bottom:none; padding-top:14px; margin-top:4px; align-items:center; }
.bc-summary__total .bc-summary__k{ font-weight:800; color:var(--ink); font-size:1rem; }
.bc-summary__total .bc-summary__v{ font-family:var(--serif); font-size:1.7rem; color:var(--caramel); }
.bc-summary__tbd{ color:var(--brown-soft); font-style:italic; font-weight:600; }
.bc-warn{ margin:14px 0 0; font-size:.86rem; color:#8a5a12; background:#fff6e6;
  border-left:3px solid var(--gold); border-radius:6px; padding:10px 12px; }
.bc-note{ margin:16px 0 0; font-size:.82rem; font-style:italic; color:var(--brown-soft); line-height:1.5; }

/* ── Подвал модалки ── */
.bcalc__foot{ padding:14px 24px 18px; border-top:1px solid rgba(185,110,31,.14); background:var(--cream); }
.bc-error{ margin:0 0 10px; font-size:.88rem; font-weight:600; color:#c0341d; }
.bcalc__live{ font-weight:700; color:var(--caramel); text-align:center; margin-bottom:10px; font-size:.98rem; }
.bcalc__live:empty{ display:none; }
.bcalc__nav{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.bcalc__nav .btn{ min-width:0; }
.bcalc__nav [data-bc-back]{ flex:0 1 auto; }
.bcalc__nav [data-bc-next]{ flex:1; }
.bcalc__nav [data-bc-submit]{ flex:1 1 100%; order:-1; }   /* на шаге итога — отдельной строкой во всю ширину */
.bcalc__escape{ display:block; text-align:center; margin-top:12px; font-size:.86rem; font-weight:600;
  color:var(--brown-soft); text-decoration:underline; }
.bcalc__escape:hover{ color:var(--caramel); }

@media (min-width:560px){
  .bcalc__dialog{ max-width:580px; }
  .bcalc__body{ padding:24px 28px; }
  .bcalc__head{ padding:24px 28px 16px; }
  .bcalc__foot{ padding:16px 28px 20px; }
}

@media (prefers-reduced-motion:reduce){
  .bcalc__dialog, .bcalc__step{ animation:none; }
}
