/* =====================================================================
   НТК Электроника — оформление сайта (2026)
   Подключается после styles.css (в header.php) и задаёт внешний вид всех публичных страниц.
   Общие компоненты: .ntk-page, .ntk-card, .form-group, .ntk-btn, .ntk-alert, .ntk-table, .ntk-badge.
   Цвета, радиусы и тени — только через переменные --n-*.
   ===================================================================== */

:root {
  --n-bg: #f2f5fa;
  --n-surface: #ffffff;
  --n-soft: #f6f8fc;
  --n-border: #e3e9f2;
  --n-border-strong: #d3dce8;
  --n-text: #172536;
  --n-muted: #66768a;
  --n-navy: #0f2f5f;
  --n-navy-2: #16407c;
  --n-blue: #1f63d8;
  --n-blue-hover: #174fb3;
  --n-blue-soft: #eaf1fd;
  --n-orange: #f7a31c;
  --n-orange-hover: #e8920a;
  --n-star: #f5a623;
  --n-green: #1c9b55;
  --n-red: #d93a3a;
  --n-radius: 16px;
  --n-radius-md: 12px;
  --n-radius-sm: 9px;
  --n-shadow: 0 1px 2px rgba(15, 47, 95, .04), 0 6px 20px rgba(15, 47, 95, .06);
  --n-shadow-hover: 0 4px 10px rgba(15, 47, 95, .06), 0 14px 32px rgba(15, 47, 95, .10);
  --n-font: 'Inter', -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* ---------- База ---------- */
html body.ntk {
  background: var(--n-bg) !important;
  color: var(--n-text);
  font-family: var(--n-font);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
.ntk *, .ntk *::before, .ntk *::after { box-sizing: border-box; }
.ntk a { color: var(--n-blue); }
.ntk img { max-width: 100%; }
.ntk .container { max-width: 1280px; margin: 0 auto; padding: 0 20px; width: 100%; }
.ntk button, .ntk input, .ntk select, .ntk textarea { font-family: inherit; }

/* ---------- Шапка ---------- */
.ntk .site-header { padding: 18px 0 0; }
.ntk .sh-top { display: flex; align-items: center; gap: 22px; padding: 4px 0 18px; }
.ntk .sh-logo { flex-shrink: 0; display: block; line-height: 0; }
.ntk .sh-logo-img { width: 150px; height: auto; display: block; }
.ntk .sh-tagline { display: flex; flex-direction: column; gap: 4px; max-width: 200px; font-size: .82rem; line-height: 1.35; color: var(--n-muted); }
.ntk .sh-tagline b { color: var(--n-navy); font-weight: 600; font-size: .86rem; }
.ntk .sh-search { position: relative; flex: 1; min-width: 220px; max-width: 460px; margin: 0 auto; display: flex; }
.ntk .sh-search .search-input {
  width: 100%; height: 48px; padding: 0 60px 0 20px; font-size: .95rem; color: var(--n-text);
  background: var(--n-surface); border: 1px solid var(--n-border-strong); border-radius: 999px;
  box-shadow: var(--n-shadow); outline: none; transition: border-color .15s, box-shadow .15s;
}
.ntk .sh-search .search-input:focus { border-color: var(--n-blue); box-shadow: 0 0 0 4px rgba(31, 99, 216, .12); }
.ntk .sh-search .search-btn {
  position: absolute; right: 4px; top: 4px; width: 40px; height: 40px; border: none; border-radius: 50%;
  background: var(--n-navy) !important; color: #fff; cursor: pointer; display: grid; place-items: center; font-size: .95rem;
}
.ntk .sh-search .search-btn:hover { background: var(--n-blue) !important; }
.ntk .sh-contacts { display: flex; gap: 12px; align-items: flex-start; flex-shrink: 0; }
.ntk .sh-contacts-icon { color: var(--n-blue); font-size: 1.1rem; margin-top: 4px; }
.ntk .sh-phones { display: flex; flex-direction: column; line-height: 1.35; }
.ntk .sh-phones .phone-link { color: var(--n-navy); font-weight: 700; font-size: 1rem; text-decoration: none; white-space: nowrap; }
.ntk .sh-phones .phone-link:hover { color: var(--n-blue); }
.ntk .sh-phones .message-link { margin-top: 4px; font-size: .85rem; color: var(--n-blue); text-decoration: none; font-weight: 500; }
.ntk .sh-phones .message-link:hover { text-decoration: underline; }
.ntk .sh-cart {
  display: flex; align-items: center; gap: 12px; padding: 10px 16px; flex-shrink: 0;
  background: var(--n-surface); border: 1px solid var(--n-border); border-radius: var(--n-radius-md);
  box-shadow: var(--n-shadow); text-decoration: none; color: var(--n-text); transition: box-shadow .15s, border-color .15s;
}
.ntk .sh-cart:hover { box-shadow: var(--n-shadow-hover); border-color: var(--n-border-strong); }
.ntk .sh-cart-icon { position: relative; font-size: 1.5rem; color: var(--n-navy); line-height: 1; }
.ntk .sh-cart .cart-count {
  position: absolute; top: -9px; right: -10px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px;
  background: var(--n-blue); color: #fff; font-size: .72rem; font-weight: 700; display: grid; place-items: center; font-style: normal;
}
.ntk .sh-cart-text { display: flex; flex-direction: column; line-height: 1.25; }
.ntk .sh-cart-text b { font-size: .92rem; color: var(--n-navy); }
.ntk .sh-cart-text small { font-size: .78rem; color: var(--n-muted); white-space: nowrap; }
/* Личный кабинет: такая же плашка, как корзина, и вплотную к ней */
.ntk .sh-account {
  display: flex; align-items: center; gap: 10px; align-self: stretch; padding: 10px 14px; flex-shrink: 0;
  background: var(--n-surface); border: 1px solid var(--n-border); border-radius: var(--n-radius-md);
  box-shadow: var(--n-shadow); text-decoration: none; color: var(--n-text); transition: box-shadow .15s, border-color .15s;
}
.ntk .sh-account:hover { box-shadow: var(--n-shadow-hover); border-color: var(--n-border-strong); }
.ntk .sh-account + .sh-cart { margin-left: -10px; }
.ntk .sh-account-icon { font-size: 1.4rem; color: var(--n-navy); line-height: 1; }
.ntk .sh-account-text { display: flex; flex-direction: column; line-height: 1.25; }
.ntk .sh-account-text b { font-size: .92rem; color: var(--n-navy); }
.ntk .sh-account-text small { font-size: .78rem; color: var(--n-muted); white-space: nowrap; }
/* Уже 1280px подпись корзины («12 товаров на 1 234 567 ₽») не оставляет места — у кабинета остаётся только значок */
@media (max-width: 1279px) {
  .ntk .sh-account { padding: 10px 13px; }
  .ntk .sh-account-text { display: none; }
}

/* Навигация */
.ntk .main-nav {
  display: flex; align-items: stretch; min-height: 54px; background: var(--n-navy);
  border-radius: var(--n-radius-md); box-shadow: var(--n-shadow); overflow: hidden;
}
.ntk .mn-catalog {
  display: flex; align-items: center; gap: 12px; width: 280px; flex-shrink: 0; padding: 0 20px;
  color: #fff; text-decoration: none; font-weight: 600; font-size: .98rem; border-right: 1px solid rgba(255, 255, 255, .14);
  background: rgba(255, 255, 255, .04); transition: background .15s;
}
.ntk .mn-catalog:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.ntk .mn-catalog .fa-bars { font-size: 1.1rem; }
.ntk .mn-catalog-arrow { margin-left: auto; font-size: .75rem; opacity: .7; }
.ntk .mn-links { display: flex; align-items: stretch; flex-wrap: wrap; padding: 0 8px; }
.ntk .mn-links a {
  display: flex; align-items: center; padding: 0 18px; color: rgba(255, 255, 255, .92); text-decoration: none;
  font-weight: 500; font-size: .95rem; position: relative; transition: color .15s, background .15s;
}
.ntk .mn-links a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.ntk .mn-links a.is-active { color: #fff; }
.ntk .mn-links a.is-active::after { content: ""; position: absolute; left: 18px; right: 18px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--n-orange); }

/* ---------- Раскладка ---------- */
.ntk .main-layout { display: flex; gap: 22px; margin: 20px 0 32px; align-items: flex-start; }
.ntk .right-column { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 22px; }

/* ---------- Левая колонка ---------- */
html body.ntk .catalog-side {
  width: 280px; min-width: 280px; background: transparent !important; box-shadow: none; border-radius: 0;
  overflow: visible; position: static; display: flex; flex-direction: column; gap: 16px;
}
html body.ntk .catalog-title {
  display: flex !important; align-items: center; justify-content: space-between; padding: 14px 18px !important;
  background: var(--n-surface) !important; color: var(--n-navy) !important; font-size: 1rem !important; font-weight: 700 !important;
  border-radius: var(--n-radius) var(--n-radius) 0 0; border: 1px solid var(--n-border); border-bottom: none; margin: 0 !important;
}
html body.ntk .catalog-title span, html body.ntk .catalog-title i { color: var(--n-navy) !important; }
html body.ntk .catalog-list {
  list-style: none; margin: -16px 0 0 !important; padding: 4px 8px 8px !important; background: var(--n-surface) !important;
  border: 1px solid var(--n-border); border-top: none; border-radius: 0 0 var(--n-radius) var(--n-radius); box-shadow: var(--n-shadow);
}
.ntk .catalog-list > li { position: relative; border: none !important; }
.ntk .catalog-list > li + li { border-top: 1px solid #eef2f7 !important; }
html body.ntk .catalog-list li a {
  display: flex; align-items: center; gap: 10px; padding: 10px 10px !important; border-radius: var(--n-radius-sm);
  color: var(--n-text) !important; font-size: .9rem !important; font-weight: 500; white-space: normal; line-height: 1.3; background: transparent !important;
}
html body.ntk .catalog-list li a:hover { background: var(--n-blue-soft) !important; color: var(--n-blue) !important; }
.ntk .catalog-list li a img, .ntk .catalog-list li a > span:first-child { width: 26px !important; height: 26px !important; border-radius: 7px !important; flex-shrink: 0; }
.ntk .catalog-list .cat-count { color: var(--n-muted); font-weight: 400; font-size: .85rem; margin-left: 2px; }
.ntk .catalog-list .sub-arrow { margin-left: auto; font-size: .7rem; color: #9aa8b8; padding: 6px; }
.ntk .catalog-list .submenu {
  border-radius: var(--n-radius-md); border: 1px solid var(--n-border); box-shadow: var(--n-shadow-hover);
  padding: 6px; min-width: 250px; left: calc(100% + 8px); top: -6px; background: #fff;
}
.ntk .catalog-list .submenu::before { content: ""; position: absolute; left: -12px; top: 0; bottom: 0; width: 12px; }
.ntk .catalog-list .submenu li a { padding: 9px 12px !important; }

.ntk .news-block, .ntk .poll-block, .ntk .side-benefits {
  background: var(--n-surface) !important; border: 1px solid var(--n-border); border-radius: var(--n-radius);
  box-shadow: var(--n-shadow); padding: 18px 18px 16px !important; margin: 0 !important;
}
.ntk .news-title, .ntk .poll-title { font-size: 1rem !important; font-weight: 700; color: var(--n-navy) !important; margin: 0 0 12px !important; padding: 0 !important; border: none !important; background: none !important; }
.ntk .news-item { padding: 10px 0 !important; border-bottom: 1px solid #eef2f7 !important; margin: 0 !important; background: none !important; }
.ntk .news-link { display: block; color: var(--n-text) !important; font-size: .9rem; font-weight: 500; line-height: 1.35; text-decoration: none; }
.ntk .news-link:hover { color: var(--n-blue) !important; }
.ntk .news-date { display: block; margin-top: 3px; font-size: .78rem; color: var(--n-muted) !important; }
.ntk .all-news-link { display: inline-flex; margin-top: 12px; color: var(--n-blue) !important; font-weight: 600; font-size: .88rem; text-decoration: none; }
.ntk .all-news-link:hover { text-decoration: underline; }
.ntk .poll-form { display: flex; flex-direction: column; gap: 4px; }
.ntk .poll-option { display: flex !important; align-items: center; gap: 10px; padding: 7px 4px; font-size: .92rem; color: var(--n-text); cursor: pointer; border-radius: 8px; }
.ntk .poll-option:hover { background: var(--n-soft); }
.ntk .poll-option input { width: 18px; height: 18px; accent-color: var(--n-blue); margin: 0; }
.ntk .poll-btn {
  margin-top: 10px; width: 100%; min-height: 44px; border: none; border-radius: 999px; background: var(--n-navy) !important;
  color: #fff !important; font-weight: 600; font-size: .95rem; cursor: pointer; transition: background .15s;
}
.ntk .poll-btn:hover { background: var(--n-blue) !important; }
.ntk .side-benefits { display: flex; flex-direction: column; padding: 8px 14px !important; }
.ntk .sb-item { display: flex; align-items: center; gap: 14px; padding: 12px 0; text-decoration: none; color: var(--n-text); }
.ntk .sb-item + .sb-item { border-top: 1px solid #eef2f7; }
.ntk .sb-icon { width: 44px; height: 44px; border-radius: 50%; background: var(--n-blue-soft); color: var(--n-blue); display: grid; place-items: center; font-size: 1.1rem; flex-shrink: 0; }
.ntk .sb-item b { display: block; font-size: .9rem; color: var(--n-navy); font-weight: 600; }
.ntk .sb-item small { display: block; font-size: .8rem; color: var(--n-muted); }
.ntk .sb-item:hover b { color: var(--n-blue); }

/* ---------- Слайдер ---------- */
html body.ntk .banner-slider {
  position: relative; width: 100%; height: auto !important; aspect-ratio: 1000 / 400; border-radius: var(--n-radius) !important;
  overflow: hidden; box-shadow: var(--n-shadow); background: var(--n-navy); margin: 0 !important;
}
.ntk .banner-slider.is-empty { display: none; }
.ntk .slides-container { height: 100%; }
.ntk .slide { min-width: 100%; height: 100%; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
/* Размытый фон из той же картинки — заполняет поля, когда изображение не совпадает с пропорцией слайдера */
.ntk .slide-bg { position: absolute; inset: 0; background-size: cover; background-position: center; filter: blur(20px) brightness(.85); transform: scale(1.15); z-index: 0; }
/* Картинка показывается целиком, без обрезки */
.ntk .slide img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; display: block; }
.ntk .slide-content { color: #fff; text-align: center; padding: 20px; }
.ntk .slide-content h2 { font-size: clamp(1.4rem, 3vw, 2.2rem); font-weight: 800; margin-bottom: 8px; }
html body.ntk .slider-arrow {
  width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .92) !important; color: var(--n-navy);
  border: none; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); font-size: .95rem; opacity: 0; transition: opacity .2s, transform .2s, background .15s;
}
.ntk .banner-slider:hover .slider-arrow, .ntk .slider-arrow:focus-visible { opacity: 1; }
.ntk .slider-arrow:hover { background: #fff !important; transform: translateY(-50%) scale(1.06); }
.ntk .slider-arrow.prev { left: 16px; }
.ntk .slider-arrow.next { right: 16px; }
.ntk .slider-dots { bottom: 14px; gap: 6px; padding: 5px 8px; border-radius: 999px; background: rgba(15, 47, 95, .35); backdrop-filter: blur(4px); }
html body.ntk .dot { width: 8px; height: 8px; padding: 0; border: none; border-radius: 999px; background: rgba(255, 255, 255, .55); cursor: pointer; transition: width .25s, background .2s; }
html body.ntk .dot.active { width: 22px; background: #fff; }

/* ---------- Преимущества под баннером ---------- */
/* Колонки строго поровну: при 1fr колонка с длинным словом расширялась и выталкивала соседнюю за край карточки */
.ntk .benefits-bar {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--n-surface); border: 1px solid var(--n-border);
  border-radius: var(--n-radius); box-shadow: var(--n-shadow); padding: 6px 0;
}
.ntk .bb-item { display: flex; align-items: center; gap: 14px; padding: 14px 20px; text-decoration: none; color: var(--n-text); font-size: .9rem; font-weight: 500; line-height: 1.3; }
.ntk .bb-item + .bb-item { border-left: 1px solid var(--n-border); }
.ntk .bb-item i { font-size: 1.7rem; color: var(--n-blue); width: 34px; text-align: center; flex-shrink: 0; }
.ntk .bb-item:hover { color: var(--n-blue); }
/* До 1200px значок стоит над подписью и всё по центру: в узкой плитке (рядом колонка каталога, телефон)
   длинные слова («производство», «надёжность») не помещались рядом со значком и вылезали за край */
@media (max-width: 1200px) {
  .ntk .bb-item { flex-direction: column; justify-content: center; gap: 8px; padding: 14px 10px; text-align: center; }
}

/* ---------- Заголовки секций ---------- */
.ntk .products-section, .ntk .reviews-section { margin: 0 !important; }
.ntk .section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
html body.ntk .section-title {
  margin: 0 0 16px; padding: 2px 0 2px 14px !important; border-left: 4px solid var(--n-blue) !important; border-radius: 0;
  font-size: 1.5rem !important; font-weight: 800; color: var(--n-navy) !important; line-height: 1.25; letter-spacing: -.01em; background: none !important;
}
.ntk .section-head .section-title { margin: 0 !important; }
.ntk .section-more { display: inline-flex; align-items: center; gap: 8px; color: var(--n-blue); font-weight: 600; font-size: .92rem; text-decoration: none; white-space: nowrap; }
.ntk .section-more i { font-size: .8rem; transition: transform .15s; }
.ntk .section-more:hover i { transform: translateX(3px); }

/* ---------- Карточки товаров ---------- */
html body.ntk .product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
html body.ntk .product-card {
  display: flex; flex-direction: column; max-width: none !important; padding: 14px 14px 16px !important; background: var(--n-surface) !important;
  border: 1px solid var(--n-border) !important; border-radius: var(--n-radius) !important; box-shadow: var(--n-shadow) !important;
  transition: box-shadow .2s, transform .2s, border-color .2s; overflow: hidden;
}
/* Наведение не меняет размеров карточки: старый styles.css расширял её на 70px, ряд становился выше, и всё под ним прыгало.
   Увеличиваем через transform — место в сетке остаётся прежним, карточка ложится поверх соседних; на сенсорном экране наведение залипает, там без увеличения. */
html body.ntk .product-card:hover { width: auto; margin-right: 0; z-index: 50; box-shadow: var(--n-shadow-hover) !important; transform: translateY(-3px); border-color: var(--n-border-strong) !important; }
@media (hover: hover) { html body.ntk .product-card:hover { transform: translateY(-3px) scale(1.08); } }
.ntk .product-card > a:first-child, .ntk .pc-image { display: block; border-radius: var(--n-radius-md); background: var(--n-soft); overflow: hidden; margin-bottom: 12px; }
html body.ntk .product-main-image {
  display: block; width: 100% !important; height: auto !important; aspect-ratio: 1 / 1; object-fit: contain !important;
  padding: 10px; margin: 0 !important; background: var(--n-soft) !important; border-radius: var(--n-radius-md) !important; mix-blend-mode: multiply;
}
.ntk .pc-rating { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
html body.ntk .product-stars { color: var(--n-star) !important; font-size: .9rem; letter-spacing: 1px; margin: 0 0 6px; }
.ntk .pc-rating .product-stars { margin: 0; }
.ntk .pc-reviews { font-size: .78rem; color: var(--n-muted); }
html body.ntk .product-name {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  color: var(--n-navy) !important; font-weight: 700 !important; font-size: .93rem !important; line-height: 1.3 !important; text-decoration: none; margin: 0 0 6px !important; min-height: 3.6em;
}
.ntk .product-name:hover { color: var(--n-blue) !important; }
html body.ntk .product-desc {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  color: var(--n-muted) !important; font-size: .8rem !important; line-height: 1.4 !important; margin: 0 0 12px !important; min-height: 2.8em;
}
html body.ntk .product-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto !important; flex-wrap: wrap; }
html body.ntk .product-price { font-size: 1.2rem !important; font-weight: 800 !important; color: var(--n-text) !important; white-space: nowrap; line-height: 1.2; }
.ntk .pc-old-price { display: block; font-size: .78rem; font-weight: 500; color: var(--n-muted); }
html body.ntk .add-to-cart-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 0 14px !important;
  border: none; border-radius: 999px !important; background: var(--n-navy) !important; color: #fff !important;
  font-size: .82rem !important; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background .15s;
}
html body.ntk .add-to-cart-btn:hover { background: var(--n-blue) !important; }
/* Доп. фото на карточке — столбик миниатюр справа на фото, не длиннее самого фото (75cqw — высота фото 4:3); лишние листают стрелки, которые добавляет js/script.js.
   Положение задано целиком: старый styles.css до 1024px при наведении уносил столбик к нижнему краю карточки, где его обрезало. */
.ntk .product-card .thumbnail-strip {
  position: absolute; top: 20px; right: 20px; bottom: auto; z-index: 1; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: center; gap: 3px;
  max-height: 130px; max-height: calc(75cqw - 12px); margin: 0; padding: 0; overflow: hidden; background: none; border-radius: 0; box-shadow: none;
}
.ntk .product-card .thumb-track { display: flex; flex-direction: column; gap: 6px; min-height: 0; overflow-y: auto; scrollbar-width: none; scroll-snap-type: y mandatory; }
.ntk .product-card .thumb-track::-webkit-scrollbar { display: none; }
.ntk .product-card .thumbnail { flex: none; scroll-snap-align: start; width: 44px; height: 44px; object-fit: cover; border-radius: 8px; border: 2px solid var(--n-border); background: var(--n-soft); cursor: pointer; transition: border-color .15s, transform .15s; }
.ntk .product-card .thumbnail:hover, .ntk .product-card .thumbnail.active { border-color: var(--n-blue); transform: translateY(-1px); }
.ntk .product-card .thumb-arrow {
  display: none; flex: none; place-items: center; width: 44px; height: 16px; padding: 0; border: 1px solid var(--n-border); border-radius: 6px;
  background: rgba(255, 255, 255, .92); color: var(--n-navy); font-size: .6rem; line-height: 1; cursor: pointer; transition: border-color .15s, color .15s;
}
.ntk .product-card .thumbnail-strip.is-scrollable .thumb-arrow { display: grid; }
.ntk .product-card .thumb-arrow:hover:not(:disabled) { border-color: var(--n-blue); color: var(--n-blue); }
.ntk .product-card .thumb-arrow:disabled { opacity: .4; cursor: default; }

/* ---------- Отзывы ---------- */
.ntk .reviews-container { display: grid; gap: 14px; }
html body.ntk .review-card {
  display: flex; gap: 18px; padding: 18px !important; background: var(--n-surface) !important; border: 1px solid var(--n-border) !important;
  border-radius: var(--n-radius) !important; box-shadow: var(--n-shadow) !important; margin: 0 !important;
}
.ntk .review-info { flex: 1; min-width: 0; }
.ntk .review-header { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; margin-bottom: 4px; }
.ntk .review-author { font-weight: 700; color: var(--n-navy); }
.ntk .review-date { font-size: .8rem; color: var(--n-muted); }
.ntk .review-stars { color: var(--n-star) !important; margin-bottom: 4px; }
.ntk .review-product-link { font-size: .85rem; color: var(--n-blue) !important; font-weight: 600; text-decoration: none; }
.ntk .review-text { margin-top: 8px; color: var(--n-text); font-size: .92rem; line-height: 1.6; }
.ntk .review-product-preview { width: 150px; flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; align-items: center; text-align: center; }
.ntk .review-product-img { width: 90px !important; height: 90px !important; object-fit: contain !important; background: var(--n-soft); border-radius: var(--n-radius-md) !important; padding: 6px; }
.ntk .review-product-name-mini { font-size: .78rem; color: var(--n-muted); }
.ntk .buy-from-review-btn { border: 1px solid var(--n-border-strong) !important; background: #fff !important; color: var(--n-navy) !important; border-radius: 999px !important; padding: 7px 12px !important; font-size: .8rem !important; font-weight: 600; cursor: pointer; }
.ntk .buy-from-review-btn:hover { border-color: var(--n-blue) !important; color: var(--n-blue) !important; }

/* ---------- Партнёры, второй баннер ---------- */
html body.ntk .partners-strip {
  display: flex; flex-wrap: wrap; gap: 10px; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important;
}
html body.ntk .partner-link {
  display: inline-flex; align-items: center; padding: 10px 16px !important; background: var(--n-surface) !important; color: var(--n-navy) !important;
  border: 1px solid var(--n-border) !important; border-radius: 999px !important; font-size: .82rem !important; font-weight: 600; text-decoration: none; box-shadow: var(--n-shadow);
}
html body.ntk .partner-link:hover { border-color: var(--n-blue) !important; color: var(--n-blue) !important; }
html body.ntk .banner-secondary { border-radius: var(--n-radius) !important; overflow: hidden; box-shadow: var(--n-shadow); background: var(--n-surface); aspect-ratio: auto; }
.ntk .banner-img-secondary { width: 100%; height: auto !important; display: block; }

/* ---------- Подписка ---------- */
html body.ntk .subscribe-block {
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap; padding: 22px 26px !important; margin: 0 !important;
  background: linear-gradient(0deg, #e5eefb, #e5eefb) !important; color: var(--n-text) !important;
  border: 1px solid #d5e3f6; border-radius: var(--n-radius) !important; box-shadow: none;
}
.ntk .subscribe-icon { width: 56px; height: 56px; border-radius: 14px; background: var(--n-surface); color: var(--n-blue); display: grid; place-items: center; font-size: 1.6rem; flex-shrink: 0; box-shadow: var(--n-shadow); }
.ntk .subscribe-text { flex: 1; min-width: 220px; }
.ntk .subscribe-text h3 { margin: 0 0 4px !important; font-size: 1.2rem !important; font-weight: 800; color: var(--n-navy) !important; }
.ntk .subscribe-text p { margin: 0; font-size: .9rem; color: var(--n-muted) !important; }
.ntk .subscribe-ok { color: var(--n-green) !important; font-weight: 600; margin-top: 6px !important; }
.ntk .subscribe-error { color: var(--n-red) !important; font-weight: 600; margin-top: 6px !important; }
html body.ntk .subscribe-form { display: flex; gap: 10px; flex: 1; min-width: 280px; max-width: 480px; margin: 0; }
html body.ntk .subscribe-input {
  flex: 1; min-width: 0; height: 48px; padding: 0 20px !important; border: 1px solid var(--n-border-strong) !important; border-radius: 999px !important;
  background: #fff !important; color: var(--n-text) !important; font-size: .95rem; outline: none;
}
.ntk .subscribe-input:focus { border-color: var(--n-blue) !important; box-shadow: 0 0 0 4px rgba(31, 99, 216, .12); }
html body.ntk .subscribe-btn {
  height: 48px; padding: 0 26px !important; border: none; border-radius: 999px !important; background: var(--n-orange) !important;
  color: #1c1400 !important; font-weight: 700; font-size: .95rem; cursor: pointer; white-space: nowrap; transition: background .15s;
}
html body.ntk .subscribe-btn:hover { background: var(--n-orange-hover) !important; }

/* ---------- Подвал ---------- */
html body.ntk .site-footer {
  margin: 10px 0 0; padding: 40px 0 0 !important; background: transparent !important; border-top: 1px solid var(--n-border);
  color: var(--n-text); border-radius: 0 !important; box-shadow: none !important;
}
.ntk .sf-grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr) 1.3fr; gap: 28px; }
.ntk .sf-logo img { width: 130px; height: auto; display: block; }
.ntk .sf-tagline { margin: 12px 0 14px; display: flex; flex-direction: column; gap: 3px; font-size: .85rem; line-height: 1.35; color: var(--n-muted); }
.ntk .sf-tagline b { color: var(--n-navy); font-weight: 600; }
.ntk .sf-socials { display: flex; gap: 8px; flex-wrap: wrap; }
html body.ntk .sf-socials .social-link {
  width: 40px; height: 40px; padding: 0 !important; border-radius: 10px !important; display: grid !important; place-items: center;
  background: var(--n-navy) !important; color: #fff !important; font-size: 1.05rem; text-decoration: none; transition: background .15s, transform .15s;
}
html body.ntk .sf-socials .social-link:hover { background: var(--n-blue) !important; transform: translateY(-2px); }
.ntk .sf-title { margin: 4px 0 14px; font-size: 1rem; font-weight: 700; color: var(--n-navy); }
.ntk .sf-links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.ntk .sf-links a { color: var(--n-text); text-decoration: none; font-size: .9rem; }
.ntk .sf-links a:hover { color: var(--n-blue); }
.ntk .sf-contact-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; font-size: .9rem; }
.ntk .sf-contact-list li { display: flex; gap: 12px; align-items: flex-start; }
.ntk .sf-contact-list i { color: var(--n-blue); width: 18px; text-align: center; margin-top: 3px; flex-shrink: 0; }
.ntk .sf-contact-list a { color: var(--n-text); text-decoration: none; display: block; font-weight: 600; }
.ntk .sf-contact-list a:hover { color: var(--n-blue); }
.ntk .sf-account { margin-top: 14px; display: flex; gap: 8px; font-size: .88rem; color: var(--n-muted); }
.ntk .sf-account a { color: var(--n-blue); text-decoration: none; font-weight: 600; }
html body.ntk .sf-banner { grid-column: auto; margin: 28px 0 0; border-radius: var(--n-radius); overflow: hidden; box-shadow: var(--n-shadow); background: #fff; max-width: 615px; min-height: 0; }
.ntk .sf-banner img { width: 100%; height: auto; display: block; }
.ntk .sf-bottom { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 28px; padding: 18px 0 26px; border-top: 1px solid var(--n-border); font-size: .85rem; color: var(--n-muted); }
.ntk .sf-bottom a { color: var(--n-muted); text-decoration: none; }
.ntk .sf-bottom a:hover { color: var(--n-blue); }

/* ---------- Контентные страницы: каталог, товар, страницы, новости, кабинет ---------- */
html body.ntk .catalog-content,
html body.ntk .news-full,
html body.ntk .product-detail,
html body.ntk .feedback-form-block,
html body.ntk .review-form,
html body.ntk .ntk-card {
  background: var(--n-surface) !important; border: 1px solid var(--n-border); border-radius: var(--n-radius) !important;
  box-shadow: var(--n-shadow) !important; padding: 28px 32px !important;
}
.ntk .news-full h1, .ntk .product-info h1 { font-size: 1.6rem; font-weight: 800; color: var(--n-navy); line-height: 1.25; margin: 0 0 8px; letter-spacing: -.01em; overflow-wrap: anywhere; }
.ntk .news-full .news-date { display: block; margin: 0 0 16px; font-size: .85rem; color: var(--n-muted) !important; }
.ntk .back-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 22px; color: var(--n-blue) !important; font-weight: 600; text-decoration: none; }
.ntk .back-link:hover { text-decoration: underline; }
.ntk .ntk-muted { color: var(--n-muted); }
.ntk .ntk-card-title { margin: 0 0 16px; font-size: 1.2rem; font-weight: 700; color: var(--n-navy); line-height: 1.3; }

/* Раскладка страниц без левой колонки (корзина, заказ, кабинет) */
.ntk .ntk-page { display: flex; flex-direction: column; gap: 18px; margin: 20px 0 32px; }
.ntk .ntk-page > .section-title { margin: 0 !important; }
.ntk .ntk-card--narrow { width: 100%; max-width: 520px; margin: 0 auto; }
.ntk .ntk-card--mid { width: 100%; max-width: 760px; margin: 0 auto; }

/* Красивая типографика текстов из админки (описания разделов, страницы, новости, описание товара) */
.ntk .cat-desc,
.ntk .news-text,
.ntk .tab-content,
.ntk .page-text {
  font-size: 1rem; line-height: 1.75 !important; color: #243447; overflow-wrap: anywhere;
}
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) :is(p, ul, ol, table, blockquote) { margin: 0 0 1em; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) :is(h1, h2, h3, h4) {
  color: var(--n-navy) !important; font-weight: 700; line-height: 1.3; margin: 1.4em 0 .6em; letter-spacing: -.005em;
}
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) h1 { font-size: 1.5rem; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) h2 { font-size: 1.3rem; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) h3 { font-size: 1.12rem; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) :is(h1, h2, h3, h4) span { color: inherit !important; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) > :first-child { margin-top: 0; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) :is(ul, ol) { padding-left: 1.4em; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) li { margin: .3em 0; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) a { color: var(--n-blue) !important; text-decoration: underline; text-decoration-color: rgba(31, 99, 216, .35); text-underline-offset: 3px; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) a:hover { text-decoration-color: currentColor; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) img {
  max-width: 100% !important; height: auto !important; border-radius: var(--n-radius-md); vertical-align: middle;
}
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) iframe { max-width: 100%; border-radius: var(--n-radius-md); border: 0; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) table {
  display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: .92rem;
}
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) :is(td, th) { border: 1px solid var(--n-border); padding: 8px 12px; vertical-align: top; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) hr { border: 0; border-top: 1px solid var(--n-border); margin: 1.6em 0; }
/* Тексты, перенесённые со старого сайта, часто целиком выровнены по центру — обычные абзацы читаем слева */
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) p[style*="text-align: center"]:not(:has(img, iframe, a, strong)) { text-align: left !important; }

