#examples .sec-lede{margin-bottom:clamp(40px,5vw,64px)}.fan-layout{height:32rem;perspective:1200px;touch-action:pan-y;-moz-user-select:none;user-select:none;-webkit-user-select:none}.fan-card{--fan-w: 16rem;position:absolute;left:50%;top:40%;width:calc(var(--fan-w) * var(--fan-scale, 1));max-width:62vw;aspect-ratio:3 / 4;margin-left:calc(var(--fan-w) * var(--fan-scale, 1) / -2);margin-top:calc(var(--fan-w) * var(--fan-scale, 1) / -2 * 4 / 3);border-radius:1.1rem;overflow:hidden;background:#fff;border:1px solid rgba(10,10,11,.09);box-shadow:0 12px 36px #0a0a0b14;will-change:transform,opacity;transition:border-color .26s cubic-bezier(.22,.61,.36,1),box-shadow .26s cubic-bezier(.22,.61,.36,1)}a.fan-card:hover{border-color:#0a0a0b38;box-shadow:0 18px 48px #0a0a0b1f}.fan-face{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1rem;width:100%;height:100%;padding:1.5rem;background:#fff;text-align:center}.fan-mark{display:flex;align-items:center;justify-content:center;color:var(--ink)}.fan-mark svg{width:3rem;height:3rem}.fan-name{font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);padding-left:.18em}.fan-explore{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);opacity:0;transform:translateY(4px);transition:opacity .3s ease,transform .3s ease}.fan-card[data-active=true] .fan-explore{opacity:1;transform:none}a.fan-card:hover .fan-explore{color:var(--sub)}.fan-photo{position:relative;display:block;width:100%;height:100%;overflow:hidden}.fan-photo img{pointer-events:none}.fan-arrow:focus{outline:none}.fan-arrow:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:999px}.fan-dot:focus{outline:none}.fan-dot:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:999px}.fan-mark svg{width:calc(3rem * var(--fan-scale, 1));height:calc(3rem * var(--fan-scale, 1))}.fan-name{font-size:calc(12px * var(--fan-scale, 1))}@media(max-width:1023px){.fan-layout{height:29rem}.fan-card{--fan-w: 13rem}.fan-mark svg{width:2.6rem;height:2.6rem}}@media(max-width:767px){.fan-layout{height:28rem}.fan-card{--fan-w: 11.5rem}.fan-mark svg{width:2.4rem;height:2.4rem}.fan-face{gap:.9rem}}@media(max-width:639px){.fan-layout{height:26rem}.fan-card{--fan-w: 10.5rem}.fan-name{font-size:11px}.fan-explore{display:none}}@media(max-width:479px){.fan-layout{height:25rem}.fan-card{--fan-w: 10rem}}@media(prefers-reduced-motion:reduce){.fan-card{will-change:auto}.fan-explore{transition:none}}