/* =========================================================
   GUP - v01
   CUSTOM / THEME / NON-BOOTSTRAP CSS
========================================================= */

/* =========================================================
   VENDOR / SHARED FOUNDATIONS
========================================================= */
/* =========================================================
   GUP - v01
========================================================= */
:root {
	--swiper-theme-color: rgb(4, 124, 255);
	--gu-focus-border: rgb(5, 60, 255);
	--gu-focus-shadow: 0 0 0 4px rgb(1 57 255 / .2);
	--gu-focus-transition: border-color .2s ease, box-shadow .2s ease;
	--gu-focus-outline: none
}

:host {
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
	z-index: 1
}

.swiper {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: hidden;
	list-style: none;
	padding: 0;
	z-index: 1;
	display: block
}

.swiper-vertical>.swiper-wrapper {
	flex-direction: column
}

.swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: flex;
	transition-property: transform;
	transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
	box-sizing: content-box
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
	transform: translate3d(0, 0, 0)
}

.swiper-horizontal {
	touch-action: pan-y
}

.swiper-vertical {
	touch-action: pan-x
}

.swiper-slide {
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative;
	transition-property: transform;
	display: block
}

.swiper-slide-invisible-blank {
	visibility: hidden
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
	height: auto
}

.swiper-autoheight .swiper-wrapper {
	align-items: flex-start;
	transition-property: transform, height
}

.swiper-backface-hidden .swiper-slide {
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.swiper-3d.swiper-css-mode .swiper-wrapper {
	perspective: 1200px
}

.swiper-3d .swiper-wrapper {
	transform-style: preserve-3d
}

.swiper-3d {
	perspective: 1200px
}

.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
	transform-style: preserve-3d
}

.swiper-css-mode>.swiper-wrapper {
	overflow: auto;
	scrollbar-width: none;
	-ms-overflow-style: none
}

.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar {
	display: none
}

.swiper-css-mode>.swiper-wrapper>.swiper-slide {
	scroll-snap-align: start start
}

.swiper-css-mode.swiper-horizontal>.swiper-wrapper {
	scroll-snap-type: x mandatory
}

.swiper-css-mode.swiper-vertical>.swiper-wrapper {
	scroll-snap-type: y mandatory
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper {
	scroll-snap-type: none
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide {
	scroll-snap-align: none
}

.swiper-css-mode.swiper-centered>.swiper-wrapper::before {
	content: "";
	flex-shrink: 0;
	order: 9999
}

.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide {
	scroll-snap-align: center center;
	scroll-snap-stop: always
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child {
	margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before {
	height: 100%;
	min-height: 1px;
	width: var(--swiper-centered-offset-after)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child {
	margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before {
	width: 100%;
	min-width: 1px;
	height: var(--swiper-centered-offset-after)
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 10
}

.swiper-3d .swiper-slide-shadow {
	background: rgb(0 0 0 / .15)
}

.swiper-3d .swiper-slide-shadow-left {
	background-image: linear-gradient(to left, rgb(0 0 0 / .5), rgba(255, 255, 255, 0))
}

.swiper-3d .swiper-slide-shadow-right {
	background-image: linear-gradient(to right, rgb(0 0 0 / .5), rgba(255, 255, 255, 0))
}

.swiper-3d .swiper-slide-shadow-top {
	background-image: linear-gradient(to top, rgb(0 0 0 / .5), rgba(255, 255, 255, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
	background-image: linear-gradient(to bottom, rgb(0 0 0 / .5), rgba(255, 255, 255, 0))
}

.swiper-lazy-preloader {
	width: 42px;
	height: 42px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -21px;
	margin-top: -21px;
	z-index: 10;
	transform-origin: 50%;
	box-sizing: border-box;
	border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
	border-radius: 50%;
	border-top-color: rgba(255, 255, 255, 0)
}

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
	animation: swiper-preloader-spin 1s infinite linear
}

.swiper-lazy-preloader-white {
	--swiper-preloader-color: rgb(255, 255, 255)
}

.swiper-lazy-preloader-black {
	--swiper-preloader-color: rgb(4, 4, 4)
}

@keyframes swiper-preloader-spin {
	0% {
		transform: rotate(0deg)
	}

	100% {
		transform: rotate(360deg)
	}
}

.swiper-virtual .swiper-slide {
	-webkit-backface-visibility: hidden;
	transform: translateZ(0)
}

.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	pointer-events: none
}

.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
	height: 1px;
	width: var(--swiper-virtual-size)
}

.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
	width: 1px;
	height: var(--swiper-virtual-size)
}

:root {
	--swiper-navigation-size: 44px
}

.swiper-button-prev,
.swiper-button-next {
	position: absolute;
	top: var(--swiper-navigation-top-offset, 50%);
	width: calc(var(--swiper-navigation-size)/44*27);
	height: var(--swiper-navigation-size);
	margin-top: calc(0px - var(--swiper-navigation-size)/2);
	z-index: 10;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--swiper-navigation-color, var(--swiper-theme-color))
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
	opacity: .35;
	cursor: auto;
	pointer-events: none
}

.swiper-button-prev.swiper-button-hidden,
.swiper-button-next.swiper-button-hidden {
	opacity: 0;
	cursor: auto;
	pointer-events: none
}

.swiper-navigation-disabled .swiper-button-prev,
.swiper-navigation-disabled .swiper-button-next {
	display: none !important
}

.swiper-button-prev svg,
.swiper-button-next svg {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transform-origin: center
}

.swiper-rtl .swiper-button-prev svg,
.swiper-rtl .swiper-button-next svg {
	transform: rotate(180deg)
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
	left: var(--swiper-navigation-sides-offset, 10px);
	right: auto
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
	right: var(--swiper-navigation-sides-offset, 10px);
	left: auto
}

.swiper-button-lock {
	display: none
}

.swiper-button-prev:after,
.swiper-button-next:after {
	font-family: swiper-icons;
	font-size: var(--swiper-navigation-size);
	text-transform: none !important;
	letter-spacing: 0;
	font-variant: initial;
	line-height: 1
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
	content: "prev"
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
	right: var(--swiper-navigation-sides-offset, 10px);
	left: auto
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
	content: "next"
}

.swiper-pagination {
	position: absolute;
	text-align: center;
	transition: 300ms opacity;
	transform: translate3d(0, 0, 0);
	z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
	opacity: 0
}

.swiper-pagination-disabled>.swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
	display: none !important
}

.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
	bottom: var(--swiper-pagination-bottom, 8px);
	top: var(--swiper-pagination-top, auto);
	left: 0;
	width: 100%
}

.swiper-pagination-bullets-dynamic {
	overflow: hidden;
	font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
	transform: scale(.33);
	position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
	transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
	transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
	transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
	transform: scale(.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
	transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
	transform: scale(.33)
}

.swiper-pagination-bullet {
	width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
	height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
	display: inline-block;
	border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
	background: var(--swiper-pagination-bullet-inactive-color, rgb(4, 4, 4));
	opacity: var(--swiper-pagination-bullet-inactive-opacity, .2)
}

button.swiper-pagination-bullet {
	border: none;
	margin: 0;
	padding: 0;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
	cursor: pointer
}

.swiper-pagination-bullet:only-child {
	display: none !important
}

.swiper-pagination-bullet-active {
	opacity: var(--swiper-pagination-bullet-opacity, 1);
	background: var(--swiper-pagination-color, var(--swiper-theme-color))
}

.swiper-vertical>.swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
	right: var(--swiper-pagination-right, 8px);
	left: var(--swiper-pagination-left, auto);
	top: 50%;
	transform: translate3d(0, -50%, 0)
}

.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet {
	margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
	display: block
}

.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
	top: 50%;
	transform: translateY(-50%);
	width: 8px
}

.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
	display: inline-block;
	transition: 200ms transform, 200ms top
}

.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px)
}

.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap
}

.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
	transition: 200ms transform, 200ms left
}

.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
	transition: 200ms transform, 200ms right
}

.swiper-pagination-fraction {
	color: var(--swiper-pagination-fraction-color, inherit)
}

.swiper-pagination-progressbar {
	background: var(--swiper-pagination-progressbar-bg-color, rgb(0 0 0 / .25));
	position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
	background: var(--swiper-pagination-color, var(--swiper-theme-color));
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	transform: scale(0);
	transform-origin: left top
}

.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
	transform-origin: right top
}

.swiper-horizontal>.swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
	width: 100%;
	height: var(--swiper-pagination-progressbar-size, 4px);
	left: 0;
	top: 0
}

.swiper-vertical>.swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
	width: var(--swiper-pagination-progressbar-size, 4px);
	height: 100%;
	left: 0;
	top: 0
}

.swiper-pagination-lock {
	display: none
}

.swiper-scrollbar {
	border-radius: var(--swiper-scrollbar-border-radius, 10px);
	position: relative;
	touch-action: none;
	background: var(--swiper-scrollbar-bg-color, rgb(0 0 0 / .1))
}

.swiper-scrollbar-disabled>.swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-disabled {
	display: none !important
}

.swiper-horizontal>.swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {
	position: absolute;
	left: var(--swiper-scrollbar-sides-offset, 1%);
	bottom: var(--swiper-scrollbar-bottom, 4px);
	top: var(--swiper-scrollbar-top, auto);
	z-index: 50;
	height: var(--swiper-scrollbar-size, 4px);
	width: calc(100% - 2*var(--swiper-scrollbar-sides-offset, 1%))
}

.swiper-vertical>.swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-vertical {
	position: absolute;
	left: var(--swiper-scrollbar-left, auto);
	right: var(--swiper-scrollbar-right, 4px);
	top: var(--swiper-scrollbar-sides-offset, 1%);
	z-index: 50;
	width: var(--swiper-scrollbar-size, 4px);
	height: calc(100% - 2*var(--swiper-scrollbar-sides-offset, 1%))
}

.swiper-scrollbar-drag {
	height: 100%;
	width: 100%;
	position: relative;
	background: var(--swiper-scrollbar-drag-bg-color, rgb(0 0 0 / .5));
	border-radius: var(--swiper-scrollbar-border-radius, 10px);
	left: 0;
	top: 0
}

.swiper-scrollbar-cursor-drag {
	cursor: move
}

.swiper-scrollbar-lock {
	display: none
}

.swiper-zoom-container {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center
}

.swiper-zoom-container>img,
.swiper-zoom-container>svg,
.swiper-zoom-container>canvas {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain
}

.swiper-slide-zoomed {
	cursor: move;
	touch-action: none
}

.swiper .swiper-notification {
	position: absolute;
	left: 0;
	top: 0;
	pointer-events: none;
	opacity: 0;
	z-index: -1000
}

.swiper-free-mode>.swiper-wrapper {
	transition-timing-function: ease-out;
	margin: 0 auto
}

.swiper-grid>.swiper-wrapper {
	flex-wrap: wrap
}

.swiper-grid-column>.swiper-wrapper {
	flex-wrap: wrap;
	flex-direction: column
}

.swiper-fade.swiper-free-mode .swiper-slide {
	transition-timing-function: ease-out
}

.swiper-fade .swiper-slide {
	pointer-events: none;
	transition-property: opacity
}

.swiper-fade .swiper-slide .swiper-slide {
	pointer-events: none
}

.swiper-fade .swiper-slide-active {
	pointer-events: auto
}

.swiper-fade .swiper-slide-active .swiper-slide-active {
	pointer-events: auto
}

.swiper-cube {
	overflow: visible
}

.swiper-cube .swiper-slide {
	pointer-events: none;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 1;
	visibility: hidden;
	transform-origin: 0 0;
	width: 100%;
	height: 100%
}

.swiper-cube .swiper-slide .swiper-slide {
	pointer-events: none
}

.swiper-cube.swiper-rtl .swiper-slide {
	transform-origin: 100% 0
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
	pointer-events: auto
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-prev {
	pointer-events: auto;
	visibility: visible
}

.swiper-cube .swiper-cube-shadow {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	opacity: .6;
	z-index: 0
}

.swiper-cube .swiper-cube-shadow:before {
	content: "";
	background: rgb(4, 4, 4);
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	filter: blur(50px)
}

.swiper-cube .swiper-slide-next+.swiper-slide {
	pointer-events: auto;
	visibility: visible
}

.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right {
	z-index: 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.swiper-flip {
	overflow: visible
}

.swiper-flip .swiper-slide {
	pointer-events: none;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 1
}

.swiper-flip .swiper-slide .swiper-slide {
	pointer-events: none
}

.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
	pointer-events: auto
}

.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right {
	z-index: 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.swiper-creative .swiper-slide {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	overflow: hidden;
	transition-property: transform, opacity, height
}

.swiper-cards {
	overflow: visible
}

.swiper-cards .swiper-slide {
	transform-origin: center bottom;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	overflow: hidden
}

/* =========================================================
   THEME FOUNDATION / GLOBAL UI
========================================================= */
:root {
	color-scheme: dark;
	--icon-size: 20px;
	--foreground-color: rgb(255, 255, 255)
}

html,
body {
	background-color: rgb(7, 12, 24);
	font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
	color: rgb(255, 255, 255)
}

#pageInfo {
	display: none;
	visibility: hidden;
	position: absolute;
	left: -1000px;
	top: -1000px
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
	font-family: "Aeonik", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif
}

.icon {
	width: var(--icon-size);
	height: var(--icon-size);
	margin: 0
}

.icon.spin {
	animation: icon-spin 2s infinite linear
}

a {
	color: rgb(107, 200, 255);
	transition: .14s ease;
	text-decoration: none
}

a:hover {
	color: rgb(104, 150, 255)
}

@keyframes icon-spin {
	0% {
		transform: rotate(0deg)
	}

	100% {
		transform: rotate(360deg)
	}
}

.btn {
	display: inline-flex;
	padding: 11px 25px;
	align-items: center;
	gap: 10px;
	border-radius: 100px;
	font-weight: 500;
	line-height: 30px;
	letter-spacing: -.14px;
	white-space: nowrap
}

.btn .icon {
	width: 20px;
	height: 20px
}

.btn-full,
.btn-block,
.btn-100 {
	width: 100%;
	display: flex;
	justify-content: center
}

.btn-norounded {
	border-radius: 15px
}

.btn-sm,
.btn-group-sm>.btn {
	padding: 8px 12px
}

.btn-md {
	padding: 9px 16px;
	min-height: 50px
}

.btn-primary {
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(397.75% 81.29% at 109.6% 34.26%, rgb(4, 59, 255) 0%, rgb(7, 63, 255) 99.99%, rgb(4, 60, 255) 100%), rgb(5, 60, 255);
	box-shadow: 0 1.182px 2.365px 0 rgb(1 57 255 / .88), 0 0 0 1.182px rgb(5, 60, 255);
	color: rgb(255, 255, 255)
}

.btn-primary:hover {
	background: radial-gradient(397.75% 81.29% at 109.6% 34.26%, rgb(4, 59, 255) 0%, rgb(7, 63, 255) 99.99%, rgb(4, 60, 255) 100%), rgb(5, 60, 255);
	border-color: rgb(255 255 255 / .25)
}

.btn-secondary {
	border: 1px solid rgb(255 255 255 / .04);
	background: rgb(5 10 25 / .4);
	box-shadow: 0 0 0 2px rgb(5 10 25 / .25);
	color: rgb(255, 255, 255)
}

.btn-secondary:hover {
	background: rgb(5 10 25 / .6);
	border-color: rgb(255 255 255 / .12)
}

.btn-orange {
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(244 86 51 / .93) 0%, rgba(255, 255, 255, 0) 100%), rgb(244, 89, 54);
	box-shadow: 0 0 3px 0 rgb(244, 89, 54), 0 0 0 1.182px rgb(244, 89, 54);
	color: rgb(255, 255, 255)
}

.btn-orange:hover {
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(244 86 51 / .93) 0%, rgba(255, 255, 255, 0) 100%), rgb(244, 89, 54);
	border-color: rgb(255 255 255 / .25)
}

.label-main {
	border-radius: 100px;
	display: inline-flex;
	padding: 1px;
	overflow: hidden;
	position: relative;
	background: radial-gradient(77.87% 74.89% at 99.57% 106.76%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), rgb(8, 14, 27)
}

.label-main--glow {
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background-color: rgb(5, 61, 255);
	filter: blur(20px);
	-webkit-filter: blur(20px);
	position: absolute;
	z-index: 5;
	transform: scale(0) translate(-50%, -50%)
}

.label-main--content {
	position: relative;
	z-index: 10;
	background: radial-gradient(77.87% 74.89% at 99.57% 106.76%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), rgb(8, 14, 27);
	border-radius: 100px;
	padding: 6px 18px 6px 6px;
	display: flex;
	align-items: center;
	gap: 16px;
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: 14.4px;
	letter-spacing: -.28px
}

.label-main--content>.icon {
	--icon-size: 30px;
	border-radius: 50%;
	border: 1px solid rgb(255 255 255 / .1);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(32, 82, 255) 0%, rgb(4, 60, 255) 100%), rgb(1 179 255 / .2);
	box-shadow: 0 1.182px 2.365px 0 rgb(1 57 255 / .88), 0 0 0 1.182px rgb(5, 60, 255);
	padding: 3px;
	color: rgb(255, 255, 255)
}

.section-title {
	--title-width: 100%;
	--text-width: 764px;
	--section-width: 100%;
	display: flex;
	justify-content: center;
	text-align: center;
	position: relative
}

.section-title::before {
	content: "";
	max-width: 600px;
	width: 100%;
	height: calc(100% + 20px);
	background: radial-gradient(50% 50% at 50% 50%, rgb(25, 75, 255) 0%, rgba(255, 255, 255, 0) 100%);
	opacity: .1;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%)
}

.section-title--content {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: var(--section-width);
	flex-direction: column;
	gap: 30px;
	z-index: 2
}

.section-title--title {
	font-size: 40px;
	font-weight: 500;
	line-height: 45px;
	letter-spacing: -.8px;
	margin: 0;
	width: 100%;
	max-width: var(--title-width);
	opacity: 0;
	transform: scale(1.2);
	transition: all .5s ease
}

.section-title--title span {
	background: linear-gradient(180deg, rgb(5, 61, 255) 0%, rgb(4, 29, 255) 50%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: rgba(255, 255, 255, 0)
}

@media(max-width:767.98px) {
	.section-title--title {
		font-size: 34px;
		line-height: 40px
	}
}

.section-title--text {
	color: rgb(127, 139, 164);
	font-size: 16px;
	font-weight: 500;
	line-height: 160%;
	letter-spacing: -.32px;
	width: 100%;
	max-width: var(--text-width);
	opacity: 0;
	transform: translateY(20px);
	transition: all .5s ease;
	transition-delay: .2s
}

@media(max-width:767.98px) {
	.section-title--text {
		font-size: 15px;
		font-weight: 400
	}
}

.section-title .label-main {
	transform: translateY(-20px);
	opacity: 0;
	transition: all .5s ease;
	transition-delay: .2s
}

.section-title.active .label-main {
	opacity: 1;
	transform: scale(1)
}

.section-title.active .section-title--title {
	opacity: 1;
	transform: scale(1)
}

.section-title.active .section-title--text {
	opacity: 1;
	transform: translateY(0)
}

.card {
	border-radius: 15px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30);
	color: rgb(255, 255, 255)
}

.card.not-found .card-body {
	padding: 50px 30px;
	display: flex;
	flex-direction: column;
	gap: 30px;
	align-items: center;
	text-align: center
}

.card.not-found .card-body .image {
	user-select: none;
	pointer-events: none
}

.card.not-found .card-body .image img {
	width: 150px;
	height: 150px
}

.card.not-found .card-body .title {
	font-size: 34px;
	font-weight: 500;
	line-height: 40px;
	letter-spacing: -.68px
}

.card.not-found .card-body .description {
	font-size: 16px;
	font-weight: 500;
	line-height: 160%;
	letter-spacing: -.32px;
	opacity: .6
}

.nav {
	position: relative;
	display: inline-flex;
	flex-wrap: nowrap;
	gap: 2px;
	max-width: 100%;
	overflow-x: auto;
	align-items: center;
	list-style: none;
	padding: 9px;
	margin: 0;
	border-radius: 100px;
	border: 1px solid rgb(255 255 255 / .05);
	background: radial-gradient(167.49% 151.54% at 70.71% 145.38%, rgb(15, 22, 48) 0%, rgb(8, 15, 29) 100%), rgb(9, 16, 34);
	padding: 9px
}

.nav::-webkit-scrollbar {
	height: 2px
}

.nav-link {
	cursor: pointer;
	display: flex;
	padding: 12px 14px;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	gap: 10px;
	outline: none;
	border-radius: 100px;
	border: 1px solid rgba(255, 255, 255, 0);
	background-color: rgba(255, 255, 255, 0);
	color: rgb(255, 255, 255);
	font-size: 15px;
	font-weight: 500;
	line-height: 160%;
	letter-spacing: -.3px;
	white-space: nowrap
}

.nav-link .icon {
	--icon-size: 22px
}

.nav-link:hover {
	background-color: rgb(15, 22, 48);
	color: rgb(255, 255, 255)
}

.nav-link:focus,
.nav-link:active {
	box-shadow: var(--focus-shadow);
	color: var(--body-text)
}

.nav-link.active {
	border-radius: 100px;
	border: 1px solid var(--Button-Button_Stroke, rgb(255 255 255 / .15));
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3px 0 rgb(5, 60, 255), 0 0 0 1.182px rgb(5, 60, 255)
}

.grindup-dropdown {
	position: relative;
	width: 100%
}

.grindup-dropdown [data-grindup=dropdown-button] {
	position: relative;
	z-index: 1000
}

.grindup-dropdown[data-active=true] .grindup-dropdown__box {
	display: block;
	animation: grindup-dropdown-active .3s cubic-bezier(.25, .1, .15, 1.34) forwards
}

.grindup-dropdown__item {
	text-decoration: none;
	cursor: pointer;
	display: flex;
	width: 100%;
	align-items: center;
	padding: 15px;
	gap: 15px;
	transition: .14s ease;
	position: relative;
	overflow: hidden
}

.grindup-dropdown__item .on-hover {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 1;
	transform: translateY(100%);
	background-color: rgb(21, 34, 69);
	opacity: 0;
	transition: .14s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 10px;
	font-size: 16px;
	color: rgb(255, 255, 255);
	overflow: hidden
}

.grindup-dropdown__item:hover {
	background-color: var(--card-bg-color)
}

.grindup-dropdown__item:hover .on-hover {
	transform: translateY(0);
	opacity: 1
}

.grindup-dropdown__item .icon-box {
	--icon-box-size: 24px;
	--icon-box-font-size: 20px;
	flex: 0 0 var(--icon-box-size)
}

.grindup-dropdown__item .title,
.grindup-dropdown__item .value {
	white-space: nowrap
}

.grindup-dropdown__item .title {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -.42px
}

.grindup-dropdown__item .value {
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -.39px
}

.grindup-dropdown__item .content {
	flex: 1;
	padding-right: 10px
}

.grindup-dropdown__box {
	overflow: hidden;
	display: none;
	float: left;
	border: 1px solid rgb(21, 34, 69);
	box-shadow: 0 15.11px 59.06px 0 rgb(0 0 0 / .09);
	background-color: rgb(7, 12, 24);
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	border-radius: 15px;
	min-width: 100%;
	width: auto;
	z-index: 999;
	max-height: 400px;
	overflow-y: auto
}

.grindup-dropdown__box::-webkit-scrollbar {
	width: 4px
}

.grindup-dropdown__box::-webkit-scrollbar-track {
	background: var(--card-bg-inner-color, rgb(12, 17, 25))
}

.grindup-dropdown__box::-webkit-scrollbar-thumb {
	background: var(--stroke-color, rgb(235, 242, 250));
	border-radius: 10px
}

.grindup-dropdown__box.grindup-dropdown__box--right {
	left: auto;
	right: 0
}

.grindup-dropdown__box .divider {
	margin: 0;
	padding: 0;
	border: none;
	border-bottom: 1px solid rgb(21, 34, 69)
}

.grindup-dropdown__box .list {
	padding: 5px;
	margin: 0;
	gap: 5px;
	list-style: none;
	display: flex;
	flex-direction: column
}

.grindup-dropdown__box .list-link {
	min-height: 40px;
	border-radius: 10px;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 10px;
	padding: 10px;
	width: 100%;
	white-space: nowrap;
	text-decoration: none;
	transition: .14s ease all;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -.42px;
	white-space: nowrap;
	color: rgb(255, 255, 255)
}

.grindup-dropdown__box .list-link .icon {
	font-size: 16px
}

.grindup-dropdown__box .list-link:hover {
	background-color: rgb(21, 34, 69)
}

.grindup-dropdown__box .list-link.active {
	background-color: rgb(21, 34, 69)
}

