/*-------------------
    Global styles
-------------------*/
:root
{
    --bg: #040404;
    --bg_white: #fff;
    --bg_brown: #210d07;
    --cont_padding: 24px;
    --cont_padding_double: calc(var(--cont_padding) * 2);
    --cont_padding_half: calc(var(--cont_padding) * .5);
    --content_width: 1160px;
    --scroll_width: 17px;
    --custom_scroll_width: 10px;
    --custom_scroll_height: 10px;
    --custom_scroll_border_radius: 0;
    --custom_scroll_scrollbar_color: var(--bg);
    --custom_scroll_scrollbar_thumb_color: var(--primary_color);
    --primary_color: #e9430e;
    --dark_color: #040404;
    --light_color: #fff;
    --font_size_xl: 20px;
    --font_size_l: 18px;
    --font_size: 16px;
    --font_size_s: 14px;
    --font_size_title_l: 54px;
    --font_size_title: 45px;
    --font_size_title_s: 40px;
    --font_size_title_xs: 30px;
    --font_family_primary: 'Futura PT', 'Arial', sans-serif;
    --font_family_secondary: 'Manrope', 'Arial', sans-serif;
    --block_head_offset: 32px;
    --block_padding_l: 48px;
    --block_padding: 40px;
    --block_padding_s: 30px;
    --outside_gap: 80px;
    --outside_gap_s: 60px;
    --inner_gap_l: 24px;
    --inner_gap: 20px;
    --inner_gap_s: 16px;
    --inner_gap_xs: 12px;
    --inner_gap_xxs: 8px;
    --zero_px: calc(0 * 1px);
}


::selection
{
    color: var(--light_color);
    background: var(--primary_color);
}

::-moz-selection
{
    color: var(--light_color);
    background: var(--primary_color);
}


html
{
    height: 100%;
    min-height: -moz-available;
    min-height: -webkit-fill-available;
    min-height:         fill-available;
}


body
{
    height: 100%;
    min-height: -moz-available;
    min-height: -webkit-fill-available;
    min-height:         fill-available;

    font-family: var(--font_family_primary);
    font-size: var(--font_size);
    font-weight: 400;
    line-height: normal;

    color: var(--light_color);


    &.lock
    {
        overflow: clip;

        margin-right: var(--scroll_width);
    }
}


button
{
    display: inline-block;

    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;

    cursor: pointer;
    vertical-align: top;
    letter-spacing: inherit;

    color: inherit;
    border: none;
    background: none;
}


.wrap
{
    position: relative;

    display: flex;
    overflow: clip;
    flex-direction: column;

    min-height: 100%;

    background: var(--bg);


    & > .main
    {
        position: relative;

        display: flex;
        flex: 1 0 auto;
        flex-direction: column;
    }
}


.cont
{
    width: 100%;
    max-width: calc(var(--content_width) + var(--cont_padding_double));
    margin-inline: auto;
    padding-inline: var(--cont_padding);
}


img.cover
{
    display: block;

    width: 100%;
    height: 100%;

    border-radius: inherit;

    object-fit: cover;
}



/*-------------------
    Custom scroll
-------------------*/
@media (hover: hover)
{
    html ::-webkit-scrollbar
    {
        width: var(--custom_scroll_width);
        height: var(--custom_scroll_height);

        border-radius: var(--custom_scroll_border_radius);
        background-color: var(--bg);
    }


    html ::-webkit-scrollbar-thumb
    {
        border-radius: var(--custom_scroll_border_radius);
        background-color: var(--custom_scroll_scrollbar_thumb_color);
    }
}



/*--------------
    Grid row
--------------*/
.grid_row
{
    display: flex;
    align-content: stretch;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: flex-start;

    margin-bottom: calc(var(--gap_y) * -1);
    margin-left: calc(var(--gap_x) * -1);

    --items_per_line: 3;
    --gap_x: var(--inner_gap);
    --gap_y: var(--inner_gap);


    &.centered
    {
        justify-content: center;
    }


    & > *
    {
        width: calc(100% / var(--items_per_line) * var(--width_multiplier, 1) - var(--gap_x));
        margin-bottom: var(--gap_y);
        margin-left: var(--gap_x);
    }
}



/*---------------
    Accordion
---------------*/
.accordion
{
    display: flex;
    flex-direction: column;
    gap: var(--inner_gap);

    width: 760px;
    max-width: 100%;
    margin-inline: auto;

    counter-reset: number;
}


.accordion_item
{
    background: var(--bg_brown);


    .head
    {
        display: flex;
        align-content: center;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;

        min-height: 70px;
        padding-block: var(--inner_gap_xxs);
        padding-inline: var(--inner_gap);

        cursor: pointer;


        .number
        {
            width: 64px;

            font-size: 50px;
            font-weight: 700;
            line-height: 1;

            text-align: center;

            color: var(--primary_color);


            &:before
            {
                content: counter(number);
                counter-increment: number;
            }
        }


        .day
        {
            display: flex;
            align-content: center;
            align-items: center;
            flex-direction: column;

            font-size: 12px;
            font-weight: 500;
            line-height: 75%;

            text-align: center;

            color: var(--primary_color);
        }


        .title
        {
            width: calc(100% - 162px);
            margin-inline: auto;

            font-size: var(--font_size_l);
            font-weight: 500;

            text-transform: uppercase;
        }


        .arr
        {
            display: block;

            width: 15px;
            height: 19px;

            transition: .2s linear;
        }
    }


    .data
    {
        display: none;

        padding-block: var(--inner_gap_xxs) var(--inner_gap);
        padding-inline: var(--inner_gap);
    }


    &.active
    {
        .head
        {
            .arr
            {
                transform: rotate(180deg);
            }
        }
    }
}



