/* �?排布：只控制精选项目区三张作品卡的位置和比例�?*/
.site{
  opacity:1!important;
}

.opening-curtain{
  display:none!important;
}

.hero .portrait-reel-card{
  background:#050507!important;
}

.hero .portrait-reel-cover{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  filter:saturate(.92) contrast(1.04) brightness(.86)!important;
}

.hero .portrait-reel-card figcaption{
  z-index:2!important;
}

.work{
  padding-top:122px!important;
  padding-bottom:40px!important;
}

.work .shell:first-child{
  padding-bottom:300px!important;
}

.work .section-note{
  margin-bottom:42px!important;
}

.work .project-list{
  position:relative!important;
  display:block!important;
  width:var(--shell)!important;
  height:1890px!important;
}

.work .project-card{
  position:absolute!important;
  margin:0!important;
  height:auto!important;
  min-height:0!important;
}

.work .project-0{
  width:302px!important;
  height:445px!important;
  aspect-ratio:auto!important;
  top:clamp(-326px,-14.2vw,-276px)!important;
  left:2px!important;
  right:auto!important;
  cursor:pointer!important;
}

.work .project-0 .project-badge{
  position:absolute!important;
  top:10px!important;
  left:10px!important;
  z-index:4!important;
  width:32px!important;
  height:32px!important;
  display:grid!important;
  place-items:center!important;
  background:#ff6a1f!important;
  color:#111!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:0!important;
  line-height:1!important;
  text-transform:uppercase!important;
}

.work .project-1 .project-badge,
.work .mirage-new-card .project-badge{
  position:absolute!important;
  top:10px!important;
  left:10px!important;
  z-index:4!important;
  width:32px!important;
  height:32px!important;
  display:grid!important;
  place-items:center!important;
  background:#ff6a1f!important;
  color:#111!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:0!important;
  line-height:1!important;
  text-transform:uppercase!important;
}

.work .project-1{
  width:596px!important;
  height:874px!important;
  aspect-ratio:auto!important;
  top:calc(clamp(70px,6.4vw,116px) - 150px)!important;
  right:6px!important;
}

.work .project-2{
  width:600px!important;
  height:420px!important;
  aspect-ratio:auto!important;
  top:calc(clamp(390px,33vw,500px) + 500px)!important;
  left:0!important;
}

.work .project-2 .project-tags-charmant{
  position:absolute!important;
  left:18px!important;
  bottom:14px!important;
  right:auto!important;
  z-index:4!important;
  display:flex!important;
  gap:8px!important;
  align-items:center!important;
  max-width:calc(100% - 120px)!important;
  padding-left:0!important;
  filter:saturate(1.05)!important;
}

.work .project-2 .project-tags-charmant span{
  display:inline-flex!important;
  align-items:center!important;
  height:24px!important;
  padding:0 11px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  background:rgba(7,10,18,.78)!important;
  color:#dfe1e8!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  transition:transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease!important;
}

.work .project-2 .project-tags-charmant span:first-child{
  position:relative!important;
  padding-left:20px!important;
  background:rgba(12,16,30,.9)!important;
  color:#f3f3f6!important;
}

.work .project-2 .project-tags-charmant span:first-child::before{
  content:""!important;
  position:absolute!important;
  left:9px!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:999px!important;
  background:#ff6a1f!important;
  transform:translateY(-50%)!important;
  box-shadow:0 0 0 2px rgba(255,106,31,.18)!important;
}

.work .project-2 .project-tags-charmant span:not(:first-child){
  background:rgba(5,7,14,.74)!important;
  color:#cfd2d9!important;
}

.work .project-2 .project-tags-charmant span:hover{
  background:rgba(255,106,31,.22)!important;
  border-color:rgba(255,106,31,.72)!important;
  color:#fff!important;
  transform:translateY(-1px) scale(1.08)!important;
  box-shadow:0 0 0 1px rgba(255,106,31,.1), 0 8px 18px rgba(0,0,0,.22)!important;
}

.work .project-3{
  width:890px!important;
  height:529px!important;
  aspect-ratio:auto!important;
  top:calc(clamp(610px,50vw,760px) + 850px)!important;
  right:8px!important;
  left:auto!important;
}

.work .project-card img,
.work .project-card video,
.work .project-card .project-video{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}

.work .project-0 video,
.work .project-0 .project-video{
  object-fit:cover!important;
  object-position:center!important;
  width:100%!important;
  height:100%!important;
  transform:none!important;
}

.work .project-0 .project-video{
  filter:none!important;
  animation:none!important;
  transition:none!important;
}

.work .project-0 .project-title{
  bottom:24px!important;
  left:18px!important;
}

.work .project-0 .project-title h3{
  font-size:30px!important;
}

.work .project-0 .project-title p{
  font-size:10px!important;
}

.work .project-0 .project-open{
  width:52px!important;
  height:52px!important;
  right:16px!important;
  bottom:16px!important;
  display:grid!important;
  place-items:center!important;
}

.work .project-0 .project-tags{
  position:absolute!important;
  left:14px!important;
  bottom:14px!important;
  right:auto!important;
  z-index:4!important;
  display:flex!important;
  gap:6px!important;
  align-items:center!important;
  padding-left:0!important;
  filter:saturate(1.15)!important;
}

.work .project-0 .project-tags::before{
  display:none!important;
  content:none!important;
}

.work .project-1 .project-tags-02::before,
.work .project-1 .project-tags-02::after{
  display:none!important;
  content:none!important;
}

.work .project-0 .project-tags span{
  display:inline-flex!important;
  align-items:center!important;
  height:23px!important;
  padding:0 10px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(9,12,24,.78)!important;
  color:#d8d8dc!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  transition:transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease!important;
}

.work .project-0 .project-tags span:first-child,
.work .project-1 .project-tags-02 span:first-child{
  position:relative!important;
  padding-left:18px!important;
  background:rgba(14,18,34,.9)!important;
  color:#f2f2f6!important;
}

.work .project-0 .project-tags span:first-child::before,
.work .project-1 .project-tags-02 span:first-child::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:8px!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:999px!important;
  background:#ff6a1f!important;
  transform:translateY(-50%)!important;
  box-shadow:0 0 0 2px rgba(255,106,31,.18)!important;
}

.work .project-0 .project-tags span:not(:first-child),
.work .project-1 .project-tags-02 span:not(:first-child){
  background:rgba(5,7,14,.74)!important;
  color:#cdd0d7!important;
}

.work .project-0 .project-tags span:hover,
.work .project-1 .project-tags-02 span:hover{
  background:rgba(255,106,31,.22)!important;
  border-color:rgba(255,106,31,.72)!important;
  color:#fff!important;
  transform:translateY(-1px) scale(1.08)!important;
  box-shadow:0 0 0 1px rgba(255,106,31,.1), 0 8px 18px rgba(0,0,0,.22)!important;
}

.work .project-1 video,
.work .project-1 .project-video{
  inset:0!important;
  width:100%!important;
}

.work .project-1 .project-meta{
  display:none!important;
}

.work .project-1 .project-tags-02{
  position:absolute!important;
  left:18px!important;
  bottom:14px!important;
  right:auto!important;
  z-index:4!important;
  display:flex!important;
  gap:6px!important;
  flex-wrap:wrap!important;
  max-width:calc(100% - 140px)!important;
  padding-left:0!important;
  filter:saturate(.95)!important;
}

.work .project-1 .project-tags-02 span{
  display:inline-flex!important;
  align-items:center!important;
  height:23px!important;
  padding:0 10px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(9,12,24,.78)!important;
  color:#d8d8dc!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  transition:transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease!important;
}

.work .project-1 .project-tags-02 span:hover{
  background:rgba(255,106,31,.18)!important;
  border-color:rgba(255,106,31,.55)!important;
  color:#fff!important;
  transform:translateY(-1px) scale(1.05)!important;
  box-shadow:0 0 0 1px rgba(255,106,31,.08), 0 6px 16px rgba(0,0,0,.2)!important;
}

.work .mirage-new-card{
  width:302px!important;
  height:445px!important;
  aspect-ratio:auto!important;
  top:calc(clamp(-326px,-14.2vw,-276px) + 500px + 50px)!important;
  left:2px!important;
  right:auto!important;
  cursor:pointer!important;
}

.work .mirage-new-card .project-video{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}

.work .mirage-new-card .project-title{
  bottom:24px!important;
  left:18px!important;
}

.work .mirage-new-card .project-title p{
  font-size:10px!important;
}

.work .mirage-new-card .project-title h3{
  font-size:30px!important;
}

.work .mirage-new-card .project-open{
  width:52px!important;
  height:52px!important;
  right:16px!important;
  bottom:16px!important;
  display:grid!important;
  place-items:center!important;
}

.work .mirage-new-card .project-tags-03{
  position:absolute!important;
  left:14px!important;
  bottom:14px!important;
  z-index:4!important;
  display:flex!important;
  gap:6px!important;
  align-items:center!important;
}

.work .project-3 .project-tags-05{
  position:absolute!important;
  left:18px!important;
  bottom:14px!important;
  z-index:4!important;
  display:flex!important;
  gap:6px!important;
  align-items:center!important;
  max-width:calc(100% - 140px)!important;
  padding-left:0!important;
  filter:saturate(.95)!important;
}

.work .mirage-new-card .project-tags-03 span{
  display:inline-flex!important;
  align-items:center!important;
  height:23px!important;
  padding:0 10px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(9,12,24,.78)!important;
  color:#d8d8dc!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  transition:transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease!important;
}

.work .project-3 .project-tags-05 span{
  display:inline-flex!important;
  align-items:center!important;
  height:23px!important;
  padding:0 10px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(9,12,24,.78)!important;
  color:#d8d8dc!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  transition:transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease!important;
}

.work .mirage-new-card .project-tags-03 span:first-child{
  position:relative!important;
  padding-left:18px!important;
  background:rgba(14,18,34,.9)!important;
  color:#f2f2f6!important;
}

.work .project-3 .project-tags-05 span:first-child{
  position:relative!important;
  padding-left:18px!important;
  background:rgba(14,18,34,.9)!important;
  color:#f2f2f6!important;
}

.work .mirage-new-card .project-tags-03 span:first-child::before{
  content:""!important;
  position:absolute!important;
  left:8px!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:999px!important;
  background:#ff6a1f!important;
  transform:translateY(-50%)!important;
  box-shadow:0 0 0 2px rgba(255,106,31,.18)!important;
}

.work .project-3 .project-tags-05 span:first-child::before{
  content:""!important;
  position:absolute!important;
  left:8px!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:999px!important;
  background:#ff6a1f!important;
  transform:translateY(-50%)!important;
  box-shadow:0 0 0 2px rgba(255,106,31,.18)!important;
}

.work .mirage-new-card .project-tags-03 span:not(:first-child){
  background:rgba(5,7,14,.74)!important;
  color:#cdd0d7!important;
}

.work .project-3 .project-tags-05 span:not(:first-child){
  background:rgba(5,7,14,.74)!important;
  color:#cdd0d7!important;
}

