/* Effetto voltare pagina: solo animazione, non modifica le grafiche */
.page{perspective:1800px;transform-style:preserve-3d}
.page-turn-sheet{position:absolute;z-index:50;left:50%;top:0;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;pointer-events:none;will-change:transform;animation:ajTurnPage .82s cubic-bezier(.48,.04,.22,1) forwards;box-shadow:-2px 0 3px rgba(40,20,5,.18)}
.page-turn-sheet::before,.page-turn-sheet::after{content:"";position:absolute;inset:0;backface-visibility:hidden}
.page-turn-sheet::before{background-image:var(--page-image);background-size:200% 100%;background-position:right center;background-repeat:no-repeat}
.page-turn-sheet::after{transform:rotateY(180deg);background:linear-gradient(90deg,#b78b4f 0%,#e8c98e 15%,#f2dba7 55%,#c79b5a 100%);box-shadow:inset 12px 0 24px rgba(74,39,12,.25),inset -5px 0 14px rgba(255,239,190,.2)}
.page-turn-shadow{position:absolute;z-index:49;left:49%;top:2%;width:5%;height:96%;pointer-events:none;background:linear-gradient(90deg,rgba(45,22,5,.28),rgba(45,22,5,0));filter:blur(3px);animation:ajTurnShadow .82s ease forwards}
@keyframes ajTurnPage{0%{transform:rotateY(0deg)}45%{transform:rotateY(-82deg)}100%{transform:rotateY(-178deg)}}
@keyframes ajTurnShadow{0%{opacity:0}40%{opacity:1;width:16%}100%{opacity:0;width:4%}}
@media (prefers-reduced-motion:reduce){.page-turn-sheet,.page-turn-shadow{animation-duration:.01ms!important}}