/* ---------- Hero Section ---------- */
.csm-hero { position: relative; overflow: hidden; min-height: 420px; }
.csm-hero-slide {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	background-size: cover; background-position: center; opacity: 0; transition: opacity .6s ease;
	min-height: 420px;
}
.csm-hero-slide.is-active { position: relative; opacity: 1; }
.csm-hero-overlay { position: absolute; inset: 0; }
.csm-hero-content { position: relative; z-index: 2; text-align: center; color: #fff; max-width: 700px; padding: 20px; }
.csm-hero-heading { font-size: 2.4em; margin: 0 0 10px; }
.csm-hero-subheading { font-size: 1.1em; margin: 0 0 20px; }
.csm-hero-button {
	display: inline-block; padding: 12px 28px; background: #fff; color: #111;
	border-radius: 4px; text-decoration: none; font-weight: 600;
}
.csm-hero-dots { position: absolute; bottom: 16px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; z-index: 3; }
.csm-hero-dot { width: 10px; height: 10px; border-radius: 50%; border: none; background: rgba(255,255,255,.5); cursor: pointer; padding: 0; }
.csm-hero-dot.is-active { background: #fff; }

/* ---------- Game Display Section ---------- */
.csm-game-display { display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap; }
.csm-game-thumb img { max-width: 280px; border-radius: 6px; height: auto; }
.csm-game-info { flex: 1; min-width: 240px; }
.csm-game-title { margin: 0 0 8px; }
.csm-game-screenshots { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0; }
.csm-game-screenshots img { max-width: 100px; border-radius: 4px; height: auto; }
.csm-game-store-link {
	display: inline-block; margin-top: 8px; padding: 8px 18px; background: #111; color: #fff;
	text-decoration: none; border-radius: 4px;
}

/* ---------- Special Section ---------- */
.csm-special { background-size: cover; background-position: center; padding: 60px 20px; text-align: center; }
.csm-special-inner { max-width: 800px; margin: 0 auto; }
.csm-special-heading { letter-spacing: 2px; text-transform: uppercase; font-size: .85em; opacity: .8; margin-bottom: 8px; }
.csm-special-title { font-size: 2em; margin: 0 0 20px; }
.csm-element-button {
	display: inline-block; margin-top: 10px; padding: 10px 24px; background: #111; color: #fff;
	text-decoration: none; border-radius: 4px;
}