/* HOME */
/* HOME */
/* HOME */
.page {
	position: relative;
	width: 100%;
	margin: 0 auto;

	min-height: 100dvh;
}

.page .heroBg {
	position: relative;
	width: 100%;
	height: calc(100dvh);

	z-index: 4;
}

.page .heroBg .videoDiv {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 80% 50%;
	z-index: -1;

	pointer-events: none;
}

.page .heroBg::before {
	position: absolute;
	content: '';
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 100px;

	background: linear-gradient(0deg, #160729 0%, rgba(22, 7, 41, 0) 100%);

	z-index: 3;
}

/* NAV */
/* NAV */
/* NAV */
.nav_section {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	z-index: 5;
}

.nav_section .nav_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	display: flex;
	justify-content: space-between;
}

.nav_inside .left {
	position: relative;
	width: 49px;
	height: auto;
	margin-top: 24px;

	z-index: 3;
}

.nav_inside .right {
	position: relative;
	margin-top: 41px;

	display: flex;
	gap: 20px;

	z-index: 3;
}

.nav_inside .right .social {
	position: relative;
	width: 24px;
	min-width: 24px;
	height: 24px;

	border-radius: 0px;
	background: none;

	transition: opacity var(--animation1);
}

.nav_inside .right .social img {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;

	filter: var(--color-blue-filter);
}

.nav_inside .right .social:hover {
	opacity: 0.8;
}

.nav_inside .center {
	position: absolute;
	left: 0px;
	top: 41px;
	width: 100%;

	display: flex;
	justify-content: center;
	gap: 32px;

	z-index: 2;
}

.nav_inside .center .oneCenter {
	position: relative;

	color: var(--color-white);
	font-family: var(--font1);
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;

	transition: opacity var(--animation1);

	text-transform: uppercase;
}

.nav_inside .center .oneCenter:hover {
	cursor: pointer;
	opacity: 0.8;
}

@media (max-width: 800px) {
	.nav_inside .center {
		display: none;
	}
}

/* HERO */
/* HERO */
/* HERO */

.hero_section {
	position: relative;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 4;
}

.hero_section .hero_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	top: 50%;
	translate: 0 -50%;
}

.hero_inside .title {
	position: relative;
	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 62px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.hero_inside .buttons {
	position: relative;
	margin-top: 20px;

	display: flex;
}

.hero_inside .buttons .btn {
	position: relative;
	min-width: 210px;
	height: 64px;

	display: flex;
	align-items: center;
	align-content: center;

	p {
		width: 100%;
		text-align: center;
		font-size: 20px;
	}
}

@media (max-width: 800px) {
	.hero_inside .title {
		width: 100%;
		text-align: center;
	}

	.hero_inside .buttons {
		display: flex;
		justify-content: center;
	}
}

@media (max-width: 600px) {
	.hero_inside .title {
		font-size: 48px;
	}
}

/* PARTNERS */
/* PARTNERS */
/* PARTNERS */

.partners_section {
	position: relative;
	width: 100%;
	z-index: 4;
}

.partners_section .partners_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	margin-top: 80px;
}

.partners_inside .title {
	position: relative;
	width: 100%;
	text-align: center;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 64px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.partners_inside .partners {
	position: relative;
	width: 100%;

	display: flex;
	justify-content: center;
	gap: 40px;
	flex-wrap: wrap;
	margin-top: 80px;
}

.partners_inside .partners .partner {
	position: relative;
	width: 320px;
	height: auto;
	opacity: 0.5;
	top: 0px;

	transition: top var(--animation1), opacity var(--animation1);
}

.partners_inside .partners .partner:hover {
	top: -5px;
	opacity: 1;
}

@media (max-width: 850px) {
	.partners_inside .partners {
		gap: 24px;
	}

	.partners_inside .partners .partner {
		width: 250px;
	}
}

@media (max-width: 600px) {
	.partners_inside .title {
		font-size: 48px;
	}

	.partners_inside .partners {
		margin-top: 32px;
	}

	.partners_inside .partners .partner {
		width: calc(50% - 12px);
	}
}

/* TOKENOMICS */
/* TOKENOMICS */
/* TOKENOMICS */

.tokenomics_section {
	position: relative;
	width: 100%;
	z-index: 4;
}

.tokenomics_section .tokenomics_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	margin-top: 80px;
}

