@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: #121212;
    --c2: #FF5900;
    
    
    --c3: color-mix(in srgb, currentColor 3%, transparent);
    --c4: color-mix(in srgb, currentColor 15%, transparent);
    --c5: color-mix(in srgb, currentColor 20%, transparent);
    --c6: color-mix(in srgb, currentColor 40%, transparent);
    --c7: color-mix(in srgb, currentColor 50%, transparent);
    --c8: color-mix(in srgb, currentColor 60%, transparent);
    
    --g1: linear-gradient(135deg, #EE480B, #FC5800, #FFCC65);
    
    --wr: 100rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 40rem;
    --sl: max(1px, 1rem);
    
    --br1: 4rem;
    
    --btn: max(44px, 56rem);

    --cols: repeat(10, minmax(0, 1fr));
    
    --f-xs: max(14px, 16rem);
    --f-s: max(14px, 18rem);
    --f-d: max(14px, 20rem);
    --f-m: max(14px, 24rem);
    --f-b: max(14px, 32rem);
    --f-l: max(14px, 48rem);
    --f-xl: max(14px, 84rem);
    --f-xxl: max(14px, 90rem);
    
    --mw: 192000px; 
    
    
}


/* globals */

@media screen {

    html{font-size: 0.0625vw;background-color: var(--c0);background-image: linear-gradient(var(--c0) 50%, var(--c2) 50%, var(--c2));}

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

    .button{display: inline-flex;justify-content: center;max-width: 100%;user-select: none;cursor: pointer;align-items: center;z-index: 1;position: relative;background-clip: padding-box;}
    .button:not(.fill){overflow: hidden;position: relative;}
    .button-text{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;position: relative;z-index: 2;min-width: 0;}
    .button-icon{background-size: cover;}
    
    .button__default{height: var(--btn);padding: 5rem;border-radius: 999rem;background-color: var(--c2);background-image: url(../img/button-gradient.svg);color: var(--c0);background-size: cover;}
    .button__default .button-icon{background-color: var(--c1);color: var(--c0);}
    
    .button__secondary{height: var(--btn);padding: 4rem;border-radius: 999rem;border: var(--sl) solid var(--c4);}
    .button__secondary .button-icon{background-color: var(--c1);color: var(--c0);}
    
    .button__default .button-icon,
    .button__secondary .button-icon{flex: none;height: 100%;aspect-ratio: 1/1;border-radius: 50%;display: flex;align-items: center;justify-content: center;padding: 12rem;}
    
    .button__default .button-text,
    .button__secondary .button-text{padding: 0 25rem;font-size: var(--f-s);}
    .button__default .button-text:first-child,
    .button__secondary .button-text:first-child{padding-left: 30rem;}
    .button__default .button-text:last-child,
    .button__secondary .button-text:last-child{padding-right: 30rem;}
    
    
    .button__wide{width: 100%;}
     
    .title{line-height: 1;font-weight: 500;width: 100%;letter-spacing: -.05em;}
    
    .title__small{font-size: var(--f-b);}
    .title__medium{font-size: var(--f-l);}
    .title__default{font-size: var(--f-xl);}
    .title__large{font-size: var(--f-xxl);line-height: .9;}
    
    .mask-appear-inner{padding: 0 0 .2em 0;margin: 0 0 -.2em 0;opacity: 0;filter: blur(20px);}
    
    
    .container{display: flex;flex-direction: column;min-height: var(--app-height);}
    
    .header{position: sticky;top: 0;z-index: 10;padding-bottom: 50rem;pointer-events: none;}
    .header::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;background-image: linear-gradient(var(--c0), transparent);transition: opacity .15s;}
    .header a{pointer-events: all;}
    
    .topbar{display: grid;grid-template-columns: 1fr auto 1fr;grid-gap: var(--gap);align-items: center;padding: 25rem 0;}
    .topbar-logo{max-width: 80rem;}
    .topbar-nav ul{display: grid;grid-auto-flow: column;grid-gap: 25rem;align-items: center;font-size: var(--f-s);}
    .topbar-action{margin-left: auto;}
    .topbar-action .button__secondary{background-color: var(--c0);color: var(--c1);}
    
    .main{margin-top: 0;flex: auto;display: flex;flex-direction: column;overflow-x: clip;}
   
    .section{position: relative;z-index: 1;margin-bottom: 180rem;}
    .section:last-child{margin-bottom: 100rem;}
    .section:only-child{flex: auto;}
    
    .section__contrast{background-color: var(--c1);color: var(--c0);}
    .section__contrast .button__secondary{background-color: var(--c0);color: var(--c1);}
    
    .section-header{display: flex;flex-direction: column;}
    .section-header:not(:last-child){margin-bottom: 55rem;}
    .section-header-pretitle{text-transform: uppercase;font-size: var(--f-xs);letter-spacing: .0625em;padding-top: 25rem;border-top: var(--sl) solid;}
    .section-header-pretitle:not(:last-child){margin-bottom: 70rem;}
    .section-header-title{max-width: 1075rem;}
    .section-header-subtitle{margin-top: 30rem;}
    
    .footer{overflow: hidden;margin-top: -80rem;background-image: linear-gradient(transparent, var(--c2) 90%);padding: 180rem 0 25rem;}
    .footer-grid{display: grid;grid-template-columns: var(--cols);grid-gap: 0 var(--gap);align-items: flex-start;font-size: var(--f-s);}
    .f1{grid-column: 1/4;max-width: 200rem;}
    .f2{grid-column: 4/-1;display: flex;justify-content: space-between;margin: 0 calc(-1 * var(--gap));align-items: flex-start;}
    .f2-1{margin: 0 var(--gap);display: grid;grid-template-columns: auto;grid-gap: 25rem;}
    .f2-1-1{}
    .f2-1-2 p{margin: .3em 0;}
    .f2-1-2 ul{display: grid;grid-template-columns: auto;grid-gap: .3em;}
    .f3{grid-column: 1/-1;padding: 120rem 0 20rem;border-bottom: var(--sl) solid;margin-bottom: 20rem;}
    .f4{grid-column: 1/4;}
    .f5{grid-column: 4/-1;display: flex;align-items: baseline;justify-content: space-between;margin: 0 calc(var(--gap) / -2);}
    .f5-1{margin: 0 calc(var(--gap) / 2);}
    
    
    .bottombar-author{display: flex;align-items: baseline;color: var(--c1);white-space: nowrap;}
    .bottombar-author a{}
    
    .dd-icon{width: 1em;height: 1.2em;margin: 0 .3em;color: var(--c1);opacity: 1;display: inline-flex;align-items: center;justify-content: center;}
    .dd-icon .icon{width: 100%;}
    
    .tabs{overflow: hidden;}
    .tabs ul{display: flex;margin: -5rem;flex-wrap: wrap;}
    .tabs li{margin: 5rem;border-radius: 999rem;border: var(--sl) solid var(--c4);padding: 10rem 25rem;text-transform: uppercase;font-size: var(--f-xs);letter-spacing: .0625em;position: relative;overflow: hidden;}
    .tabs li.current{background-color: var(--c1);color: var(--c0);border-color: var(--c1);pointer-events: none;}
    
    .breadcrumbs{margin: 0 0 120rem;overflow: hidden;text-transform: uppercase;font-size: var(--f-xs);}
    .breadcrumbs ul{display: flex;flex-wrap: wrap;margin-left: -.5em;}
    .breadcrumbs li{margin-left: .5em;display: flex;align-items: baseline;}
    .breadcrumbs li:last-child{pointer-events: none;color: var(--c8);}
    .breadcrumbs li:not(:last-child)::after{content: "/";padding-left: .5em;} 
    
    .textbox h2{margin: 3em 0 1.5em;text-transform: uppercase;}
    .textbox h2:first-child{margin-top: 0;}
    .textbox ul,
    .textbox ol{margin: 1em 0;display: grid;grid-template-columns: auto;grid-gap: .65em;counter-reset: index;}
    .textbox ol{counter-reset: index;}
    .textbox ul:first-child,
    .textbox ol:first-child{margin-top: 0;}
    .textbox ul:last-child,
    .textbox ol:last-child{margin-bottom: 0;}
    .textbox li{position: relative;padding-left: 1.5em;}
    .textbox ul li::before{content: "\2022";position: absolute;top: 0;left: 0;width: 1.5em;text-align: center;}
    .textbox ol li::before{content: counter(index) ".";position: absolute;top: 0;left: 0;width: 1.5em;text-align: center;counter-increment: index;}
    .textbox a{text-decoration: underline;}
    
    
    .section__contrast *::-moz-selection{background-color: var(--c0);color: var(--c1);-webkit-text-fill-color: var(--c1);}
    
    .section__contrast *::selection{background-color: var(--c0);color: var(--c1);-webkit-text-fill-color: var(--c1);}
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;flex-direction: column;}
  
    .card-1{padding: 10rem;border-radius: var(--br1);background-color: var(--c3);}
    .card-1 .card-header{position: relative;display: flex;padding: 25rem;border-radius: var(--br1);overflow: hidden;align-items: flex-start;}
    .card-1 .card-header::before{content: "";flex: none;width: 0;padding-top: 45%;}
    .card-1 .card-media{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .card-1 .card-tag{position: relative;z-index: 1;border-radius: 999rem;padding: 10rem 25rem;text-transform: uppercase;font-size: var(--f-xs);letter-spacing: .0625em;overflow: hidden;background-color: var(--c0);color: var(--c1);}
    .card-1 .card-inner{padding: 35rem 25rem 25rem;flex: auto;display: flex;flex-direction: column;max-width: 520rem;}
    .card-1 .card-content{margin-bottom: auto;}
    .card-1 .card-subtitle{margin-top: 25rem;}
    .card-1 .card-footer{margin-top: 35rem;}
   
}

