/**
 * Homepage layout helpers — palette from themes.css (mk-football.com)
 * Hero/portal seam aligned with milan-web.com (site-info-container + site-entry-container).
 */

.site.site--xk-layout .site-bg {
	position: relative;
}

/* Milan desktop: no hero ::after; mobile rule lives in xk-hero.css */
.site.site--xk-layout .site-bg::after {
	display: none;
}

.yunda-ad-slot.yunda-ad-slot--before-about {
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 32px 24px 20px;
	background: transparent;
	box-sizing: border-box;
}

@media screen and (min-width: 1201px) {
	.site.site--xk-layout {
		position: relative;
		background: var(--body-bg-color);
	}

	.site.site--xk-layout .site-bg {
		width: 100%;
		padding-bottom: 0;
	}

	/* milan: .site-entry-container { top: -141px } */
	.site.site--xk-layout .site-portal-container {
		width: 100%;
		position: relative;
		display: flex;
		justify-content: center;
		z-index: 4;
		padding: 0 10px;
		padding-bottom: 0;
		box-sizing: border-box;
		top: -141px;
		margin-bottom: 0;
	}

	/* milan: .gift { margin-top: -60px; margin-bottom: 60px } */
	.site.site--xk-layout + .gift,
	.site.site--xk-layout ~ .gift {
		margin-top: -60px;
	}

	.gift {
		position: relative;
		z-index: 5;
		margin-top: -60px;
		margin-bottom: 60px;
		padding-top: 0;
		padding-bottom: 0;
		background: #1c141e;
	}

	.gift .section-title-wrapper {
		position: relative;
	}

	.gift::before {
		content: "";
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		width: 100vw;
		height: 100%;
		background: #1c141e;
		z-index: -1;
	}
}

/* 豪礼版块 — 对齐米兰站 jackpot 配色，全宽底色消除两侧异色长条 */
.gift {
	--jackpot-thead: #352c36;
	--jackpot-even: #2e2335;
	--jackpot-odd: #271e2e;
	position: relative;
	z-index: 5;
	background: #1c141e;
}

.gift .section-title-wrapper {
	position: relative;
}
/* 产品与「为什么选择运达娱乐」间距收紧 */
@media screen and (min-width: 1201px) {
	.products {
		padding-bottom: 28px;
	}

	.introduce {
		padding-top: 40px;
	}
}

/* 为什么选择运达娱乐 — 背景对齐米兰站 choose-bg-color */
.introduce {
	background: var(--choose-bg-color);
}

/* 豪礼与产品区块衔接 — 背景对齐米兰站 products-bg-color */
.products {
	padding-top: 36px;
	background: var(--products-bg-color);
}

/* 玩法介绍 → 最新资讯：取消固定高度，收紧标题上方留白 */
.tutorial {
	height: auto;
	min-height: 0;
	padding-bottom: 20px;
}

.post > .section-title-wrapper,
.post > div:nth-child(1) {
	padding-top: 32px;
}

/* 首页资讯卡片 — 文字层级与可读性 */
.post .post-container .posts-list .posts-item .posts-item-content .posts-item-title a {
	color: rgba(255, 255, 255, 0.96);
	transition: color 0.2s ease;
}

.post .post-container .posts-list .posts-item:hover .posts-item-content .posts-item-title a {
	color: var(--header-text-hover-color);
}

