:root {
  --primary: #e53935;
  --primary-dark: #c62828;
  --primary-orange: #ff6f3c;
  --btn-gradient: #e53935;
  --btn-gradient-hover: #c62828;
  --text: #1f2937;
  --text-gray: #6b7280;
  --text-muted: #9ca3af;
  --gray-dark: #4c4c4c;
  --bg: #f7f8f6;
  --bg2: #edeeea;
  --surface: #ffffff;
  --error: #d32f2f;
  --green: #4caf50;
  --success: #43a047;
  --red: #ed254e;
  --border: #e5e7eb;
  --warning: #f59e0b;
  --round: 10px;
  --round-sm: 5px;
  --round-xs: 3px;
  --container: 1400px;
  --shadow: 0 2px 2px rgba(0, 0, 0, 0.13);
  --shadow-header: 0 2px 1px rgba(0, 0, 0, 0.13);
  --font: "Roboto", system-ui, sans-serif;
  --font-slogan: CyrillicOld, "Marck Script", "Segoe Script", cursive;
}

@font-face {
  font-family: CyrillicOld;
  src: url("../../fonts/CyrillicOldBold.woff") format("woff"),
       url("../../fonts/CyrillicOldBold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.4;
  overflow-x: hidden;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select {
  font: inherit;
}

button {
  background: none;
  border: none;
  cursor: pointer;
}

ul {
  list-style: none;
}

[hidden] {
  display: none !important;
}

.container {
  width: min(var(--container), calc(100% - 40px));
  margin: 0 auto;
}

body.is-locked {
  overflow: hidden;
}

/* Icons */
.icon {
  position: relative;
  display: inline-block;
  overflow: hidden;
  flex-shrink: 0;
}

.icon img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.icon--24 { width: 24px; height: 24px; }
.icon--26 { width: 26px; height: 26px; }
.icon--20 { width: 20px; height: 20px; }
.icon--18 { width: 18px; height: 18px; }
.icon--16 { width: 16px; height: 16px; }
.icon--32 { width: 32px; height: 32px; }
.icon--21 { width: 21px; height: 21px; }
.icon--29 { width: 29px; height: 29px; }

.icon--white img {
  filter: none;
}

.icon-grid {
  position: relative;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.icon-grid img {
  position: absolute;
  width: 5.5px;
  height: 5.5px;
  object-fit: contain;
}

.icon-grid img:nth-child(1) { top: 1.5px; left: 1.5px; }
.icon-grid img:nth-child(2) { top: 1.5px; right: 1.5px; }
.icon-grid img:nth-child(3) { bottom: 1.5px; right: 1.5px; }
.icon-grid img:nth-child(4) { bottom: 1.5px; left: 1.5px; }

.icon-search {
  position: relative;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.icon-search img {
  position: absolute;
  object-fit: contain;
}

.icon-search .s-circle {
  inset: 8.33% 16.67% 16.67% 8.33%;
  width: auto;
  height: auto;
}

.icon-search .s-handle {
  inset: 78% 8.35% 8.32% 78.46%;
  width: auto;
  height: auto;
}

.icon-arrow {
  position: relative;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.icon-arrow img {
  position: absolute;
  object-fit: contain;
}

.icon-arrow .a-head {
  inset: 24.71% 14.58% 24.71% 60.12%;
  width: auto;
  height: auto;
}

.icon-arrow .a-line {
  left: 14.58%;
  right: 15.29%;
  top: 50%;
  height: 2px;
  width: auto;
  transform: translateY(-50%);
}

.icon-arrow.is-left {
  transform: rotate(180deg);
}

.icon-close {
  position: relative;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.icon-close img {
  position: absolute;
  inset: 12.5%;
  width: auto;
  height: auto;
}

.icon-close img:last-child {
  transform: rotate(90deg);
}

.icon-phone {
  position: relative;
  width: 16px;
  height: 16px;
}

.icon-phone img {
  position: absolute;
  object-fit: contain;
}

.icon-phone .p1 { inset: 8.33% 8.46% 8.33% 8.33%; width: auto; height: auto; }
.icon-phone .p2 { inset: 22.92% 22.92% 62.5% 62.5%; width: auto; height: auto; }
.icon-phone .p3 { inset: 8.33% 8.33% 62.5% 62.5%; width: auto; height: auto; }

.icon-loc {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  width: 18px;
  height: 22px;
  flex-shrink: 0;
}

.icon-loc img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  max-width: none;
}

.icon-check {
  position: relative;
  width: 16px;
  height: 16px;
}

.icon-check img {
  position: absolute;
  object-fit: contain;
}

.icon-check .c1 { inset: 8.33%; width: auto; height: auto; }
.icon-check .c2 { inset: 38.21% 32.29%; width: auto; height: auto; }

.icon-hamburger {
  width: 24px;
  height: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0;
  flex-shrink: 0;
}

.icon-hamburger span {
  display: block !important;
  height: 2px;
  width: 100%;
  background: #1f2937;
  border-radius: 2px;
  transition: transform 0.2s, opacity 0.2s, width 0.2s;
}

.icon-hamburger span:nth-child(3) {
  width: 66%;
}

.icon-hamburger.is-open span:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}

.icon-hamburger.is-open span:nth-child(2) {
  opacity: 0;
}

.icon-hamburger.is-open span:nth-child(3) {
  width: 100%;
  transform: translateY(-8px) rotate(-45deg);
}

.nav-icon {
  position: relative;
  width: 24px;
  height: 24px;
}

.nav-icon img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.nav-icon.is-active img {
  filter: invert(27%) sepia(89%) saturate(2476%) hue-rotate(346deg) brightness(94%) contrast(92%);
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: var(--btn-gradient);
  color: #fff;
  border-radius: var(--round-sm);
  font-weight: 500;
  font-size: 14px;
  padding: 12px;
  transition: filter 0.15s;
  white-space: nowrap;
}

.btn:hover {
  background: var(--btn-gradient-hover);
}

.btn.js-add-cart:not(:disabled),
.btn.card-qty__cart {
  background: var(--primary);
}

.btn.js-add-cart:not(:disabled):hover,
.btn.card-qty__cart:hover {
  background: var(--primary-dark);
}

.btn:disabled {
  background: var(--bg2);
  color: var(--text-muted);
  cursor: not-allowed;
}

.btn:disabled:hover {
  background: var(--bg2);
}

.btn--lg {
  min-width: 180px;
  height: 50px;
  padding: 12px 20px;
  font-size: 16px;
}

.btn--outline {
  background: transparent;
  color: var(--text-gray);
  border: 1px solid var(--text-muted);
  padding: 11px 25px;
  font-weight: 400;
  font-size: 15px;
  height: 40px;
}

.btn--outline:hover {
  background: var(--surface);
  color: var(--text);
}

.btn--catalog {
  height: 50px;
  padding: 12px 20px;
  font-size: 16px;
  flex-shrink: 0;
}

.btn--full {
  width: 100%;
}

.btn--unavailable,
.btn--unavailable:hover {
  background: transparent;
  color: var(--primary);
  border: 1px solid var(--primary);
  font-weight: 400;
  padding: 11px;
  filter: none;
}

.btn--oos,
.btn--oos:hover,
.btn--oos:disabled,
.btn--oos:disabled:hover {
  background: var(--border);
  color: var(--text);
  cursor: default;
  font-weight: 400;
  filter: none;
}

.card > .btn,
.card > .card__actions {
  flex-shrink: 0;
}

.card__actions {
  display: flex;
  width: 100%;
}

.card-qty {
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
}

.card-qty__stepper {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 0;
  min-height: 40px;
  padding: 8px 9px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--round-sm);
}

.card-qty__stepper span[data-card-qty-value] {
  flex: 1;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
}

.card-qty__stepper button {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background: none;
}

.card-qty__cart {
  flex-shrink: 0;
  width: 40px;
  min-width: 40px;
  height: 40px;
  padding: 8px;
}

/* Header */
.header-mobile,
.bottom-nav,
.mobile-only {
  display: none;
}

.site-header {
  background: var(--surface);
  box-shadow: var(--shadow-header);
  position: relative;
  z-index: 40;
}

.topbar {
  display: flex;
  align-items: center;
  gap: 40px;
  padding: 15px 0;
}

.topbar__links {
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  gap: 12px 28px;
  font-size: 14px;
  color: var(--text-gray);
  white-space: nowrap;
}

.topbar__links a:hover,
.topbar__links a.is-active {
  color: var(--primary);
}

.topbar__meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 24px;
  flex: 1 1 auto;
  min-width: 0;
  max-width: max-content;
  margin-left: auto;
  font-size: 14px;
  color: var(--text);
}

.topbar__item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.topbar__meta > a.topbar__item {
  flex-shrink: 0;
  white-space: nowrap;
}

.topbar__item--addr {
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-end;
  text-align: right;
}

.topbar__item--addr .icon-loc {
  flex-shrink: 0;
}

.topbar__addr {
  display: block;
  min-width: 0;
  white-space: normal;
  text-align: right;
  line-height: 1.35;
}

.topbar__addr strong {
  font-weight: 700;
  margin-right: 6px;
}

.topbar__addr span {
  font-weight: 400;
}

.header-rule {
  height: 1px;
  background: #e5e7eb;
  width: min(var(--container), calc(100% - 40px));
  margin: 0 auto;
}

.header-main {
  display: flex;
  align-items: center;
  gap: 40px;
  padding: 10px 0;
}

.logo {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 180px;
  height: 70px;
  flex-shrink: 0;
}

.logo__mark {
  width: 81px;
  height: 66px;
  object-fit: contain;
}

.logo__slogan {
  font-family: var(--font-slogan);
  color: var(--primary);
  font-size: 15px;
  line-height: 14px;
  font-weight: 700;
}

.search-line {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 1;
  min-width: 0;
}

.search {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  height: 50px;
  background: var(--btn-gradient);
  border-radius: var(--round-sm);
  padding: 2px 0 2px 2px;
  overflow: hidden;
}

.search__field {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  height: 100%;
  background: #fff;
  border-radius: var(--round-xs);
}

.search__loupe {
  display: none;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-left: 12px;
  color: var(--text-gray);
}

.search__loupe img {
  width: 18px;
  height: 18px;
}

.search input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  border-radius: var(--round-xs);
  padding: 0 15px;
  font-weight: 300;
  font-size: 15px;
  color: var(--text);
}

.search input::placeholder {
  color: var(--gray-dark);
}

.search__submit {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #fff;
  padding: 0 20px;
  height: 100%;
  font-size: 16px;
  white-space: nowrap;
}

.search__submit-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.search-box {
  position: relative;
  flex: 1;
  min-width: 0;
  z-index: 60;
}

.search-box .search {
  width: 100%;
  flex: none;
}

.search-suggest {
  position: absolute;
  z-index: 60;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border-radius: var(--round-sm);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
  max-height: min(70vh, 520px);
  overflow: hidden;
  padding: 6px 0 0;
}

.search-suggest__list {
  overflow: auto;
  min-height: 0;
  padding-bottom: 6px;
}

.search-suggest__item,
.search-suggest__more {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  color: var(--text);
}

.search-suggest__item:hover,
.search-suggest__item.is-active,
.search-suggest__more:hover,
.search-suggest__more.is-active {
  background: var(--bg2);
}

.search-suggest__img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 4px;
  background: var(--bg2);
}

