/* =========================================================
   Раздел «Погода» (/pogoda/…, page-pogoda.php, inc/pogoda.php) — в стиле 2027.
   Токены макета: текст #16140f, серый #6b6f67, светло-серый #9aa096,
   акцент #E86B18, фон #f4f4f4, тёплый #faf6f1, рамки #e7e7e1, линии #eeeee9.
   Цвета температур (синий холод → оранжевое тепло) приходят из разметки.
   Mobile-first: 600 / 900 / 1200.
   ========================================================= */

.pg-page {
  padding-bottom: 96px;
  color: #16140f;
  font-family: 'Onest', system-ui, sans-serif;
  line-height: normal;
}

.pg-page *,
.pg-page *::before,
.pg-page *::after {
  box-sizing: border-box;
}

.pg-ic {
  display: block;
  flex: none;
}

/* ---------- Заголовок ---------- */

.pg-head {
  max-width: 820px;
  margin: 16px 0 24px;
}

.pg-page .pg-h1 {
  margin: 0;
  color: #16140f;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.03em;
}

.pg-lead {
  margin: 14px 0 0;
  color: #16140f;
  font-size: 16px;
  line-height: 1.55;
}

.pg-sec {
  margin-top: 56px;
}

.pg-sec__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 24px;
  margin-bottom: 20px;
}

.pg-page .pg-h2 {
  margin: 0;
  color: #16140f;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.02em;
}

.pg-page .pg-h2 a {
  color: inherit;
  text-decoration: none;
}

.pg-page .pg-h2 a:hover {
  color: #E86B18;
}

.pg-sec__note {
  margin: 0;
  color: #6b6f67;
  font-size: 14px;
}

/* ---------- Капсулы месяцев ---------- */

.pg-months {
  position: relative;
  margin: 0 -20px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.pg-months::-webkit-scrollbar {
  display: none;
}

.pg-months__list {
  display: flex;
  gap: 8px;
  width: max-content;
  margin: 0;
  padding: 2px 20px;
  list-style: none;
}

.pg-months__list li {
  margin: 0;
  padding: 0;
}

.pg-months__item {
  display: flex;
  min-width: 76px;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 14px;
  border: 1px solid #e7e7e1;
  border-radius: 14px;
  background: #fff;
  color: #16140f;
  text-decoration: none;
  transition: border-color .15s, background-color .15s;
}

.pg-months__item:hover {
  border-color: #16140f;
  color: #16140f;
}

.pg-months__name {
  font-size: 14px;
  font-weight: 500;
}

.pg-months__t {
  color: #6b6f67;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.pg-months__item.is-active {
  border-color: #E86B18;
  background: #E86B18;
  color: #fff;
}

.pg-months__item.is-active .pg-months__t {
  color: rgba(255, 255, 255, .85);
}

/* ---------- Главный виджет: город, температура, плитки ---------- */

.pg-hero {
  position: relative;
  margin-top: 24px;
  padding: 16px;
  border-radius: 24px;
  background: #f4f4f4;
}

.pg-radio {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  opacity: 0;
}

.pg-places {
  display: flex;
  gap: 6px;
  margin: 0 -16px 16px;
  padding: 0 16px;
  overflow-x: auto;
  scrollbar-width: none;
}

.pg-places::-webkit-scrollbar {
  display: none;
}

.pg-place {
  flex: none;
  padding: 8px 14px;
  border: 1px solid #dcdcd5;
  border-radius: 999px;
  background: #fff;
  color: #16140f;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: border-color .15s;
}

.pg-place:hover {
  border-color: #16140f;
}

.pg-panel {
  display: none;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.pg-now {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px;
  overflow: hidden;
  border-radius: 20px;
  background: #fff;
}

.pg-now__place {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  margin: 0;
  color: #16140f;
  font-size: 15px;
  font-weight: 600;
}

.pg-now__place .pg-ic {
  color: #E86B18;
}

.pg-now__note {
  color: #9aa096;
  font-size: 13px;
  font-weight: 400;
}

.pg-now__main {
  display: flex;
  align-items: center;
  gap: 20px;
}

.pg-now__icon {
  display: grid;
  width: 88px;
  height: 88px;
  flex: none;
  place-items: center;
  border-radius: 24px;
  background: #faf6f1;
  color: #E86B18;
}

.pg-now--snow .pg-now__icon,
.pg-now--mixed .pg-now__icon {
  background: #eef3f9;
  color: #3f74b5;
}

.pg-now__temps {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
}

.pg-now__row {
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.pg-now__row dt {
  width: 52px;
  color: #6b6f67;
  font-size: 14px;
}

.pg-now__row dd {
  position: relative;
  margin: 0;
  color: #16140f;
  font-size: 44px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.03em;
  white-space: nowrap;
}

.pg-now__row--night dd {
  color: #6b6f67;
  font-size: 30px;
}

.pg-now__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin: 0;
  padding-top: 14px;
  border-top: 1px solid #eeeee9;
  color: #6b6f67;
  font-size: 14px;
}

.pg-now__meta b {
  color: #16140f;
  font-weight: 600;
  white-space: nowrap;
}

.pg-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-tile {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 16px;
  border-radius: 20px;
  background: #fff;
}

.pg-tile__ic {
  display: grid;
  width: 40px;
  height: 40px;
  margin-bottom: 8px;
  place-items: center;
  border-radius: 12px;
  background: #f4f4f4;
  color: #16140f;
}

.pg-tile__t {
  color: #6b6f67;
  font-size: 13px;
  font-weight: 500;
}

.pg-tile__v {
  color: #16140f;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.02em;
}

.pg-tile__v small {
  color: #6b6f67;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
}

.pg-tile__l {
  margin-top: -2px;
  color: #16140f;
  font-size: 14px;
  line-height: 1.35;
}

.pg-tile__n {
  color: #6b6f67;
  font-size: 13px;
  line-height: 1.45;
}

.pg-tile--white .pg-tile__ic {
  background: #faf6f1;
  color: #E86B18;
}

/* ---------- Города с юга на север ---------- */

.pg-cities__list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #eeeee9;
}

.pg-city {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    'name x'
    'scale scale';
  align-items: center;
  gap: 10px 16px;
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid #eeeee9;
}

.pg-city__name {
  display: flex;
  min-width: 0;
  flex-direction: column;
  grid-area: name;
}

.pg-city__name b {
  font-size: 16px;
  font-weight: 600;
}

.pg-city__name small {
  color: #9aa096;
  font-size: 13px;
}

.pg-city.is-main .pg-city__name b::after {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 8px;
  border-radius: 50%;
  background: #E86B18;
  vertical-align: middle;
}

.pg-city__scale {
  position: relative;
  height: 32px;
  grid-area: scale;
  border-radius: 999px;
  background: #f4f4f4;
}

.pg-city__zero {
  position: absolute;
  top: -4px;
  bottom: -4px;
  left: var(--pg-zero);
  width: 1px;
  background: #c9c9c0;
}

.pg-city__bar {
  position: absolute;
  top: 4px;
  bottom: 4px;
  display: flex;
  min-width: 84px;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  border-radius: 999px;
}

.pg-city__v {
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 2px rgba(20, 18, 12, .25);
}

.pg-city__x {
  display: flex;
  align-items: center;
  gap: 6px;
  grid-area: x;
  color: #6b6f67;
  font-size: 14px;
  white-space: nowrap;
}

/* ---------- Что взять с собой ---------- */

.pg-pack__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-pack__item {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  padding: 10px 14px 10px 10px;
  border: 1px solid #e7e7e1;
  border-radius: 16px;
  font-size: 15px;
  line-height: 1.35;
}

.pg-pack__ic {
  display: grid;
  width: 44px;
  height: 44px;
  flex: none;
  place-items: center;
  border-radius: 12px;
  background: #f4f4f4;
}

/* ---------- Туры ---------- */

.pg-tours__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px 16px;
}