/* sections */

@media screen {
    
    .s1-1{position: relative;}
    .s1-2 .swiper-slide{height: auto!important;}
    .s1-3{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);min-height: 100%;}
    .s1-4{position: absolute;top: 0;left: 100%;width: var(--wr);display: flex;align-items: center;height: 100%;z-index: 1;}
    .s1-4-1{position: relative;}
    .s1-4 .carousel-pagination{display: flex;flex-direction: column;align-items: flex-start;border-left: max(1px, 2rem) solid var(--c4);counter-reset: index;}
    .s1-4 .carousel-pagination-bullet{display: block;position: relative;cursor: pointer;padding: 10rem;font-size: var(--f-s);}
    .s1-4 .carousel-pagination-bullet::before{content: counter(index, decimal-leading-zero);counter-increment: index;transform: opacity .25s;}
    .s1-4 .carousel-pagination-bullet::after{}
    .s1-4 .carousel-pagination-bullet__active{pointer-events: none;}
    .s1-4 .carousel-pagination-bullet:not(.carousel-pagination-bullet__active)::before{opacity: .4;}
    .s1-4 .carousel-pagination-runner{content: "";background-color: var(--c1);height: 100%;position: absolute;top: 0;transition: all .25s;border-radius: 999rem;}
    .s1-5{grid-column: 1/6;display: flex;flex-direction: column;position: relative;z-index: 1;padding: 120rem 0;}
    .s1-6{flex: auto;margin-bottom: 15rem;}
    .s1-6-1{margin-right: -15%;}
    .s1-6-2{margin-top: 50rem;max-width: 585rem;}
    .s1-7{margin: -5rem -10rem;display: flex;flex-wrap: wrap;}
    .s1-7-1{margin: 5rem 10rem;}
    .s1-8{grid-column: 6/-1;display: flex;position: relative;margin-bottom: auto;}
    .s1-8::before{content: "";flex: none;width: 0;padding-top: 100%;}
    
    .s2-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);align-items: center;}
    .s2-2{position: relative;display: flex;}
    .s2-2::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s2-2-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
    .s2-3{display: grid;grid-template-columns: auto;grid-gap: 40rem;}
    .s2-4{display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: flex-start;padding-bottom: 40rem;border-bottom: var(--sl) solid var(--c4);position: relative;}
    .s2-4-2{height: 1em;width: 1em;display: flex;align-items: center;justify-content: center;font-size: var(--f-b);}
    
    .s3-1{display: grid;grid-template-columns: auto;grid-gap: 50rem;counter-reset: index;}
    .s3-2{border-top: var(--sl) solid var(--c4);padding-top: 50rem;display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);align-items: flex-start;}
    .s3-2::before{content: counter(index, decimal-leading-zero);counter-increment: index;line-height: 1;letter-spacing: -.05em;font-size: var(--f-l);opacity: .2;pointer-events: none;}
    .s3-3{grid-column: 4/8;}
    .s3-3-2{margin-top: 25rem;max-width: 470rem;}
    .s3-3-3{margin-top: 30rem;}
    
    .s4-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    
    .s5-1{display: grid;grid-template-columns: auto;grid-gap: 30rem;}
    .s5-2{display: grid;grid-template-columns: var(--cols);grid-gap: 0 var(--gap);border-bottom: var(--sl) solid var(--c4);padding-bottom: 30rem;}
    .s5-3{grid-column: 4/7;display: flex;flex-direction: column;}
    .s5-4{grid-column: 7/11;margin-left: 60rem;border-radius: var(--br1);overflow: hidden;position: relative;display: flex;width: 100%;}
    .s5-4::before{content: "";flex: none;width: 0;padding-top: 90%;}
    .s5-4-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .s5-5:not(:last-child){margin-bottom: 25rem;}
    .s5-6:not(:last-child){margin-bottom: 25rem;}
    .s5-7{margin-top: auto;display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: center;}
    .s5-7-1{text-transform: uppercase;font-size: var(--f-xs);letter-spacing: .0625em;color: var(--c7);}
    
    .s6-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;opacity: .8;}
    .s6-2{padding: 250rem 0;position: relative;z-index: 1;display: grid;grid-template-columns: var(--cols);grid-gap: 0;}
    .s6-2-1{grid-column: 1/5;}
    .s6-2-2{grid-column: 1/4;margin-top: 25rem;}
    .s6-2-3{grid-column: 1/4;margin-top: 30rem;}
    .s6-3::before,
    .s6-3::after{content: "";height: 50rem;border-radius: 999rem;position: absolute;left: 0;width: 100%;background-color: var(--c0);z-index: 2;}
    .s6-3::before{top: -25rem;}
    .s6-3::after{bottom: -25rem;}
    
    .s7-1{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);}
    .s7-2{grid-column: 1/5;position: relative;width: 100%;display: flex;overflow: hidden;border-radius: var(--br1);}
    .s7-2::before{content: "";flex: none;width: 0;padding-top: 90%;}
    .s7-2-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    .s7-3{grid-column: 6/10;}
    .s7-3-2{margin-top: 35rem;}
    
    .s8-1{display: grid;grid-template-columns: var(--cols);grid-gap: 30rem var(--gap);}
    .s8-2{grid-column: 4/11;border-bottom: var(--sl) solid var(--c4);padding-bottom: 30rem;}
    .s8-3{display: grid;grid-template-columns: 1fr auto;grid-gap: var(--gap);align-items: flex-start;cursor: pointer;}
    .s8-3-1{max-width: 620rem;}
    .s8-3-2{height: 1em;width: 1em;display: flex;align-items: center;justify-content: center;font-size: var(--f-b);}
    .s8-4{max-width: 620rem;padding-top: 25rem;width: 100%;overflow: hidden;transition: all .25s;}
   
    .s8-2.active .s8-3-2{transform: scaleY(-1);}
    .s8-2:not(.active) .s8-4{height: 0;opacity: 0;padding: 0;}
    
    .s9-1{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);}
    .s9-2{grid-column: 3/9;}
    
    .s404{background-image: url(../img/404-image.png);background-size: cover;background-position: bottom;background-repeat: no-repeat;}
    .s404:last-child{margin: 0;}
    .s404-1{min-height: calc(var(--app-height) - var(--headroom-height));display: flex;flex-direction: column;align-items: center;text-align: center;}
    .s404-2{font-size: 200rem;line-height: 1;}
    .s404-3{font-size: var(--f-m);margin-top: 50rem;}
    .s404-4{margin-top: 25rem;}
}

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

        --wr: 15rem;

        --gap: 10rem;


        --btn: 44rem;

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

        --f-xs: 12rem;
        --f-s: 16rem;
        --f-d: 16rem;
        --f-m: 16rem;
        --f-b: 20rem;
        --f-l: 24rem;
        --f-xl: 32rem;
        --f-xxl: 44rem;

        --mw: 640rem; 
        
    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
    
    .title br{display: none;}
    
    .button__default .button-icon,
    .button__secondary .button-icon{padding: 8rem;}
    
    .header{padding-bottom: 15rem;z-index: 999;}
    .header::before{transition-delay: .5s;}
    
    .popup-active .header::before{opacity: 0;transition-delay: 0s;}
    
    .topbar{grid-template-columns: 1fr auto;padding: 0 0 15rem;border-top: 15rem solid transparent;}
    .topbar-logo{max-width: 50rem;}
    .topbar-nav,
    .topbar-action{display: none;}
    
    .topbar-menu{width: 50rem;height: 50rem;display: flex;align-items: center;justify-content: center;position: relative;padding: 15rem;border-radius: 50%;background-color: var(--c3);transition: color .5s, background-color .5s;pointer-events: all;}
    .topbar-menu-inner{position: relative;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}
    .topbar-menu-inner::before,
    .topbar-menu-inner::after{content: "";left: 0;right: 0;height: max(1px, 1.5rem);background-color: currentColor;position: absolute;margin: 0;transition: margin .25s, transform .25s;}
    .topbar-menu-inner::before{margin-top: -7rem;}
    .topbar-menu-inner::after{margin-top: 7rem;}
    
    .topbar-menu.active{color: var(--c0);background-color: var(--c5);}
    .topbar-menu.active .topbar-menu-inner::before{margin-top: 0;transform: rotate(45deg);}
    .topbar-menu.active .topbar-menu-inner::after{margin-top: 0;transform: rotate(-45deg);}
    
    .breadcrumbs{margin-bottom: 60rem;}
    
    .section-header:not(:last-child){margin-bottom: 35rem;}
    .section-header-pretitle{padding-top: 15rem;}
    .section-header-pretitle:not(:last-child){margin-bottom: 50rem;}
    
    .footer{padding: 80rem 0 20rem;margin-top: -20rem;}
    
    .f1{grid-column: 1/-1;max-width: 80rem;}
    .f2{grid-column: 1/-1;margin-top: 50rem;display: grid;grid-template-columns: 1fr 1fr;grid-gap: 40rem var(--gap);}
    .f2-1{grid-gap: 15rem;}
    .f2-1:nth-child(2){margin: 0 auto;}
    .f2-1:nth-child(3){grid-column: 1/-1;}
    .f3{grid-column: 1/-1;order: 1;margin: 10rem 0 0;padding: 0;border: none;}
    .f4{grid-column: 1/-1;margin: 40rem 0 10rem;padding-top: 10rem;border-top: var(--sl) solid;}
    .f5{grid-column: 1/-1;display: grid;grid-template-columns: auto;grid-gap: 10rem;}
    
    .tabs ul{margin: -2rem;}
    .tabs li{margin: 2rem;padding: 10rem 15rem;line-height: 1;}
    
    .card-1 .card-header{padding: 15rem;}
    .card-1 .card-header::before{padding-top: 65%;}
    .card-1 .card-inner{padding: 25rem 10rem 10rem;}
    .card-1 .card-subtitle{margin-top: 10rem;}
    
    .section{margin-bottom: 60rem;}
    .section:last-child{margin-bottom: 0;}
    
    .s1-5{padding: 0;grid-column: auto;}
    .s1-4{position: relative;top: auto;left: auto;width: 100%;height: auto;}
    .s1-4-1{width: 100%;}
    .s1-4 .carousel-pagination{flex-direction: row;border-left: none;border-bottom: 2rem solid var(--c4);}
    .s1-4 .carousel-pagination-bullet{flex: 1;text-align: center;}
    .s1-4 .carousel-pagination-runner{height: 2rem!important;top: auto!important;bottom: 0;}
    .s1-6{margin-bottom: 25rem;}
    .s1-6-1{margin: 0;}
    .s1-6-2{margin-top: 25rem;max-width: 280rem;}
    .s1-7{margin: -5rem;}
    .s1-7-1{margin: 5rem;}
    .s1-8{grid-column: auto;margin-top: auto;margin-bottom: 0;}
    
    .s2-1{grid-template-columns: auto;}
    .s2-2{display: none;}
    .s2-3{grid-gap: 25rem;}
    .s2-4{padding-bottom: 25rem;}
    
    .s3-1{grid-gap: 25rem;}
    .s3-2{padding-top: 25rem;grid-gap: 0;}
    .s3-2::before{margin-bottom: 30rem;}
    .s3-3{grid-column: auto;}
    .s3-3-2{margin-top: 15rem;}
    .s3-3-3{margin-top: 25rem;}
    
    .s4-1{grid-template-columns: auto;grid-gap: 15rem;}
    
    .s5-2{grid-gap: 30rem;}
    .s5-3{grid-column: auto;}
    .s5-4{grid-column: auto;margin: 0;}
    .s5-5{max-width: 280rem;}
    .s5-5:not(:last-child){margin-bottom: 15rem;}
    .s5-5 .title{font-size: var(--f-l);}
    .s5-7-2{order: -1;}
    
    .s6-2{padding: 150rem 0;}
    .s6-2-1{grid-column: auto;}
    .s6-2-2{grid-column: auto;max-width: 280rem;}
    .s6-2-3{grid-column: auto;margin-top: 15rem;}
    
    .s7-1{grid-gap: 30rem;}
    .s7-2{grid-column: auto;order: 1;}
    .s7-3{grid-column: auto;}
    .s7-3-2{margin-top: 25rem;}
    
    .s8-1{grid-gap: 25rem;padding-top: 25rem;border-top: var(--sl) solid var(--c4);}
    .s8-2{grid-column: auto;padding-bottom: 25rem;}
    .s8-3-1{max-width: 280rem;}
    .s8-4{padding-top: 15rem;max-width: 280rem;}
    
    .s9-2{grid-column: auto;}
  
    .s404-1{padding: 30rem 0;}
    .s404-2{font-size: 128rem;}
    .s404-3{margin-top: 15rem;}
    .s404-4{margin-top: 15rem;}
    
    .popup{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: var(--c2);color: var(--c0);z-index: 99;transition: clip-path .5s, visibility .5s;clip-path: inset(0 0 0% 0);background-image: var(--g1);overflow: auto;display: flex;flex-direction: column;padding-top: var(--headroom-height);}
    .popup-inner{display: flex;flex-direction: column;min-height: 100%;padding: 15rem var(--wr);transition: opacity .25s .25s;}
    .popup-content{flex: auto;}
    .popup-footer{margin-top: 50rem;display: grid;grid-template-columns: auto;grid-gap: 25rem;}
    .popup-footer-social{overflow: hidden;}
    .popup-footer-social ul{display: flex;justify-content: space-between;margin: -5rem;}
    .popup-footer-social li{margin: 5rem;}
    .popup-footer-action{margin: 0;}
    .popup-footer-action .button__secondary{border: none;width: 100%;background-color: var(--c0);color: var(--c1);}
    .popup-footer-action .button__secondary::before{content: "";height: 100%;aspect-ratio: 1/1;}
    .popup-footer-action .button__secondary .button-text{flex: auto;}

    .menu ul{display: grid;grid-template-columns: auto;grid-gap: .5em;font-size: var(--f-l);}
    
    .popup:not(.active){clip-path: inset(0 0 100% 0);visibility: hidden;}
    .popup:not(.active) .popup-inner{opacity: 0;transition-delay: 0s;}
    
    
    
}


