@charset "UTF-8";

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


:root{
    
    --app-height: 100vh;
    --app-width: 100vw;
    --headroom-height: auto;
    
  
    --c0: #FFFFFF; 
    --c1: #10164F; 
    --c2: #304FFE; 
    --c3: #000000; 
    --c4: #EAEDFF; 
    --c5: rgba(255,255,255,.3); 
    --c6: rgba(0,0,0,.1); 
    --c7: rgba(255,255,255,.5); 
    
    --wr: 50rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 20rem;
    --sl: max(1px, 1rem);
    
    --br1: 8rem;
    --br2: 10rem;
    --br3: 12rem;
    --br4: 14rem;

    
    --f-xs: max(12px, 14rem);
    --f-s: max(14px, 16rem);
    --f-d: max(14px, 20rem);
    --f-m: max(14px, 22rem);
    --f-b: max(14px, 24rem);
    --f-b1: max(14px, 50rem);
    --f-l: max(14px, 80rem);
    --f-xl: max(14px, 140rem);
    --f-xxl: max(14px, 240rem);
    
    --mw: 19200px; 
    
    
}

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

@keyframes preloaderline {
	0%
	{
		height: 33vh;
	}
	50%{
		height: 20vh;
	}
	100%
	{
		height: 0vh;
	}
}


/* globals */