.grindup-dropdown__box .list-footer {
	background-color: var(--card-bg-inner-color)
}

.grindup-dropdown__box .list-footer .list-link {
	border: none;
	background: rgba(255, 255, 255, 0)
}

@keyframes grindup-dropdown-active {
	0% {
		opacity: 0;
		transform: translateY(-50px);
		max-height: 0
	}

	100% {
		opacity: 1;
		transform: translateY(0) skewY(0)
	}
}

.form-label,
.form-group label,
label {
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -.42px;
	margin-bottom: 14px
}

.form-control,
.form-select {
	border: 1px solid rgb(255 255 255 / .05);
	background: radial-gradient(167.49% 151.54% at 70.71% 145.38%, rgb(15, 22, 48) 0%, rgb(8, 15, 29) 100%), rgb(14, 22, 38);
	color: rgb(255, 255, 255);
	width: 100%;
	display: block;
	font-size: 16px;
	font-weight: 500;
	line-height: 19px;
	letter-spacing: -.42px;
	min-height: 55px;
	padding: 10px 20px
}

.form-control.hidden,
.form-select.hidden {
	display: none
}

.form-control::placeholder,
.form-select::placeholder {
	color: rgb(106, 115, 136)
}

/* =========================================================
   GRINDUP FORM FOCUS SYSTEM
========================================================= */
[data-page]:not(.gu-auth-page) .form-control,
[data-page]:not(.gu-auth-page) .form-select,
[data-page]:not(.gu-auth-page) .filter-row .grindup-dropdown__btn,
[data-page]:not(.gu-auth-page) .filter-row--search .search-box,
[data-page]:not(.gu-auth-page) .actulus-selectbox_label,
[data-page]:not(.gu-auth-page) .actulus-selectbox_search {
	transition: var(--gu-focus-transition)
}

.form-control:is(:focus, :active),
.form-select:is(:focus, :active),
[data-page]:not(.gu-auth-page) .filter-row .grindup-dropdown__btn:is(:focus, :active),
[data-page]:not(.gu-auth-page) .filter-row .grindup-dropdown[data-active=true] .grindup-dropdown__btn,
[data-page]:not(.gu-auth-page) .filter-row--search .search-box:focus-within,
[data-page]:not(.gu-auth-page) .actulus-selectbox_label:is(:focus, :active),
[data-page]:not(.gu-auth-page) .actulus-selectbox.actulus-selectbox_open .actulus-selectbox_label,
[data-page]:not(.gu-auth-page) .actulus-selectbox_search:is(:focus, :active, :focus-within) {
	border-color: var(--gu-focus-border);
	box-shadow: var(--gu-focus-shadow);
	outline: var(--gu-focus-outline)
}

.form-control:is(:focus, :active),
.form-select:is(:focus, :active) {
	color: rgb(255, 255, 255)
}

.form-control:disabled,
.form-control:disabled:hover,
.form-control:disabled:focus,
.form-control:disabled:active,
.form-control .disabled,
.form-control .disabled:hover,
.form-control .disabled:focus,
.form-control .disabled:active,
.form-select:disabled,
.form-select:disabled:hover,
.form-select:disabled:focus,
.form-select:disabled:active,
.form-select .disabled,
.form-select .disabled:hover,
.form-select .disabled:focus,
.form-select .disabled:active {
	cursor: not-allowed
}

.form-control:has(.form-control--input),
.form-select:has(.form-control--input) {
	padding: 0
}

.fc-2 {
	border-radius: 15px;
	border: 1px solid rgb(18, 26, 44);
	background: rgb(13, 20, 33)
}

.fc-2:focus,
.fc-2:active,
.fc-2:focus-within {
	background: rgb(13, 20, 33);
	border-color: rgb(5, 60, 255);
	box-shadow: 0 0 0 4px rgb(1 57 255 / .2)
}

.fc-2 .form-control--switch {
	border-radius: 0 15px 15px 0
}

.form-control--password {
	display: flex
}

.form-control--switch {
	height: 53px;
	flex: 0 0 53px;
	border-radius: 0 28px 28px 0;
	padding-right: 8px;
	border: none;
	border-left: 1px solid rgb(255 255 255 / .05);
	background: rgba(255, 255, 255, 0);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: .2s ease
}

.form-control--switch:hover {
	background: rgb(255 255 255 / .05)
}

.form-control--input {
	border: none;
	background: none;
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 19px;
	letter-spacing: -.42px;
	min-height: 55px;
	padding: 10px 20px;
	flex: 1
}

.form-control--input::placeholder {
	color: rgb(106, 115, 136)
}

div.form-control,
span.form-control {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px
}

.form-select:not([multiple]),
select.form-control:not([multiple]),
.actulus-selectbox_label.form-control:not([multiple]) {
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 width=%2718%27 height=%2718%27%3E%3Cpath d=%27M11.9997 13.1714L16.9495 8.22168L18.3637 9.63589L11.9997 15.9999L5.63574 9.63589L7.04996 8.22168L11.9997 13.1714Z%27 fill=%27rgba%28255,255,255,1%29%27%3E%3C/path%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 20px center;
	background-size: 18px
}

.form-select[multiple]::-webkit-scrollbar,
select.form-control[multiple]::-webkit-scrollbar,
.actulus-selectbox_label.form-control[multiple]::-webkit-scrollbar {
	width: 8px;
	height: 8px
}

.form-group {
	margin-bottom: 30px
}

.form-text {
	display: block;
	margin-top: 9px;
	padding: 0 20px 0
}

.form-group.instruction {
	padding: 20px;
	border-radius: 15px;
	border: 1px solid var(--stroke-color);
	background: var(--card-bg-color);
	box-shadow: 0 42px 80px 0 rgb(10 39 83 / .05)
}

.checkbox {
	margin-bottom: 20px;
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer
}

.checkbox label {
	margin-bottom: 0
}

.checkbox input {
	display: none
}

.checkbox-icon {
	content: "";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 5px;
	border: 2px solid rgb(46, 48, 55);
	background-color: var(--card-bg-inner-color);
	box-shadow: none;
	margin-right: 10px;
	vertical-align: middle;
	cursor: pointer;
	position: relative;
	overflow: hidden
}

.checkbox-icon::before {
	content: "";
	position: absolute;
	width: 200%;
	height: 200%;
	border-radius: 50%;
	bottom: 50%;
	left: 50%;
	transform: translate(-50%, 140%);
	background-color: var(--main-color);
	transition: all .2s ease-in-out
}

.checkbox-icon::after {
	content: "";
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M10.0007 15.1709L19.1931 5.97852L20.6073 7.39273L10.0007 17.9993L3.63672 11.6354L5.05093 10.2212L10.0007 15.1709Z%27 fill=%27rgba%28255,255,255,1%29%27%3E%3C/path%3E%3C/svg%3E");
	transform: scale(0);
	width: 18px;
	height: 18px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	transition: .3s ease;
	transition-delay: .1s
}

.checkbox-text {
	color: var(--text-disabled);
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal
}

.checkbox input:checked~.checkbox-icon {
	border-color: var(--main-color)
}

.checkbox input:checked~.checkbox-icon::before {
	transform: translate(-50%, 50%)
}

.checkbox input:checked~.checkbox-icon::after {
	transform: scale(1)
}

.badge {
	font-size: 13px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	display: flex;
	padding: 10px 18px 10px 13px;
	justify-content: center;
	align-items: center;
	gap: 10px;
	display: flex;
	align-items: center;
	gap: 10px;
	border-radius: 19px;
	border: none
}

.alert {
	padding: 14px 16px;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 21px;
	letter-spacing: -.28px;
	border-radius: 24px;
	border: none
}

.alert:has(.alert-icon) {
	padding: 6px 16px 6px 6px;
	display: flex;
	align-items: center;
	gap: 15px
}

.alert .alert-icon {
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	font-size: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background-color: rgb(255, 255, 255)
}

.alert.alert-dismissible {
	padding-right: 50px;
	position: relative
}

.alert.alert-dismissible .close {
	position: absolute;
	top: 10px;
	right: 20px;
	cursor: pointer;
	border: none;
	box-shadow: none;
	background-color: rgba(255, 255, 255, 0);
	opacity: .6;
	transition: .14s ease;
	font-size: 20px;
	z-index: 20;
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 0;
	color: rgba(255, 255, 255, 0)
}

.alert.alert-dismissible .close::before {
	content: "x";
	background-image: url("data:image/svg+xml,<svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url%28%23clip0_567_2862%29\"><path d=\"M20 16.445L32.445 4L36 7.555L23.555 20L36 32.445L32.445 36L20 23.555L7.555 36L4 32.445L16.445 20L4 7.555L7.555 4L20 16.445Z\" fill=\"rgb(255, 255, 255)\"/></g><defs><clipPath id=\"clip0_567_2862\"><rect width=\"40\" height=\"40\" rx=\"15\" fill=\"rgb(255, 255, 255)\"/></clipPath></defs></svg>");
	width: 12px;
	height: 12px;
	display: block;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
	color: rgb(255, 255, 255)
}

.alert.alert-dismissible .close:hover {
	opacity: 1
}

.alert.alert-dismissible .close:focus,
.alert.alert-dismissible .close:active {
	outline: none;
	box-shadow: 0 0 0 .25rem rgb(13 110 253 / .25)
}

.badge-primary {
	color: rgb(5, 60, 255);
	background: rgb(1 57 255 / .1019607843)
}

.alert-primary {
	color: rgb(5, 60, 255);
	background: rgb(1 57 255 / .1019607843)
}

.badge-info {
	color: rgb(5, 180, 255);
	background: rgb(1 179 255 / .1019607843)
}

.alert-info {
	color: rgb(5, 180, 255);
	background: rgb(1 179 255 / .1019607843)
}

.badge-success {
	color: rgb(4, 221, 156);
	background: rgb(0 220 154 / .1019607843)
}

.alert-success {
	color: rgb(4, 221, 156);
	background: rgb(0 220 154 / .1019607843)
}

.badge-danger {
	color: rgb(255, 55, 55);
	background: rgb(255 52 52 / .1019607843)
}

.alert-danger {
	color: rgb(255, 55, 55);
	background: rgb(255 52 52 / .1019607843)
}

.badge-warning {
	color: rgb(255, 151, 55);
	background: rgb(255 149 52 / .1019607843)
}

.alert-warning {
	color: rgb(255, 151, 55);
	background: rgb(255 149 52 / .1019607843)
}

.grindup-tab {
	display: none
}

.grindup-tab.active {
	display: block
}

.modal.fade {
	opacity: 1;
}

.modal-dialog {
	position: relative;
	width: auto;
	margin: var(--bs-modal-margin);
	pointer-events: none;
}

.modal-dialog.modal-dialog-centered {
	display: flex;
	align-items: center;
	min-height: calc(100% - var(--bs-modal-margin) * 2);
}

.modal-content {
	width: 100%;
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30);
}

@media (min-width: 576px) {
	.modal-dialog {
		max-width: var(--bs-modal-width);
		margin-right: auto;
		margin-left: auto;
	}
}

.modal-content .close {
  	margin-left:auto;
  	position:static;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width: 52px;
	height: 52px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30);
	outline: none;
	border-radius: 50%;
	font-size: 24px
}

@media(max-width:767.98px) {
	.modal-content .close {
		border: none
	}
}

.modal-footer {
	border-color: rgb(13, 21, 41)
}

.modal-header {
	border-color: rgb(13, 21, 41)
}

.modal-backdrop {
	background-color: rgb(0 0 0 / .5)
}

.modal-backdrop.fade {
	opacity: 1
}

.tooltip {
	position: absolute;
	z-index: 1070;
	display: block;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	line-break: auto;
	line-height: 1.42857143;
	text-align: left;
	text-align: start;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	white-space: normal;
	word-break: normal;
	word-spacing: normal;
	word-wrap: normal;
	font-size: 13px;
	opacity: 0;
	filter: alpha(opacity=0)
}

.tooltip.in {
	opacity: .9;
	filter: alpha(opacity=90)
}

.tooltip.top {
	margin-top: -3px;
	padding: 5px 0
}

.tooltip.right {
	margin-left: 3px;
	padding: 0 5px
}

.tooltip.bottom {
	margin-top: 3px;
	padding: 5px 0
}

.tooltip.left {
	margin-left: -3px;
	padding: 0 5px
}

.tooltip-inner {
	max-width: 200px;
	padding: 3px 8px;
	color: rgb(255, 255, 255);
	text-align: center;
	background-color: rgb(4, 4, 4);
	border-radius: 4px
}

.tooltip-arrow {
	position: absolute;
	width: 0;
	height: 0;
	border-color: rgba(255, 255, 255, 0);
	border-style: solid
}

.tooltip.top .tooltip-arrow {
	bottom: 0;
	left: 50%;
	margin-left: -5px;
	border-width: 5px 5px 0;
	border-top-color: rgb(4, 4, 4)
}

.tooltip.top-left .tooltip-arrow {
	bottom: 0;
	right: 5px;
	margin-bottom: -5px;
	border-width: 5px 5px 0;
	border-top-color: rgb(4, 4, 4)
}

.tooltip.top-right .tooltip-arrow {
	bottom: 0;
	left: 5px;
	margin-bottom: -5px;
	border-width: 5px 5px 0;
	border-top-color: rgb(4, 4, 4)
}

.tooltip.right .tooltip-arrow {
	top: 50%;
	left: 0;
	margin-top: -5px;
	border-width: 5px 5px 5px 0;
	border-right-color: rgb(4, 4, 4)
}

.tooltip.left .tooltip-arrow {
	top: 50%;
	right: 0;
	margin-top: -5px;
	border-width: 5px 0 5px 5px;
	border-left-color: rgb(4, 4, 4)
}

.tooltip.bottom .tooltip-arrow {
	top: 0;
	left: 50%;
	margin-left: -5px;
	border-width: 0 5px 5px;
	border-bottom-color: rgb(4, 4, 4)
}

.tooltip.bottom-left .tooltip-arrow {
	top: 0;
	right: 5px;
	margin-top: -5px;
	border-width: 0 5px 5px;
	border-bottom-color: rgb(4, 4, 4)
}

.tooltip.bottom-right .tooltip-arrow {
	top: 0;
	left: 5px;
	margin-top: -5px;
	border-width: 0 5px 5px;
	border-bottom-color: rgb(4, 4, 4)
}

[data-grindup=copy][data-copy-icon] {
	position: relative;
	cursor: pointer
}

[data-grindup=copy][data-copy-icon]:hover::before {
	opacity: 1;
	transform: translateY(-50%) translateX(0)
}

[data-grindup=copy][data-copy-icon]::before {
	content: "";
	position: absolute;
	width: 24px;
	height: 24px;
	left: -30px;
	top: 50%;
	transform: translateY(-50%) translateX(30%);
	background: url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M6.9998 6V3C6.9998 2.44772 7.44752 2 7.9998 2H19.9998C20.5521 2 20.9998 2.44772 20.9998 3V17C20.9998 17.5523 20.5521 18 19.9998 18H16.9998V20.9991C16.9998 21.5519 16.5499 22 15.993 22H4.00666C3.45059 22 3 21.5554 3 20.9991L3.0026 7.00087C3.0027 6.44811 3.45264 6 4.00942 6H6.9998ZM8.9998 6H16.9998V16H18.9998V4H8.9998V6Z\"></path></svg>");
	background-repeat: no-repeat;
	background-size: 18px;
	background-position: center;
	opacity: 0;
	transition: .14s ease
}

.pagination {
	display: inline-flex;
	gap: 2px;
	padding-left: 0;
	margin: 0 0
}

.pagination-wrapper {
	padding-top: 60px;
	display: flex;
	justify-content: center
}

.pagination>li {
	display: inline
}

.pagination>li>a,
.pagination>li>span {
	position: relative;
	float: left;
	padding: 10px 12px;
	min-width: 42px;
	line-height: 1.42857143;
	color: var(--body-text);
	text-decoration: none;
	text-align: center;
	border-radius: 10px
}

.pagination>li>a:hover,
.pagination>li>span:hover,
.pagination>li>a:focus,
.pagination>li>span:focus {
	z-index: 2;
	color: rgb(38, 85, 126);
	background-color: rgb(238, 238, 238);
	border-color: rgb(222, 222, 222)
}

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
	z-index: 3;
	color: rgb(255, 255, 255);
	cursor: default;
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255)
}

.pagination>.disabled>span,
.pagination>.disabled>span:hover,
.pagination>.disabled>span:focus,
.pagination>.disabled>a,
.pagination>.disabled>a:hover,
.pagination>.disabled>a:focus {
	color: rgb(121, 121, 121);
	cursor: not-allowed;
	background-color: rgb(255, 255, 255);
	border-color: rgb(222, 222, 222)
}

.pagination-sm>li>a,
.pagination-sm>li>span {
	padding: 5px 10px;
	font-size: 12px;
	line-height: 1.5
}

.toast {
	position: fixed;
	top: 30px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 99999;
	transition: .4s ease
}

.toast.active .toast-box {
	transform: translateY(0)
}

.toast.active .toast-icon {
	animation-delay: .4s;
	animation: toast-animateIcon .7s ease;
	transform: scale(1)
}

.toast-box {
	background-color: var(--primary---blue-50, rgb(177, 218, 255));
	border: 1px solid var(--primary---blue-300, rgb(87, 173, 255));
	border-radius: 20px;
	box-shadow: 0 0 10px 0 rgb(255 255 255 / .1);
	padding: 10px 20px;
	display: flex;
	align-items: center;
	gap: 15px;
	max-width: 520px;
	width: 100%;
	transform: translateY(calc(-100% - 30px));
	transition: .4s ease;
	color: var(--primary---blue-600, rgb(4, 121, 232))
}

.toast-close {
	border: none;
	outline: none;
	color: var(--primary---blue-400, rgb(54, 157, 255));
	background-color: rgba(255, 255, 255, 0);
	cursor: pointer;
	font-size: 20px;
	opacity: .6;
	transition: .14s ease;
	padding: 0;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center
}

.toast-close:hover {
	opacity: 1
}

.toast-icon {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(0)
}

.toast-text {
	font-size: 16px;
	font-weight: 400
}

@keyframes toast-animateIcon {
	0% {
		transform: scale(0)
	}

	50% {
		transform: scale(1.4)
	}

	100% {
		transform: scale(1)
	}
}

body[data-layout=guest] {
	--header-height: 74px;
	--header-offset: 20px;
	--header-safe: calc(var(--header-height) + var(--header-offset));
	max-width: 100%;
	overflow-x: hidden
}

body[data-layout=guest] .container {
	max-width: calc(1158px + 1.5rem)
}

body[data-layout=guest] .home-section {
	padding: 30px 0;
	width: 100%;
	overflow: hidden
}

@media(min-width:576px) {
	body[data-layout=guest] .home-section {
		padding: 40px 0
	}
}

@media(min-width:768px) {
	body[data-layout=guest] .home-section {
		padding: 60px 0
	}
}

@media(min-width:992px) {
	body[data-layout=guest] .home-section {
		padding: 100px 0
	}
}

body[data-layout=guest] main:not(:has([data-page=signin])) {
	margin-top: var(--header-safe);
	padding-top: 80px
}

body[data-layout=guest] .language-dropdown {
	bottom: 20px;
	right: 20px
}

body[data-layout=guest] .language-dropdown .flag {
	width: 28px;
	height: 28px;
	border-radius: 50%
}

body[data-layout=guest] .language-dropdown .lang-flag {
	width: 28px;
	height: 28px;
	border-radius: 50%
}

body[data-layout=guest] .language-dropdown .grindup-dropdown [data-grindup=dropdown-button] {
	background-color: rgb(11, 17, 34);
	padding: 4px
}

body[data-layout=guest] .header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1030;
	position: fixed;
	padding-top: var(--header-offset)
}

body[data-layout=guest] .header-box {
	width: 100%;
	border-radius: 100px;
	border: 1px solid rgb(11, 22, 47);
	background: radial-gradient(77.87% 74.89% at 99.57% 106.76%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), rgb(8, 14, 27);
	backdrop-filter: blur(50px);
	-webkit-backdrop-filter: blur(50px);
	height: var(--header-height);
	padding: 10px 10px 10px 30px;
	display: flex;
	align-items: center;
	gap: 20px
}

body[data-layout=guest] .header-menu {
	gap: 20px;
	align-items: center;
	justify-content: space-between;
	flex: 1;
	display: none
}

body[data-layout=guest] .header-menu--btn {
	margin-left: auto;
	display: flex
}

body[data-layout=guest] .header-menu--btn .btn {
	height: 48px;
	width: 48px;
	padding: 0;
	align-items: center;
	justify-content: center
}

@media(min-width:992px) {
	body[data-layout=guest] .header-menu--btn {
		display: none
	}
}

@media(min-width:992px) {
	body[data-layout=guest] .header-menu {
		display: flex
	}
}

body[data-layout=guest] .header-menu ul {
	display: flex;
	height: 23px;
	justify-content: flex-end;
	align-items: center;
	gap: 40px;
	list-style: none;
	padding: 0;
	margin: 0
}

body[data-layout=guest] .header-menu ul li a {
	font-size: 14px;
	font-weight: 500;
	line-height: 24px;
	text-decoration: none;
	color: rgb(255, 255, 255);
	transition: .2s ease all
}

body[data-layout=guest] .header-menu ul li a:hover {
	color: rgb(255, 216, 4)
}

body[data-layout=guest] .header-menu--buttons {
	display: flex;
	align-items: center;
	gap: 6px
}

@media(max-width:991.98px) {
	body[data-layout=guest] .header-menu {
		display: none;
		position: fixed;
		top: var(--header-height);
		left: 0;
		right: 0;
		z-index: 9999;
		border-radius: 20px;
		border: 1px solid rgb(11, 22, 47);
		background: radial-gradient(77.87% 74.89% at 99.57% 106.76%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), rgb(8, 14, 27);
		padding: 20px;
		height: auto
	}

	@keyframes menuActive {
		0% {
			transform: translateY(40px);
			opacity: 0
		}

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

	body[data-layout=guest] .header-menu.active {
		display: block;
		animation: menuActive .2s ease
	}

	body[data-layout=guest] .header-menu ul {
		flex-direction: column;
		height: auto;
		gap: 10px;
		align-items: flex-start;
		padding: 0 14px 24px
	}

	body[data-layout=guest] .header-menu ul li a {
		font-size: 22px;
		line-height: 32px
	}

	body[data-layout=guest] .header-menu .header-menu--buttons {
		width: 100%;
		display: flex;
		flex-direction: column;
		gap: 10px
	}

	body[data-layout=guest] .header-menu .header-menu--buttons>.btn {
		flex: 1;
		width: 100%;
		justify-content: center
	}
}

body[data-layout=guest] .footer {
	display: flex;
	flex-direction: column;
	gap: 0;
	position: relative;
	z-index: 20;
	border-top: 1px solid rgb(13, 21, 41)
}

body[data-layout=guest] .footer-body {
	padding: 70px 0 60px
}

body[data-layout=guest] .footer-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	margin-bottom: 30px
}

@media(min-width:992px) {
	body[data-layout=guest] .footer-content {
		max-width: 320px;
		margin-bottom: 0
	}
}

body[data-layout=guest] .footer-logo {
	margin-bottom: 0
}

body[data-layout=guest] .footer-description {
	color: rgb(94, 103, 122);
	font-size: 14px;
	font-weight: 500;
	line-height: 24px;
	margin-bottom: 0
}

body[data-layout=guest] .footer-email {
	display: flex;
	align-items: center;
	gap: 12px;
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	text-decoration: none
}

body[data-layout=guest] .footer-email .icon {
	--icon-size: 24px;
	color: rgb(255, 255, 255)
}

body[data-layout=guest] .footer-email .icon-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 100px;
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(32, 82, 255) 0%, rgb(4, 60, 255) 100%), rgb(239, 253, 255)
}

body[data-layout=guest] .footer-email .icon-wrapper>.icon {
	--icon-size: 20px
}

body[data-layout=guest] .footer-menu {
	padding: 0;
	margin: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 22px
}

body[data-layout=guest] .footer-menu--wrapper {
	display: flex;
	flex-direction: column;
	gap: 20px
}

body[data-layout=guest] .footer-menu--title {
	color: rgb(255, 255, 255);
	font-size: 15px;
	font-weight: 700;
	line-height: 150%;
	margin: 0
}

body[data-layout=guest] .footer-menu li>a {
	color: rgb(127, 139, 164);
	font-size: 14px;
	font-weight: 500;
	line-height: 16px;
	text-decoration: none;
	transition: .14s ease
}

body[data-layout=guest] .footer-menu li>a:hover {
	color: rgb(255, 255, 255)
}

body[data-layout=guest] .footer-bottom {
	border-top: 1px solid rgb(13, 21, 41);
	padding: 30px 0
}