.search-suggest__img--empty {
  display: block;
}

.search-suggest__title {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.35;
}

.search-suggest__price {
  flex-shrink: 0;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
}

.search-suggest__more {
  flex-shrink: 0;
  color: var(--primary);
  font-size: 14px;
  border-top: 1px solid var(--border);
  background: var(--surface);
}

.search-suggest__empty {
  padding: 12px 14px;
  color: var(--text-gray);
  font-size: 14px;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-shrink: 0;
}

.header-action {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  font-size: 15px;
  font-weight: 300;
  color: var(--text);
}

.header-action .icon-loc {
  width: 26px;
  height: 26px;
}

.header-action:hover {
  color: var(--primary);
}

.badge {
  position: absolute;
  top: -5px;
  left: 30px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  background: var(--primary);
  color: #fff;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  text-align: center;
}

/* Catalog overlay */
.catalog-overlay {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  background: var(--surface);
  border-radius: 0 0 var(--round) var(--round);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.25);
  padding: 36px 0 40px;
  z-index: 50;
}

.catalog-overlay.is-open {
  display: block;
}

.catalog-overlay__close {
  position: absolute;
  top: 16px;
  right: 20px;
  z-index: 2;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.catalog-overlay__close img {
  width: 22px;
  height: 22px;
}

@media (min-width: 901px) {
  .catalog-overlay__close {
    display: none;
  }
}

.catalog-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 30;
}

.catalog-backdrop.is-open {
  display: block;
}

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px 20px;
}

.catalog-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.catalog-item img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.catalog-item span {
  font-size: 16px;
  line-height: 1.2;
}

.catalog-item:hover span {
  color: var(--primary);
}

body.catalog-open .btn--catalog .icon-grid {
  display: none;
}

body.catalog-open .btn--catalog .icon-close {
  display: block;
}

body.catalog-open .site-header,
body.menu-open .site-header {
  z-index: 80;
}

.btn--catalog .icon-close {
  display: none;
}

.btn--catalog .icon-close img {
  position: static;
  inset: auto;
  display: block;
  width: 16px;
  height: 16px;
  transform: none;
}

/* Hero */
.hero {
  position: relative;
  width: min(var(--container), calc(100% - 40px));
  margin: 20px auto 0;
  height: 490px;
  border-radius: var(--round);
  overflow: hidden;
}

.hero__track {
  display: flex;
  height: 100%;
  transition: transform 0.45s ease;
}

.hero__slide {
  min-width: 100%;
  height: 100%;
  background: #c9a227;
}

.hero__slide picture,
.hero__slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__nav {
  position: absolute;
  inset: 7px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  z-index: 3;
}

.hero__nav .round-btn {
  pointer-events: auto;
}

.round-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #fff;
  box-shadow: var(--shadow-header);
  display: flex;
  align-items: center;
  justify-content: center;
}

.round-btn:hover {
  background: #f3f4f6;
}

.round-btn__arrow {
  width: 24px;
  height: 24px;
  display: block;
}

.round-btn__arrow.is-left {
  transform: rotate(180deg);
}

.hero__dots {
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  display: flex;
  gap: 5px;
}

.dot {
  position: relative;
  width: 25px;
  height: 10px;
  border-radius: 10px;
  background: var(--bg2);
  border: 0;
}

.dot::before {
  content: "";
  position: absolute;
  inset: -12px -8px;
}

.dot.is-active {
  background: var(--primary);
  border: 2px solid var(--bg2);
}

/* Categories */
.categories {
  width: min(var(--container), calc(100% - 40px));
  margin: 20px auto 0;
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 10px;
}

.cat-card {
  background: var(--surface);
  border-radius: var(--round-sm);
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 15px 10px;
  text-align: center;
}

.cat-card img {
  width: 80px;
  height: 80px;
  object-fit: contain;
}

.cat-card span {
  font-size: 14px;
}

.cat-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

.section-title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
}

.section-tools {
  display: flex;
  align-items: center;
  gap: 12px;
}

.section-arrows {
  display: none;
  gap: 8px;
}

/* Products */
.section {
  width: min(var(--container), calc(100% - 40px));
  margin: 50px auto 0;
}

.carousel {
  position: relative;
}

.carousel__viewport {
  overflow: hidden;
  container-type: inline-size;
}

.carousel__track {
  display: flex;
  gap: 24px;
  transition: transform 0.35s ease;
}

.carousel__prev,
.carousel__next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.carousel__prev { left: -22px; }
.carousel__next { right: -22px; }

.card {
  background: var(--surface);
  border-radius: var(--round);
  box-shadow: var(--shadow);
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  width: 332px;
  min-width: 332px;
  position: relative;
}

.card__photo {
  height: 250px;
  border-radius: var(--round-xs);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
}

.card__photo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.card__body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-width: 0;
}

.card__sku {
  display: flex;
  gap: 5px;
  font-size: 15px;
  color: var(--text-gray);
}

.card__title {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
  min-height: 45px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.card__title a {
  font-weight: 400;
}

.card__price {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: auto;
}

.card__current {
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
}

.card__old {
  font-size: 17px;
  font-weight: 600;
  color: var(--text-muted);
  text-decoration: line-through;
}

.card__discount {
  font-size: 17px;
  font-weight: 600;
  color: var(--primary);
}

.card__weights {
  display: flex;
  gap: 5px;
  font-size: 15px;
  font-weight: 300;
}

.weight {
  padding: 10px;
  border-radius: 4px;
  color: #000;
}

.weight small {
  color: var(--text-gray);
}

.weight.is-active {
  border: 1px solid var(--text-muted);
}

.card-tag {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  align-items: center;
  gap: 5px;
  height: 27px;
  padding: 5px 10px 6px 5px;
  border-radius: var(--round-sm);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}

.card-tag--sale { background: var(--error); }
.card-tag--new { background: var(--green); }
.card-tag--hit { background: var(--warning); }

.card-tag img {
  width: 16px;
  height: 16px;
  object-fit: contain;
}

.card__fav {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 24px;
  height: 24px;
  opacity: 0;
}

.card__fav img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.card:hover .card__fav {
  opacity: 1;
}

.card-size {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  background: var(--bg2);
  border-radius: var(--round);
}

.card-size__btn {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  color: var(--text-gray);
}

.card-size__btn:hover {
  color: var(--text);
}

html:not(.cards-compact) .card-size__btn[data-card-size="large"],
html.cards-compact .card-size__btn[data-card-size="compact"] {
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow);
}

.card-size__btn svg {
  display: block;
}

.lk-cards-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 16px;
}

/* Why us */
.why {
  margin-top: 50px;
}

.why-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 15px;
}

.why-card {
  background: var(--surface);
  border-radius: var(--round-sm);
  box-shadow: var(--shadow);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.why-icon {
  position: relative;
  width: 60px;
  height: 60px;
  overflow: hidden;
}

.why-icon img {
  position: absolute;
  object-fit: fill;
}

.why-1 .p1 { inset: 20.71% 52.25% 61.2% 31.86%; width: auto; height: auto; }
.why-1 .p2 { inset: 12.03% 37.72% 32.1% 2.76%; width: auto; height: auto; }
.why-1 .p3 { inset: 23.64% 2.76% 12.03% 5.54%; width: auto; height: auto; }

.why-2 .p1 { inset: 33.33% 63.61% 55.56% 3.06%; width: auto; height: auto; }
.why-2 .p2 { inset: 25% 2.5% 25% 8.61%; width: auto; height: auto; }

.why-3 .p1 { inset: 52.99% 5.56% 47.01% 24.5%; width: auto; height: auto; }
.why-3 .p2 { inset: 72.43% 32.71% 27.57% 34.89%; width: auto; height: auto; }
.why-3 .p3 { inset: 16.67% 5.56% 16.67% 8.33%; width: auto; height: auto; }

.why-4 .p1 { inset: 5.28% 8.25% 28.06% 36.19%; width: auto; height: auto; }
.why-4 .p2 { inset: 26.16% 17.59% 37.91% 59.31%; width: auto; height: auto; }
.why-4 .p3 { inset: 18.46% 38.12% 40.47% 46.48%; width: auto; height: auto; }
.why-4 .p4 { inset: 30.28% 58.25% 28.06% 2.86%; width: auto; height: auto; }
.why-4 .p5 { inset: 71.94% 8.25% 5.83% 2.86%; width: auto; height: auto; }

.why-5 .p1 { inset: 33.33% 58.33% 22.22% 8.33%; width: auto; height: auto; }
.why-5 .p2 { inset: 13.89% 30.56% 33.33% 36.11%; width: auto; height: auto; }
.why-5 .p3 { inset: 41.67% 5.56% 16.67% 52.78%; width: auto; height: auto; }
.why-5 .p4 { inset: 50.56% 13.89% 24.44% 61.11%; width: auto; height: auto; }

.why-card h3 {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: 10px;
}

.why-card p {
  font-size: 15px;
  font-weight: 300;
  line-height: 1.4;
  color: var(--text-gray);
}

/* About */
.about {
  margin-top: 50px;
}

.about__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  position: relative;
  max-height: 260px;
  overflow: hidden;
}

.about__grid p {
  font-weight: 300;
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 20px;
}

.about__grid p:last-child {
  margin-bottom: 0;
}

.about.is-open .about__grid {
  max-height: none;
}

.about__fade {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 110px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: linear-gradient(to bottom, rgba(247, 248, 246, 0), var(--bg) 70%);
}

.about.is-open .about__fade {
  position: static;
  height: auto;
  background: none;
  margin-top: 20px;
}

/* Footer */
.site-footer {
  background: var(--bg2);
  margin-top: 50px;
  padding: 50px 0;
}

.footer-top {
  display: grid;
  grid-template-columns: 250px 1fr auto;
  gap: 24px;
  align-items: start;
}

.socials {
  display: flex;
  gap: 10px;
  margin-top: 30px;
}

.social {
  width: 40px;
  height: 40px;
  border-radius: var(--round-sm);
  background: var(--bg);
  display: flex;
  align-items: center;
  justify-content: center;
}

.social img {
  width: 20px;
  height: 18px;
  object-fit: contain;
}

.footer-cols {
  display: flex;
  gap: 120px;
}

.footer-col h4 {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 20px;
}

.footer-col ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-weight: 300;
  font-size: 16px;
}

.footer-catalog {
  display: flex;
  gap: 40px;
}

.footer-contacts {
  text-align: right;
}

.footer-phone {
  font-size: 30px;
  font-weight: 500;
  line-height: 1;
  margin: 15px 0;
}

.footer-bottom {
  margin-top: 50px;
  padding-top: 50px;
  border-top: 1px solid #d7d8d4;
  display: flex;
  gap: 50px;
  font-weight: 300;
  font-size: 16px;
}

.footer-bottom a {
  text-decoration: underline;
}

