/* ====== БАЗА ====== */
:root{
  --c-bg:#ffffff;
  --c-text:#0f172a;         /* графит */
  --c-sub:#334155;          /* подписи */
  --c-accent:#d7263d;       /* красный */
  --c-accent-2:#0b3b69;     /* тёмно-синий */
  --c-muted:#e5e7eb;        /* светло-серый */
  --radius:16px;
  --shadow:0 8px 24px rgba(2,6,23,.08);
  --container:1200px;
}

.page-washer, .page-grader, .page-line, .page-packer{ --container:1300px;}
body.page-washer .breadcrumbs ol, body.page-grader .breadcrumbs ol, body.page-line .breadcrumbs ol, body.page-packer .breadcrumbs ol{padding: 8px 0 0;}

html {
  scroll-behavior: smooth;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x: clip;}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:var(--c-bg);
  color:var(--c-text);
  line-height:1.5;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 16px}
ul, ol{
  list-style: none;
  margin: 0;
  padding: 0;   /* вот этого не хватало */
}




/* ====== ZENYER: изолированный блок FAQ + сертификаты ====== */

.zf-faq-certs { margin: 32px 0 48px; }
.zf-wrap {
  background: linear-gradient(180deg, #f7f9fc 0%, #ffffff 100%);
  border: 1px solid #e6ebf2;
  border-radius: 16px;
  box-shadow: 0 4px 18px rgba(15, 33, 102, 0.06);
  padding: 20px;
}
@media (min-width: 768px){ .zf-wrap { padding: 24px; } }

.zf-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
@media (min-width: 1024px){
  .zf-grid { grid-template-columns: minmax(0,1fr) minmax(0,420px); gap: 28px; }
}
.zf-grid > * { min-width: 0; }

/* FAQ */
.zf-faq h2, .zf-certs h2 { margin: 0 0 12px; }
.zf-item {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 10px 12px;
  background: #fff;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.zf-item + .zf-item { margin-top: 10px; }
.zf-item[open] { border-color: #cbd5e1; box-shadow: 0 2px 10px rgba(0,0,0,.04); }
.zf-q { cursor: pointer; font-weight: 600; list-style: none; }
.zf-q::-webkit-details-marker { display: none; }
.zf-a { margin-top: 8px; color: #475569; }

/* Сертификаты/галерея */
.zf-certs { overflow: hidden; }
.zf-certs-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); /* уменьшили превью */
  gap: 12px;
}

/* превью поменьше + одинаковые карточки */
.zf-cert {
  display: block;
  background: #fff;
  border: 1px solid #e6ebf2;
  border-radius: 12px;
  padding: 8px;                 /* «рамка» вокруг превью */
  text-decoration: none;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.zf-cert:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  border-color: #d7deea;
}

.zf-cert img {
  display: block;
  width: 100%;
  height: 130px;                /* фиксируем миниатюру компактной */
  object-fit: contain;          /* не режем, вписываем */
  border-radius: 8px;
}

/* медиа — чуть крупнее на планшете/десктопе */
@media (min-width: 768px){
  .zf-cert img { height: 150px; }
}
@media (min-width: 1280px){
  .zf-cert img { height: 160px; }
}








.docs-standards .doclist { margin: 12px 0 24px; padding-left: 18px; }
  .docs-standards .doclist li { margin: 6px 0; line-height: 1.4; }
  .docs-standards .table-wrap { overflow-x:auto; }
  .docs-standards table.appl { width:100%; border-collapse:collapse; min-width:720px; }
  .docs-standards table.appl th,
  .docs-standards table.appl td { border:1px solid #e5e7eb; padding:8px 10px; text-align:center; }
  .docs-standards table.appl th:first-child,
  .docs-standards table.appl td:first-child { text-align:left; }
  .docs-standards .legend { color:#6b7280; font-size:14px; margin-top:8px; }
  .docs-standards .note { background:#f8fafc; border:1px solid #e5e7eb; border-radius:8px; padding:14px 16px; margin:22px 0; }
  .docs-standards .updated { color:#6b7280; font-size:14px; margin:8px 0 0; }
  .hero-mini { position:relative; overflow:hidden; }
  .hero-mini .hero-content { padding:28px 0; }
  .hero-mini .hero-bg img { width:100%; height:auto; display:block; }

/* === QR contacts fix === */
.contacts-qr { margin: 24px 0 32px; }
.contacts-qr h2 { margin: 0 0 16px; }

.qr-grid{
  display:grid;
  gap:16px;
  /* На больших — 2 колонки, на узких — 1 автоматически */
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.qr-card{
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 18px rgba(0,0,0,.05);
  padding: 16px;
  display:flex;
  flex-direction: column;
  min-width:0;                /* важно: не выталкивать колонку */
  height:100%;
}

.qr-card__img{
  border-radius: 12px;
  background: #f6f7f9;
  padding: 12px;
}

.qr-card__img img{
  display:block;
  max-width:100%;
  width:100%;
  height:auto;
  aspect-ratio: 1 / 1;        /* квадрат без overflow */
  object-fit: contain;
}

.qr-card__body{ margin-top:12px; display:flex; flex-direction:column; gap:6px; }
.qr-card__title{ font-size:18px; line-height:1.3; margin:0; }
.qr-card__text{ color:#6b7280; margin:0 0 8px; }
.qr-card__btn{ width:100%; }

/* Узкие экраны — гарантированно одна колонка */
@media (max-width: 480px){
  .qr-grid{ grid-template-columns: 1fr; gap:12px; }
}

/* На всякий случай: предотвращаем горизонтальный скролл из-за картинок/карточек */
.container, .qr-grid, .qr-card{ overflow: visible; }






/* === How we work (mobile fix) === */
.how { margin: 24px 0 32px; }
.how__row{
  display:flex;
  gap:16px;
  align-items:flex-start;
  flex-wrap:wrap;              /* <— разрешаем перенос колонок */
}
.how__col{
  flex:1 1 320px;              /* на широких — 2 колонки, на узких — одна */
  min-width:0;                 /* <— важно, чтобы текст не выталкивал контейнер */
}
.how__text h2{
  margin:0 0 12px;
  line-height:1.2;
  overflow-wrap:anywhere;      /* на узких не даём заголовку «съезжать» */
}
.how__media{
  border-radius:16px;
  overflow:hidden;             /* скругление — безопасно, не режем текст */
}
.how__media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;            /* картинка заполняет блок без выпирания */
  aspect-ratio: 4 / 3;         /* можно убрать, если не нужно фикс. соотношение */
}

/* гарантированно одна колонка на очень узких */
@media (max-width: 600px){
  .how__col{ flex-basis:100%; }
}









/* ====== КНОПКИ ====== */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 20px; border-radius:12px; font-weight:600; gap:8px;
  border:1px solid transparent; transition:.2s ease-in-out; white-space:nowrap;
}
.btn--primary{background:var(--c-accent); color:#fff}
.btn--primary:hover{filter:brightness(.95)}
.btn--outline{border-color:var(--c-accent-2); color:var(--c-accent-2)}
.btn--outline:hover{background:var(--c-accent-2); color:#fff}
.btn--ghost{background:#fff; color:var(--c-accent-2); border:1px solid var(--c-accent-2)}
.btn--ghost:hover{background:rgba(11,59,105,.06)}

/* ====== ХЕДЕР ====== */

.site-header{
  position:sticky; top:0; z-index:10; background:#ffffffd9; backdrop-filter:saturate(150%) blur(8px);
  border-bottom:1px solid #eef2f7;
}
.site-header .container{
  max-width: 1440px;  /* 1320/1440/1600 — на выбор */
}
.header__wrap{display:flex; align-items:center; gap:24px; padding:12px 0}
.logo{font-weight:800; letter-spacing:.5px; font-size: 30px; color: #12317A; line-height: 0.9; margin-left: 15px}
.logo span{display: block; font-size: 18px; color: #D40003; font-weight: 700}
.nav{display:flex; gap:16px; margin-left:auto}
.nav a{padding:8px 10px; border-radius:10px}
.nav a:hover{background:#f3f4f6}

/* === БУРГЕР === */

.burger.is-open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:1}
.burger.is-open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}


/* показать бургер и на десктопе */
.burger{
  display:inline-flex;
  margin:0 8px;
  width:44px; height:40px;
  border:1px solid #d1d5db; border-radius:10px;
  background:#fff; cursor:pointer;
  flex-direction:column;           /* вертикальные полоски */
  gap:6px; align-items:center; justify-content:center;
  order:3;	
}
.burger span{
  display:block; width:22px; height:2px;
  background:#0b3b69; border-radius:2px; transition:.2s ease;
}



/* ====== HERO ====== */
.hero{position:relative; min-height:520px; display:grid; place-items:center; color:#fff; background:linear-gradient(180deg, rgba(11,59,105,.85), rgba(11,59,105,.7))}
.hero__bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.35}
.hero__content{position:relative; text-align:center; padding:44px 0}
.hero h1{font-size:clamp(28px, 4vw, 44px); margin:0 0 12px}
.lead{max-width:1100px; margin:0 auto 20px; color:#e6eef7}
.hero__cta{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
.hero__content .distributor {
  margin: 0 0 54px 0;                 /* больше отступов */
  font-size: 18px;                /* повыше текст */
  line-height: 1.5;
  color: #fff;
  background: rgba(11,59,105,.55); /* полупрозрачный фон */
  display: inline-block;
  padding: 14px 20px;             /* крупнее блок */
  border-radius: 8px;
  font-weight: 400;
  max-width: 680px;               /* чтобы текст не расползался на всю ширину */
}
.hero__content .distributor strong {
  font-weight: 600;               /* лёгкое выделение жирным */
}




/* блок иконок в шапке */
.header__social{
  display:flex; gap:10px; margin-left:8px;
}
.soc{
  --size: 36px;
  width:var(--size); height:var(--size);
  display:grid; place-items:center;
  border:1px solid #d1d5db; border-radius:50%;
  background:#fff; color:#0b3b69;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  box-shadow:0 4px 12px rgba(2,6,23,.08);
}
.soc:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(2,6,23,.12); border-color:#cbd5e1; }

.soc svg{ width:20px; height:20px; fill:currentColor; }

/* фирменные цвета при наведении */
.soc--wa:hover{ color:#25D366; }    /* WhatsApp */
.soc--tg:hover{ color:#229ED9; }    /* Telegram */
.soc--wc:hover{ color:#1AAD19; }    /* WeChat */
.soc--mail:hover{ color:#0b3b69; }  /* Mail */

@media (max-width:900px){
  .header__social{ display:none; } /* можно скрыть в мобильном хедере */
}





/* ====== CATALOG ====== */
.catalog{padding:24px 0 8px}
.catalog h2{text-align:center; margin:0 0 24px}
.catalog__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.cat-card{border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); background:#fff}
.cat-card__img{aspect-ratio: 4/3; object-fit:cover}
.cat-card__body{padding:14px}
.cat-card__title{font-weight:700}
.cat-card__desc{color:var(--c-sub); font-size:14px; margin-top:6px}
.cat-card__link:hover .cat-card__title{color:var(--c-accent)}



/* ====== AUDIENCE ====== */
.audience{padding:26px 0 24px}
.audience h2{text-align:center; margin:0 0 24px}
.audience__grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
.aud-card{background:#fff; border:1px solid var(--c-muted); border-radius:var(--radius); padding:20px; text-align:center; box-shadow:var(--shadow)}
.aud-card__icon svg{fill:var(--c-accent-2)}
.aud-card__title{font-weight:700; margin-top:8px}
.aud-card__text{color:var(--c-sub); font-size:14px}



/* ====== BENEFITS ====== */
.benefits{padding:32px 0; background:#f9fafb; border-block:1px solid #eff3f7}
.benefits h2{text-align:center; margin:0 0 20px}
.benefits__list{
  display:grid; grid-template-columns:repeat(5,1fr); gap:12px; max-width:1100px; margin:0 auto;
}
.benefits__list li{
  display:flex; gap:10px; align-items:flex-start; background:#fff; border:1px solid var(--c-muted);
  padding:12px 15px; border-radius:12px; font-size:14px; box-shadow:var(--shadow);
}
.benefits__list svg{fill:var(--c-accent); flex:0 0 auto}



/* === НАМ ДОВЕРЯЮТ === */
.clients__wrap{ position:relative; }
.clients,
.clients__wrap { max-width:100%; overflow:clip; }   /* clip = не рисовать горизонтальный скролл страницы */
.clients { --cards:8; --gap:12px; }
.clients h2{max-width: 60%; margin:10px 0 16px 20%; text-align: center}
.clients__wrap{position:relative}

.clients__scroller{
      
  scroll-padding-inline: 24px 56px;
  position: relative;                 /* <<< ОБЯЗАТЕЛЬНО */
  width:60%; max-width:60%;
  margin-left:21%;
  overflow-x:auto; overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  border:1px solid #eef2f7; border-radius:16px;
   padding:16px 56px; background:#fff;
  scrollbar-width:none; -ms-overflow-style:none;
}
.clients__scroller::-webkit-scrollbar{ display:none; }

/* «лидирующий» отступ слева */
.clients__track{
  display:flex; gap:var(--gap); align-items:stretch;
  width:max-content; margin:0; padding:0 0 0 24px; /* <<< отступ у 1-й карточки */
}
.clients__scroller{ scroll-padding-left:24px; }     /* чтобы snap/стрелки учитывали отступ */



.client-card{	
  flex-direction:column;
  justify-content:flex-start;	
  flex:0 0 auto; box-sizing:border-box;
  width: calc((100% - (var(--cards) - 1)*var(--gap)) / var(--cards));
  scroll-snap-align:start;
  border:1px solid #e5e7eb; border-radius:14px;
  background:#fff; box-shadow:0 6px 16px rgba(2,6,23,.06);
  display:flex; grid-template-rows:1fr auto; align-items:center;
  padding:10px; min-height:120px;
}

  


.client-card__logo{display:flex; align-items:center; justify-content:center; place-items:center; aspect-ratio:3/2; line-height:0}
.client-card__logo img{width:100%; max-height:100%; object-fit:contain; filter:grayscale(100%); opacity:.9}
.client-card__logo img:hover{filter:none; opacity:1}
.client-card__name{margin-top:8px; text-align:center; font-size:14px; color:#334155;line-height:1.25;max-height: calc(1.25em * 2);min-height: calc(1.25em * 2);
overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical; -webkit-line-clamp:2;text-overflow:ellipsis;word-break:break-word; hyphens:auto;}

.client-card__logo .placeholder{
  width: 92%; height: auto; color: #94a3b8; /* currentColor */
}
/* При наведении можно «оживить», как обычные лого */
.client-card__logo:hover .placeholder{ color:#475569; }

.clients__nav{
  position:absolute; top:50%; transform:translateY(-50%);
  pointer-events:auto;
  width:40px; height:40px; border-radius:50%;
  border:1px solid #d1d5db; background:#fff; color:#0b3b69;
  display:grid; place-items:center; font-size:20px; cursor:pointer;
  box-shadow:0 8px 16px rgba(2,6,23,.12);
}
.clients__nav--prev{ left:8px; }
.clients__nav--next{ right:8px; }
.clients__nav[aria-disabled="true"]{ opacity:.4; pointer-events:none; }

.clients__fade{
  position:absolute; top:0; bottom:0; width:56px; pointer-events:none;
  background:linear-gradient(to right, #fff, rgba(255,255,255,0));
}
.clients__fade--left{ left:0; }
.clients__fade--right{ right:0; transform:scaleX(-1); }

.clients__navs{
  position:absolute;   /* будем выставлять left/width/height из JS */
  top:0;
  pointer-events:none;
  z-index:5;
}


/* кастом-скроллбар необязателен */
.clients__scroller::-webkit-scrollbar{height:10px}
.clients__scroller::-webkit-scrollbar-thumb{background:#e5e7eb; border-radius:8px}
.client-initials{
  display:inline-grid; place-items:center;
  width:92%; aspect-ratio:3/2;
  border:2px solid currentColor; border-radius:12px;
  color:#94a3b8; font-weight:700; letter-spacing:.04em;
  font-size:28px; font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;padding: 10px;margin: 10px 0 15px;
}
.client-card__logo:hover .client-initials{ color:#475569; }




/* ====== CASES ====== */
.cases{padding:36px 0}
.cases h2{text-align:center; margin:0 0 20px}
.cases__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.case-card{background:#fff; border:1px solid var(--c-muted); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow)}
.case-card__img{aspect-ratio:4/3; object-fit:cover}
.case-card__meta{padding:12px}
.case-card__title{font-weight:700}
.case-card__desc{ color:#334155; margin-top:6px; }
.case-card__kpi{  color:var(--c-accent-2); font-size:14px; margin-top:6px; }


/* ====== VIDEO ====== */
.video{padding:8px 0 8px}
.video .container{
  display:flex;
  flex-direction:column;
  align-items:center;   /* центр по горизонтали */
}

.video h2{text-align:center; margin:0 0 16px}
.video__frame picture, .video__frame img{display:block; width:100%}
.video__frame{
  width: clamp(560px, 70vw, 900px);  /* меньше на десктопе, адаптивно */
  aspect-ratio: 16 / 9;
  margin: 12px auto 0;               /* центрирование */
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  background:#000;
  position: relative;
}
.video__poster,
.video__poster img{
  display:block; width:100%; height:100%; object-fit:cover;
}
.video__play{
  position:absolute; inset:0; margin:auto; width:92px; height:92px;
  border-radius:50%; border:0; cursor:pointer;
  background:#d7263d; color:#fff; font-size:34px; line-height:1;
  box-shadow:0 10px 30px rgba(215,38,61,.35);
  display:grid; place-items:center;
  transition:transform .15s ease, filter .15s ease;
}
.video__play:hover{ transform:scale(1.05); filter:brightness(.95); }
.video__play:active{ transform:scale(0.98); }

/* Когда видео запущено — прячем постер/кнопку */
.video__frame.is-playing .video__poster,
.video__frame.is-playing .video__play{ display:none; }

.video__frame iframe{
  position:absolute; inset:0;
  width:100%; height:100%;
  border:0;
}










/* ====== LEAD ====== */
.lead{padding:40px 0}
.lead__wrap{
  display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:center;
  background:linear-gradient(90deg, #0b3b69, #0f4f8f); color:#fff; border-radius:var(--radius); padding:24px;
}
.lead__text h2{margin:0 0 6px}
.lead__text p{margin:0; color:#e6eef7}
.lead__form{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.lead__form label{display:grid; gap:6px; font-size:14px}
.lead__form input, .lead__form select, .lead__form textarea{
  width:100%; padding:12px 12px; border-radius:10px; border:1px solid #c7d2fe;
}
.lead__form textarea{grid-column:1 / -1}
.lead__form .btn{grid-column:1 / -1}

.lead__text img {
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.1));
  transition: transform 0.3s ease;
}
.lead__text img:hover {
  transform: scale(1.02);
}






/* ====== FOOTER ====== */
.site-footer .container{ max-width:1440px; }
.site-footer{background:#0b3b69; color:#fff}
/* 4 колонки на десктопе */
.footer__grid{display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; gap:24px; padding:28px 0;}
.logo--footer{font-weight:800; margin-bottom:0; color: #fff;}
.footer__cats h3, .footer__menu h3, .footer__contacts h3{ margin:0 0 8px; }
.footer__cats ul{list-style:none; margin:0; padding:0; display:grid; gap:2px;} 
.footer__menu ul, .footer__contacts ul{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
.footer__cats a{color:#fff; line-height: 1} 
.footer__menu a{ color:#fff; }
.footer__cats a:hover, .footer__menu a:hover{ color:#cfe4ff; }
.footer__legal{text-align:center; padding:10px 0; border-top:1px solid rgba(255,255,255,.2); font-size:14px}
.site-footer .footer__brand p{padding:0 100px 0 0;}
.footer__brand .footer__country{  
  margin-bottom:6px;    /* зазор до абзаца */
  font-size:22px;       /* меньше шрифт */
  font-weight:600;      /* чуть тоньше */
  color:rgba(255,255,255,.8);
}
.footer__social{
  
  display:flex; flex-wrap:wrap; gap:10px;
  align-items:center;
  justify-self: end;       /* прижать внутри колонки вправо */
  align-self: start;
  width: max-content;      /* чтобы блок не растягивался */
  margin-top: 56px;
  align-self: start;  	
}

/* используем ту же кнопку-иконку, что в хедере */
.footer__social .soc{
  --size:36px;
  width:var(--size); height:var(--size);
  display:grid; place-items:center;
  border:1px solid #d1d5db; border-radius:50%;
  background:#fff; color:#0b3b69;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  box-shadow:0 4px 12px rgba(2,6,23,.08);
}
.footer__social .soc:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(2,6,23,.12);
  border-color:#cbd5e1;
}
.footer__social .soc svg{ width:20px; height:20px; fill:currentColor; }

/* фирменные ховеры */
.footer__social .soc--wa:hover{ color:#25D366; }
.footer__social .soc--tg:hover{ color:#229ED9; }
.footer__social .soc--wc:hover{ color:#1AAD19; }
.footer__social .soc--mail:hover{ color:#0b3b69; }
.footer__social .soc--rt:hover{ color:#ee1d52; } /* яркий акцент для RuTube */



/* === МОБИЛЬНОЕ МЕНЮ === */
.mobile-nav{
 position:fixed; top:0; right:0; bottom:0;
  width:100%; max-width:100vw;
  background:#fff!important;           /* белая подложка */
  transform:translateX(100%);  /* спрятано */
  transition:transform .25s ease;
  z-index: 1000;             /* выше .backdrop */
  /* на всякий случай, убираем артефакты */
  opacity:1 !important;
  filter:none !important;
  backdrop-filter:none !important;
}
.mobile-nav__close{
  position: absolute;
  top: 8px; right: 8px;
  width: 36px; height: 36px;
  border: 0; border-radius: 10px;
  background: #f3f4f6;
  font-size: 22px; line-height: 1;
  cursor: pointer;
  z-index: 1;
}
.mobile-nav__inner{padding:20px; display:grid; gap:14px; background:#fff;}
.mobile-nav__inner a{padding:10px 8px; border-radius:10px}
.mobile-nav__inner a:hover{background:#f3f4f6}
.mobile-nav__btn{margin-top:8px}


body.menu-open .backdrop{
  opacity:1; pointer-events:auto;
}
body.menu-open .mobile-nav{
  transform:translateX(0);
}
.site-header{ z-index: 10; }

/* === ХЛЕБНЫЕ КРОШКИ (видимые) === */
.breadcrumbs{border-bottom:1px solid #eef2f7; background:#fafafa}
.breadcrumbs .container{max-width: 1440px;  /* 1320/1440/1600 — на выбор */}
.breadcrumbs ol{list-style:none; margin:0; padding:8px 0; display:flex; gap:8px; flex-wrap:wrap}
.breadcrumbs a{color:#0b3b69}
.breadcrumbs li::after{content:"/"; margin-left:8px; color:#9ca3af}
.breadcrumbs li:last-child::after{content:""; margin:0}





/* ===== RFQ секция ===== */
.rfq {
  background: linear-gradient(90deg, #0f4f8f, #0b3b69);
  color: #fff;
  border-top: 1px solid rgba(255,255,255,.12);
  border-bottom: 1px solid rgba(255,255,255,.12);
  padding: 40px 0 64px;
  margin: 0 auto 60px;
  max-width: 1100px;
  border-radius: 15px;
  box-shadow: 0 12px 30px rgba(0,0,0,.2);
}

/* Контейнер внутри RFQ */
.rfq .container {
  max-width: none !important;
  padding: 0 40px;
}

/* Сетка */
.rfq__wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}
@media (max-width: 900px) {
  .rfq__wrap {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}
@media (max-width: 420px){
  .rfq__tooltip{
    left: 50%;
    right: auto;
    transform: translate(-50%, 6px) scale(.98);
  }
  .rfq__hint:hover + .rfq__tooltip,
  .rfq__hint:focus + .rfq__tooltip{
    transform: translate(-50%, 0) scale(1);
  }
  .rfq__tooltip::after{
    left: calc(50% - 8px);
    right: auto;
  }
}	
}
@media (prefers-reduced-motion: reduce) {
  .rfq__tooltip{
    transition: none;
    transform: none;
  }
  .rfq__hint:hover + .rfq__tooltip,
  .rfq__hint:focus + .rfq__tooltip{
    transition: none;
  }
}

/* Текст и изображение */
.rfq__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.rfq__text h2 {
  margin-bottom: 10px;
  font-size: 1.9rem;
}
.rfq__text p {
  opacity: .9;
  line-height: 1.5;
  margin-bottom: 20px;
}
.rfq__img {
  max-width: 480px;
  width: 100%;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
}

/* Форма */
.rfq__form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 520px;
  position: relative;
}
.rfq__form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 15px;
}

/* Инпуты и текстовые поля */
.rfq__form input[type="text"],
.rfq__form input[type="email"],
.rfq__form input[type="tel"],
.rfq__form input[type="file"],
.rfq__form select,
.rfq__form textarea {
  width: 100%;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.95);
  color: #0b3b69;
  font: inherit;
  line-height: 1.3;
  outline: none;
  transition: 0.25s;
}
.rfq__form input:focus,
.rfq__form select:focus,
.rfq__form textarea:focus {
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(147,197,253,.25);
}
.rfq__form textarea {
  resize: vertical;
}

/* Поле загрузки файлов */
.rfq__files {
  display: grid;
  gap: 6px;
}
.rfq__files input[type="file"] {
  padding: 10px;
  background: #fff;
  border: 1px solid #c7d2fe;
  color: #0b3b69;
  border-radius: 8px;
  font-size: 14px;
}

/* Кнопка отправки */
.rfq__submit {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
  padding: 12px 26px;
  font-weight: 600;
  background: #fff;
  color: #0b3b69;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  transition: background .3s, transform .2s;
}
.rfq__submit:hover {
  background: #e6f0ff;
  transform: translateY(-1px);
}

/* Вопросик */
.rfq__hint {
  display: inline-grid;
  place-items: center;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: #0b3b69;
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  cursor: help;
  outline: none;
}

/* Подсказка */
.rfq__tooltip {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  display: block;
  background:#ffffff;
  color:#0b3b69;
  border:1px solid #dbeafe;
  border-radius:10px;
  padding:10px 12px;
  max-width:520px;
  box-shadow:0 12px 30px rgba(2,6,23,.25);
  z-index:20;

  /* анимация появления */
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px) scale(.98);
  pointer-events: none;
  transition:
    opacity .22s ease,
    transform .22s ease,
    visibility 0s linear .22s; /* прячет из потока после анимации */
}
.rfq__hint:hover + .rfq__tooltip,
.rfq__hint:focus + .rfq__tooltip{
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
  transition:
    opacity .22s ease,
    transform .22s ease,
    visibility 0s; /* сразу делает видимым */
}




/* Капча */
.rfq__captcha {
  margin-top: 10px;
}

/* Мобильная адаптация */
@media (max-width: 768px) {
  .rfq {
    margin: 0 16px 40px;
    padding: 30px 20px 50px;
  }
  .rfq__img {
    max-width: 100%;
  }
  .rfq__form {
    max-width: 100%;
  }
}


/* Мобильная кнопка "трубка" в хедере */
.contact-btn{
  display:none;              /* desktop: скрыто */
  width:40px; height:40px;
  margin-left:10px;
  border:1px solid #d1d5db;
  border-radius:50%;
  background:#fff; color:#0b3b69;
  display:none; align-items:center; justify-content:center;
  box-shadow:0 4px 12px rgba(2,6,23,.08);
}
.contact-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(2,6,23,.12); }





/* Полноэкранная панель контактов — только мобайл */
.contact-panel{ position:fixed; inset:0; z-index:100; }
.contact-panel[hidden]{ display:none; }

.contact-panel__backdrop{
  position:absolute; inset:0; background:rgba(2,6,23,.35);
  opacity:0; transition:opacity .2s ease;
}
.contact-panel__sheet{
  position:absolute; inset:auto 0 0 0;   /* снизу */
  background:#fff; color:#0f172a;
  border-radius:16px 16px 0 0;
  padding:20px 16px 28px;
  transform:translateY(100%);
  transition:transform .25s ease;
  max-height:90vh; overflow:auto;
}
.contact-panel.is-open .contact-panel__backdrop{ opacity:1; }
.contact-panel.is-open .contact-panel__sheet{ transform:translateY(0); }

.contact-panel__close{
  position:absolute; top:8px; right:8px;
  width:36px; height:36px; border:0; border-radius:10px;
  background:#f3f4f6; font-size:22px; line-height:1; cursor:pointer;
}

.contact-panel h2{ margin:6px 0 12px; text-align:left; }
.contact-item{
  display:block; padding:12px 10px; border:1px solid #e5e7eb; border-radius:12px;
  margin-bottom:10px; background:#fff; text-decoration:none; color:inherit;
}
.contact-item strong{ display:block; font-size:14px; color:#334155; }
.contact-item span{ display:block; font-size:16px; }

/* Показать кнопку и причесать хедер на мобиле */
@media (max-width:720px){
  .contact-btn{ display:inline-flex; }        /* показать трубку */
  .burger{ margin-left:auto; }                /* бургер вправо (останется справа от трубки) */
}






/* ====== АДАПТИВ ====== */
@media (min-width:1200px){
  .client-card__name{-webkit-line-clamp:3;max-height: calc(1.25em * 3);min-height: calc(1.25em * 3);
  }
}

@media (max-width: 1100px){
  .catalog__grid{grid-template-columns:repeat(3,1fr)}
  .benefits__list{grid-template-columns:repeat(3,1fr)}
  .cases__grid{grid-template-columns:repeat(3,1fr)}
  .client-card{ flex-basis: calc((100% - 3*12px)/4); } /* 4 в ряд */
	.clients__scroller{ --cards:4; }
}
@media (max-width: 900px){
  .nav{display:none}
  .header__cta{display:none}
  .burger{display:inline-flex}	
  .audience__grid{grid-template-columns:1fr 1fr}
  .lead__wrap{grid-template-columns:1fr}
	.mobile-social{ display:flex; gap:10px; margin-top:8px; }
.mobile-social .soc{ --size:40px; } /* увеличили круглые кнопки до 40px */
	.rfq__wrap{
    width: 100%;
    grid-template-columns: 1fr;
		  }
	.rfq__row .rfq__tooltip{ left:0; right:auto; }
}
@media (max-width: 960px){
  .footer__grid{ grid-template-columns:1fr 1fr; }
  .footer__social{ grid-column: 1 / -1; }	
}
@media (max-width: 720px){
	.hero-mini__content {
  
  padding: 16px 0 18px 16px!important;
 
}
	
	
  .nav{display:none} /* при желании можно добавить бургер-меню позже */
  .catalog{padding:20px 0; margin: 0}	
  .catalog__grid{grid-template-columns:1fr 1fr}
  .benefits__list{grid-template-columns:1fr 1fr}
  .cases__grid{grid-template-columns:1fr 1fr}
  .lead{width: 96%; margin:3% 2%; padding: 0;}
  .lead__form{grid-template-columns:1fr}
  .client-card{ flex-basis: calc((100% - 2*12px)/3); } /* 3 в ряд */
  .clients__scroller{ --cards:3; }
  .clients__nav{ display:none; } /* свайп на мобиле */
  .video__frame{ width: 100%; }
  .mobile-social{ display:flex; gap:10px; margin-top:8px; }
  .mobile-social .soc{ --size:40px; } /* увеличили круглые кнопки до 40px */
  .site-footer p,
  .footer__brand p{ padding-right:0; }
  .site-header .container{ padding-left: 22px; padding-right: 12px; }
  .logo{ font-size: 24px; margin-right: auto}          /* было 30 */
  .logo span{ font-size: 16px; }
  .logo{ margin-left: 2px; }   
	
  .hero h1 {font-size:24px; margin:0 0 0;}	
	.hero h2 {font-size:18px}
  .hero__content{padding:20px 5px; margin: 0}
	.hero__content .distributor {font-size: 16px; margin-bottom: 20px}
	 /* бургер справа и с вертикальными полосками */
  .burger{
    display:inline-flex;
    margin:0 10px 0 10px;                /* прижать вправо */
    width:40px; height:40px;
    flex-direction:column;           /* вертикальные полоски */
    gap:6px; align-items:center; justify-content:center;
	order:3;
  }
  .burger span{
    width:25px; height:2px;          /* вертикальные линии */
    background:#0b3b69; border-radius:2px; transition:.2s ease;
  }

  /* отключаем старую анимацию крестика, чтобы не ломала вертикальные полоски */
  .burger.is-open span:nth-child(1),
  .burger.is-open span:nth-child(2),
  .burger.is-open span:nth-child(3){
    transform:none; opacity:1;
  }
	.header__wrap{gap:10px;}                /* между трубкой и бургером ровно 10px */
  	
	
  .contact-btn{ display:inline-flex; margin-left:auto; order:2; } /* уводим трубку к правому краю */
  .contact-panel{
  position: fixed;
  
  z-index: 1200;           /* поверх всего */
  width: 100vw;
  height: 100vh;
}
.contact-panel__sheet{
  border-radius: 0;
  position: absolute;
  left: 0; right: 0; bottom: 0; top: 0;
  width: 100%;
  max-width: 100vw;        /* не шире экрана */
  transform: translateY(100%);
	opacity: 1;
  /* остальной ваш стиль остаётся */
}
.contact-panel.is-open .contact-panel__sheet{
  transform: translateY(0);
}

	

	
	
	
	
	
	
	
	
	
	
	
	
	
	
}
@media (max-width: 560px){
  .footer__grid{ grid-template-columns:1fr; }
  .footer__brand{ padding-right:0; }
	.footer__social{ justify-content:center; }
	 .rfq__row{ flex-direction:column; align-items:stretch; }
  .rfq__submit{ justify-content:center; }
}
@media (max-width: 420px){
  .catalog__grid, .benefits__list, .cases__grid{grid-template-columns:1fr}
}
@media (min-width: 901px){
  
  .backdrop{ display:none !important; }
  body.body--lock{ overflow:auto; } /* на всякий случай */
}
.mobile-nav{
    width:40vw;              /* 40% экрана */
    max-width:520px;         /* «потолок» по пикселям */
    min-width:360px;         /* чтобы не была слишком узкой */
    box-shadow: -20px 0 40px rgba(2,6,23,.15);
    border-left: 1px solid #e5e7eb;
  }

.mobile-nav__inner{
    display: grid;
    grid-template-columns: 1fr auto;     /* левая колонка — CTA, правая — соц.иконки */
    grid-auto-rows: min-content;
    gap: 12px;
    align-items: center;
  }

  /* Ссылки-меню — на всю ширину, каждой своей строкой */
  .mobile-nav__inner a:not(.mobile-nav__btn){
    grid-column: 1 / -1;
  }

  /* CTA слева */
  .mobile-nav__btn{
    grid-column: 1;
    justify-self: start;                  /* не растягивать на всю ширину */
  }

  /* Соц-иконки справа, в одну линию */
  .mobile-social{
    grid-column: 2;
    justify-self: end;
    display: flex;
    flex-wrap: nowrap;                    /* не переносить */
    gap: 10px;
  }











/* ==== МОБИЛЬНЫЙ ФИКС ЛЕВОГО/ПРАВОГО ОТСТУПА ==== */
@media (max-width: 720px){

  /* общий контейнер — без лишних полей */
  .container{
    padding-left: 12px !important;
    padding-right: 12px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
  }

  /* Каталог и дальше — убираем любые внешние маргины секций */
  
    

  /* RFQ: снимем десктопные 20%/60% */
  .rfq{
    margin: 3% 2%;
    max-width: 96%;
    border-radius: 12px;
	padding: 0 0 2% 0;
  }
  .rfq :is(.rfq__wrap, .container.rfq__wrap){
    width: 100% !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* «Нам доверяют»: заголовок и скроллер на всю ширину */
  .clients h2{
    max-width: 100% !important;
    margin: 10px 0 16px 0 !important;
    padding: 0 12px !important;
    text-align: center;
  }
  .clients__scroller{
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;   /* было 21% */
    padding: 16px 0 !important;    /* вместо 16px 56px */
    border-radius: 12px;
  }
  .clients__track{
    padding-left: 16px !important; /* ровный старт первого логотипа */
  }

  /* Хлебные крошки — без смещения контейнера */
  .breadcrumbs .container{
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Видео — пусть тянется во всю ширину */
  .video__frame{
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}