/* =========================================================================
   Фабрика KS — главная страница без Elementor.
   Все размеры сняты с живой страницы (вычисленные стили на 1920 / 1024 / 390).
   Брейкпоинты как в оригинале: ≤1024 (планшет), ≤767 (мобильный), ≤640 (мобильная шапка и слайдеры).
   ========================================================================= */

/* ---------- Шрифты (Onest вариативный, подмножества как у Google Fonts на сайте) ---------- */
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/onest-cyrillic-ext.woff2') format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/onest-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/onest-math.woff2') format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/onest-vietnamese.woff2') format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/onest-symbols.woff2') format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/onest-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/onest-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* Два глифа из themify (стрелки слайдеров) и один из Lucide (бургер) — те же, что на сайте */
@font-face { font-family: 'ks-themify'; src: url('../fonts/themify-arrows.woff2') format('woff2'); font-display: block; }
@font-face { font-family: 'ks-lucide'; src: url('../fonts/lucide-menu.woff2') format('woff2'); font-display: block; }
@font-face { font-family: 'ks-uicore'; src: url('../fonts/uicore-arrow.woff2') format('woff2'); font-display: block; }

:root {
  --ks-teal: #20B8AD;
  --ks-dark: #1A1A1A;
  --ks-dark-2: #1D1D1B;
  --ks-mint: rgba(32, 184, 173, .18);
  --ks-font: 'Onest', sans-serif;
}

/* ---------- База ---------- */
*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-tap-highlight-color: transparent;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: none; text-size-adjust: none;
  font-feature-settings: "kern"; font-kerning: normal;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--ks-dark);
  color: #6E7A84;
  font-family: var(--ks-font);
  font-size: 20px;
  line-height: 30px;
  font-weight: 400;
}
body.ks-lock { overflow: hidden; }
.ks-page { overflow-x: hidden; overflow-x: clip; }
p, h1, h2, h3, h4, h5, figure { margin: 0; }
ul { list-style: none; margin: 0; padding: 0; }
a { color: inherit; text-decoration: none; }
img, video, svg { vertical-align: middle; }
img { max-width: 100%; height: auto; border: 0; }
button { font: inherit; color: inherit; }
.ks-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

.ks-wrap { width: min(95%, 1170px); margin-left: auto; margin-right: auto; }

.ks-rich p { margin: 0 0 1em; }
.ks-rich p:last-child { margin-bottom: 0; }

.ks-ti { font-family: 'ks-themify'; font-style: normal; font-weight: 400; font-size: 20px; line-height: 1; speak: never; }
.ks-ti--left::before { content: '\e629'; }
.ks-ti--right::before { content: '\e628'; }
.ks-ti--check::before { content: '\e64c'; }

/* ---------- Анимации появления ----------
   На сайте анимации Elementor подменены темой UiCore: сдвиг на 7vh + проявление, 1.9 с, свои кривые.
   Задержки 120/160/240 мс — как в настройках виджетов. */
@keyframes ks-uFadeInDown { from { transform: translate3d(0, -7vh, 0); } to { transform: translateZ(0); } }
@keyframes ks-uFadeInLeft { from { transform: translate3d(-7vh, 0, 0); } to { transform: translateZ(0); } }
@keyframes ks-uFadeIn { from { opacity: 0; } to { opacity: 1; } }
.ks-js .ks-anim { visibility: hidden; }
.ks-js .ks-anim.is-in {
  visibility: visible;
  animation-duration: 1.9s;
  animation-timing-function: cubic-bezier(.22, 1, .36, 1), cubic-bezier(0, 0, .2, 1);
}
.ks-js .ks-anim.is-in[data-anim="fadeInDown"] { animation-name: ks-uFadeInDown, ks-uFadeIn; }
.ks-js .ks-anim.is-in[data-anim="fadeInLeft"] { animation-name: ks-uFadeInLeft, ks-uFadeIn; }
@media (prefers-reduced-motion: reduce) {
  .ks-js .ks-anim { visibility: visible; }
  .ks-js .ks-anim.is-in { animation: none; }
}

/* ---------- Кнопка «наверх» (тема UiCore; появляется после 300px прокрутки) ---------- */
.ks-totop {
  position: fixed; left: 30px; bottom: 30px; z-index: 999;
  display: inline-block; width: 40px; line-height: 40px; text-align: center;
  font-family: 'ks-uicore'; font-size: 15px; color: #070707;
  background: #fff; border-radius: 4px; box-shadow: 1px 0 22px -9px rgba(0, 0, 0, .4);
  transform: rotate(180deg) scale(1); transition: all .3s cubic-bezier(.61, -.12, .08, 1.55); cursor: pointer;
}
.ks-totop::before { content: '\e901'; }
.ks-totop:hover { transform: rotate(180deg) scale(1.1); box-shadow: 0 0 20px -9px rgba(0, 0, 0, .2); }
.ks-totop:not(.is-visible) { opacity: 0; pointer-events: none; transform: rotate(180deg) scale(.3); }
@media (max-width: 1025px) { .ks-totop { display: none; } }

