@charset "UTF-8";

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


:root{
    
    --app-height: 100vh;
    --headroom-height: auto;
    
  
    --c0: #FFFFFF; 
    --c1: #1B1B1B;
    --c2: #F7F6F3;
    --c3: #5E5E5E;
    --c4: #2F3A44;
    --c5: #5B83A1;
    
    --cb: color-mix(in srgb, currentColor 20%, transparent);
    
    --wr: 45rem;
    --iwr: 15rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 20rem;
    --sl: max(1px, 1rem);
    
    --br1: 40rem;
    --br2: 20rem;
    --br3: 4rem;
    --br4: 25rem;
    
    --btn: max(35px, 40rem);

    --cols: repeat(12, minmax(0, 1fr));
    
    --f-s: max(14px, 16rem);
    --f-d: max(14px, 16rem);
    --f-m: max(14px, 20rem);
    --f-b: max(14px, 24rem);
    --f-l: max(14px, 32rem);
    --f-xl: max(14px, 44rem);
    --f-xxl: max(14px, 66rem);
    --f-n: max(14px, 74rem);
    
    --mw: 1920px; 
    
    
}


/* globals */

@media screen {

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

    .document{font-weight: 300;font-family: 'Haas', sans-serif;font-size: var(--f-d);line-height: 1.1;color: var(--c1);background-color: var(--c0);letter-spacing: -.01em;}
    
    .popup-active{}
    
    .wrapper{width: 100%;margin: 0 auto;padding: 0 var(--wr);max-width: var(--mw);}
    
    .preloader{background-color: var(--c5);position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 9999;visibility: hidden;opacity: .5;transition: all 1s 4s;display: flex;color: var(--c1);will-change: transform;clip-path: inset(0 0 100% 0);display: flex;padding: var(--wr);}
    .preloader-text{width: 60%;max-width: 400rem;margin: auto;}
    
    .p01{opacity: .5;}
    .p02{opacity: .5;transition: opacity .5s 1s;}
    .p03{}
    .p04{opacity: 1;transition: opacity .5s 1s;}
    .p05{opacity: 1;transition: opacity .5s 1s, color .5s 2s;color: var(--c1);}
    .p06{opacity: 0;transition: opacity .5s 2s;}
    
    .loading .p01{}
    .loading .p02{opacity: 1;}
    .loading .p04{opacity: .5;}
    .loading .p05{opacity: .5;color: var(--c0);}
    .loading .p06{opacity: 1;}
    
    .loading .p01,
    .loading .p02,
    .loading .p04,
    .loading .p05,
    .loading .p06{transition-duration: 0s;transition-delay: 0s;}
     
    .loading{pointer-events: none;}
    .loading .preloader{transition-duration: 0s;opacity: 1;visibility: visible;clip-path: inset(0 0 0% 0);}
    
    .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;background-clip: padding-box;}
    .button:not(.fill){position: relative;}
    .button-text{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;position: relative;z-index: 2;min-width: 0;padding: 0;}
    .button-icon{width: 1em;height: 1em;display: flex;align-items: center;justify-content: center;margin: 0 10rem;flex: none;margin-top: -.1em;}
    .button-icon:first-child{margin-left: 0;}
    .button-icon:last-child{margin-right: 0;}
    
    .button__default{border-radius: var(--br3);padding: 0 30rem;height: var(--btn);background-color: var(--c4);color: var(--c0);border: var(--sl) solid var(--c4);}
    .button__default .button-text{font-weight: 400;}
    .button__default .button-icon:last-child{margin-right: -10rem;}
    
    .button__inl .button-icon{width: 1.2em;height: 1.2em;background-color: var(--c4);color: var(--c0);border-radius: 50%;}
    
    .button__contrast{background-color: var(--c0);color: var(--c4);border-color: var(--c0);}
    
    .button__wide{width: 100%;}
     
    .title{line-height: 1.01;font-weight: 400;width: 100%;}
    .title__medium{font-size: var(--f-l);}
    .title__default{font-size: var(--f-xl);}
    .title__large{font-size: var(--f-xxl);}
    
    .container{display: flex;flex-direction: column;min-height: var(--app-height);padding: 25rem var(--iwr);overflow-x: clip;}
    
    .header{position: relative;z-index: 10;color: var(--c0);}
    .topbar{padding: 20rem 0;display: grid;grid-template-columns: 1fr auto 1fr;grid-gap: 20rem;align-items: center;position: relative;}
    .topbar::after{content: "";position: absolute;bottom: 0;left: 0;width: 100%;height: var(--sl);background-color: var(--cb);}
    .topbar-logo{max-width: 200rem;}
    .topbar-nav ul{display: grid;grid-auto-flow: column;grid-gap: 60rem;align-items: center;}
    .topbar-action{margin-left: auto;}
    
    .main{margin-top: 0;flex: auto;display: flex;flex-direction: column;}
   
    .section{position: relative;z-index: 1;margin-bottom: 160rem;}
    .section:last-child{margin-bottom: 0;}
    .section:only-child{flex: auto;}
    
    .section-trigger{position: absolute;top: 0;left: 0;width: 100%;height: 1px;opacity: 0;pointer-events: none;}
    
    .section-header{display: grid;grid-template-columns: 1fr auto;grid-gap: 0 40rem;align-items: flex-end;}
    .section-header:not(:last-child){margin-bottom: 25rem;}
    .section-header:not(:last-child)::after{content: "";grid-column: 1/-1;height: var(--sl);background-color: var(--cb);margin-top: 15rem;}
    .section-header-title:only-child{grid-column: 1/-1;}
    
    .footer{overflow: hidden;margin-top: 160rem;background-color: var(--c4);color: var(--c2);padding: 50rem 0 30rem;border-radius: var(--br1);}
    .footer-grid{display: grid;grid-template-columns: var(--cols);grid-gap: 40rem var(--gap);grid-template-rows: auto auto 1fr auto;align-items: flex-start;}
    .footer-logo{max-width: 200rem;}
    .f1{grid-area: f1;}
    .f2{grid-area: f2;max-width: 265rem;}
    .f3{grid-area: f3;}
    .f4{grid-area: f4;}
    .f5{grid-area: f5;}
    .f6{grid-area: f6;margin-left: auto;}
    .f7{grid-area: f7;}
    .f8{grid-area: f8;}
    .f9{grid-area: f9;margin-top: 40rem;border: var(--sl) solid var(--cb);padding: 40rem;border-radius: var(--br1);}
    .f9-2{margin-top: 25rem;max-width: 450rem;}
    .f9-3{margin-top: 50rem;}
    
    .footer-nav-caption{margin-bottom: 20rem;color: color-mix(in srgb, currentColor 40%, transparent);}
    .footer-nav ul{display: grid;grid-template-columns: auto;grid-gap: 20rem;}
    
    .carousel-buttons{display: inline-grid;grid-auto-flow: column;grid-gap: .5em;font-size: max(20px, 24rem);line-height: 1;}
    .carousel-button{cursor: pointer;width: 1.35em;height: 1.35em;background-color: var(--c1);color: var(--c2);border-radius: 50%;padding: .35em 0;border: var(--sl) solid var(--c1);}
    .carousel-button__prev{padding-right: .1em;}
    .carousel-button__next{padding-left: .1em;}
    
    .header.contrast *::-moz-selection,
    .section__contrast *::-moz-selection,
    .footer *::-moz-selection{background-color: var(--c2);color: var(--c4);-webkit-text-fill-color: var(--c4);}
    
    .header.contrast *::selection,
    .section__contrast *::selection,
    .footer *::selection{background-color: var(--c2);color: var(--c4);-webkit-text-fill-color: var(--c4);}
    
    .hero{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;border-radius: var(--br1);overflow: hidden;background-color: var(--c1);}
    .hero-inner{opacity: .5;}
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;flex-direction: column;user-select: none;}
    .card-title{font-weight: 400;line-height: 1.15;letter-spacing: -.03em;font-size: var(--f-m);}
  
    .card-1 .card-header{position: relative;overflow: hidden;display: flex;border-radius: var(--br4);}
    .card-1 .card-header::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-1 .card-media{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .card-1 .card-content{margin-top: 15rem;}
  
    .card-2 .card-header{position: relative;overflow: hidden;display: flex;border-radius: var(--br4);}
    .card-2 .card-header::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .card-2 .card-media{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .card-2 .card-content{margin-top: 25rem;}
    .card-2 .card-footer{margin-top: 20rem;padding-left: 10rem;border-left: var(--sl) solid var(--cb);}
    .card-2 .card-action{margin-top: 15rem;}
   
}

/* sections */

@media screen {
    
    .s1-1{color: var(--c0);padding: var(--headroom-height) var(--wr) 80rem;margin: calc(-1 * var(--headroom-height)) var(--awr) 0;position: relative;}
    .s1-2{display: flex;width: 100%;align-items: flex-end;position: relative;z-index: 2;}
    .s1-2::before{content: "";flex: none;width: 0;padding-top: 25%;}
    .s1-3{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
   
    .s2-1{display: grid;grid-template-columns: var(--cols);grid-gap: 40rem var(--gap);}
    .s2-2{grid-column: 4/10;display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s2-3{position: relative;overflow: hidden;display: flex;border-radius: var(--br2);}
    .s2-3::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s2-4{display: flex;flex-direction: column;}
    .s2-4-1{flex: auto;color: var(--c3);}
    .s2-4-2:not(:first-child){margin-top: 40rem;}
    .s2-5{grid-column: 3/11;text-align: center;}
    
    .s3-1{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);}
    .s3-2{margin: 0 20rem;position: relative;padding: 30rem 0 5rem 15rem;}
    .s3-2::before{content: "";position: absolute;top: 0;left: 0;width: var(--sl);height: 100%;background-color: var(--cb);}
    .s3-2-1{color: var(--c3);}
    .s3-2-2{margin-top: 15rem;}
    .s3-2-2 .title{font-size: var(--f-n);line-height: .95;}
    .s3-3{grid-column: 4/-1;display: flex;justify-content: space-between;margin: 0 -20rem;}
    
    .s4-1{display: grid;grid-template-columns: var(--cols);grid-gap: 40rem var(--gap);grid-template-rows: auto 1fr auto;align-items: flex-end;}
    .s4-2{grid-column: 1/5;}
    .s4-2-1{max-width: 450rem;}
    .s4-2-2{max-width: 380rem;margin-top: 25rem;color: var(--c3);}
    .s4-3{grid-column: 1/8;display: grid;grid-template-columns: repeat(7, minmax(0, 1fr));grid-gap: 15rem var(--gap);}
    .s4-3::after{content: "";grid-column: 1/-1;background-color: var(--cb);height: var(--sl);}
    .s4-3-1{grid-column: 1/4;position: relative;overflow: hidden;display: flex;border-radius: var(--br4);}
    .s4-3-1::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s4-4{grid-column: 1/4;}
    .s4-5{grid-column: 4/8;padding-right: 25rem;color: var(--c3);}
    .s4-6{grid-column: 8/-1;grid-row: 1/4;position: relative;overflow: hidden;border-radius: var(--br4);display: flex;min-height: 100%;}
    .s4-6::before{content: "";flex: none;width: 0;padding-top: 75%;}
    
    .s5-1{margin-bottom: 50rem;text-align: center;}
    .s5-2{display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: var(--gap);}
    .s5-3{width: 100%;position: relative;display: flex;align-items: flex-start;padding: 80rem 0;}
    .s5-3::before{content: "";flex: none;width: 0;padding-top: 150%;}
    .s5-4{}
    .s5-6{margin-top: 25rem;position: relative;}
    .s5-6-1{color: var(--c3);}
    .s5-7{position: relative;display: flex;width: 100%;}
    .s5-7::before{content: "";flex: none;width: 0;padding-top: 150%;}
    .s5-7-1{position: absolute;top: 0;left: 0;right: 0;bottom: 0;border-radius: var(--br4);overflow: hidden;}
    .s5-8{display: grid;grid-template-columns: auto;grid-gap: 90rem;}
    
    .s6-1{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);align-items: center;}
    .s6-2{grid-column: 1/4;margin-left: -100%;}
    .s6-3{position: relative;overflow: hidden;display: flex;border-radius: var(--br4);}
    .s6-3::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s6-4{grid-column: 5/9;display: flex;flex-direction: column;align-items: center;text-align: center;justify-content: center;}
    .s6-4-2{color: var(--c3);margin-top: 25rem;}
    .s6-4-3{margin-top: 25rem;}
    .s6-5{grid-column: 10/-1;margin-right: -100%;}
    
    .s7-2{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 50rem var(--gap);}
    .s7-2:not(:first-child){margin-top: 50rem;}
    .s7-4{display: flex;flex-direction: column;padding: 15rem 50rem 65rem;}
    .s7-4-1{flex: auto;color: var(--c3);}
    .s7-4-2{margin-top: 40rem;}
    
    .s8-3{display: flex;align-items: flex-end;height: 0;position: relative;z-index: 1;}
    .s8-4{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);}
    .s8-5{grid-column: 1/4;padding: 100rem 0;transition: opacity 1s;}
    .s8-5-1 .title{font-size: var(--f-b);}
    .s8-5-2{margin-top: 25rem;color: var(--c3);max-width: 265rem;}
    .s8-5-3{margin-top: 70rem;}
    .s8-6{position: relative;grid-column: 5/-1;overflow: hidden;border-radius: var(--br4);display: flex;padding: 15rem;min-height: 570rem;margin-bottom: auto;}
    .s8-6::before{content: "";flex: none;width: 0;padding-top: 50%;}
    .s8-6-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .s8-6-2{position: relative;z-index: 1;margin-top: auto;margin-left: auto;background-color: var(--c2);color: var(--c1);border-radius: 999rem;padding: .5em 1em;}
    
    .s8-1 .swiper-slide{opacity: 0;transition-delay: 1s;}
    .s8-1 .swiper-slide-active{z-index: 2;transition-delay: 0s;}
    
    .s8-1 .swiper-slide:not(.swiper-slide-active) .s8-5{opacity: 0;}
    
    .s8-1 .swiper-slide .s8-6{transition: clip-path 1s 0s;clip-path: inset(0 0% 0 0);}
    .s8-1 .swiper-slide:not(.swiper-slide-active) .s8-6{transition: clip-path 0s 1s;clip-path: inset(0 100% 0 0);}
    
    .s9-3 .swiper{width: 100%;position: absolute;top: 0;left: 0;height: 100%;}
    .s9-3 .swiper-slide{opacity: 0;transition-delay: 1s;}
    .s9-3 .swiper-slide-active{z-index: 2;transition-delay: 0s;}
    
    .s9-3 .swiper-slide .s9-4{transition: clip-path 1s 0s;clip-path: inset(0 0% 0 0);}
    .s9-3 .swiper-slide:not(.swiper-slide-active) .s9-4{transition: clip-path 0s 1s;clip-path: inset(0 100% 0 0);}
    
    .s9-4{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    
    
    .s10-1{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);align-items: flex-start;}
    .s10-2{max-width: 265rem;color: var(--c3);grid-column: 1/4;}
    .s10-3{grid-column: 4/-1;display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: var(--gap);}
    
}

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

        --wr: 15rem;
        --iwr: 15rem;

        --gap: 30rem;

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


        --cols: minmax(0, 1fr);

        --f-s: 14rem;
        --f-d: 16rem;
        --f-m: 18rem;
        --f-b: 20rem;
        --f-l: 22rem;
        --f-xl: 30rem;
        --f-xxl: 36rem;
        --f-n: 52rem;

        --mw: 640rem; 
        
    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
    
    .button__default{width: 100%;}
  
    .container{padding: 10rem 0 20rem;}
    
    .header{z-index: 99;position: sticky;top: calc(-1 * var(--headroom-height));transition: top .25s;}
    
    .topbar{grid-template-columns: 1fr auto;padding-left: var(--wr);padding-right: var(--wr);}
    .topbar-nav,
    .topbar-action{display: none;}
    .topbar::after{display: none;}
    .topbar-logo{max-width: 140rem;}
    
    .topbar-menu{display: flex;flex-direction: column;align-items: flex-end;justify-content: flex-start;height: 1em;line-height: 1;overflow: hidden;}
    .topbar-menu-show,
    .topbar-menu-hide{flex: none;transition: transform .25s;will-change: transform;white-space: nowrap;}
    
    .footer{margin: 80rem var(--wr) 0;padding: 30rem 0;}
    
    .footer-grid{grid-template-areas: "f1" "f2" "f3" "f4" "f5" "f6" "f9" "f7" "f8";grid-gap: 0;}
    .footer-logo{max-width: 140rem;}
    .f2{margin-top: 40rem;}
    .f3{margin-top: 30rem;}
    .f4{margin-top: 40rem;}
    .f5{margin-top: 40rem;}
    .f6{margin: 40rem 0 0;}
    .f7{margin: 40rem 0 0;}
    .f8{margin: 40rem 0 0;}
    .f9{margin: 40rem 0 0;padding: 20rem;}
    .f9-2{margin-top: 20rem;}
    .f9-3{margin-top: 30rem;}
    
    .carousel-buttons{font-size: 32rem;}
    
    .section{margin-bottom: 80rem;}
    
    .section-header{grid-template-columns: auto;grid-gap: var(--gap);}
    .section-header:not(:last-child){margin-bottom: 20rem;}
    .section-header:not(:last-child)::after{margin: 0;}
    
    .s1-1{padding-bottom: 35rem;margin-left: 0;margin-right: 0;}
    .s1-2::before{padding-top: 100%;}
    
    .s2-1{grid-gap: 30rem;}
    .s2-2{grid-column: auto;grid-template-columns: auto;grid-gap: 20rem;}
    .s2-3::before{padding-top: 55%;}
    .s2-4-2:not(:first-child){margin-top: 20rem;}
    .s2-5{grid-column: auto;text-align: left;}
    
    .s3-2{padding: 15rem 0 15rem 15rem;}
    .s3-3{grid-column: auto;display: grid;grid-template-columns: auto;grid-gap: var(--gap);}
    
    .s4-1{grid-template-rows: auto;grid-gap: 0;}
    .s4-2{grid-column: auto;grid-row: auto;}
    .s4-2-2{margin-top: 20rem;}
    .s4-3{grid-column: auto;grid-row: auto;grid-template-columns: auto;grid-gap: 0;margin-top: 30rem;}
    .s4-3::after{display: none;}
    .s4-3-1{grid-column: auto;}
    .s4-4{grid-column: auto;grid-row: auto;order: 1;margin-top: 20rem;}
    .s4-5{grid-column: auto;grid-row: auto;padding: 0;margin-top: 30rem;}
    .s4-6{grid-column: auto;grid-row: auto;order: 2;margin-top: 30rem;min-height: 0;}
    .s4-6::before{padding-top: 110%;}
    
    .s5-1{text-align: left;margin-bottom: 30rem;}
    .s5-2{grid-template-columns: auto;}
    .s5-3{padding: 0;}
    .s5-3::before{display: none;}
    .s5-4{display: flex;flex-direction: column;}
    .s5-6{margin-top: 15rem;padding-right: 30rem;}
    .s5-6-2{margin-top: 20rem;}
    .s5-7{order: -1;margin-bottom: 20rem;}
    .s5-7::before{padding-top: 100%;}
    .s5-8{grid-gap: var(--gap);}
    
    .s6-2{display: none;}
    .s6-3::before{padding-top: 100%;}
    .s6-4{grid-column: auto;text-align: left;align-items: flex-start;justify-content: flex-start;}
    .s6-4-2{margin-top: 20rem;}
    .s6-4-3{width: 100%;margin-top: 20rem;}
    .s6-4-4{width: 100%;margin-top: 30rem;}
    .s6-5{display: none;}
    
    .s7-2{grid-template-columns: auto;grid-gap: var(--gap);}
    .s7-2:not(:first-child){margin-top: 30rem;}
    .s7-4{padding: 0;}
    .s7-4-2{margin-top: 20rem;}
    
    .s8-3{height: auto;margin-top: 30rem;justify-content: center;}
    .s8-4{grid-gap: 20rem;align-items: flex-start;}
    .s8-5{grid-column: auto;padding: 0;}
    .s8-5-2{max-width: none;margin-top: 20rem;}
    .s8-5-3{margin-top: 20rem;}
    .s8-6{grid-column: auto;order: -1;min-height: 0;padding: 10rem;}
    
    .s9-1{display: flex;flex-direction: column;}
    .s9-2{}
    .s9-3{position: relative;display: flex;overflow: hidden;border-radius: var(--br4);margin-top: 30rem;}
    .s9-3::before{content: "";flex: none;width: 0;padding-top: 55%;}
    
    .s10-1{grid-gap: var(--gap);}
    .s10-2{grid-column: auto;max-width: none;}
    .s10-3{grid-column: auto;grid-template-columns: auto;grid-gap: var(--gap);}
    
    .popup{position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 10;padding: 10rem var(--wr);display: flex;align-items: flex-start;transition: all .25s;}
    .popup-inner{background-color: var(--c4);color: var(--c2);border-radius: var(--br1);width: 100%;min-height: 100%;display: flex;flex-direction: column;padding: var(--headroom-height) var(--wr) 30rem;}
    .popup-nav-caption{opacity: .4;margin-bottom: 20rem;}
    .popup-nav ul{display: grid;grid-template-columns: auto;}
    .popup-content{flex: auto;margin: 40rem var(--awr) 0;overflow: auto;padding: 0 var(--wr);}
    .popup-content .popup-nav-caption{padding: 0 var(--wr) 20rem;border-bottom: var(--sl) solid var(--cb);margin-left: var(--awr);margin-right: var(--awr);}
    .popup-content .popup-nav ul{grid-gap: 25rem;font-size: var(--f-xl);line-height: 1;font-weight: 400;}
    .popup-footer{margin-top: 40rem;}
    .popup-footer .popup-nav ul{grid-gap: 20rem;}
    .popup-contact{margin-top: 40rem;}
    
    .popup:not(.active){transform: translateY(-100%);}
    
    .popup-active .header{top: 10rem;}
    .popup-active .topbar-menu-show,
    .popup-active .topbar-menu-hide{transform: translateY(-100%);}
    
    .popup-overlay{position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 9;background-color: var(--c0);opacity: 0;pointer-events: none;visibility: hidden;transition: all .25s;}
    .popup.active ~ .popup-overlay{visibility: visible;opacity: 1;}
    
    .hero{transform: none!important;width: 100%!important;height: 100%!important;}
    
    
}