@media screen {

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

    .document{font-weight: 400;font-family: 'Noto Sans', sans-serif;font-size: var(--f-d);line-height: 1.2;color: var(--c1);background-color: var(--c0);letter-spacing: normal;}
    
    .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: 1;transition: all 1s 1s;display: flex;will-change: transform;overflow: hidden;pointer-events: none;transform: translateY(-100%);}
    .preloader-inner{height: var(--app-height);display: grid;grid-template-rows: 1fr auto 1fr;padding: 70rem 0;grid-template-areas: "." "p1" "p2";overflow: hidden;grid-template-columns: auto;}
    .preloader-title{grid-area: p1;white-space: nowrap;text-align: center;overflow: hidden;width: 100%;font-size: var(--f-l);height: 1em;}
    .preloader-title .swiper{height: 100%;}
    .preloader-title-blue{color: var(--c2);}
    
    .preloader-perc{grid-area: p2;text-align: center;margin-top: auto;font-family: sans-serif;}
    .preloader-perc::after{content: "%";}
    .preloader-bar{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;will-change: transform;transform: translateY(100%);}
    .preloader-bar-blue{background-color: var(--c2);}
    .preloader-bar-white{background-color: var(--c0);visibility: hidden;}
     
    .preloader-scene-1 .preloader-title-1 .mask-appear-inner{transform: translateY(0);}
    .preloader-scene-2 .preloader-title-1 .mask-appear-inner{transform: translateY(-100%);}
    .preloader-scene-2 .preloader-title-2 .mask-appear-inner{transform: translateY(0);}
    .preloader-scene-30 .preloader-title-2 .mask-appear-inner{transform: translateY(-100%);transition-delay: .5s!important;}
    
    .preloader-scene-3 .preloader-bar-blue{transition: transform .75s;transform: translateY(0);}
    .preloader-scene-4 .preloader-bar-white{transition: transform .75s;transform: translateY(0);}
    .preloader-scene-4{}
    
    .loading{pointer-events: none;overflow: hidden;}
    .loading .preloader{transition-duration: 0s;transform: translateY(0);visibility: visible;}
    .loading .container{visibility: hidden;}
    
    .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;}

    .player-video{max-width: none;}
    
    .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;}
    .button-text{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;position: relative;z-index: 2;min-width: 0;padding: 0 .1em;}
    
    .button__main{background-color: var(--c2);color: var(--c0);padding: 0 50rem;height: max(50px, 75rem);border-radius: var(--br4);}
    .button__main .button-text{font-size: var(--f-m);font-weight: 900;text-transform: uppercase;line-height: 1.1;letter-spacing: -.02em;}
    .button__secondary{background-color: var(--c0);color: var(--c1);padding: 0 30rem;height: max(45px, 55rem);border-radius: var(--br2);}
    .button__wide{width: 100%;}
     
    .altfont,
    .timer-delimiter,
    .countdown-timer,
    .title,
    .textbox h2,
    .textbox h3{line-height: .9;font-weight: 700;width: 100%;font-family: 'FWC26', 'Noto Sans', sans-serif;}
    .title{text-transform: uppercase;}
    .title__small{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);}
    
    .header{position: fixed;left: 0;top: 0;z-index: 100;overflow-x: clip;width: 100%;color: var(--c1);transition: color .25s;}
    
    .topbar{display: grid;grid-template-columns: 1fr auto 1fr;grid-gap: 50rem;align-items: center;transition: opacity .75s;}
    .topbar-nav{font-size: var(--f-s);font-weight: 700;text-transform: uppercase;letter-spacing: 0;padding: 30rem 0;position: relative;z-index: 2;}
    .topbar-nav__left{margin-right: auto;}
    .topbar-nav__right{margin-left: auto;}
    .topbar-nav ul{display: grid;grid-auto-flow: column;grid-gap: 50rem;}
    .topbar-logo{max-width: 160rem;display: flex;position: relative;align-items: flex-start;justify-content: center;height: 100rem;z-index: 1;}
    .topbar-logo-inner{padding: 0;position: relative;flex: none;width: 100%;overflow: hidden;min-width: 160rem;display: flex;align-items: center;aspect-ratio: 160/100;pointer-events: none;}
    .topbar-logo-back,
    .topbar-logo-front{aspect-ratio: 1115/428;width: 100%;overflow: hidden;position: relative;}
    .topbar-logo-back{position: absolute;opacity: 0;z-index: 1;transition: opacity .15s;}
    .topbar-logo-back img{object-position: left;}
    .topbar-logo-static{opacity: 0;}
    
    
    .main{flex: auto;display: flex;flex-direction: column;}
   
    .section{position: relative;z-index: 1;overflow: clip;padding: 200rem 0;}
    .section:only-child{flex: auto;}
    
    .section-header{display: flex;flex-direction: column;}
    
    .formbox{display: grid;grid-template-columns: auto;grid-gap: var(--gap);}
    .formbox-footer{margin-top: 60rem;}
    
    .textfield{width: 100%;display: flex;position: relative;min-height: max(55px, 70rem);}
    .textfield:focus-within{}
    .textfield-input{text-overflow: ellipsis;padding: 20rem 20rem;position: relative;flex: auto;resize: none;z-index: 1;width: 100%;transition: border-color .15s;border-radius: var(--br3);border: var(--sl) solid var(--c5);}
    .textfield-input:focus{border-color: var(--c0);}
    
    .textfield-error{color: #dc3232;margin-top: 10rem;font-size: var(--f-s);}
    
    #section-form .wpcf7-form-control-wrap{flex-direction: column;}
    
    .selector{user-select: none;}
    .selector-holder{border-radius: var(--br3);min-height: max(55px, 70rem);border: var(--sl) solid var(--c5);display: flex;overflow: hidden;align-items: center;cursor: pointer;padding: 0 20rem;color: var(--c0);}
    .selector-holder-input{flex: auto;overflow: hidden;text-overflow: ellipsis;min-width: 0;pointer-events: none;padding: 20rem 0;}
    .selector-holder-icon{flex: none;margin-left: 10rem;display: flex;width: max(10px, 14rem);height: max(10px, 14rem);align-items: center;justify-content: center;}
    
    .selector.active .selector-holder{background-color: var(--c0);color: var(--c1);border-bottom-left-radius: 0;border-bottom-right-radius: 0;}
    .selector.active .selector-holder-icon{transform: scaleY(-1);}
    
    .selector-list{background-color: var(--c0);position: absolute;width: 100%;z-index: 999;overflow: auto;max-height: 600rem;padding: 0;display: grid;grid-template-columns: auto;grid-gap: 5rem;border-radius: 0 0 var(--br3) var(--br3);}
    .selector-list:not(.active){visibility: hidden;opacity: 0;}
    .selector-option{position: relative;padding: 10rem 20rem;border-bottom: var(--sl) solid var(--c6);}
    .selector-option:last-child{padding-bottom: 20rem;border-bottom: none;}
    .selector-option-inner:not(.active){cursor: pointer;}
    .selector-option-inner.active{color: var(--c2);pointer-events: none;}
    
    .selector-message{font-size: var(--f-s);padding-top: 10rem;}
    .selector-message:not(.active){display: none;}
    .selector-message a{text-decoration: underline;}
    
    .footer{overflow: hidden;margin-top: 0;background-color: var(--c2);color: var(--c0);position: relative;z-index: 1;padding: 140rem 0 20rem;}
    .footer-grid{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 280rem var(--gap);align-items: flex-start;}
    .footer-form{max-width: 550rem;}
    .footer-form-caption{margin-bottom: 25rem;}
    .footer-form-container{display: grid;grid-template-columns: 1fr auto;grid-gap: 15rem 10rem;}
    .footer-form-cell{display: flex;}
    .footer-form-cell .textfield-input{padding: 0 20rem;}
    .footer-nav{display: flex;align-items: flex-start;line-height: 1;}
    .footer-nav-title{opacity: .5;margin-bottom: .6em;}
    .footer-nav-col:not(:last-child){padding-right: 150rem;}
    .footer-nav ul{display: grid;grid-template-columns: auto;grid-gap: .6em;}
    .footer-form-message{}
    
    .footer-form-wrapper:not(.success) .footer-form-message{visibility: hidden;}
    
    .footer-runner{grid-column: 1/-1;}
    
    .marquee{white-space: nowrap;display: inline-flex;justify-content: flex-start;}
    .marquee-container{display: inline-flex;align-items: center;height: 350rem;}
    .marquee-container img{height: 100%;width: auto;max-width: none;}
    .marquee-container::after{content: "";width: 30rem;height: 30rem;background-color: currentColor;border-radius: 50%;margin: 0 70rem;}
    
    
    .runner-end, 
    .runner-start{animation: 25s linear infinite ticker;display: flex;will-change: transform;transition: transform .01s;}
    
    
    .bottombar{margin-top: 35rem;display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;color: var(--c7);}
    .bottombar-author{display: flex;align-items: baseline;}
    .bottombar-author a{color: var(--c0);}
    .bottombar-author sup{font-size: var(--f-xs);margin-bottom: calc(var(--f-d) - 1em);}
    
    .dd-icon{width: 1.2em;height: 1em;margin: 0 .3em;color: var(--c0);display: inline-flex;align-items: center;justify-content: center;}
    .dd-icon .icon{width: 100%;}
    
    .mask-appear{position: relative;display: inline-block;}
    .mask-appear-wrapper{display: block;position: relative;overflow: hidden;z-index: 1;}
    .mask-appear-inner{display: block;transition: transform .5s .5s;will-change: transform;}
    
    .nobr{white-space: nowrap;}
    
    .scrl{position: relative;overflow: hidden;white-space: nowrap;display: inline-flex;align-items: flex-start;padding: 0 .05em;margin: 0 -.05em;height: 1.2em;}
    .scrl-inner{display: grid;grid-template-columns: auto;height: 1.2em;}
    .scrl-inner *{line-height: 1!important;height: 1.2em;display: inline-flex;align-items: center;}
    
    
    .textbox h2,
    .textbox h3{margin: 45rem 0 15rem;font-size: var(--f-b);text-transform: uppercase;font-weight: 900;line-height: 1.2;}
    .textbox h2:first-child,
    .textbox h3:first-child{margin-top: 0;}
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;flex-direction: column;user-select: none;width: 100%;}
  
    .card-1{background-color: var(--c2);color: var(--c0);padding: 30rem;}
    .card-1 .card-header{margin-bottom: auto;}
    .card-1 .card-footer{margin-top: 30rem;}
    .card-1 .card-footer .button{background-color: var(--c0);color: var(--c2);}
   
}

