/* Мобильная адаптация II Ceramics. Экраны собраны инлайн-стилями,
   поэтому переопределения точечные и с !important. */

@media (max-width: 960px){
  /* все многоколоночные сетки складываем в одну колонку */
  main :is(div,section)[style*="grid-template-columns"]{grid-template-columns:1fr !important;}
  /* карточки каталога и «похожие»: две в ряд на планшете-телефоне */
  main div[style*="repeat(3,1fr)"]{grid-template-columns:repeat(2,1fr) !important;gap:14px !important;}
  /* контейнерные отступы */
  main section, main{--gutter:20px;}
  main section[style*="96px"]{padding-top:56px !important;padding-bottom:56px !important;}
  /* hero */
  main section[style*="height:640"], main section[style*="height: 640"]{height:520px !important;}
  h1{line-height:1.15 !important;}
  /* прилипающая смета/спеки перестают липнуть */
  main aside[style*="sticky"]{position:static !important;}
  /* фото в шапке коллекции — по центру, меньше */
  main section img[style*="440"]{height:340px !important;}
  /* конфигуратор: сцена ниже панели, высота меньше */
  main div[style*="height:460"], main div[style*="height: 460"]{height:340px !important;}
  /* кнопки в ряд не влезают — переносим */
  main div[style*="display:flex"][style*="gap:14"], main div[style*="display: flex"][style*="gap: 14"]{flex-wrap:wrap !important;}
}

@media (max-width: 960px){
  /* грид-дети не расталкивают колонку своим min-width */
  main :is(div,section)[style*="grid-template-columns"] > *{min-width:0 !important;}
  /* арки «Почему Иран» уменьшаем */
  main div[style*="width: 210px"]{width:150px !important;height:214px !important;}
}

@media (max-width: 620px){
  /* шапка: меню уводим во вторую строку с горизонтальным скроллом */
  header{height:auto !important;flex-wrap:wrap !important;padding-top:10px !important;padding-bottom:10px !important;row-gap:6px !important;}
  header nav{order:3 !important;width:100% !important;overflow-x:auto !important;display:flex !important;gap:18px !important;padding-bottom:4px !important;}
  header nav a{white-space:nowrap !important;font-size:11px !important;}
  header > div:last-child{margin-left:auto;}
  header button{display:none !important;}
  /* карточки: одна в ряд */
  main div[style*="repeat(3,1fr)"]{grid-template-columns:1fr !important;}
  /* шапка: логотип + телефон, меню в горизонтальный скролл */
  header nav, nav[class]{overflow-x:auto !important;}
  header{padding-left:14px !important;padding-right:14px !important;}
  header a[href^="tel"], header span{white-space:nowrap;}
  /* герой-заголовок */
  main h1{font-size:34px !important;}
  main p{max-width:100% !important;}
  /* таблица характеристик не расползается */
  main aside{width:100% !important;}
  /* свотчи конфигуратора крупнее пальцу */
  main button[style*="width:72"], main button[style*="width: 72"]{width:64px !important;height:64px !important;}
  /* футер в одну колонку */
  footer :is(div,section)[style*="grid-template-columns"]{grid-template-columns:1fr !important;gap:28px !important;}
  footer{text-align:left;}
  footer span[style*="display: flex"], footer div[style*="display: flex"]{flex-wrap:wrap !important;row-gap:6px !important;}
}

/* тач-плавность горизонтальных скроллов */
@media (hover: none){
  main div[style*="overflow-x"]{-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  main div[style*="overflow-x"]::-webkit-scrollbar{display:none;}
}