/* Site acknowledgement (avoid cookie/consent ids — adblockers hide #cookieOk) */
.site-ack {
  position: fixed;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  width: min(680px, calc(100% - 24px));
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(25px);
  border-radius: var(--round);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.2);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  z-index: 80;
}

.site-ack p {
  font-weight: 300;
  font-size: 15px;
  line-height: 1.4;
}

.site-ack.is-hidden {
  display: none;
}

.mobile-menu,
.mobile-menu-backdrop {
  display: none;
}

@media (max-width: 1200px) {
  .categories {
    grid-template-columns: repeat(4, 1fr);
  }

  .why-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .why-grid .why-card:last-child {
    grid-column: span 2;
  }

  .footer-top {
    grid-template-columns: 1fr 1fr;
  }

  .footer-contacts {
    grid-column: 1 / -1;
    text-align: left;
  }

  .catalog-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .desktop-only { display: none !important; }

  .mobile-only { display: block; }

  body {
    padding-bottom: 80px;
  }

  .header-mobile {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 5px 16px 10px 12px;
  }

  .header-mobile__row {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .header-mobile__brand {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-shrink: 0;
  }

  .header-mobile__logo {
    flex-shrink: 0;
    width: 56px;
    height: 45px;
  }

  .header-mobile__logo img {
    width: 56px;
    height: 45px;
    max-width: none;
    object-fit: contain;
  }

  .header-mobile__addr {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
    flex: 1;
    text-align: right;
  }

  .header-mobile__addr-text {
    min-width: 0;
    text-align: right;
  }

  .header-mobile__addr-text strong {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
  }

  .header-mobile__addr-text span {
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.25;
    color: var(--text-gray);
    white-space: normal;
    overflow: visible;
  }

  .header-mobile__addr .icon-loc {
    flex-shrink: 0;
    overflow: visible;
    width: 18px;
    height: 22px;
  }

  .search-line--mobile {
    width: 100%;
  }

  .search-line--mobile .btn--catalog {
    height: 50px;
    padding: 12px;
    font-size: 14px;
  }

  .search-line--mobile .search {
    height: 50px;
  }

  .search-line--mobile .search__loupe {
    display: block;
  }

  .search-line--mobile .search input {
    font-size: 14px;
    padding: 0 12px 0 8px;
  }

  .search-line--mobile .search__submit-text {
    display: none;
  }

  .search-line--mobile .search__submit {
    padding: 0 12px;
  }

  .hero {
    width: 100%;
    height: auto;
    aspect-ratio: 375 / 280;
    margin-top: 0;
    border-radius: 0;
  }

  .hero__nav {
    display: flex;
    inset: 50% 8px auto;
    transform: translateY(-50%);
  }

  .hero__nav .round-btn {
    width: 36px;
    height: 36px;
  }

  .hero__dots .dot {
    width: 22px;
    height: 10px;
    background: #fff;
  }

  .hero__dots .dot::before {
    inset: -14px -10px;
  }

  .hero__dots .dot.is-active {
    border-color: #fff;
    background: var(--primary);
  }

  .categories {
    grid-template-columns: repeat(4, 1fr);
    width: calc(100% - 20px);
    margin-top: 0;
  }

  .cat-card {
    padding: 10px;
    gap: 5px;
  }

  .cat-card img {
    width: 60px;
    height: 60px;
  }

  .cat-card span {
    font-size: 11px;
  }

  .cats-title {
    font-size: 20px;
    font-weight: 500;
    padding: 0 10px;
    margin: 15px 0 10px;
  }

  .cats-all {
    display: flex;
    width: calc(100% - 20px);
    margin: 10px auto 0;
  }

  .section {
    width: calc(100% - 20px);
    margin-top: 40px;
  }

  .section-title {
    font-size: 20px;
    font-weight: 500;
  }

  .section-arrows {
    display: flex;
  }

  .card-size,
  .lk-cards-tools {
    display: none;
  }

  .carousel__prev,
  .carousel__next {
    display: none;
  }

  .card {
    width: calc(50% - 8px);
    min-width: calc(50% - 8px);
    padding: 12px;
    gap: 10px;
  }

  .card__photo {
    height: 140px;
  }

  .card__sku {
    font-size: 15px;
  }

  .card__title {
    font-size: 13px;
    font-weight: 400;
    min-height: 36px;
  }

  .card .btn {
    min-height: 30px;
    padding: 8px 9px;
    font-size: 13px;
    gap: 5px;
  }

  .card .btn .icon--16 {
    width: 14px;
    height: 14px;
  }

  .card .btn--oos {
    min-height: 40px;
    padding: 12px 9px;
    font-size: 14px;
  }

  .card .btn--unavailable {
    padding: 7px 8px;
  }

  .card-qty__stepper {
    min-height: 30px;
    padding: 8px 9px;
  }

  .card-qty__stepper span[data-card-qty-value] {
    font-size: 13px;
  }

  .card-qty__stepper button,
  .card-qty__stepper .icon--16 {
    width: 14px;
    height: 14px;
  }

  .card-qty__cart {
    width: auto;
    min-width: 0;
    height: 30px;
    min-height: 30px;
    padding: 8px 9px;
  }

  .card-qty__cart .icon--16 {
    width: 14px;
    height: 14px;
  }

  .carousel__track {
    gap: 16px;
  }

  .why-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .why-grid .why-card:last-child {
    grid-column: auto;
  }

  .why-card {
    flex-direction: row;
    align-items: flex-start;
    gap: 15px;
  }

  .why-card h3 {
    margin-bottom: 4px;
  }

  .about__grid {
    grid-template-columns: 1fr;
    gap: 16px;
    max-height: 220px;
  }

  .site-footer {
    border-radius: 10px 10px 0 0;
    padding: 20px 12px 30px;
    margin-top: 30px;
  }

  .footer-top {
    grid-template-columns: 1fr;
  }

  .footer-cols {
    flex-direction: column;
    gap: 0;
  }

  .footer-catalog,
  .footer-col:first-child {
    display: none;
  }

  .footer-col h4 {
    display: none;
  }

  .footer-col ul {
    gap: 0;
  }

  .footer-col li {
    padding: 13px 0;
    border-bottom: 1px solid #d7d8d4;
  }

  .footer-contacts {
    text-align: center;
  }

  .footer-phone {
    font-size: 20px;
  }

  .footer-bottom {
    display: none;
  }

  .bottom-nav {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    box-shadow: 0 -4px 25px rgba(0, 0, 0, 0.2);
    padding: 15px 0;
    z-index: 60;
  }

  .bottom-nav a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    position: relative;
  }

  .bottom-nav a.is-active {
    color: var(--primary);
  }

  .bottom-nav .badge {
    left: 50%;
    top: -5px;
    transform: translateX(6px);
  }

  .site-ack {
    bottom: 90px;
  }

  .catalog-overlay {
    position: fixed;
    inset: 0;
    top: 0;
    max-height: 100%;
    padding: 0;
    border-radius: 0;
    overflow: auto;
    z-index: 70;
  }

  .catalog-overlay__head.mobile-only {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 52px 16px 20px;
    border-bottom: 1px solid var(--bg2);
  }

  .catalog-overlay__head p {
    font-size: 18px;
    font-weight: 500;
  }

  .catalog-overlay__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
  }

  .catalog-acc.mobile-only {
    display: flex;
    flex-direction: column;
  }

  .catalog-acc__row {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 56px;
    padding: 12px 20px;
    text-align: left;
    border-bottom: 1px solid var(--bg2);
    color: var(--text);
  }

  .catalog-acc__row > img:first-child {
    width: 32px;
    height: 32px;
    object-fit: contain;
    flex-shrink: 0;
  }

  .catalog-acc__row span {
    flex: 1;
    font-size: 16px;
    line-height: 1.2;
    text-align: left;
  }

  .catalog-acc__chevron {
    width: 18px;
    height: 18px;
    transition: transform 0.15s;
  }

  .catalog-acc__item.is-open .catalog-acc__chevron {
    transform: rotate(180deg);
  }

  .catalog-acc__sub {
    display: none;
    flex-direction: column;
    padding: 4px 20px 12px 62px;
  }

  .catalog-acc__item.is-open > .catalog-acc__sub {
    display: flex;
  }

  .catalog-acc__sub a {
    font-size: 15px;
    color: var(--text-gray);
    padding: 8px 0;
  }

  .catalog-acc__sub a:hover {
    color: var(--primary);
  }

  .mobile-menu-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 65;
  }

  .mobile-menu-backdrop.is-open {
    display: block;
  }

  .mobile-menu {
    display: none;
    position: fixed;
    inset: 0 0 80px;
    background: var(--surface);
    z-index: 75;
    overflow: auto;
    padding: 8px 16px 24px;
  }

  .mobile-menu.is-open {
    display: block;
  }

  .mobile-menu__head {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    margin-bottom: 8px;
  }

  .mobile-menu__close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .mobile-menu__nav {
    display: flex;
    flex-direction: column;
  }

  .mobile-menu__nav a {
    display: block;
    padding: 13px 0;
    font-size: 16px;
    color: var(--text);
    border-bottom: 1px solid #ececec;
  }

  .mobile-menu__nav a.is-active {
    color: var(--primary);
  }

  .mobile-menu__phone {
    display: block;
    margin: 18px 0 12px;
    font-size: 18px;
    font-weight: 500;
    color: var(--text);
  }

  .mobile-menu .btn {
    width: 100%;
  }

  body.menu-open .header-mobile {
    visibility: hidden;
  }
}

@media (max-width: 480px) {
  .card {
    width: calc(50% - 6px);
    min-width: calc(50% - 6px);
  }

  .card__weights {
    flex-wrap: wrap;
  }

  .weight {
    padding: 6px;
    font-size: 13px;
  }
}

/* Django integration extras */
button.topbar__item,
button.header-mobile__addr {
  color: inherit;
  text-align: left;
}

.card__fav.is-active {
  opacity: 1;
}

.card__fav.is-active img {
  filter: brightness(0) saturate(100%) invert(22%) sepia(95%) saturate(7498%) hue-rotate(356deg) brightness(91%) contrast(84%);
}

@media (max-width: 900px) {
  .card__fav {
    opacity: 1;
  }
}

a.hero__slide {
  display: block;
}

.new-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.new-modal[hidden] {
  display: none;
}

.new-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
}

.new-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(520px, 100%);
  max-height: min(80vh, 640px);
  overflow: auto;
  background: var(--surface);
  border-radius: var(--round);
  padding: 24px;
  box-shadow: var(--shadow);
}

.new-modal--towns {
  align-items: flex-start;
  padding: 60px 10px 100px;
}

.new-modal__dialog--towns {
  width: min(400px, 100%);
  max-height: none;
  overflow: visible;
  padding: 30px 12px 20px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.25);
}

