@charset "UTF-8";

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


:root{
    
    --app-height: 100vh;
    --app-width: 100vw;
    --headroom-height: 0;
  
    --c0: #F4F1EA;
    --c1: #131313;
    --c2: #D5E390;
    --c3: #d6133b;
    --c4: #DFCFAA;
    --c5: #FFFFFF;
    --c6: rgba(19, 19, 19, .2);
    --c7: rgba(19, 19, 19, .4);
    --c8: rgba(19, 19, 19, .6);
    --c9: rgba(19, 19, 19, .8);
    
    --wr: 50rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 20rem;
    --sl: max(1px, 1rem);
    
    --rating: 5.0;
    
    --fl: calc(100 / 16.455);

    --f-xxs: max(12px, 12rem);
    --f-hint: max(12px, 14rem);
    --f-xs: max(12px, 16rem);
    --f-s: max(14px, 18rem);
    --f-d: max(14px, 20rem);
    --f-m: max(14px, 22rem);
    --f-b: max(14px, 26rem);
    --f-l: max(14px, 36rem);
    --f-xl: max(14px, 60rem);
    --f-xxl: max(14px, 90rem);
    --f-xxxl: max(14px, 140rem);
    
    --mw: 1920px; 
    
}


/* globals */

@media screen {

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

    .document{font-weight: 400;font-family: 'Roboto Flex', sans-serif;font-size: var(--f-d);line-height: 1.1;color: var(--c1);background-color: var(--c0);letter-spacing: -.02em;}
    
    .wrapper{width: 100%;margin: 0 auto;padding: 0 var(--wr);max-width: var(--mw);}
    
    
    .preloader{background-color: var(--c4);position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 9999;visibility: hidden;opacity: 1;transition: all .5s 1s;display: flex;padding: var(--wr);color: var(--c1);transform: translateY(-100%);will-change: transform;align-items: center;justify-content: center;flex-direction: column;}
    .preloader-logo{width: 100%;max-width: 200rem;}
    .preloader-image{width: 200rem;height: 30rem;position: relative;margin-top: 30rem;}
    .preloader-image-back{color: var(--c3);opacity: .2;}
    .preloader-image-curtain{will-change: clip-path;color: var(--c3);transition: clip-path .5s;clip-path: inset(0 100% 0 0);}
    
    .loading{pointer-events: none;}
    .loading .preloader{transition-duration: 0s;transform: translateY(0);visibility: visible;}
    
    
    .s11-2-1{transition: all .25s;will-change: transform;}
    .s11-2-1:nth-child(1){transition-delay: 2s;}
    .s11-2-1:nth-child(2){transition-delay: 2.25s;}
    .s11-2-1:nth-child(3){transition-delay: 2.5s;}
    .s11-5{transition: clip-path 1s 2.75s;clip-path: inset(0 0% 0 0);}
    .s11-5-1{transition: opacity 1s 2.75s;}
    .hero-figures{transition: transform 1s 3.75s;will-change: transform;}
    .s11-3{transition: clip-path 1s 2.75s;clip-path: inset(0% 0 0 0);}
    .s11-6{transition: opacity 1s 2.75s;}
    
    .section{overflow: clip;}
    .section:not(.s11){opacity: 1;transition: opacity 1s 2s;}
    
    .loading .section:not(.s11){opacity: 0;transition-duration: 0s;transition-delay: 0s;}
    .loading .s11-2-1{opacity: 0;transform: translateX(25%);}
    .loading .s11-5{clip-path: inset(0 100% 0 0);}
    .loading .s11-5-1{opacity: 0;}
    .loading .hero-figures{transform: translateY(105%);}
    .loading .s11-3{clip-path: inset(100% 0 0 0);}
    .loading .s11-6{opacity: 0;}
    
    
    .usd{white-space: nowrap;text-decoration: inherit;}
    .usd:not(:empty)::after{content: "\a0\20bd";display: inline;}
    
    
    .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;height: max(50px, 55rem);position: relative;padding: 0 40rem;border: var(--sl) solid var(--c3);}
    .button:not(.fill){overflow: hidden;}
    .button-text{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;position: relative;z-index: 2;font-size: var(--f-s);min-width: 0;letter-spacing: -.04em;}
    
    .button__default{background-color: var(--c3);color: var(--c0);}
    .button__secondary{background-color: rgba(0,0,0,0);color: var(--c3);}
    .button__wide{width: 100%;}
    
    .title,
    .titlebox-title{line-height: .9;font-weight: 500;letter-spacing: -.04em;}
    
    .title__default{font-size: var(--f-xxl);}
    .title__small{font-size: var(--f-xxl);}
    
    .container{display: flex;flex-direction: column;min-height: var(--app-height);}
    
    .alert-bar{background-color: var(--c3);font-weight: 500;color: var(--c0);letter-spacing: -.04em;text-align: center;padding: 15rem 0;position: relative;z-index: 100;}
    
    .header{position: sticky;z-index: 99;background-color: var(--c0);top: 0}
    
    .curtain{background-color: var(--c4);top: 0;left: 0;width: 100%;padding-top: var(--headroom-height);position: absolute;z-index: 1;transition: transform .5s;will-change: transform;}
    .curtain-inner{padding: 50rem 0;transition: opacity .5s .25s;display: grid;grid-template-columns: auto;grid-gap: 1em;}
    .curtain-col{text-transform: uppercase;}
    .curtain-col-caption{font-size: var(--f-m);font-weight: 600;letter-spacing: -.04em;line-height: .9;}
    .curtain-col-icon{display: flex;color: var(--c3);height: max(22px, 25rem);}
    .curtain-col-icon img{height: 100%;width: auto;}
    .curtain-col-nav{grid-column-start: 2;}
    .curtain-col-nav ul{display: grid;grid-template-columns: auto;grid-gap: 15rem;}
    .curtain-col-nav ul li{opacity: .8;font-size: var(--f-s);letter-spacing: -.04em;}
    
    .curtain:not(.active){transform: translateY(-100%);opacity: 1;transition-delay: .25s;}
    .curtain:not(.active) .curtain-inner{opacity: 0;transition-delay: 0s;}
    
    .search{position: relative;}
    .search-field{background-color: var(--c5);border: var(--sl) solid var(--c6);padding: 0 60rem 0 20rem;height: max(45px, 50rem);width: 100%;text-overflow: ellipsis;transition: all .15s;}
    .search-icon{position: absolute;top: 0;right: 0;width: max(25px, 25rem);height: 100%;display: flex;align-items: center;justify-content: center;padding: 0;cursor: pointer;opacity: .6;margin: 0 10rem;}
    
    .textfield{background-color: var(--c5);border: var(--sl) solid var(--c6);min-height: max(40px, 45rem);width: 100%;display: flex;}
    .textfield-input{flex: auto;padding: 15rem 20rem;text-overflow: ellipsis;font-size: var(--f-xs);resize: none;}
    .textfield-input:invalid,
    .textfield-input.error{color: var(--c3);}
    
    .topbar{position: relative;z-index: 2;overflow: hidden;}
    .topbar-grid{padding: 25rem 0 25rem;display: grid;grid-template-columns: 1fr auto 1fr;grid-gap: 55rem;align-items: center;}
    .topbar-logo{position: relative;width: 100%;max-width: 200rem;}
    .topbar-nav{order: -1;margin-right: auto;}
    .topbar-nav ul{display: grid;grid-gap: 30rem;grid-auto-flow: column;}
    .topbar-nav li{position: relative;font-size: var(--f-s);letter-spacing: -.04em;display: flex;align-items: center;}
    .topbar-nav a{opacity: .6;}
    .topbar-nav-curtain{white-space: nowrap;display: inline-flex;align-items: center;}
    .topbar-nav-curtain-icon{height: 1em;margin-left: .25em;flex: none;width: 1em;display: flex;}
    .topbar-action{display: grid;grid-gap: var(--gap);align-items: center;grid-template-columns: 1fr auto auto;}
    .topbar-cart{display: flex;align-items: center;justify-content: center;position: relative;margin-left: 20rem;}
    .topbar-cart-disabled{pointer-events: none;}
    .topbar-cart-icon{opacity: .6;display: flex;width: max(25px, 25rem);height: max(25px, 25rem);}
    .topbar-cart-num{position: absolute;left: 100%;top: 0;z-index: 1;background-color: var(--c3);color: var(--c0);font-size: var(--f-xxs);text-align: center;white-space: nowrap;border-radius: 999rem;width: max(15px, 17rem);height: max(15px, 17rem);padding: 2rem;transform: translate(-50%, -50%);user-select: none;pointer-events: none;display: inline-flex;align-items: center;justify-content: center;}
    .topbar-search{width: 100%;max-width: 390rem;margin-left: auto;}
    
    .topbar-search .search-field:not(:focus){opacity: 0;pointer-events: none;}
    
    .topbar-line{width: var(--app-width);height: var(--sl);background-color: var(--c6);line-height: 0;margin: 0 auto;transition: width .25s;position: relative;z-index: 1;}
    
    .header.active .curtain:not(.active) ~ .topbar-line{width: 100%;transition-delay: .5s;}
    
    .main{margin-top: 0;flex: auto;display: flex;flex-direction: column;}
   
    .section{position: relative;z-index: 1;}
    .section:not(:first-child){margin-top: 140rem;}
    .section:first-child{margin-top: 50rem;}
    
    .footer{padding: 50rem 0 25rem;overflow: hidden;background-color: var(--c4);position: relative;z-index: 1;margin-top: 150rem;}
    .footer-grid{grid-template-columns: repeat(4, 1fr);grid-gap: 0 var(--gap);display: grid;grid-template-areas: "a2 a3 a3 a4" "a1 a1 a1 a1" "a5 a5 a5 a5";}
    .f1{grid-area: a1;margin-top: 170rem;text-transform: capitalize;font-weight: 500;letter-spacing: -.04em;font-size: calc(var(--app-width) / var(--fl));white-space: nowrap;line-height: 1;text-decoration: underline;text-decoration-thickness: var(--sl);text-underline-offset: .04em;margin-bottom: -.075em;color: var(--c3);}
    .f1::before{content: "";position: absolute;z-index: -1;top: 0;left: 0;width: 100%;height: 100%;pointer-events: none;background-color: var(--c4);}
    .f1-1{text-indent: -.0715em;overflow: hidden;}
    .f2{grid-area: a2;}
    .f2-1{position: relative;width: 100%;max-width: 200rem;}
    .f2-1{background-image: url(../img/mainlogowhite.svg);background-position: center;background-repeat: no-repeat;background-size: contain;}
    .f2-2{margin-top: 55rem;opacity: .8;max-width: 270rem;}
    .f3{grid-area: a3;display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--gap);}
    .f3-1:nth-child(odd):last-child{grid-column-end: span 2;}
    .f3-1-1{font-weight: 500;letter-spacing: -.04em;margin-bottom: 35rem;}
    .f3-1-2 ul{display: grid;grid-template-columns: auto;grid-gap: 10rem;font-size: var(--f-s);letter-spacing: -.04em;}
    .f3-1-2 ul li a{opacity: .8;}
    .f4{grid-area: a4;}
    .f4-1{font-weight: 500;letter-spacing: -.04em;margin-bottom: 35rem;}
    .f5{grid-area: a5;display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: baseline;font-size: var(--f-xs);letter-spacing: -.04em;opacity: .8;}
    
    .footer-sensor{width: 100%;height: 1px;margin-bottom: -1px;}
    
    .textbox{width: 100%;}
    .textbox h2:not(:first-child){margin-top: 2em;}
    .textbox h2:not(:last-child){margin-bottom: 1em;}
    .textbox ul{display: grid;grid-template-columns: auto;grid-gap: .5em;max-width: 768rem;}
    .textbox ol{display: table;counter-reset: index;border-collapse: separate;border-spacing: 0 .5em;margin: -.5em 0;}
    .textbox ul:not(:first-child){margin-top: 1em;}
    .textbox ul li{padding-left: 1.25em;position: relative;}
    .textbox ul li::before{content: "\2022";position: absolute;left: 0;top: 0;text-align: left;width: 1.25em;}
    .textbox ol li{display: table-row;}
    .textbox ol li::before{content: counter(index) ".";counter-increment: index;display: table-cell;padding-right: .25em;text-align: right;}
    .textbox p:not(:first-child){margin-top: 1em;}
    .textbox a{color: var(--c3);}
    
    .titlebox-title{font-size: var(--f-xxl);max-width: 640rem;}
    .titlebox-subtitle{max-width: 450rem;opacity: .8;}
    .titlebox-subtitle:not(:first-child){margin-top: 30rem;}
    .titlebox-subtitle__large{font-size: var(--f-b);line-height: 1;max-width: 520rem;}
    .titlebox-subtitle__large:not(:first-child){margin-top: 45rem;}
    .titlebox-subtitle__large + .titlebox-action{margin-top: 75rem;}
    .titlebox-action{margin-top: 30rem;}
    
    .expand-list{border-bottom: var(--sl) solid var(--c7);display: grid;grid-template-columns: auto;grid-gap: 0;}
    .expand{border-top: var(--sl) solid var(--c7);}
    .expand-title{display: grid;align-items: center;cursor: pointer;grid-template-columns: 1fr auto;grid-gap: 50rem;user-select: none;padding-right: 10rem;}
    .expand-title-icon{display: flex;align-items: center;justify-content: center;width: max(20px, 25rem);height: max(20px, 25rem);color: var(--c3);}
    .expand-content{overflow: hidden;height: 0;opacity: 0;max-width: 680rem;padding: 0;transition: all .15s;width: 100%;}
    
    .expand.active .expand-title-icon{transform: scaleY(-1);}
    .expand.active .expand-content{opacity: 1;height: auto;}
    
    .catalog{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--sl);padding: var(--sl);}
    .catalog-item{margin: calc(-1 * var(--sl));}
    
    .carousel-buttons{display: grid;grid-auto-flow: column;grid-gap: 15rem;}
    .carousel-button{display: flex;align-items: center;justify-content: center;width: max(20px, 25rem);height: max(20px, 25rem);cursor: pointer;user-select: none;}
    .carousel-button.swiper-button-disabled{opacity: .2;pointer-events: none;}
    
    
    .tag{letter-spacing: -.04em;padding: 0 10rem;display: inline-flex;align-items: center;text-align: center;white-space: nowrap;}
    .tag__red{color: var(--c0);background-color: var(--c3);}
    .tag__green{color: var(--c1);background-color: var(--c2);}
    
    .chips-group{overflow: hidden;}
    .chips-group-inner{display: flex;flex-wrap: wrap;margin: -7.5rem;}
    .chip-button{padding: 7.5rem;width: 25%;}
    
    .chip{display: flex;align-items: center;justify-content: center;text-align: center;height: max(45px, 50rem);border: var(--sl) solid var(--c8);padding: 10rem;color: var(--c8);overflow: hidden;user-select: none;}
    .chip-text{white-space: nowrap;width: 100%;text-overflow: ellipsis;overflow: hidden;font-size: var(--f-xs);letter-spacing: -.04em;}
    .chip.active{border-color: var(--c3);color: var(--c0);background-color: var(--c3);}
    .chip.active:not([data-popup]){pointer-events: none;}
    
    .toolbar-container{position: relative;}
    
    .toolbar{display: inline-grid;grid-auto-flow: column;grid-gap: 30rem;align-items: center;}
    .toolbar-button{position: relative;display: inline-flex;align-items: center;cursor: pointer;user-select: none;line-height: 1.2;}
    .toolbar-button-text{font-size: var(--f-s);opacity: .5;letter-spacing: -.04em;transition: opacity .15s;}
    .toolbar-button-icon{margin: 0 5rem;flex: none;display: inline-flex;align-items: center;justify-content: center;height: 1.2em;width: max(20px, 24rem);color: var(--c3);}
    .toolbar-button-icon:first-child{margin-left: 0;}
    .toolbar-button-icon:last-child{margin-right: 0;}
    
    .toolbar-dropdown{position: absolute;top: 100%;left: 0;z-index: 100;margin-top: 15rem;}
    
    .toolbar-reset-button.hidden{display: none;}
   
    .author{display: flex;align-items: center;}
    .author-image{border-radius: 50%;overflow: hidden;position: relative;width: max(44px, 48rem);height: max(44px, 48rem);margin-right: 12rem;}
    .author-subtitle{margin-top: 5rem;font-size: var(--f-xs);letter-spacing: -.04em;opacity: .8;}
    
    .rating{position: relative;width: 115rem;height: 21rem;background-repeat: repeat-x;background-size: auto 100%;background-position: left;background-image: url(../img/rating-blank.svg);}
    .rating-stars{background-repeat: repeat-x;position: absolute;background-size: auto 100%;background-position: left;top: 0;left: 0;height: 100%;background-image: url(../img/rating-colored.svg);width: calc(100% * var(--rating) / 5);}
    
    .product-gallery{display: flex;background-color: var(--c5);overflow: hidden;width: 100%;position: relative;}
    .product-gallery::before{content: "";flex: none;width: 0;padding-top: 90%;}
    .product-gallery .product-image{width: 100%;height: 100%;}
    .product-label{position: absolute;top: 0;left: 0;z-index: 1;padding: 30rem;font-weight: 600;font-size: var(--f-l);letter-spacing: -.04em;color: var(--c3);max-width: 100%;overflow: hidden;}
    .product-thumbs{margin-top: 35rem;overflow: hidden;}
    .product-tags{display: flex;position: absolute;left: 0;top: 0;z-index: 1;}
    .product-tags .tag{font-size: var(--f-m);height: max(35px, 40rem);font-weight: 600;}
    .product-arrows .carousel-button{position: absolute;top: 50%;transform: translateY(-50%);margin: 0;z-index: 1;margin: 0 35rem;}
    .product-arrows .carousel-button-prev{left: 0;}
    .product-arrows .carousel-button-next{right: 0;}
    .product-price-val{font-weight: 600;font-size: var(--f-l);letter-spacing: -.04em;}
    .product-price-old{font-weight: 500;letter-spacing: -.04em;opacity: .4;text-decoration: line-through;}
    
    .product-spinner{display: flex;}
    .product-spinner-control{height: max(50px, 55rem);min-width: max(50px, 55rem);flex: none;display: flex;align-items: center;justify-content: center;background-color: var(--c3);border: var(--sl) solid var(--c3);padding: 10rem;color: var(--c0);text-align: center;font-weight: 600;line-height: 1;font-size: var(--f-b);}
    .product-spinner-input{border-top: var(--sl) solid var(--c6);border-bottom: var(--sl) solid var(--c6);flex: auto;text-align: center;font-weight: 500;letter-spacing: -.04em;}
    
    .formbox{display: grid;grid-template-columns: auto;grid-gap: 10rem;}
    .formbox-caption:not(:last-child){margin-bottom: 15rem;}
    .formbox-caption-title{font-weight: 500;letter-spacing: -.04em;}
    .formbox-caption-subtitle{letter-spacing: -.04em;font-size: var(--f-xs);opacity: .6;margin-top: .25em;}
    .formbox-row{display: flex;}
    .formbox-cell{flex: 1;margin: 0 5rem;}
    .formbox-cell:first-child{margin-left: 0;}
    .formbox-cell:last-child{margin-right: 0;}
    
    .toggle-form-group:not(:first-child){margin-top: 20rem;}
    .toggle-form-group.hidden{display: none;}
    
    .selectbox-group{display: grid;grid-template-columns: auto;grid-gap: 20rem var(--gap);}
    .selectbox-row{display: flex;}
    .selectbox-cell{flex: 1;border-top: var(--sl) solid var(--c6);padding-top: 20rem;margin: 0 calc(var(--gap) / 2);}
    .selectbox-cell:first-child{margin-left: 0;}
    .selectbox-cell:last-child{margin-right: 0;}
    
    .selectbox-row:last-child .selectbox-cell:only-child{border-bottom: var(--sl) solid var(--c6);padding-bottom: 20rem;}
    
    .selectbox{display: flex;align-items: center;position: relative;overflow: hidden;}
    .selectbox-inner{flex: auto;user-select: none;}
    .selectbox-title{display: flex;align-items: center;}
    .selectbox-title-label{opacity: .5;font-weight: 500;cursor: pointer;transition: opacity .15s;}
    .selectbox-title-icon{flex: none;width: 1em;height: 1em;border-radius: 50%;border: var(--sl) solid var(--c7);margin-right: 10rem;padding: var(--sl);background-color: rgba(0,0,0,0);background-clip: content-box;transition: background-color .15s;}
    .selectbox-subtitle{opacity: .3;font-size: var(--f-xs);letter-spacing: -.04em;margin-top: .25em;}
    .selectbox-context{flex: none;margin-left: 50rem;font-weight: 500;letter-spacing: -.04em;}
    .selectbox-context-image{display: flex;justify-content: flex-end;align-items: center;height: 20rem;}
    .selectbox-context-image img{height: 100%;width: auto;}
    .selectbox-control{position: absolute;right: 100%;opacity: 0;width: 0;height: 0;overflow: hidden;}
    .selectbox-control:checked ~ .selectbox-title-label{opacity: .8;pointer-events: none;}
    .selectbox-control:checked ~ .selectbox-title-icon{background-color: var(--c1);}
    
    .checkbox-group{display: grid;grid-template-columns: auto;grid-gap: 10rem;}
    .checkbox{position: relative;overflow: hidden;user-select: none;}
    .checkbox-label{display: flex;align-items: center;}
    .checkbox-label-name{opacity: .3;cursor: pointer;transition: opacity .15s;font-size: var(--f-xs);letter-spacing: -.04em;}
    .checkbox-label-icon{flex: none;width: max(14px, 14rem);height: max(14px, 14rem);border: var(--sl) solid var(--c6);margin-right: .75em;padding: var(--sl);background-color: var(--c5);position: relative;line-height: 1;}
    .checkbox-label-icon::before{content: "";position: absolute;right: 0;top: 0;left: 0;bottom: 0;z-index: 1;background-color: currentColor;color: var(--c5);transition: color .15s;margin: 2rem;line-height: 0;}
    .checkbox-label-control{position: absolute;right: 100%;opacity: 0;width: 0;height: 0;overflow: hidden;}
    .checkbox-label-control:checked ~ .checkbox-label-name{opacity: .8;}
    .checkbox-label-control:checked ~ .checkbox-label-icon::before{color: var(--c3);}
     
    .dropdown{max-width: 375rem;width: max-content;box-shadow: inset 0 0 0 var(--sl) var(--c6);padding: 30rem 40rem 30rem 30rem;background-color: var(--c0);position: relative;min-width: 250rem;display: none;}
    .dropdown-close{cursor: pointer;color: var(--c3);position: absolute;right: 0;top: 0;margin: 15rem;width: max(15px, 15rem);height: max(15px, 15rem);display: flex;align-items: center;justify-content: center;padding: 3rem;display: none;}
    
    .dropdown-expand-list{display: grid;grid-template-columns: auto;grid-gap: 15rem;}
    .dropdown-expand-caption{cursor: pointer;user-select: none;display: flex;align-items: center;}
    .dropdown-expand-title{font-size: var(--f-s);opacity: .8;letter-spacing: -.04em;}
    .dropdown-expand-icon{margin-left:10rem;flex: none;display: inline-flex;align-items: center;justify-content: center;height: 1em;width: max(12px, 15rem);color: var(--c3);will-change: transform;}
    .dropdown-expand-content{overflow: hidden;height: 0;opacity: 0;padding: 0;transition: all .15s;width: 100%;}
    .dropdown-expand-inner{padding: 15rem 0;border-top: var(--sl) solid var(--c3);border-bottom: var(--sl) solid var(--c3);}
    .dropdown-expand.active .dropdown-expand-icon{transform: scaleY(-1);}
    .dropdown-expand.active .dropdown-expand-content{opacity: 1;height: auto;padding: 25rem 0 10rem;}

    .dropdown .checkbox-group-caption,
    .dropdown .selectbox-caption{margin-bottom: 15rem;font-size: var(--f-xs);letter-spacing: -.04em;}
    .dropdown .checkbox-group-caption:not(:first-child),
    .dropdown .selectbox-caption:not(:first-child){margin-top: 30rem;}
    .dropdown .checkbox-group,
    .dropdown .selectbox-group{grid-gap: 15rem;}
    .dropdown .checkbox,
    .dropdown .selectbox{font-size: var(--f-xs);letter-spacing: -.04em;}
    
    
    .toolbar-button.active .toolbar-button-text{opacity: .8;}
    .toolbar-button.active .toolbar-button-icon:not(.toolbar-button-icon__sort){transform: scaleY(-1);}
    .toolbar-button.active ~ .toolbar-dropdown .dropdown{display: block;}
    
    .hero-figures{display: flex;align-items: center;justify-content: center;position: relative;color: var(--c3);width: 375rem;height: 55rem;}
    
    .aside{position: fixed;right: 0;top: 0;bottom: 0;z-index: 110;background-color: var(--c4);overflow: auto;overflow: -moz-scrollbars-none!important;scrollbar-width: none;transition: transform .25s;will-change: transform;transform: translateX(100%);width: 100%;max-width: 620rem;display: flex;flex-direction: column;padding: 0 30rem;}
    .aside::-webkit-scrollbar{display: none;}
    .aside-header{flex: none;position: sticky;top: 0;z-index: 2;background-color: var(--c4);display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: flex-start;padding: 30rem 0;}
    .aside-title{color: var(--c3);font-size: var(--f-xl);}
    .aside-close{width: max(20px, 25rem);height: max(20px, 25rem);color: var(--c3);line-height: 1;display: flex;cursor: pointer;}
    .aside-content{flex: auto;padding: 0;}
    .aside-footer{position: sticky;bottom: 0;z-index: 2;background-color: var(--c4);padding: 20rem 0 30rem;margin-top: 20rem;}
    .aside-summary{display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);}
    .aside-summary-col{display: flex;flex-direction: column;}
    .aside-summary-title{font-weight: 500;letter-spacing: -.04em;}
    .aside-summary-subtitle{font-size: var(--f-xs);letter-spacing: -.04em;opacity: .6;margin-top: 5rem;}
    .aside-summary-price{text-align: right;font-size: var(--f-l);letter-spacing: -.04em;font-weight: 600;}
    .aside-summary-del{text-align: right;font-size: var(--f-xs);letter-spacing: -.04em;opacity: .6;margin-top: 5rem;cursor: pointer;margin-left: auto;}
    .aside-footer-action:not(:first-child){margin-top: 10rem;}
    
    .aside-header,
    .aside-footer{margin-left: -30rem;margin-right: -30rem;padding-left: 30rem;padding-right: 30rem;}
    
    .modal{position: fixed;top: 100rem;left: 50%;transform: translate(-50%, 200rem);width: 100%;max-width: 1430rem;padding: 30rem;z-index: 110;background-color: var(--c2);opacity: 0;visibility: hidden;will-change: transform;}
    .modal-header{display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: flex-start;}
    .modal-title{color: var(--c3);font-size: var(--f-xl);}
    .modal-close{width: max(20px, 25rem);height: max(20px, 25rem);color: var(--c3);line-height: 1;display: flex;cursor: pointer;}
    .modal-content{margin-top: 30rem;}
    
    .modal__info{max-width: 485rem;padding-bottom: 60rem;}
    .modal__info .modal-content{border-top: var(--sl) solid var(--c6);padding-top: 25rem;font-weight: 500;}
    
    .aside.active{transform: translateX(0);}
    .modal.active{opacity: 1;visibility: visible;transform: translate(-50%, 0%);transition: all .25s;}
    .aside.active ~ .popup-overlay,
    .modal.active ~ .popup-overlay{z-index: 109;}
    
    .popup-overlay{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: var(--c1);opacity: 0;z-index: 50;visibility: hidden;transition-property: opacity, visibility;transition-duration: 0s;}
    
    .popup-active .popup-overlay{opacity: .7;visibility: visible;transition-duration: .25s;}
    
    .offer-grid{margin-bottom: 60rem;display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: 25rem;}
    .offer-item{padding-top: 15rem;border-top: var(--sl) solid var(--c6);}
    .offer-item:nth-child(n + 4){display: none;}
    .offer-item.disabled{pointer-events: none;opacity: .4;}
    .offer-form{margin-top: 10rem;}
    .offer-form-button.hidden,
    .offer-form-spinner.hidden{display: none;}
    .offer-form-spinner .product-spinner-control{color: var(--c5);}
    .offer-form-spinner .product-spinner-input{border: none;font-size: var(--f-s);font-weight: 400;}
    .offer-note{display: flex;align-items: center;}
    .offer-note-icon{flex: none;margin-right: 15rem;width: max(35px, 40rem);height: max(35px, 40rem);border: var(--sl) solid var(--c7);display: flex;align-items: center;justify-content: center;padding: 12rem;}
    .offer-note-text{opacity: .8;}
    .offer-footer{margin-top: 20rem;display: grid;grid-template-columns: auto;grid-gap: 5rem;}
    
    .contact-group{display: grid;grid-template-columns: auto;grid-gap: 30rem;}
    .contact{font-weight: 600;font-size: var(--f-l);letter-spacing: -.04em;line-height: 1;}
    
    .help-button{position: relative;cursor: help;display: flex;align-items: flex-end;width: 100%;}
    .help-button-icon{position: relative;width: 15rem;display: flex;align-items: center;height: 1.1em;margin-left: .1em;flex: none;}
    .help-button-icon::after{content: "";color: transparent;height: 0;width: 0;position: absolute;top: 100%;left: 50%;border-style: solid;border-width: 0 10rem 16rem;border-bottom-color: var(--c2);margin-left: -10rem;z-index: 100;}
    .help-button-layer{position: absolute;pointer-events: none;top: 100%;left: 0;width: 400rem;background-color: var(--c2);color: var(--c8);letter-spacing: -.04em;z-index: 99;padding: 16rem;margin-top: 25rem;border-radius: 4rem;box-shadow: 0 2rem 7rem rgba(0,0,0,.12);}
    .help-button-layer::before{content: "";color: transparent;height: 0;width: 0;position: absolute;bottom: 100%;left: 16rem;border-style: solid;border-width: 0 10rem 15rem;border-bottom-color: var(--c2);}
    .help-button-layer-header:not(:last-child){margin-bottom: .5em;font-size: var(--f-xs);}
    .help-button-layer-content{font-size: var(--f-hint);}
    
    .help-button:not(:hover) .help-button-icon::after,
    .help-button:not(:hover) .help-button-layer{visibility: hidden;}
    
    .related{overflow: hidden;margin: 0 -30rem;padding: 0 30rem;}
    .related:not(:first-child){margin-top: 100rem;}
    .related-caption{display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: flex-end;margin-bottom: 15rem;}
    .related-title{font-weight: 600;line-height: 1.1;color: var(--c3);letter-spacing: -.04em;}
    .related-title:only-child{grid-column: 1/-1;}
    .related-content{padding: 15rem 0;border-top: var(--sl) solid var(--c6);border-bottom: var(--sl) solid var(--c6);}
    .related-content-inner{max-width: 55%;}
    .related-content-inner .swiper{margin: 0 -30rem;overflow: visible;}
    .related-content-inner .swiper-slide{padding: 0 30rem;}
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;}
    
    .card-1{background-color: var(--c5);z-index: 1;}
    .card-1::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-1 .card-inner{display: flex;flex-direction: column;width: 100%;box-shadow: inset 0 0 0 var(--sl) var(--c6);}
    .card-1 .card-header{display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);}
    .card-1 .card-tags{display: flex;}
    .card-1 .card-tags .tag{font-size: var(--f-s);height: max(25px, 30rem);}
    .card-1 .card-action{display: flex;align-items: center;justify-content: center;width: max(25px, 30rem);height: max(25px, 30rem);margin: 15rem;position: relative;top: 0;right: 0;color: var(--c3);opacity: 0;}
    .card-1 .card-media{}
    .card-1 .card-media::after{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: var(--c2);mix-blend-mode: multiply;opacity: 0;}
    .card-1 .card-image{display: flex;position: relative;margin: 15rem 50rem;}
    .card-1 .card-image::before{content: "";flex: none;width: 0;padding-top: 100%;}
    
    .card-1 .card-footer{margin-top: auto;padding: var(--gap);display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: flex-end;}
    .card-1 .card-content{}
    .card-1 .card-title{max-width: 300rem;font-weight: 500;letter-spacing: -.04em;opacity: .8;}
    .card-1 .card-subtitle{position: relative;z-index: 1;padding-top: .5em;font-weight: 500;color: var(--c3);letter-spacing: -.04em;line-height: 1;white-space: nowrap;overflow: hidden;}
    .card-1 .card-price{text-align: right;white-space: nowrap;letter-spacing: -.04em;line-height: .9;}
    .card-1 .card-price-val{font-weight: 600;font-size: var(--f-m);}
    .card-1 .card-price-old{font-size: var(--f-xs);text-decoration: line-through;opacity: .4;margin-top: 10rem;}
    .card-1 .card-price-disabled{font-weight: 600;font-size: var(--f-m);color: var(--c3);}
    
    .card-1.disabled{pointer-events: none;}
    .card-1.disabled .card-header{visibility: hidden;}
    .card-1.disabled .card-media,
    .card-1.disabled .card-content{opacity: .2;}
    
    .card-2{background-color: var(--c2);padding: 30rem;flex-direction: column;}
    .card-2 .card-header{display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: flex-start;}
    .card-2 .card-title{font-size: var(--f-l);}
    .card-2 .card-content{width: calc((100% + var(--gap)) / 2);margin-bottom: auto;margin-top: 25rem;opacity: .8;}
    .card-2 .card-footer{margin-top: 100rem;display: flex;justify-content: flex-end;padding-right: 20rem;}
    
    .card-3{background-color: var(--c5);z-index: 1;}
    .card-3::before{content: "";flex: none;width: 0;padding-top: 85%;}
    .card-3 .card-inner{display: flex;flex-direction: column;width: 100%;}
    .card-3 .card-header{display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);}
    .card-3 .card-tags{display: flex;}
    .card-3 .card-tags .tag{font-size: var(--f-s);height: max(25px, 30rem);}
    .card-3 .card-action{display: flex;align-items: center;justify-content: center;width: max(20px, 25rem);height: max(20px, 25rem);margin: 15rem;position: relative;top: 0;right: 0;color: var(--c3);opacity: 0;}
    .card-3 .card-media{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;}
    .card-3 .card-media::after{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: var(--c2);mix-blend-mode: multiply;opacity: 0;}
    .card-3 .card-footer{margin-top: auto;padding: var(--gap);display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: flex-end;}
    .card-3 .card-content{}
    .card-3 .card-title{max-width: 200rem;font-weight: 500;letter-spacing: -.04em;opacity: .8;}
    .card-3 .card-price{text-align: right;white-space: nowrap;letter-spacing: -.04em;line-height: .9;}
    .card-3 .card-price-val{font-weight: 600;font-size: var(--f-m);color: var(--c3);}
    .card-3 .card-price-old{font-size: var(--f-xs);text-decoration: line-through;opacity: .4;margin-top: 10rem;}
    
    .card-4 .card-inner{display: flex;align-items: flex-start;}
    .card-4 .card-media{width: 130rem;display: flex;position: relative;flex: none;margin-right: 15rem;}
    .card-4 .card-media::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-4 .card-media::after{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: var(--c2);mix-blend-mode: multiply;opacity: 1;}
    .card-4 .card-footer{min-height: 130rem;display: flex;flex-direction: column;justify-content: center;}
    .card-4 .card-content{margin-bottom: 30rem;}
    .card-4 .card-title{font-weight: 500;}
    .card-4 .card-price{display: flex;flex-wrap: wrap;align-items: baseline;margin: -5rem;}
    .card-4 .card-price-val{margin: 5rem;font-weight: 600;font-size: var(--f-m);}
    .card-4 .card-price-old{margin: 5rem;order: -1;font-weight: 500;font-size: var(--f-s);opacity: .4;text-decoration: line-through;}
    
    .shopcart{display: grid;grid-template-columns: auto;grid-gap: 15rem;}
    .shopcart-row{border-top: var(--sl) solid var(--c6);padding-top: 15rem;}
    .shopcart-item{min-height: 160rem;display: grid;grid-template-columns: 1fr auto;grid-template-rows: auto 1fr;grid-gap: 20rem 10rem;align-items: baseline;grid-template-areas: "c2 c3" "c4 c5";position: relative;padding-left: 170rem;}
    .shopcart-content{grid-area: c2;}
    .shopcart-title-name{font-weight: 500;letter-spacing: -.04em;max-width: 200rem;min-height: 2.4em;}
    .shopcart-media{position: absolute;display: flex;width: 160rem;align-self: flex-start;left: 0;top: 0;}
    .shopcart-media::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .shopcart-image{background-color: var(--c5);border: var(--sl) solid var(--c6);position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .shopcart-tags{position: absolute;top: 0;left: 0;z-index: 1;line-height: 0;}
    .shopcart-tags .tag{font-size: var(--f-xxs);height: max(20px, 20rem);padding: 5rem 10rem;}
    
    .shopcart-subtitle{margin-top: 5rem;}
    .shopcart-feature{display: flex;align-items: baseline;font-size: var(--f-xs);letter-spacing: -.04em;}
    .shopcart-feature-name{margin-right: .25em;}
    .shopcart-feature-val{color: var(--c3);}
    .shopcart-price{grid-area: c3;text-align: right;}
    .shopcart-price-val{font-weight: 600;font-size: var(--f-m);letter-spacing: -.04em;}
    .shopcart-price-old{text-decoration: line-through;font-weight: 500;opacity: .4;font-size: var(--f-xs);letter-spacing: -.04em;}
    .shopcart-controls{grid-area: c4;}
    .shopcart-del{grid-area: c5;font-size: var(--f-xs);letter-spacing: -.04em;opacity: .6;cursor: pointer;margin-left: auto;}
    .shopcart-spinner{display: flex;align-items: center;user-select: none;}
    .shopcart-spinner-control{display: inline-flex;align-items: center;justify-content: center;width: max(20px, 20rem);height: max(20px, 20rem);border: var(--sl) solid rgba(0,0,0,0);background-color: var(--c2);font-weight: 600;}
    .shopcart-spinner-input{text-align: center;font-size: var(--f-s);width: max(25px, 30rem);}
    
    .shopcart-table-caption{margin-bottom: 10rem;}
    .shopcart-table-caption .title{color: var(--c3);font-weight: 600;font-size: var(--f-m);}
    .shopcart-table-header{display: flex;justify-content: space-between;margin-bottom: 10rem;line-height: 1;}
    .shopcart-table-header-th{font-weight: 500;opacity: .6;}
    .shopcart-table-header-th:not(:first-child){margin-left: var(--gap);}
    
    
}