.work .mirage-new-card .project-tags-03 span:hover{
  background:rgba(255,106,31,.22)!important;
  border-color:rgba(255,106,31,.72)!important;
  color:#fff!important;
  transform:translateY(-1px) scale(1.08)!important;
  box-shadow:0 0 0 1px rgba(255,106,31,.1), 0 8px 18px rgba(0,0,0,.22)!important;
}

.work .project-3 .project-tags-05 span:hover{
  background:rgba(255,106,31,.22)!important;
  border-color:rgba(255,106,31,.72)!important;
  color:#fff!important;
  transform:translateY(-1px) scale(1.08)!important;
  box-shadow:0 0 0 1px rgba(255,106,31,.1), 0 8px 18px rgba(0,0,0,.22)!important;
}

.work .work-all{
  width:var(--shell)!important;
  margin:350px auto 0!important;
  padding-top:0!important;
  border:0!important;
  box-shadow:none!important;
  background-image:none!important;
  display:block!important;
  text-align:center!important;
}

.work .work-all,
.work .work-all *{
  border-color:transparent!important;
}

.work .work-all::before,
.work .work-all::after,
.work .work-all strong::before,
.work .work-all strong::after{
  display:none!important;
  content:none!important;
  border:0!important;
  background:none!important;
}

.work .work-all::before,
.work .work-all::after{
  display:none!important;
  content:none!important;
  border:0!important;
  background:none!important;
}

.work-all,
.work-all::before,
.work-all::after{
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
  background-image:none!important;
}

.case-timeline-section{
  min-height:1975px!important;
}

.case-timeline::after{
  content:none!important;
  display:none!important;
}

.case-collaboration{
  margin-top:128px!important;
  overflow:visible!important;
}

.case-collaboration::after{
  content:none!important;
  display:none!important;
}

.case-collaboration .partner-carousel::before{
  content:none!important;
  display:none!important;
}

.case-collaboration .collaboration-foot span:last-child{
  display:none!important;
}

.case-collaboration .partner-carousel{
  position:relative!important;
}

/* R90: restore the timeline row separator line. */
.case-row{
  border-bottom:1px solid #ffffff1a!important;
}

/* R91: remove the dark handoff strip below the timeline without touching row separators. */
.case-collaboration:before,
.case-collaboration::before{
  content:none!important;
  display:none!important;
}

.vertical-work-carousel{
  --vw-accent:#ff6812;
  color:#f1eff2!important;
  min-height:1640px!important;
  padding:104px 0 160px!important;
  background:
    radial-gradient(circle at 50% 44%,rgba(255,104,18,.20),transparent 24%),
    radial-gradient(circle at 50% 58%,rgba(255,255,255,.08),transparent 42%),
    linear-gradient(180deg,#061423 0%,#04111f 100%)!important;
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}

.vertical-work-carousel::before{
  content:""!important;
  position:absolute!important;
  inset:0 calc((100vw - var(--shell)) / 2)!important;
  z-index:-1!important;
  background:repeating-linear-gradient(90deg,transparent 0 calc(20% - 1px),rgba(255,255,255,.08) calc(20% - 1px) 20%)!important;
  opacity:.52!important;
  pointer-events:none!important;
}

.vertical-work-carousel::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(255,104,18,.7),transparent)!important;
  pointer-events:none!important;
}

.vertical-work-grid{
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  opacity:.18!important;
  background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px)!important;
  background-size:100% 80px!important;
  pointer-events:none!important;
}

.vertical-work-shell{
  min-height:1160px!important;
  position:relative!important;
}

.vertical-work-copy{
  position:absolute!important;
  left:0!important;
  top:-34px!important;
  z-index:5!important;
}

.vertical-work-copy p,
.vertical-work-footer{
  letter-spacing:.12em!important;
  font-family:Consolas,"Microsoft YaHei",monospace!important;
  font-size:10px!important;
}

.vertical-work-copy p{
  color:#6f7885!important;
  margin:0 0 18px!important;
  font-size:9px!important;
}

.vertical-work-copy h2{
  color:#d6d7dc!important;
  letter-spacing:-.07em!important;
  margin:0!important;
  font-size:clamp(24px,3.65vw,60px)!important;
  font-weight:520!important;
  line-height:.82!important;
  white-space:nowrap!important;
  transform:perspective(560px) rotateX(5deg) skewX(-2deg)!important;
  transform-origin:left top!important;
}

.vertical-work-copy h2 span{
  color:#8f929a!important;
}

.vertical-card-stage{
  width:100%!important;
  height:560px!important;
  position:relative!important;
  top:200px!important;
  perspective:1200px!important;
  transform-style:preserve-3d!important;
}

.vertical-work-card{
  --offset:0;
  --x:0px;
  --z:66px;
  --rotate:0deg;
  --scale:1;
  --fade:1;
  width:clamp(154px,11.2vw,214px)!important;
  height:clamp(238px,18vw,346px)!important;
  position:absolute!important;
  left:50%!important;
  top:48%!important;
  margin:0!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:#070a10!important;
  box-shadow:0 30px 70px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.05)!important;
  transform:
    translate3d(calc(-50% + var(--x)), -50%, var(--z))
    rotateY(var(--rotate))
    scale(var(--scale))!important;
  opacity:var(--fade)!important;
  transition:transform .85s cubic-bezier(.16,.9,.14,1), opacity .65s ease, border-color .35s ease, filter .35s ease!important;
  cursor:pointer!important;
}

.vertical-work-card.is-active{
  border-color:rgba(255,104,18,.78)!important;
  box-shadow:0 38px 96px rgba(0,0,0,.58), 0 0 46px rgba(255,104,18,.18), inset 0 0 0 1px rgba(255,255,255,.12)!important;
}

.vertical-work-card img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  filter:saturate(.82) contrast(1.05) brightness(.78)!important;
  transform:scale(1.04)!important;
  transition:filter .45s ease, transform .8s cubic-bezier(.2,.75,.2,1)!important;
}

.vertical-work-card.is-active img,
.vertical-work-card:hover img{
  filter:saturate(1.04) contrast(1.07) brightness(.96)!important;
  transform:scale(1.08)!important;
}

.vertical-card-shade{
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.74))!important;
  pointer-events:none!important;
}

.vertical-work-card span{
  position:absolute!important;
  left:14px!important;
  top:12px!important;
  color:var(--vw-accent)!important;
  font:700 10px/1 Consolas,"Microsoft YaHei",monospace!important;
}

.vertical-work-card h3{
  position:absolute!important;
  left:14px!important;
  right:14px!important;
  bottom:34px!important;
  margin:0!important;
  color:#f3f1f4!important;
  font-size:clamp(14px,1.05vw,18px)!important;
  font-weight:620!important;
  line-height:1.08!important;
  letter-spacing:0!important;
}

.vertical-work-card p{
  position:absolute!important;
  left:14px!important;
  right:14px!important;
  bottom:14px!important;
  margin:0!important;
  color:#a5aab3!important;
  font-size:10px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.vertical-work-footer{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:-200px!important;
  color:#717b88!important;
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  gap:16px!important;
}

.vertical-work-count{
  color:#f1eff2!important;
  font-size:16px!important;
}

.vertical-work-footer i{
  display:none!important;
}

.vertical-work-note{
  width:100%!important;
  margin:320px auto 0!important;
  padding:0!important;
  position:relative!important;
  z-index:4!important;
  text-align:center!important;
}

.vertical-work-note::before{
  content:""!important;
  display:block!important;
  width:42px!important;
  height:2px!important;
  margin:0 auto 24px!important;
  background:var(--vw-accent)!important;
}

.vertical-work-note span{
  display:block!important;
  margin-bottom:20px!important;
  color:#737e8c!important;
  font:700 10px/1 Consolas,"Microsoft YaHei",monospace!important;
  letter-spacing:.14em!important;
}

.vertical-work-note h3{
  max-width:780px!important;
  margin:0 auto!important;
  color:#eef0f4!important;
  font-size:clamp(44px,5.6vw,92px)!important;
  font-weight:760!important;
  line-height:.92!important;
  letter-spacing:0!important;
}

.studio-hero p{
  max-width:520px!important;
  margin:24px auto 0!important;
  color:#8e98a6!important;
  font-size:clamp(13px,1vw,16px)!important;
  line-height:1.65!important;
  letter-spacing:0!important;
}

.studio-marquee{
  width:calc(100vw - 12px)!important;
  margin:46px 0 0 50%!important;
  transform:translateX(-50%)!important;
  overflow:hidden!important;
  position:relative!important;
  perspective:none!important;
  cursor:grab!important;
  touch-action:pan-y!important;
  user-select:none!important;
}

.studio-mask{
  position:absolute!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  height:100px!important;
  z-index:3!important;
  pointer-events:none!important;
  fill:#061423!important;
}

.studio-mask-top{
  top:0!important;
}

.studio-mask-bottom{
  bottom:0!important;
}

.studio-track{
  display:flex!important;
  justify-content:flex-start!important;
  align-items:center!important;
  width:max-content!important;
  gap:14px!important;
  padding:16px 0!important;
  transform-style:flat!important;
  will-change:transform!important;
}

.studio-frame{
  flex:0 0 clamp(240px,16.8vw,320px)!important;
  height:clamp(320px,26.8vw,512px)!important;
  margin:0!important;
  overflow:hidden!important;
  background:#09101a!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:14px!important;
  box-shadow:0 24px 62px rgba(0,0,0,.36)!important;
  transform:none!important;
}

.studio-frame img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  filter:saturate(.88) contrast(1.06) brightness(.9)!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-drag:none!important;
}

.studio-frame-1,
.studio-frame-2,
.studio-frame-3,
.studio-frame-4,
.studio-frame-5,
.studio-frame-6{
  transform:none!important;
  transform-origin:center!important;
}

.studio-bottom{
  max-width:760px!important;
  margin:48px auto 0!important;
  color:#c8ced8!important;
  text-align:center!important;
}

.studio-bottom p{
  max-width:680px!important;
  margin:0 auto!important;
  color:#a2aab6!important;
  font-size:clamp(13px,1vw,16px)!important;
  line-height:1.85!important;
  letter-spacing:0!important;
}

.studio-links{
  display:flex!important;
  justify-content:center!important;
  gap:34px!important;
  margin-top:26px!important;
}

.studio-links a{
  color:#f0f2f5!important;
  font-size:12px!important;
  font-weight:700!important;
  text-decoration:underline!important;
  text-decoration-color:rgba(255,104,18,.58)!important;
  text-underline-offset:5px!important;
}

.studio-links a:hover{
  text-decoration-color:#ff6812!important;
}

.studio-marquee.is-dragging{
  cursor:grabbing!important;
}