.tokenomics_inside .title {
	position: relative;
	width: 100%;
	text-align: center;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 64px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.tokenomics_inside .content {
	position: relative;
	width: 100%;
	margin-top: 42px;

	display: flex;
	justify-content: space-between;
}

.tokenomics_inside .leftText {
	position: relative;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 34px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;

	margin-top: 100px;

	.red {
		color: #d81652;
	}

	.yellow {
		color: #ff9d00;
	}

	.purple {
		color: #ac13e5;
	}
}

.tokenomics_inside .content .img {
	position: relative;
	width: 520px;
	height: auto;
}

.tokenomics_inside .buttons {
	position: relative;
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
	margin-top: 60px;
}

.tokenomics_inside .buttons .btn {
	position: relative;
	width: 100%;
	height: 64px;

	padding: 0px 16px;

	p {
		font-size: 20px;
	}

	.desktop {
		display: block;
	}

	.mobile {
		display: none;
	}
}

.tokenomics_inside .buttons .btn:hover {
	cursor: pointer;
}

@media (max-width: 1000px) {
	.tokenomics_inside .content {
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 40px;
	}

	.tokenomics_inside .leftText {
		text-align: center;
		margin-top: 0px;
	}

	.tokenomics_inside .content .img {
		margin-top: 24px;
	}
}

@media (max-width: 600px) {
	.tokenomics_inside .title {
		font-size: 48px;
	}

	.tokenomics_inside .leftText {
		font-size: 24px;
	}

	.tokenomics_inside .buttons .btn {
		.desktop {
			display: none;
		}

		.mobile {
			display: block;
		}
	}
}

/* HOW TO BUY */
/* HOW TO BUY */
/* HOW TO BUY */

.howToBuy_section {
	position: relative;
	width: 100%;
	z-index: 4;
}

.howToBuy_section .howToBuy_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	margin-top: 60px;
}

.howToBuy_inside .title {
	position: relative;
	width: 100%;
	text-align: center;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 34px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.howToBuy_inside .buttons {
	position: relative;
	width: 100%;
	max-width: 730px;
	margin: 0 auto;
	margin-top: 60px;

	display: flex;
	flex-wrap: wrap;
	gap: 22px;
}

.howToBuy_inside .buttons .btn {
	position: relative;
	width: 100%;
	height: 90px;

	background: url('../images/stoneBtn.png');
	background-size: 100% 100%;

	padding: 0px 16px;

	display: flex;
	align-items: center;
	align-content: center;

	p {
		font-size: 20px;
		width: 100%;
		text-align: center;
		color: var(--color-white);
		font-family: var(--font1);
		font-style: normal;
		font-weight: 400;
		line-height: normal;
		text-transform: none;
	}

	transition: opacity var(--animation1);
}

.howToBuy_inside .buttons .btn:hover {
	background: url('../images/stoneBtn.png');
	background-size: 100% 100%;
	opacity: 0.8;
}

@media (max-width: 600px) {
	.howToBuy_inside .title {
		font-size: 28px;
	}

	.howToBuy_inside .buttons .btn {
		p {
			width: 100%;
			padding-left: 16px;
			text-align: left;
			font-size: 16px;
		}
	}
}

/* ROADMAP */
/* ROADMAP */
/* ROADMAP */

.roadmap_section {
	position: relative;
	width: 100%;
	z-index: 4;
}

.roadmap_section .roadmap_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	margin-top: 80px;
}

