/* ==================== БАЗА / ПЕРЕМЕННЫЕ ==================== */
:root{
  --sea:        #0e7d9c;
  --sea-dark:   #0a5f78;
  --sea-deep:   #073b4c;
  --sun:        #ff8a4c;
  --sun-soft:   #ffb27a;
  --sand:       #fff6ec;
  --ink:        #16303a;
  --muted:      #5b7581;
  --line:       #e5edf0;
  --card:       #ffffff;
  --bg:         #f6fafb;
  --shadow:     0 18px 45px -22px rgba(7,59,76,.35);
  --radius:     20px;
  --radius-sm:  12px;
  --wrap:       1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
/* scroll-behavior не задаём — переход по якорям делает JS (см. app.js),
   так надёжнее работает во всех браузерах и настройках доступности */
body{
  font-family:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 22px}
.eyebrow{display:inline-block;color:var(--sea);font-weight:700;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}

/* ==================== КНОПКИ ==================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-weight:700;font-size:1rem;padding:14px 26px;border-radius:999px;
  border:0;cursor:pointer;transition:.2s ease;white-space:nowrap;
}
.btn--primary{background:linear-gradient(135deg,var(--sun),var(--sun-soft));color:#3a1c07;box-shadow:0 12px 26px -12px rgba(255,138,76,.8)}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 18px 32px -12px rgba(255,138,76,.9)}
.btn--ghost{background:rgba(255,255,255,.14);color:#fff;border:1.5px solid rgba(255,255,255,.55);backdrop-filter:blur(4px)}
.btn--ghost:hover{background:rgba(255,255,255,.24)}
.btn--sm{padding:10px 18px;font-size:.92rem}
.btn--block{width:100%}

/* ==================== ШАПКА ==================== */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.header__inner{display:flex;align-items:center;gap:26px;height:70px}
.logo{display:inline-flex;align-items:center;gap:11px;font-weight:800;font-size:1.2rem}
.logo__mark{flex:none;width:42px;height:42px;border-radius:13px;box-shadow:0 8px 18px -9px rgba(10,95,120,.75);transition:transform .25s ease}
.logo:hover .logo__mark{transform:rotate(-6deg) scale(1.05)}
.logo__text{display:flex;flex-direction:column;line-height:1.02;letter-spacing:-.01em;white-space:nowrap}
.logo__text small{display:block;font-weight:600;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;opacity:.6;margin-top:3px}
.nav{display:flex;gap:26px;margin-left:8px;flex:1}
.nav a{color:var(--muted);font-weight:600;font-size:.95rem;transition:.15s}
.nav a:hover{color:var(--sea)}
.header__cta{display:flex;align-items:center;gap:16px}
.header__phone{font-weight:800;color:var(--ink);white-space:nowrap}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.burger span{width:24px;height:2.5px;background:var(--ink);border-radius:2px}

/* ==================== ГЕРОЙ ==================== */
.hero{
  position:relative;color:#fff;overflow:hidden;
  background:
    linear-gradient(180deg,rgba(4,20,30,.55) 0%,rgba(4,20,30,0) 20%),
    linear-gradient(102deg,rgba(5,26,38,.82) 0%,rgba(5,30,44,.55) 38%,rgba(6,40,60,.14) 70%,rgba(6,40,60,0) 100%),
    url('../img/hero.jpg') center 42%/cover no-repeat;
}
/* картинка заходит под прозрачную шапку (отступ сверху под фикс-шапку);
   контент выровнен по общему контейнеру (макс. ширина как у .container) */
.hero__inner{max-width:var(--wrap);margin:0 auto;width:100%;padding:124px 22px 118px}
.hero__content{max-width:640px}
.hero__badge{display:inline-block;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);padding:7px 16px;border-radius:999px;font-weight:600;font-size:.85rem;margin-bottom:22px}
.hero__title{font-size:clamp(2.4rem,6vw,4.1rem);line-height:1.05;font-weight:800;letter-spacing:-.02em}
.hero__lead{margin:22px 0 30px;font-size:1.12rem;max-width:560px;color:rgba(255,255,255,.92)}
.hero__actions{display:flex;gap:14px;flex-wrap:wrap}
.hero__stats{list-style:none;display:flex;gap:38px;margin-top:52px;flex-wrap:wrap}
.hero__stats b{display:block;font-size:1.9rem;font-weight:800}
.hero__stats span{font-size:.9rem;color:rgba(255,255,255,.82)}
.hero__scroll{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:.85rem;color:rgba(255,255,255,.8);animation:bob 2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}

/* ==================== ПРЕИМУЩЕСТВА ==================== */
.perks{margin-top:48px;position:relative;z-index:5}
.perks__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.perk{background:var(--card);border-radius:var(--radius);padding:26px 22px;box-shadow:var(--shadow);border:1px solid var(--line)}
.perk__ico{font-size:1.9rem}
.perk h3{margin:12px 0 8px;font-size:1.08rem}
.perk p{color:var(--muted);font-size:.94rem}

