@charset "UTF-8";

@import url("reset.css");
@import url("fonts.css");
@import url("swiper-bundle.min.css");


:root{
    
    --app-height: 100vh;
    --headroom-height: auto;
    
  
    --c0: #FFFFFF; 
    --c1: #161616;
    --c2: #989898;
    --c3: #8759F2;
    --c4: rgba(22, 22, 22, .1);
    --c5: #F1F1F1;
    
    --wr: 40rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 80rem;
    --sl: max(1px, 1rem);
    
    --br1: 4rem;
    --br2: 8rem;
    --br3: 16rem;
    
    --gr1: linear-gradient(45deg, #febe0c, #fc3172, #8759f2, #8759f2, #0096fd, #26f900);
    
    --btn: max(48px, 56rem);
    --skew-w: 30rem;
    --btn-brd: max(2px, 2.5rem);
    --icon: max(24px, 28rem);

    
    --f-xs: max(10px, 12rem);
    --f-s: max(11px, 14rem);
    --f-d: max(14px, 16rem);
    --f-m: max(14px, 20rem);
    --f-b: max(14px, 24rem);
    --f-l: max(14px, 32rem);
    --f-xl: max(14px, 40rem);
    --f-xxl: max(14px, 56rem);
    
    --mw: 1920px; 
    
    
}


/* globals */

@media screen {

    html{font-size: 0.052vw;background-color: var(--c0);}

    .document{font-weight: 400;font-family: 'Montserrat', sans-serif;font-size: var(--f-d);line-height: 1.25;color: var(--c1);background-color: var(--c0);letter-spacing: normal;}
    
    .rub{white-space: nowrap;}
    .rub:not(:empty)::after{content: "\a0\20bd";display: inline;}
    
    .popup-active{}
    
    .wrapper{width: 100%;margin: 0 auto;padding: 0 var(--wr);max-width: var(--mw);}
    
    .preloader{background-color: var(--c0);position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 9999;visibility: hidden;opacity: 0;transition: all .25s 1s;display: flex;color: var(--c1);will-change: transform;}
     
    .loading{pointer-events: none;}
    .loading .preloader{transition-duration: 0s;opacity: 1;visibility: visible;}
    
    .icon{display: flex;max-height: 100%;align-items:center;justify-content:center;line-height: 0;max-width: 100%;width: auto;height: auto;}
    .cover,
    .contain{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-position: center;pointer-events: none;}
    .cover{object-fit: cover;}
    .contain{object-fit: contain;}
    .fill::after{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 1;}

    .button{display: inline-flex;justify-content: center;max-width: 100%;user-select: none;cursor: pointer;align-items: center;z-index: 1;position: relative;}
    .button:not(.fill){overflow: hidden;position: relative;}
    .button-text{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;position: relative;z-index: 2;min-width: 0;line-height: 1.2;}
    .button-icon{display: flex;align-items: center;justify-content: center;width: var(--icon);height: var(--icon);margin: 0 10rem;}
    
    .button .button-icon:first-child{margin-left: 0;}
    .button .button-icon:last-child{margin-right: 0;}
    
    .button__wide{width: 100%;}
    
    .button__default,
    .button__action{padding: 0 50rem;border-radius: var(--br1);height: var(--btn);background-color: var(--c1);border: var(--btn-brd) solid transparent;background-origin: border-box;}
    .button__default::before,
    .button__action::before{content: "";position: absolute;top: 0;left: 0;background-color: var(--c0);right: 0;bottom: 0;border-radius: calc(var(--br1) - var(--btn-brd));}
    .button__default .button-text,
    .button__action .button-text{font-weight: 700;}
    
    .button__action{background-image: var(--gr1);}
    .button__action:not(:hover) .button-text{background-image: var(--gr1);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
    .button__action .button-icon{color: var(--c3);}
    
    .button__secondary{padding: 10rem 0;border-radius: var(--br2);height: var(--btn);min-width: var(--btn);background-color: var(--c5);}
    .button__secondary .button-icon{width: max(30px, 36rem);height: max(22px, 24rem);}
    .button__secondary .button-icon:only-child{margin: 0 10rem;}
    .button__secondary .button-text{font-weight: 700;}
    .button__secondary .button-text:only-child{padding: 0 50rem;}
    
    .button__dense{padding: 0;min-width: var(--btn);}
    
    .button__cl .button-text{font-size: var(--f-m);}
    
     
    .title{line-height: 1;font-weight: 700;width: 100%;}
    .title__default{font-size: var(--f-l);}
    .title__large{font-size: var(--f-xl);}
    
    .title b{color: var(--c3);font-weight: inherit;}
    
    .container{display: flex;flex-direction: column;min-height: var(--app-height);overflow-x: clip;}
    
    .header{margin-bottom: 60rem;position: relative;}
    
    .main{margin-top: 0;flex: auto;display: flex;flex-direction: column;}
   
    .section{position: relative;z-index: 1;margin-bottom: 120rem;}
    .section:last-child{margin-bottom: 0;}
    .section:only-child{flex: auto;}
    
    .logo{display: flex;flex-direction: column;align-items: center;line-height: 1;text-align: center;white-space: nowrap;}
    .logo-title{width: 100%;}
    .logo-subtitle{font-size: var(--f-s);margin-top: 1em;letter-spacing: 1.5em;font-weight: 500;text-transform: uppercase;padding-left: 1.5em;}
    
    .topbar{display: grid;grid-template-columns: repeat(5, minmax(0, 1fr));grid-gap: 0 var(--gap);grid-template-rows: 2.5fr .5fr 1fr;align-items: center;position: relative;z-index: 1;}
    
    .topbar-main{grid-row: 1/4;grid-column: 1/3;background-color: var(--c1);color: var(--c0);margin-left: var(--awr);padding: 0 0 0 var(--wr);display: grid;grid-template-columns: 1fr 1fr;grid-template-rows: subgrid;grid-gap: 0 var(--gap);position: relative;z-index: 1;align-items: center;margin-right: calc(2 * var(--gap));}
    .topbar-spacer{width: calc(2 * var(--gap));position: absolute;left: 100%;top: 0;height: 100%;background-color: inherit;z-index: -1;}
    .topbar-logo{padding: 30rem 0;margin-right: calc(-1 * var(--gap));}
    .topbar-location{margin-left: var(--gap);margin-right: calc(-1 * var(--gap));}
    .topbar-search{grid-column: 1/-1;position: relative;overflow: hidden;z-index: 1;grid-row: 3/4;display: flex;min-height: 100%;padding-right: 0;margin-right: calc(var(--gap) / -2 + 7.5rem);}
    .topbar-search-inner{flex: auto;background-color: var(--c0);color: var(--c1);border-radius: var(--br1) 0 0 var(--br1);display: flex;align-items: center;}
    .topbar-nav{grid-column: 3/6;overflow: hidden;padding: 20rem 0;}
    .topbar-nav ul{display: flex;flex-wrap: wrap;justify-content: space-between;margin: -5rem -10rem;}
    .topbar-nav li{padding: 10rem 0;font-size: var(--f-b);line-height: 1;font-weight: 700;text-transform: uppercase;margin: 0 10rem;position: relative;pointer-events: none;}
    .topbar-nav li::after{content: "";width: 100%;position: absolute;bottom: 0;left: 0;width: 100%;height: 4rem;background-image: var(--gr1);will-change: transform;transform-origin: left;transition: transform .25s;}
    .topbar-nav li a{pointer-events: all;}
    .topbar-nav li .current{color: var(--c3);}
    .topbar-action{grid-column: 3/6;grid-row: 3/4;display: flex;margin-left: calc(-1 * var(--gap));padding: 0;margin-top: auto;}
    .topbar-action-item:not(:first-child){margin-left: 40rem;}
    .topbar-action-item:first-child{margin-right: auto;}
    
    .topbar-search,
    .topbar-action{transform: translateY(-10rem);}
    
    .topbar-spacer,
    .topbar-search::after{transform-origin: top;transform: skewX( calc(-1rad * var(--header-skew)) );}
    
    .topbar-search::after{content: "";border-radius: 0 var(--br1) var(--br1) 0;min-height: 100%;width: var(--gap);flex: none;background-color: var(--c0);}
    
    .topbar-spacer{}
    
    .search{display: flex;align-items: center;padding: 10rem 15rem;}
    .search-input{text-overflow: ellipsis;flex: auto;min-width: 0;}
    .search-button{flex: none;margin-right: 20rem;order: -1;display: flex;align-items: center;justify-content: center;width: var(--icon);height: var(--icon);}
    
    .action-button{position: relative;}
    
    .main-wrapper{display: grid;grid-template-columns: repeat(5, minmax(0, 1fr));grid-gap: var(--gap);align-items: flex-start;margin-top: -20rem;}
    
    .content{grid-column: 2/-1;padding-top: 20rem;}
    
    .mainnav{position: relative;order: -1;}
    
    .footer{overflow: hidden;margin-top: 150rem;padding: 50rem 0;position: relative;z-index: 1;}
    .footer::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><rect width="2" height="2" /></svg>');background-size: 16px 16px;background-position: bottom right;opacity: .15;z-index: -1;}
    .footer-grid{grid-template-columns: repeat(5, minmax(0, 1fr));grid-gap: 50rem var(--gap);align-items: flex-start;display: grid;}
    .footer-logo{padding: 0;}
    .footer-contacts{display: grid;grid-template-columns: auto;grid-gap: 10rem;}
    .footer-contacts-tel{font-size: var(--f-b);}
    .footer-contacts-email{font-size: var(--f-m);}
    .footer-nav{grid-column: 4/6;display: flex;justify-content: flex-start;font-size: var(--f-m);}
    .footer-nav ul{column-count: 2;column-gap: 40rem;}
    .footer-nav li:not(:first-child){margin-top: .5em;}
    .footer-nav li .current{color: var(--c3);}
    .footer-copyright{opacity: .7;grid-column: 1/-1;}
    
    .menu{display: grid;grid-template-columns: auto;grid-gap: 10rem;position: relative;will-change: transform;padding-top: 20rem;}
    .menu-item{display: flex;align-items: center;padding: 15rem;border-radius: var(--br2);position: relative;z-index: 1;overflow: hidden;}
    .menu-item::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;background-color: var(--c1);opacity: .05;transition: opacity .15s;}
    .menu-item-icon{display: flex;align-items: center;justify-content: center;width: var(--icon);height: var(--icon);flex: none;margin-right: 20rem;}
    .menu-item-text{font-weight: 500;text-overflow: ellipsis;overflow: hidden;}
    .menu-item:has(.current){background-color: var(--c3);color: var(--c0);}
    .menu-item:has(.current)::before{opacity: 0;}
    
    .breadcrumbs{margin-bottom: 40rem;overflow: hidden;font-size: var(--f-s);}
    .breadcrumbs ul{display: flex;flex-wrap: wrap;margin: -.5em;}
    .breadcrumbs li{padding: .5em;display: flex;align-items: center;color: var(--c2);}
    .breadcrumbs li:not(:last-child)::after{content: "\2022";padding-left: 1em;color: var(--c2);}
    .breadcrumbs li:last-child{color: var(--c3);pointer-events: none;}
    
    .section-header{display: grid;grid-template-columns: 1fr auto;grid-gap: 0 100rem;align-items: flex-end;grid-template-rows: auto 1fr;}
    .section-header:not(:last-child){margin-bottom: 60rem;}
    .section-header-title{max-width: 800rem;}
    .section-header-subtitle{margin-top: 20rem;grid-column: 1/2;}
    .section-header-action{display: inline-grid;grid-auto-flow: column;grid-gap: 40rem;align-items: center;}
    
    .tabs{}
    .tabs ul{display: flex;flex-wrap: wrap;margin: -15rem 0 0 -15rem;}
    .tabs li{position: relative;margin: 15rem 0 0 15rem;padding: 15rem 20rem;text-transform: lowercase;border-radius: var(--br1);z-index: 1;}
    .tabs li::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;border: var(--sl) solid;border-radius: inherit;opacity: .1;}
    .tabs li::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;box-shadow: 0 0 20rem;border-radius: inherit;opacity: 0;z-index: -1;}
    .tabs li.current{color: var(--c3);pointer-events: none;}
    .tabs li.current::before{opacity: 1;}
    
    .catalog-tabs:not(:last-child){margin-bottom: 60rem;}
    
    .catalog-toolbar{margin-bottom: 60rem;display: grid;grid-template-columns: auto auto 1fr auto;align-items: center;grid-gap: 40rem;line-height: 0;}
    .catalog-filter-reset{margin-right: auto;}
    .catalog-filter-reset a:not(:hover){opacity: .5;}
    .catalog-total{grid-column: 4/5;}
    
    .catalog{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 0 var(--gap);}
    .catalog-card{margin: 0 -30rem;position: relative;width: calc(100% + 60rem);}
    .catalog-card::before{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: -1;background-image: var(--gr1);filter: blur(10rem);opacity: 0;}
    
    .carousel-buttons{display: inline-grid;grid-auto-flow: column;grid-gap: 15rem;}
    
    .tooltipster-base{position: absolute;z-index: 999;pointer-events: none;background-color: var(--c0);color: var(--c1);padding: 15rem 20rem;font-size: var(--f-s);border-radius: var(--br1);transition: all 0s 0s!important;max-width: 220rem;box-shadow: 0 0 10rem var(--c4);}
    
    .textbox{max-width: 1000rem;}
    .textbox p,
    .textbox ul{margin: 1em 0;}
    .textbox ul:first-child{margin-top: 0;}
    .textbox ul:last-child{margin-bottom: 0;}
    .textbox li{position: relative;padding-left: 1.2em;}
    .textbox li:not(:first-child){margin-top: .5em;}
    .textbox li::before{content: "\2022";position: absolute;left: 0;}
    .textbox h2,
    .textbox h3{font-weight: 700;margin-bottom: 1em;font-size: var(--f-b);}
    .textbox h2:not(:first-child),
    .textbox h3:not(:first-child){margin-top: 2em;}
    .textbox a:not(.button){text-decoration: underline;}
   
     
    .social{display: flex;margin: -5rem;flex-wrap: wrap;}
    .social-item{margin: 5rem;width: max(30px, 40rem);height: max(30px, 40rem);border: var(--sl) solid;border-radius: 50%;flex: none;display: inline-flex;align-items: center;justify-content: center;padding: 5rem;}
    .social-item .icon{max-width: max(18px, 22rem);max-height: max(18px, 22rem);}
    
    .formbox{display: grid;grid-template-columns: auto;grid-gap: 60rem;}
    .formbox-group{display: grid;grid-template-columns: auto;grid-gap: 30rem;}
    .formbox-group-caption{font-weight: 700;font-size: var(--f-m);}
    .formbox-row{display: flex;overflow: hidden;}
    .formbox-cell{flex: 1;overflow: hidden;display: flex;}
    .formbox-cell:not(:first-child){margin-left: 20rem;}
    .formbox-note{min-height: 100%;display: flex;align-items: center;font-size: var(--f-s);opacity: .7;}
 
    .range{position: absolute;bottom: 0%;left: 0;z-index: 1;display: flex;align-items: center;right: 0;margin: 0 var(--br1);background-color: var(--c3);}

    .range .asRange-pointer{position: absolute;left: 0;width: 12rem;height: 12rem;background-color: var(--c3);border-radius: 50%;cursor: grab;z-index: 2;margin-left: -6rem;}
    .range .asRange-pointer:active{cursor: grabbing;}
    .range .asRange-pointer_active{z-index: 3;}
    .range .asRange-selected{background-color: var(--c3);position: relative;left: 0;height: var(--sl);width: 0;z-index: 1;}
       
    .textfield{display: flex;min-width: 0;width: 100%;align-items: baseline;border-radius: var(--br1);background-color: var(--c5);position: relative;}
    .textfield-input{resize: none;border-radius: inherit;}
    .textfield-input,
    .textfield-input-range{text-overflow: ellipsis;font-size: var(--f-m);letter-spacing: -.01em;flex: auto;padding: 20rem 25rem;min-width: 0;}
    .textfield-input:not(textarea),
    .textfield-input-range{overflow: hidden;white-space: nowrap;}
    .textfield-input-range[data-prefix]::before{content: attr(data-prefix) "\a0";}
    .textfield-input-range::before,
    .textfield-input-range::after{opacity: .4;font-size: var(--f-d);}
    .textfield-input-range + .textfield-input-range{flex: none;padding-left: 0;}
    .textfield-prefix{flex: none;margin-left: 25rem;letter-spacing: normal;color: var(--c2);}
    .textfield-suffix{flex: none;margin-right: 25rem;letter-spacing: normal;color: var(--c2);}
    .textfield-selector-icon{flex: none;margin-right: 25rem;color: var(--c3);display: flex;align-items: center;justify-content: center;width: max(8px, 10rem);height: max(8px, 10rem);cursor: pointer;}
    
    .checkbox{position: relative;overflow: hidden;user-select: none;}
    .checkbox-label{position: relative;display: flex;align-items: center;}
    .checkbox-icon{width: 1.5em;height: 1.5em;position: relative;display: flex;align-items: center;justify-content: center;padding: .25em;flex: none;cursor: pointer;margin-right: 10rem;border: var(--sl) solid var(--c2);transition: all .15s;}
    .checkbox-icon .icon{transform: scale(0);transition: transform .15s;will-change: transform;}
    .checkbox-title a{text-decoration: underline;}
    .checkbox-control{position: absolute;right: 100%;width: 0;height: 0;opacity: 0;}
    
    .checkbox-control[type="checkbox"] ~ .checkbox-icon{border-radius: var(--br1);}
    .checkbox-control[type="radio"] ~ .checkbox-icon{border-radius: 50%;background-clip: content-box;}
    
    .checkbox-control:checked ~ .checkbox-icon{background-color: var(--c3);color: var(--c0);border-color: var(--c3);}
    .checkbox-control:checked ~ .checkbox-icon .icon{transform: scale(1);}
    .checkbox-control:checked ~ .checkbox-title{}

    .slider{display: flex;flex-direction: column;width: 100%;user-select: none;padding: 0 var(--sl);}
    .slider-title{font-weight: 700;margin-bottom: 10rem;}
    .slider-line{display: flex;align-items: center;width: 100%;background-image: linear-gradient(var(--c4), var(--c4));background-repeat: no-repeat;background-size: 100% var(--sl);background-position: center;}
    .slider-label{cursor: pointer;flex: 1;display: flex;justify-content: center;min-width: 0;position: relative;}
    .slider-label-inner{display: flex;width: 100%;flex: none;justify-content: center;visibility: hidden;position: relative;}
    .slider-label-text{flex: none;white-space: nowrap;background-color: var(--c0);font-size: var(--f-s);overflow: hidden;padding: 5rem 10rem;color: var(--c3);border: var(--sl) solid;border-radius: var(--br1);pointer-events: none;}
    .slider-label:first-child .slider-label-inner{justify-content: flex-start;}
    .slider-label:last-child .slider-label-inner{justify-content: flex-end;}
    .slider-control{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;overflow: hidden;z-index: -1;}
    .slider-control:checked ~ .slider-label-inner{visibility: visible;}
    
    .filters{display: grid;grid-template-columns: auto;grid-gap: 50rem;}
    .filter-group-caption{font-size: var(--f-b);font-weight: 500;margin-bottom: 20rem;font-weight: 700;}
    .filter-group-list{display: grid;grid-template-columns: auto;grid-gap: 15rem;}
    
    .popup{position: fixed;top: 0;left: 0;height: 100%;width: 100%;z-index: 999;display: flex;}
    .popup-inner{padding: 40rem var(--wr);min-height: 100%;display: flex;flex-direction: column;width: 100%;overflow: auto;overflow: -moz-scrollbars-none!important;scrollbar-width: none;}
    .popup-inner::-webkit-scrollbar{display: none;}
    
    .popup-close{margin-left: auto;}
    .popup-footer{display: grid;grid-template-columns: auto;grid-gap: 10rem;}
    
    .aside{max-width: 480rem;background-color: var(--c0);color: var(--c1);transition: transform .25s;will-change: transform;}
    .aside:not(.active){transform: translateX(-100%);}
    
    .aside .popup-inner{padding-bottom: 0;}
    .aside .popup-header{position: relative;display: flex;margin-bottom: 40rem;}
    .aside .popup-close{margin-left: auto;}
    .aside .popup-content{margin-bottom: auto;}
    .aside .popup-footer{margin: 50rem var(--awr) -40rem;position: sticky;bottom: 0;z-index: 1;background-image: linear-gradient(transparent, var(--c0), var(--c0));padding: 40rem var(--wr);}
    
    .popup-overlay{background-color: var(--c1);opacity: 0;visibility: hidden;transition: all .25s;z-index: 99;position: fixed;top: 0;left: 0;width: 100%;height: 100%;}
    
    .popup.active ~ .popup-overlay{visibility: visible;opacity: .8;}
    
    
    
    
    .filter-fb{position: fixed;bottom: 0;right: 0;margin: 30rem;width: 80rem;height: 80rem;display: flex;align-items: center;justify-content: center;padding: 25rem;background-color: var(--c1);z-index: 10;border-radius: 50%;box-shadow: 0 0 5rem var(--c3);user-select: none;cursor: pointer;will-change: transform;transition: transform .25s;}
    
 
    .popup-active .filter-fb,
    
    .filter-fb:not(.active){transform: scale(0);}
    
    .product-spinner{display: grid;grid-template-columns: auto 1fr auto;grid-gap: 0 var(--btn-brd);background-image: var(--gr1);border-radius: var(--br1);overflow: hidden;border: var(--btn-brd) solid transparent;height: var(--btn);background-origin: border-box;}
    .product-spinner-control{display: flex;align-items: center;justify-content: center;background-color: var(--c0);padding: 0 20rem;font-size: var(--f-l);font-weight: 500;text-align: center;position: relative;line-height: 1;user-select: none;}
    .product-spinner-control:first-child{border-radius: calc(var(--br1) - var(--btn-brd)) 0 0 calc(var(--br1) - var(--btn-brd));margin-right: calc(var(--skew-w) / 2);padding-right: 5rem;}
    .product-spinner-control:last-child{border-radius: 0 calc(var(--br1) - var(--btn-brd)) calc(var(--br1) - var(--btn-brd)) 0;margin-left: calc(var(--skew-w) / 2);padding-left: 5rem;}
    .product-spinner-input-holder{display: flex;margin: 0 calc(var(--skew-w) / 2);background-color: var(--c0);position: relative;}
    .product-spinner-input{padding: 0 5rem;text-align: center;font-size: var(--f-b);text-overflow: ellipsis;width: 100%;min-width: 0;color: var(--c3);font-weight: 500;}
    .product-spinner-control:first-child::after,
    .product-spinner-control:last-child::before,
    .product-spinner-input-holder::before,
    .product-spinner-input-holder::after{content: "";background-color: inherit;width: var(--skew-w);position: absolute;top: calc(-1 * var(--btn-brd));bottom: calc(-1 * var(--btn-brd));transform: translateZ(0);}
    .product-spinner-control:first-child::after{left: 100%;clip-path: polygon(-1px -1px, calc(100% + 1px) calc(100% + 1px), -1px calc(100% + 1px));}
    .product-spinner-input-holder::before{right: 100%;clip-path: polygon(-1px -1px, calc(100% + 1px) -1px, calc(100% + 1px) calc(100% + 1px));}
    .product-spinner-input-holder::after{left: 100%;clip-path: polygon(-1px -1px, calc(100% + 1px) -1px, -1px calc(100% + 1px));}
    .product-spinner-control:last-child::before{right: 100%;clip-path: polygon(calc(100% + 1px) -1px, calc(100% + 1px) calc(100% + 1px), -1px calc(100% + 1px));}
    
    .shopcart{display: grid;width: 100%;grid-template-columns: auto;grid-gap: 60rem;}
    .shopcart-row{display: grid;grid-template-columns: 2fr 1fr .75fr auto;grid-gap: 30rem;align-items: center;}
    .shopcart-delete{margin-left: auto;text-align: right;order: 1;}
    .shopcart-price{margin-left: auto;text-align: right;font-size: var(--f-b);font-weight: 500;}
    
    .map{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;flex-direction: column;user-select: none;}
  
    .card-1{padding: 30rem 30rem;background-color: var(--c0);border-radius: var(--br2);}
    .card-1 .card-header{display: grid;grid-template-columns: 1fr auto;grid-gap: 20rem;align-items: center;}
    .card-1 .card-header-title{font-size: var(--f-xs);}
    .card-1 .card-header-action{display: flex;align-items: center;justify-content: center;width: max(18px, 22rem);height: max(18px, 22rem);z-index: 2;position: relative;cursor: pointer;line-height: 0;}
    .card-1 .card-header-action::before{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: -1;margin: -10rem;border-radius: 50%;background-color: var(--c5);will-change: transform;transition: transform .25s;transform: scale(0);}
    
    .card-1 .card-header-action-visible,
    .card-1 .card-header-action-hidden{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
    .card-1 .card-header-action-hidden{color: var(--c3);}
    
    .card-1 .card-header-action.active .card-header-action-visible,
    .card-1 .card-header-action:not(.active) .card-header-action-hidden{visibility: hidden;}
    
    .card-1 .card-media{position: relative;overflow: hidden;grid-column: 1/-1;display: flex;}
    .card-1 .card-media::before{content: "";flex: none;width: 0;padding-top: 75%;}
    .card-1 .card-content{margin: 20rem 0 0;flex: auto;display: flex;flex-direction: column;}
    .card-1 .card-title{font-weight: 700;text-transform: uppercase;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;margin-bottom: auto;}
    .card-1 .card-price{margin-top: 15rem;display: flex;flex-direction: column;align-items: flex-start;}
    .card-1 .card-price-title{font-size: var(--f-b);font-weight: 300;z-index: 2;position: relative;cursor: help;}
    .card-1 .card-price-title .button{pointer-events: none;}
    .card-1 .card-price-title .button-icon{opacity: .5;}
    .card-1 .card-price-subtitle{opacity: .7;margin-top: .5em;font-size: var(--f-s);}
    .card-1 .card-footer{margin-top: 30rem;position: relative;z-index: 2;}
    .card-1 .card-footer .button:not(:first-child){display: none;}
   
    .card-2{flex-direction: row;align-items: flex-start;}
    .card-2 .card-header{position: relative;overflow: hidden;display: flex;border: var(--sl) solid var(--c4);border-radius: var(--br1);flex: none;width: 100rem;margin-right: 20rem;}
    .card-2 .card-header::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-2 .card-media{position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: 10%;}
    .card-2 .card-content{min-height: 100rem;display: flex;flex-direction: column;justify-content: center;}
    .card-2 .card-title{font-weight: 700;text-transform: uppercase;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
    .card-2 .card-subtitle{font-size: var(--f-s);opacity: .7;margin-top: 5rem;}
    .card-2 .card-price{font-size: var(--f-m);margin-top: 10rem;}
    
    .card-3{background-color: var(--c0);padding: 40rem 30rem;border-radius: var(--br2);box-shadow: 0 0 20rem var(--c4);}
    .card-3 .card-header{margin-bottom: 60rem;}
    .card-3 .card-title{font-weight: 700;}
    .card-3 .card-subtitle{margin-top: 5rem;font-size: var(--f-s);}
    .card-3 .card-content{margin-bottom: auto;}
    .card-3 .card-footer{margin-top: 30rem;font-size: var(--f-s);color: var(--c2);}
    
}

/* sections */

@media screen {
    
    
    .s1-2{position: relative;padding: calc(var(--gap) / 2);margin: calc(var(--gap) / -2) calc(var(--gap) / -1);overflow: hidden;}
    .s1-2::before,
    .s1-2::after{content: "";position: absolute;top: 0;height: 100%;width: calc(var(--gap) / 2);z-index: 2;}
    .s1-2::before{left: 0;background-image: linear-gradient(to right, var(--c0), var(--c0), transparent);}
    .s1-2::after{right: 0;background-image: linear-gradient(to left, var(--c0), var(--c0), transparent);}
    .s1-2 .swiper{overflow: visible;}
    .s1-2 .swiper-slide{padding: 0 calc(var(--gap) / 2);height: auto;display: flex;transition: opacity .15s;}
    .s1-2 .swiper-slide:not(.swiper-slide-visible){opacity: 0;}
   
    .s2-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 0 var(--gap);grid-template-areas: "a2 a3" "a2 a4" "a2 a5";grid-template-rows: auto auto 1fr;align-items: flex-start;}
    .s2-2{grid-area: a2;border-radius: var(--br2);border: var(--sl) solid var(--c4);overflow: hidden;padding: 30rem;display: flex;justify-content: center;align-items: center;position: sticky;top: 20rem;}
    .s2-2::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s2-3{grid-area: a3;}
    .s2-4{grid-area: a4;margin-top: 80rem;}
    .s2-5{grid-area: a5;margin-top: 80rem;margin-bottom: auto;}
    .s2-6{display: grid;grid-template-columns: auto 1fr;grid-gap: 15rem;align-items: center;line-height: 1;}
    .s2-6-1{pointer-events: none;border-radius: var(--br2);height: var(--btn);min-width: var(--btn);background-color: var(--c5);position: relative;} 
    .s2-7{display: inline-grid;grid-auto-flow: column;grid-gap: 20rem;align-items: center;margin-right: auto;}
    .s2-7-1{font-weight: 700;font-size: var(--f-l);}
    .s2-7-2{font-size: var(--f-l);text-decoration: line-through;opacity: .5;}
    .s2-7-3 .button{cursor: help;display: flex;}
    .s2-8{margin-top: 10rem;opacity: .8;font-size: var(--f-s);}
    .s2-9{margin-top: 25rem;}
    .s2-10{display: grid;grid-template-columns: repeat(5, minmax(0, 1fr));grid-gap: 10rem;}
    .s2-10-1{grid-column: 1/3;}
    .s2-10-2{grid-column: 3/5;}
    .s2-11{display: grid;grid-template-columns: repeat(5, minmax(0, 1fr));grid-gap: 10rem;}
    .s2-11-1{position: relative;display: flex;border-radius: var(--br1);border: var(--sl) solid;overflow: hidden;padding: 15rem;align-items: center;justify-content: center;color: var(--c5);}
    .s2-11-1.current{border-color: var(--c1);pointer-events: none;}
    .s2-11-1::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s2-12{margin-bottom: 20rem;font-weight: 700;font-size: var(--f-m);}
    .s2-13{display: grid;grid-template-columns: auto;grid-gap: 10rem;}
    
    .s3-1{position: relative;overflow: hidden;}
    .s3-2 .swiper{margin-left: -10rem;}
    .s3-2 .swiper-slide{width: auto!important;padding-left: 10rem;}
    .s3-2 img{height: 250rem;width: auto;}
    .s3-3{} 
    .s3-3 .carousel-buttons{display: flex;justify-content: space-between;height: 100%;position: absolute;top: 0;left: 0;z-index: 1;pointer-events: none;right: 0;margin: 0 -1px;}
    .s3-3 .carousel-button{display: flex;align-items: center;}
    .s3-3 .carousel-button__prev{padding-right: 80rem;background-image: linear-gradient(90deg, var(--c0), transparent);}
    .s3-3 .carousel-button__next{padding-left: 80rem;background-image: linear-gradient(90deg, transparent, var(--c0));}
    .s3-3 .carousel-button .button{pointer-events: all;}
    .s3-3 .carousel-button.swiper-button-disabled{visibility: hidden;}
    
    .s4-1{display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));grid-gap: 0 var(--gap);align-items: flex-start;grid-template-rows: auto 1fr;}
    .s4-2{grid-column: 1/3;grid-row: 1/3;}
    .s4-3{border: var(--sl) solid var(--c4);padding: 30rem 25rem;display: grid;grid-template-columns: auto;grid-gap: 40rem;border-radius: var(--br2);}
    .s4-5-1{font-weight: 700;font-size: var(--f-m);margin-bottom: 10rem;}
    .s4-6{font-size: var(--f-s);}
    .s4-7{font-weight: 700;}
    .s4-7-1{margin-bottom: 5rem;}
    .s4-7-2{font-size: var(--f-xl);}
    .s4-8{grid-column: 3/4;margin-left: auto;max-width: 440rem;width: 100%;position: sticky;top: 20rem;}
    
    .s5-1{display: grid;grid-template-columns: auto;grid-gap: var(--gap);align-items: flex-start;}
    .s5-2{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap: 60rem var(--gap);}
    .s5-3{display: flex;position: relative;overflow: hidden;border-radius: var(--br2);background-color: var(--c4);border: var(--sl) solid var(--c4);}
    .s5-3::before{content: "";flex: none;width: 0;padding-top: 80%;}
    .s5-4{}
    .s5-4-1{margin-bottom: 20rem;font-weight: 700;}
    .s5-4-2 a{font-size: var(--f-l);font-weight: 300;}
    
    .s6-1{position: relative;overflow: hidden;z-index: 1;display: flex;border-radius: var(--br2);}
    .s6-1::before{content: "";flex: none;width: 0;padding-top: 60%;}
    .s6-2{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .s6-3{padding-left: 40rem;grid-column: 1/4;font-weight: 900;font-size: var(--f-xxl);line-height: 1.2;text-transform: uppercase;}
    .s6-3 b{font-weight: inherit;position: relative;}
    .s6-3 b::after{content: "";width: 100%;position: absolute;top: 100%;left: 0;width: 100%;height: max(1px, .15em);background-image: var(--gr1);will-change: transform;transform-origin: left;transition: transform .25s;}
    .s6-4{margin-right: 40rem;border: max(1px, .2em) solid;padding: 20rem;font-weight: 700;display: flex;align-items: center;}
    .s6-4::before{content: "";flex: none;width: 0;padding-top: 75%;}
    .s6-5{position: relative;z-index: 1;padding: 40rem 0;display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));grid-gap: var(--gap);align-items: flex-start;}
    
    .s7-2{position: relative;padding: calc(var(--gap) / 2);margin: calc(var(--gap) / -2) calc(var(--gap) / -1);overflow: hidden;}
    .s7-2::before,
    .s7-2::after{content: "";position: absolute;top: 0;height: 100%;width: calc(var(--gap) / 2);z-index: 2;}
    .s7-2::before{left: 0;background-image: linear-gradient(to right, var(--c0), var(--c0), transparent);}
    .s1-2::after{right: 0;background-image: linear-gradient(to left, var(--c0), var(--c0), transparent);}
    .s7-2 .swiper{overflow: visible;}
    .s7-2 .swiper-slide{padding: 0 calc(var(--gap) / 2);height: auto;display: flex;transition: opacity .15s;}
    .s7-2 .swiper-slide:not(.swiper-slide-visible){opacity: 0;}
    
    .s8-1{display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: 40rem;}
    .s8-2{border-radius: var(--br2);background-image: var(--gr1);border: var(--btn-brd) solid transparent;background-origin: border-box;position: relative;z-index: 1;}
    .s8-2::before{content: "";position: absolute;top: 0;left: 0;background-color: var(--c0);right: 0;bottom: 0;border-radius: calc(var(--br2) - var(--btn-brd));}
    .s8-3{margin-top: 60rem;display: flex;justify-content: center;}
    .s8-4{text-align: center;position: relative;z-index: 1;padding: 40rem;}
    .s8-4-1{font-weight: 700;margin-bottom: 20rem;}
    .s8-4-2{font-size: var(--f-s);}
    
    
}