.roadmap_inside .title {
	position: relative;
	width: 100%;
	text-align: center;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 64px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.roadmap_inside .content {
	position: relative;
	width: 100%;
	margin-top: 62px;

	display: flex;
	justify-content: center;
	gap: 0px;
}

.roadmap_inside .content .left {
	position: relative;
	width: 320px;

	.leftImg {
		position: relative;
		width: 142px;
		height: auto;
		margin: 0 auto;
		margin-top: 24px;
	}
}

.roadmap_inside .content .onePhase {
	position: relative;
	width: 100%;
}

.roadmap_inside .content .onePhase[data-value='right1'] {
	margin-top: 40px;

	.phaseTitle {
		color: #8f5ef2;
	}
}

.roadmap_inside .content .onePhase[data-value='left2'] {
	margin-top: 80px;

	.phaseTitle {
		color: #8f5ef2;
	}
}

.roadmap_inside .content .onePhase[data-value='right2'] {
	margin-top: 80px;
}

.roadmap_inside .content .onePhase .phaseTitle {
	position: relative;
	width: 100%;

	color: var(--color-blue);
	font-family: var(--font1);
	font-size: 34px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.roadmap_inside .content .onePhase ul {
	position: relative;
	width: 100%;
	margin-top: 20px;
	margin-left: 50px;

	li {
		position: relative;

		color: var(--color-white);
		font-family: var(--font1);
		font-size: 24px;
		font-style: normal;
		font-weight: 400;
		line-height: normal;
	}
}

.roadmap_inside .content .center {
	position: relative;
	width: 200px;

	.centerImg {
		position: absolute;
		width: 212px;

		left: 40%;
		top: 50%;

		translate: -50% -50%;
	}
}

.roadmap_inside .content .right {
	position: relative;
	width: 320px;

	.rightImg {
		position: relative;
		width: 172px;
		height: auto;

		margin: 0 auto;
	}
}

@media (max-width: 800px) {
	.roadmap_inside .content {
		margin-top: 40px;
		flex-wrap: wrap;
	}

	.roadmap_inside .content .left {
		width: 100%;

		.leftImg {
			display: none;
		}
	}

	.roadmap_inside .content .center {
		position: absolute;
		width: 100%;
		height: 100%;

		z-index: -3;

		.centerImg {
			width: 80%;
		}
	}

	.roadmap_inside .content .right {
		width: 100%;

		.rightImg {
			display: none;
		}
	}

	.roadmap_inside .content .onePhase .phaseTitle {
		width: 100%;
		text-align: center;
	}

	.roadmap_inside .content .onePhase ul {
		text-align: center;
		margin-left: 0px;

		list-style: none;
	}
}

@media (max-width: 600px) {
	.roadmap_inside .title {
		font-size: 48px;
	}
}

/* NFT CASE */
/* NFT CASE */
/* NFT CASE */

.nftCase_section {
	position: relative;
	width: 100%;
	z-index: 4;
}

.nftCase_section .nftCase_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	margin-top: 80px;
}

.nftCase_inside .title {
	position: relative;
	width: 100%;
	text-align: center;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 64px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.nftCase_inside .content {
	position: relative;
	width: 100%;
	max-width: 450px;
	height: 450px;
	margin: 0 auto;
}

.nftCase_inside .content .videoDiv {
	position: relative;
	width: 100%;
	height: 100%;
}

.nftCase_inside .buttons {
	position: relative;
	margin-top: 10px;

	display: flex;
	justify-content: center;
	gap: 40px;
}

.nftCase_inside .buttons .btn {
	position: relative;
	width: 100%;
	max-width: 210px;
	height: 64px;

	display: flex;
	align-items: center;
	align-content: center;

	p {
		font-size: 20px;
		width: 100%;
		text-align: center;
	}
}

@media (max-width: 600px) {
	.nftCase_inside .title {
		font-size: 48px;
	}

	.nftCase_inside .buttons {
		gap: 14px;
	}
}

/* FOOTER */
/* FOOTER */
/* FOOTER */

.footer_section {
	position: relative;
	width: 100%;
	z-index: 4;

	padding-bottom: 50px;
}

.footer_section .footer_inside {
	position: relative;
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;

	margin-top: 40px;
}

.footer_inside .content {
	position: relative;
	width: 100%;
}

.footer_inside .content .logo {
	position: relative;
	width: 100%;

	display: flex;
	gap: 20px;
	justify-content: center;
}

.footer_inside .content .logo .left {
	position: relative;
	width: 120px;
	height: auto;
}

.footer_inside .content .logo .logoText {
	position: relative;
	margin-top: 33px;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 48px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.footer_inside .buttons {
	position: relative;
	margin-top: 30px;

	display: flex;
	justify-content: center;
}

.footer_inside .buttons .btn {
	position: relative;
	width: 100%;
	max-width: 210px;
	height: 64px;

	display: flex;
	align-items: center;
	align-content: center;

	p {
		width: 100%;
		text-align: center;
		font-size: 20px;
	}
}

.footer_inside .email {
	position: relative;
	width: 100%;
	margin-top: 40px;

	text-align: center;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.footer_inside .desc {
	position: relative;
	width: 100%;
	margin-top: 80px;

	text-align: center;

	color: var(--color-text-primary);
	font-family: var(--font1);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.footer_section .footerImg {
	position: absolute;
	width: 773px;
	height: auto;

	transform: rotate(33.657deg);

	left: calc(50% + 500px);
	bottom: -620px;
	translate: -50% -50%;

	z-index: -1;
}

.footer_inside .socials {
	position: relative;
	width: 100%;
	margin-top: 41px;

	display: flex;
	gap: 20px;
	justify-content: center;

	z-index: 3;
}

.footer_inside .socials .social {
	position: relative;
	width: 42px;
	min-width: 42px;
	height: 42px;

	border-radius: 0px;
	background: none;

	img {
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100%;
		height: 100%;

		filter: var(--color-blue-filter);
	}

	transition: opacity var(--animation1);
}

.footer_inside .socials .social:hover {
	opacity: 0.8;
}