/* sections */

@media screen {
    
    .s1:first-child{margin-top: 100rem;}
    .s1-1{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--gap);}
    .s1-2{grid-column: 2/4;}
    .s1-3:not(:last-child){margin-bottom: 55rem;}
    
    .s2-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s2-2{display: flex;flex-direction: column;padding: 25rem 65rem;}
    .s2-2:first-child{background-color: var(--c4);padding: 50rem;}
    .s2-3{position: relative;overflow: hidden;display: flex;}
    .s2-3::before{content: "";flex: none;width: 0;padding-top: 90%;}
    .s2-4{margin-bottom: auto;}
    .s2-4 .titlebox-title{color: var(--c3);}
    .s2-5{margin-top: 50rem;}
    .s2-5-2{color: var(--c3);width: 100%;max-width: calc( (100% - var(--gap)) / 2 );display: flex;}
    
    .s3-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s3-2{max-width: 550rem;}
    
    .s3-3 .expand{padding-bottom: 40rem;}
    .s3-3 .expand-title{padding-top: 40rem;color: var(--c3);}
    .s3-3 .expand-title-name{font-weight: 600;font-size: var(--f-l);line-height: .9;letter-spacing: -.04em;}
    
    .s3-3 .expand.active .expand-content{padding: 50rem 0 0;}
    
    .s4-2{margin-bottom: 25rem;font-weight: 500;letter-spacing: -.04em;position: relative;display: inline-flex;align-items: flex-start;opacity: .6;}
    .s4-2::before{content: "<";margin-right: .25em;line-height: 1;}
    .s4-3{margin-bottom: 25rem;}
    .s4-4{font-size: var(--f-b);}
    .s4-4 ~ .s4-5{margin-top: 25rem;}
    .s4-5{margin-top: 60rem;}
    
    .s5-2{border-bottom: var(--sl) solid var(--c7);padding-bottom: 20rem;display: grid;grid-template-columns: 1fr auto;grid-gap: 100rem;align-items: flex-end;}
    .s5-5{margin-top: 20rem;}
    .s5-5 .swiper{margin: 0;padding: 0 var(--sl);}
    .s5-5 .swiper-slide{transition: opacity .5s;height: auto;}
    .s5-5 .swiper-slide .card-1{margin: 0 calc(-1 * var(--sl));}
    
    .s6-2{border-bottom: var(--sl) solid var(--c7);padding-bottom: 20rem;display: grid;grid-template-columns: 1fr auto;grid-gap: 100rem;align-items: flex-end;}
    .s6-5{margin-top: 20rem;}
    .s6-5 .swiper{margin: 0 calc(var(--gap) / -2);}
    .s6-5 .swiper-slide{padding: calc(var(--gap) / 2);height: auto;}
    
    .s7-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);padding-top: 40rem;border-top: var(--sl) solid var(--c7);}
    .s7-2-2{max-width: 260rem;opacity: .8;}
    .s7-2-2:not(:first-child){margin-top: 30rem;}
    .s7-3{display: grid;grid-template-columns: auto;grid-gap: 50rem;counter-reset: index;}
    .s7-4{padding-bottom: 45rem;border-bottom: var(--sl) solid var(--c6);display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s7-4-1{font-size: var(--f-b);}
    .s7-4-1::before{content: counter(index, decimal-leading-zero);counter-increment: index;color: var(--c3);margin-right: var(--gap);}
    .s7-4-2{opacity: .8;}
    
    .s8:first-child{margin-top: 20rem;}
    .s8-1{margin-bottom: 50rem;}
    .s8-1 ul{display: flex;flex-wrap: wrap;}
    .s8-1 li{font-weight: 500;display: inline-flex;}
    .s8-1 li:not(:last-child) a{opacity: .6;}
    .s8-1 li:not(:last-child)::after{content: ">";line-height: 1;margin: 0 .25em;opacity: .6;}
    .s8-1 li:last-child{pointer-events: none;}
    .s8-2{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 0 var(--gap);align-items: flex-start;}
    .s8-3{display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: center;border-top: var(--sl) solid var(--c7);padding-top: 45rem;}
    .s8-3-1{font-size: var(--f-l);font-weight: 600;color: var(--c3);max-width: 450rem;margin-right: auto;}
    .s8-3-2{display: grid;grid-template-columns: auto;text-align: right;grid-gap: 20rem;}
    .s8-3-2-1{font-weight: 500;font-size: var(--f-m);}
    .s8-4{display: flex;min-height: 100%;position: relative;}
    
    .s8-4 .swiper{position: absolute;width: 100%;height: 100%;z-index: 1;overflow: hidden;}
    .s8-4 .swiper-slide{position: relative;}
    
    .s8-5{border-top: var(--sl) solid var(--c7);padding-top: 20rem;}
    .s8-5:not(:first-child){margin-top: 30rem;}
    .s8-5-1{max-width: 520rem;opacity: .8;}
    .s8-5-2{color: var(--c9);}
    .s8-5-2:not(:first-child){margin-top: 15rem;border-top: var(--sl) solid var(--c7);padding-top: 20rem;}
    .s8-5-3{display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);letter-spacing: -.04em;font-style: italic;}
    .s8-5-3:not(:first-child){margin-top: 25rem;border-top: var(--sl) solid var(--c7);padding-top: 20rem;}
    .s8-6{border-top: var(--sl) solid var(--c7);padding: 20rem 0 0;margin-bottom: auto;display: grid;grid-template-columns: auto;grid-gap: 40rem;}
    .s8-6:not(:first-child){margin-top: 20rem;}
    .s8-7{display: grid;grid-template-columns: 1fr auto;grid-gap: 70rem;align-items: center;}
    .s8-7:not(:first-child){margin-top: 30rem;border-top: var(--sl) solid var(--c7);padding-top: 30rem;}
    .s8-7-1{font-size: var(--f-b);}
    .s8-7-2{display: flex;flex-wrap: wrap;align-items: center;}
    .s8-7-2 .product-price-val{background-color: var(--c2);padding: 0 10rem;}
    .s8-7-2 .product-price-old{order: -1;margin-right: 15rem;font-size: var(--f-b);}
    
    .s8-8{position: sticky;bottom: 0;z-index: 1;background-color: var(--c0);padding: 20rem 0;margin-bottom: -20rem;}
    .s8-8:not(:first-child){margin-top: 40rem;}
    .s8-8-1.hidden,
    .s8-8-2.hidden{display: none;}
    
    .s8-9:not(:first-child){margin-top: 35rem;}
    
    .s8-9 .expand{padding-bottom: 20rem;}
    .s8-9 .expand-title{padding-top: 20rem;}
    .s8-9 .expand-title-name{font-size: var(--f-b);line-height: 1;}
    
    .s8-9 .expand.active .expand-content{padding: 30rem 0 0;}
    
    .s8-2.disabled .s8-3,
    .s8-2.disabled .s8-5,
    .s8-2.disabled .s8-6,
    .s8-2.disabled .product-image img{opacity: .3;pointer-events: none;}
    
    .s8-10{overflow: hidden;min-height: 100%;}
    .s8-10 .swiper{padding: 0 var(--sl);}
    .s8-10 .swiper-slide{transition: opacity .5s;height: auto;cursor: pointer;background-color: var(--c5);}
    .s8-10 .swiper-slide-thumb-active{pointer-events: none;}
    .s8-10 .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide ~ .swiper-slide{opacity: 0;}
    .s8-10 .product-image{position: relative;display: flex;background-color: var(--c5);border: var(--sl) solid var(--c6);margin: 0 calc(-1 * var(--sl));}
    .s8-10 .product-image::before{content: "";flex: none;width: 0;padding-top: 90%;}
    
    .s8-11{display: grid;grid-template-columns: 1fr 4fr;grid-gap: 10rem 0;align-items: flex-start;}
    .s8-11-1{font-size: var(--f-b);}
    .s8-11-3{opacity: .5;text-decoration: underline;font-size: var(--f-hint);letter-spacing: -.04em;}
    
    .s9-2{display: grid;grid-template-columns: 3fr 1fr;grid-gap: 0;align-items: flex-end;margin-bottom: 20rem;}
    .s9-3{padding-top: 40rem;border-top: var(--sl) solid var(--c7);display: grid;grid-template-columns: 1fr auto;grid-gap: 70rem;position: relative;z-index: 12}
    .s9-3-1{display: flex;}
    .s9-3-2{display: flex;}
    .s9-3-2 .toolbar-dropdown{left: auto;right: 0;}
    .s9-4{margin-top: 40rem;}
    .s9-5{padding-right: 70rem;}
    .s9-5-2{max-width: 368rem;margin-top: 20rem;opacity: .8;}
    
    .s10-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 50rem var(--gap);align-items: baseline;grid-template-rows: auto 1fr;}
    .s10-2{display: grid;grid-template-columns: auto;grid-gap: 50rem;}
    .s10-3{padding-left: 80rem;grid-row-end: span 2;position: sticky;top: calc(var(--headroom-height) + 50rem);}
    .s10-4{padding: 35rem 50rem;background-color: var(--c4);}
    .s10-4-1{margin-bottom: 40rem;font-size: var(--f-l);letter-spacing: -.04em;line-height: 1;color: var(--c3);font-weight: 600;}
    .s10-4-3{margin-top: 30rem;}
    .s10-5{display: grid;grid-template-columns: auto;grid-gap: 80rem;}
    .s10-6{}
    .s10-7-1{margin-bottom: 30rem;font-size: var(--f-l);letter-spacing: -.04em;line-height: 1;color: var(--c3);font-weight: 600;padding-bottom: 20rem;border-bottom: var(--sl) solid var(--c6);}
    .s10-8{font-size: var(--f-l);letter-spacing: -.04em;line-height: 1;color: var(--c3);font-weight: 600;}
    .s10-9{margin-top: 20rem;}
    .s10-10{margin-top: 40rem;}
    .s10-11{margin-top: 40rem;display: grid;grid-template-columns: auto;grid-gap: 25rem;}
    .s10-12{margin-top: 30rem;display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: baseline;font-size: var(--f-l);letter-spacing: -.04em;line-height: 1;font-weight: 600;padding-top: 20rem;border-top: var(--sl) solid var(--c6);}
    .s10-13{display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: baseline;}
    .s10-13:not(:first-child){padding-top: 25rem;border-top: var(--sl) solid var(--c6);}
    .s10-13-1{font-weight: 500;letter-spacing: -.04em;opacity: .6;max-width: 370rem;}
    .s10-13-2{white-space: nowrap;text-align: right;font-size: var(--f-m);font-weight: 600;letter-spacing: -.04em;}
    
    .s11-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);grid-template-rows: 1fr auto;grid-template-areas: "h1 h2" "h3 h2";}
    .s11-2{grid-area: h1;padding: 80rem 0 100rem;font-size: var(--f-xxxl);font-weight: 500;}
    .s11-3{grid-area: h2;display: flex;align-items: flex-end;background-color: var(--c4);position: relative;}
    .s11-3::before{content: "";flex: none;width: 0;padding-top: 75%;}
    .s11-4{padding: 20rem;margin-bottom: var(--sl);display: flex;align-items: flex-end;width: 100%;justify-content: flex-end;}
    .s11-4-1{opacity: .3;padding-left: 400rem;}
    .s11-5{grid-area: h3;border-top: var(--sl) solid var(--c7);border-bottom: var(--sl) solid var(--c7);padding: 20rem 0;display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: center;}
    .s11-5-1{max-width: 280rem;opacity: .8;min-height: 55rem;}
    .s11-5-2{margin-right: 30rem;overflow: hidden;}
    .s11-6{mix-blend-mode: multiply;}
    .s11-6 img{height: auto;}
    
    .s12-1{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--gap);}
    .s12-2{}
    .s12-3{display: flex;border: var(--sl) solid var(--c6);position: relative;z-index: 1;align-items: flex-end;min-height: 370rem;background-color: var(--c0);padding: 30rem;}
    .s12-3::before{content: "";flex: none;width: 0;padding-top: 80%;}
    .s12-3-1{mix-blend-mode: multiply;position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: -1;}
    .s12-3-1 > img{object-position: right;}
    .s12-3-2{color: var(--c3);font-weight: 600;font-size: var(--f-l);letter-spacing: -.04em;line-height: .9;}
    .s12-3-2 a{max-width: 275rem;display: inline-block;}
    .s12-3-3{width: max(20px, 25rem);height: max(20px, 25rem);color: var(--c3);display: flex;align-items: center;margin-left: 30rem;opacity: 0;transform: translateX(-100%);}
    
    .s13{overflow: hidden;background-color: var(--c0);}
    .s13:not(:last-child) .s13-1{border-bottom: var(--sl) solid var(--c6);padding-bottom: 100rem;}
    .s13-1{display: grid;position: relative;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s13-2{mix-blend-mode: multiply;position: relative;height: 900rem;}
    .s13-2 img{position: absolute;right: 0;top: 0;width: auto;height: 100%;max-width: none;pointer-events: none;}
    .s13-3{padding: 190rem 215rem 0;}
    
    .s14{overflow: hidden;background-color: var(--c0);}
    .s14-1{display: grid;position: relative;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s14-2{mix-blend-mode: multiply;position: relative;height: 700rem;}
    .s14-2 img{position: absolute;right: 0;top: 0;width: auto;height: 100%;max-width: none;pointer-events: none;}
    .s14-3{padding: 0;order: -1;}
    .s14-3 .titlebox-subtitle{max-width: 335rem;}
    
    .s15{overflow: hidden;background-color: var(--c2);}
    .s15-1{display: grid;position: relative;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s15-2{position: relative;margin-bottom: 50rem;}
    .s15-2 img{position: absolute;right: -115rem;bottom: 0;width: auto;height: 130%;max-width: none;pointer-events: none;}
    .s15-3{padding: 280rem 0 280rem 150rem;margin: auto 0;}
    
    .s16-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 25rem var(--gap);grid-template-rows: auto 1fr;align-items: flex-start;}
    .s16-2-1 .title{color: var(--c3);font-size: var(--f-l);font-weight: 600;}
    .s16-2-2{margin-top: 15rem;display: grid;grid-template-columns: auto;grid-gap: .25em;font-size: var(--f-xs);color: var(--c8);}
    .s16-2-2 b{color: var(--c1);font-weight: 500;}
    .s16-3{position: relative;overflow: hidden;display: flex;grid-row-end: span 2;}
    .s16-3::before{content: "";flex: none;width: 0;padding-top: 90%;}
    .s16-4{overflow: hidden;}
    .s16-4-2{margin-top: 35rem;padding: 20rem 0;border-top: var(--sl) solid var(--c6);border-bottom: var(--sl) solid var(--c6);}
    .s16-4-3{margin-top: 25rem;}
    
    .s16-4 .s10-11{margin: 0;}
    .s16-4 .s10-12:not(:last-child){padding-bottom: 20rem;border-bottom: var(--sl) solid var(--c6);margin-bottom: 20rem;}
    
    .s16-4 .shopcart-controls,
    .s16-4 .shopcart-del{display: none;}
    
    
    .s404-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s404-2{display: flex;flex-direction: column;}
    .s404-3{margin: auto 0;padding: 50rem 0;}
    .s404-4{display: flex;align-items: center;justify-content: center;}
    .s404-5{margin-top: 50rem;border-top: var(--sl) solid var(--c7);border-bottom: var(--sl) solid var(--c7);padding: 30rem 0;display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: center;}
    .s404-5-1{font-size: var(--f-l);font-weight: 600;line-height: .9;letter-spacing: -.04em;opacity: .8;}
    .s404-5-2{display: inline-grid;grid-auto-flow: column;grid-gap: var(--gap);}
    .s404-6{background-color: var(--c6);display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--sl);overflow: hidden;}
    .s404-6-1{position: relative;display: flex;background-color: var(--c4);}
    .s404-6-1 img{mix-blend-mode: multiply;}
    .s404-6-1::before{content: "";flex: none;width: 0;padding-top: 85%;}
    
}

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

        --f-xxs: 14rem;
        --f-hint: 14rem;
        --f-xs: 16rem;
        --f-s: 16rem;
        --f-d: 16rem;
        --f-m: 18rem;
        --f-b: 20rem;
        --f-l: 24rem;
        --f-xl: 28rem;
        --f-xxl: 36rem;
        --f-xxxl: 50rem;
        
        --wr: 10rem;
        --gap: 10rem;
        
        --mw: 600rem;
       
        --headroom-start: 35rem;
        
    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
    
    .popup-active{overflow: hidden;}
    .popup-active .alert-bar{margin-top: calc(-1 * var(--headroom-start));}
    
    .preloader-logo{max-width: 125rem;}
    .preloader-image{max-width: 125rem;margin-top: 10rem;}
    
    .button{height: 55rem;}
    .button-text{font-size: var(--f-m);}
    
    .topbar{transition: background-color .25s 0s;}
    .topbar-nav{display: none;}
    .topbar-action{grid-template-columns: auto;grid-auto-flow: column;margin-left: auto;grid-gap: 15rem;}
    .topbar-cart{width: 18rem;height: 18rem;margin-left: auto;margin-right: 6rem;}
    .topbar-cart-icon{width: 18rem;height: 18rem;align-items: center;justify-content: center;}
    .topbar-cart-num{min-width: 12rem;height: 12rem;padding: 0 1rem 1rem;font-size: 8rem;width: auto;}
    
    .topbar-grid{padding: 10rem 0;grid-template-columns: 1fr auto 1fr;grid-gap: 20rem;}
    .topbar-logo{max-width: 64rem;}
    .topbar-search{display: flex;align-items: center;justify-content: center;width: 16rem;height: 16rem;opacity: 1;margin-left: auto;transition: opacity .25s .25s;color: var(--c3);}
    
    .alert-bar{padding: 0;font-size: var(--f-s);font-weight: 400;transition: all .25s;overflow: hidden;white-space: nowrap;height: var(--headroom-start);display: flex;align-items: center;}
    
    .header{}
    
    .title__default{font-size: var(--f-xxxl);}
    
    .titlebox-title{font-size: var(--f-xxxl);}
    .titlebox-subtitle,
    .titlebox-subtitle__large{max-width: 320rem;font-size: var(--f-d);}
    .titlebox-subtitle:not(:first-child){margin-top: 20rem;}
    
    .section:first-child{margin-top: 15rem;}
    .section:not(:first-child){margin-top: 80rem;}
    .section-footer{margin-top: 20rem;}
    
    .footer{margin-top: 80rem;padding: 30rem 0 15rem;}
    .footer-grid{grid-template-columns: auto;grid-template-areas: "a2" "a3" "a4" "a1" "a5";}
    .f1{margin-top: 45rem;margin-bottom: 0;}
    .f2-1{max-width: 125rem;}
    .f2-2{max-width: 340rem;margin-top: 30rem;}
    .f3{margin-top: 40rem;grid-template-columns: auto;grid-gap: 40rem;}
    .f3-1:nth-child(odd):last-child{grid-column: 1/-1;}
    .f3-1-1{margin-bottom: 20rem;}
    .f3-1-2 ul{grid-gap: 1em;}
    .f4{margin-top: 60rem;}
    .f4-1{margin-bottom: 20rem;}
    .f5{grid-template-columns: auto;grid-gap: 10rem;margin-top: 10rem;}
    
    .contact-group{grid-gap: 15rem;}
    .contact{font-weight: 500;}
    
    .carousel-buttons{grid-gap: 12rem;}
    .carousel-button{width: 20rem;height: 20rem;}
    
    .expand-title-icon{width: 20rem;height: 20rem;}
    
    .catalog{grid-template-columns: auto;grid-gap: 20rem;padding: 0;}
    .catalog-item{margin: 0;}
    
    .rating{width: 70rem;height: 13rem;}
    
    .author-image{width: 42rem;height: 42rem;margin-right: 10rem;}
    .author-subtitle{margin-top: 0;}
    
    .curtain{height: calc( var(--app-height) );display: flex;}
    
    .menu{padding: 10rem var(--wr) 0;display: flex;flex-direction: column;transition: opacity .25s;opacity: 0;min-height: 100%;width: 100%;overflow: auto;}
    .menu-list{margin: 20rem 0 50rem;display: grid;grid-template-columns: auto;grid-gap: 20rem;}
    .menu-list-button{font-size: var(--f-xxl);font-weight: 500;letter-spacing: -.04em;opacity: .8;display: inline-flex;align-items: center;}
    .menu-list-button:not(:last-child){color: var(--c3);opacity: 1;}
    .menu-list-button:not(:last-child)::after{content: ">";margin-left: .25em;}
    .menu-footer{margin-top: auto;position: sticky;bottom: 0;z-index: 1;padding: 0 0 10rem 0;background-color: var(--c4);}
    
    .menu-list-expand{display: grid;grid-template-columns: auto;grid-gap: 15rem;height: auto;opacity: 1;margin-top: 20rem;}
    
    .curtain-col{margin: 0;grid-template-columns: 20rem 1fr;grid-gap: 0 10rem;}
    .curtain-col-caption{font-size: var(--f-m);transition: all .15s;}
    .curtain-col-icon{height: 20rem;display: flex;align-items: center;justify-content: center;}
    .curtain-col-nav{overflow: hidden;height: 0;opacity: 0;max-width: 680rem;padding: 0;transition: all .15s;width: 100%;}
    .curtain-col-nav ul{margin-left: 20rem;}
    
    .curtain-col:nth-child(3) .curtain-col-icon{transform: rotate(-90deg);}

    .curtain-col.active .curtain-col-caption{color: var(--c3);opacity: 1;}
    .curtain-col.active .curtain-col-nav{opacity: 1;height: auto;padding: 15rem 0 10rem;}
    
    .search-field{height: 35rem;padding: 0 40rem 0 10rem;border-radius: 0;}
    .search-icon{height: 100%;width: 40rem;padding: 10rem;}
    
    .aside{padding: 0 var(--wr);}
    .aside-header{padding: 20rem 0;}
    .aside-title{font-size: var(--f-xxl);}
    .aside-close,
    .aside-close .icon{height: 15rem;width: 15rem;}
    .aside-footer{padding: 15rem 0;margin-top: 30rem;}
    
    .aside-header,
    .aside-footer{margin-left: var(--awr);margin-right: var(--awr);padding-left: var(--wr);padding-right: var(--wr);}
    
    .modal{top: 0;height: var(--app-height);overflow: auto;padding: 20rem var(--wr);display: flex;flex-direction: column;transform: none;left: 0;}
    .modal-close{width: 20rem;height: 20rem;}
    .modal-title{font-size: var(--f-xxl);}
    .modal-content{flex: auto;margin-top: 20rem;}
    
    .modal.active{transform: none;}
    
    .offer-grid{grid-template-columns: auto;grid-gap: 20rem;margin-bottom: 15rem;}
    .offer-item{padding-top: 10rem;}
    .offer-note-icon{margin-right: 10rem;}
    .offer-note-text{font-size: var(--f-xxs);line-height: 1;}
    .offer-footer{margin-top: 15rem;bottom: 0;position: sticky;z-index: 1;}
    
    .hero-figures{width: 155rem;height: 25rem;}
    
    .chips-group-inner{margin: -3rem;}
    .chip-button{padding: 3rem;width: calc(100% / 3);}
    .chip{padding: 3rem;height: 40rem;}
    .chip-text{font-size: var(--f-xxs);}
    
    .product-arrows .carousel-button{margin: 0 15rem;width: 15rem;}
    .product-tags .tag{height: 28rem;font-weight: 400;font-size: var(--f-s);}
    .product-spinner-control{height: 55rem;min-width: 55rem;}
    .product-label{padding: 15rem;}
    
    .shopcart{grid-gap: 10rem;}
    .shopcart-row{padding-top: 10rem;}
    .shopcart-item{align-items: flex-end;grid-gap: 20rem 10rem;grid-template-areas: "c2 c2" "c4 c4" "c3 c5";grid-template-rows: auto;}
    .shopcart-price{text-align: left;}
    .shopcart-price-val{font-size: var(--f-b);}
    
    .formbox-caption-subtitle{font-size: var(--f-xxs);}
    .formbox-row{flex-direction: column;}
    .formbox-cell{margin: 5rem 0;}
    .formbox-cell:first-child{margin-top: 0;}
    .formbox-cell:last-child{margin-bottom: 0;}
    
    .selectbox-row{flex-direction: column;}
    .selectbox-cell{margin: 20rem 0 0;}
    .selectbox-cell:first-child{margin-top: 0;}
    
    .textfield-input{padding: 15rem 10rem;}
    
    .burger{display: flex;align-items: center;justify-content: center;flex: none;width: 20rem;height: 20rem;color: var(--c3);}
    .burger-icon{position: relative;height: 1.5rem;width: 100%;background-color: currentColor;transition: background-color 0s .25s;}
    .burger-icon::before,
    .burger-icon::after{content: "";position: absolute;left: 0;height: 100%;width: 100%;background-color: currentColor;}
    .burger-icon::before{bottom: 6rem;transition-property: bottom, transform;transition-duration: .25s;transition-delay: .25s, 0s;}
    .burger-icon::after{top: 6rem;transition-property: top, transform;transition-duration: .25s;transition-delay: .25s, 0s;}    

    .curtain.active ~ .topbar .burger-icon{background-color: rgba(0,0,0,0);}
    .curtain.active ~ .topbar .burger-icon::before{bottom: 0;transform: rotate(-45deg);transition-delay: 0s, .25s;}
    .curtain.active ~ .topbar .burger-icon::after{top: 0;transform: rotate(45deg);transition-delay: 0s, .25s;}

    .curtain.active .menu{opacity: 1;transition-delay: .25s;}
    .curtain.active ~ .topbar{background-color: var(--c4);transition-delay: .5s;}
    .curtain.active ~ .topbar .topbar-search{opacity: 0;transition-delay: 0s;}

    .help-button-layer{max-width: 100%;min-width: 100rem;margin-top: 15rem;}
    .help-button-layer::before{display: none;}
    .help-button-icon::after{content: "";}
    
    .related:not(:first-child){margin-top: 65rem;}
    .related-title{font-size: var(--f-b);}
    .related-content-inner{max-width: 270rem;}
    .related-content-inner .swiper{margin: 0 -20rem;}
    .related-content-inner .swiper-slide{padding: 0 20rem;}
    
    .card-1 .card-tags .tag{height: 28rem;font-weight: 400;font-size: var(--f-s);}
    .card-1 .card-price-val{font-size: var(--f-b);}
    .card-1.disabled .card-subtitle{display: none;}
    
    .card-2{padding: 25rem 15rem 30rem;}
    .card-2 .card-header{grid-gap: 25rem;}
    .card-2 .card-title{font-size: var(--f-b);font-weight: 600;}
    .card-2 .card-content{width: 100%;max-width: 290rem;}
    .card-2 .card-footer{margin-top: 70rem;padding-right: 10rem;}
    
    .card-3 .card-tags .tag{height: 28rem;font-weight: 400;font-size: var(--f-s);}
    .card-3 .card-price-val{font-size: var(--f-b);}
    
    .card-4 .card-media{width: 110rem;margin-right: 10rem;}
    .card-4 .card-footer{min-height: 110rem;}
    .card-4 .card-price-val{font-size: var(--f-b);}
    
    .s1:first-child{margin-top: 50rem;}
    .s1-1{grid-template-columns: auto;}
    .s1-2{grid-column: 1/-1;}
    .s1-3:not(:last-child){margin-bottom: 40rem;}
    
    .s2-1{grid-template-columns: auto;}
    .s2-2{overflow: hidden;order: -1;padding: 0 0 10rem;}
    .s2-2:first-child{padding: 20rem;}
    .s2-5{margin-top: 70rem;}
    .s2-5-2{max-width: 115rem;}
    
    .s3-1{grid-template-columns: auto;grid-gap: 30rem;}
    .s3-3 .expand{padding-bottom: 25rem;}
    .s3-3 .expand-title{padding-top: 25rem;padding-right: 0;}
    .s3-3 .expand.active .expand-content{padding-top: 30rem;}
    
    .s4-2{margin-bottom: 20rem;}
    .s4-3{margin-bottom: 20rem;}
    .s4-4{font-size: var(--f-d);}
    .s4-5{margin-top: 30rem;}
    
    .s5-2{padding-bottom: 15rem;grid-gap: 50rem;}
    .s5-3 .title{font-size: var(--f-xxl);}
    .s5-5{margin: 15rem var(--awr) 0;padding: 0 var(--wr);overflow: hidden;}
    .s5-5 .swiper{overflow: visible;}
    
    .s6-2{padding-bottom: 15rem;grid-gap: 50rem;}
    .s6-3 .title{font-size: var(--f-xxl);}
    .s6-5{margin: 15rem var(--awr) 0;padding: 0 var(--wr);overflow: hidden;}
    .s6-5 .swiper{overflow: visible;}
    
    .s7-1{grid-template-columns: auto;grid-gap: 40rem;}
    .s7-2-2{max-width: 200rem;}
    .s7-2-2:not(:first-child){margin-top: 15rem;}
    .s7-3{border-top: var(--sl) solid var(--c6);grid-gap: 15rem;padding-top: 15rem;}
    .s7-4{padding-bottom: 15rem;grid-template-columns: auto;grid-gap: 25rem;}
    .s7-4-1{font-size: var(--f-m);font-weight: 500;}
    .s7-4-2{max-width: 280rem;}
    
    .s8:first-child{margin-top: 15rem;}
    .s8-1{display: flex;align-items: baseline;}
    .s8-1-1{display: inline-flex;position: relative;opacity: .6;}
    .s8-1-1::before,
    .s8-1-2 li::before{content: "<";line-height: 1;}
    .s8-1-1::before{margin-right: .25em;}
    .s8-1-2 li::before{margin: 0 .25em;opacity: .6;}
    .s8-1-2 li:not(:last-child){display: none;}
    .s8-2{grid-template-columns: auto;}
    .s8-3{grid-template-columns: auto;grid-gap: 15rem;padding: 10rem 0 0;order: -2;}
    .s8-3-2{text-align: left;grid-gap: 0;}
    .s8-4{margin-top: 10rem;min-height: 0;}
    .s8-5:not(:first-child){margin-top: 10rem;border-top: none;padding-top: 0;}
    .s8-5-2:not(:first-child){margin-top: 10rem;}
    .s8-5-3:not(:first-child){margin-top: 30rem;padding-top: 10rem;grid-template-columns: auto;grid-gap: 0;}
    .s8-6{padding: 30rem 0 0;grid-gap: 30rem;}
    .s8-6:not(:first-child){margin-top: 10rem;}
    .s8-7{order: -1;align-items: baseline;}
    .s8-7:not(:first-child){margin-top: 25rem;border-bottom: var(--sl) solid var(--c7);padding: 10rem 0;}
    .s8-7-2{flex-direction: column;align-items: flex-end;}
    .s8-7-2 .product-price-old{margin-right: 0;order: 1;margin-top: 5rem;font-size: var(--f-d);}
    .s8-8{padding: 10rem 0;margin-bottom: -10rem;}
    .s8-9:not(:first-child){margin-top: 45rem;}
    .s8-9 .expand{padding-bottom: 15rem;}
    .s8-9 .expand-title{padding-top: 15rem;padding-right: 0;}
    .s8-9 .expand-title-name{font-size: var(--f-m);font-weight: 500;}
    .s8-11{grid-template-columns: auto;grid-gap: 0;}
    .s8-11-1{margin-bottom: 15rem;}
    .s8-11-3{margin-top: 5rem;}
    
    .s9-2{grid-template-columns: auto;grid-gap: 0;}
    .s9-3{padding-top: 0;grid-template-columns: auto;grid-gap: 0;grid-auto-flow: row;}
    .s9-3-1,
    .s9-3-2{display: none;margin-top: 15rem;}
    .s9-3-1 .dropdown{padding: 20rem 0 0 30rem;}
    .s9-3-2 .dropdown{padding: 0;display: block;}
    .s9-3-3{border-bottom: var(--sl) solid var(--c7);padding: 15rem 0;}
    .s9-4{margin-top: 20rem;}
    .s9-5{padding: 0;}
    .s9-5-2{max-width: 295rem;margin-top: 15rem;}
    .s9-6{display: none;}
    
    .toolbar{display: grid;grid-auto-flow: row;align-items: flex-start;grid-gap: 15rem;}
    .toolbar-button-text{font-weight: 500;}
    .toolbar-dropdown{position: relative;margin: 0;top: 0;}
    
    .dropdown{min-width: 100%;box-shadow: none;width: auto;}
    .dropdown-close{display: none;}
    .dropdown-expand-title{font-size: var(--f-xxs);}
    .dropdown .checkbox-group-caption, 
    .dropdown .selectbox-caption{font-size: var(--f-xxs);}
    .dropdown .checkbox-label-name,
    .dropdown .selectbox-title-label{font-size: var(--f-xxs);}
    
    .dropdown-expand.active .dropdown-expand-content{padding: 15rem 0 10rem;}

    .toolbar-mobile{display: grid;grid-template-columns: auto 1fr auto;grid-gap: 15rem;align-items: center;line-height: 0;}
    .toolbar-mobile .toolbar-button-text{opacity: .8;font-size: var(--f-xxs);line-height: 1;}
    .toolbar-mobile .toolbar-reset-button .toolbar-button-text{opacity: 1;color: var(--c3);}
    
    .s10-1{grid-template-columns: auto;grid-gap: 0;}
    .s10-2{margin-top: 80rem;grid-gap: 0;}
    .s10-3{grid-row-end: span 1;padding: 0;order: -1;position: relative;top: auto;padding: 0;}
    .s10-3 .s10-11{margin-top: 20rem;}
    .s10-3 .s10-13-1{font-size: var(--f-b);font-weight: 600;opacity: .8;}
    .s10-3 .s10-13-2{font-size: var(--f-xl);}
    .s10-4{padding: 35rem var(--wr);margin: 0 var(--awr);margin-top: 40rem;}
    .s10-4-1{font-size: var(--f-xl);margin-bottom: 30rem;}
    .s10-4-3{margin-top: 15rem;}
    .s10-5{grid-gap: 40rem;margin-top: 40rem;}
    .s10-6{margin-top: 20rem;position: sticky;bottom: 10rem;z-index: 1;}
    .s10-8{font-size: var(--f-xl);}
    .s10-7-1{font-size: var(--f-xl);margin-bottom: 15rem;padding-bottom: 15rem;}
    .s10-9{margin-top: 15rem;}
    .s10-11{grid-gap: 20rem;margin-top: 80rem;}
    .s10-12{margin-top: 20rem;padding: 15rem 0;border-bottom: var(--sl) solid var(--c6);}
    .s10-13{grid-gap: 10rem;}
    .s10-13:not(:first-child){padding-top: 20rem;}.
    .s10-13-2 {white-space: normal;}
    
    .s11-1{grid-template-columns: auto;grid-template-areas: "h1" "h2" "h3";grid-template-rows: auto;grid-gap: 15rem;overflow: hidden;}
    .s11-2{padding: 0;}
    .s11-2 .title{line-height: .8;}
    .s11-3{flex-direction: column;}
    .s11-3::before{display: none;}
    .s11-4{padding: 10rem;grid-gap: var(--gap);margin: 0;display: grid;grid-template-columns: 1fr 1fr;}
    .s11-4-1{font-size: var(--f-xxs);margin-left: auto;order: 1;padding: 0;}
    .s11-4-2{overflow: hidden;}
    .s11-5{padding: 10rem 0;position: relative;grid-template-columns: auto;}
    .s11-5-1{max-width: 300rem;min-height: 0;}
    .s11-6{position: relative;display: flex;width: 100%;}   
    .s11-6::before{content: "";flex: none;width: 0;padding-top: 75%;}
    
    .s12-1{grid-template-columns: auto;}
    .s12-2{padding-bottom: 10rem;}
    .s12-2 .titlebox-title{font-size: var(--f-xxl);}
    .s12-3{padding: 25rem 20rem;min-height: 0;}
    .s12-3-1 img{object-position: left bottom;}
    .s12-3-2{font-size: var(--f-xl);font-weight: 500;}
    
    .s13:not(:last-child) .s13-1{padding-bottom: 50rem;}
    .s13-1{grid-template-columns: auto;grid-gap: 40rem;}
    .s13-2{height: 300rem;order: 1;}
    .s13-3{padding: 0;}
    .s13-3 .titlebox-title{font-size: var(--f-xxl);font-weight: 500;}
    .s13-3 .titlebox-subtitle{max-width: none;}
    .s13-3 .titlebox-action .button{min-width: calc( (100% - var(--gap)) / 2 );}
    
    .s14-1{grid-template-columns: auto;grid-gap: 0;}
    .s14-2{height: 300rem;order: 1;margin-top: -30rem;}
    .s14-2 img{right: auto;left: 0;}
    .s14-3{padding: 0;position: relative;z-index: 2;}
    .s14-3 .titlebox-title{font-size: var(--f-xxl);font-weight: 500;}
    .s14-3 .titlebox-subtitle{max-width: 250rem;}
    .s14-3 .titlebox-action .button{min-width: calc( (100% - var(--gap)) / 2 );}
    
    .s15-1{grid-template-columns: auto;grid-gap: 20rem;padding: 40rem 0 50rem;}
    .s15-2{height: 400rem;order: 1;margin: 0;}
    .s15-2 img{height: 100%;right: 0;}
    .s15-3{padding: 0;position: relative;z-index: 2;}
    .s15-3 .titlebox-title{font-size: var(--f-xxl);font-weight: 500;}
    .s15-3 .titlebox-subtitle{max-width: none;}
    .s15-4{order: 1;position: relative;z-index: 2;}
    .s15-4 .button{min-width: calc( (100% - var(--gap)) / 2 );}
    
    .s16-1{grid-template-rows: auto;grid-template-columns: auto;grid-gap: 10rem;}
    .s16-2{order: -1;}
    .s16-3{grid-row-end: span 1;}
    
    .s404-1{grid-template-columns: auto;grid-gap: 0;}
    .s404-3{padding: 0;margin: 30rem auto;}
    .s404-5{grid-template-columns: auto;padding: 0;border: none;grid-gap: 35rem;}
    .s404-5-1{padding: 15rem 0;text-align: center;border-top: var(--sl) solid var(--c7);border-bottom: var(--sl) solid var(--c7);}
    .s404-5-2 .button{width: 100%;}
    .s404-6{display: none;}
    
    
}

