@import 'swiper/css';
@import url('glightbox/dist/css/glightbox.min.css');

*,:before,:after {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb
}

html {
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    font-family: 'Ubuntu', sans-serif;
    font-feature-settings: normal;
    font-variation-settings: normal;
    scroll-behavior: smooth;
}
body {
    margin: 0;
    line-height: inherit;
    background-color: #1B58B2;
    
}
a{
    text-decoration: none;
}
h1,h2,h3,h4,h5,h6, p{
    padding: 0;
    margin: 0;
}
ul,li{
    padding: 0;
    margin: 0;
}
h2{
    font-size: 40px;
    font-weight: 700;
    line-height: 46px;
    letter-spacing: -0.02em;
    color: #fff;
}

/* modal styles */

.modal-registration{
    border: none;
    outline: none;
    background-color: transparent;
    padding: 0;
    border-radius: 10px;
    &::-webkit-scrollbar{
        display: none;
    }
}
.modal-drive{
    border: none;
    outline: none;
    background-color: transparent;
    padding: 0;
    border-radius: 10px;
    &::-webkit-scrollbar{
        display: none;
    }
}
.close-btn{
    position: absolute;
    top: 20px;
    right: 20px;
    background-color: transparent;
    border: none;
    cursor: pointer;
    z-index: 11;
}
.drive{
    position: relative;
    z-index: 100;
    background: #2F6CC7;
    width: 878px;
    height: 440px;
    overflow: hidden;
    &-bg{
        position: absolute;
        object-fit: cover;
        object-position: center;
        top: -10px;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 10px;
    }
    &-content{
        position: relative;
        width: 878px;
        height: 440px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 25px;
        z-index: 10;
        &__item{
            max-width: 247px;
            width: 100%;
            text-align: center;

            &-img{
                margin-bottom: 32px;
                height: 72px;
            }
            &-text{
                padding: 20px;
                border: 1px solid #418EFF;
                width: 100%;
                height: 141px;
                text-align: left;
                color: #fff;
                font-size: 16px;
                font-weight: 400;
                line-height: 18px;
                letter-spacing: -0.02em;

                i{
                    font-family: Ubuntu;
                    font-size: 16px;
                    font-weight: 400;
                    line-height: 18.38px;
                    letter-spacing: -0.02em;
                    text-align: left;
                    color: #FCB64B;
                    font-style: normal;
                }
            }
        }
    }
}
.registration{
    position: relative;
    max-width: 740px;
    width: 100%;
    background: #2F6CC7;
    padding: 120px;
    z-index: 100;
    &-modalBg{
        position: absolute;
        object-fit: contain;
        bottom: -20px;
        left: -15px;
        right: 0;
        z-index: 0;
    }
    &-bg{
        position: absolute;
        z-index: 1;
        top: -100px;
        left: -10px;

    }
    &-content{
        position: relative;
        z-index: 10;
        max-width: 498px;
        display: inline-flex;
        flex-direction: column;
        label{
            font-size: 18px;
            font-weight: 700;
            line-height: 21px;
            letter-spacing: -0.02em;
            color: #fff;
            margin-bottom: 15px;
        }
        input{
            width: 100%;
            height: 60px;
            background-color: #fff;
            border: none;
            outline: none;
            font-size: 18px;
            font-weight: 300;
            line-height: 21px;
            letter-spacing: -0.02em;
            padding: 18px 24px;
            color: #000;
            border-radius: 3px;
            margin-bottom: 20px;
        }
        .double-field{
            display: flex;
            flex-direction: row;
            gap: 15px;
            align-items: center;

            .reg-gender, .reg-age{
                max-width: 242px;
                width: 100%;
            }
        }
        .reg-title{
            display: block;
            font-size: 18px;
            font-weight: 700;
            line-height: 21px;
            letter-spacing: -0.02em;
            color: #fff;
            margin-bottom: 15px;
        }
        .reg-select{
            width: 100%;
            height: 60px;
            border: none;
            outline: none;
            font-size: 18px;
            font-weight: 300;
            line-height: 21px;
            letter-spacing: -0.02em;
            padding: 18px 24px;
            margin-bottom: 20px;
        }
        .checkbox-field{
            display: flex;
            flex-direction: row;
            gap: 12px;
            align-items: center;
            margin-bottom: 90px;
            input{
                position: absolute;
                z-index: -1;
                opacity: 0;
            }
            label{
                display: inline-flex;
                align-items: center;
                user-select: none;
                font-family: Ubuntu;
                font-size: 16px;
                font-weight: 500;
                line-height: 18px;
                letter-spacing: -0.02em;
                color: #fff;
                cursor: pointer;
                a{  
                    margin-left: 8px;
                    color: #FCB64B;
                    &:hover{
                        text-decoration: underline;
                    }
                }
            }
            label::before {
                content: '';
                display: inline-block;
                width: 20px;
                height: 20px;
                flex-shrink: 0;
                flex-grow: 0;
                border: 2px solid #F49048;
                border-radius: 3px;
                margin-right: 12px;
                background-repeat: no-repeat;
                background-position: center center;
                background-size: 50% 50%;
            }
            input:checked+label::before {
                border-color: #F49048;
                background-color: #F49048;
                background-image: url("/assets/checkbox.png");
                background-repeat: no-repeat;
                background-position: center;
            }
        }
    }
    &-btn{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        font-family: 'Ubuntu', sans-serif;
        font-size: 18px;
        font-weight: 700;
        line-height: 21px;
        letter-spacing: -0.02em;
        text-transform: uppercase;
        color: #000;
        padding: 17px 50px;
        border: none;
        border-radius: 30px;
        background: linear-gradient(57.67deg, #F49048 -0.08%, #FFC656 90.79%);
        cursor: pointer;
    }
}

@media(max-width: 768px){
    .registration{
        padding: 90px 30px;
    }
    .registration-modalBg{
        object-fit: cover;
        object-position: center;
        left: -70px;
    }
    .registration-content .checkbox-field label{
        font-size: 12px;
    }
    .registration-content .checkbox-field label a{
        margin-left: 5px;
    }
    .drive{
        width: unset;
        height: unset;
    }
    .drive-content{
        padding: 90px 30px;
        flex-wrap: wrap;
        max-width: 768px;
        width: 100%;
        height: unset;
    }
}
@media(max-width: 575px){
    .registration{
        padding: 60px 15px;
    }
    .registration-bg{
        display: none;
    }
    .registration-modalBg{
        display: none;
    }
    .registration-content{
        width: 100%;
    }
    .registration-content .checkbox-field{
        margin-bottom: 30px;
    }
}
@media(max-width: 420px){
    .modal-registration{
        max-width: 100vw;
        height: 100svh;
        margin: 0;
    }
    .registration{
        height: auto;
        margin: 0;
    }
}

/* modal end styles */

.section-title{
    text-align: center;
}
.line-hr{
    max-width: 1230px;
    width: 100%;
    height: 1px;
    border: 1px dashed #418EFF;
    margin: 0 auto 96px;
}
@media(max-width: 575px){
    .section-title{
        font-size: 32px;
        line-height: 40px;
    }
}

/* header styles */

header{
    width: 100%;
    background: linear-gradient(192.99deg, #4885DE -20.15%, #1B58B2 98.52%);
}
.header-content{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    max-width: 1260px;
    width: 100%;
    padding: 16px 30px;
    margin: 0 auto;

    .header_mobile-menu{
        display: none;
    }

    &__nav{
        display: flex;
        flex-direction: row;
        gap: 36px;
        &-link{
            font-size: 14px;
            font-weight: 700;
            line-height: 16px;
            letter-spacing: -0.02em;
            text-transform: uppercase;
            color: #fff;
            transition: .2s ease-in-out;
            &:hover{
                color:#FCB64B;
            }
        }
    }
    &__btn{
        display: block;
        font-family: 'Ubuntu', sans-serif;
        padding: 11px 45px;
        font-size: 10px;
        font-weight: 700;
        line-height: 12px;
        letter-spacing: -0.02em;
        text-transform: uppercase;
        border: none;
        color: #000;
        background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
        border-radius: 30px;
        cursor: pointer;
    }
    &__user{
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #fff;
        border-radius: 50%;
        width: 43px;
        height: 43px;
        color: #fff;
        transition: .2s ease-in-out;
        &:hover{
            color: #FCB64B;
            border: 1px solid #FCB64B;
        }
    }
}

@media(max-width: 1280px){
    .header-content{
        padding: 16px 20px;
    
        &__nav{
            gap: 24px;
        }
        &__btn{
            padding: 11px 32px;
        }
    }
}
@media(max-width: 992px){
    .header-content{
        .header_mobile-menu{
            display: block;
        }
        &__nav{
            display: none;
        }
    }
    .header-content__btn{
        padding: 11px 24px;
    }
    .header_mobile-menu{
        display: none;
    }
    .open{
        overflow: hidden;
    }
    
    #menuToggle {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        position: relative;
        z-index: 1;
      }
      
      #menuToggle input
      {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 28px;
        height: 14px;
        position: absolute;
        opacity: 0;
        z-index: 2;
      }
    
      #menuToggle span{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 28px;
        height: 1px;
        margin-bottom: 5px;
        position: relative;
        background: #fff;
        border-radius: 3px;
        z-index: 1;
        -webkit-transform-origin: 5px 0px;
        -ms-transform-origin: 5px 0px;
        transform-origin: 5px 0px;
        -webkit-transition:background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        opacity 0.55s ease,
        -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
        transition: background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        opacity 0.55s ease,
        -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
        -o-transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        opacity 0.55s ease;
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        opacity 0.55s ease;
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
        opacity 0.55s ease,
        -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
        }
    
        #menuToggle span:first-child{
            transform-origin: 0% 0%;
        }
    
        #menuToggle span:nth-last-child(2){
            transform-origin: 0% 100%;
        }
      
      #menu{
        display: none;
        position: absolute;
        top: -30px;
        left: -20px;
        width: 250px;
        height: 100svh;
        padding: 20px;
        padding-top: 50px;
        // z-index: 2;
        background-color: #007aff;
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        list-style-type: none;
        -webkit-transition: opacity .3s ease-in;
        -o-transition: opacity .3s ease-in;
        transition: opacity .3s ease-in;
      }
      #menu a{
        font-family: 'Raleway Regular', sans-serif;
        font-size: 16px;
        max-width: 90px;
        color: var(--white);
        text-align: left;
      }
      .mobile_burger{
        z-index: 1;
      }
      .mobile_close_menu{
        position: absolute;
        top: 20px;
        right: 20px;
        z-index: 5;
      }
    .mobile_menu_button{
        font-family: 'Raleway Regular', sans-serif;
        font-size: 16px;
        max-width: 90px;
        color: var(--white);
        text-align: left;
    }
      
    #menu li{
        padding: 10px 0;
        color: #fff;
    }
    .header-content__nav-link{
        font-weight: 500;
    }
}