.new-modal__towns {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.new-modal__dialog--towns h3 {
  margin: 0;
  width: 100%;
  font-size: 15px;
  font-weight: 500;
  line-height: 15px;
  color: #000;
}

.new-modal__select {
  position: relative;
  display: block;
  width: 100%;
}

.new-modal__input {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  height: 50px;
  padding: 6px 38px 6px 15px;
  border: 1px solid var(--border);
  border-radius: var(--round-sm);
  background: var(--surface);
  color: var(--text-gray);
  font-size: 15px;
  line-height: 18px;
  cursor: pointer;
}

.new-modal__input::-ms-expand {
  display: none;
}

.new-modal__chevron {
  position: absolute;
  right: 10px;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  pointer-events: none;
  overflow: hidden;
}

.new-modal__chevron img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.new-modal__close {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
}

.new-modal__close .icon-close {
  width: 16px;
  height: 16px;
  transform: rotate(45deg);
}

.new-modal__close .icon-close img {
  filter: brightness(0);
}

.new-modal button.btn,
.new-modal .new-modal__confirm,
#townsConfirm {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  padding: 12px;
  border: none;
  border-radius: var(--round-sm);
  background: var(--btn-gradient);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
  cursor: pointer;
}

.new-modal button.btn:hover,
.new-modal .new-modal__confirm:hover,
#townsConfirm:hover {
  background: var(--btn-gradient-hover);
  color: #fff;
}

@media (min-width: 901px) {
  .new-modal--towns,
  .new-modal--apteka {
    align-items: center;
    padding: 16px;
  }
}

.new-modal__dialog h3 {
  margin-bottom: 16px;
  font-size: 20px;
}

.new-modal--apteka {
  align-items: flex-start;
  padding: 60px 10px 100px;
}

.new-modal__dialog--apteka {
  width: min(400px, 100%);
  max-height: none;
  overflow: visible;
  padding: 20px 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.25);
}

.apteka-modal__text {
  width: 100%;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.4;
  color: #000;
}

.apteka-modal__text p + p {
  margin-top: 10px;
}

.new-modal__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}

.new-modal__option {
  text-align: left;
  padding: 10px 12px;
  border-radius: var(--round-sm);
  background: var(--bg2);
}

.new-modal__option.is-active,
.new-modal__option:hover {
  background: #fde8e8;
  color: var(--primary-dark);
}

.new-modal__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 12px;
  font-size: 14px;
}

.new-modal__field input {
  border: 1px solid #e5e7eb;
  border-radius: var(--round-sm);
  padding: 10px 12px;
}

.new-modal__check {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin: 8px 0 16px;
  font-size: 14px;
}

.new-modal__check a {
  text-decoration: underline;
}

.new-modal__status {
  margin-bottom: 12px;
  font-size: 14px;
}

.btn:disabled {
  opacity: 0.6;
  cursor: default;
}

.badge[hidden] {
  display: none;
}

/* Catalog listing */
.catalog {
  padding: 24px 0 60px;
}

.crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  color: var(--text);
  margin-bottom: 20px;
}

.crumbs a:hover {
  color: var(--primary);
}

.crumbs__sep {
  color: var(--text-muted);
}

.catalog-title {
  font-size: 24px;
  font-weight: 400;
  line-height: 28px;
  margin: 0 0 20px;
}

.catalog-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 24px;
}

.catalog-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 65px;
  max-width: 316px;
  padding: 10px 17px;
  background: var(--bg2);
  border-radius: var(--round);
  font-size: 15px;
  line-height: 1.3;
  text-align: center;
}

.catalog-tag:hover {
  color: var(--primary);
}

.catalog-tag--more {
  gap: 6px;
  color: var(--text);
  cursor: pointer;
}

.catalog-tag--more img {
  width: 16px;
  height: 16px;
  transition: transform 0.15s;
}

.catalog-tag.is-collapsed {
  display: none !important;
}

.catalog-tags.is-open .catalog-tag.is-collapsed,
.catalog-tags.is-open .catalog-tag[hidden] {
  display: inline-flex !important;
}

.catalog-tags.is-open .catalog-tag--more img {
  transform: rotate(180deg);
}

.catalog-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  margin-bottom: 20px;
}

.catalog-filter-btn {
  height: 40px;
  padding: 0 16px;
  background: var(--bg2);
  border-radius: var(--round);
  font-size: 15px;
}

.catalog-sort {
  position: relative;
}

.catalog-sort__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  color: var(--text);
  padding: 6px 0;
}

.catalog-sort__btn img {
  width: 18px;
  height: 18px;
}

.catalog-sort__chevron {
  width: 16px;
  height: 16px;
  transition: transform 0.15s;
}

.catalog-sort.is-open .catalog-sort__chevron {
  transform: rotate(180deg);
}

.catalog-sort__menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 5;
  min-width: 220px;
  background: var(--surface);
  border-radius: var(--round-sm);
  box-shadow: var(--shadow);
  padding: 8px 0;
}

.catalog-sort.is-open .catalog-sort__menu {
  display: flex;
  flex-direction: column;
}

.catalog-sort__menu button {
  text-align: left;
  padding: 10px 16px;
  width: 100%;
  font-size: 14px;
}

.catalog-sort__menu button:hover {
  background: #fde8e8;
  color: var(--primary-dark);
}

.catalog-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: start;
}

.catalog-layout.has-filters {
  grid-template-columns: 332px minmax(0, 1fr);
}

.catalog-side {
  background: var(--surface);
  border-radius: var(--round);
  box-shadow: var(--shadow);
  padding: 20px;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.cat-filters,
.cat-filters__group,
.price-range {
  min-width: 0;
  max-width: 100%;
}

.cat-filters {
  margin: 0;
  padding: 0;
  border: 0;
}

.cat-filters__group {
  margin-bottom: 20px;
}

.cat-filters__group h3 {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 20px;
}

.price-range__slider {
  position: relative;
  height: 19px;
  margin: 0 8px 10px;
}

.price-range__rail {
  position: absolute;
  left: 0;
  right: 0;
  top: 8px;
  height: 3px;
  background: var(--border);
  border-radius: 2px;
}

.price-range__fill {
  position: absolute;
  top: 8px;
  height: 3px;
  background: rgba(229, 57, 53, 0.35);
  border-radius: 2px;
}

.price-range__thumb {
  position: absolute;
  left: 0;
  width: 100%;
  height: 19px;
  margin: 0;
  background: none;
  pointer-events: none;
  -webkit-appearance: none;
  appearance: none;
}

.price-range__thumb::-webkit-slider-runnable-track {
  height: 19px;
  background: transparent;
}

.price-range__thumb::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  pointer-events: auto;
  width: 19px;
  height: 19px;
  border: 0;
  border-radius: 10px;
  background: var(--primary);
  cursor: pointer;
}

.price-range__thumb::-moz-range-track {
  height: 19px;
  background: transparent;
  border: 0;
}

.price-range__thumb::-moz-range-thumb {
  pointer-events: auto;
  width: 19px;
  height: 19px;
  border: 0;
  border-radius: 10px;
  background: var(--primary);
  cursor: pointer;
}

.price-range__fields {
  display: flex;
  gap: 10px;
  min-width: 0;
  width: 100%;
}

.price-range__field {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 8px;
  border: 1px solid var(--border);
  border-radius: var(--round-sm);
  font-size: 14px;
  font-weight: 300;
  color: var(--text-gray);
  overflow: hidden;
}

.price-range__field span {
  flex-shrink: 0;
}

.price-range__field input {
  flex: 1 1 0;
  width: 0;
  min-width: 0;
  font-size: 14px;
  font-weight: 300;
  color: var(--text);
}

.cat-filters__search {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  margin-bottom: 12px;
  background: var(--bg2);
  border-radius: var(--round);
  font-size: 14px;
}

.cat-filters__vars {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 220px;
  overflow-y: auto;
}

.cat-filters__vars.is-collapsed {
  max-height: none;
  overflow: visible;
}

.cat-filters__vars.is-collapsed .cat-check.is-overflow {
  display: none;
}

.cat-check {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: var(--text);
  cursor: pointer;
}

.cat-check input {
  -webkit-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  border: 1.5px solid var(--text-muted);
  border-radius: 3px;
  background: #fff;
}

.cat-check input:checked {
  background-color: var(--primary);
  border-color: var(--primary);
}

.cat-check input:checked::after {
  content: "";
  display: block;
  width: 8px;
  height: 5px;
  margin: 2px auto 0;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
}

.cat-radio {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 15px;
  font-size: 15px;
  font-weight: 300;
  color: var(--text);
  cursor: pointer;
}

.cat-radio:last-child {
  margin-bottom: 0;
}

.cat-radio input {
  -webkit-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  border: 1.5px solid var(--text-muted);
  border-radius: 50%;
  background: #fff;
}

.cat-radio input:checked {
  border-color: var(--primary);
  background: var(--primary);
  box-shadow: inset 0 0 0 3px #fff;
}

.cat-filters__more {
  margin-top: 10px;
  font-size: 14px;
  color: var(--text-gray);
}

.cat-filters__more:hover {
  color: var(--primary);
}

.cat-filters .btn {
  height: 40px;
  margin-top: 8px;
}

.catalog-grid-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.catalog-layout.has-filters .catalog-grid-cards {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.catalog-grid-cards .card,
.card--grid {
  width: auto;
  min-width: 0;
}

@media (min-width: 901px) {
  .carousel .card {
    width: calc((100cqw - 3 * 24px) / 4);
    min-width: calc((100cqw - 3 * 24px) / 4);
  }

  html.cards-compact .carousel__track {
    gap: 16px;
  }

  html.cards-compact .card {
    padding: 12px;
    gap: 10px;
  }

  html.cards-compact .card__photo {
    height: 180px;
  }

  html.cards-compact .card__sku {
    font-size: 14px;
  }

  html.cards-compact .card__title {
    font-size: 15px;
    min-height: 42px;
  }

  html.cards-compact .card__current {
    font-size: 18px;
    line-height: 18px;
  }

  html.cards-compact .catalog-layout.has-filters .catalog-grid-cards,
  html.cards-compact .lk-cards.catalog-grid-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }

  html.cards-compact .card__old,
  html.cards-compact .card__discount {
    font-size: 14px;
  }

  html.cards-compact .card .btn {
    min-height: 34px;
    padding: 6px 8px;
    font-size: 13px;
    gap: 5px;
  }

  html.cards-compact .card-qty__stepper {
    min-height: 34px;
    padding: 6px 8px;
  }

  html.cards-compact .card-qty__stepper span[data-card-qty-value] {
    font-size: 13px;
  }

  html.cards-compact .card-qty__cart {
    width: 34px;
    min-width: 34px;
    height: 34px;
    padding: 6px;
  }
}

@media (min-width: 1201px) {
  html.cards-compact .carousel .card {
    width: calc((100cqw - 4 * 16px) / 5);
    min-width: calc((100cqw - 4 * 16px) / 5);
  }

  html.cards-compact .catalog-grid-cards {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
  }
}

@media (min-width: 901px) and (max-width: 1200px) {
  html.cards-compact .carousel .card {
    width: calc((100cqw - 3 * 16px) / 4);
    min-width: calc((100cqw - 3 * 16px) / 4);
  }

  html.cards-compact .catalog-grid-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }
}

.catalog-empty {
  grid-column: 1 / -1;
  color: var(--text-gray);
  padding: 24px 0;
}

