@import url(https://fonts.googleapis.com/css?family=Fredoka:300,regular,500,600,700&display=swap);

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

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

@font-face {
    font-family: "Springwood Display DEMO";
    font-display: swap;
    src: url("../fonts/Springwood%20Display%20DEMO.woff2") format("woff2");
    font-weight: 400;
    font-style: normal
}

* {
    padding: 0;
    margin: 0;
    border: 0
}

*,
*::after,
*::before {
    box-sizing: border-box
}

*::after,
*::before {
    display: inline-block
}

body,
html {
    height: 100%;
    min-width: 320px
}

body {
    color: #000;
    line-height: 1;
    font-family: "Brave Spirit";
    font-size: 1.5rem;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

button,
input,
textarea {
    font-family: "Brave Spirit";
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    background-color: rgba(0, 0, 0, 0)
}

input,
textarea {
    width: 100%
}

label {
    display: inline-block
}

button,
option,
select {
    cursor: pointer
}

a {
    display: inline-block;
    color: inherit;
    text-decoration: none
}

ul li {
    list-style: none
}

img {
    vertical-align: top
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: inherit;
    font-size: inherit
}

.lock body {
    overflow: hidden;
    touch-action: none;
    -ms-scroll-chaining: none;
    overscroll-behavior: none
}

.wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden
}

@supports (overflow:clip) {
    .wrapper {
        overflow: clip
    }
}

.wrapper>main {
    flex: 1 1 auto
}

.wrapper>* {
    min-width: 0
}

[class*=__container] {
    max-width: 96.875rem;
    margin: 0 auto;
    padding: 0 .9375rem
}

[class*="--gc"] {
    display: grid;
    min-width: 0;
    grid-template-columns: .9375rem 1fr minmax(auto, 95rem) 1fr .9375rem
}

[class*="--gc"]>* {
    min-width: 0;
    grid-column: 3/4
}

.menu__list {
    display: flex;
    align-items: center
}

.menu__link {
    color: #fff;
    text-shadow: 0 .0833333333em 0 #000;
    -webkit-text-stroke-width: .3333333333em;
    paint-order: stroke fill;
    -webkit-text-stroke-color: #000;
    font-family: CCMaladroitW00-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    transition: color .2s ease 0s
}

.menu__link._navigator-active {
    color: #FE4720
}

.icon-menu {
    display: none
}

.ibg {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.ibg--top {
    -o-object-position: top;
    object-position: top
}

.ibg--bottom {
    -o-object-position: bottom;
    object-position: bottom
}

.ibg--left {
    -o-object-position: left;
    object-position: left
}

.ibg--right {
    -o-object-position: right;
    object-position: right
}

.ibg--contain {
    -o-object-fit: contain;
    object-fit: contain
}

.header {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    height: 5rem;
    border-bottom: .125rem solid #000;
    display: flex;
    align-items: center
}

.header__container {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem
}

.header__logo {
    position: relative;
    z-index: 2
}

.header__logo img {
    width: 100%
}

.header__actions {
    display: flex;
    align-items: center
}

.header__button {
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    border-radius: 3.375rem;
    border: .1875rem solid #000;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-family: CCMaladroitW00-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    box-shadow: 0 .25rem 0 0 #000;
    transition: letter-spacing .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: letter-spacing .2s ease 0s, transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: letter-spacing .2s ease 0s, transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.header__social {
    flex-shrink: 0;
    display: flex;
    align-items: center
}

.header__social-item {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: .1875rem solid #000;
    box-shadow: 0 .25rem 0 0 #000;
    transition: box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.header__social-item:nth-child(1) {
    background-color: #030234
}

.header__social-item:nth-child(2) {
    background-color: #4a4a4a
}

.header__social-item:nth-child(3) {
    background-color: #007ee5
}

.header__social-item svg {
    transition: scale .2s ease 0s;
    width: 55%;
    height: 55%
}

@-webkit-keyframes heroTitle {
    0% {
        -webkit-transform: translate3d(-50%, 25%, 0) scale(.2);
        transform: translate3d(-50%, 25%, 0) scale(.2);
        z-index: 2
    }

    25% {
        -webkit-transform: translate3d(-50%, -25%, 0) scale(.4);
        transform: translate3d(-50%, -25%, 0) scale(.4);
        z-index: 2
    }

    30% {
        z-index: 4
    }

    100% {
        -webkit-transform: translate3d(-50%, 0, 0) scale(1);
        transform: translate3d(-50%, 0, 0) scale(1);
        z-index: 4
    }
}

@keyframes heroTitle {
    0% {
        -webkit-transform: translate3d(-50%, 25%, 0) scale(.2);
        transform: translate3d(-50%, 25%, 0) scale(.2);
        z-index: 2
    }

    25% {
        -webkit-transform: translate3d(-50%, -25%, 0) scale(.4);
        transform: translate3d(-50%, -25%, 0) scale(.4);
        z-index: 2
    }

    30% {
        z-index: 4
    }

    100% {
        -webkit-transform: translate3d(-50%, 0, 0) scale(1);
        transform: translate3d(-50%, 0, 0) scale(1);
        z-index: 4
    }
}

@-webkit-keyframes heroTitle2 {
    0% {
        -webkit-transform: translate3d(-50%, 25%, 0) scale(.2);
        transform: translate3d(-50%, 25%, 0) scale(.2);
        z-index: 2
    }

    25% {
        -webkit-transform: translate3d(-50%, -50%, 0) scale(.4);
        transform: translate3d(-50%, -50%, 0) scale(.4);
        z-index: 2
    }

    30% {
        z-index: 4
    }

    100% {
        -webkit-transform: translate3d(-50%, 0, 0) scale(1);
        transform: translate3d(-50%, 0, 0) scale(1);
        z-index: 4
    }
}

@keyframes heroTitle2 {
    0% {
        -webkit-transform: translate3d(-50%, 25%, 0) scale(.2);
        transform: translate3d(-50%, 25%, 0) scale(.2);
        z-index: 2
    }

    25% {
        -webkit-transform: translate3d(-50%, -50%, 0) scale(.4);
        transform: translate3d(-50%, -50%, 0) scale(.4);
        z-index: 2
    }

    30% {
        z-index: 4
    }

    100% {
        -webkit-transform: translate3d(-50%, 0, 0) scale(1);
        transform: translate3d(-50%, 0, 0) scale(1);
        z-index: 4
    }
}

@-webkit-keyframes move {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    50% {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%)
    }

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

@keyframes move {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    50% {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%)
    }

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

@-webkit-keyframes move2 {
    0% {
        scale: 1
    }

    50% {
        scale: 1.1
    }

    100% {
        scale: 1
    }
}

@keyframes move2 {
    0% {
        scale: 1
    }

    50% {
        scale: 1.1
    }

    100% {
        scale: 1
    }
}

.menu-open-bg {
    pointer-events: none;
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(253, 93, 0, .5);
    -webkit-backdrop-filter: blur(.5rem);
    backdrop-filter: blur(.5rem);
    opacity: 0;
    transition: opacity .3s ease 0s
}

.menu-open .menu-open-bg {
    opacity: 1
}

@-webkit-keyframes opacity {
    0% {
        opacity: 0;
        visibility: hidden
    }

    100% {
        opacity: 1;
        visibility: visible
    }
}

@keyframes opacity {
    0% {
        opacity: 0;
        visibility: hidden
    }

    100% {
        opacity: 1;
        visibility: visible
    }
}

@-webkit-keyframes to-bottom {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translateY(-2.5rem);
        transform: translateY(-2.5rem)
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes to-bottom {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translateY(-2.5rem);
        transform: translateY(-2.5rem)
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes tok1 {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translate(-50%, 0) scale(1);
        transform: translate(-50%, 0) scale(1)
    }

    25% {
        opacity: 1;
        visibility: visible
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translate(0, 0) scale(1);
        transform: translate(0, 0) scale(1)
    }
}

@keyframes tok1 {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translate(-50%, 0) scale(1);
        transform: translate(-50%, 0) scale(1)
    }

    25% {
        opacity: 1;
        visibility: visible
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translate(0, 0) scale(1);
        transform: translate(0, 0) scale(1)
    }
}

@-webkit-keyframes tok2 {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translate(50%, -15%) scale(.8);
        transform: translate(50%, -15%) scale(.8)
    }

    25% {
        opacity: 1;
        visibility: visible
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translate(0, 0) scale(1);
        transform: translate(0, 0) scale(1)
    }
}

@keyframes tok2 {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translate(50%, -15%) scale(.8);
        transform: translate(50%, -15%) scale(.8)
    }

    25% {
        opacity: 1;
        visibility: visible
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translate(0, 0) scale(1);
        transform: translate(0, 0) scale(1)
    }
}

@-webkit-keyframes tok3 {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translate(50%, 15%) scale(1.2);
        transform: translate(50%, 15%) scale(1.2)
    }

    25% {
        opacity: 1;
        visibility: visible
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translate(0, 0) scale(1);
        transform: translate(0, 0) scale(1)
    }
}

@keyframes tok3 {
    0% {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translate(50%, 15%) scale(1.2);
        transform: translate(50%, 15%) scale(1.2)
    }

    25% {
        opacity: 1;
        visibility: visible
    }

    100% {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translate(0, 0) scale(1);
        transform: translate(0, 0) scale(1)
    }
}

.hero {
    position: relative;
    margin-top: 5rem;
    background-color: #030234
}

.hero__top {
    overflow: hidden;
    position: relative;
    width: 100%;
    min-height: calc(100vh - 5rem)
}

.hero__top-image {
    position: absolute;
    display: inline-block
}

.hero__top-image img {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.hero__top-image--bg1 {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 70%;
    min-height: 27.5rem;
    will-change: transform
}

.hero__top-image--bg1 img {
    -o-object-position: center 0;
    object-position: center 0
}

.hero__top-image--bg2 {
    z-index: 3;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 74%;
    will-change: transform
}

.hero__top-image--bg2 img {
    -o-object-position: top;
    object-position: top
}

.hero__top-image--title {
    z-index: 2;
    bottom: 0;
    left: 50%;
    -webkit-transform: translate3d(-50%, 25%, 0) scale(.2);
    transform: translate3d(-50%, 25%, 0) scale(.2);
    aspect-ratio: 1110/920;
    will-change: transform
}

.loaded .hero__top-image--title {
    -webkit-animation: heroTitle 1.2s ease .6s forwards;
    animation: heroTitle 1.2s ease .6s forwards
}

.loaded .hero__top-image--title img {
    -webkit-animation: move 4s ease 1.8s infinite;
    animation: move 4s ease 1.8s infinite
}

.hero__top-image--title::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 28%;
    width: 44%;
    aspect-ratio: 500/52;
    background: url(../images/heroTitleDec.png) center/contain no-repeat;
    opacity: 0
}

.loaded .hero__top-image--title::before {
    opacity: 1;
    transition: opacity .3s ease 1s;
    -webkit-animation: move2 4s ease 2.2s infinite;
    animation: move2 4s ease 2.2s infinite
}

.hero__top-image--title img {
    -o-object-fit: contain;
    object-fit: contain
}

.hero__bottom {
    position: relative;
    z-index: 2;
    border-top: .4375rem solid #000;
    border-bottom: .4375rem solid #000;
    background: url(../images/bgGrid.svg) center/cover no-repeat, #BFF1FF
}

.hero__bottom-body {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.hero__bottom-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-wrap: nowrap;
    white-space: nowrap;
    row-gap: .625rem
}

.hero__bottom-text>span {
    position: relative
}

.hero__bottom-text>span:nth-child(1) {
    color: #fff;
    text-shadow: 0 .1388888889em 0 #000;
    -webkit-text-stroke-width: .2222222222em;
    paint-order: stroke fill;
    -webkit-text-stroke-color: #000;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: uppercase
}

.hero__bottom-text>span:nth-child(1)::before {
    content: "GO BUY";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    text-shadow: 0 .1388888889em 0 #000;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    -webkit-transform: translateY(5%);
    transform: translateY(5%);
    text-transform: uppercase
}

.hero__bottom-text>span:nth-child(2) {
    color: #fff;
    text-shadow: 0 .0666666667em 0 #000;
    -webkit-text-stroke-width: .1866666667em;
    -webkit-text-stroke-color: #000;
    paint-order: stroke fill;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: uppercase
}

.hero__bottom-text>span:nth-child(2)::before {
    content: "$NOVA";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    text-shadow: 0 .0666666667em 0 #000;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    -webkit-transform: translateY(5%);
    transform: translateY(5%);
    text-transform: uppercase
}

.hero__bottom-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    row-gap: .75rem
}