/* header styles end */



/* main styles */

.main{
    position: relative;
    margin-bottom: 120px;
    isolation: isolate;
    &-bg{
        position: absolute;
        object-fit: cover;
        width: 100%;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }
    &-content{
        max-width: 1260px;
        width: 100%;
        margin: 0 auto;
        padding: 0 30px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    &-logo{
       margin-top: 90px;
       margin-bottom: 48px;
    }
    &-data{
        display: flex;
        flex-direction: row;
        gap: 24px;
        align-items: center;
        margin-bottom: 210px;
        &__day, &__time{
            font-size: 40px;
            font-weight: 500;
            line-height: 46px;
            letter-spacing: -0.02em;
            color: #fff;
        }
        &__separator{
            width: 14px;
            height: 14px;
            background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
            border-radius: 50%;
        }
    }
    &-btn{
        font-family: 'Ubuntu', sans-serif;
        font-size: 18px;
        font-weight: 700;
        line-height: 21px;
        letter-spacing: -0.02em;
        padding: 17px 50px;
        border: none;
        border-radius: 30px;
        color: #000;
        background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
        margin-bottom: 180px;
        cursor: pointer;
    }
    &-subInfo{
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        font-family: 'Ubuntu Condensed', sans-serif;
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        color: #fff;
        &__location{
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 12px;
        }
    }
}

@media(max-width: 1280px){
    .main-logo{
        object-fit: contain;
        object-position: center;
        width: 80%;
        margin-top: 60px;
        margin-bottom: 60px;
    }
    .main-data{
        margin-bottom: 72px;
    }
    .main-btn{
        margin-bottom: 72px;
    }
    .main-subInfo{
        width: 80%;
    }
}
@media(max-width: 575px){
    .main{
        margin-bottom: 72px;
    }
    .main-logo{
        margin-top: 32px;
        margin-bottom: 32px;
    }
    .main-btn{
        margin-bottom: 48px;
    }
    .main-subInfo{
        width: 100%;
        font-size: 16px;
        line-height: 20px;
    }
    .main-data__day, .main-data__time{
        font-size: 24px;
        line-height: 30px;
    }
}
@media(max-width: 420px){
    .main-bg{
        height: 450px;
    }
    .main-logo{
        margin-top: 48px;
        margin-bottom: 60px;
    }
    .main-data{
        flex-direction: column;
        gap: 16px;
    }
    .main-data__separator{
        display: none;
    }
}


/* main styles end */



/* about styles */

.about{
    margin-bottom: 90px;
    &-content{
        max-width: 1260px;
        width: 100%;
        margin: 54px auto 100px; 
        padding: 0 30px;
        display: flex;
        flex-direction: row;
        gap: 100px;
        justify-content: center;
        &__item{
            position: relative;
            display: flex;
            flex-direction: column;
            gap: 8px;
            align-items: center;
            padding-top: 36px;
            width: 166px;
            height: 166px;
            color: #fff;
            border: 1px solid #fff;
            border-radius: 50%;
            .circle{
                position: absolute;
                width: 14px;
                height: 14px;
                border-radius: 50%;
            }
            #circle-1{
                background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
                left: 1px;
                top: 40px;
            }
            #circle-2{
                background: linear-gradient(57.63deg, #C4477B 30.21%, #FF7A92 109.12%);
                left: 6px;
                bottom: 31px;
            }
            #circle-3{
                background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
                right: -7px;
                top: 75px;
            }
            #circle-4{
                background: linear-gradient(57.63deg, #C4477B 30.21%, #FF7A92 109.12%);
                top: 12px;
                right: 21px;
            }
            &-title{
                font-size: 44px;
                font-weight: 700;
                line-height: 51px;
                letter-spacing: -0.02em;
            }
            &-description{
                font-size: 14px;
                font-weight: 400;
                line-height: 16px;
                letter-spacing: -0.02em;
                text-align: center;
            }
        }
    }
    &-subContent{
        max-width: 1260px;
        width: 100%;
        margin: 0 auto;
        padding: 0 30px;
        display: flex;
        flex-direction: row;
        gap: 70px;
        justify-content: space-between;
    }
    &-desctiption{
        font-size: 18px;
        font-weight: 300;
        line-height: 21px;
        letter-spacing: -0.02em;
        color: #fff;
        b{
            font-size: 16px;
            font-weight: 700;
            line-height: 18px;
            color: #EE6C8C;
        }
    }
}