.pg-tour {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.pg-tour > .tour-card {
  width: 100%;
  flex: 1 1 auto;
}

.pg-page .pg-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  color: #16140f;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
}

.pg-more .pg-ic {
  color: #E86B18;
  transition: transform .15s;
}

.pg-page .pg-more:hover {
  color: #E86B18;
}

.pg-more:hover .pg-ic {
  transform: translateX(3px);
}

/* ---------- График года ---------- */

.pg-year__chart {
  display: grid;
  position: relative;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 0 4px;
  padding: 16px 8px 12px;
  border-radius: 24px;
  background: #f4f4f4;
}

.pg-year__zero {
  position: absolute;
  top: 16px;
  right: 8px;
  left: 8px;
  height: 200px;
  pointer-events: none;
}

.pg-year__zero::before {
  content: '';
  position: absolute;
  right: 0;
  bottom: var(--pg-zero);
  left: 0;
  border-top: 1px dashed #c9c9c0;
}

.pg-year__zero span {
  position: absolute;
  bottom: var(--pg-zero);
  left: 0;
  color: #9aa096;
  font-size: 11px;
  transform: translateY(-2px);
}

.pg-year__col {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  border-radius: 12px;
  color: #16140f;
  text-decoration: none;
}

.pg-year__track {
  position: relative;
  display: block;
  width: 100%;
  height: 200px;
}

.pg-year__bar {
  position: absolute;
  left: 50%;
  width: 100%;
  max-width: 26px;
  border-radius: 999px;
  opacity: .78;
  transform: translateX(-50%);
  transition: opacity .15s;
}

.pg-year__v {
  position: absolute;
  left: 50%;
  color: #6b6f67;
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  transform: translateX(-50%);
}

.pg-year__v--day {
  bottom: 100%;
  margin-bottom: 4px;
  color: #16140f;
}

.pg-year__v--night {
  top: 100%;
  margin-top: 4px;
}

.pg-year__m {
  margin-top: 24px;
  padding: 2px 3px;
  border-radius: 999px;
  color: #6b6f67;
  font-size: 11px;
  font-weight: 500;
}

.pg-year__x {
  margin-top: 6px;
  color: #9aa096;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.pg-year__x--prcp {
  margin-top: 10px;
}

.pg-year__col:hover .pg-year__bar,
.pg-year__col.is-active .pg-year__bar {
  opacity: 1;
}

.pg-year__col.is-active .pg-year__m {
  background: #E86B18;
  color: #fff;
}

.pg-year__col.is-active .pg-year__v {
  color: #16140f;
  font-weight: 700;
}

.pg-year__legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px 16px;
  margin-top: 12px;
  grid-column: 1 / -1;
  color: #9aa096;
  font-size: 12px;
}

