:root{
  color-scheme:dark;
  --orange:#ff8f1f;
  --orange-2:#ff6418;
  --bg:#07090b;
  --panel:#15191f;
  --line:rgba(255,255,255,.12);
  --muted:#aeb3bb;
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
}

html,
body{
  margin:0;
  min-width:1200px;
  min-height:100%;
  background:var(--bg);
  color:#fff;
  font-family:Arial,"Microsoft YaHei",sans-serif;
}

body{
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{border:0;cursor:pointer}
img{display:block;max-width:100%;height:auto}

img[loading="lazy"]{content-visibility:auto}

.intro-media-layer{
  position:fixed;
  inset:0;
  z-index:1;
  overflow:hidden;
  background:#020407;
  pointer-events:none;
}

.intro-media-layer{
  z-index:90;
  opacity:1;
  transition:opacity .65s ease,visibility .65s ease;
}

/* 首页开场轮播只在默认首页状态显示；切换右侧模块后由 home.js
   移除 is-home-carousel-visible，让实际模块内容露出。 */
body.desktop-home-page .intro-media-layer{
  display:none;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

body.desktop-home-page.is-home-carousel-visible .intro-media-layer{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:none !important;
}

.intro-media-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transform:scale(1.04);
  transition:opacity .55s ease,transform 1.15s ease;
  will-change:opacity,transform;
}

.intro-media-slide.is-active{
  opacity:1;
  transform:scale(1);
}

.intro-media-slide img,
.intro-media-slide video{
  width:100%;
  height:100%;
  object-fit:cover;
}

.intro-media-slide:after{
  content:"";
  position:absolute;
  inset:0;
  display:none;
}

.intro-media-overlay{
  position:absolute;
  inset:0;
  display:none;
}

.portal-canvas,
.portal-static-bg,
.character-static-fallback{
  position:absolute;
}

.portal-canvas{
  inset:0;
  width:100%;
  height:100%;
  display:block;
}

.portal-static-bg{
  inset:0;
  width:100%;
  height:100%;
  display:none !important;
  object-fit:cover;
  opacity:.52;
  filter:saturate(1.1) contrast(1.08) brightness(.8);
}

.character-static-fallback{
  right:9vw;
  bottom:8vh;
  z-index:3;
  display:none;
  width:min(25vw,360px);
  max-height:70vh;
  object-fit:contain;
  opacity:.86;
  filter:drop-shadow(0 0 26px rgba(72,245,255,.42));
}

.intro-portal.is-static .portal-canvas{
  display:none;
}

.intro-portal.is-static .portal-static-bg{
  display:none !important;
}

.intro-portal.is-character-static .character-static-fallback{
  display:block;
}

.site-ui{
  position:relative;
  z-index:auto;
}


.desktop-header{
  position:fixed;
  left:0;
  top:0;
  z-index:160;
  display:flex;
  align-items:center;
  width:100%;
  height:80px;
  padding:0 22px;
  gap:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,.1));
  border-bottom:1px solid rgba(255,255,255,.22);
  box-shadow:0 12px 34px rgba(0,0,0,.16);
  backdrop-filter:blur(18px);
}

.desktop-logo{
  display:flex;
  align-items:center;
  min-width:150px;
}

.desktop-logo img{
  width:130px;
  height:auto;
}

.desktop-nav{
  display:flex;
  align-items:center;
  gap:28px;
  flex:0 0 auto;
}

.desktop-nav a{
  position:relative;
  display:flex;
  align-items:center;
  height:80px;
  color:rgba(255,255,255,.86);
  font-size:16px;
  font-weight:900;
  white-space:nowrap;
}

.desktop-nav a.active,
.desktop-nav a:hover{
  color:#f35e60;
}

.desktop-nav a.active:after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:26px;
  height:4px;
  border-radius:6px 6px 0 0;
  background:#f35e60;
  box-shadow:0 0 16px rgba(243,94,96,.75);
  transform:translateX(-50%);
}

.desktop-search{
  display:flex;
  align-items:center;
  width:clamp(260px,24vw,380px);
  height:40px;
  padding:0 14px;
  gap:10px;
  border-radius:4px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.16);
  margin-left:10px;
}

.desktop-search input{
  flex:1;
  min-width:0;
  border:0;
  outline:0;
  color:#fff;
  background:transparent;
  font-size:14px;
}

.desktop-search span{
  color:rgba(255,255,255,.78);
  font-size:22px;
}

.desktop-actions{
  display:flex;
  align-items:center;
  gap:14px;
  margin-left:auto;
}

.desktop-actions .plan-badge{
  color:var(--orange);
  font-weight:900;
  font-size:15px;
  white-space:nowrap;
}

.desktop-actions button,
.client-download-btn{
  height:36px;
  padding:0 18px;
  color:#fff;
  font-weight:900;
  background:rgba(255,255,255,.18);
  border-radius:4px;
  white-space:nowrap;
  transition:transform .24s ease,background .24s ease,box-shadow .24s ease;
}

.desktop-actions button:hover,
.client-download-btn:hover{
  transform:scale(1.04);
  background:rgba(255,143,31,.28);
  box-shadow:0 12px 30px rgba(255,111,24,.28);
}

.desktop-home{
  height:100vh;
  min-height:100vh;
  overflow:hidden;
  background:transparent;
}

.empty{
  min-height:100vh;
  padding:160px 8vw 80px;
  background:
    radial-gradient(circle at 15% 0%,rgba(243,94,96,.2),transparent 34%),
    radial-gradient(circle at 85% 8%,rgba(243,94,96,.14),transparent 30%),
    #07090b;
}

.empty h1{
  margin:0;
  color:#fff;
  font-size:52px;
  line-height:1.1;
  letter-spacing:3px;
}

.empty p{
  margin:18px 0 0;
  color:rgba(255,255,255,.68);
  font-size:18px;
}

.game-product-page{
  min-height:100vh;
  padding-top:80px;
  background:
    radial-gradient(circle at 42% 92%,rgba(120,38,94,.18),transparent 34%),
    radial-gradient(circle at 86% 18%,rgba(243,94,96,.08),transparent 32%),
    linear-gradient(90deg,#111 0%,#151515 45%,#070707 100%);
  color:#fff;
  overflow-x:hidden;
}

.game-product-hero{
  position:relative;
  --product-duration:4200ms;
  width:min(1640px,calc(100% - 128px));
  height:calc(100vh - 80px);
  min-height:720px;
  margin:0 auto;
  padding:110px 0 48px;
  display:grid;
  grid-template-columns:590px 1fr;
  column-gap:80px;
  align-items:start;
}

.game-product-hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.03),transparent 24%,transparent 76%,rgba(255,255,255,.03)),
    radial-gradient(circle at 28% 84%,rgba(243,94,96,.12),transparent 34%);
  opacity:.9;
}

.game-product-copy{
  position:relative;
  z-index:2;
  align-self:center;
  padding-bottom:90px;
}

.game-product-kicker{
  margin:0 0 18px;
  color:rgba(255,255,255,.72);
  font-size:18px;
  line-height:1.2;
  letter-spacing:.2px;
}

.game-product-copy h1{
  margin:0;
  color:#f4f4f4;
  font-size:34px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:1px;
}

.game-product-copy > p:not(.game-product-kicker){
  width:520px;
  margin:24px 0 0;
  color:rgba(255,255,255,.62);
  font-size:17px;
  line-height:1.85;
}

.game-product-more{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:42px;
  margin-top:28px;
  padding:0 20px;
  color:#fff;
  font-size:15px;
  font-weight:900;
  border-radius:999px;
  background:#0878ff;
  box-shadow:0 14px 30px rgba(8,120,255,.28);
  transition:transform .22s ease,background .22s ease,box-shadow .22s ease;
}

.game-product-more:hover{
  transform:translateY(-2px);
  background:#1d87ff;
  box-shadow:0 18px 40px rgba(8,120,255,.38);
}

.game-product-visual{
  position:relative;
  z-index:2;
  height:514px;
  overflow:hidden;
  border-radius:6px;
  background:#202020;
  box-shadow:0 38px 90px rgba(0,0,0,.42);
}

.game-product-visual:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(255,255,255,.04),transparent 34%),
    linear-gradient(90deg,rgba(0,0,0,.22),transparent 48%,rgba(0,0,0,.24));
  pointer-events:none;
}

.game-product-visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.88) contrast(1.08) brightness(.78);
  transform:scale(1.02);
  transition:transform .7s cubic-bezier(.16,.78,.22,1),filter .7s ease,opacity .3s ease;
}

.game-product-hero.is-switching .game-product-visual img{
  animation:productHeroImageIn .62s cubic-bezier(.16,.78,.22,1) both;
}

.game-product-hero.is-switching .game-product-copy{
  animation:productHeroCopyIn .42s ease both;
}

.game-product-tabs{
  position:absolute;
  left:0;
  right:0;
  bottom:48px;
  z-index:4;
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  gap:16px;
}

.game-product-tabs button{
  position:relative;
  display:grid;
  grid-template-columns:82px 1fr;
  align-items:center;
  gap:14px;
  height:100px;
  padding:16px;
  overflow:hidden;
  text-align:left;
  color:rgba(255,255,255,.76);
  border:0;
  border-radius:7px;
  background:rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:background .22s ease,transform .22s ease,color .22s ease;
}

.game-product-tabs button:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  opacity:0;
  transform:scaleX(0);
  transform-origin:left;
  background:
    linear-gradient(90deg,rgba(255,255,255,.24),rgba(255,255,255,.12) 58%,rgba(255,255,255,.04) 100%),
    linear-gradient(90deg,rgba(243,94,96,.34),rgba(243,94,96,.1));
  pointer-events:none;
}

.game-product-tabs button:hover,
.game-product-tabs button.is-active{
  color:#fff;
  background:#2d3239;
}

.game-product-tabs button.is-active:before{
  opacity:1;
  animation:productTabProgress var(--product-duration) linear forwards;
}

.game-product-hero.is-hovering .game-product-tabs button.is-active:before{
  opacity:0;
  animation:none;
}

.game-product-tabs button:hover{
  transform:translateY(-2px);
  background:rgb(28,31,34);
}

.game-product-tabs button > *{
  position:relative;
  z-index:1;
}

.game-product-tabs button img{
  width:82px;
  height:62px;
  object-fit:cover;
  border-radius:6px;
  filter:saturate(.92) brightness(.82);
}

.game-product-tabs button span{
  min-width:0;
}

.game-product-tabs button b,
.game-product-tabs button em{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-style:normal;
}

.game-product-tabs button b{
  color:rgba(255,255,255,.7);
  font-size:14px;
  line-height:1.2;
  font-weight:500;
  text-transform:uppercase;
}

.game-product-tabs button em{
  margin-top:4px;
  color:#fff;
  font-size:16px;
  line-height:1.25;
  font-weight:900;
}

@keyframes productHeroImageIn{
  from{opacity:.62;transform:scale(1.07) translateX(18px)}
  to{opacity:1;transform:scale(1.02) translateX(0)}
}

@keyframes productHeroCopyIn{
  from{opacity:.72;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes productTabProgress{
  0%{transform:scaleX(0)}
  100%{transform:scaleX(1)}
}

.game-category-section{
  width:min(1500px,calc(100% - 128px));
  margin:0 auto;
  padding:34px 0 120px;
}

.game-category-tabs{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  align-items:center;
  justify-content:center;
  gap:10px;
  width:560px;
  height:72px;
  margin:0 auto;
  padding:10px 16px;
  border:1px solid rgba(255,255,255,.1);
  border-left-color:rgba(243,94,96,.34);
  border-right-color:rgba(243,94,96,.34);
  border-radius:0;
  clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 18px,100% calc(100% - 18px),calc(100% - 18px) 100%,18px 100%,0 calc(100% - 18px),0 18px);
  background:
    linear-gradient(90deg,rgba(243,94,96,.12),transparent 18%,transparent 82%,rgba(243,94,96,.12)),
    linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.025)),
    rgba(9,10,13,.82);
  box-shadow:0 22px 70px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(16px);
}

.game-category-tabs:before,
.game-category-tabs:after{
  content:"";
  position:absolute;
  left:42px;
  right:42px;
  z-index:1;
  height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(243,94,96,.72),rgba(255,255,255,.28),rgba(243,94,96,.72),transparent);
  box-shadow:0 0 16px rgba(243,94,96,.34);
}

.game-category-tabs:before{
  top:0;
}

.game-category-tabs:after{
  bottom:0;
}

.game-category-tabs-frame{
  display:none;
}

.game-category-tabs button{
  position:relative;
  z-index:2;
  min-width:0;
  height:50px;
  padding:0 26px;
  overflow:hidden;
  color:rgba(255,255,255,.62);
  font-size:17px;
  font-weight:900;
  letter-spacing:.8px;
  border-radius:0;
  border:1px solid transparent;
  background:transparent;
  text-shadow:none;
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
  transition:color .22s ease,background .22s ease,box-shadow .22s ease,transform .22s ease,border-color .22s ease,text-shadow .22s ease;
}

.game-category-tabs button:before{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:2px;
  opacity:0;
  background:#f35e60;
  box-shadow:0 0 14px rgba(243,94,96,.55);
  transition:opacity .22s ease,transform .22s ease;
  transform:scaleX(.35);
}

.game-category-tabs button:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  background:linear-gradient(110deg,transparent 0 24%,rgba(255,255,255,.1) 45%,transparent 64%);
  transform:translateX(-55%);
  transition:opacity .22s ease,transform .42s ease;
}

.game-category-tabs button:hover,
.game-category-tabs button.is-active{
  color:#fff;
}

.game-category-tabs button:hover{
  transform:translateY(-1px);
  color:rgba(255,255,255,.88);
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.12);
  text-shadow:0 0 12px rgba(255,255,255,.2);
}

.game-category-tabs button:hover:after{
  opacity:1;
  transform:translateX(45%);
}

.game-category-tabs button.is-active{
  background:
    radial-gradient(circle at 50% 0,rgba(255,255,255,.18),transparent 48%),
    linear-gradient(135deg,rgba(243,94,96,.48),rgba(243,94,96,.18) 58%,rgba(0,0,0,.18));
  border-color:rgba(243,94,96,.5);
  box-shadow:0 0 26px rgba(243,94,96,.22),inset 0 0 0 1px rgba(255,255,255,.08);
  text-shadow:0 0 16px rgba(243,94,96,.45);
}

.game-category-tabs button.is-active:before{
  opacity:1;
  transform:scaleX(1);
}

.game-category-panels{
  position:relative;
  min-height:860px;
  margin-top:34px;
}

.game-category-panel{
  display:none;
  position:relative;
  min-height:860px;
  padding:30px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:22px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025)),
    radial-gradient(circle at 86% 14%,rgba(243,94,96,.14),transparent 34%);
  box-shadow:0 36px 100px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.08);
  animation:gameCategoryPanelIn .32s ease both;
}

.game-category-panel.is-active{
  display:block;
}

.game-category-stack{
  display:grid;
  gap:26px;
}

.game-category-block{
  position:relative;
  padding:28px;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.1);
  background:
    linear-gradient(135deg,rgba(0,0,0,.38),rgba(0,0,0,.18)),
    radial-gradient(circle at 92% 12%,rgba(243,94,96,.12),transparent 34%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}

.game-category-block:before{
  content:"";
  position:absolute;
  left:28px;
  top:0;
  width:62px;
  height:3px;
  background:#f35e60;
  box-shadow:0 0 16px rgba(243,94,96,.42);
}

.game-section-head{
  position:relative;
  z-index:2;
}

.game-section-head span{
  display:inline-flex;
  align-items:center;
  height:30px;
  padding:0 12px;
  color:#f35e60;
  font-size:14px;
  font-weight:900;
  border-radius:8px;
  background:rgba(243,94,96,.12);
}

.game-section-head h2{
  margin:18px 0 0;
  color:#fff;
  font-size:30px;
  line-height:1.3;
  font-weight:900;
}

.game-framework-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:24px;
}

.game-framework-grid article{
  position:relative;
  min-height:150px;
  padding:24px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.11);
  background:
    linear-gradient(135deg,rgba(243,94,96,.12),rgba(255,255,255,.035)),
    rgba(0,0,0,.24);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}

.game-framework-grid article:hover{
  transform:translateY(-4px);
  border-color:rgba(243,94,96,.28);
  box-shadow:0 18px 44px rgba(0,0,0,.26),0 0 22px rgba(243,94,96,.1);
}

.game-framework-grid article.is-key-framework{
  border-color:rgba(243,94,96,.46);
  background:
    radial-gradient(circle at 86% 12%,rgba(243,94,96,.28),transparent 34%),
    linear-gradient(135deg,rgba(243,94,96,.24),rgba(255,255,255,.055)),
    rgba(0,0,0,.32);
  box-shadow:0 18px 54px rgba(0,0,0,.3),0 0 28px rgba(243,94,96,.16),inset 0 0 0 1px rgba(255,255,255,.06);
}

.game-framework-grid article.is-key-framework:before{
  content:"重点框架";
  position:absolute;
  right:16px;
  top:14px;
  height:24px;
  padding:0 10px;
  color:#fff;
  font-size:12px;
  line-height:24px;
  font-weight:900;
  border-radius:999px;
  background:rgba(243,94,96,.72);
  box-shadow:0 0 16px rgba(243,94,96,.3);
}

.game-framework-grid article.is-key-framework b{
  color:#fff;
  text-shadow:0 0 16px rgba(243,94,96,.34);
}

.game-framework-grid b{
  display:block;
  color:#fff;
  font-size:20px;
  line-height:1.2;
}

.game-framework-grid p,
.game-demo-panel p{
  margin:14px 0 0;
  color:rgba(255,255,255,.66);
  font-size:15px;
  line-height:1.8;
}

.game-tech-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.game-tech-pills i{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:58px;
  height:34px;
  padding:0 14px;
  color:#fff;
  font-style:normal;
  font-weight:900;
  border-radius:999px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(243,94,96,.24);
}

.game-case-block{
  padding-bottom:78px;
}

.game-case-viewport{
  position:relative;
  z-index:2;
  margin-top:24px;
  overflow:hidden;
}

.game-case-track{
  display:flex;
  transition:transform .52s cubic-bezier(.16,.78,.22,1);
  will-change:transform;
}

.game-case-page{
  flex:0 0 100%;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}

.game-case-block--featured .game-case-page{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}

.game-case-block--featured .game-case-card{
  min-height:330px;
  padding-bottom:50px;
  border-radius:20px;
}

.game-case-block--featured .game-case-card img{
  height:280px;
}

.game-case-page--featured{
  grid-template-columns:minmax(0,1.38fr) repeat(2,minmax(0,.78fr));
  grid-template-rows:repeat(2,184px);
  gap:14px;
}

.game-case-page--portrait{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
}

.game-case-page--portrait .game-case-card{
  min-height:auto;
  padding-bottom:48px;
  border-radius:22px;
}

.game-case-page--portrait .game-case-card img{
  aspect-ratio:420 / 620;
  height:auto;
  object-fit:cover;
}

.game-case-page--small-yx .game-case-card{
  min-height:auto;
  padding:0;
}

.game-case-page--small-yx{
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:start;
}

.game-case-page--small-yx .game-case-card img{
  display:block;
  aspect-ratio:357 / 435;
  height:auto;
  object-fit:cover;
}

.game-case-card{
  position:relative;
  min-height:214px;
  padding:0 0 44px;
  overflow:hidden;
  color:#fff;
  text-align:left;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(0,0,0,.34);
  box-shadow:0 18px 44px rgba(0,0,0,.26);
  cursor:zoom-in;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}

.game-case-page--featured .game-case-card{
  min-height:0;
  height:184px;
  padding-bottom:34px;
}

.game-case-page--featured .game-case-card.is-featured{
  grid-row:1 / span 2;
  height:100%;
}

.game-case-card:hover{
  transform:translateY(-4px);
  border-color:rgba(243,94,96,.34);
  box-shadow:0 24px 58px rgba(0,0,0,.34),0 0 24px rgba(243,94,96,.12);
}

.game-case-card img{
  width:100%;
  height:170px;
  object-fit:cover;
  filter:saturate(.88) brightness(.82);
  transition:transform .24s ease,filter .24s ease;
}

.game-case-page--featured .game-case-card img{
  height:calc(100% - 34px);
}

.game-case-card:hover img{
  transform:scale(1.05);
  filter:saturate(1) brightness(.95);
}

.game-case-card em{
  position:absolute;
  left:16px;
  right:16px;
  bottom:14px;
  overflow:hidden;
  color:rgba(255,255,255,.86);
  font-style:normal;
  font-size:15px;
  font-weight:900;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.game-case-controls{
  position:absolute;
  right:28px;
  bottom:24px;
  z-index:3;
  display:flex;
  gap:10px;
}

.game-case-controls button{
  width:42px;
  height:42px;
  color:#fff;
  font-size:28px;
  line-height:1;
  border-radius:999px;
  border:1px solid rgba(243,94,96,.34);
  background:rgba(243,94,96,.16);
  transition:transform .22s ease,background .22s ease,border-color .22s ease;
}

.game-case-controls button:hover{
  transform:translateY(-2px);
  background:rgba(243,94,96,.34);
  border-color:rgba(243,94,96,.56);
}

.game-demo-panel{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:28px;
}

.game-demo-panel .game-section-head,
.game-demo-panel p{
  grid-column:1;
}

.game-demo-panel p{
  margin-top:10px;
}

.game-demo-panel button{
  grid-column:2;
  grid-row:1 / span 2;
  width:max-content;
  height:48px;
  padding:0 30px;
  color:#fff;
  font-weight:900;
  border-radius:999px;
  background:rgba(243,94,96,.8);
  box-shadow:0 18px 42px rgba(243,94,96,.22);
  transition:transform .22s ease,background .22s ease,box-shadow .22s ease;
}

.game-demo-panel button:hover{
  transform:translateY(-2px);
  background:#f35e60;
  box-shadow:0 22px 52px rgba(243,94,96,.32);
}

.game-case-modal{
  position:fixed;
  inset:0;
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:72px;
  background:rgba(0,0,0,.74);
  opacity:0;
  pointer-events:none;
  transition:opacity .22s ease;
}

.game-case-modal.is-open{
  opacity:1;
  pointer-events:auto;
}

.game-case-modal img{
  max-width:min(960px,88vw);
  max-height:78vh;
  object-fit:contain;
  border-radius:18px;
  border:1px solid rgba(243,94,96,.32);
  box-shadow:0 36px 120px rgba(0,0,0,.62),0 0 42px rgba(243,94,96,.14);
}

.game-case-modal-close{
  position:absolute;
  right:48px;
  top:38px;
  width:46px;
  height:46px;
  color:#fff;
  font-size:34px;
  line-height:1;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
}

.game-contact-modal{
  position:fixed;
  inset:0;
  z-index:90;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:44px;
  background:rgba(4,5,8,.78);
  backdrop-filter:blur(14px);
  opacity:0;
  pointer-events:none;
  transition:opacity .24s ease;
}

.game-contact-modal.is-open{
  opacity:1;
  pointer-events:auto;
}

.game-contact-dialog{
  position:relative;
  width:min(860px,92vw);
  padding:34px;
  overflow:hidden;
  border-radius:28px;
  border:1px solid rgba(243,94,96,.34);
  background:
    radial-gradient(circle at 18% 0,rgba(243,94,96,.22),transparent 34%),
    radial-gradient(circle at 90% 20%,rgba(255,255,255,.08),transparent 28%),
    linear-gradient(145deg,rgba(24,18,22,.96),rgba(8,9,13,.96));
  box-shadow:0 40px 120px rgba(0,0,0,.66),0 0 44px rgba(243,94,96,.14);
  transform:translateY(18px) scale(.98);
  transition:transform .24s ease;
}

.game-contact-modal.is-open .game-contact-dialog{
  transform:translateY(0) scale(1);
}

.game-contact-dialog:before{
  content:"";
  position:absolute;
  inset:12px;
  pointer-events:none;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
}

.game-contact-close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:2;
  width:42px;
  height:42px;
  color:#fff;
  font-size:30px;
  line-height:1;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  cursor:pointer;
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}

.game-contact-close:hover{
  transform:rotate(90deg);
  background:rgba(243,94,96,.24);
  border-color:rgba(243,94,96,.48);
}

.game-contact-head{
  position:relative;
  z-index:1;
  max-width:560px;
}

.game-contact-head span{
  display:block;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:13px;
  font-weight:900;
  letter-spacing:3px;
}

.game-contact-head h2{
  margin:10px 0 8px;
  color:#fff;
  font-size:34px;
  line-height:1.12;
}

.game-contact-head p{
  margin:0;
  color:rgba(255,255,255,.66);
  font-size:15px;
  line-height:1.7;
}

.game-contact-list{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:26px;
}

.game-contact-card{
  display:grid;
  grid-template-columns:132px minmax(0,1fr);
  gap:18px;
  align-items:center;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.035));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 20px 54px rgba(0,0,0,.24);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.game-contact-card:hover{
  transform:translateY(-4px);
  border-color:rgba(243,94,96,.38);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 26px 66px rgba(0,0,0,.32),0 0 24px rgba(243,94,96,.12);
}

.game-contact-name{
  grid-column:1 / -1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.game-contact-name b{
  color:#fff;
  font-size:24px;
  line-height:1;
}

.game-contact-name em{
  color:rgba(255,255,255,.5);
  font-style:normal;
  font-size:12px;
  font-weight:800;
}

.game-contact-qr{
  width:132px;
  height:132px;
  padding:8px;
  object-fit:contain;
  border-radius:16px;
  background:rgba(255,255,255,.92);
  box-shadow:0 16px 34px rgba(0,0,0,.28);
}

.game-contact-info{
  display:grid;
  gap:10px;
}

.game-contact-info a,
.game-contact-info p{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:38px;
  margin:0;
  padding:0 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.24);
}

.game-contact-info a{
  color:#fff;
  cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}

.game-contact-info a:hover{
  color:#fff;
  background:rgba(243,94,96,.24);
  border-color:rgba(243,94,96,.42);
}

.game-contact-info span{
  color:rgba(255,255,255,.52);
  font-size:12px;
  font-weight:900;
}

.game-contact-info b{
  color:#fff;
  font-size:14px;
  font-weight:900;
  white-space:nowrap;
}

@keyframes gameCategoryPanelIn{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}

.cooperation-page{
  min-height:100vh;
  padding-top:80px;
  color:#fff;
  background:
    radial-gradient(circle at 12% 10%,rgba(243,94,96,.22),transparent 32%),
    radial-gradient(circle at 84% 20%,rgba(243,94,96,.12),transparent 34%),
    linear-gradient(135deg,#08090b 0%,#111214 45%,#050505 100%);
  overflow-x:hidden;
}

.cooperation-map-section{
  width:min(1500px,calc(100% - 128px));
  min-height:calc(100vh - 80px);
  margin:0 auto;
  padding:86px 0 110px;
}

.cooperation-map-head{
  max-width:760px;
}

.cooperation-map-head span{
  display:inline-flex;
  align-items:center;
  height:30px;
  padding:0 12px;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:13px;
  font-weight:900;
  letter-spacing:2px;
  border-radius:999px;
  background:rgba(243,94,96,.12);
  border:1px solid rgba(243,94,96,.22);
}

.cooperation-map-head h1{
  margin:20px 0 0;
  color:#fff;
  font-size:64px;
  line-height:1;
  font-weight:900;
  letter-spacing:4px;
}

.cooperation-map-head p{
  margin:24px 0 0;
  color:rgba(255,255,255,.64);
  font-size:18px;
  line-height:1.8;
}

.cooperation-map-board{
  position:relative;
  display:grid;
  grid-template-columns:220px 1fr;
  gap:64px;
  align-items:center;
  min-height:560px;
  margin-top:56px;
  padding:48px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.11);
  background:
    linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025)),
    radial-gradient(circle at 68% 18%,rgba(243,94,96,.16),transparent 36%);
  box-shadow:0 40px 110px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.08);
}

.cooperation-map-board:before{
  content:"";
  position:absolute;
  left:268px;
  top:50%;
  width:64px;
  height:1px;
  background:linear-gradient(90deg,rgba(243,94,96,.75),rgba(255,255,255,.14));
  box-shadow:0 0 18px rgba(243,94,96,.32);
}

.cooperation-root-node{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  height:112px;
  color:#fff;
  font-size:28px;
  font-weight:900;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(243,94,96,.26),rgba(255,255,255,.055));
  border:1px solid rgba(243,94,96,.3);
  box-shadow:0 24px 60px rgba(0,0,0,.32),0 0 36px rgba(243,94,96,.12);
}

.cooperation-mode-list{
  position:relative;
  display:grid;
  gap:26px;
}

.cooperation-mode-list:before{
  content:"";
  position:absolute;
  left:0;
  top:70px;
  bottom:70px;
  width:1px;
  background:linear-gradient(180deg,rgba(243,94,96,.08),rgba(243,94,96,.62),rgba(243,94,96,.08));
  box-shadow:0 0 18px rgba(243,94,96,.26);
}

.cooperation-mode-card{
  position:relative;
  display:grid;
  grid-template-columns:180px 1fr;
  gap:36px;
  align-items:center;
  padding-left:34px;
}

.cooperation-mode-card:before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:34px;
  height:1px;
  background:linear-gradient(90deg,rgba(243,94,96,.7),rgba(255,255,255,.16));
}

.cooperation-mode-title{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:64px;
  padding:0 18px;
  color:#fff;
  font-size:19px;
  font-weight:900;
  border-radius:14px;
  background:rgba(255,255,255,.085);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}

.cooperation-mode-title:after{
  content:"";
  position:absolute;
  right:-37px;
  top:50%;
  width:37px;
  height:1px;
  background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(243,94,96,.7));
}

.cooperation-mode-detail{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

.cooperation-sub-node{
  min-height:52px;
  display:flex;
  align-items:center;
  padding:0 20px;
  color:rgba(255,255,255,.9);
  font-size:16px;
  font-weight:800;
  border-radius:12px;
  background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.045));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 42px rgba(0,0,0,.2);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}

.cooperation-sub-node:hover{
  transform:translateY(-3px);
  border-color:rgba(243,94,96,.34);
  box-shadow:0 24px 54px rgba(0,0,0,.28),0 0 24px rgba(243,94,96,.16);
}

.cooperation-showcase-section{
  position:relative;
  width:min(1500px,calc(100% - 128px));
  min-height:calc(100vh - 80px);
  margin:0 auto;
  padding:84px 0 118px;
}