.catalog-pages {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}

.catalog-pages__link {
  min-width: 40px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--round-sm);
  font-size: 15px;
  padding: 0;
}

.catalog-pages__link.is-current,
.catalog-pages__link:hover {
  background: var(--bg2);
}

.catalog-pages__dots {
  pointer-events: none;
}

.catalog-pages__next {
  width: auto;
  min-width: 40px;
  padding: 0 8px;
}

.catalog-pages__next img {
  width: 18px;
  height: 18px;
}

.catalog-sheet {
  align-items: flex-end;
  padding: 0;
}

.catalog-sheet__card {
  width: 100%;
  max-width: none;
  max-height: 80vh;
  border-radius: var(--round) var(--round) 0 0;
}

.catalog-sheet__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.catalog-sheet__head h2 {
  font-size: 20px;
  font-weight: 500;
}

.catalog-sheet__head button {
  font-size: 28px;
  line-height: 1;
  color: var(--text-gray);
}

@media (max-width: 1200px) {
  .catalog-layout.has-filters {
    grid-template-columns: 280px minmax(0, 1fr);
  }

  .catalog-layout.has-filters .catalog-grid-cards,
  .catalog-grid-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .catalog {
    padding: 12px 0 24px;
  }

  .catalog-title {
    font-size: 20px;
    line-height: 24px;
  }

  .catalog-layout,
  .catalog-layout.has-filters {
    grid-template-columns: 1fr;
  }

  .catalog-tags {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-bottom: 16px;
    -webkit-overflow-scrolling: touch;
  }

  .catalog-tag {
    flex: 0 0 auto;
    min-height: 48px;
    max-width: none;
    white-space: nowrap;
  }

  .catalog-tag--more {
    display: none !important;
  }

  .catalog-tools {
    justify-content: space-between;
    margin-bottom: 16px;
  }

  .catalog-filter-btn.mobile-only {
    display: inline-flex;
    align-items: center;
  }

  .catalog-grid-cards,
  .catalog-layout.has-filters .catalog-grid-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .catalog-grid-cards .card,
  .card--grid {
    width: auto;
    min-width: 0;
    padding: 12px;
  }
}

/* Product page */
.product {
  padding: 30px 0 20px;
}

.container--wide {
  width: min(1440px, calc(100% - 40px));
}

.crumbs__catalog {
  font-size: 15px;
}

.crumbs__catalog:hover {
  color: var(--primary);
}

.product-page .crumbs {
  margin-bottom: 0;
}

.product-head {
  margin: 30px 0 0;
}

.product-title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1.15;
  max-width: 784px;
}

.product-sku {
  display: flex;
  gap: 5px;
  margin-top: 10px;
  font-size: 15px;
}

.product-sku span:first-child {
  color: var(--text-gray);
}

.product-stage {
  display: flex;
  gap: 46px;
  align-items: flex-start;
  background: var(--surface);
  border-radius: var(--round);
  padding: 20px;
  margin: 30px 0 50px;
}

.product-main {
  display: flex;
  gap: 24px;
  flex: 1;
  min-width: 0;
}

.product-gallery {
  display: flex;
  gap: 24px;
  flex-shrink: 0;
}

.product-gallery__thumbs {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 90px;
  max-height: 461px;
  overflow: auto;
}

.product-gallery__thumb {
  width: 90px;
  height: 90px;
  flex-shrink: 0;
  border: 2px solid transparent;
  border-radius: var(--round-sm);
  overflow: hidden;
}

.product-gallery__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-gallery__thumb.is-active {
  border-color: var(--primary);
}

.product-gallery__viewport {
  position: relative;
  width: 450px;
  height: 461px;
  border-radius: var(--round);
  overflow: hidden;
  background: #fff;
}

.product-gallery__stage {
  width: 100%;
  height: 100%;
}

.product-gallery__img {
  display: none;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.product-gallery__img.is-active {
  display: block;
}

.product-gallery__nav,
.product-gallery__dots {
  display: none;
}

.product-mid {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.product-lead {
  display: none;
}

.product-facts h2,
.product-docs h2,
.product-acc__head h2 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 15px;
}

.product-facts,
.product-docs {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.product-facts h2,
.product-docs h2 {
  margin-bottom: 0;
}

.spec-row {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  font-size: 15px;
  line-height: 1.4;
}

.spec-row__name {
  white-space: nowrap;
}

.spec-row__line {
  flex: 1;
  min-width: 12px;
  border-bottom: 1px dotted var(--text-muted);
  transform: translateY(-4px);
}

.spec-row__val {
  color: var(--text-gray);
  font-weight: 300;
  white-space: nowrap;
}

.spec-text {
  font-size: 15px;
  line-height: 1.4;
}

.spec-text__name {
  margin-bottom: 5px;
}

.spec-text p:last-child {
  color: var(--text-gray);
  font-weight: 300;
}

.product-chip {
  align-self: flex-start;
  background: var(--bg2);
  border-radius: var(--round-sm);
  padding: 9px 13px;
  font-size: 14px;
}

.product-chip:hover {
  background: var(--bg);
}

.product-doc {
  display: flex;
  align-items: center;
  gap: 10px;
}

.product-doc__type {
  width: 38px;
  height: 38px;
  border-radius: var(--round-sm);
  background: #e04f4f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  text-transform: lowercase;
  flex-shrink: 0;
}

.product-doc__name {
  display: block;
  font-size: 15px;
  font-weight: 300;
}

.product-doc__meta {
  display: block;
  margin-top: 5px;
  font-size: 15px;
  color: var(--text-muted);
}

.product-buy-card {
  width: 310px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.product-town {
  width: 100%;
  height: 50px;
  border: 1px solid var(--border);
  border-radius: var(--round-sm);
  padding: 0 32px 0 15px;
  text-align: left;
  font-weight: 300;
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
  background: #fff;
}

.product-town::after {
  content: "";
  position: absolute;
  right: 15px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid var(--text-gray);
  border-bottom: 1.5px solid var(--text-gray);
  transform: translateY(-70%) rotate(45deg);
}

.product-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.product-opt {
  min-width: 0;
  height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--text-muted);
  border-radius: var(--round-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}

.product-opt.is-active {
  border-color: var(--primary);
  border-width: 2px;
  color: var(--primary);
}

.product-buy-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
}

.product-price {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.product-price__now {
  font-size: 26px;
  font-weight: 600;
  line-height: 1;
}

.product-price__old {
  font-size: 17px;
  color: var(--text-gray);
  text-decoration: line-through;
}

.product-price__off {
  font-size: 15px;
  font-weight: 500;
  color: var(--primary);
}

.product-stock {
  font-size: 13px;
  color: var(--success);
  white-space: nowrap;
}

.product-stock.is-warn {
  color: var(--error);
}

.product-buy-actions {
  display: flex;
  gap: 5px;
}

.product-buy-actions .btn--lg {
  flex: 1;
  min-width: 0;
  height: 50px;
  font-size: 15px;
}

.product-buy__fav {
  position: static;
  opacity: 1;
  width: 50px;
  height: 50px;
  flex-shrink: 0;
  background: var(--bg2);
  border-radius: var(--round-sm);
}

.product-buy__fav img {
  width: 24px;
  height: 24px;
  margin: 0 auto;
}

.product-body-col {
  max-width: 1044px;
  display: flex;
  flex-direction: column;
  gap: 50px;
  margin-bottom: 20px;
}

.product-acc__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  text-align: left;
  color: inherit;
}

@media (min-width: 901px) {
  .product-acc__head {
    pointer-events: none;
  }
}

.product-acc__head h2 {
  margin-bottom: 15px;
}

.product-acc__icon {
  display: none;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.product-acc__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: rotate(90deg);
}

.product-acc--docs {
  display: none;
}

.product-video {
  width: 100%;
  max-width: 1044px;
  aspect-ratio: 16 / 9;
  border-radius: var(--round);
  overflow: hidden;
  background: #111;
}

.product-video iframe,
.product-video video {
  width: 100%;
  height: 100%;
  border: 0;
}

.product-text,
.product-specs {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
}

.product-text p,
.product-specs p {
  margin-bottom: 10px;
}

.product-text ul,
.product-specs ul {
  list-style: disc;
  padding-left: 20px;
  margin-bottom: 10px;
}

.product-text ol,
.product-specs ol {
  list-style: decimal;
  padding-left: 20px;
  margin-bottom: 10px;
}

.product-specs {
  margin-top: 16px;
}

.product-specs table {
  width: 100%;
  border-collapse: collapse;
}

.product-specs td,
.product-specs th {
  padding: 12px 0;
  border-bottom: 1px solid var(--bg2);
  text-align: left;
  vertical-align: top;
}

.spec-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px 50px;
}

.spec-grid > div {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.spec-grid .spec-row {
  margin-bottom: 0;
}

.product-empty {
  color: var(--text-gray);
}

.product-reviews {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.product-review__name {
  font-size: 18px;
  font-weight: 500;
}

.product-review__date {
  font-size: 14px;
  color: var(--text-gray);
  margin: 4px 0 8px;
}

.product-review__text {
  font-size: 16px;
  line-height: 1.45;
}

.product-review-form {
  margin-top: 28px;
  max-width: 705px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.product-review-form label {
  font-size: 15px;
  color: var(--text-gray);
}

.product-review-form textarea {
  width: 100%;
  border: 1px solid var(--text-muted);
  border-radius: var(--round-sm);
  padding: 12px;
  font: inherit;
  min-height: 160px;
  resize: vertical;
  background: var(--surface);
}

.product-review-form .btn {
  align-self: flex-start;
  min-width: 176px;
}

.product-review-login {
  margin-top: 20px;
  color: var(--text-gray);
}

.product-review-login a {
  color: var(--primary);
}

.product-page .section {
  margin-top: 50px;
  margin-bottom: 50px;
}

.page-messages {
  width: min(var(--container), calc(100% - 40px));
  margin: 16px auto 0;
}

.page-messages .alert {
  background: var(--surface);
  border-radius: var(--round-sm);
  box-shadow: var(--shadow);
  padding: 12px 16px;
}

.page-messages .alert-success {
  color: var(--green);
}

.page-messages .alert-warning,
.page-messages .alert-error {
  color: var(--error);
}

@media (max-width: 1200px) {
  .product-title {
    font-size: 24px;
  }

  .product-stage {
    gap: 24px;
  }

  .product-gallery__viewport {
    width: 320px;
    height: 340px;
  }

  .spec-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .product {
    padding: 8px 0 20px;
  }

  .product-page .container,
  .product-page .container--wide {
    width: calc(100% - 24px);
  }

  .product-page .crumbs {
    font-size: 13px;
    gap: 6px;
    overflow: hidden;
    white-space: nowrap;
  }

  .product-head {
    margin: 20px 0 0;
  }

  .product-title {
    font-size: 20px;
    line-height: 1.3;
    max-width: none;
  }

  .product-sku {
    font-size: 13px;
    margin-top: 15px;
  }

  .product-stage {
    flex-direction: column;
    gap: 20px;
    background: transparent;
    border-radius: 0;
    padding: 0;
    margin: 20px 0 20px;
  }

  .product-main {
    flex-direction: column;
    gap: 20px;
  }

  .product-gallery {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }

  .product-gallery__thumbs {
    display: none;
  }

  .product-gallery__viewport {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    max-height: 360px;
    background: #fff;
  }

  .product-gallery__stage {
    width: 100%;
    height: 100%;
  }

  .product-gallery__img,
  .product-gallery__img.is-active {
    display: none;
    width: 100%;
    height: 100%;
    min-width: 0;
    object-fit: contain;
    object-position: center;
    border-radius: 0;
  }

  .product-gallery__img.is-active {
    display: block;
  }

  .product-gallery__nav {
    display: flex;
    position: absolute;
    inset: 50% 8px auto;
    transform: translateY(-50%);
    align-items: center;
    justify-content: space-between;
    pointer-events: none;
    z-index: 3;
  }

  .product-gallery__nav .round-btn {
    pointer-events: auto;
    width: 36px;
    height: 36px;
  }

  .product-gallery__dots {
    display: flex;
    position: absolute;
    left: 50%;
    bottom: 14px;
    transform: translateX(-50%);
    gap: 5px;
    z-index: 3;
  }

  .product-gallery__dots .dot {
    width: 22px;
    height: 10px;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18);
  }

  .product-gallery__dots .dot.is-active {
    background: var(--primary);
  }

  .product-lead {
    display: none;
  }

  .product-mid {
    display: none;
  }

  .product-buy-card {
    width: 100%;
    gap: 25px;
  }

  .product-buy-row {
    order: 1;
  }

  .product-opts {
    order: 2;
  }

  .product-buy-actions {
    order: 3;
  }

  .product-town {
    order: 4;
  }

  .product-buy-actions .btn--lg {
    font-size: 15px;
  }

  .product-body-col {
    gap: 10px;
    max-width: none;
  }

  .product-acc {
    background: var(--surface);
    border-radius: var(--round);
    overflow: hidden;
  }

  .product-acc--docs {
    display: block;
    order: 3;
  }

  .product-acc--desc { order: 1; }
  .product-acc--specs { order: 2; }
  .product-acc--video { order: 4; }
  .product-acc--reviews { order: 5; }

  .product-acc__head {
    min-height: 58px;
    padding: 0 15px;
  }

  .product-acc__head h2 {
    margin-bottom: 0;
  }

  .product-acc__icon {
    display: block;
  }

  .product-acc.is-open .product-acc__icon img {
    transform: rotate(-90deg);
  }

  .product-acc__body {
    display: none;
    padding: 0 15px 20px;
  }

  .product-acc.is-open .product-acc__body {
    display: block;
  }

  .spec-grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .spec-row__name,
  .spec-row__val {
    white-space: normal;
  }

  .product-video {
    aspect-ratio: 336 / 190;
  }

  .product-page .section {
    width: 100%;
    margin: 20px 0 0;
    padding: 0 0 0 12px;
  }

  .product-page .section-title {
    font-size: 20px;
  }

  .product-page .carousel .card {
    width: 250px;
    min-width: 250px;
    padding: 15px;
  }

  .product-page .carousel__track {
    gap: 10px;
  }
}

.icon-close--ink img {
  filter: none;
}

.basket {
  padding: 8px 0 48px;
}

.basket-title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  margin: 0 0 30px;
}

.basket-layout,
.checkout-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 332px;
  gap: 24px;
  align-items: start;
}

.basket-card,
.checkout-card {
  background: var(--surface);
  border-radius: var(--round);
  padding: 30px;
}

.checkout-card {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

.checkout-main {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}

.basket-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 20px;
}

.basket-del {
  color: var(--error);
  font-size: 15px;
  background: none;
  padding: 0;
}

.basket-del:hover {
  text-decoration: underline;
}

.chk {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 15px;
}

.chk input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.chk__box {
  width: 16px;
  height: 16px;
  border: 1px solid var(--border);
  border-radius: var(--round-xs);
  background: var(--surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.chk__box img {
  width: 8px;
  height: 5px;
  display: none;
}

.chk input:checked + .chk__box {
  background: var(--primary);
  border-color: var(--primary);
}

.chk input:checked + .chk__box img {
  display: block;
}

.basket-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.basket-line {
  display: flex;
  align-items: center;
  gap: 10px;
}

.basket-line + .basket-line {
  padding-top: 20px;
  border-top: 1px solid var(--border);
}

.basket-line__photo {
  width: 90px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--round-xs);
  background: rgba(0, 0, 0, 0.03);
  flex-shrink: 0;
}

.basket-line__photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.basket-line__info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.basket-line__title {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--text);
}

.basket-line__title:hover {
  color: var(--primary);
}

.basket-line__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 15px;
  font-size: 14px;
  color: var(--text-gray);
}