body[data-layout=guest] .footer-bottom .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	flex-wrap: wrap
}

@media(max-width:767.98px) {
	body[data-layout=guest] .footer-bottom .container {
		flex-direction: column;
		align-items: center;
		text-align: center
	}
}

body[data-layout=guest] .footer-bottom .copyright {
	color: rgb(80, 87, 102);
	font-size: 15px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px
}

body[data-layout=guest] .footer-bottom .copyright a {
	color: rgb(255, 255, 255);
	text-decoration: none;
	transition: .14s ease
}

body[data-layout=guest] .footer-bottom .copyright a:hover {
	color: rgb(255, 255, 255)
}

body[data-layout=guest] .hero {
	padding-top: var(--header-safe);
	background: url(buraya bak);
	background-position: bottom center;
	background-size: cover;
	position: relative;
	width: 100%;
	overflow: hidden
}

body[data-layout=guest] .hero-particles {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: .4
}

body[data-layout=guest] .hero-body {
	padding: 100px 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	align-items: center;
	position: relative;
	z-index: 20
}

@media(max-width:767.98px) {
	body[data-layout=guest] .hero-body {
		padding: 40px 0
	}
}

body[data-layout=guest] .hero-body.active .hero-title--title {
	opacity: 1;
	transform: scale(1)
}

body[data-layout=guest] .hero-body.active .hero-title--subtitle {
	opacity: 1;
	transform: translateX(0)
}

body[data-layout=guest] .hero-body.active .label-main {
	opacity: 1;
	transform: scale(1)
}

body[data-layout=guest] .hero .label-main {
	transform: translateY(-20px);
	opacity: 0;
	transition: all .5s ease;
	transition-delay: .2s
}

body[data-layout=guest] .hero-title {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 30px;
	margin: 0 auto;
	max-width: 784px;
	width: 100%;
	text-align: center;
	margin-bottom: 46px
}

body[data-layout=guest] .hero-title--title {
	font-size: 65px;
	font-weight: 500;
	line-height: 70px;
	letter-spacing: -2px;
	color: rgb(255, 255, 255);
	margin: 0;
	opacity: 0;
	transform: scale(1.2);
	transition: all .5s ease
}

body[data-layout=guest] .hero-title--title span {
	background: linear-gradient(180deg, rgb(5, 61, 255) 0%, rgb(4, 29, 255) 50%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: rgba(255, 255, 255, 0)
}

@media(max-width:767.98px) {
	body[data-layout=guest] .hero-title--title {
		font-size: 38px;
		line-height: 50px;
		letter-spacing: 0
	}
}

body[data-layout=guest] .hero-title--subtitle {
	color: rgb(127, 139, 164);
	font-size: 18px;
	font-weight: 500;
	line-height: 160%;
	width: 100%;
	max-width: 714px;
	margin: 0;
	opacity: 0;
	transform: translateY(20px);
	transition: all .5s ease;
	transition-delay: .2s
}

@media(max-width:767.98px) {
	body[data-layout=guest] .hero-title--subtitle {
		font-size: 16px
	}
}

body[data-layout=guest] .hero--label-main {
	margin-bottom: 86px;
	transform: scale(.5);
	opacity: 0;
	transition: all .5s ease
}

body[data-layout=guest] .hero--label-main.active {
	transform: scale(1);
	opacity: 1
}

body[data-layout=guest] .hero--label-main .label-main--content {
	padding: 6px 6px 6px 10px
}

body[data-layout=guest] .hero--label-main .label-main--content>.icon {
	--icon-size: 44px;
	flex: 0 0 44px
}

body[data-layout=guest] .hero--label-main .btn {
	margin-left: 60px
}

@media(max-width:767.98px) {
	body[data-layout=guest] .hero--label-main .btn {
		margin-left: 0
	}
}

body[data-layout=guest] .hero-review {
	display: flex;
	gap: 15px;
	align-items: center
}

@media(max-width:767.98px) {
	body[data-layout=guest] .hero-review {
		flex-direction: column;
		gap: 14px
	}

	body[data-layout=guest] .hero-review .icon {
		display: none
	}
}

body[data-layout=guest] .hero-review img {
	user-select: none;
	pointer-events: none
}

body[data-layout=guest] .hero-review .icon {
	--icon-size: 28px;
	color: rgb(255, 147, 46)
}

body[data-layout=guest] .hero-review .text {
	color: rgb(71, 84, 111);
	font-size: 18px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: -.36px
}

body[data-layout=guest] .hero-review .text span {
	color: rgb(255, 255, 255)
}

body[data-layout=guest] .hero-bottom {
	overflow: hidden;
	position: relative;
	width: 100%;
	background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgb(8, 14, 27) 23.56%, rgb(8, 14, 27) 51.12%, rgb(8, 14, 27) 78.68%, rgba(255, 255, 255, 0) 100.23%);
	padding: 40px 0
}

@media(max-width:767.98px) {
	body[data-layout=guest] .hero-bottom {
		padding: 22px 0
	}
}

body[data-layout=guest] .hero-bottom::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	height: 1px;
	max-width: 1000px;
	width: 100%;
	background: linear-gradient(90deg, rgb(8, 14, 27) 0%, rgb(16, 25, 49) 53%, rgb(8, 14, 27) 100%)
}

body[data-layout=guest] .hero-bottom--marquee {
	position: relative;
	overflow: hidden
}

body[data-layout=guest] .hero-bottom--marquee::before,
body[data-layout=guest] .hero-bottom--marquee::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100px;
	height: 100%;
	background: linear-gradient(90deg, rgb(8, 14, 27) 0%, rgba(255, 255, 255, 0) 100%)
}

body[data-layout=guest] .hero-bottom--marquee::after {
	left: auto;
	right: 0;
	transform: scaleX(-1)
}

body[data-layout=guest] .section-first {
	padding-top: 120px;
	--gap: 30px;
	--first-width-sm: calc(100% - (var(--gap) / 2));
	--first-width-md: calc(100% - (var(--gap) / 2));
	--first-width-lg: calc(100% - (var(--gap) / 2));
	--first-width-xl: calc(100% - (var(--gap) / 2))
}

body[data-layout=guest] .section-first img {
	user-select: none;
	pointer-events: none;
	max-width: 100%;
	height: auto
}

body[data-layout=guest] .section-first .container {
	display: flex;
	flex-direction: column;
	gap: 68px
}

@media(min-width:768px) {
	body[data-layout=guest] .section-first {
		--first-width-sm: calc(50% - (var(--gap) / 2));
		--first-width-lg: calc(50% - (var(--gap) / 2))
	}
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first {
		--first-width-sm: calc(40% - (var(--gap) / 2));
		--first-width-md: calc(50% - (var(--gap) / 2));
		--first-width-lg: calc(60% - (var(--gap) / 2));
		--first-width-xl: calc(100% - (var(--gap) / 2))
	}
}

body[data-layout=guest] .section-first .first-cards {
	display: flex;
	flex-wrap: wrap;
	margin: calc(var(--gap)/2*-1);
	position: relative
}

body[data-layout=guest] .section-first .first-cards::before,
body[data-layout=guest] .section-first .first-cards::after {
	content: "";
	width: 582px;
	height: 162px;
	position: absolute;
	top: 500px;
	left: 50%;
	transform: translateX(-50%);
	filter: blur(108px);
	background: url(assets/shadow.svg);
	background-size: cover;
	z-index: 2;
	display: none
}

@media(min-width:992px) {

	body[data-layout=guest] .section-first .first-cards::before,
	body[data-layout=guest] .section-first .first-cards::after {
		display: block
	}
}

body[data-layout=guest] .section-first .first-cards::after {
	top: auto;
	bottom: 300px
}

body[data-layout=guest] .section-first .first-card {
	border-radius: 35px;
	border: 1px solid rgb(16, 26, 52);
	background: rgb(8, 14, 27);
	flex: 1;
	position: relative;
	overflow: hidden;
	z-index: 20
}

body[data-layout=guest] .section-first .first-card--body {
	padding: 30px;
	position: relative;
	z-index: 10
}

body[data-layout=guest] .section-first .first-item {
	--circle-size: 360px;
	--content-width: 328px;
	padding: calc(var(--gap)/2);
	display: flex;
	flex-direction: column
}

body[data-layout=guest] .section-first .first-shadow {
	width: 426.072px;
	height: 130.559px;
	position: absolute;
	top: 20px;
	right: 20px;
	filter: blur(108px);
	background: url(assets/shadow.svg);
	background-size: cover;
	z-index: 2;
	display: none
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-shadow {
		display: block
	}
}

body[data-layout=guest] .section-first .first-circle {
	width: var(--circle-size);
	height: var(--circle-size);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0);
	border: 1px solid rgb(16, 26, 52);
	position: absolute;
	right: 50%;
	top: 50%;
	transform: translate(50%, -50%);
	border: 1px solid rgb(58 149 255 / .1098039216)
}

body[data-layout=guest] .section-first .first-content {
	display: flex;
	flex-direction: column;
	gap: 15px;
	text-align: center;
	align-items: center;
	width: 100%;
	max-width: var(--content-width);
	margin: 0 auto
}

body[data-layout=guest] .section-first .first-content .label {
	color: rgb(4, 117, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: -.32px;
	display: flex;
	align-items: center;
	gap: 10px
}

body[data-layout=guest] .section-first .first-content .label .icon,
body[data-layout=guest] .section-first .first-content .label [class^=fa] {
	--icon-size: 24px;
	font-size: 18px
}

body[data-layout=guest] .section-first .first-content .title {
	font-size: 35px;
	font-weight: 500;
	line-height: 45px;
	letter-spacing: -.7px;
	margin: 0
}

body[data-layout=guest] .section-first .first-content .text {
	color: rgb(127, 139, 164);
	font-size: 16px;
	font-weight: 500;
	line-height: 146%;
	letter-spacing: -.16px;
	margin: 0
}

body[data-layout=guest] .section-first .first-item--1 {
	width: var(--first-width-sm)
}

body[data-layout=guest] .section-first .first-item--1 .first-card {
	overflow: hidden;
	--content-width: 328px
}

body[data-layout=guest] .section-first .first-item--1 .first-card--body {
	padding: 50px 20px 72px
}

body[data-layout=guest] .section-first .first-item--1 .first-circle {
	transform-origin: 50% 50%;
	transform: translate(50%, -70%)
}

body[data-layout=guest] .section-first .first-item--1 .first-circle:nth-child(2) {
	transform: translate(50%, -70%) scale(1.46)
}

body[data-layout=guest] .section-first .first-item--1 .bottom {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-bottom: 26px;
	position: relative;
	z-index: 10
}

body[data-layout=guest] .section-first .first-item--1 .bottom .social-icons {
	overflow: hidden;
	gap: 16px;
	display: flex;
	align-items: center
}

body[data-layout=guest] .section-first .first-item--1 .bottom .social-icon {
	border-radius: 16px;
	border: 1px solid rgb(16, 26, 52);
	background: rgb(13, 21, 39);
	width: 92px;
	height: 92px;
	flex: 0 0 92px;
	display: flex;
	align-items: center;
	justify-content: center;
	user-select: none;
	pointer-events: none
}

body[data-layout=guest] .section-first .first-item--2 {
	width: var(--first-width-lg)
}

body[data-layout=guest] .section-first .first-item--2 .first-card {
	overflow: hidden;
	--content-width: 360px;
	background-image: url(assets/first-rise.png);
	background-position: bottom center;
	background-size: cover
}

body[data-layout=guest] .section-first .first-item--2 .first-card--body {
	padding: 64px 20px 298px
}

body[data-layout=guest] .section-first .first-item--2 .first-circle {
	transform-origin: 50% 50%;
	transform: translate(50%, -70%)
}

body[data-layout=guest] .section-first .first-item--2 .first-circle:nth-child(2) {
	transform: translate(50%, -70%) scale(1.2)
}

body[data-layout=guest] .section-first .first-item--3 {
	width: var(--first-width-sm)
}

body[data-layout=guest] .section-first .first-item--3 .first-circle {
	transform-origin: 50% 50%;
	--circle-size: 280px
}

body[data-layout=guest] .section-first .first-item--3 .first-circle:nth-child(2) {
	--circle-size: 460px
}

body[data-layout=guest] .section-first .first-item--3 .first-card--body {
	padding: 46px 20px 46px;
	display: flex;
	align-items: center;
	text-align: center;
	flex-direction: column;
	gap: 0
}

body[data-layout=guest] .section-first .first-item--3 .first-card--body .icon {
	--icon-size: 180px;
	color: rgb(37, 86, 255);
	mask-image: linear-gradient(180deg, rgb(5, 61, 255) 0%, rgba(255, 255, 255, 0) 74%)
}

body[data-layout=guest] .section-first .first-item--3 .first-card--body .title {
	margin-top: -50px;
	font-size: 55px;
	font-weight: 700;
	line-height: 45px;
	position: relative;
	z-index: 2
}

body[data-layout=guest] .section-first .first-item--3 .first-card--body .text {
	color: rgb(127, 139, 164);
	font-size: 19px;
	font-weight: 500;
	line-height: 25px;
	margin: 0;
	text-align: center
}

body[data-layout=guest] .section-first .first-item--4 {
	width: var(--first-width-lg)
}

body[data-layout=guest] .section-first .first-item--4 .first-circle {
	left: auto;
	right: -100px;
	transform: translateY(-50%)
}

body[data-layout=guest] .section-first .first-item--4 .first-content {
	align-items: flex-start;
	text-align: left;
	--content-width: 100%
}

body[data-layout=guest] .section-first .first-item--4 .first-content .title {
	font-size: 30px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.3px
}

body[data-layout=guest] .section-first .first-item--4 .first-image {
	position: absolute;
	right: 0;
	bottom: 0;
	display: none
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-item--4 .first-image {
		display: block
	}
}

body[data-layout=guest] .section-first .first-item--4 .first-card {
	display: flex;
	align-items: center
}

body[data-layout=guest] .section-first .first-item--4 .first-card--body {
	padding: 30px
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-item--4 .first-card--body {
		padding: 36px;
		width: 58%
	}
}

body[data-layout=guest] .section-first .first-item--5 {
	width: var(--first-width-md)
}

body[data-layout=guest] .section-first .first-item--5 .first-card {
	--content-width: 424px;
	padding: 0;
	display: flex;
	justify-content: center;
	padding: 30px
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-item--5 .first-card {
		padding: 62px
	}
}

body[data-layout=guest] .section-first .first-item--5 .first-card--body {
	width: 100%;
	max-width: 424px;
	padding: 0
}

body[data-layout=guest] .section-first .first-item--5 .first-content {
	margin-top: -48px
}

body[data-layout=guest] .section-first .first-item--5 .first-content .title {
	font-size: 30px;
	line-height: 45px;
	letter-spacing: -.6px
}

body[data-layout=guest] .section-first .first-item--5 .first-visual {
	max-width: 424px;
	width: 100%;
	height: 240px;
	mask-image: linear-gradient(180deg, rgb(5, 61, 255) 0%, rgb(5, 61, 255) 50%, rgba(255, 255, 255, 0) 95%)
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-item--5 .first-visual {
		height: 320px
	}
}

body[data-layout=guest] .section-first .first-item--5 .first-visual .twitter-cards {
	margin: 0 auto;
	max-width: 404px;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 16px
}

body[data-layout=guest] .section-first .first-item--5 .first-visual .twitter-cards .twitter-card {
	border-radius: 15px;
	border: 1px solid rgb(12, 21, 43);
	background: rgb(8, 14, 27);
	padding: 18px 15px;
	display: flex;
	align-items: center;
	gap: 12px
}

body[data-layout=guest] .section-first .first-item--5 .first-visual .twitter-cards .twitter-card .icon {
	--icon-size: 54px;
	padding: 14px;
	border-radius: 15px;
	border: 1px solid rgb(31, 43, 75)
}

body[data-layout=guest] .section-first .first-item--5 .first-visual .twitter-cards .twitter-card .content {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 22px;
	letter-spacing: -.08px;
	display: flex;
	flex-direction: column;
	gap: 8px
}

body[data-layout=guest] .section-first .first-item--5 .first-visual .twitter-cards .twitter-card .content-box {
	width: 67px;
	height: 12px;
	background-color: rgb(240 240 240 / .05)
}

body[data-layout=guest] .section-first .first-item--5 .first-visual .twitter-cards .twitter-card .visual-label {
	margin-left: auto;
	padding: 6px 10px 6px 6px;
	border-radius: 100px;
	border: 1px solid rgb(31, 43, 75);
	background: rgb(18 25 44 / .25);
	display: flex;
	align-items: center;
	gap: 10px
}

body[data-layout=guest] .section-first .first-item--5 .first-visual .twitter-cards .twitter-card .visual-label::before {
	content: "";
	background-color: rgb(5, 60, 255);
	border: 1px solid rgb(66, 107, 252);
	width: 18px;
	height: 18px;
	border-radius: 50%
}

body[data-layout=guest] .section-first .first-item--6 {
	width: var(--first-width-xl)
}

body[data-layout=guest] .section-first .first-item--6 .first-image {
	position: absolute;
	right: 0;
	bottom: 0;
	display: none
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-item--6 .first-image {
		display: block
	}
}

body[data-layout=guest] .section-first .first-item--6 .first-content {
	align-items: flex-start;
	text-align: left;
	margin: 0;
	--content-width: 484px
}

body[data-layout=guest] .section-first .first-item--6 .first-card {
	position: relative
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-item--6 .first-card {
		background-image: url(assets/first-card-6-bg.png);
		background-position: bottom left;
		background-size: cover
	}
}

body[data-layout=guest] .section-first .first-item--6 .first-card--body {
	padding: 30px
}

@media(min-width:992px) {
	body[data-layout=guest] .section-first .first-item--6 .first-card--body {
		padding: 76px 52px
	}
}

body[data-layout=guest] .section-features {
	padding: 50px 0
}

body[data-layout=guest] .section-features--box {
	display: flex;
	flex-direction: column;
	gap: 50px;
	border-radius: 35px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(8, 14, 26);
	backdrop-filter: blur(50px);
	padding: 30px 10px
}

@media(min-width:992px) {
	body[data-layout=guest] .section-features--box {
		padding: 100px 10px 25px 10px
	}
}

body[data-layout=guest] .section-features--marquee {
	display: flex;
	gap: 0;
	align-items: center
}

body[data-layout=guest] .section-features--marquee-wrapper {
	margin: 0 auto;
	max-width: 834px;
	width: 100%;
	position: relative
}

body[data-layout=guest] .section-features--marquee-wrapper::before,
body[data-layout=guest] .section-features--marquee-wrapper::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100px;
	background: linear-gradient(90deg, rgb(7, 12, 24) 0%, rgba(255, 255, 255, 0) 100%)
}

body[data-layout=guest] .section-features--marquee-wrapper::after {
	left: auto;
	right: 0;
	transform: scaleX(-1)
}

body[data-layout=guest] .section-features--marquee .item {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 21px;
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: 8px
}

body[data-layout=guest] .section-features--marquee .item .icon {
	--icon-size: 14px;
	color: rgb(5, 60, 255)
}

body[data-layout=guest] .section-features .features {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 24px;
	gap: 20px
}

@media(min-width:992px) {
	body[data-layout=guest] .section-features .features {
		padding: 50px 25px;
		gap: 50px
	}
}

body[data-layout=guest] .section-features .features .feature-item {
	width: 100%;
	max-width: 300px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	text-align: center;
	align-items: center
}

body[data-layout=guest] .section-features .features .feature-item--icon {
	border-radius: 20px;
	border: 1px solid rgb(5, 60, 255);
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, rgb(0 10 255 / .27) 100%), rgb(0 56 255 / .05);
	width: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	--icon-size: 32px;
	color: rgb(5, 60, 255)
}

body[data-layout=guest] .section-features .features .feature-item--title {
	color: rgb(255, 255, 255);
	font-family: "Inter";
	font-size: 19px;
	font-weight: 700;
	line-height: 25px;
	margin: 0
}

body[data-layout=guest] .section-features .features .feature-item--text {
	color: rgb(127, 139, 164);
	font-size: 14px;
	font-weight: 400;
	line-height: 24px
}

body[data-layout=guest] .section-reviews {
	overflow: hidden;
	width: 100%
}

body[data-layout=guest] .section-reviews .section-title {
	margin-bottom: 74px
}

body[data-layout=guest] .section-reviews .swiper {
	overflow: visible
}

@media(min-width:992px) {
	body[data-layout=guest] .section-reviews .swiper .swiper-slide {
		opacity: .4;
		transition: opacity .3s ease
	}

	body[data-layout=guest] .section-reviews .swiper .swiper-slide.swiper-slide-visible {
		opacity: 1
	}
}

body[data-layout=guest] .section-reviews .review-item {
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: radial-gradient(70.98% 70.81% at 100.12% 129.35%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), rgb(8, 14, 27);
	box-shadow: 0 0 0 5px rgb(10, 16, 31)
}

body[data-layout=guest] .section-reviews .review-item--header {
	padding: 24px;
	border-bottom: 1px solid rgb(13, 21, 41);
	margin-bottom: 18px;
	display: flex;
	gap: 15px
}

body[data-layout=guest] .section-reviews .review-item--avatar {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: rgb(9, 15, 28);
	box-shadow: 0 0 0 2px rgb(0 0 0 / .15) inset;
	overflow: hidden
}

body[data-layout=guest] .section-reviews .review-item--avatar img {
	user-select: none;
	pointer-events: none;
	width: 100%;
	height: 100%
}

body[data-layout=guest] .section-reviews .review-item--info {
	display: flex;
	flex-direction: column;
	gap: 5px
}

body[data-layout=guest] .section-reviews .review-item--name {
	font-size: 16px;
	font-weight: 700;
	line-height: 16px
}

body[data-layout=guest] .section-reviews .review-item--date {
	color: rgb(255 255 255 / .25);
	font-size: 16px;
	font-weight: 500;
	line-height: 140%;
	letter-spacing: -.16px
}

body[data-layout=guest] .section-reviews .review-item .label-star {
	margin-left: auto;
	border-radius: 100px;
	background: rgb(251 145 47 / .1);
	display: flex;
	padding: 10px 15px 10px 10px;
	align-items: center;
	gap: 5px;
	font-size: 16px;
	font-weight: 700;
	line-height: 16px
}

body[data-layout=guest] .section-reviews .review-item .label-star .icon {
	color: rgb(244, 115, 54);
	--icon-size: 26px
}

body[data-layout=guest] .section-reviews .review-item--body {
	display: flex;
	flex-direction: column;
	gap: 15px;
	align-items: flex-start;
	padding: 18px 25px 25px
}

body[data-layout=guest] .section-reviews .review-item--title {
	color: rgb(255, 255, 255);
	font-size: 19px;
	font-weight: 500;
	line-height: 23px
}

body[data-layout=guest] .section-reviews .review-item--text {
	color: rgb(127, 139, 164);
	font-size: 16px;
	font-weight: 500;
	line-height: 26px;
	letter-spacing: -.32px
}

body[data-layout=guest] .section-reviews .review-item--verify {
	display: flex;
	padding: 6px 15px 6px 6px;
	align-items: center;
	gap: 5px;
	border-radius: 100px;
	background: rgb(22, 28, 49);
	font-size: 14px;
	font-weight: 600;
	line-height: 140%;
	letter-spacing: -.14px
}

body[data-layout=guest] .section-reviews .review-item--verify .icon {
	--icon-size: 24px
}

body[data-layout=guest] .section-faq {
	padding-bottom: 0
}

body[data-layout=guest] .section-faq .section-title {
	--section-width: 566px;
	--title-width: 566px
}

body[data-layout=guest] .section-faq .container {
	display: flex;
	flex-direction: column;
	gap: 40px
}

body[data-layout=guest] .section-faq .faq-box {
	border-radius: 35px;
	border: 1px solid rgb(13, 21, 41);
	background: linear-gradient(0deg, rgb(8, 14, 27) 0%, rgb(8, 14, 27) 100%), rgb(242, 251, 255);
	padding: 14px
}

body[data-layout=guest] .section-faq .faq__container {
	display: flex;
	gap: 20px;
	flex-wrap: wrap
}

@media(min-width:768px) {
	body[data-layout=guest] .section-faq .faq__container>div {
		width: calc(50% - 10px)
	}
}

body[data-layout=guest] .section-faq .faq__item {
	border-radius: 25px;
	border: 1px solid rgb(13, 22, 42);
	background: rgb(11, 17, 33);
	box-shadow: 0 42px 80px 0 rgb(10 39 83 / .05);
	height: auto
}

body[data-layout=guest] .section-faq .faq__item.active .head .toggle:hover::before {
	transform: translate(-50%, -50%) rotate(-45deg)
}

