.catalog-new {
   --cat-white: #fff;
   --cat-brand: #fc5a5b;
   --cat-brand-dark: #e84e4f;
   --cat-text: #111;
   --cat-muted: #777;
   --cat-line: rgba(178, 178, 178, 0.45);
   --cat-shadow: 0 16px 48px rgba(159, 135, 113, 0.14);
   --cat-shadow-sm: 0 4px 20px rgba(178, 178, 178, 0.22);
   --cat-radius: 20px;
   --cat-radius-sm: 12px;
   --cat-radius-pill: 999px;
   --cat-ease: cubic-bezier(0.22, 1, 0.36, 1);
   color: var(--cat-text);
   background: #fff;
   overflow: clip;
   font-family: "Open Sans", system-ui, sans-serif;
}

.catalog-new,
.catalog-new *,
.catalog-new *::before,
.catalog-new *::after {
   box-sizing: border-box;
}

.catalog-breadcrumb {
   min-height: 46px;
   padding: 0;
   background: #fff;
   border-bottom: 1px solid #f7f1f1;
   font-size: 12px;
   line-height: 1.4;
   color: #aaa;
   overflow-x: auto;
   scrollbar-width: none;
}

.catalog-breadcrumb::-webkit-scrollbar {
   display: none;
}

.catalog-breadcrumb .wrapper {
   display: flex;
   align-items: center;
   min-height: 46px;
   white-space: nowrap;
}

.catalog-breadcrumb a {
   color: #aaa;
   text-decoration: none;
   transition: color 0.2s;
}

.catalog-breadcrumb a:hover {
   color: var(--cat-brand);
}

.catalog-breadcrumb__separator {
   margin: 0 8px;
   color: #d1d1d1;
}

.cat-hero {
   background: linear-gradient(135deg, #fff5f5 0%, #fff0f8 100%);
   border-bottom: 1px solid var(--cat-line);
   padding: 34px 0 32px;
   margin-top: 0;
}

.cat-hero__inner {
   display: flex;
   align-items: center;
   gap: 32px;
}

.cat-hero__text {
   flex: 1;
}

.cat-hero__eyebrow {
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 0.08em;
   text-transform: uppercase;
   color: var(--cat-brand);
   margin-bottom: 8px;
}

.cat-hero__title {
   font-size: 38px;
   font-weight: 800;
   line-height: 1.15;
   color: #111;
   margin: 0 0 12px;
}

.cat-hero__lead {
   color: #555;
   font-size: 15px;
   max-width: 720px;
   line-height: 1.6;
}

.cat-hero__badges {
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
   margin-top: 20px;
}

.cat-hero__badge {
   display: inline-flex;
   align-items: center;
   padding: 6px 14px;
   border-radius: var(--cat-radius-pill);
   background: var(--cat-white);
   border: 1.5px solid var(--cat-line);
   font-size: 13px;
   font-weight: 600;
   color: #111;
}

.subcat {
   --subcat-sticky-top: 50px;
   background: var(--cat-white);
   border-bottom: 1px solid var(--cat-line);
   position: sticky;
   top: var(--subcat-sticky-top);
   z-index: 130;
   box-shadow: 0 3px 10px rgba(62, 47, 38, 0.06);
}

.header-subcat .subcat {
   position: relative;
   top: auto;
}

#topmenu {
   position: relative;
   z-index: 120;
}

#topmenu ul li .win {
   z-index: 121;
}

.subcat__inner {
   display: flex;
   align-items: stretch;
   gap: 0;
   overflow: visible;
}

.subcat__links {
   min-width: 0;
   flex: 1;
   display: flex;
   overflow-x: auto;
   scrollbar-width: none;
}

.subcat__actions {
   flex-shrink: 0;
   display: flex;
   align-items: stretch;
   margin-left: auto;
   background: var(--cat-white);
   border-left: 1px solid var(--cat-line);
}

.subcat__links::-webkit-scrollbar {
   display: none;
}

