/* ===================================================================
   adaptive.css — независимый адаптивный слой (грузится ПОСЛЕ vs2026.css)
   Не трогает существующие стили; только чинит мобильную/планшетную вёрстку.
   Точки: <=1024 планшет, <=900 мобильное меню, <=600 узкий телефон.
   =================================================================== */

/* ---------- 0. Анти-переполнение (все размеры) ---------- */
/* только ограничение ширины; height НЕ трогаем, чтобы не перебить точечные размеры логотипа и т.п. */
img,svg,video,canvas,iframe,embed,object{max-width:100%;}
/* длинные неразрывные строки не распирают контейнер */
.ftr a,.ftr p,.drop__menu a,.prow__d,.p26desc,.crumbs,.breadcrumbs{overflow-wrap:break-word;word-break:break-word;}

/* бургер, шторка и перенесённый адрес по умолчанию скрыты (десктоп) */
.vsburger{display:none;}
.vsdrawer,.vsdrawer-ov{display:none;}
.top__addr{display:none;}   /* виден только на мобильном (<=900), см. ниже */

/* Чат Jivosite (#jvLabelWrap, z-index 2147483647 — максимум) перекрывает открытые модалки/шторку;
   поднять модалку выше нельзя, поэтому прячем лаунчер чата, пока открыт оверлей. Возвращается при закрытии. */
body:has(.vspm-ov.open) #jvLabelWrap,
body:has(.vsdrawer.open) #jvLabelWrap,
body:has(.vscart-ov.open) #jvLabelWrap,
body:has(.modal.open) #jvLabelWrap{opacity:0 !important;pointer-events:none !important;visibility:hidden !important;}