@media(max-width: 992px){
    .about{
        margin-bottom: 60px;
    }
    .about-content{
        gap: 60px;
        padding: 0 20px;
    }
    .about-subContent{
        flex-direction: column-reverse;
        align-items: center;
        gap: 32px;
        padding: 0 20px;
    }
}
@media(max-width: 768px){
    .about-content{
        flex-wrap: wrap;
    }
}
@media(max-width: 575px){
    .about-video iframe{
        width: 90vw;
    }
    .about-content{
        margin: 32px auto 72px;
    }
}


/* about styles end */

.swiper{
    position: relative;
}
.swiper-grid > .swiper-wrapper {
    flex-wrap: wrap;
}
.swiper-area{
    position: relative;
}
.swiper-button-prev, .swiper-button-next{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: var(--swiperBtnSize);
    height: var(--swiperBtnSize);
    z-index: 10;
    color: #fff;
    transition: .2s ease-in-out;
    cursor: pointer;
    &:hover{
        color: #FCB64B;
    }
}
.swiper-button-prev{
    left: -50px;
}
.swiper-button-next{
    right: -50px;
}

/* event styles */

.event{
    position: relative;
    --swiperBtnSize: 16px;
    &-container{
        max-width: 1260px;
        width: 100%;
        margin: 0 auto 90px;
        padding: 0 30px;
        .event-content__img{
            width: 100%;
            object-fit: cover;
        }
    }
    &-bg{
        position: absolute;
        top: 100px;
        left: -80px;
        z-index: -1;
    }
    &-title{
        font-size: 30px;
        font-weight: 700;
        line-height: 35px;
        letter-spacing: -0.02em;
        color: #fff;
        margin-bottom: 95px;
        text-align: center;
    }
}

