@charset "UTF-8";

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


:root{
    
    --app-height: 100vh;
    --headroom-height: auto;
    
  
    --c0: #FFFFFF; 
    --c1: #050505;
    --c2: #F6F4F0;
    --c3: #252525;
    --c4: rgba(5,5,5,.4);
    --c5: #D9D9D9;
    
    --wr: 70rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 20rem;
    --sl: max(1px, 1rem);
    
    --br1: 8rem;

    --altfont: 'Cinzel', serif;
    
    --f-xs: max(12px, 14rem);
    --f-s: max(12px, 18rem);
    --f-d: max(12px, 20rem);
    --f-m: max(14px, 22rem);
    --f-b: max(14px, 30rem);
    --f-l: max(14px, 70rem);
    --f-xl: max(14px, 80rem);
    --f-n: max(14px, 150rem);
    
    --mw: 19200px; 
    
    --rating: 5.0;
    
}


@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: 300;font-family: 'Jost', 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(--c1);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;}
    
    
    .s1-1{transition: all 1.5s 2s;}
    
    .loading .s1-1{transition-duration: 0s;filter: grayscale(1);}
    
    .fade-appear.init{transition: all 1s .5s;position: relative;}
    .fade-appear.init:not(.visible){opacity: 0;transform: translateY(50rem);transition-duration: 0s;transition-delay: 0s;}
    
    .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;}
    .button:not(.fill){position: relative;}
    .button-text{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;position: relative;z-index: 1;min-width: 0;padding: 0 .1em;}
    
    .button__default{padding: 0 40rem;height: max(40px, 56rem);border-radius: 999rem;color: var(--c0);position: relative;z-index: 1;overflow: visible;}
    .button__default::before{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: -1;background-color: var(--c1);border-radius: 999rem;}
    .button__default .button-text{font-weight: 400;}
    
    .button__wide{width: 100%;}
     
    .altfont,
    .title{font-family: var(--altfont);font-weight: 400;}
    
    .title{width: 100%;text-transform: uppercase;}
    .title__default{font-size: var(--f-l);line-height: .85;letter-spacing: -.04em;}
    .title__large{font-size: var(--f-xl);line-height: .9;letter-spacing: -.05em;}
    
    .container{display: flex;flex-direction: column;min-height: var(--app-height);}
    
    
    .headroom-trigger{height: 0;width: 100%;position: relative;}
    
    .header{position: fixed;top: 0;left: 0;width: 100%;z-index: 99;color: var(--c0);background-image: linear-gradient(var(--c1), rgba(0,0,0,0));}
    .header__contrast{color: var(--c1);background-image: none;position: static;}
    
    .header.init{will-change: transform;transition: transform .25s linear;}
    .header:not(.static){transform: translateY(-100%);}
    
    .topbar{display: grid;grid-template-columns: 1fr auto 1fr;grid-gap: 160rem;align-items: center;padding: 50rem 0;}
    .topbar-logo{max-width: 335rem;width: 100%;}
    .topbar-nav{}
    .topbar-nav ul{display: flex;justify-content: space-between;margin: 0 -10rem;}
    .topbar-nav li{margin: 0 10rem;}
    .topbar-nav li.current{pointer-events: none;text-decoration: underline;}
    
    .main{margin-top: 0;flex: auto;display: flex;flex-direction: column;}
    
    .footer{overflow: hidden;margin-top: 160rem;}
    .footer-grid{display: grid;padding: 160rem 0 60rem;border-top: var(--sl) solid;grid-gap: 0 var(--gap);grid-template-columns: repeat(9, 1fr);align-items: center;grid-template-areas: 
        ". . . a1 a1 a1 . . ."
        "a2 a2 a3 a3 a3 a3 a3 a4 a4"
        "a5 a5 a5 a5 a5 a5 a5 a5 a5"
        "a6 a6 a6 a6 a6 a6 a6 a6 a6"
        "a7 a7 a7 a8 a8 a8 a9 a9 a9";
    }
    .f1{grid-area: a1;margin-bottom: 180rem;display: flex;flex-direction: column;align-items: center;}
    .f1-1{text-align: center;margin: 0 calc(-1 * var(--gap));}
    .f1-2{margin-top: 100rem;width: 100%;max-width: 380rem;}
    .f2{grid-area: a2;overflow: hidden;}
    .f2 ul{display: flex;flex-wrap: wrap;margin: 0 -12.5rem;}
    .f2 li{margin: 0 12.5rem;}
    .f3{grid-area: a3;margin: 0 auto;overflow: hidden;}
    .f4{grid-area: a4;margin-left: auto;}
    .f5{grid-area: a5;height: var(--sl);background-color: currentColor;opacity: .2;margin: 40rem 0;}
    .f6{grid-area: a6;margin-bottom: 30rem;opacity: .1;}
    .f7{grid-area: a7;color: var(--c4);}
    .f8{grid-area: a8;margin: 0 auto;color: var(--c4);text-align: center;}
    .f9{grid-area: a9;margin-left: auto;color: var(--c4);}
    
    .footer-form{display: flex;border-bottom: var(--sl) solid;align-items: center;padding-bottom: 12rem;}
    .footer-form-input{flex: auto;min-width: 0;text-overflow: ellipsis;}
    .footer-form-button{margin-left: 10rem;width: max(20px, 24rem);height: max(20px, 24rem);display: flex;align-items: center;justify-content: center;}
    
    .bottombar-author{margin-right: auto;display: flex;align-items: baseline;}
    
    .dd-icon{width: 1em;height: 1.2em;margin: 0 .3em;color: var(--c3);opacity: 1;display: inline-flex;align-items: center;justify-content: center;opacity: .4;}
    .dd-icon .icon{width: 100%;}
    
    .social{display: grid;grid-auto-flow: column;grid-gap: 25rem;}
    .social-item{display: flex;align-items: center;justify-content: center;}
    
   
    .section{position: relative;z-index: 1;overflow-x: clip;margin-top: 160rem;}
    .section:first-child{margin-top: 0;padding-top: var(--headroom-height);}
    .section:only-child{flex: auto;}
    
    .section__contrast{background-color: var(--c1);color: var(--c0);}
    .section__contrast .button__default{color: var(--c1);}
    .section__contrast .button__default::before{background-color: var(--c0);}
    
    .section__contrast + .section__contrast{margin-top: 0;padding-top: 160rem;}
    .section__contrast + .footer .footer-grid{padding-top: 0;border-top: none;}
    
    .header__contrast ~ .main .section:first-child{padding-top: 150rem;} 
    
    .rating{position: relative;width: 100rem;height: 16rem;background-repeat: repeat-x;background-size: auto 100%;background-position: left;background-image: url(../img/rating-blank.svg);}
    .rating-stars{background-repeat: repeat-x;position: absolute;background-size: auto 100%;background-position: left;top: 0;left: 0;height: 100%;background-image: url(../img/rating-colored.svg);width: calc(100% * var(--rating) / 5);}
    
    .expand{display: grid;grid-template-columns: auto;grid-gap: 30rem;}
    .expand-item{padding-bottom: 30rem;border-bottom: var(--sl) solid;}
    .expand-header{display: flex;align-items: center;user-select: none;}
    .expand-header-title{font-size: var(--f-m);line-height: normal;flex: auto;font-weight: 700;position: relative;cursor: pointer;}
    .expand-header-icon{width: 20rem;height: 20rem;flex: none;margin-left: 10rem;position: relative;display: flex;align-items: center;justify-content: center;will-change: transform;}
    .expand-content{width: 100%;max-width: 560rem;padding: 15rem 0 0rem;overflow: hidden;transition: opacity .25s;}
    
    .expand-item.active .expand-header-icon{transform: scaleY(-1);}
    .expand-item:not(.active) .expand-content{padding: 0;height: 0;opacity: 0;}
    
    .formbox{display: grid;grid-template-columns: auto;grid-gap: 12rem;}
    .formbox-row{display: flex;}
    .formbox-cell{flex: 1;}
    .formbox-cell:not(:first-child){margin-left: 12rem;}
    .formbox-footer{margin-top: 30rem;}
    
    .textfield{display: flex;overflow: hidden;}
    .textfield-input{width: 100%;text-overflow: ellipsis;resize: none;background-color: var(--c5);color: var(--c1);padding: 20rem 24rem;border-radius: var(--br1);}
    
    .marquee{overflow: hidden;}
    .marquee-container{white-space: nowrap;display: inline-flex;justify-content: flex-start;}
    .marquee-title{display: inline-flex;align-items: center;}
    .marquee-title::after{content: "";width: 40rem;height: 20rem;margin: 0 20rem;background-image: url("data:image/svg+xml,%3Csvg width='38' height='22' viewBox='0 0 38 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.795 0C13.4283 0 14.9567 0.268334 16.38 0.805001C17.8267 1.31834 19.0867 2.065 20.16 3.045C21.2567 4.025 22.1084 5.19167 22.715 6.54501C23.3217 7.87501 23.625 9.35668 23.625 10.99C23.625 12.6233 23.3217 14.1167 22.715 15.47C22.1084 16.8 21.2567 17.955 20.16 18.935C19.0867 19.915 17.8267 20.6734 16.38 21.21C14.9567 21.7234 13.4283 21.98 11.795 21.98C10.1617 21.98 8.63334 21.7234 7.21001 21.21C5.78667 20.6734 4.52667 19.915 3.43 18.935C2.35667 17.955 1.51667 16.8 0.910001 15.47C0.303334 14.1167 0 12.6233 0 10.99C0 9.35668 0.303334 7.87501 0.910001 6.54501C1.51667 5.19167 2.35667 4.025 3.43 3.045C4.52667 2.065 5.78667 1.31834 7.21001 0.805001C8.63334 0.268334 10.1617 0 11.795 0ZM11.795 20.93C13.5217 20.93 15.085 20.51 16.485 19.67C17.885 18.83 18.9934 17.6634 19.81 16.17C20.6267 14.6767 21.035 12.95 21.035 10.99C21.035 9.00668 20.6267 7.28001 19.81 5.81001C18.9934 4.31667 17.885 3.15 16.485 2.31C15.085 1.47 13.5217 1.05 11.795 1.05C10.0917 1.05 8.54001 1.47 7.14001 2.31C5.74001 3.15 4.63167 4.31667 3.815 5.81001C2.99834 7.28001 2.59 9.00668 2.59 10.99C2.59 12.95 2.99834 14.6767 3.815 16.17C4.63167 17.6634 5.74001 18.83 7.14001 19.67C8.54001 20.51 10.0917 20.93 11.795 20.93Z' fill='%23050505'/%3E%3Cpath d='M25.795 0C27.4283 0 28.9567 0.268334 30.38 0.805001C31.8267 1.31834 33.0867 2.065 34.16 3.045C35.2567 4.025 36.1084 5.19167 36.715 6.54501C37.3217 7.87501 37.625 9.35668 37.625 10.99C37.625 12.6233 37.3217 14.1167 36.715 15.47C36.1084 16.8 35.2567 17.955 34.16 18.935C33.0867 19.915 31.8267 20.6734 30.38 21.21C28.9567 21.7234 27.4283 21.98 25.795 21.98C24.1617 21.98 22.6333 21.7234 21.21 21.21C19.7867 20.6734 18.5267 19.915 17.43 18.935C16.3567 17.955 15.5167 16.8 14.91 15.47C14.3033 14.1167 14 12.6233 14 10.99C14 9.35668 14.3033 7.87501 14.91 6.54501C15.5167 5.19167 16.3567 4.025 17.43 3.045C18.5267 2.065 19.7867 1.31834 21.21 0.805001C22.6333 0.268334 24.1617 0 25.795 0ZM25.795 20.93C27.5217 20.93 29.085 20.51 30.485 19.67C31.885 18.83 32.9934 17.6634 33.81 16.17C34.6267 14.6767 35.035 12.95 35.035 10.99C35.035 9.00668 34.6267 7.28001 33.81 5.81001C32.9934 4.31667 31.885 3.15 30.485 2.31C29.085 1.47 27.5217 1.05 25.795 1.05C24.0917 1.05 22.54 1.47 21.14 2.31C19.74 3.15 18.6317 4.31667 17.815 5.81001C16.9983 7.28001 16.59 9.00668 16.59 10.99C16.59 12.95 16.9983 14.6767 17.815 16.17C18.6317 17.6634 19.74 18.83 21.14 19.67C22.54 20.51 24.0917 20.93 25.795 20.93Z' fill='%23050505'/%3E%3C/svg%3E");background-size: contain;background-repeat: no-repeat;background-position: center;}
    
    .runner-end, 
    .runner-start{animation: 40s linear infinite ticker;display: flex;will-change: transform;transition: transform .01s;}
    
    
    .mask-appear{overflow: hidden;padding: .4em 0;position: relative;z-index: 1;margin: -.2em 0;}
    .mask-appear:not(.init){visibility: hidden;}
    .mask-appear-inner{padding: .2em 0;margin: -.4em 0;transform: translateY(100%);}
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;flex-direction: column;user-select: none;}
    
    .card-1{background-color: var(--c2);padding: 40rem;color: var(--c1);}
    .card-1 .card-header{display: flex;align-items: baseline;flex-wrap: wrap;}
    .card-1 .card-title{flex: 1;margin-right: 20rem;font-weight: 600;font-size: var(--f-xs);}
    .card-1 .card-date{font-size: var(--f-xs);color: var(--c3);}
    .card-1 .card-rating{margin-top: 5rem;width: 100%;}
    .card-1 .card-content{margin-top: 20rem;max-width: 450rem;}
  
    .card-2 .card-header{position: relative;overflow: hidden;display: flex;}
    .card-2 .card-header::before{content: "";flex: none;width: 0;padding-top: 120%;}
    .card-2 .card-content{margin-top: 20rem;margin-bottom: auto;padding-right: 30rem;}
    .card-2 .card-title{font-size: var(--f-b);font-weight: 700;}
    .card-2 .card-subtitle{margin-top: 10rem;color: var(--c3);}
    .card-2 .card-footer{margin-top: 40rem;}
   
}

