.flip-card{background-color:red;width:300px;height:200px;perspective:1000px}.flip-card-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform 0.6s;transform-style:preserve-3d}.flip-card:hover .flip-card-inner{transform:rotateX(180deg) translateY(-100%)}.flip-card-front,.flip-card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:10px;box-shadow:0 4px 8px rgba(0,0,0,0.1)}.flip-card-front{background-color:#3498db;color:#fff}.flip-card-back{background-color:#2ecc71;color:#fff;transform:rotateX(180deg)}