/* Stronger, visibly different composition inspired by LobbyPick mockup direction. */

/* Discover hero becomes a true opening panel instead of a text block. */
.discover-page .discover-intro {
  display: grid;
  grid-template-columns: minmax(0,1.25fr) auto;
  gap: 28px;
  align-items: end;
  margin-top: 28px;
  padding: clamp(34px,5vw,64px) clamp(26px,4vw,54px) !important;
  border: 1px solid rgba(117,105,255,.28);
  border-radius: 24px;
  background:
    radial-gradient(circle at 78% 20%, rgba(131,73,255,.26), transparent 28rem),
    radial-gradient(circle at 18% 90%, rgba(71,190,255,.14), transparent 24rem),
    linear-gradient(120deg,#0d131e 0%,#121b2a 52%,#17142c 100%);
  box-shadow: 0 30px 80px rgba(0,0,0,.34);
  overflow: hidden;
}
.discover-page .discover-intro::after { display:none !important; }
.discover-page .discover-intro-copy { max-width: 780px; }
.discover-page .discover-intro h1 {
  margin: 6px 0 16px;
  font-size: clamp(2.7rem,5vw,5.4rem) !important;
  line-height: .96 !important;
  letter-spacing: -.055em !important;
}
.discover-page .discover-intro > .discover-intro-copy > p:last-child {
  max-width: 650px;
  color: #c0cada;
  font-size: clamp(1rem,1.5vw,1.16rem);
}
.discover-page .discover-intro-badges {
  display: grid;
  gap: 9px;
  min-width: 210px;
}
.discover-page .discover-intro-badges span {
  display:flex;
  align-items:center;
  min-height:42px;
  padding:9px 12px;
  border:1px solid rgba(152,167,199,.2);
  border-radius:10px;
  background:rgba(8,13,22,.48);
  color:#dce6f6;
  font-size:.78rem;
  font-weight:800;
}
.discover-page .discover-intro-badges span::before {
  content:"";
  width:8px;
  height:8px;
  margin-right:9px;
  border-radius:50%;
  background:linear-gradient(135deg,#57ddff,#9653ff);
  box-shadow:0 0 14px rgba(106,114,255,.5);
}

/* Image-led quick discovery row. */
.discover-spotlight {
  margin-top: 24px;
  padding: 22px;
  border: 1px solid rgba(113,132,170,.22);
  border-radius: 20px;
  background: rgba(11,17,27,.66);
}
.discover-spotlight-heading {
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:end;
  margin-bottom:16px;
}
.discover-spotlight-heading h2 { margin:2px 0 0; }
.discover-spotlight-heading > a {
  color:#9edfff;
  font-size:.82rem;
  font-weight:800;
  text-decoration:none;
}
.discover-spotlight-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.discover-spotlight-card {
  position:relative;
  display:grid;
  min-width:0;
  min-height:255px;
  overflow:hidden;
  border:1px solid rgba(117,136,176,.24);
  border-radius:15px;
  background:#121b29;
  color:#fff;
  text-decoration:none;
  transition:transform 160ms ease,border-color 160ms ease,box-shadow 160ms ease;
}
.discover-spotlight-card:hover {
  transform:translateY(-4px);
  border-color:rgba(126,103,255,.56);
  box-shadow:0 20px 42px rgba(44,35,124,.23);
}
.discover-spotlight-art {
  position:relative;
  height:145px;
  overflow:hidden;
  background:#0a0f18;
}
.discover-spotlight-art::after {
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:55%;
  background:linear-gradient(transparent,#121b29);
}
.discover-spotlight-art img {
  position:absolute;
  width:62%;
  height:125%;
  object-fit:cover;
  top:-8%;
  border-radius:13px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
.discover-spotlight-art img:first-child { left:-4%; transform:rotate(-5deg); }
.discover-spotlight-art img:last-child { right:-4%; transform:rotate(5deg); }
.discover-spotlight-card > div:last-child {
  display:grid;
  align-content:start;
  gap:5px;
  padding:12px 14px 15px;
}
.discover-spotlight-card small {
  color:#7bdfff;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.08em;
}
.discover-spotlight-card strong { font-size:1rem; line-height:1.18; }
.discover-spotlight-card span { color:#aeb9ca; font-size:.78rem; line-height:1.4; }
.spotlight-hidden small { color:#a7f06d; }
.spotlight-duo small { color:#7bdfff; }
.spotlight-quick small { color:#ffc76f; }
.spotlight-classic small { color:#c8a8ff; }

/* Builder now follows the visual browsing row and reads as a serious tool. */
.discover-page .finder-section {
  margin-top:24px !important;
  border-radius:22px !important;
  box-shadow:0 22px 55px rgba(0,0,0,.22);
}
.discover-page .finder-section > .section-heading h2 {
  font-size:clamp(2rem,3vw,3rem) !important;
}
.discover-page .finder-panel {
  gap:12px !important;
}
.discover-page .finder-panel > fieldset,
.discover-page .requirements-fieldset {
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

/* Result cards are utility content. Never leave them invisible waiting for scroll animation. */
.discover-page .game-grid > .motion-reveal {
  opacity: 1 !important;
  translate: none !important;
  scale: 1 !important;
  filter: none !important;
}

/* Stronger result-card image dominance. */
.discover-page .game-card img,
.discover-page .game-result-card img {
  transition:transform 260ms ease;
}
.discover-page .game-card:hover img,
.discover-page .game-result-card:hover img { transform:scale(1.035); }

/* Homepage hero takes more of the mockup's visual confidence. */
.marketing-home .hero.home-hero-compact {
  min-height:620px !important;
  padding:clamp(42px,6vw,78px) !important;
  border-radius:28px !important;
}
.marketing-home .hero.home-hero-compact h1 {
  max-width:720px;
  font-size:clamp(3rem,5.5vw,5.8rem) !important;
}
.marketing-home .hero-showcase {
  transform:perspective(1200px) rotateY(-4deg) rotateX(1deg) !important;
}
.marketing-home .home-entry-grid,
.marketing-home .home-featured-links {
  border-radius:22px !important;
}
.marketing-home .home-path-card,
.marketing-home .visual-link-card {
  border-radius:16px !important;
}

@media (max-width: 1023px) {
  .discover-page .discover-intro { grid-template-columns:1fr; align-items:start; }
  .discover-page .discover-intro-badges { grid-template-columns:repeat(3,1fr); min-width:0; }
  .discover-spotlight-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 640px) {
  .discover-page .discover-intro {
    margin-top:12px;
    padding:24px 18px !important;
    border-radius:16px;
  }
  .discover-page .discover-intro h1 { font-size:clamp(2.25rem,11vw,3.4rem) !important; }
  .discover-page .discover-intro-badges { grid-template-columns:1fr; gap:6px; }
  .discover-page .discover-intro-badges span { min-height:36px; padding:7px 10px; }
  .discover-spotlight { padding:14px; border-radius:15px; }
  .discover-spotlight-heading { align-items:start; flex-direction:column; gap:8px; }
  .discover-spotlight-grid { grid-template-columns:1fr 1fr; gap:9px; }
  .discover-spotlight-card { min-height:220px; border-radius:12px; }
  .discover-spotlight-art { height:118px; }
  .discover-spotlight-card > div:last-child { padding:10px; }
  .discover-spotlight-card strong { font-size:.9rem; }
  .discover-spotlight-card span { font-size:.7rem; }
  .marketing-home .hero.home-hero-compact { min-height:0 !important; padding:26px 18px !important; border-radius:18px !important; }
}

/* Discover polish: keep the utility and hierarchy, remove decorative effects. */
.discover-page .discover-intro {
  border-color: #2b3850;
  background: #111925;
  box-shadow: none;
}

.discover-page .discover-intro-badges span {
  border-color: #2b3850;
  background: #151d29;
}

.discover-page .discover-intro-badges span::before {
  display: none;
}

.discover-spotlight {
  border-color: #2b3850;
  background: #111925;
}

.discover-spotlight-card {
  border-color: #2b3850;
  background: #151d29;
  transition: border-color 160ms ease, background 160ms ease;
}

.discover-spotlight-card:hover,
.discover-spotlight-card:focus-visible {
  transform: none;
  border-color: #3a4b68;
  background: #182231;
  box-shadow: none;
}

.discover-spotlight-art {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: #0b111a;
}

.discover-spotlight-art::after {
  display: none;
}

.discover-spotlight-art img,
.discover-spotlight-art img:first-child,
.discover-spotlight-art img:last-child {
  position: static;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  box-shadow: none;
  transform: none;
}

.discover-spotlight-card small,
.spotlight-hidden small,
.spotlight-duo small,
.spotlight-quick small,
.spotlight-classic small {
  color: #8fb3d9;
}

.discover-page .finder-section {
  box-shadow: none;
}

.discover-page .finder-panel > fieldset,
.discover-page .requirements-fieldset {
  box-shadow: none;
}

.discover-page .builder-step legend > span {
  background: #26364d !important;
  color: #dce6f4 !important;
}

.discover-page .shortlist-drawer #startGroupVote {
  background: #b8ff2c !important;
}

.discover-page .shortlist-drawer[data-shared="true"] .drawer-header,
.discover-page .poll-modal,
.discover-page .roulette-modal {
  background: #111925 !important;
}

.discover-page #sharePoll {
  background: #49d1e5 !important;
}

.discover-page .poll-message {
  border-style: solid !important;
}