.book-showcase{--book-width:clamp(13.5rem, 24vw, 19rem);isolation:isolate;place-items:center;min-height:31rem;display:grid;position:relative}.book-showcase--hero{--book-width:clamp(15rem, 28vw, 21rem);min-height:35rem}.book-showcase__glow{z-index:-2;aspect-ratio:1;background:radial-gradient(circle at 48% 42%, hsl(var(--primary) / .2), transparent 48%), radial-gradient(circle at 65% 62%, hsl(var(--foreground) / .08), transparent 64%);filter:blur(10px);border-radius:999px;width:min(100%,31rem);position:absolute}.book-showcase__stage{perspective:1200px;place-items:center;width:min(100%,29rem);padding:2rem 2.5rem 4rem;display:grid;position:relative}.book-showcase__book{z-index:2;width:var(--book-width);aspect-ratio:460/652;transform-style:preserve-3d;transition:transform .42s cubic-bezier(.2,.8,.2,1);position:relative;transform:rotateY(-11deg)rotateX(1.5deg)rotate(.5deg)}.book-showcase__cover{border:1px solid hsl(var(--foreground) / .12);box-shadow:-1.1rem 1.7rem 2.2rem hsl(var(--foreground) / .2), -.25rem .35rem .65rem hsl(var(--foreground) / .16), inset -.35rem 0 .55rem #ffffff73;background:#fff;border-radius:.35rem .85rem .85rem .35rem;position:absolute;inset:0;overflow:hidden;transform:translateZ(.75rem)}.book-showcase__cover img{object-fit:cover;width:100%;height:100%;display:block}.book-showcase__spine-shine{mix-blend-mode:multiply;pointer-events:none;inset-block:0;background:linear-gradient(270deg,#0a13322b,#0000 70%),linear-gradient(90deg,#ffffff59,#0000);width:1.15rem;position:absolute;right:0}.book-showcase__pages{background:repeating-linear-gradient(#f7f1e6 0 2px,#ded4c2 3px);border-radius:.3rem .75rem .75rem .3rem;position:absolute;inset:.35rem .7rem .3rem .2rem;transform:translate3d(-.45rem,.15rem,-.55rem);box-shadow:.9rem 0 #d9cdbb,1rem .15rem .3rem #1820363d}.book-showcase__shadow{z-index:1;width:calc(var(--book-width) * 1.18);background:hsl(var(--foreground) / .24);filter:blur(.85rem);border-radius:50%;height:2rem;position:absolute;bottom:1.25rem;transform:translate(-.65rem)}@media (hover:hover) and (pointer:fine){a:hover .book-showcase__book,.book-showcase:hover .book-showcase__book{transform:rotateY(-6deg)rotateX(0)rotate(0)translateY(-.4rem)}}@media (width<=639px){.book-showcase,.book-showcase--hero{--book-width:min(68vw, 15.5rem);min-height:26rem}.book-showcase__stage{padding-inline:1.5rem}}@media (prefers-reduced-motion:reduce){.book-showcase__book{transition:none}a:hover .book-showcase__book,.book-showcase:hover .book-showcase__book{transform:rotateY(-11deg)rotateX(1.5deg)rotate(.5deg)}}