/* Promo reference layout. Original artwork is displayed without color filters. */
body.promo-reference {
  background: #080705 url('../images/background.jpg') center top / cover fixed no-repeat;
}
.promo-page {
  width: 1180px; max-width: calc(100% - 24px); margin: 19px auto 42px;
  display: grid; grid-template-columns: minmax(0, 875px) minmax(240px, 1fr); gap: 20px;
}
.promo-page .promo-section {
  margin-bottom: 0; border: 1px solid #b88c19; border-radius: 6px; overflow: hidden;
  background: #100d04 url('../images/background.jpg') center / cover no-repeat;
  box-shadow: 0 0 8px #d5a520;
}
.promo-info {
  align-self: stretch; padding: 18px; border: 1px solid #b88c19; border-radius: 6px;
  background: linear-gradient(145deg, rgba(73, 51, 11, .96), rgba(8, 7, 5, .96));
  box-shadow: 0 0 8px rgba(213, 165, 32, .65); color: #eee;
}
.promo-info p { margin: 0 0 14px; font-size: 13px; line-height: 1.55; }
.promo-info p:last-child { margin-bottom: 0; }
.promo-info strong { display: block; margin-bottom: 3px; color: #ffe000; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.promo-section:nth-of-type(1), .promo-info:nth-of-type(1) { grid-row: 1; }
.promo-section:nth-of-type(2), .promo-info:nth-of-type(2) { grid-row: 2; }
.promo-section:nth-of-type(3), .promo-info:nth-of-type(3) { grid-row: 3; }
.promo-section:nth-of-type(4), .promo-info:nth-of-type(4) { grid-row: 4; }
.promo-section:nth-of-type(5), .promo-info:nth-of-type(5) { grid-row: 5; }
.promo-section:nth-of-type(6), .promo-info:nth-of-type(6) { grid-row: 6; }
.promo-section:nth-of-type(7), .promo-info:nth-of-type(7) { grid-row: 7; }
.promo-section:nth-of-type(8), .promo-info:nth-of-type(8) { grid-row: 8; }
.promo-section:nth-of-type(9), .promo-info:nth-of-type(9) { grid-row: 9; }
.promo-section:nth-of-type(10), .promo-info:nth-of-type(10) { grid-row: 10; }
.promo-section:nth-of-type(11), .promo-info:nth-of-type(11) { grid-row: 11; }
.promo-section:nth-of-type(12), .promo-info:nth-of-type(12) { grid-row: 12; }
.promo-page .promo-section h2 {
  height: 98px; margin: 0; padding: 20px 20px 18px; display: flex; align-items: flex-end;
  background: none; color: white; font: bold 14px Arial, sans-serif;
  text-shadow: none; -webkit-text-stroke: 0;
}
.promo-page .promo-section .promo-heading-art img {
  width: 480px; height: auto; max-width: 100%; max-height: 56px;
  object-fit: contain; object-position: left bottom;
}
.promo-page .promo-section.compact h2 { height: 60px; padding: 18px 20px 12px; }
.promo-page .promo-cards {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px;
  padding: 8px 20px 11px; min-height: 0; border: 0; border-radius: 0; background: none;
}
.promo-page .claim-card {
  flex: 0 0 100px; width: 100px; height: 120px; padding: 10px 7px 29px;
  border: 0; border-radius: 6px; box-shadow: none;
  background: transparent url('../images/4f9401a5aa386acb91f2e.gif') center / 100% 100% no-repeat;
  color: #ccc; text-align: center;
}
.promo-page .claim-card::before { content: none; }
.promo-page .claim-name { font: 14px/16px Georgia, serif; }
.promo-page .claim-card strong { font: bold 14px/18px Arial, sans-serif; margin-top: 5px; }
.promo-page .promo-image-button {
  display: block; flex: 0 0 auto; width: auto; max-width: 100%; height: 120px;
  padding: 0; border: 0; border-radius: 8px; background: transparent;
}
.promo-page .promo-image-button img { width: auto; height: 120px; max-width: 100%; display: block; object-fit: contain; }
.promo-page .minigame-banner, .promo-page .minigame-banner img { width: 233px; height: 120px; }
.promo-page .row-break { flex-basis: 100%; height: 0; margin: -5px 0; }
.partnership-review {
  display: flex; flex-direction: column; justify-content: center; flex: 0 0 340px;
  width: 340px; height: 114px; margin-top: 3px; padding: 10px 12px;
  border: 4px solid #c99a22; border-radius: 7px;
  background: linear-gradient(135deg, #aaa, #eee 35%, #777); color: #111;
}
.partnership-logo { display: block; overflow: hidden; height: 52px; }
.partnership-logo img { display: block; width: 100%; height: auto; }
.partnership-review strong { font: 900 21px/25px Arial, sans-serif; text-shadow: 1px 1px #ddd; }
.promo-reference .bottom { background: #151006 url('../images/footer_bg.png') center / cover no-repeat; }
.promo-reference .promo-page img, .promo-reference .promo-page button,
.promo-reference .promo-page button:hover { filter: none; }
@media (max-width: 760px) {
  .promo-page { max-width: calc(100% - 20px); margin-top: 15px; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .promo-section:nth-of-type(1) { grid-row: 1; } .promo-info:nth-of-type(1) { grid-row: 2; }
  .promo-section:nth-of-type(2) { grid-row: 3; } .promo-info:nth-of-type(2) { grid-row: 4; }
  .promo-section:nth-of-type(3) { grid-row: 5; } .promo-info:nth-of-type(3) { grid-row: 6; }
  .promo-section:nth-of-type(4) { grid-row: 7; } .promo-info:nth-of-type(4) { grid-row: 8; }
  .promo-section:nth-of-type(5) { grid-row: 9; } .promo-info:nth-of-type(5) { grid-row: 10; }
  .promo-section:nth-of-type(6) { grid-row: 11; } .promo-info:nth-of-type(6) { grid-row: 12; }
  .promo-section:nth-of-type(7) { grid-row: 13; } .promo-info:nth-of-type(7) { grid-row: 14; }
  .promo-section:nth-of-type(8) { grid-row: 15; } .promo-info:nth-of-type(8) { grid-row: 16; }
  .promo-section:nth-of-type(9) { grid-row: 17; } .promo-info:nth-of-type(9) { grid-row: 18; }
  .promo-section:nth-of-type(10) { grid-row: 19; } .promo-info:nth-of-type(10) { grid-row: 20; }
  .promo-section:nth-of-type(11) { grid-row: 21; } .promo-info:nth-of-type(11) { grid-row: 22; }
  .promo-section:nth-of-type(12) { grid-row: 23; } .promo-info:nth-of-type(12) { grid-row: 24; }
  .promo-info { padding: 14px; margin-bottom: 10px; }
  .promo-page .promo-section h2 { height: 80px; padding: 14px 12px; }
  .promo-page .promo-section.compact h2 { height: 54px; padding: 14px 12px 10px; }
  .promo-page .promo-cards { padding: 6px 12px 12px; gap: 10px 8px; }
  .promo-page .claim-card { flex-basis: 94px; width: 94px; height: 113px; }
  .promo-page .claim-name { font-size: 12px; line-height: 15px; }
  .partnership-review { flex: 0 1 340px; max-width: 100%; }
  .promo-page .promo-image-button { flex: 0 1 auto; max-width: 100%; height: auto; }
  .promo-page .promo-image-button img { max-width: 100%; height: auto; max-height: 120px; }
}
@media (max-width: 360px) {
  .promo-page .claim-card { flex-basis: calc((100% - 16px) / 3); width: calc((100% - 16px) / 3); }
}

/* Reference yellow framing, preserving supplied artwork without filters. */
.promo-page .promo-section { border-color: #ffe000; box-shadow: 0 0 8px #ffe000; }
.promo-page .claim-card { color: #c7c7c7; }