/* sections */

@media screen {
    
    .s1{padding: calc(var(--app-height) / 5) 0 0;margin-top: var(--app-height);}
    .s1-1{margin: 0 var(--awr);position: sticky;top: calc(var(--app-height) / 5);height: calc(var(--app-height) / 5 * 4);z-index: 1;}
    .s1-2{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;background-color: var(--c3);overflow: hidden;}
    .s1-3::after{content: "";display: block;height: 25vh;}
    
    .s2{background-color: var(--c0);color: var(--c1);padding: 0;transition: all .5s;}
    .s2.invert{background-color: var(--c1);color: var(--c0);}
    .s2-1{display: grid;grid-template-columns: auto 1fr auto;grid-gap: 0 var(--wr);grid-template-areas: "a1 a2 a3";position: sticky;top: 0;margin: 0 var(--awr);}
    .s2-2{display: flex;align-items: flex-start;padding-bottom: 100vh;}
    .s2-3,
    .s2-4{grid-area: a2;max-width: 1300rem;display: flex;align-items: center;margin: 0 auto;min-height: var(--app-height);padding: 200rem 0;pointer-events: none;}
    .s2-5,
    .s2-6{position: relative;display: flex;align-items: center;width: 0;}
    .s2-5{grid-area: a1;justify-content: flex-end;}
    .s2-6{grid-area: a3;justify-content: flex-start;}
    .s2-7{display: grid;grid-template-columns: auto;grid-gap: 40rem;grid-template-rows: 1fr 1fr;text-align: center;pointer-events: all;}
    .s2-7-1{display: flex;align-items: flex-end;justify-content: center;overflow: hidden;}
    .s2-7-2{display: flex;align-items: flex-start;justify-content: center;max-width: 600rem;margin: 0 auto;transition: opacity .5s 1s;}
    .s2-7-2 a{text-decoration: underline;}
    .s2-8{position: relative;overflow: hidden;display: flex;width: 62.5vw;flex: none;max-width: var(--app-height);}
    .s2-8::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s2-8 img{will-change: transform;}
    
    .s2-5 .s2-8{transform: translateX(20%);}
    .s2-5 .s2-8 img{transform: rotate(90deg);}
    .s2-6 .s2-8{transform: translateX(-20%);}
    .s2-6 .s2-8 img{transform: rotate(-90deg);}
    .s2-7.hidden{pointer-events: none;}
    .s2-7.hidden .s2-7-1 .mask-appear-inner{transform: translateY(100%);transition-delay: 0s!important;text-align: center;}
    .s2-7.hidden .s2-7-2{opacity: 0;transition-delay: 0s;}
    
    .s2-9{height: 350vh;display: flex;flex-direction: column;position: relative;z-index: 1;opacity: .5;}
    
    .scene-trigger{visibility: visible;width: 20rem;}
    
    .scene-trigger{flex: 1;width: var(--sl);visibility: hidden;}
    .scene-trigger:nth-child(odd){background: red;}
    .scene-trigger:nth-child(even){background: pink;}
    
    
    .s2-9-1{flex: 2;}
    
    .s2-10{padding: 150vh 100rem 0;width: 100%;display: flex;flex-direction: column;}
    .s2-10-1{width: 420rem;}
    .s2-10-2{width: 375rem;margin-left: auto;}
    .s2-10-3{width: 480rem;margin-left: 215rem;margin-top: 300rem;}
    
    .s3{background-color: var(--c2);color: var(--c0);padding: 0;}
    .s3-1{min-height: var(--app-height);display: flex;padding: 300rem 0;}
    .s3-2{margin-top: auto;}
    .s3-2 .timer{font-size: var(--f-xxl);display: flex;align-items: center;margin-right: -.3em;line-height: 1;user-select: none;}
    .s3-2 .timer-val{text-align: right;min-width: 1.4em;position: relative;flex: none;padding-right: .3em;}
    .s3-2 .timer-val::after{content: attr(title);position: absolute;top: 100%;left: 50%;white-space: nowrap;transform: translateX(-50%);font-size: var(--f-d);}
    .s3-2 .timer-delimiter{padding-left: 0em;}
    .s3-2 .countdown-timer{}
    .s3-3{text-transform: uppercase;margin-top: 75rem;border-top: var(--sl) solid var(--c5);padding-top: 20rem;}
    .s3-4{text-align: center;display: flex;flex-direction: column;margin: auto;}
    .s3-5,
    .s3-6{position: absolute;left: 0;width: 100%;z-index: 1;height: 230rem;}
    .s3-5{top: -1px;}
    .s3-6{bottom: -1px;}
    .s3-5-1,
    .s3-6-1{height: 100%;width: 100%;position: absolute;left: 0;background-size:  auto 230rem;background-repeat: no-repeat;}
    .s3-5-1{background-image: url(../img/timer-top-a.svg);background-position: top;top: 0;}
    .s3-6-1{background-image: url(../img/timer-bottom-a.svg);background-position: bottom;bottom: 0;}
    
    .s4{background-color: var(--c0);}
    .s4-2{display: flex;flex-direction: column;align-items: center;text-align: center;}
    .s4-2-2{margin-top: 10rem;}
    .s4-2-2 a{text-decoration: underline;}
    .s4-3{display: grid;grid-template-columns: auto;grid-gap: 8rem;margin-top: 60rem;}
    .s4-4{display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: 0 50rem;align-items: center;background-color: var(--schedule-row-bg, var(--c4));border-radius: var(--br4);padding: 20rem 50rem;position: relative;overflow: hidden;}
    .s4-4__a{--schedule-row-bg: var(--c4);}
    .s4-4__b{--schedule-row-bg: var(--c2);color: var(--c0);}
    .s4-4__c{--schedule-row-bg: var(--c1);color: var(--c0);}
    .s4-5{font-weight: 900;font-size: var(--f-b);}
    .s4-6{font-weight: 900;font-size: var(--f-b);text-align: center;}
    .s4-7{display: flex;align-items: center;justify-content: flex-end;}
    .s4-7-2{display: flex;align-items: center;justify-content: center;width: max(50px, 64rem);height: max(50px, 64rem);padding: 15rem;border-radius: 50%;overflow: hidden;background-color: currentColor;flex: none;margin-left: 20rem;}
    .s4-7-2 .icon{color: var(--schedule-row-bg);}
    
    .s4-7.disabled{opacity: .3;}
    
    .s5{background-color: var(--c1);color: var(--c0);padding: 0;}
    .s5-1{margin: 0 var(--awr);max-height: 1031rem;position: relative;padding: 100rem var(--wr);flex: auto;}
    .s5-1-1::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: linear-gradient(to bottom, var(--c1), rgba(0,0,0,0) 20%, rgba(0,0,0,0) 80%, var(--c1));opacity: 1;}
    .s5-1-1 img{object-position: center;}
    .s5-1-2{position: relative;z-index: 1;text-align: center;}
    .s5-1-3{position: absolute;bottom: 68.5%;left: calc(1014 * 100% / 3840);z-index: 1;display: flex;align-items: flex-end;justify-content: center;width: 0;height: var(--sl);}
    .s5-1-3 .marker{flex: none;width: 95rem;display: flex;align-items: flex-end;}
    .s5-1-4{position: absolute;bottom: 12.5%;left: 32.5%;z-index: 1;display: flex;align-items: flex-end;justify-content: center;width: 0;height: var(--sl);}
    .s5-1-4 .marker{flex: none;width: 55rem;display: flex;align-items: flex-end;}
    .s5-2{padding: 0 0 70rem;display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);flex: none;}
    .s5-3{display: grid;grid-template-columns: auto 1fr;grid-gap: 70rem;align-items: flex-start;}
    .s5-4{opacity: .3;}
    .s5-5{display: grid;display: flex;flex-wrap: wrap;margin: -10rem;}
    .s5-6{margin: 10rem;position: relative;}
    .s5-6-1{border: var(--sl) solid var(--c5);padding: 15rem 25rem;border-radius: var(--br2);}
    .s5-6-2{position: absolute;top: 100%;left: 0;width: 100%;text-align: center;font-size: var(--f-xs);margin-top: 5rem;opacity: .5;}
    .s5-7{min-height: var(--app-height);display: flex;flex-direction: column;}
    
    .s6{background-color: var(--c0);}
    .s6-1{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--gap);}
    .s6-2{padding-bottom: 50rem;grid-column: 1/3;}
    .s6-3{display: grid;margin-top: auto;grid-gap: var(--gap);}
    .s6-3-1{width: 100%;position: relative;border-radius: var(--br3);overflow: hidden;background-color: var(--c6);display: flex;}
    .s6-3-1::before{content: "";flex: none;width: 0;padding-top: 100%;}
    
    .s7{background-color: var(--c3);color: var(--c0);padding: 100rem 0 150rem;min-height: var(--app-height);}
    .s7-1{position: relative;z-index: 1;max-width: 800rem;width: 50%;}
    .s7-2{opacity: .7;}
    .s7-3-2{margin-top: 25rem;}
    .s7-4{margin-top: 35rem;}
    .s7-5{position: relative;z-index: 1;padding: 50rem 0;width: 100%;}
    
    .s7:not(.success) .s7-5,
    .s7.success .s7-1{display: none;}
    
    
    
    .s8{background-color: var(--c2);color: var(--c0);padding: 75rem 0 50rem;border-bottom: var(--sl) solid var(--c5);}
    .s8 + .s8{padding-top: 50rem;}
    .s8-1{display: flex;align-items: center;justify-content: space-between;margin: 0 -40rem;}
    .s8-2{margin: 0 40rem;}
    .s8-4{margin-bottom: 35rem;opacity: .5;}
    
    .s9{padding: 75rem 0 50rem;border-bottom: var(--sl) solid var(--c5);}
    .s9-1{display: flex;align-items: center;justify-content: space-between;margin: 0 -40rem;}
    .s9-2{margin: 0 40rem;}
    .s9-4{margin-bottom: 35rem;opacity: .5;}
    
    .s404-1{display: flex;align-items: center;flex-direction: column;}
    .s404-2{width: 100%;display: flex;position: relative;overflow: hidden;max-width: 760rem;}
    .s404-2::before{content: "";flex: none;width: 0;padding-top: 60%;}
    .s404-3{margin-top: 50rem;text-align: center;font-size: var(--f-b1);font-weight: 700;}
    .s404-4{margin-top: 15rem;max-width: 400rem;text-align: center;}
    .s404-5{margin-top: 45rem;}
    
    .s10-1{}
    .s10-3{margin-top: 25rem;max-width: 1120rem;}
    
}

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

        --wr: 15rem;

        --gap: 5rem;

        --br1: 5rem;
        --br2: 10rem;
        --br3: 12rem;
        --br4: 10rem;


        --f-xs: 10rem;
        --f-s: 12rem;
        --f-d: 14rem;
        --f-m: 14rem;
        --f-b: 16rem;
        --f-b1: 36rem;
        --f-l: 50rem;
        --f-xl: 45rem;
        --f-xxl: 70rem;

        --mw: 680px; 
        
    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
    
    .preloader-inner{padding: 50rem 0 120rem;}
    .preloader-perc{font-size: 14px;}
    
    .button__main{height: 45rem;padding: 0 30rem;}
    .button__main .button-text{font-size: var(--f-s);}
    .button__secondary{height: 45rem;padding: 0 30rem;}
  
    .header{padding-top: 10rem;}
    
    .topbar{grid-template-columns: auto 1fr;align-items: flex-start;}
    .topbar-nav{padding: 5rem 0;font-size: var(--f-d);margin-left: auto;}
    .topbar-logo{max-width: 40rem;height: auto;justify-content: flex-start;margin-top: 0;}
    .topbar-logo-static{}
    .topbar-logo-inner{min-width: 40rem;aspect-ratio: 134/255;}
    .topbar-logo-back{display: none;}
    .topbar-logo-front{aspect-ratio: 134/255;}
    
    .selector-holder,
    .textfield{min-height: 45rem;border-radius: var(--br1);}
    
    .selector-holder{padding: 0 15rem;}
    .selector-holder-input{padding: 15rem 0;}
    .selector-holder-icon{width: 8rem;height: 8rem;}
    .selector-list{border-radius: 0 0 var(--br1) var(--br1);}
    .selector-option{padding: 10rem 15rem;}
    .selector-message{padding-top: 5rem;}
    
    .textfield-input{padding: 15rem;border-radius: var(--br1);}
    .textfield-error{margin-top: 5rem;}
    
    .formbox{grid-gap: 10rem;}
    .formbox-footer{margin-top: 20rem;}
    
    .footer{padding: 60rem 0 15rem;}
    .footer-grid{grid-template-columns: auto;grid-gap: 0;}
    .footer-form-container{grid-gap: 15rem 30rem;align-items: center;}
    .footer-form-cell .textfield-input{padding: 15rem;}
    .footer-form-cell__input{grid-column: 1/-1;}
    .footer-form-cell__button{order: 1;}
    .footer-form-cell__message{}
    .footer-nav{flex-direction: column;margin-top: 25rem;}
    .footer-nav-col:not(:last-child){padding: 0;margin-bottom: 30rem;}
    .footer-runner{padding: 0 var(--wr);margin: 130rem var(--awr) 0;overflow: hidden;}
    
    .marquee-container{height: 65rem;}
    .marquee-container::after{margin: 0 15rem;width: 10rem;height: 10rem;}
    
    .bottombar{grid-template-columns: auto;grid-gap: 20rem;margin-top: 20rem;}
    
    .textbox h2,
    .textbox h3{margin: 35rem 0 15rem;}
    
    .card-1{padding: 10rem;}
    .card-1 .card-footer .button{height: 30rem;border-radius: var(--br1);}
    
    .section{padding: 100rem 0;}
    
    .main{}
    
    .s1{padding: 0;}
    
    .logo-trigger{position: absolute;top: 0;left: 0;}
    
    .scene-trigger{}
    
    .s2{padding: 0;}
    .s2-1{margin: 0 var(--awr);grid-template-columns: auto;grid-gap: 0;grid-template-rows: auto 1fr auto;grid-template-areas: "a1" "a2" "a3";overflow: hidden;padding: 0 var(--wr);z-index: 1;}
    .s2-2{margin: 0 var(--awr);padding-bottom: 100rem;}
    .s2-3, 
    .s2-4{padding: 100rem 0 150rem;align-items: flex-start;}
    .s2-5{display: none;}
    .s2-6{width: calc(100% + 400rem);height: 0;margin-top: 10rem;align-items: flex-start;margin: 0 -200rem;justify-content: center;}
    .s2-6 .s2-8{transform: translateY(-30%);align-items: flex-start;}
    .s2-7{grid-gap: 15rem;}
    .s2-7-2{max-width: 360rem;}
    .s2-8{width: 100%;}
    .s2-9{height: 250vh;}
    .s2-9-4{flex: 1;}
    .s2-9-5{flex: 1;}
    .s2-9-6{height: 100vh;flex: none;}
    
    .s2-10{padding: 0 100vw 70rem ;flex-direction: row;flex: none;width: auto;align-items: flex-end;height: var(--app-height);position: sticky;top: 0;}
    .s2-10-1,
    .s2-10-2,
    .s2-10-3{flex: none;width: auto;height: 220rem;margin: 0;display: flex;}
    .s2-10-2,
    .s2-10-3{margin-left: 10rem;}
    .s2-10 img{width: auto;max-width: none;height: 100%;}
    
    .sx2-10{padding-left: 0;padding-right: 0;}
    .sx2-10-1{width: 145rem;margin-left: -25rem;}
    .sx2-10-2{width: 135rem;margin-right: 30rem;margin-top: 250rem;}
    .sx2-10-3{width: 150rem;margin: 300rem auto 0;}
    
    .s3{padding: 0;}
    .s3-1{min-height: 0;padding: 100rem 0;}
    .s3-2{margin: auto;}
    .s3-2 .timer{margin-right: -.1em;}
    .s3-2 .timer-val{padding-right: .1em;min-width: 1.1em;}
    .s3-2 .timer-val::after{font-size: var(--f-xs);}
    .s3-2 .timer-delimiter{width: 0;margin-right: .1em;}
    .s3-3{margin-top: 40rem;padding-top: 10rem;}
    .s3-4{width: 100%;}
    .s3-5,
    .s3-6{height: 70rem;}
    .s3-5-1,
    .s3-6-1{background-size: auto 70rem;;height: 100%;}
    
    .s4-3{margin-top: 30rem;grid-gap: var(--gap);}
    .s4-4{padding: 15rem;grid-gap: 5rem 30rem;grid-template-columns: 1fr auto;}
    .s4-5{margin-top: auto;font-weight: 400;}
    .s4-6{order: 1;margin-bottom: auto;text-align: left;}
    .s4-7{grid-row-end: span 2;margin-left: auto;}
    .s4-7-1{font-size: var(--f-xs);max-width: 70rem;}
    .s4-7-2{width: 40rem;height: 40rem;padding: 10rem;margin-left: 5rem;}
    
    .s5{padding: 75rem 0;}
    .s5-1{padding-top: 0;padding-bottom: 0;height: auto;max-height: none;flex: none;}
    .s5-1-1{margin: 0 var(--awr);position: relative;display: flex;}
    .s5-1-1 img{}
    .s5-1-2{text-align: left;}
    .s5-1-3{bottom: auto;left: 12%;top: 31%;line-height: 0;}
    .s5-1-3 .marker{width: 35rem;}
    .s5-1-4{bottom: auto;left: 28.5%;top: 86%;line-height: 0;}
    .s5-1-4 .marker{width: 35rem;}
    .s5-2{grid-template-columns: auto;grid-gap: 30rem;padding: 0;}
    .s5-3{grid-template-columns: auto;grid-gap: 10rem;}
    .s5-6-1{padding: 15rem;}
    .s5-6-2{position: relative;top: auto;text-align: left;}
    
    .s6-1{grid-template-columns: 1fr 1fr;}
    .s6-2{grid-column: 1/-1;padding-bottom: 15rem;}
    .s6-2 .title br{display: none;}
    .s6-3:nth-child(3n + 4){grid-column: 2/3;}
    .s6-3:nth-child(3n + 6){grid-column: 1/2;}
    
    .s7-1{width: 100%;}
    .s7-4{margin-top: 20rem;}
    
    .s8{padding: 35rem 0;}
    
    .s8 .swiper{overflow: visible;}
    .s8 .swiper-wrapper{transition-timing-function: linear !important;}
    .s8 .swiper-slide{height: 45rem;padding: 0 var(--wr);width: auto;}
    .s8 .swiper-slide img{height: 100%;width: auto;max-width: none;}
    
    .s8-1{justify-content: space-around;margin: 0;width: 200vw;}
    .s8-2{padding: 0 var(--wr);margin: 0;}
    .s8-2 img{height: 45rem;width: auto;max-width: none;min-width: 0;}
    .s8-3{margin: 0 var(--awr);overflow: auto;overflow: -moz-scrollbars-none!important;scrollbar-width: none;}
    .s8-3::-webkit-scrollbar{display: none;}
    
    .s9{padding: 35rem 0;}
    
    .s9 .swiper{overflow: visible;}
    .s9 .swiper-wrapper{transition-timing-function: linear !important;}
    .s9 .swiper-slide{height: 45rem;padding: 0 var(--wr);width: auto;}
    .s9 .swiper-slide img{height: 100%;width: auto;max-width: none;}
    
    .s10-3{margin-top: 15rem;}
    
    .s404{padding: 150rem 0;}
    .s404-5{margin-top: 30rem;}
    
    .popup{position: fixed;z-index: 999;top: 0;left: 0;right: 0;bottom: 0;background-color: var(--c2);color: var(--c0);display: flex;overflow: auto;margin-left: 50rem;will-change: transform;transition: transform .5s;transform: translateX(100%);}
    .popup-inner{display: flex;flex-direction: column;padding: 15rem var(--wr) 35rem 35rem;width: 100%;}
    .popup-overlay{background-color: var(--c0);position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 100;opacity: 0;transition: opacity .5s;pointer-events: none;}
    
    .popup-header{margin-left: auto;font-weight: 700;text-transform: uppercase;letter-spacing: 0;display: flex;align-items: center;}
    .popup-nav{margin: 50rem 0;}
    .popup-nav ul{display: grid;grid-template-columns: auto;grid-gap: 0;font-size: var(--f-xl);text-transform: uppercase;}
    .popup-footer{margin-top: auto;}
    .popup-footer ul{display: grid;grid-template-columns: auto;grid-gap: 10rem;}
    
    .popup.active{transform: translateX(0);}
    
    .popup.active ~ .popup-overlay{opacity: 1;pointer-events: all;}
    
    
    .header .player-video{max-width: none;width: auto;}
    
    .runner-end, 
    .runner-start{ }
    
    
    .invert .header{color: var(--c0);}
    
    .hide-header .topbar{opacity: 0;pointer-events: none;}
    
    
    .videoObject{background-color: var(--c1);}
    
}