/* ==================== СЕКЦИИ ==================== */
.section{padding:84px 0}
.section--calc{background:linear-gradient(180deg,var(--sand),#fff)}
.section--reviews{background:linear-gradient(180deg,#fff,var(--bg))}
.section__head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:38px;flex-wrap:wrap}
.section__head--center{justify-content:center;text-align:center}
.section__title{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800;letter-spacing:-.02em}
.section__sub{color:var(--muted);margin-top:12px;max-width:620px}
.section__head--center .section__sub{margin-inline:auto}

/* ==================== ФИЛЬТР ==================== */
.filters{display:inline-flex;background:#eef4f6;border-radius:999px;padding:5px}
.filter{border:0;background:none;padding:10px 22px;border-radius:999px;font-weight:700;color:var(--muted);cursor:pointer;transition:.2s}
.filter.is-active{background:#fff;color:var(--sea);box-shadow:0 6px 16px -8px rgba(7,59,76,.4)}

/* ==================== КАРТОЧКИ НАПРАВЛЕНИЙ ==================== */
/* .card/.card__* от прежней вёрстки удалены как мёртвый код — реальные
   карточки городов используют .citycard/.tcard__* (см. ниже). */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}

/* ==================== КАЛЬКУЛЯТОР ==================== */
.calc{display:grid;grid-template-columns:1.4fr 1fr;gap:26px;align-items:start}
.calc__form{background:var(--card);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);border:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{display:flex;flex-direction:column;gap:8px}
.field--full{grid-column:1/-1}
.field label{font-weight:700;font-size:.9rem}
.field label b{color:var(--sea)}
.field select,.field input[type="date"]{
  padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--radius-sm);
  font:inherit;color:var(--ink);background:#fbfdfe;cursor:pointer;transition:.15s;
}
.field select:focus,.field input:focus{outline:none;border-color:var(--sea)}
.field input[type="range"]{-webkit-appearance:none;appearance:none;height:6px;border-radius:6px;background:#dbe8ec;cursor:pointer}
.field input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--sun);box-shadow:0 3px 8px -2px rgba(255,138,76,.9);cursor:pointer}
.field input[type="range"]::-moz-range-thumb{width:22px;height:22px;border:0;border-radius:50%;background:var(--sun);cursor:pointer}

.calc__result{background:linear-gradient(160deg,var(--sea-deep),var(--sea-dark));color:#fff;border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);position:sticky;top:88px}
.calc__season{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);padding:5px 12px;border-radius:999px;font-size:.8rem;font-weight:600;margin-bottom:16px}
.calc__total-label{color:rgba(255,255,255,.8);font-size:.9rem}
.calc__total{font-size:2.6rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:4px 0}
.calc__per{color:var(--sun-soft);font-weight:600;font-size:.92rem;margin-bottom:18px}
.calc__breakdown{list-style:none;display:flex;flex-direction:column;gap:9px;margin:0 0 22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16)}
.calc__breakdown li{display:flex;justify-content:space-between;font-size:.9rem;color:rgba(255,255,255,.9)}
.calc__breakdown li b{font-weight:700}
.calc__note{margin-top:14px;font-size:.78rem;color:rgba(255,255,255,.6);text-align:center}

/* ==================== ШАГИ (связанный таймлайн) ==================== */
.section--steps{background:linear-gradient(180deg,#fff,var(--sand) 60%,#fff)}
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.steps__line{position:absolute;top:34px;left:calc(12.5% + 6px);right:calc(12.5% + 6px);height:3px;z-index:0;
  background:linear-gradient(90deg,var(--sea),var(--sun) 50%,var(--sea-dark));border-radius:3px;opacity:.35}
.step{position:relative;z-index:1;background:var(--card);border-radius:var(--radius);padding:30px 22px 26px;
  border:1px solid var(--line);box-shadow:var(--shadow);text-align:center;transition:transform .25s ease,box-shadow .25s ease}
.step:hover{transform:translateY(-6px);box-shadow:0 30px 55px -26px rgba(7,59,76,.5)}
.step__num{display:flex;align-items:center;justify-content:center;width:68px;height:68px;margin:0 auto 18px;
  border-radius:50%;background:linear-gradient(135deg,var(--sea),var(--sea-dark));
  box-shadow:0 14px 26px -12px rgba(7,59,76,.55),0 0 0 6px #fff;position:relative}
.step__ico{font-size:1.9rem;filter:drop-shadow(0 2px 3px rgba(0,0,0,.2))}
.step h3{font-size:1.12rem;margin-bottom:9px}
.step p{color:var(--muted);font-size:.9rem;line-height:1.5}
.step__chans{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:14px}
.step__chan{background:#eef4f6;color:var(--sea-dark);font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:999px;white-space:nowrap}
.step__meta{display:inline-block;margin-top:14px;font-size:.76rem;font-weight:700;color:var(--sea);
  background:rgba(14,125,156,.08);padding:5px 12px;border-radius:999px}
@media(max-width:1000px){.steps__line{display:none}}

/* ==================== ОТЗЫВЫ ==================== */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.review{background:var(--card);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);display:flex;flex-direction:column}
.review__media{position:relative}
.review__photo{aspect-ratio:16/10;object-fit:cover;width:100%}
.review__pin{position:absolute;left:12px;bottom:12px;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);
  color:#fff;font-size:.74rem;font-weight:700;padding:5px 11px;border-radius:999px}
.review__body{padding:20px;display:flex;flex-direction:column;gap:12px;flex:1}
.review__head{display:flex;align-items:center;gap:12px}
.review__avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none}
.review__name{font-weight:800;font-size:1rem}
.review__place{color:var(--muted);font-size:.83rem}
.review__stars{color:#ffb400;letter-spacing:2px;font-size:.95rem}
.review__text{color:var(--ink);font-size:.94rem}

/* ==================== ЗАЯВКА ==================== */
.lead{background:linear-gradient(135deg,var(--sea-deep),var(--sea));color:#fff;padding:76px 0}
.lead__inner{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.lead__text h2{font-size:clamp(1.9rem,4vw,2.6rem);font-weight:800;margin-bottom:14px}
.lead__text p{color:rgba(255,255,255,.9);max-width:440px}
.lead__contacts{list-style:none;margin-top:24px;display:flex;flex-direction:column;gap:12px;font-weight:600}
.lead__contacts li{display:flex;align-items:center;gap:9px}
.lead__contacts a{border-bottom:1px dashed rgba(255,255,255,.5)}
.lead__ic{width:20px;height:20px;flex:none;border-radius:50%;overflow:hidden}
.lead__cta{background:#fff;border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow)}
.lead__cta a{gap:9px}
.lead__cta-vk{background:#0077FF;color:#fff;border:0}
.lead__cta-tg{background:#29A9EA;color:#fff;border:0}
.lead__cta-wa{background:#25D366;color:#fff;border:0}
.lead__cta-vk:hover,.lead__cta-tg:hover,.lead__cta-wa:hover{filter:brightness(1.06);transform:translateY(-2px)}
.lead__btn-ic{width:22px;height:22px;flex:none;border-radius:50%;overflow:hidden}
.lead__policy{font-size:.76rem;color:var(--muted);text-align:center;margin-top:2px}

/* ==================== ПОДВАЛ ==================== */
.footer{background:var(--ink);color:rgba(255,255,255,.78);padding:56px 0 26px}
.footer__inner{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.12)}
.footer__brand p{margin-top:12px;font-size:.92rem;max-width:340px}
.footer .logo{color:#fff}
.footer__col h4{color:#fff;margin-bottom:14px;font-size:1rem}
.footer__col a{display:block;margin-bottom:9px;font-size:.92rem;transition:.15s}
.footer__col a:hover{color:var(--sun-soft)}
.footer__bottom{display:flex;justify-content:space-between;gap:16px;padding-top:20px;font-size:.8rem;color:rgba(255,255,255,.5);flex-wrap:wrap}

/* ==================== АДАПТИВ ==================== */
@media(max-width:1000px){
  .perks__grid,.cards,.steps{grid-template-columns:repeat(2,1fr)}
  .reviews{grid-template-columns:repeat(2,1fr)}
  .calc{grid-template-columns:1fr}
  .calc__result{position:static}
}
@media(max-width:760px){
  .nav,.header__phone{display:none}
  .burger{display:flex}
  .header.is-open .nav{display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;background:#fff;padding:18px 22px;border-bottom:1px solid var(--line);gap:16px}
  .hero__inner{padding:70px 22px 90px}
  /* лёгкая версия фона для мобильного LCP (см. preload в index.html) */
  .hero{ background-image:
    linear-gradient(180deg,rgba(4,20,30,.55) 0%,rgba(4,20,30,0) 20%),
    linear-gradient(102deg,rgba(5,26,38,.82) 0%,rgba(5,30,44,.55) 38%,rgba(6,40,60,.14) 70%,rgba(6,40,60,0) 100%),
    url('../img/hero-mobile.jpg'); }
  .lead__inner,.footer__inner{grid-template-columns:1fr}
  .footer__bottom{flex-direction:column;gap:6px}
}
@media(max-width:520px){
  .perks__grid,.cards,.steps,.reviews{grid-template-columns:1fr}
  .calc__form{grid-template-columns:1fr}
  .hero__stats{gap:24px}
}

/* ============================================================
   v2: карточки-города, «джин», окно калькулятора, карта, фоны
   ============================================================ */

/* --- Фоновое фото секций (калькулятор, отзывы) --- */
.section--calc, .section--reviews{ position:relative; overflow:hidden; }
.section__bg{ position:absolute; inset:0; z-index:0; background-size:cover; background-position:center;
  transform:scale(1.05); filter:saturate(1.05); transition:background-image .4s; }
#calcBg{ background-image:url('../img/yalta.jpg'); }
.section__bg--reviews{ background-image:url('../img/gelendzhik.jpg'); }
.section__bg-veil{ position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(6,28,38,.74),rgba(6,26,36,.82)); }
.section--calc > .container, .section--reviews > .container{ position:relative; z-index:2; }
.section__head--light .section__title{ color:#fff; }
.section__head--light .section__sub{ color:rgba(255,255,255,.82); }
.eyebrow--light{ color:#ffd0a6; }

/* --- КАРТОЧКИ-ГОРОДА (тёмное «стекло», как в компоненте) --- */
.citycard{ display:flex; flex-direction:column; text-align:left; padding:0; cursor:pointer; font:inherit;
  color:#fff; border:1px solid rgba(255,255,255,.09); border-radius:22px; overflow:hidden;
  background:linear-gradient(180deg,#11242e,#0a171d); box-shadow:var(--shadow); transition:.25s ease; }
.citycard:hover{ transform:translateY(-6px); border-color:rgba(120,200,230,.45);
  box-shadow:0 34px 60px -22px rgba(0,0,0,.65); }
.citycard__media{ position:relative; display:block; aspect-ratio:4/3; overflow:hidden; }
.citycard__media img{ width:100%; height:100%; object-fit:cover; transition:.5s; }
.citycard:hover .citycard__media img{ transform:scale(1.07); }
.citycard__region{ position:absolute; top:12px; left:12px; background:rgba(0,0,0,.5); backdrop-filter:blur(4px);
  color:#fff; font-weight:700; font-size:.72rem; padding:5px 11px; border-radius:999px; }
.citycard__arrow{ position:absolute; top:12px; right:12px; width:34px; height:34px; display:flex;
  align-items:center; justify-content:center; border-radius:50%; background:rgba(255,255,255,.16);
  backdrop-filter:blur(4px); font-size:1.05rem; transition:.2s; }
.citycard:hover .citycard__arrow{ background:var(--sun); color:#2a1405; transform:scale(1.12); }
.citycard__body{ display:flex; flex-direction:column; gap:7px; padding:15px 17px 17px; }
.citycard__name{ font-size:1.25rem; font-weight:800; line-height:1.1;
  background:linear-gradient(90deg,#c3e6ff,#cbbcff); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.citycard__desc{ font-size:.84rem; color:rgba(255,255,255,.58); line-height:1.45; min-height:3.6em; }
.citycard__foot{ display:flex; align-items:center; justify-content:space-between; gap:8px;
  margin-top:2px; padding-top:12px; border-top:1px solid rgba(255,255,255,.09); }
.citycard__price{ font-weight:800; font-size:1.02rem; color:#fff; }
.citycard__price i{ font-style:normal; font-weight:600; font-size:.76rem; color:rgba(255,255,255,.5); }
.citycard__count{ font-size:.76rem; color:#84d8c4; font-weight:700; white-space:nowrap; }

/* --- ПАНЕЛЬ «ДЖИН» --- */
.genie{ position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; padding:20px; }
.genie[hidden]{ display:none; }
.genie__backdrop{ position:absolute; inset:0; background:rgba(4,16,22,.6); backdrop-filter:blur(3px);
  opacity:0; transition:opacity .25s; }
.genie.is-open .genie__backdrop{ opacity:1; }
.genie__panel{ position:relative; width:min(560px,100%); max-height:86vh; display:flex; flex-direction:column;
  background:linear-gradient(180deg,rgba(17,30,39,.97),rgba(9,17,22,.98)); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.12); border-radius:26px; box-shadow:0 40px 90px -20px rgba(0,0,0,.8);
  color:#fff; overflow:hidden; opacity:0; transform:translate(var(--gx,0),var(--gy,0)) scale(.05,.02); transform-origin:center; }
.genie.is-open .genie__panel{ animation:genieIn .52s cubic-bezier(.22,1,.36,1) forwards; }
.genie.is-closing .genie__panel{ animation:genieOut .24s ease-in forwards; }
@keyframes genieIn{
  0%{ opacity:.25; transform:translate(var(--gx),var(--gy)) scale(.06,.02); }
  45%{ opacity:1; transform:translate(calc(var(--gx) * .28),calc(var(--gy) * .28)) scale(.5,.85); }
  75%{ transform:translate(0,0) scale(1.02,1.03); }
  100%{ opacity:1; transform:translate(0,0) scale(1,1); }
}
@keyframes genieOut{
  0%{ opacity:1; transform:translate(0,0) scale(1,1); }
  100%{ opacity:0; transform:translate(calc(var(--gx) * .5),calc(var(--gy) * .5)) scale(.2,.05); }
}
.genie__close{ position:absolute; top:14px; right:16px; z-index:3; background:rgba(255,255,255,.12); border:0;
  color:#fff; width:34px; height:34px; border-radius:50%; cursor:pointer; font-size:1rem; }
.genie__close:hover{ background:rgba(255,255,255,.25); }
.genie__head{ padding:26px 26px 16px; border-bottom:1px solid rgba(255,255,255,.08); }
.genie__title{ font-size:2rem; font-weight:800; line-height:1;
  background:linear-gradient(90deg,#c3e6ff,#cbbcff); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.genie__sub{ margin-top:8px; font-size:.84rem; color:rgba(255,255,255,.55); }
.genie__list{ padding:8px 14px 18px; overflow-y:auto; }
.hotelrow{ display:flex; gap:12px; align-items:center; justify-content:space-between; padding:13px 12px; border-radius:14px; transition:.15s; }
.hotelrow:hover{ background:rgba(255,255,255,.05); }
.hotelrow + .hotelrow{ border-top:1px solid rgba(255,255,255,.06); }
.hotelrow__info{ min-width:0; }
.hotelrow__name{ font-weight:700; font-size:.97rem; }
.hotelrow__addr{ font-size:.77rem; color:rgba(255,255,255,.45); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hotelrow__right{ display:flex; flex-direction:column; align-items:flex-end; gap:7px; flex:none; }
.hotelrow__price{ font-size:.8rem; color:rgba(255,255,255,.7); white-space:nowrap; }
.hotelrow__price b{ font-size:1.05rem; color:#fff; }
.hotelrow__price span{ color:rgba(255,255,255,.5); }
.hotelrow__btn{ background:linear-gradient(135deg,var(--sun),var(--sun-soft)); color:#2e1608; border:0;
  padding:8px 15px; border-radius:999px; font-weight:700; font-size:.84rem; cursor:pointer; white-space:nowrap; transition:.15s; }
.hotelrow__btn:hover{ transform:translateY(-1px); box-shadow:0 8px 18px -8px rgba(255,138,76,.9); }
.genie__empty{ padding:30px 24px; text-align:center; color:rgba(255,255,255,.72); display:flex; flex-direction:column; gap:16px; align-items:center; }

/* --- ОКНО КАЛЬКУЛЯТОРА + КАРТА --- */
.calc{ display:grid; grid-template-columns:1.35fr .95fr; gap:22px; align-items:start; }
.calc__window{ background:rgba(255,255,255,.94); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.6);
  border-radius:22px; padding:22px; box-shadow:0 34px 66px -26px rgba(0,0,0,.7); }
.calc__form{ display:grid; grid-template-columns:1fr 1fr; gap:16px; background:none; padding:0; border:0; box-shadow:none; }
.field__hint{ font-weight:600; font-size:.74rem; color:var(--sea); }
.calc__result{ margin-top:18px; background:linear-gradient(160deg,var(--sea-deep),var(--sea-dark)); color:#fff;
  border-radius:16px; padding:20px; position:static; box-shadow:none; }
.calc__hotelname{ font-weight:800; font-size:1.05rem; margin-bottom:12px; color:#fff; }
.calc__map{ background:rgba(255,255,255,.94); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.6);
  border-radius:22px; padding:16px; box-shadow:0 34px 66px -26px rgba(0,0,0,.7); position:sticky; top:88px; }
.calc__map-head{ font-weight:800; margin-bottom:12px; color:var(--ink); }
.calc__map-frame{ border-radius:14px; overflow:hidden; aspect-ratio:3/4; background:#e8eff1; }
.calc__map-frame iframe{ width:100%; height:100%; border:0; display:block; }
.calc__addr{ font-size:.84rem; color:var(--muted); margin:12px 2px; line-height:1.4; }

@media(max-width:1000px){
  .calc{ grid-template-columns:1fr; }
  .calc__map{ position:static; }
  .calc__map-frame{ aspect-ratio:16/10; }
}
@media(max-width:560px){
  .calc__form{ grid-template-columns:1fr; }
  .genie__title{ font-size:1.6rem; }
  .genie__panel{ max-height:90vh; }
}

/* ============================================================
   v3: СВЕТЛАЯ ТЕМА — белое стекло вместо чёрного, фото турагента,
   светлые секции (тёмной остаётся только картинка в шапке),
   мобильная версия.
   ============================================================ */

/* --- Фон секций калькулятора/отзывов: светлая вуаль поверх фото --- */
.section__bg-veil{ background:linear-gradient(180deg,rgba(246,250,251,.88),rgba(255,255,255,.94)); }
.section__head--light .section__title{ color:var(--ink); }
.section__head--light .section__sub{ color:var(--muted); }
.eyebrow--light{ color:var(--sea); }

/* --- ПРЕИМУЩЕСТВА: 2×2 + фото турагента справа --- */
.perks__inner{ display:grid; grid-template-columns:1.5fr .85fr; gap:22px; align-items:stretch; }
.perks__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.perks__photo{ position:relative; margin:0; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); border:1px solid var(--line);
  background:linear-gradient(160deg,#dceef3,#eaf6f9); min-height:100%; }
.perks__photo::after{ content:"📷  фото Юлии"; position:absolute; inset:0; z-index:0;
  display:flex; align-items:center; justify-content:center; color:var(--sea-dark); font-weight:700; }
.perks__photo img{ position:relative; z-index:1; width:100%; height:100%; object-fit:cover; display:block; }
.perks__photo img.is-missing{ opacity:0; }
.perks__caption{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:16px 18px 18px; color:#fff;
  background:linear-gradient(0deg,rgba(4,22,30,.85) 30%,rgba(4,22,30,0)); }
.perks__caption b{ display:block; font-size:1.02rem; }
.perks__caption span{ font-size:.82rem; opacity:.9; }
.perks__contacts{ display:flex; gap:8px; margin-top:12px; opacity:1; }
.perks__contacts a{ display:flex; align-items:center; justify-content:center; width:34px; height:34px;
  border-radius:50%; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.35);
  font-size:1rem; text-decoration:none; backdrop-filter:blur(3px); transition:.18s ease; }
.perks__contacts a:hover{ background:var(--sun); border-color:var(--sun); transform:translateY(-2px); }
.perks__contacts a.ic{ background:transparent; border-color:transparent; padding:0; overflow:hidden; }
.perks__contacts a.ic:hover{ transform:translateY(-2px) scale(1.06); }
.perks__contacts a.ic svg{ width:34px; height:34px; display:block; }

/* --- КАРТОЧКИ-ГОРОДА: белое стекло --- */
.citycard{ background:rgba(255,255,255,.92); backdrop-filter:blur(8px); color:var(--ink);
  border:1px solid rgba(255,255,255,.7); box-shadow:var(--shadow); }
.citycard:hover{ border-color:rgba(14,125,156,.35); box-shadow:0 34px 60px -24px rgba(7,59,76,.4); }
.citycard__region{ background:rgba(255,255,255,.92); color:var(--sea-dark); }
.citycard__arrow{ background:rgba(255,255,255,.85); color:var(--sea-dark); }
.citycard__name{ background:linear-gradient(90deg,var(--sea-dark),var(--sea));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.citycard__desc{ color:var(--muted); }
.citycard__foot{ border-top-color:var(--line); }
.citycard__price{ color:var(--ink); }
.citycard__price i{ color:var(--muted); }
.citycard__count{ color:#0e9c7d; }

/* --- ПАНЕЛЬ «ДЖИН»: белое стекло --- */
.genie__backdrop{ background:rgba(10,40,55,.42); }
.genie__panel{ background:rgba(255,255,255,.98); backdrop-filter:blur(12px); color:var(--ink);
  border:1px solid var(--line); box-shadow:0 40px 90px -20px rgba(7,59,76,.45); }
.genie__close{ background:#eef4f6; color:var(--ink); }
.genie__close:hover{ background:#dfeaee; }
.genie__head{ border-bottom-color:var(--line); }
.genie__title{ background:linear-gradient(90deg,var(--sea-dark),var(--sea));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.genie__sub{ color:var(--muted); }
.hotelrow:hover{ background:#f2f8fa; }
.hotelrow + .hotelrow{ border-top-color:var(--line); }
.hotelrow__name{ color:var(--ink); }
.hotelrow__addr{ color:var(--muted); }
.hotelrow__price{ color:var(--muted); }
.hotelrow__price b{ color:var(--ink); }
.hotelrow__price span{ color:var(--muted); }
.genie__empty{ color:var(--muted); }

/* --- РЕЗУЛЬТАТ КАЛЬКУЛЯТОРА: светлая карточка --- */
.calc__result{ background:linear-gradient(160deg,#eef7fa,#ffffff); color:var(--ink); border:1px solid var(--line); }
.calc__hotelname{ color:var(--sea-dark); }
.calc__total-label{ color:var(--muted); }
.calc__total{ color:var(--ink); }
.calc__per{ color:#e0710f; }
.calc__breakdown{ border-top-color:var(--line); }
.calc__breakdown li{ color:var(--muted); }
.calc__breakdown li b{ color:var(--ink); }
.calc__note{ color:var(--muted); }

/* --- СЕКЦИЯ ЗАЯВКИ: светлая --- */
.lead{ background:linear-gradient(135deg,#e8f4f8,#ffffff 55%,#fff4ea); color:var(--ink); }
.lead__text p{ color:var(--muted); }
.lead__contacts a{ border-bottom:1px dashed rgba(14,125,156,.45); }

/* --- ПОДВАЛ: светлый --- */
.footer{ background:#eaf1f3; color:var(--muted); }
.footer .logo{ color:var(--ink); }
.footer__brand p{ color:var(--muted); }
.footer__col h4{ color:var(--ink); }
.footer__col a{ color:var(--muted); }
.footer__col a:hover{ color:var(--sea); }
.footer__inner{ border-bottom-color:var(--line); }
.footer__bottom{ color:var(--muted); border-top-color:var(--line); }

/* ============================================================
   МОБИЛЬНАЯ ВЕРСИЯ (телефоны)
   ============================================================ */
@media(max-width:860px){
  .perks__inner{ grid-template-columns:1fr; }
  .perks__photo{ min-height:340px; order:-1; }   /* фото сверху на телефоне */
}
@media(max-width:760px){
  .section{ padding:60px 0; }
  .hero__inner{ padding:64px 20px 84px; }
  .hero__title{ font-size:clamp(2.1rem,9vw,3rem); }
  .hero__lead{ font-size:1rem; }
  .hero__stats{ gap:22px; margin-top:36px; }
  .hero__stats b{ font-size:1.5rem; }
  .section__head{ margin-bottom:26px; }
  .genie{ padding:0; align-items:flex-end; }
  .genie__panel{ width:100%; max-height:88vh; border-radius:24px 24px 0 0; }
  .calc__map-frame{ aspect-ratio:16/11; }
}
@media(max-width:520px){
  .perks__grid{ grid-template-columns:1fr; }
  .perks{ margin-top:24px; }
  .citycard__name{ font-size:1.15rem; }
  .header__inner{ gap:12px; }
  .logo__text{ font-size:1.05rem; }
  .hero__actions .btn{ flex:1; }
  .genie__head{ padding:22px 20px 14px; }
  .hotelrow{ flex-wrap:wrap; gap:8px; }
  .hotelrow__right{ flex-direction:row; align-items:center; gap:12px; width:100%; justify-content:space-between; }
}

/* ============================================================
   v4: прозрачная шапка поверх героя + карточки-города (card-7)
   ============================================================ */
html{ scroll-padding-top:82px; }

/* --- Прозрачная шапка над картинкой, белая при прокрутке --- */
.header{ position:fixed; left:0; right:0; top:0; background:transparent;
  border-bottom:1px solid transparent; transition:background .3s, border-color .3s, box-shadow .3s; }
.header .logo, .header .header__phone{ color:#fff; }
.header .nav a{ color:rgba(255,255,255,.85); }
.header .nav a:hover{ color:#fff; }
.header .burger span{ background:#fff; }
.header.is-scrolled{ background:rgba(255,255,255,.93); backdrop-filter:blur(12px);
  border-bottom-color:var(--line); box-shadow:0 10px 26px -20px rgba(7,59,76,.6); }
.header.is-scrolled .logo, .header.is-scrolled .header__phone{ color:var(--ink); }
.header.is-scrolled .nav a{ color:var(--muted); }
.header.is-scrolled .nav a:hover{ color:var(--sea); }
.header.is-scrolled .burger span{ background:var(--ink); }
.header.is-open .nav a{ color:var(--ink); }   /* открытое моб-меню на белом фоне */

/* --- КАРТОЧКИ-ГОРОДА в стиле card-7 (фото + оверлей + hover-reveal) --- */
.citycard{ position:relative; display:block; padding:0; text-align:left; cursor:pointer; font:inherit;
  aspect-ratio:3/4; border-radius:18px; overflow:hidden; border:1px solid var(--line);
  box-shadow:var(--shadow); background:#0a171d; color:#fff; backdrop-filter:none;
  transition:transform .3s ease, box-shadow .3s ease; }
.citycard:hover{ transform:translateY(-8px); box-shadow:0 42px 72px -24px rgba(7,59,76,.5); }
.tcard__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  transition:transform .6s ease; }
.citycard:hover .tcard__img{ transform:scale(1.1); }
.tcard__overlay{ position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top, rgba(4,14,20,.92) 0%, rgba(4,14,20,.45) 44%, rgba(4,14,20,.06) 100%); }
.tcard__content{ position:relative; z-index:2; height:100%; display:flex; flex-direction:column;
  justify-content:space-between; padding:18px; }
.tcard__top{ display:flex; align-items:flex-start; justify-content:space-between; }
.tcard__logo{ width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; border:2px solid rgba(255,255,255,.5); background:rgba(0,0,0,.22);
  backdrop-filter:blur(4px); font-size:1.2rem; }
.tcard__badge{ background:rgba(0,0,0,.4); backdrop-filter:blur(4px); border:1px solid rgba(255,255,255,.28);
  padding:5px 11px; border-radius:999px; font-size:.72rem; font-weight:700; white-space:nowrap; }
.tcard__mid{ margin-top:auto; transition:transform .45s ease; }
.citycard:hover .tcard__mid{ transform:translateY(-2.7rem); }
.tcard__title{ display:block; font-size:1.85rem; font-weight:800; line-height:1.02; color:#fff; }
.tcard__loc{ display:block; font-size:.82rem; color:rgba(255,255,255,.85); margin-top:5px; }
.tcard__overview{ display:block; margin-top:12px; }
.tcard__overview b{ display:block; font-size:.72rem; letter-spacing:.13em; font-weight:700; color:rgba(255,255,255,.9); }
.tcard__overview span{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:.8rem; color:rgba(255,255,255,.72); line-height:1.4; margin-top:3px; }
.tcard__bottom{ position:absolute; left:0; right:0; bottom:-5rem; z-index:2; padding:18px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:10px; opacity:0; transition:.45s ease; }
.citycard:hover .tcard__bottom{ bottom:0; opacity:1; }
.tcard__price{ color:rgba(255,255,255,.85); font-size:.8rem; }
.tcard__price b{ font-size:1.6rem; font-weight:800; color:#fff; }
.tcard__btn{ background:#fff; color:var(--sea-dark); padding:9px 15px; border-radius:999px;
  font-weight:700; font-size:.82rem; white-space:nowrap; box-shadow:0 8px 20px -8px rgba(0,0,0,.5); }

/* На тач-устройствах hover нет — показываем цену и кнопку сразу */
@media (hover:none){
  .tcard__bottom{ position:static; bottom:auto; opacity:1; padding:14px 18px 18px; }
  .citycard:hover .tcard__mid, .tcard__mid{ transform:none; }
  .tcard__content{ justify-content:flex-end; gap:2px; }
  .tcard__top{ position:absolute; left:18px; right:18px; top:18px; }
}
@media(max-width:520px){
  .citycard{ aspect-ratio:4/5; }
}

/* ============================================================
   v5: живые «таблички» преимуществ (цветные иконки + акценты)
   ============================================================ */
.perk{ position:relative; border-radius:20px; padding:26px 22px 24px; overflow:hidden;
  background:linear-gradient(150deg,#ffffff 30%,var(--pc,#e8f6fb) 130%); border:1px solid var(--line);
  box-shadow:0 14px 34px -22px rgba(7,59,76,.35);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.perk:hover{ transform:translateY(-6px); box-shadow:0 30px 55px -26px rgba(7,59,76,.5); border-color:rgba(14,125,156,.32); }
.perk::before{ content:""; position:absolute; top:-70px; right:-70px; width:230px; height:230px; border-radius:50%;
  background:radial-gradient(circle, var(--pg,rgba(14,125,156,.28)), transparent 72%); pointer-events:none; transition:transform .35s ease; }
.perk:hover::before{ transform:scale(1.12); }
.perk::after{ content:""; position:absolute; bottom:-60px; left:-40px; width:160px; height:160px; border-radius:50%;
  background:radial-gradient(circle, var(--pg,rgba(14,125,156,.16)), transparent 75%); pointer-events:none; opacity:.8; }
.perk__ico{ position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; width:54px; height:54px;
  border-radius:16px; font-size:1.55rem; box-shadow:0 14px 24px -12px rgba(7,59,76,.55);
  background:linear-gradient(140deg,var(--sea),var(--sea-dark)); }
.perk h3{ position:relative; z-index:1; margin:16px 0 8px; }
.perk h3::after{ content:""; display:block; width:34px; height:3px; border-radius:3px; margin-top:9px;
  background:linear-gradient(90deg,var(--sea),var(--sea-dark)); }
.perk p{ position:relative; z-index:1; }

.perk:nth-child(1){ --pc:#e4f7fb; --pg:rgba(23,180,216,.32); }
.perk:nth-child(2){ --pc:#fff1e6; --pg:rgba(239,103,15,.30); }
.perk:nth-child(3){ --pc:#e7faf3; --pg:rgba(28,199,157,.30); }
.perk:nth-child(4){ --pc:#eaf0fe; --pg:rgba(95,144,240,.30); }
.perk:nth-child(1) .perk__ico{ background:linear-gradient(140deg,#17b4d8,#0a5f78); }
.perk:nth-child(2) .perk__ico{ background:linear-gradient(140deg,#ff9d5c,#ef670f); }
.perk:nth-child(3) .perk__ico{ background:linear-gradient(140deg,#1cc79d,#0c8d6b); }
.perk:nth-child(4) .perk__ico{ background:linear-gradient(140deg,#5f90f0,#0e7d9c); }
.perk:nth-child(1) h3::after{ background:linear-gradient(90deg,#17b4d8,#0a5f78); }
.perk:nth-child(2) h3::after{ background:linear-gradient(90deg,#ff9d5c,#ef670f); }
.perk:nth-child(3) h3::after{ background:linear-gradient(90deg,#1cc79d,#0c8d6b); }
.perk:nth-child(4) h3::after{ background:linear-gradient(90deg,#5f90f0,#0e7d9c); }

/* фото турагента — держим лицо в кадре */
.perks__photo img{ object-position:center 30%; }

/* ============================================================
   v6: герой на весь экран, крупнее карта, аватары-инициалы,
       карточки отелей в панели «джин»
   ============================================================ */

/* Первый экран — картинка на всю высоту окна */
.hero{ min-height:100vh; min-height:100svh; display:flex; align-items:center; }
.hero__inner{ width:100%; }

/* Карта в калькуляторе — крупнее (используем свободное место) */
.calc__map-frame{ aspect-ratio:auto; height:520px; }
@media(max-width:1000px){ .calc__map-frame{ height:360px; } }

/* Аватар отзыва — локальные инициалы вместо внешней картинки */
.review__avatar{ display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:1rem; }

/* Панель «джин» шире — под карточки отелей */
.genie__panel{ width:min(720px,100%); }

/* КАРТОЧКА ОТЕЛЯ (фото + звёзды + рейтинг + цена + кнопки) */
.hotelcard{ display:flex; gap:14px; padding:12px; border-radius:16px; transition:background .15s; }
.hotelcard:hover{ background:rgba(255,255,255,.05); }
.hotelcard + .hotelcard{ border-top:1px solid rgba(255,255,255,.06); }
.hotelcard__media{ position:relative; width:140px; flex:none; aspect-ratio:4/3; border-radius:12px; overflow:hidden; background:#12242e; }
.hotelcard__media img{ width:100%; height:100%; object-fit:cover; }
.hotelcard__stars{ position:absolute; left:6px; bottom:6px; background:rgba(0,0,0,.6); color:#ffce4a; font-size:.72rem; padding:2px 7px; border-radius:999px; letter-spacing:1px; }
.hotelcard__body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.hotelcard__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.hotelcard__name{ font-weight:700; font-size:1rem; line-height:1.2; }
.hotelcard__rating{ flex:none; background:linear-gradient(135deg,#1f9d55,#11814a); color:#fff; font-weight:800; font-size:.82rem; padding:3px 9px; border-radius:8px; white-space:nowrap; }
.hotelcard__rating i{ font-style:normal; font-weight:500; opacity:.85; font-size:.72rem; }
.hotelcard__addr{ font-size:.78rem; color:rgba(255,255,255,.5); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hotelcard__foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.hotelcard__price{ font-size:.82rem; color:rgba(255,255,255,.75); }
.hotelcard__price b{ font-size:1.15rem; color:#fff; }
.hotelcard__actions{ display:flex; gap:8px; align-items:center; }
.hotelcard__more{ color:rgba(255,255,255,.82); font-weight:600; font-size:.82rem; border:1px solid rgba(255,255,255,.25); padding:7px 12px; border-radius:999px; }
.hotelcard__more:hover{ background:rgba(255,255,255,.1); color:#fff; }
.hotelcard__btn{ background:linear-gradient(135deg,var(--sun),var(--sun-soft)); color:#2e1608; border:0; padding:8px 15px; border-radius:999px; font-weight:700; font-size:.82rem; cursor:pointer; white-space:nowrap; transition:.15s; }
.hotelcard__btn:hover{ transform:translateY(-1px); box-shadow:0 8px 18px -8px rgba(255,138,76,.9); }
@media(max-width:560px){
  .hotelcard__media{ width:104px; }
  .hotelcard__name{ font-size:.94rem; }
}

/* ============================================================
   v7: карточки отеля — тёмный текст для СВЕТЛОЙ панели «джин»
   ============================================================ */
.hotelcard:hover{ background:rgba(10,60,80,.05); }
.hotelcard + .hotelcard{ border-top-color:var(--line); }
.hotelcard__name{ color:var(--ink); }
.hotelcard__addr{ color:var(--muted); }
.hotelcard__price{ color:var(--muted); }
.hotelcard__price b{ color:var(--ink); }
.hotelcard__more{ color:var(--sea-dark); border-color:#d7e3e7; }
.hotelcard__more:hover{ background:rgba(10,60,80,.06); color:var(--sea); }

/* ============================================================
   v8: карточка города — в раскрытии только кнопка (цену убрали)
   ============================================================ */
.tcard__bottom{ justify-content:center; }
.tcard__bottom .tcard__btn{ width:100%; text-align:center; padding:11px 16px; }

/* ============================================================
   v9: отправка расчёта турагенту (кнопки под калькулятором)
   ============================================================ */
.calc__send{ margin-top:18px; padding-top:16px; border-top:1px solid rgba(14,125,156,.15);
  display:flex; flex-direction:column; gap:9px; }
.calc__send-title{ font-size:.84rem; color:var(--muted); line-height:1.35; margin-bottom:3px; }
.calc__send-btn{ font-size:.94rem; padding:12px 18px; gap:9px; }
.calc__send-btn--tg{ background:#29A9EA; color:#fff; border:0; }
.calc__send-btn--wa{ background:#25D366; color:#fff; border:0; }
.calc__send-btn--copy{ background:#eef4f6; color:var(--sea-dark); border:1px solid var(--line); }
.calc__send-btn--tg:hover,.calc__send-btn--wa:hover{ filter:brightness(1.06); transform:translateY(-2px); }
.calc__send-btn--copy:hover{ background:#e3edf1; transform:translateY(-2px); }
.calc__send-ic{ width:20px; height:20px; flex:none; border-radius:50%; overflow:hidden; }
.calc__send-hint{ font-size:.82rem; color:var(--sea-dark); background:#e8f6fa;
  border:1px solid rgba(14,125,156,.25); border-radius:10px; padding:9px 12px; text-align:center; }
.calc__send-btn--vk{ background:#0077FF; color:#fff; border:0; }
.calc__send-btn--vk:hover{ filter:brightness(1.06); transform:translateY(-2px); }

/* ============================================================
   v10: оживление — появление секций при прокрутке
   ============================================================ */
.reveal{ opacity:0; transform:translateY(22px);
  transition:opacity .55s ease, transform .55s cubic-bezier(.22,1,.36,1); }
.reveal.is-visible{ opacity:1; transform:none; }
/* карточки городов уже имеют свой transform при hover — чтобы анимация
   появления его не перебивала, у них смещение мягче */
.citycard.reveal{ transform:translateY(16px) scale(.985); }
.citycard.reveal.is-visible{ transform:none; }
/* сумма в калькуляторе не должна «прыгать» по ширине при пересчёте */
.calc__total{ font-variant-numeric:tabular-nums; }
.hero__stats b{ font-variant-numeric:tabular-nums; }

/* уважаем системную настройку «уменьшить анимацию» */
@media (prefers-reduced-motion: reduce){
  .reveal, .citycard.reveal{ opacity:1; transform:none; transition:none; }
}

/* ============================================================
   v11: диапазон цены — длиннее одного числа, ужимаем кегль
   ============================================================ */
.calc__total{ font-size:clamp(1.5rem, 4.2vw, 2.1rem); line-height:1.15; letter-spacing:-.02em; }
.calc__per{ font-size:.85rem; line-height:1.4; }
.calc__breakdown li b{ white-space:nowrap; }

/* ============================================================
   v12: мобильная шапка — бургер уходил за край экрана
   ============================================================ */
@media(max-width:760px){
  /* На узком экране кнопка «Подобрать тур» вытесняла бургер за границу
     (при 390px он оказывался на 415px — меню становилось недоступно).
     Логотип может ужиматься, кнопка — компактнее, бургер защищён от сжатия. */
  .header__inner{ gap:10px; }
  .logo{ min-width:0; flex:1; }
  .logo__text{ font-size:1rem; overflow:hidden; }
  .header__cta .btn{ padding:9px 14px; font-size:.85rem; }
  .burger{ flex:none; margin-left:auto; }
}
@media(max-width:400px){
  /* совсем узкие экраны: оставляем логотип и бургер, кнопку прячем —
     «Подобрать тур» доступна в меню и в первом экране */
  .header__cta{ display:none; }
  .logo__text{ font-size:1.05rem; }
}

/* ============================================================
   v13: калькулятор вылезал за экран на мобильном
   ------------------------------------------------------------
   Причина: длинные названия отелей в <select> («Бархатные сезоны
   город-отель Спортивный квартал…») растягивали его до 783px, а
   вместе с ним и всю сетку калькулятора — до 829px при экране 390px.
   У элементов grid/flex по умолчанию min-width:auto, поэтому они не
   сжимаются меньше своего содержимого. Явный min-width:0 это чинит.
   ============================================================ */
.calc, .calc > *, .calc__form, .calc__form > *, .field{ min-width:0; }
.field select, .field input{ width:100%; max-width:100%; }
/* текст в списке не должен распирать колонку */
.field select{ text-overflow:ellipsis; }
.calc__send, .calc__send > *{ min-width:0; }
.calc__send-btn{ white-space:normal; }   /* длинные подписи переносятся, а не режутся */

/* ============================================================
   v14: статистика посещений (панель владельца, самый низ страницы)
   ------------------------------------------------------------
   Блок намеренно тихий: клиентам он не нужен и не должен спорить с
   визиткой над ним. Свёрнут в неприметную ссылку, раскрывается по
   клику. Данные защищает сервер (403 без кода), оформление — только
   чтобы не мозолило глаза.
   ============================================================ */
.stats{ padding:18px 0 26px; background:#f6f8fa; border-top:1px solid #e6ebf0; }
.stats__toggle{
  background:none; border:0; cursor:pointer; padding:6px 0;
  color:#8a97a4; font-size:.86rem; font-family:inherit;
  display:inline-flex; align-items:center; gap:7px;
}
.stats__toggle:hover{ color:var(--ink, #163a4a); }

.stats__panel{
  margin-top:14px; padding:18px; border-radius:14px;
  background:#fff; border:1px solid #e6ebf0;
}
.stats__row{ display:flex; flex-wrap:wrap; gap:12px; }
.stats__field{ display:flex; flex-direction:column; gap:5px; min-width:0; flex:1 1 170px; }
.stats__field span{ font-size:.78rem; color:#8a97a4; }
.stats__field input{
  width:100%; max-width:100%; padding:9px 12px; font:inherit; font-size:.92rem;
  border:1px solid #dde4ea; border-radius:9px; background:#fbfcfd;
}
.stats__field input:focus{ outline:2px solid #16a8cd; outline-offset:1px; }

.stats__presets{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 0; }
.stats__preset{
  padding:6px 12px; border:1px solid #dde4ea; border-radius:999px;
  background:#fff; cursor:pointer; font:inherit; font-size:.82rem; color:#5a6b78;
}
.stats__preset:hover{ border-color:#16a8cd; color:#0a5f78; }

.stats__actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.stats__actions .btn{ min-width:0; }

.stats__msg{ margin-top:12px; font-size:.88rem; color:#5a6b78; }
.stats__msg--error{ color:#c0392b; }

.stats__summary{
  display:grid; gap:10px; margin-top:16px;
  grid-template-columns:repeat(auto-fit, minmax(112px, 1fr));
}
.stats__card{
  padding:12px; border-radius:11px; background:#f6f8fa;
  border:1px solid #e6ebf0; text-align:center; min-width:0;
}
.stats__card b{ display:block; font-size:1.35rem; color:#0a5f78; line-height:1.2; }
.stats__card span{ font-size:.76rem; color:#8a97a4; }

/* Таблица может быть длинной и широкой — прокручиваем её саму,
   а не всю страницу (иначе на телефоне появляется горизонтальный скролл). */
.stats__tablewrap{ margin-top:16px; max-height:340px; overflow:auto; border-radius:11px; border:1px solid #e6ebf0; }
.stats__table{ width:100%; border-collapse:collapse; font-size:.88rem; }
.stats__table th, .stats__table td{ padding:8px 12px; text-align:left; white-space:nowrap; }
.stats__table thead th{
  position:sticky; top:0; background:#f6f8fa; color:#5a6b78;
  font-weight:600; font-size:.8rem; border-bottom:1px solid #e6ebf0;
}
.stats__table tbody tr:nth-child(even){ background:#fafbfc; }

@media(max-width:520px){
  .stats__panel{ padding:14px; }
  .stats__actions .btn{ flex:1 1 100%; }
}