@media (width<=900px){
  .vertical-work-carousel{
    min-height:1480px!important;
    padding:76px 0 120px!important;
  }

  .vertical-work-copy{
    position:relative!important;
    margin-bottom:22px!important;
  }

  .vertical-card-stage{
    height:440px!important;
  }

  .vertical-work-note{
    width:100%!important;
    margin-top:290px!important;
    padding-top:0!important;
  }

  .vertical-work-note h3{
    font-size:clamp(38px,12vw,64px)!important;
  }

  .studio-track{
    justify-content:flex-start!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    padding:12px 0!important;
  }

  .studio-frame{
    flex-basis:240px!important;
    height:320px!important;
    scroll-snap-align:none!important;
  }

  .studio-frame-1,
  .studio-frame-2,
  .studio-frame-3,
  .studio-frame-4,
  .studio-frame-5{
    transform:none!important;
  }

.studio-links{
  gap:24px!important;
  }
}

.vertical-work-carousel:has(.visual-archive-wall){
  min-height:1180px!important;
  padding:96px 0 118px!important;
  background:
    radial-gradient(circle at 50% 18%,rgba(255,104,18,.10),transparent 22%),
    radial-gradient(circle at 50% 46%,rgba(255,255,255,.055),transparent 44%),
    linear-gradient(180deg,#071523 0%,#020811 100%)!important;
}

.vertical-work-carousel:has(.visual-archive-wall) .vertical-work-grid{
  opacity:.22!important;
}

.visual-archive-head{
  position:relative!important;
  z-index:4!important;
  text-align:center!important;
  padding-bottom:38px!important;
}

.visual-archive-head p,
.visual-archive-foot span{
  margin:0!important;
  color:#747d8a!important;
  font:700 10px/1 Consolas,"Microsoft YaHei",monospace!important;
  letter-spacing:.15em!important;
}

.visual-archive-head h2{
  margin:18px 0 0!important;
  color:#f2f3f6!important;
  font-size:clamp(38px,5.2vw,84px)!important;
  font-weight:680!important;
  line-height:.92!important;
  letter-spacing:0!important;
}

.visual-archive-head span{
  display:block!important;
  max-width:620px!important;
  margin:22px auto 0!important;
  color:#909aa8!important;
  font-size:clamp(12px,.95vw,15px)!important;
  line-height:1.7!important;
  letter-spacing:0!important;
}

.visual-archive-wall{
  position:relative!important;
  z-index:3!important;
  width:100vw!important;
  margin:0 0 0 50%!important;
  transform:translateX(-50%)!important;
  overflow:hidden!important;
  padding:18px 0 26px!important;
}

.visual-archive-wall::before,
.visual-archive-wall::after{
  content:""!important;
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  z-index:5!important;
  width:min(16vw,220px)!important;
  pointer-events:none!important;
}

.visual-archive-wall::before{
  left:0!important;
  background:linear-gradient(90deg,#071523,rgba(7,21,35,0))!important;
}

.visual-archive-wall::after{
  right:0!important;
  background:linear-gradient(270deg,#071523,rgba(7,21,35,0))!important;
}

.visual-archive-row{
  position:relative!important;
  width:100%!important;
  margin:12px 0!important;
  overflow:visible!important;
}

.visual-archive-row:nth-child(even){
  margin-left:-110px!important;
}

.visual-archive-track{
  display:flex!important;
  width:max-content!important;
  gap:14px!important;
  animation:visualArchiveDrift var(--duration) linear infinite!important;
  animation-delay:var(--delay)!important;
  will-change:transform!important;
}

.visual-archive-wall:hover .visual-archive-track{
  animation-play-state:paused!important;
}

.visual-archive-tile{
  flex:0 0 clamp(132px,10.6vw,198px)!important;
  height:clamp(88px,7.05vw,132px)!important;
  position:relative!important;
  display:block!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:4px!important;
  overflow:hidden!important;
  background:#060a11!important;
  box-shadow:0 14px 34px rgba(0,0,0,.35)!important;
  cursor:zoom-in!important;
  transform:translateZ(0) scale(1)!important;
  transition:transform .32s cubic-bezier(.16,1,.3,1), filter .32s ease, border-color .32s ease, box-shadow .32s ease!important;
}

.visual-archive-tile:nth-child(3n+1){
  flex-basis:clamp(154px,12.4vw,230px)!important;
}

.visual-archive-tile:nth-child(4n+2){
  height:clamp(104px,8.3vw,154px)!important;
}

.visual-archive-tile img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  filter:saturate(.74) contrast(1.02) brightness(.54)!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-drag:none!important;
  transition:filter .32s ease, transform .45s cubic-bezier(.16,1,.3,1)!important;
}

.visual-archive-tile:hover,
.visual-archive-tile:focus-visible{
  z-index:20!important;
  border-color:rgba(255,104,18,.68)!important;
  box-shadow:0 28px 70px rgba(0,0,0,.58),0 0 0 1px rgba(255,104,18,.18)!important;
  transform:translateY(-10px) scale(1.34)!important;
  outline:0!important;
}

.visual-archive-tile:hover img,
.visual-archive-tile:focus-visible img{
  filter:saturate(1.04) contrast(1.06) brightness(1)!important;
  transform:scale(1.04)!important;
}

.visual-archive-foot{
  position:relative!important;
  z-index:4!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:34px!important;
  margin-top:42px!important;
}

.visual-archive-foot p{
  max-width:520px!important;
  margin:0!important;
  color:#9aa4b1!important;
  font-size:14px!important;
  line-height:1.75!important;
  letter-spacing:0!important;
  text-align:right!important;
}

@keyframes visualArchiveDrift{
  from{ transform:translate3d(0,0,0); }
  to{ transform:translate3d(-33.333%,0,0); }
}

@media (width<=900px){
  .vertical-work-carousel:has(.visual-archive-wall){
    min-height:1040px!important;
    padding:74px 0 92px!important;
  }

  .visual-archive-head{
    padding-bottom:28px!important;
  }

  .visual-archive-row:nth-child(even){
    margin-left:-70px!important;
  }

  .visual-archive-track{
    gap:10px!important;
  }

  .visual-archive-tile{
    flex-basis:132px!important;
    height:88px!important;
  }

  .visual-archive-tile:nth-child(3n+1){
    flex-basis:148px!important;
  }

  .visual-archive-tile:nth-child(4n+2){
    height:98px!important;
  }

  .visual-archive-tile:hover,
  .visual-archive-tile:focus-visible{
    transform:translateY(-6px) scale(1.12)!important;
  }

  .visual-archive-foot{
    display:block!important;
    margin-top:32px!important;
  }

  .visual-archive-foot p{
    margin-top:18px!important;
    text-align:left!important;
  }
}


.case-thumb{
  cursor:zoom-in!important;
}

.qipai-guose-thumb{
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.qipai-guose-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.06)!important;
}

.case-row:hover .qipai-guose-thumb img,
.case-row:focus-within .qipai-guose-thumb img{
  transform:scale(1.08)!important;
}

.nb-shoes-thumb{
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
  aspect-ratio: 2 / 3!important;
  height:auto!important;
}

.nb-shoes-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}

.case-row:hover .nb-shoes-thumb img,
.case-row:focus-within .nb-shoes-thumb img{
  transform:none!important;
}

.case-row:has(.nb-shoes-thumb) .case-expand{
  max-height:330px!important;
  min-height:300px!important;
}

.case-row:has(.nb-shoes-thumb):hover,
.case-row:has(.nb-shoes-thumb):focus-within{
  min-height:470px!important;
}

.case-row:has(.nb-shoes-thumb) .case-thumbs{
  margin-top:28px!important;
  align-items:flex-start!important;
}

.charmant-thumb{
  aspect-ratio:16 / 9!important;
  border:0!important;
  box-shadow:none!important;
  height:auto!important;
  overflow:hidden!important;
  background:transparent!important;
}

.charmant-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.025)!important;
}

.case-row:hover .charmant-thumb img,
.case-row:focus-within .charmant-thumb img{
  transform:scale(1.025)!important;
}

.mirage-dianjing-thumb{
  aspect-ratio:9 / 16!important;
  width:clamp(84px,7.2vw,128px)!important;
  height:auto!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.mirage-dianjing-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:saturate(.92)contrast(1.03)brightness(.94)!important;
  transform:none!important;
}

.case-row:hover .mirage-dianjing-thumb img,
.case-row:focus-within .mirage-dianjing-thumb img{
  filter:saturate(1.04)contrast(1.04)brightness(1)!important;
  transform:none!important;
}

.case-row:has(.mirage-dianjing-thumb) .case-expand{
  max-height:390px!important;
  min-height:350px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover,
.case-row:has(.mirage-dianjing-thumb):focus-within{
  min-height:520px!important;
}

.case-row:has(.mirage-dianjing-thumb) .case-thumbs{
  align-items:flex-start!important;
  gap:14px!important;
  margin-top:28px!important;
}

.mirage-fashion-thumb{
  aspect-ratio:2 / 3!important;
  width:clamp(88px,7.4vw,132px)!important;
  height:auto!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.mirage-fashion-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:saturate(.94)contrast(1.03)brightness(.96)!important;
  transform:none!important;
}

.case-row:hover .mirage-fashion-thumb img,
.case-row:focus-within .mirage-fashion-thumb img{
  filter:saturate(1.04)contrast(1.04)brightness(1)!important;
  transform:none!important;
}

.case-row:has(.mirage-fashion-thumb) .case-expand{
  max-height:390px!important;
  min-height:350px!important;
}

.case-row:has(.mirage-fashion-thumb):hover,
.case-row:has(.mirage-fashion-thumb):focus-within{
  min-height:520px!important;
}

.case-row:has(.mirage-fashion-thumb) .case-thumbs{
  align-items:flex-start!important;
  gap:14px!important;
  margin-top:28px!important;
}

.gaote-ride-thumb{
  aspect-ratio:2 / 3!important;
  width:clamp(90px,7.6vw,136px)!important;
  height:auto!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.gaote-ride-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.01)!important;
  filter:saturate(.96)contrast(1.02)brightness(.96)!important;
}

.case-row:hover .gaote-ride-thumb img,
.case-row:focus-within .gaote-ride-thumb img{
  transform:scale(1.01)!important;
  filter:saturate(1.04)contrast(1.04)brightness(1)!important;
}

.case-row:has(.gaote-ride-thumb) .case-expand{
  max-height:312px!important;
  min-height:312px!important;
  padding-bottom:0!important;
}

.case-row:has(.gaote-ride-thumb):hover,
.case-row:has(.gaote-ride-thumb):focus-within{
  min-height:400px!important;
}

.case-row:has(.gaote-ride-thumb) .case-thumbs{
  align-items:flex-start!important;
  gap:14px!important;
  margin-top:-87px!important;
  padding-bottom:0!important;
}

.nsve-baiyan-thumb{
  aspect-ratio:2 / 3!important;
  width:clamp(90px,7.6vw,136px)!important;
  height:auto!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.nsve-baiyan-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.01)!important;
  filter:saturate(.96)contrast(1.02)brightness(.96)!important;
}

.case-row:hover .nsve-baiyan-thumb img,
.case-row:focus-within .nsve-baiyan-thumb img{
  transform:scale(1.01)!important;
  filter:saturate(1.04)contrast(1.04)brightness(1)!important;
}