/*------------
    Header
------------*/
header
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    padding-block: var(--block_padding);

    z-index: 10;


    .cont
    {
        display: flex;
        align-content: center;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;
    }


    .logo
    {
        display: block;

        margin-right: auto;

        font-size: 20px;
        font-weight: 500;
        line-height: 125%;

        text-decoration: none;
        text-transform: uppercase;

        color: var(--primary_color);
    }


    .dates
    {
        font-size: var(--font_size_xl);
        font-weight: 500;
        line-height: 150%;
    }


    .location
    {
        display: flex;
        align-content: center;
        align-items: center;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 6px;

        margin-left: var(--block_padding_l);

        font-family: var(--font_family_secondary);
        font-size: var(--font_size_s);


        .icon
        {
            display: block;

            width: 7px;
            margin-top: 2px;

            aspect-ratio: 1 / 1;
        }
    }



    .links
    {
        display: flex;
        align-content: center;
        align-items: center;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: var(--inner_gap_l);

        margin-left: var(--block_padding);

        font-family: var(--font_family_secondary);
        font-size: var(--font_size_s);


        a
        {
            text-decoration: none;

            color: currentColor;
            transition: 0.2s;

            &:hover{
                color: var(--primary_color);
            }
        }
    }
}



/*----------------
    Block head
----------------*/
.block_head
{
    display: flex;
    flex-direction: column;
    gap: 45px;

    margin-bottom: var(--block_head_offset);


    &.center
    {
        align-content: center;
        align-items: center;

        text-align: center;
    }


    .title
    {
        font-size: var(--font_size_title);
        font-weight: 500;

        text-transform: uppercase;
    }


    .desc
    {
        font-size: var(--font_size_xl);
        font-weight: 500;
    }
}



/*-------------------
    First section
-------------------*/
.first_section
{
    position: relative;


    .cont
    {
        position: relative;

        display: flex;
        align-content: flex-end;
        align-items: flex-end;
        flex-direction: column;
        justify-content: center;

        min-height: 800px;
        padding-block: 164px;

        z-index: 3;
    }


    .data
    {
        display: flex;
        flex-direction: column;

        width: 628px;
        max-width: 100%;

        text-align: center;
    }


    .title
    {
        font-size: var(--font_size_title_l);
        font-weight: 500;
        line-height: 120%;

        text-transform: uppercase;

        color: var(--primary_color);
    }


    .desc
    {
        margin-top: var(--inner_gap_xs);

        font-size: 22px;
        line-height: 150%;
    }


    .btn
    {
        text-decoration: none;
        color: #fff;
        width: 380px;
        max-width: 100%;
        height: 80px;
        margin-inline: auto;
        margin-top: 51px;
        padding-block: var(--inner_gap_s);
        padding-inline: var(--block_padding_s);

        font-weight: 500;
        line-height: 52px;

        letter-spacing: .48px;

        border-radius: 28px;
        background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), linear-gradient(90deg, var(--primary_color) .06%, #fe754b 49.7%, var(--primary_color) 99.34%), var(--primary_color);
        transition: 0.2s;
        overflow: hidden; 
        position: relative;
        &:hover{
            opacity:0.8;
        }

        &:after {
            content: '';
            position: absolute;
            top: 0; left: -50px;
            width: 40px; height: 100%;
            background: rgba(255, 255, 255, 0.4);
            transform: skewX(-30deg);
            animation: shine-move 3s infinite linear;
        }
 
    }


    .exp
    {
        margin-top: 10px;

        font-size: var(--font_size_s);
        line-height: 150%;

        letter-spacing: .42px;
    }


    .image
    {
        position: absolute;
        top: 0;
        left: 0;

        display: block;

        height: 100%;

        z-index: 1;
        pointer-events: none;


        img
        {
            display: block;

            height: 100%;
        }
    }
}



/*-----------------
    Price timer
-----------------*/
.price_timer
{
    padding-block: var(--outside_gap);

    color: var(--dark_color);
    background: var(--bg_white);


    .timer
    {
        display: flex;
        align-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--outside_gap_s);

        color: var(--primary_color);


        .val
        {
            font-size: var(--font_size_title);
            font-weight: 500;

            text-transform: uppercase;
        }


        .exp
        {
            font-size: var(--font_size_xl);
            font-weight: 500;
            line-height: 130%;
        }
    }
}



/*-----------
    Stats
-----------*/
.stats
{
    position: relative;

    min-height: 605px;
    padding-block: var(--outside_gap);


    .cont
    {
        position: relative;

        z-index: 3;
    }


    .items
    {
        display: flex;
        flex-direction: column;
        gap: 45px;

        width: fit-content;
        margin-left: auto;

        text-align: center;


        .val
        {
            font-size: var(--font_size_title_s);
            font-weight: 500;

            text-transform: uppercase;

            color: var(--primary_color);
        }


        .label
        {
            font-size: var(--font_size_xl);
            font-weight: 500;
        }
    }


    .image
    {
        position: absolute;
        top: 0;
        left: 50%;

        display: block;

        width: 1251px;
        margin-left: -960px;

        z-index: 1;
        pointer-events: none;


        img
        {
            display: block;

            width: 100%;

            height: auto;
        }
    }
}



