/* 颜色与排版基础 */
:root {
	--bg: #f5f7fb;
	--bg-alt: #f9fbff;
	--text: #1a1d1f;
	--muted: #334155;
	--accent: #0ea5e9;
}

* { box-sizing: border-box; }
html, body {
	height: 100%;
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, 'PingFang SC', 'Noto Sans CJK SC', 'Microsoft Yahei', sans-serif;
	overflow-x: hidden;
}

/* 全屏滚动 */
.snap-container {
	height: 100vh;
	overflow-y: scroll;
	scroll-snap-type: y mandatory;
	scroll-behavior: smooth;
	overflow-x: hidden;
}
.snap-section {
	height: 100vh;
	scroll-snap-align: start;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	/* 渐变显隐 */
	opacity: 0;
	transition: opacity .6s ease;
}
.snap-section.is-active { opacity: 1; }
/* 激活的屏强制文本可见，防止观察器错过 */
.snap-section.is-active .text-reveal { opacity: 1; transform: translateY(0) scale(1); }
.section .content {
	width: min(1200px, 92vw);
	margin: 0 auto;
	padding: 24px;
}
/* 收窄游戏区块最大宽度 */
.game .content { width: min(980px, 92vw); }
/* 首屏下的公司介绍与轮播间距 */
.hero .company-content { margin-top: 18px; }
/* 首屏下方滚动提示 */
.scroll-hint { display: flex; justify-content: center; margin-top: 8px; cursor: pointer; }
.scroll-hint img { width: 22px; height: 22px; opacity: .7; animation: bounceY 1.4s infinite ease-in-out; }
@keyframes bounceY { 0%, 100% { transform: translateY(0); opacity: .55; } 50% { transform: translateY(5px); opacity: .95; } }

/* 头图区域 */
.hero .swiper {
	height: 58vh;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0,0,0,.08);
}
/* 让轮播子元素充满容器高度，避免只见背景 */
.hero .swiper .swiper-wrapper, .hero .swiper .swiper-slide { height: 100%; }
.hero img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 16px; }
/* 强制缩放滚动提示图标尺寸，覆盖 .hero img 的默认设置 */
.hero .scroll-hint img { width: 38px; height: 38px; object-fit: contain; border-radius: 0; }

/* 公司介绍 */
.company-content {
	padding-top: 20px;
	display: grid;
	grid-template-columns: 180px 1fr;
	gap: 28px;
	align-items: center;
}
.company-content .brand { width: 160px; height: auto; filter: drop-shadow(0 6px 18px rgba(0,0,0,.1)); }
.company-text p { margin: 0 0 10px; color: var(--text); line-height: 1.7; }

/* 游戏区块通用布局 */
.row { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.col { min-width: 0; }
.col-footer { grid-column: 1 / -1; }
.col-text h2 { margin: 0 0 16px; font-size: 32px; letter-spacing: .5px; font-weight: 800; }
.desc { color: var(--text); line-height: 1.8; white-space: pre-line; }
.store-links { display: flex; gap: 16px; margin-top: 18px; }
.store-links img { height: 46px; width: auto; transition: transform .25s ease; border-radius: 12px; }
.store-links img:hover { transform: translateY(-2px) scale(1.02); }

/* 交替背景以增强节奏感（移除统一色，改用每屏独立色） */
/* .section.alt { background: var(--bg-alt); } */

/* Swiper 画廊 */
.gallery-swiper {
	width: 100%;
	height: 60vh;
	border-radius: 0;
	overflow: hidden;
	box-shadow: none;
	background: transparent;
	border: none;
}
/* 居中展示竖图，确保可见 */
.gallery-swiper .swiper-wrapper, .gallery-swiper .swiper-slide { height: 100%; }
.gallery-swiper .swiper-slide { display: flex; align-items: center; justify-content: center; background: transparent !important; }
.gallery-swiper img { height: 100%; width: auto; max-height: 100%; object-fit: contain; display: block; transform: scaleX(1.12); transform-origin: center; border-radius: 16px; }

/* 文本进入动画 */
.text-reveal { opacity: 0; transform: translateY(10px) scale(0.98); transition: opacity .6s ease, transform .6s ease; }
.text-reveal.is-visible { opacity: 1; transform: translateY(0) scale(1); }

/* 页脚 */
.footer-content { text-align: center; color: var(--muted); margin-top: 12px; width: 100%; }

/* “More”页：内容居中，页脚固定底部并避免遮挡 */
#more { flex-direction: column; justify-content: center; align-items: center; padding-bottom: 96px; }
#more .footer-content { position: absolute; bottom: 16px; left: 0; right: 0; }

/* 每屏更明显的背景（亮色系渐变） */
.section.hero { background: linear-gradient(135deg, #e9f1ff 0%, #f0f7ff 100%); }
#hike { background: linear-gradient(135deg, #fff2e0 0%, #ffe8cc 100%); }
#craze { background: linear-gradient(135deg, #fde8ff 0%, #f5d0fe 100%); }
#cryptogram { background: linear-gradient(135deg, #e6fff5 0%, #ccfbf1 100%); }
#wordseek { background: linear-gradient(135deg, #fff9e6 0%, #ffedd5 100%); }
#more { background: linear-gradient(135deg, #eaf5ff 0%, #dbeafe 100%); }
.footer { background: #f5f7fb; }

/* 文字加粗显示（暗色文本） */
.text-content, .company-text, .company-text p, .desc { font-weight: 700; color: var(--text); }

/* 响应式 */
@media (max-width: 900px) {
	.row { grid-template-columns: 1fr; }
	.gallery-swiper, .hero .swiper { height: 48vh; }
	.company-content { grid-template-columns: 1fr; text-align: center; }
	.company-content .brand { margin: 0 auto; }
} 