/* The Game page: product photography and a concise introduction. */
.game-hero {
  min-height: 290px;
  display: flex;
  align-items: center;
  padding: 72px 0 66px;
  background: #301911;
  border-bottom: 5px solid #a97837;
}
.game-hero:before {
  background: radial-gradient(circle at 72% 40%, rgba(153, 78, 38, .38), transparent 42%),
    linear-gradient(115deg, #21120d, #51271a 64%, #21120d);
  filter: none;
  transform: none;
}
.game-hero:after { background: linear-gradient(180deg, transparent, rgba(13, 7, 4, .3)); }
.game-hero .wrap:before { display: none; }
.game-hero .eyebrow { color: #e4c37c; }
.game-hero h1 { margin: .17em 0 0; }

.game-intro {
  padding-top: 72px;
  padding-bottom: 80px;
  background-image: linear-gradient(rgba(246, 235, 208, .75), rgba(224, 203, 160, .5)), var(--parch-texture);
  background-size: auto, 520px auto;
}
.game-intro-copy { text-align: center; }
.game-intro-copy .section-title { color: #4d2019; margin: .14em 0 .32em; }
.game-lede { max-width: 780px; margin: 0 auto; font-size: clamp(1.35rem, 2.1vw, 1.7rem); line-height: 1.55; color: #3e2d20; }
.game-facts { display: inline-flex; align-items: center; gap: 16px; margin: 31px auto 42px; padding: 11px 25px; border-top: 1px solid #9b7438; border-bottom: 1px solid #9b7438; color: #5b231d; font-family: var(--display); font-size: .9rem; font-weight: 700; letter-spacing: .07em; }
.game-facts span { color: #aa7834; font-size: .55rem; }
.game-table { margin-top: 0; margin-bottom: 0; max-width: 1200px; }
.game-table img { display: block; width: 100%; height: auto; border: 8px solid #e9d2a4; outline: 1px solid #946d39; box-shadow: 0 25px 50px rgba(48, 27, 11, .3); }
.game-overview { margin-top: clamp(42px, 6vw, 68px); color: #3e2d20; font-size: clamp(1.1rem, 1.6vw, 1.25rem); line-height: 1.7; }
.game-overview h2 { margin: 0 0 28px; color: #4d2019; font-family: var(--display); font-size: clamp(1.5rem, 2.6vw, 2.15rem); line-height: 1.4; text-wrap: balance; }
.game-overview p { margin: 0 0 22px; }
.game-overview .game-overview-closing { margin-top: 30px; margin-bottom: 0; padding-top: 24px; border-top: 1px solid #b18a50; color: #5b231d; }
.game-table-action { display: flex; justify-content: center; margin-top: 30px; }
.game-table-action .btn { min-width: 190px; }

.game-pillars { padding: 80px 0; }
.game-pillars-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.game-pillar { position: relative; padding: 10px 38px 15px; }
.game-pillar + .game-pillar { border-left: 1px solid rgba(229, 195, 127, .34); }
.game-pillar-number { color: #c8a064; font-family: var(--display); font-size: .75rem; letter-spacing: .12em; }
.game-pillar h2 { color: #f0d293; font-family: var(--display); font-size: clamp(1.5rem, 2.5vw, 2.15rem); letter-spacing: .12em; margin: 12px 0 15px; }
.game-pillar p { margin: 0; color: #ede0cf; font-size: 1.12rem; line-height: 1.58; }

.game-cards { padding: 90px 0 95px; background-image: linear-gradient(rgba(246, 234, 205, .78), rgba(233, 213, 175, .74)), var(--parch-texture); background-size: auto, 520px auto; }
.game-section-heading { text-align: center; margin: 0 auto 41px; max-width: 720px; }
.game-section-heading .section-title { color: #4d2019; }
.game-section-heading > p:last-child { margin: 0; font-size: 1.17rem; color: #5e4834; }
.game-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; align-items: start; }
.game-card-grid figure { margin: 0; min-width: 0; }
.game-card-grid a { display: block; background: #f5e9ca; border: 1px solid #98733e; box-shadow: 0 15px 26px rgba(47, 27, 12, .24); transition: transform .18s ease, box-shadow .18s ease; }
.game-card-grid a:hover, .game-card-grid a:focus-visible { transform: translateY(-5px); box-shadow: 0 23px 33px rgba(47, 27, 12, .3); }
.game-card-grid img { display: block; width: 100%; height: auto; aspect-ratio: 1060 / 1484; object-fit: contain; }
.game-card-grid figcaption { padding: 16px 4px 0; color: #4e291d; font-family: var(--display); font-weight: 700; font-size: .91rem; line-height: 1.35; }
.game-card-grid figcaption span { display: block; margin-top: 4px; color: #765d45; font-family: var(--serif); font-size: .98rem; font-weight: 400; }
.game-card-hint { text-align: center; color: #765e43; font-size: .92rem; margin: 26px 0 0; }

.game-box-section.section:not(.section-dark):not(.section-wine):not(.paper) { padding: 70px 0; background-image: linear-gradient(rgba(251, 244, 226, .89), rgba(234, 214, 177, .9)), var(--parch-texture); background-size: auto, 520px auto; border-top: 1px solid #c3a16a; border-bottom: 1px solid #c3a16a; color: #312419; }
.game-box-layout { display: grid; grid-template-columns: 1.18fr .82fr; align-items: center; gap: 70px; }
.game-box-art { margin: 0; }
.game-box-art img { display: block; width: 100%; height: auto; max-height: 560px; object-fit: contain; filter: drop-shadow(0 23px 28px rgba(0, 0, 0, .38)); }
.game-box-copy .kicker { color: #7e3123; }
.game-box-copy .section-title { font-size: clamp(2.1rem, 3.9vw, 3.5rem); color: #4d2019; }
.game-box-copy p:not(.kicker) { font-size: 1.2rem; color: #38291e; }
.game-text-link { display: inline-block; margin-top: 12px; color: #68241d; font-family: var(--display); font-weight: 700; font-size: .88rem; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.game-text-link:hover { color: #38130f; }
.game-cta { text-align: center; padding: 77px 0 86px; }
.game-cta .section-title { color: #4d2019; }
.game-cta p:not(.kicker) { margin: 0 auto; max-width: 640px; font-size: 1.19rem; color: #584536; }
.game-cta .buttons { justify-content: center; }

@media (max-width: 900px) {
  .game-hero { min-height: 230px; }
  .game-pillars-grid { grid-template-columns: 1fr; }
  .game-pillar { padding: 23px 12px; }
  .game-pillar + .game-pillar { border-left: 0; border-top: 1px solid rgba(229, 195, 127, .34); }
  .game-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 20px; }
  .game-box-layout { grid-template-columns: 1fr; gap: 24px; }
  .game-box-art img { max-height: 470px; }
  .game-box-copy { text-align: center; }
}
@media (max-width: 560px) {
  .game-hero { min-height: 190px; padding: 56px 0 50px; }
  .game-hero h1 { font-size: clamp(3.1rem, 13vw, 4.5rem); }
  .game-intro { padding-top: 55px; padding-bottom: 55px; }
  .game-lede { font-size: 1.22rem; }
  .game-facts { gap: 10px; padding: 9px 12px; font-size: .68rem; letter-spacing: .03em; margin: 28px auto 36px; }
  .game-table img { border-width: 5px; }
  .game-table-action { margin-top: 26px; }
  .game-pillars { padding: 40px 0; }
  .game-pillar p { font-size: 1.07rem; }
  .game-cards { padding: 60px 0 65px; }
  .game-card-grid { gap: 26px 12px; }
  .game-card-grid figcaption { font-size: .72rem; }
  .game-card-grid figcaption span { font-size: .84rem; }
  .game-box-section { padding: 52px 0 60px; }
  .game-box-copy p:not(.kicker) { font-size: 1.08rem; }
  .game-cta { padding: 62px 0 70px; }
  .game-cta .buttons .btn { width: 100%; }
}