/* ============================================================
   Qonaq Travel — новый сайт (вариант 4 «Синема»)
   Палитра — мудборд (docs/04). Шрифты: Unbounded (дисплей) + Onest (текст)
   ============================================================ */
:root{
  --inset: clamp(12px, 2.4vw, 30px);
  --radius: 26px;
  --green: #0C9762;
  --green-deep: #0B7B52;
  --lime: #FAFF7F;
  --ink: #0B0D10;
  --paper: #ECEBE6;
  --card: #ffffff;
  --muted: #676c73;
  --font-display: 'Unbounded', 'Onest', system-ui, sans-serif;
  --font-body: 'Onest', system-ui, -apple-system, sans-serif;
  --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/></svg>");
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{
  scroll-behavior:smooth;
  background:var(--paper);
  color-scheme: light; /* тёмный скроллбар браузера рисовал чёрную полосу справа */
}
/* min-height, а не height: с height:100% + overflow-x страница переставала скроллиться */
html, body{ min-height:100%; }
/* страховка от растягивания вбок: clip не создаёт лишний скролл-контейнер */
html{ overflow-x:clip; }
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--paper); }
::-webkit-scrollbar-thumb{ background:#c7c7c0; border-radius:99px; border:2px solid var(--paper); }
::-webkit-scrollbar-thumb:hover{ background:#b2b2ab; }
body{
  font-family:var(--font-body);
  background: var(--paper);
  color: var(--ink);
  overflow-x:clip;
  max-width:100%;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }

/* зерно-плёнка поверх фото */
.grainy{ position:relative; }
.grainy::after{
  content:''; position:absolute; inset:0; z-index:2; pointer-events:none;
  background-image:var(--grain);
  opacity:.13; mix-blend-mode:overlay;
}

/* кастомные иконки */
.ic{
  width:26px; height:26px; flex:0 0 auto;
  stroke:var(--green); fill:none;
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}

/* ---------- сцена hero ---------- */
.stage{
  position:fixed; inset:0; z-index:1;
  background:#0b0d10; overflow:hidden;
  transition: inset .95s cubic-bezier(.22,.85,.2,1), border-radius .95s cubic-bezier(.22,.85,.2,1);
}
.stage.framed{
  inset: var(--inset);
  border-radius: var(--radius);
  box-shadow: 0 30px 80px rgba(11,13,16,.35);
}
/* слои строго по центру блока; запас на параллакс даёт scale в JS */
.layer{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  will-change: transform;
  transform:scale(1.08);
}
#fg{
  opacity:0; transition: opacity 1.1s ease .15s;
  -webkit-mask-image: linear-gradient(to bottom, transparent 36%, rgba(0,0,0,.55) 50%, #000 62%);
          mask-image: linear-gradient(to bottom, transparent 36%, rgba(0,0,0,.55) 50%, #000 62%);
}
.stage.ready #fg{ opacity:1; }
.shade{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background: linear-gradient(to bottom, rgba(0,0,0,.35), transparent 30%, transparent 70%, rgba(0,0,0,.25));
  opacity:0; transition: opacity 1s ease;
}
.stage.ready .shade{ opacity:1; }

/* монтаж */
.montage{ position:absolute; inset:0; z-index:5; cursor:pointer; }
.montage img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0; will-change: transform, opacity;
  transition: opacity .3s ease;
}
.montage.gone{ opacity:0; transition: opacity .55s ease; pointer-events:none; }

/* типографика hero */
.heroText{
  position:absolute; left:0; right:0; top:27%;
  z-index:3; text-align:center; color:#fff;
  will-change: transform; pointer-events:none;
}
.wt{
  font-weight:300; font-size:clamp(18px, 2.8vw, 38px);
  letter-spacing:.14em; text-transform:uppercase;
  opacity:0; transform:translateY(26px);
  transition: opacity .9s ease .35s, transform .9s cubic-bezier(.2,.8,.2,1) .35s;
}
.kz{
  font-family:var(--font-display);
  font-weight:700; line-height:1.02; letter-spacing:-.01em;
  font-size:clamp(40px, 9.4vw, 170px);
  white-space:nowrap;
  opacity:0; transform:translateY(44px);
  transition: opacity 1s ease .5s, transform 1s cubic-bezier(.2,.8,.2,1) .5s;
}
/* длинные названия (Big Almaty Lake) — меньший кегль, одна строка */
.kz.long{ font-size:clamp(24px, 5.4vw, 92px); }
.stage.ready .wt, .stage.ready .kz{ opacity:1; transform:none; }
.cta{
  position:absolute; left:0; right:0; top:78%;
  z-index:6; text-align:center;
  opacity:0; transform:translateY(14px);
  transition: opacity .8s ease 1.15s, transform .8s ease 1.15s;
}
.stage.ready .cta{ opacity:1; transform:none; }
.cta a{
  color:#fff; text-decoration:none; font-weight:600;
  font-size:12px; letter-spacing:.32em; text-transform:uppercase;
  padding-bottom:6px; border-bottom:1px solid rgba(255,255,255,.35);
  transition: border-color .3s;
}
.cta a:hover{ border-color:var(--lime); }

/* интерфейс hero */
.nav{
  position:absolute; z-index:6; top:0; left:0; right:0;
  display:flex; align-items:center; justify-content:space-between;
  padding: clamp(18px,2.6vw,34px) clamp(22px,3.4vw,48px);
  color:#fff;
  opacity:0; transform:translateY(-14px);
  transition: opacity .8s ease .9s, transform .8s ease .9s;
}
.stage.ready .nav{ opacity:1; transform:none; }
.logo{ font-family:var(--font-display); font-weight:600; font-size:17px; letter-spacing:.01em; }
.logo span{ color:var(--lime); }
.menu{ display:flex; gap:clamp(16px,2.6vw,38px); align-items:center; }
.menu a{
  color:rgba(255,255,255,.85); text-decoration:none;
  font-size:11.5px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  transition: color .25s;
}
.menu a:hover{ color:var(--lime); }
/* переключатель языка */
.lang{
  display:flex; align-items:center; gap:2px;
  padding:4px; border-radius:999px;
  background:rgba(255,255,255,.14); backdrop-filter: blur(8px);
  margin-left:18px;
}
.lang a{
  padding:6px 11px; border-radius:999px; text-decoration:none;
  font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.8); transition: background .25s, color .25s;
}
.lang a.on{ background:#fff; color:var(--ink); }
.lang a:hover:not(.on){ color:#fff; }
.pageHero2 .lang{ background:rgba(11,13,16,.07); }
.pageHero2 .lang a{ color:rgba(11,13,16,.6); }
.pageHero2 .lang a.on{ background:var(--ink); color:#fff; }
.pageHero2 .lang a:hover:not(.on){ color:var(--ink); }
/* язык в мобильном меню */
.mobMenu .lang{ margin:20px 0 0; background:rgba(255,255,255,.12); }

/* бургер (только мобильные) */
.burger{
  display:none; width:44px; height:44px; border-radius:12px; border:none;
  background:rgba(255,255,255,.14); backdrop-filter: blur(8px);
  cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.burger i{ display:block; width:20px; height:2px; border-radius:2px; background:#fff; }
.pageHero2 .burger{ background:rgba(11,13,16,.08); }
.pageHero2 .burger i{ background:var(--ink); }
/* полноэкранное мобильное меню */
.mobMenu{
  position:fixed; inset:0; z-index:70;
  background:rgba(12,14,16,.96); backdrop-filter: blur(14px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
.mobMenu.open{ opacity:1; pointer-events:auto; }
.mobMenu a{
  color:#fff; text-decoration:none;
  font-family:var(--font-display); font-weight:600; font-size:21px;
  padding:13px 20px;
}
.mobMenu a:active{ color:var(--lime); }
.mobMenu .btn{ margin-top:18px; font-family:var(--font-body); }
.mobMenu .x{
  position:absolute; top:18px; right:18px;
  width:46px; height:46px; border-radius:50%; border:none;
  background:rgba(255,255,255,.12); color:#fff; font-size:18px; cursor:pointer;
}
/* соцсети — отдельная полупрозрачная капсула */
.socials{
  position:absolute; z-index:6; right:clamp(14px,2vw,26px); top:50%;
  transform:translateY(-50%);
  display:flex; flex-direction:column; gap:22px; align-items:center;
  padding:22px 12px;
  background:rgba(11,13,16,.35); backdrop-filter: blur(10px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  opacity:0; transition: opacity .8s ease 1.3s;
}
.stage.ready .socials{ opacity:1; }
.socials a{
  display:flex; flex-direction:column; align-items:center; gap:9px;
  color:rgba(255,255,255,.7); text-decoration:none;
  font-size:10px; font-weight:600; letter-spacing:.28em; text-transform:uppercase;
  transition: color .25s;
}
.socials a svg{
  width:15px; height:15px; fill:none;
  stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.socials a span{ writing-mode: vertical-rl; }
.socials a:hover{ color:var(--lime); }
.dots{
  position:absolute; z-index:6; left:50%; bottom:26px; transform:translateX(-50%);
  display:flex; gap:12px;
  opacity:0; transition: opacity .8s ease 1.4s;
}
.stage.ready .dots{ opacity:1; }
.dots i{
  width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.35);
  cursor:pointer; transition: background .25s, transform .25s;
}
.dots i:hover{ background:rgba(255,255,255,.7); }
.dots i.on{ background:#fff; transform:scale(1.35); }
.scrollHint{
  position:absolute; z-index:6; right:clamp(20px,2.6vw,34px); bottom:26px;
  color:rgba(255,255,255,.65); font-size:10px; font-weight:600;
  letter-spacing:.3em; text-transform:uppercase;
  writing-mode:vertical-rl;
  display:flex; align-items:center; gap:10px;
  opacity:0; transition: opacity .8s ease 1.5s;
}
.stage.ready .scrollHint{ opacity:1; }
.scrollHint:after{
  content:''; width:1px; height:34px; background:rgba(255,255,255,.5);
  animation: drop 1.8s ease-in-out infinite;
}
@keyframes drop{ 0%{transform:scaleY(.2); transform-origin:top} 50%{transform:scaleY(1); transform-origin:top} 100%{transform:scaleY(.2); transform-origin:bottom} }
.eq{
  position:absolute; z-index:6; left:clamp(20px,2.6vw,34px); bottom:26px;
  display:flex; gap:3px; align-items:flex-end; height:16px;
  opacity:0; transition: opacity .8s ease 1.5s;
}
.stage.ready .eq{ opacity:1; }
.eq i{ width:2px; background:rgba(255,255,255,.75); animation: eq 1s ease-in-out infinite; }
.eq i:nth-child(1){ height:60%; animation-delay:0s }
.eq i:nth-child(2){ height:100%; animation-delay:.15s }
.eq i:nth-child(3){ height:45%; animation-delay:.3s }
.eq i:nth-child(4){ height:80%; animation-delay:.45s }
.eq i:nth-child(5){ height:55%; animation-delay:.6s }
@keyframes eq{ 0%,100%{transform:scaleY(.4)} 50%{transform:scaleY(1)} }

/* лоадер */
.loader{
  position:fixed; inset:0; z-index:20; background:#0b0d10;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-family:var(--font-display);
  font-size:13px; font-weight:500; letter-spacing:.5em; text-transform:uppercase;
  animation: pulse 1.6s ease-in-out infinite;
  transition: opacity .5s ease;
}
.loader.gone{ opacity:0; pointer-events:none; animation:none; }
@keyframes pulse{ 0%,100%{opacity:.5} 50%{opacity:1} }

/* ---------- вертикальное меню слева: белая капсула с точками ---------- */
.sideNav{
  position:fixed; left:16px; top:50%; z-index:30;
  display:flex; flex-direction:column; gap:2px;
  padding:14px 10px;
  background:rgba(255,255,255,.88); backdrop-filter: blur(12px);
  border-radius:999px; box-shadow:0 14px 40px rgba(11,13,16,.14);
  opacity:0; pointer-events:none;
  transform:translate(-18px,-50%);
  transition: opacity .45s ease, transform .45s cubic-bezier(.2,.8,.2,1);
}
.sideNav.show{ opacity:1; pointer-events:auto; transform:translate(0,-50%); }
.sideNav a{
  display:flex; align-items:center; gap:10px;
  padding:7px 6px; text-decoration:none; border-radius:999px;
}
.sideNav a i{
  width:8px; height:8px; flex:0 0 8px; border-radius:50%;
  background:#c4c4bd; transition: background .25s, transform .25s;
}
.sideNav a span{
  font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); white-space:nowrap; overflow:hidden;
  max-width:0; opacity:0; transition: max-width .35s ease, opacity .3s ease;
}
.sideNav:hover a span{ max-width:150px; opacity:1; padding-right:6px; }
.sideNav a:hover i{ background:var(--ink); }
.sideNav a.on i{ background:var(--green); transform:scale(1.5); }
.sideNav a.on span{ color:var(--green); }
.sideNav .toTop{
  justify-content:center; margin-bottom:6px; padding-bottom:12px;
  border-bottom:1px solid #e4e4de; border-radius:0;
}
.sideNav .toTop b{ font-family:var(--font-display); font-size:13px; color:var(--green); font-weight:600; }
.sideNav .toTop:hover b{ color:var(--ink); }

/* ============================================================
   Контент после hero
   ============================================================ */
.below{
  position:relative; z-index:10;
  margin-top:100vh;
  margin-top:100svh; /* мобильные: без скачка от адресной строки */
  background:var(--paper);
  border-radius: 34px 34px 0 0;
  box-shadow: 0 -20px 60px rgba(11,13,16,.18);
}
.container{ max-width:1200px; margin:0 auto; padding:0 clamp(20px,3.4vw,32px); }
/* больше воздуха между секциями — кинематографичный ритм */
.section{ padding: clamp(72px, 10.5vw, 140px) 0; }
.kicker{
  color:var(--green); font-size:11px; font-weight:800;
  letter-spacing:.3em; text-transform:uppercase; margin-bottom:20px;
}
.title{
  font-family:var(--font-display);
  font-weight:600; letter-spacing:-.015em; line-height:1.1;
  font-size:clamp(26px, 4.2vw, 52px);
}
.sub{ margin-top:20px; color:var(--muted); max-width:640px; line-height:1.75; font-size:16.5px; }

/* появление при скролле */
.reveal{ opacity:0; transform:translateY(30px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal.in{ opacity:1; transform:none; }

/* кнопки */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-weight:700; font-size:14px; text-decoration:none;
  padding:16px 30px; border-radius:999px; border:none; cursor:pointer;
  transition: transform .2s, box-shadow .2s, background .2s;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{ background:var(--green); color:#fff; }
.btn-primary:hover{ box-shadow:0 12px 28px rgba(12,151,98,.35); background:var(--green-deep); }
.btn-dark{ background:var(--ink); color:#fff; }
.btn-ghost{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.35); }
.btn-ghost:hover{ border-color:var(--lime); color:var(--lime); }
/* пилюля с плюсом (как «Craft my trip») */
.pillBtn{
  display:inline-flex; align-items:center; gap:14px;
  background:#fff; color:var(--ink);
  font-weight:700; font-size:14.5px; text-decoration:none;
  padding:9px 9px 9px 26px; border-radius:999px;
  box-shadow:0 14px 36px rgba(11,13,16,.16);
  transition: transform .2s, box-shadow .2s;
}
.pillBtn:hover{ transform:translateY(-2px); box-shadow:0 20px 44px rgba(11,13,16,.22); }
.pillBtn i{
  width:38px; height:38px; border-radius:50%;
  background:var(--green); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-style:normal; font-size:20px; font-weight:600;
  transition: transform .3s;
}
.pillBtn:hover i{ transform:rotate(90deg); }

/* --- почему Казахстан --- */
.whyGrid{
  margin-top:44px;
  display:grid; grid-template-columns:repeat(4, 1fr); gap:18px;
}
/* фото-карточки с раскрытием текста при наведении */
.whyCard{
  position:relative; height:420px; border-radius:22px; overflow:hidden;
  color:#fff; background:var(--ink);
  transition: transform .25s, box-shadow .25s;
}
.whyCard:hover{ transform:translateY(-6px); box-shadow:0 20px 46px rgba(11,13,16,.3); }
.whyCard .bg{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; transition: transform .7s cubic-bezier(.2,.7,.2,1);
}
.whyCard:hover .bg{ transform:scale(1.07); }
/* вторая картинка проявляется при наведении */
.whyCard .bg2{
  opacity:0;
  transition: opacity .6s ease, transform .7s cubic-bezier(.2,.7,.2,1);
}
.whyCard:hover .bg2{ opacity:1; }
.whyCard .veil{
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(11,13,16,.9) 16%, rgba(11,13,16,.3) 55%, rgba(11,13,16,.12));
  transition: background .4s;
}
.whyCard .inner{
  position:absolute; inset:0; z-index:3; padding:22px;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.whyCard .ico{
  position:absolute; top:18px; left:18px; z-index:3;
  width:50px; height:50px; border-radius:50%;
  background:rgba(21,24,27,.55); backdrop-filter: blur(10px);
  border:1px solid rgba(255,255,255,.16);
  display:flex; align-items:center; justify-content:center;
  transition: background .25s;
}
.whyCard:hover .ico{ background:var(--lime); border-color:transparent; }
.whyCard .ic{ stroke:#fff; transition: stroke .25s; }
.whyCard:hover .ic{ stroke:var(--ink); }
.whyCard h3{ font-family:var(--font-display); font-size:15.5px; font-weight:600; line-height:1.3; color:#fff; }
.whyCard p{
  color:rgba(255,255,255,.82); font-size:13.5px; line-height:1.6;
  max-height:0; opacity:0; overflow:hidden; margin-top:0;
  transition: max-height .5s cubic-bezier(.2,.8,.2,1), opacity .4s ease .08s, margin-top .4s;
}
.whyCard:hover p{ max-height:220px; opacity:1; margin-top:10px; }
/* строка фактов под карточками */
.factsRow{
  margin-top:18px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:12px;
}
.fact{
  background:var(--card); border-radius:16px; padding:16px 20px;
  display:flex; align-items:baseline; gap:10px;
}
.fact b{ font-family:var(--font-display); font-weight:600; font-size:16px; color:var(--green); white-space:nowrap; }
.fact span{ color:var(--muted); font-size:12.5px; line-height:1.4; }

/* --- «Это не…» --- */
.notlike{
  margin-top:44px; position:relative; border-radius:28px; overflow:hidden;
  background:var(--ink); color:#fff; min-height:520px;
  display:flex; align-items:flex-end;
}
.notlike img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition: opacity .8s ease; transform:scale(1.02);
}
.notlike img.on{ opacity:1; }
.notlike .veil{
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(11,13,16,.75), transparent 55%);
}
.notlike .cap{ position:relative; z-index:3; padding:clamp(26px,4vw,48px); width:100%; }
.notlike .capNot{
  font-family:var(--font-display);
  font-weight:600; font-size:clamp(24px,3.8vw,48px); letter-spacing:-.01em; line-height:1.08;
}
.notlike .capNot em{ font-style:normal; color:var(--lime); }
.notlike .capIs{ margin-top:12px; color:rgba(255,255,255,.85); font-size:clamp(14px,1.6vw,18px); }
.notChips{
  position:relative; z-index:3;
  display:flex; gap:10px; flex-wrap:wrap; margin-top:22px;
}
.notChips button{
  font-family:var(--font-body); font-weight:700; font-size:12.5px;
  padding:10px 18px; border-radius:999px; cursor:pointer;
  background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(8px);
  transition: background .25s, border-color .25s;
}
.notChips button:hover{ background:rgba(255,255,255,.24); }
.notChips button.on{ background:#fff; color:var(--ink); }

/* --- что включено: фото слева + шаги справа (стиль «How it works») --- */
.howGrid{
  margin-top:44px;
  display:grid; grid-template-columns: 1fr 1.15fr;
  gap:clamp(24px, 4vw, 56px); align-items:stretch;
}
.howImg{
  position:relative; border-radius:26px; overflow:hidden; min-height:480px;
  box-shadow:0 24px 60px rgba(11,13,16,.14);
}
.howImg img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; transition: transform 6s ease;
}
.howImg:hover img{ transform:scale(1.05); }
.steps{ display:flex; flex-direction:column; gap:12px; justify-content:center; }
.step{
  display:flex; gap:16px; align-items:center;
  background:var(--card); border-radius:18px; padding:17px 20px;
  transition: transform .25s, box-shadow .25s;
}
.step:hover{ transform:translateX(6px); box-shadow:0 12px 30px rgba(11,13,16,.08); }
.step .ico{
  width:46px; height:46px; flex:0 0 46px; border-radius:14px;
  background:rgba(12,151,98,.1);
  display:flex; align-items:center; justify-content:center;
  transition: background .25s;
}
.step:hover .ico{ background:var(--lime); }
.step:hover .ic{ stroke:var(--ink); }
.step b{ display:block; font-size:15px; margin-bottom:2px; }
.step span{ color:var(--muted); font-size:13.5px; line-height:1.5; }
.oneLine{
  margin-top:12px;
  background:var(--green); color:#fff;
  border-radius:18px; padding:18px 22px;
  font-size:14.5px; line-height:1.5;
}
.oneLine b{ color:var(--lime); font-family:var(--font-display); font-weight:600; font-size:13.5px; }
/* тёмная плашка с фото (сувениры и т.п.) */
.oneWindow{
  margin-top:22px; display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  background:var(--ink); color:#fff; border-radius:18px; padding:16px 24px 16px 16px;
}
.oneWindow .svnPhoto{
  width:104px; height:104px; flex:0 0 104px;
  border-radius:14px; object-fit:cover;
}
.oneWindow .lime{ color:var(--lime); font-family:var(--font-display); font-weight:600; font-size:14px; }
.oneWindow p{ font-size:14.5px; color:rgba(255,255,255,.85); line-height:1.6; max-width:640px; }

/* --- «Как проходит поездка»: интерактивный таймлайн --- */
.flow{ margin-top:44px; max-width:860px; position:relative; }
.flow::before{
  content:''; position:absolute; left:23px; top:16px; bottom:16px;
  width:1px; background:rgba(11,13,16,.12);
}
.flowItem{ position:relative; padding-left:70px; margin-bottom:12px; }
.flowDot{
  position:absolute; left:0; top:14px;
  width:47px; height:47px; border-radius:50%;
  background:var(--paper); border:1px solid rgba(11,13,16,.14);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:600; font-size:13px; color:var(--muted);
  transition: background .3s, color .3s, border-color .3s, transform .3s;
  z-index:2;
}
.flowItem.open .flowDot{
  background:var(--green); color:#fff; border-color:transparent; transform:scale(1.06);
}
.flowCard{
  background:var(--card); border:1px solid rgba(11,13,16,.07);
  border-radius:20px; overflow:hidden;
  transition: border-color .3s, box-shadow .3s;
}
.flowItem.open .flowCard{ border-color:rgba(12,151,98,.3); box-shadow:0 14px 34px rgba(11,13,16,.08); }
.flowCard > button{
  width:100%; text-align:left; cursor:pointer; border:none; background:none;
  font-family:var(--font-body); color:var(--ink);
  padding:22px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.flowCard h3{ font-family:var(--font-display); font-weight:600; font-size:16px; line-height:1.3; }
.flowCard .when{
  font-size:11.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--green); white-space:nowrap;
}
.flowBody{ max-height:0; overflow:hidden; transition: max-height .4s cubic-bezier(.2,.8,.2,1); }
.flowBody p{ padding:0 24px 22px; color:var(--muted); font-size:14.5px; line-height:1.7; }
.flowBody .tags{ display:flex; gap:8px; flex-wrap:wrap; padding:0 24px 22px; }
.flowBody .tags i{
  font-style:normal; font-size:12px; font-weight:700; color:var(--ink);
  background:#F1F1EC; border-radius:999px; padding:7px 13px;
}
@media (max-width:600px){
  .flow::before{ left:18px; }
  .flowItem{ padding-left:54px; }
  .flowDot{ width:37px; height:37px; font-size:12px; }
  .flowCard > button{ padding:18px 18px; flex-direction:column; align-items:flex-start; gap:8px; }
}

/* --- «Уровень заботы»: асимметричная бенто-сетка --- */
.bento{
  margin-top:44px;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  grid-auto-rows:190px;
  gap:14px;
}
.bx{
  position:relative; overflow:hidden;
  border:1px solid rgba(11,13,16,.08);
  border-radius:22px; padding:26px;
  background:var(--card);
  display:flex; flex-direction:column; justify-content:flex-end;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s;
}
.bx:hover{ transform:translateY(-5px); box-shadow:0 18px 44px rgba(11,13,16,.12); }
.bx .ico{
  position:absolute; top:22px; left:24px;
  width:44px; height:44px; border-radius:50%;
  background:rgba(12,151,98,.1);
  display:flex; align-items:center; justify-content:center;
  transition: background .25s;
}
.bx:hover .ico{ background:var(--lime); }
.bx:hover .ic{ stroke:var(--ink); }
.bx h3{ font-family:var(--font-display); font-weight:600; font-size:15.5px; line-height:1.3; }
.bx p{ color:var(--muted); font-size:13.5px; line-height:1.6; margin-top:8px; }
/* размеры ячеек */
.bx.w2{ grid-column:span 2; }
.bx.h2{ grid-row:span 2; justify-content:flex-end; }
/* фото-ячейка */
.bx.photo{ padding:0; border:none; }
.bx.photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.bx.photo .cap{
  position:relative; z-index:3; padding:26px; color:#fff;
  background:linear-gradient(to top, rgba(11,13,16,.85), transparent);
  margin-top:auto;
}
.bx.photo .cap h3{ color:#fff; }
.bx.photo .cap p{ color:rgba(255,255,255,.8); }
/* тёмная ячейка-акцент */
.bx.dark{ background:var(--ink); border-color:transparent; }
.bx.dark h3{ color:#fff; }
.bx.dark p{ color:rgba(255,255,255,.7); }
.bx.dark .ico{ background:rgba(255,255,255,.1); }
.bx.dark .ic{ stroke:#fff; }
.bx.dark:hover .ic{ stroke:var(--ink); }
.bx.dark .big{
  font-family:var(--font-display); font-weight:600; font-size:30px; color:var(--lime);
  line-height:1; margin-bottom:10px;
}

@media (max-width:1020px){
  .bento{ grid-template-columns:repeat(2,1fr); grid-auto-rows:180px; }
  .bx.w2{ grid-column:span 2; }
  .bx.h2{ grid-row:span 1; }
}
@media (max-width:600px){
  .bento{ grid-template-columns:1fr; grid-auto-rows:auto; }
  .bx{ min-height:180px; }
  .bx.w2{ grid-column:span 1; }
}

/* --- туры: фото-карточки с раскрытием --- */
.toursGrid{
  margin-top:44px;
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
.tourCard{
  position:relative; display:block; height:460px;
  border-radius:24px; overflow:hidden; text-decoration:none;
  background:var(--ink);
  will-change: transform;
  transition: transform .55s cubic-bezier(.34,1.45,.64,1), box-shadow .35s,
              opacity .35s ease, filter .35s ease;
}
/* карточка «выезжает» вверх с пружинкой, остальные притухают */
.tourCard:hover{
  transform:translateY(-10px);
  box-shadow:0 32px 70px rgba(11,13,16,.32);
  z-index:5;
}
.toursGrid:hover .tourCard:not(:hover){
  opacity:.55;
  filter:brightness(.8) saturate(.65);
}
.tourCard .ph{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:58% center;
  transition: transform .8s cubic-bezier(.2,.7,.2,1), object-position .8s cubic-bezier(.2,.7,.2,1);
}
/* фото «доезжает» в кадр при раскрытии — усиливает эффект выезда */
.tourCard:hover .ph{ transform:scale(1.06); object-position:center; }
.tourCard .chips{ position:absolute; top:16px; left:16px; z-index:3; display:flex; gap:8px; }
.chip{
  font-size:11.5px; font-weight:800; letter-spacing:.04em;
  padding:8px 14px; border-radius:999px;
  background:rgba(11,13,16,.42); color:#fff;
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(10px);
}
.chip.lime{ background:var(--lime); color:var(--ink); border-color:transparent; }
/* температура в локации (живая, Open-Meteo) */
.tempChip{
  position:absolute; top:16px; right:16px; z-index:3;
  display:flex; align-items:center; gap:6px;
  font-size:12px; font-weight:800; color:#fff;
  padding:8px 13px; border-radius:999px;
  background:rgba(11,13,16,.42); border:1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(10px);
  opacity:0; transition: opacity .6s ease;
}
.tempChip.show{ opacity:1; }
.tempChip svg{
  width:13px; height:13px; fill:none;
  stroke:var(--lime); stroke-width:1.8; stroke-linecap:round;
}
/* матовая стеклянная панель с градиентом, раскрывается при наведении */
.tourCard .panel{
  position:absolute; left:10px; right:10px; bottom:10px; z-index:3;
  padding:20px;
  background:linear-gradient(150deg, rgba(50,60,55,.5), rgba(12,15,13,.62));
  backdrop-filter: blur(22px) saturate(150%);
  border:1px solid rgba(255,255,255,.16);
  border-radius:18px; color:#fff;
  transform:translateY(calc(100% - 84px));
  transition: transform .55s cubic-bezier(.34,1.3,.64,1), background .3s;
}
.tourCard:hover .panel{ transform:none; }
/* у каждой карточки — свой градиент матового стекла */
.tourCard.g1 .panel{ background:linear-gradient(150deg, rgba(38,70,110,.52), rgba(10,14,20,.64)); }
.tourCard.g2 .panel{ background:linear-gradient(150deg, rgba(122,62,28,.5),  rgba(24,12,8,.64)); }
.tourCard.g3 .panel{ background:linear-gradient(150deg, rgba(12,92,86,.5),   rgba(6,20,20,.64)); }
.tourCard.g4 .panel{ background:linear-gradient(150deg, rgba(112,90,36,.5),  rgba(20,16,8,.64)); }
.tourCard.g5 .panel{ background:linear-gradient(150deg, rgba(132,72,42,.5),  rgba(22,12,8,.64)); }
.tourCard.g6 .panel{ background:linear-gradient(150deg, rgba(42,82,122,.5),  rgba(8,14,22,.64)); }
.tourCard .head{
  display:flex; justify-content:space-between; align-items:flex-start; gap:14px;
  min-height:44px;
}
.tourCard h3{
  font-family:var(--font-display); font-size:15.5px; font-weight:600; line-height:1.25;
}
.tourCard .price{ text-align:right; font-weight:800; font-size:16px; white-space:nowrap; }
.tourCard .price small{ display:block; color:rgba(255,255,255,.6); font-weight:600; font-size:11px; }
.tourCard .more{
  margin-top:14px; opacity:0; transform:translateY(8px);
  transition: opacity .4s ease .12s, transform .4s ease .12s;
}
.tourCard:hover .more{ opacity:1; transform:none; }
.tourCard .route{ color:rgba(255,255,255,.8); font-size:13.5px; line-height:1.6; }
.tourCard .link{
  display:inline-block; margin-top:14px;
  font-weight:700; font-size:12px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--lime); border-bottom:1px solid rgba(250,255,127,.4); padding-bottom:4px;
}

/* --- чат «Конструктор»: плавающий виджет слева снизу --- */
.chatCard{
  max-width:620px; margin:44px auto 0;
  background:#fff; border-radius:26px; padding:clamp(20px,3vw,30px);
  box-shadow:0 24px 60px rgba(11,13,16,.1);
}
.msg{ display:flex; gap:10px; margin-bottom:14px; align-items:flex-end; }
.msg .ava{
  width:34px; height:34px; flex:0 0 34px; border-radius:50%;
  background:var(--ink); color:var(--lime);
  font-family:var(--font-display); font-size:11px; font-weight:600;
  display:flex; align-items:center; justify-content:center;
}
.msg .bub{
  max-width:78%; padding:12px 17px;
  border-radius:16px 16px 16px 4px;
  background:#F1F1EC; font-size:14.5px; line-height:1.55;
}
.msg.user{ justify-content:flex-end; }
.msg.user .bub{
  background:var(--green); color:#fff;
  border-radius:16px 16px 4px 16px;
}
.msg .time{ font-size:10.5px; color:var(--muted); align-self:flex-end; }
/* индикатор набора текста */
.dotsTyping{ display:inline-flex; gap:4px; align-items:center; }
.dotsTyping i{
  width:6px; height:6px; border-radius:50%; background:#a9a9a2;
  animation: typing 1.2s ease-in-out infinite;
}
.dotsTyping i:nth-child(2){ animation-delay:.18s }
.dotsTyping i:nth-child(3){ animation-delay:.36s }
@keyframes typing{ 0%,100%{ transform:translateY(0); opacity:.5 } 50%{ transform:translateY(-4px); opacity:1 } }
.chatCard .btn{ width:100%; justify-content:center; margin-top:16px; }
.chatNote{ text-align:center; margin-top:14px; color:var(--muted); font-size:12.5px; }
/* ---------- конфигуратор впечатлений (3 шага → WhatsApp) ---------- */
.cfgStep{ display:none; }
.cfgStep.on{ display:block; animation: cfgIn .35s cubic-bezier(.2,.8,.2,1); }
@keyframes cfgIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.cfgBar{ display:flex; gap:6px; margin-bottom:20px; }
.cfgBar i{
  height:3px; flex:1; border-radius:2px; background:#e6e6e0;
  transition: background .35s ease;
}
.cfgBar i.done{ background:var(--green); }
.cfgQ{
  font-family:var(--font-display); font-weight:600; font-size:17px;
  line-height:1.3; margin-bottom:4px;
}
.cfgHint{ color:var(--muted); font-size:13px; margin-bottom:18px; }
.cfgOpts{ display:flex; flex-direction:column; gap:9px; }
.cfgOpt{
  display:flex; align-items:center; gap:13px; width:100%;
  font-family:var(--font-body); text-align:left; cursor:pointer;
  background:#F5F5F0; border:1.5px solid transparent; border-radius:15px;
  padding:14px 16px;
  transition: border-color .2s, background .2s, transform .2s;
}
.cfgOpt:hover{ border-color:var(--green); background:#fff; transform:translateX(3px); }
.cfgOpt .em{ font-size:21px; line-height:1; }
.cfgOpt b{ display:block; font-size:14.5px; color:var(--ink); }
.cfgOpt span{ display:block; font-size:12px; color:var(--muted); margin-top:2px; }
.cfgGrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.cfgGrid .cfgOpt{ justify-content:center; padding:13px 6px; text-align:center; }
.cfgGrid .cfgOpt b{ font-size:13.5px; }
.cfgBack{
  margin-top:16px; background:none; border:none; cursor:pointer;
  font-family:var(--font-body); font-size:12.5px; font-weight:700; color:var(--muted);
}
.cfgBack:hover{ color:var(--ink); }
/* итоговый черновик */
.cfgDraft{
  background:#F5F5F0; border-radius:16px; padding:16px 18px; margin:4px 0 16px;
}
.cfgDraft .row{
  display:flex; justify-content:space-between; gap:12px;
  font-size:13.5px; padding:7px 0; border-bottom:1px dashed #dededa;
}
.cfgDraft .row:last-child{ border-bottom:none; }
.cfgDraft .row b{ font-weight:800; text-align:right; }

/* плавающая кнопка */
.chatFab{
  position:fixed; right:18px; bottom:18px; z-index:40;
  width:58px; height:58px; border-radius:50%; border:none; cursor:pointer;
  background:var(--green); box-shadow:0 14px 36px rgba(12,151,98,.4);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transform:translateY(16px);
  transition: opacity .4s ease, transform .4s cubic-bezier(.2,.8,.2,1), background .25s;
}
.chatFab.show{ opacity:1; pointer-events:auto; transform:none; }
.chatFab:hover{ background:var(--green-deep); }
.chatFab svg{ width:26px; height:26px; fill:none; stroke:#fff; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.chatFab i{
  position:absolute; top:2px; right:2px;
  width:13px; height:13px; border-radius:50%;
  background:var(--lime); border:2.5px solid var(--paper);
}
/* раскрывающийся попап с диалогом */
.chatPop{
  position:fixed; right:18px; bottom:90px; z-index:40;
  width:min(410px, calc(100vw - 36px));
  transform-origin:bottom right;
  opacity:0; transform:scale(.92) translateY(12px); pointer-events:none;
  transition: opacity .3s ease, transform .35s cubic-bezier(.2,.8,.2,1);
}
.chatPop.open{ opacity:1; transform:none; pointer-events:auto; }
.chatPop .chatCard{
  margin:0; max-width:none;
  max-height:min(600px, calc(100vh - 130px)); overflow:auto;
  box-shadow:0 30px 80px rgba(11,13,16,.35);
}
.chatHead{
  display:flex; align-items:center; gap:11px;
  padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid #ecece6;
}
.chatHead .ava{
  width:38px; height:38px; border-radius:50%;
  background:var(--ink); color:var(--lime);
  font-family:var(--font-display); font-size:12px; font-weight:600;
  display:flex; align-items:center; justify-content:center;
}
.chatHead b{ display:block; font-size:14.5px; }
.chatHead small{ display:flex; align-items:center; gap:5px; color:var(--muted); font-size:11.5px; }
.chatHead small::before{ content:''; width:7px; height:7px; border-radius:50%; background:var(--green); }
.chatHead .x{
  margin-left:auto; width:32px; height:32px; border-radius:50%;
  border:none; background:#F1F1EC; color:var(--ink);
  font-size:16px; cursor:pointer; transition: background .2s;
}
.chatHead .x:hover{ background:#e4e4de; }

/* --- B2B --- */
.b2b{ background:var(--ink); color:#fff; border-radius:28px; padding:clamp(34px,5vw,64px); }
.b2b .kicker{ color:var(--lime); }
.b2bGrid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(26px,4vw,56px); align-items:stretch; }
.b2b p{ color:rgba(255,255,255,.8); line-height:1.7; margin-top:14px; }
.b2bImg{
  position:relative; border-radius:22px; overflow:hidden; min-height:480px;
}
.b2bImg img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.b2bImg .tag{
  position:absolute; left:14px; bottom:14px; z-index:3;
  font-size:11.5px; font-weight:800; color:#fff;
  padding:9px 14px; border-radius:999px;
  background:rgba(11,13,16,.45); border:1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(10px);
}
.b2bStats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:28px; }
.b2bStats div{ background:rgba(255,255,255,.07); border-radius:18px; padding:20px; }
.b2bStats b{ display:block; font-family:var(--font-display); font-size:22px; font-weight:600; color:var(--lime); }
.b2bStats span{ font-size:12.5px; color:rgba(255,255,255,.7); line-height:1.4; display:block; margin-top:8px; }

/* --- отзывы --- */
.revGrid{ margin-top:44px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.revCard{ background:var(--card); border-radius:22px; padding:26px; }
.revCard .flag{ font-size:28px; }
.revCard p{ margin-top:14px; font-size:14.5px; line-height:1.7; }
.revCard .who{ margin-top:16px; color:var(--muted); font-size:13px; font-weight:600; }
.revNote{ margin-top:18px; font-size:12px; color:var(--muted); }

/* --- FAQ: аккордеон слева + вертикальное видео справа --- */
.faqGrid{
  margin-top:44px;
  display:grid; grid-template-columns:1.15fr .85fr;
  gap:clamp(24px,4vw,56px); align-items:start;
}
.videoCard{
  position:relative; border-radius:26px; overflow:hidden;
  aspect-ratio:9/16; max-width:400px; justify-self:end; width:100%;
  background:var(--ink);
  box-shadow:0 24px 60px rgba(11,13,16,.18);
}
.videoCard img, .videoCard video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.videoCard .tag{
  position:absolute; left:14px; bottom:14px; z-index:3;
  display:flex; align-items:center; gap:8px;
  font-size:11.5px; font-weight:800; color:#fff;
  padding:9px 14px; border-radius:999px;
  background:rgba(11,13,16,.45); border:1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(10px);
}
.videoCard .tag i{
  width:7px; height:7px; border-radius:50%; background:var(--lime);
  animation: pulse 1.6s ease-in-out infinite;
}
.faq{ max-width:780px; }
.faqItem{ background:var(--card); border-radius:18px; margin-bottom:10px; overflow:hidden; }
.faqItem button{
  width:100%; text-align:left; font-family:var(--font-body); font-size:15.5px; font-weight:800;
  padding:20px 24px; background:none; border:none; cursor:pointer; color:var(--ink);
  display:flex; justify-content:space-between; align-items:center; gap:16px;
}
.faqItem button:after{ content:'+'; font-size:22px; font-weight:600; color:var(--green); transition: transform .3s; }
.faqItem.open button:after{ transform:rotate(45deg); }
.faqItem .a{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.faqItem .a p{ padding:0 24px 20px; color:var(--muted); font-size:14.5px; line-height:1.7; }
.faqCta{
  margin-top:20px; padding:20px 24px;
  background:var(--ink); color:#fff; border-radius:18px;
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
}
.faqCta span{ font-size:14.5px; color:rgba(255,255,255,.75); }
.faqCta a{
  color:var(--lime); text-decoration:none; font-weight:700; font-size:14px;
  border-bottom:1px solid rgba(250,255,127,.35); padding-bottom:3px;
}
.faqCta a:hover{ border-color:var(--lime); }

/* --- финал: свет → фото → футер на фото --- */
.finale{ margin-top:clamp(64px,9vw,118px); }
.finaleHead{
  text-align:center; position:relative; z-index:3;
  margin-bottom:-72px;
}
.finaleHead .title em{ font-style:normal; color:var(--green); }
.finaleHead .sub{ margin-left:auto; margin-right:auto; }
.finaleHead .pillBtn{ margin-top:32px; }
.finalePhoto{
  position:relative; min-height:96vh;
  display:flex; align-items:flex-end;
}
.finalePhoto > img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 65%;
}
.finalePhoto::before{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to bottom,
    var(--paper) 0%, rgba(236,235,230,.55) 22%, rgba(236,235,230,0) 44%,
    rgba(11,13,16,0) 58%, rgba(11,13,16,.86) 100%);
}
.finalePhoto .footInner{
  position:relative; z-index:3; width:100%;
  color:#fff; padding-bottom:40px;
}
.footGrid{
  display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:clamp(24px,4vw,60px);
  align-items:start;
  padding-top:30px; border-top:1px solid rgba(255,255,255,.18);
}
.footGrid .brand p{ margin-top:14px; color:rgba(255,255,255,.75); font-size:14px; line-height:1.7; max-width:340px; }
.footGrid .socRow{ display:flex; gap:14px; margin-top:18px; flex-wrap:wrap; }
.footGrid .socRow a{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.75); text-decoration:none;
  padding:8px 14px; border:1px solid rgba(255,255,255,.25); border-radius:999px;
  backdrop-filter: blur(6px);
  transition: color .25s, border-color .25s;
}
.footGrid .socRow a svg{
  width:14px; height:14px; fill:none;
  stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.footGrid .socRow a:hover{ color:var(--lime); border-color:var(--lime); }
.footGrid h4{
  font-size:11px; font-weight:800; letter-spacing:.26em; text-transform:uppercase;
  color:rgba(255,255,255,.55); margin-bottom:16px;
}
.footGrid ul{ list-style:none; }
.footGrid li{ margin-bottom:10px; }
.footGrid li a{ color:rgba(255,255,255,.85); text-decoration:none; font-size:14.5px; }
.footGrid li a:hover{ color:var(--lime); }
.footGrid .contact div{ color:rgba(255,255,255,.85); font-size:14.5px; margin-bottom:10px; }
.copy{
  margin-top:28px; color:rgba(255,255,255,.45); font-size:12px;
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
}

/* --- адаптив --- */
@media (max-width:1020px){
  .whyGrid, .factsRow{ grid-template-columns:repeat(2,1fr); }
  .faqGrid{ grid-template-columns:1fr; }
  .videoCard{ justify-self:center; max-width:360px; }
  .howGrid{ grid-template-columns:1fr; }
  .howImg{ min-height:340px; }
  .toursGrid{ grid-template-columns:repeat(2,1fr); }
  .b2bGrid{ grid-template-columns:1fr; }
  .revGrid{ grid-template-columns:1fr; }
  .footGrid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:760px){
  .menu, .socials, .sideNav, .scrollHint, .eq{ display:none; }
  /* бургер всегда виден: плавает сверху справа при скролле */
  .burger, .pageHero2 .burger{
    display:flex;
    position:fixed; top:14px; right:14px; z-index:65;
    background:rgba(15,18,20,.6); backdrop-filter: blur(12px);
    border:1px solid rgba(255,255,255,.15);
  }
  .burger i, .pageHero2 .burger i{ background:#fff; }
  .num b{ font-size:19px; }
  .fact{ min-width:0; }
  .heroText{ top:30%; }
  .cta{ top:74%; }
  .whyGrid, .toursGrid, .b2bStats, .footGrid, .factsRow{ grid-template-columns:1fr; }
  .notlike{ min-height:420px; }
  .whyCard{ height:380px; }
  .b2bImg{ min-height:320px; }
  .storyGrid .img{ min-height:300px; }
  .finaleHead{ margin-bottom:-40px; }
  .finalePhoto{ min-height:78vh; }
  /* футер начинается ниже — кнопка не наезжает на текст */
  .finalePhoto .footInner{ padding-top:170px; }
  /* на тач-экранах раскрывающиеся элементы открыты сразу */
  .tourCard .panel{ transform:none; }
  .tourCard .more{ opacity:1; transform:none; }
  .whyCard p{ max-height:none; opacity:1; margin-top:10px; }
}
@media (prefers-reduced-motion: reduce){
  .montage, .loader{ display:none !important; }
  .reveal{ opacity:1; transform:none; }
}

/* ============================================================
   Страница тура
   ============================================================ */
.pageHero{
  position:relative; min-height:74vh;
  display:flex; align-items:flex-end;
  border-radius:0 0 34px 34px; overflow:hidden;
  background:var(--ink); color:#fff;
}
.pageHero > img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
/* ---------- шапка тура: светлая, с дорожкой-кинолентой ---------- */
.pageHero2{
  position:relative; background:var(--paper); color:var(--ink);
  overflow:hidden; padding-bottom:10px;
}
.pageHero2::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(900px 420px at 78% -10%, rgba(12,151,98,.14), transparent 60%);
  pointer-events:none;
}
.pageHero2 .nav{ opacity:1; transform:none; }
.pageHero2 .logo{ color:var(--ink); }
.pageHero2 .logo span{ color:var(--green); }
.pageHero2 .menu a{ color:rgba(11,13,16,.72); }
.pageHero2 .menu a:hover{ color:var(--green); }
.pageHero2 .phTop{ position:relative; z-index:2; padding-top:118px; }
.pageHero2 .crumb a{ color:var(--muted); }
.pageHero2 .crumb a:hover{ color:var(--green); }
.pageHero2 .phChips{ margin-top:16px; }
.pageHero2 .phChips .price{ color:var(--ink); }
.pageHero2 .phChips .price b{ color:var(--green); }

/* дорожка-кинолента */
.stripWrap{ position:relative; z-index:2; margin-top:40px; overflow:hidden; }
.strip{
  display:flex; gap:14px; width:max-content;
  animation: stripMove 42s linear infinite;
}
.strip img{
  height:400px; width:auto; border-radius:18px; object-fit:cover;
  box-shadow:0 16px 40px rgba(11,13,16,.16);
}
@keyframes stripMove{ to{ transform:translateX(-50%); } }
/* растворение ленты у краёв экрана */
.stripWrap::before, .stripWrap::after{
  content:''; position:absolute; top:0; bottom:0; width:90px; z-index:3; pointer-events:none;
}
.stripWrap::before{ left:0; background:linear-gradient(90deg, var(--paper), transparent); }
.stripWrap::after{ right:0; background:linear-gradient(-90deg, var(--paper), transparent); }

@media (max-width:900px){
  .strip img{ height:260px; }
}

/* ---------- 3D-карусель: кадры вращаются вокруг оси ---------- */
/* шапка «О нас» — симметричная: заголовок по центру, барабан ровно под ним */
.aboutHero .phTop{ text-align:center; }
.aboutHero .phChips{ justify-content:center; }
.caroWrap{
  position:relative; z-index:2; margin-top:28px;
  height:600px;
  display:flex; align-items:flex-end; justify-content:center;
  padding-bottom:26px;
  perspective:2400px;
}
/* купол юрты с шаныраком над барабаном */
.yurtDome{
  position:absolute; left:50%; top:4px; transform:translateX(-50%);
  width:min(790px, 94%); height:auto;
  pointer-events:none; opacity:.45;
}
.yurtDome path, .yurtDome ellipse{
  stroke:var(--ink); stroke-width:2.4; fill:none; stroke-linecap:round;
}
.caro3d{
  position:relative; width:230px; height:385px;
  transform-style:preserve-3d;
  animation: caroSpin 38s linear infinite;
}
.caroItem{
  position:absolute; inset:0;
  transform: rotateY(calc(var(--i) * 45deg)) translateZ(310px);
  border-radius:16px; overflow:hidden;
  box-shadow:0 20px 48px rgba(11,13,16,.22);
  backface-visibility:hidden;
}
.caroItem img{ width:100%; height:100%; object-fit:cover; }
@keyframes caroSpin{ to{ transform: rotateY(-360deg); } }
@media (max-width:900px){
  .caroWrap{ height:450px; perspective:1600px; padding-bottom:18px; }
  .caro3d{ width:160px; height:260px; }
  .caroItem{ transform: rotateY(calc(var(--i) * 45deg)) translateZ(215px); }
}
@media (max-width:480px){
  .caroWrap{ height:340px; perspective:1200px; }
  .caro3d{ width:118px; height:190px; }
  .caroItem{ transform: rotateY(calc(var(--i) * 45deg)) translateZ(158px); border-radius:12px; }
  .yurtDome{ opacity:.4; }
}

/* слайды шапки: кроссфейд + медленный наплыв */
.pageHero .phSlide{
  opacity:0; transform:scale(1.07);
  transition: opacity 1.3s ease, transform 1.3s ease;
}
.pageHero .phSlide.on{
  opacity:1;
  animation: phZoom 9s ease-out forwards;
}
@keyframes phZoom{ from{ transform:scale(1); } to{ transform:scale(1.07); } }
.pageHero .veil{
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(11,13,16,.55), transparent 35%, transparent 55%, rgba(11,13,16,.82));
}
.pageHero .nav{ opacity:1; transform:none; }
.pageHero .phBody{ position:relative; z-index:3; width:100%; padding-bottom:44px; }
.crumb{ margin-bottom:16px; }
.crumb a{
  color:rgba(255,255,255,.75); text-decoration:none;
  font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
}
.crumb a:hover{ color:var(--lime); }
.phTitle{
  font-family:var(--font-display); font-weight:700; line-height:1.05;
  font-size:clamp(32px, 5.4vw, 66px); letter-spacing:-.01em;
}
.phChips{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; align-items:center; }
.phChips .price{ font-weight:800; font-size:18px; }
.phChips .price b{ color:var(--lime); font-family:var(--font-display); font-weight:600; }

/* виджеты-факты тура */
.wRow{
  margin-top:28px; position:relative; z-index:5;
  display:grid; grid-template-columns:repeat(5,1fr); gap:12px;
}
.wCard{
  background:var(--card); border-radius:18px; padding:16px 18px;
  box-shadow:0 14px 34px rgba(11,13,16,.08);
}
.wCard small{ display:block; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:6px; }
.wCard b{ font-family:var(--font-display); font-weight:600; font-size:15px; }
.wCard b .live{ color:var(--green); }

/* переключатель комплектации */
.seg{
  display:inline-flex; gap:4px; padding:5px;
  background:#fff; border-radius:999px; box-shadow:0 8px 24px rgba(11,13,16,.08);
}
.seg button{
  font-family:var(--font-body); font-weight:800; font-size:13px;
  padding:11px 22px; border:none; border-radius:999px; cursor:pointer;
  background:transparent; color:var(--muted);
  transition: background .25s, color .25s;
}
.seg button.on{ background:var(--ink); color:#fff; }
.seg button .m{ color:var(--lime); }
.segNote{ margin-top:14px; color:var(--muted); font-size:13.5px; max-width:560px; line-height:1.6; }
body.classic .mfOnly{ display:none !important; }
body.mf .classicOnly{ display:none !important; }
.mfTag{
  display:inline-block; font-size:10.5px; font-weight:800; letter-spacing:.06em;
  background:var(--lime); color:var(--ink); border-radius:999px; padding:3px 9px;
  vertical-align:2px; margin-left:8px;
}

/* программа по дням — интерактивный таймлайн */
.dNum{
  color:var(--green); font-family:var(--font-display); font-weight:600;
  font-size:12px; margin-right:14px; white-space:nowrap;
}
.dayMeta{ display:flex; gap:8px; flex-wrap:wrap; padding:0 24px 8px; }
.dm{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:700; color:var(--ink);
  background:#F1F1EC; border-radius:999px; padding:7px 13px;
}
.dm.temp{ background:rgba(12,151,98,.1); color:var(--green); }
.faqItem .a .dayMeta ~ p{ padding-top:6px; }
/* экипировка дня */
.gear{
  margin:2px 24px 0; padding-top:14px; border-top:1px solid rgba(11,13,16,.08);
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.gear small{
  font-size:10.5px; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted);
}
.gear i{
  font-style:normal; font-size:12.5px; color:#33362f;
  border:1px solid rgba(11,13,16,.14); border-radius:999px; padding:5px 12px;
}
/* мини-галерея дня (hairline borders) */
.dayGal{
  display:grid; grid-template-columns:repeat(3,1fr); gap:8px;
  padding:16px 24px 22px;
}
.dayGal img{
  width:100%; height:110px; object-fit:cover;
  border-radius:12px; border:1px solid rgba(11,13,16,.1);
  transition: transform .35s ease, border-color .35s;
}
.dayGal img:hover{ transform:scale(1.03); border-color:var(--green); }
@media (max-width:600px){
  .dayGal{ grid-template-columns:repeat(2,1fr); }
  .dayGal img{ height:96px; }
}

/* включено / не включено */
.ieGrid{
  margin-top:44px;
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
.ie{ background:var(--card); border-radius:22px; padding:28px; }
.ie h4{
  font-family:var(--font-display); font-weight:600; font-size:15px; margin-bottom:18px;
}
.ie ul{ list-style:none; }
.ie li{
  position:relative; padding-left:30px; margin-bottom:12px;
  font-size:14.5px; line-height:1.55; color:#333;
}
.ie li::before{
  position:absolute; left:0; top:0;
  font-weight:800;
}
.ie.yes li::before{ content:'✓'; color:var(--green); }
.ie.no li::before{ content:'—'; color:#b6b6ae; }
.ie.no li{ color:var(--muted); }

/* галерея */
.galGrid{
  margin-top:44px;
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:210px; gap:12px;
}
.galGrid img{
  width:100%; height:100%; object-fit:cover; border-radius:16px;
  transition: transform .4s ease, filter .4s;
}
.galGrid img:hover{ transform:scale(1.03); filter:brightness(1.06); }
.galGrid img:first-child{ grid-column:span 2; grid-row:span 2; }

/* нижний sticky-бар брони */
.buyBar{
  position:fixed; left:50%; bottom:14px; z-index:35;
  transform:translate(-50%, 90px);
  display:flex; align-items:center; gap:18px;
  padding:10px 12px 10px 24px;
  background:rgba(15,18,20,.85); backdrop-filter: blur(16px) saturate(140%);
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px; color:#fff;
  box-shadow:0 20px 50px rgba(11,13,16,.35);
  transition: transform .45s cubic-bezier(.2,.8,.2,1);
  white-space:nowrap;
}
.buyBar.show{ transform:translate(-50%, 0); }
.buyBar .bbPrice b{ font-family:var(--font-display); font-weight:600; color:var(--lime); font-size:17px; }
.buyBar .bbPrice span{ color:rgba(255,255,255,.65); font-size:12px; margin-left:6px; }
.buyBar .seg{ background:rgba(255,255,255,.1); box-shadow:none; padding:4px; }
.buyBar .seg button{ padding:8px 16px; font-size:12px; color:rgba(255,255,255,.7); }
.buyBar .seg button.on{ background:#fff; color:var(--ink); }
.buyBar .btn{ padding:13px 24px; font-size:13.5px; }

/* ============================================================
   Страница «О нас»
   ============================================================ */
.storyGrid{
  margin-top:44px;
  display:grid; grid-template-columns:.92fr 1.08fr;
  gap:clamp(26px,4vw,60px); align-items:center;
}
.storyGrid .img{
  position:relative; border-radius:26px; overflow:hidden; min-height:440px;
  box-shadow:0 24px 60px rgba(11,13,16,.14);
}
.storyGrid .img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.storyText p{ margin-top:16px; color:#33362f; line-height:1.75; font-size:15.5px; }
.storyText p b{ font-weight:800; }
.quote{
  margin-top:26px; padding:4px 0 4px 22px;
  border-left:3px solid var(--green);
  font-family:var(--font-display); font-weight:500; font-size:16.5px; line-height:1.5;
}
.quote small{ display:block; margin-top:10px; font-family:var(--font-body); font-weight:700; font-size:12px; color:var(--muted); letter-spacing:.08em; text-transform:uppercase; }

.prinGrid{
  margin-top:44px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
.prin{ background:var(--card); border-radius:22px; padding:28px 26px; transition: transform .25s, box-shadow .25s; }
.prin:hover{ transform:translateY(-5px); box-shadow:0 16px 38px rgba(11,13,16,.1); }
.prin .n{ font-family:var(--font-display); font-weight:600; color:var(--green); font-size:13px; margin-bottom:14px; }
.prin h3{ font-family:var(--font-display); font-weight:600; font-size:16px; margin-bottom:10px; line-height:1.35; }
.prin p{ color:var(--muted); font-size:14px; line-height:1.65; }

.numRow{
  margin-top:44px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
}
.num{ background:var(--card); border-radius:18px; padding:22px; min-width:0; }
.num b{ display:block; font-family:var(--font-display); font-weight:600; font-size:24px; color:var(--green); overflow-wrap:anywhere; }
.num span{ display:block; margin-top:8px; color:var(--muted); font-size:13px; line-height:1.45; overflow-wrap:anywhere; }

.teamGrid{
  margin-top:44px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
.tCard{ background:var(--card); border-radius:22px; padding:30px 26px; text-align:center; }
.tCard .ava{
  width:76px; height:76px; margin:0 auto 18px; border-radius:50%;
  background:var(--ink); color:var(--lime);
  font-family:var(--font-display); font-weight:600; font-size:22px;
  display:flex; align-items:center; justify-content:center;
}
.tCard h3{ font-family:var(--font-display); font-weight:600; font-size:15px; }
.tCard .role{ color:var(--green); font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; margin-top:6px; }
.tCard p{ margin-top:12px; color:var(--muted); font-size:13.5px; line-height:1.6; }

.licBar{
  margin-top:44px;
  background:var(--ink); color:#fff; border-radius:22px;
  padding:26px 30px;
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
}
.licBar .ok{
  width:44px; height:44px; flex:0 0 44px; border-radius:50%;
  background:var(--lime); color:var(--ink);
  display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:800;
}
.licBar b{ display:block; font-size:15px; }
.licBar span{ color:rgba(255,255,255,.65); font-size:13px; }

@media (max-width:1020px){
  .storyGrid{ grid-template-columns:1fr; }
  .prinGrid, .teamGrid{ grid-template-columns:1fr; }
  .numRow{ grid-template-columns:repeat(2,1fr); }
}

/* ============================================================
   Страница «Контакты»
   ============================================================ */
.chanGrid{
  margin-top:44px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
}
.chan{
  display:block; text-decoration:none;
  background:var(--card); border-radius:22px; padding:26px 24px;
  transition: transform .25s, box-shadow .25s;
}
.chan:hover{ transform:translateY(-5px); box-shadow:0 16px 38px rgba(11,13,16,.12); }
.chan .ico{
  width:50px; height:50px; border-radius:50%;
  background:rgba(12,151,98,.1);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px;
  transition: background .25s;
}
.chan:hover .ico{ background:var(--lime); }
.chan:hover .ic{ stroke:var(--ink); }
.chan small{ display:block; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.chan b{ display:block; margin-top:6px; font-size:15.5px; color:var(--ink); word-break:break-word; }
.chan span{ display:block; margin-top:8px; color:var(--muted); font-size:12.5px; }
.chan.wa{ background:var(--green); }
.chan.wa .ico{ background:rgba(255,255,255,.16); }
.chan.wa .ic{ stroke:#fff; }
.chan.wa:hover .ico{ background:var(--lime); }
.chan.wa:hover .ic{ stroke:var(--ink); }
.chan.wa small{ color:rgba(255,255,255,.7); }
.chan.wa b{ color:#fff; }
.chan.wa span{ color:rgba(255,255,255,.75); }

.mapCard{
  margin-top:44px; position:relative;
  border-radius:26px; overflow:hidden; height:440px;
  box-shadow:0 24px 60px rgba(11,13,16,.12);
}
.mapCard iframe{ width:100%; height:100%; border:0; display:block; filter:saturate(.85); }
.mapCard .tag{
  position:absolute; left:16px; bottom:16px; z-index:3;
  font-size:12.5px; font-weight:800; color:#fff;
  padding:11px 16px; border-radius:999px;
  background:rgba(11,13,16,.6); border:1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(10px);
}

@media (max-width:1020px){ .chanGrid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px){ .chanGrid{ grid-template-columns:1fr; } .mapCard{ height:320px; } }

/* компактный футер внутренних страниц */
.miniFoot{
  margin-top:clamp(64px,9vw,110px);
  background:var(--ink); color:#fff;
  border-radius:34px 34px 0 0;
  padding:44px 0 90px;
}
.miniFoot .row{
  display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;
}
.miniFoot .row a{ color:rgba(255,255,255,.75); text-decoration:none; font-size:13.5px; font-weight:600; }
.miniFoot .row a:hover{ color:var(--lime); }
.miniFoot .cp{ margin-top:18px; color:rgba(255,255,255,.4); font-size:12px; }

@media (max-width:1020px){
  .wRow{ grid-template-columns:repeat(2,1fr); margin-top:20px; }
  .ieGrid{ grid-template-columns:1fr; }
  .galGrid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:180px; }
}
@media (max-width:760px){
  .buyBar{ left:10px; right:10px; transform:translate(0, 100px); border-radius:20px; flex-wrap:wrap; gap:10px; justify-content:space-between; white-space:normal; }
  .buyBar.show{ transform:translate(0,0); }
  .buyBar .seg{ order:3; width:100%; justify-content:center; }
  .wRow{ grid-template-columns:1fr 1fr; }
}