.subcat__link {
   flex-shrink: 0;
   padding: 14px 20px;
   font-size: 13px;
   font-weight: 700;
   color: #555;
   text-decoration: none;
   border-bottom: 2px solid transparent;
   transition: color 0.2s, border-color 0.2s;
   white-space: nowrap;
}

.subcat__link:hover,
.subcat__link.is-active {
   color: var(--cat-brand);
   border-bottom-color: var(--cat-brand);
}

.subcat__catalog-btn {
   flex-shrink: 0;
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 14px 18px;
   font-size: 13px;
   font-weight: 700;
   color: var(--cat-white);
   background: var(--cat-brand);
   border: none;
   cursor: pointer;
   white-space: nowrap;
   transition: background 0.2s;
}

.subcat__catalog-btn:hover {
   background: var(--cat-brand-dark);
}

.subcat__catalog-btn__icon {
   display: flex;
   flex-direction: column;
   gap: 4px;
   width: 16px;
}

.subcat__catalog-btn__icon span {
   display: block;
   height: 2px;
   background: currentColor;
   border-radius: 2px;
}

.cat-overlay {
   position: fixed;
   inset: 0;
   background: rgba(0, 0, 0, 0.45);
   z-index: 199;
   opacity: 0;
   pointer-events: none;
   transition: opacity 0.3s;
}

.cat-overlay.is-open {
   opacity: 1;
   pointer-events: auto;
}

.cat-drawer {
   position: fixed;
   top: 0;
   left: 0;
   width: 320px;
   max-width: calc(100vw - 36px);
   height: 100%;
   background: var(--cat-white);
   z-index: 200;
   transform: translateX(-100%);
   transition: transform 0.32s var(--cat-ease);
   overflow-y: auto;
   box-shadow: var(--cat-shadow);
   display: flex;
   flex-direction: column;
}

.cat-drawer.is-open {
   transform: translateX(0);
}

.cat-drawer-lock {
   overflow: hidden;
}

.cat-drawer__head {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 20px 20px 16px;
   border-bottom: 1px solid var(--cat-line);
   position: sticky;
   top: 0;
   background: var(--cat-white);
   z-index: 1;
}

.cat-drawer__title {
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 0.1em;
   text-transform: uppercase;
   color: var(--cat-muted);
}

.cat-drawer__close {
   width: 32px;
   height: 32px;
   border-radius: 50%;
   background: none;
   border: 1.5px solid var(--cat-line);
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
   line-height: 1;
   color: #555;
   transition: border-color 0.2s, color 0.2s;
}

.cat-drawer__close:hover {
   border-color: var(--cat-brand);
   color: var(--cat-brand);
}

.cat-drawer__list {
   padding: 8px 0 24px;
   flex: 1;
}

.cat-drawer__item {
   display: flex;
   align-items: center;
   gap: 14px;
   padding: 12px 20px;
   text-decoration: none;
   font-size: 13px;
   font-weight: 700;
   color: #111;
   text-transform: uppercase;
   letter-spacing: 0.04em;
   border-bottom: 1px solid var(--cat-line);
   transition: background 0.15s, color 0.15s;
}

.cat-drawer__item:hover,
.cat-drawer__item.is-active {
   background: rgba(252, 90, 91, 0.05);
   color: var(--cat-brand);
}

.cat-drawer__item img {
   width: 44px;
   height: 44px;
   border-radius: 50%;
   object-fit: cover;
   flex-shrink: 0;
}

.cat-drawer__item-wrap {
   display: flex;
   align-items: stretch;
   border-bottom: 1px solid var(--cat-line);
}

.cat-drawer__item-wrap .cat-drawer__item {
   flex: 1;
   min-width: 0;
   border-bottom: 0;
   padding-right: 10px;
}

.cat-drawer__toggle {
   width: 48px;
   flex-shrink: 0;
   border: 0;
   border-left: 1px solid var(--cat-line);
   background: var(--cat-white);
   color: #555;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: background 0.15s, color 0.15s;
}

.cat-drawer__toggle:hover {
   background: rgba(252, 90, 91, 0.05);
   color: var(--cat-brand);
}