@media(max-width: 1280px){
    .event-title{
        margin-bottom: 32px;
    }
    .event-container{
        max-width: 1160px;
    }
}

@media(max-width: 992px){
    .event-container{
        width: 90%;
    }
}
@media(max-width: 575px){
    .event-bg{
        display: none;
    }
    .swiper-button-prev{
        left: -30px;
    }
    .swiper-button-next{
        right: -30px;
    }
}
/* event styles end */



/* forWho styles */

.forWho{
    &-content{
        max-width: 1260px;
        width: 100%;
        margin: 80px auto 76px;
        padding: 0 30px;
        display: flex;
        flex-direction: row;
        gap: 66px;
        justify-content: space-between;
        &__item{
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            gap: 24px;
            max-width: 240px;
            width: 100%;
            color: #fff;
            &-img{
                height: 132px;
            }
            &-title{
                height: 48px;
                font-size: 22px;
                font-weight: 700;
                line-height: 26px;
                letter-spacing: -0.02em;
            }
        }
    }
}

@media(max-width: 1280px){
    .forWho-content{
        padding: 0 20px;
        flex-wrap: wrap;
        justify-content: center;
        gap: 60px;
    }
}
@media(max-width: 575px){
    .forWho-content{
        margin: 32px auto 72px;
    }
    .forWho-content__item{
        gap: 16px;
    }
    .forWho-content__item-title{
        height: auto;
    }
}

/* forWho styles end */



/* headliner styles */