.basket-line__meta--light {
  font-weight: 300;
  font-size: 15px;
}

.basket-line__note {
  font-size: 13px;
  color: var(--error);
}

.basket-line__controls {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
}

.basket-qty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 120px;
  min-height: 30px;
  padding: 6px 9px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--round-sm);
}

.basket-qty span[data-qty-value] {
  flex: 1;
  text-align: center;
  font-size: 16px;
}

.basket-qty button {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  padding: 0;
}

.basket-line__prices {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
}

.basket-line__sum {
  font-size: 20px;
  font-weight: 500;
  white-space: nowrap;
}

.basket-line__unit {
  font-size: 15px;
  font-weight: 300;
  color: var(--text-gray);
  white-space: nowrap;
}

.basket-line__fav {
  position: static;
  opacity: 1;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.basket-line__fav img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.basket-line__fav.is-active img {
  filter: invert(27%) sepia(89%) saturate(2476%) hue-rotate(346deg) brightness(94%) contrast(92%);
}

.order-sum {
  background: var(--bg2);
  border-radius: var(--round);
  padding: 30px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: sticky;
  top: 20px;
}

.order-sum__row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  font-size: 15px;
  font-weight: 300;
}

.order-sum__row strong {
  font-weight: 500;
  white-space: nowrap;
}

.order-sum__dots {
  flex: 1 1 auto;
  min-width: 12px;
  border-bottom: 1px dotted #c5c5c5;
  transform: translateY(-4px);
}

.order-sum__discount {
  color: var(--red);
}

.order-sum__hr {
  height: 0;
  border-top: 1px solid var(--border);
}

.order-sum__row--total {
  font-weight: 500;
  font-size: 16px;
}

.order-sum .btn {
  margin-top: 0;
}

.btn--soft {
  background: var(--bg2);
  color: var(--primary-dark);
  font-weight: 400;
}

.btn--soft:hover {
  background: #e4e5e0;
  color: var(--primary-dark);
}

.checkout {
  padding: 8px 0 48px;
}

.checkout-h {
  font-size: 17px;
  font-weight: 500;
  line-height: 1;
}

.checkout-bonus-balance {
  font-size: 15px;
  line-height: 1.3;
}

.checkout-bonus-balance strong {
  font-weight: 500;
}

.checkout-fields {
  display: grid;
  gap: 15px 15px;
  width: 100%;
}

.checkout-fields--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.checkout-fields--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.field__label {
  padding: 0 10px;
  font-size: 14px;
  font-weight: 300;
  color: var(--text-gray);
}

.field__input {
  width: 100%;
  height: 50px;
  padding: 6px 15px;
  border: 1px solid var(--border);
  border-radius: var(--round-sm);
  background: var(--surface);
  color: var(--text);
  font-size: 15px;
}

.field__input--area {
  height: 110px;
  padding: 15px;
  resize: vertical;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.5;
}

.field__input.is-invalid {
  border-color: var(--error);
}

.field__select,
.field__suggest {
  position: relative;
  display: block;
}

.field__select .field__input {
  appearance: none;
  padding-right: 36px;
}

.field__chevron {
  position: absolute;
  right: 15px;
  top: 50%;
  width: 8px;
  height: 8px;
  transform: translateY(-50%) rotate(90deg);
  pointer-events: none;
}

.field__chevron img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ship-cards {
  display: flex;
  gap: 10px;
  width: 100%;
}

.ship-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 1 1 0;
  min-width: 0;
  padding: 10px 15px;
  border: 2px solid var(--border);
  border-radius: var(--round-sm);
  background: var(--surface);
  cursor: pointer;
}