/*--------------
    For whom
--------------*/
.for_whom
{
    padding-block: 68px 90px;


    .block_head
    {
        margin-bottom: 57px;


        .title        
        {
            z-index: 100;
            span
            {
                display: block;

                margin-left: 51px;

                color: var(--primary_color);
            }
        }
    }


    .grid_row
    {
        --items_per_line: 2;
        --gap_x: var(--block_padding);
        --gap_y: var(--block_padding);
    }


    .list
    {
        display: flex;
        flex-direction: column;
        gap: var(--inner_gap);


        .item
        {
            display: flex;
            align-content: flex-start;
            align-items: flex-start;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: var(--inner_gap);

            padding: 5px;

            line-height: 130%;

            color: var(--dark_color);
            border-radius: 10px;
            background: var(--bg_white);


            &:nth-child(2n)
            {
                .thumb
                {
                    order: 2;
                }
            }


            .thumb
            {
                display: block;

                width: 168px;
                max-width: 100%;
                height: 82px;

                border-radius: 8px;


                & + *
                {
                    align-self: center;

                    width: calc(100% - 168px - var(--inner_gap));
                }
            }


            b
            {
                font-weight: 500;

                color: var(--primary_color);
            }
        }
    }


    .slider
    {
        overflow: hidden;


        .swiper
        {
            overflow: visible;

            --spaceBetween: var(--inner_gap);
            --slidesPerView: 1;
        }


        .item
        {
            display: flex;
            flex-direction: column;
            gap: var(--inner_gap);

            padding: 10px;

            line-height: 130%;

            text-align: center;

            color: #1f1f1f;
            color: var(--dark_color);
            border-radius: 10px;
            background: var(--bg_white);


            .thumb
            {
                display: block;

                border-radius: 8px;

                aspect-ratio: 1 / .359;


                & + *
                {
                    padding-block: 0 10px;
                    padding-inline: var(--inner_gap);
                }
            }


            b
            {
                font-weight: 500;

                color: var(--primary_color);
            }
        }
    }
}



/*-------------
    Reviews
-------------*/
.reviews
{
    padding-block: var(--outside_gap) 154px;


    .block_head
    {
        margin-bottom: 45px;


        .title
        {
            span
            {
                display: block;

                margin-left: 121px;

                color: var(--primary_color);
            }
        }
    }


    .swiper
    {
        overflow: visible;

        padding-inline: 62px;

        --spaceBetween-0: var(--inner_gap_xs);
        --slidesPerView-0: auto;
        --spaceBetween-768: var(--inner_gap);
        --slidesPerView-768: 3;
        --spaceBetween-1024: var(--inner_gap);
        --slidesPerView-1024: 4;


        &:not(.swiper-initialized)
        {
            .swiper-wrapper
            {
                gap: var(--spaceBetween-1024);
            }


            .swiper-slide
            {
                width: calc(100% / var(--slidesPerView-1024) - var(--spaceBetween-1024));
            }
        }


        .swiper-slide
        {
            visibility: hidden;

            transition: opacity .2s linear, visibility .2s linear;
            pointer-events: none;

            opacity: 0;


            &.visible
            {
                visibility: visible;

                pointer-events: auto;

                opacity: 1;
            }
        }


        .swiper-pagination
        {
            margin-top: var(--inner_gap_l);

            --swiper-pagination-bullet-inactive-color: var(--light_color);


            .swiper-pagination-bullet
            {
                --swiper-pagination-bullet-height: 12px;
                --swiper-pagination-bullet-width: 12px;
                --swiper-pagination-bullet-border-radius: 50%;
            }
        }
    }


    .review
    {
        display: block;

        text-decoration: none;

        color: currentColor;


        .thumb
        {
            display: block;


            img
            {
                display: block;

                width: 100%;

                height: auto;
            }
        }
    }
}



/*-------------
    You get
-------------*/
.you_get
{
    padding-block: var(--outside_gap);

    border-radius: 90px 90px  0  0;
    background: var(--bg_brown);


    .block_head
    {
        margin-bottom: 66px;
    }


    .row
    {
        display: flex;
        align-content: stretch;
        align-items: stretch;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: var(--outside_gap);


        .col
        {
            display: flex;
            flex-direction: column;
            gap: var(--block_padding);

            width: 520px;
            max-width: 100%;
        }


        .title
        {
            font-size: var(--font_size_title);
            font-weight: 500;
            line-height: 120%;

            text-transform: uppercase;

            color: var(--primary_color);
        }


        .btn
        {
            text-decoration: none;
            color: #fff;
            text-align: center;

            width: 100%;
            height: 80px;
            margin-top: auto;
            padding-block: var(--inner_gap_s);
            padding-inline: var(--block_padding_s);

            font-weight: 500;
            line-height: 52px;

            letter-spacing: .48px;

            border-radius: 28px;
            background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), linear-gradient(90deg, var(--primary_color) .06%, #fe754b 49.7%, var(--primary_color) 99.34%), var(--primary_color);
            transition: 0.2s;
            overflow: hidden; 
            position: relative;
            &:hover{
                opacity:0.8;
            }

            &:after {
                content: '';
                position: absolute;
                top: 0; left: -50px;
                width: 40px; height: 100%;
                background: rgba(255, 255, 255, 0.4);
                transform: skewX(-30deg);
                animation: shine-move 3s infinite linear;
            }
        }


        .items
        {
            display: flex;
            flex-direction: column;
            gap: var(--block_padding_s);

            font-size: var(--font_size_title_s);
            font-weight: 500;
            line-height: 120%;

            text-transform: uppercase;

            color: #ff8c20;
        }
    }
}



