@charset "UTF-8";

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


:root{
    
    --app-height: 100vh;
    --headroom-height: 100rem;
  
    --c0: #F5F5F5;
    --c1: #000000;
    --c2: #3557E4;
    --c3: #61E0D4;
    --c4: #FFFFFF;
    --c5: #FF0000;
    --c6: #61E0D4;
    --c7: rgba(0,0,0,.05);
    --c8: rgba(0,0,0,.1);
    --c9: rgba(0,0,0,.6);
    --c10: rgba(53,87,228,.1);
    
    
    --wr: 80rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 20rem;
    --sl: max(1px, 1rem);
    
    --br1: 50rem;
    --br2: 40rem;
    --br3: 30rem;
    --br4: 40rem;

    --f-xs: max(12px, 14rem);
    --f-s: max(14px, 18rem);
    --f-d: max(14px, 20rem);
    --f-m: max(14px, 24rem);
    --f-b: max(14px, 30rem);
    --f-l: max(14px, 32rem);
    --f-xl: max(14px, 40rem);
    --f-xxl: max(14px, 50rem);
    --f-xxxl: max(14px, 80rem);
    --f-xxxxl: max(14px, 110rem);
    
    --mw: 1920px; 
    
}

@keyframes ticker {
    0% {
        transform: translate(0,0);
    }
    100% {
        transform: translate(-100%,0);
    }
}

/* globals */