@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
    
    .s1-4 .carousel-pagination-runner{left: 0!important;width: max(1px, 2rem)!important;}
    
    
}

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

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
    
    .button__default .button-text,
    .button__secondary .button-text{overflow: hidden;display: flex;align-items: baseline;}
    
    .button__default .button-icon,
    .button__secondary .button-icon{transition: all .25s;}
    
    .button__default:hover .button-icon{background-color: var(--c0);color: var(--c1);}
    .button__secondary:hover .button-icon{background-image: var(--g1);}
    
    .split-letter{position: relative;transition: transform .15s;will-change: transform;transition-delay: calc(.015s * var(--i));white-space: pre;}
    .split-letter::after{content: attr(data-title);position: absolute;top: 100%;left: 0;}
    
    .button:hover .split-letter{transform: translateY(-100%);}
   
    .card-media,
    .s5-4-1{will-change: transform;transition: transform .25s;}
    
    .card-1:hover .card-media,
    .s5-2:hover .s5-4-1{transform: scale(1.05);}
    
    .tabs li{transition: border-color .25s;}
    .tabs li:hover{border-color: var(--c6);}
    
    .s2-2-1{will-change: transform;transition: all .5s;}
    .s2-2-1:not(.active){transform: scale(1.1);opacity: 0;}
    
    .s2-4-1{transition: opacity .25s;}
    .s2-4-2{transition: all .25s;will-change: transform;}
    .s2-4:not(.active) .s2-4-1{opacity: .4;}
    .s2-4:not(.active) .s2-4-2{opacity: 0;transform: rotate(45deg);}
    
    .breadcrumbs a,
    .topbar-nav a,
    .bottombar-author a,
    .f2-1-2 a,
    .f5 a{transition: background-size .25s, color .25s;background-size: 0 var(--sl);background-repeat: no-repeat;background-position: right bottom;background-image: linear-gradient(currentColor, currentColor);display: inline;padding-bottom: 0;}
    
    .breadcrumbs a:hover,
    .topbar-nav a:hover,
    .bottombar-author a:hover,
    .f2-1-2 a:hover,
    .f5 a:hover{background-size: 100% var(--sl);background-position: left bottom;}
    
    .textbox a{transition: opacity .15s;}
    .textbox a:hover{opacity: .5;}
    
}