@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: #F8F6F3; 
    --c1: #0F2335;
    --c2: #85361B;
    --c3: #FFFFFF;
    --c4: #000000;
    
    --c5: color-mix(in srgb, currentColor 50%, transparent);
    --c6: #F3EFE7;
    --c7: color-mix(in srgb, currentColor 10%, transparent);
    
    --wr: 25rem;
    --awr: calc(-1 * var(--wr));
    
    --gap: 25rem;
    --sl: max(1px, 1rem);
    
    --br1: 4rem;
    
    --btn: max(52px, 60rem);
    --brd: currentColor;
    
    --cols: repeat(6, minmax(0, 1fr));

    --altfont: 'Apris', 'serif';
    
    --f-s: max(14px, 14rem);
    --f-d: max(14px, 16rem);
    --f-m: max(14px, 20rem);
    --f-b: max(14px, 32rem);
    --f-l: max(14px, 40rem);
    --f-xl: max(14px, 64rem);
    
    --mw: 1920000px; 
    
    
}


/* globals */

@media screen {

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

    .document{font-weight: 400;font-family: 'Onest', sans-serif;font-size: var(--f-d);line-height: 1.8;color: var(--c1);background-color: var(--c6);letter-spacing: .01em;}
    
    .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;}
    
    .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;}
    .button:not(.fill){}
    .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__default{border: var(--sl) solid var(--brd);border-radius: var(--br1);height: var(--btn);padding: 0 50rem;}
    .button__default .button-text{font-size: var(--f-s);font-weight: 600;text-transform: uppercase;letter-spacing: .04em;}
    .button__secondary{background-color: var(--c1);color: var(--c0);border-radius: var(--br1);height: var(--btn);padding: 0 50rem;}
    .button__secondary .button-text{font-size: var(--f-s);font-weight: 600;text-transform: uppercase;letter-spacing: .04em;}
    
    .button__secondary.button__contrast{background-color: var(--c0);color: var(--c1);}
    
    .button__wide{width: 100%;}
     
    .altfont,
    .textfit,
    .title{font-family: var(--altfont);font-weight: 400;line-height: 1.2;letter-spacing: .02em;}
    
    .upc{font-weight: 600;text-transform: uppercase;letter-spacing: .04em;line-height: 1.4;}
    
    .subtitle{font-weight: 600;text-transform: uppercase;letter-spacing: .04em;line-height: 1.4;color: var(--c5);}
    
    .title{width: 100%;}
    .title__medium{font-size: var(--f-l);}
    .title__default{font-size: var(--f-xl);}
    
    .container{display: flex;flex-direction: column;min-height: var(--app-height);}
    
    .header{position: sticky;top: calc(-1 * var(--headroom-height));z-index: 10;height: 0;display: flex;align-items: flex-start;}
    .topbar{display: grid;grid-template-columns: 1fr auto 1fr;grid-gap: 50rem;align-items: center;padding: 15rem 0 30rem;flex: none;width: 100%;color: var(--c3);}
    .topbar-menu{width: 60rem;height: 60rem;display: flex;align-items: center;cursor: pointer;}
    .topbar-menu-inner{position: relative;width: 100%;height: var(--sl);}
    .topbar-menu-inner::before,
    .topbar-menu-inner::after{content: "";height: 100%;width: 100%;position: absolute;background-color: currentColor;left: 0;}
    .topbar-menu-inner::before{bottom: 5rem;}
    .topbar-menu-inner::after{top: 5rem;}
    .topbar-logo{max-width: 60rem;}
    .topbar-action{margin-left: auto;font-size: var(--f-m);letter-spacing: .02em;text-transform: uppercase;}
    
    .main{margin-top: 0;flex: auto;display: flex;flex-direction: column;overflow-x: clip;}
   
    .section{position: relative;z-index: 1;padding-top: 180rem;}
    .section:first-child{padding-top: 0;}
    .section:only-child{flex: auto;}
    
    .section__contrast{background-color: var(--c1);color: var(--c3);padding: 180rem 0;margin-top: 180rem;--brd: var(--c7);}
    
    .section-header{display: flex;flex-direction: column;}
    
    .footer{overflow: hidden;margin-top: 0;background-color: var(--c1);color: var(--c0);padding: 150rem 0 30rem;--brd: var(--c7);}
    .footer-grid{display: grid;grid-template-columns: var(--cols);grid-gap: 0 var(--gap);align-items: flex-start;}
    .f1{grid-area: f1;display: grid;grid-template-columns: auto;grid-gap: 50rem;}
    .f1-2{margin-bottom: 20rem;}
    .f1-3{font-size: var(--f-m);text-transform: uppercase;}
    .f2{grid-area: f2;}
    .f2-1{margin-bottom: 20rem;}
    .f3{grid-area: f3;margin-left: auto;}
    .f3-1{margin-bottom: 20rem;}
    .f4{grid-area: f4;margin: 250rem 0 20rem;}
    .f5{grid-area: f5;color: var(--c5);}
    .f6{grid-area: f6;color: var(--c5);}
    .f7{grid-area: f7;color: var(--c5);margin-left: auto;}
    
    .textfit{display: block;width: 100%;text-transform: uppercase;line-height: 1;}
    
    .carousel-buttons{display: inline-grid;grid-auto-flow: column;grid-gap: 15rem;}
    .carousel-button{display: flex;align-items: center;justify-content: center;position: relative;width: var(--btn);height: var(--btn);padding: 15rem;cursor: pointer;border: var(--sl) solid var(--c7);border-radius: var(--br1);}
    
    .formbox{display: grid;grid-template-columns: auto;grid-gap: var(--gap);}
    .formbox-row{display: flex;}
    .formbox-cell{flex: 1;}
    .formbox-cell:not(:first-child){margin-left: var(--gap);}
    
    .formbox-footer{margin-top: 40rem;}
    
    .textfield{border-bottom: var(--sl) solid var(--brd);}
    .textfield-input{font-size: var(--f-s);letter-spacing: .04em;text-transform: uppercase;font-weight: 600;padding: 20rem 25rem;width: 100%;text-overflow: ellipsis;}
    
    .social{display: inline-grid;grid-auto-flow: column;grid-gap: 15rem;}
    .social-item{display: flex;align-items: center;justify-content: center;position: relative;width: var(--btn);height: var(--btn);padding: 18rem;cursor: pointer;border: var(--sl) solid var(--c7);border-radius: var(--br1);}
    
}