.cooperation-showcase-section:before{
  content:"";
  position:absolute;
  inset:18px -44px 80px;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(243,94,96,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(243,94,96,.05) 1px,transparent 1px),
    radial-gradient(circle at 50% 44%,rgba(243,94,96,.18),transparent 36%);
  background-size:54px 54px,54px 54px,100% 100%;
  mask-image:radial-gradient(circle at 50% 42%,#000 0 46%,transparent 78%);
}

.cooperation-showcase-head{
  position:relative;
  z-index:2;
  display:grid;
  justify-items:center;
  text-align:center;
}

.cooperation-showcase-head span{
  display:inline-flex;
  align-items:center;
  height:30px;
  padding:0 14px;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:13px;
  font-weight:900;
  letter-spacing:2px;
  border-radius:999px;
  background:rgba(243,94,96,.1);
  border:1px solid rgba(243,94,96,.26);
}

.cooperation-showcase-head h1{
  margin:20px 0 0;
  color:#fff;
  font-size:64px;
  line-height:1;
  font-weight:900;
  letter-spacing:5px;
  text-shadow:0 0 28px rgba(243,94,96,.22);
}

.cooperation-showcase-head p{
  max-width:760px;
  margin:24px 0 0;
  color:rgba(255,255,255,.66);
  font-size:18px;
  line-height:1.8;
}

.cooperation-showcase-stage{
  position:relative;
  z-index:2;
  min-height:640px;
  margin-top:48px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.1);
  background:
    linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.025)),
    radial-gradient(circle at 50% 42%,rgba(243,94,96,.2),transparent 38%),
    rgba(0,0,0,.28);
  box-shadow:0 40px 120px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
}

.cooperation-showcase-svg{
  position:absolute;
  inset:22px;
  z-index:1;
  width:calc(100% - 44px);
  height:calc(100% - 44px);
  pointer-events:none;
}

.coop-show-grid-line,
.coop-show-cut-line,
.coop-show-orbit,
.coop-show-ring{
  fill:none;
  stroke:url(#coopShowLine);
  stroke-linecap:round;
  stroke-linejoin:round;
}

.coop-show-grid-line{
  stroke-width:1.2;
  opacity:.22;
}

.coop-show-cut-line{
  stroke-width:2;
  opacity:.46;
  stroke-dasharray:220 36;
  animation:coopShowLineMove 8s linear infinite;
}

.coop-show-line-b{animation-direction:reverse}
.coop-show-line-c{animation-duration:11s}

.coop-show-core{
  fill:url(#coopShowCore);
  filter:url(#coopShowGlow);
  animation:coopShowCorePulse 2.8s ease-in-out infinite;
}

.coop-show-ring{
  stroke-width:2;
  opacity:.62;
  transform-origin:590px 280px;
}

.coop-show-ring-a{
  stroke-dasharray:26 18;
  animation:coopShowSpin 18s linear infinite;
}

.coop-show-ring-b{
  stroke-width:1;
  stroke-dasharray:8 18;
  opacity:.36;
  animation:coopShowSpin 26s linear infinite reverse;
}

.coop-show-orbit{
  stroke-width:1.4;
  opacity:.3;
  stroke-dasharray:18 16;
  animation:coopShowLineMove 14s linear infinite;
}

.coop-show-orbit-b{
  animation-direction:reverse;
}

.coop-show-dots circle{
  fill:#f35e60;
  filter:url(#coopShowGlow);
  opacity:.72;
  animation:coopShowDotBlink 2.4s ease-in-out infinite;
}

.coop-show-dots circle:nth-child(2n){
  animation-delay:.6s;
}

.cooperation-showcase-core{
  position:absolute;
  left:50%;
  top:48%;
  z-index:3;
  display:grid;
  justify-items:center;
  gap:8px;
  width:210px;
  height:210px;
  place-content:center;
  color:#fff;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:
    radial-gradient(circle at 50% 34%,rgba(255,255,255,.18),transparent 28%),
    radial-gradient(circle,rgba(243,94,96,.24),rgba(243,94,96,.08) 48%,rgba(0,0,0,.32) 70%);
  border:1px solid rgba(243,94,96,.38);
  box-shadow:0 0 48px rgba(243,94,96,.22),inset 0 0 34px rgba(243,94,96,.16);
  animation:coopShowCoreFloat 4.2s ease-in-out infinite;
}

.cooperation-showcase-core b{
  font-size:34px;
  line-height:1;
  font-weight:900;
  letter-spacing:3px;
}

.cooperation-showcase-core span{
  color:rgba(255,255,255,.62);
  font-family:"Courier New",monospace;
  font-size:12px;
  font-weight:900;
  letter-spacing:2px;
}

.cooperation-showcase-cards{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  min-height:640px;
  padding:360px 46px 46px;
}

.cooperation-show-card{
  position:relative;
  min-height:238px;
  padding:30px 28px 28px;
  overflow:hidden;
  color:#fff;
  clip-path:polygon(8% 0,100% 0,100% 82%,90% 100%,0 100%,0 18%);
  background:
    linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.028)),
    rgba(3,3,4,.72);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 26px 72px rgba(0,0,0,.34),inset 0 0 0 1px rgba(255,255,255,.035);
  transform:translateY(0);
  transition:transform .26s ease,box-shadow .26s ease,filter .26s ease;
}

.cooperation-show-card:before{
  content:"";
  position:absolute;
  left:28px;
  top:0;
  width:78px;
  height:3px;
  background:#f35e60;
  box-shadow:0 0 16px rgba(243,94,96,.42);
}

.cooperation-show-card:after{
  content:"";
  position:absolute;
  inset:-40% -20%;
  opacity:0;
  background:linear-gradient(115deg,transparent 34%,rgba(243,94,96,.12) 48%,transparent 62%);
  transform:translateX(-46%);
  transition:opacity .24s ease,transform .48s ease;
}

.cooperation-show-card:hover{
  transform:translateY(-8px);
  box-shadow:0 38px 94px rgba(0,0,0,.44),0 0 34px rgba(243,94,96,.16),inset 0 0 0 1px rgba(243,94,96,.12);
}

.cooperation-show-card:hover:after{
  opacity:1;
  transform:translateX(42%);
}

.cooperation-show-card.is-hot{
  background:
    radial-gradient(circle at 82% 18%,rgba(243,94,96,.24),transparent 34%),
    linear-gradient(135deg,rgba(243,94,96,.16),rgba(255,255,255,.035)),
    rgba(3,3,4,.72);
  border-color:rgba(243,94,96,.26);
}

.cooperation-show-card i{
  position:relative;
  z-index:2;
  display:block;
  color:rgba(243,94,96,.56);
  font-family:"Courier New",monospace;
  font-size:48px;
  line-height:1;
  font-style:normal;
  font-weight:900;
}

.cooperation-show-card h2{
  position:relative;
  z-index:2;
  margin:20px 0 0;
  color:#fff;
  font-size:28px;
  line-height:1.15;
  font-weight:900;
}

.cooperation-show-card p{
  position:relative;
  z-index:2;
  margin:16px 0 0;
  color:rgba(255,255,255,.64);
  font-size:15px;
  line-height:1.8;
}

.cooperation-show-card ul{
  position:relative;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:20px 0 0;
  padding:0;
  list-style:none;
}

.cooperation-show-card li{
  height:30px;
  padding:0 12px;
  color:rgba(255,255,255,.84);
  font-size:13px;
  line-height:30px;
  font-weight:900;
  border-radius:999px;
  background:rgba(243,94,96,.12);
  border:1px solid rgba(243,94,96,.18);
}

.about-page{
  min-height:100vh;
  padding-top:80px;
  color:#fff;
  background:
    radial-gradient(circle at 10% 12%,rgba(243,94,96,.2),transparent 32%),
    radial-gradient(circle at 78% 8%,rgba(243,94,96,.1),transparent 34%),
    linear-gradient(135deg,#08090b 0%,#121316 48%,#050505 100%);
  overflow-x:hidden;
}

.about-map-section{
  width:min(1320px,calc(100% - 128px));
  min-height:calc(100vh - 80px);
  margin:0 auto;
  padding:86px 0 110px;
}

.about-map-head{
  max-width:760px;
}

.about-map-head span{
  display:inline-flex;
  align-items:center;
  height:30px;
  padding:0 12px;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:13px;
  font-weight:900;
  letter-spacing:2px;
  border-radius:999px;
  background:rgba(243,94,96,.12);
  border:1px solid rgba(243,94,96,.22);
}

.about-map-head h1{
  margin:20px 0 0;
  color:#fff;
  font-size:64px;
  line-height:1;
  font-weight:900;
  letter-spacing:4px;
}

.about-map-head p{
  margin:24px 0 0;
  color:rgba(255,255,255,.64);
  font-size:18px;
  line-height:1.8;
}

.about-map-board{
  position:relative;
  display:grid;
  grid-template-columns:220px 1fr;
  gap:58px;
  align-items:center;
  min-height:460px;
  margin-top:56px;
  padding:46px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.11);
  background:
    linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025)),
    radial-gradient(circle at 78% 20%,rgba(243,94,96,.14),transparent 36%);
  box-shadow:0 40px 110px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.08);
}

.about-map-board:before{
  content:"";
  position:absolute;
  left:266px;
  top:50%;
  width:58px;
  height:1px;
  background:linear-gradient(90deg,rgba(243,94,96,.75),rgba(255,255,255,.14));
  box-shadow:0 0 18px rgba(243,94,96,.32);
}

.about-root-node{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  height:104px;
  color:#fff;
  font-size:28px;
  font-weight:900;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(243,94,96,.26),rgba(255,255,255,.055));
  border:1px solid rgba(243,94,96,.3);
  box-shadow:0 24px 60px rgba(0,0,0,.32),0 0 36px rgba(243,94,96,.12);
}

.about-node-list{
  position:relative;
  display:grid;
  gap:22px;
}

.about-node-list:before{
  content:"";
  position:absolute;
  left:0;
  top:46px;
  bottom:46px;
  width:1px;
  background:linear-gradient(180deg,rgba(243,94,96,.08),rgba(243,94,96,.62),rgba(243,94,96,.08));
  box-shadow:0 0 18px rgba(243,94,96,.26);
}

.about-node-card{
  position:relative;
  display:grid;
  grid-template-columns:120px 1fr;
  gap:34px;
  align-items:center;
  padding-left:34px;
}

.about-node-card:before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:34px;
  height:1px;
  background:linear-gradient(90deg,rgba(243,94,96,.7),rgba(255,255,255,.16));
}

.about-node-title{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:58px;
  color:#fff;
  font-size:18px;
  font-weight:900;
  border-radius:14px;
  background:rgba(255,255,255,.085);
  border:1px solid rgba(255,255,255,.12);
}

.about-node-title:after{
  content:"";
  position:absolute;
  right:-35px;
  top:50%;
  width:35px;
  height:1px;
  background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(243,94,96,.7));
}

.about-node-detail{
  min-height:94px;
  padding:20px 24px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(255,255,255,.11),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 42px rgba(0,0,0,.2);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}

.about-node-detail:hover{
  transform:translateY(-3px);
  border-color:rgba(243,94,96,.34);
  box-shadow:0 24px 54px rgba(0,0,0,.28),0 0 24px rgba(243,94,96,.16);
}

.about-node-detail h2{
  margin:0;
  color:#fff;
  font-size:22px;
  line-height:1.25;
  font-weight:900;
}

.about-node-detail p{
  margin:10px 0 0;
  color:rgba(255,255,255,.64);
  font-size:15px;
  line-height:1.7;
}

.about-game-page{
  padding-top:80px;
  background:#090604;
}

.about-game-hero{
  position:relative;
  height:720px;
  min-height:720px;
  overflow:hidden;
  background:#080604;
}

.about-game-svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.about-bg-slice{
  fill:rgba(243,94,96,.055);
}

.about-bg-slice-b{
  fill:rgba(255,177,84,.045);
}

.about-dot-lines path{
  fill:none;
  stroke:#f35e60;
  stroke-width:5;
  stroke-linecap:round;
  stroke-dasharray:1 28;
  opacity:.34;
  animation:aboutDashMove 16s linear infinite;
}

.about-dot-lines path:nth-child(2),
.about-dot-lines path:nth-child(4){
  animation-direction:reverse;
}

.about-orbit ellipse{
  fill:none;
  stroke:rgba(255,180,96,.18);
  stroke-width:4;
}

.about-orbit-back{
  transform-origin:960px 460px;
  animation:aboutOrbitTilt 5.8s ease-in-out infinite alternate;
}

.about-core-system{
  transform-origin:960px 310px;
  animation:aboutCoreFloat 3.8s ease-in-out infinite;
}

.about-core-halo{
  fill:none;
  stroke:url(#aboutArcLine);
  stroke-width:5;
  stroke-dasharray:42 22;
  filter:url(#aboutGlow);
  transform-origin:960px 310px;
}

.about-core-halo-a{
  animation:aboutRingSpin 10s linear infinite;
}

.about-core-halo-b{
  stroke-width:2;
  stroke-dasharray:18 12;
  opacity:.72;
  animation:aboutRingSpin 7s linear infinite reverse;
}

.about-core-fill{
  fill:url(#aboutCoreGlow);
  stroke:rgba(255,206,126,.5);
  stroke-width:2;
  filter:url(#aboutGlow);
  animation:aboutCorePulse 2.6s ease-in-out infinite;
}

.about-core-shield{
  fill:rgba(0,0,0,.25);
  stroke:rgba(255,255,255,.72);
  stroke-width:4;
}

.about-core-chip{
  fill:rgba(0,0,0,.28);
  stroke:rgba(255,206,126,.6);
  stroke-width:2;
}

.about-core-small{
  fill:rgba(255,255,255,.78);
  font-family:"Courier New",monospace;
  font-size:23px;
  font-weight:900;
  letter-spacing:5px;
}

.about-core-title{
  fill:#fff;
  font-family:Arial,"Microsoft YaHei",sans-serif;
  font-size:42px;
  font-weight:900;
  letter-spacing:3px;
}

.about-ring-line{
  fill:none;
  stroke:rgba(255,190,92,.28);
  stroke-width:4;
}

.about-ring-light{
  fill:none;
  stroke:url(#aboutArcLine);
  stroke-width:28;
  stroke-linecap:round;
  stroke-dasharray:360 900;
  animation:aboutLightRun 4.8s ease-in-out infinite;
}

.ring-light-b{
  stroke-width:12;
  opacity:.72;
  animation-delay:1.2s;
}

.about-game-icons path{
  fill:none;
  stroke:rgba(243,94,96,.32);
  stroke-width:5;
  animation:aboutIconBlink 2.8s ease-in-out infinite;
}

.about-game-icons path:nth-child(2),
.about-game-icons path:nth-child(4){
  animation-delay:1s;
}

.about-game-hero-copy{
  position:absolute;
  left:50%;
  top:470px;
  z-index:3;
  display:grid;
  justify-items:center;
  width:780px;
  transform:translateX(-50%);
  text-align:center;
}

.about-game-hero-copy span{
  color:#ffbf79;
  font-family:"Courier New",monospace;
  font-size:13px;
  font-weight:900;
  letter-spacing:4px;
}

.about-game-hero-copy h1{
  margin:12px 0 0;
  color:#fff;
  font-size:46px;
  line-height:1;
  font-weight:900;
  letter-spacing:5px;
  text-shadow:0 12px 34px rgba(0,0,0,.55),0 0 28px rgba(243,94,96,.28);
}

.about-game-hero-copy p{
  margin:16px 0 0;
  max-width:620px;
  color:rgba(255,255,255,.74);
  font-size:16px;
  line-height:1.8;
}

.about-game-hero-copy a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:46px;
  margin-top:24px;
  padding:0 42px;
  color:#17100c;
  font-size:16px;
  font-weight:900;
  border-radius:4px;
  background:#fff;
  box-shadow:0 18px 48px rgba(0,0,0,.28);
}

.about-advantage-section{
  position:relative;
  min-height:560px;
  margin-top:-76px;
  padding:150px 0 120px;
  color:#171717;
  background:rgba(255,255,255,.94);
  clip-path:polygon(0 15%,53.5% 3.2%,56.2% 6.8%,100% 0,100% 100%,0 100%);
  overflow:hidden;
}

.about-advantage-section:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-1px;
  z-index:1;
  height:126px;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.98),rgba(8,6,4,.96) 44%,rgba(0,0,0,.82) 100%);
  clip-path:polygon(0 0,53.5% 0,56.2% 20%,100% 0,100% 26%,56.2% 60%,53.5% 45%,0 100%);
  box-shadow:0 18px 38px rgba(0,0,0,.32);
}

.about-advantage-section:after{
  content:none;
}

.about-advantage-bg{
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.08;
  background:
    linear-gradient(120deg,transparent 0 16%,rgba(0,0,0,.35) 16% 17%,transparent 17% 32%,rgba(0,0,0,.25) 32% 33%,transparent 33%),
    radial-gradient(circle at 18% 48%,rgba(0,0,0,.42),transparent 18%),
    radial-gradient(circle at 78% 38%,rgba(0,0,0,.34),transparent 20%);
}

.about-advantage-section h2{
  position:relative;
  z-index:2;
  margin:0;
  color:#1d1d22;
  font-size:48px;
  line-height:1;
  font-weight:900;
  letter-spacing:4px;
  text-align:center;
}

.about-company-intro{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(420px,520px) 1fr;
  gap:58px;
  align-items:center;
  width:min(1180px,calc(100% - 160px));
  margin:66px auto 0;
}

.about-company-image{
  position:relative;
  min-height:320px;
  padding:12px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 24px 64px rgba(0,0,0,.13);
  clip-path:polygon(8% 0,100% 0,100% 86%,90% 100%,0 100%,0 14%);
}

.about-company-image:before{
  content:"";
  position:absolute;
  left:34px;
  top:0;
  width:82px;
  height:4px;
  background:#f35e60;
  box-shadow:0 0 18px rgba(243,94,96,.38);
  z-index:2;
}

.about-company-image img{
  width:100%;
  height:320px;
  object-fit:cover;
  filter:saturate(.9) brightness(.94);
  clip-path:polygon(7% 0,100% 0,100% 86%,90% 100%,0 100%,0 14%);
}

.about-company-copy{
  color:#24262b;
}

.about-company-copy p{
  margin:0;
  color:#3f434a;
  font-size:17px;
  line-height:2;
  text-align:justify;
}

.about-company-copy p + p{
  margin-top:18px;
}

.about-advantage-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
  width:min(1240px,calc(100% - 160px));
  margin:70px auto 0;
}

.about-advantage-grid article{
  position:relative;
  display:grid;
  align-content:start;
  min-height:238px;
  padding:30px 28px;
  text-align:left;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(245,245,245,.72));
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 22px 54px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.8);
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}

.about-advantage-grid article:before{
  content:"";
  position:absolute;
  left:28px;
  top:0;
  width:58px;
  height:4px;
  background:#f35e60;
  box-shadow:0 0 18px rgba(243,94,96,.38);
}

.about-advantage-grid article:hover{
  transform:translateY(-6px);
  border-color:rgba(243,94,96,.22);
  box-shadow:0 30px 70px rgba(0,0,0,.16),0 0 26px rgba(243,94,96,.12);
}

.about-advantage-grid article > span{
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:18px;
  font-weight:900;
  line-height:1;
  letter-spacing:2px;
}

.about-advantage-grid h3{
  margin:22px 0 0;
  color:#17171b;
  font-size:26px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:1px;
}

.about-advantage-grid p{
  margin:18px 0 0;
  color:#4a4d54;
  font-size:15px;
  line-height:1.8;
}

.about-flow-section{
  position:relative;
  min-height:640px;
  margin-top:-96px;
  padding:178px 0 120px;
  color:#fff;
  background:linear-gradient(135deg,#1c0d03 0%,#2b1505 48%,#341d08 100%);
  clip-path:polygon(0 14%,54.6% 3.2%,56.4% 6.2%,100% 0,100% 100%,0 100%);
  overflow:hidden;
}

.about-flow-section:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  z-index:1;
  height:132px;
  pointer-events:none;
  background:#050402;
  clip-path:polygon(0 70%,54.6% 14%,56.4% 27%,100% 0,100% 19%,56.4% 46%,54.6% 34%,0 92%);
}

.about-flow-bg{
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.42;
  background:
    linear-gradient(135deg,transparent 0 28%,rgba(255,168,52,.08) 28% 29%,transparent 29%),
    linear-gradient(45deg,transparent 0 42%,rgba(0,0,0,.24) 42% 43%,transparent 43%),
    radial-gradient(circle at 64% 14%,rgba(243,94,96,.18),transparent 32%);
}

.about-flow-section h2,
.about-faq-section h2{
  position:relative;
  z-index:2;
  margin:0;
  color:#fff;
  font-size:46px;
  line-height:1;
  font-weight:900;
  letter-spacing:4px;
  text-align:center;
  text-shadow:0 10px 26px rgba(0,0,0,.36);
}

.about-flow-steps{
  position:relative;
  z-index:2;
  width:min(1280px,calc(100% - 120px));
  margin:72px auto 0;
  overflow:hidden;
  padding:4px 0 10px;
}

.about-cert-arrow{
  position:absolute;
  top:calc(178px + 72px + 140px);
  z-index:5;
  display:grid;
  place-items:center;
  width:42px;
  height:66px;
  color:#fff;
  font-size:42px;
  line-height:1;
  font-family:Arial,"Microsoft YaHei",sans-serif;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  text-shadow:0 0 14px rgba(243,94,96,.28),0 8px 20px rgba(0,0,0,.42);
  transform:translateY(-50%);
  transition:transform .22s ease,color .22s ease,text-shadow .22s ease;
}

.about-cert-arrow:hover{
  transform:translateY(-50%) scale(1.08);
  color:#f35e60;
  text-shadow:0 0 18px rgba(243,94,96,.42),0 10px 24px rgba(0,0,0,.46);
}

.about-cert-arrow-prev{
  left:clamp(42px,4.2vw,82px);
}

.about-cert-arrow-next{
  right:clamp(42px,4.2vw,82px);
}

.about-cert-track{
  display:flex;
  align-items:stretch;
  gap:14px;
  will-change:transform;
  transition:transform .58s cubic-bezier(.16,.78,.22,1);
}

.about-flow-steps article{
  position:relative;
  flex:0 0 calc((100% - 70px) / 6);
  min-height:306px;
  padding:14px 14px 18px;
  display:grid;
  grid-template-rows:auto 1fr;
  gap:12px;
  justify-items:center;
  text-align:center;
  background:rgba(8,5,1,.58);
}

.about-flow-image{
  position:relative;
  z-index:2;
  width:100%;
  height:224px;
  object-fit:contain;
  object-position:center;
  background:rgba(255,255,255,.92);
  clip-path:polygon(8% 0,100% 0,100% 84%,84% 100%,0 100%,0 8%);
  filter:saturate(.92) brightness(.82);
  box-shadow:0 18px 44px rgba(0,0,0,.32);
  transition:transform .26s ease,filter .26s ease;
}

.about-cert-name{
  position:relative;
  z-index:2;
  align-self:center;
  width:100%;
  overflow:hidden;
  color:rgba(255,255,255,.9);
  font-size:14px;
  line-height:1.35;
  font-style:normal;
  font-weight:900;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-shadow:0 0 14px rgba(243,94,96,.28);
}

.about-flow-steps article:hover .about-flow-image{
  transform:scale(1.035);
  filter:saturate(1.05) brightness(.92);
}

.about-flow-steps article{
  cursor:zoom-in;
}

.about-cert-preview-modal{
  position:fixed;
  inset:0;
  z-index:120;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:70px 80px 56px;
  background:rgba(0,0,0,.82);
  backdrop-filter:blur(12px);
  opacity:0;
  pointer-events:none;
  transition:opacity .22s ease;
}

.about-cert-preview-modal.is-open{
  opacity:1;
  pointer-events:auto;
}

.about-cert-preview-modal img{
  max-width:min(980px,86vw);
  max-height:78vh;
  object-fit:contain;
  border-radius:16px;
  background:rgba(255,255,255,.96);
  box-shadow:0 34px 120px rgba(0,0,0,.62),0 0 44px rgba(243,94,96,.16);
}

.about-cert-preview-modal p{
  max-width:min(980px,86vw);
  margin:0;
  color:#fff;
  font-size:18px;
  font-weight:900;
  text-align:center;
  text-shadow:0 0 18px rgba(243,94,96,.34);
}

.about-cert-preview-close{
  position:absolute;
  right:44px;
  top:34px;
  width:48px;
  height:48px;
  color:#fff;
  font-size:34px;
  line-height:1;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  cursor:pointer;
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}

.about-cert-preview-close:hover{
  transform:rotate(90deg);
  background:rgba(243,94,96,.22);
  border-color:rgba(243,94,96,.48);
}

.about-card-frame{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}

.about-card-frame path:first-child{
  fill:rgba(16,9,2,.78);
  stroke:rgba(255,178,74,.34);
  stroke-width:2;
}

.about-card-frame path:last-child{
  fill:none;
  stroke:#f35e60;
  stroke-width:3;
  filter:drop-shadow(0 0 8px rgba(243,94,96,.38));
}

.about-flow-steps article > span{
  position:relative;
  z-index:2;
  color:#d49421;
  font-family:"Courier New",monospace;
  font-size:18px;
  font-weight:900;
}

.about-flow-ico{
  position:relative;
  z-index:2;
  width:82px;
  height:82px;
  margin-top:18px;
  border-radius:24px;
  background:
    radial-gradient(circle at 65% 35%,rgba(255,216,132,.6),transparent 22%),
    radial-gradient(circle at 50% 50%,rgba(243,94,96,.28),transparent 46%),
    rgba(255,166,34,.18);
}

.about-flow-ico:before,
.about-flow-ico:after{
  content:"";
  position:absolute;
  border-radius:8px;
}

.flow-ico-apply:before{
  left:18px;
  top:18px;
  width:46px;
  height:38px;
  border:4px solid rgba(255,218,139,.72);
}

.flow-ico-apply:after{
  right:8px;
  bottom:12px;
  width:36px;
  height:18px;
  background:#ffb326;
  transform:rotate(28deg);
  clip-path:polygon(0 0,100% 50%,0 100%,22% 50%);
}

.flow-ico-launch:before{
  left:22px;
  top:10px;
  width:28px;
  height:62px;
  background:#ffb326;
  transform:rotate(38deg);
  clip-path:polygon(50% 0,100% 22%,72% 100%,28% 100%,0 22%);
}

.flow-ico-launch:after{
  left:16px;
  bottom:14px;
  width:52px;
  height:4px;
  background:#f35e60;
  box-shadow:0 0 14px rgba(243,94,96,.55);
  transform:rotate(-32deg);
}

.flow-ico-feedback:before{
  left:18px;
  top:16px;
  width:48px;
  height:54px;
  background:#d2771e;
  clip-path:polygon(0 0,100% 0,100% 76%,82% 76%,82% 100%,58% 76%,0 76%);
}

.flow-ico-feedback:after{
  left:30px;
  top:32px;
  width:26px;
  height:4px;
  background:#fff;
  box-shadow:0 14px 0 rgba(255,255,255,.9);
}

.about-flow-steps h3{
  position:relative;
  z-index:2;
  margin:22px 0 0;
  color:#fff;
  font-size:20px;
  line-height:1.2;
  font-weight:900;
}

.about-flow-steps p{
  position:relative;
  z-index:2;
  margin:12px 0 0;
  color:rgba(255,255,255,.58);
  font-size:13px;
  line-height:1.7;
}

.about-flow-arrow{
  color:#d49421;
  font-style:normal;
  font-family:"Courier New",monospace;
  font-size:22px;
  font-weight:900;
  text-align:center;
  letter-spacing:-2px;
}

.about-flow-btn{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:150px;
  height:44px;
  margin:54px auto 0;
  color:#17100a;
  font-size:15px;
  font-weight:900;
  background:#ffb326;
  clip-path:polygon(0 0,100% 0,100% 72%,86% 100%,0 100%);
  box-shadow:0 18px 36px rgba(255,179,38,.2);
}

.about-faq-section{
  position:relative;
  margin-top:-122px;
  padding:178px 0 120px;
  background:#efefef;
  overflow:hidden;
}

.about-faq-section:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  z-index:1;
  height:142px;
  pointer-events:none;
  background:
    linear-gradient(135deg,#1c0d03 0%,#2b1505 52%,#341d08 100%);
  clip-path:polygon(0 0,100% 0,100% 30%,74.2% 55%,73.8% 61%,0 100%);
}

.about-faq-section h2{
  position:relative;
  z-index:2;
  color:#1d1d22;
  text-shadow:none;
}

.about-faq-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:36px;
  width:min(900px,calc(100% - 160px));
  margin:70px auto 0;
}

.about-faq-grid article{
  position:relative;
  min-height:164px;
  padding:30px 34px;
  background:#fff;
  box-shadow:0 18px 44px rgba(0,0,0,.12);
}

.about-faq-frame{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}

.about-faq-frame path:first-child{
  fill:#fff;
  stroke:rgba(0,0,0,.08);
  stroke-width:2;
}

.about-faq-frame path:last-child{
  fill:none;
  stroke:rgba(243,94,96,.28);
  stroke-width:3;
  stroke-dasharray:10 8;
}

.about-faq-grid h3{
  position:relative;
  z-index:2;
  margin:0;
  color:#202024;
  font-size:17px;
  line-height:1.35;
  font-weight:900;
}

.about-faq-grid h3:before{
  content:"鈿?;
  margin-right:8px;
  color:#f3a70d;
}

.about-faq-grid p{
  position:relative;
  z-index:2;
  margin:18px 0 0;
  color:#666b73;
  font-size:14px;
  line-height:1.8;
}

.about-info-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  width:min(1180px,calc(100% - 160px));
  margin:0 auto;
  padding:86px 0 120px;
}

.about-info-strip article{
  padding:28px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}

.about-info-strip b{
  display:block;
  color:#f35e60;
  font-size:24px;
  line-height:1;
}

.about-info-strip span{
  display:block;
  margin-top:14px;
  color:rgba(255,255,255,.68);
  font-size:16px;
}

@keyframes aboutDashMove{
  to{stroke-dashoffset:-320}
}

@keyframes aboutOrbitTilt{
  from{transform:scaleY(.92)}
  to{transform:scaleY(1.04)}
}