.post .post-container .posts-list .posts-item .posts-item-content {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-title {
	flex: 1;
	margin-bottom: 0;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0;
	margin-top: auto;
	padding-top: 14px;
	color: var(--desc-color);
	font-size: 13px;
	line-height: 1.4;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags .posts-tag,
.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags .posts-tag:last-child {
	display: inline;
	padding: 0;
	border: none;
	border-radius: 0;
	background: none;
	color: var(--header-text-hover-color) !important;
	font-size: 13px;
	font-weight: 400;
	line-height: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags .posts-tag:hover {
	color: var(--header-text-hover-color) !important;
	background: none;
	border-color: transparent;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags .posts-tag::after {
	content: "|";
	margin-left: 8px;
	color: var(--desc-color);
	font-size: 12px;
	opacity: 0.3;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags .posts-tag:last-child::after {
	content: none;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags::after {
	content: "|";
	margin-right: 8px;
	color: var(--desc-color);
	font-size: 12px;
	opacity: 0.3;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-date {
	display: inline-flex;
	align-items: center;
	color: var(--desc-color);
	font-size: 13px;
	white-space: nowrap;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-tags + .posts-date::before {
	content: none;
}

.post .post-container .posts-list .posts-item .posts-item-content .posts-item-footer .posts-date .posts-date-icon {
	width: 13px;
	height: 13px;
	margin-right: 5px;
	opacity: 0.62;
	flex-shrink: 0;
}

.post .section-title-wrapper .section-describe {
	color: rgba(255, 255, 255, 0.62);
}

section.post:last-child {
	padding-bottom: 32px;
}

@media (max-width: 1200px) {
	.site.site--xk-layout {
		background: var(--body-bg-color);
	}

	.site.site--xk-layout .site-portal-container {
		position: relative;
		top: auto !important;
		bottom: auto;
		left: auto;
		right: auto;
		margin: 0.36rem 0 0.4rem !important;
		padding: 0 0.4rem;
		transform: none;
		z-index: 4;
	}

	.site.site--xk-layout .site-portal-container .yd-portal {
		padding: 0;
	}

	.site.site--xk-layout .site-portal-container .yd-portal__card {
		background: rgba(53, 44, 55, 0.96);
		box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
	}

	.gift {
		margin-top: 0.1rem;
		margin-bottom: 0.4rem;
		padding-top: 0.24rem;
		padding-bottom: 0.4rem;
		background: #1c141e;
	}

	.products {
		padding-top: 0.32rem;
		padding-bottom: 0.16rem;
	}

	.products .football-container {
		padding-bottom: 0.16rem;
	}

	.introduce {
		padding-top: 0.32rem;
		padding-bottom: 0.6rem;
	}

	.faq > div:nth-child(1),
	.feedback > div:nth-child(1),
	.tutorial > div:nth-child(1) {
		padding-top: 0.96rem;
	}

	.introduce > div:nth-child(1) {
		padding-top: 0.24rem;
	}

	.tutorial {
		padding-bottom: 0.24rem;
	}

	.post > .section-title-wrapper,
	.post > div:nth-child(1) {
		padding-top: 0.28rem;
	}

	.page-main {
		padding-bottom: 0.16rem !important;
	}

	section.post,
	section.post:last-child {
		padding-bottom: 0.16rem !important;
	}

	section.post .post-container .posts-list {
		margin-bottom: 0;
	}

	/* 用户反馈 — 手机端头像与气泡间距、行高 */
	.feedback .feedback-container .feedback-list .feedback-item {
		align-items: flex-start;
		gap: 0.12rem;
		margin-bottom: 0.2rem;
	}

	.feedback .feedback-container .feedback-list .feedback-item .round-global-classname {
		margin-top: 0.06rem;
		flex-shrink: 0;
	}

	.feedback .feedback-container .feedback-list .feedback-item .feedback-item-desc {
		flex: 1;
		min-width: 0;
		margin-left: 0;
		padding: 0.14rem 0.18rem 0.16rem;
		border-width: 1px;
	}

	.feedback .feedback-container .feedback-list .feedback-item .feedback-item-desc > span {
		display: block;
		font-size: 0.28rem !important;
		line-height: 1.35 !important;
		padding: 0 0 0.08rem !important;
		margin-bottom: 0.04rem;
	}

	.feedback .feedback-container .feedback-list .feedback-item .feedback-item-desc > p {
		font-size: 0.26rem !important;
		line-height: 1.45 !important;
		padding: 0 !important;
		margin: 0;
	}
}

@media (max-width: 768px) {
	.products {
		padding-top: 0.28rem;
	}
}