/* cards */

@media screen {
   
    .card{position: relative;overflow: hidden;display: flex;min-height: 100%;flex-direction: column;user-select: none;}
  
   
}

/* sections */

@media screen {
    
    .s1{padding: 0;margin: 0;}
    .s1-1{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
    .s1-1::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;background-color: var(--c4);opacity: .3;}
    .s1-2{min-height: var(--app-height);display: flex;flex-direction: column;position: relative;z-index: 1;padding: var(--headroom-height) 0 40rem;}
    .s1-3{width: 100%;margin-bottom: auto;}
    .s1-4{margin-top: 50rem;display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);align-items: flex-end;}
    .s1-5{display: flex;flex-direction: column;align-items: center;text-align: center;grid-column: 3/5;}
    .s1-5-1{margin-bottom: 60rem;font-size: var(--f-b);text-transform: uppercase;}
    .s1-5-2{margin-bottom: 1em;color: var(--c0);font-size: var(--f-s);}
    .s1-5-3{font-size: var(--f-b);}
    .s1-6{grid-column: 5/7;}
    
    .s2{margin: 0;}
    .s2-1{display: grid;grid-template-columns: var(--cols);grid-gap: var(--gap);}
    .s2-2{grid-column: 2/6;display: flex;flex-direction: column;align-items: center;}
    .s2-3{font-size: var(--f-l);text-align: center;color: var(--c0);}
    .s2-4{margin-top: 40rem;display: inline-grid;grid-template-columns: auto 1fr;grid-gap: 25rem 20rem;}
    .s2-4-1{position: relative;overflow: hidden;border-radius: 50%;display: flex;grid-column: 1/2;grid-row: 1/3;width: 160rem;height: 160rem;}
    .s2-4-2{padding-top: 10rem;}
    .s2-4-2::before{content: "\2014\a0";}
    .s2-4-3{width: 160rem;margin-left: -20rem;}
    
    .s3-1{display: grid;grid-template-columns: var(--cols);grid-gap: 0 var(--gap);position: relative;z-index: 1;}
    .s3-2{grid-column: 1/5;margin-bottom: 100rem;display: grid;grid-template-columns: 1fr 1fr;grid-gap: 0;align-items: flex-start;}
    .s3-2-1{display: flex;width: 100%;position: relative;overflow: hidden;}
    .s3-2-1::before{content: "";flex: none;width: 0;}
    .s3-2-1:nth-child(1){width: 55%;grid-column: 1/-1;margin-left: 200rem;}
    .s3-2-1:nth-child(1)::before{padding-top: 60%;}
    .s3-2-1:nth-child(2){width: 60%;margin-top: -70rem;}
    .s3-2-1:nth-child(2)::before{padding-top: 125%;}
    .s3-2-1:nth-child(3){width: 90%;margin-top: -50rem;}
    .s3-2-1:nth-child(3)::before{padding-top: 60%;}
    .s3-3{grid-column: 1/5;margin-bottom: 50rem;padding-right: 50rem;}
    .s3-3-1{margin-bottom: 25rem;}
    .s3-3-2{text-transform: uppercase;}
    .s3-3-3{margin-top: 50rem;max-width: 675rem;}
    .s3-4{grid-column: 1/5;}
    .s3-5{grid-column: 5/7;display: grid;grid-template-columns: auto;grid-gap: 25rem;}
    .s3-6{grid-column: 1/-1;position: absolute;top: 0;right: 0;width: 100%;height: 100%;z-index: -1;}
    .s3-6-1{position: absolute;top: 50%;right: 0;left: 0;margin: 0 var(--awr);height: 100%;max-height: 1100rem;transform: translateY(-50%);}
    .s3-6-1 img{object-position: right;}
    .s3-7{display: grid;grid-template-columns: 1fr auto;grid-gap: 50rem;align-items: baseline;padding-top: 25rem;border-top: var(--sl) solid var(--c5);}
    
    .s4{padding: 0;}
    .s4-1{margin: 0 var(--awr);display: flex;position: relative;padding: 0 var(--wr);}
    .s4-1::before{content: "";flex: none;width: 0;padding-top: 72.5%;}
    .s4-2{position: relative;z-index: 1;width: 100%;display: grid;grid-template-rows: 1fr 1fr;grid-gap: 0;color: var(--c0);}
    .s4-3{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;pointer-events: none;}
    .s4-3::after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 15%;background-image: linear-gradient(var(--c6), rgba(0,0,0,0));z-index: 1;}
    .s4-3-1{position: absolute;bottom: 0;left: 0;width: 100%;height: 100%;z-index: 1;}
    .s4-3-1 img{object-position: bottom;}
    .s4-3-2{position: absolute;bottom: 63%;left: 0;z-index: 1;right: 0;margin: 0 var(--wr);color: var(--c3);}
    .s4-3-3{position: absolute;bottom: 0;left: 0;width: 100%;height: 80%;z-index: 1;}
    .s4-3-3 img{object-position: bottom;}
    .s4-4{grid-row: 2/3;padding-bottom: 25rem;display: grid;grid-template-columns: var(--cols);grid-gap: 50rem var(--gap);grid-template-rows: 1fr auto;align-items: flex-end;}
    .s4-5{grid-column: 4/6;max-width: 365rem;position: relative;padding: 25rem 0;}
    .s4-5::before{content: "";position: absolute;width: var(--sl);background-color: currentColor;height: 100%;top: 0;right: 100%;margin-right: var(--gap);opacity: .3;}
    .s4-5-2{margin-top: 50rem;}
    .s4-6{grid-column: 1/3;text-transform: uppercase;}
    .s4-7{grid-column: 5/7;position: relative;padding: 10rem 0;}
    .s4-7::before{content: "";position: absolute;width: var(--sl);background-color: currentColor;height: 100%;top: 0;right: 100%;margin-right: var(--gap);opacity: .3;}
    .s4-7-1{margin-bottom: 10rem;}
    .s4-7-2{text-transform: uppercase;}
    
    .s5-1{display: grid;grid-template-columns: auto;grid-gap: 180rem;}
    .s5-2{display: grid;grid-template-columns: 1fr 1fr;grid-gap: 65rem var(--gap);align-items: flex-start;}
    .s5-3{max-width: 565rem;}
    .s5-3-1{margin-bottom: 15rem;}
    .s5-4{display: flex;position: relative;overflow: hidden;}
    .s5-4::before{content: "";flex: none;width: 0;padding-top: 85%;}
    .s5-5{display: flex;position: relative;overflow: hidden;margin-right: 130rem;}
    .s5-5::before{content: "";flex: none;width: 0;padding-top: 65%;}
    .s5-6{max-width: 420rem;}
    
    .s6-1{margin-bottom: 160rem;}
    .s6-2{display: grid;grid-template-columns: auto;grid-gap: 160rem;}
    .s6-3{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);align-items: flex-start;}
    .s6-4{background-color: var(--c2);color: var(--c3);display: flex;max-width: 340rem;margin: 0 auto;}
    .s6-4::before{content: "";flex: none;width: 0;padding-top: 100%;min-height: 400rem;}
    .s6-5{display: flex;overflow: hidden;position: relative;}
    .s6-5::before{content: "";flex: none;width: 0;padding-top: 80%;}
    .s6-6{display: flex;flex-direction: column;padding: 25rem 25rem 25rem 25rem;}
    .s6-6-1{margin-bottom: auto;}
    .s6-6-2{margin-top: 40rem;}
    
    .s7-1{position: relative;overflow: hidden;margin: 0 var(--awr);display: flex;}
    .s7-1::before{content: "";flex: none;width: 0;padding-top: 50%;}
    
    .s8-1{display: flex;flex-direction: column;align-items: center;text-align: center;}
    .s8-1-1{margin-bottom: 15rem;}
    .s8-1-2{text-transform: uppercase;}
    .s8-2{display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));grid-gap: 0;}
    .s8-2:not(:first-child){margin-top: 65rem;}
    .s8-2 .swiper{overflow: visible;margin: 0;}
    .s8-2 .swiper-slide{padding: 0 calc(var(--gap) / 2);}
    .s8-3{margin-top: 40rem;display: flex;justify-content: center;}
    .s8-4{position: relative;overflow: hidden;width: 100%;display: flex;}
    .s8-4::before{content: "";flex: none;width: 0;padding-top: 90%;}
    .s8-5{grid-column: 2/4;}
    
    .s9{padding: 0;}
    .s9-1{display: grid;grid-template-columns: 1fr 1fr;grid-gap: var(--gap);}
    .s9-2{padding: 80rem 0 40rem;}
    .s9-3{margin-right: var(--awr);position: relative;overflow: hidden;}
    .s9-4-1{margin-bottom: 15rem;}
    .s9-4-2{text-transform: uppercase;}
    .s9-5{margin-top: 50rem;}
    
   
}

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

        
    }
    
    html{font-size: 1px;}
    
    .desktop{display: none!important;}
  
    
}


