/* BOXY Run entry point: a sky-blue band (the pfp/coin background) between the buying cards and the label. */
/* Play stacks under Trade and Token details at its natural width. */
.hero-links > .hero-break { flex-basis: 100%; height: 0; min-height: 0; padding: 0; border: 0; }
.hero-links > .hero-play { margin-top: -10px; background: #4fb0fb; }
.hero-play:hover { background: #79c3fc; transform: translateY(-1px); }

.night-shift {
  background: #4fb0fb;
  color: #2c2918;
  border-block: 2px solid #2c2918;
  padding: 72px 44px;
}
.night-shift-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  align-items: center;
  gap: 40px;
}
.night-shift .section-label { color: #2c2918; }
.night-shift h2 {
  font-size: clamp(34px, 3.8vw, 54px);
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1.1;
  margin: 14px 0 14px;
  text-wrap: balance;
}
.night-shift-copy > p {
  max-width: 46ch;
  margin: 0 0 26px;
  font-size: 15px;
  line-height: 1.65;
}
.night-shift-play {
  display: inline-flex;
  align-items: center;
  gap: 24px;
  min-height: 48px;
  padding: 13px 18px;
  border: 2px solid #2c2918;
  border-radius: 5px 8px 4px 7px;
  box-shadow: 0 3px 0 #2c2918;
  background: #ffbe55;
  color: #2c2918;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.night-shift-play:hover { background: #ffd17f; }
.night-shift-play:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.night-shift-copy small { display: block; margin-top: 14px; font-size: 12px; }
.night-shift-art { display: grid; place-items: center; }
.night-shift-art img {
  width: 100%;
  max-width: 300px;
  height: auto;
  transition: transform 0.3s ease;
}
.night-shift-art:hover img { transform: translateY(-5px) rotate(-3deg); }

@media (max-width: 1100px) {
  .night-shift { padding-inline: 28px; }
}
/* Mobile hero links are a two-column grid; Play takes its own full-width row. */
@media (max-width: 760px), (max-width: 1000px) and (pointer: coarse) {
  .hero-links > .hero-break { display: none; }
  .hero-links > .hero-play { grid-column: 1 / -1; margin-top: 0; }
  .night-shift { padding: 54px 20px; }
  .night-shift-inner { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .night-shift-art { order: -1; }
  .night-shift-art img { max-width: 170px; }
  .night-shift h2 { font-size: 33px; }
  .night-shift-copy > p { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .night-shift-art img, .hero-play { transition: none; }
  .night-shift-art:hover img, .hero-play:hover { transform: none; }
}