.cat-drawer__toggle span {
   width: 9px;
   height: 9px;
   border-right: 2px solid currentColor;
   border-bottom: 2px solid currentColor;
   transform: rotate(45deg);
   transition: transform 0.18s;
}

.cat-drawer__group.is-open .cat-drawer__toggle span {
   transform: rotate(-135deg);
}

.cat-drawer__sub-list {
   display: none;
}

.cat-drawer__group.is-open .cat-drawer__sub-list {
   display: block;
}

.cat-drawer__sub {
   display: block;
   padding: 9px 20px 9px 36px;
   font-size: 14px;
   color: #555;
   text-decoration: none;
   border-bottom: 1px solid var(--cat-line);
   transition: background 0.15s, color 0.15s;
}

.cat-drawer__sub--deep {
   padding-left: 52px;
   font-size: 13px;
}

.cat-drawer__sub:hover,
.cat-drawer__sub.is-active {
   background: #faf8f6;
   color: var(--cat-brand);
}

.catalog-new #catalog {
   padding-top: 0;
   margin-bottom: 48px;
   width: 100%;
   display: block;
   background: #fff;
   background-image: none;
}

.catalog-new #catalog .wrapper {
   display: block;
   width: 100%;
   margin-right: auto;
   margin-left: auto;
}

.catalog-new #catalog .result {
   width: 100%;
   padding: 0;
   display: block;
   background: transparent;
   overflow: visible;
}

.toolbar {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   padding: 20px 0 8px;
   flex-wrap: wrap;
}

.toolbar__count {
   font-size: 0.85rem;
   color: var(--cat-muted);
   margin: 0;
}

.toolbar__sort {
   display: flex;
   align-items: center;
   gap: 8px;
   margin-left: auto;
   color: #555;
   font-size: 0.82rem;
}

.toolbar__sort select {
   min-width: 0;
   height: auto;
   padding: 7px 12px;
   border: 1.5px solid var(--cat-line);
   border-radius: var(--cat-radius-sm);
   background-color: #fff;
   color: #333;
   font: inherit;
   cursor: pointer;
   outline: none;
}

.toolbar__sort select:hover,
.toolbar__sort select:focus {
   border-color: var(--cat-brand);
}

.catalog-new .filter-button {
   display: none;
   align-items: center;
   gap: 6px;
}

.catalog-new .filter-button a {
   flex: 0 0 36px;
   width: 36px;
   height: 36px;
   padding: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 8px;
   border: 1px solid var(--cat-line);
   color: #555;
   font-size: 0;
   line-height: 1;
   text-decoration: none;
   transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.catalog-new .filter-button a::before {
   content: "";
   display: block;
   width: 16px;
   height: 16px;
}

.catalog-new .filter-button a[data-columns="1"]::before {
   background: repeating-linear-gradient(to bottom, currentColor 0 2px, transparent 2px 6px);
}

.catalog-new .filter-button a[data-columns="2"]::before {
   background:
      linear-gradient(currentColor, currentColor) 0 0 / 7px 7px no-repeat,
      linear-gradient(currentColor, currentColor) 9px 0 / 7px 7px no-repeat,
      linear-gradient(currentColor, currentColor) 0 9px / 7px 7px no-repeat,
      linear-gradient(currentColor, currentColor) 9px 9px / 7px 7px no-repeat;
}

.catalog-new .filter-button a:hover,
.catalog-new .filter-button a.active {
   background: var(--cat-brand);
   border-color: var(--cat-brand);
   color: #fff;
}

.catalog-new .products,
.catalog-new #catalog .result .ajaxCatalog {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
   gap: 20px;
   padding: 16px 0 40px;
   width: 100%;
   height: auto;
   align-items: stretch;
   background: transparent;
   overflow: visible;
}

.catalog-new #catalog .result .ajaxCatalog.loading {
   min-height: 240px;
   height: auto;
}