@media screen and (min-width: 1024px) {
    
    .mobile{display: none!important;}
    
    .footer-grid{grid-template-areas: 
        "f1 f1 . f2 f3 f3"
        "f4 f4 f4 f4 f4 f4"
        "f5 f5 . f6 . f7";
    }
    
    .s6-3:nth-child(odd){align-items: flex-end;}
    .s6-3:nth-child(odd) .s6-5{margin-bottom: 80rem;margin-left: auto;width: 80%;}
    .s6-3:nth-child(even) .s6-4{order: 1;}
    .s6-3:nth-child(even) .s6-5{margin-top: 80rem;width: 90%;}
    
    .s6-3:nth-child(4n + 3) .s6-5{margin-top: -150rem;}
    .s6-3:nth-child(4n + 3) .s6-5::before{padding-top: 115%;}
    .s6-3:nth-child(4n + 4){align-items: flex-end;}
    .s6-3:nth-child(4n + 4) .s6-5{margin-bottom: 80rem;}
    
    .s8-4{transform: scale(.5);transition: transform .5s;transform-origin: top right;}
    .s8-5 .swiper-slide-active .s8-4{transform: scale(1);transform-origin: bottom left;}
    .s8-5 .swiper-slide-active ~ .swiper-slide .s8-4{transform-origin: bottom left;}
    
    
    
    
}

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

/* hover animations */

@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
   
    
}