body[data-layout=guest] .section-faq .faq__item.active .head .toggle:hover::after {
	transform: translate(-50%, -50%) rotate(-45deg)
}

body[data-layout=guest] .section-faq .faq__item.active .head .toggle::before {
	transform: translate(-50%, -50%) rotate(0)
}

body[data-layout=guest] .section-faq .faq__item.active .head .toggle::after {
	transform: translate(-50%, -50%) rotate(-90deg)
}

body[data-layout=guest] .section-faq .faq__item .body {
	color: rgb(127, 139, 164);
	font-size: 16px;
	font-weight: 500;
	line-height: 26px;
	letter-spacing: -.32px;
	padding: 0
}

body[data-layout=guest] .section-faq .faq__item .body p {
	padding: 0 26px 30px
}

body[data-layout=guest] .section-faq .faq__item .head {
	padding: 25px;
	display: flex;
	align-items: center
}

body[data-layout=guest] .section-faq .faq__item .head .toggle {
	margin-left: auto;
	outline: none;
	border: none;
	background-color: rgba(255, 255, 255, 0);
	height: 32px;
	width: 32px;
	position: relative
}

body[data-layout=guest] .section-faq .faq__item .head .toggle::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 16px;
	height: 2px;
	background-color: rgb(255, 255, 255);
	transition: .2s ease
}

body[data-layout=guest] .section-faq .faq__item .head .toggle::after {
	content: "";
	position: absolute;
	transform: translate(-50%, -50%);
	left: 50%;
	top: 50%;
	width: 2px;
	height: 16px;
	background-color: rgb(255, 255, 255);
	transition: .2s ease
}

body[data-layout=guest] .section-faq .faq__item .head .title {
	color: rgb(255, 255, 255);
	font-size: 18px;
	font-weight: 500;
	line-height: 30px;
	margin: 0
}

body[data-layout=guest] .section-faq .faq-bottom {
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(8, 14, 27);
	position: relative;
	padding: 30px
}

@media(min-width:768px) {
	body[data-layout=guest] .section-faq .faq-bottom {
		padding: 40px
	}
}

@media(min-width:992px) {
	body[data-layout=guest] .section-faq .faq-bottom {
		padding: 60px;
		background: url(assets/faq-card-bg.png) no-repeat;
		background-position: left bottom;
		background-size: cover
	}
}

body[data-layout=guest] .section-faq .faq-bottom--content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	width: 100%;
	max-width: 500px;
	position: relative;
	z-index: 10
}

body[data-layout=guest] .section-faq .faq-bottom--title {
	color: rgb(255, 255, 255);
	font-size: 35px;
	font-weight: 500;
	line-height: 45px;
	margin: 0
}

body[data-layout=guest] .section-faq .faq-bottom--text {
	color: rgb(127, 139, 164);
	font-size: 16px;
	font-weight: 500;
	line-height: 160%;
	margin-bottom: 10px
}

body[data-layout=guest] .section-faq .faq-bottom--image {
	position: absolute;
	bottom: 0;
	right: 8px;
	z-index: 1;
	max-width: 100%;
	height: auto;
	display: none
}

@media(min-width:992px) {
	body[data-layout=guest] .section-faq .faq-bottom--image {
		display: block
	}
}

body[data-layout=guest] .section-faq .faq-bottom--image img {
	width: 100%;
	height: auto;
	user-select: none;
	pointer-events: none
}

body[data-layout=guest] .section-faq .faq-bottom .message-pop {
	border-radius: 15px 0 15px 15px;
	border: 1px solid rgb(18, 25, 37);
	background: radial-gradient(70.98% 70.81% at 100.12% 129.35%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), rgb(8, 14, 27);
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 20px;
	padding: 14px 30px 14px 16px;
	max-width: 218px;
	position: absolute;
	right: 374px;
	bottom: 22px;
	z-index: 2
}

body[data-layout=guest] .section-cta {
	margin-top: 100px;
	padding: 150px 0 70px;
	position: relative;
	width: 100%;
	overflow: hidden;
	--circle-size: 526px
}

body[data-layout=guest] .section-cta .circle {
	position: absolute;
	z-index: 1;
	padding: 1px;
	border-radius: 50%;
	background: linear-gradient(180deg, rgb(58 149 255 / .1098039216), rgba(255, 255, 255, 0));
	width: var(--circle-size);
	height: var(--circle-size);
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%)
}

body[data-layout=guest] .section-cta .circle::before {
	content: "";
	background-color: rgb(7, 12, 24);
	border-radius: 50%;
	display: block;
	width: 100%;
	height: 100%
}

body[data-layout=guest] .section-cta .circle:nth-child(1) {
	--circle-size: 786px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgb(27 132 255 / .1098039216), rgba(255, 255, 255, 0))
}

body[data-layout=guest] .section-cta .section-title {
	--section-width: 596px;
	--title-width: 426px;
	position: relative;
	z-index: 10
}

body[data-layout=guest] .section-cta--images {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 5
}

body[data-layout=guest] .section-cta--images img {
	user-select: none;
	pointer-events: none;
	position: absolute;
	transform-origin: center center
}

body[data-layout=guest] .section-cta--images img.cta-left {
	left: calc(50% - 576px);
	top: 110px
}

body[data-layout=guest] .section-cta--images img.cta-right {
	right: calc(50% - 620px);
	top: 190px;
	mask-image: linear-gradient(180deg, rgb(4, 4, 4) 0%, rgb(0 0 0 / .801) 70%, rgb(0 0 0 / .409) 90%, rgba(255, 255, 255, 0) 100%)
}

body[data-layout=auth] {
	--header-height: 100px;
	--header-offset: 30px;
	--header-safe: calc(var(--header-height) + (var(--header-offset) * 2));
	--sidebar-width: 294px;
	--sidebar-safe: var(--sidebar-width);
	background-image: url(buraya bak);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 100% auto;
	min-height: 100vh
}

@media(max-width:1199.98px) {
	body[data-layout=auth] {
		--sidebar-safe: 0
	}
}

@media(max-width:767.98px) {
	body[data-layout=auth] {
		--header-height: 80px;
		--header-offset: 20px;
		--header-safe: calc(var(--header-height) + (var(--header-offset) * 2))
	}
}

@media(max-width:575.98px) {
	body[data-layout=auth] {
		--header-height: 70px;
		--header-offset: 15px;
		--header-safe: calc(var(--header-height) + (var(--header-offset) * 2))
	}
}

body[data-layout=auth] main {
	padding-top: var(--header-safe);
	margin-left: var(--sidebar-safe);
	padding-bottom: 100px
}

body[data-layout=auth] .container {
	max-width: 1920px;
	padding: 0 20px
}

@media(min-width:992px) {
	body[data-layout=auth] .container {
		padding: 0 40px
	}
}

@media(min-width:1200px) {
	body[data-layout=auth] .container {
		padding: 0 60px
	}
}

body[data-layout=auth] .container.container-xs {
	padding: 0 20px;
	max-width: 1072px
}

body[data-layout=auth] .hidden {
	display: none
}

body[data-layout=auth] .sidebar {
	position: fixed;
	left: 0;
	top: 0;
	bottom: 0;
	width: var(--sidebar-width, 294px);
	z-index: 1000;
	font-family: "Inter";
	display: flex;
	flex-direction: column;
	gap: 0
}

body[data-layout=auth] .sidebar-header {
	display: flex;
	justify-content: center;
	padding: 40px 20px
}

body[data-layout=auth] .sidebar-menu {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 20px 58px;
	margin: 0;
	list-style: none;
	overflow-y: auto
}

body[data-layout=auth] .sidebar-menu li .btn {
	padding: 11px 12px;
	justify-content: center
}

body[data-layout=auth] .sidebar-menu li.active .sidebar-menu--link {
	box-shadow: 0 0 3px 0 rgb(5, 60, 255), 0 0 0 1.182px rgb(5, 60, 255);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	border-color: rgb(255 255 255 / .15)
}

body[data-layout=auth] .sidebar-menu li.active .sidebar-menu--link .arrow {
	opacity: 1;
	transform: translateX(0)
}

body[data-layout=auth] .sidebar-menu li .sidebar-menu--link {
	padding: 10px 12px;
	display: flex;
	align-items: center;
	gap: 15px;
	color: rgb(255, 255, 255);
	text-decoration: none;
	border-radius: var(--bs-border-radius-xl);
	border: 1px solid rgba(255, 255, 255, 0)
}

body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .icon {
	--icon-size: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--icon-size);
	min-width: var(--icon-size);
	font-size: 18px;
	line-height: 1
}

body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .icon i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.1em;
	font-size: 18px;
	line-height: 1
}

body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .text {
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: -.14px
}

body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .arrow {
	margin-left: auto;
	transform: translateX(-10px);
	opacity: 0;
	transition: .14s ease
}

body[data-layout=auth] .sidebar-menu li .sidebar-menu--link:hover .arrow {
	transform: translateX(0);
	opacity: 1
}

body[data-layout=auth] .sidebar-overlay {
	display: none;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	position: fixed;
	z-index: 2990;
	background-color: rgb(0 0 0 / .5);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: .14s ease all
}

body[data-layout=auth] .sidebar-overlay.show {
	display: block
}

@media(max-width:1199.98px) {
	body[data-layout=auth] .sidebar {
		background-color: rgb(11, 16, 26);
		border-right: 1px solid rgb(14 23 41 / .5);
		transform: translateX(-100%);
		transition: .24s ease;
		z-index: 2999
	}

	body[data-layout=auth] .sidebar.show {
		transform: translateX(0)
	}
}

@media(max-width:991.98px) {
	body[data-layout=auth] .sidebar .sidebar-menu {
		padding: 20px 20px
	}
}


body[data-layout=auth] .header {
	position: absolute;
	left: var(--sidebar-safe);
	right: 0;
	top: 0;
	padding: var(--header-offset) 0;
	transition: .14s ease;
	position: absolute;
	z-index: 1030
}

body[data-layout=auth] .header.scroll {
	background-color: rgb(11, 16, 26);
	box-shadow: 0 0 10px 0 rgb(0 0 0 / .1);
	position: fixed;
	padding: 0 0;
	--header-height: 90px
}

body[data-layout=auth] .header-menu--toggle {
	display: none
}

@media(max-width:1199.98px) {
	body[data-layout=auth] .header-menu--toggle {
		display: block;
		padding-right: 20px
	}

	body[data-layout=auth] .header-menu--toggle .btn {
		width: 44px;
		height: 44px;
		border-radius: 15px;
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center
	}
}

body[data-layout=auth] .header .container {
	height: var(--header-height);
	display: flex;
	align-items: center
}

body[data-layout=auth] .header-content {
	flex: 1;
	flex-direction: column;
	gap: 14px;
	display: none
}

@media(min-width:992px) {
	body[data-layout=auth] .header-content {
		display: flex
	}
}

body[data-layout=auth] .header-title {
	color: rgb(255, 255, 255);
	font-size: 25px;
	font-weight: 500;
	margin: 0
}

body[data-layout=auth] .header-description {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 500;
	padding: 0;
	margin: 0
}

body[data-layout=auth] .header-description:empty {
	display: none
}

body[data-layout=auth] .header-end {
	display: flex;
	align-items: center;
	gap: 10px
}

@media(max-width:991.98px) {
	body[data-layout=auth] .header-end {
		margin-left: auto
	}
}

body[data-layout=auth] .header-end .btn {
	border-radius: 100px;
	border: 1px solid rgb(18, 26, 44);
	background: radial-gradient(67.11% 64.87% at 92.17% 100%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), rgb(11, 16, 26);
	box-shadow: none;
	padding: 3px;
	height: 48px;
	min-width: 48px;
	gap: 10px
}

body[data-layout=auth] .header-end .btn--inner {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border-radius: 100px;
	border: 1px solid rgb(18, 26, 44);
	background: rgb(14 24 45 / .51)
}

body[data-layout=auth] .header-end .btn .icon-wrapper {
	display: flex;
	height: 100%;
	padding: 11px 10px 11px 12px;
	justify-content: center;
	align-items: center;
	border-radius: 100px 10px 10px 100px;
	background: rgb(5, 60, 255)
}

body[data-layout=auth] .header-end .btn .flag {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: contain
}

body[data-layout=auth] .header-end .btn .arrow {
	font-size: 12px;
	padding-right: 10px
}

body[data-layout=auth] .header-end .lang-item {
	display: flex;
	align-items: center;
	gap: 5px
}

body[data-layout=auth] .header-end .lang-flag {
	width: 22px;
	height: 22px;
	border-radius: 50%
}

@media(max-width:767.98px) {
	body[data-layout=auth] .header-end .header-end--updates {
		display: none
	}
}

@media(max-width:767.98px) {
	body[data-layout=auth] .header-end .btn .text {
		display: none
	}

	body[data-layout=auth] .header-end .btn .arrow {
		display: none
	}

	body[data-layout=auth] .header-end .btn .icon-wrapper {
		border-radius: 50% !important;
		width: 100%;
		padding: 0;
		display: flex
	}
}

body[data-layout=auth] .order-completed {
	position: fixed;
	z-index: 2000;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background: rgb(7, 12, 24);
	align-items: center;
	justify-content: center;
	overflow: auto;
	display: none
}

body[data-layout=auth] .order-completed.active {
	display: flex
}

body[data-layout=auth] .order-completed-text {
	text-align: center;
	padding: 0 0 24px
}

body[data-layout=auth] .order-completed .close {
	position: fixed;
	right: 30px;
	top: 30px;
	color: var(--body-text);
	font-size: 30px;
	border: none;
	outline: none;
	background-color: rgba(255, 255, 255, 0);
	cursor: pointer;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0;
	transition: .14s ease
}

body[data-layout=auth] .order-completed .close:hover {
	background-color: rgba(var(--primary-rgb), .1);
	color: var(--text)
}

body[data-layout=auth] .order-completed-content {
	padding: 100px 30px;
	max-width: 600px;
	width: 100%;
	margin: auto;
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: 30px
}

body[data-layout=auth] .order-completed-content .title {
	font-weight: 400;
	text-align: center;
	font-size: 34px;
	margin-bottom: 0
}

body[data-layout=auth] .order-completed-content .card {
	flex: 1;
	max-width: 500px;
	width: 100%
}

body[data-layout=auth] .order-completed-content .card .card-body {
	display: flex;
	flex-direction: column
}

body[data-layout=auth] .order-completed-content .order-completed-item {
	display: flex;
	align-items: center;
	padding: 15px 4px
}

body[data-layout=auth] .order-completed-content .order-completed-item-label {
	font-size: 14px;
	color: var(--text-disabled);
	margin-bottom: 0
}

body[data-layout=auth] .order-completed-content .order-completed-item-value {
	margin-left: auto;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 0;
	color: var(--text)
}

body[data-layout=auth] .order-completed-content .order-completed-item+.order-completed-item {
	border-top: 1px solid var(--border-color)
}

.member-layout {
	min-height: 100vh;
	min-height: -webkit-fill-available;
	width: 100%;
	position: relative;
	background-image: url(buraya bak);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 100% auto;
	background-color: rgb(7, 12, 24)
}

.member-layout.modal-layout {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 9999;
	display: none;
	overflow: auto
}

.member-layout.modal-layout.active {
	display: block
}

.member-layout--header {
	border-radius: 25px;
	border: 1px solid rgb(8, 14, 27);
	background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgb(4 10 24 / .5) 23.56%, rgb(4 10 24 / .5) 51.12%, rgb(4 10 24 / .5) 78.68%, rgba(255, 255, 255, 0) 100.23%);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	width: 100%;
	height: 100px;
	padding: 0 14px;
	position: sticky;
	top: 0;
	z-index: 1030
}

@media(min-width:768px) {
	.member-layout--header {
		padding: 0 20px
	}
}

@media(min-width:992px) {
	.member-layout--header {
		padding: 0 30px
	}
}

@media(min-width:1200px) {
	.member-layout--header {
		padding: 0 40px
	}
}

.member-layout--header .header-wrapper {
	height: 100%;
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: space-between
}

@media(max-width:991.98px) {
	.member-layout--header .header-wrapper {
		justify-content: space-between
	}
}

.member-layout--header .header-logo img {
	height: 38px
}

.member-layout--content {
	padding: 30px 0
}

@media(min-width:768px) {
	.member-layout--content {
		padding: 40px 0
	}
}

@media(min-width:992px) {
	.member-layout--content {
		padding: 60px 0
	}
}

@media(min-width:1200px) {
	.member-layout--content {
		padding: 80px 0
	}
}

.member-layout--content .container {
	max-width: 436px !important
}

.member-layout--content .container:has(.member-box) {
	max-width: 564px !important
}

.member-layout--head {
	display: flex;
	flex-direction: column;
	text-align: center;
	align-items: center;
	gap: 15px;
	margin-bottom: 30px
}

.member-layout--head .icon-box {
	border-radius: 100px;
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(32, 82, 255) 0%, rgb(4, 60, 255) 100%), rgb(5, 60, 255);
	box-shadow: 0 1.182px 2.365px 0 rgb(1 57 255 / .88), 0 0 0 1.182px rgb(5, 60, 255);
	width: 56px;
	height: 56px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: rgb(255, 255, 255);
	fill: rgb(255, 255, 255)
}

.member-layout--head .icon-box .icon {
	--icon-size: 30px;
	padding: 2px
}

.member-layout--head .title {
	color: rgb(255, 255, 255);
	font-size: 28px;
	font-style: normal;
	font-weight: 500;
	line-height: 34px;
	margin: 0
}

.member-layout--head .text {
	color: rgb(127, 139, 164);
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 160%;
	margin: 0
}

.member-layout .signup-text {
	border-radius: 15px;
	background: rgb(23 31 48 / .5);
	padding: 20px;
	margin-top: 30px;
	text-align: center
}

.member-6digit {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap
}

.member-6digit .form-control {
	padding: 0;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	width: 44px;
	height: 44px
}

@media(min-width:768px) {
	.member-6digit .form-control {
		width: 55px;
		height: 55px
	}
}

.member-6digit .paste {
	width: 100%;
	flex: 0 0 100%;
	text-align: center;
	display: flex;
	justify-content: center
}

.member-box {
	border-radius: 35px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30)
}

.member-box--body {
	padding: 24px
}

@media(min-width:576px) {
	.member-box--body {
		padding: 30px
	}
}

@media(min-width:768px) {
	.member-box--body {
		padding: 40px
	}
}

@media(min-width:992px) {
	.member-box--body {
		padding: 84px 60px 64px
	}
}

.member-box--footer {
	border-top: 1px solid rgb(13, 21, 41);
	padding: 24px;
	color: rgb(103, 121, 169);
	text-align: center;
	font-size: 15px;
	font-style: normal;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.5px
}

@media(min-width:576px) {
	.member-box--footer {
		padding: 28px
	}
}

.member-box--footer span {
	color: rgb(5, 60, 255)
}

[data-page=neworder] .overview {
	padding-bottom: 52px
}

[data-page=neworder] .overview .row>* {
	display: flex;
	flex-direction: column
}

[data-page=neworder] .overview .row>*>* {
	flex: 1
}

[data-page=neworder] .overview-card {
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(8, 14, 27);
	box-shadow: 0 0 0 4px rgb(11, 16, 32);
	position: relative;
	overflow: hidden;
	padding: 30px
}

@media(max-width:767.98px) {
	[data-page=neworder] .overview-card {
		padding: 40px
	}
}

@media(min-width:992px) {
	[data-page=neworder] .overview-card {
		padding: 66px 50px
	}
}

[data-page=neworder] .overview-card::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-image: url(assets/neworder-overview.png);
	background-repeat: no-repeat;
	background-size: 341px 218px;
	background-position: bottom 0 right 0;
	z-index: 5
}

@media(max-width:767.98px) {
	[data-page=neworder] .overview-card::before {
		display: none
	}
}






[data-page=neworder] .overview-card--count .blur.blur-2 {
	width: 426.072px;
	height: 130.559px;
	position: absolute;
	bottom: -60px;
	left: 50%;
	transform: translateX(-50%);
	filter: blur(108px);
	background: url(assets/shadow.svg);
	background-size: cover;
	z-index: 2
}

[data-page=neworder] .overview-card--content {
	position: relative;
	z-index: 10;
	display: flex;
	flex-direction: column;
	gap: 10px
}

[data-page=neworder] .overview-card--content .greeting {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.32px
}

[data-page=neworder] .overview-card--content .username {
	color: rgb(255, 255, 255);
	font-family: "Inter";
	font-size: 30px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.6px
}

[data-page=neworder] .overview-card--content .balance-text {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.32px
}

[data-page=neworder] .overview-card--content .balance-text span {
	color: rgb(255, 255, 255)
}

[data-page=neworder] .overview-counts {
	padding: 30px;
	display: flex;
	gap: 50px;
	position: relative;
	z-index: 10
}

@media(max-width:767.98px) {
	[data-page=neworder] .overview-counts {
		gap: 30px;
		padding: 20px
	}
}

[data-page=neworder] .overview-counts>* {
	flex: 1
}

[data-page=neworder] .overview .overview-card--count {
	padding: 0 !important
}

[data-page=neworder] .overview .overview-card--count::before {
	content: none
}

[data-page=neworder] .overview-count {
	display: flex;
	flex-direction: column;
	gap: 24px
}

@media(max-width:767.98px) {
	[data-page=neworder] .overview-count {
		gap: 12px
	}
}

[data-page=neworder] .overview-count .head {
	display: flex;
	align-items: center;
	gap: 12px
}

@media(max-width:767.98px) {
	[data-page=neworder] .overview-count .head {
		flex-direction: column;
		align-items: flex-start
	}
}

[data-page=neworder] .overview-count .head .icon {
	--icon-size: 40px;
	padding: 6px;
	border-radius: 12px;
	background: rgb(1 11 253 / .2);
	color: rgb(4, 44, 255)
}

@media(max-width:767.98px) {
	[data-page=neworder] .overview-count .head .icon {
		--icon-size: 30px
	}
}

[data-page=neworder] .overview-count .head .title {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 22px
}

[data-page=neworder] .overview-count .count {
	color: rgb(255, 255, 255);
	font-size: 35px;
	font-style: normal;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.7px
}

@media(max-width:767.98px) {
	[data-page=neworder] .overview-count .count {
		font-size: 24px;
		line-height: 24px
	}
}

[data-page=neworder] .overview-count .bottom {
	display: flex;
	width: 100%;
	height: 64px;
	padding: 8px 10px 8px 20px;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	color: rgb(255, 255, 255);
	font-family: "Inter";
	font-size: 14px;
	font-weight: 500;
	border-radius: 15px;
	border: 1px solid rgb(255 255 255 / .05);
	background: radial-gradient(88.4% 80.53% at 70.71% 145.38%, rgb(15, 22, 48) 0%, rgb(8, 15, 29) 100%)
}

[data-page=neworder] .overview-count .bottom .btn {
	border-radius: 15px
}

@media(max-width:991.98px) {
	[data-page=neworder] .overview-count .bottom {
		display: none
	}
}

[data-page=neworder] .overview-count:nth-child(2) .head .icon {
	background: rgb(244 86 51 / .2);
	color: rgb(244, 89, 54)
}

[data-page=neworder] .neworder-charge {
	display: flex;
	padding: 10px 10px 10px 15px;
	align-items: center;
	gap: 10px;
	border-radius: var(--bs-border-radius-xl);
	border: 1px solid rgb(255 255 255 / .05);
	background: linear-gradient(0deg, rgb(9, 16, 34) 0%, rgb(9, 16, 34) 100%), rgb(255, 255, 255)
}

[data-page=neworder] .neworder-charge>.icon {
	--icon-size: 44px;
	padding: 5px;
	color: rgb(255, 255, 255);
	border-radius: 100px;
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3px 0 rgb(5, 60, 255), 0 0 0 1.182px rgb(5, 60, 255)
}

[data-page=neworder] .neworder-charge input {
	flex: 1;
	width: 100%;
	border: none;
	outline: none;
	box-shadow: none;
	background-color: rgba(255, 255, 255, 0);
	color: var(--foreground-color, rgb(26, 46, 75));
	font-size: 14px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -.42px
}

[data-page=neworder] .neworder-desc {
	display: flex;
	flex-direction: column
}

[data-page=neworder] .neworder-desc .card {
	border-radius: 20px
}

@media(min-width:992px) {
	[data-page=neworder] .neworder-desc .card-head {
		display: none
	}
}

[data-page=neworder] .neworder-desc .card-body {
	padding: 15px
}

[data-page=neworder] .neworder-desc .card-desc {
	flex: 1
}

[data-page=neworder] .neworder-desc_toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px 0 10px;
	color: var(--foreground-color, rgb(26, 46, 75));
	font-size: 14px;
	gap: 10px;
	display: none
}