.catalog-new .tovar {
   min-width: 0;
   height: 100%;
   width: 100%;
   background: var(--cat-white);
   border-radius: var(--cat-radius);
   box-shadow: var(--cat-shadow-sm);
   border: 0;
   overflow: hidden;
   display: flex;
   flex-direction: column;
   transition: transform 0.25s var(--cat-ease), box-shadow 0.25s;
}

.catalog-new #catalog .result .ajaxCatalog .tovar,
.catalog-new #catalog .result .ajaxCatalog[data-columns='1'] .tovar,
.catalog-new #catalog .result .ajaxCatalog[data-columns='2'] .tovar {
   width: 100%;
}

.catalog-new .tovar:hover {
   transform: translateY(-4px);
   box-shadow: var(--cat-shadow);
}

.catalog-new .tovar picture {
   display: block;
   width: 100%;
   height: auto;
   aspect-ratio: 1 / 1;
   overflow: hidden;
   background: #f5f0ee;
}

.catalog-new .tovar > a {
   display: block;
   width: 100%;
   flex: 0 0 auto;
   color: #111;
}

.catalog-new .tovar picture img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.4s var(--cat-ease);
}

.catalog-new .tovar:hover picture img {
   transform: scale(1.06);
}

.catalog-new .tovar .position {
   position: absolute;
   top: 10px;
   left: 10px;
   right: 10px;
   width: calc(100% - 20px);
}

.catalog-new .tovar .position .plash:empty,
.catalog-new .tovar .position .plash.s:empty {
   display: none;
}

.catalog-new .tovar .position .plash {
   border-radius: var(--cat-radius-pill);
   background: var(--cat-brand);
   color: #fff;
   font-size: 11px;
   font-weight: 700;
   padding: 4px 10px;
}

.catalog-new .tovar .position .like {
   display: none;
}

.catalog-new .tovar .info {
   width: 100%;
   min-width: 0;
   padding: 16px;
   flex: 1;
   display: flex;
   flex-direction: column;
}

.catalog-new .tovar .info .titleTovar {
   width: 100%;
   height: auto;
   min-height: 0;
   display: block;
   font-size: 0.98rem;
   font-weight: 700;
   color: #111;
   line-height: 1.3;
   margin-bottom: 6px;
}

.catalog-new .tovar .info .cardDetailsLink {
   display: block;
   color: inherit;
   text-decoration: none;
}

.catalog-new .tovar .info .article,
.catalog-new .tovar .info .desc {
   color: var(--cat-muted);
   font-size: 13px;
}

.catalog-new .tovar .info .price {
   width: 100%;
   display: block;
   font-size: 0.8rem;
   line-height: 1.5;
}

.catalog-new .tovar .info .price span {
   color: var(--cat-muted);
}

.catalog-new .tovar .info .flex {
   margin-top: auto;
   gap: 12px;
}

.catalog-new .tovar .info .button,
.catalog-new .tovar .info .buttonOrder,
.catalog-new .tovar .info .fastViewUr {
   width: 100%;
   min-height: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 8px 16px;
   border-radius: var(--cat-radius-pill);
   background: var(--cat-brand);
   border-color: var(--cat-brand);
   color: #fff;
   font-family: "Montserrat", system-ui, sans-serif;
   font-size: 0.75rem;
   font-weight: 700;
   transition: background 0.2s, transform 0.2s;
   margin: 10px auto;
}

.catalog-new .tovar .info .cardFooter {
   width: calc(100% + 32px);
   margin: auto -16px -16px;
   padding: 25px 16px 14px;
   border-top: 0;
   background: linear-gradient(var(--cat-line), var(--cat-line)) 0 12px / 100% 1px no-repeat;
}

.catalog-new .tovar .info .button:hover,
.catalog-new .tovar .info .buttonOrder:hover,
.catalog-new .tovar .info .fastViewUr:hover {
   background: var(--cat-brand-dark);
   transform: translateY(-1px);
}

.catalog-new #catalog .result a.bView {
   display: table;
   margin: 0 auto 40px;
   padding: 11px 22px;
   border-radius: var(--cat-radius-pill);
   border: 1.5px solid var(--cat-line);
   color: #111;
   text-decoration: none;
   transition: border-color 0.2s, color 0.2s;
}

