* {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        @font-face {
            font-family: "Outfit_Regular";
            src: url(../../Fonts/Outfit-Variable.ttf);
            font-family: "Comico";
            src:url(../../Fonts/Comico-Regular.ttf)
        }

        html, body {
            height: 100%;
        }

        body {
            margin: 0;
            font-family: Outfit_Regular, sans-serif;
            background-color: #1A2A40;
            display: flex;
            flex-direction: column;
            min-height: 100vh;
        }

        main {
            flex: 1; /* occuperà tutto lo spazio disponibile */
        }

        /* LAYOUT DESKTOP EXHIBITION */

        .exhibition-layout {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4vw;
            align-items: start;
            margin: 1vw 5vw;
            margin-bottom: 50px;
        }

        .exhibition-text {
            color:#FFACC1;
        }

        /* TABLET */

        @media (max-width: 900px) {

        .exhibition-layout {
            grid-template-columns: 1fr;
        }
        .exhibition-text {
            margin-top: -45px;
        }

        }


    /*BOX IMAGE SLIDER */

        /* Spazio rispetto alla pagina */
        .carousel-wrapper {
            transform: translateY(1vw);
            padding: 24px;
            border: #1A2A40 solid inset 40px;
            /* sposta verso il basso l’intero slider */
        }

        /* Contenitore principale */
        .carousel {
            position: relative;
            width: 100%;
            aspect-ratio: 1 / 1;
            background: transparent;
        }

        /* Area mascherata (clipping immagini) */
        .viewport {
            position: absolute;
            inset: 0;
            overflow: hidden;
            border-radius: 43px; /* deve combaciare con la cornice SVG */
            z-index: 1;
        }

        /* Nastro slider */
        .track {
            display: flex;
            height: 100%;
            transition: transform 0.6s ease;
        }


        /* LINK SLIDE */
            .slide-link {
                display: block;
                height: 100%;
                width: auto;
            }

            .slide-link picture {
                height: 100%;
                display: flex;
                align-items: center;
            }

            .slide-link img {
                height: 100%;
                width: auto;
                object-fit: contain;
            }

            /* MOBILE */
            @media (max-width: 600px) {
                .slide-link {
                    width: 100%;
                }

                .slide-link img {
                    width: 100%;
                    height: 100%;
                }
            }
            
        /* SLIDE IMMAGINI */
        .slide picture {
            height: 100%;
            display: flex;
            align-items: center;
        }

        .slide picture img {
            height: 100%;
            width: auto;
            object-fit: contain;
        }

        /* MOBILE */
        @media (max-width: 600px) {
            .slide picture img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }
        }

        .slide {
            height: 100%;
            flex-shrink: 0;
            display: flex;
            align-items: center;
        }

        .slide img {
            height: 100%;
            width: auto;
            object-fit: contain;
        }

        /* Cornice SVG sopra lo slider */
        .frame-svg {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            z-index: 10;
            pointer-events: none;
        }

        .frame-mobile {display: none;
        }

        /* Aree cliccabili invisibili per le frecce */
        .hit {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 80px;
            height: 80px;
            background: transparent;
            border: none;
            cursor: pointer;
            z-index: 20;
        }

        .hit-left {
            left: 0;
        }

        .hit-right {
            right: 0;
        }

        /* Desktop 1420px */
        @media (max-width: 1420px) {
        .viewport {
            border-radius: 45px;
        }
        }

        /* Desktop 1300px */
        @media (max-width: 1420px) {
        .viewport {
            border-radius: 38px;
        }
        }

        /* Desktop 1250px */
        @media (max-width: 1250px) {
        .viewport {
            border-radius: 27px;
        }
        }

        /* Desktop 1100px */
        @media (max-width: 1100px) {
        .viewport {
            border-radius: 30px;
        }
        }

        /* Tablet Chonk */
        @media (max-width: 1024px) {
        .viewport {
            border-radius: 30px;
        }
        }

        /* Tablet */
        @media (max-width: 960px) {
        .viewport {
            border-radius: 30px;
        }
        }

        /* Tablet Mid*/
        @media (max-width: 860px) {
        .viewport {
            border-radius: 40px;
        }
        }

        /* Tablet Piccolo */
        @media (max-width: 690px) {
        .viewport {
            border-radius: 40px;
        }
        }

        /* Mobile */
        @media (max-width: 600px) {
        .viewport {
            border-radius: 40px;
        }
        .carousel-wrapper {
            margin-top: 0px; /* sposta verso il basso l’intero slider */
            padding: 16px;
            border-width: 24px;
        }
        
            .carousel {
            aspect-ratio: 3 / 4;
        }  

        .slide img {
            width: 100%;
            height: auto;
            object-fit: contain;
        }
        
        .frame-desktop {
                display: none;
            }

        .frame-mobile {
                display: block;
            }

        }


        /* MARQUEE OVERLAY */
        .marquee-overlay {
            position: absolute;
            left: 0;
            bottom: 17.5%;
            width: 100%;
            overflow: hidden;
            z-index: 15;
            pointer-events: none;
        }

        .marquee-track {
            display: flex;
            width: max-content;
            animation: marquee 25s linear infinite;
        }

        .marquee-group {
            display: flex;
            gap: clamp(24px, 4vw, 60px);
            padding-right: clamp(24px, 4vw, 60px);
        }

        .marquee-group span {
            font-family: Outfit_Regular, sans-serif;
            font-size: clamp(0.75rem, 1.1vw, 1.15rem);
            font-weight: 700;
            color: #e8e64a;
            letter-spacing: 0.12em;
            white-space: nowrap;
        }

        /* Tablet */
        @media (max-width: 1024px) {
        .marquee-group span {
            font-size: clamp(0.5rem, 1.1vw, 1.15rem);
        }
        
        }

        /* Tablet small */
        @media (max-width: 900px) {

        .marquee-group span {
            font-size: clamp(1.15rem, 1.1vw, 1.15rem);
        }
        .marquee-overlay {
            bottom: 17.5%;
        }
        }
        /* Mobile */
        @media (max-width: 600px) {
        .marquee-group span {
            font-size: clamp(0.8rem, 1.1vw, 1.15rem);
        }

        .marquee-overlay {
            bottom: 17.3%;
            
        }
        }

        /* Animazione continua Marquee*/
        @keyframes marquee {
            from {
                transform: translateX(0);
            }
            to {
                transform: translateX(-50%);
            }
        }


        /*PARAGRAFO CENTRALE*/

            /*TESTO*/

            .padding-par-centr {padding: 0; margin-left: 5vw; margin-right: 5vw; margin-top: 0.7%; margin-bottom: 4vw;}
            .size-titolo1{
                font-size: xx-large;
                margin-top: 25px;
            
            }

            .section-split {
                display: grid;
                grid-template-columns: 1fr 2fr;
                column-gap: 4vw;
                align-items: start;
            }

            .two-columns {
                column-count: 2;
                column-gap: 4vw;
                padding-top: 10px;
                font-weight: 400;
            }

            .right-column {
                padding-top: 0px;
            }

            /*LISTA HASHTAG*/

            .left-column h2 {
                margin-bottom: 24px;
            }

            .icon-list {
                list-style: none;
                padding: 0;
                margin-top: 16px;
                
            }

            .icon-list li {
                position: relative;
                padding-left: 34px;
                line-height: 1.4;
                margin-bottom: 15px;
                font-weight: 600;
            }

            .icon-list li::before {
                content: "";
                position: absolute;
                left: -0.4em;
                top: -0.2em;

                width: 28px;
                height: 28px;

                background-image: url("../../IMG/ELEMENTI/ASTERISCO_MAG.svg");
                background-size: contain;
                background-repeat: no-repeat;
            }

            /* Tablet */
            @media (max-width: 1024px) {
            .two-columns {column-count: 1;}
            .right-column {margin-bottom: 30px}
            }

            /* Mobile */
            @media (max-width: 600px) {
                .padding-par-centr{padding-left: 10px;padding-right: 10px; padding-top: 9%;
                }
                .size-titolo1{font-size: x-large;}

                .right-column {
                padding-top: 0px;
                margin-top: -20px;
                margin-bottom: 30px
                }

                .icon-list {
                list-style: none;
                padding: 0;
                margin-top: 35px;
                margin-bottom:50px
                
                }

                .two-columns {column-count: 1;}

                .section-split {
                    grid-template-columns: 1fr;
                    row-gap: 24px;
                }
            }