/* Popup */
        #imagePopup {
            display: none;
            position: fixed;
            inset: 0;
            z-index: 9999;
            background: rgba(0, 0, 0, 0.65);
            align-items: center;
            justify-content: center;
            padding: 20px;
        }

        /* Riquadro del popup */
        .popup-box {
            position: relative;
            width: 90%;
            max-width: 700px;
            padding: 8px;
            background: white;
            border: 4px solid #222;
            border-radius: 5px;
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
            animation: comparsa 0.4s ease-out;
        }

        /* Immagine */
        .popup-box img {
            display: block;
            width: 100%;
            height: auto;
        }

        /* Pulsante X */
        .chiudi {
            position: absolute;
            top: -18px;
            right: -18px;

            width: 36px;
            height: 36px;

            border: 3px solid #222;
            border-radius: 50%;

            background: white;
            color: #222;

            font-size: 24px;
            font-weight: bold;
            line-height: 30px;

            cursor: pointer;
        }

        .chiudi:hover {
            background: #222;
            color: white;
        }

        /* Animazione */
        @keyframes comparsa {
            from {
                opacity: 0;
                transform: scale(0.85);
            }

            to {
                opacity: 1;
                transform: scale(1);
            }
        }