@keyframes aboutCoreFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-14px)}
}

@keyframes aboutRingSpin{
  to{transform:rotate(360deg)}
}

@keyframes aboutCorePulse{
  0%,100%{opacity:.72}
  50%{opacity:1}
}

@keyframes aboutLightRun{
  0%{stroke-dashoffset:0}
  100%{stroke-dashoffset:-1260}
}

@keyframes aboutIconBlink{
  0%,100%{opacity:.18;transform:translateY(0)}
  50%{opacity:.58;transform:translateY(-8px)}
}

.desktop-hero{
  position:relative;
  z-index:2;
  height:100vh;
  min-height:100vh;
  padding-top:80px;
  overflow:hidden;
  perspective:1400px;
}

.hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
   object-fit:contain;
  object-position:center top;
  background:#070305;
  object-fit:cover;
  opacity:1;
   transform:none;
   transition:none;
}

.hero-mask{
  position:absolute;
  inset:0;
  display:none;
}

.hero-corner-plane{
  position:absolute;
  z-index:2;
  pointer-events:none;
}

.hero-corner-left{
  left:0;
  top:80px;
  width:22vw;
  height:72vh;
  background:linear-gradient(135deg,rgba(255,100,24,.48),rgba(70,20,0,.16));
  clip-path:polygon(0 0,100% 0,0 100%);
}

.hero-corner-right{
  right:0;
  top:80px;
  width:34vw;
  height:72vh;
  background:linear-gradient(225deg,rgba(255,100,24,.44),rgba(72,18,0,.08));
  clip-path:polygon(0 0,100% 0,100% 100%);
}

.desktop-hero:after{
  content:"";
  position:absolute;
  inset:80px 0 0;
  display:none;
  background:none;
  background-size:70px 70px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.75),transparent 78%);
  pointer-events:none;
}

.desktop-hero.is-fullscreen-active .hero-bg,
.desktop-hero.is-fullscreen-active .floating-cover{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

.desktop-hero[data-active-panel="cooperation"]:after{
  opacity:0;
}

.hero-stage{
  position:relative;
  z-index:5;
  height:calc(100vh - 80px);
  min-height:0;
}

.floating-cover{
  position:absolute;
  z-index:6;
  width:200px;
  height:262px;
  animation:cardFloat 4.8s ease-in-out infinite;
}

.floating-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.floating-cover b{
  position:absolute;
  left:16px;
  right:16px;
  bottom:18px;
  z-index:2;
  color:#fff;
  font-size:22px;
  line-height:1.1;
  font-weight:900;
  text-align:center;
  text-shadow:0 4px 16px rgba(0,0,0,.7);
}

.cover-top-left{
  left:10.5%;
  top:-26px;
}

.cover-top-right{
  right:24%;
  top:0;
  width:158px;
  height:214px;
  animation-delay:.6s;
}

.cover-bottom{
  left:26%;
  bottom:6px;
  width:138px;
  height:176px;
  opacity:.74;
  animation-delay:1.2s;
}

.hero-copy{
  position:absolute;
  left:18%;
  top:84px;
  z-index:8;
  width:620px;
  margin:0;
  min-height:450px;
  padding:34px 38px 40px;
  text-align:left;
  transform:none;
  border-radius:28px;
  background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.045));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 24px 70px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.14);
  backdrop-filter:blur(16px);
}

.hero-copy.reveal-item{
  transform:none;
  animation:none;
  opacity:1;
}

.hero-copy.ui-reveal{
  opacity:1 !important;
  transform:none !important;
}

.hero-copy:not(.is-panel-active) .hero-tab-panel{
  visibility:hidden;
}

.hero-copy.is-panel-active .hero-tab-panel.is-active{
  visibility:visible;
  opacity:1;
}

.hero-copy h1{
  margin:0;
  color:#fff;
  font-size:66px;
  line-height:1.08;
  font-weight:900;
  letter-spacing:4px;
  text-shadow:0 12px 34px rgba(0,0,0,.54);
}

.hero-subtitle{
  margin:22px 0 0;
  max-width:520px;
  color:rgba(255,255,255,.88);
  font-size:28px;
  line-height:1.45;
  font-weight:900;
  letter-spacing:2px;
}

.hero-panel-kicker{
  display:inline-flex;
  align-items:center;
  height:28px;
  margin-bottom:16px;
  padding:0 12px;
  color:rgba(255,178,96,.96);
  font-family:"Courier New",monospace;
  font-size:13px;
  font-weight:900;
  letter-spacing:3px;
  border:1px solid rgba(255,143,31,.34);
  background:rgba(255,143,31,.1);
}

.hero-default-copy,
.hero-tab-panel{
  position:absolute;
  left:38px;
  right:38px;
  top:34px;
  opacity:1;
  transform:translateX(0);
  transition:opacity .28s ease,transform .28s ease,filter .28s ease;
}

.hero-copy:not(.is-panel-active) .hero-default-copy{
  opacity:1;
  visibility:visible;
  transform:none;
  pointer-events:auto;
}

.hero-copy.is-panel-active .hero-default-copy{
  opacity:0;
  visibility:hidden;
  transform:translateX(-18px);
  pointer-events:none;
  filter:none;
}

.hero-copy.is-panel-active .hero-default-copy *{
  visibility:hidden !important;
  pointer-events:none !important;
}

.hero-tab-panel{
  opacity:0;
  visibility:hidden;
  z-index:-1;
  transform:translateX(22px);
  pointer-events:none;
  filter:none;
}

.hero-tab-panel.is-active{
  opacity:1;
  visibility:visible;
  z-index:5;
  transform:translateX(0);
  pointer-events:auto;
  filter:none;
}

.hero-tab-panel:not(.is-active),
.hero-tab-panel:not(.is-active) *{
  visibility:hidden !important;
  pointer-events:none !important;
}

.hero-tab-panel:not(.is-active){
  opacity:0 !important;
  z-index:-1 !important;
}

.hero-copy.is-panel-active .hero-tab-panel.is-active{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  z-index:10 !important;
}

.hero-copy.is-fullscreen-mode{
  position:fixed;
  left:0;
  right:0;
  top:40px;
  bottom:auto;
  z-index:150;
  width:100%;
  height:100vh;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  transform:none !important;
}

.hero-copy.is-fullscreen-mode .hero-tab-panel{
  left:0;
  right:0;
  top:0;
  bottom:0;
}

.hero-copy.is-fullscreen-mode .hero-tab-panel[data-panel="cooperation"]{
  position:absolute;
  left:0;
  right:0;
  top:0;
  bottom:0;
  z-index:1;
}

.case-fullscreen-scene{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:#020304;
  isolation:isolate;
}

.case-fullscreen-scene:before,
.case-fullscreen-scene:after{
  content:"";
  position:absolute;
  top:0;
  z-index:0;
  width:46vw;
  height:56vh;
  background:linear-gradient(135deg,rgba(101,34,6,.74),rgba(55,13,0,.46));
  pointer-events:none;
}

.case-fullscreen-scene:before{
  left:0;
  clip-path:polygon(0 0,72% 0,100% 100%,0 82%);
}

.case-fullscreen-scene:after{
  right:0;
  clip-path:polygon(28% 0,100% 0,100% 82%,0 100%);
}

.hero-tab-panel[data-panel="cases"] .case-fullscreen-scene{
  background:
    radial-gradient(circle at 0% 0%,rgba(243,94,96,.46) 0%,rgba(143,37,44,.2) 22%,transparent 42%),
    radial-gradient(circle at 100% 0%,rgba(243,94,96,.42) 0%,rgba(111,27,34,.18) 22%,transparent 42%),
    #020304;
}

.hero-tab-panel[data-panel="cases"] .case-fullscreen-scene:before,
.hero-tab-panel[data-panel="cases"] .case-fullscreen-scene:after{
  background:transparent;
}

.fullscreen-framework:before,
.fullscreen-framework:after{
  display:none;
}

.fullscreen-framework{
  background:#020304;
}

.framework-scenes{
  position:absolute;
  inset:0;
  overflow:hidden;
  isolation:isolate;
}

.framework-slide{
  opacity:0;
  pointer-events:none;
  transform:translate3d(110px,0,0);
  transition:opacity .72s ease,transform .72s cubic-bezier(.16,.78,.22,1);
  will-change:opacity,transform;
}

.framework-slide.is-current{
  opacity:1;
  pointer-events:auto;
  transform:translate3d(0,0,0);
  z-index:2;
}

.framework-slide.is-prev{
  opacity:0;
  transform:translate3d(-130px,0,0);
  z-index:1;
}

.framework-bg-shape{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  background:
    radial-gradient(circle at 0% 0%,rgba(243,94,96,.46) 0%,rgba(143,37,44,.2) 22%,transparent 42%),
    radial-gradient(circle at 100% 0%,rgba(243,94,96,.42) 0%,rgba(111,27,34,.18) 22%,transparent 42%),
    #020304;
  pointer-events:none;
}

.framework-bg-shape:before,
.framework-bg-shape:after{
  content:"";
  position:absolute;
  inset:-12%;
  width:auto;
  height:auto;
  background:transparent;
  opacity:0;
  pointer-events:none;
  clip-path:none;
  transform:translateZ(0);
}

.framework-bg-shape:before{
  left:auto;
  animation:none;
}

.framework-bg-shape:after{
  background:transparent;
  animation:none;
}

.framework-bg-shape span{
  display:none;
}

.framework-title-copy{
  position:absolute;
  left:50%;
  top:128px;
  z-index:5;
  width:1000px;
  text-align:center;
  opacity:0;
  transform:translate3d(-50%,46px,0);
  transition:opacity .42s ease,transform .48s cubic-bezier(.14,.82,.22,1);
  will-change:opacity,transform;
}

.framework-slide.is-current .framework-title-copy{
  opacity:1;
  transform:translate3d(-50%,0,0);
}

.framework-slide.is-prev .framework-title-copy{
  opacity:0;
  transform:translate3d(-50%,-46px,0);
}

.framework-title-copy h1{
  margin:0;
  color:#fff;
  font-size:58px;
  line-height:1.05;
  font-weight:900;
  letter-spacing:4px;
  text-shadow:0 14px 38px rgba(0,0,0,.66),0 0 28px rgba(243,94,96,.18);
}

.framework-suotuo-rain{
  position:absolute;
  left:50%;
  top:245px;
  z-index:2;
  width:868px;
  height:120px;
  overflow:hidden;
  transform:translateX(-50%);
  opacity:0;
  transition:opacity .12s linear;
}

.framework-rain-beam{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:none;
  opacity:.78;
}

.framework-rain-text{
  position:absolute;
  left:0;
  right:0;
  top:10px;
  height:78px;
  color:rgba(243,94,96,.28);
  font-family:"Courier New",monospace;
  font-size:10px;
  line-height:14px;
  font-weight:900;
  letter-spacing:4px;
  opacity:0;
  transform:translateY(34px);
  will-change:transform,opacity;
}

.framework-rain-text span{
  position:absolute;
  opacity:.22;
}

.framework-rain-text span:nth-child(1){left:7%;top:4px;font-size:8px}
.framework-rain-text span:nth-child(2){left:18%;top:22px;font-size:10px;opacity:.34}
.framework-rain-text span:nth-child(3){left:31%;top:10px;font-size:7px;opacity:.18}
.framework-rain-text span:nth-child(4){left:43%;top:34px;font-size:9px;opacity:.3}
.framework-rain-text span:nth-child(5){left:55%;top:16px;font-size:11px;opacity:.42}
.framework-rain-text span:nth-child(6){left:66%;top:42px;font-size:8px;opacity:.24}
.framework-rain-text span:nth-child(7){left:78%;top:8px;font-size:10px;opacity:.36}
.framework-rain-text span:nth-child(8){left:86%;top:30px;font-size:7px;opacity:.2}
.framework-rain-text span:nth-child(9){left:24%;top:56px;font-size:8px;opacity:.26}
.framework-rain-text span:nth-child(10){left:70%;top:62px;font-size:9px;opacity:.3}

.hero-tab-panel[data-panel="framework"].is-active .framework-slide.is-current .framework-suotuo-rain,
.hero-tab-panel[data-panel="framework"].is-active .framework-suotuo-rain.is-rain-ready{
  opacity:1;
}

.hero-tab-panel[data-panel="framework"].is-active .framework-slide.is-current .framework-suotuo-rain{
  animation:frameworkRainBeamShow .01s linear .86s forwards;
}

.hero-tab-panel[data-panel="framework"].is-active .framework-slide.is-current .framework-rain-text{
  animation:frameworkRainTextUp .26s cubic-bezier(.12,.82,.2,1) .88s both;
}

.framework-client-window{
  position:absolute;
  left:50%;
  bottom:-70px;
  z-index:6;
  width:1000px;
  height:548px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px 18px 0 0;
  background:#070808;
  box-shadow:0 34px 90px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.06),0 -8px 40px rgba(243,94,96,.16);
  transform:translateX(-50%);
}

.framework-client-shot{
  position:absolute;
  left:50%;
  bottom:10px;
  z-index:6;
  display:block;
  width:1000px;
  height:auto;
  filter:hue-rotate(145deg) saturate(1.05) drop-shadow(0 34px 44px rgba(0,0,0,.7)) drop-shadow(0 0 24px rgba(243,94,96,.08));
  opacity:0;
  transform:translate3d(calc(-50% + 240px),0,0) scale(.98);
  transition:opacity .72s ease,transform .72s cubic-bezier(.16,.78,.22,1);
  will-change:transform,opacity;
}

.framework-slide.is-prev .framework-client-shot{
  opacity:0;
  transform:translate3d(calc(-50% - 240px),0,0) scale(.98);
}

.hero-tab-panel[data-panel="framework"].is-active .framework-slide.is-current .framework-client-shot{
  opacity:1;
  transform:translate3d(-50%,0,0) scale(1);
}

.hero-tab-panel[data-panel="framework"].is-active .framework-slide.is-current .framework-client-shot:hover{
  transform:translate3d(-50%,0,0) scale(1.05);
}

.framework-shot-b{
  filter:hue-rotate(145deg) saturate(1.08) drop-shadow(0 34px 44px rgba(0,0,0,.7)) drop-shadow(0 0 24px rgba(243,94,96,.08));
}

.framework-shot-c{
  filter:hue-rotate(145deg) saturate(1.12) brightness(1.04) drop-shadow(0 34px 44px rgba(0,0,0,.7)) drop-shadow(0 0 24px rgba(243,94,96,.08));
}

.framework-client-window:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:4px;
  background:linear-gradient(90deg,transparent,rgba(243,94,96,.95),transparent);
  box-shadow:0 0 24px rgba(243,94,96,.68);
}

.client-topbar{
  display:flex;
  align-items:center;
  height:48px;
  gap:18px;
  padding:0 18px;
  color:rgba(255,255,255,.76);
  background:#090a0c;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.client-logo-dot{
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  color:#111;
  font-weight:900;
  border-radius:50%;
  background:#ff9300;
}

.client-back,
.client-refresh{
  font-size:24px;
  color:#cfd1d4;
}

.client-search-mini{
  display:flex;
  align-items:center;
  width:310px;
  height:30px;
  padding:0 10px;
  border-radius:4px;
  background:#1d1f22;
}

.client-search-mini input{
  flex:1;
  border:0;
  outline:0;
  color:#aeb3bb;
  background:transparent;
}

.client-search-mini b{
  color:#d8d8d8;
}

.client-icons{
  margin-left:auto;
  color:#d8d8d8;
  letter-spacing:14px;
  white-space:nowrap;
}

.client-body{
  display:grid;
  grid-template-columns:54px 1fr 220px;
  height:500px;
}

.client-side-icons{
  display:grid;
  align-content:start;
  justify-items:center;
  gap:22px;
  padding-top:24px;
  background:#0a0b0d;
  border-right:1px solid rgba(255,255,255,.06);
}

.client-side-icons b{
  color:#8b9199;
  font-size:20px;
}

.client-content{
  padding:24px 24px 0;
}

.client-tabs{
  display:flex;
  gap:28px;
  margin-bottom:20px;
  font-size:14px;
  font-weight:900;
}

.client-tabs b{
  color:#f35e60;
}

.client-tabs span{
  color:#d8d8d8;
}

.client-hero-img{
  width:590px;
  height:278px;
  object-fit:cover;
  border-radius:6px;
  filter:saturate(.88) contrast(1.05);
}

.client-content h2{
  margin:28px 0 14px;
  color:#fff;
  font-size:24px;
}

.client-card-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  width:590px;
}

.client-card-row img{
  width:100%;
  height:88px;
  object-fit:cover;
  border-radius:5px;
}

.client-game-list{
  display:grid;
  align-content:start;
  gap:16px;
  padding:56px 20px 0 0;
}

.client-game-list b,
.client-game-list span{
  display:flex;
  align-items:center;
  min-height:42px;
  padding:0 12px;
  color:#d6d8dc;
  font-size:14px;
  font-weight:900;
  border-radius:5px;
}

.client-game-list .active{
  color:#fff;
  background:rgba(255,255,255,.12);
}

.fullscreen-cooperation:before,
.fullscreen-cooperation:after{
  background:linear-gradient(135deg,rgba(94,22,29,.72),rgba(42,5,10,.48));
}

.cooperation-css-scene{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  background:#020202;
  isolation:isolate;
}

.cooperation-slice{
  position:absolute;
  inset:0;
  overflow:hidden;
  opacity:0;
  transform:translateZ(0);
  will-change:opacity,transform;
}

