.trio{grid-template-columns:.9fr 1fr;grid-template-areas:"bb bb""hp scr";align-items:end;gap:22px 28px;width:100%;max-width:600px;margin-left:auto;display:grid;position:relative}.trio figure{margin:0}.trio .t-bb{grid-area:bb}.trio .t-hp{grid-area:hp;justify-self:end;width:78%}.trio .t-scr{grid-area:scr;width:68%}.trio .ui-face{border-radius:6px;box-shadow:0 24px 60px -30px #000000d9}.trio figcaption{letter-spacing:.02em;color:var(--text-2);white-space:nowrap;margin-top:10px;font-size:11.5px}.bezel{background:linear-gradient(160deg,#2a2e3a,#12141b);border-radius:12px;padding:8px;box-shadow:0 0 0 1px #ffffff0f,0 30px 70px -30px #000000d9}.bezel .ui-face{box-shadow:none;background:#0b0c10;border-radius:4px}.all{z-index:2}.gd-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:56px;list-style:none;display:grid}.gd{height:100%;color:var(--p-ink);box-shadow:0 1px 0 var(--paper-line);transition:transform .4s var(--ease), box-shadow .4s var(--ease);background:#fff;border-radius:24px;flex-direction:column;padding:28px 30px 30px;display:flex}.gd:hover{transform:translateY(-3px);box-shadow:0 26px 60px -34px #11121773}.gd-k{color:var(--p-ink-2);margin-top:26px;font-size:12px}.gd h3{letter-spacing:-.03em;margin-top:8px;font-size:clamp(22px,2vw,28px)}.gd p{color:var(--p-ink-2);max-width:460px;margin-top:10px;font-size:15.5px;line-height:1.55}.gd .go{gap:6px;margin-top:auto;padding-top:22px;font-size:15px;font-weight:500;display:inline-flex}.gd .go span{transition:transform .25s var(--ease)}.gd:hover .go span{transform:translate(3px)}.gd-art{aspect-ratio:2;background:var(--paper-2);border-radius:16px;display:block;position:relative;overflow:hidden}.gd-art img{object-fit:cover;width:100%;height:100%;transition:transform .6s var(--ease);display:block}.gd:hover .gd-art:not(.fan) img{transform:scale(1.03)}.gd-art.fan{background:radial-gradient(80% 70% at 20% 0%, #ffb5474d, transparent 70%), radial-gradient(70% 70% at 100% 100%, #8936ff2e, transparent 70%), var(--paper-2)}.gd-art.fan img{height:auto;transition:transform .5s var(--ease);border-radius:4px;position:absolute;top:50%;left:50%;box-shadow:0 18px 34px -16px #1112178c}.fan .f1{width:22%;transform:translate(-128%,-50%)rotate(-7deg)}.fan .f2{z-index:2;width:23%;transform:translate(-50%,-46%)rotate(1deg)}.fan .f3{z-index:3;width:30%;transform:translate(22%,-30%)rotate(6deg)}.gd:hover .fan .f1{transform:translate(-150%,-52%)rotate(-10deg)}.gd:hover .fan .f2{transform:translate(-50%,-50%)rotate(0)}.gd:hover .fan .f3{transform:translate(38%,-28%)rotate(9deg)}@media (width<=980px){.trio{margin:0 auto}}@media (width<=700px){.gd-grid{grid-template-columns:minmax(0,1fr)}}@media (width<=560px){.trio{gap:18px}.trio figcaption{font-size:10px}}@media (prefers-reduced-motion:reduce){.gd,.gd .go span,.gd-art img{transition:none}.gd:hover .gd-art:not(.fan) img{transform:none}.gd:hover .fan .f1{transform:translate(-128%,-50%)rotate(-7deg)}.gd:hover .fan .f2{transform:translate(-50%,-46%)rotate(1deg)}.gd:hover .fan .f3{transform:translate(22%,-30%)rotate(6deg)}}