@media screen {

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

    .document{font-weight: 400;font-family: 'Inter', sans-serif;font-size: var(--f-d);line-height: 1.2;color: var(--c1);background-color: var(--c0);letter-spacing: -.05em;}
    
    .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;padding: 40rem 0;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;padding: 0 40rem;height: max(40px, 50rem);position: relative;border-radius: 999rem;background-color: var(--c2);color: var(--c4);background-clip: padding-box;}
    .button:not(.fill){overflow: hidden;}
    .button-text{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;position: relative;z-index: 2;min-width: 0;font-weight: 500;letter-spacing: -.07em;padding: 0 .1em;}
    
    .button:disabled{opacity: .5;cursor: not-allowed;}
    
    .button__wide{width: 100%;}
     
    .title{line-height: 1;}
    .title__large{font-size: var(--f-xxxxl);font-weight: 500;}
    .title__default{font-size: var(--f-xxxl);letter-spacing: -.07em;}
    .title__small{font-size: var(--f-xxl);letter-spacing: -.07em;}
    
    .title b{position: relative;white-space: nowrap;font-weight: inherit;}
    .title b::before{content: "";position: absolute;bottom: .2em;left: 0;width: 100%;height: .1em;background-color: var(--c3);z-index: -1;transform-origin: left bottom;will-change: transform;transition: transform 2s .5s;}
    
    .title.animated:not(.active) b::before{transform: scaleX(0);}
    
    .section-header{text-align: center;margin-bottom: 40rem;}
    .section-header .subtitle{margin-top: 20rem;opacity: .6;}
    .section-header .pretitle{margin-bottom: .25em;opacity: .5;font-size: var(--f-m);letter-spacing: -.07em;}
    
    .container{display: flex;flex-direction: column;min-height: var(--app-height);}
    
    .headroom-trigger{position: absolute;top: 0;height: var(--sl);visibility: hidden;}
    
    .header{background-color: var(--c0);position: sticky;top: 0;z-index: 100;padding: 20rem 0;min-height: 90rem;border-radius: 0 0 var(--br3) var(--br3);transition: background-color .25s;box-shadow: 0 0 0 var(--sl) var(--c0);}
    
    .header.active,
    .popup-active .header{background-color: var(--c4);}
    
    .topbar{display: grid;grid-template-columns: 1fr auto 1fr;grid-gap: 50rem;align-items: center;}
    .topbar-logo{max-width: 180rem;margin-right: auto;}
    .topbar-nav > ul{display: grid;grid-auto-flow: column;grid-gap: 50rem;}
    .topbar-nav > ul > li{position: relative;display: flex;align-items: center;letter-spacing: -.07em;padding: 15rem 0;}
    .topbar-nav-icon{width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;margin-left: 2rem;}
    .topbar-nav ul ul{position: absolute;top: 100%;left: 0;background-color: var(--c4);z-index: 1;padding: 25rem;display: grid;grid-template-columns: auto;grid-gap: 10rem;margin-left: -25rem;border-radius: 5rem;white-space: nowrap;box-shadow: inset 0 0 0 var(--sl) var(--c0);transition: all .15s;}
    
    .topbar-nav > ul > li:not(:hover) ul{visibility: hidden;opacity: 0;transform: translateY(20rem);}
    
    .topbar-action{margin-left: auto;display: grid;grid-auto-flow: column;grid-gap: 30rem;align-items: center;}
    .topbar-search{cursor: pointer;width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;}
    
    .main{margin-top: 0;flex: auto;display: flex;flex-direction: column;}
   
    .section{position: relative;z-index: 1;overflow: hidden;}
    .section:not(:last-child){margin-bottom: 240rem;}
    .section__mbh:not(:last-child){margin-bottom: 120rem;}
    
    .footer{background-color: var(--c4);border-radius: var(--br1) var(--br1) 0 0;padding: 40rem 0 20rem;margin-top: 240rem;overflow: hidden;}
    
    .footer-grid{display: grid;grid-template-columns: repeat(6, minmax(0, 1fr));grid-gap: 50rem var(--gap);grid-template-areas: "f1 f2 . f3 . ." "f5 f5 . f6 f4 f4";letter-spacing: -.07em;align-items: flex-start;}
    
    .f1{grid-area: f1;}
    .f2{grid-area: f2;}
    .f2 ul{display: grid;grid-template-columns: auto;grid-gap: .5em;line-height: 1.1;}
    .f2 ul:not(:first-child){margin-top: var(--gap);}
    .f3{grid-area: f3;display: grid;grid-template-columns: auto;grid-gap: 35rem;line-height: 1.1;}
    .f3-1{display: grid;grid-template-columns: auto;grid-gap: .5em;}
    .f3-1-1{opacity: .6;}
    .f4{grid-area: f4;color: var(--c9);display: grid;grid-template-columns: 1fr auto;grid-gap: 30rem;}
    .f5{grid-area: f5;color: var(--c9);}
    .f6{grid-area: f6;color: var(--c9);}
    
    .footer-author{margin-right: auto;display: flex;align-items: baseline;}
    
    .dd-icon{width: .8em;height: .9em;margin: 0 .3em;color: var(--c2);display: inline-flex;align-items: center;justify-content: center;}
    .dd-icon .icon{width: 100%;}
   
    
    .footer-policy ul{display: grid;grid-auto-flow: column;grid-gap: 30rem;}
    
    .footer-logo{max-width: 180rem;}
    
    .page-header{margin: 100rem 0;text-align: center;}
    .page-header-toolbar{margin-top: 40rem;}
    .page-header-subtitle{margin: var(--gap) auto 0;opacity: .4;letter-spacing: -.07em;font-size: var(--f-m);max-width: 410rem;}
    
    .media-header{position: relative;border-radius: var(--br1);overflow: hidden;background-color: var(--c1);color: var(--c4);margin-bottom: 80rem;}
    .media-header-inner{display: flex;}
    .media-header-inner::before{content: "";flex: none;width: 0;padding-top: 45%;}
    .media-header-content{display: grid;grid-template-rows: 1fr auto 1fr;grid-gap: 0;padding: 40rem 0;width: 100%;position: relative;z-index: 2;}
    .media-header-title{max-width: 920rem;margin: 0 auto;text-align: center;}
    .media-header-subtitle{max-width: 550rem;margin: 10rem auto 0;text-align: center;letter-spacing: -.07em;font-size: var(--f-m);}
    .media-header-bg{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;opacity: .4;}
    
    .media-header .breadcrumbs{margin: 0;}
    
    .carousel-buttons{display: grid;grid-auto-flow: column;grid-gap: 12rem;user-select: none;}
    .carousel-button{background-color: var(--c2);color: var(--c4);width: max(40px, 44rem);height: max(40px, 44rem);padding: 10rem;border-radius: 50%;overflow: hidden;cursor: pointer;display: flex;align-items: center;justify-content: center;}
    .carousel-button.swiper-button-disabled{pointer-events: none;opacity: .1;}
    
    .carousel-buttons__clear{grid-gap: 20rem;}
    .carousel-buttons__clear .carousel-button{width: max(32px, 36rem);height: max(32px, 36rem);padding: 0;background-color: transparent;color: var(--c1);}
    
    .textbox h2{font-size: var(--f-xxl);line-height: 1;letter-spacing: -.07em;margin: 70rem 0 40rem;}
    .textbox h2:first-child{margin-top: 0;}
    .textbox h2:last-child{margin-bottom: 0;}
    .textbox h3{font-size: var(--f-xl);line-height: 1;letter-spacing: -.07em;margin: 70rem 0 20rem;}
    .textbox h3:first-child{margin-top: 0;}
    .textbox h3:last-child{margin-bottom: 0;}
    .textbox p{opacity: .6;}
    .textbox ul{opacity: .6;display: grid;grid-template-columns: auto;grid-gap: 0;}
    .textbox ul:not(:first-child){margin-top: 20rem;}
    .textbox ul li{padding-left: 1.5em;position: relative;}
    .textbox ul li::before{content: "\2022";position: absolute;left: 0;top: 0;text-align: center;width: 1.5em;}
    .textbox figure{overflow: hidden;pointer-events: none;border-radius: var(--br1);margin: 40rem 0;}
    .textbox figure:first-child{margin-top: 0;}
    .textbox figure:last-child{margin-bottom: 0;}
    
    .toolbar{display: grid;grid-template-columns: repeat(6, 1fr);grid-gap: var(--gap);align-items: baseline;}
    .toolbar-nav{grid-column: 2/6;max-width: 780rem;margin: 0 auto;}
    .toolbar-nav .chips-group{justify-content: center;}
    .toolbar-aside{margin-left: auto;}
    
    .chips{overflow: hidden;}
    .chips-caption{margin-bottom: 12rem;letter-spacing: -.07em;}
    .chips-group{display: flex;flex-wrap: wrap;margin: -5rem;}
    .chip{position: relative;overflow: hidden;margin: 5rem;border-radius: 999rem;padding: 8rem 20rem;background-color: var(--c7);color: var(--c1);display: flex;align-items: center;text-align: center;letter-spacing: -.07em;}
    .chip.active{background-color: var(--c2);color: var(--c4);pointer-events: none;}
    
    .reset-button{display: flex;align-items: center;overflow: hidden;cursor: pointer;}
    .reset-button-text{letter-spacing: -.07em;min-width: 0;flex: auto;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
    .reset-button-icon{flex: none;width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;margin-left: .1em;}
    
    .breadcrumbs{overflow: hidden;margin: 40rem 0 30rem;}
    .breadcrumbs ul{display: flex;flex-wrap: wrap;letter-spacing: -.07em;}
    .breadcrumbs li:not(:last-child)::after{content: "\a0/\a0";opacity: .5;}
    .breadcrumbs li:not(:last-child) a{opacity: .5;}
    .breadcrumbs li:last-child{pointer-events: none;}
    
    .formbox{overflow: hidden;display: grid;grid-template-columns: auto;grid-gap: var(--gap);}
    .formbox-row{margin: 0 calc(var(--gap) / -2);display: flex;}
    .formbox-cell{padding: 0 calc(var(--gap) / 2);flex: 1;}
    .formbox-footer{margin-top: 30rem;}
    
    .checkbox-filedset{margin: 30rem 0;}
    .checkbox-filedset:first-child{margin-top: 0;}
    .checkbox-filedset:last-child{margin-bottom: 0;}
    .checkbox-caption{font-size: var(--f-m);margin-bottom: 20rem;}
    .checkbox-group{display: grid;grid-template-columns: auto;grid-gap: 20rem;}
    
    .checkbox{position: relative;overflow: hidden;display: flex;align-items: flex-start;cursor: pointer;min-height: max(20px, 24rem);}
    .checkbox-input{position: absolute;right: 100%;opacity: 0;width: 0;height: 0;overflow: hidden;}
    .checkbox-icon{flex: none;margin-right: 8rem;width: max(20px, 24rem);height: max(20px, 24rem);border-radius: 5rem;border: var(--sl) solid;opacity: .2;transition: all .25s;position: relative;display: flex;align-items: center;justify-content: center;padding: 2rem;}
    .checkbox-icon::after{content: "";background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3332 4L5.99984 11.3333L2.6665 8' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/svg%3E");width: 100%;height: 100%;transform: scale(0);will-change: transform;transition: transform .25s;background-position: center;background-repeat: no-repeat;background-size: contain;}
    .checkbox-text{opacity: .5;transition: opacity .25s;margin: auto 0;}
    
    .checkbox-input:checked ~ .checkbox-icon{opacity: 1;background-color: var(--c2);border-color: transparent;}
    .checkbox-input:checked ~ .checkbox-icon::after{transform: scale(1);}
    .checkbox-input:checked ~ .checkbox-text{opacity: 1;}    
    
    .textfield{display: flex;overflow: hidden;}
    .textfield-input{min-width: 0;flex: auto;text-overflow: ellipsis;background-color: var(--c4);border-radius: 25rem;padding: 20rem 30rem;min-height: max(40px, 50rem);resize: none;width: 100%;}
    .textfield-input:invalid{color: var(--c5);}

    .selector{user-select: none;}
    .selector-holder{background-color: var(--c4);border-radius: 999rem;padding: 0 30rem;min-height: max(50px, 50rem);display: flex;overflow: hidden;align-items: center;cursor: pointer;}
    .selector-holder-input{flex: auto;overflow: hidden;text-overflow: ellipsis;min-width: 0;pointer-events: none;user-select: none;}
    .selector-holder-icon{flex: none;will-change: transform;width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;margin-left: 2rem;}
    
    .selector.active .selector-holder{border-radius: max(25px, 25rem) max(25px, 25rem) 0 0;}
    .selector.active .selector-holder-icon{transform: scaleY(-1);}
    
    .selector-list{background-color: var(--c4);position: absolute;width: 100%;z-index: 999;border-radius: 0 0 max(25px, 25rem) max(25px, 25rem);overflow: auto;max-height: 600rem;padding: 0 0 30rem;}
    .selector-list:not(.active){visibility: hidden;opacity: 0;}
    .selector-option{position: relative;padding: 15rem 30rem;display: flex;align-items: center;}
    .selector-option-inner:not(.active){cursor: pointer;}
    .selector-option-inner.active{color: var(--c2);pointer-events: none;}
    
    
    .social{display: inline-grid;grid-auto-flow: column;grid-gap: var(--gap);}
    .social-item{position: relative;overflow: hidden;width: max(24px, 32rem);height: max(24px, 32rem);display: flex;align-items: center;justify-content: center;}
    
    .marquee-container{white-space: nowrap;display: inline-flex;justify-content: flex-start;}
    .marquee-title{display: inline-flex;align-items: center;padding: 0 30rem;}
    
    .runner-end, 
    .runner-start{animation: 25s linear infinite ticker;display: flex;will-change: transform;transition: transform .01s;}
    
    .zoom-image{position: absolute;overflow: hidden;top: 0;left: 0;width: 100%;height: 100%;}
    
    .popup{position: fixed;top: 0;left: 0;width: 100%;height: 100%;overflow: auto;background-color: var(--c2);color: var(--c4);z-index: 99;display: flex;padding: var(--headroom-height) 0 30rem;align-items: flex-start;transition: all .5s;will-change: transform;overflow: -moz-scrollbars-none!important;scrollbar-width: none;}
    .popup::-webkit-scrollbar{display: none;}
    
    
    .popup-inner{width: 100%;height: 100%;flex-direction: column;display: flex;padding-top: 50rem;transition: opacity .25s;opacity: 0;}
    .popup-header{flex: none;margin-bottom: 60rem;}
    .popup-main{flex: auto;display: flex;}
    .popup-main:not(:last-child){margin-bottom: 60rem;}
    .popup-footer{flex: none;margin-top: auto;}
    .popup-footer.hidden{display: none;}
    .popup-footer-caption{margin-bottom: 30rem;font-size: var(--f-xl);line-height: 1;letter-spacing: -.07em;text-transform: capitalize;}
    .popup-footer-grid{display: grid;grid-template-columns: repeat(6, 1fr);grid-gap: var(--gap);}
    .popup-footer-grid .card-2 .card-media{border-radius: var(--br1);padding: 20rem;}
    .popup-footer-grid .card-2 .card-content:not(:first-child){margin-top: 10rem;}
    .popup-footer-grid .card-2 .card-title{font-size: var(--f-m);}
    
    
    .popup:not(.active){transform: translateY(-100%);}
    .popup.active .popup-inner{transition-delay: .5s;opacity: 1;}
    
    .searchbox{background-color: var(--c4);border-radius: 999rem;color: var(--c1);padding: 20rem 30rem;display: grid;grid-template-columns: auto 1fr auto;grid-gap: 15rem;align-items: center;}
    .searchbox-icon{width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;opacity: .5;}
    .searchbox-reset{cursor: pointer;transition: all .25s;}
    .searchbox-input{overflow: hidden;text-overflow: ellipsis;font-size: var(--f-m);}
    
    .searchbox-input:invalid ~ .searchbox-reset{opacity: 0;visibility: hidden;}
    
    .popup-nav{display: grid;grid-template-columns: repeat(6, minmax(0, 1fr));grid-gap: var(--gap);min-height: 100%;}
    .popup-nav:not(.active){display: none;}
    .popup-nav-main{grid-column: 2/-1;position: relative;display: grid;grid-template-columns: repeat(5, minmax(0, 1fr));grid-gap: 0 var(--gap);grid-template-rows: auto 1fr;}
    .popup-nav-main:not(.active){display: none;}
    .popup-nav-main::before{content: "";position: absolute;top: 0;right: 100%;height: 100%;width: var(--sl);background-color: currentColor;opacity: .2;margin-right: var(--gap);}
    .popup-nav-aside{padding-right: var(--gap);}
    .popup-nav-aside ul{display: grid;grid-template-columns: auto;grid-gap: 20rem;font-size: var(--f-b);letter-spacing: -.07em;}
    .popup-nav-aside li{display: flex;align-items: center;transition: opacity .15s;justify-content: space-between;cursor: pointer;}
    .popup-nav-aside li:not(.active){opacity: .4;}
    .popup-nav-icon{width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;margin-left: 2rem;}
    .popup-nav-caption{margin-bottom: 30rem;grid-column: 1/-1;}
    .popup-nav-list{grid-column: 1/4;}
    .popup-nav-list ul{column-count: 3;column-gap: var(--gap);}
    .popup-nav-list li{font-size: var(--f-b);letter-spacing: -.07em;margin-bottom: 20rem;break-inside: avoid;line-height: 1.1;}
    .popup-nav-list li a{display: block;}
    
    .popup-nav-image{display: flex;border-radius: var(--br1);background-color: var(--c7);padding: 25rem;margin-bottom: auto;margin-right: -25%;}
    .popup-nav-image-inner{background-color: var(--c4);position: relative;border-radius: 50%;overflow: hidden;display: flex;width: 100%;}
    .popup-nav-image-inner::before{content: "";flex: none;width: 0;padding-top: 100%;}

    
    .product-zoom{position: absolute;width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;top: 0;right: 0;z-index: 1;margin: 30rem;transition: opacity .15s;pointer-events: none;}
    
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;flex-direction: column;user-select: none;}
    
    .card-1 .card-media{position: relative;display: flex;overflow: hidden;border-radius: var(--br2);}
    .card-1 .card-media::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-1 .card-image{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .card-1 .card-content{padding-right: 75rem;}
    .card-1 .card-content:not(:first-child){margin-top: 20rem;}
    .card-1 .card-title{font-size: var(--f-b);line-height: 1.2;letter-spacing: -.07em;}
    .card-1 .card-subtitle{opacity: .5;margin-top: .5em;}
    
    .card-2 .card-header{position: relative;overflow: hidden;border-radius: var(--br2);background-color: var(--c7);padding: 35rem;}
    .card-2 .card-media{background-color: var(--c4);position: relative;border-radius: 50%;overflow: hidden;display: flex;}
    .card-2 .card-media::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-2 .card-image{position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: 15%;}
    .card-2 .card-content:not(:first-child){margin-top: 20rem;}
    .card-2 .card-title{font-size: var(--f-b);line-height: 1.2;letter-spacing: -.07em;}
    .card-2 .card-subtitle{margin-top: 5rem;opacity: .5;}
    .card-2 .card-subtitle ul{display: grid;grid-template-columns: auto;grid-gap: 0;}
    .card-2 .card-subtitle ul li{padding-left: 1.5em;position: relative;}
    .card-2 .card-subtitle ul li::before{content: "\2022";position: absolute;left: 0;top: 0;text-align: center;width: 1.5em;}
    
    .card-3{background-color: var(--c4);padding: 30rem;border-radius: var(--br1);}
    .card-3 .card-header{margin-bottom: auto;}
    .card-3 .card-title{font-size: var(--f-b);line-height: 1.2;letter-spacing: -.07em;color: var(--c2);}
    .card-3 .card-subtitle{opacity: .4;margin-top: .25em;}
    .card-3 .card-content{max-width: 550rem;display: flex;align-items: flex-end;}
    .card-3 .card-content::before{content: "";flex: none;width: 0;padding-top: 75%;}
    .card-3 .card-text{font-size: var(--f-m);margin-top: 100rem;}
    
    .card-4{border-radius: var(--br1);}
    .card-4 .card-content{display: flex;align-items: flex-end;padding: 30rem;position: relative;z-index: 2;}
    .card-4 .card-content::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-4 .card-title{background-color: var(--c4);display: flex;border-radius: var(--br3);padding: 30rem 20rem;align-items: center;min-width: 75%;position: relative;overflow: hidden;}
    .card-4 .card-title-text{margin-right: auto;font-size: var(--f-l);line-height: 1.2;letter-spacing: -.07em;position: relative;z-index: 2;}
    .card-4 .card-title-icon{margin-left: 20rem;width: max(28px, 32rem);height: max(28px, 32rem);display: flex;align-items: center;justify-content: center;position: relative;z-index: 2;}
    .card-4 .card-media{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .card-4 .card-image{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    
    .card-5{border-radius: var(--br1);background-color: var(--c4);flex-direction: row;}
    .card-5::before{content: "";flex: none;width: 0;padding-top: 50%;}
    .card-5 .card-inner{padding: 30rem;display: flex;align-items: center;flex-direction: column;width: 100%;}
    .card-5 .card-content{text-align: center;max-width: 665rem;margin-bottom: auto;}
    .card-5 .card-title{line-height: 1.2;letter-spacing: -.07em;font-weight: 500;font-size: var(--f-m);}
    .card-5 .card-subtitle{font-size: var(--f-m);margin-top: .5em;opacity: .5;}
    .card-5 .card-media{margin-bottom: 60rem;width: 100%;overflow: hidden;position: relative;z-index: 2;display: flex;flex-direction: column;align-items: center;pointer-events: none;}
    .card-5 .card-media .carousel{width: 100%;}
    .card-5 .card-media .carousel-buttons{margin: 60rem auto 0;}
    .card-5 .card-image{display: flex;width: 100%;}
    .card-5 .card-image::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-5 .card-footer{width: 100%;margin-top: 30rem;}
    
    
    
}

/* sections */

@media screen {
    
    .hero{position: relative;border-radius: var(--br2);overflow: hidden;background-color: var(--c1);color: var(--c4);}
    .hero-inner{display: flex;}
    .hero-inner::before{content: "";flex: none;width: 0;padding-top: 45%;}
    .hero-content{display: flex;padding: 40rem 0;width: 100%;position: relative;z-index: 2;flex-direction: column;align-items: center;justify-content: center;}
    .hero-title{max-width: 890rem;margin: 0 auto;text-align: center;}
    .hero-subtitle{max-width: 640rem;margin-top: 30rem;text-align: center;position: relative;padding: 0 30rem;}
    .hero-subtitle-figure{position: absolute;right: 100%;bottom: 50%;width: 215rem;height: 155rem;transform: translateY(25%);}
    .hero-media{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;opacity: .4;}
    
    .hero-button-wrapper{margin-bottom: 350rem;height: 0;display: flex;width: 100%;align-items: center;justify-content: center;position: relative;z-index: 2;}
    .hero-button{position: relative;background-color: var(--c4);width: 300rem;display: flex;border-radius: 50%;align-items: center;justify-content: center;color: var(--c2);overflow: hidden;}
    .hero-button::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .hero-button-inner{display: flex;align-items: center;flex-direction: column;padding: 60rem;position: relative;z-index: 2;}
    .hero-button-text{width: 100%;text-align: center;letter-spacing: -.07em;font-weight: 500;font-size: var(--f-m);line-height: 1;}
    .hero-button-icon{width: max(30px, 36rem);height: max(30px, 36rem);display: flex;align-items: center;justify-content: center;margin-top: 5rem;}
    
    .s1{background-color: var(--c2);border-radius: var(--br1);}
    .s1-1{display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: var(--gap);padding: 80rem 0;}
    .s1-2{display: flex;padding: 75rem;border-radius: 50%;background-color: var(--c4);align-items: center;}
    .s1-2::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s1-3{display: flex;align-items: center;color: var(--c2);letter-spacing: -.07em;font-weight: 500;line-height: 1;}
    .s1-3-1{font-size: var(--f-xxxl);}
    .s1-3-2{font-size: var(--f-l);margin-left: .25em;}
    .s1-4{text-align: center;margin-top: 10rem;opacity: .6;max-width: 300rem;}
    .s1-5{display: flex;flex-direction: column;align-items: center;margin: 0 auto;}
    
    .s2-1{display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: var(--gap);}
    
    
    .s3-1{display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: var(--gap);}
    .s3-2{grid-column: 2/3;}
    
    .s4-1{display: grid;grid-gap: var(--gap);align-items: flex-start;grid-template-columns: repeat(3, minmax(0, 1fr));}
    .s4-2 .section-header{text-align: left;margin: 0;}
    .s4-3{display: grid;grid-template-columns: auto;grid-gap: var(--gap);grid-column: 2/-1;}
    .s4-4{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);align-items: center;}
    .s4-5{display: flex;border-radius: var(--br2);background-color: var(--c7);padding: 35rem;}
    .s4-5-1{background-color: var(--c4);position: relative;border-radius: 50%;overflow: hidden;display: flex;width: 100%;}
    .s4-5-1::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s4-6{max-width: 460rem;display: grid;grid-template-columns: auto;grid-gap: 25rem;}
    .s4-6-2{opacity: .6;}
    
    .s5-1{width: 100%;max-width: 830rem;margin: 0 auto;}
    .s5-1 .swiper{overflow: visible;}
    .s5-1 .swiper-slide{padding: 0 calc(var(--gap) / 2);height: auto;}
    .s5-2{display: flex;justify-content: center;margin-top: 30rem;}
    
    .s6-1{display: grid;grid-template-columns: auto;grid-gap: 0;}
    .s6-2{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap: var(--gap);align-items: baseline;padding: 20rem 0;border-bottom: var(--sl) solid var(--c8);position: relative;}
    .s6-2:first-child{border-top: var(--sl) solid var(--c8);}
    .s6-2-1{letter-spacing: -.07em;opacity: .4;text-align: right;}
    .s6-2-2{font-size: var(--f-b);line-height: 1.1;letter-spacing: -.07em;}
    .s6-2-3{letter-spacing: -.07em;opacity: .4;text-align: right;}
    
    .s7-1{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--gap);}
    
    .s8-1{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--gap);}
    
    .s9-1{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 50rem var(--gap);}
    .s9-2{grid-column: 2/4;}
    .s9-3{grid-column: 2/4;display: grid;grid-template-columns: auto;grid-gap: 0;}
    
    .s9-4{display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));grid-gap: var(--gap);padding: 20rem 0;border-bottom: var(--sl) solid var(--c8);}
    .s9-4:first-child{border-top: var(--sl) solid var(--c8);}
    .s9-4-1{letter-spacing: -.07em;}
    .s9-4-2{grid-column: 2/-1;}
    
    .s10-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);align-items: flex-start;}
    .s10-2{display: flex;overflow: hidden;flex-direction: column;}
    .s10-2-1{overflow: hidden;border-radius: var(--br4);display: flex;width: 100%;position: relative;}
    .s10-2-1::before{content: "";flex: none;width: 0;padding-top: 75%;}
    .s10-2-1::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;background-color: var(--c1);opacity: .05;pointer-events: none;border-radius: var(--br4);display: none;}
    .s10-2-1 .swiper{width: 100%;}
    .s10-2-1 .swiper-slide{background-color: var(--c4);}
    .s10-2-1 .swiper-slide img:not(.zoomImg){mix-blend-mode: multiply;width: 90%;height: 90%;top: 5%;left: 5%;}
    .s10-2-2{margin: 20rem auto 0;}
    .s10-3{display: flex;}
    .s10-3::before{content: "";flex: none;width: 0;padding-top: 75%;}
    .s10-4{display: flex;flex-direction: column;}
    .s10-5{}
    .s10-6{margin-top: 30rem;max-width: 455rem;width: 100%;display: flex;flex: auto;flex-direction: column;}
    .s10-7{margin-top: auto;}
    .s10-8{opacity: .6;}
    .s10-8:not(:first-child){margin-top: 30rem;}
    .s10-9:not(:first-child){margin-top: 30rem;}
    
    .s11-1{overflow: hidden;}
    .s11-2{break-inside: avoid;padding: calc(var(--gap) / 2) 0;}
    .s11-3{border-radius: var(--br3);padding: 30rem;border: var(--sl) solid var(--c7);line-height: 1.1;letter-spacing: -.07em;font-size: var(--f-m);}
    .s11-3-1{opacity: .4;}
    .s11-3-2{border-top: var(--sl) solid var(--c7);padding-top: 20rem;margin-top: 20rem;}
    .s11-3-2 > ul{display: grid;grid-template-columns: auto;grid-gap: 40rem;max-width: 540rem;}
    .s11-3-2 > ul > li{padding-left: 1.5em;position: relative;}
    .s11-3-2 > ul > li::before{content: "\2022";position: absolute;left: 0;top: 0;text-align: center;width: 1.5em;}
    .s11-3-2 > ul > li li{opacity: .5;margin-top: 10rem;}
    .s11-4{margin: calc(var(--gap) / -2) 0;column-count: 2;column-gap: var(--gap);}
    
    .s12{background-color: var(--c2);color: var(--c4);border-radius: var(--br2);}
    .s12-1{text-align: center;display: flex;align-items: center;justify-content: center;}
    .s12-1::before{content: "";flex: none;width: 0;padding-top: 45%;}
    .s12-2{text-align: center;display: flex;align-items: center;flex-direction: column;padding: 100rem 0;}
    .s12-3{}
    .s12-4{order: -1;opacity: .5;font-size: var(--f-m);letter-spacing: -.07em;}
    .s12-5{height: 1.2em;overflow: hidden;padding: 0 1em;font-size: var(--f-xxxxl);display: flex;}
    .s12-5-1{white-space: nowrap;letter-spacing: -.07em;font-weight: 500;}
    .s12-6{margin-top: 30rem;max-width: 550rem;}
    
    .s13-1{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap: var(--gap);}
    .s13-3{margin-top: 30rem;display: flex;justify-content: center;}
    
    .s14:first-child{margin-top: 100rem;}
    .s14-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 30rem var(--gap);}
    .s14-4{position: relative;overflow: hidden;background-color: var(--c4);border-radius: var(--br1);display: flex;grid-column: 1/-1;margin-top: 140rem;border: var(--sl) solid var(--c8);}
    .s14-4::before{content: "";flex: none;width: 0;padding-top: 80%;}
    .s14-5{max-width: 470rem;opacity: .5;}
    .s14-6{display: grid;grid-template-columns: auto;grid-gap: var(--gap);}
    .s14-6:not(:first-child){margin-top: 60rem;}
    .s14-7{display: grid;grid-template-columns: auto;grid-gap: .1em;}
    .s14-7-1{opacity: .5;}
    .s14-7-2{padding-bottom: .2em;}
    .s14-8{grid-column: 1/-1;}
    
    .map{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    
    .s15-1{display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));grid-gap: var(--gap);}
    .s15-2{grid-column: 2/3;}
    .s15-2 .swiper{overflow: visible;margin: 0 calc(var(--gap) / -2);}
    .s15-2 .swiper-slide{padding: 0 calc(var(--gap) / 2);}
    .s15-2-1{position: relative;display: flex;border-radius: var(--br1);overflow: hidden;background-color: var(--c7);}
    .s15-2-1::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s15-3{grid-column: 2/3;display: flex;justify-content: center;}
    
    .s16-1 table,
    .s16-1 thead,
    .s16-1 tbody{display: block;width: 100%;}
    .s16-1 tr{display: grid;grid-template-columns: repeat(6, minmax(0, 1fr));grid-gap: var(--gap);padding: 20rem 0;border-bottom: var(--sl) solid var(--c8);font-size: var(--f-m);letter-spacing: -.07em;position: relative;}
    .s16-1 th{opacity: .4;text-transform: capitalize;}
    .s16-1 td{min-height: max(20px, 24rem);line-height: 1;}
    .s16-1 th:nth-child(5),
    .s16-1 td:nth-child(5){grid-column: 5/7;padding-right: 180rem;}
    .s16-1 th:nth-child(6),
    .s16-1 td:nth-child(6){grid-column: 7/7; width: 0;position: relative;display: flex;align-items: center;justify-content: flex-end;}
    .s16-2{width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;position: absolute;right: 0;top: 50%;transform: translateY(-50%);}
    
    .s17-1{display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));grid-gap: 0 var(--gap);}
    .s17-2{grid-column: 2/4;margin-bottom: 40rem;}
    .s17-3{grid-column: 2/3;opacity: .6;}
    .s17-4{grid-column: 1/-1;display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: var(--gap);margin-top: 30rem;align-items: flex-start;}
    .s17-4-1,
    .s17-4-2{display: flex;overflow: hidden;border-radius: var(--br1);position: relative;}
    .s17-4-1::before{content: "";flex: none;width: 0;padding-top: 60%;}
    .s17-4-2::before{content: "";flex: none;width: 0;padding-top: 100%;}
    
    .s18-1{display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));grid-gap: var(--gap);}
    .s18-2{grid-column: 2/3;}
    .s18-3{text-align: center;opacity: .6;margin-top: 30rem;padding: 0 45rem;}
    .s18-4{position: relative;padding: 0 70rem;}
    .s18-4-1{position: relative;overflow: hidden;border-radius: var(--br1);display: flex;z-index: 2;}
    .s18-4-1::before{content: "";flex: none;width: 0;padding-top: 115%;}
    .s18-4-2{position: absolute;height: 100%;color: var(--c2);width: 100vw;left: 50%;top: 0;display: flex;align-items: center;z-index: 1;transform: translateX(-50%);}
    
    .s404{margin-top: 30rem;}
    .s404-1{display: flex;width: 100%;max-width: 840rem;border-radius: 50%;overflow: hidden;background-color: var(--c2);color: var(--c4);align-items: center;margin: 0 auto;}
    .s404-1::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s404-2{display: flex;flex-direction: column;align-items: center;width: 100%;}
    .s404-2-1{text-align: center;}
    .s404-2-2{text-align: center;opacity: .4;}
    .s404-2-3{margin-top: 30rem;}
    .s404-2-3 .button{background-color: var(--c4);color: var(--c1);}
    
}

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

        --wr: 16rem;

        --gap: 16rem;

        --br1: 20rem;
        --br2: 30rem;
        --br3: 20rem;
        --br4: 30rem;

        --f-xs: 12rem;
        --f-s: 14rem;
        --f-d: 14rem;
        --f-m: 16rem;
        --f-b: 20rem;
        --f-l: 24rem;
        --f-xl: 28rem;
        --f-xxl: 28rem;
        --f-xxxl: 28rem;
        --f-xxxxl: 32rem;

        --mw: 680px;
        
    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
    
    .popup-active{overflow: hidden;}
    
    .button{height: 40rem;padding: 0 25rem;}
    .button-text{font-size: var(--f-d);}
    
    .title br{display: none;}
    
    .header{min-height: 70rem;padding: 16rem 0;}
    .topbar{grid-template-columns: 1fr auto auto;grid-gap: 30rem;}
    .topbar-nav,
    .topbar-search{display: none;}
    .topbar-logo{max-width: 120rem;}
    .topbar-menu{width: 24rem;height: 24rem;display: flex;align-items: center;justify-content: center;}
    
    .topbar-menu-hide,
    .popup-active .topbar-menu-show{display: none;}
    .popup-active .topbar-menu-hide{display: block;}
    
    .footer{margin-top: 70rem;padding: 30rem 0;}
    .footer-grid{grid-template-columns: 1fr 1fr;grid-gap: 0 var(--gap);grid-template-areas: "f1 ." "f2 f3" "f4 f4" "f5 f5" "f6 f6";}
    .footer-logo{max-width: 120rem;}
    .footer-policy ul{grid-auto-flow: row;grid-gap: 5rem;}
    .f1{margin-bottom: 40rem;}
    .f2 ul:not(:first-child){margin-top: 24rem;}
    .f3{grid-gap: 24rem;}
    .f4{margin-top: 35rem;grid-template-columns: auto;grid-gap: 20rem;}
    .f5{margin-top: 20rem;}
    .f6{margin-top: 5rem;}
    
    .section:not(:last-child){margin-bottom: 90rem;}
    .section__mbh:not(:last-child){margin-bottom: 70rem;}
    
    .section-header{margin-bottom: 20rem;}
    .section-header .subtitle{margin-top: 10rem;}
    .section-header .subtitle br{display: none;}
    
    .breadcrumbs{margin: 50rem 0 16rem;}
    
    .page-header{margin: 50rem 0 70rem;}
    .page-header-toolbar{margin-top: 70rem;}
    
    .page-header + .s7{margin-top: -30rem;}
    
    .media-header{margin-bottom: 90rem;}
    .media-header-inner{align-items: center;}
    .media-header-inner::before{padding-top: 110%;}
    .media-header-content{padding: 100rem 0;grid-template-rows: auto;}
    .media-header-beadcrumbs{display: none;}
    .media-header-subtitle{margin-top: 5rem;font-size: var(--f-d);}
    
    .chip{min-height: 40rem;font-size: var(--f-m);}
    .chips-caption{margin-bottom: 10rem;}
    
    .toolbar{grid-template-columns: auto;grid-gap: 20rem;}
    .toolbar-nav{grid-column: 1/-1;}    
    .toolbar-nav .chips-group{justify-content: flex-start;}
    .toolbar-aside{margin: 0;}
    
    .textbox h2,
    .textbox h3{margin: 60rem 0 20rem;}
    .textbox figure{margin: 30rem 0;}
    
    .textfield-input,
    .selector-holder{min-height: 40rem;padding: 10rem 20rem;font-size: var(--f-m);}
    
    .selector.active .selector-holder{border-radius: 20rem 20rem 0 0;}
    
    .selector-list{border-radius: 0 0 20rem 20rem;padding-bottom: 10rem;}
    .selector-option{padding: 15rem 20rem;}
    
    .formbox-row{flex-direction: column;margin: calc(var(--gap) / -2) 0;}
    .formbox-cell{padding: calc(var(--gap) / 2) 0;}
    
    .social{grid-gap: 20rem;}
    .social-item{width: 24rem;height: 24rem;}
    
    .carousel-buttons__clear{grid-gap: 12rem;}
    .carousel-buttons__clear .carousel-button{width: 24rem;height: 24rem;}
    
    .runner-end, 
    .runner-start{animation-duration: 10s;}
    .marquee-title{padding: 0 10rem;}
    
    .card-1 .card-content:not(:first-child){margin-top: 10rem;}
    
    .card-2 .card-media{padding: 20rem;}
    .card-2 .card-content:not(:first-child){margin-top: 10rem;}
    
    .card-3{padding: 20rem;}
    .card-3 .card-text{font-size: var(--f-d);}
    
    .card-4 .card-content{padding: 20rem;}
    .card-4 .card-title{min-width: 100%;padding: 15rem 20rem;position: static;overflow: visible;}
    .card-4 .card-title-text{font-size: var(--f-m);position: static;}
    .card-4 .card-title-icon{width: 24rem;height: 24rem;}
    
    .card-5 .card-inner{padding: 20rem 12rem 12rem;}
    .card-5 .card-title{font-size: var(--f-d);}
    .card-5 .card-subtitle{font-size: var(--f-d);}
    .card-5 .card-media{margin-bottom: 45rem;}
    .card-5 .card-media .carousel-buttons{margin-top: 20rem;}
    
    .hero-content{padding: 140rem 0;}
    .hero-subtitle{margin-top: 1em;padding: 0;}
    .hero-subtitle-figure{display: none;}
    
    .hero-button-wrapper{margin: -40rem 0 70rem;height: auto;align-items: flex-start;}
    .hero-button{width: 190rem;}
    .hero-button-inner{padding: 45rem;}
    .hero-button-icon{width: 24rem;height: 24rem;}
    
    .s1-1{padding: 30rem 0;grid-template-columns: auto;}
    .s1-2{padding: 40rem;}
    .s1-3-1{font-size: var(--f-xxxxl);}
    .s1-3-2{font-size: var(--f-b);}
    
    .s2-1{grid-template-columns: auto;}
    .s2-1:not(.show-more) .s2-2:nth-child(n + 4){display: none;}
    .s2-3{margin-top: 20rem;}
    
    .s3-1{grid-template-columns: auto;margin-top: 30rem;}
    .s3-2{grid-column: 1/-1;}
    
    .s4-1{grid-template-columns: auto;grid-gap: 0;}
    .s4-2{grid-column: 1/-1;}
    .s4-2 .section-header{text-align: center;margin-bottom: 20rem;}
    .s4-3{grid-column: 1/-1;grid-gap: 20rem;}
    .s4-4{grid-template-columns: auto;grid-gap: 10rem;position: relative;}
    .s4-5{padding: 20rem;}
    .s4-6{grid-gap: 0;}
    .s4-6-1 .title{font-size: var(--f-b);}
    .s4-6-1 a::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
    .s4-6-2,
    .s4-6-3{display: none;}
    
    .s5-1 .swiper{margin: 0 -4rem;}
    .s5-1 .swiper-slide{padding: 0 4rem;}
    .s5-2{display: none;}
    
    .s6-2{grid-template-columns: auto;grid-gap: 5rem;padding: var(--gap) 0;}
    .s6-2-1{text-align: left}
    .s6-2-2{text-align: left;}
    
    
    .s7-1{grid-template-columns: 1fr 1fr;grid-gap: 10rem;}
    
    .s8-1{grid-template-columns: auto;grid-gap: 20rem;}
    
    .s9-1{grid-template-columns: auto;grid-gap: 50rem;}
    .s9-2{grid-column: 1/-1;}
    .s9-2 .textbox h3{font-size: var(--f-l);}
    .s9-3{grid-column: 1/-1;}
    .s9-4{padding: 10rem 0;grid-template-columns: repeat(3, 1fr);align-items: center;}
    
    .s10-1{grid-template-columns: auto;grid-gap: 30rem;}
    .s10-2-2{display: none;}
    .s10-3::before{display: none;}
    .s10-6{margin-top: 20rem;}
    .s10-8:not(:first-child){margin-top: 20rem;}
    .s10-9:not(:first-child){margin-top: 20rem;}
    
    .s11-4{column-count: 1;margin: 0;column-gap: 0;display: grid;grid-template-columns: auto;grid-gap: 30rem;}
    .s11-2{padding: 0;}
    .s11-3{border-radius: var(--br1);padding: 20rem 12rem;}
    .s11-3-1{text-align: center;font-size: var(--f-b);}
    .s11-3-2{margin-top: 10rem;padding-top: 12rem;font-size: var(--f-d);}
    .s11-3-2 > ul{grid-gap: 20rem;}
    
    .s12-2{padding: 130rem 0;}
    .s12-5{height: auto;padding: 0 12rem;overflow: hidden;max-height: 2.4em;}
    .s12-5-1{white-space: normal;}
    .s12-6{margin-top: 15rem;}
    
    .s13-1{grid-template-columns: auto;grid-gap: 20rem;}
    .s13-2{overflow: hidden;}
    .s13-3{margin-top: 20rem;}
    .s13-3 .button{width: 100%;}
    
    .s14:first-child{margin-top: 50rem;}
    .s14-1{grid-template-columns: auto;grid-gap: 0;}
    .s14-3{margin-top: 50rem;}
    .s14-4{margin-top: 35rem;}
    .s14-4::before{padding-top: 75%;}
    .s14-6{grid-gap: 10rem;}
    .s14-6:not(:first-child){margin-top: 20rem;}
    .s14-8{margin-bottom: 20rem;}
    
    .s15-1{grid-template-columns: auto;}
    .s15-2{grid-column: 1/-1;overflow: hidden;margin: 0 var(--awr);padding: 0 calc(var(--wr) + 4rem);}
    .s15-2 .swiper-slide{padding: 0 4rem;}
    .s15-2-1::before{padding-top: 120%;}
    .s15-3{display: none;}
    
    .s16-1{position: relative;overflow: auto;margin: 0 var(--awr);padding: 0 var(--wr) 20rem;}
    .s16-1 table{width: calc(var(--mw) - 2 * var(--wr));display: table;padding-bottom: var(--sl);border-collapse: collapse;}
    .s16-1 thead{display: table-header-group;}
    .s16-1 tbody{display: table-row-group;}
    .s16-1 tr{display: table-row;border: none;font-size: var(--f-d);}
    .s16-1 th{padding: 0 0 10rem;border-bottom: var(--sl) solid var(--c8);}
    .s16-1 td{padding: 10rem 0;border-bottom: var(--sl) solid var(--c8);min-height: 40rem;}
    .s16-1 th:not(:last-child),
    .s16-1 td:not(:last-child){padding-right: 30rem;}
    .s16-1 th:last-child, 
    .s16-1 td:last-child{width: 24rem;display: table-cell;}
    
    .s17-1{grid-template-columns: auto;}
    .s17-2{grid-column: 1/-1;margin-bottom: 20rem;}
    .s17-3{grid-column: 1/-1;margin-top: 20rem;}
    .s17-4{grid-template-columns: auto;}
    .s17-4-1{display: none;}
    
    .s18-1{grid-template-columns: auto;}
    .s18-2{grid-column: 1/-1;}
    .s18-3{margin-top: 20rem;padding: 0;text-align: left;}
    
    .s404{margin-top: 50rem;}
    .s404-2-2 .title{font-size: var(--f-xxxxl);}
    .s404-2-3{margin-top: 20rem;}
     
    .popup{padding: 70rem 0 30rem;}
    .popup-inner{padding-top: 25rem;height: auto;}
    .popup-header{margin-bottom: 20rem;}
    
    .searchbox{padding: 12rem 20rem;grid-gap: 8rem;}
    .searchbox-icon{width: 16rem;height: 16rem;}
    
    .popup-menu > ul{display: grid;grid-template-columns: auto;grid-gap: 12rem;}
    .popup-menu > ul li{font-size: var(--f-l);display: grid;align-items: center;grid-template-columns: auto 1fr;}
    .popup-menu > ul ul{grid-column: 1/-1;padding: 10rem 10rem 0;opacity: 1;transition: all .25s;overflow: hidden;}
    .popup-menu > ul ul li{font-size: var(--f-m);margin-top: 8rem;}
    .popup-menu > ul ul li:first-child{margin-top: 0;}
    .popup-menu-icon{width: 24rem;height: 24rem;display: flex;align-items: center;justify-content: center;margin-left: 4rem;flex: none;will-change: transform;}

    .popup-menu > ul li:not(.active) ul{opacity: 0;height: 0;padding: 0 10rem;}
    .popup-menu > ul li.active .popup-menu-icon{transform: scaleY(-1);}
    
    .zoomImg{display: none!important;}
    
}

