.story-card{position:relative;overflow:hidden;height:300px;background-color:#f8f9fa;border:1px solid #ddd;border-radius:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;transition:all .3s ease-in-out;cursor:pointer}.story-card .content{z-index:2;transition:opacity .3s ease-in-out}.story-card .title{font-size:1.2rem;font-weight:700;margin-bottom:.5rem}.story-card .summary{font-size:1rem;color:#555}.story-card .hover-image{position:absolute;top:0;left:-100%;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .5s ease-in-out,left .5s ease-in-out}.story-card:hover .content{opacity:0}.story-card:hover .hover-image{left:0;transform:scale(1.05)}.icon-container{position:relative;display:inline-block;cursor:pointer;padding:5px}.icon-container i{font-size:24px;color:#ff0000;transition:transform .3s ease-in-out,color .3s ease-in-out;display:inline-block}.icon-container .hover-line{position:absolute;bottom:23px;left:120%;transform:translateX(-50%) scaleX(0);width:100px;height:2px;background-color:#ff0000;border-radius:2px;transition:transform .3s ease-in-out,background-color .3s ease-in-out}.mystory:hover .icon-container i{color:#ff0000;transform:translateX(88px)}.mystory:hover .icon-container .hover-line{transform:translateX(-50%) scaleX(1);background-color:#ff0000}