/* sections */

@media screen {
    
    .s1:not(.s1__alt){display: flex;align-items: flex-end;}
    
    .s1-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
    .s1-2{display: flex;flex-direction: column;align-items: center;text-align: center;margin: auto;max-width: 1050rem;width: 100%;}
    .s1-2-1{margin-bottom: 40rem;font-weight: 700;}
    .s1-2-3{margin-top: 20rem;max-width: 620rem;}
    .s1-2-4{margin-top: 20rem;}
    .s1-3{display: flex;padding: 150rem 0;position: relative;z-index: 1;}
    
    .s1__alt{padding: 0!important;}
    .s1__alt .s1-3{justify-content: center;padding: var(--headroom-height) 0;min-height: var(--app-height);}
    .s1__alt .s1-2-3{max-width: 540rem;}
    
    .s1__alt2 .s1-2{align-items: flex-start;text-align: left;margin-left: 0;max-width: 850rem;}
    
    .s2-1{display: grid;grid-template-columns: repeat(9, 1fr);grid-gap: var(--gap);}
    .s2-2{grid-column: 1/5;}
    .s2-2-2{margin-top: 20rem;max-width: 460rem;}
    .s2-2-3{margin-top: 40rem;}
    .s2-3{grid-column: 5/10;display: grid;grid-template-columns: repeat(6, 1fr);grid-gap: 40rem var(--gap);align-items: flex-start;}
    .s2-4{position: relative;z-index: 1;}
    .s2-5{position: relative;overflow: hidden;display: flex;}
    .s2-5::before{content: "";flex: none;width: 0;}
    
    .s2__alt1 .s2-1{padding-top: 315rem;}
    .s2__alt1 .s2-4:nth-child(1){grid-column: 1/5;margin-top: -115rem;}
    .s2__alt1 .s2-4:nth-child(1) .s2-5::before{padding-top: 100%;}
    .s2__alt1 .s2-4:nth-child(2){grid-column: 4/7;margin-top: -315rem;margin-left: 100rem;}
    .s2__alt1 .s2-4:nth-child(2) .s2-5::before{padding-top: 125%;}
    .s2__alt1 .s2-4:nth-child(3){grid-column: 4/7;margin-top: 195rem;margin-left: 100rem;}
    .s2__alt1 .s2-4:nth-child(3) .s2-5::before{padding-top: 100%;}
    
    .s2__alt2 .s2-1{padding-top: 180rem;}
    .s2__alt2 .s2-4:nth-child(1){grid-column: 1/5;padding: 0 40rem 0 0;}
    .s2__alt2 .s2-4:nth-child(1) .s2-5::before{padding-top: 65%;}
    .s2__alt2 .s2-4:nth-child(2){grid-column: 4/6;margin-top: 220rem;}
    .s2__alt2 .s2-4:nth-child(2) .s2-5::before{padding-top: 125%;}
    .s2__alt2 .s2-4:nth-child(3){grid-column: 5/7;margin-top: -180rem;}
    .s2__alt2 .s2-4:nth-child(3) .s2-5::before{padding-top: 150%;}
    
    .s2__alt3 .s2-1{padding-top: 255rem;}
    .s2__alt3 .s2-4:nth-child(1){grid-column: 2/4;margin-top: -215rem;}
    .s2__alt3 .s2-4:nth-child(1) .s2-5::before{padding-top: 105%;}
    .s2__alt3 .s2-4:nth-child(2){grid-column: 4/7;margin-top: -255rem;margin-left: 100rem;}
    .s2__alt3 .s2-4:nth-child(2) .s2-5::before{padding-top: 125%;}
    .s2__alt3 .s2-4:nth-child(3){grid-column: 1/6;margin-top: 40rem;margin-right: 100rem;}
    .s2__alt3 .s2-4:nth-child(3) .s2-5::before{padding-top: 65%;}
    .s2__alt3 .s2-4:nth-child(4){grid-column: 4/6;margin-top: 310rem;}
    .s2__alt3 .s2-4:nth-child(4) .s2-5::before{padding-top: 105%;}
    
    
    .s3-1{display: grid;grid-template-columns: repeat(9, 1fr);grid-gap: var(--gap);}
    .s3-2{grid-column: 1/5;padding: 100rem var(--wr) 100rem 0;display: flex;}
    .s3-3{grid-column: 5/10;margin-right: var(--awr);display: grid;grid-template-columns: 1fr 1fr;grid-gap: 0;counter-reset: index;margin-left: -50rem;}
    .s3-4{display: flex;flex-direction: column;align-items: center;text-align: center;width: 100%;margin: auto;}
    .s3-4-2{margin-top: 20rem;max-width: 340rem;}
    .s3-4-3{margin-top: 40rem;}
    .s3-5{border-left: var(--sl) solid;position: relative;display: flex;padding: 50rem var(--wr) 50rem 50rem;}
    .s3-5::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s3-5:nth-child(n + 3){border-top: var(--sl) solid;}
    .s3-6{display: flex;flex-direction: column;}
    .s3-6::before{content: counter(index, decimal-leading-zero);counter-increment: index;font-size: var(--f-n);font-family: 'Cormorant Garamond', serif;text-transform: uppercase;font-weight: 400;letter-spacing: -.03em;line-height: .85;margin-bottom: 40rem;}
    .s3-6-1{font-weight: 700;font-size: var(--f-b);}
    .s3-6-2{margin: 25rem 0 auto;}
    .s3-6-3{margin-top: 50rem;}
    .s3-6-3 a{font-weight: 700;text-decoration: underline;}
    
    .s4-1{display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: 30rem var(--gap);grid-template-rows: auto 1fr;grid-template-areas: "a1 a2 a3" "a1 a4 a3";}
    .s4-2{grid-area: a1;position: relative;overflow: hidden;display: flex;}
    .s4-2::before{content: "";flex: none;width: 0;padding-top: 100%;}
    .s4-3{grid-area: a2;display: flex;flex-direction: column;}
    .s4-3-2{margin-top: 40rem;}
    .s4-4{grid-area: a3;display: grid;grid-template-columns: auto;grid-gap: var(--gap);}
    .s4-5{}
    .s4-6{grid-area: a4;position: relative;overflow: hidden;display: flex;}
    .s4-6::before{content: "";flex: none;width: 0;padding-top: 120%;}
    
    .s5-2-2{max-width: 510rem;margin-top: 40rem;}
    .s5-3{margin-top: 60rem;display: grid;grid-template-columns: 1fr 1fr;grid-gap: 45rem;}
    
    .s6{padding: 80rem 0 100rem;}
    .s6-1{display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));grid-gap: var(--gap);}
    .s6-2{padding-right: 40rem;}
    .s6-3{position: relative;overflow: hidden;display: flex;}
    .s6-3::before{content: "";flex: none;width: 0;padding-top: 120%;}
    .s6-4{background-color: var(--c0);color: var(--c1);border-radius: var(--br1);overflow: hidden;padding: 30rem;}
    
    .s7-1{text-align: center;}
    .s7-2{margin-top: 60rem;display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: var(--gap);}
    
    .s8-1{padding: 150rem 0 100rem;}
    .s8-3{display: grid;grid-template-columns: repeat(9, 1fr);grid-gap: var(--gap);}
    .s8-4{grid-column: 1/5;padding: 60rem 0;display: flex;flex-direction: column;}
    .s8-5{grid-column: 6/10;padding: 60rem 0;border-left: var(--sl) solid;padding-left: 90rem;margin-left: -90rem;}
    .s8-5-1{font-weight: 700;margin-bottom: 60rem;}
    .s8-6{display: grid;grid-template-columns: auto;grid-gap: 60rem;margin-bottom: auto;}
    .s8-7{}
    .s8-7-1{margin-bottom: 10rem;font-weight: 700;}
    .s8-7-2{font-size: var(--f-b);}
    .s8-8{margin-top: 60rem;}
    .s8-8 .expand-item{padding-bottom: 0;border: none;}
    .s8-8 .expand-header-title{flex: initial;font-size: var(--f-d);}
    
    .s9-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 45rem;align-items: flex-start;}

    .s404{}
    .s404-1{position: relative;display: flex;align-items: center;justify-content: center;}
    .s404-3{text-align: center;position: relative;z-index: 2;font-size: 430rem;line-height: 1;font-family: 'Cormorant Garamond', serif;text-transform: uppercase;font-weight: 400;letter-spacing: -.03em;padding: 0 50rem;background-color: var(--c0);}
    .s404-3_::before,
    .s404-3_::after{content: "";position: absolute;top: 0;width: 150rem;height: 100%;}
    .s404-3_::before{right: 100%;background-image: linear-gradient(to right, rgba(0,0,0,0), var(--c0));}
    .s404-3_::after{left: 100%;background-image: linear-gradient(to left, rgba(0,0,0,0), var(--c0));}
    .s404-4{position: absolute;width: 100vw;display: flex;align-items: center;top: 80%;z-index: 1;height: 0;}
    .s404-4-1{flex: none;}
    .s404-2{margin-top: 60rem;display: flex;justify-content: center;}
   
}

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


        --wr: 15rem;
        
        --gap: 10rem;

        --f-xs: 12rem;
        --f-s: 12rem;
        --f-d: 14rem;
        --f-m: 16rem;
        --f-b: 20rem;
        --f-l: 32rem;
        --f-xl: 40rem;
        --f-n: 96rem;

        --mw: 680rem; 

    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
    
    .button__default{height: 44rem;padding: 0 35rem;}
    
    .title br{display: none;}
    
    .header{}
    
    .topbar{padding: 20rem 0;grid-template-columns: 1fr auto;grid-gap: 50rem;}
    .topbar-logo{max-width: 135rem;}
    .topbar-nav{display: none;}
    .topbar-menu{display: flex;align-items: center;justify-content: center;width: 24rem;height: 16rem;}
    
    .expand{grid-gap: 20rem;}
    .expand-item{padding-bottom: 20rem;}
    
    .footer{margin-top: 80rem;}
    .footer-grid{grid-template-columns: repeat(4, 1fr);grid-gap: 0 var(--gap);grid-template-areas: "a1 a1 a1 a1" "a3 a3 a3 a3" "a4 a4 a2 a2" "a5 a5 a5 a5" "a7 a7 a7 a8" "a6 a6 a6 a6" "a9 a9 a9 a9";align-items: flex-start;padding: 80rem 0 20rem;}
    .f1{margin-bottom: 80rem;}
    .f1-2{margin-top: 40rem;}
    .f2 ul{margin: 0;display: grid;grid-template-columns: auto;grid-gap: 15rem;}
    .f2 li{margin: 0;}
    .f3{margin: 0 0 40rem;}
    .f3 ul{margin: 0;column-count: 2;column-gap: var(--gap);}
    .f3 li:not(:first-child){margin-top: 15rem;}
    .f4{margin: 0 auto 0 0;}
    .f5{margin: 80rem 0 20rem;}
    .f6{margin: 10rem 0 20rem;}
    .f9{margin: 0;}
    
    .footer .social{grid-gap: 12rem;}
    .footer .social-item{width: 22rem;height: 22rem;}
    
    .formbox{grid-gap: 5rem;}
    .formbox-row{flex-direction: column;}
    .formbox-cell:not(:first-child){margin: 5rem 0 0;}
    .formbox-footer{margin-top: 40rem;}
    
    .textfield-input{padding: 15rem;}
    
    .marquee-title::after{margin: 0 10rem;width: 20rem;height: 1em;}
    
    .card-1{padding: 20rem;}
    .card-1 .card-content{margin-top: 10rem;}
    
    .card-2 .card-header::before{padding-top: 100%;}
    .card-2 .card-content{padding: 0;}
    .card-2 .card-footer{margin-top: 20rem;}
    
    .section{margin-top: 80rem;}
    .section__contrast + .section__contrast{padding-top: 80rem;}
    
    .header__contrast ~ .main .section:first-child{padding-top: 80rem;}
    
    .s1:not(.s1__alt){padding: 0!important;}
    .s1:not(.s1__alt) .s1-2,
    .s1__alt2 .s1-2{justify-content: flex-end;margin: 0;max-width: none;text-align: center;align-items: center;}
    .s1:not(.s1__alt) .s1-3,
    .s1__alt2 .s1-3{padding: 0;min-height: var(--app-height);padding: var(--headroom-height) 0 30rem;justify-content: center;}
  
    .s1-2-1,
    .s1-2-3{max-width: 280rem!important;}
    .s1-2-1{margin-bottom: 20rem;}
    
    .s2 .s2-1{grid-template-columns: auto;padding: 0;grid-gap: 40rem;}
    .s2-2{grid-column: 1/-1;display: flex;flex-direction: column;align-items: center;text-align: center;}
    .s2-2-2{max-width: 310rem;}
    .s2-2-3{margin-top: 20rem;}
    .s2-3{grid-column: 1/-1;grid-template-columns: repeat(4, 1fr);grid-gap: 0 var(--gap);}
    
    .s2 .s2-4:nth-child(odd),
    .s2 .s2-4:nth-child(even){margin: 0;grid-column: auto;padding: 0;}
    
    .s2 .s2-4:nth-child(1){order: 1;grid-column: 1/-1;}
    .s2 .s2-4:nth-child(2){grid-column: 1/3;margin-top: auto;margin-left: -20rem;margin-right: 20rem;margin-bottom: -25rem;z-index: 2;}
    .s2 .s2-4:nth-child(3){grid-column: 3/5;margin-right: -30rem;margin-left: 10rem;margin-bottom: 40rem;}
    .s2 .s2-4:nth-child(4){grid-column: 3/5;order: 2;margin-right: -30rem;margin-left: 10rem;margin-top: -25rem;}
    
    .s2 .s2-4:nth-child(1) .s2-5::before{padding-top: 65%;}
    .s2 .s2-4:nth-child(2) .s2-5::before{padding-top: 125%;}
    .s2 .s2-4:nth-child(3) .s2-5::before{padding-top: 150%;}
    .s2 .s2-4:nth-child(4) .s2-5::before{padding-top: 100%;}
    
    .s3-1{grid-template-columns: auto;grid-gap: 40rem;}
    .s3-2{grid-column: 1/-1;margin: 0;padding: 80rem 0 0;}
    .s3-4-2{max-width: 240rem;}
    .s3-4-3{margin-top: 20rem;}
    .s3-3{grid-column: 1/-1;margin: 0 var(--awr);padding: 0;grid-template-columns: auto;}
    .s3-5{padding: 0 var(--wr);}
    .s3-5:nth-child(n + 1){border-top: var(--sl) solid;border-left: none;}
    .s3-5::before{display: none;}
    .s3-5__alt{order: 1;padding: 0;}
    .s3-6{padding: 20rem 25rem 40rem;}
    .s3-6::before{margin-bottom: 40rem;}
    .s3-6-2{margin-top: 20rem;}
    .s3-6-3{margin-top: 40rem;}
    
    .s4-1{grid-template-columns: auto;grid-gap: 0;grid-template-rows: auto;grid-template-areas: "a2" "a3" "a1" "a4";}
    .s4-2{margin: 40rem var(--awr) 0;}
    .s4-2::before{padding-top: 150%;}
    .s4-3{display: flex;flex-direction: column;align-items: center;text-align: center;}
    .s4-3-2{margin-top: 20rem;}
    .s4-4{margin: 40rem var(--awr) 0;overflow: auto;padding: 0 var(--wr);grid-auto-flow: column;overflow: -moz-scrollbars-none!important;scrollbar-width: none;}
    .s4-4::-webkit-scrollbar{display: none;}
    .s4-5{width: 280rem;}
    .s4-6{margin: -30rem 55rem 0;}
    
    .s5-2{display: flex;flex-direction: column;align-items: center;text-align: center;}
    .s5-2-2{margin-top: 20rem;max-width: 320rem;}
    .s5-3{margin-top: 40rem;grid-template-columns: auto;grid-gap: 20rem;}
    
    .s6{padding: 80rem 0 0;}
    .s6-1{grid-template-columns: auto;grid-gap: 40rem;}
    .s6-2{text-align: center;padding: 0;}
    .s6-3{order: 1;margin: 0 var(--awr);}
    
    .s7-2{margin-top: 40rem;grid-template-columns: auto;grid-gap: 40rem;}
    
    .s8-1{padding: 80rem 0;}
    .s8-3{grid-template-columns: auto;grid-gap: 80rem;margin-top: 40rem;}
    .s8-4{padding: 0;grid-column: 1/-1;}
    .s8-5{padding: 80rem 0 0;grid-column: 1/-1;margin: 0;border-left: none;border-top: var(--sl) solid;}
    .s8-6{grid-gap: 40rem;}
    .s8-8{margin-top: 40rem;}
    
    .s9-1{grid-template-columns: auto;grid-gap: 40rem;}
    
    .s404-1{flex-direction: column;}
    .s404-3{font-size: 225rem;padding: 0;}
    .s404-4{height: auto;top: auto;position: relative;margin-top: 20rem;}
    
    .popup{position: fixed;top: 0;left: 0;right: 0;bottom: 0;overflow: auto;background-color: var(--c0);color: var(--c1);display: flex;z-index: 999;transition: all .25s;}
    .popup-inner{display: flex;flex-direction: column;padding: 20rem var(--wr) 80rem;width: 100%;}
    .popup-header{display: grid;grid-template-columns: 1fr auto;align-items: center;grid-gap: 50rem;}
    .popup-header-logo{max-width: 135rem;}
    .popup-header-close{display: flex;align-items: center;justify-content: center;width: 24rem;height: 16rem;}
    .popup-content{flex: auto;padding: 40rem 0;display: flex;}
    .popup-content ul{display: grid;grid-template-columns: auto;grid-gap: 40rem;text-align: center;margin: auto;font-weight: 700;font-size: var(--f-m);}
    .popup-footer{display: flex;justify-content: center;}
    
    .popup:not(.active){opacity: 0;visibility: hidden;}
    
}