@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
     
    .f3-1:nth-child(1){padding-right: var(--gap);}
    .f3-1:nth-child(2){margin-left: calc(-1 * var(--gap));grid-column-end: span 2;}
    .f3-1:nth-child(2) .f3-1-2 ul{grid-gap: 10rem var(--gap);grid-template-columns: 1fr 1fr;}
    
    
    .s5-5 .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide ~ .swiper-slide{opacity: 0;}
    
    .s8-2{grid-template-areas: "a2 a1" "a2 a5" "a2 a3" "a2 a4" "a2 a6" "a8 a7";grid-template-rows: auto auto 1fr auto auto auto;}
    .s8-3{grid-area: a1;}
    .s8-4{grid-area: a2;}
    .s8-5{grid-area: a3;}
    .s8-6{grid-area: a4;}
    .s8-7{grid-area: a5;}
    .s8-8{grid-area: a6;}
    .s8-9{grid-area: a7;}
    .s8-10{grid-area: a8;}
    .s8-11-1{padding-right: 15rem;min-height: max(45px, 50rem);display: flex;align-items: center;}
    .s8-11-3{grid-column: 2/3;}
    
    .s10-9 .shopcart-item{grid-gap: 15rem 20rem;padding-left: 130rem;min-height: 110rem;}
    .s10-9 .shopcart-media{width: 110rem;}
    .s10-9 .shopcart-title-name{max-width: none;min-height: 0;}
    .s10-9 .shopcart-subtitle{margin-top: 15rem;}
    .s10-9 .shopcart-tags .tag{padding: 5rem;}
    
    .s12-3:nth-last-child(-n+2){grid-column-end: span 2;}
    .s12-3:nth-last-child(-n+2)::before{padding-top: 40%;}
    
    .s16-2-1 .title br{display: none;}
    .s16-4 .scrollbox .mb-content{max-height: calc(3 * (110rem + 15rem + var(--sl)) + 2 * 15rem + 1px + 10rem + var(--f-d));}
    
    .s16-4 .shopcart-item{padding-left: 130rem;min-height: 110rem;}
    .s16-4 .shopcart-media{width: 110rem;}
    
    .scrollbox{overflow: visible;width: 100%;position: relative;}
    .scrollbox .mb-bar,
    .scrollbox .mb-track{position: absolute;z-index: 10;opacity: 1;}
    .scrollbox .mb-track-x{display: none;}
    .scrollbox .mb-track{width: 5rem;right: 0;top: 0;background-image: linear-gradient(var(--c6), var(--c6));background-repeat: repeat-y;background-size: var(--sl);background-position: center;height: 100%;left: auto;bottom: 0;}
    .scrollbox .mb-bar{background-color: var(--c3);top: 0;transform-style: preserve-3d;left: 0;cursor: grab;border-radius: 999rem;height: 100%;width: 100%;}
    .scrollbox .mb-bar:active{cursor: grabbing;}
    .scrollbox .mb-bar::after{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 1;margin: 0 -15rem;}
    .scrollbox .mb-content{overflow: auto;width: 100%;height: 100%;position: relative;overflow: -moz-scrollbars-none!important;scrollbar-width: none;max-height: calc(3 * (110rem + 15rem + var(--sl)) + 2 * 15rem + 1px);padding-right: 40rem!important;margin-right: 0!important;}
    .scrollbox .mb-content::-webkit-scrollbar{display: none;}
    
    .scrollbox:not(.mb-scroll-y) .mb-track{opacity: 0;}
    .scrollbox:not(.mb-scroll-y) .mb-content{padding-right: 0;}

    
}

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

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
   
    .topbar-cart-icon,
    .search-icon{transition: all .15s;}
    
    .topbar-cart:hover .topbar-cart-icon,
    .topbar-search .search-field:not(:focus) ~ .search-icon:hover{opacity: 1;color: var(--c3);}
    
    .f2-1-1{transition: opacity .5s;}
    
    .f1::before{transition: background-color .5s;}
    .footer-area{transition: color .5s;}
    
    .f1:hover::before{background-color: var(--c3);}
    .f1:hover,
    .f1:hover ~ .footer-area{color: var(--c0);}
    .f1:hover ~ .footer-area .f4-2 a{transition-duration: 0s;}
    .f1:hover ~ .f2 .f2-1-1{opacity: 0;}
    
    .contact a,
    .carousel-button,
    .curtain-col-caption a{transition: color .15s;}
    .contact a:hover,
    .carousel-button:hover,
    .curtain-col-caption a:hover{color: var(--c3);}
    
   
    .curtain-col-nav a,
    .f3-1-2 a,
    .f5 a{transition-property: background-size;transition-duration: .5s;background-size: 0 var(--sl);background-repeat: no-repeat;background-position: right bottom;background-image: linear-gradient(currentColor, currentColor);display: inline;}
    
    .curtain-col-nav a:hover,
    .f3-1-2 a:hover,
    .f5 a:hover{background-size: 100% var(--sl);background-position: left bottom;}
    
    
    .button,
    .chip,
    .product-spinner-control{transition: all .15s;}
    
    .button__default:hover,
    .product-spinner-control:hover{background-color: rgba(0,0,0,0);color: var(--c3);}
    .button__secondary:hover{background-color: var(--c3);color: var(--c0);}
    
    .chip:hover{border-color: var(--c3);}
    
    .card-1:hover{z-index: 2;}
    
    .card-1 .card-media img,
    .card-3 .card-media img{transition: transform .5s;will-change: transform;overflow: hidden;}
    .card-1:hover .card-media img,
    .card-3:hover .card-media img{transform: scale(1.05);}
    
    .card-1 .card-media::after{transition: opacity .25s;}
    .card-1:hover .card-media::after{opacity: .9;}
    
    .card-1 .card-subtitle{}
    
    .card-1 .card-action,
    .card-3 .card-action{transition-property: opacity, transform;will-change: transform;transition-duration: .25s;}
    .card-1:hover .card-action,
    .card-3:hover .card-action{transform: scale(1);opacity: 1;}
    
    .selectbox-title:hover .selectbox-control:not(:checked) ~ .selectbox-title-icon{background-color: var(--c2);}
    .checkbox-label:hover .checkbox-label-control:not(:checked) ~ .checkbox-label-icon::before{color: var(--c2);}
    
    .checkbox-label:hover .checkbox-label-control:not(:checked) ~ .checkbox-label-name{opacity: .8;}
    
    .shopcart-spinner-control{transition: all .15s;}
    .shopcart-spinner-control:hover{border-color: var(--c1);background-color: rgba(0,0,0,0);}
    
    .s4-2,
    .s8-1 a,
    .shopcart-title-name,
    .shopcart-del,
    .aside-summary-del,
    .toolbar-reset-button .toolbar-button-text{transition: all .15s;}
    
    .s4-2:hover,
    .s8-1 a:hover,
    .shopcart-title:hover .shopcart-title-name,
    .shopcart-del:hover,
    .toolbar-reset-button .toolbar-button-text:hover,
    .aside-summary-del:hover{color: var(--c3);opacity: 1!important;}
    
    .s8-11-3{transition: opacity .15s;}
    .s8-11-3:hover{opacity: 1;}
    
    .s11-4-1{transition: opacity .15s;}
    .s11-4-1:hover{opacity: .6;}
    
    .s12-3,
    .s12-3-3{transition: all .5s;}
    .s12-3:hover{background-color: var(--c2);}
    .s12-3:hover .s12-3-3{transform: translateX(0);opacity: 1;}
    
    .topbar-nav a,
    .topbar-nav-curtain{transition: all .25s;}
    .topbar-nav-curtain-icon{will-change: transform;}
    
    .topbar-nav a:hover,
    .curtain.active ~ .topbar .topbar-nav-curtain{color: var(--c3);opacity: 1;}
    .curtain.active ~ .topbar .topbar-nav-curtain-icon{transform: scaleY(-1);}
    
    .toolbar-button:hover .toolbar-button-text{opacity: .8;}
    
}