/* A decorative engraving accompanies the existing Earn introduction. */
.dockyard-earn-index-header {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  column-gap: 24px;
  align-items: center;
}
.dockyard-earn-index-header h1 { grid-column: 1; grid-row: 1; align-self: end; }
.dockyard-earn-index-header p { grid-column: 1; grid-row: 2; align-self: start; }
.dockyard-earn-index-header::after {
  content: "";
  display: block;
  grid-column: 2;
  grid-row: 1 / 3;
  width: 100%;
  aspect-ratio: 3 / 2;
  background: url('/illustrations/turret-earn-vault-v1.webp') center / contain no-repeat;
  mix-blend-mode: multiply;
  pointer-events: none;
}
@media (max-width: 700px) {
  .dockyard-earn-index-header { grid-template-columns: minmax(0, 1fr); }
  .dockyard-earn-index-header::after {
    grid-column: 1;
    grid-row: 3;
    max-width: 360px;
    justify-self: center;
    margin-top: 12px;
  }
}