.case-row:has(.nsve-baiyan-thumb) .case-expand{
  max-height:312px!important;
  min-height:312px!important;
  padding-bottom:0!important;
}

.case-row:has(.nsve-baiyan-thumb):hover,
.case-row:has(.nsve-baiyan-thumb):focus-within{
  min-height:400px!important;
}

.case-row:has(.nsve-baiyan-thumb) .case-thumbs{
  align-items:flex-start!important;
  gap:14px!important;
  margin-top:-87px!important;
  padding-bottom:0!important;
}

.shuijingfang-thumb{
  aspect-ratio:2 / 3!important;
  width:clamp(90px,7.6vw,136px)!important;
  height:auto!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.shuijingfang-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.01)!important;
  filter:saturate(.98)contrast(1.02)brightness(.98)!important;
}

.case-row:hover .shuijingfang-thumb img,
.case-row:focus-within .shuijingfang-thumb img{
  transform:scale(1.01)!important;
  filter:saturate(1.04)contrast(1.04)brightness(1)!important;
}

.case-row:has(.shuijingfang-thumb) .case-expand{
  max-height:312px!important;
  min-height:312px!important;
  padding-bottom:0!important;
}

.case-row:has(.shuijingfang-thumb):hover,
.case-row:has(.shuijingfang-thumb):focus-within{
  min-height:400px!important;
}

.case-row:has(.shuijingfang-thumb) .case-thumbs{
  align-items:flex-start!important;
  gap:14px!important;
  margin-top:-87px!important;
  padding-bottom:0!important;
}

.linglongtai-thumb{
  aspect-ratio:16 / 9!important;
  width:clamp(150px,15.2vw,240px)!important;
  height:auto!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.linglongtai-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.01)!important;
  filter:saturate(.98)contrast(1.02)brightness(.98)!important;
}

.case-row:hover .linglongtai-thumb img,
.case-row:focus-within .linglongtai-thumb img{
  transform:scale(1.01)!important;
  filter:saturate(1.04)contrast(1.04)brightness(1)!important;
}

.case-row:has(.linglongtai-thumb) .case-expand{
  max-height:260px!important;
  min-height:260px!important;
  padding-bottom:0!important;
}

.case-row:has(.linglongtai-thumb):hover,
.case-row:has(.linglongtai-thumb):focus-within{
  min-height:360px!important;
}

.case-row:has(.linglongtai-thumb) .case-thumbs{
  align-items:flex-start!important;
  gap:14px!important;
  margin-top:-62px!important;
  padding-bottom:0!important;
}

.case-expand{
  position:relative!important;
}

.case-detail-link{
  position:absolute!important;
  top:28px!important;
  right:auto!important;
  left:calc(100% - 175px)!important;
  z-index:2!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  width:auto!important;
  height:auto!important;
  padding:8px 0!important;
  color:#747d8b!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  font-size:10px!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:.02em!important;
  white-space:nowrap!important;
  opacity:.78!important;
  transition:color .28s ease,opacity .28s ease,text-shadow .28s ease,transform .28s ease!important;
}

.case-detail-link i{
  font-style:normal!important;
  font-size:12px!important;
  line-height:1!important;
  transition:transform .28s ease!important;
}

.case-detail-link:hover,
.case-detail-link:focus-visible{
  color:#ff7a18!important;
  opacity:1!important;
  text-shadow:0 0 18px rgba(255,122,24,.28)!important;
  transform:translateY(-1px)!important;
  outline:0!important;
}

.case-row:hover .case-detail-link,
.case-row:focus-within .case-detail-link{
  color:#747d8b!important;
  opacity:.78!important;
  text-shadow:none!important;
}

.case-detail-link:hover i,
.case-detail-link:focus-visible i{
  transform:translate(4px,-4px)!important;
}

.case-row:hover .case-detail-link i,
.case-row:focus-within .case-detail-link i{
  transform:none!important;
}

.case-row:hover .case-detail-link:hover,
.case-row:focus-within .case-detail-link:focus-visible{
  color:#ff7a18!important;
  opacity:1!important;
  text-shadow:0 0 18px rgba(255,122,24,.28)!important;
  transform:translateY(-1px)!important;
}

.case-row:hover .case-detail-link:hover i,
.case-row:focus-within .case-detail-link:focus-visible i{
  transform:translate(4px,-4px)!important;
}

.jordan-q4-thumb{
  cursor:default!important;
}

.case-media-lightbox{
  position:fixed!important;
  inset:0!important;
  z-index:1000!important;
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  padding:42px!important;
  background:rgba(3,5,10,.88)!important;
  backdrop-filter:blur(12px)!important;
}

.case-media-lightbox.is-open{
  display:flex!important;
}

.case-media-lightbox button{
  position:absolute!important;
  top:24px!important;
  right:28px!important;
  width:42px!important;
  height:42px!important;
  border:1px solid rgba(255,255,255,.36)!important;
  border-radius:50%!important;
  color:#fff!important;
  background:rgba(255,255,255,.08)!important;
  font-size:28px!important;
  line-height:38px!important;
}

