@import url('variables.css');
.above-fold-text {
	visibility: hidden;
	opacity: 0;
	transition: opacity .3s ease;
}
.top-section {
	height: 100dvh;
	width: 100dvw;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 100px 20px 20px;
	overflow: visible;
	background: url('../images/header.webp') no-repeat center center/cover;
	z-index: 1;
	overflow: hidden;
}
.top-section .text {
    flex-direction: column;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
	width: 1200px;
	height: 365px;
    visibility: hidden;
    opacity: 0;
	position: relative;
}
.top-section .button {
	width: 330px;
	height: 79px;
	display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
	font-family: 'Manrope ExtraBold', sans-serif;
}
.ellipse {
	transition: transform 2s linear;
	position: absolute;
	z-index: 0;
}
#ellipse3 {
	bottom: -20%;
	left: -24%;
	z-index: 1;
	width: 1010.77px;
	height: 1010.77px;
	object-fit: contain;
}
#ellipse4 {
	top: 21%;
    left: 62%;
    z-index: 2;
    width: 1280px;
    height: 1280px;
    object-fit: contain;
}
#ellipse5 {
	top: -87%;
	left: 0%;
	z-index: -1;
	width: 1092.77px;
	height: 1092.77px;
	object-fit: contain;
}
#ellipse6 {
	top: 15%;
	left: 72%;
	z-index: -1;
	width: 673.77px;
	height: 673.77px;
	object-fit: contain;
}
#ellipse9 {
	right: -2%;
	top: -50%;
	width: 673.77px;
	height: 673.77px;
	object-fit: contain;
}
#ellipse10 {
	left: -2%;
	top: -20%;
	width: 673.77px;
	height: 673.77px;
	object-fit: contain;
}
#ellipse11 {
	top: -10%;
	left: -39%;
	width: 1197.77px;
	height: 1239.75px;
	object-fit: contain;
}
#ellipse12 {
	top: 54%;
	right: -37%;
	width: 1100px;
	height: 1139px;
	object-fit: contain;
	opacity: .45;
}
#ellipse13 {
	opacity: .45;
	top: -5%;
	right: -46%;
	width: 1997.77px;
	height: 1239.75px;
	object-fit: contain;
}
#ellipse14 {
	width: 729.83px;
	height: 734.25px;
	object-fit: contain;
}
#ellipse14,
#ellipse16 {
	top: -36%;
	left: -8%;
}
#ellipse15 {
	bottom: -33%;
	left: -34%;
	width: 629.8px;
	height: 632.97px;
	object-fit: contain;
}
#ellipse16 {
	width: 729.83px;
	height: 734.25px;
	object-fit: contain;
}
#ellipse18 {
	width: 400px;
	height: 402.39px;
	object-fit: contain;
	right: 0;
	opacity: 0.3;
}
#ellipse19 {
	z-index: -1;
	right: -50%;
	width: 1436px;
	height: 1437px;
	object-fit: contain;
}
#ellipse20 {
	top: 0;
	right: -40%;
	width: 1200px;
	height: 1200px;
	object-fit: contain;
}
#ellipse24 {
	left: 53%;
	opacity: 0.8;
	top: 19%;
	width: 272px;
	height: 272px;
	object-fit: contain;
}
#disk1,
#disk2 {
	top: 15%;
	left: -5%;
	position: absolute;
	z-index: -1;
	width: 152px;
	height: 152px;
	background-color: rgb(255 255 255 / 42%);
	border: 1px solid #ACACAC;
	border-radius: 50%;
}
#disk2 {
	width: 245px;
	height: 245px;
	top: 59%;
	right: -7%;
	left: unset;
}
#disk1::before,
#disk2::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(40px);
	-webkit-backdrop-filter: blur(40px);
	z-index: 1;
	border-radius: 50%;
}
#disk1::before {
	width: 152px;
	height: 152px;
}
#disk2::before {
	width: 245px;
	height: 245px;
}
.top-section::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	opacity: 0.89;
	z-index: -1;
	background: #000000ab;
}
.top-section span {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-hero);
	margin-bottom: 20px;
	font-weight: 700;
	line-height: 1.4em;
    width: 631px;
    height: 80px;
}
.top-section .desc {
	font-size: var(--fs-subtitle);
	margin-bottom: 40px;
	font-weight: 400;
	line-height: 1.7em;
	margin: 0 0 1em;
	text-align: center;
	width: 1235px;
	height: 102px;
	font-family: 'Manrope', sans-serif;
}
.top-section a.secondary-link {
	color: var(--secondary-color);
	margin-top: 10px;
	text-decoration: underline !important;
	font-family: 'Manrope Bold', sans-serif;
	font-size: var(--fs-sm);
	width: 185px;
    height: 30px;
}
.features-sec {
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	margin: auto;
	gap: 20px;
	position: relative;
	background-color: #17343F;
	z-index: 0;
	padding: 200px 0;
	overflow: visible;
}
.features-sec::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, #070E10, #17343F);
	opacity: 1;
	z-index: 1;
}
.wrapper {
	display: flex;
	justify-content: space-between;
	width: 100%;
	max-width: var(--max-width);
	padding: 20px 40px;
	z-index: 3;
}
.features-col {
	width: 50%;
	z-index: 1;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: flex-start;
	flex-direction: column;
	gap: 25px;
}
.features-col span {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
}
.features-col span .green {
	color: var(--secondary-color);
}
.features-col p {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-sm-md);
	line-height: 1.3em;
	font-weight: 400;
	color: var(--gray-color);
	padding: 0;
	margin: 0;
}
.features {
	display: flex;
	flex-direction: column;
	justify-content: center !important;
	align-content: center !important;
	align-items: center !important;
	gap: 20px;
}
.features-sec .wrapper {
	gap: 40px;
}
.features-col .f-700 {
	width: 100%;
	max-width: 700px;
	gap: 40px;
	display: flex;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	flex-direction: column;
	margin: 30px 0 30px;
}
.knowledge-section {
	background: var(--white-color);
	gap: 30px;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	padding: 200px 0;
	flex-direction: column;
}
.knowledge-section .wrapper,
.with-booleans-section .wrapper {
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-direction: column;
	width: 100%;
	max-width: var(--max-width);
	padding: 20px 40px;
	gap: 70px;
}
.knowledge-title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: #17343F;
	max-width: 1100px;
	text-align: center;
	margin: 0 0 1.2em;
}
.knowledge-columns {
	display: flex;
	justify-content: space-between;
	gap: 30px;
	margin: 0 0 3em;
	position: relative;
}
.knowledge-column {
	width: 50%;
	background-color: rgba(255, 255, 255, 0.13);
	border-radius: 15px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	text-align: left;
	border: 1px solid #76FF8D;
	min-height: 450px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	max-width: 720px;
	padding: 60px 40px 10px;
	cursor: pointer;
	position: relative;
}
.knowledge-column::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
	border-radius: 15px;
}
.knowledge-column:hover {
	box-shadow: inset 0 0 60px var(--white-color), inset 5px 0 5px #8dffb1, inset -5px 0 10px var(--secondary-color), inset 5px 0 20px var(--white-color), inset -5px 0 20px var(--white-color), 0 0 10px var(--white-color), -10px 0 50px #72f89e, 10px 0 20px #72f89e;
}
.knowledge-column img {
	z-index: 1;
	object-fit: contain;
}
.knowledge-column:nth-of-type(1) img {
	width: 171px;
	height: 97px;
}
.knowledge-column:nth-of-type(2) img {
	width: 123px;
	height: 149px;
	margin: 0 0 10px;
}
.knowledge-column .text {
	width: fit-content;
	z-index: 1;
}
.knowledge-column span {
	font-size: var(--fs-lg-subtitle);
	font-weight: bold;
	margin-bottom: 10px;
	color: #17343F;
}
.knowledge-column p {
	font-family: 'Manrope', sans-serif;
	line-height: 1.2em !important;
	font-weight: 400;
	font-size: var(--fs-sm-md);
	line-height: 1.6;
	color: #595F5A;
}
.game-section {
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	margin: auto;
	gap: 20px;
	position: relative;
	background-color: #17343F;
	z-index: 0;
	padding: 200px 0;
}
.game-section::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, #010F26, #17343F);
	opacity: 1;
	z-index: 0;
}
.game-section .wrapper {
	flex-direction: column;
	gap: 150px;
	padding: 0 5em;
}
.game-top-row {
	display: flex;
	justify-content: space-between;
	gap: 10em;
}
.game-column {
	width: 50%;
	padding: 0;
	margin: 0;
	border-radius: 34px;
	text-align: left;
}
.game-column.second {
	display: flex;
	align-content: flex-start;
	justify-content: center;
	align-items: flex-start;
	flex-direction: column;
	gap: 4px;
}
.game-column .title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.05em;
	margin: 0;
	padding: 0;
	color: var(--primary-color);
	display: block;
	margin: 0 0 15px;
}
.game-column .subtitle {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-subtitle);
	max-width: 1090px;
	margin-bottom: 40px;
	font-weight: 400;
	line-height: 1.2em;
	margin: 0;
	padding: 0 8px;
	display: block;
	margin: 0 0 40px;
}
.game-column .text {
	font-family: 'Manrope', sans-serif;
	line-height: 1.2em !important;
	font-size: var(--fs-sm-md);
	line-height: 1.6;
	color: var(--white-color);
	display: block;
	padding: 0 8px;
}
ul.game-list {
	list-style: none;
	padding: 0 8px;
}
ul.game-list li {
	font-family: 'Manrope', sans-serif;
	line-height: 1.35em !important;
	font-size: var(--fs-sm-md);
	position: relative;
	padding-left: 25px;
	color: var(--gray-color);
	margin-bottom: 10px;
}
ul.game-list li::before {
	content: "●";
	color: #76FF8D;
	font-size: 22px;
	position: absolute;
	left: 0;
	top: 0;
}
.game-column .client {
	height: 100%;
	width: 100%;
	position: relative;
}
.game-column .client .ellipse {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	z-index: 1;
	position: relative;
	height: 100%;
	width: 100%;
}
.game-column .client .ellipse .top-left {
	width: 100%;
	object-fit: contain;
	position: absolute;
	top: -35%;
	left: -35%;
	width: 640px;
	height: 640px;
	object-fit: contain;
}
.game-column .client .ellipse .top-right {
	width: 100%;
	object-fit: contain;
	position: absolute;
	top: -35%;
	left: 10%;
	width: 640px;
	height: 640px;
	object-fit: contain;
}
.game-column .client .ellipse .bottom-left {
	width: 100%;
	object-fit: contain;
	position: absolute;
	top: 39%;
	left: -38%;
	width: 640px;
	height: 640px;
	object-fit: contain;
}
.game-column .client .bg {
	position: relative;
	background-color: rgba(255, 255, 255, 0.13);
	border: 1px solid #707070;
	width: 100%;
	height: auto;
	z-index: 2;
	border-radius: 75px;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	max-width: 525px;
	max-height: 638px;
	overflow: visible;
	transform: translate(0, -133%);
}
.game-column .client .bg::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	z-index: 1;
	border-radius: 75px;
}
.game-element {
	width: 100%;
	height: auto;
	max-width: 120px;
	position: absolute;
	top: 0;
	z-index: 4;
	left: -8%;
	cursor: pointer;
}
.game-element.logo {
	top: -5%;
	z-index: 4;
	left: 75%;
	max-width: 220px;
	cursor: pointer;
}
.game-element img {
	width: 100%;
	height: auto;
	max-width: 180px;
	object-fit: contain;
	z-index: 4;
}
.game-column .client .bg .client-img {
	width: 125%;
	height: auto;
	max-width: 618px;
	z-index: 4;
	object-fit: contain;
	cursor: pointer;
	transform: translate(0, 14px);
}
.game-column .client .bg:hover .client-img {
	transform: scale(1.04);
	transition: transform 0.2s ease-in-out;
}
.game-column .client .bg:hover .game-element.logo {
	transform: scale(1.07) rotate(14deg);
	transition: transform 0.3s ease-in-out;
}
.game-column .client .bg:hover .game-element.candlestick {
	transform: scale(.92);
	transition: transform 0.2s ease-in-out;
}
.steps-section,
.reg-steps-section,
.testimonials-section {
	width: 100%;
	display: flex;
	align-content: center;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 100px 0 10px;
}
.testimonials-section {
	background: #17343F;
	flex-direction: column;
	padding: 200px 0 150px;
	position: relative;
	overflow: visible;
	z-index: 1;
}
.testimonials-section .titles {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
	gap: 20px;
}
.reg-steps-section .wrapper,
.with-booleans-section {
	flex-direction: column;
	gap: 40px;
}
.reg-steps-section,
.with-booleans-section {
	position: relative;
	padding: 100px 0 120px;
}
.with-booleans-section {
	background: #17343F;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
}
.testimonials-section {
	padding: 100px 0;
	position: relative;
	height: fit-content;
	overflow: visible;
}
.testimonials-section .logo {
	position: absolute;
	z-index: -1;
	max-height: 816px;
	width: 100%;
	height: auto;
	top: 25%;
	left: 33%;
	transition: transform 4s ease-in-out;
}
.testimonials-section .logo img {
	width: 709px;
	height: auto;
	object-fit: contain;
}
.steps-grid-container .box .content {
	font-family: 'Manrope', sans-serif;
	line-height: 1.2em !important;
	font-weight: 400;
	font-size: var(--fs-sm-md);
	line-height: 1.6;
	color: var(--black-color);
}
.steps-grid-container .box .content {
	color: #50636A;
}
.steps-section .titles .steps-title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: #17343F;
}
.steps-section .titles {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	align-content: flex-end;
}
.steps-section .titles .steps-subtitle {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-subtitle);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: #17343F;
}
.steps-section .titles .left {
	width: 60%;
}
.steps-section .wrapper {
	flex-direction: column;
	gap: 3em;
}
.steps-section .titles .right {
	width: 30%;
}
.steps-grid-container {
	display: grid;
	gap: 0;
	width: 100%;
	grid-template-columns: repeat(3, 1fr);
	transform: translate(0, 60px);
}
.steps-grid-container .box {
	padding: 20px;
	border: 1px solid #76FF8D;
	border-radius: 30px;
	text-align: center;
	width: 100%;
	height: 453px;
	display: flex;
	flex-direction: column;
	align-content: flex-start;
	align-items: flex-start;
	justify-content: space-between;
	padding: 40px;
	cursor: pointer;
	overflow: hidden;
	position: relative;
	background-color: rgba(255, 255, 255, 0.13);
}
.steps-grid-container .box::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
	border-radius: 30px;
}
.steps-grid-container .box:hover {
	box-shadow: inset 0 0 60px var(--white-color), inset 5px 0 5px #8dffb1, inset -5px 0 10px var(--secondary-color), inset 5px 0 20px var(--white-color), inset -5px 0 20px var(--white-color), 0 0 10px var(--white-color), -10px 0 50px #72f89e, 10px 0 20px #72f89e;
}
.steps-grid-container .no {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-md-title);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: #17343F;
	z-index: 1;
}
.steps-grid-container .box .title {
	font-family: 'Manrope Semibold', sans-serif;
	line-height: 1.2em !important;
	font-size: var(--fs-smd-title);
	line-height: 1.6;
	color: #17343F;
	text-align: start;
	width: 80%;
	max-width: 370px;
	z-index: 1;
}
.steps-grid-container .box .content {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-sm-md);
	line-height: 1.1em;
	font-weight: 400;
	color: #17343F;
	text-align: start;
	z-index: 1;
}
.reg-steps-grid-container {
	display: grid;
	gap: 20px;
	width: 100%;
	grid-template-columns: repeat(3, 1fr);
}
.reg-steps-grid-container .box {
	background: none;
	padding: 20px;
	text-align: center;
	width: 100%;
	height: fit-content;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: space-evenly;
	padding: 40px;
	cursor: pointer;
	height: fit-content;
	gap: 30px;
	opacity: 0;
}
.reg-steps-grid-container .box .title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-subtitle);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: #17343F;
	text-align: center;
}
.reg-steps-grid-container .box .img {
	width: 100%;
	height: auto;
}
.reg-steps-grid-container .box img {
	width: 119px;
	height: auto;
}
.reg-steps-grid-container .box .content {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-sm-md);
	line-height: 1.1em;
	font-weight: 400;
	color: #17343F;
	text-align: center;
}
.reg-steps-section .reg-steps-title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: #17343F;
	text-align: center;
}
.reg-steps-section .reg-steps-button {
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
}
.reg-steps-section .progress-line {
	position: absolute;
	top: 443px;
	left: 0;
	width: 0%;
	height: 2px;
	background: #05E16F;
	transition: width 1.5sease-out;
	z-index: 2;
}
.testimonials-section .testimonials-subtitle {
	font-family: 'Manrope', sans-serif;
	line-height: 1.2em !important;
	font-weight: 400;
	font-size: var(--fs-sm-md);
	line-height: 1.6;
	color: var(--white-color);
	margin: 0;
	padding: 0;
	text-align: center;
}
.testimonials-section .testimonials-title {
	max-width: 741px;
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: var(--white-color);
	text-align: center;
}
.testimonials-section .wrapper {
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-content: center;
	align-items: center;
	gap: 40px;
	max-width: 100%;
	padding: 0;
}
.carousel {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: auto;
	margin: 40px auto;
	padding: 0 20px;
	cursor: grab;
}
.carousel-content {
	display: flex;
	transition: transform 0.4s;
	touch-action: pan-y;
}
.carousel-item {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	width: 100%;
	height: auto;
	flex: 0 0 auto;
	font-size: 20px;
	color: white;
	margin-right: 50px;
	user-select: none;
	-webkit-user-drag: none;
	pointer-events: auto;
	max-width: 925px;
}
.testimonials-section .testimonial-item {
	padding: 28px;
	position: relative;
	text-align: left;
	background-color: rgba(255, 255, 255, 0.13);
	border: 1px solid #ffffff17;
	width: 100%;
	height: auto;
	z-index: 2;
	border-radius: 17px;
	display: flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	max-width: 925px;
	max-height: 483px;
	overflow: hidden;
	cursor: grab;
	height: 100%;
}
.testimonials-section .testimonial-item::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(40px);
	-webkit-backdrop-filter: blur(40px);
	z-index: 1;
	border-radius: 17px;
}
.testimonial-content {
	display: flex;
	justify-content: flex-start;
	align-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	gap: 20px;
	z-index: 2;
	padding: 2em 1em;
}
.testimonials-section .testimonial-content .testimonial {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-xlg-subtitle);
	line-height: 1.1em;
	color: var(--white-color);
}
.testimonials-section .testimonial-content .text,
.testimonials-section .testimonial-content .user .name {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-ssm);
	line-height: 1.1em;
	font-weight: 400;
	color: var(--white-color);
	padding: 0;
	margin: 0;
}
.testimonials-section .testimonial-content .rate,
.testimonials-section .testimonial-content .rate img {
	width: fit-content;
	height: auto;
}
.testimonials-section .testimonial-content .rate img {
	width: 100%;
	max-width: 31px;
}
.testimonials-section .testimonial-content .rate {
	display: flex;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	gap: 5px;
}
.testimonials-section .testimonial-content .user img {
	width: 60px;
	height: 60px;
	object-fit: contain;
}
.testimonials-section .testimonial-content .user {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	align-content: center;
	gap: 20px;
}
.with-booleans-title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
    line-height: 1.1em;
    margin: 0;
    padding: 0;
    color: var(--white-color);
	text-align: center;
    max-width: 1038px;
}
.with-booleans-section .with-booleans-title .green {
	color: var(--primary-color);
}
.with-booleans-section .buttons {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	align-content: center;
	flex-direction: column;
	gap: 30px;
}
.with-booleans-section .buttons .secondary-link {
	font-family: 'Manrope Bold', sans-serif;
	font-size: var(--fs-sm-md);
	line-height: 1.1em;
	padding: 0;
	margin: 0;
	color: var(--primary-color);
}
.with-booleans-section .with-booleans-box-container {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	width: 100%;
	margin: auto;
	justify-content: center;
	align-items: center;
	align-content: center;
}
.with-booleans-section .with-booleans-box-container .box {
	flex: 1;
	min-width: 300px;
	max-width: 50%;
	padding: 130px 55px 45px;
	position: relative;
	text-align: left;
	background-color: rgba(255, 255, 255, 0.13);
	border: 1px solid #767676;
	height: auto;
	z-index: 2;
	border-radius: 34px;
	display: flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	max-width: 618px;
	max-height: 722px;
	overflow: visible;
	cursor: pointer;
	height: 100%;
	gap: 20px;
}
.with-booleans-section .with-booleans-box-container .box:hover {
	box-shadow: inset 0 0 60px #29463f, inset 5px 0 5px var(--secondary-color), inset -5px 0 10px var(--secondary-color), inset 5px 0 20px var(--secondary-color), inset -5px 0 20px var(--secondary-color), 0 0 10px var(--secondary-color), -10px 0 50px var(--secondary-color), 10px 0 20px var(--secondary-color);
}
.with-booleans-section .with-booleans-box-container .box:first-child:hover {
	box-shadow: inset 0 0 100px #563535, inset 5px 0 5px #ff0202, inset -5px 0 10px #ff0202, inset 5px 0 20px #ff0202, inset -5px 0 20px #ff0202, 0 0 10px #ff0202, -10px 0 50px #ff0202, 10px 0 20px #ff0202;
}
.with-booleans-section .with-booleans-box-container .box::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
	border-radius: 34px;
}
.with-booleans-section .with-booleans-box-container .title-container {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	flex-direction: column;
	text-align: center;
	z-index: 2;
	width: 100%;
	height: 150px;
	position: relative;
	margin: 0 0 7em;
}
.with-booleans-section .with-booleans-box-container .title-container .title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-xlg-subtitle);
	line-height: 1.1em;
	color: var(--white-color);

}
.with-booleans-section .with-booleans-box-container .box .sub-item {
	display: flex;
	justify-content: flex-start;
	align-content: center;
	align-items: center;
	z-index: 2;
	gap: 15px;
}
.with-booleans-section .with-booleans-box-container .box .sub-item .content {
	display: flex;
	align-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	gap: 5px;
	max-width: 432px;
}
.with-booleans-section .with-booleans-box-container .box .sub-item .content .title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-sm-md);
	line-height: 1.1em;
	color: var(--white-color);
}
.with-booleans-section .with-booleans-box-container .box .sub-item .content .text {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-sm);
	line-height: 1.1em;
	font-weight: 400;
	color: var(--white-color);
}
.white {
	background-color: var(--white-color);
}
.limited-spot-section {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	align-content: center;
	width: 100%;
	padding: 150px 0;
}
.limited-spot-section .wrapper {
	display: flex;
	gap: 140px;
}
.limited-spot-section .limited-spot-col {
	display: flex;
	gap: 40px;
	flex-direction: column;
	align-content: flex-start;
	justify-content: center;
	align-items: flex-start;
	width: 50%;
}
.limited-spot-section .limited-spot-col:last-child {
	display: flex;
	flex-direction: column;
	align-content: center;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	padding: 0;
}
.limited-spot-section .limited-spot-col .title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.1em;
	font-weight: 400;
	color: #17343F;
}
.limited-spot-section .limited-spot-col .subtitle {
	font-family: 'Manrope Bold', sans-serif;
	font-size: var(--fs-subtitle);
	line-height: 1.1em;
	color: #17343F;
}
.limited-spot-section .limited-spot-col .content {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-sm-md);
	line-height: 1.1em;
	font-weight: 400;
	color: #48504A;
}
.limited-spot-section .limited-spot-col .button {
	margin: 40px 0 0;
}
.edge-section {
	width: 100%;
	position: relative;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-direction: column;
	background: #17343F;
	overflow: visible;
	padding: 300px 0 100px;
}
.progress-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	position: relative;
	border: 1.5px solid #76FF8D;
	position: absolute;
	top: 0;
	z-index: 2;
	background-color: rgba(255, 255, 255, 0.13);
	height: 81px;
	padding: 0;
	margin: 0;
	overflow: visible;
}
.progress-wrapper::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
}
.progress-text {
	width: fit-content;
}
.progress-text.left {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-btn);
	line-height: 1.1em;
	color: #17343F;
	position: absolute;
	left: 10px;
	z-index: 3;
}
.progress-text.right {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-btn);
	line-height: 1.1em;
	color: #17343F;
	font-weight: 400;
	position: absolute;
	right: 10px;
	z-index: 3;
}
.progress-container {
	position: relative;
	width: 100%;
	height: 81px;
	background: rgba(255, 255, 255, 0.2);
	overflow: hidden;
}
.progress-bar {
	width: 0%;
	height: 81px;
	background: linear-gradient(to right, #3BFF6C, #255A6E);
	transition: width 2s ease-in-out;
	z-index: 2;
	position: absolute;
	border: 1.5px solid #76FF8D;
}
.edge-section .wrapper {
	width: 100%;
	display: flex;
	align-content: center;
	justify-content: flex-start;
	align-items: center;
	gap: 200px;
}
.edge-section .wrapper .box {
	width: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	flex-direction: column;
}
.edge-section .wrapper .box:first-child {
	cursor: pointer;
	transform: translate(0, -30%);
}
.edge-section .wrapper .box:first-child:hover .inner-img img:first-child {
	transform: translate(0, -10%);
	transition: transform 0.6s ease-in-out;
}
.edge-section .wrapper .box:first-child:hover .float {
	transform: translate(0, 10%);
	transition: transform 0.6s ease-in-out;
}
.edge-section .wrapper .box:first-child:hover
  ~ .box:last-child .buttons .button {
	transform: scale(1.1);
}
.edge-section .wrapper .box:last-child {
	display: flex;
	align-content: flex-start;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	gap: 40px;
}
.edge-section .wrapper .box .title {
	font-family: 'Manrope Semibold', sans-serif;
	font-size: var(--fs-title);
	line-height: 1.1em;
	margin: 0;
	padding: 0;
	color: var(--primary-color);
}
.edge-section .wrapper .box .subtitle {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-smd-title);
	line-height: 1.1em;
	font-weight: 400;
	margin: 0;
	padding: 0;
	color: var(--white-color);
}
.edge-section .wrapper .box .content {
	font-family: 'Manrope', sans-serif;
	font-size: var(--fs-sm-md);
	line-height: 1.1em;
	font-weight: 400;
	margin: 0;
	padding: 0;
	color: var(--gray-color);
}
.edge-section .wrapper .box .buttons {
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-direction: column;
	gap: 20px;
	width: fit-content;
	text-align: center;
}
.edge-section .wrapper .box .buttons .secondary-link {
	font-family: 'Manrope Bold', sans-serif;
	font-size: var(--fs-sm);
	line-height: 1.1em;
	padding: 0;
	margin: 0;
	color: var(--primary-color);
}
.edge-section .wrapper .box .float {
	position: absolute;
	left: 20%;
	top: 55%;
	height: 355px;
	width: auto;
	object-fit: contain;
}
.icon-container {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: max-content;
}
.sub-icon-container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-72%, -50%);
	z-index: -1;
	width: 180px;
	height: 135px;
}
.circle-left {
	position: absolute;
	width: 170px;
	height: 173px;
	border-radius: 50%;
}
.circle-right {
	position: absolute;
	width: 170px;
	height: 173px;
	border-radius: 50%;
	top: 0;
	left: 90px;
}
.icon-container.list {
	width: 70px;
	height: 100px;
}
.icon-container.list .sub-icon-container {
	width: 70px;
	height: 100px;
	transform: translate(-72%, -19%);
}
.icon-container.list .sub-icon-container .circle-left,
.icon-container.list .sub-icon-container .circle-right {
	width: 54px;
	height: 54px;
}
.icon-container.list .sub-icon-container .circle-right {
	top: -10px;
	left: 20px;
}
.icon-container.list .sub-icon-container .circle-right img {
	top: 13px;
	left: 15px;
	position: absolute;
	z-index: 1;
	width: 26.14px;
	height: 26.14px;
	object-fit: contain;
}
.circle-left.green {
	background-color: var(--primary-color);
	box-shadow: 0 0 150px var(--primary-color);
}
.circle-right.green {
	background: radial-gradient(circle at -25% 55%, #76FF8DC2 40%, rgba(255, 255, 255, 0.6) 90%);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}
.circle-left.red {
	background-color: #FF0202;
	box-shadow: 0 0 150px #FF0202;
}
.circle-right.red {
	background: radial-gradient(circle at -25% 55%, #ef0404c2 40%, rgba(255, 255, 255, 0.6) 90%);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}
.inner-img {
	width: fit-content;
}
#server {
	height: 620px;
	width: auto;
	object-fit: contain;
	position: relative;
	left: -60%;
}
.steps-grid-container .box:first-of-type {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.steps-grid-container .box:nth-of-type(2) {
	border-radius: 0;
	background: #00ff51;
	transform: translate(0, -60px);
	border-top-right-radius: 30px;
	border-top-left-radius: 30px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	height: 514px;
	transition: transform 0.3s ease-out, border-radius 0.3s ease-out;
}
.steps-grid-container .box:nth-of-type(3) {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.steps-grid-container .box:nth-of-type(2):hover {
	border-top-left-radius: 30px !important;
	border-top-right-radius: 30px !important;
	border-bottom-right-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	transform: translateY(-65px) scale(1.02);
}
.steps-grid-container .box:nth-of-type(2)::before {
	border-radius: 0;
}
.features-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 16px;
	padding: 0;
	width: 100%;
}
.feature-card {
	position: relative;
	border-radius: 20px;
	padding: 55px 35px 45px;
	overflow: hidden;
	transition: transform 0.3s ease-out, border-radius 0.3s ease-out;
	color: #fff;
	display: flex;
	flex-direction: column;
	cursor: pointer;
}
.feature-card:hover {
	transform: translateY(-5px) scale(1.02);
}
.feature-card img {
	max-width: 100%;
	height: auto;
	display: block;
	margin-bottom: 16px;
}
.feature-card .card-arrow {
	margin-top: auto;
	width: 55px;
	height: 55px;
}
.card-3-content .card-arrow img {
	width: 100%;
	height: 100%;
	display: block;
}
.card-3:hover #card3-logo {
	transform: scale(1.1);
	transition: transform 0.2s ease-in-out;
}
.card-1 .feature-card .card-arrow,
.card-2 .feature-card .card-arrow {
	position: relative;
    left: 80%;
}
.card-1,
.card-2 {
	position: relative;
}
.card-1 .top-img,
.card-2 .top-img {
	position: absolute;
    width: 80%;
    height: auto;
    top: 17px;
    right: 7px;
    z-index: 1;
}
.card-1 h2,
.card-2 h2 {
    font-family: 'Manrope Bold', sans-serif !important;
    font-size: var(--fs-subtitle) !important;
    line-height: 1.1em !important;
    color: #fff;
	z-index: 2;
}
.card-1 p,
.card-2 p {
    font-family: 'Manrope Bold', sans-serif !important;
    font-size: var(--fs-sm) !important;
    line-height: 1.1em !important;
    color: #17343F !important;
	z-index: 2;
}
.card-1 {
	background: linear-gradient(135deg, #00ff51, #ffffff);
}
.card-1::before {
	content: "";
	position: absolute;
	inset: 0;
	border: 1px dashed rgba(255,255,255,0.6);
	border-radius: 20px;
	pointer-events: none;
}
.card-2 {
	background: linear-gradient(135deg, #00ff51, #ffffff);
}
.card-2::before {
	content: "";
	position: absolute;
	inset: 0;
	border: 1px dashed rgba(255,255,255,0.6);
	border-radius: 20px;
	pointer-events: none;
}
.card-3 {
	background: #76FF8D;
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 200px;
    align-content: center;
	position: relative;
	min-height: 400px;
	overflow: hidden;
}
.card-3-content {
    display: flex;
    width: 100%;
    justify-content: space-between;
	z-index: 2;
}
.card-3 .card-text {
	font-family: 'Manrope Bold', sans-serif;
    font-size: var(--fs-smd-title);
    line-height: 1.1em;
    color: var(--black-color);
}
#card3-logo {
	position: absolute;
    width: 373px;
    height: 379px;
    bottom: -15px;
    right: 0;
	object-fit: contain;
}
.feature-card h2 {
	font-size: 1.5rem;
	margin: 0 0 12px;
}
.feature-card p {
	font-size: 0.875rem;
	line-height: 1.4;
	margin: 0 0 24px;
	color: rgba(255,255,255,0.85);
}
.edge-section .wrapper .box .content.list {
    line-height: 1.3em;
    padding: 0;
    margin: -20px 0 0;
}
.services {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
    width: 100%;
    justify-content: center;
	margin: 0 0 100px;
	padding: 0 40px;
	max-width: 1400px;
}
.services .card {
	position: relative;
	border: 1px solid var(--gray-color);
	color: var(--price-color);
	border-radius: 50px;
	text-align: center;
	padding: 2rem 1rem;
	transition: background 0.3s, color 0.3s, box-shadow 0.3s;
	cursor: pointer;
	z-index: 1;
	width: auto;
    max-width: 300px;
	height: 100%;
    min-height: 400px;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
	margin: auto;
}
.services .card .icon img {
	width: 70px;
	height: 70px;
	margin-bottom: 1rem;
}
.services .card span {
    font-family: 'Manrope Semibold', sans-serif;
    font-size: var(--fs-btn);
    line-height: 1.1em;
	color: var(--price-color);
}
.services .card:hover {
	background-color: var(--price-color);
	color: var(--white-color);
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
	transform: translate(0, -25px);
	transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}
.services .card:hover span {
	color: var(--white-color);
}
.services .card:hover .icon img {
	filter: brightness(0) invert(1);
}
.features-list {
    position: relative;
    max-width: 1600px;
    margin: 0 auto 100px;
    padding: 60px;
    overflow: hidden;
}
.features-list__top {
	display: flex;
	gap: 1rem;
	margin-bottom: 1rem;
	flex-wrap: wrap;
}
.features-list__card--large {
	flex: 1 1 calc(50% - 0.5rem);
	min-height: 200px;
	border-radius: 8px;
}
.features-list__bottom {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}
.features-list__card--small {
	flex: 1 1 calc(33.333% - 0.667rem);
	min-height: 150px;
	border-radius: 8px;
}
.features-col.features img {
    width: 540px;
	height: auto;
    object-fit: contain;
}
.features-list .card .more2-btn,
.features-list .card .more1-btn {
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	width: 100px;
	height: 100px;
	border: 5px solid transparent;
	border-radius: 50%;
	background: transparent;
	transition:
		background 0.3s ease,
		border-color 0.3s ease,
		width 0.5s ease,
		border-radius 0.5s ease;
	z-index: 1;
    position: absolute;
}
.features-list .card .more1-btn {
	top: 14px;
    left: 14px;
}
.features-list .card .more2-btn {
	top: 14px;
    right: 14px;
}
.features-list .card .more2-icon,
.features-list .card .more1-icon {
	width: 50px;
	height: 50px;
	transition: transform 0.3s ease;
}
.features-list .card .more1-icon {
	margin-left: auto;
	transform: translate(-250%, 0);
}
.features-list .card .more2-text,
.features-list .card .more1-text {
	margin-left: 0.5rem;
	white-space: nowrap;
	opacity: 0;
	transition: opacity 0s ease;
    font-family: 'Manrope Semibold', sans-serif;
    font-size: var(--fs-sm);
    line-height: 1.3em;
    color: #ffffff8f;
}
.features-list .card .more1-text {
	transition:
		transform 0.4s ease 0.4s,
		opacity   0.2s ease 0.4s;
	transform: scaleX(0);
	opacity: 0;
	display: inline-block;
	transform-origin: left center;
}
.features-list .card img {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 50px;
    height: auto;
}
.features-list .card {
    border-radius: 19px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    cursor: pointer;
    padding: 24px 100px;
    min-height: 450px;
	background-color: #ffffff05;
	position: relative;
	overflow: hidden;
	flex-direction: column;
}
.features-list .card span {
	font-family: 'Manrope Medium', sans-serif;
    font-size: var(--fs-sm);
    line-height: 1.3em;
    color: var(--white-color);
	z-index: 1;
}
.features-list .card:hover .more2-btn {
	background: #ffffff05;
    border: 2px solid #00ff51bf;
    border-radius: 16px;
    width: 285px;
    border-radius: 40px;
    height: 100px;
    display: flex;
    gap: 10px;
	padding: 0 25px;
}
.features-list .card:hover .more2-btn .more2-text {
	opacity: 1;
	transition-delay: 0.4s;
}
.features-list .card:hover .more1-btn {
	background: #ffffff05;
    border: 2px solid #00ff51bf;
    border-radius: 16px;
    width: 300px;
    border-radius: 40px;
    height: 100px;
    display: flex;
    gap: 10px;
	padding: 0 25px;
}
.features-list .card:hover .more1-btn .more1-text {
	transform: scaleX(1);
	opacity: 1;
}
.features-list .card:hover .more1-btn .more1-icon {
	transform: translate(0, 0);
}
.features-list .card:hover {
	box-shadow: inset 0 0 60px #1c4f36, inset 5px 0 5px #8dffb1, inset -5px 0 10px var(--secondary-color), inset 5px 0 20px #173f1e, inset -5px 0 20px #0b822a, 0 0 10px #22ff23, -10px 0 50px #72f89e, 10px 0 20px #72f89e;
}
.features-list .card:hover img {
	transition: transform 0.4s ease-in-out;
	transform: translateY(5px) scale(1.25);
}
.features-list .card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    z-index: 1;
    border-radius: 15px;
}
@media (max-width: 1700px) {
	#server {
		left: -34%;
	}
	#ellipse20 {
		right: -45%;
	}
}
@media (max-width: 1540px) {
	.game-column .client .ellipse .top-left {
		top: -26%;
		left: -35%;
	}
	.game-column .client .ellipse .top-right {
		top: -24%;
		left: 18%;
	}
	.game-column .client .ellipse .bottom-left {
		top: 48%;
		left: -38%;
	}
	.edge-section .wrapper {
		gap: 150px;
	}
	.reg-steps-section .progress-line {
		position: absolute;
		top: 438px;
	}
	#disk1 {
		top: 35%;
		left: -5%;
	}
	#disk2 {
		top: 55%;
		right: -8%;
	}
	#ellipse9 {
		right: -15%;
		top: -50%;
	}
	#ellipse10 {
		left: -15%;
		top: -20%;
	}
	#ellipse5 {
		top: -87%;
		left: -7%;
	}
	#ellipse6 {
		top: 15%;
		left: 67%;
	}
	#ellipse11 {
		top: -10%;
		left: -42%;
	}
	#ellipse12 {
		top: 45%;
		right: -43%;
	}
	#ellipse13 {
		top: -5%;
		right: -52%;
	}
	#ellipse20 {
		right: -48%;
	}
}
@media (max-width: 1440px) {
	.top-section .text,
	.top-section .desc {
		width: 900px;
	}
	.top-section .desc {
		height: 133px;
	}
	.top-section .text {
		height: 372px;
	}
	.game-column .client .ellipse .top-left {
		top: -26%;
		left: -36%;
	}
	.game-column .client .ellipse .top-right {
		top: -24%;
		left: 27%;
	}
	.game-column .client .ellipse .bottom-left {
		top: 55%;
		left: -38%;
	}
	.game-top-row {
		gap: 8em;
	}
	.testimonials-section .logo {
		left: 26%;
	}
	.limited-spot-section {
		padding: 150px 50px;
	}
	.edge-section .wrapper {
		gap: 100px;
	}
	.reg-steps-section .progress-line {
		position: absolute;
		top: 436px;
	}
	#disk1 {
		top: 35%;
		left: -6%;
	}
	#disk2 {
		top: 55%;
		right: -10%;
	}
	#ellipse3 {
		bottom: -20%;
		left: -37%;
	}
	#ellipse11 {
		top: -19%;
		left: -62%;
	}
	#ellipse12 {
		top: 45%;
		right: -62%;
	}
	#ellipse13 {
		top: -15%;
		right: -67%;
	}
	#ellipse20 {
		right: -50%;
	}
}
@media (max-width: 1240px) {
	.top-section .button {
		width: 290px;
	}
	.game-column .client .ellipse .top-left {
		top: -25%;
		left: -35%;
	}
	.game-column .client .ellipse .top-right {
		top: -25%;
		left: 28%;
	}
	.game-column .client .ellipse .bottom-left {
		top: 58%;
		left: -38%;
	}
	.game-top-row {
		gap: 7em;
	}
	.game-element.logo {
		left: 68%;
	}
	.testimonials-section .logo {
		left: 22%;
	}
	.limited-spot-section .wrapper {
		flex-direction: column;
		justify-content: center;
		align-content: center;
		align-items: center;
		gap: 80px;
	}
	.limited-spot-section .limited-spot-col {
		width: fit-content;
	}
	.edge-section .wrapper {
		gap: 95px;
	}
	.circle-left,
	.circle-right {
		width: 143px;
		height: 146px;
	}
	.sub-icon-container {
		height: 120px;
		transform: translate(-65%, -50%);
	}
	#ellipse3 {
		bottom: -20%;
		left: -40%;
	}
	#ellipse4 {
		top: 34%;
        left: 49%;
	}
	#ellipse9 {
		right: -17%;
		top: -54%;
	}
	#ellipse10 {
		left: -14%;
		top: -55%;
	}
	#ellipse11 {
		top: -11%;
		left: -62%;
	}
	#ellipse12 {
		top: 50%;
		right: -70%;
	}
	#ellipse13 {
		top: -25%;
		right: -85%;
	}
	#ellipse14,
	#ellipse16 {
		left: -15%;
	}
	#ellipse15 {
		bottom: -38%;
		left: -37%;
	}
	#ellipse20 {
		right: -60%;
	}
}
@media (max-width: 1140px) {
	.top-section .text,
	.top-section .desc {
		width: 800px;
	}
	.top-section .desc {
		height: 133px;
	}
	.top-section .text {
		height: 372px;
	}
	#server {
		left: -10%;
	}
	.game-column .client .ellipse .top-left {
		top: -20%;
		left: -35%;
	}
	.game-column .client .ellipse .top-right {
		top: -20%;
		left: 28%;
	}
	.game-column .client .ellipse .bottom-left {
		top: 58%;
		left: -38%;
	}
	.game-top-row {
		gap: 6em;
	}
	.game-element.logo {
		left: 65%;
	}
	.testimonials-section .logo {
		left: 16%;
		max-height: 760px;
	}
	.edge-section .wrapper {
		gap: 90px;
	}
	.edge-section .wrapper .box:first-child {
		width: 45%;
	}
	.edge-section .wrapper .box:first-child img {
		width: 100%;
	}
	.edge-section .wrapper .box:first-child .float {
		width: 40%;
		left: 30%;
		top: 60%;
	}
	#ellipse11 {
		top: -10%;
		left: -62%;
	}
	#ellipse12 {
		top: 33%;
		right: -91%;
	}
	#ellipse13 {
		top: -20%;
		right: -85%;
	}
	#ellipse14,
	#ellipse16 {
		left: -20%;
	}
	#ellipse15 {
		bottom: -38%;
		left: -41%;
	}
	#ellipse19 {
		right: -25%;
		width: 200%;
	}
	#ellipse20 {
		right: -62%;
	}
}
@media (max-width: 1100px) {
	.game-column .client .ellipse .top-left {
		top: 0;
		left: -35%;
	}
	.game-column .client .ellipse .top-right {
		top: 0;
		left: 28%;
	}
	.game-column .client .ellipse .bottom-left {
		top: 67%;
		left: -38%;
	}
	.game-top-row {
		gap: 5em;
	}
	.game-element.logo {
		left: 61%;
	}
	.edge-section .wrapper {
		gap: 85px;
	}
}
@media (max-width: 1025px) and (max-width: 1090px) {
	.steps-grid-container .box:nth-of-type(2) {
		height: 460px;
	}
}
@media (max-width: 1090px) {
	.steps-grid-container .box:nth-of-type(2) {
		height: 460px;
	}
	.game-column .client .ellipse .top-left {
		top: -22%;
		left: -35%;
	}
	.game-column .client .ellipse .top-right {
		top: -22%;
		left: 28%;
	}
	.game-column .client .ellipse .bottom-left {
		top: 61%;
		left: -38%;
	}
	.steps-grid-container .box {
		width: 100%;
		height: 400px;
	}
	.edge-section .wrapper {
		gap: 80px;
	}
	#ellipse9 {
		right: -23%;
		top: -53%;
	}
	#ellipse10 {
		left: -16%;
		top: -54%;
	}
}
@media (max-width: 1050px) {
	.game-column .client .ellipse .top-left {
		top: -20%;
		left: -35%;
	}
	.game-column .client .ellipse .top-right {
		top: -20%;
		left: 28%;
	}
	.game-column .client .ellipse .bottom-left {
		top: 61%;
		left: -38%;
	}
	.edge-section .wrapper {
		gap: 75px;
	}
	#disk1 {
		top: 25%;
		left: -10%;
	}
	#disk2 {
		top: 55%;
		right: -11%;
	}
	#ellipse9 {
		right: -23%;
		top: -53%;
	}
	#ellipse10 {
		left: -16%;
		top: -54%;
	}
	#ellipse5 {
		top: -108%;
		left: -60%;
	}
	#ellipse6 {
		top: 15%;
		left: 67%;
	}
	#ellipse14,
	#ellipse16 {
		left: -28%;
	}
	#ellipse15 {
		bottom: -38%;
		left: -46%;
	}
	#ellipse20 {
		right: -70%;
	}
}
@media (max-width: 1024px) {
	.top-section .button {
		width: 250px;
		height: 53px;
	}
	.top-section .text,
	.top-section .desc {
		width: 700px;
	}
	.top-section .desc {
		height: 118px;
	}
	.top-section .text {
		height: 319px;
	}
	.testimonials-section .titles {
		padding: 0 20px;
	}
    .edge-section .wrapper .box:first-child .float {
        width: 75%;
		height: auto;
		object-fit: contain;
	}
	#server {
		left: 0;
	}
	.features-sec .wrapper {
		flex-direction: column;
		gap: 100px;
	}
	.features-col {
		width: 100%;
		align-items: center;
	}
	.features-sec,
	.knowledge-section {
		padding: 60px 0;
	}
	.top-section {
		padding: 50px 30px;
	}
	.game-column {
		width: 100%;
	}
	.game-top-row {
		flex-direction: column;
	}
	.game-column .client .bg {
		transform: translate(0, 0);
	}
	.game-column .client {
		display: flex;
		flex-direction: column;
		align-content: center;
		align-items: center;
		justify-content: center;
	}
	.game-column .client .ellipse {
		position: static;
	}
	.game-column .client .ellipse .top-left {
		top: -20em;
		left: -8em;
	}
	.game-column .client .ellipse .top-right {
		top: -20em;
		left: 8em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 10em;
		left: -12em;
	}
	.steps-grid-container,
	.steps-grid-container .box:nth-of-type(2) {
		transform: translate(0,0) !important;
	}
	.steps-grid-container .box:nth-of-type(2):hover,
	.steps-grid-container .box:nth-of-type(2),
	.steps-grid-container .box {
		width: 100%;
		height: 400px !important;
		border-radius: 30px !important;
	}
	.steps-grid-container {
		gap: 20px !important;
	}
	.steps-grid-container,
	.reg-steps-grid-container {
		grid-template-columns: repeat(2, 1fr);
	}
	.with-booleans-section .with-booleans-box-container .box { 
		width: 100%;
	}
	.with-booleans-section .with-booleans-box-container { 
		flex-direction: column;
	}
	.testimonials-section .logo {
		left: 13%;
		max-height: 720px;
	}
	.edge-section .wrapper {
		gap: 0;
		padding: 120px 0 100px;
	}
	.edge-section .wrapper {
		flex-direction: column;
	}
	.edge-section .wrapper .box,
	.edge-section .wrapper .box:first-child	{
		width: 80%;
	}
	.edge-section .wrapper .box:first-child img {
		width: 100%;
	}
	.edge-section {
		padding: 230px 0 50px;
	}
	.reg-steps-section .progress-line {
		display: none;
	}
	#disk1 {
		top: 35%;
		left: -10%;
	}
	#ellipse3 {
		bottom: -20%;
		left: -52%;
	}
	#ellipse4 {
        top: 7%;
        left: 31%;
	}
	#ellipse9 {
		right: -19%;
		top: 5%;
	}
	#ellipse10 {
		left: -23%;
		top: 0;
	}
	#ellipse11 {
		top: -10%;
		left: -62%;
	}
	#ellipse12 {
		top: 41%;
		right: -91%;
	}
	#ellipse13 {
		top: -13%;
		right: -85%;
	}
	#ellipse14,
	#ellipse16 {
		left: -6%;
	}
	#ellipse15 {
		left: -34%;
	}
	#ellipse20 {
		right: -70%;
		top: 57%;
	}
}
@media (max-width: 991px) {
	.game-column .client .ellipse .top-left {
		top: -18em;
		left: -10em;
	}
	.game-column .client .ellipse .top-right {
		top: -18em;
		left: 10em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 15em;
		left: -12em;
	}
	.testimonials-section .logo {
		left: 11%;
		max-height: 700px;
	}
	#ellipse11 {
		top: -10%;
		left: -95%;
	}
	#ellipse12 {
		top: 41%;
		right: -97%;
	}
	#ellipse13 {
		top: -13%;
		right: -104%;
	}
}
@media (min-width: 769px) and (max-width: 1024px) {
	.game-column .client .bg .client-img {
		width: 99%;
	}
}
@media (max-width: 768px) {
	.top-section .button {
		width: 220px;
	}
	.top-section .text,
	.top-section .desc {
		width: 600px;
	}
	.top-section .desc {
		height: 123px;
		text-align: start;
		margin: 0 0 1em;
		text-align: center;
	}
	.top-section .text {
		height: 295px;
	}
	.features-col.features img {
		width: 100%;
		height: auto;
		object-fit: contain;
	}
	.features-list {
		border: none;
	}
	.features-list__card--large,
	.features-list__card--small {
		flex: 1 1 100%;
	}
	.feature-card .card-arrow {
		width: 35px;
		height: 35px;
	}
	.top-section span	{
		width: 367px;
		height: 56px;
	}
	.knowledge-columns {
		flex-direction: column;
	}
	.knowledge-column {
		width: 100%;
	}
	.game-top-row {
		flex-direction: column;
	}
	.game-column {
		width: 100%;
	}
	.grid-container {
		grid-template-columns: 1fr;
	}
	.game-column .client .ellipse .top-left {
		top: -15em;
		left: -13em;
	}
	.game-column .client .ellipse .top-right {
		top: -15em;
		left: 13em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 18em;
		left: -13em;
	}
	.game-element {
		max-width: 140px;
	}
	.game-element.logo {
		left: 68%;
	}
	.game-column.second {
		padding: 0 1em;
	}
	.game-top-row {
		gap: 10em;
	}
	.steps-grid-container .box {
		width: 100%;
		height: 300px;
	}
	.steps-grid-container,
	.reg-steps-grid-container {
		grid-template-columns: repeat(1, 1fr);
	}
	.steps-section,
	.reg-steps-section,
	.testimonials-section {
		padding: 40px 15px;
	}
	.reg-steps-section {
		margin: -1px 0 0;
	}
	.testimonials-section {
		padding: 100px 0 55px;
	}
	.steps-section .titles {
		width: 100%;
		justify-content: center;
		align-items: flex-start;
		align-content: flex-start;
		flex-direction: column;
	}
	.steps-section .titles .left,
	.steps-section .titles .right {
		width: 100%;
	}
	.carousel {
		width: 100%;
		padding: 1em 2em;
	}
	.with-booleans-section .with-booleans-box-container .box .sub-item img{
		max-width: 80px;
	}
	.testimonials-section .logo {
		top: 10%;
		left: 2%;
		max-height: 450px;
	}
	.limited-spot-section .limited-spot-col:last-child {
		flex-direction: column;
	}
	.limited-spot-section .limited-spot-col {
		width: 100%;
		max-width: 100%;
	}
	.limited-spot-section .limited-spot-col:last-child,
	.limited-spot-section .wrapper {
		gap: 60px;
	}
	.limited-spot-section {
		padding: 80px 20px;
	}
	.circle-left,
	.circle-right {
		width: 113px;
		height: 116px;
	}
	.sub-icon-container {
		height: 92px;
	}
	.sub-icon-container {
		transform: translate(-56%, -50%);
	}
	.with-booleans-section .with-booleans-box-container .title-container {
		margin: 0 0 2em;
	}
	.with-booleans-section .with-booleans-box-container .box {
		padding: 55px 55px 45px;
	}
	#disk1 {
		top: 7%;
		left: -21%;
	}
	#disk2 {
		top: 35%;
		right: -17%;
	}
	#ellipse3 {
		bottom: -20%;
		left: -65%;
	}
	#ellipse4 {
        top: 3%;
        left: -16%;
	}
	#ellipse9 {
		right: -19%;
		top: 50%;
	}
	#ellipse10 {
		left: -23%;
		top: 0;
	}
	#ellipse5 {
		top: -60%;
		left: -60%;
	}
	#ellipse6 {
		top: 55%;
		left: 55%;
	}
	#ellipse11 {
		top: -10%;
		left: -95%;
	}
	#ellipse12 {
		top: -10%;
		right: -133%;
	}
	#ellipse13 {
		top: 30%;
		right: -112%;
	}
	#ellipse14,
	#ellipse16 {
		top: -41%;
		left: -12%;
	}
	#ellipse15 {
		left: -36%;
	}
	#ellipse20 {
		right: -90%;
		top: 30%;
	}
}
@media (max-width: 740px) {
	.game-column .client .ellipse .top-left {
		top: -14em;
		left: -13em;
	}
	.game-column .client .ellipse .top-right {
		top: -14em;
		left: 13em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 19em;
		left: -13em;
	}
}
@media (max-width: 680px) {
	.game-column .client .ellipse .top-left {
		top: -13em;
		left: -13em;
	}
	.game-column .client .ellipse .top-right {
		top: -13em;
		left: 13em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 21em;
		left: -13em;
	}
	#ellipse11 {
		top: -10%;
		left: -131%;
	}
	#ellipse12 {
		top: -22%;
		right: -165%;
	}
	#ellipse13 {
		top: 30%;
		right: -99%;
	}
	.top-section .text,
	.top-section .desc {
		width: 500px;
	}
}
@media (max-width: 650px) {
	.game-column .client .ellipse .top-left {
		top: -11em;
		left: -11em;
	}
	.game-column .client .ellipse .top-right {
		top: -11em;
		left: 11em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 22em;
		left: -12em;
	}
	.game-element {
			max-width: 130px !important;
	}
	#disk2 {
		top: 35%;
		right: -21%;
	}
	#ellipse14,
	#ellipse16 {
		top: -43%;
		left: -18%;
	}
	#ellipse15 {
		left: -42%;
	}
	.card-3 {
		align-items: flex-end;
		justify-content: flex-end;
	}
}
@media (max-width: 600px) {
	.features-grid {
		grid-template-columns: 1fr;
	}
	.card-3 {
		grid-column: auto;
		flex-direction: row;
	}
}
@media (max-width: 575px) {
	.game-column .client .ellipse .top-left {
		top: -10em;
		left: -10em;
	}
	.game-column .client .ellipse .top-right {
		top: -10em;
		left: 10em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 21em;
		left: -10em;
	}
	.game-section .wrapper,
	.steps-section .wrapper,
	.reg-steps-section .wrapper {
		padding: 0 3em;
	}
	.game-column:first-of-type {
		padding: 0 2em;
	}
	.with-booleans-section .with-booleans-box-container .box {
		gap: 15px;
	}
	.testimonials-section .logo img {
		width: 500px;
	}
	.testimonials-section .logo {
		top: 21%;
		left: 4%;
		max-height: 550px;
	}
	#ellipse5 {
		top: -60%;
		left: -95%;
	}
	#ellipse6 {
		top: 55%;
		left: 30%;
	}
	#ellipse11 {
		top: -8%;
		left: -153%;
	}
	#ellipse12 {
		top: -22%;
		left: -230%;
	}
	#ellipse13 {
		display: none;
	}
	#ellipse14,
	#ellipse16 {
		top: -40%;
		left: -23%;
	}
	#ellipse15 {
		left: -46%;
	}
	#ellipse20 {
		right: -154%;
        top: 36%;
	}
	.top-section .text,
	.top-section .desc {
		width: 420px;
	}
	.top-section .desc {
		height: 130px;
	}
	.top-section .text {
		height: 328px;
	}
}
@media (max-width: 510px) {
	.top-section a.secondary-link {
		font-size: var(--fs-xlg-subtitle);
		width: 170px;
	}
	.top-section .button {
		display: none;
		visibility: hidden;
		opacity: 0;
	}
	.top-section span {
		margin-bottom: 10px;
	}
	#card3-logo {
		width: 38dvw;
		height: 18dvh;
	}
	.top-section .desc {
		height: 110px;
        width: 360px;
        font-family: 'Manrope Semibold', sans-serif;
        font-size: 16px;
        margin: 0;
	}
	.top-section .text {
		height: 360px;
		width: 375px;
	}
	.features-list .card {
		padding: 24px 40px;
	}
	.game-column .client .ellipse .top-left {
		top: -8em;
		left: -8em;
	}
	.game-column .client .ellipse .top-right {
		top: -8em;
		left: 8em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 18em;
		left: -8em;
	}
	.game-element {
		max-width: 120px !important;
	}
	.game-column:first-of-type {
		padding: 0 .5em;
	}
	.game-section .wrapper,
	.steps-section .wrapper,
	.reg-steps-section .wrapper {
		padding: 0 2em;
	}
	.game-top-row {
		gap: 6em;
	}
	.testimonial-content {
		padding: .9em .5em .4em;
	}
	#disk2 {
		top: 61%;
		right: -42%;
	}
	#ellipse3 {
		bottom: -20%;
		left: -120%;
	}
	#ellipse4 {
		top: 0%;
		left: 9%;
	}
	#ellipse14,
	#ellipse16 {
		top: -40%;
		left: -40%;
	}
	#ellipse15 {
		left: -54%;
	}
}
@media (max-width: 475px) {
	.game-column .client .ellipse .top-left {
		top: -6em;
		left: -6em;
	}
	.game-column .client .ellipse .top-right {
		top: -6em;
		left: 6em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 16em;
		left: -7em;
	}
	.game-section .wrapper {
		padding: 0 1em;
		gap: 125px;
	}
	.steps-section .wrapper,
	.reg-steps-section .wrapper,
	.testimonials-section .wrapper,
	.limited-spot-section .wrapper {
		padding: 0 1em;
	}
	.testimonials-section .logo {
		top: 21%;
		left: 4%;
		max-height: 650px;
	}
	#ellipse5 {
		top: -48%;
		left: -129%;
	}
	#ellipse6 {
		top: 56%;
		left: -5%;
	}
	#ellipse11 {
		top: -11%;
		left: -182%;
	}
	#ellipse12 {
		top: 16%;
		left: 45%;
	}
	#ellipse14,
	#ellipse16 {
		top: -40%;
		left: -47%;
	}
	#ellipse15 {
		left: -62%;
	}
	#ellipse20 {
		right: -154%;
        top: 36%;
	}
}
@media (max-width: 440px) {
	#disk1,
	#disk2 {
		visibility: hidden !important;
		opacity: 0 !important;
	}
	.top-section::before {
		visibility: hidden;
		opacity: 0;
	}
	.top-section span	{
		width: 271px;
		height: 42px;
	}
	.card-3 .card-arrow {
		width: 44px;
		height: 35px;
	}
	.card-3 {
		min-height: auto;
	}
	.game-column .client .ellipse .top-left {
		top: -5.5em;
		left: -5.5em;
	}
	.game-column .client .ellipse .top-right {
		top: -5.5em;
		left: 5.5em;
	}
	.game-column .client .ellipse .bottom-left {
		top: 15em;
		left: -7em;
	}
	.game-element {
		max-width: 110px !important;
	}
	.game-section .wrapper {
		padding: 0 1em;
		gap: 80px;
	}
	.steps-section .wrapper,
	.reg-steps-section .wrapper,
	.testimonials-section .wrapper,
	.limited-spot-section .wrapper {
		padding: 0 1em;
	}
	.game-top-row {
		gap: 5em;
	}
	.game-column .client {
		padding: 0 1.4em;
	}
	.steps-grid-container .box {
		width: 100%;
		height: 410px;
	}
	#ellipse14,
	#ellipse16 {
		top: -39%;
		left: -55%;
	}
	#ellipse15 {
		left: -65%;
	}
	#ellipse20 {
		right: -154%;
        top: 36%;
	}
}
@media (max-width: 400px) {
	.services .card span {
		font-size: 0.9rem;
	}
	.top-section .desc {
		height: 123px;
		width: 380px;
	}
	.top-section .text {
		height: 332px;
		width: 380px;
	}
}
@media (max-width: 380px) {
	.top-section .desc {
        height: 128px;
        width: 298px;
        font-size: 15px;
	}
	.top-section .text {
		height: 323px;
		width: 330px;
	}
	.game-element {
		max-width: 90px !important;
	}
	#ellipse14,
	#ellipse16 {
		top: -40%;
		left: -74%;
	}
	#ellipse15 {
		left: -85%;
	}
	#ellipse20 {
		right: -154%;
        top: 36%;
	}
}