.hero__bottom-button {
    position: relative;
    width: 15.3125rem;
    height: 5rem;
    z-index: 2;
    border-radius: 5rem;
    border: .4375rem solid #000;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-family: CCMaladroitW00-Bold;
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    box-shadow: 0 .5rem 0 0 #000;
    transition: letter-spacing .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: letter-spacing .2s ease 0s, transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: letter-spacing .2s ease 0s, transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.hero__bottom-social {
    display: flex;
    align-items: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.hero__bottom-social-item {
    width: 5rem;
    height: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5rem;
    border: .4375rem solid #000;
    box-shadow: 0 .5rem 0 0 #000;
    transition: box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.hero__bottom-social-item:nth-child(1) {
    background-color: #030234
}

.hero__bottom-social-item:nth-child(2) {
    background-color: #4a4a4a
}

.hero__bottom-social-item:nth-child(3) {
    background-color: black
}

.hero__bottom-social-item svg {
    transition: scale .2s ease 0s;
    max-width: 60%;
    max-height: 60%
}

.about-how-tokenomics {
    position: relative;
    z-index: 2;
    background-color: #fefefe
}

.about-how-tokenomics::before {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(rgba(197, 44, 24, .3), transparent .125rem), linear-gradient(90deg, rgba(197, 44, 24, .3), transparent .125rem);
    background-size: 7vw 7vw;
    background-position: center center
}

.about-how-tokenomics::after {
    content: "";
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 10%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%)
}

.about-how-tokenomics__about {
    position: relative;
    z-index: 3
}

.about-how-tokenomics__how {
    position: relative;
    z-index: 3
}

.about-how-tokenomics__tokenomics {
    position: relative;
    z-index: 3
}

@-webkit-keyframes downloadArrow {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    50% {
        -webkit-transform: translateY(5%);
        transform: translateY(5%)
    }

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

@keyframes downloadArrow {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    50% {
        -webkit-transform: translateY(5%);
        transform: translateY(5%)
    }

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

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

.about__image {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
}

.about__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about__title {
    position: relative;
    opacity: 0;
    visibility: hidden;
    will-change: opacity, visibility
}

.about__title._watcher-view {
    -webkit-animation: opacity .3s ease .2s forwards;
    animation: opacity .3s ease .2s forwards
}

.about__title img {
    width: 100%
}

.about__text {
    color: #000;
    font-family: CCMaladroitW00-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    opacity: 0;
    visibility: hidden;
    will-change: opacity, visibility
}

.about__text._watcher-view {
    -webkit-animation: opacity .3s ease .2s forwards;
    animation: opacity .3s ease .2s forwards
}

.about__button {
    position: relative;
    z-index: 2;
    height: 4.375rem;
    border-radius: 6.25rem;
    border: .1875rem solid #000;
    background: #fff;
    box-shadow: 0 .1875rem 0 0 #000;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-column-gap: .75rem;
    -moz-column-gap: .75rem;
    column-gap: .75rem;
    transition: box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.about__button span {
    color: #000;
    font-family: CCMaladroitW00-Bold;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    text-transform: uppercase
}

.about__button span span {
    color: #030234
}

.how__title {
    position: relative;
    z-index: 3;
    opacity: 0;
    visibility: hidden;
    will-change: opacity, visibility
}

.how__title._watcher-view {
    -webkit-animation: opacity .3s ease .2s forwards;
    animation: opacity .3s ease .2s forwards
}

.how__title img {
    width: 100%
}

.how__items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem
}

.how__item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    will-change: opacity, visibility
}

.how__item-image {
    z-index: 2;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
}

.how__item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.how__item-body {
    border-radius: 1.75rem;
    border: .375rem solid #000;
    background-color: #fdfeff;
    box-shadow: 0 .875rem 0 0 #000
}

.how__item-title {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

.how__item-title span {
    color: #000;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: .85
}

.how__item-text {
    color: #000;
    font-family: CCMaladroitW00-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: normal
}

.how__item-text a {
    text-decoration: underline
}

.tokenomics__container {
    display: flex;
    align-items: center;
    justify-content: center
}

.tokenomics__title {
    position: relative;
    z-index: 1
}

.tokenomics__title img {
    width: 100%
}

.tokenomics__title img:nth-child(1) {
    display: block
}

.tokenomics__title img:nth-child(2) {
    display: block
}

.tokenomics__body {
    position: relative;
    z-index: 2
}

.tokenomics__body img {
    width: 100%
}

.tokenomics__ca {
    position: absolute;
    bottom: 4%;
    right: 5%;
    width: 65%;
    border-radius: .5rem;
    background: #fff;
    padding: .25rem .5rem;
    -webkit-column-gap: .5rem;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    display: flex;
    align-items: center
}

.tokenomics__ca:has(button:hover) span:nth-child(2) {
    color: #030234
}

.tokenomics__ca span:nth-child(1) {
    color: #000;
    font-family: CCMaladroitW00-Bold
}

.tokenomics__ca span:nth-child(2) {
    color: #000;
    font-family: CCMaladroitW00-Bold;
    word-break: break-all;
    text-align: center;
    transition: color .2s ease 0s
}

.tokenomics__ca button {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5625rem;
    height: 1.5625rem
}

.tokenomics__ca button svg path {
    transition: fill .2s ease 0s
}

.tokenomics__ca::after {
    content: "Address copied successfully";
    position: absolute;
    font-family: CCMaladroitW00-Bold;
    bottom: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(40%);
    transform: translateX(-50%) translateY(40%);
    color: #fff;
    z-index: 3;
    width: auto;
    line-height: 120%;
    transition: color .2s ease 0s;
    text-wrap: nowrap;
    white-space: nowrap;
    border-radius: 8px;
    background: #295a16;
    padding: .375rem .625rem;
    opacity: 0;
    visibility: hidden;
    will-change: transform, opacity, visibility;
    transition: opacity .3s ease-out 0s, visibility .3s ease-out 0s, -webkit-transform .3s ease-out 0s;
    transition: transform .3s ease-out 0s, opacity .3s ease-out 0s, visibility .3s ease-out 0s;
    transition: transform .3s ease-out 0s, opacity .3s ease-out 0s, visibility .3s ease-out 0s, -webkit-transform .3s ease-out 0s
}

.tokenomics__ca.ca-copied::after {
    -webkit-transform: translateX(-50%) translateY(15%);
    transform: translateX(-50%) translateY(15%);
    opacity: 1;
    visibility: visible
}

@-webkit-keyframes tokTitle {
    0% {
        -webkit-transform: translateX(80%) translateY(-8%) scale(.8);
        transform: translateX(80%) translateY(-8%) scale(.8)
    }

    100% {
        -webkit-transform: translateX(20%) translateY(-8%);
        transform: translateX(20%) translateY(-8%)
    }
}

@keyframes tokTitle {
    0% {
        -webkit-transform: translateX(80%) translateY(-8%) scale(.8);
        transform: translateX(80%) translateY(-8%) scale(.8)
    }

    100% {
        -webkit-transform: translateX(20%) translateY(-8%);
        transform: translateX(20%) translateY(-8%)
    }
}

.join {
    position: relative;
    z-index: 3;
    background-color: #030234
}

.join__body {
    position: relative
}

.join__body:has(.join__front._watcher-view) .join__heand-l {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0)
}

.join__body:has(.join__front._watcher-view) .join__heand-r {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0)
}

.join__body:has(.join__content._watcher-view) .join__heand-l {
    -webkit-transform: translateX(-5%) translateY(-25%);
    transform: translateX(-5%) translateY(-25%);
    transition: -webkit-transform .3s ease-out 0s;
    transition: transform .3s ease-out 0s;
    transition: transform .3s ease-out 0s, -webkit-transform .3s ease-out 0s
}

.join__body:has(.join__content._watcher-view) .join__heand-r {
    -webkit-transform: translateX(5%) translateY(-25%);
    transform: translateX(5%) translateY(-25%);
    transition: -webkit-transform .3s ease-out 0s;
    transition: transform .3s ease-out 0s;
    transition: transform .3s ease-out 0s, -webkit-transform .3s ease-out 0s
}

.join__sky {
    position: sticky;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    aspect-ratio: 1920/723
}

.join__sky img {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.join__title {
    position: sticky;
    z-index: 2;
    top: 10%;
    width: 100%;
    text-align: center;
    color: #fff;
    text-shadow: 0 .0510638298em 0 #000;
    -webkit-text-stroke-width: .085106383em;
    paint-order: stroke fill;
    -webkit-text-stroke-color: #000;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 120%
}

.join__title::before {
    content: "join us";
    position: absolute;
    z-index: -1;
    color: #fff;
    text-shadow: 0 .0510638298em 0 #000;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-wrap: nowrap;
    white-space: nowrap;
    -webkit-transform: translateY(12%);
    transform: translateY(12%)
}

.join__hero {
    position: sticky;
    z-index: 3;
    margin: 0 auto;
    top: 4%;
    width: 60%;
    min-width: 37.5rem;
    aspect-ratio: 1844/1643
}

.join__hero._watcher-view .join__top {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1);
    transition: visibility .3s ease-out 0s, opacity .3s ease-out 0s, -webkit-transform .3s ease-out 0s;
    transition: visibility .3s ease-out 0s, opacity .3s ease-out 0s, transform .3s ease-out 0s;
    transition: visibility .3s ease-out 0s, opacity .3s ease-out 0s, transform .3s ease-out 0s, -webkit-transform .3s ease-out 0s
}

.join__hero img {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.join__front {
    pointer-events: none;
    position: relative;
    z-index: 4;
    top: 25%;
    left: 0;
    width: 100%
}

.join__front>img {
    pointer-events: none;
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: calc(100% + .125rem);
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top;
    object-position: top
}

.join__container-box {
    pointer-events: all;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
    height: auto;
    z-index: 8
}

.join__top {
    position: absolute;
    z-index: 2;
    top: 10%;
    left: 20%;
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(100%) scale(0);
    transform: translateY(100%) scale(0);
    transition: visibility .2s ease-in 0s, opacity .2s ease-in 0s, -webkit-transform .2s ease-in 0s;
    transition: visibility .2s ease-in 0s, opacity .2s ease-in 0s, transform .2s ease-in 0s;
    transition: visibility .2s ease-in 0s, opacity .2s ease-in 0s, transform .2s ease-in 0s, -webkit-transform .2s ease-in 0s
}

.join__button {
    position: relative;
    z-index: 2;
    border-radius: 5rem;
    border: .4375rem solid #000;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-family: CCMaladroitW00-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    box-shadow: 0 .5rem 0 0 #000;
    transition: letter-spacing .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: letter-spacing .2s ease 0s, transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: letter-spacing .2s ease 0s, transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.join__top-social {
    display: flex;
    align-items: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.join__top-social-social {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5rem;
    border: .4375rem solid #000;
    box-shadow: 0 .5rem 0 0 #000;
    transition: box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.join__top-social-social:nth-child(1) {
    background-color: #030234
}

.join__top-social-social:nth-child(2) {
    background-color: #4a4a4a
}

.join__top-social-social svg {
    transition: scale .2s ease 0s;
    max-width: 60%;
    max-height: 60%
}

.join__content {
    position: relative;
    z-index: 6;
    top: 40%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: .9375rem;
    padding-right: .9375rem
}

.join__content._watcher-view .join__menu {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
    visibility: visible
}

.join__content._watcher-view .join__image {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
    visibility: visible
}

.join__menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    -webkit-transform: translateX(20%);
    transform: translateX(20%);
    opacity: 0;
    visibility: hidden;
    transition: visibility .3s ease .15s, opacity .3s ease .15s, -webkit-transform .3s ease .15s;
    transition: transform .3s ease .15s, visibility .3s ease .15s, opacity .3s ease .15s;
    transition: transform .3s ease .15s, visibility .3s ease .15s, opacity .3s ease .15s, -webkit-transform .3s ease .15s
}

.join__menu-row {
    display: flex;
    align-items: center
}

.join__menu-item {
    position: relative;
    color: #fff;
    text-shadow: 0 .0833333333em 0 #000;
    -webkit-text-stroke-width: .1666666667em;
    -webkit-text-stroke-color: #000;
    paint-order: stroke fill;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-wrap: nowrap;
    white-space: nowrap;
    transition: color .2s ease 0s
}

.join__menu-item.join__menu-item--1::before {
    content: "about"
}

.join__menu-item.join__menu-item--2::before {
    content: "HISTORY"
}

.join__menu-item.join__menu-item--3::before {
    content: "Tokenomics"
}

.join__menu-item::before {
    content: "";
    position: absolute;
    z-index: -1;
    color: #fff;
    text-shadow: 0 .0833333333em 0 #000;
    font-family: "Brave Spirit";
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-wrap: nowrap;
    white-space: nowrap;
    -webkit-transform: translateY(5%);
    transform: translateY(5%)
}

.join__menu-social {
    display: flex;
    align-items: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.join__menu-social-social {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5rem;
    border: .4375rem solid #000;
    box-shadow: 0 .5rem 0 0 #000;
    transition: box-shadow .2s ease 0s, -webkit-transform .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s;
    transition: transform .2s ease 0s, box-shadow .2s ease 0s, -webkit-transform .2s ease 0s
}

.join__menu-social-social:nth-child(1) {
    background-color: #030234
}

.join__menu-social-social:nth-child(2) {
    background-color: #4a4a4a
}

.join__menu-social-social svg {
    transition: scale .2s ease 0s;
    max-width: 60%;
    max-height: 60%
}

.join__image {
    flex: 0 0 30%;
    -webkit-transform: translateX(-20%);
    transform: translateX(-20%);
    opacity: 0;
    visibility: hidden;
    transition: visibility .3s ease .15s, opacity .3s ease .15s, -webkit-transform .3s ease .15s;
    transition: transform .3s ease .15s, visibility .3s ease .15s, opacity .3s ease .15s;
    transition: transform .3s ease .15s, visibility .3s ease .15s, opacity .3s ease .15s, -webkit-transform .3s ease .15s
}

.join__image img {
    width: 100%
}

.join__bottom {
    position: relative;
    z-index: 4;
    border-top: .3125rem solid #000;
    background-color: #030234;
    padding: .9375rem 0;
    margin-top: -.125rem
}

.join__bottom-body {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.join__bottom-body>span {
    color: #fff;
    text-align: right;
    font-family: CCMaladroitW00-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase
}

.join__bottom-body>a {
    display: flex;
    align-items: center;
    -webkit-column-gap: .25rem;
    -moz-column-gap: .25rem;
    column-gap: .25rem;
    transition: -webkit-transform .3s ease 0s;
    transition: transform .3s ease 0s;
    transition: transform .3s ease 0s, -webkit-transform .3s ease 0s
}

.join__bottom-body>a span {
    color: #fff;
    text-align: right;
    font-family: CCMaladroitW00-Bold;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase
}

.tos {
    position: relative;
    z-index: 1;
    font-family: Fredoka;
    line-height: 1;
    background-color: #fefefe
}

.tos::before {
    pointer-events: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(rgba(197, 44, 24, .1), transparent .125rem), linear-gradient(90deg, rgba(197, 44, 24, .1), transparent .125rem);
    background-size: 2vw 2vw;
    background-position: center center
}

.tos__container {
    position: relative;
    z-index: 2
}

.tos__container>h2 {
    text-align: center
}

.tos__container>h3 {
    text-align: center
}

.tos__container>p {
    line-height: 1.4
}

.tos__container>p span {
    font-weight: 700
}

.tos__container ul li {
    line-height: 1.4;
    display: flex;
    align-items: flex-start
}

.tos__container ul li.column {
    flex-direction: column
}

.tos__container ul li div {
    display: flex;
    align-items: flex-start
}

.tos__container ul li span {
    flex-shrink: 0;
    text-align: right
}

.tos__container ul li p span {
    font-weight: 700
}

.tos__container ul li a {
    text-decoration: underline
}

.bold {
    font-weight: 700
}

i {
    font-style: normal
}

.center {
    text-align: center
}

.underline {
    text-decoration: underline
}

ul.countries li {
    position: relative;
    display: flex;
    align-items: flex-start
}

ul.countries li::before {
    content: "";
    flex-shrink: 0;
    width: .5rem;
    aspect-ratio: 1;
    background-color: #000;
    border-radius: 50%;
    -webkit-transform: translateY(.375rem);
    transform: translateY(.375rem)
}

@media (min-width:47.99875em) {
    .header {
        background: url(../images/bgGridHeader.svg) center/cover no-repeat, #BFF1FF
    }

    .hero {
        min-height: 100vh
    }

    .about__image {
        flex: 0 0 calc(50% - 1.25rem)
    }

    .about__content {
        flex: 0 0 45%
    }

    .how__items._watcher-view .how__item:nth-child(1) {
        -webkit-animation: opacity .3s ease .2s forwards;
        animation: opacity .3s ease .2s forwards
    }

    .how__items._watcher-view .how__item:nth-child(1) .how__item-body {
        -webkit-animation: to-bottom .3s ease .4s forwards;
        animation: to-bottom .3s ease .4s forwards
    }

    .how__items._watcher-view .how__item:nth-child(2) {
        -webkit-animation: opacity .3s ease .6s forwards;
        animation: opacity .3s ease .6s forwards
    }

    .how__items._watcher-view .how__item:nth-child(2) .how__item-body {
        -webkit-animation: to-bottom .3s ease .8s forwards;
        animation: to-bottom .3s ease .8s forwards
    }

    .how__items._watcher-view .how__item:nth-child(3) {
        -webkit-animation: opacity .3s ease 1s forwards;
        animation: opacity .3s ease 1s forwards
    }

    .how__items._watcher-view .how__item:nth-child(3) .how__item-body {
        -webkit-animation: to-bottom .3s ease 1.2s forwards;
        animation: to-bottom .3s ease 1.2s forwards
    }

    .how__items._watcher-view .how__item:nth-child(4) {
        -webkit-animation: opacity .3s ease 1.4s forwards;
        animation: opacity .3s ease 1.4s forwards
    }

    .how__items._watcher-view .how__item:nth-child(4) .how__item-body {
        -webkit-animation: to-bottom .3s ease 1.6s forwards;
        animation: to-bottom .3s ease 1.6s forwards
    }

    .how__item-body {
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translateY(-2.5rem);
        transform: translateY(-2.5rem);
        will-change: transform, opacity, visibility
    }

    .tokenomics__container:has(.tokenomics__body._watcher-view) .tokenomics__title {
        -webkit-animation: tokTitle .45s ease-out forwards;
        animation: tokTitle .45s ease-out forwards
    }

    .tokenomics__title {
        flex: 0 0 45%;
        -webkit-transform: translateX(80%) translateY(-8%) scale(.8);
        transform: translateX(80%) translateY(-8%) scale(.8)
    }

    .tokenomics__title img:nth-child(2) {
        display: none
    }

    .tokenomics__body {
        flex: 0 0 50%;
        -webkit-transform: translateX(-30%) rotate(9.8deg);
        transform: translateX(-30%) rotate(9.8deg)
    }

    .join__front {
        aspect-ratio: 1920/1018
    }
}

@media (min-width:96.875em) {
    .menu__list {
        -webkit-column-gap: 4rem;
        -moz-column-gap: 4rem;
        column-gap: 4rem
    }

    .menu__link {
        font-size: 1.5rem
    }

    .header__logo {
        width: 12.75rem
    }

    .header__actions {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .header__button {
        width: 13.125rem
    }

    .header__button {
        height: 3.375rem
    }

    .header__button {
        font-size: 1.5rem
    }

    .header__social {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .header__social-item {
        width: 3.375rem
    }

    .header__social-item {
        height: 3.375rem
    }

    .hero__top {
        height: 52.5rem
    }

    .hero__top-image--title {
        width: 61.25rem
    }

    .hero__bottom {
        padding-top: 3.125rem
    }

    .hero__bottom {
        padding-bottom: 3.125rem
    }

    .hero__bottom-text>span:nth-child(1) {
        font-size: 2.25rem
    }

    .hero__bottom-text>span:nth-child(1)::before {
        font-size: 2.25rem
    }

    .hero__bottom-text>span:nth-child(2) {
        font-size: 4.6875rem
    }

    .hero__bottom-text>span:nth-child(2)::before {
        font-size: 4.6875rem
    }

    .about-how-tokenomics__tokenomics {
        padding-top: 6.25rem
    }

    .about-how-tokenomics__tokenomics {
        padding-bottom: 3.75rem
    }

    .about {
        padding-top: 5rem
    }

    .about {
        padding-bottom: 5rem
    }

    .about__title {
        width: 31.9375rem
    }

    .about__title {
        margin-bottom: 1.875rem
    }

    .about__text {
        font-size: 1.5rem
    }

    .about__text {
        margin-bottom: 2.25rem
    }

    .about__button {
        width: 22.5rem
    }

    .how {
        padding-top: 5rem
    }

    .how {
        padding-bottom: 5rem
    }

    .how__title {
        width: 51.6875rem
    }

    .how__item-image {
        margin-bottom: .75rem
    }

    .how__item-body {
        padding: 1.5rem
    }

    .how__item-title span {
        font-size: 3.375rem
    }

    .how__item-title span {
        margin-bottom: 1.125rem
    }

    .how__item-text {
        font-size: 1.25rem
    }

    .tokenomics__ca span:nth-child(1) {
        font-size: 1.5rem
    }

    .tokenomics__ca span:nth-child(2) {
        font-size: 1.25rem
    }

    .tokenomics__ca::after {
        font-size: 1.25rem
    }

    .join__title {
        font-size: 14.6875rem
    }

    .join__title::before {
        font-size: 14.6875rem
    }

    .join__button {
        font-size: 2rem
    }

    .join__button {
        width: 15.3125rem
    }

    .join__button {
        height: 5rem
    }

    .join__top-social-social {
        width: 5rem
    }

    .join__top-social-social {
        height: 5rem
    }

    .join__content {
        padding-bottom: 3.75rem
    }

    .join__content {
        -webkit-column-gap: 23.75rem;
        -moz-column-gap: 23.75rem;
        column-gap: 23.75rem
    }

    .join__menu {
        row-gap: 1.125rem
    }

    .join__menu-row {
        -webkit-column-gap: 3.5rem;
        -moz-column-gap: 3.5rem;
        column-gap: 3.5rem
    }

    .join__menu-item {
        font-size: 4.5rem
    }

    .join__menu-item::before {
        font-size: 4.5rem
    }

    .join__menu-social-social {
        width: 5rem
    }

    .join__menu-social-social {
        height: 5rem
    }

    .join__bottom-body>span {
        font-size: 1.125rem
    }

    .join__bottom-body>a span {
        font-size: 1.125rem
    }

    .join__bottom-body>a img {
        width: 8.125rem
    }

    .tos {
        padding-top: 8.75rem
    }

    .tos {
        padding-bottom: 3.75rem
    }

    .tos__container>h2 {
        font-size: 3rem
    }

    .tos__container>h2 {
        margin-bottom: 1.875rem
    }

    .tos__container>h2:not(:first-child) {
        padding-top: 5rem
    }

    .tos__container>h3 {
        font-size: 1.5rem
    }

    .tos__container>h3 {
        margin-bottom: 2.5rem
    }

    .tos__container>h4 {
        font-size: 1.5rem
    }

    .tos__container>h4 {
        margin-bottom: 1.25rem
    }

    .tos__container>p {
        font-size: 1.125rem
    }

    .tos__container>p {
        margin-bottom: 1.25rem
    }

    .tos__container ul {
        padding-left: 3.75rem
    }

    .tos__container ul li {
        -webkit-column-gap: 1.5rem;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .tos__container ul li {
        font-size: 1.125rem
    }

    .tos__container ul li {
        margin-bottom: 1.25rem
    }

    .tos__container ul li div {
        -webkit-column-gap: 1.5rem;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .tos__container ul li div {
        margin-bottom: 1.25rem
    }

    .tos__container ul li span {
        width: 3.25rem
    }

    ul.countries li {
        -webkit-column-gap: 1.125rem;
        -moz-column-gap: 1.125rem;
        column-gap: 1.125rem
    }
}

@media (max-width:20em) {
    .header__logo {
        width: 9.375rem
    }

    .header__button {
        width: 15rem
    }

    .header__button {
        height: 3.25rem
    }

    .header__button {
        font-size: 1.5rem
    }

    .header__social-item {
        width: 3.25rem
    }

    .header__social-item {
        height: 3.25rem
    }

    .hero__top-image--title {
        width: 18.125rem
    }

    .hero__bottom-text>span:nth-child(1) {
        font-size: 1.5rem
    }

    .hero__bottom-text>span:nth-child(1)::before {
        font-size: 1.5rem
    }

    .hero__bottom-text>span:nth-child(2) {
        font-size: 2.75rem
    }

    .hero__bottom-text>span:nth-child(2)::before {
        font-size: 2.75rem
    }

    .about-how-tokenomics__tokenomics {
        padding-top: 3.75rem
    }

    .about-how-tokenomics__tokenomics {
        padding-bottom: 2.5rem
    }

    .about {
        padding-top: 3.75rem
    }

    .about {
        padding-bottom: 2.5rem
    }

    .about__title {
        width: 18.125rem
    }

    .about__title {
        margin-bottom: 1.25rem
    }

    .about__text {
        font-size: 1rem
    }

    .about__text {
        margin-bottom: 1.875rem
    }

    .how {
        padding-top: 3.75rem
    }

    .how {
        padding-bottom: 1.25rem
    }

    .how__item-body {
        padding: 1.125rem
    }

    .how__item-title span {
        font-size: 2.125rem
    }

    .how__item-title span {
        margin-bottom: .75rem
    }

    .how__item-text {
        font-size: 1rem
    }

    .tokenomics__body {
        margin-top: -6.25rem
    }

    .tokenomics__ca span:nth-child(1) {
        font-size: .875rem
    }

    .tokenomics__ca span:nth-child(2) {
        font-size: .6625rem
    }

    .tokenomics__ca::after {
        font-size: .75rem
    }

    .join__title {
        font-size: 4.5rem
    }

    .join__title::before {
        font-size: 4.5rem
    }

    .join__front {
        height: 18.75rem
    }

    .join__content {
        padding-bottom: 1.25rem
    }

    .join__menu {
        row-gap: .625rem
    }

    .join__menu-item {
        font-size: 2rem
    }

    .join__bottom-body>span {
        font-size: 1rem
    }

    .join__bottom-body>a span {
        font-size: 1rem
    }

    .join__bottom-body>a img {
        width: 7.5rem
    }

    .tos {
        padding-top: 7.5rem
    }

    .tos {
        padding-bottom: 2.5rem
    }

    .tos__container>h2 {
        font-size: 2.25rem
    }

    .tos__container>h2 {
        margin-bottom: 1.25rem
    }

    .tos__container>h2:not(:first-child) {
        padding-top: 1.875rem
    }

    .tos__container>h3 {
        font-size: 1.25rem
    }

    .tos__container>h3 {
        margin-bottom: 1.875rem
    }

    .tos__container>h4 {
        font-size: 1.25rem
    }

    .tos__container>h4 {
        margin-bottom: .625rem
    }

    .tos__container>p {
        font-size: .875rem
    }

    .tos__container>p {
        margin-bottom: .625rem
    }

    .tos__container ul {
        padding-left: .625rem
    }

    .tos__container ul li {
        -webkit-column-gap: .75rem;
        -moz-column-gap: .75rem;
        column-gap: .75rem
    }

    .tos__container ul li {
        font-size: .875rem
    }

    .tos__container ul li {
        margin-bottom: .625rem
    }

    .tos__container ul li div {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .tos__container ul li div {
        margin-bottom: .625rem
    }

    .tos__container ul li span {
        width: 2.625rem
    }

    ul.countries li {
        -webkit-column-gap: .5rem;
        -moz-column-gap: .5rem;
        column-gap: .5rem
    }
}

@media (max-width:61.99875em) {
    .how__items {
        gap: .75rem
    }

    .join__hero {
        top: 6%
    }

    .join__front>img {
        width: 110%;
        height: 110%
    }

    .join__button {
        border: .25rem solid #000;
        box-shadow: 0 .3125rem 0 0 #000
    }

    .join__top-social-social {
        border: .25rem solid #000;
        box-shadow: 0 .3125rem 0 0 #000
    }

    .join__menu-social-social {
        border: .25rem solid #000;
        box-shadow: 0 .3125rem 0 0 #000
    }
}

@media (max-width:47.99875em) {
    .menu__body {
        position: fixed;
        width: 100%;
        height: 100%;
        right: -100%;
        top: 0;
        overflow: auto;
        padding: 7.5rem .9375rem .9375rem .9375rem;
        transition: right .3s ease
    }

    .menu-open .menu__body {
        right: 0
    }

    .menu__list {
        flex-direction: column;
        row-gap: 1.875rem;
        margin-bottom: 1.875rem;
        -webkit-transform: scaleX(1.6);
        transform: scaleX(1.6);
        transition: -webkit-transform .3s ease .3s;
        transition: transform .3s ease .3s;
        transition: transform .3s ease .3s, -webkit-transform .3s ease .3s;
        -webkit-transform-origin: right;
        transform-origin: right
    }

    .menu-open .menu__list {
        -webkit-transform-origin: left;
        transform-origin: left;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        transition: -webkit-transform .3s ease .15s;
        transition: transform .3s ease .15s;
        transition: transform .3s ease .15s, -webkit-transform .3s ease .15s
    }

    .icon-menu {
        border: .1875rem solid #000;
        background-color: #fff;
        box-shadow: 0 .25rem 0 0 #000;
        display: block;
        position: relative;
        width: 3rem;
        height: 3rem;
        border-radius: 50%;
        z-index: 5
    }

    .icon-menu span,
    .icon-menu::after,
    .icon-menu::before {
        content: "";
        transition: all .3s ease 0s;
        right: .375rem;
        position: absolute;
        width: 1.875rem;
        height: .125rem;
        background-color: #000
    }

    .icon-menu::before {
        top: .8125rem
    }

    .icon-menu::after {
        bottom: .8125rem
    }

    .icon-menu span {
        top: calc(50% - .0625rem)
    }

    .menu-open .icon-menu span {
        width: 0
    }

    .menu-open .icon-menu::before {
        top: calc(50% - .0625rem);
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    .menu-open .icon-menu::after {
        bottom: calc(50% - .0625rem);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .header {
        border-bottom: 0 solid #000;
        height: 4.375rem
    }

    .header__actions {
        flex-direction: column;
        row-gap: 1rem;
        -webkit-transform: scaleX(1.6);
        transform: scaleX(1.6);
        transition: -webkit-transform .3s ease .3s;
        transition: transform .3s ease .3s;
        transition: transform .3s ease .3s, -webkit-transform .3s ease .3s;
        -webkit-transform-origin: right;
        transform-origin: right
    }

    .menu-open .header__actions {
        -webkit-transform-origin: left;
        transform-origin: left;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        transition: -webkit-transform .3s ease .15s;
        transition: transform .3s ease .15s;
        transition: transform .3s ease .15s, -webkit-transform .3s ease .15s
    }

    .header__social {
        gap: 1rem
    }

    .header__social-item {
        border: .1875rem solid #000;
        box-shadow: 0 .25rem 0 0 #000
    }

    .hero {
        margin-top: 4.375rem
    }

    .hero::before {
        content: "";
        pointer-events: none;
        position: absolute;
        bottom: 100%;
        left: 0;
        width: 100%;
        height: 20%;
        background-color: #030234
    }

    .hero__top {
        height: 70vh;
        height: calc(70vh - 4.375rem);
        min-height: 25rem
    }

    .hero__top-image--bg1 {
        top: -15%
    }

    .loaded .hero__top-image--title {
        -webkit-animation: heroTitle2 1.2s ease .6s forwards;
        animation: heroTitle2 1.2s ease .6s forwards
    }

    .hero__top-image--title {
        bottom: 10%
    }

    .hero__bottom {
        border-top: .3125rem solid #000;
        border-bottom: .3125rem solid #000
    }

    .hero__bottom-body {
        padding: .625rem 0;
        min-height: calc(30vh - .625rem);
        flex-direction: column;
        justify-content: center;
        row-gap: 1.25rem
    }

    .hero__bottom-text {
        align-items: center
    }

    .hero__bottom-actions {
        flex-direction: column
    }

    .hero__bottom-button {
        border: .1875rem solid #000;
        width: 16.25rem;
        height: 3.375rem;
        font-size: 1.75rem;
        box-shadow: 0 .25rem 0 0 #000
    }

    .hero__bottom-social-item {
        border: .1875rem solid #000;
        width: 3.375rem;
        height: 3.375rem;
        box-shadow: 0 .25rem 0 0 #000
    }

    .about-how-tokenomics::before {
        background-size: 14vw 14vw
    }

    .about__container {
        flex-direction: column-reverse;
        row-gap: .625rem
    }

    .about__image {
        width: 100%;
        max-width: 32.5rem
    }

    .about__content {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center
    }

    .about__button {
        width: 100%;
        height: 3.375rem
    }

    .how__items {
        grid-template-columns: repeat(1, 1fr);
        gap: 1.25rem
    }

    .how__item._watcher-view {
        -webkit-animation: opacity .3s ease .2s forwards;
        animation: opacity .3s ease .2s forwards
    }

    .how__item-image {
        max-width: 20rem;
        margin-bottom: -3.4375rem
    }

    .how__item-body {
        border: .1875rem solid #000;
        box-shadow: 0 .4375rem 0 0 #000;
        padding-top: 1.875rem
    }

    .tokenomics__container {
        flex-direction: column
    }

    .tokenomics__title {
        -webkit-transform: translateX(2%) rotate(-10deg);
        transform: translateX(2%) rotate(-10deg)
    }

    .tokenomics__title img:nth-child(1) {
        display: none
    }

    .tokenomics__body {
        width: calc(100% + 1.875rem);
        margin-left: -.9375rem;
        margin-right: -.9375rem
    }

    .tokenomics__ca {
        -webkit-column-gap: .375rem;
        -moz-column-gap: .375rem;
        column-gap: .375rem
    }

    .join__hero {
        width: 100%;
        min-width: 0;
        top: 25%
    }

    .join__hero img {
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -30%);
        transform: translate(-50%, -30%);
        width: 130%;
        height: 130%
    }

    .join__front>img {
        width: 100%;
        height: 102%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: top;
        object-position: top
    }

    .join__top {
        top: 0;
        flex-direction: column;
        row-gap: .75rem
    }

    .join__button {
        border: .1875rem solid #000;
        width: 16.25rem;
        height: 3.375rem;
        font-size: 1.75rem;
        box-shadow: 0 .25rem 0 0 #000
    }

    .join__top-social-social {
        border: .1875rem solid #000;
        width: 3.375rem;
        height: 3.375rem;
        box-shadow: 0 .25rem 0 0 #000
    }

    .join__menu {
        align-items: center
    }

    .join__menu-social {
        display: none
    }

    .join__menu-social-social {
        border: .1875rem solid #000;
        width: 3.375rem;
        height: 3.375rem;
        box-shadow: 0 .25rem 0 0 #000
    }

    .join__image {
        display: none
    }

    .join__bottom-body {
        flex-direction: column-reverse;
        row-gap: .625rem
    }

    .tos::before {
        background-size: 4vw 4vw
    }

    .how__item-image {
        margin-bottom: 0; /* Supprime le chevauchement */
    }

    .how__item-body {
        padding-top: 3rem; /* Augmente l'espacement au-dessus du texte */
    }
}

@media (max-width:47.99875em)and (any-hover:none) {
    .icon-menu {
        cursor: default
    }
}

@media (max-width:47.99875em)and (max-width:20em) {
    .how__items {
        margin-top: -.625rem
    }
}

@media (min-width:47.99875em)and (max-width:96.875em) {
    .menu__list {
        -webkit-column-gap: clamp(1.25rem, -1.4506278612rem + 5.6264545664vw, 4rem);
        -moz-column-gap: clamp(1.25rem, -1.4506278612rem + 5.6264545664vw, 4rem);
        column-gap: clamp(1.25rem, -1.4506278612rem + 5.6264545664vw, 4rem)
    }

    .menu__link {
        font-size: clamp(.8875rem, .2859965218rem + 1.2531648807vw, 1.5rem)
    }

    .header__logo {
        width: clamp(9.375rem, 6.0605930795rem + 6.9051942406vw, 12.75rem)
    }

    .header__actions {
        -webkit-column-gap: clamp(.375rem, -.2387790594rem + 1.2787396742vw, 1rem);
        -moz-column-gap: clamp(.375rem, -.2387790594rem + 1.2787396742vw, 1rem);
        column-gap: clamp(.375rem, -.2387790594rem + 1.2787396742vw, 1rem)
    }

    .header__button {
        width: clamp(7.5rem, 1.9759884658rem + 11.5086570676vw, 13.125rem)
    }

    .header__button {
        height: clamp(2.875rem, 2.3839767525rem + 1.0229917393vw, 3.375rem)
    }

    .header__button {
        font-size: clamp(1.25rem, 1.0044883763rem + .5114958697vw, 1.5rem)
    }

    .header__social {
        -webkit-column-gap: clamp(.375rem, -.2387790594rem + 1.2787396742vw, 1rem);
        -moz-column-gap: clamp(.375rem, -.2387790594rem + 1.2787396742vw, 1rem);
        column-gap: clamp(.375rem, -.2387790594rem + 1.2787396742vw, 1rem)
    }

    .header__social-item {
        width: clamp(2.875rem, 2.3839767525rem + 1.0229917393vw, 3.375rem)
    }

    .header__social-item {
        height: clamp(2.875rem, 2.3839767525rem + 1.0229917393vw, 3.375rem)
    }

    .hero__top {
        height: clamp(40rem, 27.7244188128rem + 25.5747934835vw, 52.5rem)
    }

    .hero__top-image--title {
        width: clamp(37.5rem, 14.1763957444rem + 48.5921076187vw, 61.25rem)
    }

    .hero__bottom {
        padding-top: clamp(1.875rem, .6474418813rem + 2.5574793484vw, 3.125rem)
    }

    .hero__bottom {
        padding-bottom: clamp(1.875rem, .6474418813rem + 2.5574793484vw, 3.125rem)
    }

    .about__title {
        width: clamp(17.5rem, 3.3217037288rem + 29.5388864735vw, 31.9375rem)
    }

    .about__text {
        font-size: clamp(1rem, .5089767525rem + 1.0229917393vw, 1.5rem)
    }

    .about__button {
        width: clamp(20.625rem, 18.7836628219rem + 3.8362190225vw, 22.5rem)
    }

    .how__title {
        width: clamp(38.75rem, 26.0447734713rem + 26.4699112555vw, 51.6875rem)
    }

    .how__item-image {
        margin-bottom: clamp(.75rem, 9.9169650393rem + -9.4626735889vw, 5.375rem)
    }

    .how__item-body {
        padding: clamp(.75rem, .0134651288rem + 1.534487609vw, 1.5rem)
    }

    .how__item-title span {
        font-size: clamp(1.625rem, -.0935813662rem + 3.5804710877vw, 3.375rem)
    }

    .how__item-text {
        font-size: clamp(.75rem, .2589767525rem + 1.0229917393vw, 1.25rem)
    }

    .tokenomics__ca span:nth-child(1) {
        font-size: clamp(.875rem, .2612209406rem + 1.2787396742vw, 1.5rem)
    }

    .tokenomics__ca span:nth-child(2) {
        font-size: clamp(.6375rem, .0359965218rem + 1.2531648807vw, 1.25rem)
    }

    .tokenomics__ca::after {
        font-size: clamp(.875rem, .5067325644rem + .7672438045vw, 1.25rem)
    }

    .join__button {
        font-size: clamp(1.625rem, 1.2567325644rem + .7672438045vw, 2rem)
    }

    .join__button {
        width: clamp(11.25rem, 7.2604361142rem + 8.3118078822vw, 15.3125rem)
    }

    .join__button {
        height: clamp(4rem, 3.017953505rem + 2.0459834787vw, 5rem)
    }

    .join__top-social-social {
        width: clamp(4rem, 3.017953505rem + 2.0459834787vw, 5rem)
    }

    .join__top-social-social {
        height: clamp(4rem, 3.017953505rem + 2.0459834787vw, 5rem)
    }

    .join__content {
        padding-bottom: clamp(1.875rem, .0336628219rem + 3.8362190225vw, 3.75rem)
    }

    .join__content {
        -webkit-column-gap: clamp(3.75rem, -15.8909298995rem + 40.9196695737vw, 23.75rem);
        -moz-column-gap: clamp(3.75rem, -15.8909298995rem + 40.9196695737vw, 23.75rem);
        column-gap: clamp(3.75rem, -15.8909298995rem + 40.9196695737vw, 23.75rem)
    }

    .join__menu {
        row-gap: clamp(.75rem, .3817325644rem + .7672438045vw, 1.125rem)
    }

    .join__menu-row {
        -webkit-column-gap: clamp(1.5rem, -.4640929899rem + 4.0919669574vw, 3.5rem);
        -moz-column-gap: clamp(1.5rem, -.4640929899rem + 4.0919669574vw, 3.5rem);
        column-gap: clamp(1.5rem, -.4640929899rem + 4.0919669574vw, 3.5rem)
    }

    .join__menu-item {
        font-size: clamp(2.875rem, 1.2791744457rem + 3.3247231529vw, 4.5rem)
    }

    .join__menu-item::before {
        font-size: clamp(2.875rem, 1.2791744457rem + 3.3247231529vw, 4.5rem)
    }

    .join__menu-social-social {
        width: clamp(4rem, 3.017953505rem + 2.0459834787vw, 5rem)
    }

    .join__menu-social-social {
        height: clamp(4rem, 3.017953505rem + 2.0459834787vw, 5rem)
    }

    .join__bottom-body>span {
        font-size: 1.125rem
    }

    .join__bottom-body>a span {
        font-size: 1.125rem
    }

    .join__bottom-body>a img {
        width: 8.125rem
    }

    .tos {
        padding-top: 8.75rem
    }

    .tos {
        padding-bottom: 3.75rem
    }

    .tos__container>h2 {
        font-size: 3rem
    }

    .tos__container>h2 {
        margin-bottom: 1.875rem
    }

    .tos__container>h2:not(:first-child) {
        padding-top: 5rem
    }

    .tos__container>h3 {
        font-size: 1.5rem
    }

    .tos__container>h3 {
        margin-bottom: 2.5rem
    }

    .tos__container>h4 {
        font-size: 1.5rem
    }

    .tos__container>h4 {
        margin-bottom: 1.25rem
    }

    .tos__container>p {
        font-size: 1.125rem
    }

    .tos__container>p {
        margin-bottom: 1.25rem
    }

    .tos__container ul {
        padding-left: 3.75rem
    }

    .tos__container ul li {
        -webkit-column-gap: 1.5rem;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .tos__container ul li {
        font-size: 1.125rem
    }

    .tos__container ul li {
        margin-bottom: 1.25rem
    }

    .tos__container ul li div {
        -webkit-column-gap: 1.5rem;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .tos__container ul li div {
        margin-bottom: 1.25rem
    }

    .tos__container ul li span {
        width: 3.25rem
    }

    ul.countries li {
        -webkit-column-gap: 1.125rem;
        -moz-column-gap: 1.125rem;
        column-gap: 1.125rem
    }
}

@media (min-width:20em)and (max-width:47.99875em) {
    .header__logo {
        width: clamp(9.375rem, 8.9285514978rem + 2.2322425108vw, 10rem)
    }

    .header__button {
        width: clamp(15rem, 14.1071029957rem + 4.4644850217vw, 16.25rem)
    }

    .header__button {
        height: clamp(3.25rem, 3.1607102996rem + .4464485022vw, 3.375rem)
    }

    .header__button {
        font-size: clamp(1.5rem, 1.4107102996rem + .4464485022vw, 1.625rem)
    }

    .header__social-item {
        width: clamp(3.25rem, 2.8928411983rem + 1.7857940087vw, 3.75rem)
    }

    .header__social-item {
        height: clamp(3.25rem, 2.8928411983rem + 1.7857940087vw, 3.75rem)
    }

    .hero__top-image--title {
        width: clamp(18.125rem, 4.2850964329rem + 69.1995178356vw, 37.5rem)
    }

    .about__title {
        width: clamp(18.125rem, 8.2584881021rem + 49.3325594893vw, 31.9375rem)
    }

    .about__text {
        font-size: clamp(1rem, .6428411983rem + 1.7857940087vw, 1.5rem)
    }

    .how__item-body {
        padding: clamp(1.125rem, .8571308987rem + 1.3393455065vw, 1.5rem)
    }

    .how__item-title span {
        font-size: clamp(2.125rem, 1.4106823965rem + 3.5715880173vw, 3.125rem)
    }

    .how__item-text {
        font-size: clamp(1rem, .8214205991rem + .8928970043vw, 1.25rem)
    }

    .tokenomics__body {
        margin-top: clamp(-16.25rem, .8931760346rem + -35.7158801732vw, -6.25rem)
    }

    .tokenomics__ca span:nth-child(1) {
        font-size: clamp(.875rem, .6964205991rem + .8928970043vw, 1.125rem)
    }

    .tokenomics__ca span:nth-child(2) {
        font-size: clamp(.6625rem, .5107075093rem + .7589624537vw, .875rem)
    }

    .tokenomics__ca::after {
        font-size: clamp(.75rem, .5714205991rem + .8928970043vw, 1rem)
    }

    .join__front {
        height: clamp(18.75rem, 12.4997209697rem + 31.2513951516vw, 27.5rem)
    }

    .join__content {
        padding-bottom: clamp(1.25rem, .3571029957rem + 4.4644850217vw, 2.5rem)
    }

    .join__menu {
        row-gap: clamp(.625rem, .4464205991rem + .8928970043vw, .875rem)
    }

    .join__menu-item {
        font-size: clamp(2rem, 1.4642617974rem + 2.678691013vw, 2.75rem)
    }
}

@media (min-width:20em)and (max-width:96.875em) {
    .hero__bottom-text>span:nth-child(1) {
        font-size: clamp(1.5rem, 1.3048780488rem + .9756097561vw, 2.25rem)
    }

    .hero__bottom-text>span:nth-child(1)::before {
        font-size: clamp(1.5rem, 1.3048780488rem + .9756097561vw, 2.25rem)
    }

    .hero__bottom-text>span:nth-child(2) {
        font-size: clamp(2.75rem, 2.2459349593rem + 2.5203252033vw, 4.6875rem)
    }

    .hero__bottom-text>span:nth-child(2)::before {
        font-size: clamp(2.75rem, 2.2459349593rem + 2.5203252033vw, 4.6875rem)
    }

    .about-how-tokenomics__tokenomics {
        padding-top: clamp(3.75rem, 3.0995934959rem + 3.2520325203vw, 6.25rem)
    }

    .about-how-tokenomics__tokenomics {
        padding-bottom: clamp(2.5rem, 2.174796748rem + 1.6260162602vw, 3.75rem)
    }

    .about {
        padding-top: clamp(3.75rem, 3.424796748rem + 1.6260162602vw, 5rem)
    }

    .about {
        padding-bottom: clamp(2.5rem, 1.8495934959rem + 3.2520325203vw, 5rem)
    }

    .about__title {
        margin-bottom: clamp(1.25rem, 1.087398374rem + .8130081301vw, 1.875rem)
    }

    .about__text {
        margin-bottom: clamp(1.875rem, 1.7774390244rem + .487804878vw, 2.25rem)
    }

    .how {
        padding-top: clamp(3.75rem, 3.424796748rem + 1.6260162602vw, 5rem)
    }

    .how {
        padding-bottom: clamp(1.25rem, .2743902439rem + 4.8780487805vw, 5rem)
    }

    .how__item-title span {
        margin-bottom: clamp(.75rem, .6524390244rem + .487804878vw, 1.125rem)
    }

    .join__title {
        font-size: clamp(4.5rem, 1.8495934959rem + 13.2520325203vw, 14.6875rem)
    }

    .join__title::before {
        font-size: clamp(4.5rem, 1.8495934959rem + 13.2520325203vw, 14.6875rem)
    }

    .join__bottom-body>span {
        font-size: clamp(1rem, .9674796748rem + .162601626vw, 1.125rem)
    }

    .join__bottom-body>a span {
        font-size: clamp(1rem, .9674796748rem + .162601626vw, 1.125rem)
    }

    .join__bottom-body>a img {
        width: clamp(7.5rem, 7.337398374rem + .8130081301vw, 8.125rem)
    }

    .tos {
        padding-top: clamp(7.5rem, 7.174796748rem + 1.6260162602vw, 8.75rem)
    }

    .tos {
        padding-bottom: clamp(2.5rem, 2.174796748rem + 1.6260162602vw, 3.75rem)
    }

    .tos__container>h2 {
        font-size: clamp(2.25rem, 2.0548780488rem + .9756097561vw, 3rem)
    }

    .tos__container>h2 {
        margin-bottom: clamp(1.25rem, 1.087398374rem + .8130081301vw, 1.875rem)
    }

    .tos__container>h2:not(:first-child) {
        padding-top: clamp(1.875rem, 1.0619918699rem + 4.0650406504vw, 5rem)
    }

    .tos__container>h3 {
        font-size: clamp(1.25rem, 1.1849593496rem + .325203252vw, 1.5rem)
    }

    .tos__container>h3 {
        margin-bottom: clamp(1.875rem, 1.712398374rem + .8130081301vw, 2.5rem)
    }

    .tos__container>h4 {
        font-size: clamp(1.25rem, 1.1849593496rem + .325203252vw, 1.5rem)
    }

    .tos__container>h4 {
        margin-bottom: clamp(.625rem, .462398374rem + .8130081301vw, 1.25rem)
    }

    .tos__container>p {
        font-size: clamp(.875rem, .8099593496rem + .325203252vw, 1.125rem)
    }

    .tos__container>p {
        margin-bottom: clamp(.625rem, .462398374rem + .8130081301vw, 1.25rem)
    }

    .tos__container ul {
        padding-left: clamp(.625rem, -.1880081301rem + 4.0650406504vw, 3.75rem)
    }

    .tos__container ul li {
        -webkit-column-gap: clamp(.75rem, .5548780488rem + .9756097561vw, 1.5rem);
        -moz-column-gap: clamp(.75rem, .5548780488rem + .9756097561vw, 1.5rem);
        column-gap: clamp(.75rem, .5548780488rem + .9756097561vw, 1.5rem)
    }

    .tos__container ul li {
        font-size: clamp(.875rem, .8099593496rem + .325203252vw, 1.125rem)
    }

    .tos__container ul li {
        margin-bottom: clamp(.625rem, .462398374rem + .8130081301vw, 1.25rem)
    }

    .tos__container ul li div {
        -webkit-column-gap: clamp(1rem, .8699186992rem + .6504065041vw, 1.5rem);
        -moz-column-gap: clamp(1rem, .8699186992rem + .6504065041vw, 1.5rem);
        column-gap: clamp(1rem, .8699186992rem + .6504065041vw, 1.5rem)
    }

    .tos__container ul li div {
        margin-bottom: clamp(.625rem, .462398374rem + .8130081301vw, 1.25rem)
    }

    .tos__container ul li span {
        width: clamp(2.625rem, 2.462398374rem + .8130081301vw, 3.25rem)
    }

    ul.countries li {
        -webkit-column-gap: clamp(.5rem, .337398374rem + .8130081301vw, 1.125rem);
        -moz-column-gap: clamp(.5rem, .337398374rem + .8130081301vw, 1.125rem);
        column-gap: clamp(.5rem, .337398374rem + .8130081301vw, 1.125rem)
    }
}

@media (max-width:47.99875em)and (min-width:20em)and (max-width:47.99875em) {
    .how__items {
        margin-top: clamp(-1.25rem, -.1785514978rem + -2.2322425108vw, -.625rem)
    }
}

@media (any-hover:hover) {
    .menu__link:hover {
        color: #FE4720
    }

    .header__button:hover {
        letter-spacing: .2em;
        -webkit-transform: translateY(.25rem);
        transform: translateY(.25rem);
        box-shadow: 0 0 0 0 #000
    }

    .header__social-item:hover {
        -webkit-transform: translateY(.25rem);
        transform: translateY(.25rem);
        box-shadow: 0 0 0 0 #000
    }

    .header__social-item:hover svg {
        scale: 1.1
    }

    .hero__bottom-button:hover {
        letter-spacing: .2em;
        -webkit-transform: translateY(.5rem);
        transform: translateY(.5rem);
        box-shadow: 0 0 0 0 #000
    }

    .hero__bottom-social-item:hover {
        -webkit-transform: translateY(.5rem);
        transform: translateY(.5rem);
        box-shadow: 0 0 0 0 #000
    }

    .hero__bottom-social-item:hover svg {
        scale: 1.1
    }

    .about__button:hover {
        -webkit-transform: translateY(.25rem);
        transform: translateY(.25rem);
        box-shadow: 0 0 0 0 #000
    }

    .about__button:hover svg {
        -webkit-animation: downloadArrow .6s ease infinite;
        animation: downloadArrow .6s ease infinite
    }

    .how__item-text a:hover {
        text-decoration: none
    }

    .tokenomics__ca button:hover svg path {
        fill: #030234
    }

    .join__button:hover {
        letter-spacing: .2em;
        -webkit-transform: translateY(.5rem);
        transform: translateY(.5rem);
        box-shadow: 0 0 0 0 #000
    }

    .join__top-social-social:hover {
        -webkit-transform: translateY(.5rem);
        transform: translateY(.5rem);
        box-shadow: 0 0 0 0 #000
    }

    .join__top-social-social:hover svg {
        scale: 1.1
    }

    .join__menu-item:hover {
        color: #030234
    }

    .join__menu-social-social:hover {
        -webkit-transform: translateY(.5rem);
        transform: translateY(.5rem);
        box-shadow: 0 0 0 0 #000
    }

    .join__menu-social-social:hover svg {
        scale: 1.1
    }

    .join__bottom-body>a:hover span {
        text-decoration: underline
    }

    .tos__container ul li a:hover {
        text-decoration: none
    }
}

.about__arrow {
    text-align: center;
    margin-top: 2rem;
    animation: bounceArrow 2s infinite;
}

.about__arrow svg {
    width: 40px;
    height: 40px;
}

@keyframes bounceArrow {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-15px);
    }
    60% {
        transform: translateY(-7px);
    }
}

@media (max-width: 47.99875em) {
    .how__item:last-child {
        margin-bottom: 5rem; /* Augmentation de la marge à 4rem */
    }
}