/* Шрифты бренда (SIL OFL, лицензии рядом в fonts/): Montserrat — заголовки, Inter — текст.
   Браузер скачивает только нужные наборы символов: кириллицу, латиницу и отдельный крошечный файл со знаком ₽. */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/montserrat-cyrillic.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/montserrat-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/montserrat-rub.woff2) format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/inter-cyrillic.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/inter-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/fonts/inter-rub.woff2) format("woff2"); unicode-range: U+20BD; }

/* Палитра бренда TRIPaxia. Текстовые цвета подобраны с контрастом не ниже 4.5:1 (WCAG AA) */
:root {
  --bg: #f5f8fc;
  --surface: #ffffff;
  --ink: #13243b;
  --ink-2: #33465e;
  --muted: #56677d;
  --line: #e1e8f0;
  --navy: #082a5a;          /* заголовки, «axia» */
  --accent: #0a6dd1;        /* ссылки и кнопки: темнее фирменного, чтобы читалось */
  --accent-ink: #0a58a8;
  --brand: #0b86f7;         /* фирменный лазурный — для крупных элементов */
  --cyan: #00c9d7;
  --sun: #ffb733;
  --bar: #0b86f7;
  --best-bg: #e6f6ec;
  --best-ink: #16693a;
  --hero: linear-gradient(135deg, #dff3ff 0%, #eef8ff 52%, #fff1d6 100%);
  --radius: 16px;
  --wrap: 1080px;
  --text: 720px;
  --font-head: "Montserrat", "Segoe UI", Roboto, Arial, sans-serif;
  --font-text: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0a1628;
    --surface: #112239;
    --ink: #e6edf6;
    --ink-2: #bfcbda;
    --muted: #93a4ba;
    --line: #22354d;
    --navy: #f1f6fc;
    --accent: #6db5ff;
    --accent-ink: #9ccbff;
    --brand: #3aa0ff;
    --bar: #3aa0ff;
    --best-bg: rgba(70, 170, 110, 0.16);
    --best-ink: #86d4a0;
    --hero: linear-gradient(135deg, #10284a 0%, #0f2240 55%, #2a2616 100%);
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--font-text);
  font-size: 17px; line-height: 1.6;
}
h1, h2, h3, .card-title, .deal-head h3, .fact-value, .deal-price { font-family: var(--font-head); color: var(--navy); }
a { color: var(--accent); text-underline-offset: 3px; }
a:hover { color: var(--accent-ink); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }
@media (min-width: 720px) { .wrap { padding: 0 28px; } }

/* шапка */
.site-header { border-bottom: 1px solid var(--line); background: var(--surface); }
.header-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 60px; flex-wrap: wrap; }
.logo { display: inline-flex; align-items: center; gap: 9px; color: var(--navy); text-decoration: none; }
.logo img { display: block; }
.logo .logo-icon { width: 34px; height: 34px; }
.logo .logo-word { height: 21px; width: auto; }
.nav { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.nav::-webkit-scrollbar { display: none; }
.nav a { color: var(--ink-2); text-decoration: none; padding: 8px 10px; border-radius: 8px; font-size: 15px; white-space: nowrap; }
.nav a:hover { background: var(--bg); color: var(--ink); }
.nav a[aria-current="page"] { color: var(--accent); font-weight: 600; }

main.wrap { padding-top: 28px; padding-bottom: 56px; }
h1 { font-size: clamp(27px, 5vw, 40px); line-height: 1.15; letter-spacing: -0.025em; font-weight: 800; margin: 0 0 12px; max-width: 22ch; }
h2 { font-size: 23px; line-height: 1.25; letter-spacing: -0.015em; font-weight: 700; margin: 40px 0 12px; }
h3 { font-size: 18px; font-weight: 700; margin: 28px 0 8px; }
p, ul, ol { margin: 0 0 16px; }
li { margin-bottom: 6px; }
.meta { color: var(--muted); font-size: 14px; margin-bottom: 24px; }
.crumbs { font-size: 14px; color: var(--muted); margin-bottom: 14px; }
.crumbs a { color: var(--muted); }

.article { max-width: var(--text); }
.article > .meta + p { font-size: 19px; color: var(--ink-2); }
blockquote { margin: 0 0 16px; padding: 12px 16px; border-left: 3px solid var(--accent); background: var(--surface); border-radius: 0 10px 10px 0; color: var(--ink-2); }
.article table { width: 100%; }

/* блоки данных */
.data-block { margin: 20px 0 28px; }
.lead-data { font-size: 17px; margin-bottom: 10px; }
.note { font-size: 14px; color: var(--muted); }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.fact { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; display: flex; flex-direction: column; gap: 2px; }
.fact-label { font-size: 13px; color: var(--muted); }
.fact-value { font-size: 21px; font-weight: 700; letter-spacing: -0.01em; }
.fact-note { font-size: 13px; color: var(--muted); line-height: 1.4; }

.chart-box { margin: 16px 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 12px 6px; }
.chart-box figcaption { display: flex; flex-direction: column; padding: 0 4px 6px; }
.chart-box figcaption strong { font-size: 15px; }
.chart-box figcaption span { font-size: 13px; color: var(--muted); }
.chart { width: 100%; height: auto; display: block; }
.chart-l { display: none; }
@media (min-width: 600px) { .chart-s { display: none; } .chart-l { display: block; } }
.chart .bar { fill: var(--bar); }
.chart .bar:hover { opacity: 0.8; }
.chart .grid { stroke: var(--line); stroke-width: 1; }
.chart .axis { fill: var(--muted); }
.chart .value { fill: var(--ink); font-weight: 700; }

.table-wrap { overflow-x: auto; margin: 12px 0 8px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
table { border-collapse: collapse; font-size: 15px; font-variant-numeric: tabular-nums; }
.table-wrap table { width: 100%; }
caption { text-align: left; font-weight: 700; padding: 12px 14px 6px; font-size: 15px; }
th, td { padding: 9px 10px; text-align: left; border-top: 1px solid var(--line); white-space: nowrap; }
th:first-child, td:first-child { padding-left: 14px; }
th:last-child, td:last-child { padding-right: 14px; }
@media (max-width: 420px) { table { font-size: 14px; } th, td { padding: 8px 6px; } }
/* таблица месяцев с колонкой «Солнце»: шесть колонок должны влезть в экран телефона */
@media (max-width: 420px) { table.sun { font-size: 13px; } table.sun th, table.sun td { padding: 8px 4px; } table.sun th:first-child, table.sun td:first-child { padding-left: 10px; } table.sun th:last-child, table.sun td:last-child { padding-right: 10px; } }
thead th { font-size: 13px; color: var(--muted); font-weight: 500; border-top: 0; }
tbody th { font-weight: 600; }
.num { text-align: right; }
tr.best th, tr.best td { background: var(--best-bg); }
.tag { margin-left: 4px; color: var(--best-ink); }
.cap-note { display: block; font-size: 13px; font-weight: 400; color: var(--muted); }
table.dest th .sub { display: block; font-size: 13px; color: var(--muted); font-weight: 400; }
table.dest td .sub { display: block; font-size: 13px; color: var(--muted); font-weight: 400; }
table.dest .sub { white-space: normal; }
.contact { font-size: 17px; }

/* главная и разделы */
.hero { background: var(--hero); border-radius: 24px; padding: 28px 22px 10px; margin: -8px -4px 8px; }
.hero > * { max-width: var(--text); }
.hero h1 { max-width: 20ch; }
.hero p { font-size: 18px; color: var(--ink-2); }
.hero .kicker { display: inline-block; font-family: var(--font-head); font-weight: 700; font-size: 14px; color: #082a5a;
  background: linear-gradient(90deg, #ffd566, #ffb35c); padding: 5px 12px; border-radius: 999px; margin: 0 0 14px; }
@media (min-width: 720px) { .hero { padding: 40px 40px 18px; margin: 0 0 8px; } }
.hero { position: relative; }
.hero-art { display: none; }
@media (min-width: 900px) {
  .hero-art { display: block; position: absolute; right: 48px; top: 50%; transform: translateY(-50%) rotate(-4deg);
    width: 190px; height: 190px; filter: drop-shadow(0 18px 24px rgba(8, 42, 90, .18)); }
}
/* «Какая у тебя трипаксия?» — подборки кнопками */
.moods { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 0; padding: 0; list-style: none; }
.moods li { margin: 0; }
.moods a { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 999px; background: var(--surface);
  border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-weight: 600; font-size: 15px; white-space: nowrap; }
.moods a:hover { border-color: var(--accent); color: var(--accent-ink); }
/* «Где тепло» — морские направления на ближайший месяц */
.warm { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin-top: 12px; }
.warm-card { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 16px; border-radius: var(--radius);
  background: var(--surface); border: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.warm-card:hover { border-color: var(--accent); color: var(--ink); }
.warm-name { font-family: var(--font-head); font-weight: 700; font-size: 18px; color: var(--navy); }
.warm-temp { grid-row: span 2; align-self: center; font-family: var(--font-head); font-weight: 800; font-size: 26px;
  color: #b25400; }
.warm-sub { font-size: 14px; color: var(--muted); }
.warm-price { grid-column: 1 / -1; margin-top: 8px; font-weight: 700; }
@media (prefers-color-scheme: dark) { .warm-temp { color: var(--sun); } }
.home-block { margin-top: 36px; }
.block-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.block-head h2 { margin: 0 0 14px; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin-top: 12px; }
.card { display: flex; flex-direction: column; gap: 2px; padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); text-decoration: none; transition: border-color .15s; }
.card:hover { border-color: var(--accent); color: var(--ink); }
.card-title { font-size: 19px; font-weight: 700; }
.card-sub { font-size: 14px; color: var(--muted); }
.card-row { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-top: 12px; }
.card-note { font-size: 14px; color: var(--ink-2); }
.card-price { font-weight: 700; white-space: nowrap; }
.cheap { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; }
.cheap li { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "name price" "when price"; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; margin: 0; }
.c-name { grid-area: name; font-weight: 600; }
.c-when { grid-area: when; font-size: 14px; color: var(--muted); }
.c-price { grid-area: price; align-self: center; font-weight: 700; white-space: nowrap; }
.list { list-style: none; padding: 0; max-width: var(--text); }
.list li { padding: 14px 0; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 2px; margin: 0; }
.list li a { font-size: 18px; font-weight: 600; }
.list li span { font-size: 15px; color: var(--muted); }

/* подвал */
.site-footer { border-top: 1px solid var(--line); background: var(--surface); padding: 24px 0 32px; font-size: 14px; color: var(--muted); }
.site-footer p { max-width: 760px; margin-bottom: 8px; }
.site-footer a { color: var(--muted); }

/* таблицы из текста статьи (Markdown) */
.article > table { display: block; overflow-x: auto; margin: 12px 0 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.article > table th, .article > table td { white-space: normal; vertical-align: top; }
.article > table td:last-child, .article > table th:last-child { white-space: nowrap; }
.article > table thead th { color: var(--muted); font-size: 13px; }

/* находки */
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 16px; }
.filter { padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); text-decoration: none; font-size: 15px; white-space: nowrap; }
.filter span { color: var(--muted); margin-left: 2px; }
.filter:hover { border-color: var(--accent); color: var(--ink); }
.filter[aria-current="page"] { border-color: var(--accent); color: var(--accent); font-weight: 600; }
.deals { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin-top: 12px; }
.deal { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.deal.is-ended { opacity: .72; }
.deal-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.deal-head h3 { margin: 0; font-size: 19px; line-height: 1.25; }
.deal-head h3 a { color: var(--ink); }
.deal-country { display: block; font-size: 14px; font-weight: 400; color: var(--muted); }
.deal-status { font-size: 13px; font-weight: 600; color: var(--best-ink); background: var(--best-bg); padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.deal-status.stale { color: var(--muted); background: var(--bg); border: 1px solid var(--line); }
.deal-status.ended { color: var(--muted); background: var(--bg); border: 1px solid var(--line); }
.deal-prices { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.deal-price { font-size: 24px; font-weight: 800; letter-spacing: -0.01em; }
.deal-off { font-weight: 700; color: var(--best-ink); }
.deal-norm { font-size: 14px; color: var(--muted); }
.deal-facts { list-style: none; margin: 0; padding: 0; font-size: 15px; color: var(--ink-2); display: flex; flex-direction: column; gap: 2px; }
.deal-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { font-size: 13px; padding: 2px 9px; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: var(--ink-2); }
.deal-link { align-self: flex-start; font-weight: 600; }
.deal-gone, .deal-meta { margin: 0; font-size: 13px; color: var(--muted); }
.deals-ended { margin-top: 28px; font-size: 20px; }
.deal-more { margin: 0; font-size: 14px; color: var(--ink-2); }
@media (max-width: 440px) { .nav a.nav-extra { display: none; } }  /* «О проекте» есть в подвале */

/* заголовок карточки находки — ссылка без подчёркивания, подчёркивание при наведении */
.deal-head h3 a { text-decoration: none; }
.deal-head h3 a:hover { text-decoration: underline; }
/* главная: короткие карточки находок — детали на странице «Находки» */
.deals.compact .deal-more, .deals.compact .deal-meta, .deals.compact .deal-tags { display: none; }
/* телефон: направления в две колонки, чтобы главная не тянулась на десяток экранов */
@media (max-width: 560px) {
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .card { padding: 12px; }
  .card-title { font-size: 17px; }
  .card-sub { font-size: 13px; }
  .card-row { flex-direction: column; align-items: flex-start; gap: 2px; margin-top: 8px; }
  .card-note { font-size: 13px; }
  /* находки на главной — лента с прокруткой вбок: соседняя карточка выглядывает справа */
  .deals.compact { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 86%;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px;
    margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; scroll-padding: 0 16px; }
  .deals.compact::-webkit-scrollbar { display: none; }
  .deals.compact .deal { scroll-snap-align: start; }
  /* «Куда дешевле улететь» — две колонки: город, месяц, цена друг под другом */
  .cheap { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .cheap li { grid-template-columns: 1fr; grid-template-areas: "name" "when" "price"; align-content: start; padding: 10px 12px; }
  .c-name { font-size: 16px; line-height: 1.3; }
  .c-price { align-self: start; margin-top: 4px; }
  /* «Где тепло» — тоже две колонки: город, температура, цена друг под другом */
  .warm { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .warm-card { grid-template-columns: 1fr; padding: 12px; align-content: start; }
  .warm-name { font-size: 16px; line-height: 1.3; }
  .warm-temp { grid-row: auto; font-size: 22px; }
  .warm-sub { font-size: 13px; }
  .warm-price { margin-top: 4px; font-size: 14px; }
  .moods a { padding: 8px 12px; font-size: 14px; }
}
.block-head a { white-space: nowrap; }
/* содержание длинных страниц */
.toc { margin: 0 0 24px; padding: 12px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.toc summary { cursor: pointer; font-weight: 600; }
.toc ol { margin: 10px 0 2px; padding-left: 22px; }
.toc li { margin-bottom: 4px; }
.meta .pub { white-space: nowrap; }
.list li .when { font-size: 13px; color: var(--muted); }

/* первый экран: солнце и волны — простая графика бренда (солнце — только на телефоне, на широком экране там пальма) */
.hero { overflow: hidden; padding-bottom: 44px; }
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 44px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1200 60%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M0 30 C150 5 300 55 450 30 S750 5 900 30 1150 55 1200 30 V60 H0Z%22 fill=%22%230B86F7%22 opacity=%22.18%22/%3E%3Cpath d=%22M0 42 C200 20 350 62 600 40 S1000 20 1200 44 V60 H0Z%22 fill=%22%2300C9D7%22 opacity=%22.28%22/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat; }
.hero::before { content: ""; position: absolute; right: -46px; top: -46px; width: 150px; height: 150px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 200%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFD566%22/%3E%3Cstop offset=%221%22 stop-color=%22%23FF8B33%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Ccircle cx=%22100%22 cy=%22100%22 r=%22100%22 fill=%22url%28%23g%29%22/%3E%3C/svg%3E") center / contain no-repeat; opacity: .55; }
.hero > *:not(.hero-art) { position: relative; z-index: 1; }
.hero-art { z-index: 1; }
@media (min-width: 900px) { .hero::before { display: none; } .hero { padding-bottom: 56px; } .hero::after { height: 56px; } }

/* узкие экраны (320 px): длинное слово в заголовке («конфиденциальности») не должно выталкивать страницу вбок */
h1 { font-size: clamp(23px, 7vw, 40px); }
body { overflow-wrap: break-word; }
/* хлебные крошки — удобная зона нажатия пальцем (не меньше ~36 px по высоте) */
.crumbs a { display: inline-block; padding: 8px 0; }
.crumbs { margin-bottom: 6px; }
/* узкие телефоны: все четыре раздела меню видны без прокрутки вбок */
@media (max-width: 380px) {
  .nav { gap: 0; }
  .nav a { padding: 8px 6px; font-size: 14px; }
  .hero .kicker { font-size: 13px; }
}

/* шаг 1: первый экран — вопрос, одна строка, кнопки «Чего хочется?» */
.hero h1 { font-size: clamp(30px, 8vw, 48px); margin-bottom: 10px; }
.hero > p { font-size: 18px; margin-bottom: 18px; max-width: 34ch; }
.moods-title { font-family: var(--font-head); font-weight: 700; color: var(--navy); margin: 0 0 8px; }
.hero .moods { margin-bottom: 8px; }
.hero .moods a { background: var(--surface); box-shadow: 0 1px 0 rgba(8,42,90,.06); }
/* метки у находок видны и на главной: тепло, море, без визы, прямой */
.deals.compact .deal-tags { display: flex; }
/* «Где тепло»: призыв к действию */
.warm-go { grid-column: 1 / -1; margin-top: 6px; font-weight: 700; color: var(--accent); font-size: 15px; }
.warm-card:hover .warm-go { color: var(--accent-ink); }

/* ===== мобильная версия: как в мини-приложении ===== */
@media (max-width: 560px) {
  /* меню разделов — внизу экрана, под большим пальцем; сверху остаётся только логотип */
  .nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0; overflow: visible; background: var(--surface); border-top: 1px solid var(--line);
    padding: 4px 0 calc(4px + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -6px 18px rgba(8, 42, 90, .06); }
  .nav a { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 2px; font-size: 12px;
    color: var(--muted); border-radius: 0; min-height: 52px; justify-content: center; }
  .nav a::before { content: ""; width: 24px; height: 24px; background: currentColor;
    -webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat; }
  .nav a[href="/nahodki/"] { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22c4 0 7-2.7 7-7 0-3.5-2.2-6-4-8 0 2.5-1.2 4-3 4 0-3-1-6.5-4-9 .3 3.3-3 6-3 11 0 4.3 3 9 7 9z'/%3E%3C/svg%3E"); }
  .nav a[href="/napravleniya/"] { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z'/%3E%3Ccircle cx='12' cy='10' r='2.6'/%3E%3C/svg%3E"); }
  .nav a[href="/stati/"] { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5.5A2.5 2.5 0 0 1 6.5 3H20v15H6.5A2.5 2.5 0 0 0 4 20.5z'/%3E%3Cpath d='M4 20.5A2.5 2.5 0 0 0 6.5 23H20v-5'/%3E%3C/svg%3E"); }
  .nav a[href="/gory/"] { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 20 7-12 4 6 2-3 7 9z'/%3E%3Cpath d='m7.5 10.5 1.5 1.5 1.5-1.5'/%3E%3C/svg%3E"); }
  .nav a[aria-current="page"] { color: var(--brand); }
  .nav a.nav-extra { display: none; }
  body { padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px)); }
  .header-row { min-height: 54px; }
  /* «Чего хочется?» — одна строка с прокруткой вбок, первый экран короче, находки видно сразу */
  .moods { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 4px -22px 0; padding: 2px 22px 6px; }
  .moods::-webkit-scrollbar { display: none; }
  .hero { padding-top: 22px; padding-bottom: 40px; }
  .hero p { font-size: 16px; }
  /* «Где тепло» — лента вбок, как находки */
  .warm { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 44%; overflow-x: auto;
    scroll-snap-type: x mandatory; scrollbar-width: none; margin-left: -16px; margin-right: -16px; padding: 0 16px 4px; scroll-padding: 0 16px; }
  .warm::-webkit-scrollbar { display: none; }
  .warm-card { scroll-snap-align: start; }
}
@media (max-width: 380px) { .nav a { font-size: 12px; padding: 6px 0; letter-spacing: -0.01em; } }
/* айфон: ссылки-кнопки — зона нажатия не меньше 44 px по высоте (правило Apple) */
@media (max-width: 560px) {
  .block-head a, .deal-link, .warm-go { display: inline-block; padding: 10px 0; }
  .warm-go { margin-top: -4px; }
  .crumbs a { padding: 11px 0; }
}

/* горные страницы: первый экран «Реально дойти?» — график высот по дням и главные цифры */
.mb-hero { position: relative; overflow: hidden; border-radius: 24px; padding: 22px 20px 20px; margin: 4px -4px 20px;
  background: linear-gradient(160deg, #0b2a55 0%, #12386e 55%, #3d5f8f 100%); color: #eef4fb; }
.mb-hero h1 { color: #fff; font-size: clamp(30px, 8.4vw, 46px); line-height: 1.08; margin: 6px 0 10px; max-width: 14ch; }
.mb-hero p { color: #cfdcec; font-size: 17px; margin: 0 0 16px; }
.mb-kick { display: inline-block; font: 700 13px var(--font-head); color: #082a5a; background: linear-gradient(90deg, #ffd566, #ffb35c);
  padding: 5px 12px; border-radius: 999px; }
.mb-peaks { position: absolute; left: 0; right: 0; bottom: 0; height: 90px; opacity: .9; pointer-events: none; }
.mb-hero > *:not(.mb-peaks) { position: relative; z-index: 1; }
.ctas { display: flex; flex-wrap: wrap; gap: 8px; }
.ctas a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px; font-weight: 700; text-decoration: none; font-size: 15px; }
.ctas .pri { background: #ffb733; color: #082a5a; }
.ctas .sec { background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.25); }
/* B: профиль высот */
.prof { background: rgba(255,255,255,.08); border-radius: 16px; padding: 10px 8px 4px; margin: 0 0 16px; }
.prof svg { display: block; width: 100%; height: auto; }

.chips3 { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.chips3 li { margin: 0; font-size: 14px; color: #cfdcec; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 6px 12px; }
.chips3 b { color: #ffc95c; font-family: var(--font-head); }
.chips3 { gap: 6px; }
.chips3 li { font-size: 13px; padding: 5px 11px; }
.mb-hero .prof text { paint-order: stroke; stroke: #12386e; stroke-width: 3px; }
.prof { max-width: 520px; }

/* цены и температуры — цифры одной ширины: в списках и карточках встают ровным столбиком, шрифт остаётся фирменным */
.deal-price, .deal-norm, .card-price, .c-price, .warm-price, .warm-temp, .fact-value, .lead-data, .chips3 b,
table td, .cheap li, .deal-off { font-variant-numeric: tabular-nums; }
/* значки разделов и погоды — как в боте */
.block-head h2 .ico { font-size: .9em; margin-right: 2px; }

/* плашка про cookie (появляется только со скриптом Метрики) */
.cookie-note { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; max-width: 560px; margin: 0 auto;
  display: flex; gap: 12px; align-items: center; padding: 12px 14px; background: var(--surface); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 6px 24px rgba(0, 0, 0, .18); font-size: 14px; }
.cookie-note p { margin: 0; flex: 1; }
.cookie-note button { flex: none; font: inherit; font-weight: 600; color: var(--surface); background: var(--accent); border: 0;
  border-radius: 10px; padding: 8px 14px; cursor: pointer; }
.cookie-note button:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 2px; }

/* прямой ответ под заголовком и «Частые вопросы» */
.answer { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--accent); border-radius: 12px;
  padding: 12px 14px; margin: 0 0 18px; font-size: 17px; }
.faq h3 { font-size: 17px; margin: 18px 0 4px; }
.faq p { margin: 0 0 6px; }

/* семь колонок (солнце + море) на телефоне: ещё плотнее */
@media (max-width: 420px) { table.wide { font-size: 12px; } table.wide th, table.wide td { padding: 8px 4px; } table.wide thead th { font-size: 11px; } table.wide th:first-child, table.wide td:first-child { padding-left: 8px; } table.wide th:last-child, table.wide td:last-child { padding-right: 8px; } }
/* семь колонок на телефоне: у «Солнца» и «Моря» в заголовке остаётся только значок */
@media (max-width: 420px) { table.wide .hw { display: none; } }