.headliner{
    position: relative;
    &-mainBg{
        position: absolute;
        object-fit: cover;
        width: 100%;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }
    &-bg{
        position: absolute;
        top: 400px;
        right: 0;
    }
    &-content{
        max-width: 700px;
        width: 100%;
        margin: 96px auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        border: 2px solid #418EFF;
        padding: 40px;
    }
    &-name{
        font-size: 30px;
        font-weight: 500;
        line-height: 35px;
        letter-spacing: -0.02em;
        color: #fff;
        margin-bottom: 20px;
    }
    .headliner-line{
        width: 62px;
        margin: 0 auto;
        border: 1px solid #FCB64B;
        margin-bottom: 20px;
    }
    &-description{
        font-size: 18px;
        font-weight: 300;
        line-height: 21px;
        letter-spacing: -0.02em;
        text-align: center;
        color: #fff;
        max-width: 460px;
    }
}


.headliner-content__no-info{
    max-width: 1120px;
    width: 100%;
    margin: 96px auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #fff;
}
.headliner-content__info{
    display: flex;
    flex-direction: column;
    gap: 28px;
    h3{
        font-size: 30px;
        font-weight: 700;
        line-height: 35px;
        letter-spacing: -0.02em;
    }
    p{
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        letter-spacing: -0.02em;
    }
}

@media(max-width: 1280px){
    .headliner-content__no-info{
        max-width: 1060px;
        padding: 0 20px;
        margin: 60px auto;
        justify-content: space-between;
    }
    .headliner-content__info{
        max-width: 400px;
        flex-shrink: 0;
    }
    .headliner-img__no-info{
        display: block;
        max-width: 700px;
        width: 50%;
        height: auto;
        object-fit: cover;
        object-position: center;
    }
    .headliner-bg{
        top: 450px;
        width: 40%;
    }
    .line-hr{
        margin-bottom: 60px;
        width: 80%;
    }
}
@media(max-width: 768px){
    .headliner-content__no-info{
        flex-direction: column-reverse;
        margin-top: 8px;
    }
    .headliner-img__no-info{
        width: 70%;
    }
    .headliner-content__info{
        align-items: center;
        text-align: center;
    }
}
@media(max-width: 575px){
    .headliner-bg{
        display: none;
    }
}

/* headliner styles end */



/* programm styles */

.programm{ 
    &-filter{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        max-width: 1260px;
        width: 100%;
        margin: 56px auto 40px;
        padding: 0 30px;
        color: #fff;
        &__item{
            display: flex;
            flex-direction: row;
            gap: 18px;
            align-items: center;
            &-format{
                display: flex;
                flex-direction: row;
                gap: 10px;

                .format-item{
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    font-size: 12px;
                    font-weight: 400;
                    line-height: 14px;
                    letter-spacing: -0.02em;
                    text-align: center;
                    color: #fff;
                    width: 77px;
                    height: 77px;
                    text-align: center;
                    border: 1px solid #FF8B37; 
                    border-radius: 50%;
                    // border-image-source: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
                }
                .active-format{
                    background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
                    color: #000;
                }
            }
            select{
                background: url('./assets/select-btn.png') no-repeat;
                background-position: 100% 50%;
                padding: 10px 10px;
                outline: 0px;
                appearance: none;
                font-size: 18px;
                font-weight: 300;
                line-height: 21px;
                letter-spacing: -0.02em;
                color: #fff;
                cursor: pointer;

                option{
                    color: #000;
                }
            }
            #select-1{
                width: 200px;
            }
            #select-2{
                width: 250px;
            }
        }
    }
    &-content{
        display: flex;
        flex-direction: column;
        gap: 12px;
        max-width: 1260px;
        width: 100%;
        margin: 0 auto 96px;
        padding: 0 30px;
    }
    &-row{
        display: flex;
        flex-direction: row;
        gap: 12px;
        &__small{
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            height: auto;
            font-family: 'Ubuntu Condensed', sans-serif;
            font-size: 24px;
            font-weight: 400;
            line-height: 28px;
            width: 118px;
            border-radius: 3px;
            color: #fff;
            background: #2F6CC7;
        }
        &__medium{
            position: relative;
            display: flex;
            flex-direction: column;
            gap: 32px;
            justify-content: space-between;
            width: 260px;
            color: #fff;
            padding: 28px 20px;
            border-radius: 3px;
            background: #2F6CC7;
            .like{
                position: absolute;
                top: 10px;
                right: 14px;
                cursor: pointer;
            }
        }
        &__big{
            width: 802px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 40px;
            font-size: 22px;
            font-weight: 400;
            line-height: 25px;
            letter-spacing: -0.02em;
            border-radius: 3px;
            color: #fff;
            background: #2F6CC7;
        }
        &__mega{
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 48px;
            width: 100%;
            height: 145px;
            border-radius: 3px;
            font-size: 22px;
            font-weight: 400;
            line-height: 25px;
            letter-spacing: -0.02em;
            color: #fff;
            background: #2F6CC7;
        }
        .row-award{
            height: 135px;
            color: #000;
            background-image: url('/assets/award-bg.png');
        }
        .row-afterparty{
            height: 135px;
            background-image: url('/assets/afterparty-bg.png');
        }
        &__category{
            margin-top: 15px;
            font-size: 12px;
            font-weight: 400;
            line-height: 14px;
            letter-spacing: -0.02em;
            text-align: left;
            color: #FCB64B;
        }
        &__location{
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 12px;
            justify-content: center;
            font-size: 14px;
            font-weight: 700;
            line-height: 16px;
            letter-spacing: -0.02em;
            color: #FCB64B;
        }
        &__content{
            display: flex;
            flex-direction: column;
            gap: 24px;
            &-title{
                font-size: 16px;
                font-weight: 700;
                line-height: 18px;
                letter-spacing: -0.02em;
            }
        }
        &__list{
            display: flex;
            flex-direction: column;
            gap: 12px;
            list-style-type: none;
            &-line{
                display: block;
                width: 100%;
                border: 1px dashed #6DA8FF;
            }
            &-item{
                font-size: 14px;
                font-weight: 400;
                line-height: 16px;
                letter-spacing: -0.02em;
                padding-left: 10px;
                margin-left: 5px;
                &::marker{
                    content: '•';
                    background-color: #fff;
                }
            }
        }

        &__title{
            display: flex;
            flex-direction: row;
            gap: 12px;
            &-item{
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                font-size: 14px;
                font-weight: 700;
                line-height: 16px;
                letter-spacing: -0.02em;
                text-transform: uppercase;
                text-align: center;
                height: 82px;
                border: 1px solid #FF8B37;
                border-radius: 3px;
                padding: 21px 37px;
                color: #FCB64B;
                background: #2F6CC7;
            }
            .title-with-text{
                width: 260px;
                padding: 10px;
            }
        }
    }
}



