*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Formular", sans-serif;
}

a, p, h1, h2, h3, h4, h5, h6, li {
    color: #FFFFFF;
}

a{
    text-decoration: none;
}

ul {
    list-style: none;
}

html{
    scroll-behavior: smooth;
    height: 100%;
}

body{
    background: #1c1c1c;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 100vh;
    min-height: 100dvh;
    -webkit-overflow-scrolling: touch;
}

.container{
    max-width: 1410px;
    width: 100%;
}

section{
    position: relative;
    overflow: hidden;
}

.big-border{
    border: 1px solid #fff;
    border-radius: 29px;
}

.expand-btn {
    display: none;
}

.mobile-slider-wrapper {
    display: none;
}


header {
    position: sticky;
    top: 20px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 2px 2px 2px 16px;
    z-index: 9999;

    & .header-content{
        display: flex;
        justify-content: space-between;
        width: 62.5%;
        min-width: 0;

        & > div{
            display: flex;
            min-width: 0;
        }

        & .mobile {
            display: none;

            &.active{
                display: flex;
            }
        }
    }

    & .logo{
        display: flex;
    }

    & .open-header{
        display: flex;
        align-items: center;

        & p{
            font-size: 16px;
            line-height: 13px;
            text-transform: uppercase;
            color: #FFFFFF;
        }

        &:has(.burger-menu.active) p{
            color: rgba(255, 255, 255, 0.2);
        }

        .burger-menu {
            display: flex;
            flex-direction: column;
            gap: 6px;
            cursor: pointer;
            padding: 10px;
            background: transparent;
            border: none;
            position: relative;
            width: 44px;
            height: 44px;
            justify-content: center;
            align-items: center;

            & span {
                width: 24px;
                height: 2px;
                background-color: #fff;
                transition: all 0.3s ease;
                display: block;
                position: absolute;
            }

            & span:nth-child(1) {
                top: 12px;
            }

            & span:nth-child(2) {
                top: 21px;
            }

            & span:nth-child(3) {
                top: 30px;
            }

            &.active{
                gap: 5px;
                & span{
                    background-color: #A5D060;
                }
            }
        }

        .burger-menu.active span:nth-child(1) {
            top: 21px;
            transform: rotate(45deg);
        }

        .burger-menu.active span:nth-child(2) {
            opacity: 0;
        }

        .burger-menu.active span:nth-child(3) {
            top: 21px;
            transform: rotate(-45deg);
        }
    }
}

.mobile {
    display: none !important;
}

.mobile-slider {
    display: none;
}

.mobile-slider-dots {
    display: none;
}


.catalog-btn {
    background-color: #363636;
    color: #fff;
    border: none;
    padding: 10.5px 24px;
    border-radius: 50px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    text-transform: uppercase;
}

.menu-icon {
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 18px;
}

.menu-icon span {
    width: 100%;
    height: 2px;
    background-color: #fff;
    display: block;
    border-radius: 2px;
}

.portfolio-btn {
    background-color: #9F75EB;
    color: #1C1C1C;
    text-decoration: none;
    padding: 10.5px 24px;
    border-radius: 50px;
    font-size: 18px;
    text-transform: uppercase;
    transition: background-color 0.3s;
}

.portfolio-btn:hover {
    background-color: #7c3aed;
}

.lang-switcher {
    display: flex;
    border-radius: 50px;
}

.lang-btn {
    background-color: #363636;
    color: #fff;
    border: none;
    padding: 10px 9px;
    border-radius: 50px;
    cursor: pointer;
    font-size: 18px;
}

.lang-btn.active {
    background-color: #A5D060;
    color: #000;
}

