/* xFame × LANGAME: styled panoramic container, without cropping the banner. */
.langame.langame-partnership{
  box-shadow:
    0 24px 65px rgba(0,0,0,.46),
    -7px 0 32px -15px rgba(185,255,0,.64),
    7px 0 32px -15px rgba(255,28,35,.64);
}

.langame-partnership__visual{
  background:
    radial-gradient(ellipse at 7% 54%,rgba(183,255,0,.21),transparent 38%),
    radial-gradient(ellipse at 93% 54%,rgba(255,35,40,.21),transparent 38%),
    #030608;
}

/* The same artwork runs beneath the centre as a textured, softly focused
   extension. Only the side areas remain visible; the real image stays intact. */
.langame-partnership__visual:before{
  inset:-6px;
  background:
    linear-gradient(90deg,rgba(4,13,6,.10),transparent 34%,transparent 66%,rgba(16,4,6,.10)),
    url("/static/img/xfame-langame-api-banner-v6.png") center/100% 100% no-repeat;
  filter:blur(5px) brightness(.78) saturate(1.35);
  opacity:.90;
}

/* Neon rails and technical grid occupy only the two outer wings. */
.langame-partnership__visual:after{
  inset:0;
  z-index:3;
  border:1px solid rgba(255,255,255,.075);
  background:
    linear-gradient(136deg,transparent 49.7%,rgba(185,255,0,.50) 50%,transparent 50.3%) left center/13% 100% no-repeat,
    linear-gradient(224deg,transparent 49.7%,rgba(255,46,46,.50) 50%,transparent 50.3%) right center/13% 100% no-repeat,
    repeating-linear-gradient(90deg,rgba(185,255,0,.10) 0 1px,transparent 1px 37px) left center/13% 100% no-repeat,
    repeating-linear-gradient(90deg,rgba(255,46,46,.10) 0 1px,transparent 1px 37px) right center/13% 100% no-repeat,
    linear-gradient(90deg,rgba(194,255,0,.55),transparent) left 55.1%/13% 2px no-repeat,
    linear-gradient(270deg,rgba(255,52,52,.55),transparent) right 55.1%/13% 2px no-repeat,
    linear-gradient(90deg,rgba(181,255,0,.68),transparent) left bottom/15% 2px no-repeat,
    linear-gradient(270deg,rgba(255,44,44,.68),transparent) right bottom/15% 2px no-repeat;
  box-shadow:inset 0 0 24px rgba(0,0,0,.16);
}

.langame-partnership__canvas{
  box-shadow:
    -8px 0 26px -17px rgba(188,255,0,.95),
    8px 0 26px -17px rgba(255,45,45,.95);
}

.langame-partnership__canvas:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(6,17,9,.26),transparent 4%,transparent 96%,rgba(20,6,8,.26));
}

@media(max-width:720px){
  .langame-partnership__visual:before{display:none}
  .langame-partnership__visual:after{
    background:none;
    border:1px solid rgba(255,255,255,.06);
  }
  .langame-partnership__canvas:before{display:none}
}
