.video-thumbnail{position:relative;overflow:hidden;cursor:pointer;transition:transform .3s ease}.video-thumbnail:hover{transform:scale(1.02)}.video-thumbnail:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.6));opacity:.7;transition:opacity .3s ease}.video-thumbnail:hover:after{opacity:.9}.play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;background-color:rgba(255,255,255,.9);border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:1;transition:transform .3s ease,background-color .3s ease}.video-thumbnail:hover .play-button{transform:translate(-50%,-50%) scale(1.1);background-color:rgba(255,255,255,1)}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.85);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:50;padding:1rem;animation:fadeIn .3s ease-out}.modal-content{position:relative;width:100%;max-width:1000px;background-color:black;animation:scaleIn .3s ease-out}.close-button{position:absolute;top:-3rem;right:0;color:white;background:transparent;border:none;cursor:pointer;transition:color .2s ease}.close-button:hover{color:#e0e0e0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}