/* ==========================================================================
   Адаптив. Макет свёрстан 1:1 под 1440; ниже — плавная деградация.
   Точки: 1440 → 1280 → 1024 → 768 → 520.
   ========================================================================== */

@media (max-width:1439px){
  :root{--gutter:56px;--header-gutter:40px}
  .v-hero__content,.v-hero__stats,.v-ahero__crumbs,.v-ahero__eyebrow,.v-ahero__title,
  .v-ahero__lead,.v-ahero__buttons,.v-ahero__stats{left:var(--gutter)}
  .v-hero__title{font-size:clamp(52px,6.4vw,92px)}
  .v-hero__content{width:min(760px,62vw)}
  .v-hero__lead{width:min(560px,52vw)}
  .v-cards__head-left,.v-people__head-left,.v-articles__head-left,.v-gen__head-left,
  .v-archive__head-left,.v-map__head-left,.v-how__head,.v-team__head,.v-haplo__head,.v-gdb__head{
    flex:1 1 auto;width:auto;max-width:640px}
  .v-gen__note,.v-map__note{flex:0 1 380px}
  .v-about__inner{gap:40px}
  .v-about__left{flex:1 1 auto}
  .v-about__right{flex:0 0 clamp(360px,38vw,560px)}
  .v-about__photo--main,.v-about__photo--small{width:100%}
  .v-gen__card--chart{flex:1 1 auto}
  .v-map__card{left:auto;right:38px}
  .v-join__left{flex:1 1 auto}
  .v-join__title,.v-join__text{width:auto;max-width:560px}
  /* внутренние страницы: абсолютные подписи → поток */
  .v-how__note,.v-team__note,.v-haplo__note,.v-gdb__note{position:static;width:auto;max-width:470px;margin-top:18px}
  .v-how__inner{height:auto;padding-bottom:96px}
  .v-how__steps{position:static;margin-top:56px}
  .v-team__cols,.v-haplo__cols{margin-top:56px;gap:24px}
  .v-acta__inner{height:auto;padding:56px var(--gutter);display:flex;flex-wrap:wrap;gap:28px;
    justify-content:space-between;align-items:center}
  .v-acta__left{position:static;width:auto;max-width:640px}
  .v-acta__text{position:static;width:auto;margin-top:16px}
  .v-acta__buttons{position:static}
  .v-gdb__toolbar{margin-top:44px;flex-wrap:wrap}
  .v-part{min-height:0;height:auto;padding-bottom:28px}
  .v-part::before,.v-part::after,.v-part__div3{display:none}
}

@media (max-width:1279px){
  :root{--gutter:40px;--header-gutter:32px}
  /* шапка: меню уезжает в выпадающую панель */
  .v-header__menu{position:absolute;top:calc(100% + 10px);left:var(--header-gutter);right:var(--header-gutter);
    flex-direction:column;align-items:stretch;gap:2px;padding:14px;border-radius:var(--r-lg);
    background:var(--ink-900);box-shadow:0 24px 60px rgba(0,0,0,.45);display:none;z-index:40}
  .vk-nav-open .v-header__menu{display:flex}
  .v-header__item{flex-direction:row;justify-content:space-between;padding:12px 14px;border-radius:var(--r-sm)}
  .v-header__item:hover{background:var(--a-cream-08)}
  .v-header__item-line{width:18px;height:2px}
  .v-header__burger{display:grid}
  .v-header__cta{display:none}

  .v-cards__grid{grid-template-columns:repeat(2,1fr)}
  /* В две колонки широкая карточка оставляла дыру рядом с соседней:
     здесь все карточки одинаковой ширины, а нечётная последняя занимает ряд целиком. */
  .v-card--span2{grid-column:span 1}
  /* В одну колонку растягивать последнюю карточку не на что:
     иначе появляется вторая колонка и ряд разъезжается. */
  .v-cards__grid .v-card:last-child:nth-child(odd){grid-column:auto}
  .v-cards__grid .v-card:last-child:nth-child(odd){grid-column:span 2}
  .v-card{height:auto!important;min-height:300px}
  .v-people__grid{grid-template-columns:repeat(2,1fr)}
  .v-person,.v-people__promo{height:auto;min-height:380px}
  .v-articles__grid{grid-template-columns:repeat(2,1fr)}
  .v-archive__counters{grid-template-columns:repeat(2,1fr)}
  .v-archive__shelf{flex-wrap:wrap}
  .v-shelf{flex:0 0 calc(33.333% - 11px)}
  .v-gen__row{flex-wrap:wrap}
  .v-gen__card--stat{flex:1 1 320px}
  .v-gen__card--chart{flex:1 1 100%}
  .v-map__canvas{height:clamp(340px,42vw,560px)}
  .v-map__pin{transform:scale(.9);transform-origin:left top}
  .v-map__card{position:static;width:auto;margin-top:16px}
  .v-villages__grid{grid-template-columns:1fr}
  .v-how__steps{grid-template-columns:1fr 1fr}
  .v-part{display:flex;flex-direction:column;gap:20px;padding:28px}
  .v-part__avatar,.v-part__badge,.v-part__name,.v-part__id,.v-part__meta--1,.v-part__meta--2,
  .v-part__label,.v-part__donut,.v-part__legend,.v-part__map,.v-part__match-cap,.v-part__match-name,
  .v-part__hcap--y,.v-part__hval--y,.v-part__hsub--y,.v-part__hcap--mt,.v-part__hval--mt,.v-part__hsub--mt{
    position:static;left:auto;top:auto}
  .v-part__badge{display:inline-block;align-self:flex-start;margin-left:0}
  .v-part__map{position:relative}
  .v-part__avatar{align-self:flex-start}
  .v-part__donut{width:126px;height:126px}
  .v-part__legend{width:100%;max-width:260px;height:auto;justify-content:flex-start}
  .v-part__map{width:100%;max-width:280px}
  .v-qp{margin:0;padding-bottom:0}
  .v-qp__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-part__auto-row{display:flex;gap:24px;flex-wrap:wrap}
}