.catalog-new #catalog .result a.bView:hover {
   border-color: var(--cat-brand);
   color: var(--cat-brand);
}

.cta-banner {
   background: linear-gradient(135deg, var(--cat-brand) 0%, var(--cat-brand-dark) 100%);
   border-radius: var(--cat-radius);
   padding: 36px 32px;
   text-align: center;
   color: #fff;
   margin-bottom: 48px;
}

.cta-banner__title {
   font-size: clamp(20px, 3vw, 28px);
   font-weight: 800;
   margin: 0 0 10px;
}

.cta-banner__text {
   font-size: 15px;
   opacity: 0.92;
   margin-bottom: 20px;
}

.cta-banner .btn {
   width: 100%;
}

.catalog-new .btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 14px 28px;
   border-radius: var(--cat-radius-pill);
   font-size: 14px;
   font-weight: 700;
   text-decoration: none;
   border: none;
   cursor: pointer;
   transition: background 0.25s, transform 0.25s;
}

.catalog-new .btn:hover {
   transform: translateY(-2px);
}

.catalog-new .btn--brand {
   background: #fff;
   color: var(--cat-brand);
}

.catalog-new .btn--brand:hover {
   background: #ffe8e8;
}

@media (max-width: 1170px) {
   .subcat {
      --subcat-sticky-top: 0px;
   }
}

@media (max-width: 600px) {

   .catalog-new #catalog .wrapper {
      width: calc(100% - 20px);
   }

   .catalog-breadcrumb {
      min-height: 38px;
      padding: 0;
   }

   .catalog-breadcrumb .wrapper {
      min-height: 38px;
      padding: 0 10px;
   }

   .cat-hero {
      padding: 24px 0 22px;
   }

   .cat-hero__inner {
      flex-direction: column;
   }

   .cat-hero__title {
      font-size: 26px;
   }

   .cat-hero__lead {
      font-size: 14px;
   }

   .subcat__link,
   .subcat__catalog-btn {
      padding: 12px 14px;
   }

   .toolbar {
      align-items: flex-end;
   }

   .toolbar__count {
      width: 100%;
   }

   .toolbar__sort {
      width: 100%;
      margin-left: 0;
   }

   .toolbar__sort select {
      flex: 1;
      min-width: 0;
   }

   .catalog-new .filter-button {
      display: flex;
      flex: 0 0 auto;
   }

   .catalog-new .products,
   .catalog-new #catalog .result .ajaxCatalog {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      padding: 14px 0 28px;
   }

   .catalog-new .tovar {
      border-radius: 8px;
   }

   .catalog-new .tovar .info {
      padding: 12px;
   }

   .catalog-new .tovar .info .cardFooter {
      width: calc(100% + 24px);
      margin-right: -12px;
      margin-bottom: -12px;
      margin-left: -12px;
      padding: 21px 12px 12px;
      background-position-y: 10px;
   }

   .catalog-new .tovar .info .titleTovar {
      font-size: 14px;
   }

   .catalog-new .tovar .info .price,
   .catalog-new .tovar .info .price span {
      font-size: 12px;
   }

   .catalog-new .tovar .info .button,
   .catalog-new .tovar .info .buttonOrder,
   .catalog-new .tovar .info .fastViewUr {
      font-size: 12px;
      padding: 9px 10px;
   }

   .cta-banner {
      padding: 24px 16px;
      margin-bottom: 32px;
   }

   .tovar .info .titleTovar,
	.catalog-new .tovar .info .titleTovar {
		font-size: 14px;
		font-weight: 400;
	}
}

@media (min-width: 601px) and (max-width: 980px) {
   .catalog-new .products,
   .catalog-new #catalog .result .ajaxCatalog {
      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
   }
}

@media (max-width: 380px) {
   .catalog-new .products,
   .catalog-new #catalog .result .ajaxCatalog {
      grid-template-columns: 1fr;
   }
}