@media screen and (max-width: 1023.98px) {
    
    :root{

        --wr: 15rem;
        
        --gap: 30rem;

        --btn: 44rem;
        --skew-w: 15rem;
        --btn-brd: 2rem;
        --icon: 22rem;


        --f-xs: 10rem;
        --f-s: 12rem;
        --f-d: 14rem;
        --f-m: 16rem;
        --f-b: 18rem;
        --f-l: 20rem;
        --f-xl: 24rem;
        --f-xxl: 28rem;

        --mw: 680rem; 
    
        
    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
    
    
    .button__default,
    .button__action{width: 100%;padding: 0 20rem;}
    
    .button__cl .button-text{font-size: var(--f-d);}
    
    .header{margin-bottom: 30rem;position: sticky;top: 0;z-index: 99;background-color: var(--c1);color: var(--c0);}
    
    .logo{max-width: none;}
    .logo-subtitle{font-size: var(--f-xs);}
    
    .topbar{grid-template-columns: 1fr auto;grid-template-rows: auto;}
    .topbar-main{grid-template-columns: auto;grid-template-rows: auto;grid-row: auto;grid-column: auto;padding: 10rem var(--wr);margin: 0 var(--awr);}
    .topbar-search{display: none;}
    .topbar-logo{margin: 0;padding: 0;max-width: 32rem;}
    .topbar-mobile-nav{display: grid;grid-auto-flow: column;grid-gap: 30rem;}
    
    .action-button-value.active{width: 8rem;height: 8rem;border-radius: 50%;background-color: transparent;overflow: hidden;line-height: 0;padding: 0;transform: translate(100%, -50%);background-image: var(--gr1);position: absolute;top: 0;right: 0;}
    
    .topbar::before,
    .topbar-nav,
    .topbar-action,
    .topbar-location,
    .topbar-spacer, 
    .topbar-search::after{display: none;}
    
    .main-wrapper{grid-template-columns: minmax(0, 1fr);margin: 0;}
    .mainnav{display: none;}
    .content{grid-column: auto;padding: 0;}
    
    .footer{margin-top: 100rem;padding: 60rem 0 30rem;}
    .footer-grid{grid-template-columns: 1fr 1fr;grid-gap: var(--gap) 20rem;}
    .footer-contacts,
    .footer-social,
    .footer-nav{grid-column: 1/-1;}
    .footer-nav ul{column-count: 1;}
    .footer-contacts-email,
    .footer-nav{font-size: var(--f-d);}
    
    .social-item{width: 35rem;height: 35rem;}
    
    .breadcrumbs ul{margin: -.25em;}
    .breadcrumbs li{padding: .25em;}
    .breadcrumbs li:not(:last-child)::after{padding-left: .5em;}
    
    .tabs ul{margin: -5rem 0 0 -5rem;}
    .tabs li{padding: 10rem 15rem;margin: 5rem 0 0 5rem;}
    
    .section{margin-bottom: 80rem;}
    
    .section-header{grid-template-columns: auto;grid-gap: 15rem;grid-template-rows: auto;}
    .section-header:not(:last-child){margin-bottom: 25rem;}
    .section-header-subtitle{margin: 0;}
    .section-header-action{display: none;}
    
    .section-footer{margin-top: 30rem;display: flex;justify-content: center;}
    
    .textbox{word-break: break-word;}
  
    .formbox{grid-gap: 40rem;}
    .formbox-group{grid-template-columns: auto;grid-gap: 20rem;}
    .formbox-row{flex-direction: column;}
    .formbox-cell{flex: none;}
    .formbox-cell:not(:first-child){margin: 20rem 0 0;}
    
    .textfield-input,
    .textfield-input-range{padding: 15rem;font-size: var(--f-d);}
    .textfield-prefix{margin-left: 15rem;}
    
    .catalog{grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap: 40rem 20rem;}
    .catalog-card{width: 100%;margin: 0;}
    
    .catalog-tabs{margin: 0 var(--awr);overflow: auto;overflow: -moz-scrollbars-none!important;scrollbar-width: none;}
    .catalog-tabs::-webkit-scrollbar{display: none;}
    .catalog-tabs:not(:last-child){margin-bottom: 30rem;}
    .catalog-tabs .tabs{display: flex;}
    .catalog-tabs .tabs ul{white-space: nowrap;display: grid;grid-template-columns: auto;grid-auto-flow: column;grid-gap: 5rem;padding: 0 var(--wr);flex: none;margin: 0;}
    .catalog-tabs .tabs li{margin: 0;}
    
    .catalog-toolbar{margin-bottom: 60rem;grid-template-columns: 1fr 1fr;grid-gap: 0 20rem;grid-template-areas: "a1 a2" "a3 a4";}
    .catalog-sort{grid-area: a3;}
    .catalog-filter-button{grid-area: a1;margin-bottom: 20rem;}
    .catalog-filter-reset{margin: 0;margin-left: auto;grid-area: a2;margin-bottom: 20rem;}
    .catalog-total{grid-area: a4;grid-column: auto;text-align: right;}
    
    .filters{grid-gap: 40rem;}
    
    .filter-fb{display: none;}
    
    .card-1{padding: 0;border-radius: 0;}
    .card-1 .card-content{flex: auto;display: flex;flex-direction: column;}
    .card-1 .card-title{margin-bottom: auto;font-size: var(--f-s);}
    .card-1 .card-price{margin-top: 10rem;}
    .card-1 .card-price-title .button-icon{display: none;}
    .card-1 .card-footer{margin-top: 15rem;}
    .card-1 .card-header{grid-gap: 15rem;}
    
    .card-2 .card-header{margin-right: 15rem;width: 80rem;height: 80rem;}
    .card-2 .card-content{min-height: 80rem;justify-content: flex-start;}
    .card-2 .card-title{font-size: var(--f-s);}
    
    .card-3{padding: 30rem 20rem;}
    .card-3 .card-header{margin-bottom: 30rem;}
    .card-3 .card-footer{margin-top: 15rem;}
    
    
    .shopcart{grid-gap: 40rem;}
    .shopcart-row{grid-template-columns: 1fr 1fr 1fr auto;grid-gap: 20rem;grid-template-areas: "a1 a1 a1 a2" "a3 a3 a4 a4";}
    .shopcart-item{grid-area: a1;}
    .shopcart-delete{grid-area: a2;margin-bottom: auto;}
    .shopcart-num{grid-area: a3;}
    .shopcart-price{grid-area: a4;}
    
    .product-spinner-control{padding: 0 15rem;}
    
    
    .s2-1{grid-template-rows: auto;grid-template-columns: auto;grid-gap: 40rem;grid-template-areas: "a2" "a3" "a4" "a5";}
    .s2-2{position: relative;top: auto;padding: 20rem;}
    .s2-4{margin: 0;}
    .s2-5{margin: 0;}
    .s2-7-3{display: none;}
    .s2-10{grid-template-columns: 1fr 1fr;grid-gap: 0 10rem;}
    .s2-10-1,
    .s2-10-2{grid-column: auto;}
    .s2-11{grid-template-columns: repeat(4, 1fr);}
    .s2-11-1{padding: 10rem;}
    
    .s3-1{margin: 0 var(--awr);padding: 0 var(--wr);}
    .s3-2 .swiper{overflow: visible;margin-left: -5rem;}
    .s3-2 .swiper-slide{padding-left: 5rem;}
    .s3-2 img{height: 200rem;}
    .s3-3{display: none;}
    
    .s4-1{grid-template-columns: minmax(0, 1fr);grid-gap: 60rem;}
    .s4-2{grid-column: auto;grid-row: auto;}
    .s4-3{border: none;padding: 0;grid-gap: 30rem;}
    .s4-8{grid-column: auto;max-width: none;}
    
    .s5-1{grid-template-columns: auto;grid-gap: 60rem;}
    .s5-2{grid-template-columns: auto;grid-gap: 30rem;}
    .s5-3{border: none;border-radius: 0;margin: 0 var(--awr);}
    .s5-3::before{padding-top: 120%;}
    .s5-4-1{margin-bottom: 10rem;}
    .s5-4-2 a{font-size: var(--f-b);}
    
    .s6:first-child{margin-top: -30rem;}
    .s6-1{margin: 0 var(--awr);border-radius: 0;min-height: calc(var(--app-height) - var(--headroom-height));align-items: flex-start;}
    .s6-3{grid-column: auto;padding: 0;}
    .s6-4{margin: 0;padding: 0;border: none;max-width: 200rem;}
    .s6-4::before{display: none;}
    .s6-5{padding: 60rem var(--wr);grid-template-columns: auto;}
    
    .s8-1{grid-template-columns: auto;grid-gap: 10rem;}
    .s8-3{margin-top: 30rem;}
    .s8-4{padding: 30rem 20rem;}
    
    .popup-inner{padding: 30rem var(--wr);}
    .popup-content:last-child{padding-bottom: 40rem;}
    
    .aside .popup-header{margin-bottom: 30rem;}
    .aside .popup-footer{padding-top: 60rem;padding-bottom: 20rem;margin: 0 var(--awr) -30rem}
    
    .menu{grid-gap: 5rem;padding: 0;}
    .menu-item{padding: 10rem 15rem;}
    .menu-item-icon{margin-right: 15rem;width: 28rem;height: 28rem;}
    
    .search-results{margin-top: 40rem;display: grid;grid-template-columns: auto;grid-gap: 20rem;}
    
    
}


@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
    
    
    .action-button-value{position: absolute;top: 0;right: 0;z-index: 1;background-color: var(--c0);color: var(--c1);font-size: var(--f-xs);font-weight: 500;border-radius: 999rem;padding: 0 5rem;transform: translate(50%, -5rem);pointer-events: none;min-width: 1.25em;text-align: center;}
    .action-button-value::after{content: "";position: absolute;top: 0;left: 0;background-image: var(--gr1);right: 0;bottom: 0;margin: -2rem;border-radius: inherit;padding: 2rem;mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0);mask-clip: content-box, border-box;mask-composite: exclude;}
    .action-button-value:empty{display: none;}
    
    .topbar::before{content: "";position: absolute;top: 0;left: 0;right: -50vw;height: 75%;background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><rect width="2" height="2" /></svg>');background-size: 16px 16px;background-position: bottom right;opacity: .2;z-index: -1;pointer-events: none;}
    
    .topbar-main::before{content: "";position: absolute;width: 50vw;height: 100%;top: 0;right: 100%;background-color: inherit;}
    
    
}