/* Левая колонка: значки разделов */
.ntk .catalog-title { text-decoration: none; }
.ntk .catalog-title i { font-size: .8rem; }
.ntk .cl-thumb { object-fit: cover; }
.ntk .cl-icon { display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--n-navy), var(--n-blue)); font-size: .8rem; }

/* Каталог: описания, баннеры, галерея, подкатегории, сортировка */
.ntk .cat-desc { margin-bottom: 20px; }
.ntk .cat-desc-after { margin: 24px 0 0; }
.ntk .cat-banner { margin: 0 0 20px; text-align: center; }
.ntk .cat-banner-middle { margin: 20px 0; }
.ntk .cat-banner-bottom { margin: 20px 0 0; text-align: center; }
.ntk .cat-banner img, .ntk .cat-banner-bottom img { max-width: 100%; height: auto; border-radius: var(--n-radius-md); }
.ntk .cat-banner img { max-height: 300px; }
.ntk .cat-banner-middle img { max-height: 400px; }
.ntk .cat-banner-bottom img { max-height: 200px; }
.ntk .gallery-container { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 20px; }
.ntk .gallery-container img { width: 100px; height: 100px; object-fit: cover; border-radius: 10px; border: 1px solid var(--n-border); cursor: pointer; transition: transform .2s, border-color .2s; }
.ntk .gallery-container img:hover { border-color: var(--n-blue); transform: scale(1.04); }
.ntk .subcat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-top: 12px; }
html body.ntk .subcat-card {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px; text-decoration: none; color: var(--n-navy);
  background: var(--n-soft); border: 1px solid var(--n-border); border-radius: var(--n-radius-md); transition: background .15s, border-color .15s, transform .15s;
}
html body.ntk .subcat-card:hover { background: var(--n-blue-soft); border-color: #bcd2f5; transform: translateY(-2px); }
.ntk .subcat-img { width: 50px; height: 50px; border-radius: 10px; object-fit: cover; flex-shrink: 0; }
.ntk .subcat-icon { width: 50px; height: 50px; display: grid; place-items: center; flex-shrink: 0; font-size: 1.2rem; background: #fff; border: 1px solid var(--n-border); border-radius: 10px; }
.ntk .subcat-name { color: var(--n-navy); font-weight: 600; font-size: 1rem; line-height: 1.3; }
.ntk .subcat-count { color: var(--n-muted); font-size: .85rem; }
.ntk .subcat-arrow { margin-left: auto; color: #9aa8b8; font-size: .8rem; }
.ntk .pl-sort a, .ntk .pl-tabs a {
  padding: 8px 14px; border-radius: 999px; font-size: .85rem; font-weight: 600; text-decoration: none;
  background: var(--n-soft); color: var(--n-navy); border: 1px solid var(--n-border); transition: border-color .15s, color .15s;
}
.ntk .pl-sort a:hover, .ntk .pl-tabs a:hover { border-color: var(--n-blue); color: var(--n-blue); }
.ntk .pl-sort a.is-active, .ntk .pl-tabs a.is-active { background: var(--n-navy); color: #fff; border-color: var(--n-navy); }
.ntk .pl-tabs, .ntk .pl-sort { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 16px; }
.ntk .pl-sort span { color: var(--n-muted); font-size: .88rem; margin-right: 6px; }
.ntk .catalog-content .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ntk .all-cats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; margin: 8px 0 24px; }
html body.ntk .all-cat-card {
  display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 170px; padding: 22px 16px;
  text-align: center; text-decoration: none; background: var(--n-surface); border: 1px solid var(--n-border);
  border-radius: var(--n-radius); box-shadow: var(--n-shadow); transition: box-shadow .2s, border-color .2s, transform .2s;
}
html body.ntk .all-cat-card:hover { box-shadow: var(--n-shadow-hover); border-color: #bcd2f5; transform: translateY(-3px); }
.ntk .all-cat-card img { width: 60px; height: 60px; object-fit: cover; border-radius: 12px; margin-bottom: 14px; }
.ntk .all-cat-card .cat-icon { width: 60px; height: 60px; display: grid; place-items: center; margin-bottom: 14px; font-size: 1.5rem; border-radius: 12px; background: var(--n-blue-soft); }
.ntk .all-cat-card .cat-name { color: var(--n-navy); font-weight: 700; font-size: 1.05rem; line-height: 1.3; overflow-wrap: anywhere; }
.ntk .all-cat-card .cat-count { color: var(--n-muted); font-size: .85rem; margin-top: 4px; }

/* Товар */
html body.ntk .product-detail { display: flex; flex-wrap: wrap; gap: 34px; margin: 0; }
.ntk .product-gallery { width: 400px; max-width: 100%; flex-shrink: 0; }
.ntk .main-image-box { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; cursor: zoom-in; border-radius: var(--n-radius); border: 1px solid var(--n-border); background: var(--n-soft); }
.ntk .main-image-box img { width: 100%; height: 100%; object-fit: contain; transition: transform .3s; mix-blend-mode: multiply; }
.ntk .main-image-box:hover img { transform: scale(1.5); }
.ntk .thumbs-row { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.ntk .thumbs-row img { width: 60px; height: 60px; object-fit: cover; cursor: pointer; border-radius: 10px; border: 2px solid var(--n-border); background: var(--n-soft); }
.ntk .thumbs-row img.active, .ntk .thumbs-row img:hover { border-color: var(--n-blue); }
.ntk .product-info { flex: 1; min-width: 260px; }
.ntk .pd-stars { color: var(--n-star); font-size: 1.35rem; letter-spacing: 2px; line-height: 1; margin: 6px 0 14px; }
.ntk .pd-stars .is-off { color: var(--n-border-strong); }
.ntk .specs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px; margin: 16px 0; padding: 14px 16px; background: var(--n-soft); border-radius: var(--n-radius-md); }
.ntk .specs .l { color: var(--n-muted); font-size: .85rem; }
.ntk .specs .v { color: var(--n-navy); font-weight: 600; }
.ntk .specs .v.pd-stock-in { color: var(--n-green); }
.ntk .specs .v.pd-stock-out { color: var(--n-red); }
.ntk .price-block { margin: 20px 0 16px; font-size: 2rem; font-weight: 800; line-height: 1.2; color: var(--n-text); }
.ntk .old-price { margin-left: 12px; font-size: 1.1rem; font-weight: 500; color: var(--n-muted); text-decoration: line-through; }
.ntk .actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 0 0 8px; }
.ntk .actions input {
  width: 84px; height: 46px; padding: 0 10px; text-align: center; font-size: 1rem; color: var(--n-text); background: #fff;
  border: 1px solid var(--n-border-strong); border-radius: 999px; outline: none;
}
.ntk .actions input:focus { border-color: var(--n-blue); box-shadow: 0 0 0 4px rgba(31, 99, 216, .12); }
html body.ntk .btn-cart {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 28px; border: none;
  border-radius: 999px; background: var(--n-orange); color: #1c1400; font-weight: 700; font-size: 1rem; cursor: pointer; transition: background .15s;
}
html body.ntk .btn-cart:hover { background: var(--n-orange-hover); }
.ntk .tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--n-border); overflow-x: auto; scrollbar-width: none; }
.ntk .tabs::-webkit-scrollbar { display: none; }
.ntk .tab-btn {
  padding: 12px 18px; margin-bottom: -1px; border: none; border-bottom: 3px solid transparent; background: none;
  font-weight: 600; font-size: .95rem; color: var(--n-muted); cursor: pointer; white-space: nowrap;
}
.ntk .tab-btn:hover { color: var(--n-navy); }
.ntk .tab-btn.active { color: var(--n-navy); border-bottom-color: var(--n-blue); }
.ntk .tab-content { display: none; }
html body.ntk .tab-content.active {
  display: block; background: var(--n-surface); border: 1px solid var(--n-border); border-top: none;
  border-radius: 0 0 var(--n-radius) var(--n-radius); padding: 26px 30px; box-shadow: var(--n-shadow);
}
.ntk .pd-video { display: block; width: 100%; max-height: 480px; border-radius: var(--n-radius-md); background: #000; }
.ntk .tab-content iframe + .pd-video { margin-top: 15px; }

/* Новости */
.ntk .news-list { display: flex; flex-direction: column; gap: 14px; }
html body.ntk .news-list-item { margin: 0; padding: 20px 24px; background: var(--n-surface); border: 1px solid var(--n-border); border-radius: var(--n-radius); box-shadow: var(--n-shadow); }
.ntk .news-list-item h3 { margin: 0 0 4px; font-size: 1.1rem; line-height: 1.35; }
.ntk .news-list-item h3 a { color: var(--n-navy); font-weight: 700; text-decoration: none; }
.ntk .news-list-item h3 a:hover { color: var(--n-blue); }
.ntk .news-list-item .news-date { font-size: .82rem; }
.ntk .news-excerpt { margin: 8px 0 10px; color: var(--n-text); font-size: .93rem; line-height: 1.6; }

/* Отзывы: выбор оценки */
.ntk .stars-input { display: flex; gap: 4px; font-size: 2rem; line-height: 1; cursor: pointer; user-select: none; }
.ntk .stars-input span { color: var(--n-border-strong); transition: color .15s; }
.ntk .stars-input span.active, .ntk .stars-input span:hover { color: var(--n-star); }

/* ---------- Формы: единые поля ---------- */
.ntk .form-group { margin-bottom: 16px; }
.ntk .form-group label { display: block; margin-bottom: 6px; font-size: .9rem; font-weight: 600; color: var(--n-navy); }
.ntk .form-group input, .ntk .form-group select, .ntk .form-group textarea {
  display: block; width: 100%; min-height: 46px; padding: 11px 14px; font-size: .95rem; line-height: 1.4; color: var(--n-text);
  background: #fff; border: 1px solid var(--n-border-strong); border-radius: var(--n-radius-sm); outline: none; transition: border-color .15s, box-shadow .15s;
}
.ntk .form-group textarea { min-height: 110px; resize: vertical; }
.ntk .feedback-form-block .form-group textarea { min-height: 140px; }
.ntk .form-group input::placeholder, .ntk .form-group textarea::placeholder { color: #9aa8b8; }
.ntk .form-group input:focus, .ntk .form-group select:focus, .ntk .form-group textarea:focus { border-color: var(--n-blue); box-shadow: 0 0 0 4px rgba(31, 99, 216, .12); }
/* Ошибка в поле: красная рамка и подсказка над полем. Правило стоит после :focus, чтобы рамка оставалась красной и при вводе */
.ntk .form-group.has-error input { border-color: var(--n-red); box-shadow: 0 0 0 4px rgba(217, 58, 58, .12); }
.ntk .form-group .form-error { margin: 0 0 6px; color: #b42323; font-size: .85rem; font-weight: 600; }
/* Стрелка списка — своя, на таком же отступе от края, как текст: родную Chrome рисует вплотную к рамке, и отступ её не двигает.
   padding-right с !important — иначе его перебивает padding полей формы заказа из старого styles.css */
.ntk .form-group select {
  -webkit-appearance: none; appearance: none; padding-right: 36px !important; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2366768a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center / 12px 8px;
}
.ntk .form-group input:disabled { background: var(--n-soft); color: var(--n-muted); cursor: not-allowed; }
.ntk .ntk-form-note { margin: 16px 0 0; text-align: center; color: var(--n-muted); font-size: .92rem; }
.ntk .ntk-form-note a { font-weight: 600; }

/* ---------- Кнопки ---------- */
html body.ntk .btn-submit, .ntk .ntk-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 28px;
  border: 1px solid transparent; border-radius: 999px; background: var(--n-navy); color: #fff; font-weight: 700; font-size: .98rem;
  line-height: 1.2; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, color .15s;
}
html body.ntk .btn-submit:hover, .ntk .ntk-btn:hover { background: var(--n-blue); color: #fff; }
.ntk .ntk-btn--accent { background: var(--n-orange); color: #1c1400; }
.ntk .ntk-btn--accent:hover { background: var(--n-orange-hover); color: #1c1400; }
.ntk .ntk-btn--ghost { background: #fff; color: var(--n-navy); border-color: var(--n-border-strong); }
.ntk .ntk-btn--ghost:hover { background: #fff; color: var(--n-blue); border-color: var(--n-blue); }
.ntk .ntk-btn--danger-ghost { background: #fff; color: var(--n-red); border-color: #f1c7c7; }
.ntk .ntk-btn--danger-ghost:hover { background: #fdf1f1; color: var(--n-red); border-color: var(--n-red); }
.ntk .ntk-btn--block { width: 100%; }
.ntk .ntk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 20px; }
.ntk .ntk-page > .ntk-actions { margin-top: 0; }
.ntk .ntk-actions--center { justify-content: center; }
.ntk .ntk-actions .back-link { margin-top: 0; }

/* ---------- Уведомления ---------- */
.ntk .ntk-alert, .ntk .ok {
  margin: 0 0 16px; padding: 12px 16px; border: 1px solid transparent; border-radius: var(--n-radius-md);
  font-size: .93rem; font-weight: 500; line-height: 1.45;
}
.ntk .ok, .ntk .ntk-alert--ok { background: #e9f7ef; border-color: #c5ead5; color: #136c3c; }
.ntk .ntk-alert--error { background: #fdf1f1; border-color: #f4cccc; color: #b42323; }
.ntk .ntk-alert--info { background: var(--n-blue-soft); border-color: #cfe0fb; color: var(--n-navy); }
.ntk .ntk-alert a { color: inherit; font-weight: 700; }
.ntk .right-column > .ok, .ntk .feedback-form-block .ok { margin: 0; }

/* ---------- Таблицы ---------- */
.ntk .ntk-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ntk .ntk-table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.ntk .ntk-table th {
  padding: 10px 12px; text-align: left; white-space: nowrap; background: var(--n-soft); border-bottom: 1px solid var(--n-border);
  color: var(--n-muted); font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
}
.ntk .ntk-table th:first-child { border-radius: var(--n-radius-sm) 0 0 var(--n-radius-sm); }
.ntk .ntk-table th:last-child { border-radius: 0 var(--n-radius-sm) var(--n-radius-sm) 0; }
.ntk .ntk-table td { padding: 12px; border-bottom: 1px solid var(--n-border); vertical-align: middle; }
.ntk .ntk-table tr:last-child td { border-bottom: none; }
.ntk .ntk-table .is-center { text-align: center; }
.ntk .ntk-table .is-nowrap { white-space: nowrap; }
.ntk .ntk-badge { display: inline-flex; align-items: center; padding: 3px 12px; border-radius: 999px; background: var(--n-blue-soft); color: var(--n-navy); font-size: .8rem; font-weight: 600; white-space: nowrap; }
.ntk .ntk-dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 18px; margin: 0 0 22px; padding: 16px 18px; background: var(--n-soft); border-radius: var(--n-radius-md); }
.ntk .ntk-dl dt { color: var(--n-muted); font-size: .88rem; }
.ntk .ntk-dl dd { margin: 0; font-weight: 600; color: var(--n-navy); overflow-wrap: anywhere; }

/* ---------- Корзина ---------- */
.ntk .cart-table .cart-name { min-width: 180px; font-weight: 600; color: var(--n-navy); }
.ntk .cart-table .cart-num { white-space: nowrap; }
.ntk .cart-qty {
  width: 76px; height: 40px; padding: 0 8px; text-align: center; font-size: .95rem; color: var(--n-text); background: #fff;
  border: 1px solid var(--n-border-strong); border-radius: 999px; outline: none;
}
.ntk .cart-qty:focus { border-color: var(--n-blue); box-shadow: 0 0 0 4px rgba(31, 99, 216, .12); }
.ntk .cart-remove {
  width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #f4cccc; border-radius: 50%;
  background: #fff; color: var(--n-red); cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.ntk .cart-remove:hover { background: var(--n-red); color: #fff; border-color: var(--n-red); }
.ntk .cart-total { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--n-border); text-align: right; font-size: 1.05rem; color: var(--n-muted); }
.ntk .cart-total b { margin-left: 6px; font-size: 1.45rem; font-weight: 800; color: var(--n-text); white-space: nowrap; }

/* ---------- Оформление заказа ---------- */
.ntk .checkout-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }
.ntk .checkout-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 20px; }
.ntk .checkout-summary { padding: 18px; background: var(--n-soft); border: 1px solid var(--n-border); border-radius: var(--n-radius-md); }
.ntk .checkout-summary-title { margin: 0 0 10px; font-size: 1.05rem; font-weight: 700; color: var(--n-navy); }
.ntk .checkout-summary-row { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--n-border); font-size: .92rem; overflow-wrap: anywhere; }
.ntk .checkout-summary-row:last-child { border-bottom: none; }
.ntk .checkout-summary .ntk-alert { margin: 0; }

/* ---------- Личный кабинет и заказы ---------- */
.ntk .account-head {
  display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 16px 24px;
  margin-bottom: 26px; padding: 18px 20px; background: var(--n-soft); border: 1px solid var(--n-border); border-radius: var(--n-radius-md);
}
.ntk .account-user { margin: 0; line-height: 1.6; color: var(--n-muted); overflow-wrap: anywhere; }
.ntk .account-user strong { color: var(--n-navy); font-size: 1.05rem; }
.ntk .account-links { display: flex; flex-wrap: wrap; gap: 10px; }
.ntk .account-links .ntk-btn { min-height: 40px; padding: 0 18px; font-size: .9rem; }
.ntk .order-list { display: flex; flex-direction: column; gap: 10px; }
.ntk .order-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 14px 16px; background: #fff;
  border: 1px solid var(--n-border); border-radius: var(--n-radius-md); transition: border-color .15s, box-shadow .15s;
}
.ntk .order-row:hover { border-color: var(--n-border-strong); box-shadow: var(--n-shadow); }
.ntk .order-row a { text-decoration: none; }
.ntk .order-sum { margin-left: auto; font-weight: 700; color: var(--n-text); white-space: nowrap; }

/* ---------- Страница результата (заказ оформлен) ---------- */
html body.ntk .ntk-result { text-align: center; padding: 40px 32px !important; }
.ntk .ntk-result-icon { display: block; margin-bottom: 14px; font-size: 3.6rem; color: var(--n-green); }
.ntk .ntk-result .section-title { display: inline-block; text-align: left; }
.ntk .ntk-result p { margin: 0 0 8px; }
.ntk .ntk-result-lead { font-size: 1.15rem; }

/* =====================================================================
   Адаптив
   ===================================================================== */
@media (max-width: 1200px) {
  .ntk .sh-tagline { display: none; }
  html body.ntk .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ntk .mn-links a { padding: 0 13px; }
  .ntk .sf-grid { grid-template-columns: repeat(3, 1fr); }
  .ntk .sf-brand { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
  .ntk .sf-tagline { margin: 0; }
}

@media (max-width: 960px) {
  .ntk .container { padding: 0 14px; }
  .ntk .site-header { padding-top: 12px; }
  .ntk .sh-top { flex-wrap: wrap; gap: 12px 14px; padding-bottom: 12px; }
  .ntk .sh-logo-img { width: 104px; }
  .ntk .sh-contacts { margin-left: auto; }
  .ntk .sh-contacts-icon { display: none; }
  .ntk .sh-phones .phone-link { font-size: .9rem; }
  .ntk .sh-search { order: 5; flex-basis: 100%; max-width: none; }
  .ntk .sh-cart { padding: 8px 12px; }
  .ntk .sh-cart-text small { display: none; }

  .ntk .main-nav { flex-direction: column; min-height: 0; }
  .ntk .mn-catalog { width: 100%; min-height: 52px; border-right: none; border-bottom: 1px solid rgba(255, 255, 255, .14); }
  .ntk .mn-catalog-arrow { transform: rotate(90deg); transition: transform .2s; }
  .catalog-open.ntk .mn-catalog-arrow { transform: rotate(-90deg); }
  .ntk .mn-links { flex-wrap: nowrap; overflow-x: auto; padding: 0 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .ntk .mn-links::-webkit-scrollbar { display: none; }
  .ntk .mn-links a { min-height: 46px; padding: 0 14px; white-space: nowrap; }

  .ntk .main-layout { flex-direction: column; gap: 18px; margin-top: 14px; }
  html body.ntk .catalog-side { width: 100%; min-width: 0; order: 2; }
  .ntk .right-column { width: 100%; order: 1; }
  /* Каталог — раскрывающийся список: по кнопке «Каталог товаров» он переносится наверх */
  .ntk-full .catalog-side .catalog-list { display: none; }
  .catalog-open.ntk-full .catalog-side { order: 0; }
  .catalog-open.ntk-full .catalog-side .catalog-list { display: block; }
  html body.ntk .catalog-title { border-radius: var(--n-radius) !important; border-bottom: 1px solid var(--n-border); min-height: 52px; }
  .catalog-open.ntk .catalog-title { border-radius: var(--n-radius) var(--n-radius) 0 0 !important; border-bottom: none; }
  .ntk .catalog-list .submenu { position: static; display: none; box-shadow: none; border: none; background: var(--n-soft); margin: 0 0 6px 36px; min-width: 0; }
  .ntk .catalog-list .has-submenu:hover .submenu { display: none; }
  .ntk .catalog-list .has-submenu.is-open .submenu { display: block; }
  .ntk .catalog-list .has-submenu.is-open .sub-arrow { transform: rotate(90deg); }
  html body.ntk .catalog-list li a { min-height: 46px; }
  .ntk .catalog-list .sub-arrow { padding: 12px; margin: -12px -6px -12px auto; }

  .ntk .benefits-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0; }
  .ntk .bb-item:nth-child(3) { border-left: none; }
  .ntk .bb-item:nth-child(n+3) { border-top: 1px solid var(--n-border); }
  html body.ntk .product-grid, .ntk .catalog-content .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  html body.ntk .slider-arrow { opacity: 1; width: 36px; height: 36px; }
  html body.ntk .catalog-content, html body.ntk .news-full, html body.ntk .product-detail, html body.ntk .feedback-form-block, html body.ntk .review-form, html body.ntk .ntk-card { padding: 20px 18px !important; }
  .ntk .product-gallery { width: 100% !important; }
  html body.ntk .product-detail { flex-direction: column; gap: 20px; }
  .ntk .product-info { min-width: 0; }
  html body.ntk .tab-content.active { padding: 20px 18px; }
  .ntk .checkout-grid { grid-template-columns: 1fr; gap: 8px; }
  .ntk .checkout-side { position: static; }
  .ntk .all-cats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body.ntk .section-title { font-size: 1.3rem !important; }
  .ntk .review-card { flex-direction: column; }
  .ntk .review-product-preview { width: 100%; flex-direction: row; text-align: left; }
  .ntk .sf-grid { grid-template-columns: 1fr 1fr; gap: 24px 16px; }
  .ntk .sf-contacts { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  html body.ntk { font-size: 14.5px; }
  .ntk .sh-phones .phone-link { font-size: .82rem; }
  .ntk .sh-phones .message-link { font-size: .78rem; }
  .ntk .sh-cart-text { display: none; }
  .ntk .sh-cart { padding: 10px 14px; }
  html body.ntk .banner-slider { aspect-ratio: 16 / 9; border-radius: var(--n-radius-md) !important; }
  .ntk .bb-item { padding: 12px 8px; gap: 6px; font-size: .8rem; }
  .ntk .bb-item i { font-size: 1.3rem; width: 26px; }
  html body.ntk .product-card { padding: 10px 10px 12px !important; border-radius: 14px !important; }
  html body.ntk .product-name { font-size: .85rem !important; }
  html body.ntk .product-desc { display: none; }
  html body.ntk .product-price { font-size: 1.05rem !important; }
  html body.ntk .product-bottom { flex-direction: column; align-items: stretch; }
  html body.ntk .add-to-cart-btn { width: 100%; min-height: 42px; }
  .ntk .section-more { font-size: .85rem; }
  html body.ntk .subscribe-block { padding: 18px !important; }
  .ntk .subscribe-icon { display: none; }
  html body.ntk .subscribe-form { flex-direction: column; min-width: 0; }
  html body.ntk .subscribe-btn { width: 100%; }
  .ntk :is(.cat-desc, .news-text, .tab-content, .page-text) { font-size: .95rem; }
  .ntk .sf-grid { grid-template-columns: 1fr 1fr; }
  .ntk .sf-bottom { flex-direction: column; }
  /* Товар, каталог, формы, кабинет на телефоне */
  .ntk .news-full h1, .ntk .product-info h1 { font-size: 1.3rem; }
  .ntk .specs { grid-template-columns: 1fr; }
  .ntk .price-block { font-size: 1.6rem; }
  .ntk .actions .btn-cart { flex: 1; }
  .ntk .subcat-grid { grid-template-columns: 1fr; }
  .ntk .all-cats-grid { gap: 10px; }
  html body.ntk .all-cat-card { min-height: 140px; padding: 16px 10px; }
  html body.ntk .news-list-item { padding: 16px 18px; }
  .ntk .ntk-dl { grid-template-columns: 1fr; gap: 2px; }
  .ntk .ntk-dl dd { margin-bottom: 8px; }
  .ntk .order-sum { margin-left: 0; }
  .ntk .ntk-actions .ntk-btn, .ntk .account-links { width: 100%; }
  .ntk .account-links .ntk-btn { flex: 1; }
  html body.ntk .ntk-result { padding: 28px 18px !important; }
  .ntk .cart-total { text-align: left; }
  html body.ntk .btn-submit { width: 100%; }
  /* Корзина на телефоне: каждый товар — блок, без горизонтальной прокрутки */
  .ntk #cartContent .cart-table, .ntk #cartContent .cart-table tbody { display: block; white-space: normal; overflow: visible; }
  .ntk #cartContent .cart-table thead { display: none; }
  .ntk #cartContent .cart-table tr { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 6px 12px; padding: 14px 0; border-bottom: 1px solid var(--n-border); }
  .ntk #cartContent .cart-table tr:last-child { border-bottom: none; }
  .ntk #cartContent .cart-table td { padding: 0; border: none; white-space: normal; font-size: .92rem; }
  .ntk #cartContent .cart-table td:nth-child(1) { grid-column: 1 / -1; min-width: 0; }
  .ntk #cartContent .cart-table td:nth-child(2) { grid-column: 1 / -1; color: var(--n-muted); font-size: .85rem; }
  .ntk #cartContent .cart-table td:nth-child(5) { justify-self: end; }
  .ntk #cartContent .cart-qty { width: 76px; padding: 0 8px; }
}

/* ---------- Доработки после проверки ---------- */
/* Карточка: в узкой карточке цена и кнопка друг под другом, в широкой — в строку */
html body.ntk .product-card { container-type: inline-size; }
html body.ntk .product-bottom { flex-wrap: nowrap; }
@container (max-width: 230px) {
  html body.ntk .product-bottom { flex-direction: column; align-items: stretch; gap: 10px; }
  html body.ntk .add-to-cart-btn { width: 100%; }
}
/* Отзывы: компактная колонка товара */
.ntk .review-product-preview { width: 130px; }
.ntk .review-product-name-mini { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.35; }
.ntk .review-text { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }

@media (max-width: 960px) {
  /* Шапка телефона: логотип · контакты · корзина, ниже поиск */
  .ntk .sh-top { display: grid; grid-template-columns: auto 1fr auto; grid-template-areas: "logo contacts cart" "search search search"; align-items: center; gap: 10px 12px; }
  .ntk .sh-logo { grid-area: logo; }
  .ntk .sh-contacts { grid-area: contacts; margin: 0; justify-self: end; }
  .ntk .sh-cart { grid-area: cart; }
  .ntk .sh-search { grid-area: search; }
  .ntk .sh-tagline { display: none; }
  .ntk .sh-phones { align-items: flex-end; text-align: right; }
}
@media (max-width: 560px) {
  .ntk .sh-logo-img { width: 84px; }
  .ntk .sh-cart { padding: 9px 11px; }
  .ntk .sh-cart-icon { font-size: 1.3rem; }
  .ntk .sh-search .search-input { height: 46px; }
  .ntk .review-product-preview { width: 100%; }
}
@media (max-width: 960px) { .ntk .sh-search { width: 100%; max-width: none; margin: 0; } }

/* ---------- Компактнее страница, «едущая» левая колонка (как на старом сайте) ---------- */
@media (min-width: 961px) {
  html body.ntk .catalog-side { position: sticky; top: var(--ntk-side-top, 20px); align-self: flex-start; }
}
.ntk .right-column { gap: 18px; }
.ntk .section-head { margin-bottom: 12px; }
html body.ntk .product-main-image { aspect-ratio: 4 / 3; padding: 8px; }
.ntk .product-card > a:first-child, .ntk .pc-image { margin-bottom: 10px; }
html body.ntk .product-name { -webkit-line-clamp: 2; min-height: 2.6em; }
html body.ntk .product-desc { -webkit-line-clamp: 2; min-height: 0; margin-bottom: 10px !important; }
/* Отзывы — по 3 в ряд, компактные карточки */
.ntk .reviews-container { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html body.ntk .review-card { flex-direction: column; gap: 10px; padding: 16px !important; }
.ntk .review-text { -webkit-line-clamp: 4; font-size: .88rem; margin-top: 6px; }
.ntk .review-product-link { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .8rem; }
html body.ntk .review-product-preview { width: auto; flex-direction: row; align-items: center; text-align: left; gap: 10px; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--n-border); }
html body.ntk .review-product-img { width: 44px !important; height: 44px !important; padding: 3px; }
.ntk .review-product-info { display: flex; flex: 1; min-width: 0; align-items: center; justify-content: space-between; gap: 8px; }
.ntk .review-product-name-mini { -webkit-line-clamp: 2; font-size: .75rem; }
.ntk .buy-from-review-btn { white-space: nowrap; }
@media (max-width: 960px) { .ntk .reviews-container { grid-template-columns: 1fr; } }

/* ---------- Страницы корзины, заказа и кабинета — с общей левой колонкой каталога ---------- */
.ntk .main-layout > .ntk-page { margin: 0; }
.ntk .main-layout .ntk-card--narrow, .ntk .main-layout .ntk-card--mid { margin: 0; }
@media (max-width: 1200px) {
  .ntk .main-layout .checkout-grid { grid-template-columns: 1fr; gap: 8px; }
  .ntk .main-layout .checkout-side { position: static; }
}
/* ---------- Личный кабинет и заказы ---------- */
.ntk .acc-hello { display: flex; align-items: center; justify-content: space-between; gap: 14px 20px; flex-wrap: wrap; }
.ntk .acc-hello .section-title { margin: 0 0 4px !important; }
.ntk .acc-hello p { margin: 0; }
.ntk .acc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ntk .acc-tile {
  display: flex; align-items: center; gap: 14px; padding: 16px 18px; text-decoration: none; color: var(--n-text);
  background: var(--n-surface); border: 1px solid var(--n-border); border-radius: var(--n-radius); box-shadow: var(--n-shadow);
  transition: box-shadow .2s, border-color .2s, transform .2s;
}
.ntk .acc-tile:hover { box-shadow: var(--n-shadow-hover); border-color: #bcd2f5; transform: translateY(-2px); }
.ntk .acc-tile-icon { width: 46px; height: 46px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--n-blue-soft); color: var(--n-blue); font-size: 1.1rem; }
.ntk .acc-tile b { display: block; color: var(--n-navy); font-size: .98rem; }
.ntk .acc-tile small { display: block; color: var(--n-muted); font-size: .82rem; }
.ntk .acc-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin-bottom: 14px; }
.ntk .acc-card-head .ntk-card-title, .ntk .acc-card-head .section-title { margin: 0 !important; }
.ntk .acc-card-head .ntk-btn { min-height: 38px; padding: 0 16px; font-size: .88rem; }
.ntk .acc-back { margin-top: 0; }
.ntk .order-detail-meta { margin: -6px 0 16px; }

.ntk .order-cards { display: flex; flex-direction: column; gap: 10px; }
.ntk .order-card {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; gap: 8px 18px;
  padding: 14px 16px; background: #fff; border: 1px solid var(--n-border); border-radius: var(--n-radius-md); transition: border-color .15s, box-shadow .15s;
}
.ntk .order-card:hover { border-color: var(--n-border-strong); box-shadow: var(--n-shadow); }
.ntk .order-card-num { font-weight: 700; color: var(--n-navy); font-size: 1rem; }
.ntk .order-card-meta { color: var(--n-muted); font-size: .85rem; }
.ntk .order-card-sum { font-weight: 800; font-size: 1.05rem; color: var(--n-text); white-space: nowrap; }
.ntk .order-card-btn { min-height: 38px; padding: 0 16px; font-size: .88rem; }
.ntk .order-status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; font-size: .8rem; font-weight: 700; white-space: nowrap; }
.ntk .order-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.ntk .order-status.is-new { background: var(--n-blue-soft); color: var(--n-blue); }
.ntk .order-status.is-work { background: #fff4e0; color: #b86e00; }
.ntk .order-status.is-done { background: #e9f7ef; color: #136c3c; }
.ntk .order-status.is-cancel { background: #fdf1f1; color: #b42323; }

.ntk .order-items { display: flex; flex-direction: column; margin: 4px 0 6px; }
.ntk .order-cards .order-items { margin: -4px 0 8px; padding: 0 16px; }
.ntk .order-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 4px 18px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--n-border); }
.ntk .order-item:last-child { border-bottom: none; }
.ntk .order-item-name { font-weight: 600; color: var(--n-navy); overflow-wrap: anywhere; }
.ntk .order-item-calc { color: var(--n-muted); font-size: .88rem; white-space: nowrap; }
.ntk .order-item-sum { font-weight: 700; white-space: nowrap; }
.ntk .checkout-summary-total { font-size: 1rem; color: var(--n-navy); }
.ntk .checkout-side .back-link { margin-top: 0; justify-content: center; }

@media (max-width: 960px) {
  .ntk .acc-grid { grid-template-columns: 1fr; gap: 10px; }
}
@media (max-width: 560px) {
  .ntk .order-card { grid-template-columns: minmax(0, 1fr) auto; }
  .ntk .order-card-status { grid-column: 1; grid-row: 2; }
  .ntk .order-card-sum { grid-column: 2; grid-row: 1; }
  .ntk .order-card-btn { grid-column: 1 / -1; width: 100%; }
  .ntk .order-item { grid-template-columns: minmax(0, 1fr) auto; }
  .ntk .order-item-name { grid-column: 1 / -1; }
  .ntk .acc-hello .ntk-btn, .ntk .acc-card-head .ntk-btn { width: 100%; }
}
/* Баннер слайдера со ссылкой из админки */
.ntk .slide-link { position: relative; z-index: 1; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }

.ntk .ntk-consent { margin-top: 8px; }
.ntk .ntk-consent-label { display: flex; align-items: flex-start; gap: 8px; font-size: 0.9rem; font-weight: 400; line-height: 1.45; color: var(--n-muted); cursor: pointer; }
.ntk .ntk-consent-label input { margin-top: 3px; flex-shrink: 0; }
.ntk .ntk-consent-label a { color: var(--n-blue); }
.ntk .subscribe-form .ntk-consent-label--inline { flex: 1 1 100%; margin: 0; }

/* =====================================================================
   Мобильная версия (телефоны и планшеты до 960px): шапка с выезжающим меню, кнопки количества,
   корзина карточками, галерея товара, крупные области нажатия.
   Блок идёт последним: перекрывает правила выше и остатки старого styles.css.
   ===================================================================== */

/* ---------- На всех ширинах ---------- */
/* Кнопка поиска: старый styles.css сдвигал её на полвысоты вверх — ставим по центру поля */
.ntk .sh-search .search-btn { top: 50%; transform: translateY(-50%); }
/* Баннеры главной сняты в пропорции 3:1 — слайд той же пропорции показывает их целиком, без размытых полей.
   Точки переключения стоят под картинкой на своей полосе: поверх картинки они закрывали бы её нижний край. */
html body.ntk .banner-slider { aspect-ratio: auto; padding-bottom: 28px; }
html body.ntk .banner-slider:has(.slider-dots[hidden]) { padding-bottom: 0; } /* баннер один — точек и полосы нет */
.ntk .slides-container { height: auto; }
.ntk .slide { aspect-ratio: 3 / 1; height: auto; }
.ntk .slider-dots { bottom: 5px; background: none; backdrop-filter: none; }
html body.ntk .slider-arrow { top: calc(50% - 14px); }
html body.ntk .banner-slider:has(.slider-dots[hidden]) .slider-arrow { top: 50%; }
/* Разделы каталога и поиск: старый styles.css на узком экране выстраивал товары в один столбец */
html body.ntk .catalog-content .product-grid { display: grid !important; }
/* Суммы не рвутся посреди числа (в итогах заказа «4 080 000 ₽» распадалось на три строки) */
.ntk .checkout-summary-row span { min-width: 0; }
.ntk .checkout-summary-row b { flex-shrink: 0; white-space: nowrap; }
/* Согласие на обработку данных: текст со ссылкой идёт обычной строкой рядом с галочкой (во flex ссылка уезжала в отдельную колонку) */
.ntk .ntk-consent-label { display: block; position: relative; padding-left: 30px; }
/* размеры галочки — с !important: правила полей формы заказа в старом styles.css растягивали её на всю ширину */
.ntk .ntk-consent-label input { position: absolute; left: 0; top: 1px; width: 20px !important; height: 20px; min-height: 0; margin: 0; padding: 0 !important; accent-color: var(--n-blue); }
/* Тексты из админки. Вставленный код (виджет Яндекс.Карт) приносит position:absolute: без своей обёртки такие
   элементы уезжали на шапку сайта, поэтому в текстах они стоят в обычном потоке, а подписи карт скрыты. */
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) [style*="position:absolute" i],
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) [style*="position: absolute" i] { position: static !important; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) a[href*="yandex.ru/maps"][style*="absolute" i] { display: none !important; }
/* Таблицы в текстах не рвут слова посреди: узкая таблица прокручивается вбок целиком */
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) table { overflow-wrap: normal; word-break: normal; -webkit-overflow-scrolling: touch; }
.ntk :is(.cat-desc, .news-text, .tab-content, .page-text) :is(td, th) { overflow-wrap: break-word; }

/* Корзина: строка товара (на широком экране — как строка таблицы) */
.ntk .cart-list { display: flex; flex-direction: column; }
.ntk .cart-head, .ntk .cart-item { display: grid; grid-template-columns: minmax(0, 1fr) 110px 84px 124px 38px; align-items: center; gap: 0 20px; padding: 12px; }
.ntk .cart-head {
  padding-top: 10px; padding-bottom: 10px; background: var(--n-soft); border-bottom: 1px solid var(--n-border); border-radius: var(--n-radius-sm);
  color: var(--n-muted); font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap;
}
.ntk .cart-item { border-bottom: 1px solid var(--n-border); font-size: .93rem; }
.ntk .cart-item:last-child { border-bottom: none; }
.ntk .cart-item-name { min-width: 0; font-weight: 600; color: var(--n-navy); overflow-wrap: anywhere; }
.ntk .cart-item-name a { color: var(--n-navy); text-decoration: none; }
.ntk .cart-item-name a:hover { color: var(--n-blue); }
.ntk .cart-item-price, .ntk .cart-item-sum { white-space: nowrap; }
.ntk .cart-item-price span { display: none; }
.ntk .cart-item-sum { font-weight: 700; }
/* Кнопки [−] и [+] у количества появляются на телефоне и сенсорном экране (см. ниже) */
.ntk .qty-stepper { display: inline-flex; align-items: center; }
.ntk .qty-btn { display: none; }
/* Фото товара: счётчик «2 / 8» при листании пальцем */
.ntk .main-image-box { position: relative; }
.ntk .pd-gallery-count { display: none; }
/* Меню телефона и его кнопка на широком экране не нужны */
.ntk .sh-menu-btn, .ntk .ntk-menu, .ntk .ntk-menu-backdrop { display: none; }

/* На сенсорном экране «наведение» залипает после касания — увеличение фото по наведению там отключаем */
@media (hover: none) {
  .ntk .main-image-box { cursor: default; }
  .ntk .main-image-box:hover img { transform: none; }
}

/* ---------- Телефон и сенсорный экран: кнопки количества, листание фото ---------- */
@media (max-width: 960px), (pointer: coarse) {
  .ntk .qty-stepper { border: 1px solid var(--n-border-strong); border-radius: 999px; background: #fff; transition: border-color .15s, box-shadow .15s; }
  .ntk .qty-stepper:focus-within { border-color: var(--n-blue); box-shadow: 0 0 0 4px rgba(31, 99, 216, .12); }
  .ntk .qty-btn {
    display: grid; place-items: center; flex-shrink: 0; width: 46px; height: 46px; padding: 0; border: none; border-radius: 50%; background: none;
    color: var(--n-navy); font-size: 1.5rem; font-weight: 500; line-height: 1; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
  }
  .ntk .qty-btn:active:not(:disabled) { background: var(--n-blue-soft); }
  .ntk .qty-btn:disabled { color: var(--n-border-strong); cursor: default; }
  .ntk .qty-stepper input, .ntk .qty-stepper input:focus {
    width: 48px; height: 46px; padding: 0; border: none; border-radius: 0; background: none; box-shadow: none; text-align: center;
    font-weight: 600; -moz-appearance: textfield; appearance: textfield;
  }
  .ntk .qty-stepper input::-webkit-outer-spin-button, .ntk .qty-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
  .ntk .main-image-box.is-swipeable { touch-action: pan-y; }
  .ntk .pd-gallery-count {
    display: block; position: absolute; right: 10px; bottom: 10px; padding: 2px 10px; border-radius: 999px; background: rgba(15, 31, 56, .62);
    color: #fff; font-size: .8rem; font-weight: 600; line-height: 1.6; pointer-events: none;
  }
}

/* ---------- Телефон и планшет ---------- */
@media (max-width: 960px) {
  /* Шапка: [меню] [логотип] [корзина], ниже поиск. Телефоны и ссылки синей полосы — в выезжающем меню */
  .ntk .sh-top { grid-template-columns: 1fr auto 1fr; grid-template-areas: "menu logo cart" "search search search"; }
  .ntk .sh-menu-btn {
    grid-area: menu; justify-self: start; display: inline-flex; align-items: center; gap: 9px; min-height: 46px; padding: 0 14px;
    background: var(--n-surface); border: 1px solid var(--n-border); border-radius: var(--n-radius-md); box-shadow: var(--n-shadow);
    color: var(--n-navy); font-size: .95rem; font-weight: 700; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
  }
  .ntk .sh-menu-btn i { font-size: 1.15rem; }
  .ntk .sh-logo { justify-self: center; }
  .ntk .sh-cart { justify-self: end; width: auto; min-width: 46px; min-height: 46px; justify-content: center; }
  .ntk .sh-contacts, .ntk .mn-links, .ntk .sh-account { display: none; } /* кабинет на телефоне — в выезжающем меню */
  .ntk .mn-catalog { border-bottom: none; }
  .ntk .mn-catalog .fa-bars::before { content: "\f009"; } /* у кнопки каталога — значок «плитка»: три полоски теперь у кнопки «Меню» */
  .ntk .sh-search .search-input { height: 48px; }
  .ntk .sh-search .search-btn { right: 2px; width: 44px; height: 44px; }

  .ntk .ntk-menu-backdrop {
    display: block; position: fixed; inset: 0; z-index: 1200; background: rgba(15, 31, 56, .5);
    opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility 0s linear .25s; touch-action: none;
  }
  .ntk .ntk-menu {
    display: flex; flex-direction: column; position: fixed; top: 0; bottom: 0; left: 0; z-index: 1210; width: min(86vw, 340px);
    padding-bottom: env(safe-area-inset-bottom, 0px); background: var(--n-surface); box-shadow: 8px 0 32px rgba(15, 47, 95, .22);
    overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; outline: none;
    transform: translateX(-102%); visibility: hidden; transition: transform .25s ease, visibility 0s linear .25s;
  }
  .ntk.ntk-menu-open .ntk-menu-backdrop { opacity: 1; visibility: visible; transition: opacity .25s ease; }
  .ntk.ntk-menu-open .ntk-menu { transform: none; visibility: visible; transition: transform .25s ease; }
  html body.ntk.ntk-menu-open { overflow: hidden; }
  .ntk .ntk-menu-head {
    position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 12px 10px 20px; background: var(--n-surface); border-bottom: 1px solid var(--n-border);
  }
  .ntk .ntk-menu-title { font-size: 1.15rem; font-weight: 800; color: var(--n-navy); }
  .ntk .ntk-menu-close {
    width: 46px; height: 46px; display: grid; place-items: center; flex-shrink: 0; border: none; border-radius: 50%;
    background: var(--n-soft); color: var(--n-navy); font-size: 1.15rem; cursor: pointer; touch-action: manipulation;
  }
  .ntk .ntk-menu-nav { display: flex; flex-direction: column; gap: 2px; padding: 10px; }
  .ntk .ntk-menu-nav a {
    display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 0 14px; border-radius: var(--n-radius-sm);
    color: var(--n-text); font-size: 1.02rem; font-weight: 600; text-decoration: none;
  }
  .ntk .ntk-menu-nav a:active { background: var(--n-soft); }
  .ntk .ntk-menu-nav a.is-active { background: var(--n-blue-soft); color: var(--n-blue); }
  .ntk .ntk-menu-nav a i { width: 22px; text-align: center; color: var(--n-blue); }
  .ntk .ntk-menu-nav a.ntk-menu-catalog { margin-bottom: 6px; background: var(--n-navy); color: #fff; }
  .ntk .ntk-menu-nav a.ntk-menu-catalog i { color: #fff; }
  .ntk .ntk-menu-nav a.ntk-menu-account { margin-top: 6px; border-top: 1px solid var(--n-border); border-radius: 0 0 var(--n-radius-sm) var(--n-radius-sm); }
  .ntk .ntk-menu-contacts { display: flex; flex-direction: column; margin-top: auto; padding: 12px 24px 18px; background: var(--n-soft); border-top: 1px solid var(--n-border); }
  .ntk .ntk-menu-contacts a { display: flex; align-items: center; gap: 12px; min-height: 48px; text-decoration: none; }
  .ntk .ntk-menu-contacts a i { width: 22px; text-align: center; color: var(--n-blue); }
  .ntk .ntk-menu-phone { color: var(--n-navy); font-size: 1.12rem; font-weight: 700; white-space: nowrap; }
  .ntk .ntk-menu-write { color: var(--n-blue); font-weight: 600; }

  /* Поля ввода — 16px: при меньшем шрифте iPhone увеличивает страницу, когда поле получает фокус */
  .ntk input:not([type=checkbox]):not([type=radio]):not([type=hidden]), .ntk select, .ntk textarea { font-size: 16px !important; }

  /* Области нажатия не меньше 44px: под палец */
  /* Слайдер: стрелки и точки стоят на полосе под баннером — на маленьком экране картинку ничто не закрывает */
  html body.ntk .banner-slider { padding-bottom: 44px; }
  html body.ntk .slider-arrow, html body.ntk .slider-arrow:hover {
    top: auto; bottom: 0; width: 44px; height: 44px; transform: none; background: none !important; box-shadow: none; color: #fff; opacity: 1;
  }
  .ntk .slider-arrow.prev { left: 4px; }
  .ntk .slider-arrow.next { right: 4px; }
  .ntk .slider-dots { bottom: 13px; }
  html body.ntk .dot { position: relative; }
  html body.ntk .dot::before { content: ""; position: absolute; top: -12px; bottom: -12px; left: -3px; right: -3px; } /* точка остаётся маленькой, нажимается область вокруг */
  .ntk .section-more, .ntk .all-news-link, .ntk .back-link { min-height: 44px; display: inline-flex; align-items: center; }
  .ntk .back-link { margin-top: 12px; }
  .ntk .all-news-link { margin-top: 4px; }
  .ntk .news-item { padding: 4px 0 8px !important; }
  .ntk .news-link { display: flex; align-items: center; min-height: 44px; }
  .ntk .poll-option { min-height: 44px; }
  html body.ntk .add-to-cart-btn { min-height: 44px; touch-action: manipulation; }
  html body.ntk .partner-link { min-height: 44px; }
  .ntk .pl-sort a, .ntk .pl-tabs a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; }
  .ntk .ntk-pager a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--n-border); border-radius: 999px; background: var(--n-soft); }
  .ntk .news-list-item h3 a { display: flex; align-items: center; min-height: 44px; }
  .ntk .stars-input { gap: 0; }
  .ntk .stars-input span { display: grid; place-items: center; width: 44px; height: 44px; }
  .ntk .review-product-link { display: flex; align-items: center; min-height: 44px; overflow: visible; -webkit-line-clamp: unset; }
  .ntk .buy-from-review-btn { min-height: 44px; padding: 0 16px !important; touch-action: manipulation; }
  .ntk .cart-remove { width: 44px; height: 44px; }
  .ntk .ntk-form-note a, .ntk .ntk-result a:not(.ntk-btn) { display: inline-block; padding: 12px 4px; }
  .ntk .order-card-btn, .ntk .acc-card-head .ntk-btn, .ntk .account-links .ntk-btn { min-height: 44px; }
  .ntk .ntk-consent-label { min-height: 44px; padding-top: 4px; padding-bottom: 4px; }
  .ntk .ntk-consent-label input { top: 5px; }
  /* Подвал */
  .ntk .sf-links { gap: 0; }
  .ntk .sf-links a { display: flex; align-items: center; min-height: 44px; }
  .ntk .sf-contact-list { gap: 4px; }
  .ntk .sf-contact-list li { align-items: center; min-height: 44px; }
  .ntk .sf-contact-list i { margin-top: 0; }
  .ntk .sf-contact-list a { display: flex; align-items: center; min-height: 44px; }
  .ntk .sf-account { align-items: center; margin-top: 4px; }
  .ntk .sf-account a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px; }
  .ntk .sf-bottom { gap: 0 12px; padding-top: 10px; }
  .ntk .sf-bottom a { display: inline-flex; align-items: center; min-height: 44px; }
  .ntk .sf-bottom span { padding: 10px 0; }
  html body.ntk .sf-socials .social-link { width: 44px; height: 44px; }

  /* Корзина: каждый товар — карточка; название, цена за штуку, [−] количество [+], сумма, удалить */
  .ntk .cart-head { display: none; }
  .ntk .cart-list { gap: 10px; }
  .ntk .cart-item, .ntk .cart-item:last-child {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px;
    padding: 14px; background: var(--n-soft); border: 1px solid var(--n-border); border-radius: var(--n-radius-md);
  }
  .ntk .cart-item-name { order: 1; flex: 1 1 0; align-self: flex-start; font-size: .98rem; line-height: 1.35; }
  .ntk .cart-item-name a { display: block; padding: 4px 0; }
  .ntk .cart-remove { order: 2; flex: none; align-self: flex-start; margin: -4px -4px 0 0; }
  .ntk .cart-item-price { order: 3; flex: 0 0 100%; color: var(--n-muted); font-size: .88rem; }
  .ntk .cart-item-price span { display: inline; }
  .ntk .cart-item-qty { order: 4; flex: none; margin-top: 6px; }
  /* Большая сумма рядом с кнопками количества не помещается — тогда она переходит на свою строку, справа */
  .ntk .cart-item-sum { order: 5; flex: 1 1 auto; margin-top: 6px; text-align: right; font-size: 1.1rem; font-weight: 800; color: var(--n-text); }
  .ntk .cart-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; text-align: left; }

  /* Видео в текстах и на вкладке товара — во всю ширину в пропорции 16:9 */
  .ntk .pd-video-frame,
  .ntk :is(.cat-desc, .news-text, .tab-content, .page-text) iframe:is([src*="youtube"], [src*="youtu.be"], [src*="rutube"], [src*="vk.com/video"], [src*="vkvideo"], [src*="vimeo"]) {
    width: 100%; height: auto; aspect-ratio: 16 / 9;
  }
}

/* Подписка: до 768px старый styles.css ставит форму в столбик, и поле сжималось до высоты строки */
@media (max-width: 768px) {
  html body.ntk .subscribe-input { flex: none; width: 100%; height: 48px; }
  .ntk .subscribe-form .ntk-consent-label--inline { flex: none; }
}

/* ---------- Телефон ---------- */
@media (max-width: 560px) {
  html body.ntk .catalog-content { padding: 18px 12px !important; }
}
/* Самые узкие экраны (320px): у кнопки меню остаётся только значок, иначе логотипу не хватает места */
@media (max-width: 350px) {
  .ntk .sh-menu-btn { width: 46px; padding: 0; justify-content: center; }
  .ntk .sh-menu-btn span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .ntk .ntk-menu, .ntk .ntk-menu-backdrop, .ntk.ntk-menu-open .ntk-menu, .ntk.ntk-menu-open .ntk-menu-backdrop { transition: none; }
}