body{font-family:'Arial',sans-serif;margin:0;padding:.1rem;background-color:#f5f5f5}h1{text-align:center;color:#fff;margin-bottom:30px}.carousel-container{position:relative;margin:1rem auto;overflow:hidden;border-radius:10px;box-shadow:0 8px 16px rgb(0 0 0 / .2)}.carousel-track{display:flex;transition:transform 0.5s ease-in-out;height:500px}.carousel-slide{min-width:100%;position:relative}.gallery-item{margin:0;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff}.gallery-image{width:100%;height:400px;object-fit:cover;display:block;cursor:pointer;transition:opacity 0.3s ease}.gallery-image:hover{opacity:.9}figcaption{text-align:center;padding:15px;color:#333;font-size:16px;background-color:#fff;width:100%}.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background-color:rgb(0 0 0 / .5);color:#fff;border:none;font-size:24px;cursor:pointer;padding:15px;z-index:10;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;transition:background-color 0.3s}.carousel-btn:hover{background-color:rgb(0 0 0 / .8)}.prev-btn{left:20px}.next-btn{right:20px}.carousel-indicators{position:absolute;bottom:20px;left:0;right:0;display:flex;justify-content:center;gap:10px;z-index:10}.carousel-indicator{width:12px;height:12px;border-radius:50%;background-color:rgb(255 255 255 / .5);cursor:pointer;transition:background-color 0.3s}.carousel-indicator.active{background-color:#fff}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgb(0 0 0 / .9);overflow:auto}.modal-content{display:block;margin:60px auto;max-width:80%;max-height:80%;animation:zoom 0.3s}@keyframes zoom{from{transform:scale(.5)}to{transform:scale(1)}}.modal-caption{margin:15px auto;display:block;width:80%;text-align:center;color:#fff;font-size:18px;padding:10px 0}.close-btn{position:absolute;top:20px;right:30px;color:#fff;font-size:40px;font-weight:700;cursor:pointer;transition:color 0.3s}.close-btn:hover{color:#ccc}@media (max-width:768px){.carousel-container{max-width:100%}.carousel-track{height:400px}.gallery-image{height:300px}.carousel-btn{width:40px;height:40px;font-size:18px}.modal-content{max-width:95%;max-height:70%}}@media (max-width:480px){.carousel-track{height:350px}.gallery-image{height:250px}figcaption{font-size:14px;padding:10px}}