.mredutainment { background: #000; color: #fff; }
.brand-footer.has-cast { padding-bottom: 135px; background-image: url('/assets/images/mredutainment/footer-cast.png'); background-position: center bottom; background-size: auto 300px; background-repeat: repeat-x; }
#mre-heading { padding: 0; }
#mre-intro { --dark-background: #252d35; padding: 60px 40px; border-radius: 0 0 var(--radius) var(--radius) }
#mre-intro h1 { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px; font-size: clamp(26px, 2.65vw, 38px); }
#mre-intro h1 > span { white-space: nowrap; }
#mre-intro > p { max-width: 770px; margin-inline: auto; color: #ccc; font-size: 21px; line-height: 1.3; margin-top: 18px; }
#mre-intro .brand-wordmark { display: inline-block; vertical-align: middle; width: 288px; max-width: 100%; padding: 2px 6px; border-radius: 12px; background: #ff6428; }
#mre-directory { padding: 20px 0 0; --layout-gap: 20px; }
#mre-directory .card.exhibit { --exhibit-height: 640px; --exhibit-card-height: 640px; --art-base: #000; --exhibit-content-width: 100%; border-radius: 24px; }
#mre-directory .card.exhibit > .content { width: 100%; max-width: 680px; padding: 60px; }
#mre-directory .card h2 { font-size: clamp(36px, 4vw, 56px); }
#mre-directory .card p { font-size: 18px; opacity: .8; }
#mre-directory .card .brand-tile-logo { display: block; width: 150px; height: auto; }
#mre-growthcandy .brand-tile-logo { max-width: 85px; }
#mre-directory .inset { color: #fff; }
#mre-directory .inset .quote { --muted: #ccc; font-size: 16px; }
#mre-directory .inset .quote .media-content > strong { color: inherit; }
#mre-directory .inset .quote blockquote { font-size: 18px; }
#mre-join .eyebrow { font-size: 20px; font-weight: 750; }
#mre-resources { --dark-background: #000; padding: 20px 0 0; }
#mre-resources .card { --surface: #252d35; text-align: center; }
#mre-resources .card > .content { padding: 60px 32px; display: flex; flex-direction: column; align-items: center; }
#mre-resources .card > .content > p:not(.eyebrow) { margin-bottom: auto; }
#mre-resources h2 { font-size: clamp(28px, 2.7vw, 38px); }
#mre-resources p { font-size: 18px; color: #ccc; }
#mre-resources .eyebrow { color: #ff7394; font-size: 20px; font-weight: 750; }
@media (max-width: 800px) {
  #mre-directory .card.exhibit > .content { max-width: 100%; padding: 28px; background: #0007; }
  #mre-directory .card.exhibit { --exhibit-card-height: 620px; }
  #mre-directory .card.exhibit > .inset { padding: 22px; background: #171c22; }
  #mre-intro { padding: 40px 24px; }
  #mre-intro h1 > span { white-space: normal; }
  #mre-resources .card > .content { padding: 32px 24px; }
}