.cooperation-slice-a{
  z-index:3;
  clip-path:polygon(0 0,39% 0,27% 100%,0 100%);
  background:
    radial-gradient(circle at 34% 10%,rgba(243,94,96,.34),transparent 32%),
    linear-gradient(135deg,#4b0c13 0%,#8b1c27 42%,#180306 100%);
}

.cooperation-slice-b{
  z-index:2;
  clip-path:polygon(39% 0,72% 0,60% 100%,27% 100%);
  background:
    radial-gradient(circle at 58% 18%,rgba(243,94,96,.2),transparent 36%),
    linear-gradient(135deg,#120304 0%,#351016 52%,#731923 100%);
}

.cooperation-slice-c{
  z-index:1;
  clip-path:polygon(72% 0,100% 0,100% 100%,60% 100%);
  background:
    radial-gradient(circle at 76% 18%,rgba(243,94,96,.1),transparent 34%),
    linear-gradient(135deg,#12090b 0%,#070707 56%,#010101 100%);
}

.cooperation-arrow-texture{
  position:absolute;
  left:-12vw;
  right:-12vw;
  top:50%;
  height:170px;
  color:rgba(255,220,224,.15);
  pointer-events:none;
  transform:translate3d(0,-50%,0);
  will-change:transform,opacity;
}

.cooperation-slice-b .cooperation-arrow-texture{
  color:rgba(255,160,166,.13);
}

.cooperation-slice-c .cooperation-arrow-texture{
  color:rgba(255,255,255,.12);
}

.cooperation-arrow-texture:before{
  content:">> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >>";
  display:block;
  white-space:nowrap;
  font-family:Arial,"Microsoft YaHei",sans-serif;
  font-size:28px;
  line-height:1;
  font-weight:900;
  letter-spacing:5px;
  transform:translate3d(0,0,0);
  opacity:0;
  will-change:transform,opacity;
}

.cooperation-arrow-texture:after{
  content:">> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >>";
  position:absolute;
  left:0;
  top:68px;
  display:block;
  white-space:nowrap;
  font-family:Arial,"Microsoft YaHei",sans-serif;
  font-size:20px;
  line-height:1;
  font-weight:900;
  letter-spacing:8px;
  opacity:0;
  transform:translate3d(0,0,0);
  will-change:transform,opacity;
}

.cooperation-slice-copy{
  position:absolute;
  z-index:4;
  display:grid;
  gap:0;
  color:#fff;
  opacity:0;
  transform:translate3d(-50%,-50%,0) scale(.8);
  transform-origin:center;
  will-change:transform,opacity;
  text-shadow:0 10px 28px rgba(0,0,0,.46);
  white-space:nowrap;
}

.cooperation-slice-copy strong{
  position:relative;
  font-size:42px;
  line-height:1;
  font-weight:900;
  font-style:italic;
  letter-spacing:2px;
}

.cooperation-slice-copy strong:before,
.cooperation-slice-copy strong:after{
  position:absolute;
  top:50%;
  color:#f35e60;
  font-size:31px;
  line-height:1;
  font-weight:500;
  transform:translateY(-48%);
}

.cooperation-slice-copy strong:before{
  content:"<";
  left:-32px;
}

.cooperation-slice-copy strong:after{
  content:">";
  right:-32px;
}

.cooperation-slice-copy span{
  display:none;
}

.cooperation-slice-a .cooperation-slice-copy{
  left:16.5vw;
  top:50%;
}

.cooperation-slice-b .cooperation-slice-copy{
  left:49.5vw;
  top:50%;
}

.cooperation-slice-c .cooperation-slice-copy{
  left:83vw;
  top:50%;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice{
  animation:cooperationSliceFade .5s ease both;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-a{
  animation:cooperationSliceFromLeft .5s ease both;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-b{
  animation:cooperationSliceFromTop .5s ease both;
  animation-delay:.22s;
  z-index:4;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-c{
  animation:cooperationSliceFromRight .5s ease both;
  animation-delay:.44s;
  z-index:5;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-arrow-texture:before{
  opacity:1;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-arrow-texture:after{
  opacity:.62;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-a .cooperation-arrow-texture:before,
.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-a .cooperation-arrow-texture:after,
.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-c .cooperation-arrow-texture:before,
.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-c .cooperation-arrow-texture:after{
  animation:cooperationArrowLeft 34s linear infinite;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-b .cooperation-arrow-texture:before,
.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-b .cooperation-arrow-texture:after{
  animation:cooperationArrowRight 38s linear infinite;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-copy{
  animation:cooperationCopyPop .4s ease both;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-a .cooperation-slice-copy{
  animation:cooperationCopyFromLeft .5s ease both;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-b .cooperation-slice-copy{
  animation:cooperationCopyFromTop .5s ease both;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-c .cooperation-slice-copy{
  animation:cooperationCopyFromRight .5s ease both;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-b .cooperation-slice-copy{
  animation-delay:.22s;
}

.hero-tab-panel[data-panel="cooperation"].is-active .cooperation-slice-c .cooperation-slice-copy{
  animation-delay:.44s;
}

.cooperation-css-scene.is-detail-mode .cooperation-slice{
  opacity:0 !important;
  pointer-events:none;
  transition:opacity .38s ease;
}

.cooperation-detail-scene{
  position:absolute;
  inset:0;
  z-index:20;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
  background:#050505;
  transform:translateZ(0);
  will-change:opacity;
}

.cooperation-css-scene.is-detail-mode .cooperation-detail-scene{
  opacity:1;
  pointer-events:auto;
  animation:cooperationDetailFade .5s ease both;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-scene{
  opacity:1 !important;
  pointer-events:auto;
}

.cooperation-detail-bg,
.cooperation-detail-left,
.cooperation-detail-right{
  position:absolute;
  inset:0;
  opacity:0;
  transform:translateZ(0);
  will-change:opacity,transform;
}

.cooperation-detail-bg{
  z-index:0;
  background:
    radial-gradient(circle at 78% 20%,rgba(243,94,96,.3),transparent 34%),
    linear-gradient(120deg,rgba(243,94,96,.18),rgba(0,0,0,0));
}

.cooperation-detail-bg-2{
  background:
    radial-gradient(circle at 76% 22%,rgba(255,139,141,.26),transparent 32%),
    linear-gradient(120deg,rgba(149,34,43,.24),rgba(0,0,0,0));
}

.cooperation-detail-bg-3{
  background:
    radial-gradient(circle at 78% 16%,rgba(243,94,96,.24),transparent 32%),
    linear-gradient(120deg,rgba(243,94,96,.2),rgba(0,0,0,0));
}

.cooperation-detail-bg.is-active{
  opacity:1;
  transition:opacity .38s ease;
}

.cooperation-detail-left{
  z-index:1;
  clip-path:polygon(0 0,66% 0,42% 100%,0 100%);
  background:
    radial-gradient(circle at 30% 24%,rgba(255,255,255,.06),transparent 28%),
    linear-gradient(120deg,rgba(19,21,22,.98),rgba(4,5,5,.98));
}

.cooperation-detail-right{
  z-index:1;
  opacity:1;
  clip-path:polygon(66% 0,100% 0,100% 100%,42% 100%);
  background:
    radial-gradient(circle at 82% 20%,rgba(255,170,176,.42),transparent 32%),
    linear-gradient(135deg,#ff8b8d 0%,#f35e60 42%,#7b101b 100%);
}

.cooperation-css-scene.is-detail-mode .cooperation-detail-left,
.cooperation-css-scene.is-detail-mode .cooperation-detail-right{
  animation:cooperationDetailFade .5s ease both;
}

.cooperation-detail-arrow{
  position:absolute;
  left:-10vw;
  right:-10vw;
  top:27%;
  z-index:2;
  height:180px;
  color:rgba(255,255,255,.11);
  overflow:hidden;
  pointer-events:none;
}

.cooperation-detail-arrow:before,
.cooperation-detail-arrow:after{
  content:">> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >> >>";
  position:absolute;
  left:0;
  display:block;
  white-space:nowrap;
  font-family:Arial,"Microsoft YaHei",sans-serif;
  font-weight:900;
  transform:translate3d(0,0,0);
  will-change:transform,opacity;
}

.cooperation-detail-arrow:before{
  top:28px;
  font-size:30px;
  letter-spacing:6px;
  opacity:.72;
  animation:cooperationArrowLeft 36s linear infinite;
}

.cooperation-detail-arrow:after{
  top:86px;
  font-size:20px;
  letter-spacing:10px;
  opacity:.42;
  animation:cooperationArrowRight 42s linear infinite;
}

.cooperation-channel-bg{
  position:absolute;
  inset:0;
  z-index:3;
  opacity:0;
  visibility:hidden;
  overflow:hidden;
  pointer-events:none;
  background:
    radial-gradient(circle at 76% 46%,rgba(243,94,96,.24),transparent 28%),
    radial-gradient(circle at 48% 18%,rgba(243,94,96,.12),transparent 30%),
    linear-gradient(115deg,rgba(0,0,0,0) 0 42%,rgba(243,94,96,.08) 43% 47%,rgba(0,0,0,0) 48% 100%);
  transform:translateZ(0);
  will-change:opacity;
}

.cooperation-channel-bg:before,
.cooperation-channel-bg:after{
  content:"";
  position:absolute;
  inset:-18%;
  background:
    linear-gradient(90deg,transparent 0 48%,rgba(243,94,96,.2) 49%,transparent 50%),
    linear-gradient(180deg,transparent 0 48%,rgba(255,255,255,.055) 49%,transparent 50%);
  background-size:86px 86px;
  opacity:.34;
  transform:skewX(-18deg) translate3d(0,0,0);
  animation:channelBgScan 12s linear infinite;
}

.cooperation-channel-bg:after{
  inset:-8%;
  background:
    radial-gradient(circle,rgba(243,94,96,.32) 0 2px,transparent 3px),
    linear-gradient(120deg,transparent 0 42%,rgba(243,94,96,.12) 43%,transparent 48%);
  background-size:120px 90px,100% 100%;
  opacity:.28;
  animation:channelBgParticles 16s linear infinite;
}

.cooperation-channel-bg i{
  position:absolute;
  display:block;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(243,94,96,.78),rgba(255,255,255,.48),transparent);
  box-shadow:0 0 18px rgba(243,94,96,.42);
  transform:translate3d(-120%,0,0) skewX(-24deg);
  animation:channelDataLine 3.6s ease-in-out infinite;
}

.cooperation-channel-bg i:nth-child(1){left:8%;top:23%;width:38%;animation-delay:.15s}
.cooperation-channel-bg i:nth-child(2){left:16%;top:48%;width:52%;animation-delay:.62s}
.cooperation-channel-bg i:nth-child(3){left:34%;top:69%;width:44%;animation-delay:1.08s}
.cooperation-channel-bg i:nth-child(4){left:58%;top:36%;width:28%;animation-delay:1.52s}

.cooperation-channel-person{
  position:absolute;
  right:2.8vw;
  top:50%;
  bottom:auto;
  z-index:7;
  width:min(42vw,760px);
  height:76vh;
  max-height:none;
  object-fit:contain;
  object-position:center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  filter:drop-shadow(0 34px 56px rgba(0,0,0,.56)) drop-shadow(0 0 42px rgba(243,94,96,.18));
  transform:translate3d(70px,-50%,0) scale(.96);
  transform-origin:50% 50%;
  mask-image:linear-gradient(180deg,#000 0 82%,transparent 100%);
  will-change:transform,opacity;
}

.cooperation-css-scene[data-coop-detail="0"] .cooperation-detail-arrow{
  opacity:0;
  visibility:hidden;
}

.cooperation-css-scene[data-coop-detail="0"] .cooperation-detail-left{
  background:
    radial-gradient(circle at 26% 32%,rgba(243,94,96,.1),transparent 30%),
    linear-gradient(120deg,rgba(12,13,15,.98),rgba(2,3,4,.98));
}

.cooperation-css-scene[data-coop-detail="0"] .cooperation-detail-right{
  background:
    radial-gradient(circle at 78% 26%,rgba(243,94,96,.28),transparent 34%),
    linear-gradient(135deg,#250407 0%,#5a1018 40%,#090203 100%);
}

.cooperation-css-scene[data-coop-detail="0"] .cooperation-role-wrap{
  opacity:0 !important;
  visibility:hidden;
}

.cooperation-css-scene.is-detail-ready[data-coop-detail="0"] .cooperation-channel-bg{
  opacity:1;
  visibility:visible;
  animation:channelBgIn .48s ease both;
}

.cooperation-css-scene.is-detail-ready[data-coop-detail="0"] .cooperation-channel-person{
  opacity:.82;
  visibility:visible;
  animation:channelPersonIn .62s ease .18s both,channelPersonBreath 4.8s ease-in-out 1s infinite;
}

.cooperation-custom-bg{
  position:absolute;
  inset:0;
  z-index:3;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  background:
    radial-gradient(circle at 70% 40%,rgba(243,94,96,.18),transparent 30%),
    radial-gradient(circle at 30% 18%,rgba(255,255,255,.04),transparent 22%),
    linear-gradient(120deg,rgba(243,94,96,.08) 0 1px,transparent 1px);
  background-size:auto,auto,74px 74px;
  transform:translateZ(0);
  will-change:opacity;
}

.cooperation-custom-bg:before,
.cooperation-custom-bg:after{
  content:"";
  position:absolute;
  inset:-18%;
  background:
    linear-gradient(115deg,transparent 0 38%,rgba(243,94,96,.16) 39%,transparent 41%),
    linear-gradient(90deg,transparent 0 49%,rgba(255,255,255,.045) 50%,transparent 51%);
  background-size:100% 100%,96px 96px;
  opacity:.42;
  transform:skewX(-16deg) translate3d(0,0,0);
  animation:customBgMatrix 14s linear infinite;
}

.cooperation-custom-bg:after{
  inset:-10%;
  background:
    radial-gradient(circle,rgba(243,94,96,.34) 0 2px,transparent 3px),
    radial-gradient(circle,rgba(255,255,255,.12) 0 1px,transparent 2px);
  background-size:130px 100px,82px 82px;
  opacity:.25;
  animation:customBgDots 18s linear infinite;
}

.cooperation-custom-bg i{
  position:absolute;
  display:block;
  width:220px;
  height:52px;
  border:1px solid rgba(243,94,96,.24);
  background:linear-gradient(135deg,rgba(243,94,96,.11),rgba(255,255,255,.025));
  box-shadow:0 18px 42px rgba(0,0,0,.22),0 0 22px rgba(243,94,96,.08);
  clip-path:polygon(0 0,92% 0,100% 26%,100% 100%,8% 100%,0 74%);
  opacity:0;
  transform:translate3d(70vw,0,0) skewX(-10deg);
  animation:customFloatChip 7s ease-in-out infinite;
}

.cooperation-custom-bg i:nth-child(1){left:58%;top:18%;animation-delay:.1s}
.cooperation-custom-bg i:nth-child(2){left:64%;top:34%;width:260px;animation-delay:.55s}
.cooperation-custom-bg i:nth-child(3){left:54%;top:52%;width:200px;animation-delay:1s}
.cooperation-custom-bg i:nth-child(4){left:70%;top:67%;animation-delay:1.5s}
.cooperation-custom-bg i:nth-child(5){left:42%;top:75%;width:300px;animation-delay:2s}

.cooperation-custom-visual{
  position:absolute;
  right:2.8vw;
  top:50%;
  bottom:auto;
  z-index:7;
  width:min(42vw,760px);
  min-width:520px;
  height:76vh;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(64px,-50%,0) scale(.95);
  will-change:transform,opacity;
}

.custom-person-glow{
  position:absolute;
  left:50%;
  bottom:4%;
  width:88%;
  height:68%;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 54%,rgba(243,94,96,.24),transparent 58%),
    radial-gradient(circle at 50% 68%,rgba(255,255,255,.08),transparent 44%);
  filter:none;
  transform:translateX(-50%);
  animation:customPersonGlow 4.8s ease-in-out infinite;
}

.cooperation-custom-person{
  position:absolute;
  left:50%;
  top:50%;
  bottom:auto;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 36px 58px rgba(0,0,0,.58)) drop-shadow(0 0 42px rgba(243,94,96,.2));
  transform:translate3d(-50%,-50%,0) scale(1);
  transform-origin:50% 50%;
  mask-image:linear-gradient(180deg,#000 0 86%,transparent 100%);
  animation:customPersonBreath 5.2s ease-in-out 1s infinite;
}

.custom-orbit{
  position:absolute;
  left:50%;
  top:48%;
  width:330px;
  height:330px;
  border-radius:50%;
  border:1px dashed rgba(243,94,96,.3);
  box-shadow:inset 0 0 46px rgba(243,94,96,.08),0 0 60px rgba(243,94,96,.12);
  transform:translate(-50%,-50%);
  animation:customOrbitSpin 16s linear infinite;
}

.custom-orbit:before,
.custom-orbit:after{
  content:"";
  position:absolute;
  inset:48px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
}

.custom-orbit:after{
  inset:104px;
  background:radial-gradient(circle,rgba(243,94,96,.18),transparent 70%);
}

.custom-doc{
  position:absolute;
  width:178px;
  height:226px;
  padding:24px 20px;
  color:#fff;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.025)),
    linear-gradient(135deg,rgba(243,94,96,.26),rgba(8,9,11,.94));
  border:1px solid rgba(243,94,96,.34);
  box-shadow:0 28px 58px rgba(0,0,0,.48),0 0 34px rgba(243,94,96,.13);
  clip-path:polygon(0 0,100% 0,100% 88%,88% 100%,0 100%);
  opacity:0;
  transform:translate3d(70px,34px,0) rotate(8deg);
  animation:customDocIn .58s ease both,customDocFloat 4.8s ease-in-out 1.2s infinite;
}

.custom-doc b{
  display:block;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:38px;
  line-height:1;
  letter-spacing:2px;
}

.custom-doc span{
  display:block;
  margin-top:18px;
  color:rgba(255,255,255,.78);
  font-size:18px;
  font-weight:900;
}

.custom-doc:after{
  content:"";
  position:absolute;
  left:20px;
  right:20px;
  bottom:30px;
  height:46px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.22) 0 70%,transparent 70%),
    linear-gradient(90deg,rgba(255,255,255,.14) 0 54%,transparent 54%),
    linear-gradient(90deg,rgba(243,94,96,.36) 0 82%,transparent 82%);
  background-size:100% 6px;
  background-repeat:no-repeat;
  background-position:0 0,0 18px,0 36px;
}

.custom-doc-a{left:8%;top:3%;animation-delay:.18s}
.custom-doc-b{right:2%;top:29%;width:194px;height:242px;animation-delay:.36s}
.custom-doc-c{left:18%;bottom:0;width:164px;height:204px;animation-delay:.54s}

.cooperation-css-scene[data-coop-detail="1"] .cooperation-detail-left{
  background:
    radial-gradient(circle at 32% 34%,rgba(243,94,96,.12),transparent 28%),
    linear-gradient(120deg,rgba(9,10,12,.98),rgba(4,4,5,.98));
}

.cooperation-css-scene[data-coop-detail="1"] .cooperation-detail-right{
  background:
    radial-gradient(circle at 74% 36%,rgba(243,94,96,.22),transparent 34%),
    linear-gradient(135deg,#100204 0%,#4d0d15 48%,#090203 100%);
}

.cooperation-css-scene[data-coop-detail="1"] .cooperation-role-wrap{
  opacity:0 !important;
  visibility:hidden;
}

.cooperation-css-scene[data-coop-detail="1"] .cooperation-detail-arrow{
  opacity:0;
  visibility:hidden;
}

.cooperation-css-scene.is-detail-ready[data-coop-detail="1"] .cooperation-custom-bg{
  opacity:1;
  visibility:visible;
  animation:customBgIn .5s ease both;
}

.cooperation-css-scene.is-detail-ready[data-coop-detail="1"] .cooperation-custom-visual{
  opacity:1;
  visibility:visible;
  animation:customVisualIn .58s ease .12s both;
}

.cooperation-ready-bg{
  position:absolute;
  inset:0;
  z-index:3;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  background:
    radial-gradient(circle at 68% 42%,rgba(243,94,96,.22),transparent 30%),
    radial-gradient(circle at 24% 28%,rgba(255,255,255,.05),transparent 24%),
    linear-gradient(180deg,#050506 0%,#100306 52%,#020202 100%);
  transform:translateZ(0);
  will-change:opacity;
}

.cooperation-ready-bg:before,
.cooperation-ready-bg:after{
  content:"";
  position:absolute;
  inset:-12%;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:76px 76px;
  opacity:.46;
  transform:translate3d(0,0,0);
  animation:readyBgGrid 18s linear infinite;
}

.cooperation-ready-bg:after{
  background:
    radial-gradient(circle,rgba(243,94,96,.32) 0 2px,transparent 3px),
    radial-gradient(circle,rgba(255,255,255,.14) 0 1px,transparent 2px);
  background-size:126px 94px,74px 74px;
  opacity:.25;
  animation:readyBgStars 22s linear infinite;
}

.cooperation-ready-bg i{
  position:absolute;
  display:block;
  width:160px;
  height:218px;
  border:1px solid rgba(243,94,96,.18);
  background:
    linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.018)),
    linear-gradient(135deg,rgba(243,94,96,.14),rgba(0,0,0,.2));
  box-shadow:0 24px 54px rgba(0,0,0,.24),0 0 24px rgba(243,94,96,.08);
  border-radius:12px;
  opacity:.16;
  transform:translate3d(0,0,0) rotate(var(--r)) scale(var(--s));
  animation:readyPosterFloat 8s ease-in-out infinite;
}

.cooperation-ready-bg i:nth-child(1){left:52%;top:12%;--r:-8deg;--s:.86;animation-delay:.1s}
.cooperation-ready-bg i:nth-child(2){left:66%;top:8%;--r:6deg;--s:.78;animation-delay:.4s}
.cooperation-ready-bg i:nth-child(3){left:80%;top:22%;--r:-3deg;--s:.92;animation-delay:.7s}
.cooperation-ready-bg i:nth-child(4){left:55%;top:58%;--r:5deg;--s:.8;animation-delay:1s}
.cooperation-ready-bg i:nth-child(5){left:71%;top:54%;--r:-7deg;--s:.9;animation-delay:1.3s}
.cooperation-ready-bg i:nth-child(6){left:86%;top:50%;--r:4deg;--s:.76;animation-delay:1.6s}

.cooperation-ready-visual{
  position:absolute;
  right:5vw;
  top:15vh;
  z-index:7;
  width:36vw;
  min-width:430px;
  height:60vh;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(54px,0,0) scale(.96);
  will-change:transform,opacity;
}

.ready-card-wall{
  position:absolute;
  inset:0;
  transform-style:preserve-3d;
  perspective:900px;
}

.ready-card-wall i{
  position:absolute;
  width:178px;
  height:248px;
  padding:22px;
  color:#fff;
  font-style:normal;
  border-radius:14px;
  border:1px solid rgba(243,94,96,.3);
  background:
    radial-gradient(circle at 50% 34%,rgba(243,94,96,.22),transparent 36%),
    linear-gradient(160deg,rgba(255,255,255,.08),rgba(18,20,24,.96));
  box-shadow:0 34px 70px rgba(0,0,0,.44),0 0 36px rgba(243,94,96,.12);
  clip-path:polygon(0 0,100% 0,100% 88%,88% 100%,0 100%);
  opacity:0;
  transform:translate3d(0,34px,0) rotateY(-20deg) scale(.92);
  animation:readyCardWallIn .58s ease both,readyCardWallFloat 5s ease-in-out 1.1s infinite;
}

.ready-card-wall i:nth-child(1){left:0;top:8%;animation-delay:.18s}
.ready-card-wall i:nth-child(2){left:34%;top:0;width:194px;height:270px;animation-delay:.34s}
.ready-card-wall i:nth-child(3){right:0;top:15%;animation-delay:.5s}
.ready-card-wall i:nth-child(4){left:28%;bottom:0;width:206px;height:230px;animation-delay:.66s}

.ready-card-wall b{
  display:block;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:36px;
  line-height:1;
}

.ready-card-wall span{
  display:block;
  margin-top:18px;
  color:rgba(255,255,255,.78);
  font-size:18px;
  font-weight:900;
}

.ready-card-wall i:after{
  content:"";
  position:absolute;
  left:22px;
  right:22px;
  bottom:28px;
  height:56px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.18) 0 72%,transparent 72%),
    linear-gradient(90deg,rgba(255,255,255,.12) 0 52%,transparent 52%),
    linear-gradient(90deg,rgba(243,94,96,.34) 0 86%,transparent 86%);
  background-size:100% 7px;
  background-repeat:no-repeat;
  background-position:0 0,0 22px,0 44px;
}

.ready-seal{
  position:absolute;
  right:8%;
  bottom:8%;
  width:148px;
  height:148px;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.9);
  font-family:"Courier New",monospace;
  font-size:16px;
  font-weight:900;
  letter-spacing:2px;
  border:4px solid rgba(243,94,96,.64);
  border-radius:50%;
  box-shadow:0 0 34px rgba(243,94,96,.22),inset 0 0 26px rgba(243,94,96,.12);
  opacity:0;
  transform:scale(.6) rotate(-18deg);
  animation:readySealStamp .54s ease .95s both,readySealPulse 3.4s ease-in-out 1.6s infinite;
}

.cooperation-css-scene[data-coop-detail="2"] .cooperation-detail-left,
.cooperation-css-scene[data-coop-detail="2"] .cooperation-detail-right{
  clip-path:none;
}

.cooperation-css-scene[data-coop-detail="2"] .cooperation-detail-left{
  background:
    radial-gradient(circle at 52% 42%,rgba(243,94,96,.08),transparent 34%),
    linear-gradient(180deg,rgba(8,9,11,.98),rgba(3,3,4,.98));
}

.cooperation-css-scene[data-coop-detail="2"] .cooperation-detail-right{
  opacity:0 !important;
  visibility:hidden;
}

.cooperation-css-scene[data-coop-detail="2"] .cooperation-detail-arrow,
.cooperation-css-scene[data-coop-detail="2"] .cooperation-role-wrap{
  opacity:0 !important;
  visibility:hidden;
}

.cooperation-css-scene.is-detail-ready[data-coop-detail="2"] .cooperation-ready-bg{
  opacity:1;
  visibility:visible;
  animation:readyBgIn .5s ease both;
}

.cooperation-css-scene.is-detail-ready[data-coop-detail="2"] .cooperation-ready-visual{
  opacity:1;
  visibility:visible;
  animation:readyVisualIn .58s ease .12s both;
}

.cooperation-detail-copy{
  position:absolute;
  left:8.2vw;
  top:17vh;
  z-index:5;
  width:50vw;
  min-width:620px;
  height:60vh;
}

.cooperation-detail-copy-slide{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  opacity:0;
  transform:translate3d(76px,0,0);
  pointer-events:none;
  will-change:transform,opacity;
}

.cooperation-detail-copy-slide.is-active{
  opacity:1;
  transform:translate3d(0,0,0);
  pointer-events:auto;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-copy-slide.is-active{
  animation:cooperationDetailTitleIn .45s ease .1s both;
}

.cooperation-detail-copy-slide.is-leaving{
  animation:cooperationDetailTextOut .38s ease both;
}

.cooperation-detail-copy-slide.is-entering{
  animation:cooperationDetailTextIn .38s ease both;
}

.cooperation-detail-copy-slide span{
  display:block;
  color:#f35e60;
  font-size:25px;
  line-height:1;
  font-weight:900;
  letter-spacing:2px;
  margin:0 0 12px;
}

.cooperation-detail-copy-slide strong{
  display:block;
  color:#fff;
  font-size:58px;
  line-height:1;
  font-weight:900;
  letter-spacing:2px;
  text-shadow:0 16px 36px rgba(0,0,0,.52);
}

.cooperation-ui-card{
  width:665px;
  height:374px;
  margin-top:24px;
  overflow:hidden;
  border-radius:0 0 0 0;
  background:rgba(13,28,34,.92);
  box-shadow:0 30px 64px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.12);
  clip-path:polygon(0 0,100% 0,100% 92%,92% 100%,0 100%);
  opacity:0;
  transform:translate3d(0,70px,0);
  will-change:transform,opacity;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-copy-slide.is-active .cooperation-ui-card{
  animation:cooperationUiCardIn .45s ease .25s both;
}

.cooperation-detail-copy-slide[data-coop-slide="0"] > .cooperation-ui-card{
  display:none;
}

.cooperation-detail-copy-slide[data-coop-slide="1"] > .cooperation-ui-card{
  display:none;
}

.cooperation-detail-copy-slide[data-coop-slide="2"] > .cooperation-ui-card{
  display:none;
}

.cooperation-channel-card{
  position:relative;
  width:690px;
  height:386px;
  margin-top:24px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 78% 22%,rgba(243,94,96,.18),transparent 26%),
    linear-gradient(135deg,rgba(15,16,18,.96),rgba(32,7,11,.94));
  border:1px solid rgba(243,94,96,.28);
  box-shadow:0 30px 70px rgba(0,0,0,.58),0 0 42px rgba(243,94,96,.12),inset 0 1px 0 rgba(255,255,255,.1);
  clip-path:polygon(0 0,100% 0,100% 90%,92% 100%,0 100%);
  opacity:0;
  transform:translate3d(0,70px,0);
  will-change:transform,opacity;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-copy-slide.is-active .cooperation-channel-card{
  animation:cooperationUiCardIn .45s ease .25s both;
}

.channel-card-grid{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:42px 42px;
  opacity:.42;
  transform:skewX(-12deg) translate3d(-20px,0,0);
  animation:channelGridMove 10s linear infinite;
}

.channel-card-head{
  position:relative;
  z-index:2;
  height:66px;
  padding:18px 24px 0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:linear-gradient(90deg,rgba(243,94,96,.18),rgba(255,255,255,.025));
}

.channel-card-head b{
  color:#fff;
  font-size:20px;
  line-height:1;
}

.channel-card-head em{
  color:rgba(255,190,194,.72);
  font-style:normal;
  font-family:"Courier New",monospace;
  font-size:12px;
  letter-spacing:2px;
}

.channel-flow{
  position:relative;
  z-index:2;
  width:404px;
  padding:22px 0 0 24px;
  display:grid;
  gap:14px;
}

.channel-flow:before{
  content:"";
  position:absolute;
  left:43px;
  top:42px;
  width:2px;
  height:0;
  background:linear-gradient(180deg,#f35e60,rgba(243,94,96,0));
  box-shadow:0 0 16px rgba(243,94,96,.52);
  animation:channelLineGrow 1.4s ease .48s both;
}

.channel-node{
  position:relative;
  min-height:66px;
  padding:0 0 0 48px;
  opacity:0;
  transform:translate3d(-26px,0,0);
  animation:channelNodeIn .44s ease both;
}

.channel-node.is-node-a{animation-delay:.42s}
.channel-node.is-node-b{animation-delay:.66s}
.channel-node.is-node-c{animation-delay:.9s}

.channel-node i{
  position:absolute;
  left:0;
  top:0;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  color:#fff;
  font-family:"Courier New",monospace;
  font-style:normal;
  font-weight:900;
  font-size:13px;
  border-radius:50%;
  background:rgba(243,94,96,.18);
  border:1px solid rgba(243,94,96,.58);
  box-shadow:0 0 20px rgba(243,94,96,.28),inset 0 0 16px rgba(243,94,96,.12);
}

.channel-node b{
  display:block;
  color:#fff;
  font-size:18px;
  line-height:1;
  margin-bottom:8px;
}

.channel-node span{
  display:block;
  margin:0;
  color:rgba(255,255,255,.66);
  font-size:13px;
  line-height:1.45;
  font-weight:700;
  letter-spacing:0;
}

.channel-data-visual{
  position:absolute;
  z-index:2;
  right:30px;
  top:96px;
  width:210px;
  height:244px;
}

.channel-ratio-orbit{
  position:relative;
  width:172px;
  height:172px;
  margin:0 auto;
  display:grid;
  place-items:center;
  text-align:center;
  border-radius:50%;
  background:
    radial-gradient(circle at center,#15171a 0 47%,transparent 48%),
    conic-gradient(from -90deg,#f35e60 0 72%,rgba(255,255,255,.1) 72% 100%);
  box-shadow:0 0 34px rgba(243,94,96,.18);
  opacity:0;
  transform:scale(.82) rotate(-18deg);
  animation:channelOrbitIn .58s ease .56s both,channelOrbitPulse 3s ease-in-out 1.2s infinite;
}

.channel-ratio-orbit:before,
.channel-ratio-orbit:after{
  content:"";
  position:absolute;
  inset:13px;
  border-radius:50%;
  border:1px dashed rgba(255,255,255,.18);
  animation:channelOrbitRotate 9s linear infinite;
}

.channel-ratio-orbit:after{
  inset:-8px;
  border-color:rgba(243,94,96,.22);
  animation-direction:reverse;
  animation-duration:13s;
}

.channel-ratio-orbit span,
.channel-ratio-orbit b{
  position:absolute;
  z-index:2;
  display:block;
}

.channel-ratio-orbit span{
  margin:0;
  transform:translateY(-20px);
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:15px;
  font-weight:900;
  letter-spacing:2px;
}

.channel-ratio-orbit b{
  transform:translateY(24px);
  color:rgba(255,255,255,.86);
  font-size:18px;
}

.channel-bars{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  display:grid;
  gap:9px;
}

.channel-bars i{
  position:relative;
  height:8px;
  overflow:hidden;
  border-radius:99px;
  background:rgba(255,255,255,.1);
}

.channel-bars i:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:var(--bar);
  border-radius:inherit;
  background:linear-gradient(90deg,rgba(243,94,96,.35),#f35e60);
  transform:scaleX(0);
  transform-origin:left;
  animation:channelBarGrow .7s ease both;
}

.channel-bars i:nth-child(1):before{animation-delay:.86s}
.channel-bars i:nth-child(2):before{animation-delay:1s}
.channel-bars i:nth-child(3):before{animation-delay:1.14s}

.channel-bars span{
  position:absolute;
  right:0;
  top:-18px;
  margin:0;
  color:rgba(255,255,255,.56);
  font-size:11px;
  font-style:normal;
  font-weight:700;
  letter-spacing:0;
}

.cooperation-custom-card{
  position:relative;
  width:710px;
  height:386px;
  margin-top:24px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 84% 20%,rgba(243,94,96,.16),transparent 25%),
    linear-gradient(135deg,rgba(12,14,17,.97),rgba(42,7,12,.92));
  border:1px solid rgba(243,94,96,.28);
  box-shadow:0 30px 70px rgba(0,0,0,.58),0 0 42px rgba(243,94,96,.11),inset 0 1px 0 rgba(255,255,255,.1);
  clip-path:polygon(0 0,100% 0,100% 90%,92% 100%,0 100%);
  opacity:0;
  transform:translate3d(0,70px,0);
  will-change:transform,opacity;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-copy-slide.is-active .cooperation-custom-card{
  animation:cooperationUiCardIn .45s ease .25s both;
}

.custom-card-scan{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(115deg,transparent 0 46%,rgba(243,94,96,.12) 47%,transparent 52%);
  background-size:44px 44px,44px 44px,100% 100%;
  opacity:.48;
  animation:customCardScan 8s linear infinite;
}

.custom-card-head{
  position:relative;
  z-index:2;
  height:66px;
  padding:18px 24px 0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:linear-gradient(90deg,rgba(243,94,96,.18),rgba(255,255,255,.025));
}

.custom-card-head b{
  color:#fff;
  font-size:20px;
  line-height:1;
}

.custom-card-head em{
  color:rgba(255,190,194,.72);
  font-style:normal;
  font-family:"Courier New",monospace;
  font-size:12px;
  letter-spacing:2px;
}

.custom-dev-flow{
  position:relative;
  z-index:2;
  width:410px;
  padding:24px 0 0 24px;
  display:grid;
  gap:14px;
}

.custom-dev-flow:before{
  content:"";
  position:absolute;
  left:43px;
  top:44px;
  width:2px;
  height:0;
  background:linear-gradient(180deg,#f35e60,rgba(243,94,96,0));
  box-shadow:0 0 16px rgba(243,94,96,.52);
  animation:customDevLineGrow 1.36s ease .44s both;
}

.custom-dev-node{
  position:relative;
  min-height:66px;
  padding-left:50px;
  opacity:0;
  transform:translate3d(-24px,0,0);
  animation:customDevNodeIn .44s ease both;
}

.custom-dev-node.is-dev-a{animation-delay:.38s}
.custom-dev-node.is-dev-b{animation-delay:.62s}
.custom-dev-node.is-dev-c{animation-delay:.86s}

.custom-dev-node i{
  position:absolute;
  left:0;
  top:0;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  color:#fff;
  font-family:"Courier New",monospace;
  font-style:normal;
  font-weight:900;
  font-size:13px;
  border-radius:10px;
  background:linear-gradient(135deg,rgba(243,94,96,.28),rgba(255,255,255,.05));
  border:1px solid rgba(243,94,96,.54);
  box-shadow:0 0 20px rgba(243,94,96,.24),inset 0 0 16px rgba(243,94,96,.1);
}

.custom-dev-node b{
  display:block;
  color:#fff;
  font-size:18px;
  line-height:1;
  margin-bottom:8px;
}

.custom-dev-node span{
  display:block;
  margin:0;
  color:rgba(255,255,255,.66);
  font-size:13px;
  line-height:1.45;
  font-weight:700;
  letter-spacing:0;
}

.custom-license-panel{
  position:absolute;
  z-index:2;
  right:26px;
  top:88px;
  width:226px;
  height:254px;
  padding:18px 18px 0;
  border:1px solid rgba(243,94,96,.24);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));
  box-shadow:inset 0 0 28px rgba(243,94,96,.06);
  clip-path:polygon(0 0,100% 0,100% 88%,88% 100%,0 100%);
  opacity:0;
  transform:translate3d(36px,0,0);
  animation:customLicenseIn .5s ease .56s both;
}

.license-ring{
  position:relative;
  width:132px;
  height:132px;
  margin:0 auto 16px;
  display:grid;
  place-items:center;
  text-align:center;
  border-radius:50%;
  background:
    radial-gradient(circle at center,#111416 0 48%,transparent 49%),
    conic-gradient(from -90deg,#f35e60 0 68%,rgba(255,255,255,.1) 68% 100%);
  box-shadow:0 0 34px rgba(243,94,96,.16);
  animation:customLicensePulse 3s ease-in-out infinite;
}

.license-ring:before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
  border:1px dashed rgba(243,94,96,.25);
  animation:customLicenseSpin 9s linear infinite;
}

.license-ring span,
.license-ring b{
  position:absolute;
  display:block;
  z-index:2;
}

.license-ring span{
  transform:translateY(-18px);
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:14px;
  font-weight:900;
  letter-spacing:2px;
}

.license-ring b{
  transform:translateY(20px);
  width:110px;
  color:rgba(255,255,255,.86);
  font-size:15px;
}

.custom-license-panel ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}

.custom-license-panel li{
  position:relative;
  height:22px;
  padding-left:18px;
  color:rgba(255,255,255,.68);
  font-size:13px;
  line-height:22px;
  font-weight:800;
  opacity:0;
  transform:translate3d(18px,0,0);
  animation:customLicenseItemIn .34s ease both;
}

.custom-license-panel li:before{
  content:"";
  position:absolute;
  left:0;
  top:8px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#f35e60;
  box-shadow:0 0 12px rgba(243,94,96,.62);
}

.custom-license-panel li:nth-child(1){animation-delay:.86s}
.custom-license-panel li:nth-child(2){animation-delay:.98s}
.custom-license-panel li:nth-child(3){animation-delay:1.1s}
.custom-license-panel li:nth-child(4){animation-delay:1.22s}

.custom-blueprint-head{
  position:relative;
  z-index:2;
  height:64px;
  padding:17px 24px 0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(243,94,96,.13),rgba(255,255,255,.02));
}

.custom-blueprint-head b{
  color:#fff;
  font-family:"Courier New",monospace;
  font-size:20px;
  line-height:1;
  letter-spacing:2px;
}

.custom-blueprint-head em{
  color:rgba(255,210,214,.76);
  font-style:normal;
  font-size:13px;
  font-weight:900;
  letter-spacing:1px;
}

.custom-blueprint-layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.14fr .86fr;
  gap:18px;
  height:322px;
  padding:20px 22px 22px;
}

.custom-build-board,
.custom-license-terminal{
  position:relative;
  overflow:hidden;
  min-width:0;
  border:1px solid rgba(243,94,96,.24);
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(0,0,0,.24));
  box-shadow:inset 0 0 34px rgba(243,94,96,.055),0 18px 42px rgba(0,0,0,.22);
  clip-path:polygon(0 0,100% 0,100% 88%,92% 100%,0 100%);
}

.custom-build-board:before,
.custom-license-terminal:before{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:34px 34px;
  opacity:.7;
  transform:translate3d(0,0,0);
  animation:customBlueprintGrid 12s linear infinite;
}

.build-board-title{
  position:relative;
  z-index:2;
  padding:18px 18px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.build-board-title span{
  display:block;
  margin:0;
  color:#fff;
  font-size:21px;
  line-height:1;
  font-weight:900;
  letter-spacing:0;
}

.build-board-title b{
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:12px;
  letter-spacing:2px;
}

.build-module-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  padding:20px 18px 0;
}

.build-module-grid i{
  position:relative;
  height:62px;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.86);
  font-style:normal;
  font-size:14px;
  font-weight:900;
  border:1px solid rgba(243,94,96,.22);
  background:linear-gradient(135deg,rgba(243,94,96,.16),rgba(255,255,255,.035));
  box-shadow:inset 0 0 18px rgba(243,94,96,.055);
  clip-path:polygon(0 0,88% 0,100% 22%,100% 100%,12% 100%,0 78%);
  opacity:0;
  transform:translate3d(0,22px,0) scale(.94);
  animation:buildModuleIn .42s ease both;
}

.build-module-grid i:nth-child(1){animation-delay:.34s}
.build-module-grid i:nth-child(2){animation-delay:.44s}
.build-module-grid i:nth-child(3){animation-delay:.54s}
.build-module-grid i:nth-child(4){animation-delay:.64s}
.build-module-grid i:nth-child(5){animation-delay:.74s}
.build-module-grid i:nth-child(6){animation-delay:.84s}

.build-module-grid i:after{
  content:"";
  position:absolute;
  left:-40%;
  top:0;
  width:40%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);
  transform:skewX(-18deg);
  animation:buildModuleSweep 3.6s ease-in-out infinite;
}

.build-progress{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  padding-top:20px;
}

.build-progress:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:7px;
  height:3px;
  border-radius:99px;
  background:rgba(255,255,255,.12);
}

.build-progress em{
  position:absolute;
  left:0;
  top:7px;
  width:0;
  height:3px;
  border-radius:99px;
  background:linear-gradient(90deg,#f35e60,#ff9da0);
  box-shadow:0 0 18px rgba(243,94,96,.42);
  animation:buildProgressRun 2.8s ease .75s infinite;
}

.build-progress span{
  position:relative;
  margin:0;
  color:rgba(255,255,255,.7);
  font-size:12px;
  line-height:1;
  font-weight:900;
  letter-spacing:0;
  text-align:center;
}

.build-progress span:before{
  content:"";
  position:absolute;
  left:50%;
  top:-18px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#f35e60;
  box-shadow:0 0 14px rgba(243,94,96,.55);
  transform:translateX(-50%);
}

.custom-license-terminal{
  padding:18px;
}

.terminal-screen{
  position:relative;
  z-index:2;
  min-height:116px;
  padding:18px;
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(135deg,rgba(0,0,0,.34),rgba(243,94,96,.1));
  clip-path:polygon(0 0,100% 0,100% 82%,88% 100%,0 100%);
  opacity:0;
  transform:translate3d(34px,0,0);
  animation:terminalScreenIn .46s ease .36s both;
}

.terminal-screen span{
  margin:0;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:2px;
}

.terminal-screen b{
  display:block;
  margin:10px 0 8px;
  color:#fff;
  font-size:22px;
  line-height:1;
}

.terminal-screen p{
  margin:0;
  color:rgba(255,255,255,.66);
  font-size:13px;
  line-height:1.45;
  font-weight:700;
}

.license-doc-stack{
  position:relative;
  z-index:2;
  margin-top:14px;
  display:grid;
  gap:9px;
}

.license-doc-stack i{
  position:relative;
  height:34px;
  padding:0 14px;
  display:flex;
  align-items:center;
  gap:12px;
  color:#fff;
  font-style:normal;
  border:1px solid rgba(243,94,96,.2);
  background:rgba(255,255,255,.045);
  transform:translate3d(42px,0,0);
  opacity:0;
  animation:licenseDocSlideIn .36s ease both;
}

.license-doc-stack i:nth-child(1){animation-delay:.6s}
.license-doc-stack i:nth-child(2){animation-delay:.74s}
.license-doc-stack i:nth-child(3){animation-delay:.88s}
.license-doc-stack i:nth-child(4){animation-delay:1.02s}

.license-doc-stack i b{
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:13px;
}

.license-doc-stack i span{
  margin:0;
  color:rgba(255,255,255,.76);
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:0;
}

.cooperation-ready-card{
  position:relative;
  width:710px;
  height:386px;
  margin-top:24px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 54% 30%,rgba(243,94,96,.12),transparent 30%),
    linear-gradient(135deg,rgba(11,12,15,.98),rgba(28,5,9,.92));
  border:1px solid rgba(243,94,96,.26);
  box-shadow:0 30px 70px rgba(0,0,0,.58),0 0 42px rgba(243,94,96,.1),inset 0 1px 0 rgba(255,255,255,.1);
  clip-path:polygon(0 0,100% 0,100% 90%,92% 100%,0 100%);
  opacity:0;
  transform:translate3d(0,70px,0);
  will-change:transform,opacity;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-copy-slide.is-active .cooperation-ready-card{
  animation:cooperationUiCardIn .45s ease .25s both;
}

.ready-card-scan{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.028) 1px,transparent 1px),
    radial-gradient(circle at 42% 42%,rgba(243,94,96,.14),transparent 34%);
  background-size:48px 48px,48px 48px,100% 100%;
  opacity:.5;
  animation:readyCardScan 12s linear infinite;
}

.ready-card-head{
  position:relative;
  z-index:2;
  height:66px;
  padding:18px 24px 0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:linear-gradient(90deg,rgba(243,94,96,.16),rgba(255,255,255,.025));
}

.ready-card-head b{
  color:#fff;
  font-size:20px;
  line-height:1;
}

.ready-card-head em{
  color:rgba(255,190,194,.72);
  font-style:normal;
  font-family:"Courier New",monospace;
  font-size:12px;
  letter-spacing:2px;
}

.ready-product-stage{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:18px;
  height:320px;
  padding:20px 22px 22px;
}

.ready-product-preview,
.ready-license-stack{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(243,94,96,.22);
  background:linear-gradient(135deg,rgba(255,255,255,.05),rgba(0,0,0,.26));
  box-shadow:inset 0 0 28px rgba(243,94,96,.055);
  border-radius:14px;
}

.ready-screen{
  position:relative;
  height:158px;
  padding:22px;
  background:
    radial-gradient(circle at 76% 20%,rgba(243,94,96,.18),transparent 34%),
    linear-gradient(135deg,rgba(9,10,13,.82),rgba(38,8,13,.68));
  border-bottom:1px solid rgba(255,255,255,.08);
  opacity:0;
  transform:translate3d(0,22px,0);
  animation:readyScreenIn .45s ease .38s both;
}

.ready-screen span{
  margin:0;
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:2px;
}

.ready-screen b{
  display:block;
  margin:12px 0 10px;
  color:#fff;
  font-size:26px;
  line-height:1;
}

.ready-screen p{
  margin:0;
  max-width:280px;
  color:rgba(255,255,255,.68);
  font-size:13px;
  line-height:1.5;
  font-weight:700;
}

.ready-mini-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  padding:16px;
}

.ready-mini-list i{
  height:40px;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.8);
  font-size:13px;
  font-style:normal;
  font-weight:900;
  border:1px solid rgba(243,94,96,.18);
  background:rgba(255,255,255,.045);
  transform:translate3d(0,18px,0);
  opacity:0;
  animation:readyMiniIn .34s ease both;
}

.ready-mini-list i:nth-child(1){animation-delay:.58s}
.ready-mini-list i:nth-child(2){animation-delay:.7s}
.ready-mini-list i:nth-child(3){animation-delay:.82s}
.ready-mini-list i:nth-child(4){animation-delay:.94s}

.ready-license-stack{
  padding:20px;
}

.ready-license-title{
  color:#fff;
  font-size:22px;
  line-height:1;
  font-weight:900;
  margin-bottom:17px;
}

.ready-license-stack ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:11px;
}

.ready-license-stack li{
  height:42px;
  padding:0 14px;
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid rgba(243,94,96,.2);
  background:rgba(255,255,255,.045);
  transform:translate3d(38px,0,0);
  opacity:0;
  animation:readyLicenseItemIn .36s ease both;
}

.ready-license-stack li:nth-child(1){animation-delay:.46s}
.ready-license-stack li:nth-child(2){animation-delay:.6s}
.ready-license-stack li:nth-child(3){animation-delay:.74s}
.ready-license-stack li:nth-child(4){animation-delay:.88s}

.ready-license-stack li b{
  color:#f35e60;
  font-family:"Courier New",monospace;
  font-size:14px;
}

.ready-license-stack li span{
  margin:0;
  color:rgba(255,255,255,.78);
  font-size:14px;
  line-height:1;
  font-weight:900;
  letter-spacing:0;
}

.cooperation-ui-bar{
  height:42px;
  padding:0 18px;
  display:flex;
  align-items:center;
  gap:14px;
  color:#dfefff;
  font-size:14px;
  font-weight:900;
  background:linear-gradient(90deg,rgba(31,58,68,.96),rgba(12,26,33,.94));
}

.cooperation-ui-bar b{
  display:inline-grid;
  place-items:center;
  min-width:28px;
  height:20px;
  color:#eaffff;
  font-size:11px;
  border-radius:3px;
  background:rgba(255,255,255,.14);
}

.cooperation-ui-body{
  display:grid;
  grid-template-columns:134px 1fr;
  height:332px;
}

.cooperation-ui-body ul{
  list-style:none;
  margin:0;
  padding:10px 0;
  background:rgba(20,45,52,.72);
}

.cooperation-ui-body li{
  height:34px;
  padding:0 14px;
  display:flex;
  align-items:center;
  color:#dbe9e8;
  font-size:13px;
  font-weight:900;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.cooperation-ui-body li.active{
  color:#143734;
  background:#65dec9;
}

.cooperation-ui-preview{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 44%,rgba(155,235,255,.52),transparent 17%),
    linear-gradient(135deg,#bfb4a7 0%,#7e8d93 42%,#1f2d34 100%);
}

.cooperation-ui-preview.alt{
  background:
    radial-gradient(circle at 55% 44%,rgba(255,208,100,.46),transparent 18%),
    linear-gradient(135deg,#5d466f 0%,#283447 48%,#d6842c 100%);
}

.cooperation-ui-preview.ai{
  background:
    radial-gradient(circle at 55% 44%,rgba(92,244,255,.48),transparent 18%),
    linear-gradient(135deg,#173d4a 0%,#121927 44%,#7c42c7 100%);
}

.cooperation-ui-preview i{
  position:absolute;
  display:block;
  background:rgba(255,255,255,.28);
  transform:skewX(-18deg);
}

.cooperation-ui-preview i:nth-child(1){left:12%;top:18%;width:58%;height:4px}
.cooperation-ui-preview i:nth-child(2){left:18%;top:38%;width:42%;height:90px;background:rgba(255,255,255,.18)}
.cooperation-ui-preview i:nth-child(3){right:14%;top:20%;width:18%;height:160px;background:rgba(0,0,0,.24)}
.cooperation-ui-preview i:nth-child(4){left:42%;bottom:18%;width:34%;height:6px;background:#61e7d9}

.cooperation-role-wrap{
  position:absolute;
  right:5.5vw;
  bottom:0;
  z-index:6;
  width:31vw;
  min-width:360px;
  height:88vh;
  opacity:0;
  transform:translate3d(0,0,0) scale(.92);
  pointer-events:none;
  will-change:transform,opacity;
}

.cooperation-css-scene.is-detail-ready .cooperation-role-wrap{
  animation:cooperationRoleWrapIn .45s ease both;
}

.cooperation-role{
  position:absolute;
  left:50%;
  bottom:-2vh;
  width:310px;
  height:610px;
  opacity:0;
  transform:translate3d(90px,0,0) translateX(-50%) scale(.98);
  transform-origin:50% 100%;
  will-change:transform,opacity;
}

.cooperation-role.is-active{
  opacity:1;
  transform:translate3d(0,0,0) translateX(-50%) scale(1);
  animation:cooperationRoleBreath 4.6s ease-in-out infinite;
}

.cooperation-role.is-leaving{
  animation:cooperationRoleOut .38s ease both;
}

.cooperation-role.is-entering{
  animation:cooperationRoleIn .38s ease both,cooperationRoleBreath 4.6s ease-in-out .38s infinite;
}

.cooperation-role i{
  position:absolute;
  display:block;
}

.role-head{
  left:104px;
  top:30px;
  width:96px;
  height:118px;
  clip-path:polygon(20% 0,86% 12%,100% 70%,58% 100%,12% 78%,0 24%);
  background:linear-gradient(135deg,#f5d2a0,#9d5f2b);
  box-shadow:0 0 0 9px rgba(255,255,255,.86);
}

.role-head:before{
  content:"";
  position:absolute;
  left:8px;
  right:8px;
  top:34px;
  height:18px;
  background:#20242a;
  transform:skewX(-13deg);
}

.role-body{
  left:56px;
  top:128px;
  width:206px;
  height:360px;
  clip-path:polygon(24% 0,78% 0,100% 44%,84% 100%,18% 100%,0 42%);
  background:linear-gradient(135deg,#f2d19b 0%,#c69454 33%,#282626 34%,#171719 100%);
  box-shadow:0 0 0 12px rgba(255,255,255,.86);
}

.role-arm{
  top:210px;
  width:80px;
  height:250px;
  background:linear-gradient(160deg,#ecd2a3,#5b4634 55%,#191b20);
  clip-path:polygon(22% 0,100% 6%,82% 100%,0 92%);
}

.role-arm-l{left:12px;transform:rotate(14deg)}
.role-arm-r{right:6px;transform:rotate(-12deg)}

.cooperation-role-2 .role-head{background:linear-gradient(135deg,#ffd79b,#7745b0)}
.cooperation-role-2 .role-body{background:linear-gradient(135deg,#f4ce8d 0%,#865ec9 36%,#1a1825 37%,#111 100%)}
.cooperation-role-3 .role-head{background:linear-gradient(135deg,#bdeeff,#7e5830)}
.cooperation-role-3 .role-body{background:linear-gradient(135deg,#d9f8ff 0%,#2b7786 36%,#17191e 37%,#0a0b0d 100%)}

.cooperation-detail-pager{
  position:absolute;
  left:0;
  right:0;
  bottom:15px;
  z-index:8;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  height:98px;
  border-top:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,rgba(8,9,11,.98),rgba(2,2,3,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  opacity:0;
  transform:translate3d(0,22px,0);
  will-change:transform,opacity;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-pager{
  animation:cooperationPagerIn .35s ease .42s both;
}

.cooperation-css-scene.is-detail-ready .cooperation-detail-pager{
  opacity:1 !important;
  transform:translate3d(0,0,0) !important;
}

.cooperation-detail-pager button{
  appearance:none;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  --pager-active:0;
  --pager-scale:.8;
  --pager-color:#f4f4f4;
  border:0;
  border-right:1px solid rgba(255,255,255,.1);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:0;
  padding:0 0 14px;
  box-sizing:border-box;
  color:var(--pager-color) !important;
  background:rgba(0,0,0,.18);
  cursor:pointer;
  transition:none;
  will-change:transform,opacity;
}

.cooperation-detail-pager button:before{
  content:"";
  position:absolute;
  inset:16px 42px 22px;
  z-index:1;
  opacity:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(243,94,96,.22),rgba(243,94,96,.08));
  clip-path:polygon(9% 0,100% 0,91% 100%,0 100%);
  box-shadow:0 0 24px rgba(243,94,96,.2),inset 0 0 18px rgba(255,255,255,.04);
  transform:translate3d(-14px,0,0) skewX(-10deg);
  transition:opacity .22s ease,transform .22s ease;
}

.cooperation-detail-pager button:hover:before,
.cooperation-detail-pager button:focus-visible:before{
  opacity:1;
  transform:translate3d(0,0,0) skewX(-10deg);
}

.cooperation-detail-pager button:after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-22px;
  width:310px;
  height:76px;
  opacity:var(--pager-active) !important;
  border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(243,94,96,.62) 0%,rgba(243,94,96,.28) 32%,rgba(243,94,96,.08) 54%,transparent 76%);
  transform:translate3d(-50%,0,0) scale(var(--pager-scale));
  transition:none;
  pointer-events:none;
  z-index:0;
}

.cooperation-detail-pager button:last-child{
  border-right:0;
}

.cooperation-detail-pager b,
.cooperation-detail-pager .pager-num{
  position:relative;
  z-index:4;
  display:block;
  opacity:1 !important;
  visibility:visible !important;
  color:var(--pager-color) !important;
  font-size:22px;
  line-height:1;
  font-family:"Courier New",monospace;
  font-weight:900;
  letter-spacing:1px;
  text-shadow:0 0 12px rgba(0,0,0,.7);
}

.cooperation-detail-pager span,
.cooperation-detail-pager .pager-label{
  position:relative;
  z-index:4;
  display:block;
  width:100%;
  min-height:18px;
  opacity:1 !important;
  visibility:visible !important;
  color:var(--pager-color) !important;
  font-size:16px;
  line-height:1;
  font-weight:900;
  text-align:center;
  white-space:nowrap;
  overflow:visible;
  transform:translate3d(0,0,0);
  text-shadow:0 0 12px rgba(0,0,0,.72);
}

.cooperation-detail-pager button.is-active{
  color:#f35e60;
}

.cooperation-detail-pager button:hover,
.cooperation-detail-pager button:focus-visible{
  color:#f35e60 !important;
}

.cooperation-detail-pager button.is-active b,
.cooperation-detail-pager button.is-active span,
.cooperation-detail-pager button:hover b,
.cooperation-detail-pager button:hover span,
.cooperation-detail-pager button:focus-visible b,
.cooperation-detail-pager button:focus-visible span{
  color:#f35e60 !important;
  text-shadow:0 0 14px rgba(243,94,96,.38);
}

.cooperation-detail-pager button.is-active:after{
  opacity:1;
  transform:translate3d(-50%,0,0) scale(1);
}

.cooperation-detail-pager[data-active-page="0"] button:nth-child(1),
.cooperation-detail-pager[data-active-page="1"] button:nth-child(2),
.cooperation-detail-pager[data-active-page="2"] button:nth-child(3){
  color:#f35e60;
}

.cooperation-detail-pager[data-active-page="0"] button:nth-child(1) b,
.cooperation-detail-pager[data-active-page="0"] button:nth-child(1) span,
.cooperation-detail-pager[data-active-page="1"] button:nth-child(2) b,
.cooperation-detail-pager[data-active-page="1"] button:nth-child(2) span,
.cooperation-detail-pager[data-active-page="2"] button:nth-child(3) b,
.cooperation-detail-pager[data-active-page="2"] button:nth-child(3) span{
  color:#f35e60;
}

.cooperation-detail-pager[data-active-page="0"] button:nth-child(1) .pager-label{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  color:#f35e60 !important;
}

.cooperation-detail-pager[data-active-page="0"] button:nth-child(1):after,
.cooperation-detail-pager[data-active-page="1"] button:nth-child(2):after,
.cooperation-detail-pager[data-active-page="2"] button:nth-child(3):after{
  opacity:1;
  transform:translate3d(-50%,0,0) scale(1);
}

.fullscreen-qualification:before,
.fullscreen-qualification:after{
  display:none;
}

.fullscreen-qualification{
  background:#020304;
}

.qualification-scene{
  position:absolute;
  inset:0;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 54%,rgba(243,94,96,.13),transparent 36%),
    linear-gradient(180deg,#030304 0%,#080305 52%,#020203 100%);
}

.qualification-scene:before,
.qualification-scene:after{
  content:"";
  position:absolute;
  inset:-18%;
  z-index:1;
  pointer-events:none;
  will-change:transform,opacity;
}

.qualification-scene:before{
  background:
    radial-gradient(circle at 20% 72%,rgba(243,94,96,.2),transparent 19%),
    radial-gradient(circle at 82% 22%,rgba(243,94,96,.16),transparent 24%),
    radial-gradient(circle at 52% 50%,rgba(243,94,96,.1),transparent 32%);
  mix-blend-mode:screen;
  opacity:.78;
  animation:qualificationRedAura 9s ease-in-out infinite alternate;
}

.qualification-scene:after{
  background:
    linear-gradient(90deg,transparent 0 49%,rgba(243,94,96,.13) 50%,transparent 51%),
    linear-gradient(0deg,transparent 0 49%,rgba(243,94,96,.08) 50%,transparent 51%);
  background-size:78px 78px;
  opacity:.22;
  transform:skewX(-14deg);
  animation:qualificationGridDrift 14s linear infinite;
}

.qualification-svg-bg{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
}

.qualification-base{
  fill:#020304;
}

.qualification-grid-lines{
  fill:none;
  stroke:rgba(243,94,96,.2);
  stroke-width:1;
  opacity:.52;
}

.qualification-soft-glow{
  fill:url(#qualificationGlow);
  opacity:.82;
  transform-box:fill-box;
  transform-origin:center;
  will-change:opacity,transform;
  animation:qualificationPulseGlow 4.8s ease-in-out infinite;
}

.qualification-card-bg{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
}

.qualification-card-bg:before{
  content:"";
  position:absolute;
  left:50%;
  top:58%;
  width:720px;
  height:720px;
  border-radius:50%;
  border:1px solid rgba(243,94,96,.18);
  background:
    radial-gradient(circle,rgba(243,94,96,.16),transparent 45%),
    conic-gradient(from 0deg,transparent 0 12%,rgba(243,94,96,.26) 13% 14%,transparent 15% 35%,rgba(243,94,96,.18) 36% 37%,transparent 38% 100%);
  transform:translate(-50%,-50%);
  filter:none;
  animation:qualificationCardHaloSpin 22s linear infinite;
}

.qualification-card-bg:after{
  content:"";
  position:absolute;
  left:50%;
  top:58%;
  width:420px;
  height:420px;
  border-radius:50%;
  border:1px dashed rgba(243,94,96,.26);
  transform:translate(-50%,-50%);
  animation:qualificationCardHaloSpin 14s linear infinite reverse;
}

.qualification-card-bg span{
  position:absolute;
  left:var(--x);
  top:var(--y);
  width:118px;
  height:164px;
  border-radius:16px;
  border:1px solid rgba(243,94,96,.24);
  background:
    linear-gradient(145deg,rgba(243,94,96,.18),rgba(7,3,5,.62)),
    repeating-linear-gradient(135deg,rgba(255,255,255,.055) 0 2px,transparent 2px 12px);
  box-shadow:0 20px 54px rgba(0,0,0,.28),0 0 34px rgba(243,94,96,.1),inset 0 1px 0 rgba(255,255,255,.08);
  opacity:.18;
  transform:translate(-50%,-50%) rotate(var(--r)) scale(var(--s));
  clip-path:polygon(0 0,100% 0,100% 92%,88% 100%,0 100%);
  animation:qualificationBgCardFloat 8.5s ease-in-out var(--d) infinite;
  will-change:transform,opacity,filter;
}

.qualification-title{
  position:absolute;
  left:50%;
  top:100px;
  z-index:2;
  width:min(820px,70vw);
  text-align:center;
  transform:translateX(-50%);
}

.qualification-title h1,
.qualification-title p{
  opacity:0;
  transform:translate3d(0,24px,0);
  filter:none;
  will-change:transform,opacity,filter;
}

.qualification-title h1{
  margin:0;
  color:rgba(255,255,255,.86);
  font-size:72px;
  line-height:1;
  font-weight:900;
  letter-spacing:6px;
  text-shadow:0 18px 44px rgba(0,0,0,.52),0 0 34px rgba(243,94,96,.24);
}

.qualification-title p{
  margin:72px 0 0;
  color:rgba(255,255,255,.54);
  font-size:38px;
  line-height:1;
  font-weight:900;
  letter-spacing:2px;
  text-shadow:0 12px 34px rgba(0,0,0,.46);
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .qualification-title h1{
  animation:qualificationTextIn .48s ease .22s both;
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .qualification-title p{
  animation:qualificationTextIn .48s ease .34s both;
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-ready .qualification-title h1,
.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-ready .qualification-title p{
  opacity:1;
  transform:translate3d(0,0,0);
  filter:none;
}

.hero-tab-panel[data-panel="qualification"].is-active:not(.is-qualification-running) .qualification-title h1,
.hero-tab-panel[data-panel="qualification"].is-active:not(.is-qualification-running) .qualification-title p{
  opacity:1;
  transform:translate3d(0,0,0);
  filter:none;
}

.qualification-card-stage{
  position:absolute;
  left:50%;
  bottom:179px;
  z-index:4;
  width:1180px;
  height:610px;
  --drag-x:0px;
  transform:translateX(-50%);
  perspective:1200px;
  pointer-events:auto;
  cursor:grab;
  user-select:none;
  touch-action:pan-y;
}

.qualification-card-stage.is-dragging{
  cursor:grabbing;
}

.qualification-deck{
  position:absolute;
  left:50%;
  top:auto;
  bottom:18px;
  z-index:3;
  width:148px;
  height:204px;
  transform:translateX(-50%) rotate(-6deg);
  opacity:0;
  will-change:transform,opacity,filter;
}

.qualification-deck b{
  position:absolute;
  left:50%;
  top:calc(100% + 16px);
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:max-content;
  height:30px;
  padding:0 12px;
  color:rgba(255,232,235,.8);
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:1px;
  border:1px solid rgba(243,94,96,.3);
  border-radius:999px;
  background:rgba(0,0,0,.32);
  transform:translateX(-50%);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}

.qualification-deck em{
  color:#f35e60;
  font-style:normal;
  font-family:"Courier New",monospace;
}

.qualification-deck span{
  position:absolute;
  inset:0;
  border-radius:16px;
  border:1px solid rgba(243,94,96,.34);
  background:
    linear-gradient(145deg,rgba(243,94,96,.36),rgba(18,5,7,.96)),
    repeating-linear-gradient(135deg,rgba(255,255,255,.08) 0 2px,transparent 2px 10px);
  box-shadow:0 24px 48px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.16);
}

.qualification-deck span:nth-child(1){
  transform:translate(-12px,14px) rotate(-7deg);
}

.qualification-deck span:nth-child(2){
  transform:translate(0,6px) rotate(2deg);
}

.qualification-deck span:nth-child(3){
  transform:translate(12px,-4px) rotate(8deg);
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .qualification-deck{
  animation:qualificationDeckIn .38s ease .12s both,qualificationDeckPulse .9s ease .42s 2;
}

.qualification-card{
  position:absolute;
  left:50%;
  top:50%;
  z-index:5;
  width:136px;
  margin:0;
  opacity:0;
  transform:translate3d(-50%,calc(-50% + 248px),0) rotate(-18deg) scale(.42) rotateY(68deg);
  filter:none;
  transform-origin:center;
  pointer-events:none;
  transition:transform .62s cubic-bezier(.16,.82,.22,1),opacity .42s ease,filter .42s ease;
  will-change:transform,opacity,filter;
}

.qualification-card:before{
  content:"";
  position:absolute;
  left:-10px;
  right:-10px;
  top:-10px;
  height:190px;
  z-index:-1;
  border-radius:20px;
  background:linear-gradient(135deg,rgba(243,94,96,.24),rgba(255,255,255,.05));
  box-shadow:0 24px 54px rgba(0,0,0,.42),0 0 34px rgba(243,94,96,.18);
  opacity:.9;
}

.qualification-card img{
  display:block;
  width:136px;
  height:184px;
  object-fit:contain;
  object-position:center;
  border-radius:16px;
  border:1px solid rgba(243,94,96,.42);
  background:rgba(255,255,255,.92);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
  clip-path:polygon(0 0,100% 0,100% 92%,88% 100%,0 100%);
  transition:transform .28s ease,filter .28s ease;
  pointer-events:none;
  user-select:none;
  -webkit-user-drag:none;
}

.qualification-card figcaption{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:32px;
  margin-top:10px;
  padding:0 10px;
  color:rgba(255,232,235,.94);
  font-size:15px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:1px;
  text-align:center;
  text-shadow:0 8px 20px rgba(0,0,0,.55),0 0 16px rgba(243,94,96,.2);
  pointer-events:none;
  user-select:none;
}

.qualification-card.is-visible{
  opacity:1;
  z-index:var(--z,5);
  pointer-events:auto;
  cursor:grab;
  transform:translate3d(calc(-50% + var(--x) + var(--drag-x, 0px)),calc(-50% + var(--y)),0) rotate(var(--r)) scale(var(--s));
  filter:none;
}

.qualification-card.is-in-deck{
  opacity:.62;
  z-index:2;
  pointer-events:none;
  transform:translate3d(calc(-50% + var(--deck-x)),calc(-50% + var(--deck-y)),0) rotate(var(--deck-r)) scale(.42);
  filter:saturate(.82) brightness(.72);
}

.qualification-card.is-in-deck figcaption{
  opacity:0;
}

.qualification-card.is-visible:hover,
.qualification-card.is-visible.is-card-hovered{
  z-index:120 !important;
  animation:none !important;
  transform:translate3d(calc(-50% + var(--x) + var(--drag-x, 0px)),calc(-50% + var(--y) - 28px),0) rotate(0deg) scale(calc(var(--s) + .24)) !important;
  filter:saturate(1.1) brightness(1.06) !important;
}

.qualification-card.is-visible:hover img,
.qualification-card.is-visible.is-card-hovered img{
  transform:scale(1.04);
  filter:saturate(1.08) brightness(1.04);
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .qualification-card.is-visible{
  animation:qualificationCardDeal .72s cubic-bezier(.13,.84,.2,1) var(--delay) both;
}

.qualification-orbit{
  position:absolute;
  left:50%;
  bottom:122px;
  z-index:3;
  width:1040px;
  height:270px;
  transform:translateX(-50%);
  pointer-events:auto;
}

.qualification-node{
  position:absolute;
  left:50%;
  top:50%;
  display:grid;
  place-items:center;
  border-radius:50%;
  opacity:0;
  transform:translate3d(-50%,80px,0) scale(.72);
  filter:none;
  will-change:transform,opacity,filter;
}

.qualification-node:before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:inherit;
  border:1px solid rgba(255,124,31,.3);
  box-shadow:0 0 34px rgba(255,99,12,.16);
}

.qualification-node img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:inherit;
  opacity:.62;
  filter:saturate(.95) contrast(1.08);
}

.node-main{
  width:174px;
  height:174px;
  background:rgba(255,255,255,.08);
  border:5px solid rgba(255,160,92,.24);
  box-shadow:0 0 0 1px rgba(255,160,92,.18),0 20px 46px rgba(0,0,0,.3);
}

.node-main span,
.node-main span:before{
  position:absolute;
  left:50%;
  top:50%;
  content:"";
  width:72px;
  height:7px;
  border-radius:999px;
  background:rgba(255,221,198,.48);
  transform:translate(-50%,-50%);
}

.node-main span:before{
  width:7px;
  height:72px;
}

.node-side{
  width:126px;
  height:126px;
  border:4px solid rgba(255,118,31,.18);
  background:rgba(255,123,31,.08);
}

.node-left-far{
  margin-left:-420px;
  margin-top:82px;
  width:112px;
  height:112px;
}

.node-left{
  margin-left:-222px;
  margin-top:34px;
}

.node-right{
  margin-left:222px;
  margin-top:34px;
}

.node-right-far{
  margin-left:420px;
  margin-top:82px;
  width:112px;
  height:112px;
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .node-left-far{
  animation:qualificationNodeIn .78s cubic-bezier(.18,.86,.22,1) 1.1s both;
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .node-left{
  animation:qualificationNodeIn .78s cubic-bezier(.18,.86,.22,1) 1.28s both;
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .node-main{
  animation:qualificationNodeIn .8s cubic-bezier(.18,.86,.22,1) 1.46s both;
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .node-right{
  animation:qualificationNodeIn .78s cubic-bezier(.18,.86,.22,1) 1.64s both;
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .node-right-far{
  animation:qualificationNodeIn .78s cubic-bezier(.18,.86,.22,1) 1.82s both;
}

.qualification-card-stage{
  bottom:179px;
  width:min(1220px,76vw);
  height:620px;
  cursor:default;
  perspective:none;
}

.qualification-card-stage.is-dragging{
  cursor:grabbing;
}

.qualification-deck{
  display:none;
}

.qualification-card{
  width:168px;
  pointer-events:none;
  transition:transform .45s cubic-bezier(.16,.82,.22,1),opacity .34s ease,filter .34s ease;
}

.qualification-card:before{
  left:-8px;
  right:-8px;
  top:-8px;
  height:236px;
  border-radius:18px;
  background:
    linear-gradient(145deg,rgba(243,94,96,.2),rgba(255,255,255,.04)),
    linear-gradient(90deg,transparent,rgba(243,94,96,.24),transparent);
  box-shadow:0 22px 48px rgba(0,0,0,.44),0 0 22px rgba(243,94,96,.16);
}

.qualification-card img{
  width:168px;
  height:226px;
  border-radius:14px;
  border-color:rgba(243,94,96,.38);
  clip-path:polygon(0 0,100% 0,100% 93%,91% 100%,0 100%);
  background:#fff;
}

.qualification-card figcaption{
  min-height:38px;
  max-width:184px;
  margin:11px auto 0;
  padding:0 8px;
  font-size:13px;
  line-height:1.25;
  color:#fff;
  text-shadow:0 8px 20px rgba(0,0,0,.62);
}

.qualification-card.is-visible{
  cursor:pointer;
  pointer-events:auto;
  transform:translate3d(calc(-50% + var(--x) + var(--drag-x, 0px)),calc(-50% + var(--y)),0) scale(var(--s));
}

.qualification-card.is-in-deck{
  display:none;
  opacity:0;
  pointer-events:none;
  transform:translate3d(-50%,calc(-50% + 310px),0) scale(.82);
}

.hero-tab-panel[data-panel="qualification"]:not(.is-active) .qualification-card-stage,
.hero-tab-panel[data-panel="qualification"]:not(.is-active) .qualification-card-bg,
.hero-tab-panel[data-panel="qualification"]:not(.is-active) .qualification-page-controls,
body:not(.desktop-home-page) .qualification-card-stage,
body:not(.desktop-home-page) .qualification-card-bg,
body:not(.desktop-home-page) .qualification-page-controls,
body:not(.desktop-home-page) .qualification-preview-modal{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

.qualification-card.is-visible:hover,
.qualification-card.is-visible.is-card-hovered{
  z-index:120 !important;
  transform:translate3d(calc(-50% + var(--x) + var(--drag-x, 0px)),calc(-50% + var(--y) - 10px),0) scale(1.1) !important;
}

.qualification-card.is-visible:hover img,
.qualification-card.is-visible.is-card-hovered img{
  transform:scale(1.03);
}

.hero-tab-panel[data-panel="qualification"].is-active.is-qualification-running .qualification-card.is-visible{
  animation:qualificationTileIn .56s cubic-bezier(.16,.82,.22,1) var(--delay) both;
}

.qualification-page-controls{
  position:absolute;
  left:50%;
  bottom:-73px;
  z-index:150;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:max-content;
  max-width:100%;
  padding:10px 16px;
  border:1px solid rgba(243,94,96,.28);
  border-radius:999px;
  background:linear-gradient(135deg,rgba(18,4,6,.72),rgba(243,94,96,.12));
  box-shadow:0 18px 44px rgba(0,0,0,.34),0 0 24px rgba(243,94,96,.12),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(10px);
  transform:translateX(-50%);
}

.qualification-page-btn{
  appearance:none;
  -webkit-appearance:none;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid rgba(243,94,96,.42);
  border-radius:50%;
  color:#fff;
  font-size:30px;
  line-height:1;
  background:rgba(243,94,96,.16);
  box-shadow:0 0 18px rgba(243,94,96,.12);
  cursor:pointer;
  transition:transform .22s ease,background .22s ease,box-shadow .22s ease;
}

.qualification-page-btn:hover{
  transform:translateY(-2px) scale(1.06);
  background:rgba(243,94,96,.32);
  box-shadow:0 0 28px rgba(243,94,96,.28);
}

.qualification-page-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.qualification-page-state{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:92px;
  justify-content:center;
  color:rgba(255,255,255,.62);
  font-family:"Courier New",monospace;
  font-weight:900;
}

.qualification-page-state b{
  color:#f35e60;
  font-size:22px;
  font-style:normal;
  text-shadow:0 0 16px rgba(243,94,96,.42);
}

.qualification-page-state i{
  width:34px;
  height:1px;
  background:linear-gradient(90deg,transparent,#f35e60,transparent);
}

.qualification-page-state em{
  color:rgba(255,255,255,.72);
  font-size:14px;
  font-style:normal;
}

.qualification-page-controls strong{
  color:rgba(255,238,241,.72);
  font-size:13px;
  line-height:1;
  letter-spacing:1px;
  white-space:nowrap;
}

.qualification-preview-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:44px;
  background:rgba(0,0,0,.72);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease,visibility .24s ease;
  backdrop-filter:blur(8px);
}

.qualification-preview-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.qualification-preview-box{
  position:relative;
  display:grid;
  justify-items:center;
  gap:14px;
  max-width:min(760px,82vw);
  max-height:86vh;
  padding:18px 18px 16px;
  border:1px solid rgba(243,94,96,.38);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(20,4,7,.96),rgba(4,3,4,.94));
  box-shadow:0 32px 90px rgba(0,0,0,.62),0 0 38px rgba(243,94,96,.18),inset 0 1px 0 rgba(255,255,255,.08);
  transform:translateY(14px) scale(.96);
  transition:transform .24s ease;
}

.qualification-preview-modal.is-open .qualification-preview-box{
  transform:translateY(0) scale(1);
}

.qualification-preview-box img{
  display:block;
  max-width:min(680px,76vw);
  max-height:74vh;
  object-fit:contain;
  border-radius:12px;
  background:#fff;
}

.qualification-preview-box p{
  margin:0;
  color:rgba(255,242,244,.9);
  font-size:16px;
  font-weight:900;
  letter-spacing:1px;
  text-align:center;
}

.qualification-preview-close{
  position:fixed;
  right:42px;
  top:34px;
  z-index:2;
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border:1px solid rgba(243,94,96,.42);
  border-radius:50%;
  color:#fff;
  font-size:34px;
  line-height:1;
  background:rgba(243,94,96,.18);
  box-shadow:0 0 26px rgba(243,94,96,.2);
  cursor:pointer;
}

@keyframes qualificationTileIn{
  from{
    opacity:0;
    transform:translate3d(calc(-50% + var(--x) + var(--drag-x, 0px)),calc(-50% + var(--y) + 34px),0) scale(.92);
  }
  to{
    opacity:1;
    transform:translate3d(calc(-50% + var(--x) + var(--drag-x, 0px)),calc(-50% + var(--y)),0) scale(var(--s));
  }
}

.fullscreen-contact:before,
.fullscreen-contact:after{
  display:none;
}

.fullscreen-contact{
  background:#020304;
}

.contact-svg-stage{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  background:#020304;
}

.contact-svg-bg{
  display:block;
  width:100%;
  height:100%;
}

.contact-svg-base{
  fill:#020304;
}

.contact-svg-grid{
  opacity:.18;
  fill:none;
  stroke:rgba(255,255,255,.18);
  stroke-width:1;
}

.contact-svg-grid path:nth-child(2){
  opacity:.22;
}

.contact-svg-poly{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  will-change:transform,opacity;
}

.contact-svg-black{
  fill:#020405;
}

.contact-svg-brown{
  fill:url(#contactBrownDeep);
}

.contact-svg-orange-top{
  fill:url(#contactOrangeTop);
}

.contact-svg-orange-left{
  fill:url(#contactOrangeLeft);
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-running .contact-svg-brown{
  animation:contactBrownIn .82s cubic-bezier(.16,.84,.25,1) .12s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-running .contact-svg-black{
  animation:contactBlackIn .78s cubic-bezier(.16,.84,.25,1) .42s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-running .contact-svg-orange-top{
  animation:contactOrangeTopIn .72s cubic-bezier(.16,.84,.25,1) .72s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-running .contact-svg-orange-left{
  animation:contactOrangeLeftIn .7s cubic-bezier(.16,.84,.25,1) .88s both;
}

.contact-bg-container,
.contact-bg-page,
.contact-bg-page .bg-poly,
.contact-bg-page .pattern-bg{
  position:absolute;
  inset:0;
}

.contact-bg-container{
  z-index:0;
  overflow:hidden;
  background:#020304;
}

.contact-bg-page{
  opacity:0;
  transition:opacity .68s ease;
  will-change:opacity;
}

.contact-bg-page.is-active{
  opacity:1;
}

.contact-bg-page .bg-poly{
  overflow:hidden;
  will-change:transform,opacity;
}

.contact-bg-page .bg-poly-black{
  z-index:1;
  clip-path:polygon(0 0,48% 0,36% 100%,0 100%);
  background:
    radial-gradient(circle at 20% 25%,rgba(255,255,255,.07),transparent 25%),
    linear-gradient(135deg,#050607 0%,#08090b 62%,#100b08 100%);
}

.contact-bg-page .bg-poly-brown{
  z-index:2;
  clip-path:polygon(48% 0,78% 0,66% 100%,36% 100%);
  background:
    radial-gradient(circle at 45% 32%,rgba(255,138,40,.12),transparent 30%),
    linear-gradient(135deg,#20100a 0%,#3b1f12 48%,#1a0d08 100%);
}

.contact-bg-page .bg-poly-orange{
  z-index:3;
  clip-path:polygon(78% 0,100% 0,100% 100%,66% 100%);
  background:
    radial-gradient(circle at 75% 30%,rgba(255,218,126,.28),transparent 25%),
    linear-gradient(135deg,#ff3d1d 0%,#d56a14 48%,#5f210b 100%);
}

.contact-bg-page-b .bg-poly-black{
  clip-path:polygon(0 0,40% 0,31% 100%,0 100%);
  background:
    radial-gradient(circle at 18% 38%,rgba(255,255,255,.06),transparent 23%),
    linear-gradient(135deg,#020303 0%,#111213 66%,#190e08 100%);
}

.contact-bg-page-b .bg-poly-brown{
  clip-path:polygon(40% 0,72% 0,63% 100%,31% 100%);
  background:
    radial-gradient(circle at 50% 25%,rgba(255,128,31,.14),transparent 28%),
    linear-gradient(135deg,#2c150b 0%,#4a2713 54%,#1c0d06 100%);
}

.contact-bg-page-b .bg-poly-orange{
  clip-path:polygon(72% 0,100% 0,100% 100%,63% 100%);
  background:
    radial-gradient(circle at 85% 35%,rgba(255,232,158,.28),transparent 25%),
    linear-gradient(135deg,#ff581f 0%,#e37617 52%,#743112 100%);
}

.contact-bg-page-c .bg-poly-black{
  clip-path:polygon(0 0,52% 0,41% 100%,0 100%);
  background:
    radial-gradient(circle at 28% 20%,rgba(255,255,255,.055),transparent 25%),
    linear-gradient(135deg,#060709 0%,#0d0e12 58%,#1b0d07 100%);
}

.contact-bg-page-c .bg-poly-brown{
  clip-path:polygon(52% 0,82% 0,70% 100%,41% 100%);
  background:
    radial-gradient(circle at 55% 42%,rgba(255,144,48,.13),transparent 30%),
    linear-gradient(135deg,#251009 0%,#462512 50%,#160907 100%);
}

.contact-bg-page-c .bg-poly-orange{
  clip-path:polygon(82% 0,100% 0,100% 100%,70% 100%);
  background:
    radial-gradient(circle at 88% 18%,rgba(255,238,172,.3),transparent 23%),
    linear-gradient(135deg,#f34319 0%,#c85a10 50%,#6a260c 100%);
}

.contact-bg-page .pattern-bg{
  color:rgba(255,255,255,.86);
  opacity:.12;
  transform:translate3d(0,0,0) scale(1.4);
  animation:contactPatternLeft 34s linear infinite;
  will-change:transform;
}

.contact-bg-page .pattern-bg:before{
  content:"<   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <\A <   <   <   <   <   <   <   <   <   <   <   <   <   <   <";
  position:absolute;
  left:-60px;
  top:-60px;
  width:120vw;
  color:currentColor;
  font-family:Arial,Helvetica,sans-serif;
  font-size:28px;
  line-height:54px;
  font-weight:900;
  letter-spacing:20px;
  white-space:pre;
}

.contact-bg-page .bg-poly-brown .pattern-bg{
  color:rgba(255,190,116,.9);
  animation-name:contactPatternRight;
  animation-duration:42s;
}

.contact-bg-page .bg-poly-orange .pattern-bg{
  color:rgba(255,238,200,.9);
  animation-duration:38s;
}

.contact-content{
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  z-index:4;
  display:grid;
  grid-template-columns:430px 590px;
  align-items:center;
  gap:86px;
  width:min(1160px,calc(100vw - 280px));
  padding:80px 0 72px;
  color:#fff;
  visibility:hidden;
  transform:translateX(-50%);
  pointer-events:auto;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-content{
  visibility:visible;
}

.contact-copy{
  position:relative;
  z-index:3;
  align-self:start;
  padding-top:24px;
}

.contact-reveal,
.contact-visual-item,
.contact-float-card{
  opacity:0;
  will-change:transform,opacity;
}

.contact-title{
  margin:0;
  color:#fff;
  font-size:48px;
  line-height:1;
  font-weight:900;
  letter-spacing:1px;
  text-shadow:0 18px 38px rgba(0,0,0,.62);
}

.contact-subtitle{
  max-width:430px;
  margin:24px 0 0;
  color:rgba(255,255,255,.76);
  font-size:19px;
  line-height:1.48;
  font-weight:900;
  letter-spacing:1px;
}

.contact-feature-list{
  display:grid;
  gap:44px;
  margin:112px 0 0;
  padding:0;
  list-style:none;
}

.contact-feature{
  position:relative;
  display:flex;
  align-items:center;
  gap:28px;
}

.contact-feature:nth-child(2){
  z-index:30;
}

.contact-feature:nth-child(3){
  z-index:1;
}

.contact-feature:has(.contact-qr-trigger:hover){
  z-index:80;
}

.contact-feature span{
  display:grid;
  gap:9px;
}

.contact-feature b{
  color:#fff;
  font-size:23px;
  line-height:1;
  font-weight:900;
  letter-spacing:1px;
}

.contact-feature em{
  color:rgba(255,255,255,.68);
  font-style:normal;
  font-size:16px;
  line-height:1;
  font-weight:800;
}

.contact-qr-trigger{
  position:relative;
  display:inline-flex;
  width:max-content;
  align-items:center;
  padding-bottom:18px;
  margin-bottom:-18px;
  cursor:pointer;
  color:rgba(255,191,112,.9) !important;
  border-bottom:1px solid rgba(255,150,44,.42);
  transition:color .22s ease,text-shadow .22s ease;
}

.contact-qr-trigger:hover{
  color:#fff1d4 !important;
  text-shadow:0 0 18px rgba(255,126,31,.48);
}

.contact-qr-pop{
  position:absolute;
  left:0;
  top:calc(100% - 2px);
  bottom:auto;
  z-index:120;
  display:grid;
  grid-template-columns:repeat(2,188px);
  gap:16px;
  width:max-content;
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(255,177,68,.48);
  background:#fff;
  box-shadow:0 22px 46px rgba(0,0,0,.42),0 0 34px rgba(255,116,31,.18);
  opacity:0;
  visibility:hidden;
  transform:translate3d(0,12px,0) scale(.96);
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease;
  pointer-events:none;
  isolation:isolate;
}

.contact-qr-pop:before{
  content:"";
  position:absolute;
  left:-28px;
  right:-12px;
  top:-10px;
  bottom:-18px;
  z-index:-1;
  border-radius:20px;
  background:#fff;
  box-shadow:0 18px 42px rgba(0,0,0,.34);
}

.contact-qr-item{
  display:grid;
  gap:9px;
  margin:0;
  justify-items:center;
}

.contact-qr-pop img{
  display:block;
  width:174px;
  height:174px;
  padding:8px;
  object-fit:contain;
  object-position:center;
  border-radius:10px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
}

.contact-qr-label{
  color:#161616;
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:1px;
}

.contact-qr-trigger:after{
  content:"";
  position:absolute;
  left:22px;
  top:calc(100% + 6px);
  bottom:auto;
  z-index:121;
  width:14px;
  height:14px;
  background:rgba(255,255,255,.92);
  border-left:1px solid rgba(255,177,68,.48);
  border-top:1px solid rgba(255,177,68,.48);
  opacity:0;
  visibility:hidden;
  transform:rotate(45deg) translate3d(7px,7px,0);
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease;
  pointer-events:none;
}

.contact-qr-trigger:hover .contact-qr-pop,
.contact-qr-trigger:hover:after{
  opacity:1;
  visibility:visible;
}

.contact-qr-trigger:hover .contact-qr-pop{
  transform:translate3d(0,0,0) scale(1);
  pointer-events:auto;
}

.contact-qr-trigger:hover:after{
  transform:rotate(45deg) translate3d(0,0,0);
}

.contact-feature-icon{
  position:relative;
  display:block;
  width:52px;
  height:52px;
  flex:0 0 auto;
  color:#ff871c;
  filter:drop-shadow(0 10px 20px rgba(255,91,13,.22));
}

.contact-feature-icon:before,
.contact-feature-icon:after{
  content:"";
  position:absolute;
  inset:0;
}

.icon-star:before{
  background:currentColor;
  clip-path:polygon(50% 0,61% 16%,80% 12%,85% 32%,100% 43%,89% 59%,91% 79%,70% 82%,50% 100%,30% 82%,9% 79%,11% 59%,0 43%,15% 32%,20% 12%,39% 16%);
}

.icon-star:after{
  inset:18px;
  background:#111;
  clip-path:polygon(50% 0,61% 33%,96% 33%,67% 54%,78% 88%,50% 66%,22% 88%,33% 54%,4% 33%,39% 33%);
}

.icon-building:before{
  background:
    linear-gradient(currentColor,currentColor) 25px 8px/8px 40px no-repeat,
    linear-gradient(currentColor,currentColor) 8px 24px/42px 8px no-repeat,
    linear-gradient(currentColor,currentColor) 6px 50px/46px 8px no-repeat,
    linear-gradient(currentColor,currentColor) 12px 33px/8px 16px no-repeat,
    linear-gradient(currentColor,currentColor) 25px 33px/8px 16px no-repeat,
    linear-gradient(currentColor,currentColor) 38px 33px/8px 16px no-repeat;
}

.icon-building:after{
  inset:0 10px 28px;
  background:currentColor;
  clip-path:polygon(50% 0,100% 34%,100% 100%,0 100%,0 34%);
}

.icon-chart:before{
  background:
    linear-gradient(currentColor,currentColor) 0 44px/12px 10px no-repeat,
    linear-gradient(currentColor,currentColor) 20px 34px/12px 20px no-repeat,
    linear-gradient(currentColor,currentColor) 40px 20px/12px 34px no-repeat;
}

.icon-chart:after{
  left:0;
  top:11px;
  width:58px;
  height:36px;
  border-top:8px solid currentColor;
  border-right:8px solid currentColor;
  transform:skewY(-28deg) rotate(-18deg);
}

.contact-visual{
  position:relative;
  z-index:2;
  width:590px;
  height:640px;
  justify-self:start;
  filter:drop-shadow(0 38px 76px rgba(0,0,0,.28));
}

.contact-phone{
  position:absolute;
  right:74px;
  top:-36px;
  width:430px;
  height:780px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,#cd5c5e 0%,#cd5c5e 31%,#1d2427 31%,#171c1f 100%);
  box-shadow:0 34px 70px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,255,255,.18);
}

.contact-phone:before{
  content:"";
  position:absolute;
  right:-28px;
  top:-28px;
  width:304px;
  height:232px;
  background:linear-gradient(135deg,rgba(255,255,255,.2),rgba(255,255,255,.06));
  clip-path:polygon(28% 0,100% 0,62% 100%,0 58%);
}

.contact-phone-head{
  position:absolute;
  left:30px;
  right:25px;
  top:20px;
  z-index:3;
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#111;
  font-size:17px;
  line-height:1;
  font-weight:900;
}

.contact-phone-head i{
  width:70px;
  height:16px;
  background:
    radial-gradient(circle at 8px 9px,#111 0 4px,transparent 5px),
    radial-gradient(circle at 23px 9px,#111 0 4px,transparent 5px),
    radial-gradient(circle at 38px 9px,#111 0 4px,transparent 5px),
    linear-gradient(#111,#111) right 4px top 4px/28px 10px no-repeat;
}

.contact-profile{
  position:absolute;
  left:28px;
  top:151px;
  z-index:3;
  display:flex;
  align-items:center;
  gap:12px;
  color:#172026;
  font-size:20px;
  font-weight:900;
}

.contact-profile img{
  width:64px;
  height:64px;
  object-fit:cover;
  border:3px solid #fff;
  border-radius:50%;
  background:rgba(255,255,255,.9);
}

.contact-profile span{
  display:inline-flex;
  align-items:center;
  height:25px;
  padding:0 8px;
  color:#fff;
  font-size:13px;
  border:1px solid rgba(255,255,255,.65);
}

.contact-phone-body{
  position:absolute;
  left:24px;
  right:24px;
  bottom:62px;
  z-index:2;
  display:grid;
  gap:26px;
}

.contact-service-card{
  display:flex;
  align-items:center;
  gap:16px;
  height:98px;
  
  border-radius:8px;
  color:#fff;
  background:linear-gradient(90deg,rgba(16,128,94,.88),rgba(18,48,45,.94));
  clip-path:polygon(0 0,100% 0,100% 76%,90% 100%,0 100%);
  box-shadow:0 18px 38px rgba(0,0,0,.28);
}

.contact-service-card.is-dark{
  background:linear-gradient(90deg,rgba(18,22,24,.94),rgba(29,36,39,.86));
  opacity:.76;
}

.contact-service-card img,
.contact-service-card i{
  
  border-radius:6px;
  object-fit:cover;
  background:linear-gradient(135deg,#1c2328,#f26922);
}

.contact-service-card span{
  display:grid;
  gap:8px;
}

.contact-service-card b{
  font-size:18px;
  line-height:1;
}

.contact-service-card em{
  display:inline-flex;
  width:max-content;
  height:23px;
  align-items:center;
  padding:0 8px;
  color:#11664d;
  font-style:normal;
  font-size:14px;
  font-weight:900;
  background:#e9fff3;
}

.contact-service-card.is-dark em{
  color:rgba(255,255,255,.48);
  background:transparent;
  padding:0;
}

.contact-float-card{
  position:absolute;
  z-index:5;
  display:flex;
  align-items:center;
  color:#fff;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(135deg,rgba(42,50,56,.96),rgba(24,30,35,.96));
  box-shadow:0 20px 42px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.12);
  clip-path:polygon(0 0,94% 0,100% 18%,100% 100%,8% 100%,0 82%);
}

.contact-float-top{
  right:-128px;
  top:19px;
  width:378px;
  height:104px;
  gap:16px;
 
}

.contact-float-top img{
 
  border-radius:5px;
  object-fit:cover;
}

.contact-float-top span,
.contact-float-left{
  display:grid;
  gap:10px;
}

.contact-float-top b,
.contact-float-left b{
  color:#fff;
  font-size:18px;
  line-height:1;
}

.contact-float-top em{
  display:inline-flex;
  width:max-content;
  height:24px;
  align-items:center;
  padding:0 8px;
  color:#157250;
  font-style:normal;
  font-size:14px;
  font-weight:900;
  background:#e9fff3;
}

.contact-float-left{
  left:-62px;
  top:294px;
  width:328px;
  height:106px;
  
}

.contact-float-left em{
  color:rgba(255,255,255,.68);
  font-style:normal;
  font-size:14px;
  font-weight:800;
}

.contact-float-left i{
  position:absolute;
  right:30px;
  top:32px;
  width:52px;
  height:52px;
  background:linear-gradient(135deg,#e7edf2,#7e8d99);
  clip-path:polygon(0 0,100% 16%,82% 100%,14% 88%);
  transform:rotate(8deg);
}

.contact-orb{
  position:absolute;
  right:20px;
  top:216px;
  z-index:4;
  width:214px;
  height:214px;
  border-radius:50%;
  background:
    radial-gradient(circle at 48% 34%,rgba(255,198,32,.92) 0 22%,transparent 23%),
    radial-gradient(circle at 56% 58%,#1b1d17 0 42%,#2f2b22 43% 100%);
  box-shadow:0 30px 60px rgba(0,0,0,.42),inset -22px -24px 34px rgba(0,0,0,.38),inset 18px 18px 28px rgba(255,255,255,.08);
}

.contact-orb:before,
.contact-orb:after{
  content:"";
  position:absolute;
}

.contact-orb:before{
  left:40px;
  top:32px;
  width:135px;
  height:70px;
  border-radius:44% 44% 52% 52%;
  background:linear-gradient(180deg,#ffbc25,#d78100);
  box-shadow:inset 0 0 0 5px rgba(255,255,255,.1);
}

.contact-orb:after{
  left:66px;
  top:63px;
  width:88px;
  height:20px;
  background:
    radial-gradient(circle at 18px 11px,transparent 0 10px,#fff 11px 15px,transparent 16px),
    radial-gradient(circle at 80px 11px,transparent 0 10px,#fff 11px 15px,transparent 16px);
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-title{
  animation:contactTextIn .58s cubic-bezier(.16,.84,.25,1) 0s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-subtitle{
  animation:contactTextIn .58s cubic-bezier(.16,.84,.25,1) .16s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-feature:nth-child(1){
  animation:contactTextIn .58s cubic-bezier(.16,.84,.25,1) .34s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-feature:nth-child(2){
  animation:contactTextIn .58s cubic-bezier(.16,.84,.25,1) .52s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-feature:nth-child(3){
  animation:contactTextIn .58s cubic-bezier(.16,.84,.25,1) .7s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-phone{
  animation:contactPhoneIn .82s cubic-bezier(.16,.84,.25,1) 0s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-orb{
  animation:contactOrbIn .72s cubic-bezier(.16,.84,.25,1) .32s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-float-top{
  animation:contactFloatTopIn .58s cubic-bezier(.16,.84,.25,1) .5s both;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-float-left{
  animation:contactFloatLeftIn .58s cubic-bezier(.16,.84,.25,1) .68s both;
}

.case-center-copy{
  position:absolute;
  left:50%;
  top:30%;
  z-index:6;
  display:grid;
  justify-items:center;
  width:640px;
  transform:translate(-50%,-50%);
  text-align:center;
  pointer-events:auto;
}

.case-center-copy h1{
  margin:0;
  color:#fff;
  font-size:72px;
  line-height:1;
  font-weight:900;
  letter-spacing:6px;
  text-shadow:0 16px 44px rgba(0,0,0,.62);
}

.case-center-copy p{
  margin:28px 0 0;
  color:#fff;
  font-size:38px;
  line-height:1;
  font-weight:900;
  letter-spacing:3px;
  text-shadow:0 12px 34px rgba(0,0,0,.6);
}

.case-search-btn{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  min-width:286px;
  height:74px;
  margin-top:164px;
  padding:0 30px;
  color:#f35e60;
  font-size:34px;
  font-weight:900;
  border:4px solid #f35e60;
  border-radius:999px;
  background:rgba(0,0,0,.5);
  box-shadow:0 20px 52px rgba(0,0,0,.36),inset 0 0 0 1px rgba(255,255,255,.08);
  transition:transform .24s ease,background .24s ease,box-shadow .24s ease;
}

.case-search-btn:hover{
  transform:translateY(-3px) scale(1.03);
  background:rgba(243,94,96,.12);
  box-shadow:0 26px 62px rgba(243,94,96,.2);
}

.case-btn-rotator{
  position:relative;
  display:block;
  width:170px;
  height:42px;
  overflow:hidden;
}

.case-btn-rotator b{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  opacity:0;
  transform:translateY(18px);
  animation:caseBtnTextLoop 9s ease-in-out infinite;
  white-space:nowrap;
}

.case-btn-rotator b:nth-child(2){
  animation-delay:3s;
}

.case-btn-rotator b:nth-child(3){
  animation-delay:6s;
}

.case-search-icon{
  position:relative;
  width:32px;
  height:32px;
  border:6px solid #fff;
  border-radius:50%;
}

.case-search-icon:after{
  content:"";
  position:absolute;
  right:-14px;
  bottom:-10px;
  width:19px;
  height:6px;
  border-radius:99px;
  background:#fff;
  transform:rotate(45deg);
}

.case-flow-card{
  position:absolute;
  left:50%;
  top:50%;
  z-index:2;
  width:168px;
  height:236px;
  overflow:hidden;
  opacity:0;
  border-radius:4px;
  clip-path:polygon(32px 0,100% 0,100% calc(100% - 32px),calc(100% - 32px) 100%,0 100%,0 32px);
  box-shadow:0 30px 76px rgba(0,0,0,.72),0 10px 24px rgba(0,0,0,.46);
  transform:translate3d(-50%,-50%,0) scale(.62);
  animation:caseSpread 9.6s linear infinite;
  backface-visibility:hidden;
  transform-style:preserve-3d;
  contain:layout paint;
  will-change:transform,opacity,filter;
}

.case-flow-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(1.04) contrast(1.05);
  transition:transform .32s ease;
  transform:translateZ(0);
  backface-visibility:hidden;
  will-change:transform;
}

.case-flow-card:hover img{
  transform:scale(1.05);
}

.case-card-a{
  --lift-x:-10vw;
  --lift-y:-9vh;
  --tx:-62vw;
  --ty:-54vh;
  --rot:-10deg;
  --mid-scale:1.02;
  --end-scale:1.9;
  animation-delay:0s;
}

.case-card-b{
  --lift-x:10vw;
  --lift-y:-9vh;
  --tx:62vw;
  --ty:-54vh;
  --rot:9deg;
  --mid-scale:.92;
  --end-scale:1.72;
  animation-delay:-1.2s;
}

.case-card-c{
  --lift-x:-10vw;
  --lift-y:9vh;
  --tx:-62vw;
  --ty:54vh;
  --rot:8deg;
  --mid-scale:1.08;
  --end-scale:2.05;
  animation-delay:-2.4s;
}

.case-card-d{
  --lift-x:10vw;
  --lift-y:9vh;
  --tx:62vw;
  --ty:54vh;
  --rot:-7deg;
  --mid-scale:1.12;
  --end-scale:2;
  animation-delay:-3.6s;
}

.case-card-e{
  --lift-x:8vw;
  --lift-y:-10vh;
  --tx:70vw;
  --ty:-62vh;
  --rot:7deg;
  --mid-scale:.9;
  --end-scale:1.75;
  animation-delay:-4.8s;
}

.case-card-f{
  --lift-x:-8vw;
  --lift-y:10vh;
  --tx:-70vw;
  --ty:62vh;
  --rot:-8deg;
  --mid-scale:1.04;
  --end-scale:1.95;
  animation-delay:-6s;
}

.case-card-g{
  --lift-x:-15vw;
  --lift-y:1vh;
  --tx:-76vw;
  --ty:10vh;
  --rot:6deg;
  --mid-scale:.96;
  --end-scale:1.78;
  animation-delay:-7.2s;
}

.case-card-h{
  --lift-x:15vw;
  --lift-y:-1vh;
  --tx:76vw;
  --ty:-10vh;
  --rot:-6deg;
  --mid-scale:1;
  --end-scale:1.82;
  animation-delay:-8.4s;
}

.hero-fire-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  min-width:284px;
  height:74px;
  margin-top:64px;
  color:var(--orange);
  font-size:34px;
  font-weight:900;
  border:4px solid var(--orange);
  border-radius:999px;
  background:rgba(0,0,0,.36);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 16px 40px rgba(0,0,0,.34);
  transition:transform .24s ease,background .24s ease,box-shadow .24s ease;
}

.hero-panel-btn{
  appearance:none;
}

.hero-fire-btn span{
  color:#fff;
  font-size:30px;
}

.hero-fire-btn:hover{
  transform:translateY(-3px) scale(1.03);
  background:rgba(255,143,31,.12);
  box-shadow:0 20px 48px rgba(255,143,31,.2);
}

.section-rail{
  position:fixed;
  right:0;
  top:80px;
  z-index:160;
  display:grid;
  align-content:center;
  gap:26px;
  width:112px;
  height:calc(100vh - 80px);
  padding:0 24px 0 0;
  text-align:right;
  transform:none;
  background:linear-gradient(180deg,rgba(101,33,7,.62),rgba(58,17,3,.28) 45%,rgba(0,0,0,.38) 100%);
  border-left:1px solid rgba(255,255,255,.12);
  box-shadow:inset 1px 0 0 rgba(255,255,255,.06);
}

.section-rail button{
  appearance:none;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  width:100%;
  height:26px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  color:rgba(255,255,255,.28);
  font-family:"Courier New",monospace;
  font-size:13px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
  overflow:visible;
  transition:color .22s ease,transform .22s ease,text-shadow .22s ease;
}

.section-rail button:before,
.section-rail button:after{
  display:none;
}

.section-rail button:before{
  right:0;
  top:50%;
  width:22px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55));
  transform:translateY(-50%);
}

.section-rail button:after{
  right:-2px;
  top:50%;
  width:5px;
  height:5px;
  border-radius:50%;
  background:rgba(255,255,255,.5);
  box-shadow:0 0 10px rgba(255,255,255,.35);
  transform:translateY(-50%);
}

.rail-num,
.rail-label{
  display:block;
  transition:opacity .22s ease,transform .22s ease,letter-spacing .22s ease;
}

.rail-num{
  opacity:1;
  transform:translateX(0);
}

.section-rail button[data-panel="cases"] .rail-num{
  font-size:0;
}

.section-rail button[data-panel="cases"] .rail-num:after{
  content:"澶т綔";
  font-family:Arial,"Microsoft YaHei",sans-serif;
  font-size:14px;
  font-weight:900;
}

.rail-label{
  display:block;
  position:absolute;
  right:0;
  opacity:0;
  color:#fff;
  font-family:Arial,"Microsoft YaHei",sans-serif;
  font-size:15px;
  letter-spacing:1px;
  transform:translateX(14px);
}

.section-rail button.active,
.section-rail button:hover{
  color:#fff;
  text-shadow:none;
  transform:none;
}

.section-rail button:hover:before,
.section-rail button.active:before{
  width:0;
  opacity:0;
}

.section-rail button:hover:after,
.section-rail button.active:after{
  opacity:0;
}

.section-rail button:hover .rail-num,
.section-rail button:focus .rail-num,
.section-rail button.is-hovered .rail-num{
  opacity:0;
  transform:translateX(-10px);
}

.section-rail button:hover .rail-label,
.section-rail button:focus .rail-label,
.section-rail button.is-hovered .rail-label{
  opacity:1;
  transform:translateX(0);
}

.section-rail button[data-effect="pulse"] .rail-num{
  animation:none;
}

.section-rail button[data-effect="scan"] .rail-num{
  animation:none;
}

.section-rail button[data-effect="orbit"]:after{
  animation:none;
}

.section-rail button[data-effect="spark"] .rail-num{
  animation:none;
}

.section-rail button[data-effect="wave"]{
  animation:none;
}

.section-rail button[data-panel="cases"] .rail-num{
  font-size:13px;
}

.section-rail button[data-panel="cases"] .rail-num:after{
  content:none;
  display:none;
}

.hero-carousel{
  position:relative;
  z-index:3;
  width:100%;
  height:590px;
}

.game-coverflow{
  position:relative;
  width:100%;
  height:100%;
  padding:34px 0 60px;
  overflow:visible;
}

.game-coverflow .swiper-wrapper{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  width:100%;
  height:100%;
  box-sizing:content-box;
  transform-style:preserve-3d;
  transition-property:transform;
}

.game-coverflow .swiper-slide{
  position:relative;
  flex-shrink:0;
  width:310px;
  height:470px;
  transition-property:transform;
}

.game-coverflow .swiper-slide-shadow-left,
.game-coverflow .swiper-slide-shadow-right{
  display:none !important;
  pointer-events:none;
  background:transparent;
}

.game-coverflow.fallback-coverflow .swiper-wrapper{
  position:relative;
  display:block;
  width:100%;
  height:100%;
  transform-style:preserve-3d;
}

.game-coverflow.fallback-coverflow .swiper-slide{
  position:absolute;
  left:50%;
  top:50%;
  margin-left:-155px;
  margin-top:-235px;
  transition:transform .68s cubic-bezier(.2,.75,.22,1),opacity .38s ease,filter .38s ease;
  transform-style:preserve-3d;
}

.game-coverflow.fallback-coverflow .swiper-pagination{
  position:absolute;
  left:0;
  right:0;
  bottom:16px;
  z-index:20;
  display:flex;
  justify-content:center;
  gap:10px;
}

.game-coverflow.fallback-coverflow .fallback-bullet{
  width:24px;
  height:4px;
  padding:0;
  border-radius:99px;
  background:rgba(255,255,255,.42);
  transition:width .24s ease,background .24s ease,box-shadow .24s ease;
}

.game-coverflow.fallback-coverflow .fallback-bullet.active{
  width:42px;
  background:var(--orange);
  box-shadow:0 0 16px rgba(255,143,31,.65);
}

.game-card{
  position:relative;
  overflow:hidden;
  background:#171b21;
  clip-path:polygon(8% 0,100% 0,100% 92%,92% 100%,0 100%,0 8%);
  box-shadow:0 28px 54px rgba(0,0,0,.42);
  transition:transform .3s ease,box-shadow .3s ease,filter .3s ease;
  will-change:transform;
}

.game-card:hover{
  transform:scale(1.06);
  box-shadow:0 12px 30px rgba(0,0,0,.5),0 0 0 1px rgba(255,143,31,.4);
  filter:saturate(1.08);
}

.game-card:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,transparent 42%,rgba(0,0,0,.9));
  pointer-events:none;
}

.game-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.game-card-info{
  position:absolute;
  left:22px;
  right:22px;
  bottom:24px;
  z-index:2;
}

.game-card-info span{
  display:inline-flex;
  margin-bottom:12px;
  padding:6px 10px;
  color:#181818;
  font-size:12px;
  font-weight:900;
  background:rgba(255,143,31,.88);
}

.game-card-info b{
  display:block;
  font-size:30px;
  line-height:1.1;
  font-weight:900;
}

.game-card-info p{
  margin:10px 0 0;
  color:#d5d8dd;
  font-size:14px;
  line-height:1.6;
  font-weight:700;
}

.swiper-pagination-bullet{
  width:24px;
  height:4px;
  border-radius:99px;
  background:rgba(255,255,255,.42);
  opacity:1;
}

.swiper-pagination-bullet-active{
  width:42px;
  background:var(--orange);
  box-shadow:0 0 16px rgba(255,143,31,.65);
}

.home-section{
  position:relative;
  z-index:2;
  width:min(1320px,calc(100% - 96px));
  margin:0 auto;
  padding:92px 0;
}

.section-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  margin-bottom:34px;
}

.section-title span{
  color:rgba(255,143,31,.78);
  font-family:"Courier New",monospace;
  font-size:15px;
  font-weight:900;
  letter-spacing:4px;
}

.section-title h2{
  margin:0;
  color:#fff;
  font-size:38px;
  font-weight:900;
}

.framework-grid,
.cooperation-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}

.framework-grid article,
.cooperation-grid article,
.qualification-grid article,
.download-panel{
  background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 28px 70px rgba(0,0,0,.28);
}

.framework-grid article{
  min-height:288px;
  padding:24px;
  overflow:hidden;
}

.framework-grid img{
  width:100%;
  height:152px;
  object-fit:cover;
  margin-bottom:18px;
  opacity:.9;
}

.framework-grid b,
.cooperation-grid b,
.qualification-grid b,
.download-copy h2{
  display:block;
  color:#fff;
  font-size:22px;
  font-weight:900;
}

.framework-grid p,
.cooperation-grid p,
.download-copy p,
.desktop-footer p{
  margin:12px 0 0;
  color:#bfc4ca;
  font-size:15px;
  line-height:1.8;
}

.case-strip{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:184px;
  gap:20px;
  overflow-x:auto;
  padding:8px 8px 20px;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,143,31,.7) rgba(255,255,255,.08);
}

.case-strip .game-card{
  height:264px;
}

.case-strip b{
  position:absolute;
  left:16px;
  bottom:16px;
  z-index:2;
  font-size:17px;
}

.cooperation-grid article{
  min-height:210px;
  padding:28px;
}

.cooperation-grid em{
  display:block;
  color:rgba(255,143,31,.42);
  font-family:"Courier New",monospace;
  font-size:54px;
  font-style:normal;
  font-weight:900;
  line-height:1;
  margin-bottom:20px;
}

.qualification-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}

.qualification-grid article{
  padding:18px;
}

.qualification-grid img{
  width:100%;
  height:168px;
  object-fit:contain;
  object-position:center;
  background:rgba(255,255,255,.92);
  margin-bottom:16px;
  opacity:.88;
}

.download-section{
  width:min(1320px,calc(100% - 96px));
  margin:0 auto;
  padding:88px 0 108px;
}

.download-panel{
  position:relative;
  display:grid;
  grid-template-columns:420px 1fr 180px;
  align-items:center;
  gap:34px;
  min-height:260px;
  padding:28px;
  overflow:hidden;
}

.download-cover{
  width:100%;
  height:214px;
  object-fit:cover;
  clip-path:polygon(7% 0,100% 0,100% 88%,91% 100%,0 100%,0 12%);
}

.download-copy span{
  display:block;
  color:var(--orange);
  font-family:"Courier New",monospace;
  font-size:14px;
  font-weight:900;
  letter-spacing:4px;
}

.download-copy h2{
  margin:12px 0 0;
  font-size:36px;
}

.download-copy .client-download-btn{
  height:46px;
  margin-top:22px;
  padding:0 28px;
  color:#101010;
  background:linear-gradient(135deg,#ffd49a,#ff8f1f);
}

.qr-card{
  display:grid;
  place-items:center;
  gap:10px;
  min-height:178px;
  padding:14px;
  border-radius:8px;
  background:rgba(255,255,255,.08);
  transition:transform .24s ease,box-shadow .24s ease,background .24s ease;
}

.qr-card:hover{
  transform:translateY(-6px);
  background:rgba(255,255,255,.12);
  box-shadow:0 20px 45px rgba(0,0,0,.32);
}

.qr-card img{
  width:116px;
  height:116px;
  border-radius:6px;
}

.qr-card b{
  font-size:15px;
}

.desktop-footer{
  display:grid;
  gap:8px;
  justify-items:center;
  padding:42px 24px 48px;
  background:#0d0f12;
  border-top:1px solid rgba(255,255,255,.08);
}

.footer-logo img{
  width:132px;
}

.desktop-footer p{
  margin:0;
  text-align:center;
  font-size:13px;
}

.reveal-item{
  opacity:0;
  transform:translateY(20px);
  animation:fadeIn .72s ease forwards;
}

.reveal-item:nth-child(2){animation-delay:.08s}
.reveal-item:nth-child(3){animation-delay:.16s}
.reveal-item:nth-child(4){animation-delay:.24s}
.reveal-item:nth-child(5){animation-delay:.32s}
.reveal-item:nth-child(6){animation-delay:.4s}

@keyframes fadeIn{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes heroCopyFade{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes cardFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-12px,0)}
}

@keyframes caseSpread{
  0%{
    opacity:0;
    filter:none;
    transform:translate3d(-50%,-50%,0) scale(.58) rotate(0deg);
  }
  14%{
    opacity:.58;
    filter:none;
    transform:translate3d(calc(-50% + var(--tx) * .14),calc(-50% + var(--ty) * .14),0) scale(.74) rotate(calc(var(--rot) * .1));
  }
  30%{
    opacity:.96;
    filter:none;
    transform:translate3d(calc(-50% + var(--tx) * .3),calc(-50% + var(--ty) * .3),0) scale(.96) rotate(calc(var(--rot) * .24));
  }
  48%{
    opacity:.98;
    filter:none;
    transform:translate3d(calc(-50% + var(--tx) * .48),calc(-50% + var(--ty) * .48),0) scale(calc(var(--end-scale) * .72)) rotate(calc(var(--rot) * .42));
  }
  60%{
    opacity:.94;
    filter:none;
    transform:translate3d(calc(-50% + var(--tx) * .6),calc(-50% + var(--ty) * .6),0) scale(var(--end-scale)) rotate(calc(var(--rot) * .58));
  }
  86%{
    opacity:.78;
    filter:none;
    transform:translate3d(calc(-50% + var(--tx) * .98),calc(-50% + var(--ty) * .98),0) scale(calc(var(--end-scale) + .28)) rotate(calc(var(--rot) * .84));
  }
  100%{
    opacity:0;
    filter:none;
    transform:translate3d(calc(-50% + var(--tx) * 1.42),calc(-50% + var(--ty) * 1.42),0) scale(calc(var(--end-scale) + .62)) rotate(var(--rot));
  }
}

@keyframes caseBtnTextLoop{
  0%{
    opacity:0;
    transform:translateY(18px);
  }
  7%,28%{
    opacity:1;
    transform:translateY(0);
  }
  35%,100%{
    opacity:0;
    transform:translateY(-18px);
  }
}

@keyframes contactPatternLeft{
  from{transform:translate3d(0,0,0) scale(1.4)}
  to{transform:translate3d(-104px,52px,0) scale(1.4)}
}

@keyframes contactPatternRight{
  from{transform:translate3d(-104px,52px,0) scale(1.4)}
  to{transform:translate3d(0,0,0) scale(1.4)}
}

@keyframes contactBrownIn{
  from{
    opacity:0;
    transform:translate(0,160px);
  }
  to{
    opacity:.94;
    transform:translate(0,0);
  }
}

@keyframes contactBlackIn{
  from{
    opacity:0;
    transform:translate(120px,-72px) scale(.98);
  }
  to{
    opacity:1;
    transform:translate(0,0) scale(1);
  }
}

@keyframes contactOrangeTopIn{
  from{
    opacity:0;
    transform:translate(240px,-180px);
  }
  to{
    opacity:1;
    transform:translate(0,0);
  }
}

@keyframes contactOrangeLeftIn{
  from{
    opacity:0;
    transform:translate(-180px,132px);
  }
  to{
    opacity:1;
    transform:translate(0,0);
  }
}

@keyframes contactContentIn{
  from{
    opacity:0;
    transform:translate3d(-28px,-48%,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,-50%,0);
  }
}

@keyframes contactTextIn{
  from{
    opacity:0;
    transform:translate3d(-36px,18px,0) scale(.96);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:none;
  }
}

@keyframes contactPhoneIn{
  from{
    opacity:0;
    transform:translate3d(80px,36px,0) scale(.94);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:none;
  }
}

@keyframes contactOrbIn{
  from{
    opacity:0;
    transform:translate3d(42px,22px,0) scale(.7);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:none;
  }
}

@keyframes contactFloatTopIn{
  from{
    opacity:0;
    transform:translate3d(70px,-18px,0) scale(.92);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:none;
  }
}

@keyframes contactFloatLeftIn{
  from{
    opacity:0;
    transform:translate3d(-62px,26px,0) scale(.92);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:none;
  }
}

@keyframes frameworkShotRise{
  0%{
    opacity:0;
    transform:translate3d(-50%,220px,0) scale(.98);
  }
  58%{
    opacity:1;
  }
  100%{
    opacity:1;
    transform:translate3d(-50%,0,0) scale(1);
  }
}

@keyframes frameworkRainBeamShow{
  from{opacity:0}
  to{opacity:1}
}

@keyframes frameworkRainTextUp{
  0%{
    opacity:0;
    transform:translateY(34px);
  }
  100%{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes frameworkCleanGlow{
  0%{
    opacity:.52;
    transform:translate3d(0,0,0) scale(1);
  }
  100%{
    opacity:.86;
    transform:translate3d(0,10px,0) scale(1.04);
  }
}

@keyframes cooperationSliceFade{
  from{
    opacity:0;
    transform:translate3d(0,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationSliceFromLeft{
  from{
    opacity:0;
    transform:translate3d(-34vw,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationSliceFromTop{
  from{
    opacity:0;
    transform:translate3d(0,-34vh,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationSliceFromRight{
  from{
    opacity:0;
    transform:translate3d(34vw,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationCopyPop{
  from{
    opacity:0;
    transform:translate3d(-50%,-50%,0) scale(.8);
  }
  to{
    opacity:1;
    transform:translate3d(-50%,-50%,0) scale(1);
  }
}

@keyframes cooperationCopyFromLeft{
  from{
    opacity:0;
    transform:translate3d(calc(-50% - 56px),-50%,0) scale(.8);
  }
  to{
    opacity:1;
    transform:translate3d(-50%,-50%,0) scale(1);
  }
}

@keyframes cooperationCopyFromTop{
  from{
    opacity:0;
    transform:translate3d(-50%,calc(-50% - 56px),0) scale(.8);
  }
  to{
    opacity:1;
    transform:translate3d(-50%,-50%,0) scale(1);
  }
}

@keyframes cooperationCopyFromRight{
  from{
    opacity:0;
    transform:translate3d(calc(-50% + 56px),-50%,0) scale(.8);
  }
  to{
    opacity:1;
    transform:translate3d(-50%,-50%,0) scale(1);
  }
}

@keyframes cooperationArrowLeft{
  from{
    transform:translate3d(0,0,0);
  }
  to{
    transform:translate3d(-140px,0,0);
  }
}

@keyframes cooperationArrowRight{
  from{
    transform:translate3d(-140px,0,0);
  }
  to{
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationDetailFade{
  from{
    opacity:0;
    transform:translate3d(0,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationRoleWrapIn{
  from{
    opacity:0;
    transform:translate3d(0,0,0) scale(.92);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
  }
}

@keyframes cooperationDetailTitleIn{
  from{
    opacity:0;
    transform:translate3d(0,0,0) scale(.85);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
  }
}

@keyframes cooperationUiCardIn{
  from{
    opacity:0;
    transform:translate3d(0,70px,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes channelGridMove{
  from{
    transform:skewX(-12deg) translate3d(-20px,0,0);
  }
  to{
    transform:skewX(-12deg) translate3d(22px,22px,0);
  }
}

@keyframes channelLineGrow{
  from{
    height:0;
    opacity:0;
  }
  to{
    height:194px;
    opacity:1;
  }
}

@keyframes channelNodeIn{
  from{
    opacity:0;
    transform:translate3d(-26px,0,0);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:none;
  }
}

@keyframes channelOrbitIn{
  from{
    opacity:0;
    transform:scale(.82) rotate(-18deg);
    filter:none;
  }
  to{
    opacity:1;
    transform:scale(1) rotate(0deg);
    filter:none;
  }
}

@keyframes channelOrbitPulse{
  0%,100%{
    box-shadow:0 0 34px rgba(243,94,96,.18);
  }
  50%{
    box-shadow:0 0 54px rgba(243,94,96,.32);
  }
}

@keyframes channelOrbitRotate{
  from{
    transform:rotate(0deg);
  }
  to{
    transform:rotate(360deg);
  }
}

@keyframes channelBarGrow{
  from{
    transform:scaleX(0);
    opacity:.35;
  }
  to{
    transform:scaleX(1);
    opacity:1;
  }
}

@keyframes channelBgIn{
  from{
    opacity:0;
    filter:none;
  }
  to{
    opacity:1;
    filter:none;
  }
}

@keyframes channelBgScan{
  from{
    transform:skewX(-18deg) translate3d(-60px,-40px,0);
  }
  to{
    transform:skewX(-18deg) translate3d(60px,46px,0);
  }
}

@keyframes channelBgParticles{
  from{
    transform:translate3d(0,0,0) scale(1);
  }
  to{
    transform:translate3d(-120px,90px,0) scale(1.02);
  }
}

@keyframes channelDataLine{
  0%{
    opacity:0;
    transform:translate3d(-120%,0,0) skewX(-24deg);
  }
  18%{
    opacity:1;
  }
  70%{
    opacity:.72;
  }
  100%{
    opacity:0;
    transform:translate3d(145%,0,0) skewX(-24deg);
  }
}

@keyframes channelPersonIn{
  from{
    opacity:0;
    transform:translate3d(70px,-50%,0) scale(.96);
    filter:drop-shadow(0 34px 56px rgba(0,0,0,.56)) drop-shadow(0 0 0 rgba(243,94,96,0));
  }
  to{
    opacity:.82;
    transform:translate3d(0,-50%,0) scale(1);
    filter:drop-shadow(0 34px 56px rgba(0,0,0,.56)) drop-shadow(0 0 42px rgba(243,94,96,.18));
  }
}

@keyframes channelPersonBreath{
  0%,100%{
    transform:translate3d(0,-50%,0) scale(1);
  }
  50%{
    transform:translate3d(0,calc(-50% - 8px),0) scale(1.012);
  }
}

@keyframes customBgIn{
  from{
    opacity:0;
    filter:none;
  }
  to{
    opacity:1;
    filter:none;
  }
}

@keyframes customBgMatrix{
  from{
    transform:skewX(-16deg) translate3d(-70px,-46px,0);
  }
  to{
    transform:skewX(-16deg) translate3d(70px,46px,0);
  }
}

@keyframes customBgDots{
  from{
    transform:translate3d(0,0,0);
  }
  to{
    transform:translate3d(-130px,100px,0);
  }
}

@keyframes customFloatChip{
  0%{
    opacity:0;
    transform:translate3d(70vw,0,0) skewX(-10deg);
  }
  18%{
    opacity:.68;
  }
  78%{
    opacity:.42;
  }
  100%{
    opacity:0;
    transform:translate3d(-76vw,-34px,0) skewX(-10deg);
  }
}

@keyframes customVisualIn{
  from{
    opacity:0;
    transform:translate3d(64px,-50%,0) scale(.95);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,-50%,0) scale(1);
    filter:none;
  }
}

@keyframes customPersonBreath{
  0%,100%{
    transform:translate3d(-50%,-50%,0) scale(1);
  }
  50%{
    transform:translate3d(-50%,calc(-50% - 8px),0) scale(1.012);
  }
}

@keyframes customPersonGlow{
  0%,100%{
    opacity:.72;
    transform:translateX(-50%) scale(.96);
  }
  50%{
    opacity:1;
    transform:translateX(-50%) scale(1.06);
  }
}

@keyframes customOrbitSpin{
  from{
    transform:translate(-50%,-50%) rotate(0deg);
  }
  to{
    transform:translate(-50%,-50%) rotate(360deg);
  }
}

@keyframes customDocIn{
  from{
    opacity:0;
    transform:translate3d(70px,34px,0) rotate(8deg) scale(.92);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
    filter:none;
  }
}

@keyframes customDocFloat{
  0%,100%{
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
  }
  50%{
    transform:translate3d(0,-10px,0) rotate(1.4deg) scale(1.015);
  }
}

@keyframes customCardScan{
  from{
    background-position:0 0,0 0,-100% 0;
  }
  to{
    background-position:44px 44px,44px 44px,100% 0;
  }
}

@keyframes customDevLineGrow{
  from{
    height:0;
    opacity:0;
  }
  to{
    height:194px;
    opacity:1;
  }
}

@keyframes customDevNodeIn{
  from{
    opacity:0;
    transform:translate3d(-24px,0,0);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:none;
  }
}

@keyframes customLicenseIn{
  from{
    opacity:0;
    transform:translate3d(36px,0,0);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:none;
  }
}

@keyframes customLicensePulse{
  0%,100%{
    box-shadow:0 0 34px rgba(243,94,96,.16);
  }
  50%{
    box-shadow:0 0 54px rgba(243,94,96,.3);
  }
}

@keyframes customLicenseSpin{
  from{
    transform:rotate(0deg);
  }
  to{
    transform:rotate(360deg);
  }
}

@keyframes customLicenseItemIn{
  from{
    opacity:0;
    transform:translate3d(18px,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes customBlueprintGrid{
  from{
    transform:translate3d(0,0,0);
  }
  to{
    transform:translate3d(34px,34px,0);
  }
}

@keyframes buildModuleIn{
  from{
    opacity:0;
    transform:translate3d(0,22px,0) scale(.94);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:none;
  }
}

@keyframes buildModuleSweep{
  0%,55%{
    left:-44%;
    opacity:0;
  }
  68%{
    opacity:1;
  }
  100%{
    left:116%;
    opacity:0;
  }
}

@keyframes buildProgressRun{
  0%{
    width:0;
    opacity:.3;
  }
  45%{
    width:72%;
    opacity:1;
  }
  75%,100%{
    width:100%;
    opacity:.72;
  }
}

@keyframes terminalScreenIn{
  from{
    opacity:0;
    transform:translate3d(34px,0,0);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:none;
  }
}

@keyframes licenseDocSlideIn{
  from{
    opacity:0;
    transform:translate3d(42px,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes readyBgIn{
  from{
    opacity:0;
    filter:none;
  }
  to{
    opacity:1;
    filter:none;
  }
}

@keyframes readyBgGrid{
  from{
    transform:translate3d(0,0,0);
  }
  to{
    transform:translate3d(76px,76px,0);
  }
}

@keyframes readyBgStars{
  from{
    transform:translate3d(0,0,0);
  }
  to{
    transform:translate3d(-126px,94px,0);
  }
}

@keyframes readyPosterFloat{
  0%,100%{
    transform:translate3d(0,0,0) rotate(var(--r)) scale(var(--s));
    opacity:.12;
  }
  50%{
    transform:translate3d(0,-18px,0) rotate(calc(var(--r) + 2deg)) scale(calc(var(--s) + .04));
    opacity:.26;
  }
}

@keyframes readyVisualIn{
  from{
    opacity:0;
    transform:translate3d(54px,0,0) scale(.96);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:none;
  }
}

@keyframes readyCardWallIn{
  from{
    opacity:0;
    transform:translate3d(0,34px,0) rotateY(-20deg) scale(.92);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) rotateY(0deg) scale(1);
    filter:none;
  }
}

@keyframes readyCardWallFloat{
  0%,100%{
    transform:translate3d(0,0,0) rotateY(0deg) scale(1);
  }
  50%{
    transform:translate3d(0,-10px,0) rotateY(5deg) scale(1.012);
  }
}

@keyframes readySealStamp{
  from{
    opacity:0;
    transform:scale(.6) rotate(-18deg);
    filter:none;
  }
  72%{
    opacity:1;
    transform:scale(1.08) rotate(-8deg);
    filter:none;
  }
  to{
    opacity:1;
    transform:scale(1) rotate(-10deg);
    filter:none;
  }
}

@keyframes readySealPulse{
  0%,100%{
    box-shadow:0 0 34px rgba(243,94,96,.22),inset 0 0 26px rgba(243,94,96,.12);
  }
  50%{
    box-shadow:0 0 56px rgba(243,94,96,.34),inset 0 0 36px rgba(243,94,96,.18);
  }
}

@keyframes readyCardScan{
  from{
    background-position:0 0,0 0,0 0;
  }
  to{
    background-position:48px 48px,48px 48px,0 0;
  }
}

@keyframes readyScreenIn{
  from{
    opacity:0;
    transform:translate3d(0,22px,0);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:none;
  }
}

@keyframes readyMiniIn{
  from{
    opacity:0;
    transform:translate3d(0,18px,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes readyLicenseItemIn{
  from{
    opacity:0;
    transform:translate3d(38px,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationPagerIn{
  from{
    opacity:0;
    transform:translate3d(0,22px,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationDetailTextOut{
  from{
    opacity:1;
    transform:translate3d(0,0,0);
  }
  to{
    opacity:0;
    transform:translate3d(-86px,0,0);
  }
}

@keyframes cooperationDetailTextIn{
  from{
    opacity:0;
    transform:translate3d(86px,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes cooperationRoleOut{
  from{
    opacity:1;
    transform:translate3d(0,0,0) translateX(-50%) scale(1);
  }
  to{
    opacity:0;
    transform:translate3d(110px,0,0) translateX(-50%) scale(.98);
  }
}

@keyframes cooperationRoleIn{
  from{
    opacity:0;
    transform:translate3d(110px,0,0) translateX(-50%) scale(.98);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0) translateX(-50%) scale(1);
  }
}

@keyframes cooperationRoleBreath{
  0%,100%{
    transform:translate3d(0,0,0) translateX(-50%) scale(.995);
  }
  50%{
    transform:translate3d(0,0,0) translateX(-50%) scale(1.005);
  }
}

@keyframes coopShowLineMove{
  to{stroke-dashoffset:-520}
}

@keyframes coopShowSpin{
  to{transform:rotate(360deg)}
}

@keyframes coopShowCorePulse{
  0%,100%{opacity:.68;transform:scale(.96)}
  50%{opacity:1;transform:scale(1.04)}
}

@keyframes coopShowCoreFloat{
  0%,100%{transform:translate(-50%,-50%) scale(1)}
  50%{transform:translate(-50%,calc(-50% - 8px)) scale(1.018)}
}

@keyframes coopShowDotBlink{
  0%,100%{opacity:.28}
  50%{opacity:.9}
}

@keyframes qualificationTextIn{
  from{
    opacity:0;
    transform:translate3d(0,24px,0);
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:none;
  }
}

@keyframes qualificationRedAura{
  0%{
    opacity:.56;
    transform:translate3d(-3%,2%,0) scale(1);
  }
  50%{
    opacity:.82;
    transform:translate3d(2%,-1%,0) scale(1.05);
  }
  100%{
    opacity:.68;
    transform:translate3d(4%,3%,0) scale(1.1);
  }
}

@keyframes qualificationGridDrift{
  from{
    transform:translate3d(0,0,0) skewX(-14deg);
  }
  to{
    transform:translate3d(-156px,78px,0) skewX(-14deg);
  }
}

@keyframes qualificationPulseGlow{
  0%,100%{
    opacity:.5;
    transform:scale(.96);
  }
  50%{
    opacity:.9;
    transform:scale(1.06);
  }
}

@keyframes qualificationCardHaloSpin{
  from{
    transform:translate(-50%,-50%) rotate(0deg);
  }
  to{
    transform:translate(-50%,-50%) rotate(360deg);
  }
}

@keyframes qualificationBgCardFloat{
  0%,100%{
    opacity:.14;
    filter:none;
    transform:translate(-50%,-50%) translate3d(0,0,0) rotate(var(--r)) scale(var(--s));
  }
  45%{
    opacity:.3;
    filter:none;
    transform:translate(-50%,-50%) translate3d(18px,-22px,0) rotate(calc(var(--r) + 6deg)) scale(calc(var(--s) + .05));
  }
  72%{
    opacity:.2;
    transform:translate(-50%,-50%) translate3d(-10px,12px,0) rotate(calc(var(--r) - 3deg)) scale(var(--s));
  }
}

@keyframes qualificationNodeIn{
  from{
    opacity:0;
    transform:translate3d(-50%,92px,0) scale(.72);
    filter:none;
  }
  62%{
    opacity:.72;
    filter:none;
  }
  to{
    opacity:1;
    transform:translate3d(-50%,0,0) scale(1);
    filter:none;
  }
}

@keyframes qualificationDeckIn{
  from{
    opacity:0;
    transform:translateX(-50%) rotate(-6deg) scale(.74);
    filter:none;
  }
  to{
    opacity:1;
    transform:translateX(-50%) rotate(-6deg) scale(1);
    filter:none;
  }
}

@keyframes qualificationDeckPulse{
  0%,100%{
    transform:translateX(-50%) rotate(-6deg) scale(1);
    filter:drop-shadow(0 0 0 rgba(255,126,31,0));
  }
  50%{
    transform:translateX(-50%) rotate(-3deg) scale(1.055);
    filter:drop-shadow(0 0 24px rgba(255,126,31,.34));
  }
}

@keyframes qualificationCardDeal{
  0%{
    opacity:0;
    transform:translate3d(-50%,calc(-50% + 248px),0) rotate(-18deg) scale(.42) rotateY(68deg);
    filter:none;
  }
  22%{
    opacity:.95;
    transform:translate3d(-50%,calc(-50% + 138px),0) rotate(-6deg) scale(.66) rotateY(28deg);
    filter:none;
  }
  62%{
    opacity:1;
    transform:translate3d(calc(-50% + var(--x)),calc(-50% + var(--y)),0) rotate(var(--r)) scale(calc(var(--s) + .08)) rotateY(0);
    filter:none;
  }
  100%{
    opacity:1;
    transform:translate3d(calc(-50% + var(--x)),calc(-50% + var(--y)),0) rotate(var(--r)) scale(var(--s)) rotateY(0);
    filter:none;
  }
}

@keyframes railPulse{
  0%,100%{text-shadow:0 0 0 rgba(255,143,31,0);opacity:.62}
  50%{text-shadow:0 0 16px rgba(255,143,31,.72);opacity:1}
}

@keyframes railScan{
  0%,100%{clip-path:inset(0 0 0 0);text-shadow:0 0 0 rgba(255,255,255,0)}
  45%{clip-path:inset(0 0 42% 0);text-shadow:0 8px 10px rgba(255,255,255,.38)}
  55%{clip-path:inset(42% 0 0 0);text-shadow:0 -8px 10px rgba(255,255,255,.38)}
}

@keyframes railOrbit{
  0%,100%{transform:translateY(-50%) scale(1)}
  35%{transform:translate(-8px,-50%) scale(.75)}
  70%{transform:translate(3px,-50%) scale(1.18)}
}

@keyframes railSpark{
  0%,82%,100%{opacity:.58;text-shadow:none}
  86%{opacity:1;text-shadow:0 0 10px rgba(255,255,255,.72),0 0 18px rgba(255,143,31,.58)}
  90%{opacity:.3}
  94%{opacity:1;text-shadow:0 0 16px rgba(255,143,31,.78)}
}

@keyframes railWave{
  0%,100%{transform:translateX(0)}
  50%{transform:translateX(-4px)}
}

.desktop-float-toolbar{
  position:fixed;
  right:34px;
  top:56%;
  z-index:2147483647;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:62px;
  padding:10px 0;
  overflow:visible;
  border-radius:20px;
  border:1px solid rgba(243,94,96,.42);
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0) 24%),
    linear-gradient(180deg,rgba(34,10,16,.92),rgba(8,10,16,.94));
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06),
    0 18px 38px rgba(0,0,0,.42),
    0 0 26px rgba(243,94,96,.22);
  backdrop-filter:blur(18px);
  transform:translateY(-50%);
  pointer-events:auto;
}

.desktop-home-page .desktop-float-toolbar{
  right:18px;
  top:87%;
}

.desktop-float-toolbar:before{
  content:"";
  position:absolute;
  inset:8px;
  z-index:-1;
  border-radius:15px;
  background:
    linear-gradient(90deg,transparent,rgba(243,94,96,.34),transparent) 50% 0/34px 1px no-repeat,
    linear-gradient(90deg,transparent,rgba(243,94,96,.24),transparent) 50% 100%/34px 1px no-repeat;
  pointer-events:none;
}

.desktop-float-item{
  appearance:none;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:62px;
  height:54px;
  padding:0;
  border:0;
  color:rgba(255,255,255,.72);
  background:transparent;
  text-decoration:none;
  outline:none;
  cursor:pointer;
}

.desktop-float-item + .desktop-float-item:before{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(243,94,96,.34),rgba(255,255,255,.12),transparent);
}

.desktop-float-item .float-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:14px;
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease,color .2s ease;
}

.desktop-float-item svg{
  display:block;
  width:30px;
  height:30px;
  fill:currentColor;
}

.desktop-float-wechat{
  color:#26e56f;
}

.desktop-float-phone{
  color:#f35e60;
}

.desktop-float-top{
  color:rgba(255,255,255,.62);
}

.desktop-float-item:hover .float-icon,
.desktop-float-item:focus-within .float-icon,
.desktop-float-top:hover .float-icon{
  color:#fff;
  background:linear-gradient(135deg,rgba(243,94,96,.92),rgba(141,24,42,.88));
  box-shadow:0 0 20px rgba(243,94,96,.42),inset 0 0 0 1px rgba(255,255,255,.16);
  transform:translateY(-1px) scale(1.06);
}

.desktop-float-pop{
  position:absolute;
  right:76px;
  top:50%;
  z-index:2147483647;
  width:max-content;
  min-width:210px;
  padding:16px;
  color:#fff;
  border-radius:18px;
  border:1px solid rgba(243,94,96,.46);
  background:
    radial-gradient(circle at 20% 0,rgba(243,94,96,.2),transparent 34%),
    linear-gradient(180deg,rgba(22,9,14,.96),rgba(7,9,15,.96));
  box-shadow:0 24px 60px rgba(0,0,0,.46),0 0 34px rgba(243,94,96,.22);
  opacity:0;
  visibility:hidden;
  transform:translate3d(12px,-50%,0) scale(.96);
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease;
  pointer-events:none;
}

.desktop-float-pop:after{
  content:"";
  position:absolute;
  right:-7px;
  top:50%;
  width:14px;
  height:14px;
  background:#120a10;
  border-right:1px solid rgba(243,94,96,.46);
  border-top:1px solid rgba(243,94,96,.46);
  transform:translateY(-50%) rotate(45deg);
}

.desktop-float-item:hover .desktop-float-pop,
.desktop-float-item:focus-within .desktop-float-pop{
  opacity:1;
  visibility:visible;
  transform:translate3d(0,-50%,0) scale(1);
  pointer-events:auto;
}

.desktop-float-pop strong{
  display:block;
  margin:0 0 12px;
  color:#fff;
  font-size:15px;
  line-height:1;
  font-weight:900;
  letter-spacing:.5px;
  text-shadow:0 0 18px rgba(243,94,96,.34);
}

.float-qr-grid{
  display:grid;
  grid-template-columns:repeat(2,116px);
  gap:12px;
}

.float-qr-grid span{
  display:grid;
  gap:8px;
  justify-items:center;
}

.float-qr-grid img{
  display:block;
  width:108px;
  height:108px;
  padding:6px;
  object-fit:contain;
  border-radius:10px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
}

.float-qr-grid b{
  color:rgba(255,255,255,.86);
  font-size:12px;
  line-height:1;
  font-weight:900;
}

.desktop-float-phone-pop{
  min-width:238px;
}

.desktop-float-phone-pop p{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:10px 0 0;
  color:#fff;
  font-size:14px;
  line-height:1;
}

.desktop-float-phone-pop span{
  color:rgba(255,255,255,.62);
  font-weight:800;
}

.desktop-float-phone-pop b{
  color:#fff;
  font-family:Consolas,"SFMono-Regular",monospace;
  font-size:16px;
  font-weight:900;
}

.desktop-float-phone-pop small{
  display:block;
  margin-top:12px;
  padding-top:12px;
  color:rgba(255,255,255,.58);
  font-size:12px;
  line-height:1;
  border-top:1px solid rgba(243,94,96,.2);
}

/* 游戏产品页图片按原图色彩展示：去掉压暗滤镜和图片遮罩 */
.game-product-page .game-product-visual:after{
  display:none !important;
  background:none !important;
}

.game-product-page .game-product-visual img,
.game-product-page .game-product-tabs button img,
.game-product-page .game-case-card img,
.game-product-page .game-case-card:hover img,
.game-product-page .game-case-modal img{
  opacity:1 !important;
  filter:none !important;
}

.game-product-page .game-case-card:hover img{
  transform:scale(1.05);
}

.game-product-page .game-product-hero.is-switching .game-product-visual img{
  animation:productHeroImageRawIn .62s cubic-bezier(.16,.78,.22,1) both;
}

.game-product-page .game-case-card.is-portrait{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
}

.game-product-page .game-case-card.is-portrait img{
  width:220px !important;
  height:330px !important;
  max-width:100%;
  object-fit:cover;
  object-position:center;
  margin:0 auto;
}

.game-product-page .game-case-block--featured .game-case-card.is-portrait{
  min-height:380px;
  padding:18px 0 32px;
}

.game-product-page .game-case-block--featured .game-case-page--landscape{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.game-product-page .game-case-block--featured .game-case-page--landscape .game-case-card{
  min-height:330px;
  padding-bottom:50px;
}

.game-product-page .game-case-block--featured .game-case-page--landscape .game-case-card img{
  width:100% !important;
  height:427px !important;
  object-fit:cover;
}

.game-product-page .game-case-block--featured .game-case-page--large-portrait{
  grid-template-columns:repeat(4,minmax(0,1fr));
  justify-items:center;
  align-items:start;
}

.game-product-page .game-case-block--featured .game-case-page--large-portrait .game-case-card{
  width:360px;
  min-height:408px;
  padding:18px 0 32px;
}

.game-product-page .game-case-block--featured .game-case-page--large-portrait .game-case-card img{
  width:220px !important;
  height:408px !important;
  object-fit:cover;
}

.game-product-page .game-case-block--featured .game-case-page--large-portrait .game-case-card:only-child{
  grid-column:2;
}

@keyframes productHeroImageRawIn{
  from{opacity:1;transform:scale(1.07) translateX(18px)}
  to{opacity:1;transform:scale(1.02) translateX(0)}
}

/* 全站清晰度统一：图片保留原图色彩，文字去掉发光/阴影 */
body img,
body picture,
body video{
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}

body,
body *{
  text-shadow:none !important;
}

body :is(h1,h2,h3,h4,h5,h6,p,a,button,span,b,strong,em,i,li,dt,dd,label,input,textarea,small){
  filter:none !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

.intro-media-slide:after,
.game-product-page .game-product-hero:before,
.game-product-page .game-product-visual:after,
.game-product-page .game-case-card:before,
.game-product-page .game-case-card:after,
.game-card:after,
.case-cover:before,
.case-cover:after,
.about-company-image:before,
.about-cert-track article:before,
.about-cert-track article:after,
.cooperation-show-card:before,
.cooperation-show-card:after{
  display:none !important;
  background:none !important;
  opacity:0 !important;
}

/* 电脑版首页联系方式右侧 logo：只保留图片，去掉原圆球/发光/伪元素效果 */
.desktop-home-page .contact-orb{
  width:214px;
  height:auto;
  border-radius:0;
  background:none !important;
  box-shadow:none !important;
  overflow:visible;
  opacity:1 !important;
}

.desktop-home-page .contact-orb:before,
.desktop-home-page .contact-orb:after{
  display:none !important;
  content:none !important;
  background:none !important;
  box-shadow:none !important;
}

.desktop-home-page .contact-orb img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  opacity:1 !important;
  filter:none !important;
}

.hero-tab-panel[data-panel="contact"].is-active.is-contact-ready .contact-orb{
  animation:none !important;
}

/* 电脑版首页底部信息全屏面板 */
.hero-tab-panel[data-panel="footer"].is-active{
  z-index:12 !important;
}

.home-footer-scene{
  background:#020408;
  color:#fff;
  overflow:visible;
}

.home-footer-gallery{
  position:absolute;
  inset:-6vh -8vw 32vh;
  z-index:0;
  overflow:hidden;
  opacity:.56;
  transform:translateZ(0);
}

.home-footer-gallery:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(2,4,8,.16),rgba(2,4,8,.44) 55%,#020408 100%),
    radial-gradient(circle at 52% 82%,rgba(243,94,96,.24),transparent 34%),
    linear-gradient(90deg,rgba(2,4,8,.72),transparent 24%,transparent 76%,rgba(2,4,8,.74));
  pointer-events:none;
}

.home-footer-row{
  position:static;
  display:flex;
  align-items:center;
  gap:22px;
  width:max-content;
  will-change:transform;
  flex:0 0 auto;
  animation:none;
}

.home-footer-marquee-track{
  position:absolute;
  left:0;
  display:flex;
  align-items:center;
  width:max-content;
  will-change:transform;
  animation:homeFooterMarquee 46s linear infinite;
}

.home-footer-marquee-track.home-footer-row-a{
  top:0;
  animation-duration:54s;
}

.home-footer-marquee-track.home-footer-row-b{
  top:178px;
  left:-160px;
  animation-name:homeFooterMarqueeReverse;
  animation-duration:62s;
}

.home-footer-marquee-track.home-footer-row-c{
  top:410px;
  left:-60px;
  animation-duration:58s;
}

.home-footer-row.is-gallery-clone{
  pointer-events:none;
}

.home-footer-row img{
  flex:0 0 auto;
  object-fit:cover;
  object-position:center;
  opacity:.78;
  border:1px solid rgba(255,255,255,.08);
  background:#101217;
  box-shadow:0 18px 38px rgba(0,0,0,.3);
}

.home-footer-row img.is-wide{
  width:320px;
  height:180px;
}

.home-footer-row img.is-tall{
  width:154px;
  height:218px;
}

.home-footer-row-b img.is-wide{
  width:340px;
  height:192px;
}

.home-footer-row-b img.is-tall{
  width:166px;
  height:236px;
}

.home-footer-row-c img.is-wide{
  width:300px;
  height:170px;
}

.home-footer-row-c img.is-tall{
  width:150px;
  height:214px;
}

.home-footer-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.42) 43%,#020408 67%,#020408 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.055) 0 1px,transparent 1px 150px);
  pointer-events:none;
}

.home-footer-brand{
  position:absolute;
  left:24.8vw;
  right:5.8vw;
  top:51%;
  z-index:2;
  transform:translateY(-50%);
  white-space:nowrap;
  pointer-events:none;
}

.home-footer-brand span{
  display:block;
  margin:0 0 14px 8px;
  color:rgba(243,94,96,.86);
  font-family:Consolas,"Courier New",monospace;
  font-size:15px;
  line-height:1;
  font-weight:900;
  letter-spacing:8px;
}

.home-footer-brand h2{
  margin:0;
  color:#f4f4f4;
  font-size:clamp(118px,12vw,226px);
  line-height:.82;
  font-weight:1000;
  letter-spacing:-8px;
  text-transform:uppercase;
  font-family:Impact,"Arial Black","Microsoft YaHei",sans-serif;
  -webkit-text-stroke:2px rgba(255,255,255,.16);
  background:linear-gradient(180deg,#fff 0%,#f0f0f0 44%,#bfa89d 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.home-footer-panel{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:3;
  display:grid;
  grid-template-columns:minmax(210px,280px) 58px minmax(420px,1fr) minmax(260px,360px);
  align-items:center;
  gap:48px;
  min-height:296px;
  padding:34px 10vw 48px;
  background:#020408;
  border-top:1px solid rgba(243,94,96,.22);
  box-shadow:0 -18px 60px rgba(243,94,96,.08);
  overflow:visible;
}

.home-footer-channel{
  position:relative;
  z-index:30;
  display:grid;
  gap:14px;
  padding:28px 34px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.06);
  overflow:visible;
}

.home-footer-channel b{
  margin-bottom:6px;
  color:#fff;
  font-size:20px;
  font-weight:900;
}

.home-footer-channel span{
  color:rgba(255,255,255,.78);
  font-size:16px;
  line-height:1;
}

.home-footer-channel > span{
  display:none;
}

.home-footer-contact-item{
  position:relative;
  z-index:50;
  width:168px;
}

.home-footer-contact-main{
  display:flex !important;
  align-items:center;
  gap:10px;
  height:38px;
  padding:0 13px;
  color:rgba(255,255,255,.84) !important;
  font-size:16px !important;
  line-height:38px !important;
  border-radius:9px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
  cursor:pointer;
  transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease;
}

.home-footer-contact-item:hover,
.home-footer-contact-item:focus-within{
  z-index:40;
}

.home-footer-contact-item:hover .home-footer-contact-main,
.home-footer-contact-item:focus-within .home-footer-contact-main{
  color:#fff !important;
  transform:translateY(-2px);
  background:rgba(243,94,96,.16);
  border-color:rgba(243,94,96,.42);
}

.home-footer-icon{
  position:relative;
  flex:0 0 20px;
  width:20px;
  height:20px;
  color:#f35e60;
}

.home-footer-icon-img{
  display:block;
  object-fit:contain;
  filter:none !important;
}

.home-footer-icon:before,
.home-footer-icon:after{
  content:"";
  position:absolute;
  box-sizing:border-box;
}

.icon-wechat:before{
  left:1px;
  top:3px;
  width:13px;
  height:10px;
  border:2px solid currentColor;
  border-radius:50%;
}

.icon-wechat:after{
  right:1px;
  bottom:3px;
  width:12px;
  height:9px;
  border:2px solid rgba(255,255,255,.78);
  border-radius:50%;
  box-shadow:-6px -1px 0 -4px currentColor;
}

.icon-qq:before{
  inset:2px 3px 1px;
  border:2px solid currentColor;
  border-radius:50% 50% 46% 46%;
  background:radial-gradient(circle at 40% 42%,currentColor 0 1.3px,transparent 1.6px),
    radial-gradient(circle at 62% 42%,currentColor 0 1.3px,transparent 1.6px);
}

.icon-qq:after{
  left:2px;
  right:2px;
  bottom:0;
  height:5px;
  border-left:2px solid rgba(255,255,255,.78);
  border-right:2px solid rgba(255,255,255,.78);
  border-radius:0 0 8px 8px;
}

.icon-phone:before{
  inset:2px 5px;
  border:2px solid currentColor;
  border-top-width:4px;
  border-bottom-width:4px;
  border-radius:5px;
  transform:rotate(-18deg);
}

.icon-phone:after{
  left:8px;
  bottom:4px;
  width:4px;
  height:2px;
  border-radius:99px;
  background:rgba(255,255,255,.82);
  transform:rotate(-18deg);
}

.home-footer-contact-pop{
  position:absolute;
  left:191px;
  top:calc(100% + -105px);
  z-index:200;
  min-width:230px;
  padding:14px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(0,8px,0);
  border-radius:12px;
  background:rgba(5,7,12,.96);
  border:1px solid rgba(243,94,96,.28);
  box-shadow:0 18px 48px rgba(0,0,0,.46),0 0 22px rgba(243,94,96,.16);
  transition:opacity .2s ease,visibility .2s ease,transform .2s ease;
}

.home-footer-contact-pop:before{
  content:"";
  position:absolute;
  left:22px;
  top:-6px;
  width:10px;
  height:10px;
  transform:rotate(45deg);
  background:rgba(5,7,12,.96);
  border-left:1px solid rgba(243,94,96,.28);
  border-top:1px solid rgba(243,94,96,.28);
}

.home-footer-contact-item:hover .home-footer-contact-pop,
.home-footer-contact-item:focus-within .home-footer-contact-pop{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate3d(0,0,0);
}

.home-footer-contact-pop p{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0;
  padding:9px 8px;
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.home-footer-contact-pop p:last-child{
  border-bottom:0;
}

.home-footer-contact-pop em{
  color:rgba(255,255,255,.62);
  font-size:13px;
  font-style:normal;
}

.home-footer-contact-pop strong{
  color:#fff;
  font-family:Consolas,"Courier New",monospace;
  font-size:16px;
  font-weight:900;
  letter-spacing:.3px;
}

.home-footer-qr-pop{
  display:flex;
  gap:12px;
  min-width:264px;
}

.home-footer-qr-pop span{
  display:grid !important;
  gap:8px;
  justify-items:center;
  color:#fff !important;
}

.home-footer-qr-pop img{
  display:block;
  width:96px;
  height:96px;
  object-fit:contain;
  border-radius:8px;
  background:#fff;
  padding:5px;
}

.home-footer-divider{
  display:block;
  width:1px;
  height:205px;
  margin:0 auto;
  background:linear-gradient(180deg,rgba(243,94,96,.9),rgba(255,255,255,.18),rgba(243,94,96,.72));
  box-shadow:18px 0 0 rgba(255,255,255,.1),24px 0 0 rgba(255,255,255,.04);
}

.home-footer-record{
  display:grid;
  gap:18px;
  max-width:620px;
  padding:10px 0;
}

.home-footer-record p{
  margin:0;
  color:rgba(255,255,255,.62);
  font-size:15px;
  line-height:1.55;
}

.home-footer-logo{
  justify-self:end;
  display:flex;
  align-items:center;
  justify-content:center;
  width:280px;
  min-height:112px;
}

.home-footer-logo img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}

.hero-tab-panel[data-panel="footer"].is-active .home-footer-brand{
  animation:homeFooterBrandIn .7s cubic-bezier(.16,.84,.25,1) both;
}

.hero-tab-panel[data-panel="footer"].is-active .home-footer-panel{
  animation:homeFooterPanelIn .62s cubic-bezier(.16,.84,.25,1) .12s both;
}

@keyframes homeFooterMarquee{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

@keyframes homeFooterMarqueeReverse{
  from{transform:translate3d(-50%,0,0)}
  to{transform:translate3d(0,0,0)}
}

@keyframes homeFooterBrandIn{
  from{opacity:0;transform:translate3d(0,-42%,0) scale(.98)}
  to{opacity:1;transform:translate3d(0,-50%,0) scale(1)}
}

@keyframes homeFooterPanelIn{
  from{opacity:0;transform:translate3d(0,46px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

@media (prefers-reduced-motion:reduce){
  *,
  *:before,
  *:after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}

@media (max-width:1400px){
  .desktop-home-page .desktop-float-toolbar{
    right:126px;
    top:64%;
  }

  .hero-copy{
    top:86px;
    width:560px;
  }

  .hero-copy h1{
    font-size:58px;
  }

  .hero-subtitle{
    font-size:32px;
  }

  .hero-fire-btn{
    margin-top:150px;
  }

  .cover-top-left{
    left:10%;
    width:176px;
    height:238px;
  }

  .cover-top-right{
    right:19%;
  }

  .cover-bottom{
    left:28%;
  }

  .game-coverflow .swiper-slide{
    width:286px;
    height:438px;
  }
}

/* 首页合作方式详情页分页强化：让客户明显看到底部可切换 */
.desktop-home-page .cooperation-detail-pager{
  left:50% !important;
  right:auto !important;
  bottom:30px !important;
  width:min(980px,68vw) !important;
  height:116px !important;
  transform:translate3d(-50%,22px,0) !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  padding:18px 22px 16px !important;
  border:1px solid rgba(243,94,96,.34) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025)),
    rgba(5,6,9,.92) !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,.45),
    0 0 34px rgba(243,94,96,.18),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
  backdrop-filter:blur(10px);
}

.desktop-home-page .cooperation-css-scene.is-detail-ready .cooperation-detail-pager{
  transform:translate3d(-50%,0,0) !important;
}

.desktop-home-page .cooperation-detail-pager:before{
  display:none;
  content:none;
}

.desktop-home-page .cooperation-detail-pager:after{
  content:"";
  position:absolute;
  left:24px;
  right:24px;
  top:-4px;
  height:2px;
  background:linear-gradient(90deg,rgba(243,94,96,.92),rgba(243,94,96,.16),rgba(255,255,255,.24),rgba(243,94,96,.16),rgba(243,94,96,.92));
  box-shadow:0 0 14px rgba(243,94,96,.38);
}

.desktop-home-page .cooperation-detail-pager button{
  height:78px !important;
  padding:14px 18px 12px !important;
  border:1px solid rgba(255,255,255,.1) !important;
  border-radius:14px !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.025)),
    rgba(255,255,255,.035) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease !important;
}

.desktop-home-page .cooperation-detail-pager button:before{
  inset:0 !important;
  opacity:.18 !important;
  border-radius:14px;
  background:linear-gradient(135deg,transparent 0 48%,rgba(243,94,96,.22) 49% 62%,transparent 63%) !important;
  clip-path:none !important;
  transform:none !important;
  box-shadow:none !important;
}

.desktop-home-page .cooperation-detail-pager button:after{
  left:50% !important;
  bottom:-2px !important;
  width:86px !important;
  height:6px !important;
  border-radius:999px !important;
  background:#f35e60 !important;
  box-shadow:0 0 18px rgba(243,94,96,.65) !important;
  transform:translate3d(-50%,0,0) scaleX(.28) !important;
  opacity:.25 !important;
}

.desktop-home-page .cooperation-detail-pager button:hover,
.desktop-home-page .cooperation-detail-pager button:focus-visible,
.desktop-home-page .cooperation-detail-pager button.is-active,
.desktop-home-page .cooperation-detail-pager[data-active-page="0"] button:nth-child(1),
.desktop-home-page .cooperation-detail-pager[data-active-page="1"] button:nth-child(2),
.desktop-home-page .cooperation-detail-pager[data-active-page="2"] button:nth-child(3){
  transform:translateY(-6px);
  border-color:rgba(243,94,96,.62) !important;
  background:
    linear-gradient(135deg,rgba(243,94,96,.28),rgba(243,94,96,.08)),
    rgba(255,255,255,.055) !important;
  box-shadow:
    0 16px 34px rgba(0,0,0,.28),
    0 0 24px rgba(243,94,96,.2),
    inset 0 0 0 1px rgba(255,255,255,.06) !important;
}

.desktop-home-page .cooperation-detail-pager button.is-active:after,
.desktop-home-page .cooperation-detail-pager[data-active-page="0"] button:nth-child(1):after,
.desktop-home-page .cooperation-detail-pager[data-active-page="1"] button:nth-child(2):after,
.desktop-home-page .cooperation-detail-pager[data-active-page="2"] button:nth-child(3):after{
  opacity:1 !important;
  transform:translate3d(-50%,0,0) scaleX(1) !important;
}

.desktop-home-page .cooperation-detail-pager .pager-num{
  margin-bottom:8px;
  font-size:28px !important;
  color:rgba(255,255,255,.9) !important;
}

.desktop-home-page .cooperation-detail-pager .pager-label{
  font-size:16px !important;
  color:rgba(255,255,255,.78) !important;
}

.desktop-home-page .cooperation-detail-pager button:hover .pager-num,
.desktop-home-page .cooperation-detail-pager button:hover .pager-label,
.desktop-home-page .cooperation-detail-pager button.is-active .pager-num,
.desktop-home-page .cooperation-detail-pager button.is-active .pager-label,
.desktop-home-page .cooperation-detail-pager[data-active-page="0"] button:nth-child(1) .pager-num,
.desktop-home-page .cooperation-detail-pager[data-active-page="0"] button:nth-child(1) .pager-label,
.desktop-home-page .cooperation-detail-pager[data-active-page="1"] button:nth-child(2) .pager-num,
.desktop-home-page .cooperation-detail-pager[data-active-page="1"] button:nth-child(2) .pager-label,
.desktop-home-page .cooperation-detail-pager[data-active-page="2"] button:nth-child(3) .pager-num,
.desktop-home-page .cooperation-detail-pager[data-active-page="2"] button:nth-child(3) .pager-label{
  color:#fff !important;
}

/* 合作方式详情页分页文字兜底：确保 01/02/03 和标签始终显示 */
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager{
  display:grid !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  z-index:80 !important;
}

.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager button{
  display:flex !important;
  opacity:1 !important;
  visibility:visible !important;
  color:#fff !important;
}

.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager .pager-num,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager .pager-label{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  position:relative !important;
  z-index:8 !important;
  color:#fff !important;
}

.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager button.is-active .pager-num,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager button.is-active .pager-label,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager[data-active-page="0"] button:nth-child(1) .pager-num,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager[data-active-page="0"] button:nth-child(1) .pager-label,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager[data-active-page="1"] button:nth-child(2) .pager-num,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager[data-active-page="1"] button:nth-child(2) .pager-label,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager[data-active-page="2"] button:nth-child(3) .pager-num,
.desktop-home-page .hero-tab-panel[data-panel="cooperation"] .cooperation-detail-pager[data-active-page="2"] button:nth-child(3) .pager-label{
  color:#f35e60 !important;
}