/* Bingame promo: single cohesive illustration and fully separated content */
#original-landing .original-mini-grid{align-items:stretch!important}
#original-landing .original-mini-card.promo-showcase,
#original-landing #promocodes.promo-showcase{
  display:grid!important;
  grid-template-columns:minmax(0,56%) minmax(0,44%)!important;
  grid-template-rows:auto auto minmax(0,1fr) auto!important;
  grid-template-areas:'heading illustration' 'description illustration' 'facts illustration' 'button illustration'!important;
  gap:8px 0!important;
  align-items:start!important;
  min-height:525px!important;
  padding:24px 20px 22px!important;
  overflow:hidden!important;
  border-radius:22px!important;
  isolation:isolate!important;
  background:radial-gradient(ellipse at 82% 45%,rgba(6,172,137,.19),transparent 60%),linear-gradient(130deg,#063630 0%,#042525 62%,#031f24 100%)!important;
  border:1px solid rgba(45,224,171,.52)!important;
  box-shadow:0 18px 40px rgba(0,0,0,.20),inset 0 1px rgba(190,255,232,.1)!important;
}
#original-landing #promocodes.promo-showcase::after{display:none!important}
#original-landing #promocodes .promo-display-heading,
#original-landing #promocodes .promo-original-copy,
#original-landing #promocodes .promo-facts,
#original-landing #promocodes .promo-copyrow,
#original-landing :is(#promocodes,.promo-showcase) .promo-display-heading,
#original-landing :is(#promocodes,.promo-showcase) .promo-original-copy,
#original-landing :is(#promocodes,.promo-showcase) .promo-facts,
#original-landing :is(#promocodes,.promo-showcase) .promo-copyrow{
  width:100%!important;max-width:none!important;min-width:0!important;
  padding-right:7px!important;margin-left:0!important;
  position:relative!important;z-index:2!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-display-heading{
  grid-area:heading!important;margin:0 0 1px!important;
  font-size:clamp(1.65rem,2.2vw,2.15rem)!important;line-height:1.12!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-original-copy{
  grid-area:description!important;font-size:.9rem!important;line-height:1.55!important;
  color:#d8eee7!important;padding-top:0!important;margin:0!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-facts{
  grid-area:facts!important;display:flex!important;flex-direction:column!important;
  gap:8px!important;margin:13px 0 0!important;align-self:start!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-fact{
  display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;
  align-items:center!important;gap:10px!important;
  border:1px solid rgba(59,200,164,.13)!important;
  border-radius:11px!important;
  background:rgba(4,41,39,.42)!important;
  box-shadow:none!important;
  padding:8px 7px!important;min-height:59px!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-fact-icon{
  width:42px!important;height:42px!important;
  border-radius:11px!important;
  background:rgba(16,120,100,.25)!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-fact-text{min-width:0!important}
#original-landing :is(#promocodes,.promo-showcase) .promo-fact-text strong{display:block!important;font-size:.87rem!important;line-height:1.22!important}
#original-landing :is(#promocodes,.promo-showcase) .promo-fact-text small{display:block!important;font-size:.70rem!important;line-height:1.38!important}
#original-landing :is(#promocodes,.promo-showcase) .promo-copyrow{
  grid-area:button!important;align-self:end!important;margin:10px 0 0!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-code-copy{
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:100%!important;min-height:49px!important;
  border-radius:13px!important;
  border:1px solid rgba(110,255,204,.7)!important;
  background:linear-gradient(94deg,#0dd4a1,#32e5ad)!important;
  color:#03342c!important;font-size:.91rem!important;font-weight:900!important;
  white-space:normal!important;line-height:1.25!important;
  box-shadow:0 10px 20px rgba(4,200,150,.18)!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-visual-art,
#original-landing #promocodes .promo-visual-art{
  grid-area:illustration!important;
  position:relative!important;display:block!important;
  inset:auto!important;width:100%!important;height:100%!important;min-height:445px!important;
  overflow:visible!important;
  opacity:1!important;margin:0!important;padding:0!important;
  transform:none!important;filter:none!important;
  isolation:isolate!important;pointer-events:none!important;
  mask-image:none!important;-webkit-mask-image:none!important;
}
#original-landing :is(#promocodes,.promo-showcase) .promo-visual-art::before,
#original-landing :is(#promocodes,.promo-showcase) .promo-visual-art::after{display:none!important}
#original-landing :is(#promocodes,.promo-showcase) .promo-visual-art img.promo-artwork-single{
  display:block!important;position:absolute!important;
  width:143%!important;height:107%!important;max-width:none!important;
  top:-3%!important;left:-22%!important;right:auto!important;bottom:auto!important;
  object-fit:contain!important;object-position:center!important;
  filter:none!important;opacity:1!important;
  mask-image:none!important;-webkit-mask-image:none!important;
  transform:none!important;
}
@media (min-width:861px) and (max-width:1150px){
  #original-landing :is(#promocodes,.promo-showcase) .promo-display-heading{font-size:1.62rem!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-original-copy{font-size:.84rem!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-fact{gap:7px!important;padding:7px 5px!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-fact-text small{font-size:.65rem!important}
}
@media (max-width:860px){
  #original-landing .original-mini-card.promo-showcase,
  #original-landing #promocodes.promo-showcase{
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto 262px auto auto!important;
    grid-template-areas:'heading' 'description' 'illustration' 'facts' 'button'!important;
    padding:20px!important;gap:9px!important;min-height:0!important;
  }
  #original-landing :is(#promocodes,.promo-showcase) .promo-display-heading,
  #original-landing :is(#promocodes,.promo-showcase) .promo-original-copy,
  #original-landing :is(#promocodes,.promo-showcase) .promo-facts,
  #original-landing :is(#promocodes,.promo-showcase) .promo-copyrow{max-width:100%!important;padding-right:0!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-display-heading{font-size:1.8rem!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-visual-art,
  #original-landing #promocodes .promo-visual-art{
    min-height:262px!important;height:262px!important;max-height:262px!important;
    width:100%!important;overflow:hidden!important;
  }
  #original-landing :is(#promocodes,.promo-showcase) .promo-visual-art img.promo-artwork-single{
    width:100%!important;height:100%!important;left:0!important;top:0!important;
    object-fit:contain!important;
  }
  #original-landing :is(#promocodes,.promo-showcase) .promo-facts{margin:0!important;gap:8px!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-copyrow{margin:6px 0 0!important}
}
@media (max-width:520px){
  #original-landing .original-mini-card.promo-showcase,
  #original-landing #promocodes.promo-showcase{
    grid-template-rows:auto auto 245px auto auto!important;
    padding:18px 16px!important;gap:8px!important;
  }
  #original-landing :is(#promocodes,.promo-showcase) .promo-display-heading{font-size:1.62rem!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-original-copy{font-size:.88rem!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-visual-art,
  #original-landing #promocodes .promo-visual-art{min-height:245px!important;height:245px!important;max-height:245px!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-fact{min-height:54px!important}
  #original-landing :is(#promocodes,.promo-showcase) .promo-code-copy{min-height:46px!important}
}
/* Final geometry: artwork stays clear of labels, and fills the mobile art panel. */
@media (min-width:861px){
  #original-landing :is(#promocodes,.promo-showcase) .promo-visual-art img.promo-artwork-single{
    left:0!important;
    width:119%!important;
    top:-1%!important;
    height:101%!important;
  }
  #original-landing :is(#promocodes,.promo-showcase) .promo-facts{
    justify-content:space-between!important;
    align-self:stretch!important;
  }
}
@media (max-width:860px){
  #original-landing :is(#promocodes,.promo-showcase) .promo-visual-art img.promo-artwork-single{
    width:122%!important;
    height:115%!important;
    top:-7%!important;
    left:-11%!important;
    object-fit:cover!important;
    object-position:center 47%!important;
  }
}
/* English parity and seamless mobile vignette, independent of JS reveal. */
#original-landing :is(#promocodes,.promo-showcase).reveal{
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
}
@media (max-width:860px){
  #original-landing :is(#promocodes,.promo-showcase) .promo-visual-art{
    min-width:0!important;max-width:none!important;
    -webkit-mask-image:radial-gradient(ellipse 76% 80% at 50% 49%,#000 42%,rgba(0,0,0,.94) 56%,rgba(0,0,0,.67) 73%,rgba(0,0,0,.20) 88%,transparent 100%)!important;
    mask-image:radial-gradient(ellipse 76% 80% at 50% 49%,#000 42%,rgba(0,0,0,.94) 56%,rgba(0,0,0,.67) 73%,rgba(0,0,0,.20) 88%,transparent 100%)!important;
  }
}
@media(max-width:860px){
  #original-landing :is(#promocodes,.promo-showcase) .promo-visual-art{
    -webkit-mask-image:radial-gradient(ellipse 62% 52% at 50% 50%,#000 30%,rgba(0,0,0,.95) 50%,rgba(0,0,0,.55) 72%,transparent 100%)!important;
    mask-image:radial-gradient(ellipse 62% 52% at 50% 50%,#000 30%,rgba(0,0,0,.95) 50%,rgba(0,0,0,.55) 72%,transparent 100%)!important;
  }
}