[data-page=neworder] .neworder-desc .service-name {
	display: flex;
	width: 100%;
	min-height: 56px;
	padding: 10px;
	justify-content: center;
	align-items: center;
	border-radius: 15px;
	border: 1px solid var(--Button-Button_Stroke, rgb(255 255 255 / .15));
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3px 0 rgb(5, 60, 255), 0 0 0 1.182px rgb(5, 60, 255);
	color: rgb(255, 255, 255);
	font-family: "Inter";
	font-size: 16px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: -.64px
}

[data-page=neworder] .neworder-desc_content {
	height: 100%;
	position: relative;
	display: flex;
	flex-direction: column
}

[data-page=neworder] .neworder-desc .toggle-btn {
	display: none
}

[data-page=neworder] .neworder-desc .toggle-btn .state-open {
	display: none
}

@media(max-width:991.98px) {
	[data-page=neworder] .neworder-desc {
		position: fixed;
		bottom: 0;
		background-color: rgb(9, 16, 34);
		border: 1px solid rgb(13, 21, 41);
		box-shadow: 0 -2px 10px 0 rgb(0 0 0 / .1);
		display: flex;
		flex-direction: column;
		transition: .14s ease;
		z-index: 1000;
		max-height: 71px;
		overflow: hidden;
		left: -1px;
		right: -1px;
		bottom: 10px;
		transform: scale(.9);
		width: calc(100% + 2px);
		border-radius: 15px;
		transition: .5s ease
	}

	[data-page=neworder] .neworder-desc .card {
		overflow: hidden;
		margin-bottom: 0;
		flex: 1;
		height: 100%
	}

	[data-page=neworder] .neworder-desc .card-head {
		border: none;
		display: flex;
		flex-direction: row;
		height: 74px;
		flex: 0 0 74px;
		align-items: center;
		gap: 10px;
		padding: 0 20px
	}

	[data-page=neworder] .neworder-desc.active {
		max-height: calc(100% - 20px);
		left: -1px;
		right: -1px;
		bottom: 0;
		border-radius: 15px 15px 0 0;
		width: calc(100% + 2px);
		transform: scale(1)
	}

	[data-page=neworder] .neworder-desc.active .card-head {
		border-bottom: 1px solid var(--stroke-color, rgb(25, 27, 33))
	}

	[data-page=neworder] .neworder-desc.active .card-body {
		flex: 1;
		overflow-y: auto
	}

	[data-page=neworder] .neworder-desc.active .toggle-btn .state-open {
		display: block
	}

	[data-page=neworder] .neworder-desc.active .toggle-btn .state-close {
		display: none
	}

	[data-page=neworder] .neworder-desc .toggle-btn {
		position: absolute;
		right: 10px;
		width: 42px;
		height: 42px;
		min-height: 42px;
		border-radius: 50%;
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		border: 1px solid rgb(47, 106, 140);
		background: rgb(19, 45, 65);
		color: var(--main-color);
		font-size: 16px
	}

	[data-page=neworder] .neworder-desc .card {
		box-shadow: none;
		border: none;
		background-color: rgba(255, 255, 255, 0)
	}

	[data-page=neworder] .neworder-desc_toggle {
		display: flex
	}

	[data-page=neworder] .neworder-desc_content {
		flex: 1;
		overflow-y: auto
	}

	[data-page=neworder] .neworder-desc .neworder-service_info-others {
		margin: 0 -3px;
		gap: 4px;
		flex-wrap: wrap
	}

	[data-page=neworder] .neworder-desc .neworder-service_info-others>* {
		padding: 0 3px
	}

	[data-page=neworder] .neworder-desc .neworder-service_info-others .label {
		margin-bottom: 6px
	}

	[data-page=neworder] .neworder-desc .neworder-service_info-others .label-text {
		white-space: nowrap
	}
}

[data-page=neworder] .neworder-service_info-name {
	margin-bottom: 15px
}

[data-page=neworder] .neworder-service_info-name .label {
	display: flex;
	width: 100%
}

[data-page=neworder] .neworder-service_info-name .label-text {
	flex: 1;
	text-align: center;
	color: var(--body-text, rgb(10, 22, 58));
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 30px
}

[data-page=neworder] .neworder-service_info-others {
	padding-top: 10px;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap
}

[data-page=neworder] .neworder-service_info-others>.info-item {
	flex: 0 0 calc(50% - 5px)
}

@media(max-width:767.98px) {
	[data-page=neworder] .neworder-service_info-others>.info-item {
		flex: 0 0 calc(100% - 5px)
	}
}

[data-page=neworder] .neworder-service_info-others>.info-item.item-full {
	flex: 0 0 calc(100% - 5px)
}

[data-page=neworder] .neworder-service_info-others .info-item {
	display: flex;
	gap: 15px;
	padding: 10px;
	align-items: center;
	border-radius: var(--bs-border-radius-xl);
	border: 1px solid rgb(255 255 255 / .05);
	background: rgb(11, 21, 38)
}

[data-page=neworder] .neworder-service_info-others .info-item .icon {
	--icon-size: 34px;
	padding: 4px;
	border-radius: 10px;
	border: 1px solid var(--Button-Button_Stroke, rgb(255 255 255 / .15));
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3px 0 rgb(5, 60, 255), 0 0 0 1.182px rgb(5, 60, 255);
	color: rgb(255, 255, 255)
}

[data-page=neworder] .neworder-service_info-others .info-item .text {
	color: rgb(255 255 255 / .4);
	font-size: 14px;
	font-weight: 700;
	line-height: 24px;
	letter-spacing: -.14px
}

[data-page=neworder] .neworder-service_info-others .info-item .text span {
	color: rgb(255, 255, 255);
	font-weight: 500
}

[data-page=neworder] .neworder-service_info-bottom {
	padding-top: 10px;
	display: flex;
	gap: 10px
}

[data-page=neworder] .neworder-service_info-bottom_item {
	flex: 1;
	border: 1px solid var(--stroke, rgb(25, 27, 33));
	background: radial-gradient(68.6% 68.6% at 57.8% 96.86%, rgb(56 75 110 / .2) 0%, rgb(5 9 16 / .2) 100%), rgb(12, 17, 25);
	margin-top: 10px;
	padding: 11px 14px;
	border-radius: 15px;
	display: flex;
	align-items: center;
	gap: 14px
}

[data-page=neworder] .neworder-service_info-bottom_item .icon-box {
	--icon-box-size: 35px;
	--icon-box-font-size: 18px
}

[data-page=neworder] .neworder-service_info-bottom_item .text {
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: -.14px
}

[data-page=neworder] .neworder-description {
	border-top: 1px solid rgb(25, 27, 33);
	padding: 30px 20px 20px;
	border-radius: 0 0 20px 20px;
	border: 1px solid rgb(255 255 255 / .05);
	background: radial-gradient(88.4% 80.53% at 70.71% 145.38%, rgb(15, 22, 48) 0%, rgb(8, 15, 29) 100%), rgb(235, 249, 255);
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: -.14px
}

.service-wrapper {
	display: flex;
	flex-direction: column;
	gap: 20px
}

.service-category {
	padding: 15px 20px;
	display: flex;
	align-items: center;
	flex-direction: row;
	gap: 15px;
	border-radius: 15px;
	position: sticky;
	top: calc(var(--header-fix, 80px) + 18px);
	z-index: 100;
	overflow: hidden;
	box-shadow: none
}

.service-category--icon img {
	width: auto;
	height: 32px
}

.service-category--icon:not(:has(img)) {
	height: 32px;
	width: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgb(255, 255, 255);
	font-size: 20px
}

.service-category--title {
	color: rgb(255, 255, 255);
	font-size: 18px;
	font-weight: 700;
	line-height: 16px
}

.service-item {
	border-radius: 15px;
	gap: 0
}

.service-item--block {
	padding: 15px 20px;
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1;
	flex-wrap: wrap
}

.service-item--block+.service-item--block {
	border-top: 1px solid rgb(13, 21, 41)
}

.service-item--top {
	display: flex;
	gap: 20px
}

.service-item--id {
	display: flex;
	height: 30px;
	align-items: center;
	padding: 0 10px;
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	border-radius: 100px;
	background: rgb(5, 60, 255);
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: normal
}

@media(max-width:991.98px) {
	.service-item--id {
		flex: 0 0 100%;
		background-color: rgba(255, 255, 255, 0);
		text-align: center;
		justify-content: center
	}
}

.service-item--name {
	color: rgb(255, 255, 255);
	font-size: 18px;
	font-weight: 500;
	line-height: 26px
}

@media(max-width:991.98px) {
	.service-item--name {
		flex: 0 0 100%;
		text-align: center
	}
}

.service-item--price {
	margin-left: auto;
	border-radius: 15px;
	border: 1px solid rgb(15, 25, 52);
	background: rgb(11, 18, 35);
	display: flex;
	align-items: center;
	overflow: hidden
}

.service-item--price-item {
	padding: 13px 15px;
	display: block;
	background: rgb(5, 60, 255);
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 700;
	line-height: 24px
}

.service-item--price-item:nth-child(2) {
	color: rgb(255 255 255 / .6);
	background-color: rgba(255, 255, 255, 0)
}

@media(max-width:991.98px) {
	.service-item--price {
		margin-left: 0
	}
}

.service-item--info-box {
	display: flex;
	min-height: 46px;
	padding: 0;
	align-items: center;
	border-radius: 15px;
	border: 1px solid rgb(15, 25, 52);
	background: rgb(11, 18, 35)
}

.service-item--info-box .info-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	color: rgb(255, 255, 255);
	position: relative
}

.service-item--info-box .info-item .icon {
	--icon-size: 20px
}

.service-item--info-box .info-item .text {
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 700
}

.service-item--info-box .info-item+.info-item::before {
	position: absolute;
	left: 0;
	content: "";
	height: 100%;
	width: 1px;
	background-color: rgb(15, 25, 52)
}

.service-item--favorite .btn {
	border-radius: 15px;
	border: 1px solid rgb(15, 25, 52);
	background: rgb(11, 18, 35);
	width: 50px;
	height: 50px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center
}

.service-item--favorite .btn-icon {
	color: rgb(255, 255, 255)
}

.service-item--favorite .btn[data-favorite=true] .btn-icon {
	transition: .14s ease;
	color: rgb(5, 60, 255);
	animation: favorite-animation .2s ease-in-out
}

.service-item--favorite .btn[data-favorite=true] .btn-icon i {
	font-weight: 900
}

@keyframes favorite-animation {
	0% {
		transform: scale(1) rotate(0deg)
	}

	60% {
		transform: rotate(0deg) scale(1.5)
	}

	100% {
		transform: scale(1) rotate(0deg)
	}
}

@media(max-width:991.98px) {
	.service-item--favorite {
		margin-left: auto
	}
}

.service-item-avg-time {
	display: flex;
	gap: 10px;
	align-items: center
}

.service-item-avg-time .badge {
	height: 46px;
	border-radius: 15px
}

.service-item--btns {
	margin-left: auto;
	display: flex;
	gap: 8px;
	align-items: center
}

@media(max-width:767.98px) {
	.service-item--btns {
		flex-wrap: wrap;
		margin-left: 0;
		width: 100%;
		flex: 0 0 100%
	}
}

.service-item.skeleton {
	color: rgba(255, 255, 255, 0) !important
}

.service-item.skeleton * {
	color: rgba(255, 255, 255, 0) !important
}

.service-item.skeleton .service-item--name,
.service-item.skeleton .service-item--avg_time,
.service-item.skeleton .service-item--minmax {
	border-radius: 5px;
	background: linear-gradient(90deg, rgb(240, 241, 243) 0%, rgb(246, 247, 249) 50%, rgb(240, 241, 243) 100%);
	background-size: 200% 100%;
	animation: skeleton 1.5s ease-in-out infinite
}

.service-item.skeleton .service-item--name::before,
.service-item.skeleton .service-item--avg_time::before,
.service-item.skeleton .service-item--minmax::before {
	display: none
}

.service-item.skeleton .service-item--name {
	width: 100%;
	max-width: 400px
}

.service-item--refill .badge {
	height: 46px;
	border-radius: 15px
}

@keyframes skeleton {
	0% {
		background-position: -100% 0
	}

	100% {
		background-position: 100% 0
	}
}

.filter-row {
	display: flex;
	gap: 10px;
	margin-bottom: 40px;
	flex-wrap: wrap
}

@media(max-width:767.98px) {
	.filter-row>* {
		flex: 0 0 100%
	}

	.filter-row .grindup-dropdown {
		width: 100%
	}

	.filter-row .grindup-dropdown__btn {
		width: 100%
	}

	.filter-row .grindup-dropdown__btn::after {
		margin-left: auto
	}
}

.filter-row .grindup-dropdown__btn {
	display: flex;
	padding: 9px 20px 9px 10px;
	height: 60px;
	align-items: center;
	gap: 14px;
	border-radius: 20px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(8, 15, 29);
	outline: none;
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: 20px
}

.filter-row .grindup-dropdown__btn .icon {
	--icon-size: 40px;
	padding: 6px;
	border-radius: 13px;
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3.943px 0 rgb(5, 60, 255), 0 0 0 1.554px rgb(5, 60, 255)
}

.filter-row .grindup-dropdown__btn::after {
	content: "";
	width: 18px;
	flex: 0 0 18px;
	height: 18px;
	background-image: url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\"><mask id=\"mask0_582_2217\" style=\"mask-type:alpha\" maskUnits=\"userSpaceOnUse\" x=\"0\" y=\"0\" width=\"18\" height=\"18\"><rect width=\"18\" height=\"18\" fill=\"%23D9D9D9\"/></mask><g mask=\"url%28%23mask0_582_2217%29\"><path d=\"M9 11.5313L4.5 7.03126L5.55 5.98126L9 9.43126L12.45 5.98126L13.5 7.03126L9 11.5313Z\" fill=\"%23ffffff\"/></g></svg>");
	transition: .2s ease all
}

.filter-row .icon-box {
	--icon-box-size: 46px;
	--icon-box-font-size: 28px;
	border: none;
	outline: none;
	padding: 0;
	margin: 0;
	background-color: rgb(1 178 253 / .2);
	color: rgb(5, 179, 253)
}

.filter-row .icon-box.warning {
	color: rgb(244, 115, 54);
	background-color: rgb(244 113 51 / .2)
}

.filter-row--search {
	margin-left: auto
}

.filter-row--search .search-box {
	border-radius: 15px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(8, 15, 29);
	height: 60px;
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 10px
}

.filter-row--search .search-box .icon {
	--icon-size: 40px;
	padding: 6px;
	border-radius: 13.143px;
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3.943px 0 rgb(5, 60, 255), 0 0 0 1.554px rgb(5, 60, 255)
}

.filter-row--search .search-box--input {
	background-color: rgba(255, 255, 255, 0);
	border: none;
	outline: none;
	flex: 1;
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
	color: rgb(255, 255, 255)
}

.filter-row--search .search-box--input::placeholder {
	color: rgb(84, 95, 126)
}

.filter-row--grid {
	flex: 1;
	display: grid;
	--grid-size: 90px;
	grid-template-columns: repeat(auto-fill, minmax(var(--grid-size), 1fr));
	gap: 10px
}

.filter-row--grid-item {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 10px;
	height: var(--grid-size);
	padding: 10px;
	border-radius: 15px;
	border: 1px solid rgb(235, 239, 244);
	background: rgb(255, 255, 255)
}

.filter-row--grid-item.active {
	border: 1px solid rgb(5, 179, 253);
	box-shadow: 0 0 0 3px rgb(0 179 255 / .15)
}

.filter-row--grid-item:focus,
.filter-row--grid-item:active {
	box-shadow: 0 0 0 3px rgb(0 179 255 / .15)
}

.filter-row--grid-item .icon {
	width: 28px;
	height: 28px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 15px;
	border-radius: 60.87px;
	background: rgb(1 178 253 / .2)
}

.filter-row--grid-item .text {
	color: rgb(4, 4, 4);
	text-align: center;
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: -.26px
}

.order-wrapper {
	display: flex;
	flex-direction: column;
	gap: 20px
}

.order-item {
	display: flex;
	flex-direction: column;
	gap: 0;
	border-radius: 15px 15px;
	border: 1px solid rgb(13, 21, 41);
	background: radial-gradient(362.8% 330.5% at 71.46% -272.5%, rgb(15, 22, 48) 0%, rgb(9, 16, 30) 100%);
	box-shadow: 0 15.11px 59.06px 0 rgb(0 0 0 / .03);
	position: relative;
	overflow: hidden
}

.order-item--block {
	display: flex;
	align-items: center
}

.order-item--block+.order-item--block {
	border-top: 1px solid rgb(13, 21, 41)
}

.order-item--block.top {
	padding: 22px;
	flex-wrap: wrap;
	gap: 20px
}

@media(min-width:768px) {
	.order-item--block.top {
		gap: 30px
	}
}

@media(min-width:1400px) {
	.order-item--block.top {
		gap: 54px;
		flex-wrap: nowrap
	}
}

.order-item--block.bottom {
	padding: 25px 27px;
	gap: 30px;
	flex-wrap: wrap
}

.order-item--icon {
	width: 50px;
	height: 50px;
	flex: 0 0 50px;
	border-radius: 14px;
	margin-right: -34px;
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 0 1.554px rgb(5, 60, 255);
	font-size: 30px;
	display: flex;
	align-items: center;
	justify-content: center
}

@media(max-width:1399.98px) {
	.order-item--icon {
		margin-right: -20px
	}
}

@media(max-width:767.98px) {
	.order-item--icon {
		position: absolute;
		right: -4px;
		top: -4px;
		margin: 0;
		transform: scale(1.4) rotate(25deg);
		opacity: .4;
		border-radius: 50%
	}
}

.order-item--top {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 0 0 auto
}

.order-item--top .title {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.48px
}

.order-item--top .value {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	overflow: hidden;
	text-overflow: ellipsis;
	display: inline-block;
	max-width: 100%
}

@media(max-width:767.98px) {
	.order-item--id {
		flex-direction: row;
		justify-items: center;
		width: 100%;
		flex: 0 0 100%
	}
}

.order-item--service {
	flex: 1
}

@media(max-width:991.98px) {
	.order-item--service {
		flex: 0 0 100%
	}
}

.order-item--link .value {
	max-width: 200px;
	white-space: nowrap
}

.order-item--link a {
	color: rgb(255, 255, 255);
	text-decoration: none
}

.order-item--link a>[class^=fa] {
	color: rgb(5, 60, 255);
	padding-right: 6px
}

.order-item--status {
	margin-left: auto
}

@media(max-width:767.98px) {
	.order-item--status {
		flex: 0 0 100%
	}
}

.order-item--status .status {
	display: flex;
	height: 46px;
	padding: 11px 15px;
	align-items: center;
	justify-content: center;
	gap: 14px;
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 700;
	line-height: 24px;
	letter-spacing: -.14px;
	white-space: nowrap;
	border-radius: 100px;
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3px 0 rgb(5, 60, 255), 0 0 0 1.182px rgb(5, 60, 255)
}

.order-item--status .status .icon {
	--icon-size: 24px
}

.order-item--bottom {
	display: flex;
	align-items: center;
	gap: 10px
}

.order-item--bottom .icon {
	--icon-size: 32px;
	padding: 6px;
	border-radius: 110px;
	background: rgb(5, 60, 255)
}

.order-item--bottom .title {
	color: rgb(120, 129, 149);
	font-size: 16px;
	line-height: 16px;
	font-weight: 500
}

.order-item--bottom .value {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 16px
}

.order-item--buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center
}

.order-item--buttons:empty {
	display: none
}

@media(min-width:992px) {
	.order-item--buttons {
		margin-left: auto
	}
}

@media(max-width:991.98px) {
	.order-item--buttons {
		flex: 0 0 100%;
		display: flex;
		gap: 10px
	}

	.order-item--buttons>* {
		flex: 1
	}
}

@media(max-width:767.98px) {
	.order-item--buttons {
		flex-direction: column
	}

	.order-item--buttons>* {
		width: 100%;
		display: flex;
		justify-content: center;
		flex: 1
	}
}

[data-page=addfunds] .addfunds-head {
	width: 100%;
	margin-bottom: 30px
}

[data-page=addfunds] .addfunds-methods {
	display: grid;
	gap: 19px;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	grid-auto-rows: 1fr;
	margin-bottom: 30px
}

[data-page=addfunds] .addfunds-method {
	position: relative
}

[data-page=addfunds] .addfunds-method input {
	display: none
}

[data-page=addfunds] .addfunds-method input:checked+.addfunds-method__box {
	border: 1px solid rgb(5, 60, 255);
	background: rgb(9, 16, 30);
	box-shadow: 0 0 0 4px rgb(1 57 255 / .2)
}

[data-page=addfunds] .addfunds-method input:checked+.addfunds-method__box .addfunds-method__check {
	background: rgb(5, 60, 255);
	border-color: rgb(5, 60, 255)
}

[data-page=addfunds] .addfunds-method input:checked+.addfunds-method__box .addfunds-method__check i {
	transform: scale(1);
	color: rgb(255, 255, 255)
}

[data-page=addfunds] .addfunds-method__box {
	cursor: pointer;
	border-radius: 15px;
	border-radius: 15px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30);
	padding: 20px 20px 16px;
	transition: .14s ease
}

[data-page=addfunds] .addfunds-method__box:hover {
	background: rgb(14, 22, 38)
}

[data-page=addfunds] .addfunds-method__box:focus {
	outline: none;
	box-shadow: 0 0 0 4px rgb(1 178 253 / .2)
}

[data-page=addfunds] .addfunds-method__box .badge {
	border-radius: 100px;
	border: 1px solid rgb(21, 29, 49);
	background: rgb(14, 22, 38);
	display: flex;
	padding: 8px 15px 8px 10px;
	align-items: center;
	gap: 5px;
	color: rgb(255, 255, 255);
	font-size: 15px;
	font-weight: 700;
	line-height: 14px;
	letter-spacing: -.3px
}

[data-page=addfunds] .addfunds-method__top {
	display: flex;
	align-items: center;
	gap: 8px
}

[data-page=addfunds] .addfunds-method__name {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 700;
	line-height: 16px;
	letter-spacing: -.48px
}

[data-page=addfunds] .addfunds-method__check {
	width: 20px;
	height: 20px;
	flex: 0 0 20px;
	border-radius: 100px;
	border: 2px solid rgb(18, 26, 44);
	background: rgb(13, 20, 33);
	display: flex;
	align-items: center;
	justify-content: center
}

[data-page=addfunds] .addfunds-method__check i {
	transition: .14s ease all;
	transform: scale(0);
	font-size: 13px
}

[data-page=addfunds] .addfunds-method__bottom {
	display: flex;
	align-items: center;
	gap: 5px;
	margin-top: 27px
}

[data-page=addfunds] .addfunds-method__icon {
	display: block;
	flex: 1;
	user-select: none;
	pointer-events: none
}

[data-page=addfunds] .addfunds-method__icon img {
	display: block;
	height: 18px
}

[data-page=addfunds] .addfunds-payment {
	border-radius: 15px;
	border: 1px solid var(--stroke-s-50, rgb(235, 239, 244));
	background: var(--root-white, rgb(255, 255, 255));
	padding: 24px;
	gap: 21px;
	margin-bottom: 10px
}

[data-page=addfunds] .addfunds-payment__top,
[data-page=addfunds] .addfunds-payment__bottom {
	display: flex;
	align-items: center
}

[data-page=addfunds] .addfunds-payment__top>*:nth-child(2),
[data-page=addfunds] .addfunds-payment__bottom>*:nth-child(2) {
	margin-left: auto
}

[data-page=addfunds] .addfunds-payment__bottom {
	padding-top: 8px
}

[data-page=addfunds] .addfunds-payment .method-name {
	color: var(--neutral-n-900, rgb(21, 25, 36));
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 24px;
	letter-spacing: -.48px
}

[data-page=addfunds] .addfunds-payment .date {
	color: var(--text-disabled, rgb(10, 22, 58));
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: -.56px
}

[data-page=addfunds] .addfunds-payment .id {
	color: var(--foreground-color, rgb(26, 46, 75));
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -.35px
}

[data-page=addfunds] .addfunds-right .card-body {
	padding: 30px
}

[data-page=addfunds] .addfunds-right .form-control.secondary {
	color: var(--foreground-color-2, rgb(10, 22, 58));
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: 26px;
	letter-spacing: -.42px
}

[data-page=addfunds] .addfunds-right__title {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px
}

[data-page=addfunds] .addfunds-right__title .text {
	color: var(--body-text, rgb(10, 22, 58));
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -.16px
}

.form-group.instruction {
	margin-bottom: 0;
	padding: 20px;
	margin-bottom: 30px;
	border-radius: 15px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30)
}

.grindup-radio {
	display: flex;
	align-items: center;
	gap: 8px
}