.ship-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.ship-card__icon {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ship-card__icon img {
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.ship-card__icon--cdek img {
  width: 48px;
  height: 13px;
}

.ship-card__text {
  font-size: 15px;
  color: var(--text-gray);
}

.ship-card:has(input:checked) {
  border-color: var(--primary);
}

.ship-card:has(input:checked) .ship-card__text {
  color: var(--primary);
}

.checkout-panel {
  display: none;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

.checkout-panel.is-active {
  display: flex;
}

.ship-hints {
  margin: 0;
  padding-left: 18px;
  color: var(--text-gray);
  font-size: 15px;
  font-weight: 300;
}

.ship-hints li {
  list-style: disc;
  margin: 4px 0;
}

.store-card {
  display: flex;
  gap: 25px;
  align-items: center;
  width: 100%;
}

.store-card__photo {
  flex: 1 1 0;
  min-width: 0;
  height: 300px;
  border-radius: var(--round-sm);
  overflow: hidden;
}

.store-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.store-card__body {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.store-card__head {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.store-card__title {
  font-size: 18px;
  font-weight: 500;
}

.store-card__status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--success);
  font-size: 14px;
}

.store-card__status.is-closed {
  color: var(--text-gray);
}

.store-card__status.is-closed .store-card__dot {
  background: var(--text-gray);
}

.store-card__dot {
  width: 6px;
  height: 6px;
  border-radius: 10px;
  background: var(--success);
}

.store-card__facts {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.store-card__facts li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 15px;
  line-height: 1.4;
}

.store-card__facts li > span:last-child {
  display: flex;
  flex-direction: column;
}

.store-card__hours-note {
  color: var(--text-gray);
}

.store-card__actions {
  display: flex;
  gap: 5px;
}

.checkout-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.checkout-order {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.checkout-line {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.checkout-line + .checkout-line {
  padding-top: 20px;
  border-top: 1px solid var(--border);
}

.checkout-line__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sdek-price {
  font-size: 15px;
  color: var(--text-gray);
}

.checkout-map-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.checkout-map {
  width: 100%;
  height: 380px;
  border-radius: var(--round-sm);
  overflow: hidden;
  background: var(--bg2);
  border: 1px solid var(--border);
}

.checkout-map-hint {
  margin: 0;
  font-size: 14px;
  font-weight: 300;
  color: var(--text-gray);
}

.basket-suggest {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  top: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  border-top: 0;
  border-radius: 0 0 var(--round-sm) var(--round-sm);
  max-height: 240px;
  overflow: auto;
}

.basket-suggest button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 12px;
  color: var(--text-gray);
  background: none;
}

.basket-suggest button:hover {
  background: var(--bg2);
}

.basket-suggest__empty {
  padding: 8px 12px;
  color: var(--text-muted);
  font-size: 14px;
}

.basket-alert {
  background: #fff4e5;
  color: #8a4b08;
  border-radius: var(--round-sm);
  padding: 12px 16px;
}

.basket-error {
  color: var(--error);
  font-size: 14px;
}

.basket-empty {
  font-size: 20px;
  margin: 8px 0 24px;
}

.success {
  padding: 8px 0 48px;
}

.success-card {
  background: var(--surface);
  border-radius: var(--round);
  padding: 30px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.success-block {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.success-lead {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 15px;
}

.success-facts {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.success-facts div {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 16px;
  line-height: 1.5;
}

.success-facts dt {
  font-weight: 300;
}

.success-facts dd {
  font-weight: 400;
}

.success-hr {
  height: 0;
  border-top: 1px solid var(--border);
}

.success-note {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
}

.success-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.order-success-body .page-messages {
  display: none;
}

@media (max-width: 1200px) {
  .ship-cards {
    flex-wrap: wrap;
  }

  .ship-card {
    flex: 1 1 220px;
  }
}

@media (max-width: 900px) {
  .basket-title {
    font-size: 24px;
  }

  .basket-layout,
  .checkout-layout,
  .checkout-fields--3,
  .checkout-fields--2,
  .checkout-split {
    grid-template-columns: 1fr;
  }

  .basket-card,
  .checkout-card,
  .success-card {
    padding: 20px 16px;
  }

  .checkout-map {
    height: 280px;
  }

  .basket-line {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .basket-line__info {
    flex: 1 1 calc(100% - 130px);
  }

  .basket-line__controls {
    width: 100%;
    justify-content: space-between;
    padding-left: 26px;
  }

  .basket-qty {
    width: 110px;
  }

  .order-sum {
    position: static;
  }

  .store-card {
    flex-direction: column;
    align-items: stretch;
  }

  .store-card__photo {
    height: 200px;
  }

  .success-actions .btn {
    width: 100%;
  }
}

/* Promotions */
.promo {
  padding: 30px 0 60px;
}

.promo .crumbs {
  margin-bottom: 30px;
}

.promo-title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  color: var(--text);
  margin: 0 0 30px;
}

.promo-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.promo-card {
  display: flex;
  flex-direction: column;
  gap: 15px;
  background: var(--surface);
  border-radius: var(--round);
  padding: 30px;
}

.promo-card__media {
  display: block;
  aspect-ratio: 562 / 300;
  border-radius: var(--round-sm);
  overflow: hidden;
  background: var(--bg2);
}

.promo-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  color: transparent;
}

.promo-card__body {
  display: flex;
  flex-direction: column;
  gap: 15px;
  flex: 1;
}

.promo-card__date {
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  color: var(--text-gray);
}

.promo-card__title {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--text);
}

.promo-card__title a {
  color: inherit;
}

.promo-card__title a:hover {
  color: var(--primary);
}

.promo-card__text {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.4;
  color: var(--text);
}

.promo-card__btn {
  margin-top: auto;
}

.promo-empty {
  grid-column: 1 / -1;
  color: var(--text-gray);
  padding: 24px 0;
}

.promo-detail {
  display: flex;
  flex-direction: column;
  gap: 20px;
  background: var(--surface);
  border-radius: var(--round);
  padding: 30px;
}

.promo-detail__media {
  aspect-ratio: 562 / 300;
  border-radius: var(--round-sm);
  overflow: hidden;
  background: var(--bg2);
}

.promo-detail__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.promo-detail__title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1.2;
  color: var(--text);
}

.promo-detail__body {
  font-size: 15px;
  font-weight: 300;
  line-height: 1.4;
  color: var(--text);
}

.promo-detail__body p,
.promo-detail__body ul,
.promo-detail__body ol {
  margin: 0 0 15px;
}

.promo-detail__body ul,
.promo-detail__body ol {
  padding-left: 1.2em;
}

.promo-detail__body ul {
  list-style: disc;
}

.promo-detail__body ol {
  list-style: decimal;
}

.promo-detail__body a {
  color: var(--primary);
}

.promo-detail__body a:hover {
  text-decoration: underline;
}

.promo-detail__body img {
  max-width: 100%;
  height: auto;
  border-radius: var(--round-sm);
}

.promo-alert {
  margin: 0 0 15px;
  padding: 12px 16px;
  background: var(--bg2);
  border-radius: var(--round-sm);
}

@media (max-width: 900px) {
  .promo {
    padding: 12px 0 24px;
  }

  .promo .crumbs {
    margin-bottom: 15px;
  }

  .promo-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 15px;
  }

  .promo-grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .promo-card,
  .promo-detail {
    padding: 10px;
    gap: 15px;
  }

  .promo-card__body {
    gap: 10px;
  }

  .promo-detail__title {
    font-size: 20px;
    font-weight: 500;
  }
}

/* CMS text pages */
.text-article {
  padding: 30px 0 60px;
}

.text-article .crumbs {
  margin-bottom: 30px;
}

.text-article__main {
  max-width: 926px;
  margin: 0 auto;
}

.text-article__title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  color: var(--text);
  margin: 0 0 20px;
}

.text-article__body {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
  color: var(--text);
  overflow-wrap: break-word;
}

.text-article__body p,
.text-article__body ul,
.text-article__body ol,
.text-article__body h2,
.text-article__body h3,
.text-article__body h4,
.text-article__body h5,
.text-article__body blockquote,
.text-article__body table,
.text-article__body .vcard {
  margin: 0 0 15px;
}

.text-article__body p:last-child,
.text-article__body ul:last-child,
.text-article__body ol:last-child,
.text-article__body .vcard:last-child {
  margin-bottom: 0 !important;
}

.text-article__body h2,
.text-article__body h3,
.text-article__body h4,
.text-article__body h5 {
  font-weight: 500;
  line-height: 1.3;
  color: var(--text);
}

.text-article__body h2 {
  font-size: 22px;
  margin-top: 10px;
}

.text-article__body h3,
.text-article__body h4,
.text-article__body h5 {
  font-size: 18px;
  margin-top: 10px;
}

.text-article__body ul,
.text-article__body ol {
  padding-left: 24px;
}

.text-article__body ul {
  list-style: disc;
}

.text-article__body ol {
  list-style: decimal;
}

.text-article__body li {
  margin: 0 0 4px;
}

.text-article__body li:last-child {
  margin-bottom: 0;
}

.text-article__body a {
  color: var(--primary);
}

.text-article__body a:hover {
  text-decoration: underline;
}

.text-article__body strong,
.text-article__body b {
  font-weight: 500;
}

.text-article__body img {
  width: 100%;
  max-height: 600px;
  height: auto;
  object-fit: cover;
  object-position: bottom;
  border-radius: var(--round-sm);
  margin: 5px 0 20px;
}

.text-article__body .price-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.text-article__body .price-row__icon {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
}

.text-article__body .price-row__icon img {
  width: 40px;
  height: 40px;
  max-width: 40px;
  max-height: 40px;
  margin: 0;
  object-fit: contain;
  border-radius: 4px;
  background: #fff;
}

.text-article__body blockquote {
  display: flex;
  gap: 10px;
  background: var(--bg2);
  border-radius: var(--round);
  padding: 15px;
  font-weight: 300;
}

.text-article__body table {
  width: 100%;
  border-collapse: collapse;
}

.text-article__body th,
.text-article__body td {
  border: 1px solid var(--border);
  padding: 8px 12px;
  text-align: left;
  vertical-align: top;
}

.text-article__body iframe {
  display: block;
  width: 100%;
  max-width: 100%;
  border: 0;
  border-radius: var(--round-sm);
  margin: 0 0 15px;
}

.text-article__body .container,
.text-article__body .my_container,
.text-article__body .row,
.text-article__body .col,
.text-article__body [class*="col-"] {
  width: 100%;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
  display: block;
  float: none;
}

.text-article__body .vcard {
  background: var(--surface);
  border-radius: var(--round);
  padding: 20px;
}

.text-article__body .headline {
  margin: 0 0 15px;
}

.text-article__body p,
.text-article__body span,
.text-article__body font,
.text-article__body li,
.text-article__body h1,
.text-article__body h2,
.text-article__body h3,
.text-article__body h4,
.text-article__body h5 {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  color: inherit !important;
  background: transparent !important;
}

.text-article__body .price-links {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin: 8px 0 0;
}

.text-article__body a.price-links__card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 72px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(31, 41, 55, 0.06);
  color: var(--text);
  text-decoration: none;
}

.text-article__body a.price-links__card:hover {
  border-color: #d1d5db;
  box-shadow: var(--shadow);
  text-decoration: none;
  color: var(--text);
}

.text-article__body .price-links__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.text-article__body .price-links__city {
  font-size: 16px !important;
  font-weight: 500;
  line-height: 1.3 !important;
  color: var(--text) !important;
}

.text-article__body .price-links__caption {
  font-size: 13px !important;
  font-weight: 400;
  line-height: 1.3 !important;
  color: var(--text-gray) !important;
}

.text-article__body .price-links__arrow {
  flex-shrink: 0;
  color: var(--text-muted);
}

@media (min-width: 560px) {
  .text-article__body .price-links {
    grid-template-columns: 1fr 1fr;
  }
}

.text-article__body h2 {
  font-size: 22px !important;
}

.text-article__body h3,
.text-article__body h4,
.text-article__body h5 {
  font-size: 18px !important;
}

.text-article__body p {
  text-align: left !important;
  margin-top: 0 !important;
  margin-bottom: 15px !important;
}

.text-article__body > h1:first-child,
.text-article__body > div:first-child > h1:first-child {
  display: none;
}

@media (max-width: 900px) {
  .text-page .container {
    width: calc(100% - 24px);
  }

  .text-article {
    padding: 20px 0 40px;
  }

  .text-article__main {
    max-width: none;
  }

  .text-article .crumbs {
    margin-bottom: 20px;
    padding: 5px 0;
    font-size: 14px;
    font-weight: 400;
    color: var(--text);
  }

  .text-article .crumbs a {
    color: var(--text);
  }

  .text-article .crumbs__sep {
    font-size: 14px;
    color: var(--text);
  }

  .text-article .crumbs__sep::before {
    content: none;
  }

  .text-article__title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 10px;
  }

  .text-article__body {
    font-size: 15px;
    line-height: 1.4;
  }

  .text-article__body h2 {
    font-size: 18px !important;
  }

  .text-article__body h3,
  .text-article__body h4,
  .text-article__body h5 {
    font-size: 16px !important;
  }

  .text-article__body ul,
  .text-article__body ol {
    padding-left: 22px;
  }

  .text-article__body img {
    max-height: 170px;
    margin: 0 0 20px;
  }

  .text-article__body .vcard {
    padding: 15px;
  }

  .text-article__body blockquote {
    padding: 15px;
  }
}

/* Stores page */
.stores {
  padding: 30px 0 60px;
}

.stores .crumbs {
  margin-bottom: 30px;
}

.stores-map {
  width: 100%;
  height: 700px;
  min-height: 700px;
  border-radius: var(--round);
  overflow: hidden;
  background: var(--bg2);
}