@media (max-width:1023px){
  :root{--gutter:28px;--header-gutter:24px}
  .v-hero{height:auto;min-height:640px}
  /* Панель показателей уезжает к низу экрана, на камни: в середине она
     закрывала козла на снимке. */
  .v-hero__inner{padding-block:120px 40px;min-height:640px;display:flex;flex-direction:column}
  .v-hero__content{position:static;width:auto}
  .v-hero__title{font-size:clamp(44px,8vw,72px)}
  .v-hero__lead{width:auto;max-width:560px}
  /* Панель показателей на телефоне компактная: пятью крупными плитками
     она закрывала почти весь снимок на первом экране. */
  .v-hero__stats{position:static;height:auto;margin-top:auto;padding:16px 14px;flex-wrap:wrap;
    gap:14px 10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .v-hero__stat{flex:none;gap:2px}
  .v-hero__stat-value{font-size:24px}
  .v-hero__stat-label{font-size:12px;line-height:1.35}
  /* Разделитель между показателями нарисован тенью, а не рамкой */
  .v-hero__stat + .v-hero__stat{padding-left:0;border-left:0;box-shadow:none}

  .v-ahero{height:auto;min-height:600px}
  .v-ahero__inner{padding-block:52px 40px;display:flex;flex-direction:column;gap:16px}
  .v-ahero__crumbs,.v-ahero__eyebrow,.v-ahero__title,.v-ahero__lead,.v-ahero__buttons,.v-ahero__stats{
    position:static;left:auto;top:auto;right:auto;width:auto}
  .v-ahero__title{font-size:clamp(40px,7vw,66px)}
  .v-ahero__stats{height:auto;padding:24px;flex-wrap:wrap;gap:20px;margin-top:8px}
  .v-ahero__stat{flex:1 1 45%}
  .v-ahero__stat + .v-ahero__stat{padding-left:0}
  .v-ahero__stat + .v-ahero__stat::before{display:none}

  .v-about__inner{flex-direction:column}
  .v-about__left,.v-about__right{flex:1 1 auto;width:100%;max-width:none}
  .v-team__cols,.v-haplo__cols,.v-how__steps{grid-template-columns:1fr}
  .v-join__inner{flex-direction:column;gap:32px}
  .v-join__form{flex:1 1 auto;width:100%;max-width:440px;margin-top:0}
  .v-gdb__filters{flex-wrap:wrap}
  .v-gdb__search{width:100%}
  .v-cards__head,.v-people__head,.v-articles__head,.v-gen__head,.v-archive__head,.v-map__head{
    flex-direction:column;align-items:flex-start;gap:20px;height:auto}
  .v-gen__note,.v-map__note{text-align:left;flex:1 1 auto}
  .v-hero__buttons,.v-ahero__buttons,.v-acta__buttons{flex-wrap:wrap}
}

@media (max-width:767px){
  :root{--gutter:20px;--header-gutter:16px;--header-h:72px}
  .v-cards__grid,.v-people__grid,.v-articles__grid,.v-archive__counters{grid-template-columns:1fr}
  /* В одну колонку все карточки одной ширины. Правило «последняя нечётная — на два
     столбца» из планшетной точки здесь добавляло лишний столбец, и края разъезжались. */
  .v-cards__grid .v-card,.v-cards__grid .v-card--span2,
  .v-cards__grid .v-card:last-child:nth-child(odd){grid-column:auto}
  /* В одну колонку растягивать последнюю карточку не на что:
     иначе появляется вторая колонка и ряд разъезжается. */
  .v-cards__grid .v-card:last-child:nth-child(odd){grid-column:auto}
  .v-archive__shelf{flex-wrap:wrap;display:grid;grid-template-columns:1fr 1fr}
  .v-shelf{flex:0 0 calc(50% - 8px)}
  .v-hero__title{font-size:clamp(38px,10vw,56px)}
  .v-cards__title,.v-about__title,.v-people__title,.v-articles__title,.v-gen__title,
  .v-archive__title,.v-map__title,.v-how__title,.v-team__title,.v-haplo__title,.v-gdb__title,
  .v-join__title{font-size:clamp(27px,5.6vw,38px)}
  .v-villages__title{font-size:clamp(30px,7vw,50px)}
  .v-cards__inner,.v-about__inner,.v-gen__inner,.v-people__inner,.v-articles__inner,
  .v-archive__inner,.v-map__inner,.v-villages__inner,.v-join__inner,.v-how__inner,
  .v-team__inner,.v-haplo__inner,.v-gdb__inner{padding-block:56px}
  .v-footer__inner{padding:56px var(--gutter) 24px;gap:36px}
  .v-footer__cols{flex-wrap:wrap;gap:28px}
  .v-footer__brand{flex:1 1 100%}
  .v-footer__col{flex:1 1 40%}
  .v-footer__bottom{flex-direction:column;align-items:flex-start;gap:14px}
  .v-ahero__stat{flex:1 1 100%}
  .v-part__chart{flex-direction:column}
  /* На телефоне карту показываем целиком, а не обрезанным куском */
  .v-map__canvas{height:auto;min-height:200px;aspect-ratio:auto;background-size:contain;
    background-repeat:no-repeat;background-color:var(--cream-100);border-radius:20px}
  .v-map__canvas::before{content:"";display:block;padding-top:46%}
  .v-map__compass{top:12px;right:12px;width:52px;height:52px}
  .v-map__compass svg{width:38px;height:38px}
  .v-map__pin{transform:scale(.8)}
}

@media (max-width:519px){
  .v-shelf{flex:0 0 100%}
  .v-btn,.v-btn--hero,.v-abtn{padding-inline:20px}
  /* п.6 ТЗ: переключатель языка на телефоне был спрятан — возвращаем компактным */
  .v-header__lang-btn{padding:8px 10px;gap:5px}
  .v-header__lang-code{font-size:14px}
  .v-villages__intro{font-size:17px}
  .v-village__text{font-size:16px}
}

/* ── Исправления переполнений, найденные автопроверкой ───────────────── */
@media (max-width:1365px){
  /* меню не помещается рядом с логотипом и действиями — уводим в панель раньше */
  .v-header__menu{position:absolute;top:calc(100% + 10px);left:var(--header-gutter);right:var(--header-gutter);
    flex-direction:column;align-items:stretch;gap:2px;padding:14px;border-radius:var(--r-lg);
    background:var(--ink-900);box-shadow:0 24px 60px rgba(0,0,0,.45);display:none;z-index:40}
  .vk-nav-open .v-header__menu{display:flex}
  .v-header__item{flex-direction:row;justify-content:space-between;padding:12px 14px;border-radius:var(--r-sm)}
  .v-header__item-line{width:18px}
  .v-header__burger{display:grid}
}
@media (max-width:1439px){
  /* полка архива: переносим ряды, иначе 6×193+gap не влезают */
  .v-archive__shelf{flex-wrap:wrap}
  .v-shelf{flex:0 0 calc(33.333% - 11px)}
  /* два малых фото в блоке «О долине» должны сжиматься */
  .v-about__photo-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  /* подвал: колонки должны переноситься, а не резать край */
  .v-footer__cols{flex-wrap:wrap;row-gap:36px}
  .v-footer__brand{flex:1 1 320px}
  .v-footer__col{flex:1 1 165px;min-width:150px}
  .v-footer__col--contacts{flex:1 1 235px}
  /* фиксированные ширины → максимумы */
  .v-about__photo--main,.v-about__photo--small{width:100%;height:auto;aspect-ratio:4/3}
  .v-about__photo--main{aspect-ratio:560/420}
  .v-about__photo--small{aspect-ratio:272/200}
  .v-acta__title,.v-acta__text,.v-join__title,.v-join__text{width:auto;max-width:640px}
  .v-gen__card--stat{flex:1 1 340px}
  .v-hero__content,.v-hero__lead,.v-ahero__title,.v-ahero__lead{max-width:100%}
  .v-map__card{left:auto;right:24px;top:auto;bottom:24px}
}
@media (max-width:1023px){
  .v-map__card{position:static;width:auto;margin-top:16px}
  .v-part__legend,.v-part__map{max-width:100%}
  .v-zoom{padding:16px}
}
@media (max-width:767px){
  .v-card__dna{left:auto;right:-40px}
  .v-gen__card--chart{flex-direction:column;align-items:flex-start}
  .v-gen__donut{align-self:center}
  .v-gdb__add{width:100%;justify-content:center}
}

@media (max-width:639px){
  .v-qp__grid{grid-template-columns:1fr;gap:18px}
}

/* Первый экран на телефоне: свой снимок, если он задан в админке */
@media (max-width:767px){
  .v-hero{background-image:var(--hero-bg-mob,var(--hero-bg))}
}

/* Карточки разделов: на узких экранах строка короче, поэтому под описание
   отводим три строки — заголовки в ряду по-прежнему стоят на одном уровне. */
@media (max-width:1279px){
  .v-card__text{-webkit-line-clamp:3;min-height:72px}
}