.contact-btn {
    display: flex;
    cursor: pointer;

    & p{
        background-color: #9F75EB;
        color: #000;
        text-decoration: none;
        padding: 10.5px 24px;
        border-radius: 50px;
        font-size: 18px;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    &:after{
        content: url("images/arrow.svg");
        width: 43px;
        height: 39px;
        border-radius: 50px;
        background-color: #9F75EB;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-top: 4px;
    }
}

.arrow-icon {
    font-size: 18px;
    line-height: 1;
}

.hero{
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding-top: 23px;

    & .hero-cards{
        display: flex;
        gap: 18px;

        & .card {
            border-radius: 20px;
            overflow: hidden;
            position: relative;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            min-height: 530px;;
            padding: 0 12px 40px;
          width: calc(25% - 13px);

            &:hover > img{
                filter: grayscale(0);
            }

            & > img{
                position: absolute;
                object-fit: cover;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                z-index: -1;
                filter: grayscale(1);
                transition: .1s linear;
            }

            & .card-content{
                display: flex;
                flex-direction: column;
                gap: 11px;

                & .card-tag{
                    font-weight: bold;
                    font-size: 48px;
                    color: #a5d060;
                    text-transform: uppercase;
                }

                & .card-title{
                    font-weight: bold;
                    font-size: 20px;
                    line-height: 20px;
                    color: #ffffff;
                }
            }

            & .status-dot{
                position: absolute;
                top: 12px;
                left: 12px;
                width: 43px;
                height: 43px;
                background: #A5D060;
                border-radius: 50%;
            }

            & .card-link{
                position: absolute;
                bottom: 12px;
                right: 12px;
                width: 43px;
                height: 43px;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 50%;
                background: #A5D060;
            }
        }
    }

    & .big-border{
        display: flex;
        justify-content: flex-end;
        padding: 3px;

        & a{
            display: flex;
            align-items: center;

            & p{
                font-weight: bold;
                font-size: 18px;
                color: #1c1c1c;
                text-transform: uppercase;
                background-color: #a5d060;
                border-radius: 31px;
                padding: 10px 17px;
            }

            &:after{
                content: url("images/arrow.svg");
                border-radius: 31px;
                height: 39px;
                width: 43px;
                display: flex;
                align-items: center;
                padding-top: 4px;
                justify-content: center;
                background-color: #a5d060;
            }
        }
    }
}

.who-we-are{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
    padding-top: 50px;
    gap: 24px;


    & h1{
        font-weight: bold;
        font-size: 64px;
        line-height: 60px;
        text-transform: uppercase;
        color: #9f75eb;
        width: 100%;
        position: relative;
        display: inline-block;
        max-width: 920px;
        align-self: self-start;
    }

    & h1::after {
        content: '|';
        animation: blink 0.7s infinite;
        margin-left: 2px;
    }

    & h1.typing-done::after {
        display: none;
    }

     & p{
         width: 850px;
         font-size: 18px;
         line-height: 24px;
         color: #ffffff;
         position: relative;
         display: inline-block;
         min-height: 144px;
     }

     & p::after {
        content: '|';
        animation: blink 0.7s infinite;
        margin-left: 2px;
     }

     & p.typing-done::after {
        display: none;
     }
}

.gift-sets {
    padding: 60px 0 0;

    & .gift-content {
        display: flex;
        flex-wrap: wrap;
        gap: 18px;
        width: 100%;
max-height:780px;

        & .content-left{
            width: 57%;
            display: flex;
            flex-direction: column;
            gap: 18px;
            min-width: 0;
        }

        & .content-right{
            width: 41.7%;
max-height: 780px;
            display: flex;
            flex-direction: column;
            gap: 18px;
            min-width: 0;
        }

        & .twoitems{
max-height: 351px;
            display: flex;
            gap: 22px;
            min-width: 0;
        }

        & .gift-item {
            border-radius: 20px;
            position: relative;
            overflow: hidden;
            min-width: 0;

            & .gift-bg-img{
                filter: grayscale(100%);
                object-fit: cover;
                width: 100%;
                height: 100%;
                transition: filter 0.3s;
                -webkit-user-select: none;
                user-select: none;
                border-radius: 15px;
            }

            &.gift-item-large{
                min-height: 401px;
                max-width: 803px;
                width: 100%;
max-height:411px;

                & p{
                    font-size: 90px;
                    font-weight: bold;
                    color: #a5d060;
                    position: absolute;
                    z-index: 2;
                    text-transform: uppercase;
                    right: 44px;

                    &:nth-child(1){
                        right: 115px;
                    }

                    &:nth-child(2){
                        top: 85px;
                    }

                    &:nth-child(3){
                        top: 170px;
                        right: 115px;
                    }
                }

                &.gift-item-info-wrapper {
                    & .info-btn,
                    & .info-overlay {
                        display: none;
                    }
                }
            }

            & .status-dot{
                width: 50px;
                height: 50px;
                background-color: #a5d060;
                top: 20px;
                right: 20px;
                display: block;
                position: absolute;
                border-radius: 50%;
            }

            & .gift-number{
                font-size: 180px;
                line-height: 24px;
                text-align: left;
                color: #ffffff;
                position: absolute;
                z-index: 2;
                bottom: 90px;
                right: 30%;
            }

            &.gift-item-1{
                max-width: 312px;
                width: 100%;
                min-height: 350px;
            }

            &.gift-item-2{
                max-width: 469px;
                width: 100%;
                min-height: 350px;
            }

            &.gift-item-3{

                width: 100%;
                max-width: 588px;
                height: 100%;
                max-height: 553px;
            }

            &.gift-item-info{
                background: #A5D060;
                padding: 22px;
                position: relative;
                overflow: hidden;
                display: flex;
                flex-direction: column;
                gap: 7px;

                & h3{
                    font-weight: bold;
                    font-size: 90px;
                    color: #1c1c1c;
                    text-transform: uppercase;
                    line-height: 1;
                }

                & p{
                    font-size: 18px;
                    line-height: 18px;
                    color: #1c1c1c;
                    max-width: 487px;
                }

                & .arrow-link{
                    position: absolute;
                    right: 15px;
                    bottom: 15px;
                    width: 50px;
                    height: 50px;
                    background: #1c1c1c;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    border-radius: 50%;
                    outline: none;
                    border: none;
                    z-index: 11;
                }

                &.active{
                    & .arrow-link{
                        rotate: -90deg;
                    }

                    & .hidden{
                        opacity: 1;
                    }
                }

                & .hidden{
                    background: #A5D060;
                    position: absolute;
                    z-index: 10;
                    top: 30px;
                    opacity: 0;
                    transition: .1s linear;
                }
            }

            &:hover .gift-bg-img{
                filter: grayscale(0%);
            }
        }
    }
}

.directions{
    padding: 120px 0 107px;

    & h2:not(.directions-choose-desc){
        font-weight: bold;
        font-size: 64px;
        color: #ffffff;
        text-transform: uppercase;
    }

    & .divider{
        width: 100%;
        height: 1px;
        background: #ffffff;
        display: block;
        margin: 15px 0;
    }

    & .directions-content{
        display: flex;
        gap: 24px;

        & .content-choose{
            display: flex;
            flex-direction: column;
            gap: 20px;
            & .directions-choose-descriptions .directions-choose-desc:not(.is-active){
                display: none;
            }
            & .directions-choose-descriptions h2.directions-choose-desc{
                 font-weight: bold;
                font-size: 20px;
                line-height: 24px;
                color: #ffffff;
                margin: 0;
                font-family: inherit;
            }

            & p.directions-section-heading,
            & p.directions-tab-label,
            & p.li-label,
            & p.directions-more-text{
                margin: 0;
            }

            & ul{
                transition: .1s linear;
                & li{
                    cursor: pointer;
                    font-weight: normal;
                    font-size: 18px;
                    line-height: 18px;
                    text-align: left;
                    color: #ffffff;
                    text-transform: uppercase;
                    border-bottom: 1px solid #ffffff;
                    padding: 16px 0;
                    transition: .1s linear;
  & p.directions-tab-label,
  & p.li-label{
      margin: 0;
      font: inherit;
      color: inherit;
      text-transform: inherit;
  }

                    &:last-child {
                        margin: 0;
                    }

                    &:first-child{
                        border-top: 1px solid #ffffff;
                    }

                    &.active{
                        background: #A5D060;
                        color: #1c1c1c;
                    }

                    &:hover{
                        background: #A5D060;
                        color: #1c1c1c;
                    }
                }

                &.purple li{
                    &.active {
                        background: #9F75EB;
                    }

                    &:hover{
                        background: #9F75EB;
                    }
                }
            }

            & a{
                display: flex;
                align-items: center;
                width: fit-content;

                & .directions-more-text{
                    font-weight: bold;
                    font-size: 18px;
                    color: #1c1c1c;
                    background-color: #a5d060;
                    border-radius: 31px;
                    padding: 10px 17px;
                    text-transform: uppercase;
                }

                &:after{
                    content: url(images/arrow.svg);
                    border-radius: 31px;
                    height: 39px;
                    width: 43px;
                    display: flex;
                    align-items: center;
                    padding-top: 4px;
                    justify-content: center;
                    background-color: #a5d060;
                }
            }
        }

        & .content-choosed .choosed{
            display: none;

            & img{
                filter: grayscale(0);
                transition: .1s linear;
                border-radius: 15px;

                &:hover{
                    filter: grayscale(1);
                }
            }

            &.active{
                display: flex;
                animation: choosedFadeIn 0.4s ease;
            }
        }

        &.type1{
            padding-bottom: 20px;

            & .content-choose{

               & p.directions-section-heading{
                    font-weight: bold;
                    font-size: 90px;
                    color: #a5d060;

                    display: flex;
                    flex-direction: column;
                    text-transform: uppercase;
                    position: relative;
                    line-height: .9;

                    & span{
                        margin-left: 230px;
                    }
                }
            }

            & .content-choosed{

                & .choosed{
                    height: 100%;
                    align-items: flex-end;
                    gap: 18px;

                    & > img{
                        max-width: 311px;
                        object-fit: cover;
                        max-height: 529px;
                    }

                    & img{
                        border-radius: 15px;
                    }

                    & > div{
                        display: flex;
                        flex-direction: column;
                        gap: 18px;

                        & p{
                            font-size: 18px;
                            line-height: 18px;
                            text-align: left;
                            color: #ffffff;
                        }

                        & img{
                            max-width: 484px;
                            object-fit: cover;
                        }
                    }
                }
            }
        }

        &.type2{
            padding: 48px 0 42px;
            flex-direction: row-reverse;

            & .content-choose{
                & p.directions-section-heading{
                    display: flex;
                    flex-direction: column;
                    font-weight: bold;
                    font-size: 90px;
                    line-height: 0.90;
                    text-align: left;
                    color: #9f75eb;
                    text-transform: uppercase;

                    & span{
                        margin-left: -350px;
                    }
                }

                & a {
                    & .directions-more-text {
                        background-color: #9F75EB;
                    }

                    &:after{
                        background-color: #9F75EB;
                    }
                }
            }

            & .content-choosed{

                & .choosed{
                    flex-direction: row-reverse;
                    align-items: flex-end;
                    gap: 18px;

                    & > img{
                        max-height: 454px;
                    }

                    & > div{
                        padding-top: 20px;
                        display: flex;
                        flex-direction: column-reverse;
                        max-width: 561px;
                        gap: 30px;

                        & img{
                            max-width: 561px;
                        }
                    }
                }
            }
        }

        &.type3{
            padding: 48px 0 65px;

            & .content-choose{

                & a{
                    & .directions-more-text{
                        background-color: #9f75eb;
                    }

                    &:after{
                        background-color: #9f75eb;
                    }
                }

                & p.directions-section-heading{
                    font-weight: bold;
                    font-size: 90px;
                    color: #9f75eb;

                    display: flex;
                    flex-direction: column;
                    text-transform: uppercase;
                    position: relative;
                    line-height: .9;
                    padding-top: 80px;

                    & span{
                        position: absolute;
                        top: 0;
                        white-space: nowrap;
                        right: -210px;
                    }
                }
            }

            & .content-choosed{

                & .choosed{
                    height: 100%;
                    flex-direction: column;
                    justify-content: space-between;
                    align-items: flex-end;
max-height: 464px !important;

                    & img{
                        border-radius: 15px;
                        max-width: 909px;
                        height: 100%;
                        width: 100%;
                        object-fit: cover;
                    }

                    & p{
                        font-size: 18px;
                        line-height: 18px;
                        text-align: left;
                        color: #ffffff;
                        max-width: 675px;
                    }
                }
            }
        }

        &.type4{
            padding: 48px 0 42px;
            flex-direction: row-reverse;

            & .content-choose{
                & p.directions-section-heading{
                    display: flex;
                    flex-direction: column;
                    font-weight: bold;
                    font-size: 90px;
                    line-height: 0.90;
                    text-align: left;
                    color: #A5D060;
                    text-transform: uppercase;

                    & span{
                        margin-left: 150px;
                    }
                }
            }

            & .content-choosed{

                & .choosed{
                    flex-direction: row-reverse;
                    gap: 18px;

                    & > img{
                        max-width: 445px;
                    }

                    & > div{
                        display: flex;
                        flex-direction: column-reverse;
                        justify-content: space-between;
                        max-width: 428px;
                        gap: 30px;

                        & img{
                            max-width: 427px;
                        }
                    }
                }
            }
        }

        &.type5{
            padding: 48px 0 65px;

            & .content-choose{
                max-width: 470px;

                 & p.directions-section-heading{
                    font-weight: bold;
                    font-size: 90px;
                    color: #9f75eb;

                    display: flex;
                    flex-direction: column;
                    text-transform: uppercase;
                    position: relative;
                    line-height: .9;
                    white-space: nowrap;
                    margin-right: -210px;
                    text-align: right;
                    max-width: 950px;
                    width: 100vw;

                    & span{
                        position: absolute;
                        top: -80px;
                        white-space: nowrap;

                        & b{
                            font-weight: 700;
                        }
                    }
                }

                & a {
                    & .directions-more-text {
                        background-color: #9f75eb;
                    }

                    &:after{
                        background-color: #9f75eb;
                    }
                }
            }

            & .content-choosed{
                display: flex;
                flex-direction: column;
                align-items: flex-end;


                & .choosed{
                    height: 100%;
                    flex-direction: column;
                    align-items: flex-end;
                    gap: 31px;

                    & img{
                        border-radius: 15px;

                        &:first-child{
                            max-width: 568px;
                        }

                        &:last-child{
                            max-width: 329px;
                        }
                    }

                    & > div{
                        display: flex;
                        gap: 18px;
                    }
                }

                & p{
                    font-size: 18px;
                    line-height: 18px;
                    text-align: left;
                    color: #ffffff;
                    max-width: 445px;
                }
            }
        }
    }
}

@keyframes choosedFadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.directions-content.type3 .accordion-content,
.directions-content.type5 .accordion-content {
    display: none !important;
}
@keyframes marquee {
        0% {
            transform: translateX(0);
        }
        100% {
            transform: translateX(-50%);
        }
    }

.marquee{
    width: 99.5vw;
    overflow: hidden;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding-bottom: 40px;

    & p{
        font-weight: bold;
        font-size: 90px;
        line-height: 0.90;
        text-align: left;
        color: #9f75eb;
        white-space: nowrap;
        text-transform: uppercase;
        display: inline-block;
        animation: marquee 30s linear infinite;
    }
}

.swiper{
    background: url("images/swiper-bg.png") center center / 78% no-repeat;
    width: 99vw;
    height: 1200px;
    display: flex;
    align-items: center;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;

    @media screen and (max-width: 1440px){
        background: url("images/swiper-bg.png") center center / 104% no-repeat;
    }

    & .swiper-wrapper{
        height: fit-content;
    }

    & .swiper-slide {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        height: auto;
width: 306px;
       & > div{
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding: 13px;
            transition: .1s linear;
            border-radius: 15px;


            &:hover{
                background: #A5D060;

                & p{
                    color: #1c1c1c;
                }

                & img{
                    filter: grayscale(0);
                }
            }

            & img{
                filter: grayscale(1);
                transition: .1s linear;
            }

            & p{
                white-space: normal;
                word-wrap: break-word;
                font-size: 18px;
                line-height: 18px;
                color: #ffffff;
            }
        }

        & > div:only-child {
            align-self: center;
        }
    }

    & .swiper-button-prev,
    & .swiper-button-next {
        color: #A5D060;
        width: 68px;
        height: 68px;
        background-color: rgba(68, 68, 68, 0.50);
        border-radius: 50%;
    }

    & .swiper-button-prev:after,
    & .swiper-button-next:after {
        content: '';
        width: 20px;
        height: 39px;
        background-image: url('images/swiper-arrow.svg');
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        display: block;
    }

    & a{
        display: flex;
        align-items: center;
        width: fit-content;
       /* position: absolute;
        bottom: 70px;
        left: calc(50% - 97px);
        z-index: 5; */

        & span{
            font-weight: bold;
            font-size: 18px;
            color: #1c1c1c;
            background-color: #a5d060;
            border-radius: 31px;
            padding: 10px 17px;
            text-transform: uppercase;
        }

        &:after{
            content: url(images/arrow.svg);
            border-radius: 31px;
            height: 39px;
            width: 43px;
            display: flex;
            align-items: center;
            padding-top: 4px;
            justify-content: center;
            background-color: #a5d060;
        }
    }

    & .swiper-button-next:after {
        margin-right: -7px;
    }

    & .swiper-button-prev:after {
        margin-left: -6px;
        transform: rotate(180deg);
    }

    & .swiper-button-next {
        right: 10px;
    }

    & .swiper-button-prev {
        left: 20px;
    }
}

.info-blocks{
    display: flex;
    flex-direction: column;
    margin-top: -50px;

    & img{
        border-radius: 15px;
        filter: grayscale(1);
        transition: .1s linear;

        &:hover{
            filter: grayscale(0);
        }
    }

    & .christmas{
        display: flex;
        flex-direction: column;
        gap: 18px;

        & .content-top{
            display: flex;
            gap: 23px;

            & .images{
                display: flex;
                align-items: flex-start;
                gap: 18px;

                & img:first-child{
                    max-width: 334px;
                }

                & img:last-child{
                    max-width: 385px;
                }
            }

            & .heading{
                display: flex;
                flex-direction: column;
                gap: 28px;

                & h3{
                    font-weight: bold;
                    font-size: 90px;
                    line-height: 0.90;
                    color: #a5d060;
                    text-transform: uppercase;
                    margin-left: 95px;

                    & p{
                        color: #a5d060;
                        display: flex;
                        align-items: center;
                        gap: 18px;
                        margin-left: -95px;

                        & span{
                            text-transform: none;
                            font-size: 20px;
                            line-height: 24px;
                            color: #ffffff;
                            max-width: 286px;
                            display: block;
                        }
                    }
                }

                & > p{
                    font-size: 18px;
                    line-height: 18px;
                    color: #ffffff;
                }
            }
        }

        & .content-bottom{
            display: flex;
            gap: 18px;

            & .christmas-img-info {
                & .info-btn,
                & .info-overlay {
                    display: none;
                }
            }

            & > div{
                position: relative;

                & a{
                    display: flex;
                    align-items: center;
                    width: fit-content;
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    z-index: 5;

                    & span{
                        font-weight: bold;
                        font-size: 18px;
                        color: #1c1c1c;
                        background-color: #a5d060;
                        border-radius: 31px;
                        padding: 10px 17px;
                        text-transform: uppercase;
                    }

                    &:after{
                        content: url(images/arrow.svg);
                        border-radius: 31px;
                        height: 39px;
                        width: 43px;
                        display: flex;
                        align-items: center;
                        padding-top: 4px;
                        justify-content: center;
                        background-color: #a5d060;
                    }
                }
            }

            & > img:first-child{
                max-width: 572px;
            }

            & > img:last-child{
                max-width: 318px;
            }
        }
    }

    & .divider{
        width: 100%;
        height: 1px;
        background: #ffffff;
        margin: 52px 0;
    }

    & .branding{
        display: flex;
        gap: 18px;

        & img{
            border-radius: 15px;
            display: block;
            height: auto;
        }

        & .content-left{
            display: flex;
            flex-direction: column;
            gap: 18px;

            & h3{
                font-weight: 700;
                font-size: 90px;
                line-height: 0.90;
                color: #1c1c1c;
                background-color: #976fde;
                border-radius: 15px;
                display: flex;
                align-items: flex-end;
                padding: 24px;
                text-transform: uppercase;

                & span{
                    font-size: 18px;
                    font-weight: 400;
                    line-height: 18px;
                    color: #1c1c1c;
                    display: block;
                    text-transform: none;
                    margin-left: -80px;
                }
            }

            & img{
                max-width: 798px;
            }
        }

        & .content-right{
            display: flex;
            flex-direction: column;
            gap: 18px;

            & img{
                max-width: 594px;
            }

            & p{
                border-radius: 15px;
                border: 1px solid #ffffff;
                padding: 32px 26px;
                font-size: 18px;
                line-height: 18px;
                color: #ffffff;
                position: relative;

                &:after{
                    content: '';
                    width: 50px;
                    height: 50px;
                    background-color: #9f75eb;
                    position: absolute;
                    bottom: 13px;
                    right: 13px;
                    border-radius: 50%;
                }
            }
        }
    }
}

.faq{
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding-top: 85px;

    & h2{
        font-weight: 700;
        font-size: 64px;
        line-height: 60px;
        color: #9f75eb;
        text-transform: uppercase;
    }

    & .faq-content{
        display: flex;
        gap: 35px;

        & .faq-list{
            & li{
                display: flex;
                flex-direction: column;
                padding: 3px 2px 8px;
                border-top: 1px solid #ffffff;

                & .title{
                    display: flex;
                    align-items: center;
                    gap: 11px;
                    cursor: pointer;
                    -webkit-user-select: none;
                    user-select: none;

                    & img{
                        padding: 10px;
                        background-color: #444444;
                        border-radius: 50%;
                        transition: .1s linear;
                    }

                    & p{
                        font-weight: 400;
                        font-size: 18px;
                        line-height: 18px;
                        color: #ffffff;
                        text-transform: uppercase;
                    }
                }

                & .answer{
                    padding-left: 55px;
                    font-size: 18px;
                    line-height: 18px;
                    color: #ffffff;
                    max-height: 0;
                    overflow: hidden;
                    transition: .1s linear;
                }

                &.active{
                    & .title img{
                        rotate: 180deg;
                    }
                    & .answer{
                        max-height: 900px;
                    }
                }
            }
        }

        & .content-right{
            display: flex;
            flex-direction: column;
            gap: 14px;

            & .images{
                position: relative;
                max-width: 780px;
                width: 100%;

                & img{
                    display: none;
                    max-height: 440px;
                    border-radius: 15px;

                    &.active{
                        display: block;
                    }
                }
            }

            & a{
                border-radius: 24px;
                border: 1px solid #ffffff;
                display: flex;
                align-items: center;
                justify-content: flex-end;
                width: 100%;
                padding: 3px;

                & span{
                    font-weight: bold;
                    font-size: 18px;
                    color: #1c1c1c;
                    background-color: #9F75EB;
                    border-radius: 31px;
                    padding: 10px 17px;
                    text-transform: uppercase;
                }

                &:after{
                    content: url(images/arrow.svg);
                    border-radius: 31px;
                    height: 39px;
                    width: 43px;
                    display: flex;
                    align-items: center;
                    padding-top: 4px;
                    justify-content: center;
                    background-color: #9F75EB;
                }
            }
        }
    }
}

.merchandise{
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-top: 105px;

    & h2{
        font-weight: 700;
        font-size: 64px;
        line-height: 60px;
        text-transform: uppercase;
        color: #a5d060;
    }

    & .merchandise-content{
        display: flex;
        flex-wrap: wrap;
        gap: 54px;

        & .item{
            display: flex;
            flex-direction: column;
            gap: 20px;
            width: calc(50% - 27px);

            & .image-content{
                display: flex;
                flex-direction: column;

                & h3{
                    font-size: 18px;
                    line-height: 18px;
                    text-transform: uppercase;
                    color: #ffffff;
                    padding: 16px 18px;
                    border-radius: 31px;
                    border: 1px solid #ffffff;
                    width: fit-content;
                }

                & div{
                    position: relative;
                    height: fit-content;
                    overflow: hidden;
                    border-radius: 15px;

                    &:before{
                        content: '';
                        width: 100%;
                        height: 100%;
                        position: absolute;
                        background-color: rgba(28, 28, 28, 0);
                        border-radius: 15px;
                        transition: .1s linear;
                    }

                    & img{
                        object-fit: cover;
                        border-radius: 15px;
                        width: 100%;
                        height: 100%;
                    }

                    & p{
                        position: absolute;
                        bottom: 0;
                        left: 0;
                        right: 0;
                        padding: 34px 22px 24px;

                        background-color: #a5d060;
                        border-radius: 15px;
                        font-size: 18px;
                        line-height: 18px;
                        color: #313131;
                        max-height: 0;
                        overflow: hidden;
                        transition: .1s linear;
                        transform: translate(0, 58px);
                    }

                    &:hover{
                        & p{
                            max-height: 900px;
                            transform: translate(0);
                        }

                        &:before{
                            background-color: rgba(28, 28, 28, 0.80);
                        }
                    }
                }
            }

            & .under-image{
                display: flex;
                gap: 12px;

                & p{
                    font-size: 18px;
                    line-height: 18px;
                    text-transform: uppercase;
                    color: #ffffff;
                }

                & a{
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    min-width: 43px;
                    min-height: 43px;
                    max-width: 43px;
                    max-height: 43px;
                    background-color: #a5d060;
                    border-radius: 50%;
                }
            }

            &.boom{
                margin-top: -30px;

                & a{
                    display: flex;
                    align-items: center;
                    width: fit-content;
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    z-index: 5;

                    & span{
                        font-weight: bold;
                        font-size: 18px;
                        color: #1c1c1c;
                        background-color: #a5d060;
                        border-radius: 31px;
                        padding: 10px 17px;
                        text-transform: uppercase;
                    }

                    &:after{
                        content: url(images/arrow.svg);
                        border-radius: 31px;
                        height: 39px;
                        width: 43px;
                        display: flex;
                        align-items: center;
                        padding-top: 4px;
                        justify-content: center;
                        background-color: #a5d060;
                    }
                }
            }
        }
    }
}

.form{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 30px;
    padding-top: 92px;

    & h2{
        font-weight: 700;
        font-size: 64px;
        line-height: 60px;
        text-transform: uppercase;
        color: #a5d060;
        width: calc(50% - 27px);
    }

    & form{
        width: calc(50% - 27px);
        display: flex;
        flex-direction: column;

        & label{
            border-top: 1px solid #D5D5D5;

            &:last-child{
                border-radius: 29px;
                border: 1px solid #ffffff;
                padding: 3px 3px 3px 14px;
                display: flex;

                & input{
                    padding: 0;
                    width: 100%;
                }
            }

            & input{
                border: none;
                outline: none;
                background: none;
                font-weight: 400;
                font-size: 18px;
                line-height: 18px;
                text-transform: uppercase;
                color: #ffffff;
                padding: 14px 0;
                width: 100%;

                &::placeholder{
                    color: #ffffff;
                }
            }

            & button{
                all: unset;
                display: flex;
                align-items: center;
                width: fit-content;

                & span{
                    font-weight: bold;
                    font-size: 18px;
                    color: #1c1c1c;
                    background-color: #a5d060;
                    border-radius: 31px;
                    padding: 10px 17px;
                    text-transform: uppercase;
                }

                &:after{
                    content: url(images/arrow.svg);
                    border-radius: 31px;
                    height: 39px;
                    width: 43px;
                    display: flex;
                    align-items: center;
                    padding-top: 4px;
                    justify-content: center;
                    background-color: #a5d060;
                }
            }
        }

        & .divider{
            width: 100%;
            height: 1px;
            background: #D5D5D5;
            margin: 56px 0 32px;
        }
    }
}

footer{
    display: flex;
    gap: 70px;
    width: 100%;
    padding: 110px 0;
    max-width: 1410px;

    & .content-left{
        display: flex;
        justify-content: space-between;
        width: 57%;

        & .logo{
            display: flex;
            flex-direction: column;
            justify-content: space-between;

            & .socials{
                display: flex;

                & a{
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    padding: 9px;
                    background: #363636;
                    border-radius: 50%;
                }
            }
        }

        & .menu{
            display: flex;
            flex-direction: column;
            gap: 12px;
            max-width: 156px;
            width: 100%;

            & p{
                font-size: 18px;
                color: #ffffff;
                border-top: 1px solid #D5D5D5;
                border-bottom: 1px solid #D5D5D5;
                padding: 12px 0;
            }

            & ul li{
                font-weight: 700;
                font-size: 18px;
                text-transform: uppercase;
                color: #ffffff;
                line-height: 1.4;
            }
        }
    }

    & .content-right{
        display: flex;
        flex-direction: column;
        gap: 58px;

        & > div{
            display: flex;

            & div{
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: 12px;

                & p{
                    font-size: 18px;
                    color: #ffffff;
                    border-top: 1px solid #D5D5D5;
                    border-bottom: 1px solid #D5D5D5;
                    padding: 12px 0;
                }

                & ul li{
                    font-weight: 700;
                    font-size: 18px;
                    text-transform: uppercase;
                    color: #ffffff;
                    line-height: 1.4;

                    & a.underline{
                        text-decoration: underline;
                    }
                }

                & p{
                    font-weight: 700;
                    font-size: 18px;
                    text-transform: uppercase;
                    color: #ffffff;
                    line-height: 1.4;
                }
            }
        }

        & > p{
            font-weight: 300;
            font-size: 12px;
            line-height: 24px;
            letter-spacing: -0.03em;
            color: #5c5c5c;
        }
    }
}

.popup{
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(28, 28, 28, 0.8);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: .1s linear;
    pointer-events: none;

    &.active{
        opacity: 1;
        pointer-events: auto;
    }

    & .popup-content{
        background-color: #363636;
        border-radius: 79px;
        max-width: 604px;
        padding: 44px 64px;;
        width: fit-content;
        display: flex;
        flex-direction: column;
        gap: 19px;
        position: relative;

        & .popup-header{
            display: flex;
            flex-direction: column;
            gap: 12px;

            & h2{
                font-weight: 700;
                font-size: 64px;
                line-height: 60px;
                text-align: center;
                text-transform: uppercase;
                color: #A5D060;
                width: 109%;
                margin-left: -10px;
            }

            & p{
                font-weight: 700;
                font-size: 20px;
                line-height: 20px;
                text-align: center;
                color: #D9D9D9;
            }
        }

        & .popup-main{
            display: flex;
            flex-direction: column;
            gap: 24px;

            & label{
                display: flex;
                flex-direction: column;
                gap: 6px;
                font-weight: 500;
                font-size: 14px;
                line-height: 20px;
                color: #FFFEFA;

                & input, & textarea{
                    background-color: #242424;
                    border-radius: 8px;
                    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
                    padding: 12px 16px;
                    display: flex;
                    flex-direction: row;
                    justify-content: flex-start;
                    align-items: center;
                    gap: 8px;
                    outline: none;
                    border: none;
                    font-size: 16px;
                    line-height: 24px;
                    color: #6D758F;
                    resize: vertical;

                    &::placeholder{
                        color: #6D758F;
                    }
                }

                & textarea{
                    min-height: 128px;
                }
            }

            & > div{
                display: flex;
                align-items: center;
                gap: 12px;

                & label{
                    min-width: 20px;
                    min-height: 20px;
                    background-color: #242424;
                    border-radius: 6px;
                    position: relative;
                    cursor: pointer;

                    & input{
                        display: none;
                    }

                    &:has(input:checked){
                        &:after{
                            content: url("images/check.svg");
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                        }
                    }
                }

                & span{
                    font-size: 16px;
                    line-height: 24px;
                    color: #C4C4C4;

                    & a{
                        color: #C4C4C4;
                        text-decoration: underline;
                    }
                }
            }

            & button{
                background-color: #9F75EB;
                border-radius: 32px;
                width: fit-content;
                padding: 18px 33px 15px 37px;
                outline: none;
                border: none;
                font-size: 18px;
                line-height: 18px;
                text-align: center;
                text-transform: uppercase;
                color: #1C1C1C;
                align-self: center;
                cursor: pointer;
            }
        }

        & .close-popup{
            position: absolute;
            top: -1px;
            right: -1px;
            width: 25px;
            height: 25px;
            cursor: pointer;

            & span{
                display: block;
                width: 24px;
                height: 2px;
                background-color: #FFFFFF;
                position: absolute;
                top: calc(50% - 1px);
                left: calc(50% - 12px);

                &:first-child{
                    transform: rotate(45deg);
                    transform-origin: center;
                }

                &:last-child{
                    transform: rotate(-45deg);
                    transform-origin: center;
                }
            }
        }
    }
}
.form label.field-invalid,
.popup-main label.field-invalid {
    border-top-color: #e85d5d !important;
}
.form label.field-invalid:last-child {
    border-color: #e85d5d !important;
}
.popup-main .popup-policy.field-invalid {
    box-shadow: 0 0 0 1px #e85d5d;
    border-radius: 12px;
}

html.lang-ru{
    .who-we-are {
        & h1 {
            max-width: 1020px;
        }
    }

    .gift-sets {
        & .gift-content {
            & .gift-item {
                &.gift-item-info {
                    & h3 {
                        font-size: 65px;
                        line-height: .85;
                    }
                }
            }
        }
    }

    .directions {
        & .directions-content {
            & p.directions-section-heading {
                line-height: 1!important;
                font-size: 65px!important;
                white-space: nowrap;
            }

            &.type1 {
                & .content-choose {
                    & p.directions-section-heading {
                        margin-left: 140px;

                        line-height: 1;


                        & span{
                            margin-left: -145px;
                        }
                    }
                }
            }

            &.type3 {
                & .content-choose {
                    max-width: 468px;
                    & p.directions-section-heading {
                        padding-top: 60px;
                        letter-spacing: -0.02em;

                        & span{
                            right: -160px;
                            top: -5px;
                        }
                    }
                }

                & .content-choosed {
                    & .choosed {
                        & p {
                            max-width: 750px;
                        }
                    }
                }
            }

            &.type4 {
                & .content-choosed {
                    & .choosed {
                        & > img {
                            min-width: 404px;
                            max-height: 386px;
                            align-self: flex-end;
                            object-fit: cover;
                        }

                        & > div {
                            max-width: 490px;
                            & img {
                                min-width: 488px;
                                height: 420px;
                            }
                        }
                    }
                }

                & .content-choose {
                    & p.directions-section-heading {
                        margin-left: -430px;
                        & span {
                            margin-left: 170px;
                        }
                    }
                }
            }

            &.type5 {
                & .content-choose {
                    & p.directions-section-heading {
                        max-width: 875px;
                        margin: 0;
                        top: -5px;
                        & span {
                            position: absolute;
                            top: -65px;
                            white-space: nowrap;
                        }
                    }
                }

                & .content-choosed {
                    & p {
                        max-width: 520px;
                    }
                }
            }
        }
    }

    .hero {
        & .hero-cards {
            & .card {
                & .card-content {
                    & .card-tag {
                        line-height: 1;
                    }

                    & .card-title {
                        max-width: 310px;
                    }
                }
            }
        }
    }

    .gift-sets {
        & .gift-content {
            & .gift-item {
                &.gift-item-info {
                    & .hidden {
                        top: 25px;
                        padding-bottom: 50px;
height:100%;
                    }
                }
            }
        }
    }

    .info-blocks {
        & .christmas {
            & .content-top {
                & .heading {
                    & h3 {
                        font-size: 65px;
                        & p {
                            & span {
                                font-size: 18px;
                            }
                        }
                    }
                }
            }
        }

        & .branding {
            & .content-left {
                & h3 {
                    font-size: 65px;
                    align-items: unset;

                    & span{
                        max-width: 410px;
                        margin-left: -40px;
                    }
                }

                & img{
                    min-width: 853px;
max-height: 590px;
height: 100%;
                    object-fit: cover;
                }
            }

            & .content-right {
                & img {
                    max-width: 539px;


max-height: 630px;
                    height: 100%;
                }

                & p{
                    &:after {
                        content: none;
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 1366px){
    .container{
        max-width: 1300px;
    }

    .gift-sets {
        & .gift-content {
            flex-wrap: nowrap;

            & .gift-item {
                & .status-dot {
                    top: 10px;
                    right: 10px;
                }

                &.gift-item-info {
                    & p {

                        max-width: 469px;
                    }
                }
            }
        }
    }

    .directions {
        & .directions-content {
            & p.directions-section-heading{
                font-size: 64px!important;
            }

            &.type5 {
                & .content-choosed {
                    & .choosed {
                        & img {
                            &:last-child{
                                max-width: 304px;
                            }
                            &:first-child {
                                max-width: 484px;
                            }
                        }
                    }
                }

                & .content-choose {
                    & p.directions-section-heading{
                        margin: 0;
                        max-width: 780px;
                        & span {
                            top: -60px;
                        }
                    }
                }
            }
        }
    }

    .info-blocks {
        & .christmas {
            & .content-top {
                & .heading {
                    & h3 {
                        font-weight: bold;
                        font-size: 72px;
                        line-height: 0.90;
                        color: #a5d060;
                        text-transform: uppercase;
                        margin-left: 95px;
                    }
                }
            }

            & .content-bottom {
                & img{
                    max-width: 470px;
                }
            }
        }

        & .branding {
            & .content-left{
                & img{
                    max-width: 749px;
                }
            }
            & .content-right {
                & img {
                    max-width: 533px;
                }
            }
        }
    }

    footer {
        max-width: 1300px;
    }

    html.lang-ru{
        & .directions {
            & .directions-content {
                & p.directions-section-heading {
                    font-size: 50px !important;
                }
                &.type5 {
                    & .content-choose {
                        & p.directions-section-heading {
                            max-width: 760px;
                        }
                    }
                }
            }
        }

        .hero {
            & .hero-cards {
                & .card {
                    & .card-content {
                        & .card-tag {
                            font-size: 44px;
                        }
                    }
                }
            }
        }

        & .info-blocks {
            & .christmas {
                & .content-top {
                    & .heading {
                        & h3 {
                            font-size: 60px;

                            & p {
                                & span {
                                    font-size: 16px;
                                }
                            }
                        }
                    }
                }
            }
            & .branding {
                & .content-left {
                    & img {
                        min-width: 807px;
                    }
                    & h3 {
                        font-size: 60px;
                        align-items: unset;

                        & span{
                            font-size: 17px;
                        }
                    }
                }
                & .content-right {
                    & img {
                        max-width: 475px;
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 1280px){
    .container{
        max-width: 1270px;
    }
}

@media screen and (max-width: 1024px){
html.lang-ru {
    & .info-blocks {
        & .branding {
            & .content-right {
                & img {
                    height: unset;
                }
            }
        }
    }
}
    .mobile{
        display: flex!important;
    }

    body:before {
        content: '';
        background-color: rgba(28, 28, 28, 0);
        width: 100%;
        height: 100%;
        position: fixed;
        z-index: -1;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease, background-color 0.3s ease;
    }

    body:has(.header-content.active):before {
        background-color: rgba(28, 28, 28, 0.95);
        z-index: 999;
        opacity: 1;
        pointer-events: auto;
    }

    .container{
        max-width: 980px;
    }

    header{
        padding: 5px 18px 5px 11px;
        & .header-content:not(.mobile) {
            display: none;
        }

        & .lang-switcher:not(.mobile) {
            display: none;
        }

        & .logo .desc{
            display: none;
        }

        & .header-content{
            position: absolute;
            width: 100%;
            max-width: 980px;
            border-radius: 29px;
            border: 1px solid #FFFFFF;
            padding: 5px 18px 5px 11px;
            left: 0;
            top: 54px;

            &.mobile {
                display: none!important;

                &.active{
                    display: flex!important;
                }
            }
        }
    }

    .hero {
        & .hero-cards {
            & .card {
                & .card-content {
                    & .card-tag {
                        font-weight: bold;
                        font-size: 32px;
                        color: #a5d060;
                        text-transform: uppercase;
                    }

                    & .card-title {
                        font-weight: bold;
                        font-size: 14px;
                        line-height: 20px;
                        color: #ffffff;
                    }
                }
            }
        }
    }

    .who-we-are {
        & p {
            width: 600px;
            font-size: 18px;
            line-height: 24px;
            color: #ffffff;
            position: relative;
            display: inline-block;
            min-height: 144px;
        }
    }

    .gift-sets {
        & .gift-content {
            flex-wrap: wrap
        }
    }

    .directions {
        & .directions-content {
            flex-direction: column!important;

             & p.directions-section-heading{
                margin: 0!important;
                gap: 14px;

                padding: 0!important;

                & span{
                    margin: 0 !important;
                    position: unset !important;
                }
            }

            & .content-choose {
                max-width: unset!important;
            }

            & .choosed {
                justify-content: center!important;
                align-items: flex-start!important;
                & > div {
                    padding: 0!important;
                    max-width: 590px!important;
                }

                & img{
                    max-width: unset!important;
                }

                & p {
                    max-width: unset!important;
                }
            }

            & .content-choosed{

            }
        }
    }

    .gift-sets {
        & .gift-content {
            & .gift-item {
                &.gift-item-info {
                    & h3 {
                        font-weight: bold;
                        font-size: 74px;
                        color: #1c1c1c;
                        line-height: 1;
                    }

                    & .hidden{
                        top: 30px;
                    }
                }

                &.gift-item-large {
                    max-width: unset;
                }

                &.gift-item-1 {
                    max-width: unset;
                }
            }

            & .content-left {
                width: 100%;
            }

            & .content-right {
                width: 100%;
                flex-direction: row;
            }
        }
    }


    .info-blocks {
        & .christmas {
            & .content-top {
                flex-direction: column-reverse;

                & .images{
                    & img{
                        width: 100%;
                        max-width: unset!important;
                        height: stretch;
                    }
                }
            }
            & .content-bottom {
                display: flex;
                flex-wrap: wrap;

                & img {
                    max-width: unset;
                }

                & .boom {
                    order: 2;
                    display: flex;
                    align-items: center;

                    & img{
                        align-self: center;
                    }
                }

                & img:nth-child(2) {
                    width: 100%;
                    order: 1;
                }

                & img:nth-child(3) {
                    order: 3;
                    max-width: unset;
                    width: calc(50% - 10px);
                }
            }
        }

        & .branding {
            flex-direction: column;

            & .content-left {
                & img {
                    max-width: unset;
                    width: 100%;
                }
            }

            & .content-right {
                flex-direction: row;
            }
        }
    }

    .faq {
        & .faq-content {
            & .faq-list{
                width: 50%;
            }
            & .content-right {
                width: 50%;
                & .images {
                    width: 100%;
                    & img {
                        &.active {
                            width: 100%;
                        }
                    }
                }
            }

            &.mobile{
                display: none!important;
            }
        }
    }


    footer {
        max-width: 980px;

        & .content-left {
            gap: 30px;
        }
    }

    html.lang-ru{
        .info-blocks {
            & .christmas {
                & .content-top {
                    & .heading {
                        & h3 {
                            & p {
                                & span {
                                    font-size: 20px;
                                    max-width: 359px;
                                }
                            }
                        }
                    }
                }
            }
        }

        & .directions {
            & .directions-content {
                &.type4 {
                    & .content-choosed {
                        & .choosed {
                            & > img {
                                min-width: unset;
                                max-height: unset;
                                align-self: flex-end;
                                object-fit: cover;
                            }
                        }
                    }
                }
            }
        }

        & .hero {
            & .hero-cards {
                & .card {
                    & .card-content {
                        & .card-tag {
                            font-size: 44px;
                        }
                    }
                }
            }
        }
    }

    .popup {
        & .popup-content {
            padding: 33px 35px 27px;
            max-width: 326px;

            & .popup-header{
                & h2{
                    font-size: 36px;
                    line-height: 36px;
                    width: 120%;
                    margin-left: -25px;
                }

                & p{
                    font-size: 13px;
                    line-height: 13px;
                    letter-spacing: -0.01em;
                }
            }

            & .popup-main {
                gap: 13px;
                & label {
                    & input, & textarea {
                        padding: 12px 16px;
                        font-size: 13px;
                        line-height: 13px;
                        letter-spacing: -0.01em;
                    }

                    & textarea{
                        min-height: 68px;
                    }
                }

                & > div{
                    & span{
                        font-size: 13px;
                        line-height: 13px;
                        letter-spacing: -0.01em;
                    }
                }

                & button{
                    font-size: 16px;
                    line-height: 16px;
                }
            }
        }
    }
}

@media screen and (max-width: 768px){
    .container{
        max-width: 700px;
    }

    header {
        & .header-content {
            & > div {
                & .portfolio-btn {
                    background-color: #363636;
                    color: #fff;
                }
            }
        }
    }

    .info-blocks {
        & .christmas {
            & .content-bottom {
                & .boom {
                    width: calc(50% - 10px);

                    & img{
                        width: 100%;
                    }
                }
            }
        }
    }

    .swiper {
        background: url(images/swiper-bg.png) center center / 160% no-repeat;

        & .swiper-slide {
            & > div {
                width: 306px;

                & img {
                    filter: grayscale(1);
                    transition: .1s linear;
                    max-width: 280px;
                }
            }
        }
    }

    .gift-sets {
        & .gift-content {
            & .gift-item {
                & .status-dot {
                    width: 35px;
                    height: 35px;
                }

                &.gift-item-3 {
                    min-height: unset;
                    width: 100%;
                    max-width: unset;
                }
            }
        }
    }

    .directions {
        & .directions-content {
            & p.directions-section-heading {
                font-size: 54px !important;
            }
        }
    }

    .hero-cards {
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;

        & .card {
            flex: 0 0 47%;
            scroll-snap-align: start;
        }

        &::-webkit-scrollbar {
            display: none;
        }
    }

    .who-we-are {
        & h1 {
            font-size: 49px;
        }
    }

    .info-blocks {
        & .branding {
            & .content-left {
                & h3 {
                    font-size: 64px;

                    & span {

                        margin-left: -50px;
                    }
                }
            }
            & .content-right {
                & img {
                    max-width: 350px;
                }
            }
        }
    }

    .faq {
        & .faq-content {
            & .faq-list {
                & li {
                    & .title {
                        & p {
                            font-size: 15px;
                        }
                    }

                    & .answer {
                        font-size: 12px;
                    }
                }
            }

            & .content-right {
                width: 60%;
            }
        }
    }

    .merchandise {
        & .merchandise-content {
            & .item {
                & .image-content {
                    & h3 {
                        font-size: 15px;
                        line-height: 18px;
                        text-transform: uppercase;
                        color: #ffffff;
                        padding: 16px 18px;
                        border-radius: 31px;
                        border: 1px solid #ffffff;
                        width: fit-content;
                    }

                    & div {
                        & p {
                            font-size: 14px;
                        }
                    }
                }

                & .under-image {
                    & p {
                        font-size: 15px;
                    }
                }
            }
        }
    }

    .form {
        & h2 {
            width: 100%;
        }

        & form {
            width: 100%;
        }
    }

    footer{
        max-width: 700px;

        & .content-left {
            & .menu {
                & ul li {
                    font-size: 15px;
                }
            }
        }

        & .content-right {
            & > div {
                & div {
                    & p {
                        font-size: 15px;
                    }

                    & ul li {
                        font-size: 15px;
                    }
                }
            }
        }
    }

    html.lang-ru{
        & .hero {
            & .hero-cards {
                & .card {
                    & .card-content {
                        & .card-tag {
                            font-size: 48px;
                        }
                    }
                }
            }
        }

        & .gift-sets {
            & .gift-content {
                & .gift-item {
                    &.gift-item-info {
                        width: calc(100% - 60px);
                        & h3 {
                            font-size: 50px;
                            line-height: .85;
                        }
                    }
                }
            }
        }

        .directions {
            padding: 32px 0 107px;
            & .directions-content {
                & p.directions-section-heading {
                    flex-direction: column!important;
                }

                &.type5 {
                    & .content-choose {
                        & p.directions-section-heading {
                            text-align: left;
                        }
                    }
                }
            }
        }

        & .info-blocks {
            & .branding {
                & .content-right {
                    & img {
                        max-width: 336px;
                    }
                }
            }
        }

        .merchandise {
            & .merchandise-content {
                & .item {
                    & .image-content {
                        & div {
                            & p {
                                font-size: 12px;
                                line-height: 12px;
                            }
                        }
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 480px){
    .container{
        max-width: 365px;
    }

    header {
        & .header-content {
            & > div{
                width: 100%;
                min-width: 0;
                flex-shrink: 1;

                & .catalog-btn{
                    width: 100%;
                    justify-content: center;
                    text-align: center;
                    box-sizing: border-box;
                }

                & .portfolio-btn{
                    width: 100%;
                    justify-content: center;
                    text-align: center;
                    box-sizing: border-box;
                }
            }

            &.mobile {
                flex-direction: column;
                padding: 10px;
                width: 100%;

                & .contact-btn{
                    width: 100%;

                    & p{
                        width: 100%;
                        justify-content: center;
                        box-sizing: border-box;
                    }

                    &:after{
                        content: none;
                    }
                }
            }
        }
    }

    .hero {
        & .hero-cards {
            gap: 8px;

            & .card{
                min-width: 80%;
                min-height: 480px;

                & .card-content {
                    gap: 0;
                    & .card-tag {
                        font-size: 36px;
                    }

                    & .card-title {
                        font-size: 16px;
                    }
                }
            }
        }

        & .big-border{
            display: none;
        }
    }

    .who-we-are{
        padding-top: 30px;
        gap: 10px;

        & h1{
            font-size: 36px;
            line-height: 36px;
        }

        & p{
            min-width: unset;
            font-size: 13px;
            line-height: 16px;
            letter-spacing: -0.01em;
            width: 297px;
            min-height: unset;
            overflow-wrap: break-word;
            word-break: break-word;

            & .expand-btn {
                display: inline-block;
                background: transparent;
                border: none;
                color: rgba(255, 255, 255, 0.2);
                cursor: pointer;
                font-size: 13px;
                margin-left: 5px;
                line-height: 16px;
                letter-spacing: -0.01em;
            }
        }
    }

    .gift-sets {
        padding-top: 26px;
        & .gift-content {
            flex-direction: column-reverse;
            gap: 8px;
            min-width: 0;

            & .gift-item {
                min-width: 0;

                &.gift-item-large {
                    max-width: unset;
                }

                &.gift-item-info{
                    max-width: 154px;
                    padding: 15px 25px 15px 11px;

                    & h3{
                        font-size: 44px;
                        line-height: 0.90;
                    }

                    & p{
                        font-size: 13px;
                        line-height: 13px;
                        letter-spacing: -0.01em;
                    }

                    & .arrow-link{
                        display: none;
                    }
                }

                &.gift-item-large{
                    min-height: 186px;

                    & p{
                        font-size: 40px;
                        line-height: 0.90;

                        &:nth-child(1){
                            top: 4px;
                            right: 41px;
                        }

                        &:nth-child(2){
                            top: 43px;
                            right: 6px;
                        }

                        &:nth-child(3){
                            top: 82px;
                            right: 40px;
                        }
                    }

                    &.gift-item-info-wrapper {
                        & .info-btn {
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            position: absolute;
                            bottom: 8px;
                            right: 8px;
                            width: 25px;
                            height: 25px;
                            border-radius: 50%;
                            background-color: rgba(115, 115, 115, 0.50);
                            color: #FFFFFF;
                            border: none;
                            font-weight: 700;
                            font-size: 13px;
                            line-height: 18px;
                            letter-spacing: -0.01em;
                            cursor: pointer;
                            z-index: 4;
                        }

                        & .info-overlay {
                            display: flex;
                            align-items: flex-end;
                            position: absolute;
                            opacity: 0;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            background-color: rgba(28, 28, 28, 0.95);
                            padding: 12px;
                            border-radius: 15px;
                            z-index: 3;
                            transition: .1s linear;

                            & p {
                                color: #fff;
                                font-weight: 400;
                                font-size: 13px;
                                line-height: 13px;
                                position: unset;
                                text-transform: unset;
                            }
                        }

                        &.active .info-overlay {
                            opacity: 1;
                        }
                    }
                }

                & .status-dot {
                    width: 25px;
                    height: 25px;
                    top: 6px;
                    right: 6px;
                }

                &.gift-item-1 {
                    min-height: unset;
                    max-width: 141px;
                }

                &.gift-item-2 {
                    max-width: 469px;
                    min-height: unset;
                }

                &.gift-item-3 {
                    max-width: 203px;
                    min-height: unset;
                }
            }

            & .content-right {
                flex-direction: row-reverse;
                gap: 8px;
            }

            & .content-left{
                gap: 8px;

                & .twoitems{
                    gap: 8px;
                }
            }
        }
    }

    .directions {
        padding: 30px 0;

        & h2:not(.directions-choose-desc) {
            font-size: 36px;
            line-height: 36px;
        }
& .directions-content .directions-choose-descriptions h2.directions-choose-desc {
            font-size: 16px;
            line-height: 16px;
            font-weight: 700;
        }
        & .divider {
            margin: 10px 0;
        }

        & .divider:nth-child(2), .divider:nth-child(4), .divider:nth-child(6) {
            display: none;
        }

        & .directions-content {
            position: relative;

            &.type1 {
                margin-top: 10px;
                padding-top: 10px;
                border-top: 1px solid #FFFFFF;
                & p.directions-section-heading {
                    & span {
                        text-align: right;
                    }
                }
            }

            &.type2 {
                & .content-choose {
                    & p.directions-section-heading {
                        gap: 2px;
                        text-align: right;

                        & span{
                            text-align: left;
                        }
                    }

                    & .directions-choose-descriptions{
                        align-self: flex-end;
                        max-width: 257px;
                    }
& .directions-choose-descriptions h2.directions-choose-desc{
                        font-size: 16px;
                        line-height: 16px;
                    }

                    & a{
                        max-width: 257px;
                        width: 100%;
                        align-self: flex-end;
                    }
                }
            }

            &.type3 {
                padding-bottom: 20px;
                & .content-choose {
                    & p.directions-section-heading {
                        gap: 2px;
                        text-align: left;

                        & span{
                            text-align: right;
                        }
                    }

                     & .directions-choose-descriptions{
                        max-width: 261px;
                    }
                    & .directions-choose-descriptions h2.directions-choose-desc{
                        font-size: 16px;
                        line-height: 16px;
                        letter-spacing: -0.01em;
                    }
                }
            }

            &.type4 {
                padding-top: 20px;
                & .content-choose {
                    & p.directions-section-heading {
                        gap: 2px;
                        margin-left: 33%!important;

                        & span{
                            text-align: left;
                            margin-left: -50%!important;
                        }
                    }

                    & .directions-choose-descriptions{
                        max-width: 295px;
					}
& .directions-choose-descriptions h2.directions-choose-desc{
                        font-size: 16px!important;
                        line-height: 16px!important;
                    }
                }
            }

            &.type5 {
                padding-top: 20px;
                & .content-choose {
                    & p.directions-section-heading {
                        gap: 2px;
                        color: #363636;
                        text-align: left;
                        font-size: 44px!important;
                        line-height: 0.90;
                        letter-spacing: -0.06em;

                        & span{
                            text-align: left;
                            color: #9f75eb;
                            width: 159px;
                            white-space: normal;
                            display: flex;
                            flex-direction: column;

                            & b{
                                margin-left: 70px;
                            }
                        }
                    }

                    & .directions-choose-descriptions{
                        max-width: 295px;
                        font-size: 13px!important;
                        line-height: 13px!important;
                        letter-spacing: -0.01em;
                        position: absolute;
                        left: 140px;
                        top: 60px;
                        z-index: -1;

                    }
 & .directions-choose-descriptions h2.directions-choose-desc{
                        font-size: 13px!important;
                        line-height: 13px!important;
                        letter-spacing: -0.01em;
                    }
                }
            }

            &.type3, &.type5{
                & .content-choosed {
                    display: none!important;
                }
            }

            & .content-choose {
                gap: 10px;
                & h3 {
                    font-size: 50px !important;
                    line-height: 0.90;
                    flex-direction: column !important;
                }
            }

            &.type1, &.type2, &.type4 {
                gap: 32px;
                padding-bottom: 70px;

                & .content-choose {
                    & h3 {
                        font-size: 50px!important;
                        line-height: 0.90;
                        flex-direction: column!important;
                    }

                    & p {
                        font-weight: 700;
                        font-size: 16px;
                        line-height: 16px;
                    }

                    & ul.choose-direction {
                        display: flex;
                        gap: 28px;
                        overflow-x: auto;
                        white-space: nowrap;
                        scrollbar-width: none;
                        -webkit-overflow-scrolling: touch;
                        border-top: 1px solid #FFFFFF;
                        border-bottom: 1px solid #FFFFFF;
                        padding-left: 33%;
                        position: absolute;
                        bottom: 0;
                        left: 0;
                        width: 100%;

                        &::-webkit-scrollbar {
                            display: none;
                        }

                        & li {
                            flex-shrink: 0;
                            font-size: 16px;
                            line-height: 16px;
                            padding: 10px 0;
                            white-space: nowrap;
                            border-bottom: none;
                            border-top: none;
                            color: #363636;

                            &:hover {
                                background: none;
                                color: #A5D060;
                            }

                            &.active {
                                background: none;
                                color: #A5D060;
                            }
                        }

                        &.purple li{
                            &.active {
                                color: #9F75EB;
                            }

                            &:hover{
                                color: #9F75EB;
                            }
                        }
                    }

                    & a {
                        & .directions-more-text {
                            font-size: 14px;
                            padding: 8px 14px;
                        }

                        &:after {
                            width: 32px;
                            height: 28px;
                        }
                    }
                }

                & .content-choosed {
                    position: relative;
                    width: 100%;

                    & .choosed {
                        display: none !important;
                    }

                    & .mobile-slider-wrapper {
                        display: block;
                    }

                    & .mobile-slide-group {
                        display: none;

                        &.active {
                            display: block;
                        }
                    }

                    & .mobile-slider {
                        display: block;
                        position: relative;
                        width: 100%;
                        aspect-ratio: 0.9;
                        overflow: visible;
                        border-radius: 15px;

                        & .mobile-slide {
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            border-radius: 15px;
                            overflow: hidden;
                            transition: transform 0.4s ease, opacity 0.4s ease, filter 0.4s ease;
                            will-change: transform, opacity, filter;

                            & img {
                                object-position: center center;
                                border-radius: 15px;
                                display: block;
                                max-height: 400px;
                            }

                            &.slide-back {
                                transform: scale(0.95);
                                filter: grayscale(1);
                                opacity: 0.3;
                                z-index: 1;
                            }

                            &.slide-front {
                                transform: scale(1) translateX(0);
                                filter: grayscale(0);
                                opacity: 1;
                                z-index: 2;
                            }
                        }

                        & .mobile-info-btn {
                            position: absolute;
                            bottom: 10px;
                            right: 10px;
                            width: 30px;
                            height: 30px;
                            background-color: rgba(115, 115, 115, 0.50);
                            border: none;
                            border-radius: 50%;
                            color: #fff;
                            font-weight: 700;
                            font-size: 20px;
                            line-height: 18px;
                            letter-spacing: -0.01em;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            cursor: pointer;
                            z-index: 5;
                        }

                        & .mobile-info-overlay {
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            background: rgba(0, 0, 0, 0.80);
                            border-radius: 15px;
                            z-index: 4;
                            display: flex;
                            align-items: flex-end;
                            justify-content: center;
                            padding: 24px 16px;
                            opacity: 0;
                            pointer-events: none;
                            transition: opacity 0.3s ease;

                            &.active {
                                opacity: 1;
                                pointer-events: auto;
                            }

                            & p {
                                color: #ffffff;
                                font-size: 14px;
                                line-height: 18px;
                                text-align: left;
                            }
                        }
                    }

                    & .mobile-slider-dots {
                        display: flex;
                        justify-content: center;
                        gap: 8px;
                        padding-top: 14px;

                        & .dot {
                            width: 5px;
                            height: 5px;
                            border-radius: 50%;
                            background: rgba(255, 255, 255, 0.3);
                            cursor: pointer;
                            transition: background 0.3s ease;

                            &.active {
                                background: #ffffff;
                            }
                        }
                    }
                }
            }
        }
    }

    .directions-content.type3,
    .directions-content.type5 {

        & .choose-direction{

            & li {
                font-size: 16px;
                line-height: 13px;
                color: #FFFFFF;
                position: relative;

                & .accordion-content {
                    display: none !important;
                    gap: 12px;
                    overflow-x: auto;
                    overflow-y: hidden;
                    scrollbar-width: none;
                    -webkit-overflow-scrolling: touch;
                    padding: 12px 0 0;

                    &::-webkit-scrollbar {
                        display: none;
                    }
                }

                &.accordion-open .accordion-content {
                    display: flex !important;
                    animation: accordionSlideDown 0.3s ease;
                }
                &.active .accordion-content {
                    display: flex !important;
                    animation: accordionSlideDown 0.3s ease;
                }

                &:hover{
                    background: none!important;

                    & .li-label{
                        color: #fff;
                    }
                }

                &.active{
                    background: none!important;
                    & .li-label{
                        color: #fff;
                    }
                }
            }
        }

        & .accordion-slide {
            position: relative;
            flex-shrink: 0;
            border-radius: 15px;
            overflow: hidden;
            width: 100%;

            & img {
                display: block;
                max-height: 176px;
                border-radius: 15px;
                object-fit: cover;
                width: 100%;
            }

            & .accordion-info-btn {
                position: absolute;
                bottom: 10px;
                right: 10px;
                width: 30px;
                height: 30px;
                background-color: rgba(115, 115, 115, 0.50);
                border: none;
                border-radius: 50%;
                color: #fff;
                font-weight: 700;
                font-size: 20px;
                line-height: 18px;
                display: flex;
                justify-content: center;
                align-items: center;
                cursor: pointer;
                z-index: 5;
            }

            & .accordion-info-overlay {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.80);
                border-radius: 15px;
                z-index: 4;
                display: flex;
                align-items: flex-end;
                justify-content: center;
                padding: 24px 16px;
                opacity: 0;
                pointer-events: none;
                transition: opacity 0.3s ease;

                &.active {
                    opacity: 1;
                    pointer-events: auto;
                }

                & p {
                    color: #ffffff;
                    font-size: 14px;
                    line-height: 13px;
                    text-transform: none;
                    font-weight: 400;
                }
            }
        }
    }

    @keyframes accordionSlideDown {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    .marquee {
        padding: 0;
        & p {
            font-size: 44px;
            line-height: 0.90;
        }
    }

    .swiper {
        padding-top: 0;
        background: url(images/swiper-bg.png) center center / 290% no-repeat;
        height: 760px;

        & .swiper-button-next, & .swiper-button-prev {
            display: none;
        }

        & .swiper-slide {
            & > div {
                gap: 9px;
                width: unset;

                & img {
                    max-width: 260px;
                    max-height: 282px;
                }

                & p{
                    font-size: 13px;
                    line-height: 13px;
                }
            }
        }

        & a{
            bottom: 20px;
        }
    }

    .info-blocks {
        & .christmas {
            gap: 8px;
            & .content-top {
                & .heading {
                    & h3 {
                        font-size: 50px;
                        line-height: 0.90;
                        margin-left: 50px;

                        & p{
                            margin-left: -50px;
                            & span{
                                font-size: 13px;
                                line-height: 13px;
                                letter-spacing: -0.01em;
                            }
                        }
                    }

                    & p[data-i18n="christmas_desc"] {
                        display: none;
                    }
                }

                & .images {
                    gap: 8px;
                    & picture:first-child {
                        max-width: 208px!important;
                        height: unset;
                    }

                    & picture:last-child {
                        max-width: 148px!important;
                        height: unset;
                    }
                }
            }

            & .content-bottom {
                gap: 8px;

                & .christmas-img-info {
                    position: relative;
                    border-radius: 15px;
                    overflow: hidden;

                    & img {
                        display: block;
                        width: 100%;
                        height: auto;
                    }

                    & .info-btn {
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        position: absolute;
                        bottom: 8px;
                        right: 8px;
                        width: 30px;
                        height: 30px;
                        background-color: rgba(115, 115, 115, 0.50);
                        border-radius: 50%;
                        color: #ffffff;
                        border: none;
                        font-weight: 700;
                        font-size: 20px;
                        line-height: 18px;
                        letter-spacing: -0.01em;
                        cursor: pointer;
                        z-index: 4;
                    }

                    & .info-overlay {
                        opacity: 0;
                        pointer-events: none;
                        position: absolute;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        background-color: rgba(0, 0, 0, 0.85);
                        padding: 12px;
                        border-radius: 15px;
                        z-index: 3;
                        transition: 0.1s linear;
                        display: flex;
                        align-items: flex-end;

                        & p {
                            color: #fff;
                            font-weight: 400;
                            font-size: 13px;
                            line-height: 13px;
                            margin: 0;
                        }
                    }

                    &.active .info-overlay {
                        opacity: 1;
                        pointer-events: auto;
                    }
                }

                & picture{
                    order: 3;
                    max-width: 184px;
                    position: relative;

                    &.christmas-info-wrapper {
                        & .info-btn {
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            position: absolute;
                            bottom: 8px;
                            right: 8px;
                            width: 24px;
                            height: 24px;
                            border-radius: 50%;
                            background-color: #a8ff00;
                            color: #000;
                            border: none;
                            font-family: 'Formular', sans-serif;
                            font-weight: 700;
                            font-size: 14px;
                            cursor: pointer;
                            z-index: 2;
                        }

                        & .info-overlay {
                            display: none;
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            background-color: rgba(0, 0, 0, 0.85);
                            padding: 12px;
                            border-radius: 15px;
                            z-index: 3;

                            & p {
                                color: #fff;
                                font-size: 12px;
                                line-height: 1.4;
                                margin: 0;
                            }
                        }

                        &.active .info-overlay {
                            display: flex;
                            align-items: center;
                        }
                    }
                }

                & .boom{
                    max-width: 176px;

                    & img{
                        margin-top: -25px;
                    }

                    & a{
                        & span{
                            font-size: 16px;
                            padding: 8px 14px;
                            white-space: nowrap;
                        }

                        &:after{
                            width: 36px;
                            height: 32px;
                        }
                    }
                }
            }
        }

        & .branding {
            gap: 8px;
            & .content-left {
                gap: 8px;
                & h3 {
                    flex-direction: column;
                    gap: 6px;
                    padding: 15px 7px;
                    font-size: 50px;
                    line-height: 0.90;

                    & span{
                        margin: 0;
                        font-size: 13px;
                        line-height: 13px;
                        letter-spacing: -0.02em;
                    }
                }
            }

            & .content-right {
                gap: 8px;
                & img {
                    max-width: 160px;
                    height: auto;
                }

                & p{
                    font-size: 13px;
                    line-height: 16px;
                    letter-spacing: -0.02em;
                    padding: 11px 13px;

                    &:after{
                        width: 25px;
                        height: 25px;
                        right: 6px;
                        bottom: 6px;
                    }
                }
            }
        }
    }

    .faq {
        padding-top: 19px;
        margin-top: 19px;
        border-top: 1px solid #FFFFFF;

        & h2{
            font-size: 36px;
            line-height: 36px;
        }

        & .faq-content {
            & .faq-list{
                width: 100%;
            }

            & .content-right{
                display: none;
            }

            &.mobile{
                display: flex!important;
                & .content-right{
                    display: flex;
                    width: 100%;
                }
            }
        }
    }

    .merchandise {
        padding-top: 43px;
        & h2{
            font-size: 36px;
            line-height: 36px;
        }

        & .merchandise-content {
            flex-direction: column;
            flex-wrap: nowrap;
            position: relative;
            gap: 20px;

            & .item{
                width: 100%;
                gap: 9px;

                &.boom{
                    order: 1;
                    & img{
                        position: absolute;
                        top: 30%;
                        z-index: -1;
                        left: -150px;
                    }

                    & a{
                        position: unset;
                        margin-top: 30px;
                    }
                }

                & .image-content {
                    & > div{
                        &:after{
                            content: "i";
                            width: 30px;
                            height: 30px;
                            position: absolute;
                            bottom: 6px;
                            right: 6px;
                            font-weight: 700;
                            font-size: 20px;
                            line-height: 18px;
                            letter-spacing: -0.01em;
                            color: #FFFFFF;
                            background-color: rgba(115, 115, 115, 0.50);
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            border-radius: 50%;
                        }
                    }

                    & h3 {
                        font-size: 16px;
                        line-height: 16px;
                        padding-top: 8px;
                        padding-right: 11px;
                        padding-bottom: 6px;
                        padding-left: 13px;
                    }

                    & .appear{
                        bottom: -1px;
                        background: none;
                        color: #FFFFFF;
                        font-size: 13px;
                        line-height: 13px;
                        letter-spacing: -0.01em;
                    }
                }

                & .under-image{
                    & p{
                        font-size: 13px;
                        line-height: 13px;
                        letter-spacing: -0.01em;
                        text-transform: unset;
                    }
                }
            }
        }
    }

    .form {
        padding-top: 64px;
        gap: 25px;
        & h2{
            font-size: 32px;
            line-height: 32px;
        }
        & form {
            & label {
                & input {
                    padding: 10px 0;
                    font-size: 16px;
                    line-height: 16px;
                }

                &:last-child{
                    padding: 5px 5px 5px 15px;
                }
            }

            & .divider{
                margin: 47px 0 28px;
            }
        }
    }

    footer{
        flex-direction: column;
        padding-top: 52px;
        max-width: 365px;

        & .content-left {
            width: 100%;
            & .menu {
                max-width: unset;
            }
        }
    }

    .marquee {
        padding: 20px 0 52px;
    }

    html.lang-ru {
        & .hero {
            & .hero-cards {
                & .card {
                    & .card-content {
                        & .card-tag {
                            font-size: 41px;
                        }

                        & .card-title {
                            max-width: 250px;
                        }
                    }
                }
            }
        }

        & .who-we-are {
            & h1 {
                font-size: 31px;
                line-height: 36px;
            }
        }

        & .gift-sets {
            & .gift-content {
                & .gift-item {
                    &.gift-item-3 {
                        min-height: unset;
                        width: 100%;
                        max-width: 180px;
                    }

                    &.gift-item-info {
                        width: 110%;
                        max-width: unset;

                        & h3 {
                            font-size: 30px;
                            line-height: .85;
                        }
                    }
                }
            }
        }

     & .directions {
            & .directions-content {
                &.type1 {
                    & .content-choose {
                        & p.directions-section-heading {
                            gap: 2px;
                            text-align: right;

                            & span{
                                text-align: left;
                            }
                        }
                    }
                }

                &.type2 {
                    & .content-choose {
                        & p.directions-section-heading {
                            line-height: 0.90;
                            letter-spacing: -0.02em;
                        }

                        & .directions-choose-descriptions h2.directions-choose-desc{
                            letter-spacing: -0.01em;
                        }
                    }
                }

                &.type3 {
                    & .content-choose {
                        & p.directions-section-heading {
                            font-size: 45px!important;
                            letter-spacing: -0.02em;
                        }

                        & .directions-choose-descriptions{
                            max-width: unset;
                        }
                    }
                }

                &.type4 {
                    & .content-choose {
                        & p.directions-section-heading {
                            margin-left: unset!important;
                            font-size: 33px!important;

                            & span{
                                margin-left: unset!important;
                            }
                        }
                    }
                }

                &.type5 {
                    & .content-choose {
                        & p.directions-section-heading {
                            display: none;
                        }
                        
                        & .directions-choose-descriptions{
                            position: unset;
                        }
                    }
                }
            }
        }

        & .info-blocks {
            & .christmas {
                & .content-top {
                    & .heading {
                        & h3 {
                            margin-left: unset!important;
                            font-size: 49px;
                            line-height: 0.90;
                            & p{
                                flex-direction: column;
                                align-items: flex-end;
                                gap: 10px;

                                & span{
                                    font-size: 13px;
                                    line-height: 13px;
                                    letter-spacing: -0.03em;
                                    max-width: 259px;
                                }
                            }
                        }
                    }
                }
            }

            & .branding {
                & .content-left {
                    & h3 {
                        font-size: 50px;
                        line-height: 0.90;
                        letter-spacing: -0.02em;
                        padding: 12px 15px;

                        & span{
                            font-size: 13px;
                            line-height: 13px;
                            letter-spacing: -0.02em;
                            margin-left: 0;
                        }
                    }

                    & img{
                        min-width: unset;
                    }
                }
                & .content-right {
                    & img {
                        max-width: calc(50% - 8px);
                    }
                    & p {
                        font-size: 10px;
                    }
                }
            }
        }

        & .faq {
            & h2 {
                font-size: 34px;
                line-height: 36px;
            }
        }

        & .merchandise {
            & h2 {
                font-size: 34px;
                line-height: 36px;
            }
        }
    }
}

@media screen and (max-width: 429px) {
    .marquee {
        padding: 0 0 20px;
    }

    .swiper {
        background: url(images/swiper-bg.png) center center / 330% no-repeat;
    }
}