/*-------------
    Reports
-------------*/
.reports
{
    padding-block: var(--outside_gap);


    .block_head
    {
        margin-bottom: 45px;
    }


    .swiper
    {
        overflow: visible;

        --spaceBetween-0: var(--inner_gap_xs);
        --slidesPerView-0: auto;
        --spaceBetween-768: var(--inner_gap);
        --slidesPerView-768: 3;
        --spaceBetween-1024: var(--inner_gap);
        --slidesPerView-1024: 4;


        &:not(.swiper-initialized)
        {
            .swiper-wrapper
            {
                gap: var(--spaceBetween-1024);
            }


            .swiper-slide
            {
                width: calc(100% / var(--slidesPerView-1024) - var(--spaceBetween-1024));
            }
        }


        .swiper-scrollbar
        {
            position: relative;

            margin-top: 10px;

            --swiper-scrollbar-bottom: 0;
            --swiper-scrollbar-sides-offset: 0;
            --swiper-scrollbar-size: 5px;
            --swiper-scrollbar-drag-bg-color: var(--primary_color);
            --swiper-scrollbar-border-radius: 10px;
        }
    }


    .report
    {
        display: block;

        text-decoration: none;

        color: currentColor;


        .thumb
        {
            display: block;

            aspect-ratio: 1 / .563;
        }

        iframe{
            max-width: 100%;
            height: auto;
        }
    }
}



/*---------------------
    Best techniques
---------------------*/
.best_techniques
{
    position: relative;

    margin-top: var(--outside_gap);
    padding-block: var(--outside_gap);

    border-radius: 90px;
    background: var(--bg_brown);


    .cont
    {
        position: relative;

        z-index: 3;
    }


    .block_title
    {
        margin-bottom: 45px;

        font-family: var(--font_family_primary);
        font-size: var(--font_size_title);
        font-weight: 700;

        text-transform: uppercase;

        color: var(--primary_color);


        .number
        {
            display: block;

            font-size: 85px;

            color: var(--light_color);
            font-family: var(--font_family_secondary);
        }
    }


    .items
    {
        display: flex;
        align-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--block_padding_s) var(--block_padding);

        font-family: var(--font_family_primary);
        font-size: var(--font_size_title_s);
        font-weight: 700;

        text-align: center;
        text-transform: uppercase;

        color: #ff8c20;


        .white
        {
            color: var(--light_color);
        }
    }


    .btn
    {
        text-decoration: none;
        color: #fff;
        text-align: center;

        display: block;

        width: 520px;
        max-width: 100%;
        height: 80px;
        margin-inline: auto;
        margin-top: var(--outside_gap);
        padding-block: var(--inner_gap_s);
        padding-inline: var(--block_padding_s);

        font-weight: 500;
        line-height: 52px;

        letter-spacing: .48px;

        border-radius: 28px;
        background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), linear-gradient(90deg, var(--primary_color) .06%, #fe754b 49.7%, var(--primary_color) 99.34%), var(--primary_color);
        transition: 0.2s;
        overflow: hidden; 
        position: relative;
        &:hover{
            opacity:0.8;
        }

        &:after {
            content: '';
            position: absolute;
            top: 0; left: -50px;
            width: 40px; height: 100%;
            background: rgba(255, 255, 255, 0.4);
            transform: skewX(-30deg);
            animation: shine-move 3s infinite linear;
        }
    }


    .image
    {
        position: absolute;
        top: 50%;
        right: 50%;

        display: block;

        width: 1265px;
        margin-right: -912px;

        z-index: 1;
        transform: translateY(-50%);
        pointer-events: none;

        mix-blend-mode: overlay;

        /* Новое: подключаем анимацию */
        animation: slowRotate 50s linear infinite;
        /* Рекомендуется для производительности при вращении */
        will-change: transform; 


        img
        {
            display: block;

            width: 100%;
        }
    }

}
@keyframes slowRotate {
    from {
        /* Сохраняем исходный translateY и добавляем поворот */
        transform: translateY(-50%) rotate(0deg);
    }
    to {
        transform: translateY(-50%) rotate(360deg);
    }
}


/*------------------
    Reviews text
------------------*/
.reviews_text
{
    padding-block: var(--outside_gap);


    .block_head
    {
        margin-bottom: 45px;


        .title
        {
            span
            {
                display: block;

                margin-left: 187px;

                color: var(--primary_color);
            }
        }
    }


    .swiper
    {
        overflow: visible;

        --spaceBetween: var(--block_padding_s);
        --slidesPerView: auto;


        &:not(.swiper-initialized)
        {
            .swiper-wrapper
            {
                gap: var(--spaceBetween);
            }
        }


        .swiper-slide
        {
            display: flex;
            flex-direction: column;
            gap: var(--inner_gap_l);

            width: fit-content;
        }
    }


    .review
    {
        display: block;

        max-width: 100%;

        border-radius: 10px;

        cursor: pointer;


        img
        {
            display: block;

            width: 100%;

            border-radius: inherit;

            height: auto;
        }
    }
}



