.modal{position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000c;display:none;animation:modalFadeIn .3s ease}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal-content{margin:auto;display:block;width:80%;max-width:700px;position:relative;top:50%;transform:translateY(-50%);animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{transform:translateY(-50%) scale(.9);opacity:0}to{transform:translateY(-50%) scale(1);opacity:1}}.close-modal{position:absolute;top:15px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;cursor:pointer;transition:color .3s ease;text-shadow:0 2px 4px rgba(0,0,0,.5)}.close-modal:hover,.close-modal:focus{color:#bbb;transform:scale(1.1)}#modal-image{width:100%;height:auto;border-radius:5px;box-shadow:0 4px 20px #0000004d;max-height:90vh;object-fit:contain}#modal-caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;font-size:.9em}@media(max-width:768px){.modal-content{width:95%;max-width:none}.close-modal{top:10px;right:15px;font-size:30px;background:#00000080;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1}#modal-image{border-radius:0}}.modal:focus{outline:none}body.modal-open{overflow:hidden}