/* ---------- Заголовок секции с бирюзовым шевроном ---------- */
.ks-title { display: flex; align-items: center; font: 700 40px/52px var(--ks-font); color: #fff; }
.ks-title__icon { flex: 0 0 auto; width: 45px; height: 45px; margin-right: 11.25px; }
.ks-title__text { padding-left: 5px; }

/* =========================================================================
   ШАПКА
   ========================================================================= */
.ks-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  display: flex; flex-direction: column;
  border-radius: 0 0 30px 30px;
  background-color: transparent;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  transition: background-color .5s ease;
}
.ks-header.is-scrolled { background-color: rgba(0, 0, 0, .65); }
.ks-header__inner { width: min(95%, 1170px); margin: 0 auto; display: flex; gap: 20px; padding: 20px 0; }
.ks-header__left { flex: 0 1 82%; min-width: 0; position: relative; z-index: 99; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.ks-header__right { flex: 0 1 18%; min-width: 0; position: relative; z-index: 99; display: flex; justify-content: flex-end; align-items: center; gap: 10px; }
.ks-header__logo { margin-right: -20px; line-height: 0; }
.ks-header__logo img, .ks-header__logotext img { display: block; width: auto; height: 35px; max-width: 100%; }
.ks-header__logotext { line-height: 0; overflow: hidden; transition: max-height .3s ease, opacity .3s ease; }

.ks-nav { padding-left: 10px; transition: margin-left .3s ease; }
.ks-nav__list { display: flex; flex-wrap: wrap; transition: gap .3s ease; }
.ks-nav__item { position: relative; display: flex; flex: 1 1 auto; }
.ks-nav__item::after { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: 12px; }
.ks-nav__link {
  display: flex; align-items: center; justify-content: center; flex: 1 1 auto;
  padding: 13px 17px;
  font: 500 16px/20px var(--ks-font); color: #fff; fill: #fff; white-space: nowrap;
  transition: color .2s, fill .2s;
}
.ks-nav__link:hover, .ks-nav__item:hover > .ks-nav__link { color: var(--ks-teal); fill: var(--ks-teal); }
.ks-nav__arrow { display: flex; align-items: center; padding: 10px 0 10px 10px; margin: -10px 0; line-height: 1; }
.ks-nav__arrow svg { width: .7em; height: .7em; fill: currentColor; }
.ks-nav__sub {
  position: absolute; top: 100%; left: 0; z-index: 10;
  min-width: 10em; max-width: 20em; margin-top: 11px; padding: 10px 25px 10px 15px;
  font-size: 17px; background: #fff; border-radius: 10px;
  box-shadow: rgba(100, 100, 111, .2) 0 7px 29px 0;
  opacity: 0; visibility: hidden; transition: opacity .15s ease, visibility .15s ease;
}
.ks-nav__item:hover > .ks-nav__sub, .ks-nav__item:focus-within > .ks-nav__sub { opacity: 1; visibility: visible; }
.ks-nav__sub a { display: block; padding: 14px 0; font: 500 17px/20px var(--ks-font); color: #333; white-space: nowrap; transition: color .2s; }
.ks-nav__sub a:hover { color: var(--ks-teal); }

.ks-header__cta {
  display: inline-block; padding: 15px 10px;
  font: 600 12px/12px var(--ks-font); text-transform: uppercase; text-align: center; color: #fff;
  background: var(--ks-teal); border: 2px solid var(--ks-teal); border-radius: 15px;
  transition: all .3s;
}
.ks-header__cta:hover { transform: scale(1.05); }
.ks-account { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; transition: opacity .18s; }
.ks-account img { display: block; width: 22px; height: 22px; }
.ks-account:hover { opacity: .75; }

/* мобильная шапка */
.ks-mheader { display: none; }

/* =========================================================================
   ПЕРВЫЙ ЭКРАН
   ========================================================================= */
.ks-hero { position: relative; z-index: 10; display: flex; flex-direction: column; }
.ks-hero__head { background: var(--ks-dark); }
.ks-hero__head-inner { display: flex; gap: 60px; padding: 160px 0; }
.ks-hero__title-col { flex: 0 0 49%; display: flex; flex-direction: column; justify-content: space-around; }
.ks-hero__title { font: 700 63px/80px var(--ks-font); letter-spacing: -.027em; text-transform: uppercase; color: #fff; }
.ks-hero__side { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.ks-hero__lead { font: 400 16px/27px var(--ks-font); color: #fff; }
.ks-hero__buttons { display: flex; justify-content: space-between; gap: 20px; margin-top: 10px; }
.ks-hbtn {
  display: flex; align-items: stretch; justify-content: center; gap: 10px; text-align: center;
  padding: 15px; border: 2px solid; border-radius: 15px;
  font: 600 16px/25px var(--ks-font); text-transform: uppercase; color: #fff;
  transition: all .3s;
}
.ks-hbtn svg { flex-shrink: 0; align-self: center; width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; transition: .3s all ease; }
.ks-hbtn--fill { background: var(--ks-teal); border-color: var(--ks-teal); }
.ks-hbtn--line { background: rgba(255, 255, 255, 0); border-color: #fff; }
.ks-hbtn:hover { transform: scale(1.05); }
.ks-hbtn--line:hover { background: var(--ks-teal); border-color: var(--ks-teal); }
.ks-hbtn:hover svg { transform: rotate(45deg); }
.ks-hero__video {
  position: relative; width: 102vw; margin-left: -1vw; margin-top: -80px;
  min-height: 620px; border-radius: 80px; overflow: hidden;
}
.ks-hero__video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* =========================================================================
   БАННЕР
   ========================================================================= */
.ks-banner { position: relative; z-index: 2; margin: -140px 0 -80px; background: var(--ks-teal); border-radius: 80px; }
.ks-banner__inner { padding: 195px 0 60px; }
.ks-banner__text { padding: 10px; font: 600 70px/85px var(--ks-font); text-transform: uppercase; color: #fff; }

/* =========================================================================
   О ФАБРИКЕ
   ========================================================================= */
.ks-about { position: relative; background: var(--ks-dark); padding-top: 170px; display: flex; flex-direction: column; gap: 20px; }
.ks-about__card-wrap { padding: 0 10px; }
.ks-about__card-wrap > .ks-wrap { padding: 10px 0; }
.ks-about__card { display: flex; flex-direction: column; gap: 20px; padding: 40px; background: #fff; border-radius: 30px; }
.ks-about__card .ks-rich { font: 400 18px/26px var(--ks-font); color: var(--ks-dark); }
.ks-about__subtitle { margin-top: 20px; font: 600 24px/28px var(--ks-font); color: var(--ks-dark); }

.ks-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.ks-stat { display: flex; flex-direction: column; gap: 7px; padding: 15px; background: var(--ks-mint); border: 2px solid var(--ks-teal); border-radius: 15px; }
.ks-stat--center { justify-content: center; }
.ks-stat__value { font: 600 25px/25px var(--ks-font); color: var(--ks-dark); }
.ks-stat__text { font: 400 16px/21px var(--ks-font); color: var(--ks-dark); }

.ks-adv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.ks-adv__card {
  display: flex; flex-direction: column; padding: 30px;
  background: var(--ks-dark); border: 2px solid #fff; border-radius: 30px;
  transition: background .3s, border .3s;
}
.ks-adv__card:hover { background: var(--ks-teal); border-color: var(--ks-teal); }
.ks-adv__icon { width: 80px; height: 80px; padding: 20px; background: #fff; border-radius: 100px; }
.ks-adv__icon img { display: block; width: 100%; height: 100%; }
.ks-adv__title { margin: 20px 0 10px; font: 600 24px/28px var(--ks-font); color: #fff; }
.ks-adv__text { font: 400 18px/26px var(--ks-font); color: #fff; }

.ks-why-title { margin-top: 20px; font: 600 33px/40px var(--ks-font); color: #fff; }
.ks-why-wrap { padding-bottom: 30px; }
.ks-why { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.ks-why__item { display: flex; flex-direction: column; justify-content: center; padding: 15px; background: var(--ks-teal); border: 2px solid var(--ks-teal); border-radius: 20px; }
.ks-why__item--empty { padding-top: 15px; padding-bottom: 15px; background: none; border: 0; }
.ks-why__item--empty::before { content: ''; display: block; height: 50px; } /* спейсер Elementor по умолчанию */
.ks-why__item p { font: 400 18px/24px var(--ks-font); color: #fff; }

/* ---------- Галерея (эффект fade, как swiper на сайте) ---------- */
.ks-gallery { position: relative; }
.ks-gallery--about { margin-top: 30px; }
.ks-gallery__viewport { position: relative; overflow: hidden; }
.ks-gallery__slide { position: absolute; top: 0; left: 0; width: 100%; margin-bottom: -1px; opacity: 0; transition: opacity .5s ease; }
.ks-gallery__slide.is-active { position: relative; opacity: 1; z-index: 1; }
.ks-gallery__slide img { display: block; width: 100%; height: 100vh; object-fit: cover; border-radius: 30px; }
.ks-gallery__nav {
  position: absolute; bottom: 20px; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; padding: 10px; border: 0; border-radius: 15px;
  background: #fff; color: #333; cursor: pointer;
  box-shadow: rgba(149, 157, 165, .2) 0 8px 24px;
  transition: .3s all ease;
}
.ks-gallery__nav--prev { right: 75px; }
.ks-gallery__nav--next { right: 20px; }
.ks-gallery__nav:hover { transform: translateY(-5px); background: #333; }
.ks-gallery__nav:hover .ks-ti { filter: invert(1); }
.ks-gallery__dots { position: absolute; left: 20px; bottom: 25px; z-index: 10; display: flex; align-items: flex-start; height: 30px; padding-top: 15px; }
.ks-gallery__dots button { width: 6px; height: 6px; margin: 0 6px; padding: 0; border: 0; border-radius: 50%; background: #fff; cursor: pointer; }
.ks-gallery__dots button.is-active { background: var(--ks-teal); }

/* =========================================================================
   ДВА СПОСОБА РАБОТАТЬ
   ========================================================================= */
.ks-ways { background: var(--ks-dark); }
.ks-ways__inner { display: flex; flex-direction: column; gap: 20px; padding-top: 90px; }
.ks-ways__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 20px; }
.ks-way {
  position: relative; display: flex; flex-direction: column; padding: 30px;
  background: #fff var(--way-bg) 50% 50% / cover no-repeat; border-radius: 20px;
  transition: transform .4s;
}
.ks-way::before { content: ''; position: absolute; inset: 0; background: #fff; border-radius: 20px; transition: background .3s, opacity .3s; }
.ks-way > * { position: relative; }
.ks-way:hover { transform: scale(1.03) translateY(-10px); }
.ks-way:hover::before { background: var(--ks-dark); opacity: .85; }
.ks-way__icon { display: block; width: 50px; height: 50px; }
.ks-way__title { margin: 20px 0 10px; font: 600 24px/28px var(--ks-font); color: var(--ks-dark); }
.ks-way__text p { margin: 0 0 16px; font: 400 16px/24px var(--ks-font); color: var(--ks-dark); }
.ks-way__text p:last-child { margin-bottom: 0; }
.ks-way__pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 15px; }
.ks-pill { padding: 5px 9px; border: 1px solid #333; border-radius: 15px; font: 400 14px/21px var(--ks-font); color: #333; text-align: center; }
.ks-way__btn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 20px; padding: 10px 15px;
  border: 2px solid var(--ks-teal); border-radius: 20px; background: #fff;
  font: 600 15px/25px var(--ks-font); text-transform: uppercase; color: var(--ks-teal);
  transition: all .3s;
}
.ks-way__btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ks-way:hover .ks-way__title, .ks-way:hover .ks-way__text p, .ks-way:hover .ks-pill { color: #fff; }
.ks-way:hover .ks-pill { border-color: #fff; }
.ks-way:hover .ks-way__btn, .ks-way__btn:hover { background: var(--ks-teal); color: #fff; }
.ks-way__btn:hover svg { fill: #fff; }

/* =========================================================================
   НАША ПРОДУКЦИЯ + общие стрелки/слайдер
   ========================================================================= */
.ks-catalog { background: var(--ks-dark); }
.ks-catalog__inner { display: flex; flex-direction: column; gap: 20px; padding: 120px 0 80px; }
.ks-arrows-wrap--catalog { margin: -55px 0 20px; }
.ks-arrows { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 24px; }
.ks-arrow {
  display: block; text-align: center; font: 400 20px/23px var(--ks-font);
  width: 45px; height: 45px; padding: 1px 6px; margin: 0;
  background: #fff; color: #000; border: 2px solid #fff; border-radius: 15px;
  cursor: pointer; transition: .3s all ease;
}
.ks-arrow--prev { margin-right: 10px; }
.ks-arrow.is-disabled { opacity: .3; cursor: default; }
.ks-arrow:hover { background: var(--ks-teal); transform: translateY(-5px); }
.ks-arrow .ks-ti { font-size: inherit; }
.ks-arrow:hover .ks-ti { color: #fff; }

.ks-slider { position: relative; margin-right: calc(-50vw + 50%); }
.ks-slider--catalog { margin-top: -15px; }
.ks-slider__track { display: flex; cursor: grab; -webkit-user-select: none; user-select: none; will-change: transform; }
.ks-slider__track:active { cursor: grabbing; }
.ks-slider__track > * { flex-shrink: 0; margin-right: 30px; }

.ks-prod {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  width: 370px; padding: 300px 20px 20px;
  background: #fff var(--prod-bg) 50% 50% / cover no-repeat; border-radius: 30px;
  font: 400 20px/30px var(--ks-font); color: var(--ks-teal); cursor: pointer;
  transition: transform .4s;
}
.ks-prod::before {
  content: ''; position: absolute; inset: 0; border-radius: 30px;
  background-image: linear-gradient(180deg, rgba(255, 0, 0, 0) 0%, var(--ks-dark) 77%);
  opacity: .85; transition: opacity .7s;
}
.ks-prod:hover { transform: scale(1.07) translateY(-15px); }
.ks-prod:hover::before { background-image: linear-gradient(180deg, rgba(32, 184, 173, 0) 0%, var(--ks-dark) 77%); opacity: .95; }
.ks-prod__go {
  position: absolute; top: 20px; right: 20px; z-index: 1;
  display: flex; align-items: center; padding: 10px;
  background: #fff; border-radius: 10px; opacity: 0; transition: .3s all ease;
}
.ks-prod__go svg { width: 15px; height: 15px; margin-right: 3.75px; fill: rgba(255, 255, 255, 0); stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ks-prod__go span { padding-left: 5px; font: 600 13px/16px var(--ks-font); text-transform: uppercase; color: #333; }
.ks-prod:hover .ks-prod__go { opacity: 1; }
.ks-prod:hover .ks-prod__go svg { filter: invert(1); }
.ks-prod__body { position: relative; display: flex; flex-direction: column; gap: 15px; }
.ks-prod__title { font: 600 20px/24px var(--ks-font); color: #fff; }
.ks-prod__tags { display: flex; flex-wrap: wrap; gap: var(--tag-gap, 7px); }
.ks-tag { padding: 6px 8px; background: rgba(255, 255, 255, .15); border-radius: 10px; font: 400 12px/15px var(--ks-font); color: #fff; text-align: center; }
.ks-prod--all { justify-content: center; align-items: center; padding: 20px; background: rgba(255, 255, 255, 0); border: 2px solid var(--ks-teal); }
.ks-prod--all::before { display: none; }
.ks-prod__all { display: flex; align-items: center; }
.ks-prod__all svg { width: 25px; height: 25px; margin-right: 6.25px; fill: rgba(255, 255, 255, 0); stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ks-prod__all span { padding-left: 5px; font: 600 20px/24px var(--ks-font); color: #fff; }

/* =========================================================================
   ЭТАПЫ РАБОТЫ
   ========================================================================= */
.ks-how { position: relative; padding: 90px 0; background: var(--ks-dark); }
.ks-how__wrap { display: flex; width: 100%; max-width: 1140px; margin: 0 auto; }
.ks-how__head { padding-bottom: 48px; }
.ks-how__head-title { flex: 0 0 40%; display: flex; align-items: center; }
.ks-how__head-text { flex: 0 0 60%; display: flex; align-items: center; padding-left: 200px; }
.ks-how__head-text p { width: 100%; font: 400 21px/28px var(--ks-font); color: #fff; text-align: end; }
.ks-step { padding: 20px 0; border-top: 1px solid rgba(200, 200, 200, .11); border-bottom: 1px solid rgba(200, 200, 200, .11); transition: background .3s, border .3s; }
.ks-step:hover { background: var(--ks-teal); }
.ks-step__col { display: flex; flex-wrap: wrap; align-items: center; align-content: center; }
.ks-step__col--img { flex: 0 0 20%; }
.ks-step__col--img img { display: block; width: 200px; height: 100px; object-fit: cover; border-radius: 25px; }
.ks-step__col--title { flex: 0 0 25%; padding-left: 10px; }
.ks-step__title { font: 700 30px/36px var(--ks-font); text-transform: uppercase; color: #fff; }
.ks-step__col--text { flex: 0 0 54.667%; padding-left: 30px; }
.ks-step__lead { width: 100%; font: 600 22px/31px var(--ks-font); color: #fff; transition: color .4s ease; }
.ks-step__note {
  width: 100%; max-height: 0; overflow: hidden; opacity: 0; margin-top: 0;
  transition: max-height .4s cubic-bezier(.4, 0, .2, 1), opacity .35s ease, margin-top .35s ease;
}
.ks-step__note p { font: 400 18px/26px var(--ks-font); color: #fff; }
.ks-step:hover .ks-step__note { max-height: var(--note-h, 26px); opacity: 1; margin-top: 12px; transition: max-height .4s cubic-bezier(.4, 0, .2, 1), opacity .4s ease, margin-top .4s ease; }

/* =========================================================================
   ОБРАЗЦЫ
   ========================================================================= */
.ks-sample { display: flex; flex-direction: column; padding-bottom: 90px; background: var(--ks-dark); }
.ks-sample__head { padding: 80px 0 20px; }
.ks-sample__body { margin-top: 10px; }
.ks-sample__card { display: flex; flex-direction: column; gap: 20px; padding: 40px; background: #fff; border-radius: 30px; }
.ks-sample__title { font: 600 24px/28px var(--ks-font); color: var(--ks-dark); }
.ks-sample__title--sub { margin-top: 10px; }
.ks-sample__intro { padding-right: 50px; font: 400 18px/26px var(--ks-font); color: var(--ks-dark); }
.ks-kinds { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.ks-kind { display: flex; flex-direction: column; gap: 7px; padding: 15px; background: var(--ks-mint); border: 2px solid var(--ks-teal); border-radius: 15px; }
.ks-kind__title { font: 600 20px/20px var(--ks-font); color: var(--ks-dark); }
.ks-kind__text p { font: 400 16px/21px var(--ks-font); color: var(--ks-dark); }
.ks-sample__cta { display: flex; gap: 20px; }
.ks-sample__btn-wrap { flex: 0 1 50%; max-width: 50%; }
.ks-sample__btn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 20px 15px; border: 2px solid var(--ks-teal); border-radius: 20px; background: var(--ks-teal);
  font: 600 18px/25px var(--ks-font); text-transform: uppercase; color: #fff;
  transition: all .3s;
}
.ks-sample__btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ks-sample__btn:hover { background: var(--ks-dark); }
.ks-sample__btn:hover svg { fill: #fff; }
.ks-sample__promo { flex: 0 1 63%; display: flex; align-items: center; justify-content: center; padding: 10px; border: 2px dashed var(--ks-teal); border-radius: 20px; }
.ks-sample__promo svg { flex: 0 0 auto; width: 45px; height: 45px; margin-right: 11.25px; }
.ks-sample__promo span { padding-left: 5px; font: 600 18px/20px var(--ks-font); color: var(--ks-dark); }

/* =========================================================================
   АКЦИИ
   ========================================================================= */
.ks-promo { background: var(--ks-dark); }
.ks-promo__inner { display: flex; flex-direction: column; gap: 20px; padding: 60px 0 90px; }
.ks-promo__slot { min-height: 10px; }

/* =========================================================================
   БРЕНДЫ
   ========================================================================= */
.ks-brands { background: var(--ks-dark); }
.ks-brands__inner { display: flex; flex-direction: column; gap: 20px; padding: 90px 0; }
.ks-brands__grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 288px; gap: 25px; margin-top: 20px; }
.ks-brand { display: flex; flex-direction: column; gap: 20px; padding: 20px; background: #fff; border-radius: 20px; }
.ks-brand img { display: block; width: 100%; height: 200px; object-fit: cover; border-radius: 20px; }
.ks-brand p { font: 600 20px/28px var(--ks-font); color: var(--ks-dark); text-align: center; }
.ks-brand--cta { align-items: center; justify-content: center; padding: 30px; background: var(--ks-teal); }
.ks-brand--cta p { font: 600 24px/28px var(--ks-font); color: #fff; }
.ks-brand__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 10px 15px; border-radius: 20px; background: #fff;
  font: 600 15px/25px var(--ks-font); text-transform: uppercase; color: var(--ks-teal);
  transition: all .3s;
}
.ks-brand__btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ks-brand__btn:hover { background: #333; color: #fff; }
.ks-brand__btn:hover svg { fill: #fff; }

/* =========================================================================
   ОТЗЫВЫ
   ========================================================================= */
.ks-reviews { background: var(--ks-dark); }
.ks-reviews__inner { display: flex; flex-direction: column; gap: 20px; padding-top: 90px; }
.ks-arrows-wrap--reviews { margin: -55px 0 20px; }
.ks-arrows-wrap--reviews .ks-arrows { width: fit-content; margin-left: auto; margin-top: -13px; }
.ks-slider--reviews { margin-top: -20px; }
.ks-review {
  position: relative; display: flex; flex-direction: column; gap: 20px;
  width: 1170px; padding: 40px; background: #fff; border-radius: 30px;
  transition: transform .4s;
}
.ks-review:hover { transform: scale(1.01) translateY(-15px); }
.ks-review__quote { position: absolute; top: 40px; right: 40px; width: 50px; height: 40px; }
.ks-review__logo { display: block; width: 200px; height: 80px; object-fit: contain; object-position: 50% 50%; }
.ks-review__logo--left { object-position: 0% 50%; }
.ks-review__logo--round { width: 80px; height: 80px; border-radius: 100px; object-fit: contain; }
.ks-review__who { display: flex; flex-direction: column; gap: 10px; }
.ks-review__name { font: 600 24px/28px var(--ks-font); color: var(--ks-dark); }
.ks-review__city { font: 500 18px/18px var(--ks-font); color: rgba(26, 26, 26, .46); }
.ks-review__box { display: flex; flex-direction: column; gap: 7px; padding: 30px; background: var(--ks-mint); border: 2px solid var(--ks-teal); border-radius: 30px; }
.ks-review__box p, .ks-review__plain { font: 400 20px/30px var(--ks-font); color: var(--ks-dark); }

/* =========================================================================
   ЛОГОТИПЫ КЛИЕНТОВ
   ========================================================================= */
.ks-logos { display: grid; background: var(--ks-dark); }
.ks-logos__inner { width: min(95%, 1170px); margin: 0 auto; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 150px; gap: 100px; padding: 50px 0 30px; }
.ks-logos__inner img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ks-logos__inner img.is-white { filter: brightness(0) invert(1); }

/* =========================================================================
   ВОПРОСЫ
   ========================================================================= */
.ks-faq { background: var(--ks-dark); }
.ks-faq__inner { display: flex; flex-direction: column; gap: 20px; padding: 90px 0; }
.ks-faq__item { display: flex; flex-direction: column; }
.ks-faq__q { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 20px; cursor: pointer; list-style: none; }
.ks-faq__q::-webkit-details-marker { display: none; }
.ks-faq__q-text { font: 600 24px/36px var(--ks-font); color: #fff; }
.ks-faq__icon { flex: 0 0 auto; width: 35px; height: 35px; transition: .6s all ease; }
.ks-faq__icon svg { display: block; width: 35px; height: 35px; padding: 7px; background: var(--ks-teal); border-radius: 10px; fill: transparent; stroke: #1a1a1a; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ks-faq__item[open] .ks-faq__icon { transform: rotate(180deg); }
.ks-faq__item[open] .ks-faq__icon svg { background: #fff; }
.ks-faq__a { overflow: hidden; }
.ks-faq__box { display: flex; flex-direction: column; gap: 20px; padding: 30px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 20px; }
.ks-faq__box p, .ks-faq__plain { font: 400 22px/32px var(--ks-font); color: #fff; }

/* =========================================================================
   КОНТАКТЫ (бирюзовая карточка) и ФОРМА
   ========================================================================= */
.ks-footer { background: var(--ks-dark); } /* фон подвала темы: виден в углах бирюзового блока */
.ks-contacts { position: relative; padding: 80px 0; background: var(--ks-teal); border-radius: 80px; }
.ks-contacts__inner { width: min(95%, 1170px); margin: 0 auto; }
.ks-title--contacts { margin-bottom: 48px; text-transform: uppercase; }
.ks-contacts__row { display: flex; gap: 30px; }
.ks-contacts__info { flex: 0 0 35%; display: flex; flex-direction: column; gap: 25px; padding: 30px; background: #fff; border-radius: 20px; }
.ks-contacts__form { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; padding: 30px; background: var(--ks-dark-2); border-radius: 20px; }
.ks-map { height: 450px; margin-top: 30px; border-radius: 20px; overflow: hidden; }

/* список с иконками (адрес / телефон / почта) */
.ks-ilist li { display: flex; align-items: center; }
.ks-ilist li + li { margin-top: 5px; }
.ks-ilist li:not(:last-child) { padding-bottom: 5px; }
.ks-ilist a { display: flex; align-items: center; width: 100%; }
.ks-ilist__icon { display: flex; padding-right: 5px; }
.ks-ilist__icon svg { width: 20px; height: 20px; margin: 0 2.5px; fill: var(--ks-teal); }
.ks-ilist__text { padding-left: 5px; font: 500 16px/24px var(--ks-font); color: var(--ks-dark-2); }
.ks-ilist--dark .ks-ilist__text { color: #fff; }

.ks-dept { display: flex; flex-direction: column; gap: 10px; }
.ks-dept__title { font: 600 20px/20px var(--ks-font); color: var(--ks-dark); }
.ks-dept p:not(.ks-dept__title) { font: 400 16px/24px var(--ks-font); color: var(--ks-dark); }

.ks-social { display: flex; flex-wrap: wrap; }
.ks-social li { display: flex; align-items: center; }
.ks-social a { display: flex; align-items: center; width: 55px; height: 40px; }
.ks-social svg { width: 40px; height: 40px; padding: 10px; margin-right: 10px; background: var(--ks-teal); border-radius: 100px; fill: #fff; }
.ks-requisites { align-self: flex-start; border-bottom: 2px dashed var(--ks-teal); }
.ks-requisites p { font: 400 16px/24px var(--ks-font); color: var(--ks-dark); }

.ks-form-title { font: 600 28px/32px var(--ks-font); color: #fff; }
.ks-form-sub { margin-top: 12px; font: 400 16px/24px var(--ks-font); color: #fff; }
.ks-form { display: flex; flex-direction: column; margin-top: 20px; margin-bottom: -15px; }
.ks-form.is-sending .ks-submit { opacity: .6; cursor: progress; }
.ks-form__msg { margin: 10px 0 15px; font: 400 14px/1.4 var(--ks-font); color: #ff6b6b; } /* ошибка отправки — под кнопкой, как сообщение формы Elementor */
.ks-input {
  display: block; width: 100%; min-height: 40px; margin: 0 0 15px; padding: 10px 20px;
  font: 400 18px/27px var(--ks-font); color: #1F2124;
  background: #fff; border: 1px solid #69727D; border-radius: 15px; outline: 0;
  -webkit-appearance: none; appearance: none;
}
.ks-input::placeholder { color: #757575; opacity: 1; }
.ks-input--area { height: 76px; resize: vertical; }
.ks-cbtns { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin: 4px 0 15px; }
.ks-cbtn {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 64px; padding: 10px 4px; margin: 0;
  background: #fff; border: 1.5px solid #E3E3E3; border-radius: 8px; color: #444; cursor: pointer;
  -webkit-user-select: none; user-select: none; transition: all .15s ease;
}
.ks-cbtn svg, .ks-cbtn img { display: block; flex-shrink: 0; width: 22px; height: 22px; }
.ks-cbtn svg { color: #444; transition: color .15s; }
.ks-cbtn span { font: 500 11px/1.2 var(--ks-font); color: #555; text-align: center; transition: color .15s; }
.ks-cbtn:hover { background: #F0FDFC; border-color: var(--ks-teal); transform: translateY(-1px); }
.ks-cbtn.is-active { background: #f0fdfb; border: 5px solid var(--ks-teal); color: var(--ks-teal); box-shadow: 0 2px 8px rgba(32, 184, 173, .15); }
.ks-cbtn.is-active svg { color: var(--ks-teal); }
.ks-cbtn.is-active span { color: var(--ks-teal); font-weight: 600; }
.ks-cbtns__caret { position: absolute; right: 10px; top: calc(100% - 7px); width: 11px; height: 11px; fill: #6E7A84; pointer-events: none; }
.ks-accept { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 15px; cursor: pointer; }
.ks-accept input {
  flex: 0 0 20px; width: 20px; height: 20px; margin: 0; padding: 0;
  -webkit-appearance: none; appearance: none; background: transparent;
  border: 2px solid #fff; border-radius: 4px; cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease;
}
.ks-accept input:checked {
  background: var(--ks-teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8 L6.5 12.5 L14 4' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
  border-color: var(--ks-teal);
}
.ks-accept span { padding-right: 100px; font: 400 18px/1.4 var(--ks-font); color: #fff; }
.ks-accept a { color: #fff; border-bottom: 1px solid #fff; }
.ks-submit {
  width: 100%; min-height: 40px; margin: 1px 0 15px; padding: 15px; border: 0; border-radius: 20px;
  background: var(--ks-teal); color: #fff; cursor: pointer;
  font: 700 18px/18px var(--ks-font); letter-spacing: 1px; text-transform: uppercase;
  transition: all .3s;
}

/* =========================================================================
   НИЖНИЙ ПОДВАЛ
   ========================================================================= */
.ks-foot { background: var(--ks-dark); }
.ks-foot__inner { display: flex; flex-direction: column; gap: 20px; padding: 80px 0; }
.ks-foot__top { display: flex; gap: 10px 40px; padding-bottom: 32px; }
.ks-foot__col { flex: 0 1 100%; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.ks-foot__col--brand { flex: 0 0 31.917%; }
.ks-foot__col--last { padding-left: 50px; }
.ks-foot__logo { display: block; width: 250px; height: auto; margin-bottom: 10px; }
.ks-foot__col--brand .ks-ilist { margin-bottom: 10px; }
.ks-foot__title { font: 600 20px/26px var(--ks-font); letter-spacing: -.3px; color: #fff; }
.ks-foot__links li:not(:last-child) { padding-bottom: 6px; }
.ks-foot__links li + li { margin-top: 6px; }
.ks-foot__links a { display: flex; align-items: center; font: 400 16px/24px var(--ks-font); color: #fff; transition: color .2s; }
.ks-foot__links a:hover, .ks-ilist a:hover .ks-ilist__text { color: var(--ks-teal); }
.ks-foot__bottom { display: flex; justify-content: space-between; align-items: stretch; gap: 10px; }
.ks-foot__bottom p, .ks-foot__bottom a { font: 400 16px/24px var(--ks-font); color: #fff; }
.ks-foot__legal { flex: 0 0 60%; display: flex; justify-content: flex-end; gap: 40px; }

/* =========================================================================
   ПОПАПЫ
   ========================================================================= */
.ks-modal { position: fixed; inset: 0; z-index: 10000; display: flex; justify-content: center; align-items: center; background: rgba(0, 0, 0, .8); }
.ks-modal[hidden] { display: none; }
.ks-modal__dialog { position: relative; }
.ks-modal__close { position: absolute; z-index: 9999; display: flex; padding: 0; border: 0; background: none; cursor: pointer; }
.ks-modal__close svg { width: 1em; height: 1em; fill: currentColor; }

@keyframes ks-popIn { from { opacity: 0; transform: translate3d(0, -40px, 0); } to { opacity: 1; transform: none; } }
.ks-modal--form .ks-modal__dialog {
  width: 700px; max-width: 100%; max-height: 100vh; overflow: auto;
  background: var(--ks-dark); border-radius: 30px; box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, .2);
  animation: ks-popIn 1.2s both;
}
.ks-modal--form .ks-modal__close { top: 5%; right: 5%; font-size: 20px; color: #fff; }
.ks-modal__card { padding: 40px; background: var(--ks-dark-2); border-radius: 30px; }
/* поле файла и подпись к нему (попап «Свой дизайн») */
.ks-flabel { display: block; font: 400 20px/30px var(--ks-font); color: #fff; }
.ks-file {
  display: block; width: 100%; height: 50px; margin: 0 0 15px; padding: 10px 20px;
  font: 400 18px var(--ks-font); color: #6E7A84;
  background: #fff; border: 1px solid #E6E9EC; border-radius: 15px;
}
/* попап «Заявка получена» */
.ks-modal--sent .ks-modal__dialog {
  width: 640px; max-width: 100%; background: var(--ks-teal); border-radius: 30px; box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, .2);
  animation: ks-popIn 1.2s both;
}
.ks-modal--sent .ks-modal__close { top: 5%; right: 5%; font-size: 20px; color: #fff; }
.ks-sent { display: flex; flex-direction: column; padding: 40px; background: var(--ks-teal); border-radius: 20px; }
.ks-sent__icon { margin-bottom: 10px; font: 400 20px/30px var(--ks-font); text-align: start; }
.ks-sent__icon-in { display: inline-block; font-size: 60px; line-height: 1; color: #fff; text-align: center; } /* та же вложенность, что у иконки Elementor — от неё зависит высота строки */
.ks-sent__icon .ks-ti { position: relative; display: block; width: 1em; height: 1em; font-size: inherit; line-height: inherit; }
.ks-sent__icon .ks-ti::before { position: absolute; left: 50%; transform: translateX(-50%); } /* как у Elementor: без строки внутри иконки её базовая линия — нижний край */
.ks-sent__title { font: 600 28px/32px var(--ks-font); color: #fff; }
.ks-sent__text { margin-top: 10px; font: 400 16px/24px var(--ks-font); color: #fff; }
.ks-sent__box { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; margin-top: 20px; padding: 20px; border: 2px dashed #fff; border-radius: 20px; }
.ks-sent__box-title { font: 600 18px/20px var(--ks-font); text-align: center; color: #fff; }
.ks-sent__phone { display: flex; align-items: center; font: 500 16px/24px var(--ks-font); color: #fff; }
.ks-sent__phone svg { width: 20px; height: 20px; margin: 0 6.5px 0 2.5px; fill: #fff; }
.ks-sent__phone span { padding-left: 5px; } /* как у текста в списке с иконками Elementor */
.ks-modal__card .ks-input { line-height: 1.4; }
.ks-modal__card .ks-input--area { height: 72.4px; }

.ks-modal--menu { align-items: flex-start; }
.ks-modal--menu .ks-modal__dialog { width: 640px; max-width: 100vw; height: 100vh; overflow-y: auto; background: #fff; box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, .2); }
.ks-modal--menu .ks-modal__close { top: 20px; right: 20px; font-size: 20px; color: var(--ks-dark); }
.ks-mmenu { display: flex; flex-direction: column; gap: 20px; min-height: 100vh; padding: 20px; }
.ks-mmenu__logo { display: block; width: auto; height: 25px; align-self: flex-start; }
.ks-mmenu__nav { padding-left: 10px; }
.ks-mmenu__nav > ul { margin-top: 11px; background: #fff; border-radius: 10px; }
.ks-mmenu__link { display: flex; align-items: center; padding: 14px 0; font: 500 17px/20px var(--ks-font); color: #333; transition: color .2s cubic-bezier(.68, .01, .58, .75); }
.ks-mmenu__item.is-open > .ks-mmenu__link, .ks-mmenu__link:hover { color: var(--ks-teal); }
.ks-mmenu__arrow { display: flex; align-items: center; padding: 10px 0 10px 10px; margin: -10px 0; }
.ks-mmenu__arrow svg { width: 12px; height: 12px; fill: currentColor; }
.ks-mmenu__sub { display: none; padding-left: 8px; }
.ks-mmenu__item.is-open > .ks-mmenu__sub { display: block; }
.ks-mmenu__sub a { display: block; padding: 14px 0; font: 500 17px/20px var(--ks-font); color: #333; }
.ks-mmenu__sub a:hover { color: var(--ks-teal); }
.ks-mmenu__bottom { display: flex; flex-direction: column; gap: 20px; }
.ks-ilist--menu li { align-items: flex-start; }
.ks-ilist--menu .ks-ilist__icon { position: relative; top: 3px; }
.ks-ilist--menu .ks-ilist__icon svg { width: 18px; height: 18px; margin: 0 2.25px; }
.ks-ilist--menu .ks-ilist__text { font-size: 14px; line-height: 20px; color: var(--ks-dark-2); }
.ks-social--dark svg { background: var(--ks-dark); }
.ks-mmenu__btn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; padding: 10px 0; border: 2px solid var(--ks-teal); border-radius: 15px; background: var(--ks-teal);
  font: 600 14px/27px var(--ks-font); text-transform: uppercase; color: #fff; transition: all .3s;
}
.ks-mmenu__btn svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; transition: .3s all ease; }
.ks-mmenu__btn:hover { background: var(--ks-dark); }
.ks-mmenu__btn:hover svg { transform: rotate(45deg); }

/* =========================================================================
   ≥ 1000px — отдельные правила сайта
   ========================================================================= */
@media (max-width: 999px) {
  .ks-arrows-wrap--reviews .ks-arrows { margin-top: 0; }
  .ks-accept span { padding-right: 0; }
}

/* =========================================================================
   ПЛАНШЕТ И НИЖЕ (≤1024)
   ========================================================================= */
@media (max-width: 1024px) {
  body { font-size: 18px; line-height: 27px; }
  .ks-wrap { width: auto; margin-left: 0; margin-right: 0; }

  .ks-title { font-size: 30px; line-height: 30px; }
  .ks-title__icon { width: 35px; height: 35px; margin-right: 8.75px; }

  /* шапка */
  .ks-header { padding: 0 15px; }
  .ks-header__inner { width: auto; margin: 0; flex-wrap: wrap; }
  .ks-header__logo img, .ks-header__logotext img { height: 30px; }
  .ks-header__logotext { margin-left: -30px; }
  .ks-nav__link { padding: 13px 10px; font-size: 12px; line-height: 11px; }
  .ks-nav__sub a { padding: 5px 0; font-size: 12px; }

  /* первый экран */
  .ks-hero { padding-top: 100px; }
  .ks-hero__head { margin-top: -100px; padding: 0 20px; }
  .ks-hero__head-inner { flex-direction: column; gap: 20px; padding: 120px 0 150px; }
  .ks-hero__title-col { flex: 0 0 auto; width: 100%; }
  .ks-hero__title { font-size: 40px; line-height: 40px; }
  .ks-hero__buttons { justify-content: flex-start; align-items: flex-start; }
  .ks-hero__video { min-height: 350px; border-radius: 40px; }

  .ks-banner { margin: -60px 0 -30px; padding: 0 30px; border-radius: 32px; }
  .ks-banner__inner { padding: 90px 0 30px; }
  .ks-banner__text { font-size: 30px; line-height: 42px; }

  /* о фабрике */
  .ks-about { padding: 60px 20px; }
  .ks-adv { grid-template-columns: 1fr 1fr; }
  .ks-why-title { font-size: 30px; line-height: 30px; }
  .ks-why { grid-template-columns: 1fr 1fr; }
  .ks-gallery__slide { margin-bottom: -2px; }
  .ks-gallery--about .ks-gallery__slide img { height: 40vh; }

  .ks-ways { padding: 0 20px; }
  .ks-ways__inner { padding: 60px 0 90px; }

  .ks-catalog { padding: 0 20px; }
  .ks-catalog__inner { padding: 90px 0 60px; }
  .ks-slider { margin-right: -20px; }

  .ks-how { padding: 60px 20px 0; }
  .ks-how__head { padding-bottom: 32px; }
  .ks-how__head-text p { font-size: 16px; line-height: 20px; }
  .ks-step__col--img { flex-basis: 20%; }
  .ks-step__col--img img { width: 100%; height: 80px; border-radius: 40px; }
  .ks-step__col--title { flex-basis: 30%; }
  .ks-step__title { padding-left: 20px; font-size: 20px; line-height: 27px; }
  .ks-step__col--text { flex-basis: 50%; }
  .ks-step__lead, .ks-step__note p { font-size: 14px; line-height: 20px; }

  .ks-sample { padding: 60px 20px 0; }
  .ks-kinds { grid-auto-rows: 1fr; }

  .ks-promo { padding: 0 20px; }
  .ks-promo__inner { padding: 60px 0; }

  .ks-brands { padding: 0 20px; }
  .ks-brands__inner { padding: 60px 0; }
  .ks-brands__grid { grid-template-columns: 1fr 1fr; }

  .ks-reviews { padding: 0 20px; }
  .ks-reviews__inner { padding-top: 50px; }

  .ks-logos { padding: 0 30px; }
  .ks-logos__inner { width: auto; grid-template-columns: repeat(5, 1fr); gap: 30px; padding: 20px 0; }

  .ks-faq { padding: 0 20px; }
  .ks-faq__inner { padding: 60px 0; }

  .ks-contacts { padding: 60px 0; border-radius: 32px 32px 0 0; }
  .ks-contacts__inner { width: 95%; }
  .ks-title--contacts { margin-bottom: 32px; font-size: 40px; line-height: 52px; }
  .ks-title--contacts .ks-title__icon { width: 45px; height: 45px; margin-right: 11.25px; }
  .ks-contacts__row { flex-direction: column; }
  .ks-contacts__info { flex: 0 0 auto; }

  .ks-foot { padding: 0 20px; }
  .ks-foot__inner { padding: 50px 0; }
  .ks-foot__top { flex-wrap: wrap; gap: 29px; padding-bottom: 0; }
  .ks-foot__col, .ks-foot__col--brand { flex: 0 0 48%; margin-bottom: 32px; }
  .ks-foot__col--last { padding-left: 0; margin-bottom: 0; }
  .ks-foot__bottom > p { width: 50%; max-width: 50%; }
  .ks-foot__title { font-size: 18px; line-height: 23.4px; letter-spacing: -.27px; }
  .ks-foot__logo { width: 200px; }
  .ks-foot__bottom { flex-wrap: wrap; gap: 20px; }
  .ks-foot__legal { flex: 0 0 100%; justify-content: flex-start; }
}

/* только планшет (768–1024) */
@media (min-width: 768px) and (max-width: 1024px) {
  .ks-header__left { flex-basis: 90%; }
  .ks-header__right { flex-basis: 7%; }
  .ks-header__logotext, .ks-header__cta { display: none; }
  .ks-contacts { margin-top: -32px; }
}

/* =========================================================================
   МОБИЛЬНЫЙ (≤767)
   ========================================================================= */
@media (max-width: 767px) {
  body { font-size: 16px; line-height: 24px; }

  /* Шапка: мобильная версия. У оригинала на 641–767 десктопная шапка ломается
     (высота 164px, наезжает на заголовок) — здесь показываем мобильную. */
  .ks-header { display: none; }
  .ks-mheader {
    position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
    display: flex; flex-direction: column;
    background-color: rgba(0, 0, 0, .57); border-radius: 0 0 20px 20px;
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  }
  .ks-mheader__bar { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 8px 15px; background: var(--ks-teal); }
  .ks-mheader__call { border-bottom: 1px dashed #fff; font: 600 14px/17px var(--ks-font); color: #fff; }
  .ks-mheader__phone { display: flex; align-items: center; font: 600 13px/19.5px var(--ks-font); color: #fff; }
  .ks-mheader__phone svg { width: 14px; height: 14px; margin-right: 3.5px; fill: #fff; }
  .ks-mheader__phone span { padding-left: 5px; }
  .ks-mheader__main { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 15px; }
  .ks-mheader__logos { flex: 1 1 auto; display: flex; gap: 10px; }
  .ks-mheader__logos a { line-height: 0; }
  .ks-mheader__logos img { display: block; width: auto; height: 25px; }
  .ks-mheader__actions { flex: 0 0 auto; width: 40%; display: flex; justify-content: center; align-items: center; gap: 20px; }
  .ks-mheader__burger { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; margin-bottom: 3px; padding: 0; border: 0; background: none; color: #fff; cursor: pointer; align-self: flex-end; }
  .ks-lu-menu { font-family: 'ks-lucide'; font-style: normal; font-size: 30px; line-height: 30px; }
  .ks-lu-menu::before { content: '\ec9c'; }

  .ks-title { font-size: 22px; line-height: 28px; }
  .ks-title__icon { width: 20px; height: 20px; margin-right: 5px; }

  .ks-hero__head-inner { gap: 0; padding: 135px 0 80px; }
  .ks-hero__title { font-size: 30px; line-height: 38px; }
  .ks-hero__side { margin-top: 15px; gap: 15px; }
  .ks-hero__lead { font-size: 14px; line-height: 20px; }
  .ks-hero__buttons { flex-wrap: wrap; gap: 15px; margin-top: 0; }
  .ks-hbtn { padding: 10px 14px; font-size: 13px; line-height: 16px; }
  .ks-hero__video { min-height: 200px; margin-top: -40px; border-radius: 40px; }

  .ks-banner { padding: 0 20px; border-radius: 30px; }
  .ks-banner__inner { padding: 75px 0 20px; }
  .ks-banner__text { font-size: 20px; line-height: 27px; }

  .ks-about { padding: 60px 20px 0; }
  .ks-about__card-wrap, .ks-about__card-wrap > .ks-wrap { padding: 0; }
  .ks-about__card { padding: 20px; }
  .ks-about__card .ks-rich { margin-top: -4px; font-size: 14px; line-height: 20px; }
  .ks-about__subtitle { margin-top: 10px; font-size: 18px; line-height: 22px; }
  .ks-stats { grid-template-columns: 1fr; gap: 10px; }
  .ks-stat { padding: 10px; }
  .ks-stat:nth-child(2) { justify-content: center; }
  .ks-stat__value { font-size: 16px; line-height: 18px; }
  .ks-stat__text { margin-top: -4px; font-size: 14px; line-height: 20px; }
  .ks-adv { grid-template-columns: 1fr; gap: 20px; }
  .ks-adv__card { padding: 20px; }
  .ks-adv__icon { width: 60px; height: 60px; padding: 15px; }
  .ks-adv__title { font-size: 18px; line-height: 20px; }
  .ks-adv__text { margin-top: -4px; font-size: 14px; line-height: 20px; }
  .ks-why-title { font-size: 22px; line-height: 28px; }
  .ks-why-wrap { padding-bottom: 0; }
  .ks-why { grid-template-columns: 1fr; grid-template-rows: repeat(6, auto); }
  .ks-why__item { padding: 10px; border-radius: 10px; }
  .ks-why__item p { margin-top: -4px; font-size: 14px; line-height: 20px; }
  .ks-why__item--empty { display: none; }
  .ks-gallery--about { margin-top: 0; }

  .ks-ways__inner { padding: 50px 0 80px; }
  .ks-ways__grid { grid-template-columns: 1fr; gap: 20px; margin-top: 0; }
  .ks-way { padding: 20px; }
  .ks-way__icon { width: 40px; height: 40px; }
  .ks-way__title { margin: 10px 0; font-size: 18px; line-height: 20px; }
  .ks-way__text { margin-top: -4px; }
  .ks-way__text p { margin-bottom: 14px; font-size: 14px; line-height: 20px; }
  .ks-pill { padding: 3px 7px; border-radius: 8px; font-size: 12px; }
  .ks-way__btn { padding: 10px 0; border-radius: 15px; font-size: 14px; line-height: 14px; }
  .ks-way__btn svg { width: 14px; height: 14px; }

  .ks-catalog__inner { padding: 80px 0 0; }
  .ks-arrows-wrap--catalog { margin: -46px 0 0; }
  .ks-arrow { font-size: 16px; line-height: 18.4px; }
  .ks-gallery__slide { margin-bottom: -3px; }
  .ks-prod { padding: 150px 20px 20px; font-size: 16px; line-height: 24px; }
  .ks-prod__title { font-size: 16px; line-height: 18px; }
  .ks-prod__tags { gap: 8px; }
  .ks-tag { padding: 6px; font-size: 11px; line-height: 14px; }
  .ks-prod--all { padding: 150px 20px 20px; }

  .ks-how { padding: 60px 0 0; }
  .ks-how__head { padding: 0 20px 20px; }
  .ks-how__wrap { flex-direction: column; }
  .ks-how__head-title, .ks-how__head-text, .ks-step__col--img, .ks-step__col--title, .ks-step__col--text { flex: 0 0 auto; width: 100%; }
  .ks-how__head-text { margin-top: 10px; padding-left: 0; }
  .ks-how__head-text p { font-size: 14px; line-height: 20px; text-align: start; }
  .ks-step { padding: 20px; }
  .ks-step__col--img img { width: 100%; height: 150px; margin-bottom: 20px; border-radius: 30px; }
  .ks-step__col--title, .ks-step__col--text { padding-left: 0; }
  .ks-step__title { padding-left: 0; font-size: 18px; line-height: 20px; }
  .ks-step__lead { margin-top: 10px; }

  .ks-sample { padding: 60px 20px 0; }
  .ks-sample__head { padding: 40px 0 20px; }
  .ks-sample__body { margin-top: 0; }
  .ks-sample__card { padding: 25px; }
  .ks-sample__title { font-size: 18px; line-height: 20px; }
  .ks-sample__intro { margin-top: -4px; padding-right: 0; font-size: 14px; line-height: 20px; }
  .ks-kinds { grid-template-columns: 1fr; grid-template-rows: repeat(2, 1fr); grid-auto-rows: auto; }
  .ks-kind { padding: 10px; }
  .ks-kind__title { font-size: 16px; line-height: 18px; }
  .ks-kind__text { margin-top: -4px; }
  .ks-kind__text p { font-size: 14px; line-height: 20px; }
  .ks-sample__cta { flex-wrap: wrap; gap: 10px; }
  .ks-sample__btn-wrap { flex: 0 0 100%; max-width: 100%; }
  .ks-sample__btn { padding: 10px 0; border-radius: 15px; font-size: 14px; line-height: 14px; }
  .ks-sample__btn svg { width: 14px; height: 14px; }
  .ks-sample__promo { flex: 0 0 100%; border-radius: 15px; }
  .ks-sample__promo svg { width: 30px; height: 30px; margin-right: 7.5px; }
  .ks-sample__promo span { font-size: 12px; line-height: 16px; }

  .ks-promo__inner { padding: 60px 0 0; }

  .ks-brands__inner { padding: 60px 0 0; }
  .ks-brands__grid { grid-template-columns: 1fr; grid-auto-rows: auto; gap: 20px; margin-top: 0; }
  .ks-brand { gap: 10px; }
  .ks-brand img { height: 150px; }
  .ks-brand p { font-size: 18px; line-height: 20px; }
  .ks-brand--cta { gap: 10px; }
  .ks-brand--cta p { font-size: 18px; line-height: 20px; }
  .ks-brand__btn { border-radius: 15px; font-size: 14px; line-height: 14px; }
  .ks-brand__btn svg { width: 14px; height: 14px; }

  .ks-reviews__inner { padding: 60px 0; }
  .ks-arrows-wrap--reviews { margin: -77px 0 30px; }
  .ks-review { padding: 20px; }
  .ks-review__quote { top: 24.8px; right: 20px; width: 20px; height: 16px; }
  .ks-review__logo, .ks-review__logo--left { width: 100%; height: 40px; object-position: 0% 50%; }
  .ks-review__who { gap: 5px; }
  .ks-review__name { font-size: 18px; line-height: 20px; }
  .ks-review__city { font-size: 10px; line-height: 14px; }
  .ks-review__box { margin-top: -10px; padding: 20px; border-radius: 20px; }
  .ks-review__box p, .ks-review__plain { margin-top: -4px; font-size: 14px; line-height: 20px; }

  .ks-logos { padding: 0 20px; }
  .ks-logos__inner { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 75px; padding: 0; }

  .ks-faq__inner { padding: 60px 0 80px; }
  .ks-faq__q { padding: 12px 0; }
  .ks-faq__q-text { font-size: 18px; line-height: 20px; }
  .ks-faq__box { padding: 20px; }
  .ks-faq__box p, .ks-faq__plain { margin-top: -4px; font-size: 14px; line-height: 20px; }

  .ks-contacts { padding: 40px 10px; border-radius: 40px 40px 0 0; }
  .ks-title--contacts { margin-bottom: 24px; font-size: 22px; line-height: 28px; }
  .ks-title--contacts .ks-title__icon { width: 20px; height: 20px; margin-right: 5px; }
  .ks-contacts__row { gap: 20px; }
  .ks-contacts__info { gap: 20px; padding: 20px; }
  .ks-contacts__form { padding: 20px; }
  .ks-ilist li { align-items: flex-start; }
  .ks-ilist a { align-items: flex-start; }
  .ks-ilist__icon { position: relative; top: 3px; }
  .ks-ilist__icon svg { width: 18px; height: 18px; margin: 0 2.25px; }
  .ks-ilist__text { font-size: 14px; line-height: 20px; }
  .ks-dept__title { font-size: 18px; }
  .ks-dept p:not(.ks-dept__title), .ks-requisites p { margin-top: -4px; font-size: 14px; line-height: 20px; }
  .ks-form-title { font-size: 18px; line-height: 20px; }
  .ks-form-sub { margin-top: 0; font-size: 14px; line-height: 20px; }
  .ks-input { font-size: 14px; line-height: 20px; }
  .ks-input--area { height: 62px; }
  .ks-accept span { font-size: 14px; }

  .ks-foot__inner { padding: 40px 0; }
  .ks-foot__col, .ks-foot__col--brand { flex: 0 0 100%; gap: 20px; }
  .ks-foot__title { font-size: 18px; line-height: 20px; }
  .ks-foot__bottom { flex-direction: column-reverse; }
  .ks-foot__legal { flex: 0 0 auto; flex-direction: column; gap: 10px; }

  .ks-modal__card { padding: 20px; }
  .ks-modal__card .ks-input { line-height: 20px; }
  .ks-modal__card .ks-input--area { height: 62px; }
  .ks-modal--form .ks-modal__dialog { width: 90vw; }
  .ks-modal--form .ks-modal__close { font-size: 15px; }
  .ks-flabel { font-size: 16px; line-height: 24px; }
  .ks-file { height: 48px; font-size: 14px; line-height: 20px; }
  .ks-modal--sent .ks-modal__dialog { width: 90vw; }
  .ks-sent { padding: 20px; }
  .ks-sent__icon { font-size: 16px; line-height: 24px; text-align: center; }
  .ks-sent__icon-in { font-size: 50px; }
  .ks-sent__title { font-size: 18px; line-height: 20px; text-align: center; }
  .ks-sent__text { margin-top: 6px; font-size: 14px; line-height: 20px; text-align: center; }
  .ks-sent__box { align-items: center; padding: 10px; border-radius: 15px; }
  .ks-sent__box-title { font-size: 14px; line-height: 17px; }
  .ks-sent__phone { align-items: flex-start; font-size: 14px; line-height: 20px; }
  .ks-sent__phone svg { position: relative; top: 3px; width: 16px; height: 16px; margin: 0 6px 0 2px; }
  .ks-modal--menu .ks-modal__dialog { width: 100vw; }
  .ks-mmenu__btn { font-size: 14px; }
}

/* ≤640: правила, которые на сайте заданы только для узких экранов */
@media (max-width: 640px) {
  .ks-hbtn svg { width: 15px; height: 15px; }
  .ks-gallery__slide img { height: 40vh; }
  .ks-gallery__slide { margin-bottom: 7px; }
  .ks-arrow { width: 35px; height: 35px; border-radius: 10px; }
  .ks-arrow--prev { margin-right: 5px; }
  .ks-arrows-wrap--catalog .ks-arrows { margin-top: -5px; }
  .ks-prod:hover, .ks-review:hover { transform: none; }
  .ks-submit { font-size: 14px; }
}

/* ≤480: сетка способов связи в 2 ряда (как в плагине кнопок) */
@media (max-width: 480px) {
  .ks-cbtns { grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .ks-cbtn { min-height: 58px; padding: 8px 4px; }
  .ks-cbtn span { font-size: 10px; }
}