.case-media-stage{
  width:min(92vw,1500px)!important;
  height:min(82vh,900px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

.case-media-stage img,
.case-media-stage video{
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  box-shadow:0 24px 80px rgba(0,0,0,.45)!important;
}

.work .work-all span,
.work .work-all sup,
.work .work-all .arrow{
  display:none!important;
}

.work .work-all strong{
  display:block!important;
  letter-spacing:-.12em!important;
  font-size:clamp(34px,4.8vw,76px)!important;
  line-height:.78!important;
  transform:translateY(60px)!important;
}

.work .work-all,
.work .work-all:hover,
.work .work-all:focus,
.work .work-all:focus-visible{
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  outline:0!important;
  box-shadow:none!important;
  background-image:none!important;
}

.work .work-all::before,
.work .work-all::after,
.work .work-all strong::before,
.work .work-all strong::after{
  display:none!important;
  content:none!important;
  border:0!important;
  background:none!important;
  box-shadow:none!important;
}

@media (width<=900px){
  .work .project-list{
    height:auto!important;
    display:flex!important;
    flex-direction:column!important;
    gap:28px!important;
  }

  .work .project-card{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    aspect-ratio:1.35 / 1!important;
  }

  .work .project-1{
    aspect-ratio:1 / 1.16!important;
    width:62%!important;
    align-self:flex-end!important;
  }

  .work .project-2{
    width:62%!important;
    align-self:flex-start!important;
  }

  .work .project-3{
    width:86%!important;
    align-self:center!important;
  }
}

@media (hover:hover) and (pointer:fine){
  .case-row:focus-within:not(:hover){
    background:transparent!important;
    border-bottom-color:#ffffff1a!important;
    min-height:128px!important;
  }

  .case-row:focus-within:not(:hover) .case-expand{
    opacity:0!important;
    max-height:0!important;
    min-height:0!important;
    transform:translateY(24px)!important;
  }

  .case-row:has(.nb-shoes-thumb):focus-within:not(:hover),
  .case-row:has(.mirage-dianjing-thumb):focus-within:not(:hover),
  .case-row:has(.mirage-fashion-thumb):focus-within:not(:hover),
  .case-row:has(.gaote-ride-thumb):focus-within:not(:hover),
  .case-row:has(.nsve-baiyan-thumb):focus-within:not(:hover),
  .case-row:has(.shuijingfang-thumb):focus-within:not(:hover),
  .case-row:has(.linglongtai-thumb):focus-within:not(:hover){
    min-height:128px!important;
  }

  .case-row:has(.nb-shoes-thumb):focus-within:not(:hover) .case-expand,
  .case-row:has(.mirage-dianjing-thumb):focus-within:not(:hover) .case-expand,
  .case-row:has(.mirage-fashion-thumb):focus-within:not(:hover) .case-expand,
  .case-row:has(.gaote-ride-thumb):focus-within:not(:hover) .case-expand,
  .case-row:has(.nsve-baiyan-thumb):focus-within:not(:hover) .case-expand,
  .case-row:has(.shuijingfang-thumb):focus-within:not(:hover) .case-expand,
  .case-row:has(.linglongtai-thumb):focus-within:not(:hover) .case-expand{
    max-height:0!important;
    min-height:0!important;
  }

  .case-row:focus-within:not(:hover) .case-dot{
    transform:none!important;
    box-shadow:none!important;
  }

  .case-row:focus-within:not(:hover) .case-role{
    color:#ff6812!important;
    text-shadow:none!important;
    transform:none!important;
  }
}

.case-row:has(.nb-shoes-thumb) .case-expand,
.case-row:has(.mirage-dianjing-thumb) .case-expand,
.case-row:has(.mirage-fashion-thumb) .case-expand,
.case-row:has(.gaote-ride-thumb) .case-expand,
.case-row:has(.nsve-baiyan-thumb) .case-expand,
.case-row:has(.shuijingfang-thumb) .case-expand,
.case-row:has(.linglongtai-thumb) .case-expand{
  max-height:0!important;
  min-height:0!important;
}

.mirage-tanwood-thumb{
  aspect-ratio:9 / 16!important;
  width:clamp(110px,8.6vw,155px)!important;
  height:auto!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:transparent!important;
}

.mirage-tanwood-thumb video{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
}

.case-row:has(.mirage-tanwood-thumb):hover,
.case-row:has(.mirage-tanwood-thumb):focus-within:hover{
  min-height:425px!important;
}

.case-row:has(.mirage-tanwood-thumb):hover .case-expand,
.case-row:has(.mirage-tanwood-thumb):focus-within:hover .case-expand{
  max-height:330px!important;
  min-height:300px!important;
}

.case-row:has(.mirage-tanwood-thumb):hover .case-thumbs,
.case-row:has(.mirage-tanwood-thumb):focus-within:hover .case-thumbs{
  margin-top:28px!important;
  align-items:flex-start!important;
}

.case-row:has(.mirage-tanwood-thumb):hover .case-expand,
.case-row:has(.mirage-tanwood-thumb):focus-within:hover .case-expand{
  opacity:1!important;
  transform:translateY(0)!important;
}

.case-row:has(.mirage-tanwood-thumb):focus-within:not(:hover){
  min-height:128px!important;
}

.case-row:has(.mirage-tanwood-thumb):focus-within:not(:hover) .case-expand{
  opacity:0!important;
  max-height:0!important;
  min-height:0!important;
  transform:translateY(24px)!important;
}

.case-row:has(.nb-shoes-thumb):hover .case-expand,
.case-row:has(.nb-shoes-thumb):focus-within:hover .case-expand{
  max-height:330px!important;
  min-height:300px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover .case-expand,
.case-row:has(.mirage-dianjing-thumb):focus-within:hover .case-expand,
.case-row:has(.mirage-fashion-thumb):hover .case-expand,
.case-row:has(.mirage-fashion-thumb):focus-within:hover .case-expand{
  max-height:390px!important;
  min-height:350px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover,
.case-row:has(.mirage-dianjing-thumb):focus-within:hover,
.case-row:has(.mirage-fashion-thumb):hover,
.case-row:has(.mirage-fashion-thumb):focus-within:hover{
  min-height:450px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover .case-expand,
.case-row:has(.mirage-dianjing-thumb):focus-within:hover .case-expand,
.case-row:has(.mirage-fashion-thumb):hover .case-expand,
.case-row:has(.mirage-fashion-thumb):focus-within:hover .case-expand{
  max-height:320px!important;
  min-height:290px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover .case-thumbs,
.case-row:has(.mirage-fashion-thumb):hover .case-thumbs{
  margin-top:28px!important;
  gap:10px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover .mirage-dianjing-thumb,
.case-row:has(.mirage-dianjing-thumb):focus-within:hover .mirage-dianjing-thumb,
.case-row:has(.mirage-fashion-thumb):hover .mirage-fashion-thumb,
.case-row:has(.mirage-fashion-thumb):focus-within:hover .mirage-fashion-thumb{
  width:clamp(106px,8.4vw,150px)!important;
}

.case-row:has(.mirage-fashion-thumb):hover,
.case-row:has(.mirage-fashion-thumb):focus-within:hover{
  min-height:410px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover,
.case-row:has(.mirage-dianjing-thumb):focus-within:hover{
  min-height:445px!important;
}

.case-row:has(.mirage-fashion-thumb):hover .case-expand,
.case-row:has(.mirage-fashion-thumb):focus-within:hover .case-expand{
  max-height:275px!important;
  min-height:244px!important;
}

.case-row:has(.mirage-dianjing-thumb):hover .case-expand,
.case-row:has(.mirage-dianjing-thumb):focus-within:hover .case-expand{
  max-height:300px!important;
  min-height:270px!important;
}

/* Restore featured project open buttons with ASCII-safe CSS drawing. */
.work .project-card .project-open{
  border:1px solid rgba(255,255,255,.86)!important;
  border-radius:50%!important;
  background:rgba(8,10,14,.18)!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:-9999px!important;
  text-shadow:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  display:block!important;
  box-shadow:none!important;
}

.work .project-card .project-open::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:20px!important;
  height:1.6px!important;
  background:#fff!important;
  border-radius:999px!important;
  transform:translate(-50%,-50%) rotate(-45deg)!important;
  transform-origin:center!important;
}

.work .project-card .project-open::after{
  content:""!important;
  position:absolute!important;
  left:calc(50% - 1px)!important;
  top:calc(50% - 8px)!important;
  width:8px!important;
  height:8px!important;
  border-top:1.6px solid #fff!important;
  border-right:1.6px solid #fff!important;
  background:transparent!important;
  transform:none!important;
  border-radius:0!important;
}

.work .project-card .project-open:hover{
  background:rgba(255,255,255,.18)!important;
  border-color:rgba(255,255,255,.95)!important;
  color:#fff!important;
}

/* Repair corrupted Chinese brand tags in featured cards. */
.work .project-1 .project-tags-02 span:first-child,
.work .mirage-new-card .project-tags-03 span:first-child,
.work .project-2 .project-tags-charmant span:first-child,
.work .project-3 .project-tags-05 span:first-child{
  font-size:0!important;
}

.work .project-1 .project-tags-02 span:first-child::after,
.work .mirage-new-card .project-tags-03 span:first-child::after,
.work .project-2 .project-tags-charmant span:first-child::after,
.work .project-3 .project-tags-05 span:first-child::after{
  display:inline-block!important;
  color:inherit!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}

.work .project-1 .project-tags-02 span:first-child::after,
.work .mirage-new-card .project-tags-03 span:first-child::after,
.work .project-3 .project-tags-05 span:first-child::after{
  content:"\9B45\5F71"!important;
}

.work .project-2 .project-tags-charmant span:first-child::after{
  content:"\590F\8499"!important;
}

.case-row:not(:hover),
.case-row:focus-within:not(:hover),
.case-row:has(.nb-shoes-thumb):not(:hover),
.case-row:has(.mirage-dianjing-thumb):not(:hover),
.case-row:has(.mirage-fashion-thumb):not(:hover),
.case-row:has(.gaote-ride-thumb):not(:hover),
.case-row:has(.nsve-baiyan-thumb):not(:hover),
.case-row:has(.shuijingfang-thumb):not(:hover),
.case-row:has(.linglongtai-thumb):not(:hover),
.case-row:has(.mirage-tanwood-thumb):not(:hover){
  min-height:128px!important;
}

.case-row:not(:hover) .case-expand,
.case-row:focus-within:not(:hover) .case-expand,
.case-row:has(.nb-shoes-thumb):not(:hover) .case-expand,
.case-row:has(.mirage-dianjing-thumb):not(:hover) .case-expand,
.case-row:has(.mirage-fashion-thumb):not(:hover) .case-expand,
.case-row:has(.gaote-ride-thumb):not(:hover) .case-expand,
.case-row:has(.nsve-baiyan-thumb):not(:hover) .case-expand,
.case-row:has(.shuijingfang-thumb):not(:hover) .case-expand,
.case-row:has(.linglongtai-thumb):not(:hover) .case-expand,
.case-row:has(.mirage-tanwood-thumb):not(:hover) .case-expand{
  opacity:0!important;
  max-height:0!important;
  min-height:0!important;
  height:0!important;
  padding-top:0!important;
  padding-bottom:0!important;
  margin-top:0!important;
  margin-bottom:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  transform:translateY(24px)!important;
}

@media (width>900px){
  .case-collaboration{
    margin-top:28px!important;
  }
}

/* R40: make the visual archive wall read as a calmer, uniform moving grid. */
.vertical-work-carousel:has(.visual-archive-wall){
  min-height:980px!important;
  padding:88px 0 104px!important;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,255,255,.07),transparent 22%),
    radial-gradient(circle at 52% 38%,rgba(255,104,18,.08),transparent 30%),
    linear-gradient(180deg,#071523 0%,#020811 100%)!important;
}

.visual-archive-head{
  padding-bottom:34px!important;
}

.visual-archive-head h2{
  font-size:clamp(34px,3.5vw,58px)!important;
  font-weight:720!important;
  text-shadow:0 12px 38px rgba(255,255,255,.10)!important;
}

.visual-archive-head span{
  margin-top:14px!important;
  color:#6f7886!important;
  font-size:13px!important;
}

.visual-archive-wall{
  padding:10px 0 22px!important;
  transform:translateX(-50%) perspective(1200px)!important;
}

.visual-archive-wall::before{
  width:min(22vw,310px)!important;
  background:linear-gradient(90deg,#071523 8%,rgba(7,21,35,.72) 36%,rgba(7,21,35,0))!important;
}

.visual-archive-wall::after{
  width:min(22vw,310px)!important;
  background:linear-gradient(270deg,#071523 8%,rgba(7,21,35,.72) 36%,rgba(7,21,35,0))!important;
}

.visual-archive-row{
  margin:10px 0!important;
}

.visual-archive-row:nth-child(1){
  margin-left:-156px!important;
}

.visual-archive-row:nth-child(2){
  margin-left:-34px!important;
}

.visual-archive-row:nth-child(3){
  margin-left:-206px!important;
}

.visual-archive-row:nth-child(4){
  margin-left:-82px!important;
}

.visual-archive-track{
  gap:12px!important;
}

.visual-archive-row:nth-child(even) .visual-archive-track{
  animation-duration:calc(var(--duration) + 12s)!important;
}

.visual-archive-tile,
.visual-archive-tile:nth-child(3n+1),
.visual-archive-tile:nth-child(4n+2){
  flex:0 0 clamp(184px,14.8vw,280px)!important;
  height:clamp(116px,9.25vw,174px)!important;
  border-radius:7px!important;
  border-color:rgba(255,255,255,.075)!important;
  background:#070a0f!important;
  box-shadow:0 18px 44px rgba(0,0,0,.42)!important;
}

.visual-archive-tile img{
  filter:grayscale(.18) saturate(.68) contrast(1.04) brightness(.48)!important;
  transform:scale(1.02)!important;
}

.visual-archive-tile:hover,
.visual-archive-tile:focus-visible{
  border-color:rgba(255,255,255,.42)!important;
  box-shadow:0 30px 72px rgba(0,0,0,.66),0 0 0 1px rgba(255,255,255,.13)!important;
  transform:translateY(-8px) scale(1.12)!important;
}

.visual-archive-tile:hover img,
.visual-archive-tile:focus-visible img{
  filter:grayscale(0) saturate(1.03) contrast(1.07) brightness(1)!important;
  transform:scale(1.045)!important;
}

.visual-archive-foot{
  margin-top:36px!important;
}

@media (width<=900px){
  .vertical-work-carousel:has(.visual-archive-wall){
    min-height:920px!important;
    padding:72px 0 88px!important;
  }

  .visual-archive-row:nth-child(1),
  .visual-archive-row:nth-child(3){
    margin-left:-92px!important;
  }

  .visual-archive-row:nth-child(2),
  .visual-archive-row:nth-child(4){
    margin-left:-34px!important;
  }

  .visual-archive-tile,
  .visual-archive-tile:nth-child(3n+1),
  .visual-archive-tile:nth-child(4n+2){
    flex-basis:168px!important;
    height:106px!important;
  }
}

/* R41: portrait-card version for vertical portfolio covers. */
.vertical-work-carousel:has(.visual-archive-wall){
  min-height:1180px!important;
  padding:92px 0 112px!important;
  background:
    radial-gradient(circle at 50% 2%,rgba(255,255,255,.065),transparent 22%),
    radial-gradient(circle at 48% 45%,rgba(255,104,18,.075),transparent 34%),
    linear-gradient(180deg,#071523 0%,#020811 100%)!important;
}

.visual-archive-wall{
  padding:18px 0 30px!important;
  transform:translateX(-50%) perspective(1400px)!important;
}

.visual-archive-row{
  margin:14px 0!important;
}

.visual-archive-row:nth-child(1){
  margin-left:-120px!important;
}

.visual-archive-row:nth-child(2){
  margin-left:-12px!important;
}

.visual-archive-row:nth-child(3){
  margin-left:-176px!important;
}

.visual-archive-row:nth-child(4){
  margin-left:-64px!important;
}

.visual-archive-track{
  gap:14px!important;
}

.visual-archive-tile,
.visual-archive-tile:nth-child(3n+1),
.visual-archive-tile:nth-child(4n+2){
  flex:0 0 clamp(118px,9.8vw,188px)!important;
  height:clamp(176px,14.8vw,282px)!important;
  border-radius:8px!important;
  border-color:rgba(255,255,255,.08)!important;
  background:#070a0f!important;
  box-shadow:0 20px 50px rgba(0,0,0,.44)!important;
}

.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n){
  transform:translateY(20px) translateZ(0) scale(1)!important;
}

.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1){
  transform:translateY(24px) translateZ(0) scale(1)!important;
}

.visual-archive-tile img{
  filter:grayscale(.18) saturate(.7) contrast(1.04) brightness(.48)!important;
  transform:scale(1.025)!important;
}

.visual-archive-tile:hover,
.visual-archive-tile:focus-visible{
  border-color:rgba(255,255,255,.46)!important;
  box-shadow:0 34px 80px rgba(0,0,0,.68),0 0 0 1px rgba(255,255,255,.14)!important;
  transform:translateY(-10px) scale(1.13)!important;
}

.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n):hover,
.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n):focus-visible,
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1):hover,
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1):focus-visible{
  transform:translateY(6px) scale(1.13)!important;
}

.visual-archive-foot{
  margin-top:54px!important;
}

@media (width<=900px){
  .vertical-work-carousel:has(.visual-archive-wall){
    min-height:1080px!important;
    padding:72px 0 90px!important;
  }

  .visual-archive-row:nth-child(1),
  .visual-archive-row:nth-child(3){
    margin-left:-72px!important;
  }

  .visual-archive-row:nth-child(2),
  .visual-archive-row:nth-child(4){
    margin-left:-22px!important;
  }

  .visual-archive-tile,
  .visual-archive-tile:nth-child(3n+1),
  .visual-archive-tile:nth-child(4n+2){
    flex-basis:112px!important;
    height:168px!important;
  }
}

/* R42: portrait stagger wall with safe row lanes, no overlapping cards. */
.vertical-work-carousel:has(.visual-archive-wall){
  min-height:1250px!important;
  padding:92px 0 118px!important;
}

.visual-archive-wall{
  padding:8px 0 34px!important;
}

.visual-archive-row{
  height:clamp(238px,18.8vw,356px)!important;
  margin:0!important;
  overflow:visible!important;
}

.visual-archive-row:nth-child(1){
  margin-left:-132px!important;
}

.visual-archive-row:nth-child(2){
  margin-left:-28px!important;
}

.visual-archive-row:nth-child(3){
  margin-left:-188px!important;
}

.visual-archive-row:nth-child(4){
  margin-left:-72px!important;
}

.visual-archive-track{
  align-items:flex-start!important;
  gap:14px!important;
}

.visual-archive-tile,
.visual-archive-tile:nth-child(3n+1),
.visual-archive-tile:nth-child(4n+2){
  flex:0 0 clamp(116px,9.3vw,176px)!important;
  height:clamp(172px,13.9vw,264px)!important;
}

.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n),
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1){
  transform:translateY(clamp(34px,2.8vw,54px)) translateZ(0) scale(1)!important;
}

.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n):hover,
.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n):focus-visible,
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1):hover,
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1):focus-visible{
  transform:translateY(clamp(20px,1.8vw,34px)) scale(1.1)!important;
}

