/* OMT V38 — client-ready polish, showcase clarity, product unlock console and mobile finishing */
:root{
  --omt38-yellow:#f8c800;
  --omt38-black:#02030a;
  --omt38-navy:#050021;
  --omt38-blue:#0f00d4;
  --omt38-line:rgba(93,101,255,.34);
  --omt38-cyan:#50c7ff;
  --omt38-green:#45f0a0;
}

/* Final hero gateway: use the supplied artwork cleanly with no dimming layer on the image itself. */
.mxd-hero-02__cover-img::before,
.mxd-hero-02__cover-img::after{display:none!important;content:none!important}
.mxd-hero-02__cover-img img{
  opacity:1!important;
  filter:none!important;
  object-fit:cover!important;
  object-position:center center!important;
}

/* Studio Focus — crystal-clear polish. No scan lines or vertical edge stripes. */
#omt-home-content .studio-showcase-thumb{
  overflow:hidden!important;
  background:#02040d!important;
  box-shadow:0 14px 42px rgba(0,0,0,.22)!important;
}
#omt-home-content .studio-showcase-thumb::after{display:none!important;content:none!important}
#omt-home-content .studio-showcase-thumb::before{
  display:block!important;
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  opacity:1!important;
  background:
    radial-gradient(circle at 18% 10%,rgba(103,176,255,.16),transparent 34%),
    linear-gradient(180deg,rgba(3,5,20,.05) 0%,rgba(3,7,28,.015) 50%,rgba(0,2,14,.16) 100%)!important;
  box-shadow:inset 0 0 0 1px rgba(124,153,255,.09)!important;
  transition:background .42s ease,box-shadow .42s ease,opacity .42s ease!important;
}
#omt-home-content .studio-showcase-thumb img{
  filter:brightness(1.045) saturate(1.08) contrast(1.025)!important;
  transition:transform .72s cubic-bezier(.16,.78,.2,1),filter .48s ease!important;
}
#omt-home-content .studio-showcase-thumb:hover::before{
  opacity:.70!important;
  background:
    radial-gradient(circle at 38% 18%,rgba(255,255,255,.14),transparent 31%),
    radial-gradient(circle at 78% 75%,rgba(20,38,255,.11),transparent 34%),
    linear-gradient(180deg,rgba(3,5,20,.01),rgba(0,2,14,.08))!important;
  box-shadow:inset 0 0 0 1px rgba(248,200,0,.18),0 0 30px rgba(31,49,255,.06)!important;
}
#omt-home-content .studio-showcase-thumb:hover img{
  transform:scale(1.075)!important;
  filter:brightness(1.09) saturate(1.12) contrast(1.035)!important;
}

/* Five OMT verbs — four units per track prevents the moving field from running out of copy. */
#omt-moving-text .wrapper-text{
  width:max-content!important;
  min-width:max-content!important;
  flex-wrap:nowrap!important;
}
#omt-moving-text .wrapper-text>span{
  flex:0 0 auto!important;
  padding-right:.30em!important;
  white-space:nowrap!important;
}

/* Remove the colored lead-in below the preceding section: the product artwork begins at the seam. */
.design-choose-area.design-choose-2-style{
  margin-bottom:0!important;
  padding-bottom:0!important;
}
#omt-single-showcase{
  margin-top:0!important;
  padding-top:0!important;
  overflow:hidden!important;
}
#omt-single-showcase .tp-showcase-slider-main,
#omt-single-showcase .omt-single-showcase,
#omt-single-showcase .swiper-wrapper,
#omt-single-showcase .swiper-slide{
  margin-top:0!important;
  padding-top:0!important;
}
#omt-single-showcase .tp-showcase-slider-bg{
  inset:0!important;
  min-height:100svh!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
}
#omt-single-showcase .tp-showcase-slider-bg::after{
  opacity:1!important;
  background:
    linear-gradient(90deg,rgba(2,2,10,.83) 0%,rgba(3,3,18,.58) 32%,rgba(3,3,18,.18) 58%,rgba(2,2,10,.08) 100%),
    linear-gradient(180deg,rgba(2,2,10,.16),transparent 45%,rgba(2,2,10,.18))!important;
}
#omt-single-showcase .tp-showcase-slider-content{
  max-width:min(710px,86vw)!important;
}
#omt-single-showcase .omt-product-launch-copy{
  max-width:650px!important;
  color:rgba(255,255,255,.86)!important;
}

