@font-face {
    font-family: "Lufga";
    font-display: swap;
    src: url("../fonts/Lufga-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Lufga";
    font-display: swap;
    src: url("../fonts/Lufga-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Lufga";
    font-display: swap;
    src: url("../fonts/Lufga-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
}

*, *::before, *::after{
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

button,
input,
textarea,
select {
    font: inherit;
}

button {
    border: none;
    background: none;
    cursor: pointer;
}

a, a:visited{
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

ul,
ol {
    list-style: none;
}

body{
    font-family: "Lufga", sans-serif;
    font-size: 0.938vw;
    line-height: 1.25vw;
    font-weight: 400;
    color: #FFF;
    background: #F6F8FF;
}

/* SPECIAL CLASS */
.mt-0{
    margin-top: 0!important;
}
.hidden{
    overflow: hidden;
}
.d-flex-c-c{
    display: flex;
    align-items: center;
    justify-content: center;
}

.hover-link{
    position: relative;
    transition: color 0.25s ease;
}

.hover-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -0.208vw;
    width: 100%;
    height: 0.052vw;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.25s ease;
}

.hover-link:hover{
    color: #1F9F55;
}

.hover-link:hover::after,
.hover-link:focus-visible::after{
    transform: scaleX(1);
}

.button-link{
    padding: 0.208vw 0.208vw 0.208vw 1.042vw;
    gap: 0.833vw;
    border-radius: 5.156vw;
    background: rgba(255, 255, 255, 0.10);
    box-shadow: 0 0 1.042vw 0 rgba(255, 255, 255, 0.70) inset;
    backdrop-filter: blur(1.042vw);
    transition: background 0.25s ease, box-shadow 0.25s ease;
}

.button-link__text{
    font-weight: 600;
}

.button-link svg{
    width: 2.708vw;
    height: 2.708vw;
}

.button-link:hover{
    background: rgba(255, 255, 255, 0.16);
    box-shadow: 0 0 1.4vw 0 rgba(255, 255, 255, 0.85) inset;
}

.container{
    width: 100%;
    padding-inline: 5.208vw;
}
/* SPECIAL CLASS */

/* HERO HEADER */
#hero{
    height: 26.042vw;
    flex-direction: column;
}

.technical #hero{
    height: fit-content;
    justify-content: flex-start;
}

.hero-header{
    width: 100%;
    flex-shrink: 0;
    background:#101113;
}

.hero-header__inner{
    padding: 0.833vw 0;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
}

.hero-header-logo{
    justify-content: flex-start;
}

.hero-header-logo svg{
    width: 6.198vw;
    height: 1.458vw;
}

.hero-header-logo svg path{
    --i: 0;
    fill: #FFF;
    transform: translateY(0);
    transform-box: fill-box;
    transform-origin: center;
    transition: fill 0.35s ease;
}

.hero-header-logo svg path:nth-child(8){ --i: 0; }
.hero-header-logo svg path:nth-child(7){ --i: 1; }
.hero-header-logo svg path:nth-child(6){ --i: 2; }
.hero-header-logo svg path:nth-child(5){ --i: 3; }
.hero-header-logo svg path:nth-child(4){ --i: 4; }
.hero-header-logo svg path:nth-child(3){ --i: 5; }
.hero-header-logo svg path:nth-child(2){ --i: 6; }
.hero-header-logo svg path:nth-child(1){ --i: 7; }

.hero-header-logo:hover svg path{
    fill: #1F9F55;
    animation: logo-wave 0.55s cubic-bezier(.22, 1, .36, 1);
    animation-delay: calc(var(--i) * 0.06s);
}

@keyframes logo-wave{
    0%{
        transform: translateY(0);
    }

    45%{
        transform: translateY(-.104vw);
    }

    100%{
        transform: translateY(0);
    }
}

.hero-header-nav-header,
.hero-header-nav .hero-header-button__language{
    display: none;
}

.hero-header-nav__list{
    gap: 2.24vw;
}

.hero-header-buttons{
    justify-content: flex-end;
    gap: 0.521vw;
}

.language-switcher-button{
    padding: 0.417vw 0.521vw;
    gap: 0.26vw;
}

.language-switcher-button__flag{
    width: 1.198vw;
    height: 0.677vw;
}

.language-switcher-button__text{
    color: #FFF;
}

.language-switcher-button svg{
    /* Temporarily hide the arrow until the country list is ready. */
    display: none;
    width: 1.25vw;
    height: 0.625vw;
}

.hero-header-button__login{
    padding: 0.208vw 0.208vw 0.208vw 0.521vw;
    gap: 0.417vw;
    border-radius: 5.156vw;
    border: 0.052vw solid #FFF;
}

.hero-header-button__login svg{
    width:1.354vw;
    height:1.354vw;
}

.hero-page{
    background: url("../images/page/page-head-bg.webp") no-repeat center center/cover;
    width: 100%;
    flex: 1;
}

.hero-page__inner{
    padding-top:5.208vw;
}

.breadcrumbs{
    justify-content:flex-start;
    gap:.469vw;
    margin-bottom:3.438vw;
}

.breadcrumbs-link{
    font-size:.938vw;
    font-weight:500;
    letter-spacing:-.019vw;
}

.breadcrumbs-text{
    color:#99A1AF;
}

.hero-page-title{
    font-size:5.208vw;
    font-weight:500;
    line-height:5.208vw;
    letter-spacing:-.104vw;
}

/* HERO HEADER */

/* CONTENT */
.content__inner{
    padding:5.208vw 0;
    color:#101113;
}
/* CONTENT */

/* FOOTER */
#footer{
    background: #101113;
}

.footer__inner{
    padding: 3.125vw 0 1.042vw;
    flex-direction: column;
    gap: 2.083vw;
}

.footer-text{
    color: #737F8F;
    font-size: 0.729vw;
    line-height: 1.042vw;
}

.footer-content{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas:
            "head nav"
            "buttons nav";
    gap: 2.266vw;
}

.footer-content-header{
    grid-area: head;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.224vw;
}

.footer-content-logo svg{
    width: 6.198vw;
    height: 1.458vw;
}

.footer-content-messengers__list{
    gap: 0.833vw;
}

.footer-content-messengers__img,
.footer-content-nav__item__item-img{
    width:1.25vw;
    height:1.25vw;
}

.footer-content-buttons{
    grid-area: buttons;
    gap: 2.083vw;
    justify-content: flex-start;
}

.footer-content-button__title{
    font-size: 0.729vw;
    font-weight: 700;
    line-height: 1.042vw;
    letter-spacing: 0.036vw;
    text-transform: uppercase;
}

.footer-content-button{
    min-width: 9.427vw;
    height: 2.917vw;
    border-radius: 0.521vw;
    border: 0.052vw solid #737F8F;
    font-weight: 600;
}

.footer-content-button__wrapper{
    flex-direction: column;
    align-items: flex-start;
    gap: 0.625vw;
}

.footer-content-nav__list{
    grid-area: nav;
    display: grid;
    grid-template-columns: repeat(5, 11.354vw);
}

.footer-content-nav__item-button{
    margin-bottom: 1.25vw;
}

.footer-content-nav__item-button-text{
    color: #C2C7CC;
    font-size: 0.729vw;
    font-weight: 600;
    line-height: 0.859vw;
    letter-spacing: 0.052vw;
    text-transform: uppercase;
}

.footer-content-nav__item-button-text span{
    display: none;
}

.footer-content-nav__item-button svg{
    display: none;
}

.footer-content-nav__item-item{
    margin-bottom: 0.625vw;
}

a.footer-content-nav__item-link,
.footer-content-nav__item-text{
    color: #737F8F;
    font-size: 0.729vw;
    line-height: 1.042vw;
}

a.footer-content-nav__item-link--phone{
    color: #C2C7CC;
}

.footer-content-nav__item__list{
    justify-content: flex-start;
    gap: 0.833vw;
}

.footer-info{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas:
            "text text"
            "copyright payments";
    gap: 0.625vw;
}

.footer-info-text{
    grid-area: text;
}

.footer-info-copyright{
    justify-content: flex-start;
    grid-area: copyright;
    font-size: 0.833vw;
    line-height: 0.833vw;
}

.footer-info-payment__list{
    grid-area: payments;
    justify-content: flex-end;
    gap: 0.938vw;
}

.footer-info-payment__item{
    width: 3.802vw;
    height: 2.083vw;
    border-radius: 0.312vw;
    background: rgba(249, 250, 253, 0.05);
}

.footer-info-payment__image--apple-pay{
    width: 1.51vw;
    height: 0.677vw;
}

.footer-info-payment__image--google-pay{
    width: 1.719vw;
    height: 1.719vw;
}

.footer-info-payment__image--visa{
    width: 1.615vw;
    height: 0.521vw;
}

.footer-info-payment__image--mastercard{
    width: 1.042vw;
    height: 0.625vw;
}

.footer-info-payment__image--paypal{
    width: 2.083vw;
    height: 1.25vw;
}

.footer-info-payment__image--samsung-pay{
    width: 1.562vw;
    height: 0.938vw;
}
/* FOOTER */

@media (max-width: 767px) {
    body{
        font-size: 3.59vw;
        line-height: 5.641vw;
    }
    /* SPECIAL CLASS */
    .button-link{
        padding: 1.026vw 1.026vw 1.026vw 5.128vw;
        gap: 3.077vw;
        border-radius: 25.385vw;
        border: 0.306vw solid rgba(255, 255, 255, 0.15);
        background: rgba(255, 255, 255, 0.10);
        box-shadow: 0 0 5.128vw 0 rgba(255, 255, 255, 0.70) inset;
        backdrop-filter: blur(5.128vw);
    }

    .button-link svg {
        width: 11.282vw;
        height: 11.282vw;
    }
    .button-link__text{
        font-size: 4.103vw;
    }

    .container{
        padding-inline: 4.103vw;
    }
    /* SPECIAL CLASS */

    /* HERO HEADER */
    #hero{
        height: 64.103vw;
    }
    .hero-header__inner{
        padding: 5.128vw 0;
        grid-template-columns: repeat(2, 1fr);
    }
    .hero-header-logo svg{
        width: 23.077vw;
        height: 5.641vw;
    }
    .hero-header-nav,
    .hero-header-button__language,
    .hero-header-button__login-text{
        display: none;
    }
    .hero-header-buttons{
        gap: 5.128vw;
    }
    .hero-header-button__login{
        padding: 0;
        border: none;
        border-radius: unset;
    }
    .hero-header-button__login svg{
        width: 6.667vw;
        height: 6.667vw;
    }
    .burger-button{
        padding:0;
    }
    .burger{
        display:flex;
        width:6.154vw;
        height:3.59vw;
        flex-direction:column;
        align-items:flex-start;
        gap:1.282vw;
    }
    .burger-line{
        display:block;
        height:0.256vw;
        flex-shrink:0;
        background:#FFF;
        transform-origin:center;
        transition: transform .3s ease, opacity .2s ease, width .3s ease;
    }
    .burger-line--1,
    .burger-line--2{
        width:6.154vw;
    }
    .burger-line--3{
        width:4.103vw;
    }

    .is-open .hero-header-nav{
        z-index: 99;
        left: 0;
        top: 0;
        background: #051216;
        position: absolute;
        width: 100%;
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        padding: 0 4.103vw;
    }
    .hero-header-nav-header{
        display: flex;
        width: 100%;
        justify-content: space-between;
        padding: 5.128vw 0;
        margin-bottom: 25.641vw;
    }
    .hero-header-nav-header-close{
        width: 6.667vw;
        height: 6.667vw;
        border-radius: 50%;
        background: #1F9F55;
    }
    .hero-header-nav__list{
        flex-direction: column;
        gap: 8.205vw;
    }
    .hero-header-nav__link{
        font-size: 4.615vw;
        font-weight: 400;
        line-height: 6.154vw;
    }
    .hero-header-nav .hero-header-button__language{
        display: block;
        margin: auto 0 5.128vw;
    }
    .language-switcher-button{
        padding: 2.051vw 2.564vw;
        gap: 1.282vw;
    }
    .language-switcher-button__flag{
        width: 5.897vw;
        height: 3.333vw;
    }
    .language-switcher-button__text{
        font-size: 4.615vw;
        font-weight: 400;
        line-height: 6.154vw;
    }
    .language-switcher-button svg{
        width: 6.154vw;
        height: 3.077vw;
    }
    #hero{
        background:url("../images/page/page-head-bg-mob.webp") no-repeat center center/cover;
    }
    .hero-header{
        background:none;
    }

    .hero-page{
        background:none;
    }

    .hero-page__inner{
        padding-top:5.128vw;
    }

    .breadcrumbs{
        margin-bottom:5.128vw;
        gap:2.308vw;
    }

    .breadcrumbs-link{
        font-size:3.59vw;
        font-weight:500;
        line-height:5.641vw;
    }

    .hero-page-title{
        font-size:12.821vw;
        font-weight:500;
        line-height:9.744vw;
        letter-spacing:-.205vw;
    }

    /* HERO HEADER */

    /* CONTENT */
    .content__inner{
        padding: 10.256vw 0;
    }
    /* CONTENT */

    /* FOOTER */
    .footer__inner{
        padding: 8.205vw 0 6.154vw;
        gap: 8.205vw;
    }

    .footer-text{
        font-size: 3.077vw;
        line-height: 4.615vw;
    }

    .footer-content{
        grid-template-columns: 1fr;
        grid-template-areas:
                "head"
                "nav"
                "buttons";
        gap: 6.154vw;
    }

    .footer-content-logo svg{
        width: 21.795vw;
        height: 5.128vw;
    }

    .footer-content-header{
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .footer-content-messengers__list{
        gap: 4.103vw;
    }

    .footer-content-messengers__link{
        width: 5.128vw;
        height: 5.128vw;
    }

    .footer-content-messengers__img{
        width: 4.359vw;
        height: 4.359vw;
    }

    .footer-content-nav__list{
        grid-template-columns: 1fr;
    }

    .footer-content-nav__item{
        padding: 3.077vw 0;
        border-bottom: 0.306vw solid rgba(255, 255, 255, 0.07);
    }

    .footer-content-nav__item:first-child{
        border-top: 0.306vw solid rgba(255, 255, 255, 0.07);
    }

    .footer-content-nav__item-button{
        width: 100%;
        justify-content: space-between;
        margin-bottom: 0;
    }

    .footer-content-nav__item-button-text{
        color: #EAEFF1;
        font-size: 3.59vw;
        font-weight: 400;
        line-height: 4.615vw;
        letter-spacing: 0.256vw;
    }

    .footer-content-nav__item-button-text span{
        display: inline;
    }

    .footer-content-nav__item-button svg{
        display: block;
        width: 2.821vw;
        height: 1.795vw;
        transition:transform .3s ease;
    }

    .footer-content-nav__item-list{
        display:grid;
        grid-template-rows:0fr;
        transition:grid-template-rows .3s ease;
    }

    .footer-content-nav__item-list-inner{
        min-height:0;
        overflow:hidden;
    }

    .footer-content-nav__item-item {
        margin: 3.077vw 0 0;
    }

    .footer-content-nav__item-item:first-child{
        margin-top: 6.154vw;
    }

    a.footer-content-nav__item-link,
    .footer-content-nav__item-text{
        font-size: 3.59vw;
        line-height: 5.128vw;
    }

    .footer-content-nav__item.is-open .footer-content-nav__item-button svg{
        transform:rotate(180deg);
    }

    .footer-content-nav__item.is-open .footer-content-nav__item-list{
        grid-template-rows:1fr;
    }

    .footer-content-nav__item.is-open .footer-content-nav__item-button svg{
        transform:rotate(180deg);
    }

    .footer-content-nav__item__list{
        gap: 4.103vw;
    }

    .footer-content-nav__item__item-link{
        width: 6.154vw;
        height: 6.154vw;
    }

    .footer-content-nav__item__item-img{
        width: 5.128vw;
        height: 5.128vw;
    }


    .footer-content-buttons{
        gap: 6.154vw;
    }

    .footer-content-button__wrapper{
        gap: 1.026vw;
    }

    .footer-content-button__title{
        font-size: 3.077vw;
        font-weight: 400;
        line-height: 4.231vw;
        letter-spacing: 0.179vw;
    }

    .footer-content-button {
        margin-top: 2.051vw;
        height: 9.744vw;
        min-width: 38.462vw;
        border-radius: 2.564vw;
        border-width: 0.306vw;
        font-size: 3.333vw;
        font-weight: 400;
        line-height: 5vw;
    }

    .footer-info{
        grid-template-columns: 1fr;
        grid-template-areas:
                "payments"
                "text"
                "copyright";
        gap: 4.103vw;
    }

    .footer-info-payment__list{
        justify-content: flex-start;
        gap: 2.051vw;
    }

    .footer-info-payment__item{
        height: 8.718vw;
        width: fit-content;
        padding: 0 3.077vw;
        border-radius: 1.538vw;
    }

    .footer-info-payment__image--apple-pay{
        width: 6.667vw;
        height: 2.821vw;
    }

    .footer-info-payment__image--google-pay{
        width: 7.436vw;
        height: 7.436vw;
    }

    .footer-info-payment__image--visa{
        width: 6.667vw;
        height: 2.308vw;
    }

    .footer-info-payment__image--mastercard{
        width: 5.128vw;
        height: 2.821vw;
    }

    .footer-info-payment__image--paypal{
        width: 7.308vw;
        height: 4.103vw;
    }

    .footer-info-payment__image--samsung-pay{
        width: 6.923vw;
        height: 4.359vw;
    }

    .footer-info-text{
        margin-top: 1.026vw;
    }

    .footer-info-copyright{
        color: rgba(255, 255, 255, 0.50);
        font-size: 3.333vw;
        line-height: 5vw;
    }
    /* FOOTER */
}