@media screen and (min-width: 1920px) {
    
    
    html{font-size: 1px;}
    
    
}

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
   
    .topbar-nav li:not(:hover)::after{transform: scaleX(0);transform-origin: right;}
    
    .menu-item:hover::before{opacity: .1;}
    
    .tabs li::after{transition: opacity .15s;}
    .tabs li:hover::after{opacity: .1;}
    
    .breadcrumbs li a{transition: color .15s;}
    .breadcrumbs li a:hover{color: var(--c1);}
    
    .button__cl .button-text,
    .button__cl .button-icon:only-child{transition: color .15s;}
    .button__cl:hover .button-text,
    .button__cl:hover .button-icon:only-child{color: var(--c3);}
    
    .button__default:hover{background-image: var(--gr1);}
    .button__default:hover .button-text{background-image: var(--gr1);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
    .button__default:hover .button-icon{color: var(--c3);}
    
    .button__action:hover::before{visibility: hidden;}
    .button__action:hover .button-text,
    .button__action:hover .button-icon{color: var(--c0);}
    
    .button__secondary{transition: background-color .15s;}
    .button__secondary:hover{background-color: var(--c4);}
    
    .catalog-carousel .swiper-slide:hover,
    .catalog-card:hover{z-index: 1;}
    .catalog-card::before{transition: opacity .15s;}
    .catalog-card:hover::before{opacity: .4;}
    
    
    .card-1 .card-price-title .button-icon{transition: opacity .15s;}
    .card-1 .card-price-title:hover .button-icon{opacity: 1;}
    
    .card-1 .card-header-action:hover::before{transform: scale(1);}
    
    .social-item,
    .footer-contacts a,
    .footer-nav a{transition: color .15s;}
    .social-item:hover,
    .footer-contacts a:hover,
    .footer-nav a:hover{color: var(--c3);}
    
    .s2-11-1{transition: color .15s;}
    .s2-11-1:hover{color: var(--c2);}
    
    .s5-4-2 a{transition: color .15s;}
    .s5-4-2 a:hover{color: var(--c3);}
    
    .shopcart-delete{transition: opacity .15s;}
    .shopcart-row:not(:hover) .shopcart-delete{opacity: 0;}
    
    
}