.stores-map ymaps,
.stores-map ymaps map {
  border-radius: var(--round);
}

.stores-filter {
  display: none;
  margin: 20px 0 0;
}

.stores-filter__select {
  display: block;
  width: 100%;
}

.stores-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 50px;
  align-items: stretch;
}

.stores-card {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 15px;
  background: var(--surface);
  border-radius: var(--round);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.13);
  min-width: 0;
}

.stores-card.is-active {
  box-shadow: 0 2px 8px rgba(229, 57, 53, 0.25);
}

.stores-card.is-hidden {
  display: none;
}

.stores-card__photo {
  width: 100%;
  height: 260px;
  border-radius: var(--round-sm);
  overflow: hidden;
  flex-shrink: 0;
  background: var(--bg2);
}

.stores-card__photo img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.stores-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.stores-card__title {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  color: var(--text);
}

.stores-card__status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: var(--success);
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
}

.stores-card__status.is-closed {
  color: var(--text-gray);
}

.stores-card__status.is-closed .stores-card__dot {
  background: var(--text-gray);
}

.stores-card__dot {
  width: 6px;
  height: 6px;
  border-radius: 10px;
  background: var(--success);
  flex-shrink: 0;
}

.stores-card__facts {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
}

.stores-card__facts li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 15px;
  line-height: 1.4;
  color: var(--text);
}

.stores-card__facts li > span:last-child {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.stores-card__hours-note {
  color: var(--text-gray);
}

.stores-card__actions {
  display: flex;
  gap: 5px;
  margin-top: auto;
}

.stores-card__actions .btn {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
}

.stores-empty {
  grid-column: 1 / -1;
  color: var(--text-gray);
}

@media (max-width: 1100px) {
  .stores-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stores-map {
    height: 520px;
    min-height: 520px;
  }
}

@media (max-width: 900px) {
  .stores {
    padding: 20px 0 40px;
  }

  .stores .crumbs {
    margin-bottom: 20px;
  }

  .stores-map {
    height: 490px;
    min-height: 490px;
    border-radius: var(--round-sm);
  }

  .stores-filter {
    display: block;
  }

  .stores-grid {
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 20px;
  }

  .stores-card__photo {
    height: 170px;
  }
}

/* Auth pages (login, registration, password reset) */
.auth {
  padding: 30px 0 60px;
}

.auth .crumbs {
  margin-bottom: 30px;
}

.auth__title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  color: var(--text);
  margin: 0 0 24px;
}

.auth__inner {
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
}

.auth-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.auth-links {
  margin-top: 20px;
  font-size: 14px;
  color: var(--text-gray);
  text-align: center;
}

.auth-links a {
  color: var(--primary);
}

.auth-links a:hover {
  color: var(--primary-dark);
}

.auth-links__sep {
  margin: 0 6px;
  color: var(--text-muted);
}

.auth-message {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
  color: var(--text);
  margin: 0 0 16px;
  text-align: center;
}

.auth-message--muted {
  color: var(--text-gray);
}

.auth-message:last-child {
  margin-bottom: 24px;
}

.auth-alert {
  padding: 12px 15px;
  border-radius: var(--round-sm);
  background: rgba(229, 57, 53, 0.08);
  border: 1px solid var(--error);
  color: var(--error);
  font-size: 14px;
  line-height: 1.4;
}

.auth-alert p {
  margin: 0;
}

.auth-alert p + p {
  margin-top: 6px;
}

.field__error {
  font-size: 13px;
  color: var(--error);
  padding: 0 10px;
  line-height: 1.3;
}

.field__hint {
  font-size: 13px;
  color: var(--text-muted);
  padding: 0 10px;
  line-height: 1.3;
}

.field__hint a {
  color: var(--primary);
}

.auth__card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.auth__card > .btn:not(.btn--full) {
  align-self: center;
}

.auth__card .btn--lg {
  width: 100%;
}

@media (max-width: 767px) {
  .auth {
    padding: 20px 0 40px;
  }
}

/* Personal account */
.lk {
  padding: 8px 0 48px;
}

.lk-layout {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.lk-sidebar {
  width: 332px;
  flex-shrink: 0;
}

.lk-main {
  flex: 1;
  min-width: 0;
}

.lk-title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  margin: 0 0 20px;
}

.lk-menu {
  background: var(--surface);
  border-radius: var(--round);
  padding: 20px 10px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lk-menu__list {
  list-style: none;
}

.lk-menu__link {
  display: flex;
  align-items: center;
  gap: 15px;
  width: 100%;
  padding: 10px;
  border-radius: var(--round-sm);
  font-size: 16px;
  color: var(--text);
  background: none;
  border: none;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.lk-menu__link:hover,
.lk-menu__link.is-active {
  background: var(--bg);
}

.lk-menu__icon {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  overflow: hidden;
}

.lk-menu__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.lk-menu__logout {
  margin: 0;
}

.lk-mobile-nav {
  margin: 0 0 16px;
}

.lk-mobile-nav .lk-menu {
  background: transparent;
  padding: 0;
  gap: 10px;
}

.lk-mobile-nav .lk-menu__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.lk-mobile-nav .lk-menu__logout {
  height: 100%;
}

.lk-mobile-nav .lk-menu__link {
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  min-height: 92px;
  height: 100%;
  padding: 12px 6px;
  background: var(--surface);
  border-radius: var(--round);
  text-align: center;
  font-size: 13px;
  line-height: 1.2;
}

.lk-mobile-nav .lk-menu__link:hover,
.lk-mobile-nav .lk-menu__link.is-active {
  background: var(--surface);
  box-shadow: inset 0 0 0 1px var(--primary);
}

.lk-addr-map {
  height: 320px;
}

.lk-addr-note {
  margin: 0;
  font-size: 14px;
  font-weight: 300;
  line-height: 1.45;
  color: var(--text-gray);
}

.lk-addr-search {
  position: relative;
  z-index: 5;
}

.lk-form .checkout-map-wrap {
  position: relative;
  z-index: 1;
}

.lk-form [data-addr-suggest] {
  z-index: 20;
}

.lk-card {
  background: var(--surface);
  border-radius: var(--round);
  padding: 20px;
}

.lk-card + .lk-card {
  margin-top: 20px;
}

.lk-form .lk-card + .lk-card {
  margin-top: 0;
}

.lk-card__title {
  font-size: 17px;
  font-weight: 500;
  line-height: 1;
  margin: 0 0 20px;
}

.lk-stub,
.lk-empty {
  color: var(--text-gray);
  padding: 8px 0;
}

.lk-cards.catalog-grid-cards {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lk-bonus-top {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-bottom: 24px;
}

.lk-bonus-card {
  background: var(--surface);
  border-radius: var(--round);
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  text-align: center;
}

.lk-bonus-card--left {
  align-items: stretch;
  text-align: left;
  gap: 20px;
}

.lk-bonus-card__label {
  font-size: 18px;
  font-weight: 500;
  width: 100%;
}

.lk-bonus-card__value {
  font-size: 20px;
  color: var(--text-gray);
}

.lk-bonus-card__balance {
  font-size: 46px;
  font-weight: 500;
  line-height: 1;
  color: var(--green);
}

.lk-bonus-card__action {
  font-size: 14px;
  font-weight: 500;
  color: var(--primary);
  cursor: pointer;
  list-style: none;
}

.lk-bonus-card__action::-webkit-details-marker {
  display: none;
}

.lk-bonus-card__balance--muted {
  color: var(--text-gray);
}

.lk-bonus-edit {
  width: 100%;
}

.lk-bonus-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 8px;
  text-align: left;
}

.lk-bonus-expire {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 16px;
}

.lk-bonus-expire__val {
  color: var(--text-muted);
}

.lk-bonus-history .lk-card__title {
  margin-bottom: 40px;
}

.lk-bonus-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lk-bonus-list li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 16px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
}

.lk-bonus-list li:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.lk-bonus-list .is-plus {
  color: var(--green);
}

.lk-bonus-list .is-minus {
  color: var(--primary);
}

.lk-addr-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-bottom: 20px;
}

.lk-addr-card {
  background: var(--surface);
  border-radius: var(--round);
  padding: 20px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.lk-addr-card__pin,
.lk-addr-card__edit {
  width: 25px;
  height: 25px;
  flex-shrink: 0;
}

.lk-addr-card__edit {
  width: 24px;
  height: 24px;
}

.lk-addr-card__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.lk-addr-card__title {
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
}

.lk-addr-card__fields {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.lk-addr-card__fields dt {
  font-weight: 300;
  font-size: 16px;
  color: var(--text-gray);
  margin-bottom: 3px;
}

.lk-addr-card__fields dd {
  font-size: 16px;
  line-height: 1.4;
}

.lk-addr-card__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.lk-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lk-form-card,
.lk-form .lk-card {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.lk-form .lk-card .lk-card__title {
  margin-bottom: 0;
}

.lk-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}

.lk-form-row--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lk-check {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.4;
}

.lk-check input {
  position: absolute;
  opacity: 0;
  width: 16px;
  height: 16px;
  margin: 0;
}

.lk-check__box {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 4px;
  border-radius: var(--round-xs);
  border: 1px solid var(--border);
  background: var(--surface);
}

.lk-check input:checked + .lk-check__box {
  background: var(--primary);
  border-color: var(--primary);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 5'%3E%3Cpath d='M1 2.5L3 4.5L7 1' fill='none' stroke='%23fff' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 8px 5px;
}

.lk-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.lk-actions__right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.btn--outline-red {
  background: transparent;
  color: var(--primary);
  border: 1px solid var(--primary);
}

.btn--outline-red:hover {
  background: var(--surface);
  color: var(--primary);
}

.btn--ghost {
  background: transparent;
  color: var(--text-muted);
  border: 1px solid var(--text-muted);
}

.btn--ghost:hover {
  background: var(--surface);
  color: var(--text-gray);
}

.lk-pass {
  position: relative;
  display: block;
}

.lk-pass .field__input {
  padding-right: 44px;
}

.lk-pass__toggle {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}

.lk-pass__toggle img {
  width: 16px;
  height: 16px;
}

.lk-pass__toggle.is-visible::after {
  content: "";
  position: absolute;
  left: -2px;
  top: 7px;
  width: 20px;
  height: 1.5px;
  background: #9ca3af;
  border-radius: 1px;
  transform: rotate(-40deg);
  pointer-events: none;
}

@media (max-width: 1200px) {
  .lk-cards.catalog-grid-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lk-bonus-top {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .lk-title {
    font-size: 26px;
  }

  .lk-cards.catalog-grid-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .lk-addr-grid,
  .lk-form-row,
  .lk-form-row--3 {
    grid-template-columns: 1fr;
  }

  .lk-addr-card__row {
    grid-template-columns: 1fr 1fr;
  }

  .lk-actions,
  .lk-actions__right {
    flex-direction: column;
    align-items: stretch;
  }

  .lk-actions .btn,
  .lk-actions__right .btn {
    width: 100%;
  }

  .lk-cabinet-nav.mobile-only {
    display: block;
  }
}