@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
    
    
    .topbar-logo-inner{max-width: 100vw;padding: 0!important;height: auto!important;}
    
    
    .clip-header .topbar-logo-back{opacity: 1;}
    
    .logo-trigger{position: absolute;top: 0;left: 0;}
    
    .section:not(.s8):not(.s9){min-height: var(--app-height);}
    
    .footer-form-cell .textfield{min-height: auto;}
    
    .s2-10{transform: none!important;}
    
    .s5-1{min-height: calc(2062 * var(--app-width) / 3840);}
    .s5-1-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
    
    .s6-3:nth-child(even){grid-template-columns: 1fr 1fr;grid-column-end: span 2;}
    
    .s8-2,
    .s9-2{height: 100rem;}
    
    .s8-2 img,
    .s9-2 img{height: 100%;}
    
    
    .header{transition: transform .75s, background-color .5s, color .5s;background-color: var(--c0);will-change: transform;}
    
    .invert .header{background-color: var(--c1);color: var(--c0);}
    
    .hide-header{pointer-events: none;transform: translateY(-100%);}
    
    
    .footer-runner:not(.visible) .runner-end, 
    .footer-runner:not(.visible) .runner-start{animation-play-state: paused;}
    
    
    
}

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

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
    
    .s5-6-1{cursor: pointer;}
    
    .button__main{background-image: url(../img/main-button-hover.gif);background-position: center;background-repeat: no-repeat;background-size: 0;}
    .button__main:hover{color: var(--c0)!important;background-size: cover;}
    
    .scrl-inner{will-change: transform;transition: transform .25s;}
    .scrl:hover .scrl-inner,
    .s5-6-1:hover .scrl-inner,
    .button__secondary:hover .scrl-inner{transform: translateY(-100%);}
   
    .selector-option-inner{transition: color .15s;}
    .selector-option-inner:hover{color: var(--c2);}
    
    .s2-7-2 a,
    .s4-2-2 a,
    .selector-message a{transition: opacity .25s;}
    
    .s2-7-2 a:hover,
    .s4-2-2 a:hover,
    .selector-message a:hover{opacity: .6;}
    
    
}