/*---------
    FAQ
---------*/
.what_is_it
{
    padding-block: var(--outside_gap);


    .block_head
    {
        margin-bottom: 45px;


        .title
        {
            span
            {
                display: block;

                margin-left: 301px;

                color: var(--primary_color);
            }
        }
    }


    .data
    {
        padding-left: var(--block_padding);


        .title
        {
            margin-bottom: var(--inner_gap_xxs);
            padding-inline: var(--inner_gap_s);
            padding-bottom: 4px;

            font-weight: 500;
            line-height: 130%;

            text-transform: uppercase;

            color: var(--primary_color);
            border-bottom: 1px solid #494949;
        }


        .items
        {
            display: flex;
            flex-direction: column;
            gap: var(--inner_gap_xxs);


            & > *
            {
                padding-inline: var(--inner_gap_s);
                padding-bottom: 4px;

                line-height: 130%;

                border-bottom: 1px solid #494949;
            }


            span
            {
                color: var(--primary_color);
            }
        }


        .goal
        {
            margin-top: var(--inner_gap_xxs);
            padding-inline: var(--inner_gap_s);

            font-weight: 500;
            line-height: 130%;

            text-transform: uppercase;

            color: var(--primary_color);
        }
    }


    .exp
    {
        width: 547px;
        max-width: 100%;
        margin-inline: auto;
        margin-top: 45px;

        font-weight: 500;

        text-align: center;
    }
}



/*-------------------
    Photo gallery
-------------------*/
.photo_gallery
{
    padding-block: var(--outside_gap);


    .swiper
    {
        overflow: visible;

        --spaceBetween-0: var(--inner_gap_xs);
        --slidesPerView-0: auto;
        --spaceBetween-768: var(--inner_gap);
        --slidesPerView-768: 3;
        --spaceBetween-1024: var(--inner_gap);
        --slidesPerView-1024: 4;


        &:not(.swiper-initialized)
        {
            .swiper-wrapper
            {
                gap: var(--spaceBetween-1024);
            }


            .swiper-slide
            {
                width: calc(100% / var(--slidesPerView-1024) - var(--spaceBetween-1024));
            }
        }
    }


    .link
    {
        display: block;

        text-decoration: none;

        color: currentColor;
    }


    .thumb
    {
        display: block;

        aspect-ratio: 1 / .563;
    }
}



/*----------------
    About info
----------------*/
.about_info
{
    .block_head
    {
        margin-bottom: 45px;


        .title
        {
            span
            {
                display: block;

                margin-left: 83px;

                color: var(--primary_color);
            }
        }
    }


    .row
    {
        display: flex;
        align-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: var(--outside_gap_s);
    }


    .item
    {
        display: flex;
        flex-direction: column;
        gap: 2px;


        .val
        {
            font-size: var(--font_size_title_s);
            font-weight: 500;
            line-height: 150%;

            text-transform: uppercase;

            color: var(--primary_color);
        }


        .desc
        {
            font-size: var(--font_size_xl);
            font-weight: 500;
            line-height: 130%;
        }
    }
}



