/* «Поводы для полета»: статьи /povody/ — язык Kinlo (стекло, мягкие подложки, акцент #0e6c84), фото на всю ширину, место = карточка с фото и делами. */
.pv { --pv-r: 26px; --pv-ease: cubic-bezier(.22, 1, .36, 1); }
.pv h2 { letter-spacing: -0.02em; }

/* герой: фото на всю ширину, текст поверх затемнения */
.pv-hero { position: relative; isolation: isolate; min-height: clamp(460px, 72vh, 720px); display: flex; align-items: flex-end; color: #fff; overflow: hidden; margin: 0 0 0; }
.pv-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transform: scale(1.04); animation: pv-zoom 18s var(--pv-ease) forwards; }
.pv-hero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4, 18, 28, 0.15) 0%, rgba(4, 18, 28, 0.25) 40%, rgba(4, 18, 28, 0.82) 100%); }
.pv-hero__in { padding: 0 0 clamp(36px, 6vw, 72px); display: grid; gap: 14px; justify-items: start; }
.pv-hero h1 { color: #fff; font-size: clamp(34px, 5.6vw, 68px); line-height: 1.02; letter-spacing: -0.04em; max-width: 16ch; margin: 0; text-wrap: balance; }
.pv-lead { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.5; max-width: 62ch; margin: 0; }
.pv-hero .pv-lead { color: rgba(255, 255, 255, 0.92); }
.pv-ph--top .pv-hero__img, .pv-ph--top img { object-position: 50% 20%; }
.pv-ph--bottom .pv-hero__img, .pv-ph--bottom img { object-position: 50% 80%; }
@keyframes pv-zoom { to { transform: scale(1); } }

.pv-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; color: rgba(255, 255, 255, 0.8); }
.pv-crumbs a { color: inherit; text-decoration: none; }
.pv-crumbs a:hover { color: #fff; text-decoration: underline; }
.pv-crumbs--dark { color: var(--muted); }
.pv-crumbs--dark a:hover { color: var(--ink); }

.pv-kind { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 700; letter-spacing: 0.01em;
  background: rgba(255, 255, 255, 0.16); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.pv-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 0; }
.pv-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 14px; font-size: 14px; font-weight: 600;
  background: rgba(255, 255, 255, 0.14); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.24); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.pv-chip--hot { background: #ffd60a; color: #2e1200; box-shadow: none; }
.pv-credit { position: absolute; right: 14px; bottom: 10px; margin: 0; font-size: 11px; color: rgba(255, 255, 255, 0.7); }
.pv-credit a { color: inherit; }

/* липкая панель «цены и погода из …» */
.pv-bar { position: sticky; top: 64px; z-index: 20; background: var(--glass); backdrop-filter: blur(26px) saturate(1.4); -webkit-backdrop-filter: blur(26px) saturate(1.4);
  box-shadow: inset 0 -1px 0 var(--line-2), 0 10px 30px -24px rgba(0, 0, 0, 0.5); }
.pv-bar__in { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 10px 0; }
.pv-bar__l { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--ink); font-size: 15px; }
.pv-sel { font: inherit; font-weight: 700; color: var(--accent-text); background: var(--accent-soft); border: 0; border-radius: 12px; padding: 8px 30px 8px 12px; cursor: pointer;
  appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 15px) 52%, calc(100% - 10px) 52%; background-size: 5px 5px; background-repeat: no-repeat; }
.pv-bar__w { color: var(--muted); font-size: 14px; }
.pv-bar__cta { margin-left: auto; min-height: 42px; }

/* оглавление: номера мест, листается пальцем */
.pv-toc { display: flex; gap: 8px; overflow-x: auto; padding: 18px 0 6px; scrollbar-width: none; }
.pv-toc::-webkit-scrollbar { display: none; }
.pv-toc a { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 14px; text-decoration: none; color: var(--ink); font-weight: 600; font-size: 14px;
  background: var(--card); box-shadow: inset 0 0 0 1px var(--line); transition: transform 0.2s var(--pv-ease), box-shadow 0.2s; }
.pv-toc a span { color: var(--accent-text); font-variant-numeric: tabular-nums; font-weight: 800; }
.pv-toc a:hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--line-2), 0 10px 20px -16px rgba(0, 0, 0, 0.5); }

/* место: фото слева, текст справа (на телефоне — фото сверху); четные — зеркально */
.pv-list { display: grid; gap: clamp(26px, 4vw, 46px); padding: clamp(18px, 3vw, 34px) 0; }
.pv-place { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 40px); align-items: start; scroll-margin-top: 140px;
  background: var(--card); border-radius: var(--pv-r); padding: clamp(14px, 1.6vw, 20px); box-shadow: var(--shadow), inset 0 0 0 1px var(--line); }