@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
    
    .social-item{width: max(36px, 40rem);height: max(36px, 40rem);padding: 8rem;}
    
    .f2,
    .f3{padding: .1em 0;}
    
    .f3 ul{display: flex;flex-wrap: wrap;margin: 0 -12.5rem;}
    .f3 li{margin: 0 12.5rem;}
    
    .s1:not(.s1__alt){aspect-ratio: 1/.85;}
    
    .s2-4{grid-row: 1/2;}
    
}

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

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
   
    .lbu{background-size: 0 var(--sl);background-repeat: no-repeat;background-position: right bottom;background-image: linear-gradient(currentColor, currentColor);display: inline;transition: background-size .5s cubic-bezier(0.2, 1, 0.3, 1), color .5s;}
    
    .lbu:hover{background-size: 100% var(--sl);background-position: left bottom;}
    
    .social-item{transition: all .25s;}
    .social-item:hover{background-color: var(--c1);color: var(--c0);}
    
    .button::before{transition: transform .5s;will-change: transform;}
    
    .button__default:hover::before{transform: scale(1.05);}
    
    .f8 a:hover,
    .f9 a:hover{color: var(--c1);}
    
    .f6{transition: opacity .5s;}
    .f6:hover{opacity: 1;}
    
    .card-2 .card-header,
    .s2-5{transition: filter .25s;}
    
    .card-2:not(:hover) .card-header,
    .s2-5:not(:hover){filter: grayscale(1);}
    
}