.pg-year__lx {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* ---------- Карточки месяцев (страница региона) ---------- */

.pg-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-cards li {
  margin: 0;
}

.pg-card {
  display: flex;
  height: 100%;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border: 1px solid #e7e7e1;
  border-radius: 20px;
  background: #fff;
  color: #16140f;
  text-decoration: none;
  transition: border-color .15s, box-shadow .15s;
}

.pg-card:hover {
  border-color: #16140f;
  color: #16140f;
}

.pg-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pg-card__name {
  font-size: 17px;
  font-weight: 600;
}

.pg-card__ic {
  color: #E86B18;
}

.pg-card--snow .pg-card__ic,
.pg-card--mixed .pg-card__ic {
  color: #3f74b5;
}

.pg-card__temps {
  display: flex;
  flex-direction: column;
}

.pg-card__day {
  font-size: 32px;
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -.03em;
}

.pg-card__night {
  color: #6b6f67;
  font-size: 14px;
}

.pg-card__facts {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid #eeeee9;
  color: #6b6f67;
  font-size: 13px;
}

.pg-card__facts span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* ---------- Список регионов ---------- */

.pg-region .pg-months {
  margin-top: 4px;
}

/* ---------- Текст, статья блога, соседние месяцы ---------- */

.pg-text {
  max-width: 760px;
  color: #16140f;
  font-size: 16px;
  line-height: 1.65;
}

.pg-text > :first-child {
  margin-top: 0;
}

.pg-text p {
  margin: 0 0 14px;
}

.pg-text h2 {
  margin: 40px 0 16px;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.02em;
}

.pg-text h3 {
  margin: 28px 0 12px;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.3;
}

.pg-text a {
  color: #E86B18;
}

.pg-page .pg-blog {
  display: grid;
  max-width: 760px;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 16px;
  margin-top: 32px;
  padding: 18px 20px;
  border-radius: 20px;
  background: #faf6f1;
  color: #16140f;
  text-decoration: none;
}

.pg-blog__k {
  color: #6b6f67;
  font-size: 13px;
}

.pg-blog__t {
  grid-row: 2;
  font-size: 17px;
  font-weight: 600;
}

.pg-blog .pg-ic {
  grid-row: 1 / 3;
  grid-column: 2;
  color: #E86B18;
}

.pg-pn {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pg-page .pg-pn__a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 2px 12px;
  padding: 16px;
  border: 1px solid #e7e7e1;
  border-radius: 20px;
  color: #16140f;
  text-decoration: none;
}

.pg-page .pg-pn__a:hover {
  border-color: #16140f;
  color: #16140f;
}

.pg-pn__a .pg-ic {
  grid-row: 1 / 3;
  color: #E86B18;
}

.pg-pn__t {
  font-size: 15px;
  font-weight: 600;
}

.pg-pn__v {
  color: #6b6f67;
  font-size: 13px;
}

/* «Следующий месяц»: текст прижат вправо, стрелка у правого края (09.11.2026). С .pg-page,
   иначе правило .pg-page .pg-pn__a выше по силе и колонки остаются «стрелка | текст». */
.pg-page .pg-pn__a--next {
  grid-template-columns: minmax(0, 1fr) auto;
  text-align: right;
}

.pg-pn__a--next .pg-ic {
  grid-column: 2;
}

.pg-pn__a--next .pg-pn__t,
.pg-pn__a--next .pg-pn__v {
  grid-column: 1;
}

.pg-source {
  max-width: 760px;
  margin: 40px 0 0;
  color: #9aa096;
  font-size: 13px;
  line-height: 1.5;
}

/* ---------- Погода по дням ---------- */

.pg-days {
  position: relative;
}

.pg-days .pg-places {
  margin: 0 -20px 16px;
  padding: 0 20px;
}

.pg-days__grid {
  display: none;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-day {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 10px 10px 14px;
  overflow: hidden;
  border: 1px solid #e7e7e1;
  border-radius: 14px;
  background: #fff;
}

.pg-day__n {
  margin-bottom: 4px;
  color: #16140f;
  font-size: 16px;
  font-weight: 600;
}

.pg-day__t {
  color: #16140f;
  font-size: 15px;
  white-space: nowrap;
}

.pg-day__t b {
  font-weight: 600;
}

.pg-day__t--night {
  color: #6b6f67;
  font-size: 13px;
}

.pg-day__l {
  display: none;
}

.pg-day__bar {
  position: absolute;
  right: 10px;
  bottom: 6px;
  left: 10px;
  height: 3px;
  border-radius: 999px;
  opacity: .85;
}

/* ---------- ≥600 ---------- */

@media (min-width: 600px) {
  .pg-page .pg-h1 {
    font-size: 40px;
  }

  .pg-lead {
    font-size: 17px;
  }

  .pg-months {
    margin: 0;
    overflow: visible;
  }

  .pg-months__list {
    display: grid;
    width: auto;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    padding: 0;
  }

  .pg-months__item {
    min-width: 0;
  }

  .pg-hero {
    padding: 20px;
  }

  .pg-places {
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 0;
    overflow: visible;
  }

  .pg-days .pg-places {
    margin: 0 0 16px;
    padding: 0;
  }

  .pg-days__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .pg-city {
    grid-template-columns: 200px minmax(0, 1fr) 90px;
    grid-template-areas: 'name scale x';
  }

  .pg-city__x {
    justify-content: flex-end;
  }

  .pg-pack__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pg-tours__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pg-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pg-year__chart {
    gap: 0 8px;
    padding: 20px 20px 16px;
  }

  .pg-year__zero {
    top: 20px;
    right: 20px;
    left: 20px;
  }

  .pg-year__v {
    font-size: 12px;
  }

  .pg-year__m {
    padding: 2px 6px;
    font-size: 13px;
  }

  .pg-year__x {
    font-size: 12px;
  }
}

/* ---------- ≥900 ---------- */

@media (min-width: 900px) {
  .pg-head {
    margin-bottom: 32px;
  }

  .pg-sec {
    margin-top: 72px;
  }

  .pg-page .pg-h2 {
    font-size: 30px;
  }

  .pg-months__list {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .pg-months__item {
    align-items: center;
    padding: 10px 6px;
  }

  .pg-hero {
    padding: 24px;
  }

  .pg-panel {
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: 16px;
  }

  .pg-now {
    justify-content: space-between;
    padding: 28px;
  }

  .pg-now__icon {
    width: 104px;
    height: 104px;
  }

  .pg-now__row dd {
    font-size: 64px;
  }

  .pg-now__row--night dd {
    font-size: 40px;
  }

  .pg-tiles {
    gap: 16px;
  }

  .pg-tile {
    padding: 20px;
  }

  .pg-tile__v {
    font-size: 28px;
  }

  .pg-pack__list {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  }

  .pg-tours__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pg-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }

  .pg-days__grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 12px;
  }

  .pg-day {
    padding: 16px 16px 20px;
    border-radius: 16px;
  }

  .pg-day__n {
    margin-bottom: 8px;
    font-size: 18px;
  }

  .pg-day__t,
  .pg-day__t--night {
    font-size: 15px;
  }

  .pg-day__l {
    display: inline;
    color: #6b6f67;
  }

  .pg-day__bar {
    right: 16px;
    bottom: 10px;
    left: 16px;
  }

  .pg-year__track,
  .pg-year__zero {
    height: 240px;
  }

  .pg-city {
    grid-template-columns: 260px minmax(0, 1fr) 100px;
    gap: 10px 24px;
  }

  .pg-city__scale {
    height: 36px;
  }

  .pg-city__v {
    font-size: 14px;
  }
}

/* ---------- ≥1200 ---------- */

@media (min-width: 1200px) {
  .pg-page .pg-h1 {
    font-size: 48px;
  }

  .pg-tours__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .pg-cards {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

/* =========================================================
   Вид «как Яндекс Погода» (макет Ивана 09.11.2026): страница месяца.
   «Небо» по месяцу, карта региона, плитки, солнце и луна, погода по дням.
   Город переключается радиокнопками .pg-sw (стили — season_pogoda_switch_css()).
   ========================================================= */

.pg-vh {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Небо месяца: цвета градиента */
.pg-grad { background: linear-gradient(160deg, var(--pg-s1) 0%, var(--pg-s2) 55%, var(--pg-s3) 100%); }
.pg-m1  { --pg-s1: #1d3a78; --pg-s2: #3561b3; --pg-s3: #5f8bd6; }
.pg-m2  { --pg-s1: #244a90; --pg-s2: #3f72c6; --pg-s3: #6c9be0; }
.pg-m3  { --pg-s1: #2c5aa8; --pg-s2: #4a82d2; --pg-s3: #78a8e6; }
.pg-m4  { --pg-s1: #2f68b8; --pg-s2: #4c8dd8; --pg-s3: #7fb2ea; }
.pg-m5  { --pg-s1: #2471c0; --pg-s2: #3f95dc; --pg-s3: #73b6ec; }
.pg-m6  { --pg-s1: #1f78c8; --pg-s2: #3a9be2; --pg-s3: #6cbcf0; }
.pg-m7  { --pg-s1: #1a74c6; --pg-s2: #3698e0; --pg-s3: #66b6ee; }
.pg-m8  { --pg-s1: #2468b3; --pg-s2: #4489d2; --pg-s3: #74abe3; }
.pg-m9  { --pg-s1: #355d98; --pg-s2: #557fba; --pg-s3: #82a2cf; }
.pg-m10 { --pg-s1: #3f5578; --pg-s2: #5b7299; --pg-s3: #8395b5; }
.pg-m11 { --pg-s1: #2f3a58; --pg-s2: #4a5a80; --pg-s3: #6e7ea3; }
.pg-m12 { --pg-s1: #1a2750; --pg-s2: #2e447a; --pg-s3: #55699e; }

.pg-v2 .pg-head { max-width: 860px; }

/* ---------- «Небо» и карта ---------- */

.pg-hero2 {
  display: grid;
  gap: 16px;
  margin-top: 24px;
}

.pg-sky {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-height: 440px;
  padding: 20px;
  border-radius: 28px;
  color: #fff;
  text-shadow: 0 1px 2px rgba(8, 20, 50, .18);
}

.pg-sky p { margin: 0; }

.pg-sky__p {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.pg-sky__fx {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.pg-sky__fx::before,
.pg-sky__fx::after {
  content: '';
  position: absolute;
  inset: 0;
}

.pg-fx--snow::before {
  background-image:
    radial-gradient(circle at 12% 18%, #fff 0 1.6px, transparent 2.2px),
    radial-gradient(circle at 46% 62%, rgba(255, 255, 255, .85) 0 1.2px, transparent 1.8px),
    radial-gradient(circle at 78% 34%, #fff 0 1.9px, transparent 2.5px),
    radial-gradient(circle at 30% 88%, rgba(255, 255, 255, .75) 0 1.1px, transparent 1.6px),
    radial-gradient(circle at 88% 82%, rgba(255, 255, 255, .9) 0 1.5px, transparent 2px),
    radial-gradient(circle at 62% 8%, rgba(255, 255, 255, .8) 0 1.3px, transparent 1.8px);
  background-size: 180px 180px;
  animation: pgSnow 15s linear infinite;
}

.pg-fx--snow::after {
  background-image:
    radial-gradient(circle at 20% 40%, rgba(255, 255, 255, .7) 0 2.4px, transparent 3px),
    radial-gradient(circle at 70% 70%, rgba(255, 255, 255, .55) 0 2px, transparent 2.6px),
    radial-gradient(circle at 85% 15%, rgba(255, 255, 255, .6) 0 2.6px, transparent 3.2px);
  background-size: 260px 260px;
  animation: pgSnow2 24s linear infinite;
}

/* Дождь: крупные капли в два слоя (Иван 09.11: «помедленнее, большие капли»). Дальние
   поменьше и бледнее, ближние длиннее и ярче. Размеры плиток взаимно простые, чтобы не было видно сетки;
   за один цикл каждый слой сдвигается ровно на свою высоту (или вдвое), поэтому без рывков. */
.pg-fx--rain::before,
.pg-fx--rain::after {
  inset: -35% -25%;
  transform: rotate(13deg);
}

.pg-fx--rain::before {
  background-image:
    radial-gradient(1.8px 10px at 17px 29px, rgba(255, 255, 255, .6), rgba(255, 255, 255, 0)),
    radial-gradient(1.8px 11px at 61px 121px, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0)),
    radial-gradient(2px 12px at 38px 83px, rgba(255, 255, 255, .6), rgba(255, 255, 255, 0));
  background-size: 79px 157px, 103px 199px, 127px 229px;
  animation: pgRainFar 1.6s linear infinite;
}

.pg-fx--rain::after {
  background-image:
    radial-gradient(2.6px 16px at 41px 66px, rgba(255, 255, 255, .85), rgba(255, 255, 255, 0)),
    radial-gradient(2.4px 18px at 131px 212px, rgba(255, 255, 255, .75), rgba(255, 255, 255, 0));
  background-size: 163px 283px, 211px 331px;
  animation: pgRainNear 1.4s linear infinite;
}

.pg-fx--sun::before {
  background: radial-gradient(circle at 88% 6%, rgba(255, 236, 170, .55), rgba(255, 236, 170, 0) 42%);
}

@keyframes pgSnow { from { background-position: 0 0; } to { background-position: 60px 180px; } }
@keyframes pgSnow2 { from { background-position: 0 0; } to { background-position: -40px 260px; } }
@keyframes pgRainFar {
  from { background-position: 0 0, 0 0, 0 0; }
  to { background-position: 0 314px, 0 398px, 0 458px; }
}
@keyframes pgRainNear {
  from { background-position: 0 0, 0 0; }
  to { background-position: 0 566px, 0 662px; }
}

@media (prefers-reduced-motion: reduce) {
  .pg-sky__fx::before,
  .pg-sky__fx::after { animation: none; }
}

.pg-sky__top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 12px;
}

.pg-sky__place {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 20px;
  font-weight: 600;
}

.pg-sky__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .2);
  font-size: 14px;
  font-weight: 500;
}

.pg-sky__badge i {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #ffd54a;
  color: #16140f;
  font-style: normal;
  font-weight: 700;
  font-size: 15px;
  text-shadow: none;
}

.pg-sky__now {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
}

.pg-sky__big {
  display: flex;
  flex-direction: column;
}

.pg-sky__t {
  font-size: 84px;
  font-weight: 600;
  line-height: .95;
  letter-spacing: -.04em;
}

.pg-sky__cap {
  margin-top: 4px;
  font-size: 14px;
  opacity: .9;
}

.pg-sky__ic {
  display: block;
  width: 84px;
  height: 84px;
}

.pg-sky__txt {
  flex: 1 1 200px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pg-sky__kind {
  font-size: 22px;
  font-weight: 600;
}

.pg-sky__line {
  font-size: 15px;
  line-height: 1.4;
}

.pg-sky__line b { font-weight: 600; }

.pg-sky__row {
  margin-top: auto;
  display: flex;
  gap: 4px;
  overflow-x: auto;
  padding: 6px;
  border-radius: 20px;
  background: rgba(6, 22, 58, .22);
  scrollbar-width: none;
}

.pg-sky__row::-webkit-scrollbar { display: none; }

.pg-sky__city {
  flex: 1 0 auto;
  min-width: 86px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 10px 8px;
  border-radius: 14px;
  cursor: pointer;
  transition: background .15s;
}

.pg-sky__city:hover { background: rgba(255, 255, 255, .12); }
.pg-sky__city img { display: block; width: 36px; height: 36px; }
.pg-sky__cn { font-size: 13px; white-space: nowrap; }
.pg-sky__ct { font-size: 18px; font-weight: 600; }
.pg-sky__cnt { font-size: 13px; opacity: .85; }

.pg-map {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border-radius: 28px;
  background: #eef4fb;
}

.pg-map__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin: 0;
  padding: 4px 8px 0;
  color: #5d6470;
  font-size: 14px;
}

.pg-map__head b {
  color: #16140f;
  font-size: 16px;
  font-weight: 600;
}

.pg-map__box {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  background: #d6e8f8;
}

.pg-map__img {
  display: block;
  width: 100%;
  height: auto;
}

.pg-map__lb {
  position: absolute;
  transform: translate(-50%, -50%);
  color: #3f6aa6;
  font-size: 12px;
  font-style: italic;
  white-space: nowrap;
  pointer-events: none;
}

.pg-map__lb.is-land {
  color: #6b6f67;
  font-style: normal;
}

.pg-map__dot {
  position: absolute;
  width: 32px;
  height: 32px;
  margin: -16px 0 0 -16px;
  cursor: pointer;
}

.pg-map__dot::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  border-radius: 50%;
  background: #16140f;
  box-shadow: 0 0 0 3px #fff;
}

.pg-map__chip {
  position: absolute;
  left: 26px;
  top: 50%;
  transform: translateY(-50%);
  padding: 4px 10px;
  border-radius: 999px;
  background: #fff;
  color: #16140f;
  font-size: 13px;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(22, 20, 15, .14);
}

.pg-map__chip b {
  margin-left: 2px;
  font-weight: 600;
}

.pg-map__pin {
  display: none;
  position: absolute;
  left: 50%;
  bottom: 50%;
  width: 26px;
  height: 26px;
  margin: 0 0 6px -13px;
  border-radius: 50% 50% 50% 0;
  background: #E86B18;
  transform: rotate(-45deg);
  box-shadow: 0 3px 8px rgba(0, 0, 0, .22);
}

.pg-map__pin::after {
  content: '';
  position: absolute;
  left: 8px;
  top: 8px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
}

/* ---------- Кнопки-якоря ---------- */

.pg-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.pg-page .pg-chip {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  background: #f4f4f4;
  color: #16140f;
  font-size: 15px;
  text-decoration: none;
  transition: background .15s;
}

.pg-page .pg-chip:hover {
  background: #ebebe5;
  color: #16140f;
}

/* ---------- Главное о месяце и плитки ---------- */

.pg-sum2 {
  display: grid;
  gap: 12px;
  margin-top: 32px;
}

.pg-sum2__card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px 22px;
  border-radius: 24px;
  background: #eef4fb;
}

.pg-page .pg-sum2__t {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: #16140f;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
}

.pg-sum2__t img {
  display: block;
  width: 40px;
  height: 40px;
}

.pg-sum2__text {
  margin: 0;
  color: #2b2d29;
  font-size: 16px;
  line-height: 1.55;
}

.pg-params {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-param {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  padding: 16px 10px;
  border-radius: 24px;
  background: #eef4fb;
  text-align: center;
}

.pg-param__ic {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: 4px;
  border-radius: 50%;
}

.pg-param__ic--blue { background: #dcebff; color: #2f62b8; }
.pg-param__ic--sky  { background: #e4efff; color: #2f62b8; }
.pg-param__ic--sun  { background: #fff0c7; color: #b45309; }
.pg-param__ic--cold { background: #dfe7ff; color: #2f62b8; }
.pg-param__ic--hot  { background: #ffe6d5; color: #c2410c; }
.pg-param__ic--grey { background: #efefe9; color: #4b4e48; }

.pg-param__l,
.pg-param__s {
  color: #5d6470;
  font-size: 13px;
  line-height: 1.3;
}

.pg-param__v {
  font-size: 18px;
  font-weight: 600;
}

/* ---------- Солнце, луна, сияние ---------- */

.pg-skyinfo__grid {
  display: grid;
  gap: 12px;
}

.pg-card2 {
  padding: 20px 22px;
  border: 1px solid #e7e7e1;
  border-radius: 24px;
  background: #fff;
}

.pg-page .pg-card2__h {
  margin: 0 0 6px;
  color: #16140f;
  font-size: 18px;
  font-weight: 600;
}

.pg-sun__arc {
  position: relative;
  height: 112px;
  margin: 10px 28px 0;
  border-bottom: 2px solid #e7e7e1;
}

.pg-sun__arc::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 22px;
  bottom: 0;
  border: 2px dashed #f0b062;
  border-bottom: 0;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}

.pg-sun__arc img {
  position: absolute;
  left: 50%;
  top: 0;
  width: 44px;
  height: 44px;
  margin-left: -22px;
}

.pg-sun__row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 8px;
  margin-top: 10px;
}

.pg-sun__row p {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
}

.pg-sun__row b {
  font-size: 20px;
  font-weight: 600;
}

.pg-sun__row span {
  color: #6b6f67;
  font-size: 13px;
}

.pg-sun__row .pg-sun__len { align-items: center; text-align: center; }
.pg-sun__row .pg-sun__set { align-items: flex-end; text-align: right; }

.pg-sun__note {
  margin: 12px 0 0;
  color: #3d403a;
  font-size: 14px;
  line-height: 1.5;
}

.pg-moon {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 12px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}

.pg-moon__it {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pg-moon__it b {
  display: block;
  font-size: 14px;
  font-weight: 600;
}

.pg-moon__it b + span {
  display: block;
  color: #6b6f67;
  font-size: 13px;
}

.pg-moon__ic {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(22, 20, 15, .14);
}

.pg-moon__ic--new { background: #2f3a52; }
.pg-moon__ic--full { background: radial-gradient(circle at 40% 35%, #fffbe6, #f0d77c); }
.pg-moon__ic--first { background: linear-gradient(90deg, #2f3a52 50%, #f3df8f 50%); }
.pg-moon__ic--last { background: linear-gradient(90deg, #f3df8f 50%, #2f3a52 50%); }

.pg-aurora {
  margin: 18px 0 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(120deg, #13233f, #1b3b5a 60%, #1c524e);
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
}

.pg-aurora b {
  display: block;
  margin-bottom: 3px;
  color: #a6f2cf;
  font-size: 16px;
}

/* ---------- Погода по дням ---------- */

.pg-days2__head { align-items: flex-end; }

.pg-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.pg-pill {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid #e7e7e1;
  border-radius: 999px;
  background: #fff;
  color: #16140f;
  font-size: 14px;
  cursor: pointer;
  transition: border-color .15s;
}

.pg-pill:hover { border-color: #16140f; }

.pg-days2__scroll {
  overflow-x: auto;
  padding: 10px 0 12px;
  border: 1px solid #e7e7e1;
  border-radius: 24px;
}

.pg-days2__scroll:focus-visible {
  outline: 2px solid #E86B18;
  outline-offset: 2px;
}

.pg-days2__in {
  position: relative;
  margin: 0 8px;
}

.pg-days2__cols,
.pg-days2__nights {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-dc {
  position: relative;
  flex: 1 0 60px; /* на широком экране колонки тянутся на всю ширину */
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 0 6px;
  border-radius: 16px;
}

.pg-dc.is-we { background: #fff3ea; }

.pg-dc__wd {
  font-size: 14px;
  font-weight: 600;
}

.pg-dc__n {
  color: #6b6f67;
  font-size: 13px;
}

.pg-dc.is-we .pg-dc__wd,
.pg-dc.is-we .pg-dc__n { color: #b43c0b; }

.pg-dc__ic {
  display: block;
  width: 34px;
  height: 34px;
  margin-top: 4px;
}

.pg-dc__p {
  min-height: 16px;
  color: #2f62b8;
  font-size: 12px;
}

.pg-dc__t {
  margin-top: 2px;
  font-size: 17px;
  font-weight: 600;
}

.pg-days2__chart { position: relative; }
.pg-days2__chart svg { display: block; }

.pg-days2__line {
  fill: none;
  stroke-width: 2.5;
  stroke-linejoin: round;
  stroke-linecap: round;
}

.pg-days2__line--day { stroke: #ec7a2c; }
.pg-days2__line--night { stroke: #4f7fc8; }

.pg-days2__tag {
  position: absolute;
  left: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  color: #fff;
  font-size: 12px;
}

.pg-days2__tag--day { top: 0; background: #c2581a; }
.pg-days2__tag--night { bottom: 0; background: #3f6aa6; }

.pg-dn {
  flex: 1 0 60px;
  color: #6b6f67;
  font-size: 15px;
  text-align: center;
}

.pg-days2__legend {
  margin: 10px 0 0;
  color: #6b6f67;
  font-size: 13px;
  line-height: 1.5;
}

/* ---------- Что надеть ---------- */

.pg-pack2__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-pack2__item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-radius: 20px;
  background: #faf6f1;
  font-size: 15px;
  line-height: 1.35;
}

.pg-pack2__ic {
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #fff;
}

/* ---------- 12 месяцев ---------- */

.pg-yr__list {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  margin: 0;
  padding: 4px 4px 6px;
  list-style: none;
  scrollbar-width: none;
}

.pg-yr__list::-webkit-scrollbar { display: none; }

.pg-yr__list li { flex: 0 0 86px; }

.pg-page .pg-yr__m {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  height: 100%;
  padding: 12px 4px;
  border-radius: 20px;
  color: #fff;
  text-decoration: none;
  text-shadow: 0 1px 2px rgba(8, 20, 50, .2);
  transition: transform .15s;
}

.pg-page .pg-yr__m:hover {
  color: #fff;
  transform: translateY(-2px);
}

.pg-yr__m img {
  display: block;
  width: 40px;
  height: 40px;
}

.pg-yr__n {
  font-size: 14px;
  font-weight: 600;
}

.pg-yr__d {
  font-size: 18px;
  font-weight: 600;
}

.pg-yr__nt {
  font-size: 13px;
  opacity: .88;
}

.pg-yr__m.is-on { box-shadow: 0 0 0 3px #fff, 0 0 0 5px #E86B18; }

@media (min-width: 600px) {
  .pg-sky { padding: 26px 30px; }
  .pg-sky__t { font-size: 116px; }
  .pg-sky__ic { width: 104px; height: 104px; }
  .pg-params { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pg-pack2__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .pg-hero2 { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); }
  .pg-sum2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); }
  .pg-skyinfo__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-pack2__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pg-yr__list {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    overflow: visible;
  }
}

/* Телефон: на узкой карте подписи под точками и только температура, имя — у выбранного города */
@media (max-width: 599px) {
  .pg-map__chip {
    left: 50%;
    top: calc(50% + 11px);
    padding: 2px 8px;
    font-size: 12px;
    transform: translateX(-50%);
  }

  .pg-map__cn { display: none; }
  .pg-map__lb.is-land { display: none; }
}

/* ---------- Страница региона: 12 карточек месяцев, север и юг ---------- */

.pg-lead--months { margin: -6px 0 18px; max-width: 820px; }

.pg-mcards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-page .pg-mc {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  height: 100%;
  min-height: 168px;
  padding: 14px 14px 16px;
  border-radius: 22px;
  color: #fff;
  text-decoration: none;
  text-shadow: 0 1px 2px rgba(8, 20, 50, .2);
  transition: transform .15s;
}

.pg-page .pg-mc:hover {
  color: #fff;
  transform: translateY(-2px);
}

.pg-mc.is-on { box-shadow: 0 0 0 3px #fff, 0 0 0 5px #E86B18; }

.pg-mc__ic {
  position: absolute;
  right: 10px;
  top: 10px;
  width: 52px;
  height: 52px;
}

.pg-mc__n {
  font-size: 18px;
  font-weight: 600;
}

.pg-mc__d {
  margin-top: auto;
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.02em;
}

.pg-mc__nt { font-size: 14px; opacity: .9; }

.pg-mc__note {
  font-size: 13px;
  line-height: 1.3;
  opacity: .92;
}

.pg-heat {
  overflow-x: auto;
  padding: 10px;
  border: 1px solid #e7e7e1;
  border-radius: 24px;
}

.pg-heat:focus-visible {
  outline: 2px solid #E86B18;
  outline-offset: 2px;
}

.pg-heat__in {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 940px;
}

.pg-heat__row {
  display: grid;
  grid-template-columns: 160px repeat(12, minmax(0, 1fr));
  gap: 4px;
}

.pg-page .pg-heat__h {
  padding: 4px 0;
  color: #6b6f67;
  font-size: 13px;
  text-align: center;
  text-decoration: none;
}

.pg-page .pg-heat__h:hover { color: #c2410c; }

.pg-heat__name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 4px 6px;
  font-size: 14px;
}

.pg-heat__row--head .pg-heat__name {
  color: #6b6f67;
  font-size: 13px;
}

.pg-heat__name b { font-weight: 600; }

.pg-heat__name span {
  color: #6b6f67;
  font-size: 12px;
}

.pg-heat__c {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-height: 52px;
  border-radius: 12px;
}

.pg-heat__c b {
  font-size: 15px;
  font-weight: 600;
}

.pg-heat__c span {
  font-size: 12px;
  opacity: .85;
}

@media (min-width: 600px) {
  .pg-mcards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .pg-mcards { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
}

/* ---------- Погода сейчас и на 2 недели (прогноз met.no, 09.11.2026) ---------- */

.pg-page .pg-live { margin-top: 28px; }
.pg-live .pg-sec__head { margin-bottom: 0; }
.pg-live .pg-hero2 { margin-top: 16px; }

/* Ночью небо темнее: слой под снегом и дождём, только у выбранного города. */
.pg-sky__p.is-night::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(180deg, rgba(10, 22, 48, .82) 0%, rgba(24, 42, 80, .72) 55%, rgba(40, 62, 104, .6) 100%);
  pointer-events: none;
}

.pg-sky__badge--now { padding: 6px 14px 6px 10px; }

.pg-sky__badge--now i {
  width: 10px;
  height: 10px;
  background: #5ee07a;
  box-shadow: 0 0 0 4px rgba(94, 224, 122, .28);
}

.pg-dc__tag {
  position: absolute;
  top: -9px;
  left: 4px;
  padding: 1px 7px;
  border-radius: 999px;
  background: #e9ecef;
  color: #5d6470;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  white-space: nowrap;
}

.pg-dc__tag--fc {
  background: #16140f;
  color: #fff;
}

.pg-days2__scroll { padding-top: 16px; }

.pg-dc.is-norm > :not(.pg-dc__tag) { opacity: .5; }
.pg-dn.is-norm { opacity: .5; }

.pg-dc.is-norm-first::before {
  content: '';
  position: absolute;
  top: 6px;
  bottom: -110px;
  left: 0;
  border-left: 1px dashed #c9cdc6;
}

.pg-dc.is-fc { background: #eef4fb; }
.pg-dc.is-fc.is-we { background: #fdeee2; }
.pg-dc.is-today { box-shadow: inset 0 0 0 2px #16140f; }
.pg-dc.is-near .pg-dc__wd { font-size: 12px; }
.pg-dc__p.is-mm { color: #2f62b8; }

.pg-days2__line--norm { stroke-dasharray: 4 5; opacity: .55; }

.pg-days2__legend a { color: inherit; }

/* ---------- Текст страницы в рамке по центру, как описание в категориях туров (09.11.2026) ----------
   Те же размеры, что .tourcat-opisanie-wrapper в taxonomy-tourcat.css: белый фон, рамка 2px #ececec,
   скругление 24px; на широком экране не шире 960px и по центру. */

.pg-page .pg-text-sec {
  background: #fff;
  border: 2px solid #ececec;
  border-radius: 24px;
  padding: 20px;
}

.pg-text-sec .pg-text { max-width: none; }

.pg-text-sec .pg-text h2 {
  margin: 32px 0 14px;
  color: #000;
  font-size: 26px;
  font-weight: 500;
}

.pg-text-sec .pg-text > h2:first-child { margin-top: 0; }

.pg-text-sec .pg-blog { margin-top: 24px; }

@media (min-width: 1200px) {
  .pg-page .pg-text-sec {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    padding: 40px;
  }

  .pg-text-sec .pg-text h2 { font-size: 28px; }
}

/* ---------- Главная раздела /pogoda/: виджеты направлений (09.11.2026) ---------- */

.pg-page--index .pg-head { margin-bottom: 8px; }
.pg-page .pg-ix { margin-top: 32px; }
.pg-ix + .pg-ix { margin-top: 64px; }
.pg-ix .pg-sec__head { align-items: center; margin-bottom: 16px; }

.pg-page .pg-ix__more,
.pg-page .pg-ix__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #16140f;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}

.pg-page .pg-ix__more:hover,
.pg-page .pg-ix__link:hover { color: #c2410c; }
.pg-ix__more .pg-ic,
.pg-ix__link .pg-ic { color: #E86B18; }

.pg-ix__grid {
  display: grid;
  gap: 16px;
}

.pg-ix__grid > * { min-width: 0; } /* иначе лента дней на телефоне раздвигает страницу */

/* «Небо» — ссылка: внутри span, поэтому раскладка задаётся явно. */
.pg-page a.pg-ix__sky {
  min-height: 0;
  color: #fff;
  text-decoration: none;
}

.pg-ix__sky .pg-sky__p,
.pg-ix__sky .pg-sky__top,
.pg-ix__sky .pg-sky__now,
.pg-ix__sky .pg-sky__big,
.pg-ix__sky .pg-sky__txt,
.pg-ix__sky .pg-sky__place { display: flex; }

.pg-ix__sky .pg-sky__p { flex: 1; flex-direction: column; gap: 18px; }
.pg-ix__sky .pg-sky__big,
.pg-ix__sky .pg-sky__txt { flex-direction: column; }
.pg-ix__sky .pg-sky__t { font-size: 72px; }
.pg-ix__sky .pg-sky__ic { width: 80px; height: 80px; }

.pg-ix__go {
  margin-top: auto;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: #fff;
  color: #16140f;
  font-size: 15px;
  font-weight: 500;
  text-shadow: none;
  transition: color .15s;
}

.pg-ix__sky:hover .pg-ix__go { color: #c2410c; }

.pg-ix__list,
.pg-ix__week,
.pg-ix__months {
  margin: 0;
  padding: 0;
  list-style: none;
}

.pg-ix__list { display: grid; gap: 2px; margin-top: 8px; }

.pg-ix__row {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid #f0efea;
}

.pg-ix__row:first-child { border-top: 0; }
.pg-ix__ic { display: block; width: 36px; height: 36px; }

.pg-ix__name,
.pg-ix__t {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}

.pg-ix__name b { font-size: 15px; font-weight: 600; }
.pg-ix__name span,
.pg-ix__t span { color: #6b6f67; font-size: 12px; }
.pg-ix__t { align-items: flex-end; text-align: right; }
.pg-ix__t b { font-size: 20px; font-weight: 600; }
.pg-ix__row.is-main .pg-ix__name b::after { content: ' ·'; color: #E86B18; }

.pg-ix__week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  margin: 10px 0 14px;
}

.pg-ix__day {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 2px;
  border-radius: 14px;
  text-align: center;
}

.pg-ix__day.is-we { background: #fff3ea; }
.pg-ix__wd { font-size: 12px; font-weight: 600; white-space: nowrap; }

@media (max-width: 599px) {
  /* На телефоне 7 колонок узкие: «Сегодня» и «Завтра» не помещаются — лента листается вбок. */
  .pg-ix__week {
    grid-template-columns: repeat(7, minmax(52px, 1fr));
    overflow-x: auto;
    scrollbar-width: none;
  }
  .pg-ix__week::-webkit-scrollbar { display: none; }
}
.pg-ix__day.is-we .pg-ix__wd,
.pg-ix__day.is-we .pg-ix__dn { color: #b43c0b; }
.pg-ix__dn { color: #6b6f67; font-size: 12px; }
.pg-ix__dic { display: block; width: 32px; height: 32px; margin: 2px 0; }
.pg-ix__hi { font-size: 16px; font-weight: 600; }
.pg-ix__lo { color: #6b6f67; font-size: 13px; }

.pg-page .pg-ix__mh {
  margin: 28px 0 12px;
  color: #16140f;
  font-size: 18px;
  font-weight: 600;
}

.pg-ix__months {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.pg-page .pg-ix__m {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-height: 118px;
  padding: 10px 12px;
  border-radius: 18px;
  color: #fff;
  text-decoration: none;
  text-shadow: 0 1px 2px rgba(8, 20, 50, .2);
  transition: transform .15s;
}

.pg-page .pg-ix__m:hover { color: #fff; transform: translateY(-2px); }
.pg-ix__m.is-on { box-shadow: 0 0 0 3px #fff, 0 0 0 5px #E86B18; }
.pg-ix__mn { font-size: 14px; font-weight: 600; }
/* Значок под названием: рядом длинные названия («Сентябрь») не помещаются. */
.pg-ix__mic { width: 30px; height: 30px; margin: 2px 0; }
.pg-ix__mt { margin-top: auto; font-size: 22px; font-weight: 600; line-height: 1; }
.pg-ix__mnt { font-size: 12px; opacity: .9; }

@media (min-width: 600px) {
  .pg-ix__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-ix__grid .pg-ix__sky { grid-column: 1 / -1; }
  .pg-ix__grid.is-climate .pg-ix__sky { grid-column: auto; }
  .pg-ix__months { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (min-width: 1100px) {
  .pg-ix__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); }
  .pg-ix__grid .pg-ix__sky { grid-column: auto; }
  .pg-ix__grid.is-climate { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
  .pg-ix__months { grid-template-columns: repeat(12, minmax(0, 1fr)); }
}

/* ---------- Шапка страницы региона: «небо», «Города сейчас», карта (09.11.2026) ----------
   Строка городов внизу «неба» заменена списком: строка списка — подпись к радиокнопке города,
   выбранная подсвечена (season_pogoda_switch_css). На ПК три колонки, на планшете «небо» сверху. */

.pg-hero2--live .pg-sky { min-height: 0; }

.pg-page label.pg-ix__row {
  margin: 0 -8px;
  padding: 8px;
  border-radius: 12px;
  cursor: pointer;
  transition: background .15s;
}

.pg-page label.pg-ix__row:hover { background: #f6f5f1; }

@media (min-width: 600px) {
  .pg-hero2.pg-hero2--live { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-hero2--live .pg-sky { grid-column: 1 / -1; }
}

@media (min-width: 1100px) {
  .pg-hero2.pg-hero2--live { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); }
  .pg-hero2--live .pg-sky { grid-column: auto; }
}

/* Две ссылки под турами на странице региона: «Все туры в Карелию в ноябре» и «Все туры: Карелия». */
.pg-page .pg-tours .pg-more + .pg-more { margin-left: 28px; }

/* Подпись под «Города в ноябре» на странице месяца. */
.pg-page .pg-ix__sub { margin: -2px 0 4px; color: #6b6f67; font-size: 13px; }

/* ---------- Туры лентой, как «Популярные туры» на главной (09.11.2026) ----------
   Разметка и стили — .hm-* из home-2027.css; здесь только отступы внутри страницы погоды. */
.pg-page .pg-pop { margin-top: 56px; padding-bottom: 0; }

/* «Все туры →» после вкладок: на основную категорию направления. */
.pg-page .pg-pop__all {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  padding: 6px 0 10px;
  color: #E86B18;
  font-size: 18px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  transition: color .15s;
}

.pg-page .pg-pop__all:hover { color: #c2410c; }
.pg-pop__all svg { transition: transform .15s; }
.pg-pop__all:hover svg { transform: translateX(3px); }

/* Подпись об источнике — под рамкой текста, той же ширины, по линии текста внутри (09.11.2026). */
@media (min-width: 1200px) {
  .pg-page .pg-text-sec + .pg-source {
    max-width: 960px;
    margin: 16px auto 0;
    padding: 0 42px;
  }
}

/* ---------- «Как мы считаем» (аудит 09.11.2026): таблица сверки в тексте, ссылка в подписи ---------- */

.pg-source a { color: inherit; text-decoration: underline; }
.pg-source a:hover { color: #E86B18; }

.pg-text h2[id] { scroll-margin-top: 100px; }

.pg-text .pg-tbl-wrap {
  margin: 4px 0 18px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.pg-text table {
  width: 100%;
  min-width: 460px;
  border-collapse: collapse;
  font-size: 14px;
  line-height: 1.35;
}

.pg-text caption {
  padding: 0 0 8px;
  color: #6b6f67;
  font-size: 13px;
  text-align: left;
}

.pg-text th,
.pg-text td {
  padding: 7px 10px;
  border-bottom: 1px solid #ececec;
  text-align: left;
  white-space: nowrap;
}

.pg-text thead th {
  color: #6b6f67;
  font-weight: 500;
  border-bottom-color: #dcdcd6;
}

.pg-text tbody th { font-weight: 500; }