/*-------------
    Tariffs
-------------*/
.tariffs
{
    padding-block: var(--outside_gap);


    .grid_row
    {
        --gap_x: var(--block_padding);
        --gap_y: var(--block_padding);
    }


    .tariff
    {
        position: relative;

        display: flex;
        overflow: hidden;
        flex-direction: column;

        padding-block: var(--block_padding_s);
        padding-inline: var(--inner_gap);

        border-radius: 30px;


        &:before,
        &:after
        {
            position: absolute;
            top: -8px;
            right: 0;
            left: 0;

            display: block;

            width: 305px;
            max-width: 100%;
            height: 17px;
            margin-inline: auto;

            content: '';
            pointer-events: none;

            background: url('../images/bg_tariff.png') 50% 0 no-repeat;
        }


        &:after
        {
            top: auto;
            bottom: -8px;
        }


        &.brown
        {
            background: var(--bg_brown);


            .desc
            {
                color: var(--light_color);
            }
        }


        &.white
        {
            background: var(--light_color);


            .label
            {
                color: var(--dark_color);
            }
        }


        &.primary
        {
            background: var(--primary_color);

            filter: drop-shadow(2px 4px 14px rgba(201, 201, 201, .25));


            .name
            {
                color: var(--dark_color);
            }


            .order_btn
            {
                background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), linear-gradient(90deg, #040404 .06%, #151515 49.7%, #210d07 99.34%), #040404;
            }
        }


        .label
        {
            position: relative;

            margin-bottom: var(--inner_gap_l);
            padding-bottom: 6px;

            line-height: 150%;

            color: var(--light_color);


            &:after
            {
                position: absolute;
                bottom: 0;
                left: 50%;

                display: block;

                width: 100vw;
                height: 1px;

                content: '';
                transform: translateX(-50%);
                pointer-events: none;

                background: #000;
            }
        }


        .name
        {
            font-size: 26px;
            font-weight: 500;

            color: var(--primary_color);
        }


        .desc
        {
            margin-top: var(--block_padding_s);

            line-height: 130%;

            color: var(--dark_color);


            ul
            {
                & > li
                {
                    position: relative;

                    display: block;
                    overflow: hidden;

                    padding-left: 16px;

                    list-style-type: none;


                    &:before
                    {
                        position: absolute;
                        top: .5lh;
                        left: 4px;

                        display: block;

                        width: 4px;

                        content: '';
                        transform: translateY(-50%);

                        border-radius: 50%;
                        background: currentColor;

                        aspect-ratio: 1 / 1;
                    }
                }
            }
        }


        .btns
        {
            display: flex;
            flex-direction: column;
            gap: var(--block_padding_s);

            margin-top: var(--block_padding_s);
        }


        .order_btn
        {

            text-decoration: none;
            text-align: center;

            width: 100%;
            height: 65px;
            padding-inline: var(--block_padding_s);

            font-weight: 500;
            line-height: 65px;

            letter-spacing: .48px;
            text-transform: uppercase;

            color: var(--light_color);
            border-radius: 27.5px;
            background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), linear-gradient(90deg, #e9430e .06%, #fe754b 49.7%, #e9430e 99.34%), #e9430e;
            transition: 0.2s;
            overflow: hidden; 
            position: relative;
            &:hover{
                opacity:0.8;
            }

            &:after {
                content: '';
                position: absolute;
                top: 0; left: -50px;
                width: 40px; height: 100%;
                background: rgba(255, 255, 255, 0.4);
                transform: skewX(-30deg);
                animation: shine-move 3s infinite linear;
            }
        }


        .pre_order_btn
        {
            text-decoration: none;
            text-align: center;

            width: 100%;
            height: 65px;
            padding-inline: var(--block_padding_s);

            font-weight: 500;
            line-height: 65px;

            letter-spacing: .48px;
            text-transform: uppercase;

            color: var(--dark_color);
            border: 1px solid #040404;
            border-radius: 27.5px;
            background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), #fff;
            transition: 0.2s;
            &:hover{
                opacity:0.8;
            }
        }
    }


    .contacts
    {
        margin-top: var(--outside_gap_s);

        background: var(--bg_brown);


        .cont
        {
            display: flex;
            align-content: center;
            align-items: center;
            flex-wrap: wrap;
            justify-content: flex-start;
        }


        .icon
        {
            display: block;

            mix-blend-mode: luminosity;


            img
            {
                display: block;

                width: 169px;
                height: 135px;
            }
        }


        .title
        {
            width: 378px;
            max-width: 100%;

            font-size: var(--font_size_xl);
            font-weight: 500;
            line-height: 130%;
        }


        .btn
        {
            display: flex;
            align-content: center;
            align-items: center;
            flex-wrap: wrap;
            justify-content: center;

            width: 340px;
            max-width: 100%;
            height: 80px;
            margin-left: auto;
            padding-inline: var(--block_padding_s);

            font-weight: 500;
            line-height: 150%;

            text-align: center;
            text-decoration: none;
            letter-spacing: .48px;
            text-transform: uppercase;

            color: currentColor;
            border-radius: 27.5px;
            background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), linear-gradient(90deg, #2ca5e0 .06%, #4ac1fb 49.7%, #2ca5e0 99.34%), #fff;
        
            transition: 0.2s;
            overflow: hidden; 
            position: relative;
            &:hover{
                opacity:0.8;
            }

            &:after {
                content: '';
                position: absolute;
                top: 0; left: -50px;
                width: 40px; height: 100%;
                background: rgba(255, 255, 255, 0.4);
                transform: skewX(-30deg);
                animation: shine-move 3s infinite linear;
            }
        }
    }
}



