@import url("/styles.css");

/* World 02 card only. Block Glow and the rest of the main site remain unchanged. */
.chess-showcase-home {
  margin-top: clamp(26px, 4vw, 44px);
  overflow: hidden;
  border-color: rgba(231, 189, 88, 0.22);
  background:
    radial-gradient(circle at 82% 12%, rgba(65, 139, 230, 0.18), transparent 30%),
    linear-gradient(132deg, rgba(14, 20, 35, 0.98), rgba(1, 3, 10, 0.97));
  box-shadow: 0 34px 90px rgba(0, 0, 0, 0.28), inset 0 1px rgba(255, 255, 255, 0.04);
}

.chess-showcase-home .game-index { color: #e7bd58; }
.chess-wordmark {
  margin: 0;
  color: #fffaf0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.5rem, 7vw, 6.6rem);
  font-weight: 500;
  line-height: 0.82;
  letter-spacing: -0.055em;
  text-transform: uppercase;
}

.chess-home-subtitle {
  margin: 18px 0 0;
  color: transparent;
  background: linear-gradient(92deg, #bac4d2, #f3d47d 60%, #74baff);
  background-clip: text;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.2em;
}

.chess-showcase-home .game-description,
.chess-showcase-home .feature-pills li { color: #aab3c0; }

.chess-home-media {
  position: relative;
  min-height: 100%;
  padding: clamp(24px, 4vw, 48px);
  overflow: hidden;
  display: grid;
  align-content: center;
  background:
    radial-gradient(circle at 24% 12%, rgba(83, 165, 255, 0.21), transparent 27%),
    radial-gradient(circle at 82% 86%, rgba(231, 189, 88, 0.1), transparent 30%),
    linear-gradient(155deg, rgba(11, 19, 36, 0.95), rgba(0, 1, 7, 0.98));
}

.chess-home-media::before {
  position: absolute;
  inset: 0;
  content: "";
  opacity: 0.45;
  background-image:
    linear-gradient(45deg, rgba(255,255,255,.028) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.028) 75%),
    linear-gradient(45deg, rgba(255,255,255,.028) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.028) 75%);
  background-position: 0 0, 26px 26px;
  background-size: 52px 52px;
}

.chess-home-icon {
  position: relative;
  z-index: 2;
  width: clamp(74px, 9vw, 108px);
  height: auto;
  margin: 0 0 -22px 24px;
  display: block;
  border: 1px solid rgba(231, 189, 88, 0.3);
  border-radius: 25%;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.5), 0 0 28px rgba(75, 161, 255, 0.2);
  animation: chess-home-float 5.5s ease-in-out infinite;
}

.chess-home-banner {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 8px;
  border: 1px solid rgba(231, 189, 88, 0.22);
  border-radius: 21px;
  background: #000107;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.52);
}

.chess-home-banner picture,
.chess-home-banner img { width: 100%; display: block; }
.chess-home-banner img { height: auto; border-radius: 14px; }
.chess-art-note {
  position: relative;
  z-index: 2;
  margin: 16px 0 0;
  color: rgba(224, 232, 242, 0.57);
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-align: center;
  text-transform: uppercase;
}

@keyframes chess-home-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}

@media (max-width: 960px) { .chess-home-media { min-height: 430px; } }
@media (max-width: 720px) {
  .chess-home-media { min-height: 350px; padding: 24px 18px; }
  .chess-home-icon { width: 76px; margin-left: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .chess-home-icon { animation: none; transform: none !important; }
}