.visual-archive-tile:hover,
.visual-archive-tile:focus-visible{
  transform:translateY(-8px) scale(1.1)!important;
}

@media (width<=900px){
  .vertical-work-carousel:has(.visual-archive-wall){
    min-height:1120px!important;
  }

  .visual-archive-row{
    height:226px!important;
  }

  .visual-archive-tile,
  .visual-archive-tile:nth-child(3n+1),
  .visual-archive-tile:nth-child(4n+2){
    flex-basis:108px!important;
    height:162px!important;
  }
}

/* R43: keep four-card vertical columns aligned; only stagger columns vertically. */
.visual-archive-row:nth-child(1),
.visual-archive-row:nth-child(2),
.visual-archive-row:nth-child(3),
.visual-archive-row:nth-child(4){
  margin-left:0!important;
}

.visual-archive-track{
  gap:14px!important;
}

.visual-archive-row .visual-archive-tile,
.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n),
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1){
  transform:translateY(0) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:nth-child(3n+2){
  transform:translateY(clamp(32px,2.7vw,50px)) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:nth-child(3n){
  transform:translateY(clamp(14px,1.4vw,26px)) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:hover,
.visual-archive-row .visual-archive-tile:focus-visible{
  transform:translateY(-8px) scale(1.1)!important;
}

.visual-archive-row .visual-archive-tile:nth-child(3n+2):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n+2):focus-visible{
  transform:translateY(clamp(18px,1.6vw,32px)) scale(1.1)!important;
}

.visual-archive-row .visual-archive-tile:nth-child(3n):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n):focus-visible{
  transform:translateY(clamp(2px,.6vw,12px)) scale(1.1)!important;
}

@media (width<=900px){
  .visual-archive-row:nth-child(1),
  .visual-archive-row:nth-child(2),
  .visual-archive-row:nth-child(3),
  .visual-archive-row:nth-child(4){
    margin-left:0!important;
  }
}

/* R44: four rows move as locked vertical columns; no horizontal or per-card staggering. */
.visual-archive-row:nth-child(1),
.visual-archive-row:nth-child(2),
.visual-archive-row:nth-child(3),
.visual-archive-row:nth-child(4){
  margin-left:0!important;
}

.visual-archive-track{
  gap:14px!important;
  animation-duration:66s!important;
  animation-delay:0s!important;
}

.visual-archive-row:nth-child(even) .visual-archive-track{
  animation-duration:66s!important;
  animation-delay:0s!important;
}

.visual-archive-row .visual-archive-tile,
.visual-archive-row .visual-archive-tile:nth-child(3n+2),
.visual-archive-row .visual-archive-tile:nth-child(3n),
.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n),
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1){
  transform:translateY(0) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:hover,
.visual-archive-row .visual-archive-tile:focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(3n+2):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n+2):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(3n):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n):focus-visible{
  transform:translateY(-8px) scale(1.08)!important;
}

/* R45: set vertical spacing between archive rows to 30px. */
.visual-archive-row{
  height:calc(clamp(172px,13.9vw,264px) + 30px)!important;
}

@media (width<=900px){
  .visual-archive-row{
    height:192px!important;
  }
}

/* R46: adjacent vertical columns differ by 35px while each column stays aligned. */
.visual-archive-row .visual-archive-tile:nth-child(odd){
  transform:translateY(0) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:nth-child(even){
  transform:translateY(35px) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:nth-child(odd):hover,
.visual-archive-row .visual-archive-tile:nth-child(odd):focus-visible{
  transform:translateY(-8px) scale(1.08)!important;
}

.visual-archive-row .visual-archive-tile:nth-child(even):hover,
.visual-archive-row .visual-archive-tile:nth-child(even):focus-visible{
  transform:translateY(27px) scale(1.08)!important;
}

/* R47: override earlier odd-row stagger rules so every row obeys the 35px column drop. */
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(odd),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(odd),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(odd),
.visual-archive-row:nth-child(4) .visual-archive-tile:nth-child(odd){
  transform:translateY(0) translateZ(0) scale(1)!important;
}

.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(even),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(even),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(even),
.visual-archive-row:nth-child(4) .visual-archive-tile:nth-child(even){
  transform:translateY(35px) translateZ(0) scale(1)!important;
}

.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(odd):hover,
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(odd):hover,
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(odd):hover,
.visual-archive-row:nth-child(4) .visual-archive-tile:nth-child(odd):hover,
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(odd):focus-visible,
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(odd):focus-visible,
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(odd):focus-visible,
.visual-archive-row:nth-child(4) .visual-archive-tile:nth-child(odd):focus-visible{
  transform:translateY(-8px) scale(1.08)!important;
}

.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(even):hover,
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(even):hover,
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(even):hover,
.visual-archive-row:nth-child(4) .visual-archive-tile:nth-child(even):hover,
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(even):focus-visible,
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(even):focus-visible,
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(even):focus-visible,
.visual-archive-row:nth-child(4) .visual-archive-tile:nth-child(even):focus-visible{
  transform:translateY(27px) scale(1.08)!important;
}

/* R48: tune archive wall spacing. */
.visual-archive-track{
  gap:38px!important;
}

.visual-archive-row{
  height:calc(clamp(172px,13.9vw,264px) + 28px)!important;
}

@media (width<=900px){
  .visual-archive-track{
    gap:28px!important;
  }

  .visual-archive-row{
    height:190px!important;
  }
}

/* R49: compact archive wall spacing. */
.visual-archive-track{
  gap:15px!important;
}

.visual-archive-row{
  height:calc(clamp(172px,13.9vw,264px) + 20px)!important;
}

@media (width<=900px){
  .visual-archive-track{
    gap:15px!important;
  }

  .visual-archive-row{
    height:182px!important;
  }
}

/* R50: preview the archive wall as three aligned portrait rows. */
.vertical-work-carousel:has(.visual-archive-wall){
  min-height:960px!important;
  padding:92px 0 108px!important;
}

.visual-archive-row:nth-child(4){
  display:none!important;
}

.visual-archive-wall{
  padding-bottom:26px!important;
}

@media (width<=900px){
  .vertical-work-carousel:has(.visual-archive-wall){
    min-height:830px!important;
    padding:72px 0 86px!important;
  }
}

/* R51: align the archive wall title with the site's left-led section style. */
.visual-archive-head{
  text-align:left!important;
  padding-bottom:46px!important;
}

.visual-archive-head::after{
  content:""!important;
  display:block!important;
  height:1px!important;
  margin-top:34px!important;
  background:linear-gradient(90deg,rgba(255,255,255,.28),rgba(255,255,255,.10))!important;
}

.visual-archive-head p{
  color:#ff6812!important;
  letter-spacing:.12em!important;
  font-size:10px!important;
}

.visual-archive-head h2{
  max-width:860px!important;
  margin:42px 0 0!important;
  text-align:left!important;
  color:#bfc0c8!important;
  font-size:clamp(54px,5.4vw,92px)!important;
  font-weight:560!important;
  line-height:.92!important;
  letter-spacing:-.065em!important;
  text-shadow:none!important;
}

.visual-archive-head span{
  max-width:430px!important;
  margin:18px 0 0!important;
  color:#7d8490!important;
  text-align:left!important;
}

@media (width<=900px){
  .visual-archive-head{
    padding-bottom:34px!important;
  }

  .visual-archive-head h2{
    margin-top:32px!important;
    font-size:clamp(42px,11vw,68px)!important;
  }
}

/* R52: refine archive wall heading typography and remove divider. */
.visual-archive-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(280px,430px)!important;
  align-items:end!important;
  column-gap:clamp(48px,8vw,140px)!important;
  padding-bottom:40px!important;
}

.visual-archive-head::after{
  display:none!important;
  content:none!important;
}


.visual-archive-head p{
  grid-column:1/-1!important;
}

.visual-archive-head h2{
  grid-column:1!important;
  font-size:clamp(48px,5vw,86px)!important;
  font-weight:420!important;
  letter-spacing:-.04em!important;
}

.visual-archive-head span{
  grid-column:2!important;
  justify-self:end!important;
  max-width:430px!important;
  margin:0 0 8px!important;
  text-align:right!important;
}

@media (width<=900px){
  .visual-archive-head{
    display:block!important;
  }

  .visual-archive-head span{
    max-width:430px!important;
    margin:18px 0 0!important;
    text-align:left!important;
  }
}

/* R53: add 200px breathing room above and below the archive wall section. */
.vertical-work-carousel:has(.visual-archive-wall){
  min-height:1360px!important;
  padding-top:292px!important;
  padding-bottom:308px!important;
}

@media (width<=900px){
  .vertical-work-carousel:has(.visual-archive-wall){
    min-height:1230px!important;
    padding-top:272px!important;
    padding-bottom:286px!important;
  }
}

/* R54: move archive heading up 180px and match the editorial heading layout. */
.vertical-work-carousel:has(.visual-archive-wall){
  padding-top:112px!important;
  min-height:1180px!important;
}

.visual-archive-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(220px,360px)!important;
  grid-template-areas:
    "meta action"
    "rule rule"
    "title title"!important;
  align-items:center!important;
  column-gap:48px!important;
  padding-bottom:70px!important;
}

