.jank-campaign .campaign-hero { padding-bottom: 54px; }
.jank-campaign .game-hub-layout { align-items: center; gap: clamp(28px, 5vw, 90px); }
.jank-campaign .campaign-hero h1 { font-size: clamp(48px, 6.8vw, 100px); line-height: 1.02; }
.jank-campaign .campaign-hero h1 .purple-ink { color: var(--gold); }
.jank-campaign .campaign-detail { max-width: 540px; font-size: 18px; line-height: 1.6; margin: 20px 0; }
.campaign-gameplay { width: min(100%, 300px); margin: 0 auto; position: relative; transform: rotate(2deg); }
.campaign-gameplay video { width: 100%; height: auto; display: block; background: #181717; border: 6px solid #181717; border-radius: 18px; box-shadow: 12px 12px 0 #9e50c6; }
.campaign-gameplay figcaption { margin-top: 25px; font-size: 12px; line-height: 1.5; text-align: center; }
.campaign-how { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; border-bottom: 2px solid #181717; }
.campaign-steps { padding-left: 28px; margin: 0; align-self: center; }
.campaign-steps li { padding: 20px 0 20px 12px; border-bottom: 1px solid #181717; }
.campaign-steps li::marker { font-weight: 800; color: #682b89; }
.campaign-steps strong, .campaign-steps span { display: block; }
.campaign-steps strong { font-size: 22px; margin-bottom: 6px; }
.campaign-steps span { line-height: 1.6; }
.campaign-final { margin-top: 32px; }
@media (max-width: 780px) {
  .jank-campaign .game-hub-layout { grid-template-columns: 1fr; }
  .jank-campaign .campaign-hero h1 { font-size: clamp(46px, 11vw, 72px); }
  .campaign-gameplay { margin-top: 16px; width: min(80%, 280px); }
  .campaign-how { grid-template-columns: 1fr; gap: 16px; }
}
