.catalog-page-modern {
  --catalog-gutter: clamp(18px, 3vw, 40px);
  padding: 0 var(--catalog-gutter);
}

/* Shared bottom row keeps prices and actions aligned across cards. */
.catalog-page-modern .modern-game-card {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto 1fr auto;
  column-gap: 16px; padding: 24px;
}
.catalog-page-modern .modern-game-image,
.catalog-page-modern .modern-game-card h2,
.catalog-page-modern .modern-game-card > p { grid-column: 1 / -1; }
.catalog-page-modern .modern-game-card > p { font-size: 16px; }
.catalog-page-modern .game-price {
  grid-column: 2; grid-row: 4; align-self: center;
  justify-self: end; margin: 0; white-space: nowrap; font-size: 22px;
}
.catalog-page-modern .modern-card-bottom {
  grid-column: 1; grid-row: 4; align-self: end;
}
@media (max-width: 420px) {
  .catalog-page-modern .modern-game-card { grid-template-columns: minmax(0, 1fr); }
  .catalog-page-modern .game-price { grid-column: 1; grid-row: 4; margin-bottom: 16px; }
  .catalog-page-modern .modern-card-bottom { grid-column: 1; grid-row: 5; }
}

/* Square corners throughout the catalogue content, including generated cards. */
.catalog-page-modern.catalog-page-modern *,
.catalog-page-modern.catalog-page-modern *::before,
.catalog-page-modern.catalog-page-modern *::after {
  border-radius: 0;
}

.catalog-page-modern .catalog-main-hero,
.catalog-page-modern .catalog-order-modern {
  width: calc(100% + var(--catalog-gutter) + var(--catalog-gutter));
  max-width: none;
  margin-left: calc(0px - var(--catalog-gutter));
  margin-right: calc(0px - var(--catalog-gutter));
  border-radius: 0;
}

.catalog-page-modern .catalog-order-modern {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  margin-top: clamp(54px, 7vw, 92px);
  padding: 36px clamp(28px, 4vw, 56px);
  background: var(--page-warm);
  color: var(--page-heading);
  box-shadow: 0 18px 52px rgba(9, 33, 69, .08);
}

.catalog-page-modern .catalog-order-modern h2 { margin: 6px 0 12px; }
.catalog-page-modern .catalog-order-modern p {
  max-width: 980px;
  font-size: 16px;
  line-height: 1.7;
  color: var(--page-text);
}
.catalog-page-modern .catalog-order-modern p a { color: var(--page-brand); }
.catalog-page-modern .catalog-order-modern .primary-mail { border-radius: 10px; }

.catalog-page-modern .catalog-main-hero {
  background: linear-gradient(120deg, #fffbed 0%, #fff0b5 50%, #ffdc70 100%);
  box-shadow: none;
}
.catalog-page-modern .catalog-main-hero::before,
.catalog-page-modern .catalog-main-art::before,
.catalog-page-modern .catalog-main-art::after { content: none; }
.catalog-page-modern .catalog-main-copy h1 {
  font-size: clamp(36px, 4vw, 70px); line-height: 1.1;
}
.catalog-page-modern .catalog-main-copy p { font-size: 18px; line-height: 1.6; }
.catalog-page-modern .modern-game-card::before {
  background: linear-gradient(135deg, #edf5ff, #f7fbff);
}
.catalog-page-modern .modern-game-card .modern-card-bottom {
  min-height: 54px; padding: 14px 24px; border-radius: 10px;
  background: #edf7ff; color: #016195; box-shadow: none;
  font-size: 16px; font-weight: 800; line-height: 1.4;
}
.catalog-page-modern .modern-game-card .modern-card-bottom b { display: none; }
.catalog-page-modern .modern-game-card:hover .modern-card-bottom {
  background: #dceefa; box-shadow: none; transform: none;
}
.catalog-page-modern .modern-game-card:focus-visible {
  outline: 3px solid #016195; outline-offset: 3px;
}

@media (max-width: 980px) {
  .catalog-page-modern .catalog-order-modern { grid-template-columns: minmax(0, 1fr); }
  .catalog-page-modern .catalog-order-modern .primary-mail { justify-self: start; }
}

@media (max-width: 640px) {
  .catalog-page-modern { --catalog-gutter: 12px; }
  .catalog-page-modern .catalog-order-modern { margin-top: 44px; padding: 24px 20px; }
  .catalog-page-modern .catalog-order-modern .primary-mail { max-width: 100%; overflow-wrap: anywhere; }
}