.programm-content__no-info{
    max-width: 1260px;
    width: 100%;
    margin: 36px auto 96px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 72px;
    color: #fff;
}
.programm-content__info{
    display: flex;
    flex-direction: column;
    gap: 20px;
    h3{
        font-size: 30px;
        font-weight: 700;
        line-height: 35px;
        letter-spacing: -0.02em;
    }
    p{
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        letter-spacing: -0.02em;
    }
}

@media(max-width: 1280px){
    .programm-content__no-info{
        padding: 0 20px;
        margin-bottom: 60px;
    }
    .programm-img__no-info{
        width: 50%;
        height: auto;
        object-fit: cover;
        object-position: center;
    }
}
@media(max-width: 768px){
    .programm-content__no-info{
        flex-direction: column;
        gap: 24px;
        margin-top: 8px;
    }
    .programm-img__no-info{
        width: 70%;
    }
    .programm-content__info{
        align-items: center;
        text-align: center;
    }
}


/* programm styles end */



/* speakers styles */

.speakers{
    position: relative;
    &-container{
        max-width: 1260px;
        width: 100%;
        margin: 96px auto;
    }
    &-bg{
        position: absolute;
        object-fit: cover;
        width: 100%;
        top: -100px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }
    &-content{
        display: flex;
        flex-direction: column;
        gap: 32px;
        max-width: 1260px;
        width: 100%;
        margin: 96px auto;
    }
    &-row{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        gap: 24px;
    }
}
.speakers-item{
    position: relative;
    width: 100%;
    position: relative;
    margin-top: 200px;
    border: 1px solid #418EFF;
    color: #fff;

    &__image{
        width: 100%;
        margin-top: -50%;
        margin-bottom: 30px;
    }

    &__name{
        font-size: 18px;
        font-weight: 700;
        line-height: 21px;
        letter-spacing: -0.02em;
        text-align: center;
        margin-bottom: 32px;
        height: 42px;
    }
    &__info{
        font-size: 16px;
        font-weight: 300;
        line-height: 18px;
        letter-spacing: -0.02em;
        text-align: center;
        height: 78px;
        padding: 0 20px;
        margin-bottom: 30px;
    }
}

.speakers-content__no-info{
    max-width: 1260px;
    width: 100%;
    margin: 36px auto 96px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    color: #fff;
    h3{
        font-size: 30px;
        font-weight: 700;
        line-height: 35px;
        letter-spacing: -0.02em;
    }
}



@media(max-width: 1280px){
    .speakers-content__no-info{
        padding: 0 20px;
        margin-bottom: 60px;
    }
    .speakers-img__no-info{
        width: 90%;
    }
}

/* speakers styles end */


/* award styles */