/* ---------- 1. Мобильное меню (шторка) ---------- */
.vsburger{
  flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;flex:0 0 auto;
  border:1.5px solid rgba(255,255,255,.28);border-radius:12px;
  background:transparent;cursor:pointer;padding:0 11px;
}
.vsburger span{display:block;height:2.5px;width:100%;background:#e8edf2;border-radius:2px;transition:.2s;}
.vsburger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.vsburger.open span:nth-child(2){opacity:0;}
.vsburger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

.vsdrawer-ov{position:fixed;inset:0;background:rgba(8,15,25,.55);z-index:99990;opacity:0;visibility:hidden;transition:.25s;}
.vsdrawer-ov.open{opacity:1;visibility:visible;}
.vsdrawer{
  position:fixed;top:0;right:0;height:100%;width:min(87vw,368px);
  background:#fff;z-index:99991;transform:translateX(100%);
  transition:transform .28s ease;display:flex;flex-direction:column;
  box-shadow:-14px 0 44px -22px rgba(0,0,0,.55);
}
.vsdrawer.open{transform:none;}
.vsdrawer__hd{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid #eef1f4;font-family:'Exo 2',sans-serif;font-weight:800;font-size:18px;color:#12202c;flex:0 0 auto;}
.vsdrawer__x{border:0;background:none;font-size:24px;line-height:1;cursor:pointer;color:#5a6672;padding:0 4px;}
.vsdrawer__body{overflow-y:auto;padding:8px 0 40px;-webkit-overflow-scrolling:touch;flex:1 1 auto;}
.vsdrawer__body a{color:#1a2733;text-decoration:none;display:block;}
.vsdrawer__search{padding:12px 18px 6px;}
.vsdrawer__search form{display:flex;gap:6px;}
.vsdrawer__search input{flex:1;min-width:0;padding:11px 13px;border:1.5px solid #dfe4ea;border-radius:11px;font-size:15px;}
.vsdrawer__search button{padding:11px 15px;background:#ff7f00;color:#fff;border:0;border-radius:11px;font-weight:700;cursor:pointer;white-space:nowrap;}
.vsacc{border-bottom:1px solid #f2f4f6;}
.vsacc__t{width:100%;text-align:left;background:none;border:0;padding:14px 18px;font-size:15.5px;font-weight:700;color:#12202c;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px;}
.vsacc__t:after{content:'▾';color:#9aa6b1;transition:.2s;font-size:13px;}
.vsacc.open .vsacc__t:after{transform:rotate(180deg);}
.vsacc__c{display:none;padding:2px 18px 12px;}
.vsacc.open .vsacc__c{display:block;}
.vsacc__c a{padding:9px 0 9px 13px;font-size:14px;border-left:2px solid #eef1f4;color:#33414d;}
.vsacc__c a:hover{color:#ff7f00;}
.vsacc__c a b{font-weight:600;}
.vsdrawer__links{padding:4px 0;border-top:1px solid #f2f4f6;}
.vsdrawer__links a{padding:13px 18px;font-size:15px;font-weight:600;border-bottom:1px solid #f7f8fa;}
.vsdrawer__cta{padding:14px 18px;}
.vsdrawer__cta a{display:block;text-align:center;background:#ff7f00;color:#fff;font-weight:700;padding:13px;border-radius:12px;font-size:15px;}
.vsdrawer__tel{padding:16px 18px;background:#f7f9fb;}
.vsdrawer__tel a{font-family:'Exo 2',sans-serif;font-size:21px;font-weight:800;color:#12202c;}
.vsdrawer__tel span{font-size:12px;color:#7a8894;display:block;margin-top:2px;}
.vsdrawer__soc{display:flex;gap:12px;padding:14px 18px 4px;}
.vsdrawer__soc a{width:38px;height:38px;}
.vsdrawer__soc img{width:100%;height:100%;object-fit:contain;}

/* ---------- 2. Шапка на планшете/мобильном (<=900) ---------- */
@media(max-width:900px){
  /* верхняя плашка: убрать десктоп-навигацию (уходит в шторку), оставить город + адрес */
  .top .drop,.top__links,.top__badges{display:none !important;}
  .top .wrap{padding:7px 14px;justify-content:flex-start;gap:3px 12px;flex-wrap:wrap;align-items:center;}
  .top__city{font-size:13px;}
  /* адрес, перенесённый JS-ом из основного ряда наверх */
  .top__addr{display:inline-flex;flex-wrap:wrap;gap:2px 12px;font-size:12px;color:var(--mut,#9fb0bd);line-height:1.35;}
  .top__addr a{color:inherit;}
  .top__addr a.m{color:#ff9a3d;font-weight:600;}

  /* основной ряд: логотип + телефон + корзина + бургер, поиск и кнопка — своими строками */
  .hd .wrap{display:flex !important;flex-wrap:wrap !important;gap:9px 10px !important;padding:9px 14px !important;align-items:center;}
  .hd .wrap>*{min-width:0;}                     /* КЛЮЧ: разрешаем детям сжиматься, иначе распирают документ */
  .hd__logo{order:1;flex:0 0 auto;max-width:52vw;}
  .hd__logo img{height:34px !important;width:auto !important;max-height:34px;}
  .hd__addr{display:none !important;}            /* адрес уехал в верхнюю плашку */
  .hd__tel{order:2;margin-left:auto;text-align:right;flex:0 1 auto;}
  .hd__tel b{font-size:15.5px;white-space:nowrap;}
  .hd__tel span{font-size:10.5px;}
  .hd__cart{order:3;flex:0 0 auto;}
  .vsburger{display:inline-flex;order:4;}
  .hd__search{order:5;flex:1 1 100% !important;max-width:100% !important;display:flex;}
  .hd__search input{flex:1 1 auto;min-width:0;}
  .hd__btn.js-vs-price{order:6;flex:1 1 100%;text-align:center;}

  /* всплывающие меню города/корзины не должны вылезать за экран */
  .drop__menu,.vsask,.vspm{max-width:calc(100vw - 24px);}
  /* таблицы характеристик — горизонтальный скролл внутри блока (только на мобильном) */
  .p26desc table,.tab-content table,.article table,.content table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  /* сетки: дети не распирают контейнер + треки minmax(0,1fr) вместо auto */
  .ftr__grid>*,.plist>*,.p7grid>*,.prow,.prow__b,.prow__d,.sub-photo>*,.scard{min-width:0;}
  .plist{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .sub-photo{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  .scard__im img,.scard img{width:100%;height:auto;}
  .ftr__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* ---------- 3. Узкий телефон (<=600) ---------- */
@media(max-width:600px){
  .wrap,.wrap2{padding-left:14px;padding-right:14px;}
  /* подвал в одну колонку */
  .ftr__grid{grid-template-columns:1fr !important;gap:22px;}
  .ftr__bottom,.ftr__legal{flex-direction:column;gap:8px;align-items:flex-start;text-align:left;}
  /* листинг: одна колонка карточек, чтобы не были крошечными */
  .plist{grid-template-columns:1fr !important;}
  /* подкатегории: 2 колонки */
  .sub-photo{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  /* заголовки не переполняют */
  h1,.title-h2{font-size:24px;line-height:1.2;word-break:break-word;}
}

/* ---------- 3b. Компактная шапка на телефоне (<=560) ---------- */
@media(max-width:560px){
  /* ряд 1: логотип слева, корзина+бургер справа; телефон/поиск/кнопка — своими строками */
  .hd__logo{order:1;}
  .hd__cart{order:2;margin-left:auto;}
  .vsburger{order:3;margin-left:0;}
  .hd__tel{order:4;margin-left:0 !important;flex:1 1 100%;text-align:left;}
  .hd__tel b{font-size:16px;}
  .hd__search{order:5;}
  .hd__btn.js-vs-price{order:6;}
}

/* ---------- 4. Совсем узко (<=380) ---------- */
@media(max-width:380px){
  .hd__tel b{font-size:14px;}
  .hd__logo img{height:30px;}
}