/* Custom community unlock console — integrated count, segmented rail and OMT market language. */
.omt-unlock-console{
  position:relative;
  width:min(650px,84vw);
  margin:28px 0 30px;
  padding:18px 20px 17px;
  overflow:hidden;
  border:1px solid rgba(90,78,232,.62);
  border-top:4px solid #251b94;
  background:
    radial-gradient(circle at 92% 120%,rgba(15,0,212,.45),transparent 45%),
    linear-gradient(135deg,rgba(3,3,13,.96),rgba(9,7,48,.95));
  box-shadow:0 22px 52px rgba(0,0,0,.34),inset 0 0 0 1px rgba(255,255,255,.025);
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));
}
.omt-unlock-console::before{
  content:"";
  position:absolute;
  width:105px;height:105px;right:-54px;top:-55px;
  border:1px solid rgba(248,200,0,.20);
  transform:rotate(45deg);
  pointer-events:none;
}
.omt-unlock-console__head{display:flex;align-items:center;justify-content:space-between;gap:22px;position:relative;z-index:1}
.omt-unlock-console__signal{display:grid;grid-template-columns:9px auto;grid-template-rows:auto auto;column-gap:9px;row-gap:5px;align-items:center}
.omt-unlock-console__signal i{grid-row:1/3;width:8px;height:8px;border-radius:50%;background:var(--omt38-green);box-shadow:0 0 14px rgba(69,240,160,.72);animation:omt38Signal 1.4s ease-in-out infinite}
.omt-unlock-console__signal span{color:#fff;font:700 11px/1 Inter,sans-serif;letter-spacing:.16em}
.omt-unlock-console__signal small{color:rgba(255,255,255,.42);font:600 8px/1 Inter,sans-serif;letter-spacing:.17em}
.omt-unlock-console__count{display:flex;align-items:baseline;gap:10px;white-space:nowrap}
.omt-unlock-console__count strong{color:var(--omt38-yellow);font:700 clamp(34px,3.1vw,50px)/.9 "ClashDisplay-Bold",Inter,sans-serif;letter-spacing:-.025em}
.omt-unlock-console__count span{color:#fff;font:600 15px/1 Inter,sans-serif;letter-spacing:.04em}
.omt-unlock-console__track{position:relative;z-index:1;display:grid;grid-template-columns:repeat(10,1fr);gap:5px;margin-top:18px;height:12px}
.omt-unlock-console__track>span{border:1px solid rgba(112,124,255,.25);background:rgba(255,255,255,.055);transform:skewX(-18deg)}
.omt-unlock-console__track>span:first-child{border-color:rgba(248,200,0,.36);background:rgba(248,200,0,.08)}
.omt-unlock-console__track>b{position:absolute;top:-2px;bottom:-2px;left:-7%;width:7%;background:linear-gradient(90deg,transparent,rgba(83,184,255,.65),transparent);filter:blur(.2px);animation:omt38Scanner 3.4s linear infinite}
.omt-unlock-console__foot{position:relative;z-index:1;display:flex;justify-content:space-between;gap:18px;margin-top:12px;color:rgba(255,255,255,.38);font:600 8px/1 Inter,sans-serif;letter-spacing:.13em}
.omt-unlock-console__foot span:last-child{color:rgba(248,200,0,.62)}
@keyframes omt38Signal{50%{opacity:.35;transform:scale(.72)}}
@keyframes omt38Scanner{to{left:108%}}

/* Client-ready mobile pass: contain oversized motion typography, keep key art readable, and preserve usable controls. */
@media(max-width:991px){
  #omt-home-content .studio-showcase-thumb:hover img{transform:none!important}
  #omt-single-showcase .tp-showcase-slider-content{max-width:min(680px,90vw)!important}
  .omt-unlock-console{width:min(660px,88vw)}
}
@media(max-width:767px){
  .omt-header-shell{grid-template-columns:96px minmax(0,1fr) 40px!important;gap:7px!important}
  .omt-header-shell .tp-header-logo img{width:96px!important;max-width:96px!important}
  .omt-header-nav{padding:0 2px!important}
  .omt-header-nav ul{gap:13px!important;padding-inline:4px 10px!important}
  .omt-header-nav a{font-size:9.5px!important;white-space:nowrap!important}
  .omt-sound-toggle{width:38px!important;height:38px!important;min-width:38px!important}
  .mxd-hero-02__cover-img img{object-position:66% center!important}
  #omt-moving-text .wrapper-text>span{padding-right:.22em!important}
  #omt-single-showcase .tp-showcase-slider-bg{background-position:63% center!important;min-height:100svh!important}
  #omt-single-showcase .tp-showcase-slider-bg::after{
    background:linear-gradient(180deg,rgba(2,2,10,.44) 0%,rgba(2,2,10,.63) 45%,rgba(2,2,10,.72) 100%)!important;
  }
  #omt-single-showcase .tp-showcase-slider-content{max-width:92vw!important;padding-inline:3px!important}
  #omt-single-showcase .tp-showcase-slider-title{font-size:clamp(42px,13vw,68px)!important;line-height:.95!important}
  .omt-product-launch-copy{font-size:14px!important;line-height:1.55!important}
  .omt-unlock-console{width:92vw;margin:20px 0 24px;padding:16px 15px 15px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
  .omt-unlock-console__head{align-items:flex-end;gap:12px}
  .omt-unlock-console__signal span{font-size:9px;letter-spacing:.13em}
  .omt-unlock-console__signal small{font-size:7px}
  .omt-unlock-console__count{gap:7px}
  .omt-unlock-console__count strong{font-size:32px}
  .omt-unlock-console__count span{font-size:12px}
  .omt-unlock-console__track{gap:3px;height:10px;margin-top:15px}
  .omt-unlock-console__foot{font-size:7px;letter-spacing:.08em;gap:8px}
  .design-choose-area.design-choose-2-style{padding-bottom:0!important}
  .design-choose-item p br{display:none!important}
  .design-choose-title-box p{font-size:20px!important;line-height:1.45!important}
}
@media(max-width:480px){
  .omt-header-nav a{font-size:9px!important}
  .omt-header-nav ul{gap:11px!important}
  .omt-unlock-console__foot span:first-child{display:none}
  .omt-unlock-console__foot{justify-content:flex-end}
}
@media(prefers-reduced-motion:reduce){
  .omt-unlock-console__signal i,.omt-unlock-console__track>b{animation:none!important}
}
/* Production fallback: the product artwork is present even before the generic background helper runs. */
#omt-single-showcase .tp-showcase-slider-bg{
  background-image:url('../img/omt-updates/inside-game-product-banner.webp')!important;
}
#omt-single-showcase .tp-showcase-slider-bg{
  transform:none!important;
}