.award{
    position: relative;
    &-awardBg{
        position: absolute;
        object-fit: cover;
        width: 100%;
        top: -200px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }
    &-content{
        max-width: 1260px;
        width: 100%;
        margin: 96px auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        &__info{
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            gap: 70px;
            margin-bottom: 120px;
            &-text{
                font-size: 18px;
                font-weight: 400;
                line-height: 21px;
                letter-spacing: -0.02em;
                color: #fff;
                max-width: 520px;
            }
        }
        &__btn{
            font-family: 'Ubuntu', sans-serif;
            font-size: 18px;
            font-weight: 700;
            line-height: 21px;
            letter-spacing: -0.02em;
            text-transform: uppercase;
            color: #000;
            background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
            padding: 17px 50px;
            border-radius: 30px;
        }
    }
}

@media(max-width: 1280px){
    .award-content{
        margin: 60px auto;
        padding: 0 20px;
    }
    .award-content__info{
        flex-direction: column-reverse;
        align-items: center;
        gap: 32px;
        margin-bottom: 60px;
    }
    .award-content__info-text{
        max-width: 700px;
        width: 100%;
    }
}
@media(max-width: 575px){
    .award-content__info-video iframe{
        width: 90vw;
    }
    .award-content__btn{
        font-size: 14px;
        line-height: 18px;
    }
}


/* award styles end */


/* organizers styles */

.organizers{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    &-bg{
        position: absolute;
        top: -30px;
        left: 0;
        z-index: -1;
    }
    &-img{
        margin: 120px 0;
    }
}

@media(max-width: 1280px){
    .organizers-bg{
        width: 40%;
    }
    .organizers-img{
        margin: 60px 0 96px;
    }
}

/* organizers styles end */


/* partners styles */