.pv-place:nth-child(even) .pv-ph { order: 2; }
.pv-ph { position: relative; margin: 0; border-radius: calc(var(--pv-r) - 8px); overflow: hidden; aspect-ratio: 4 / 3; position: sticky; top: 136px; }
.pv-ph img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.8s var(--pv-ease); }
.pv-place:hover .pv-ph img { transform: scale(1.03); }
.pv-ph figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 12px 8px; font-size: 11px; color: rgba(255, 255, 255, 0.82);
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.55)); }
.pv-ph figcaption a { color: inherit; }
.pv-num { position: absolute; top: 12px; left: 12px; padding: 6px 10px; border-radius: 12px; font-weight: 800; font-size: 15px; color: #fff; font-variant-numeric: tabular-nums;
  background: rgba(8, 22, 32, 0.45); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.pv-body { padding: clamp(4px, 1vw, 12px) clamp(2px, 1vw, 10px); display: grid; gap: 12px; align-content: start; }
.pv-where { margin: 0; color: var(--muted); font-weight: 600; font-size: 14px; }
.pv-body h2 { margin: 0; font-size: clamp(24px, 2.6vw, 32px); line-height: 1.12; color: var(--ink); }
.pv-facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pv-f { padding: 7px 11px; border-radius: 12px; font-size: 13.5px; font-weight: 600; background: var(--card-2); color: var(--ink-2); }
.pv-v-free { background: var(--good-soft); color: var(--good); }
.pv-v-required { background: var(--warn-soft); color: var(--warn); }
.pv-f--wx { background: var(--info-soft); color: var(--info); }
.pv-text p { margin: 0 0 12px; font-size: 16.5px; line-height: 1.62; color: var(--ink-2); }
.pv-text p:last-child { margin-bottom: 0; }
.pv-hl { margin: 0; padding: 14px 16px 14px 34px; border-radius: 18px; background: var(--accent-soft); color: var(--ink); display: grid; gap: 6px; font-size: 15px; }
.pv-hl li::marker { color: var(--accent); }
.pv-budget { margin: 0; color: var(--ink-2); font-size: 15px; }
.pv-act { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; margin-top: 4px; }
.pv-price { flex: 1 1 220px; display: grid; gap: 2px; padding: 12px 16px; border-radius: 18px; text-decoration: none; color: var(--ink);
  background: linear-gradient(135deg, var(--accent-soft), var(--card-2)); box-shadow: inset 0 0 0 1px var(--line-2); transition: transform 0.2s var(--pv-ease), box-shadow 0.2s; }
.pv-price:hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--accent), 0 12px 24px -18px var(--accent-glow); }
.pv-price__l { font-size: 13px; color: var(--muted); font-weight: 600; }
.pv-price b { font-size: 22px; letter-spacing: -0.02em; color: var(--accent-text); }
.pv-price small { font-size: 12.5px; color: var(--muted); }
.pv-price--none b { font-size: 17px; color: var(--ink-2); }
.pv-btns { flex: 1 1 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.pv-btns .btn { min-height: 52px; padding: 0 16px; }
.pv-btns .btn[hidden] { display: none; }
.pv-place.is-loading .pv-price b, .pv-place.is-loading .pv-f--wx { opacity: 0.45; }

/* советы, вопросы, призыв */
.pv-extra { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; padding: 10px 0 30px; }
.pv-box { background: var(--card); border-radius: var(--pv-r); padding: clamp(20px, 2.4vw, 30px); box-shadow: var(--shadow), inset 0 0 0 1px var(--line); }
.pv-box h2 { margin: 0 0 12px; font-size: 22px; color: var(--ink); }
.pv-tips ul { margin: 0; padding-left: 20px; display: grid; gap: 10px; color: var(--ink-2); line-height: 1.5; }
.pv-q { border-top: 1px solid var(--line); padding: 12px 0; }
.pv-q:first-of-type { border-top: 0; }
.pv-q summary { cursor: pointer; font-weight: 700; color: var(--ink); list-style: none; display: flex; justify-content: space-between; gap: 10px; }
.pv-q summary::after { content: "+"; color: var(--accent-text); font-weight: 800; transition: transform 0.2s; }
.pv-q[open] summary::after { transform: rotate(45deg); }
.pv-q p { margin: 8px 0 0; color: var(--ink-2); line-height: 1.55; }
.pv-cta { background: linear-gradient(140deg, #0e6c84, #2a5be0); color: #fff; box-shadow: 0 20px 40px -24px rgba(14, 108, 132, 0.8); }
.pv-cta h2 { color: #fff; }
.pv-cta p { color: rgba(255, 255, 255, 0.9); line-height: 1.55; }
.pv-cta { display: flex; flex-direction: column; align-items: flex-start; align-self: start; }
.pv-cta p { margin: 0 0 24px; }
.pv-cta .btn--primary { background: #fff; color: #0a2c39; }

/* карточки статей (хаб и «еще поводы») */
.pv-more, .pv-hub section { padding: 10px 0 30px; }
.pv-h, .pv-more h2 { font-size: clamp(24px, 2.6vw, 32px); color: var(--ink); margin: 0 0 16px; }
.pv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.pv-grid--now { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.pv-card { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: 300px; border-radius: var(--pv-r); overflow: hidden; color: #fff; text-decoration: none;
  box-shadow: var(--shadow); transition: transform 0.35s var(--pv-ease), box-shadow 0.35s; }
.pv-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 0.9s var(--pv-ease); }
.pv-card__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4, 18, 28, 0) 30%, rgba(4, 18, 28, 0.85)); }
.pv-card__in { display: grid; gap: 8px; padding: 18px; justify-items: start; }
.pv-card b { font-size: 22px; line-height: 1.15; letter-spacing: -0.02em; }
.pv-card small { color: rgba(255, 255, 255, 0.85); font-size: 13.5px; }
.pv-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.pv-card:hover img { transform: scale(1.05); }
.pv-card--big { grid-column: span 2; min-height: 420px; }
.pv-card--big b { font-size: clamp(26px, 3vw, 36px); }
.pv-hub__head { padding: clamp(28px, 5vw, 64px) 0 10px; display: grid; gap: 14px; }
.pv-hub__head h1 { margin: 0; font-size: clamp(36px, 5vw, 60px); letter-spacing: -0.04em; color: var(--ink); }
.pv-hub .pv-lead { color: var(--ink-2); }

.pv-src { padding: 0 0 40px; color: var(--muted); }
.pv-src h2 { font-size: 18px; color: var(--ink-2); margin: 0 0 8px; }
.pv-src ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; }
.pv-src a { color: var(--muted); }
.pv-upd { font-size: 13px; margin: 12px 0 0; }

/* появление блоков при прокрутке (класс ставит povody.js) */
.pv-rise { opacity: 0; transform: translateY(18px); transition: opacity 0.7s var(--pv-ease), transform 0.7s var(--pv-ease); }
.pv-rise.is-in { opacity: 1; transform: none; }

@media (max-width: 860px) {
  .pv-place { grid-template-columns: 1fr; }
  .pv-place:nth-child(even) .pv-ph { order: 0; }
  .pv-ph { position: relative; top: 0; aspect-ratio: 16 / 10; }
  .pv-card--big { grid-column: auto; min-height: 340px; }
  .pv-bar__w { display: none; }
  .pv-bar__cta { margin-left: 0; }
}
@media (max-width: 520px) {
  .pv-bar__in { gap: 8px; }
  .pv-bar__cta { display: none; }
  .pv-hero { min-height: 520px; }
}
@media (prefers-reduced-motion: reduce) {
  .pv-hero__img { animation: none; transform: none; }
  .pv-rise { opacity: 1; transform: none; transition: none; }
  .pv-card, .pv-card img, .pv-ph img, .pv-toc a, .pv-price { transition: none; }
}

/* общее правило сайта img[width][height] { height: auto } сильнее по весу: фото «Поводов» должны заполнять рамку целиком */
.pv-card img[width][height], .pv-hero img.pv-hero__img[width][height], .pv-ph img[width][height] { height: 100%; }

/* поиск города вылета рядом со списком популярных */
.pv-find { position: relative; display: inline-block; }
.pv-q { font: inherit; font-size: 15px; width: 190px; padding: 9px 12px; border-radius: 12px; border: 0; background: var(--card-2); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2); }
.pv-q:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.pv-res { position: absolute; left: 0; top: calc(100% + 6px); z-index: 30; min-width: 260px; max-height: 320px; overflow: auto; display: grid; padding: 6px; border-radius: 16px;
  background: var(--card); box-shadow: var(--shadow-lg), inset 0 0 0 1px var(--line-2); }
