.index-page {
	background: #000;
	color: #fff;
}
.index-page .banner-box {
	position: relative;
	height: 760px;
	overflow: hidden;
	background: #000;
}
.index-page .banner-content {
	position: relative;
	height: 100%;
}
.index-page .banner-content .animation {
	position: absolute;
	left: 50%;
	top: 54%;
	transform: translate(-50%, -50%);
	z-index: 0;
	pointer-events: none;
}
.index-page .banner-content .animation.quan {
	width: 920px;
	max-width: 96vw;
	height: auto;
}
.index-page .banner-content .animation.eth {
	width: 220px;
	height: 220px;
	object-fit: contain;
}
.index-page .banner-content .animation-img {
	position: absolute;
	width: 52px;
	height: 52px;
	object-fit: contain;
	z-index: 1;
	pointer-events: none;
}
.index-page .animation-img0 { width: 64px; height: 64px; top: 12%; left: 6%; }
.index-page .animation-img1 { top: 78%; left: 14%; }
.index-page .animation-img2 { top: 70%; left: 28%; }
.index-page .animation-img3 { width: 40px; height: 40px; top: 56%; left: 42%; }
.index-page .animation-img4 { width: 60px; height: 60px; top: 16%; left: 90%; }
.index-page .animation-img5 { top: 30%; left: 80%; }
.index-page .animation-img6 { width: 38px; height: 38px; top: 72%; left: 68%; }
.index-page .animation-img7 { width: 78px; height: 78px; top: 62%; left: 86%; }
.index-page .animation-img8 { width: 62px; height: 62px; top: 74%; left: 78%; }
.index-page .animation-img9 { width: 66px; height: 66px; top: 78%; left: 64%; }
.index-page .animation-img10 { width: 44px; height: 44px; top: 48%; left: 24%; }
.index-page .animation-img11 { width: 56px; height: 56px; top: 26%; left: 16%; }
.index-page .animation-img12 { width: 66px; height: 66px; top: 90%; left: 46%; }
.index-page .animation-img13 { width: 46px; height: 46px; top: 22%; left: 72%; }
.index-page .banner-content .title {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 92px;
	text-align: center;
}
.index-page .banner-content .title h6 {
	max-width: 1100px;
	margin: 0;
	padding: 0 24px;
	color: #fff;
	font-size: clamp(26px, 2.4vw, 40px);
	line-height: 1.35;
	font-weight: 700;
	white-space: nowrap;
}
.index-page .banner-content .title > span {
	margin-top: 28px;
	color: #c4c4c4;
	font-size: 20px;
}
.index-page .banner-trade {
	margin-top: 22px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 42px;
	padding: 0 22px;
	border-radius: 999px;
	border: 1px solid #adff2f;
	color: #adff2f;
	text-decoration: none;
	font-weight: 700;
}
.index-page .banner-trade:hover {
	background: #adff2f;
	color: #111;
}
.index-page .banner-content .reg-input-box {
	margin-top: 22px;
	display: flex;
	justify-content: center;
}
.index-page .market-container-box,
.index-page .help-list-box {
	width: min(1100px, 88%);
	margin: 72px auto;
}
.index-page .market-container-box > .title,
.index-page .help-container-box > .title,
.index-page .help-list-box > .title {
	margin: 0;
	color: #fff;
	font-size: 36px;
	font-weight: 700;
}
.index-page .help-container-box > .title,
.index-page .help-list-box > .title,
.index-page .index-bottom-box h6 {
	text-align: center;
}
.index-page .mcb-content .ts-content {
	display: flex;
	justify-content: space-between;
	gap: 32px;
	align-items: center;
}
.index-page .trade-left {
	width: 48%;
}
.index-page .trade-left p {
	margin: 28px 0;
	color: #b6b6b6;
	font-size: 18px;
	line-height: 1.7;
}
.index-page .left-box {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}
.index-page .left-box button {
	border: 0;
	border-radius: 24px;
	padding: 10px 28px;
	background: #fff;
	color: #000;
	font-size: 16px;
	cursor: pointer;
}
.index-page .left-box img {
	width: 180px;
	height: auto;
}
.index-page .trade-type {
	width: 46%;
}
.index-page .trade-item {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 16px;
	padding: 16px;
	border-radius: 12px;
	border: 1px solid #121212;
	background: #050505;
	text-decoration: none;
}
.index-page .trade-item img {
	width: 72px;
	height: 72px;
	object-fit: contain;
}
.index-page .trade-item h6 {
	margin: 0 0 8px;
	color: #fff;
	font-size: 22px;
}
.index-page .trade-item p {
	margin: 0;
	color: #b7b7b7;
	font-size: 14px;
	line-height: 1.5;
}
.index-page .lp-section {
	padding: 72px 0;
	background:
		radial-gradient(ellipse 55% 70% at 28% 50%, rgba(0, 252, 189, .18), transparent 65%),
		radial-gradient(ellipse 50% 65% at 78% 45%, rgba(204, 21, 126, .2), transparent 60%),
		#0b0e19;
}
.index-page .lp-wrap {
	width: min(1100px, 88%);
	margin: 0 auto;
}
.index-page .lp-grid {
	display: grid;
	grid-template-columns: 1fr 1.05fr;
	gap: 48px;
	align-items: center;
}
.index-page .lp-eyebrow {
	display: inline-flex;
	height: 30px;
	align-items: center;
	padding: 0 12px;
	border-radius: 999px;
	background: rgba(0, 252, 189, .12);
	color: #00fcbd;
	font-size: 13px;
	font-weight: 700;
}
.index-page .lp-title {
	margin: 16px 0 0;
	color: #fff;
	font-size: 48px;
	font-weight: 800;
}
.index-page .lp-desc {
	max-width: 420px;
	margin: 16px 0 0;
	color: rgba(255, 255, 255, .68);
	font-size: 16px;
	line-height: 1.75;
}
.index-page .lp-cta {
	display: inline-flex;
	align-items: center;
	height: 48px;
	margin-top: 28px;
	padding: 0 28px;
	border-radius: 999px;
	background: #00fcbd;
	color: #0b0e19;
	font-weight: 800;
	text-decoration: none;
}
.index-page .lp-media {
	position: relative;
}
.index-page .lp-media > img {
	display: block;
	width: 100%;
	border-radius: 18px;
	border: 1px solid rgba(255, 255, 255, .2);
}
.index-page .lp-feature-card {
	position: absolute;
	left: 20px;
	right: 20px;
	bottom: 20px;
	padding: 18px 20px;
	border-radius: 14px;
	background: rgba(15, 18, 28, .88);
	text-align: left;
}
.index-page .lp-feature-card h3 {
	margin: 0;
	color: #fff;
	font-size: 20px;
}
.index-page .lp-feature-card p {
	margin: 8px 0 0;
	color: rgba(255, 255, 255, .7);
	font-size: 14px;
}
.index-page .help-container-box {
	margin: 72px auto;
	background: #000;
}
.index-page .help-container-box .color-remark {
	margin: 16px auto 24px;
	max-width: 760px;
	color: #b6b6b6;
	text-align: center;
	font-size: 18px;
}
.index-page .help-container-box > img {
	display: block;
	width: min(1000px, 88%);
	margin: 0 auto;
}
.index-page .faq-item {
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.index-page .faq-item button {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 22px 0;
	border: 0;
	background: transparent;
	color: #fff;
	font-size: 18px;
	text-align: left;
	cursor: pointer;
}
.index-page .faq-item button svg {
	width: 16px;
	height: 16px;
	flex: none;
	transition: transform .2s;
}
.index-page .faq-item button.is-open svg {
	transform: rotate(90deg);
}
.index-page .faq-item .faq-a {
	display: none;
	padding: 0 0 18px 26px;
	color: #b6b6b6;
	line-height: 1.7;
}
.index-page .faq-item button.is-open + .faq-a {
	display: block;
}
.index-page .index-bottom-box {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 64px 16px;
	background: #191a1c;
}
.index-page .index-bottom-box h6 {
	margin: 0 0 28px;
	color: #fff;
	font-size: 32px;
	font-weight: 700;
}
.index-page .ib-actions {
	display: flex;
	gap: 16px;
}
.index-page .ib-primary,
.index-page .ib-ghost {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 44px;
	padding: 0 22px;
	border-radius: 999px;
	text-decoration: none;
	font-weight: 700;
}
.index-page .ib-primary {
	background: #00fcb2;
	color: #000;
}
.index-page .ib-ghost {
	border: 1px solid rgba(255, 255, 255, .35);
	color: #fff;
}
@media (max-width: 900px) {
	.index-page .banner-box { height: 620px; }
	.index-page .banner-content .title h6 { font-size: 22px; white-space: normal; }
	.index-page .mcb-content .ts-content,
	.index-page .lp-grid { display: block; }
	.index-page .trade-left,
	.index-page .trade-type { width: 100%; }
	.index-page .lp-feature-card { position: static; margin-top: 14px; }
}
