@font-face {
  font-family: zuume-cut; /* set name */
  src: url(../fonts/zuume-cut-regular.woff); /* url of the font */
}

body {
    background:  var(--default-bg);   
    overflow: auto;
}

h1, h2, h3, a, p{  font-family: 'zuume-cut-bold', sans-serif; color: var(--default-text);}
p{  font-family: 'zuume-cut', sans-serif; color: var(--default-text);}

        main {
            grid-template-columns:none;
        }

        .hero-desc{width:100%; max-width: 100%;}

        /* --- COLONNA SINISTRA (FISSA) --- */
        .panel {
            display: block;
            /*height: 90vh;*/
            position: relative;
            z-index: 10;
            width: 55%;
            margin: 0 auto;
            padding: 0;
        }

        #arrow-color {
            fill: var(--default-text);
            transform: rotate(5deg);
        }


        .hero-text {
            line-height: 3.5em;
            padding: 150px 30px 100px 30px;
        }

         .hero-text img{
            width:20%;
            height: auto;
        }

        .hero-text h1 {
            font-weight: normal; /* Prova questo! */
            font-size: 4rem;
            font-size: 7vw;
            line-height: 7vw;
        }

        .hero-text h2 {
            /*color: var(--secondary-text);*/
            font-weight: normal; /* Prova questo! */
            font-size: 4rem;
            font-size: 4vw;
            line-height: 3.2vw;
            margin-bottom: 2vh;
        }
        
        .hero-text h1 span {
            color: var(--secondary-text);
            display: block;

        }

        .hero-text h3 {
            font-size: 1.2rem;
            font-size: 1.3vw;
            letter-spacing: 0.1em;
        }

        .hero-text p {
            font-size: 1.2rem;
            font-size: 1.3vw;
            letter-spacing: 0.1em;
            line-height: 1.3vw;
            font-weight: lighter !important;
            margin-bottom: 2vh;
        }
         .hero-text a {
            font-size: 1.2rem;
            font-size: 1.3vw;
            letter-spacing: 0.1em;
            font-weight: lighter !important;
        }

        .hero-desc {
            font-size: 0.9rem;
            line-height: 1.6;
            color: #dcb35c;
            opacity: 0.8;
            margin-top: 30px;
            margin-bottom: 80px;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .content-arrow {
            position: fixed;
            bottom:120px;
            left: 60px;
        }



/* Navigazione Footer Sinistro */
        
        .big-arrow-left {
            font-size: 4rem;
            cursor: pointer;
            transition: transform 0.3s;
        }
        .big-arrow-left:hover { transform: translateX(-10px); }

        /* --- COLONNA DESTRA (SCROLLABLE) --- */
        .right-panel {
            overflow-y: auto; /* Abilita lo scroll solo qui */
            height: 100vh;
            display: flex;
            flex-direction: column;
            padding: 150px 40px 40px 20px;
            /* Nascondiamo la scrollbar per estetica */
            scrollbar-width: none; /* Firefox */
            -ms-overflow-style: none;  /* IE and Edge */
        }
        .right-panel::-webkit-scrollbar {
            display: none; /* Chrome, Safari */
        }

        /* Menu Items */
        .menu-list {
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 20px; /* Spazio tra le voci */
        }

        .menu-item {
            line-height: 0.8;
            display: flex;
            align-items: center;
            /* Transizioni fluide */
            transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), color 0.3s;
            transform-origin: left center; /* Si ingrandisce verso destra */
        }

        .menu-item a{
            text-decoration: none;
            font-family: 'zuume-cut-bold', Oswald, sans-serif;
            font-size: 8rem;
            font-size: 8.3vw;
            letter-spacing:1px;
        }



        /* Freccia nascosta nel link */
        .menu-arrow {
            font-size: 3rem;
            margin-left: 20px;
            opacity: 0;
            transform: translateX(-20px);
            transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
        }

        /* --- EFFETTI HOVER --- */
        .menu-item:hover {
            transform: scale(1.15); /* Aumenta dimensioni */
            color: #fff; /* Opzionale: diventa più chiaro */
        }

        .menu-item:hover .menu-arrow {
            opacity: 1; /* Trasparenza richiesta */
            transform: translateX(0); /* Entra da sinistra */
        }

/*footer{background: #1A1A1A; background: linear-gradient(360deg,rgba(26, 26, 26, 1) 30%, rgba(26, 26, 26, 0) 100%); opacity: 1}*/


 @media (max-width: 768px) {


	 .panel{width:70%;}

	 .hero-text h3 {font-size: 6vw;}

	 .content-arrow {position:fixed; bottom:100px; left:20px; padding:0 !important;}
	 .content-arrow svg{width:24px;}


	 
 }