/* Self-contained marketplace layout. Keep after the shared styles. */
.shop.shop-channels {
  display: block;
  margin: 0;
  padding-top: 80px;
  padding-bottom: 72px;
}
.shop-channels .shop-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: end;
  gap: 40px;
  margin-bottom: 30px;
}
.shop-channels .shop-intro h2 {
  font-size: clamp(2.5rem, 5.4vw, 4.8rem);
  line-height: 1;
  letter-spacing: -.045em;
  margin: 14px 0 0;
}
.shop-channels .shop-intro p {
  max-width: 490px;
  margin: 0 0 4px;
  color: #b7c2d1;
  font-size: 1rem;
  line-height: 1.6;
}
.shop-channel-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.shop-channel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 24px;
  border: 1px solid #29384a;
  border-radius: 12px;
  background: #0e1723;
  text-align: left;
  transition: border-color .15s, background .15s;
}
.shop-channel:hover {
  border-color: #54adff;
  background: #132237;
}
.shop-channel:focus-visible, .shop-explore:focus-visible {
  outline: 3px solid #54adff;
  outline-offset: 4px;
}
.shop-channel h3 {
  margin: 0 0 10px;
  font-size: 1.4rem;
  line-height: 1.2;
  letter-spacing: -.02em;
  font-weight: 800;
}
.shop-channel p {
  margin: 0 0 22px;
  color: #b7c2d1;
  font-size: .94rem;
  line-height: 1.5;
  font-weight: 400;
}
.shop-channel .channel-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  color: #73bdff;
  font-size: .82rem;
  line-height: 1.4;
  font-weight: 700;
}
.channel-action > span { flex: 0 0 auto; font-size: 1.1rem; }
.shop-explore {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  margin-top: 16px;
  color: #73bdff;
  font-size: .95rem;
  line-height: 1.4;
  font-weight: 700;
}
.shop-explore:hover { text-decoration: underline; text-underline-offset: 4px; }
.shop-hub .page-main { padding-top: 0; }
.shop-hub .page-hero { padding-top: 64px; padding-bottom: 48px; }
.shop-hub .page-hero h1 {
  margin-top: 18px;
  font-size: clamp(2rem, 5.3vw, 4.6rem);
  line-height: 1.06;
  overflow-wrap: anywhere;
}
.shop-hub .content-section { padding-top: 48px; padding-bottom: 48px; }
.shop-hub .marketplace-grid { margin-top: 24px; gap: 20px; }
.shop-hub .marketplace-card { border-radius: 12px; }
.shop-hub .marketplace-card h2 { line-height: 1.1; }
.shop-hub .marketplace-card p { font-size: 1rem; line-height: 1.65; }
.shop-hub .market-badge { white-space: nowrap; }
.shop-hub #finds-heading, .shop-hub .cta-panel h2 { line-height: 1.1; }
@media (max-width: 1100px) {
  .shop-channel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .shop.shop-channels { padding: 48px 20px 40px; }
  .shop-channels .shop-intro { grid-template-columns: minmax(0, 1fr); gap: 18px; margin-bottom: 24px; }
  .shop-channels .shop-intro h2 { font-size: clamp(2.3rem, 9.8vw, 3.4rem); }
  .shop-channels .shop-intro p { font-size: .95rem; line-height: 1.5; }
  .shop-channel-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .shop-channel { padding: 18px 20px; }
  .shop-channel h3 { font-size: 1.25rem; margin-bottom: 7px; }
  .shop-channel p { margin-bottom: 12px; font-size: .94rem; }
  .shop-hub .page-hero { padding: 40px 20px 32px; }
  .shop-hub .page-hero p { font-size: 1rem; line-height: 1.6; }
  .shop-hub .content-section { padding: 32px 20px; }
  .shop-hub .marketplace-card { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .shop-channel { transition: none; }
}