@media screen and (max-width: 679.98px) {
    
    .mb-content{overflow: -moz-scrollbars-none!important;scrollbar-width: none;padding: 0 var(--wr);}
    .mb-content::-webkit-scrollbar{display: none;}
    
    .mb-track-x{position: absolute;bottom: 0;left: 0;right: 0;height: 3rem;background-color: var(--c8);overflow: hidden;margin: 0 var(--wr);}
    .mb-track-x .mb-bar{height: 100%;width: 50%;background-color: var(--c1);position: absolute;top: 0;left: 0;}
    
    .mb-container{margin: 0 var(--awr);}
    .mb-container:not(.mb-scroll-x) .mb-track-x{display: none;}
    
}

@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
   
    
    
    
    
    
}

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

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
   
    .searchbox-reset:hover{opacity: 1;}
    
    
    .popup-nav-aside li:not(.active):hover{opacity: 1;}
    
    .popup-nav-list li{transition: opacity .15s;}
    .popup-nav-list li:not(:hover){opacity: .4;}
    
    .carousel-button,
    .topbar-search,
    .chip,
    .reset-button,
    .social-item,
    .breadcrumbs li a{transition: all .15s;}
    
    
    .button,
    .card-4 .card-title,
    .hero-button{transition: all .25s .25s;}
    
    
    
    .card-media{transition: transform .25s;will-change: transform;}
    
    .card:not(.card-5):hover .card-media{transform: scale(1.05);}
    
    .button:hover,
    .card-4 .card-title:hover,
    .hero-button:hover{color: var(--c1);transition-delay: 0s;}
    
    .carousel-buttons:not(.carousel-buttons__clear) .carousel-button:hover{color: var(--c1);background-color: var(--c3);}
    
    .s6-2{position: relative;}
    
    .s6-2::before,
    .s16-1 tr::before{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: -1;background-color: var(--c3);opacity: 0;margin: 0 var(--awr);transition: opacity .15s;}
    
    .s6-2:hover::before,
    .s16-1 tbody tr:hover::before{opacity: 1;}
    
    .chip:not(.active):hover{background-color: var(--c10);}
    
    .carousel-buttons__clear .carousel-button:hover{color: var(--c3);}
    
    .reset-button:hover,
    .social-item:hover,
    .topbar-search:hover{opacity: .5;}
    
    .breadcrumbs li a:hover{opacity: 1;}
    
    .topbar-nav > ul > li.active .topbar-nav-icon,
    .topbar-nav > ul > li:not([data-menu]):hover .topbar-nav-icon{transform: scaleY(-1);}
    
    .topbar-nav ul ul a,
    .f2 a,
    .f3 a,
    .f4 a,
    .s14-6 a{transition-property: background-size, color;transition-duration: .5s;background-size: 0 var(--sl);background-repeat: no-repeat;background-position: right bottom;background-image: linear-gradient(currentColor, currentColor);display: inline;}

    .topbar-nav ul ul a:hover,
    .f2 a:hover,
    .f3 a:hover,
    .f4 a:hover,
    .s14-6 a:hover{background-size: 100% var(--sl);background-position: left bottom;color: var(--c1);}
    
    .selector-option-inner{transition: opacity .15s;}
    .selector-option-inner:not(.active):not(:hover){opacity: .5;}
    
    .button-bubble{position: absolute;top: 0;left: 0;bottom: 0;right: 0;z-index: 1;overflow: hidden;}
    .button-bubble-inner{position: absolute;border-radius: 50%;transform: translate(-50%, -50%);background-color: var(--c3);width: 0;height: 0;z-index: -1;}
    
    
    .button-bubble-inner{transition-duration: width, height;transition-duration: .5s;transition-timing-function: ease-in-out;}
    
    .button:not(:hover) .button-bubble-inner,
    .card-4 .card-title:not(:hover) .button-bubble-inner,
    .hero-button:not(:hover) .button-bubble-inner{width: 0!important;height: 0!important;}
    
    .s10-2-1:active .product-zoom{opacity: 0;}
    
}