.sample-games-page { background: #f7f9fc; color: var(--top-ink); }
.sample-games-hero { padding: 76px 0 64px; background: linear-gradient(115deg, #0b2545, #14579b); color: #fff; }
.sample-games-hero h1 { margin: 0 0 18px; font-size: clamp(34px, 5vw, 60px); line-height: 1.25; letter-spacing: -.055em; }
.sample-games-hero p:last-child { max-width: 680px; margin: 0; font-size: 17px; font-weight: 700; line-height: 1.9; }
.sample-games-main { padding: 70px 0 90px; }
.sample-games-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.sample-game-card { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid var(--top-line); box-shadow: 0 14px 30px rgba(11,37,69,.1); }
.sample-game-card img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.sample-game-card-body { display: flex; flex: 1; flex-direction: column; padding: 24px; }
.sample-game-card h2 { margin: 0 0 12px; color: var(--top-ink); font-size: 25px; line-height: 1.4; }
.sample-game-card p { margin: 0 0 22px; color: #40576d; font-weight: 700; line-height: 1.8; }
.sample-game-card .button { margin-top: auto; align-self: flex-start; background: var(--top-blue); color: #fff; box-shadow: 0 4px 0 #08386f; }
.sample-game-note { margin-top: 42px; padding: 24px 28px; background: #fff; border-left: 5px solid #ef651b; color: #40576d; font-weight: 700; line-height: 1.8; }
.sample-detail-main { padding: 62px 0 90px; }
.sample-detail-header { margin-bottom: 30px; }
.sample-detail-header h1 { margin: 0 0 14px; color: var(--top-ink); font-size: clamp(32px, 4vw, 52px); line-height: 1.3; }
.sample-detail-header p { max-width: 760px; margin: 0; color: #40576d; font-weight: 700; line-height: 1.9; }
.sample-game-frame { overflow: hidden; background: #000; border: 8px solid #fff; box-shadow: 0 18px 34px rgba(11,37,69,.18); }
.sample-game-frame iframe { display: block; width: 100%; height: min(68vw, 650px); min-height: 420px; border: 0; }
.click-game-frame { max-width: 720px; margin-inline: auto; aspect-ratio: 4 / 3; }
.click-game-frame iframe { width: 100%; height: 100%; min-height: 0; }
.sample-detail-section { margin-top: 58px; }
.sample-detail-section h2 { margin: 0 0 20px; color: var(--top-ink); font-size: 30px; }
.sample-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.sample-guide-grid img { display: block; width: 100%; height: auto; border: 6px solid #fff; box-shadow: 0 12px 24px rgba(11,37,69,.12); }
.sample-guide-grid .members-video-frame { aspect-ratio: 16 / 9; overflow: hidden; background: #0b2545; border: 6px solid #fff; box-shadow: 0 12px 24px rgba(11,37,69,.12); }
.sample-guide-grid .members-video-frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.sample-back-link { display: inline-flex; margin-top: 36px; color: var(--top-blue); font-weight: 900; text-decoration: underline; text-underline-offset: 5px; }
@media (max-width: 800px) {
  .sample-games-grid { grid-template-columns: 1fr; }
  .sample-game-frame iframe { height: 70vw; min-height: 300px; }
  .click-game-frame { width: 100%; }
  .click-game-frame iframe { height: 100%; min-height: 0; }
  .sample-guide-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .sample-games-hero { padding: 52px 0 44px; }
  .sample-games-main,.sample-detail-main { padding: 48px 0 64px; }
  .sample-game-frame { border-width: 4px; }
}