/* Two original characters frame discovery and shared viewing. */
.duality{padding:90px 0 35px}
.duality-intro{margin-bottom:28px}
.duality-intro h2{max-width:880px;margin:15px 0 0;font-size:clamp(38px,5vw,67px);line-height:1.05;letter-spacing:-.055em}
.duality-stage{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;height:550px;overflow:hidden;border:1px solid #884053;border-radius:24px;background:#181418;box-shadow:0 28px 60px #0008}
.duality-stage::before{content:"";position:absolute;z-index:3;top:0;left:50%;width:1px;height:100%;background:linear-gradient(transparent,#f2e8e05c 18%,#b72d48 76%,transparent);pointer-events:none}
.duality-stage::after{content:"";position:absolute;z-index:3;inset:10px;border:1px solid #f2e8e020;border-radius:16px;pointer-events:none}
.duality-half{position:relative;min-width:0;overflow:hidden}
.duality-half--silver{background:radial-gradient(circle at 42% 73%,#f2e8e024,transparent 49%),linear-gradient(145deg,#252126,#17161a 74%)}
.duality-half--crimson{background:radial-gradient(circle at 58% 73%,#b7244350,transparent 52%),linear-gradient(215deg,#26161e,#151216 74%)}
.duality-half::after{content:"";position:absolute;z-index:1;inset:auto 0 0;height:20%;background:linear-gradient(transparent,#111014a8);pointer-events:none}
.duality-label{position:absolute;z-index:3;top:38px;left:38px;display:grid;gap:7px}
.duality-half--crimson .duality-label{left:auto;right:38px;text-align:right}
.duality-label span{color:#d6a4ab;font-size:11px;font-weight:850;letter-spacing:.18em}
.duality-half--silver .duality-label span{color:#ddd1d0}
.duality-label strong{color:#f2e8e0;font-size:clamp(21px,2.2vw,29px);letter-spacing:-.035em}
.duality-half img{position:absolute;z-index:2;top:75px;left:50%;width:clamp(560px,60vw,760px);height:auto;max-width:none;transform:translateX(-50%);filter:drop-shadow(0 14px 18px #0008);transition:translate .8s cubic-bezier(.2,.7,.2,1),opacity .8s ease}
.motion-ready .duality-half--silver img{translate:-24px 0;opacity:0}
.motion-ready .duality-half--crimson img{translate:24px 0;opacity:0}
.motion-ready .duality-stage.visible .duality-half img{translate:0;opacity:1}
.duality-seal{position:absolute;z-index:5;top:55%;left:50%;display:grid;place-items:center;width:77px;height:77px;transform:translate(-50%,-50%);border:1px solid #ca536a;border-radius:20px;background:#1b1119;box-shadow:0 0 0 7px #171216aa,0 12px 28px #000a}
.duality-seal img{width:62px;height:62px;object-fit:contain}
@media(max-width:900px){
  .duality{padding:70px 0 20px}
  .duality-stage{height:500px}
  .duality-half img{top:80px;width:560px}
  .duality-label{top:28px;left:25px}
  .duality-half--crimson .duality-label{right:25px}
}
@media(max-width:760px){
  .duality-stage{height:410px}
  .duality-half img{top:95px;width:480px}
  .duality-label{top:23px;left:18px}
  .duality-half--crimson .duality-label{right:18px}
  .duality-label span{font-size:9px}
  .duality-label strong{font-size:18px;max-width:180px}
  .duality-seal{width:57px;height:57px;border-radius:15px}
  .duality-seal img{width:48px;height:48px}
}
@media(max-width:520px){
  .duality{padding:55px 0 14px}
  .duality-intro{margin-bottom:18px}
  .duality-intro h2{font-size:clamp(34px,9vw,44px)}
  .duality-stage{height:390px;border-radius:17px}
  .duality-stage::after{inset:5px;border-radius:12px}
  .duality-half img{top:95px;width:440px}
  .duality-label{top:20px;left:13px}
  .duality-half--crimson .duality-label{right:13px}
  .duality-label span{font-size:8px;letter-spacing:.09em}
  .duality-label strong{font-size:15px;max-width:120px}
  .duality-seal{width:48px;height:48px}
  .duality-seal img{width:39px;height:39px}
}
@media(prefers-reduced-motion:reduce){.duality-half img,.motion-ready .duality-half img{transition:none;translate:0;opacity:1}}