.partners{
    margin-bottom: 90px;
    &-content{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 32px;
        max-width: 1260px;
        width: 100%;
        margin: 96px auto 0;
        padding: 0 30px;
        &__item{
            position: relative;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            width: 250px;
            height: 105px;
            border: 1px solid #418EFF;
            border-radius: 3px;
            &-general{
                position: absolute;
                right: 5px;
                bottom: -18px;
                font-size: 10px;
                font-weight: 400;
                line-height: 11px;
                letter-spacing: -0.02em;
                background: linear-gradient(57.63deg, #C4477B 30.21%, #FF7A92 109.12%);
                padding: 3px 8px;
                color: #fff;
            }
        }
    }
}

@media(max-width: 1280px){
    .partners-content{
        margin: 60px auto 96px;
        justify-content: center;
        padding: 0 20px;
    }
}

/* partners styles end */


/* info-partners styles */

.info-partners{
    &__content{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 32px;
        max-width: 1260px;
        width: 100%;
        margin: 96px auto;
        padding: 0 30px;
    }
}

@media(max-width: 1280px){
    .info-partners__content{
        margin: 60px auto 96px;
        justify-content: center;
        padding: 0 20px;
    }
}

/* info-partners styles end */


/* faq styles */

.faq{
    position: relative;
    &-bg{
        position: absolute;
        object-fit: cover;
        width: 100%;
        top: -100px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }
    &-content{
        max-width: 1060px;
        width: 100%;
        margin: 96px auto;
        display: flex;
        flex-direction: column;
        gap: 32px;
        summary::-webkit-details-marker{display:none;}
        summary::-moz-list-bullet{list-style-type:none;}
        summary::marker{display:none;} 
        summary {
            position: relative;
            display: flex;
            flex-direction: row;
            width: 100%;
            // justify-content: ;
            align-items: center;
            padding: 0;
            font-size: 30px;
            font-weight: 700;
            line-height: 34px;
            letter-spacing: -0.02em;
            color: #fff;
            cursor: pointer;
        }
        summary:after {  
            content: url('/assets/summaryBtn-close.png');
            position: absolute;
            right: 0;
        }
        details[open] > summary{
            color: #FCB64B;
        }
        details[open] > summary:after {
            content: url('/assets/summaryBtn-open.png');
        }
        summary:before{
            content: '';
            width: 12px;
            height: 12px;
            margin-right: 20px;
            background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
            border-radius: 50%;
        }
        &__item{
            display: flex;
            flex-direction: row;
            align-items: center;
            max-width: 1000px;
            width: 100%;
            &-text{
                padding: 48px 60px;
                border: 1px solid #FF8B37;
                border-radius: 3px;
                margin-top: 30px;
                margin-left: 32px;
                font-size: 16px;
                font-weight: 300;
                line-height: 18px;
                letter-spacing: -0.02em;
                color: #fff;
                b{
                    font-weight: 700;
                }
            }
        }
    }
}

@media(max-width: 1280px){
    .faq-content{
        max-width: 960px;
        margin: 60px auto 96px;
        padding: 0 20px;
    }
}

@media(max-width: 768px){
    .faq-content summary{
        font-size: 20px;
        line-height: 24px;
    }
    .faq-content__item-text{
        padding: 30px;
    }
}
@media(max-width: 420px){
    summary:before{
        display: none;
    }
    .faq-content summary{
        font-size: 14px;
        line-height: 18px;
    }
    .faq-content__item-text{
        margin-left: 0;
        padding: 20px;
    }
}

/* faq styles end */


/* scheme styles */

.scheme{
    display: flex;
    flex-direction: column;
    align-items: center;
    &-img{
        margin-top: 96px;
        margin-bottom: 96px;
    }
}

@media(max-width: 1280px){
    .scheme-img{
        margin-top: 60px;
        padding: 0 20px;
        width: 90%;

    }
}

/* scheme styles end */



/* contacts styles */

.contacts{
    position: relative;
    &-bg{
        position: absolute;
        right: 0;
        top: -250px;
        z-index: -1;
    }
    &-content{
        max-width: 1060px;
        width: 100%;
        margin: 96px auto;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        &__item{
            display: flex;
            flex-direction: column;
            align-items: center;
            &-img{
                margin-bottom: 32px;
            }
            &-text{
                font-size: 16px;
                font-weight: 400;
                line-height: 18px;
                letter-spacing: -0.02em;
                color: #FCB64B;
                text-align: center;
                margin-bottom: 24px;
            }
            .adress-field{
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: 24px;
                &__text{
                    font-size: 24px;
                    font-weight: 400;
                    line-height: 28px;
                    letter-spacing: -0.02em;
                    color: #fff;
                }
                &__metro{
                    display: flex;
                    flex-direction: column;
                    gap: 10px;
                    max-width: 300px;
                    width: 100%;
                    &-item{
                        display: flex;
                        flex-direction: row;
                        justify-content: space-between;
                        align-items: center;
                        .metro-name{
                            display: flex;
                            flex-direction: row;
                            gap: 14px;
                            align-items: center;
                            font-size: 16px;
                            font-weight: 500;
                            line-height: 18px;
                            letter-spacing: -0.02em;
                            color: #fff;
                        }
                        .metro-distance{
                            display: flex;
                            flex-direction: row;
                            gap: 14px;
                            align-items: center;
                            font-size: 16px;
                            font-weight: 500;
                            line-height: 18px;
                            letter-spacing: -0.02em;
                            color: #FCB64B;
                        }
                    }
                }
            }
        }
    }
    &-link{
        font-size: 24px;
        font-weight: 400;
        line-height: 28px;
        letter-spacing: -0.02em;
        color: #fff;
        transition: .2s ease-in-out;
        &:hover{
            color: #FF8B37;
        }
    }
    &-btn{
        font-size: 18px;
        font-weight: 700;
        line-height: 21px;
        letter-spacing: -0.02em;
        border: none;
        color: #000;
        background: linear-gradient(66.65deg, #FF8B37 16.85%, #FAC04F 76.58%);
        padding: 17px 50px;
        border-radius: 30px;
        text-transform: uppercase;
        cursor: pointer;
    }
}

@media(max-width: 1280px){
    .contacts-content{
        padding: 0 20px;
        margin-top: 60px;
    }
    .contacts-bg{
        width: 40%;
        top: -150px;
    }
}
@media(max-width: 768px){
    .contacts-content{
        flex-direction: column;
        gap: 60px;
    }
}

/* contacts styles end */



/* map styles */

.map{
    position: relative;
    &-img{
        object-fit: cover;
        width: 100%;
        height: 530px;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
    &-btn{
        position: absolute;
        z-index: 2;
        bottom: 50px;
        left: 50%;
        transform: translateX(-50%);
        font-size: 18px;
        font-weight: 700;
        line-height: 21px;
        letter-spacing: -0.02em;
        text-transform: uppercase;
        color: #fff;
        background: linear-gradient(57.63deg, #C4477B 30.21%, #FF7A92 109.12%);
        padding: 17px 50px;
        border: none;
        border-radius: 30px;
        cursor: pointer;
    }
}
@media(max-width: 768px){
    .map-img{
        height: 400px;
    }
}
@media(max-width: 575px){
    .map-btn{
        font-size: 14px;
        line-height: 18px;
        text-wrap: nowrap;
    }
}

/* map styles end */



/* footer styles */

.footer{
    position: relative;
    height: 130px;
    background-image: url("./assets/footer-bg.png");
    background-position: center;
    &-content{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 0 30px;
        &__text{
            padding-top: 44px;
            font-size: 14px;
            font-weight: 400;
            line-height: 18px;
            letter-spacing: -0.02em;
            color: #fff;
        }
    }
}
@media(max-width: 768px){
    .footer-content{
        text-align: center;
    }
}

/* footer styles end */