/*------------------
    About author
------------------*/
.about_author
{
    padding-block: var(--outside_gap);


    .grid_row
    {
        --items_per_line: 2;
        --gap_x: var(--block_padding);
        --gap_y: var(--block_padding);
    }


    .data
    {
        display: flex;
        flex-direction: column;


        .title
        {
            display: flex;
            flex-direction: column;
            gap: var(--inner_gap);

            font-size: var(--font_size_title_xs);
            font-weight: 500;

            text-align: center;
            text-transform: uppercase;
        }


        .btn
        {
            text-decoration: none;
            text-align: center;
            color: #fff;
            position: relative;

            width: 500px;
            max-width: 100%;
            height: 80px;
            margin-inline: auto;
            margin-top: 53px;
            padding-inline: var(--block_padding_s);

            font-weight: 500;
            line-height: 80px;

            letter-spacing: .48px;
            text-transform: uppercase;

            border-radius: 27.5px;
            background: radial-gradient(50% 50% at 53% 100%, rgba(255, 255, 255, .20) 0%, rgba(255, 255, 255, .00) 100%), linear-gradient(90deg, #e9430e .06%, #fe754b 49.7%, #e9430e 99.34%), #fff;
            z-index: 100;
            transition: 0.2s;
            overflow: hidden; 
            position: relative;
            &:hover{
                opacity:0.8;
            }

            &:after {
                content: '';
                position: absolute;
                top: 0; left: -50px;
                width: 40px; height: 100%;
                background: rgba(255, 255, 255, 0.4);
                transform: skewX(-30deg);
                animation: shine-move 3s infinite linear;
            }
        }


        .image
        {
            display: block;

            margin-inline: -93px -66px;
            margin-top: -40px;
            transition: 0.3s;


            img
            {
                display: block;

                width: 100%;
                height: auto;
            }

            &:hover{
                transform: scale(1.1);
            }
        }
    }


    .info
    {
        display: flex;
        flex-direction: column;


        .name
        {
            font-size: var(--font_size_title);
            font-weight: 700;

            text-align: center;
            text-transform: uppercase;

            color: var(--primary_color);
        }


        .post
        {
            margin-top: var(--block_padding_s);

            font-size: var(--font_size_title_s);
            font-weight: 700;

            text-align: center;
            text-transform: uppercase;

            color: var(--primary_color);
        }


        .desc
        {
            width: 456px;
            max-width: 100%;
            margin-inline: auto;
            margin-top: var(--outside_gap_s);

            font-size: var(--font_size_xl);
            line-height: 130%;

            transform: translateX(16px);


            ul
            {
                display: flex;
                flex-direction: column;
                gap: var(--inner_gap);


                & > li
                {
                    position: relative;

                    display: block;
                    overflow: hidden;

                    padding-left: 20px;

                    list-style-type: none;


                    &:before
                    {
                        position: absolute;
                        top: .5lh;
                        left: 4px;

                        display: block;

                        width: 6px;

                        content: '';
                        transform: translateY(-50%);

                        border-radius: 50%;
                        background: currentColor;

                        aspect-ratio: 1 / 1;
                    }
                }
            }
        }
    }
}



/*---------------
    Education
---------------*/
.education
{
    padding-block: var(--outside_gap);


    .block_head
    {
        margin-bottom: 45px;
    }


    .grid_row
    {
        --items_per_line: 2;
        --gap_x: var(--block_padding);
        --gap_y: var(--block_padding);
    }


    .desc
    {
        display: flex;
        flex-direction: column;
        gap: var(--inner_gap_xs);

        line-height: 130%;


        ul
        {
            & > li
            {
                position: relative;

                display: block;
                overflow: hidden;

                padding-left: 16px;

                list-style-type: none;


                &:before
                {
                    position: absolute;
                    top: .5lh;
                    left: 4px;

                    display: block;

                    width: 4px;

                    content: '';
                    transform: translateY(-50%);

                    border-radius: 50%;
                    background: currentColor;

                    aspect-ratio: 1 / 1;
                }
            }
        }


        * + ul
        {
            margin-top: var(--inner_gap_s);
        }
    }


    .slider
    {
        overflow: hidden;


        .swiper
        {
            overflow: visible;

            --spaceBetween: var(--inner_gap);
            --slidesPerView: 1;
        }


        .item
        {
            .thumb
            {
                display: block;

                border-radius: 10px;

                aspect-ratio: 1 / .826;
            }
        }
    }
}



/*-------------
    Experts
-------------*/
.experts
{
    padding-block: var(--outside_gap) calc(var(--outside_gap) + 52px);


    .block_head
    {
        margin-bottom: 45px;


        .title
        {
            span
            {
                display: block;

                margin-left: 70px;

                color: var(--primary_color);
            }
        }
    }


    .swiper
    {
        overflow: visible;

        padding-inline: 60px;

        --spaceBetween-0: var(--inner_gap_xs);
        --slidesPerView-0: auto;
        --spaceBetween-768: var(--inner_gap_l);
        --slidesPerView-768: 1;
        --spaceBetween-1024: var(--block_padding);
        --slidesPerView-1024: 2;


        &:not(.swiper-initialized)
        {
            .swiper-wrapper
            {
                gap: var(--spaceBetween-1024);
            }


            .swiper-slide
            {
                width: calc(100% / var(--slidesPerView-1024) - var(--spaceBetween-1024));
            }
        }


        .swiper-slide
        {
            visibility: hidden;

            transition: opacity .2s linear, visibility .2s linear;
            pointer-events: none;

            opacity: 0;


            &.visible
            {
                visibility: visible;

                pointer-events: auto;

                opacity: 1;
            }
        }


        .swiper-pagination
        {
            position: absolute;

            margin-top: var(--inner_gap_l);

            --swiper-pagination-bottom: -52px;
            --swiper-pagination-bullet-inactive-color: var(--light_color);


            .swiper-pagination-bullet
            {
                --swiper-pagination-bullet-height: 12px;
                --swiper-pagination-bullet-width: 12px;
                --swiper-pagination-bullet-border-radius: 50%;
            }
        }
    }


    .expert
    {
        display: flex;
        overflow: hidden;
        flex-direction: column;

        border-radius: 10px;
        background: var(--bg_brown);


        .photo
        {
            display: block;

            aspect-ratio: 1 / .926;
        }

        .info
        {
            display: flex;
            flex: 1 0 auto;
            flex-direction: column;
            gap: 10px;

            padding-block: var(--block_padding_s) var(--block_padding);
            padding-inline: var(--inner_gap);
        }


        .name
        {
            font-size: var(--font_size_title_s);
            font-weight: 500;
            line-height: 150%;

            color: var(--primary_color);
        }


        .desc
        {
            font-size: var(--font_size_xl);
            line-height: 140%;
        }
    }
}



/*-----------
    Based
-----------*/
.based
{
    padding-block: var(--outside_gap);


    .block_head
    {
        margin-bottom: 45px;


        .title
        {
            span
            {
                display: block;

                margin-left: 70px;

                color: var(--primary_color);
            }
        }
    }


    .data
    {
        position: relative;

        line-height: 130%;


        .image1
        {
            position: absolute;
            bottom: calc(var(--inner_gap_xs) * -1);
            left: 0;

            display: block;

            width: 217px;

            transition: 0.3s;

            &:hover{
                transform: scale(1.1);
            }


            img
            {
                display: block;

                width: 100%;

                height: auto;
            }
        }


        .image2
        {
            position: absolute;
            right: var(--inner_gap_xs);
            bottom: calc(var(--inner_gap_xxs) * -1);

            display: block;

            width: 262px;

            transition: 0.3s;

            &:hover{
                transform: scale(1.1);
            }


            img
            {
                display: block;

                width: 100%;

                height: auto;
            }
        }


        ul
        {
            display: flex;
            flex-direction: column;
            gap: var(--inner_gap);

            width: 380px;
            max-width: 100%;
            margin-inline: auto;

            transform: translateX(var(--block_padding));


            & > li
            {
                position: relative;

                display: block;
                overflow: hidden;

                padding-left: 16px;

                list-style-type: none;


                &:before
                {
                    position: absolute;
                    top: .5lh;
                    left: 4px;

                    display: block;

                    width: 4px;

                    content: '';
                    transform: translateY(-50%);

                    border-radius: 50%;
                    background: currentColor;

                    aspect-ratio: 1 / 1;
                }
            }
        }
    }
}



/*------------
    Footer
------------*/
footer
{
    margin-top: var(--outside_gap);
    padding-block: var(--outside_gap) var(--block_padding);

    background: var(--bg_brown);


    .cont
    {
        display: flex;
        flex-direction: column;
        gap: 45px;
    }


    .copyright
    {
        font-size: var(--font_size_l);
        font-weight: 500;
    }


    .links
    {
        display: flex;
        align-content: center;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: var(--inner_gap);

        font-weight: 500;


        a
        {
            white-space: nowrap;
            text-decoration: none;

            color: currentColor;
            transition: 0.2s;

            &:hover{
                color: var(--primary_color);
            }
        }
    }


    .exp
    {
        font-size: 10px;
    }
}



/* Основной контейнер локации */
.location {
    position: relative;
    cursor: pointer;
    user-select: none;
}

/* Область клика (город + стрелочка) */
.location-trigger {
    display: inline-flex;
    align-items: center;
    gap: 6px; /* Расстояние между текстом и стрелкой */
}

/* Иконка стрелочки с плавным поворотом */
.location .icon {
    width: 10px;
    height: 10px;
    transition: transform 0.3s ease;
}

/* Поворачиваем стрелку вверх, когда меню открыто */
.location.is-open .icon {
    transform: rotate(180deg);
}

/* Стили выпадающего списка */
.dropdown-menu {
    position: absolute;
    top: calc(100% + 10px); /* Позиционирование чуть ниже триггера */
    left: 0;
    z-index: 100;
    min-width: 180px;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 6px 0;
    
    /* Эффект плавного появления */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
}

/* Класс, который JS будет добавлять для открытия меню */
.location.is-open .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Элементы списка */
.dropdown-item {
    display: block;
    padding: 10px 16px;
    color: #333333;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.2;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* Ховер на элементы */
.dropdown-item:hover {
    background-color: #f5f5f5;
    color: #000000;
}

/* Разделительные линии */
.dropdown-divider {
    height: 1px;
    margin: 4px 0;
    background-color: #eeeeee;
}


.video-wrap video{
    height: 100%;
    max-width: 100%;
    width: 100%;
    border-radius: 20px;
}

.video-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 9 / 16;
  overflow: hidden;
}

.video-wrap img,
.video-wrap video,
.video-wrap iframe {
  display: block;
  width: 100%;
  height: 100%;
}

.video-wrap img,
.video-wrap video {
  object-fit: cover;
}

.play-btn{
    position: absolute;
    top:50%;
    left: 50%;
    transform:translate(-50%, -50%);
    border:none;
    background: none;
}

.play-btn img{
    max-width: 50px;
}

 @keyframes shine-move {
    0% { left: -50px; }
    20%, 100% { left: 120%; }
}

.back-to-top {
    position: fixed;
    z-index: 500;
    right: 20px;
    bottom: 40px;
    width: 50px;
    height: 50px;
    border-color: transparent;
    border-radius: 50%;
    background: #FF4F25;
    width: 67px;
    height: 67px;
    box-shadow: 0 0 25px rgba(255, 79, 37, 0.5);
    border-radius: 34px;
    background-color: #ff4f25;
}

.icon_up-button {
    position: relative;
}

.icon_up-button:before {
    width: 19px;
    height: 13px;
    background: url(../images/icon_up.png) center no-repeat;
    position: absolute;
    content: "";
    top: 24px;
    left: 24px;
}

.back-to-top:hover,
.back-to-top:focus {
    filter: brightness(1.5);
    outline: none;
}