.grindup-radio__icon {
	border-radius: 100px;
	border: 2px solid rgb(18, 26, 44);
	background: rgb(13, 20, 33);
	width: 20px;
	height: 20px;
	display: inline-block
}

.grindup-radio__title {
	color: var(--foreground-color, rgb(26, 46, 75));
	font-size: 15px;
	font-style: normal;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: -.45px
}

.quick-amount {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	border-radius: 15px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30);
	box-shadow: 0 15.11px 59.06px 0 rgb(0 0 0 / .03)
}

.quick-amount__item {
	cursor: pointer;
	flex: 1;
	padding: 25px 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: .14s ease all
}

.quick-amount__item:hover {
	background-color: rgb(14, 22, 38)
}

.quick-amount__item.active .grindup-radio__icon {
	border-color: rgb(52, 96, 255);
	background: rgb(6, 61, 255)
}

.card.card-addfunds {
	margin-top: 32px;
	border-radius: 26px
}

.card.card-addfunds .card-head {
	margin: 10px 10px 0;
	border-radius: 20px;
	background: rgb(14, 22, 38);
	padding: 30px 20px;
	color: rgb(255, 255, 255);
	font-size: 19px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.57px;
	letter-spacing: -.57px;
	text-align: center
}

.card.card-addfunds .card-body,
.card.card-addfunds .card-body p {
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.42px
}

.card.card-addfunds-2 {
	display: flex;
	padding: 10px;
	align-items: center;
	gap: 15px;
	flex-direction: row;
	margin-top: 30px
}

.card.card-addfunds-2>.icon {
	--icon-size: 44px;
	flex: 0 0 var(--icon-size);
	color: rgb(5, 60, 255);
	padding: 10px;
	border-radius: 10px;
	background: rgb(1 57 255 / .1)
}

.card.card-addfunds-2 .card-text {
	color: rgb(255, 255, 255);
	font-size: 18px;
	line-height: 24px
}

.card.card-addfunds-2 .btn {
	margin-left: auto
}

.grindup-afmodal .grindup-modal__close {
	position: absolute;
	right: 30px;
	top: 26px
}

.grindup-afmodal .grindup-modal__header {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 20px;
	background: rgb(14, 22, 38);
	padding: 30px 20px;
	text-align: center
}

.grindup-afmodal .grindup-modal__title {
	color: rgb(255, 255, 255);
	font-size: 25px;
	font-weight: 600;
	line-height: 25px;
	letter-spacing: -.75px;
	margin-bottom: 0
}

.addfunds-payment {
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	border-radius: 20px;
	border: 1px solid rgb(13, 22, 42);
	background: rgb(11, 17, 33);
	margin-bottom: 14px
}

.addfunds-payment__top,
.addfunds-payment__bottom {
	display: flex;
	align-items: center;
	gap: 20px;
	justify-content: space-between;
	flex-wrap: wrap
}

.addfunds-payment__icon img {
	max-height: 32px
}

[data-page=tickets] .ticket--top-card {
	display: flex;
	padding: 10px;
	align-items: center;
	gap: 15px;
	flex-direction: row
}

[data-page=tickets] .ticket--top-card>.icon {
	--icon-size: 44px;
	flex: 0 0 var(--icon-size);
	color: rgb(5, 60, 255);
	padding: 10px;
	border-radius: 10px;
	background: rgb(1 57 255 / .1)
}

[data-page=tickets] .ticket--top-card .text {
	color: rgb(255, 255, 255);
	font-size: 18px;
	font-weight: 400;
	line-height: 24px
}

[data-page=tickets] .ticket--top-card .btn {
	margin-left: auto
}

[data-page=tickets] .ticket-option {
	flex: 0 0 auto
}

[data-page=tickets] .ticket-options {
	display: flex;
	width: 100%;
	gap: 10px;
	flex-wrap: wrap
}

@media(min-width:992px) {
	[data-page=tickets] .ticket-option {
		flex: 1
	}
}

[data-page=tickets] .ticket-option--box {
	border-radius: 15px;
	border: 1px solid rgb(13, 21, 41);
	background: radial-gradient(362.8% 330.5% at 71.46% -272.5%, rgb(15, 22, 48) 0%, rgb(9, 16, 30) 100%), rgb(9, 16, 30);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	flex: 1 0 0%;
	padding: 17px 14px
}

[data-page=tickets] .ticket-option--box::before {
	content: "";
	border-radius: 100px;
	border: 2px solid rgb(18, 26, 44);
	background: rgb(13, 20, 33);
	width: 16px;
	height: 16px
}

[data-page=tickets] .ticket-option--label {
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 17.103px
}

[data-page=tickets] .ticket-option input {
	display: none
}

[data-page=tickets] .ticket-option input:checked~.ticket-option--box {
	border-radius: 15px;
	border: 1px solid var(--Button-Button_Stroke, rgb(255 255 255 / .15));
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	box-shadow: 0 0 3px 0 rgb(5, 60, 255), 0 0 0 1.182px rgb(5, 60, 255);
	padding: 16px 14px;
	cursor: pointer
}

[data-page=tickets] .ticket-option input:checked~.ticket-option--box::before {
	border-color: rgb(209, 209, 209);
	background: rgb(255 255 255 / .21)
}

[data-page=tickets] .ticket-history {
	display: flex;
	flex-direction: column;
	gap: 16px
}

[data-page=tickets] .ticket-history__head {
	color: var(--root-black, rgb(4, 4, 4));
	display: flex;
	align-items: center;
	gap: 19px;
	margin-bottom: 14px
}

[data-page=tickets] .ticket-history__icon {
	font-size: 20px
}

[data-page=tickets] .ticket-history__title {
	font-size: 19px;
	font-weight: 500;
	letter-spacing: -.57px
}

[data-page=tickets] .ticket-item {
	display: flex;
	text-decoration: none;
	border-radius: 15px;
	flex-wrap: wrap;
	border: 1px solid rgb(13, 21, 41);
	background: radial-gradient(362.8% 330.5% at 71.46% -272.5%, rgb(15, 22, 48) 0%, rgb(9, 16, 30) 100%), rgb(11, 16, 26);
	box-shadow: 0 25.688px 51.377px 0 rgb(10 39 83 / .03);
	padding: 14px;
	align-items: center;
	gap: 14px
}

@media(min-width:992px) {
	[data-page=tickets] .ticket-item {
		flex-wrap: nowrap;
		gap: 50px
	}
}

[data-page=tickets] .ticket-item__icon {
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 15px;
	outline: none;
	border: none;
	padding: 0
}

@media(max-width:767.98px) {
	[data-page=tickets] .ticket-item__icon {
		display: none
	}
}

[data-page=tickets] .ticket-item__infos {
	display: flex;
	gap: 14px
}

@media(max-width:767.98px) {
	[data-page=tickets] .ticket-item__infos {
		flex-wrap: wrap;
		width: 100%
	}

	[data-page=tickets] .ticket-item__infos>* {
		flex: 0 0 auto
	}
}

@media(min-width:768px) {
	[data-page=tickets] .ticket-item__infos {
		gap: 20px
	}
}

@media(min-width:992px) {
	[data-page=tickets] .ticket-item__infos {
		gap: 50px
	}
}

[data-page=tickets] .ticket-item__item {
	display: flex;
	flex-direction: column;
	gap: 5px;
	align-items: center
}

[data-page=tickets] .ticket-item__label {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.48px
}

[data-page=tickets] .ticket-item__value {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500
}

[data-page=tickets] .ticket-item__status {
	width: 100%;
	flex: 0 0 100%
}

@media(min-width:992px) {
	[data-page=tickets] .ticket-item__status {
		margin-left: auto;
		width: auto;
		flex: 0 0 auto
	}
}

[data-page=tickets] .ticket-item__status .badge {
	padding: 15px;
	display: flex;
	gap: 14px;
	align-items: center;
	justify-content: center
}

[data-page=tickets] .ticket-item--new {
	border-color: rgb(60 200 213 / .4392156863)
}

[data-page=tickets] .ticket-detail__id {
	margin-bottom: 20px;
	border-radius: 100px;
	border: 1px solid rgb(255 255 255 / .15);
	background: radial-gradient(42.73% 42.73% at 50% 96.36%, rgb(2 28 255 / .93) 0%, rgba(255, 255, 255, 0) 100%, rgba(255, 255, 255, 0) 100%), rgb(5, 60, 255);
	display: inline-flex;
	padding: 11px 16px 10px 10px;
	align-items: center;
	gap: 5px;
	color: rgb(255, 255, 255);
	font-size: 17px;
	font-weight: 500
}

[data-page=tickets] .ticket-detail__id .icon {
	--icon-size: 22px
}

[data-page=tickets] .ticket-detail__title {
	color: rgb(255, 255, 255);
	font-size: 25px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.5px;
	margin-bottom: 0
}

[data-page=tickets] .ticket-detail {
	width: 100%;
	display: flex;
	flex-direction: column
}

[data-page=tickets] .ticket-detail__message.ticket-detail__box {
	display: flex;
	flex-direction: column;
	gap: 10px;
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: radial-gradient(362.8% 330.5% at 71.46% -272.5%, rgb(15, 22, 48) 0%, rgb(9, 16, 30) 100%), rgb(11, 16, 26);
	box-shadow: 0 25.688px 51.377px 0 rgb(10 39 83 / .03);
	flex: 1;
	max-height: calc(100vh - 380px);
	box-shadow: 0 25.688px 51.377px 0 rgb(10 39 83 / .03)
}

@media(max-width:991.98px) {
	[data-page=tickets] .ticket-detail__message.ticket-detail__box {
		margin-top: 10px;
		max-height: calc(var(--vh) - var(--header-fix) - 120px)
	}
}

[data-page=tickets] .ticket-detail__message-body {
	flex: 1;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	padding: 27px
}

[data-page=tickets] .ticket-detail__message-body::-webkit-scrollbar {
	width: 0
}

[data-page=tickets] .ticket-detail__message-body .message-item {
	max-width: 450px;
	width: 100%
}

[data-page=tickets] .ticket-detail__message-body .message-item__box {
	border-radius: 15px 15px 15px 0;
	border: 1px solid rgb(18, 26, 44);
	background: rgb(14, 22, 38);
	padding: 14px 22px;
	color: rgb(255, 255, 255);
	font-size: 15px;
	font-weight: 500;
	line-height: 22px
}

[data-page=tickets] .ticket-detail__message-body .message-item__info {
	padding-top: 14px;
	display: flex;
	gap: 10px;
	align-items: center;
	justify-content: space-between;
	color: rgb(120, 129, 149);
	font-size: 15px;
	font-weight: 500;
	line-height: 32px
}

[data-page=tickets] .ticket-detail__message-body .message-item__image {
	border: 1px solid var(--stroke-color, rgb(25, 27, 33));
	border-radius: 10px;
	padding: 4px;
	background: var(--card-bg-inner-color, rgb(12, 17, 25));
	transition: .14s ease all;
	cursor: pointer
}

[data-page=tickets] .ticket-detail__message-body .message-item__images {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	padding-top: 10px
}

[data-page=tickets] .ticket-detail__message-body .message-item__image:hover {
	border-color: var(--button-button-stroke, rgb(255 255 255 / .15))
}

[data-page=tickets] .ticket-detail__message-body .message-item__image:hover img {
	transform: scale(1.1)
}

[data-page=tickets] .ticket-detail__message-body .message-item__image img {
	height: 40px;
	width: 40px;
	border-radius: 6px;
	transition: .14s ease;
	object-fit: cover
}

[data-page=tickets] .ticket-detail__message-body .message-item.message-item-user {
	align-self: flex-end
}

[data-page=tickets] .ticket-detail__message-body .message-item.message-item-user .message-item__box {
	border-radius: 15px 15px 0 15px;
	background: rgb(5, 60, 255);
	border-color: rgb(5, 60, 255);
	color: rgb(255, 255, 255)
}

[data-page=tickets] .ticket-detail__footer {
	border: 1px solid rgb(13, 21, 41);
	border-radius: 0 0 25px 25px;
	background: radial-gradient(362.8% 330.5% at 71.46% -272.5%, rgb(15, 22, 48) 0%, rgb(9, 16, 30) 100%), rgb(11, 16, 26);
	padding: 10px 20px
}

[data-page=tickets] .ticket-detail__footer:focus-within {
	border-color: rgb(19, 31, 66)
}

[data-page=tickets] .ticket-detail__footer .message-send {
	width: 100%;
	display: flex;
	gap: 10px;
	align-items: center
}

[data-page=tickets] .ticket-detail__footer .message-send.disabled {
	opacity: .4;
	pointer-events: none;
	user-select: none
}

[data-page=tickets] .ticket-detail__footer .message-send .attach {
	width: 56px;
	height: 56px
}

[data-page=tickets] .ticket-detail__footer .message-send textarea {
	min-height: 1lh;
	border: none;
	outline: none;
	background: rgba(255, 255, 255, 0)
}

[data-page=tickets] .ticket-detail__footer .message-send textarea:focus {
	outline: none;
	box-shadow: none;
	border: none
}

[data-page=tickets] .ticket-detail__footer .message-send .btn-text {
	display: none
}

@media(min-width:576px) {
	[data-page=tickets] .ticket-detail__footer .message-send .btn-text {
		display: block
	}
}

#create-ticket.loading {
	position: relative
}

#create-ticket.loading::before {
	position: absolute;
	left: -4px;
	top: -4px;
	content: "";
	width: calc(100% + 8px);
	height: calc(100% + 8px);
	background-color: rgb(255 255 255 / .7);
	z-index: 1000
}

#create-ticket.loading::after {
	content: "";
	left: 50%;
	top: 50%;
	position: absolute;
	transform: translate(-50%, -50%);
	width: 100px;
	height: 100px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 width=%2724%27 height=%2724%27%3E%3Cpath d=%27M18.364 5.63604L16.9497 7.05025C15.683 5.7835 13.933 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19C15.866 19 19 15.866 19 12H21C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C14.4853 3 16.7353 4.00736 18.364 5.63604Z%27 fill=%27rgba%28255,255,255,1%29%27%3E%3C/path%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: 44px 44px;
	background-position: center;
	z-index: 1001;
	animation: grindup-ticket-loader-spin 1s linear infinite;
	transform-origin: top left
}

@keyframes grindup-ticket-loader-spin {
	0% {
		transform: rotate(0deg) translate(-50%, -50%)
	}

	100% {
		transform: rotate(360deg) translate(-50%, -50%)
	}
}

.tickets-uploader {
	position: relative;
	height: 100%
}

.tickets-uploader #uploader-button {
	height: 56px;
	width: 56px;
	border-radius: 15px;
	border: 1px solid rgb(21, 29, 49) !important;
	background: rgb(14, 22, 38) !important;
	outline: none;
	display: flex;
	align-items: center;
	justify-content: center
}

.tickets-uploader #uploader-button svg {
	fill: rgb(255, 255, 255)
}

.tickets-uploader #uploader-button:hover {
	border-color: rgb(5, 60, 255) !important
}

.tickets-uploader #uploader-button a {
	color: rgb(4, 4, 4)
}

.tickets-uploader #uploader-button span {
	display: none
}

.tickets-uploader .files-wrapper {
	display: flex;
	gap: 4px;
	flex-direction: column
}

.tickets-uploader .files-wrapper .files-item {
	font-size: 0;
	padding: 6px 0 6px 14px;
	border-radius: 5px;
	background: var(--card-bg-color, rgb(12, 17, 25));
	border: 1px solid var(--stroke-color, rgb(25, 27, 33));
	max-width: 130px
}

.tickets-uploader .files-wrapper .files-item a {
	font-size: 14px;
	color: rgb(255, 255, 255);
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

[data-page=affiliates] .affiliate-card {
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: linear-gradient(0deg, rgb(9, 16, 30) 0%, rgb(9, 16, 30) 100%), rgb(255, 255, 255)
}

[data-page=affiliates] .affiliate-card--top {
	display: flex;
	padding: 30px 38px 30px 38px;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px
}

@media(max-width:767.98px) {
	[data-page=affiliates] .affiliate-card--top {
		padding: 20px;
		gap: 20px
	}

	[data-page=affiliates] .affiliate-card--top>* {
		flex: 0 0 calc(50% - 10px)
	}
}

[data-page=affiliates] .affiliate-card .seperator {
	height: 80px;
	width: 1px;
	background: rgb(13, 21, 41)
}

@media(max-width:767.98px) {
	[data-page=affiliates] .affiliate-card .seperator {
		display: none
	}
}

[data-page=affiliates] .affiliate-card--item {
	border-radius: 25px 25px 0 0;
	background: linear-gradient(0deg, rgb(9, 16, 30) 0%, rgb(9, 16, 30) 100%), rgb(255, 255, 255);
	display: flex;
	flex-direction: column;
	gap: 10px;
	position: relative
}

[data-page=affiliates] .affiliate-card--item .title {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 500;
	line-height: 25px
}

[data-page=affiliates] .affiliate-card--item .value {
	color: rgb(255, 255, 255);
	font-size: 25px;
	font-style: normal;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.054px
}

[data-page=affiliates] .affiliate-card--bottom {
	border-top: 1px solid rgb(13, 21, 41);
	display: flex;
	padding: 22px 32px 23px 27px;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap
}

[data-page=affiliates] .affiliate-card--url {
	border: 1px solid rgb(21, 29, 49);
	background: rgb(14, 22, 38);
	display: flex;
	flex-wrap: wrap;
	padding: 5px 20px 5px 5px;
	align-items: center;
	gap: 15px;
	max-width: 540px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 160%;
	letter-spacing: -.32px;
	border-radius: 100px
}

@media(max-width:767.98px) {
	[data-page=affiliates] .affiliate-card--url {
		border-radius: 20px;
		flex-wrap: nowrap;
		width: 100%;
		max-width: 100%
	}

	[data-page=affiliates] .affiliate-card--url .btn {
		width: 44px;
		height: 44px;
		flex: 0 0 44px;
		border-radius: 5px;
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center
	}

	[data-page=affiliates] .affiliate-card--url .btn .text {
		display: none
	}
}

[data-page=affiliates] .affiliate-card--payout {
	margin-left: auto
}

@media(max-width:767.98px) {
	[data-page=affiliates] .affiliate-card--payout {
		margin-left: 0;
		width: 100%
	}

	[data-page=affiliates] .affiliate-card--payout .btn {
		width: 100%;
		display: flex;
		justify-content: center
	}
}

.custom-head {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 48px 0
}

.custom-head--title {
	color: rgb(254, 255, 255);
	font-size: 35px;
	font-weight: 500;
	line-height: 44px;
	letter-spacing: -.7px;
	margin: 0
}

.custom-head--text {
	color: rgb(120, 129, 149);
	font-size: 18px;
	font-weight: 0;
	line-height: 25px;
	margin: 0
}

.custom-box {
	padding: 20px;
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.28px
}

@media(min-width:768px) {
	.custom-box {
		padding: 30px
	}
}

@media(min-width:992px) {
	.custom-box {
		padding: 40px
	}
}

@media(min-width:1200px) {
	.custom-box {
		padding: 50px
	}
}

[data-page=childpanel] .child-top {
	border-radius: 45px;
	background: linear-gradient(0deg, rgb(9, 16, 30) 0%, rgb(9, 16, 30) 100%), rgb(255, 255, 255);
	display: flex;
	padding: 12px 16px 13px 12px;
	align-items: center;
	gap: 20px;
	flex-direction: row;
	flex-wrap: wrap
}

@media(max-width:991.98px) {
	[data-page=childpanel] .child-top {
		border-radius: 30px
	}
}

[data-page=childpanel] .child-top--copy {
	display: flex;
	padding: 5px 20px 5px 5px;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px;
	border-radius: 100px;
	border: 1px solid rgb(21, 29, 49);
	background: rgb(14, 22, 38)
}

[data-page=childpanel] .child-top--copy .link {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: 160%;
	margin-left: auto
}

@media(max-width:991.98px) {
	[data-page=childpanel] .child-top--copy {
		flex: 1;
		width: 100%
	}
}

@media(max-width:767.98px) {
	[data-page=childpanel] .child-top--copy {
		border-radius: 20px
	}

	[data-page=childpanel] .child-top--copy>* {
		flex: 0 0 100%;
		width: 100%
	}

	[data-page=childpanel] .child-top--copy .link {
		padding: 14px 0 20px;
		text-align: center
	}
}

[data-page=childpanel] .child-top--button {
	margin-left: auto
}

@media(max-width:991.98px) {
	[data-page=childpanel] .child-top--button {
		margin-left: 0;
		width: 100%;
		justify-content: center
	}
}

[data-page=childpanel] .child-action {
	border-radius: 100px;
	border: 1px solid rgb(0 99 142 / .1);
	background: radial-gradient(362.8% 330.5% at 71.46% -272.5%, rgb(15, 22, 48) 0%, rgb(9, 16, 30) 100%), rgb(255, 255, 255);
	box-shadow: 0 15.11px 59.06px 0 rgb(0 0 0 / .03);
	display: flex;
	padding: 7px 9px 7px 17px;
	align-items: center;
	gap: 20px
}

[data-page=childpanel] .child-action>.icon {
	--icon-size: 40px;
	padding: 6px;
	border-radius: 15px;
	background: rgb(1 57 255 / .1);
	color: rgb(5, 60, 255)
}

[data-page=childpanel] .child-action--btn {
	margin-left: auto
}

[data-page=childpanel] .child-header {
	display: flex;
	gap: 16px;
	align-items: center;
	margin-top: 44px;
	margin-bottom: 36px
}

[data-page=childpanel] .child-header .icon {
	--icon-size: 40px;
	padding: 6px;
	border-radius: 15px;
	background: rgb(1 57 255 / .1);
	color: rgb(5, 60, 255)
}

[data-page=childpanel] .child-header .title {
	color: rgb(255, 255, 255);
	font-size: 18px;
	font-weight: 500;
	line-height: 24px;
	margin: 0
}

[data-page=childpanel] .child-list {
	display: flex;
	flex-direction: column;
	gap: 20px
}

[data-page=childpanel] .child-item {
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30)
}

[data-page=childpanel] .child-item_top {
	display: flex;
	padding: 16px 20px;
	gap: 20px
}

[data-page=childpanel] .child-item .item-domain {
	color: rgb(255, 255, 255);
	font-size: 19px;
	font-weight: 500;
	line-height: 160%;
	letter-spacing: -.38px
}

[data-page=childpanel] .child-item .item-login {
	margin-left: auto
}

[data-page=childpanel] .child-item_bottom {
	display: flex;
	padding: 15px 21px 15px 25px;
	align-items: center;
	gap: 20px;
	border-top: 1px solid rgb(13, 21, 41)
}

[data-page=childpanel] .child-item .item-expiry span {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -.32px
}

[data-page=childpanel] .child-item .item-expiry span:nth-child(2) {
	color: rgb(120, 129, 149)
}

[data-page=childpanel] .child-item .item-btns {
	margin-left: auto
}

.blog-page .card {
	overflow: hidden;
	border-radius: 25px;
	display: flex;
	padding: 10px 10px 25px 10px;
	flex-direction: column;
	align-items: center;
	gap: 28px
}

.blog-page .card .blog-image {
	width: 100%;
	padding-top: 65%;
	position: relative;
	background-color: rgb(5, 60, 255);
	border-radius: 10px;
	overflow: hidden;
	color: rgb(75, 112, 246)
}

.blog-page .card .blog-image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s ease-in-out
}

.blog-page .card .blog-image span {
	color: var(--label-default-border, rgb(174, 200, 215));
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	font-size: 24px;
	font-weight: 600;
	user-select: none;
	pointer-events: none
}

.blog-page .card .blog-content {
	padding: 0 14px;
	display: flex;
	flex-direction: column;
	gap: 15px
}

.blog-page .card .blog-title {
	font-size: 19px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.38px;
	color: rgb(254, 255, 255);
	margin: 0
}

.blog-page .card .blog-title a {
	color: rgb(254, 255, 255);
	text-decoration: none
}

.blog-page .card .blog-text {
	color: rgb(120, 129, 149);
	font-size: 14px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.28px;
	margin: 0
}

.blog-page .card .blog-bottom {
	display: flex;
	align-items: center;
	gap: 20px
}

.blog-page .card .blog-date {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: -.32px
}

.blog-page .card .blog-readmore {
	margin-left: auto;
	color: rgb(255, 255, 255);
	text-decoration: none;
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: -.14px;
	display: flex;
	gap: 10px
}

.blog-page .card .blog-readmore .icon {
	--icon-size: 22px;
	transition: .14s ease
}

.blog-page .card .blog-readmore:hover .icon {
	transform: translateX(6px)
}

.blog-single {
	display: flex;
	flex-direction: column
}

.blog-single .blog-head {
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: center;
	text-align: center;
	margin-bottom: 40px
}

