.hero-graphic{perspective:1000px;justify-content:center;align-items:center;width:90%;max-width:900px;height:600px;margin:1rem auto 0;display:flex}.hero-graphic img{object-fit:cover;object-position:center top;width:100%;height:100%;transform-style:preserve-3d;background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:8px}.rotating-graphic{width:100%;height:100%;transform-style:preserve-3d;position:relative}.rotate-on-scroll{transform:translate3d(0px, var(--translate-y,0px), 0px) rotateX(var(--rotate-x,0deg))}@media (max-width:767px){.hero-graphic{height:320px}}