.pv-res[hidden] { display: none; }
.pv-res__i { text-align: left; padding: 10px 12px; border-radius: 10px; background: none; border: 0; color: var(--ink); font: inherit; font-size: 15px; cursor: pointer; }
.pv-res__i:hover, .pv-res__i:focus { background: var(--accent-soft); outline: none; }
@media (max-width: 520px) {                                 /* выбор города не шире экрана: поле поиска занимает остаток строки (было 140px — страница уезжала вбок на 375px) */
  .pv-bar__l { flex-wrap: wrap; row-gap: 6px; min-width: 0; max-width: 100%; }
  .pv-find { flex: 1 1 110px; min-width: 0; }
  .pv-q { width: 100%; min-width: 0; }
}


/* лис-талисман FoxAway: стикер с прозрачным фоном на обложке статьи, карточках и в шапке списка */
.pv-fox { display: block; pointer-events: none; user-select: none; filter: drop-shadow(0 10px 18px rgba(4, 18, 28, 0.35)); }
.pv-hero__fox { position: absolute; left: 0; right: 0; bottom: clamp(36px, 6vw, 72px); z-index: 0; display: flex; justify-content: flex-end; pointer-events: none; }
.pv-hero img.pv-hero__foxi { position: static; width: auto; height: clamp(150px, 17vw, 230px); animation: pv-fox-in 0.9s var(--pv-ease) 0.25s both; }
.pv-card img.pv-card__fox { position: absolute; inset: 12px 12px auto auto; width: auto; height: 92px; z-index: 0; object-fit: contain; transition: transform 0.5s var(--pv-ease); }
.pv-card--big img.pv-card__fox { height: 132px; }
.pv-card:hover img.pv-card__fox { transform: translateY(-4px) rotate(-5deg); }
.pv-hub__head { position: relative; }
.pv-hub__head img.pv-hub__fox { position: absolute; right: 0; top: clamp(16px, 3vw, 40px); width: auto; height: clamp(96px, 13vw, 170px); }
.pv-hub__head h1, .pv-hub__head .pv-lead { padding-right: clamp(96px, 15vw, 190px); }
.pv-hero .pv-lead { max-width: min(62ch, calc(100% - clamp(150px, 17vw, 230px) - 24px)); }     /* текст не заезжает на лиса */
@keyframes pv-fox-in { from { opacity: 0; transform: translateY(18px) rotate(4deg); } to { opacity: 1; transform: none; } }
@media (max-width: 860px) {
  .pv-hero { padding-top: 112px; }                        /* место под лиса над текстом, даже если вступление длинное */
  .pv-hero__fox { bottom: auto; top: 14px; }
  .pv-hero img.pv-hero__foxi { height: 92px; }
  .pv-hero .pv-lead { max-width: 62ch; }
}
@media (max-width: 520px) {
  .pv-card img.pv-card__fox, .pv-card--big img.pv-card__fox { height: 76px; }
  .pv-hub__head .pv-lead { padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) { .pv-hero img.pv-hero__foxi { animation: none; } .pv-card:hover img.pv-card__fox { transform: none; } }

/* темы на /povody/: липкий ряд чипов под шапкой сайта (как .pv-bar), фильтр — povody.js по data-topics карточек; без JS скрыт */
.pv-topics { position: sticky; top: 64px; z-index: 20; margin: 6px 0 14px; background: var(--glass); backdrop-filter: blur(26px) saturate(1.4); -webkit-backdrop-filter: blur(26px) saturate(1.4);
  box-shadow: inset 0 -1px 0 var(--line-2), 0 10px 30px -24px rgba(0, 0, 0, 0.5); }
.pv-topics__in { position: relative; display: flex; gap: 8px; overflow-x: auto; padding: 10px 0; scrollbar-width: none; }
.pv-topics__in::-webkit-scrollbar { display: none; }
.pv-topic { flex: none; display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 8px 14px; border: 0; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: 14.5px; font-weight: 700; color: var(--ink); background: var(--card); box-shadow: inset 0 0 0 1px var(--line-2);
  transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.2s var(--pv-ease); }
.pv-topic:hover { transform: translateY(-1px); box-shadow: inset 0 0 0 1px var(--accent); }
.pv-topic:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.pv-topic__n { font-size: 12.5px; font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; }
.pv-topic[aria-pressed="true"] { background: var(--accent); color: var(--accent-ink); box-shadow: 0 10px 20px -12px var(--accent-glow); }
.pv-topic[aria-pressed="true"] .pv-topic__n { color: inherit; opacity: 0.8; }
.pv-hub .pv-sec { scroll-margin-top: 136px; }
.pv-none { padding: 10px 0 40px; color: var(--muted); }
.pv-none__all { font: inherit; font-weight: 700; color: var(--accent-text); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; }
.pv-topics[hidden], .pv-hub .pv-sec[hidden], .pv-card[hidden], .pv-none[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .pv-topic { transition: none; } }