.blog-single .blog-head .title {
	color: rgb(254, 255, 255);
	font-size: 35px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.7px;
	margin: 0
}

.blog-single .blog-head .date {
	color: rgb(120, 129, 149);
	font-size: 16px;
	font-weight: 500;
	line-height: 25px;
	letter-spacing: -.32px
}

.blog-single .blog-image {
	border-radius: 15px;
	border: 1px solid rgb(11, 22, 47);
	background: radial-gradient(77.87% 74.89% at 99.57% 106.76%, rgb(30 54 119 / .2) 0%, rgb(6 11 26 / .2) 100%), linear-gradient(0deg, rgb(8, 14, 27) 0%, rgb(8, 14, 27) 100%), rgb(255, 255, 255);
	width: 100%;
	padding-top: 36%;
	position: relative;
	overflow: hidden;
	margin-bottom: 60px
}

.blog-single .blog-image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover
}

.blog-single .blog-content .blog-text {
	color: rgb(254, 255, 255);
	font-size: 16px;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: -.32px;
	display: flex;
	flex-direction: column;
	gap: 30px
}

.blog-single .blog-content .blog-text p {
	margin: 0
}

.blog-single .blog-content .blog-text a {
	color: rgb(254, 255, 255);
	text-decoration: underline
}

.blog-single .blog-content .blog-text a:hover {
	color: rgb(254, 255, 255);
	text-decoration: none
}

.blog-single .blog-content .blog-text img {
	width: 100%;
	border-radius: 15px;
	margin-bottom: 20px
}

.blog-single .blog-content .blog-text ul {
	padding-left: 20px
}

.blog-single .blog-content .blog-text ol {
	padding-left: 20px
}

.blog-single .blog-content .blog-text blockquote {
	padding: 20px;
	border-radius: 15px;
	background: rgb(8, 14, 27);
	color: rgb(254, 255, 255);
	font-size: 16px;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: -.32px
}

.blog-single .blog-content .blog-text blockquote p {
	margin: 0
}

.blog-single .blog-content .blog-text blockquote p::before {
	content: open-quote
}

.blog-single .blog-content .blog-text blockquote p::after {
	content: close-quote
}

.blog-single .blog-content .blog-text blockquote p::before,
.blog-single .blog-content .blog-text blockquote p::after {
	color: rgb(254, 255, 255);
	font-size: 40px;
	line-height: 0;
	margin-right: 10px
}

.blog-single .blog-content .blog-text h1,
.blog-single .blog-content .blog-text .h1,
.blog-single .blog-content .blog-text h2,
.blog-single .blog-content .blog-text .h2,
.blog-single .blog-content .blog-text h3,
.blog-single .blog-content .blog-text .h3,
.blog-single .blog-content .blog-text h4,
.blog-single .blog-content .blog-text .h4,
.blog-single .blog-content .blog-text h5,
.blog-single .blog-content .blog-text .h5,
.blog-single .blog-content .blog-text h6,
.blog-single .blog-content .blog-text .h6 {
	color: rgb(254, 255, 255);
	font-size: 35px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: -.7px;
	margin: 0
}

.blog-single .blog-content .blog-text h1,
.blog-single .blog-content .blog-text .h1 {
	font-size: 35px;
	line-height: 35px;
	letter-spacing: -.7px
}

.blog-single .blog-content .blog-text h2,
.blog-single .blog-content .blog-text .h2 {
	font-size: 30px;
	line-height: 30px;
	letter-spacing: -.6px
}

.blog-single .blog-content .blog-text h3,
.blog-single .blog-content .blog-text .h3 {
	font-size: 25px;
	line-height: 25px;
	letter-spacing: -.5px
}

.blog-single .blog-content .blog-text h4,
.blog-single .blog-content .blog-text .h4 {
	font-size: 20px;
	line-height: 20px;
	letter-spacing: -.4px
}

.blog-single .blog-content .blog-text h5,
.blog-single .blog-content .blog-text .h5 {
	font-size: 18px;
	line-height: 18px;
	letter-spacing: -.36px
}

.blog-single .blog-content .blog-text h6,
.blog-single .blog-content .blog-text .h6 {
	font-size: 16px;
	line-height: 16px;
	letter-spacing: -.32px
}

.blog-single .blog-content .blog-text p {
	margin: 0
}

.blog-single .blog-content .blog-text a {
	color: rgb(254, 255, 255);
	text-decoration: underline
}

.blog-single .blog-content .blog-text a:hover {
	color: rgb(254, 255, 255);
	text-decoration: none
}

.blog-single .blog-content .blog-text img {
	width: 100%;
	border-radius: 15px;
	margin-bottom: 20px
}

.blog-single .blog-content .blog-text ul {
	padding-left: 20px
}

.blog-single .blog-content .blog-text ol {
	padding-left: 20px
}

.blog-single .blog-content .blog-text blockquote {
	padding: 20px;
	border-radius: 15px;
	background: rgb(8, 14, 27);
	color: rgb(254, 255, 255);
	font-size: 16px;
	font-weight: 400;
	line-height: 25px;
	letter-spacing: -.32px
}

.blog-single .blog-content .blog-text blockquote p {
	margin: 0
}

.blog-single .blog-content .blog-text blockquote p::before {
	content: open-quote
}

.blog-single .blog-content .blog-text blockquote p::after {
	content: close-quote
}

.blog-single .blog-content .blog-text blockquote p::before,
.blog-single .blog-content .blog-text blockquote p::after {
	color: rgb(254, 255, 255);
	font-size: 40px;
	line-height: 0;
	margin-right: 10px
}

[data-page=api] table {
	border-color: rgb(21, 39, 85);
	color: rgb(255, 255, 255);
	background-color: rgba(255, 255, 255, 0)
}

[data-page=api] .table,
[data-page=api] .table th,
[data-page=api] .table td {
	background-color: rgba(255, 255, 255, 0)
}

[data-page=api] .table th {
	color: rgb(255 255 255 / .7568627451)
}

[data-page=api] .table td {
	color: rgb(255, 255, 255)
}

[data-page=api] .card {
	border-radius: 15px;
	box-shadow: 0 15.11px 59.06px 0 rgb(0 0 0 / .03)
}

[data-page=api] .card-header {
	background-color: rgba(255, 255, 255, 0);
	border-bottom: 1px solid rgb(13, 21, 41);
	padding: 6px 6px 6px 30px
}

[data-page=api] .card-header:not(:has(.form-select)) {
	padding: 20px 30px
}

[data-page=api] .card-header .form-select {
	width: 100%;
	max-width: auto;
	min-width: 220px;
	margin-left: auto;
	margin-right: 0;
	margin-bottom: 0;
	margin-top: 0
}

[data-page=api] .card-body {
	padding: 30px
}

[data-page=api] pre {
	border-radius: 20px;
	border: 1px solid rgb(22, 37, 79);
	background: rgb(9, 16, 30);
	padding: 20px;
	margin-bottom: 20px;
	font-size: 14px;
	font-weight: 400;
	line-height: 25px;
	color: rgb(137, 143, 159)
}

[data-page=api] pre .grindup-json-key {
	color: rgb(101, 114, 149)
}

[data-page=api] pre .grindup-json-string {
	color: rgb(9, 164, 122)
}

[data-page=api] pre .grindup-json-number {
	color: rgb(255, 177, 25)
}

[data-page=api] pre .grindup-json-boolean {
	color: rgb(229, 78, 78)
}

.api-overview {
	min-height: 100%;
	display: flex;
	gap: 10px;
	flex-direction: column;
	justify-content: space-between;
	padding: 25px
}

.api-overview_label {
	font-size: 14px;
	font-weight: 500;
	color: rgb(255 255 255 / .737254902)
}

.api-overview_value {
	color: rgb(255, 255, 255);
	font-size: 16px
}

.api-overview-method .api-overview_value,
.api-overview-format .api-overview_value {
	font-size: 24px;
	font-weight: 600;
	color: rgb(255, 177, 25)
}

.api-title {
	font-size: 20px;
	font-weight: 400;
	color: rgb(255, 255, 255);
	margin-bottom: 20px;
	margin-bottom: 0;
	letter-spacing: -.3px
}

[data-grindup=marquee] {
	display: flex;
	overflow: hidden;
	max-width: 100%
}

[data-grindup=marquee] .marquee__inner {
	display: flex;
	align-items: center;
	flex-wrap: nowrap
}

:root {
	--grindup-ss-overlay-bg: rgba(0, 0, 0, 0.5);
	--grindup-ss-bg: rgb(8, 14, 27);
	--grindup-ss-border-color: rgb(13, 22, 42);
	--grindup-ss-border-radius: 25px;
	--grindup-ss-border-width: 1px;
	--grindup-ss-text: rgb(255, 255, 255);
	--grindup-ss-text-secondary: rgb(255, 255, 255);
	--grindup-ss-text-muted: rgb(120, 129, 149);
	--grindup-ss-primary-color: rgb(5, 60, 255);
	--grindup-ss-primary-color-rgb: 0, 131, 255;
	--grindup-ss-header-height: 60px;
	--grindup-animation-duration: .2s
}

@keyframes grindup-ss-spin {
	0% {
		transform: rotate(0deg)
	}

	100% {
		transform: rotate(359deg)
	}
}

@keyframes grindup-ss-heartbeat {
	0% {
		transform: scale(1)
	}

	50% {
		transform: scale(1.2)
	}

	100% {
		transform: scale(1)
	}
}

@keyframes grindup-ss-open {
	0% {
		transform: translateY(40px);
		opacity: 0
	}

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

.grindup-ss {
	display: none
}

.grindup-ss-open {
	display: block
}

.grindup-ss-open .grindup-ss-card {
	animation: grindup-ss-open .2s ease
}

.grindup-ss-spin {
	animation: grindup-ss-spin 1s linear infinite
}

.grindup-ss-heartbeat {
	animation: grindup-ss-heartbeat 1s linear infinite
}

.grindup-ss-close-btn {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	margin: 0;
	cursor: pointer;
	color: var(--grindup-ss-primary-color);
	background-color: rgba(var(--grindup-ss-primary-color-rgb), .1);
	transition: .14s ease
}

.grindup-ss-close-btn-outer {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-right: 10px;
	flex: 0 0 44px
}

.grindup-ss-close-btn svg {
	width: 24px;
	height: 24px;
	fill: var(--grindup-ss-primary-color)
}

.grindup-ss-close-btn:hover {
	background-color: rgba(var(--grindup-ss-primary-color-rgb), .2)
}

.grindup-ss-close-btn:focus,
.grindup-ss-close-btn:active {
	box-shadow: 0 0 0 .25rem rgba(var(--grindup-ss-primary-color-rgb), .2)
}

.grindup-ss-overlay {
	background-color: var(--grindup-ss-overlay-bg);
	bottom: 0;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 4000;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px)
}

.grindup-ss-container {
	display: flex;
	flex-direction: column;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	justify-content: center;
	margin: 0 auto;
	max-width: 100%;
	padding: 0;
	z-index: 4001
}

@media(min-width:576px) {
	.grindup-ss-container {
		padding: 15px
	}
}

.grindup-ss-card {
	width: 100%;
	height: 100%;
	background-color: var(--grindup-ss-bg);
	border-color: var(--grindup-ss-border-color);
	color: var(--grindup-ss-color);
	margin: auto;
	display: flex
}

@media screen and (min-width:576px) {
	.grindup-ss-card {
		border-radius: var(--grindup-ss-border-radius);
		border-style: solid;
		border-width: var(--grindup-ss-border-width);
		max-width: 1000px;
		max-height: calc(100vh - 90px)
	}
}

.grindup-ss-card-inner {
	flex: 1;
	height: 100%;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	position: relative
}

.grindup-ss-card-header {
	display: flex;
	transition: var(--grindup-animation-duration) ease;
	border-bottom: 1px solid var(--grindup-ss-border-color)
}

.grindup-ss-card-body {
	flex: 1;
	overflow-y: auto;
	transition: var(--grindup-animation-duration) ease;
	padding: 10px
}

.grindup-ss-search-icon {
	height: 54px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-left: 15px
}

.grindup-ss-search-icon_icon {
	position: relative
}

.grindup-ss-search-icon_icon svg {
	width: 24px;
	height: 24px;
	fill: var(--grindup-ss-text-muted)
}

.grindup-ss-search-input {
	height: var(--grindup-ss-header-height);
	font-weight: 700;
	font-size: 20px;
	border-radius: none;
	border: none;
	outline: none;
	background-color: rgba(255, 255, 255, 0);
	flex: 1;
	padding: 0 18px;
	color: var(--grindup-ss-text)
}

.grindup-ss-search-input::placeholder {
	color: var(--grindup-ss-text-muted)
}

.grindup-ss-service {
	padding: 10px 20px 10px 10px;
	cursor: pointer;
	transition: .14s ease;
	border-radius: 15px;
	border: 1px solid rgb(13, 22, 42);
	background: rgb(11, 17, 33)
}

.grindup-ss-service:hover {
	background-color: var(--bg-color-2)
}

.grindup-ss-service-name {
	color: rgb(255, 255, 255);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 30px;
	display: flex;
	align-items: center;
	gap: 10px
}

.grindup-ss-service-footer {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap
}

@media screen and (max-width:576px) {
	.grindup-ss-service-footer {
		gap: 6px
	}
}

.grindup-ss-service-footer_item {
	display: flex;
	align-items: center;
	gap: 3px
}

.grindup-ss-service-footer_item .label .label-text {
	white-space: nowrap
}

.grindup-ss-service-footer_item-title {
	font-size: 14px;
	color: var(--grindup-ss-text-muted)
}

.grindup-ss-service-footer_item-value {
	font-size: 14px;
	color: var(--grindup-ss-text);
	font-weight: 500
}

.grindup-ss-service+.grindup-ss-service {
	margin-top: 10px
}

.grindup-ss-highlight {
	background-color: rgba(var(--grindup-ss-primary-color-rgb), .1)
}

.grindup-ss-no-result {
	padding: 24px;
	display: flex;
	width: 100%;
	flex-direction: column;
	gap: 14px
}

.grindup-ss-no-result-text {
	font-size: 16px;
	color: var(--grindup-ss-text-secondary);
	text-align: center
}

.grindup-ss-detail {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: var(--grindup-animation-duration) ease;
	transition-delay: var(--grindup-animation-duration)
}

.grindup-ss-detail-header {
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid var(--grindup-ss-border-color);
	min-height: var(--grindup-ss-header-height);
	gap: 15px;
	align-items: center
}

.grindup-ss-detail-title {
	flex: 1;
	font-size: 20px;
	font-weight: 500;
	color: var(--grindup-ss-text);
	margin-bottom: 0
}

.grindup-ss-detail-go-back {
	cursor: pointer;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center
}

.grindup-ss-detail-go-back_button {
	width: 38px;
	height: 38px;
	border-radius: 8px;
	background-color: rgba(var(--grindup-ss-primary-color-rgb), .1);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: .14s ease;
	outline: none;
	border: none;
	padding: 0
}

.grindup-ss-detail-go-back_button svg {
	width: 28px;
	height: 28px;
	fill: var(--grindup-ss-primary-color)
}

.grindup-ss-detail-body {
	flex: 1;
	overflow-y: auto;
	padding: 24px;
	gap: 15px;
	display: flex;
	flex-direction: column
}

.grindup-ss-detail-name {
	font-size: 20px;
	font-weight: 500;
	color: var(--grindup-ss-text);
	font-weight: 500;
	text-align: center
}

.grindup-ss-detail-items {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 15px
}

.grindup-ss-detail-item {
	padding: 12px;
	display: flex;
	gap: 4px;
	border-radius: 4px;
	border: 1px solid var(--grindup-ss-border-color);
	font-size: 14px
}

.grindup-ss-detail-item-title {
	color: var(--grindup-ss-text-muted)
}

.grindup-ss-detail-item-value {
	margin-left: auto;
	color: var(--grindup-ss-text);
	font-weight: 500
}

.grindup-ss-detail-description {
	font-size: 16px;
	color: var(--grindup-ss-text-secondary);
	border: 1px solid var(--grindup-ss-border-color);
	border-radius: 4px;
	padding: 12px
}

.grindup-ss[data-state=detail] .grindup-ss-detail {
	transform: translateX(0)
}

.grindup-ss[data-state=detail] .grindup-ss-card-header {
	transform: translateY(-100%)
}

.grindup-ss[data-state=detail] .grindup-ss-card-body {
	transform: translateY(100%)
}

.grindup-modal {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 2000;
	align-items: center;
	justify-content: center;
	display: none
}

.grindup-modal.active {
	display: flex
}

.grindup-modal.grindup-modal-drawer .grindup-modal__card {
	position: fixed;
	right: 0;
	top: 0;
	bottom: 0;
	border-radius: 0;
	border-width: 0 1px 0 0;
	animation: grindup-modal-from-right .2s ease forwards
}

@media(min-width:991.98px) {
	.grindup-modal.grindup-modal-drawer .grindup-modal__card {
		right: 10px;
		top: 10px;
		bottom: 10px;
		border-radius: 25px
	}
}

.grindup-modal::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(0 0 0 / .5019607843);
	opacity: 1;
	z-index: -1;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px)
}

.grindup-modal.grindup-modal-sm .grindup-modal__card {
	max-width: 400px
}

.grindup-modal.grindup-modal-lg .grindup-modal__card {
	max-width: 800px
}

.grindup-modal.grindup-modal-xl .grindup-modal__card {
	max-width: 1200px
}

.grindup-modal__card {
	border-radius: 25px;
	border: 1px solid rgb(13, 21, 41);
	background: rgb(9, 16, 30);
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
	max-width: 640px;
	width: 100%;
	height: auto;
	max-height: 80vh;
	max-height: -webkit-fill-available;
	animation: grindup-modal-to-top .3s ease forwards
}

.grindup-modal__header {
	display: flex;
	align-items: center;
	border-radius: 20px;
	background: rgb(14, 22, 38);
	margin: 22px 22px 0;
	min-height: 60px;
	padding: 13px 25px
}

.grindup-modal__close {
	margin-left: auto;
	margin-right: -10px;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer
}

.grindup-modal__body {
	flex: 1;
	padding: 0 28px 22px;
	overflow-y: auto;
	width: 100%
}

.grindup-modal__footer {
	padding: 0 22px 22px
}

@keyframes grindup-modal-to-top {
	0% {
		opacity: 0;
		transform: scale(1.2)
	}

	100% {
		opacity: 1;
		transform: scale(1)
	}
}

@keyframes grindup-modal-from-right {
	0% {
		opacity: .6;
		transform: translateX(100%)
	}

	100% {
		opacity: 1;
		transform: translateX(0)
	}
}

:root {
	--actulus-selectbox-bg-color: rgb(7, 12, 24);
	--actulus-selectbox-border-color: rgb(21, 34, 69);
	--actulus-selectbox-primary: rgb(5, 60, 255);
	--actulus-selectbox-primary-rgb: 0, 131, 255;
	--actulus-selectbox-border-radius: 15px;
	--actulus-selectbox-options-padding: 4px;
	--actulus-selectbox-options-gap: 5px;
	--actulus-selectbox-option-padding: 6px 14px;
	--actulus-selectbox-text: rgb(255, 255, 255);
	--actulus-selectbox-muted: var(--text-disabled, rgb(120, 129, 149));
	--actulus-selectbox-muted-rgb: 108, 117, 125;
	--actulus-selectbox-disabled: var(--text-disabled);
	--actulus-selectbox-shadow: 0 0px 1px rgba(0, 0, 0, .2)
}

.actulus-selectbox {
	position: relative;
	width: 100%
}

.actulus-selectbox_selected .actulus-selectbox_label {
	animation: actulus-selectbox-selected-label 1s ease
}

.actulus-selectbox_label,
.actulus-selectbox .actulus-selectbox>.actulus-selectbox_label {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	text-align: left;
	width: 100%;
	gap: 10px;
	padding: 13px;
	max-height: 50px
}

.actulus-selectbox_label .actulus-selectbox_option-text,
.actulus-selectbox .actulus-selectbox>.actulus-selectbox_label .actulus-selectbox_option-text {
	flex: 1;
	width: 100px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis
}

.actulus-selectbox_label .actulus-selectbox_option-icon,
.actulus-selectbox .actulus-selectbox>.actulus-selectbox_label .actulus-selectbox_option-icon {
	border-radius: 15px;
	background-color: var(--actulus-selectbox-primary);
	color: rgb(255, 255, 255);
	margin-left: -5px
}

[dir=rtl] .actulus-selectbox_label .actulus-selectbox_option-icon,
[dir=rtl] .actulus-selectbox .actulus-selectbox>.actulus-selectbox_label .actulus-selectbox_option-icon {
	margin-left: 0;
	margin-right: -5px
}

.actulus-selectbox_label .actulus-selectbox_option-icon img,
.actulus-selectbox .actulus-selectbox>.actulus-selectbox_label .actulus-selectbox_option-icon img {
	width: auto;
	height: 22px
}

.actulus-selectbox_search {
	width: calc(100% - 8px);
	border: none;
	outline: none;
	box-shadow: none;
	background-color: rgba(255, 255, 255, 0);
	transition: .14s ease;
	top: 0;
	border-radius: 10px;
	border: 1px solid rgb(25, 33, 64);
	background: rgb(17, 23, 45);
	margin: 4px;
	padding: 5px 10px 5px 10px;
	min-height: 40px;
	gap: 10px;
	position: sticky;
	z-index: 100;
	display: flex;
	align-items: center
}

.actulus-selectbox_search:focus-within svg {
	fill: var(--actulus-selectbox-primary)
}

.actulus-selectbox_search-icon {
	width: 20px;
	height: 20px;
	height: auto;
	text-align: start
}

.actulus-selectbox_search-icon svg {
	height: 17px;
	fill: var(--actulus-selectbox-muted)
}

.actulus-selectbox_search>input {
	border: none;
	outline: none;
	box-shadow: none;
	background-color: rgba(255, 255, 255, 0);
	flex: 1;
	width: 100%;
	height: 19px
}

.actulus-selectbox_close {
	position: absolute;
	width: 32px;
	height: 32px;
	padding: 0;
	border: none;
	outline: none;
	right: -10px;
	top: -10px;
	border-radius: 50%;
	background-color: var(--actulus-selectbox-primary);
	color: rgb(255, 255, 255);
	display: none;
	align-items: center;
	justify-content: center;
	cursor: pointer
}

.actulus-selectbox_auto-width .actulus-selectbox_options-bg {
	float: left;
	width: auto;
	min-width: 100%
}

.actulus-selectbox_options-outer {
	display: none;
	top: calc(100% + 14px);
	position: absolute;
	background-color: var(--actulus-selectbox-bg-color);
	border: 1px solid var(--actulus-selectbox-border-color);
	border-radius: var(--actulus-selectbox-border-radius);
	box-shadow: var(--actulus-selectbox-shadow);
	z-index: 200;
	width: 100%;
	overflow: hidden;
	flex-direction: column
}

.actulus-selectbox_options-wrapper {
	flex: 1;
	position: relative;
	gap: var(--actulus-selectbox-options-gap);
	padding: var(--actulus-selectbox-options-padding);
	overflow-y: auto
}

.actulus-selectbox_options-wrapper::-webkit-scrollbar {
	width: 4px
}

.actulus-selectbox_scroll-timeline {
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 300;
	pointer-events: none;
	transition: .14s ease;
	background: linear-gradient(0deg, rgba(var(--actulus-selectbox-primary-rgb), 0) 0%, rgba(var(--actulus-selectbox-primary-rgb), .2) 100%);
	transition: .1s ease;
	height: 0;
	opacity: 0
}

.actulus-selectbox_scroll-timeline-bottom {
	background: linear-gradient(180deg, rgba(var(--actulus-selectbox-primary-rgb), 0) 0%, rgba(var(--actulus-selectbox-primary-rgb), .2) 100%)
}

.actulus-selectbox_scroll-timeline-visible {
	height: 32px;
	opacity: 1
}

.actulus-selectbox_option {
	width: 100%;
	border: none;
	outline: none;
	box-shadow: none;
	background-color: rgba(255, 255, 255, 0);
	display: flex;
	align-items: center;
	padding: 5px 10px;
	color: var(--actulus-selectbox-text);
	border-radius: 10px;
	text-align: left;
	gap: 10px;
	min-height: 40px;
	position: relative;
	border: 1px solid rgba(255, 255, 255, 0)
}

.actulus-selectbox_option-highlight {
	background-color: rgba(var(--actulus-selectbox-primary-rgb), .3);
	font-weight: 600
}

.actulus-selectbox_option-text {
	position: relative;
	flex: 1
}

.actulus-selectbox_option-id {
	display: flex;
	padding: 5px 10px;
	align-items: center;
	gap: 10px;
	border-radius: 100px;
	background: var(--actulus-selectbox-primary);
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 13px
}