.visual-archive-head::after{
  content:""!important;
  display:block!important;
  grid-area:rule!important;
  height:1px!important;
  margin:38px 0 40px!important;
  background:rgba(255,255,255,.24)!important;
}

.visual-archive-head p{
  grid-area:meta!important;
  display:flex!important;
  align-items:center!important;
  gap:24px!important;
  margin:0!important;
  color:#d4d5da!important;
  font:700 10px/1 Consolas,"Microsoft YaHei",monospace!important;
  letter-spacing:.08em!important;
}

.visual-archive-head p b{
  color:#ff6812!important;
  font:700 10px/1 Consolas,"Microsoft YaHei",monospace!important;
  letter-spacing:0!important;
}

.visual-archive-head p em{
  color:#d7d7dc!important;
  font-style:normal!important;
  letter-spacing:.08em!important;
}

.visual-archive-head span{
  grid-area:action!important;
  justify-self:end!important;
  margin:0!important;
  color:#f0f0f2!important;
  text-align:right!important;
  font-size:clamp(16px,1.05vw,20px)!important;
  font-weight:520!important;
  line-height:1!important;
}

.visual-archive-head span i{
  color:#ff6812!important;
  font-style:normal!important;
  margin-left:12px!important;
}

.visual-archive-head h2{
  grid-area:title!important;
  max-width:1180px!important;
  margin:0!important;
  color:#c9c9cf!important;
  text-align:left!important;
  font-size:clamp(50px,5.1vw,88px)!important;
  font-weight:420!important;
  line-height:.95!important;
  letter-spacing:-.075em!important;
  text-shadow:none!important;
}

@media (width<=900px){
  .vertical-work-carousel:has(.visual-archive-wall){
    padding-top:92px!important;
    min-height:1060px!important;
  }

  .visual-archive-head{
    display:block!important;
    padding-bottom:46px!important;
  }

  .visual-archive-head::after{
    margin:28px 0 32px!important;
  }

  .visual-archive-head span{
    display:block!important;
    margin-top:20px!important;
    text-align:left!important;
  }
}

/* R56: make archive helper copy smaller and keep it in one line. */
.visual-archive-head span{
  max-width:none!important;
  white-space:nowrap!important;
  color:#9a9ca4!important;
  font-size:13px!important;
  font-weight:420!important;
  line-height:1.25!important;
}

.visual-archive-head span i{
  color:#ff6812!important;
  margin-left:12px!important;
  font-size:13px!important;
}

@media (width<=900px){
  .visual-archive-head span{
    white-space:normal!important;
    font-size:12px!important;
  }
}

/* R57: set the selected-cases eyebrow to title spacing to 60px. */
.case-timeline-head p{
  margin:0 0 60px!important;
}

.case-timeline-head h2{
  margin-top:0!important;
}

@media (width<=900px){
  .case-timeline-head p{
    margin-bottom:42px!important;
  }
}

/* R58: soften and shrink the archive wall main title. */
.visual-archive-head h2{
  font-size:clamp(42px,4.25vw,72px)!important;
  font-weight:360!important;
  letter-spacing:-.045em!important;
  color:#0000!important;
  background:linear-gradient(180deg,#eef0f4 0%,#c1c3ca 58%,#82858f 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}

@media (width<=900px){
  .visual-archive-head h2{
    font-size:clamp(36px,9vw,56px)!important;
  }
}

/* R59: lock selected-cases eyebrow/title visual spacing to 60px. */
.case-timeline-head{
  row-gap:0!important;
}

.case-timeline-head p{
  margin:0!important;
}

.case-timeline-head h2{
  margin-top:60px!important;
}

@media (width<=900px){
  .case-timeline-head h2{
    margin-top:60px!important;
  }
}

/* R60: move archive wall footer copy down by 180px. */
.visual-archive-foot{
  transform:translateY(180px)!important;
}

/* R61: move the archive wall image body down by 150px. */
.vertical-work-carousel:has(.visual-archive-wall){
  min-height:1330px!important;
}

.visual-archive-wall{
  transform:translateX(-50%) translateY(40px) perspective(1400px)!important;
}

/* R63: reduce the visible seam between collaboration and archive wall sections. */
.vertical-work-carousel:has(.visual-archive-wall){
  margin-top:-130px!important;
  padding-top:72px!important;
  min-height:1200px!important;
}

/* R64: remove the background color mismatch between collaboration and archive wall. */
.vertical-work-carousel:has(.visual-archive-wall){
  background:#061423!important;
}

.vertical-work-carousel:has(.visual-archive-wall)::before,
.vertical-work-carousel:has(.visual-archive-wall)::after{
  opacity:0!important;
}

/* R69: hide the selected collaborations label while preserving layout spacing. */
.case-collaboration p{
  visibility:hidden!important;
}

/* R70: trial MotionSites video as the More Works background layer. */
.vertical-work-carousel:has(.visual-archive-wall){
  background:#061423!important;
}

.motion-sites-bg{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  background:#061423!important;
}

.motion-sites-bg video,
.motion-sites-bg img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center center!important;
  opacity:.88!important;
  filter:saturate(1.08) contrast(1.08) brightness(1.02)!important;
}

.motion-sites-overlay{
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(180deg,rgba(6,20,35,.52) 0%,rgba(6,20,35,.22) 24%,rgba(3,9,18,.18) 58%,rgba(3,9,18,.48) 100%),
    radial-gradient(circle at 50% 34%,rgba(255,104,18,.08),transparent 30%)!important;
}

.vertical-work-carousel:has(.motion-sites-bg) .vertical-work-grid{
  z-index:1!important;
}

.vertical-work-carousel:has(.motion-sites-bg) .visual-archive-head,
.vertical-work-carousel:has(.motion-sites-bg) .visual-archive-wall,
.vertical-work-carousel:has(.motion-sites-bg) .visual-archive-foot{
  position:relative!important;
}

@media (width<=900px){
  .motion-sites-bg video,
  .motion-sites-bg img{
    object-position:center center!important;
    opacity:.8!important;
  }
}

/* R72: make the MotionSites background visibly brighter and sharper. */
.vertical-work-carousel:has(.motion-sites-bg) .visual-archive-head{
  text-shadow:0 10px 36px rgba(0,0,0,.34)!important;
}

/* R73: show more of the MotionSites video so it does not feel over-zoomed. */
.motion-sites-bg{
  background:
    radial-gradient(circle at 50% 42%,rgba(255,104,18,.08),transparent 30%),
    linear-gradient(180deg,#061423 0%,#020811 100%)!important;
}

/* R74: use MotionSites Animated Background 104800 with cover framing. */
.motion-sites-bg video,
.motion-sites-bg img{
  object-fit:cover!important;
  object-position:center center!important;
  opacity:.82!important;
  filter:saturate(1.02) contrast(1.04) brightness(.96)!important;
}

.motion-sites-overlay{
  background:
    linear-gradient(180deg,rgba(6,20,35,.46) 0%,rgba(6,20,35,.18) 26%,rgba(3,9,18,.16) 58%,rgba(3,9,18,.44) 100%),
    radial-gradient(circle at 50% 36%,rgba(255,104,18,.06),transparent 32%)!important;
}

/* R76: separate the archive works from the animated background. */
.motion-sites-bg video,
.motion-sites-bg img{
  opacity:.62!important;
  filter:blur(2px) saturate(.92) contrast(1.02) brightness(.82)!important;
  transform:scale(1.02)!important;
}

.motion-sites-overlay{
  background:
    linear-gradient(180deg,rgba(4,13,24,.72) 0%,rgba(4,13,24,.42) 24%,rgba(3,9,18,.38) 62%,rgba(3,9,18,.68) 100%),
    radial-gradient(ellipse at 50% 46%,rgba(3,9,18,.24) 0%,rgba(3,9,18,.42) 56%,rgba(3,9,18,.72) 100%)!important;
}

.visual-archive-wall::before{
  background:linear-gradient(90deg,rgba(4,13,24,.94),rgba(4,13,24,0))!important;
}

.visual-archive-wall::after{
  background:linear-gradient(270deg,rgba(4,13,24,.94),rgba(4,13,24,0))!important;
}

.visual-archive-tile img{
  filter:saturate(.94) contrast(1.06) brightness(.9)!important;
}

.visual-archive-tile:hover img,
.visual-archive-tile:focus-visible img{
  filter:saturate(1.08) contrast(1.08) brightness(1.04)!important;
}

@media (width<=900px){
  .motion-sites-bg video{
    opacity:.56!important;
    filter:blur(1.5px) saturate(.9) contrast(1.02) brightness(.78)!important;
  }
}

/* R79: move the collaboration strip up by 80px. */
.case-collaboration{
  margin-top:48px!important;
}

/* R80: lighten only the upper archive background veil. */
.motion-sites-overlay{
  background:
    linear-gradient(180deg,rgba(4,13,24,.48) 0%,rgba(4,13,24,.26) 24%,rgba(3,9,18,.38) 62%,rgba(3,9,18,.68) 100%),
    radial-gradient(ellipse at 50% 46%,rgba(3,9,18,.16) 0%,rgba(3,9,18,.42) 56%,rgba(3,9,18,.72) 100%)!important;
}

/* R81: further reduce the upper veil so the star field remains visible. */
.motion-sites-overlay{
  background:
    linear-gradient(180deg,rgba(4,13,24,.30) 0%,rgba(4,13,24,.14) 24%,rgba(3,9,18,.36) 62%,rgba(3,9,18,.68) 100%),
    radial-gradient(ellipse at 50% 46%,rgba(3,9,18,.08) 0%,rgba(3,9,18,.38) 56%,rgba(3,9,18,.72) 100%)!important;
}

/* R82: make the archive top veil very light while keeping the lower separation. */
.motion-sites-overlay{
  background:
    linear-gradient(180deg,rgba(4,13,24,.18) 0%,rgba(4,13,24,.08) 24%,rgba(3,9,18,.34) 62%,rgba(3,9,18,.68) 100%),
    radial-gradient(ellipse at 50% 46%,rgba(3,9,18,.04) 0%,rgba(3,9,18,.36) 56%,rgba(3,9,18,.72) 100%)!important;
}

/* R83: actual audit fix - remove hidden darkeners, grid lines, and archive helper copy. */
.motion-sites-bg video,
.motion-sites-bg img{
  opacity:.9!important;
  filter:saturate(1.02) contrast(1.04) brightness(.96)!important;
  transform:none!important;
}

.motion-sites-overlay{
  background:
    linear-gradient(180deg,rgba(4,13,24,.06) 0%,rgba(4,13,24,.02) 24%,rgba(3,9,18,.24) 62%,rgba(3,9,18,.58) 100%),
    radial-gradient(ellipse at 50% 46%,rgba(3,9,18,0) 0%,rgba(3,9,18,.24) 56%,rgba(3,9,18,.62) 100%)!important;
}

.vertical-work-carousel:has(.motion-sites-bg) .vertical-work-grid{
  display:none!important;
  opacity:0!important;
}

.visual-archive-head span{
  visibility:hidden!important;
}

@media (width<=900px){
  .motion-sites-bg video,
  .motion-sites-bg img{
    opacity:.86!important;
    filter:saturate(1) contrast(1.03) brightness(.94)!important;
    transform:none!important;
  }
}

/* R84: strictly remove the selected collaborations footer label. */
.case-collaboration .collaboration-foot,
.case-collaboration .collaboration-foot span,
.case-collaboration .collaboration-foot span:first-child{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}

/* R85: visually lift the collaboration content by 90px without changing timeline height. */
.case-collaboration{
  transform:translateY(-90px)!important;
}

/* R86: focus hovered archive work while muting the rest of the wall. */
.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile{
  opacity:1!important;
  border-color:rgba(255,255,255,.06)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.34)!important;
}

.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile img,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile img{
  filter:saturate(.44) contrast(.92) brightness(.45)!important;
}

.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile:hover,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile:focus-visible{
  opacity:1!important;
  z-index:30!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 30px 76px rgba(0,0,0,.64)!important;
}

.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile:hover img,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile:focus-visible img{
  filter:saturate(1.12) contrast(1.09) brightness(1.08)!important;
}

/* R99: keep the three archive rows locked together with no per-column vertical drift. */
.visual-archive-track,
.visual-archive-row:nth-child(even) .visual-archive-track{
  animation-duration:66s!important;
  animation-delay:0s!important;
}

.visual-archive-row .visual-archive-tile,
.visual-archive-row .visual-archive-tile:nth-child(odd),
.visual-archive-row .visual-archive-tile:nth-child(even),
.visual-archive-row .visual-archive-tile:nth-child(3n),
.visual-archive-row .visual-archive-tile:nth-child(3n+2),
.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n),
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1){
  transform:translateY(0) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:hover,
.visual-archive-row .visual-archive-tile:focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(odd):hover,
.visual-archive-row .visual-archive-tile:nth-child(odd):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(even):hover,
.visual-archive-row .visual-archive-tile:nth-child(even):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(3n):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(3n+2):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n+2):focus-visible{
  transform:translateY(0) translateZ(0) scale(1.06)!important;
}

