.family-visual{background:linear-gradient(145deg,#fff 0%,#f2f3f4 62%,#e3e6e8 100%)}
.family-visual>b{z-index:4;padding:.38rem .5rem;background:#ff8040;color:#111}
.family-thumb-grid{position:absolute;inset:0;overflow:hidden;background:linear-gradient(145deg,#fff 0%,#f2f3f4 62%,#e3e6e8 100%)}
.family-thumb-grid figure{position:absolute;inset:0;margin:0;overflow:hidden;opacity:0;animation:family-cycle-3 12s infinite}
.family-thumb-grid figure:nth-child(1){animation-delay:0s}
.family-thumb-grid figure:nth-child(2){animation-delay:4s}
.family-thumb-grid figure:nth-child(3){animation-delay:8s}
.family-thumb-grid.two figure{animation-name:family-cycle-2;animation-duration:8s}
.family-thumb-grid.two figure:nth-child(1){animation-delay:0s}
.family-thumb-grid.two figure:nth-child(2){animation-delay:4s}
.family-thumb-grid img{width:100%;height:100%;padding:clamp(1.2rem,2.4vw,2.5rem);object-fit:contain;transition:transform .28s ease}
.family-thumb-grid figcaption{position:absolute;right:.7rem;bottom:.6rem;max-width:calc(100% - 1.4rem);overflow:hidden;padding:.18rem .35rem;background:rgba(255,255,255,.82);color:#2a2a2a;font-size:.65rem;font-weight:800;letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap}
.family:hover .family-thumb-grid figure{animation-play-state:paused}
.family:hover .family-thumb-grid img{transform:scale(1.045)}
@keyframes family-cycle-3{0%,30%{opacity:1}33%,97%{opacity:0}100%{opacity:1}}
@keyframes family-cycle-2{0%,45%{opacity:1}50%,95%{opacity:0}100%{opacity:1}}
@media(max-width:760px){.family-thumb-grid figcaption{font-size:.58rem}.family-thumb-grid img{padding:.85rem}}
@media(prefers-reduced-motion:reduce){.family-thumb-grid figure{animation:none;opacity:0}.family-thumb-grid figure:first-child{opacity:1}.family-thumb-grid img{transition:none}}