.actulus-selectbox_option-icon {
	width: 34px;
	height: 34px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: start;
	border-radius: 30px !important
}

.actulus-selectbox_option-icon img {
	width: auto;
	height: 22px
}

.actulus-selectbox_option:hover {
	background: rgb(255 255 255 / .05)
}

.actulus-selectbox_option.actulus-selectbox_option-selected {
	background: rgb(21, 34, 69);
	color: rgb(255, 255, 255)
}

.actulus-selectbox_option-disabled {
	opacity: .5;
	cursor: not-allowed
}

.actulus-selectbox_option-disabled:hover {
	background-color: rgba(255, 255, 255, 0)
}

.actulus-selectbox_info {
	display: flex;
	padding: 40px 20px 20px;
	flex-direction: column;
	align-items: center;
	gap: 20px
}

.actulus-selectbox_info-icon {
	color: var(--actulus-selectbox-disabled)
}

.actulus-selectbox_info-icon svg {
	width: 70px;
	height: 70px;
	fill: var(--actulus-selectbox-disabled)
}

.actulus-selectbox_info-text {
	font-size: 16px;
	color: var(--actulus-selectbox-muted);
	text-align: center
}

.actulus-selectbox.actulus-selectbox_open {
	position: relative;
	z-index: 5000
}

.actulus-selectbox.actulus-selectbox_open .actulus-selectbox_options-outer {
	display: flex;
	animation: actulus-selectbox-fade-in .2s ease
}

.actulus-selectbox[data-options-mode=modal] .actulus-selectbox_close {
	display: flex;
	top: 10px;
	right: 10px;
	z-index: 3000;
	position: fixed
}

.actulus-selectbox[data-options-mode=modal] .actulus-selectbox_close svg {
	width: 20px;
	height: auto;
	fill: rgb(255, 255, 255)
}

.actulus-selectbox[data-options-mode=modal] .actulus-selectbox_options-bg {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	background-color: rgb(0 0 0 / .2);
	z-index: 2000;
	display: none;
	padding: 20px
}

.actulus-selectbox[data-options-mode=modal] .actulus-selectbox_options-outer {
	position: relative;
	width: 100%;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
	margin-top: auto;
	margin-bottom: auto;
	top: inherit;
	max-height: 100%;
	height: auto;
	overflow-y: auto;
	animation: actulus-selectbox-modal-fade-in .2s ease;
	z-index: 2010
}

.actulus-selectbox[data-options-mode=modal].actulus-selectbox_open .actulus-selectbox_options-bg {
	display: flex
}

.actulus-selectbox[data-options-mode=full] .actulus-selectbox_close {
	display: flex;
	top: 10px;
	right: 10px;
	z-index: 3000;
	position: fixed
}

.actulus-selectbox[data-options-mode=full] .actulus-selectbox_close svg {
	width: 20px;
	height: auto;
	fill: rgb(255, 255, 255)
}

.actulus-selectbox[data-options-mode=full] .actulus-selectbox_options-bg {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 100vh;
	backdrop-filter: blur(4px);
	background-color: rgb(0 0 0 / .2);
	z-index: 2000
}

.actulus-selectbox[data-options-mode=full] .actulus-selectbox_options-outer {
	position: fixed;
	top: initial;
	bottom: 0;
	left: 0;
	top: 0;
	right: 0;
	z-index: 2020;
	display: none;
	border-radius: 0;
	animation: actulus-selectbox-modal-fade-in .2s ease
}

.actulus-selectbox[data-options-mode=full].actulus-selectbox_open .actulus-selectbox_options-bg {
	display: block
}

.actulus-selectbox[data-options-mode=full].actulus-selectbox_open .actulus-selectbox_options-outer {
	display: flex
}

@keyframes actulus-selectbox-fade-in {
	from {
		opacity: 0;
		transform: translateY(-10px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

@keyframes actulus-selectbox-modal-fade-in {
	from {
		opacity: 0;
		transform: translateY(30px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

@keyframes actulus-selectbox-selected-label {
	0% {
		box-shadow: 0 0 30px rgba(var(--actulus-selectbox-primary-rgb), .5)
	}

	100% {
		box-shadow: 0 0 0 rgba(var(--actulus-selectbox-primary-rgb), .2)
	}
}

@keyframes actulus-selectbox-reveal {
	0% {
		opacity: 0
	}

	2% {
		opacity: 1
	}
}

/* =========================================================
   PAGE / FEATURE STYLES
========================================================= */
:root{
  --auth-input-h:50px;
}

/* =========================================================
   FLAGS (SVG)
========================================================= */
.lang-flag.flag,
.flag-icon.flag{ border-radius:999px; overflow:hidden; }
svg.lang-flag.flag,
svg.flag-icon.flag{ display:block; }

/* =========================================================
   BLOG — HEADER / FOOTER / POST
========================================================= */
.blog-page-header{ text-align:center; margin-bottom:40px; }
.blog-page-header h1{ font-size:32px; font-weight:700; margin-bottom:12px; }
.blog-page-header p{
  max-width:720px;
  margin:0 auto;
  font-size:15px;
  opacity:.7;
  line-height:1.6;
}

.blog-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  margin-top:14px;
}

.blog-author-left a{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}
.blog-author-left img{
  width:42px; height:42px; min-width:42px;
  border-radius:50%;
  object-fit:cover;
  display:block;
}

.author-meta{ display:flex; flex-direction:column; line-height:1.2; }
.author-meta .name{ display:block; font-weight:600; font-size:14px; }
.author-meta .role{ display:block; font-size:12px; opacity:.6; }

.blog-linkedin{
  width:36px; height:36px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgb(22, 119, 178);
  color:rgb(255, 255, 255);
  text-decoration:none;
  line-height:0;
}
.blog-linkedin svg{ width:16px; height:16px; display:block; }

.blogpost-center{
  width:100%;
  max-width:920px;
  margin-inline:auto;
}
.blogpost-title{ margin:0 0 10px; font-weight:700; line-height:1.2; }

.blogpost-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.blogpost-date{ opacity:.7; font-size:13px; }

.blogpost-share{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.blogpost-share .share-label{ opacity:.6; font-size:12px; margin-right:4px; }
.blogpost-share .share-btn{
  width:34px; height:34px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  line-height:0;
  background:rgba(255,255,255,.06);
  color:inherit;
}
.blogpost-share .share-btn svg{ display:block; }
.blogpost-share .share-x{ background:rgba(255,255,255,.06); }
.blogpost-share .share-fb{ background:rgba(24,172,254,.12); }
.blogpost-share .share-in{ background:rgba(18,117,177,.18); }
.blogpost-share .share-rd{ background:rgba(252,71,30,.12); }

.blogpost-cover{ margin:16px 0 18px; border-radius:14px; overflow:hidden; }
.blogpost-cover img{ width:100%; height:auto; display:block; }

.blogpost-content{ line-height:1.75; }

@media (max-width:992px){
  .blogpost-center{ max-width:100%; }
}

/* =========================================================
   BLOGPOST — AUTHOR CARD
========================================================= */
.bb-author.bb-author--main{
  margin-top:30px;
  padding:22px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:12px;
  background:rgba(0, 0, 0, 0);
}

.bb-author-avatar{
  width:80px; height:80px;
  border-radius:50%;
  object-fit:cover;
  display:block;
}

.bb-author-name h4{ margin:0; font-weight:800; font-size:15px; line-height:1.2; }
.bb-author-name small{ display:block; opacity:.7; margin-top:4px; font-size:12px; }

.bb-author-social{ display:flex; align-items:center; justify-content:center; }
.bb-author-social a{
  width:38px; height:38px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  line-height:0;
}

.bb-author-text{ font-size:14px; opacity:.85; line-height:1.7; max-width:640px; }
.bb-author-button .btn{ width:100%; }
.bb-author:empty{ display:none!important; }

/* Inline style basılırsa: sadece görünümü sabitle (tekrarları azalttım) */
.bb-author.bb-author--main[style]{
  background:rgba(0, 0, 0, 0) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  gap:12px !important;
  margin-top:30px !important;
  padding:22px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:18px !important;
  font-family:inherit !important;
  font-size:inherit !important;
  letter-spacing:normal !important;
}

/* =========================================================
   AUTHOR PAGE
========================================================= */
.author-center{ width:100%; max-width:980px; margin-inline:auto; }

.author-card{
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  padding:28px;
  background:rgba(0, 0, 0, 0);
}

.author-top{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }

.author-avatar img{
  width:96px; height:96px;
  border-radius:50%;
  object-fit:cover;
  display:block;
}

.author-name{ margin:0; font-size:24px; font-weight:800; }
.author-role{ margin-top:6px; opacity:.7; font-size:14px; }

.author-social{ margin-top:14px; }
.author-social-link{
  width:42px; height:42px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

.author-bio{ margin-top:22px; line-height:1.75; opacity:.9; }

.author-latest{
  margin-top:30px;
  padding-top:25px;
  position:relative;
}
.author-latest:before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background:rgba(255,255,255,.08);
}
.author-latest:after{
  content:"";
  position:absolute;
  left:10%;
  right:10%;
  top:-10px;
  height:20px;
  background:rgba(255,255,255,.08);
  filter:blur(18px);
  opacity:.35;
  pointer-events:none;
}
.author-latest__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
}
.author-latest__head h3{ margin:0; font-size:15px; font-weight:800; }
.author-latest__status{ font-size:12px; opacity:.65; }
.author-latest__grid .col-md-4{ margin-bottom:22px; }

/* =========================================================
   SIDEBAR LOGO FIX (SVG/PNG)
========================================================= */
.sidebar-header a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:56px;
  padding:14px 16px;
}
.sidebar-header .logo{
  display:block;
  width:auto !important;
  height:34px !important;
  max-width:170px;
  max-height:34px !important;
  object-fit:contain;
}
.sidebar-header .logo[src$=".svg"],
.sidebar-header .logo[src*=".svg?"]{ min-width:1px; }

@media (max-width:768px){
  .sidebar-header a{ min-height:52px; padding:12px 14px; }
  .sidebar-header .logo{
    height:30px !important;
    max-height:30px !important;
    max-width:150px;
}
}

/* Login sidebar */
body[data-layout="auth"] .sidebar{
  border-right:1px solid rgba(255,255,255,.05);
  box-shadow:4px 0 20px rgba(0,0,0,.15) !important;
}

/* =========================================================
   HERO MARQUEE ICON SIZE
========================================================= */
.hero-bottom--marquee--item{ flex:0 0 auto; display:flex; align-items:center; }
.hero-bottom--marquee--item img{ height:30px; width:auto; display:block; }

/* =========================================================
   AUTH VIEW TOGGLE (signup layout)
========================================================= */
#member-layout[data-auth-mode="signup"] .auth-view--login{ display:none; }
#member-layout[data-auth-mode="login"] .auth-view--signup{ display:none; }

/* =========================================================
   LANGUAGE DROPDOWN (signup)
========================================================= */
#grindup-lang[data-active="false"] .grindup-dropdown__box{ display:none; }
#grindup-lang[data-active="true"] .grindup-dropdown__box{ display:block; }

#grindup-lang .flag{ display:inline-flex; align-items:center; justify-content:center; line-height:1; }
#grindup-lang .flag svg,
#grindup-lang .flag-icon,
#grindup-lang .lang-flag{
  width:16px !important;
  height:16px !important;
  max-width:16px !important;
  max-height:16px !important;
  display:block !important;
  flex:0 0 16px !important;
}
#grindup-lang .grindup-dropdown__box .list-link{
  display:flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#grindup-lang .grindup-dropdown__box .list-link svg{
  width:16px !important;
  height:16px !important;
  flex:0 0 16px !important;
  display:block !important;
}

:is(.signup-form-shell, .auth-layout__form-shell) #grindup-lang{
  width:fit-content;
  margin-left:auto !important;
  margin-right:auto !important;
}
#grindup-lang [data-grindup="dropdown-button"]{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding-inline:14px;
}
#grindup-lang .grindup-lang-text{
  font-weight:600;
  line-height:1;
  white-space:nowrap;
}

body[data-layout="guest"] :is(main.signup-split-right, .auth-layout__right){
  margin-top:0 !important;
  padding-top:0 !important;
}
body[data-layout="guest"] :is(main.signup-split-right, .auth-layout__right) .member-layout--content{
  padding-top:0 !important;
  padding-bottom:0 !important;
}

/* ===== SERVICES (scoped) ===== */
[data-page="services"] .gu-w42{width:42px;}
[data-page="services"] button.service-category__toggle.form-select{border-radius:15px!important;}
[data-page="services"] .gu-cat-panel.is-hidden{display:none!important;}
[data-page="services"] .service-category__toggle.gu-hide{display:none!important;}

[data-page="services"] .service-category__toggle{
  width:100%;
  display:flex!important;
  align-items:center!important;
  gap:12px;

  /* FIX: Accordion title letters (g,y,p) clipping */
  height:auto!important;
  min-height:48px;
  overflow:visible!important;
  line-height:1.25!important;
  padding-top:12px!important;
  padding-bottom:12px!important;
}

[data-page="services"] .service-category--icon{
  display:flex;align-items:center;justify-content:center;
  min-width:28px;font-size:20px;
}
[data-page="services"] .service-category--icon img{max-height:24px;width:auto;display:block;}

[data-page="services"] .service-category--title{
  flex:1;
  display:flex;
  align-items:center;
  font-weight:600;
  line-height:1.25!important;
  padding-bottom:1px;
}

/* extras */
[data-page="services"] .gu-fav-star{margin-right:6px;}
[data-page="services"] .gu-fav-btn{display:inline-flex;align-items:center;justify-content:center;}
[data-page="services"] .gu-hidden{display:none!important;}
[data-page="services"] #serviceDescModal .service-modal__meta{margin-bottom:10px;opacity:.85;}
[data-page="services"] #serviceDescModal .service-modal__name{margin-left:8px;}

/* SIDEBAR — Tickets badge satır altına düşmesin */
body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .text{
  display:flex;
  align-items:center;
  gap:10px;
  flex:1;
  min-width:0;
}

/* PP/Bootstrap badge hangi class ile gelirse gelsin inline kalsın */
body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .text .badge,
body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .text .badge-pill,
body[data-layout=auth] .sidebar-menu li .sidebar-menu--link .text .badge-count{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  line-height:1;
  margin-left:auto; /* text alanının sağına iter (arrow’dan önce) */
}
/* SIDEBAR BADGE — compact version */
body[data-layout="auth"] .sidebar-menu .badge{
  padding: 4px 10px !important;
  font-size: 11px;
  border-radius: 14px;
  min-height: 22px;
}
/* SIDEBAR padding override */
body[data-layout=auth] .sidebar-menu{
  padding: 20px 30px;
}

/* =========================================================
   AUTH PAGES — shared layout + shared input system
   signup / 2fa / resetpassword / setnewpassword only
========================================================= */
.gu-auth-page{
  --gu-auth-radius:15px;
  --gu-auth-input-h:50px;
  --gu-auth-left-bg:rgb(7, 72, 245);
  --gu-auth-input-bg:linear-gradient(180deg, rgb(15, 22, 48) 0%, rgb(8, 15, 29) 100%);
  --gu-auth-input-border:rgba(255,255,255,.08);
  --gu-auth-input-focus:rgb(4, 59, 255);
}

body[data-layout="guest"] .gu-auth-page{
  margin-top:calc(-1 * (var(--header-safe, 0px) + 80px)) !important;
}

.gu-auth-page .member-layout--content{
  padding-top:0 !important;
  padding-bottom:0 !important;
}

.gu-auth-page .auth-layout{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
}

.gu-auth-page .auth-layout__left,
.gu-auth-page .auth-layout__right{
  width:50%;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
}

.gu-auth-page .auth-layout__left{
  align-items:stretch;
  justify-content:stretch;
  background:var(--gu-auth-left-bg);
}

.gu-auth-page .auth-layout__left-inner{
  flex:1 1 auto;
  width:100%;
  min-height:100vh;
  min-height:100dvh;
  padding:32px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.gu-auth-page .auth-layout__brand{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

.gu-auth-page .auth-layout__brand-img{
  display:block;
  width:70%;
  max-width:280px;
  height:auto;
  object-fit:contain;
}

.gu-auth-page .auth-layout__brand-text{
  font-weight:900;
  letter-spacing:.3px;
  color:rgb(255, 255, 255);
  font-size:28px;
  line-height:1.1;
  text-align:center;
}

.gu-auth-page .auth-layout__inner{
  width:100%;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  padding:24px 16px;
}

.gu-auth-page .auth-layout__topbar{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  width:100%;
  flex:0 0 auto;
  padding:8px 8px 0;
}

.gu-auth-page .auth-layout__body{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:18px 8px 24px;
}

.gu-auth-page .auth-layout__form-shell{
  width:100%;
  max-width:440px;
}

.gu-auth-page .auth-footer-link{
  margin-top:18px;
  text-align:center;
  background:none !important;
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
}

.gu-auth-page .auth-footer-link a{
  font-weight:600;
  text-decoration:none;
}

.gu-auth-page .auth-footer-link a:hover,
.gu-auth-page .signup-footer-link a:hover{
  text-decoration:none;
}

.gu-auth-page .form-control,
.gu-auth-page .form-control--password .form-control--input,
.gu-auth-page .btn-block,
.gu-auth-page .btn-primary.btn-block{
  min-height:var(--gu-auth-input-h) !important;
}

.gu-auth-page input.form-control,
.gu-auth-page textarea.form-control,
.gu-auth-page select.form-control,
.gu-auth-page .gu-passwrap,
.gu-auth-page .form-control--password,
.gu-auth-page .member-6digit .otp{
  border-radius:var(--gu-auth-radius) !important;
}

.gu-auth-page .gu-field{
  margin-bottom:16px;
}

.gu-auth-page .gu-fieldbox{
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  min-height:var(--gu-auth-input-h);
  border:1px solid var(--gu-auth-input-border);
  border-radius:var(--gu-auth-radius);
  overflow:hidden;
  background:var(--gu-auth-input-bg);
  box-shadow:none;
  transition:border-color .2s ease, box-shadow .2s ease;
}

.gu-auth-page .gu-fieldbox:focus-within{
  border-color:var(--gu-auth-input-focus);
  box-shadow:0 0 0 3px rgba(0,56,255,.25);
}

.gu-auth-page .gu-fieldbox,
.gu-auth-page .gu-fieldtoggle,
.gu-auth-page .gu-fieldinput{
  color:rgb(255, 255, 255);
}

.gu-auth-page .gu-inputwrap,
.gu-auth-page .gu-passwrap{
  position:relative;
}

.gu-auth-page .gu-passwrap{
  overflow:hidden !important;
}

.gu-auth-page .gu-inicon{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  z-index:2;
  line-height:1;
}

.gu-auth-page .gu-inicon .icon,
.gu-auth-page .gu-inicon svg{
  width:18px;
  height:18px;
  display:block;
}

.gu-auth-page .gu-fieldinput{
  flex:1 1 auto;
  width:100%;
  height:var(--gu-auth-input-h);
  min-height:var(--gu-auth-input-h);
  padding:0 16px 0 44px !important;
  border:0 !important;
  outline:0 !important;
  margin:0 !important;
  background:rgba(0, 0, 0, 0) !important;
  box-shadow:none !important;
  color:rgb(255, 255, 255) !important;
  -webkit-text-fill-color:rgb(255, 255, 255) !important;
  caret-color:rgb(255, 255, 255) !important;
  border-radius:0 !important;
}

.gu-auth-page .gu-fieldinput::placeholder{
  color:rgba(255,255,255,.72) !important;
  opacity:1;
}

.gu-auth-page .gu-hasicon{
  padding-left:44px !important;
}

.gu-auth-page .gu-fieldbox--password .gu-fieldinput{
  padding-right:12px !important;
}

.gu-auth-page .gu-fieldtoggle{
  flex:0 0 48px;
  width:48px;
  min-width:48px;
  height:var(--gu-auth-input-h);
  align-self:stretch;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  margin:0;
  border:0 !important;
  outline:0 !important;
  background:rgba(0, 0, 0, 0) !important;
  box-shadow:none !important;
  color:rgb(255, 255, 255) !important;
  -webkit-text-fill-color:rgb(255, 255, 255) !important;
  border-radius:0 !important;
  cursor:pointer;
}

.gu-auth-page .gu-fieldtoggle i{
  pointer-events:none;
}

.gu-auth-page .gu-fieldinput:-webkit-autofill,
.gu-auth-page .gu-fieldinput:-webkit-autofill:hover,
.gu-auth-page .gu-fieldinput:-webkit-autofill:focus,
.gu-auth-page .gu-fieldinput:-webkit-autofill:active{
  -webkit-text-fill-color:rgb(255, 255, 255) !important;
  -webkit-box-shadow:0 0 0 1000px rgba(0, 0, 0, 0) inset !important;
  box-shadow:0 0 0 1000px rgba(0, 0, 0, 0) inset !important;
  background:rgba(0, 0, 0, 0) !important;
  caret-color:rgb(255, 255, 255) !important;
  transition:background-color 9999s ease-in-out 0s;
}

.gu-auth-page .gu-fieldinput[readonly]{
  cursor:default;
  opacity:1;
}

.gu-auth-page .gu-captcha-center,
.gu-auth-page .gu-captcha-mask{
  display:flex;
  justify-content:center;
}

.gu-auth-page .gu-captcha-mask iframe{
  display:block;
  max-width:100%;
  border:1px solid rgb(25, 30, 48);
  border-radius:15px !important;
}

.gu-auth-page .gu-auth-inlinecheck{
  display:flex;
  align-items:center;
  gap:10px;
}

.gu-auth-page .gu-auth-otp-hidden{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.gu-auth-page .member-6digit{
  --otp-gap:6px;
  --otp-size:min(48px, calc((100% - (5 * var(--otp-gap))) / 6));
  display:flex;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:center;
  gap:var(--otp-gap);
  width:100%;
  max-width:100%;
}

.gu-auth-page .member-6digit input.otp,
.gu-auth-page .member-6digit .otp{
  flex:none !important;
  display:block !important;
  width:var(--otp-size) !important;
  min-width:var(--otp-size) !important;
  max-width:var(--otp-size) !important;
  height:var(--otp-size) !important;
  min-height:var(--otp-size) !important;
  max-height:var(--otp-size) !important;
  aspect-ratio:1 / 1 !important;
  padding:0 !important;
  margin:0 !important;
  text-align:center !important;
  line-height:var(--otp-size) !important;
  font-size:18px !important;
  font-weight:700 !important;
  box-sizing:border-box !important;
  font-variant-numeric:tabular-nums !important;
  border-radius:15px !important;
  color:rgb(255, 255, 255) !important;
  -webkit-text-fill-color:rgb(255, 255, 255) !important;
}

.gu-auth-page .member-6digit input.otp:focus,
.gu-auth-page .member-6digit .otp:focus{
  transform:none;
}

@media (max-width:575.98px){
  .gu-auth-page .member-6digit{
    --otp-gap:5px;
    --otp-size:min(44px, calc((100% - (5 * var(--otp-gap))) / 6));
  }

  .gu-auth-page .member-6digit input.otp,
  .gu-auth-page .member-6digit .otp{
    font-size:17px !important;
    border-radius:13px !important;
  }
}

@media (max-width:389.98px){
  .gu-auth-page .member-6digit{
    --otp-gap:4px;
    --otp-size:min(40px, calc((100% - (5 * var(--otp-gap))) / 6));
  }

  .gu-auth-page .member-6digit input.otp,
  .gu-auth-page .member-6digit .otp{
    font-size:16px !important;
    border-radius:12px !important;
  }
}

@media (max-width:991.98px){
  .gu-auth-page .auth-layout__left{
    display:none !important;
  }

  .gu-auth-page .auth-layout__right{
    width:100% !important;
    min-height:auto;
  }

  .gu-auth-page .auth-layout__inner{
    min-height:100dvh;
    padding:16px 12px 28px;
  }

  .gu-auth-page .auth-layout__topbar{
    padding:0 0 8px;
  }

  .gu-auth-page .auth-layout__body{
    align-items:flex-start;
    padding:12px 0 20px;
  }

  .gu-auth-page .auth-layout__form-shell{
    max-width:100%;
  }
}


/* Font Awesome icon fallback for layout icons */
.header-end--updates .icon,
.header-end--balance .icon,
.pp-footer__socBtn i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.header-end--updates .icon,
.header-end--balance .icon {
  font-size: 18px;
  line-height: 1;
}

.pp-footer__socBtn i {
  font-size: 18px;
  line-height: 1;
}

/* font awesome icon parity */
.icon > i{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;line-height:1;font-size:1em;}
.search-box .icon > i,.filter-row .icon > i,.info-item .icon > i,.badge .icon > i,.btn .icon > i{font-size:1em;}