/* R100: horizontal row offset, vertical rows stay evenly spaced. */
.visual-archive-wall{
  padding:10px 0 34px!important;
}

.visual-archive-row{
  height:calc(clamp(172px,13.9vw,264px) + 20px)!important;
  margin-top:0!important;
  margin-bottom:0!important;
  overflow:visible!important;
  transform:none!important;
}

.visual-archive-row:nth-child(1){
  margin-left:-84px!important;
}

.visual-archive-row:nth-child(2){
  margin-left:0!important;
}

.visual-archive-row:nth-child(3){
  margin-left:-168px!important;
}

.visual-archive-track,
.visual-archive-row:nth-child(even) .visual-archive-track{
  align-items:flex-start!important;
  gap:15px!important;
  animation-duration:66s!important;
  animation-delay:0s!important;
  transform:none;
}

.visual-archive-row .visual-archive-tile,
.visual-archive-row .visual-archive-tile:nth-child(odd),
.visual-archive-row .visual-archive-tile:nth-child(even),
.visual-archive-row .visual-archive-tile:nth-child(3n),
.visual-archive-row .visual-archive-tile:nth-child(3n+1),
.visual-archive-row .visual-archive-tile:nth-child(3n+2),
.visual-archive-row .visual-archive-tile:nth-child(4n+2),
.visual-archive-row:nth-child(odd) .visual-archive-tile:nth-child(2n),
.visual-archive-row:nth-child(even) .visual-archive-tile:nth-child(2n+1){
  flex:0 0 clamp(116px,9.3vw,176px)!important;
  height:clamp(172px,13.9vw,264px)!important;
  transform:translateY(0) translateZ(0) scale(1)!important;
}

.visual-archive-row .visual-archive-tile:hover,
.visual-archive-row .visual-archive-tile:focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(odd):hover,
.visual-archive-row .visual-archive-tile:nth-child(odd):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(even):hover,
.visual-archive-row .visual-archive-tile:nth-child(even):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(3n):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(3n+1):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n+1):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(3n+2):hover,
.visual-archive-row .visual-archive-tile:nth-child(3n+2):focus-visible,
.visual-archive-row .visual-archive-tile:nth-child(4n+2):hover,
.visual-archive-row .visual-archive-tile:nth-child(4n+2):focus-visible{
  transform:translateY(0) translateZ(0) scale(1.06)!important;
}

/* R101: cancel legacy per-card 35px stagger; only whole rows may be horizontally offset. */
.visual-archive-row:nth-child(1) .visual-archive-tile,
.visual-archive-row:nth-child(2) .visual-archive-tile,
.visual-archive-row:nth-child(3) .visual-archive-tile,
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(odd),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(odd),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(odd),
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(even),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(even),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(even),
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(3n),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(3n),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(3n),
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(3n+1),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(3n+1),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(3n+1),
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(3n+2),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(3n+2),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(3n+2),
.visual-archive-row:nth-child(1) .visual-archive-tile:nth-child(4n+2),
.visual-archive-row:nth-child(2) .visual-archive-tile:nth-child(4n+2),
.visual-archive-row:nth-child(3) .visual-archive-tile:nth-child(4n+2){
  transform:translateY(0) translateZ(0) scale(1)!important;
}

.visual-archive-row:nth-child(1) .visual-archive-tile:hover,
.visual-archive-row:nth-child(2) .visual-archive-tile:hover,
.visual-archive-row:nth-child(3) .visual-archive-tile:hover,
.visual-archive-row:nth-child(1) .visual-archive-tile:focus-visible,
.visual-archive-row:nth-child(2) .visual-archive-tile:focus-visible,
.visual-archive-row:nth-child(3) .visual-archive-tile:focus-visible{
  transform:translateY(0) translateZ(0) scale(1.06)!important;
}

/* R102: lower the archive wall gray cast while keeping hover focus readable. */
.visual-archive-tile img{
  filter:saturate(1.02) contrast(1.05) brightness(.96)!important;
}

.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile img,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile img{
  filter:saturate(.62) contrast(.96) brightness(.58)!important;
}

.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile:hover img,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile:focus-visible img{
  filter:saturate(1.12) contrast(1.08) brightness(1.06)!important;
}

/* R103: autoplay state keeps a restrained gray cast; hover restores the selected work. */
.visual-archive-tile img{
  filter:grayscale(.1) saturate(.86) contrast(1.03) brightness(.86)!important;
}

.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile img,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile img{
  filter:grayscale(.22) saturate(.56) contrast(.96) brightness(.54)!important;
}

.visual-archive-wall:has(.visual-archive-tile:hover) .visual-archive-tile:hover img,
.visual-archive-wall:has(.visual-archive-tile:focus-visible) .visual-archive-tile:focus-visible img{
  filter:grayscale(0) saturate(1.08) contrast(1.07) brightness(1.03)!important;
}

/* R113: move only the portfolio work body below the title down by 60px. */
.work .project-list{
  margin-top:60px!important;
}

@media (width<=900px){
  .work .project-list{
    margin-top:60px!important;
  }
}

/* R114: replace the contact badge spark with the WeChat QR code. */
.badge-card i.contact-qr-slot{
  width:190px!important;
  height:190px!important;
  padding:10px!important;
  background:#fff!important;
  border-radius:10px!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-shadow:none!important;
  display:block!important;
  overflow:hidden!important;
  box-shadow:0 14px 24px #00000024,inset 0 0 0 1px #00000012!important;
}

.badge-card i.contact-qr-slot img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  display:block!important;
}

/* R115: separate the QR code from the badge title. */
.badge-card b{
  margin-top:22px!important;
}

.badge-card i.contact-qr-slot{
  top:61%!important;
}

/* R116: make the about skill C4D item behave like a link to the 3D page. */
.about-skill-list li.is-clickable-skill{
  cursor:pointer!important;
}

.about-skill-list li.is-clickable-skill:hover,
.about-skill-list li.is-clickable-skill:focus-visible{
  color:#ff7a16!important;
  border-color:#ff7a16!important;
  outline:0!important;
}

/* R117: use the new blue glasses portrait in the profile block. */
.portrait-wrap img.profile-portrait-blue-glasses{
  object-position:56% center!important;
}

.portrait-wrap img.profile-portrait-02{
  object-position:50% center!important;
}

/* R118: move the profile portrait frame up by 50px. */
.portrait-column{
  transform:translateY(-50px)!important;
}

/* R119: prevent Chinese heading glyphs from being clipped on mobile browsers. */
@media (width<=900px){
  .editorial-title,
  .editorial-title span,
  .manifesto h2,
  .profile-copy h2,
  .work .section-note,
  .project-title,
  .project-title h3,
  .case-timeline-head h2,
  .case-collaboration h2,
  .strength-intro h2,
  .strength-card h3,
  .visual-archive-head h2,
  .studio-hero h3,
  .contact h2,
  .badge-card b{
    overflow:visible!important;
    clip-path:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    text-wrap:balance!important;
  }

  .editorial-title{
    line-height:1.08!important;
    letter-spacing:0!important;
    padding:0.12em 0 0.16em!important;
    margin-top:58px!important;
  }

  .editorial-title span{
    line-height:1.08!important;
    padding:0.02em 0!important;
  }

  .manifesto h2,
  .profile-copy h2,
  .strength-intro h2,
  .case-timeline-head h2,
  .case-collaboration h2,
  .visual-archive-head h2,
  .studio-hero h3,
  .contact h2{
    line-height:1.12!important;
    letter-spacing:0!important;
    padding:0.06em 0 0.08em!important;
  }

  .project-title h3,
  .strength-card h3,
  .badge-card b{
    line-height:1.18!important;
    letter-spacing:0!important;
  }
}

/* R120: desktop hero title also needs safe Chinese glyph bounds. */
.hero-editorial .editorial-title,
.hero-editorial .editorial-title span{
  overflow:visible!important;
  clip-path:none!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}

.hero-editorial .editorial-title{
  line-height:.96!important;
  letter-spacing:0!important;
  padding:.08em 0 .14em!important;
}

.hero-editorial .editorial-title span{
  line-height:.96!important;
  padding:.02em 0!important;
}

.site.is-loaded .hero-editorial .editorial-title span{
  animation:none!important;
  opacity:1!important;
  filter:none!important;
  clip-path:none!important;
  transform:none!important;
}

@media (width<=900px){
  .hero-editorial .editorial-title,
  .hero-editorial .editorial-title span{
    line-height:1.08!important;
  }
}