@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
    
    .footer-grid{grid-template-areas: 
    
        "f1 f1 f1 . f4 f4 f4 f5 f5 f5 f6 f6"
        "f2 f2 f2 . f4 f4 f4 f5 f5 f5 . ."
        "f3 f3 f3 . f4 f4 f4 f9 f9 f9 f9 f9"
        "f7 f7 f7 . f8 f8 f8 f9 f9 f9 f9 f9";
        
    }
    
    .s1-1{min-height: calc(var(--app-height) - 2 * 25rem);display: flex;align-items: flex-end;}
    
    .s2 .section-trigger{top: 25vh;}
    .s2-3 img{visibility: hidden;}
    
    .s5-5{padding-right: 160rem;transition: opacity .25s;}
    .s5-6{transition: all .25s;}
    .s5-6-1,
    .s5-6-2{width: 100%;display: flex;flex-direction: column;position: relative;padding-top: 20rem;}
    .s5-6-1{overflow: hidden;}
    .s5-6-1::before,
    .s5-6-2::before{content: "";height: var(--sl);background-color: var(--cb);position: absolute;top: 0;left: 0;right: 50rem;}
    .s5-6-1{padding-right: 160rem;}
    .s5-6-2{position: absolute;top: 0;left: calc(200% + 2 * var(--gap));align-items: flex-end;padding-left: 160rem;}
    .s5-6-2::before{left: 50rem;right: 0;}
    .s5-7{position: absolute;top: 0;left: calc(100% + 1 * var(--gap));}
    .s5-7-1{margin: 0 -50rem;transition: all .5s;clip-path: inset(0% 0 0 0);}
    
    .s5-4{z-index: 2;}
    .s5-4:not(.active){z-index: 1;}
    
    .s5-4:not(.active) .s5-5{opacity: .2;cursor: pointer;}
    .s5-4:not(.active) .s5-6{padding: 0;margin-top: 0;height: 0;opacity: 0;}
    .s5-4:not(.active) .s5-6-1{}
    .s5-4:not(.active) .s5-7-1{visibility: hidden;clip-path: inset(100% 0 0 0);transition-delay: .5s;}
    
    .s6-2 .s6-3{margin-right: calc(-1 * var(--gap));}
    .s6-5 .s6-3{margin-left: calc(-1 * var(--gap));}
    
    .s8-1 .swiper-slide{}
    .s8-5{display: flex;flex-direction: column;}
    .s8-5-2{margin-bottom: auto;}
    
    .s9-1{position: relative;display: flex;align-items: flex-start;margin: 0 var(--awr);border-radius: var(--br1);background-color: var(--c1);color: var(--c0);overflow: hidden;}
    .s9-1::before{content: "";flex: none;width: 0;padding-top: 45%;}
    .s9-2{padding: 60rem var(--wr);position: relative;z-index: 1;}
    .s9-3{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: .5;}
    
    
    .s2-4,
    .s2-5{transition: opacity 1s;}
    
    .s2:not(.visible) .s2-4,
    .s2:not(.visible) .s2-5{opacity: 0;}
    
    .s3-2{transition: clip-path 1s;clip-path: inset(0 0% 0 0);}
    .s3-2:nth-child(1){transition-delay: 0s;}
    .s3-2:nth-child(2){transition-delay: .5s;}
    .s3-2:nth-child(3){transition-delay: 1s;}
    .s3-3{transition: opacity 2s;}
    
    .s3:not(.visible) .s3-2{clip-path: inset(0 100% 0 0);}
    .s3:not(.visible) .s3-3{opacity: 0;}
    
    .s4-2{transition: all 1.5s;will-change: transform;}
    .s4-3{transition: clip-path 1.5s;clip-path: inset(0 0 0 0%);}
    .s4-4,
    .s4-5{transition: opacity 1.5s;}
    .s4-6{transition: clip-path 1.5s;clip-path: inset(0 0% 0 0);}
    
    .s4:not(.visible) .s4-2{transform: translateX(calc(100%));opacity: 0;}
    .s4:not(.visible) .s4-3{clip-path: inset(0 0 0 100%);}
    .s4:not(.visible) .s4-4,
    .s4:not(.visible) .s4-5{opacity: 0;}
    .s4:not(.visible) .s4-6{clip-path: inset(0 100% 0 0);}
    
    .s6-2,
    .s6-5{z-index: 2;transition: transform 1s;will-change: transform;}
    .s6-4{transition: opacity 2s}
    
    .s6:not(.visible) .s6-2{transform: translateX(50%);}
    .s6:not(.visible) .s6-5{transform: translateX(-50%);}
    .s6:not(.visible) .s6-4{opacity: 0;}
}

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

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
    
    .button__default,
    .carousel-button{transition: all .25s;}
    
    .button__default:hover{background-color: transparent;color: var(--c4);}
    .button__contrast:hover{color: var(--c0);}
    
    .button__inl .button-text{transition: background-size .25s;background-size: 0 var(--sl);background-repeat: no-repeat;background-position: right bottom;background-image: linear-gradient(currentColor, currentColor);padding-bottom: 1rem;margin-bottom: -1rem;}

    .carousel-button:hover{color: var(--c1);background-color: transparent;}
   
    .card-media{will-change: transform;transition: transform .25s;}
    
    .card-1:hover .card-media,
    .card-2:hover .card-media{transform: scale(1.1);}
    
    .topbar-nav a,
    .f3 a,
    .f4 a,
    .f5 a,
    .f6 a,
    .f8 a{transition: background-size .25s;background-size: 0 var(--sl);background-repeat: no-repeat;background-position: right bottom;background-image: linear-gradient(currentColor, currentColor);display: inline;padding-bottom: .2em;}
    
    .f6 a{padding-bottom: 0;}
    
    .button__inl:hover .button-text,
    .topbar-nav a:hover,
    .f3 a:hover,
    .f4 a:hover,
    .f5 a:hover,
    .f6 a:hover,
    .f8 a:hover{background-size: 100% var(--sl);background-position: left bottom;}
    
    
}