.footerY #containerY {
    margin-top: 5px !important;
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    /*background: #332525;*/
    /*background-image: url('../../content/images/images/main/fiamme2.png') !important;*/
    /*background-image: url('../../content/images/bgint/bggrey.jpg');*/
    background-image: url('../../content/images/bgint/bggrey_yellow.png');
    background-size: cover;
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
    mask-image: linear-gradient(0deg, transparent 2%, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 73%, transparent 100%);
    -webkit-mask-image: linear-gradient(0deg, transparent 2%, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 73%, transparent 100%);
}

#containerY {
    transform: translate(0%, -35%) !important;
}

.p1-1 {
    background-image: url('../../content/images/ImgEsterne/descrizioneAmn.png');
    background-size: cover;
    height: 560px;
    max-height: 100vh;
    height: calc(100vh - 20px);
}
.p2-2 {
    background-image: url('../../content/images/ImgEsterne/leggi.png');
    background-size: cover;
    height: 560px;
    max-height: 100vh;
    height: calc(100vh - 20px);
}
.p3-3 {
    background-image: url('../../content/images/ImgEsterne/luoghi.png');
    background-size: cover;
    height: 560px;
    max-height: 100vh;
    height: calc(100vh - 20px);
}
.p4-4 {
    background-image: url('../../content/images/ImgEsterne/casate.png');
    background-size: cover;
    height: 560px;
    max-height: 100vh;
    height: calc(100vh - 20px);
}
.p1 {
    padding: 1%;
    display: inline-block;
    /*height: 402px;*/
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #444 #222;
    height: 70%;
}

    .p1::-webkit-scrollbar {
        width: 6px;
    }

    .p1::-webkit-scrollbar-thumb {
        background-color: #444;
        border-radius: 3px;
    }

.p2 {
    /*background-color: #413e3e6b;*/
    padding: 1%;
    /*background-position: center;*/
    display: inline-block;
    /*height: 402px;*/
    height: 70%;
    overflow: auto; /* Abilita lo scroll quando necessario */
    scrollbar-width: thin; /* Rende la scrollbar più sottile nei browser compatibili */
    scrollbar-color: #444 #222; /* Colore barra e sfondo (Firefox) */
}

.p2::-webkit-scrollbar {
    width: 6px;
}

    .p2::-webkit-scrollbar-thumb {
        background-color: #444;
        border-radius: 3px;
    }

.p3 {
    /*background-color: #413e3e6b;*/
    padding: 1%;
    /*background-position: center;*/
    display: inline-block;
    /*height: 402px;*/
    height: 70%;
    overflow: auto; /* Abilita lo scroll quando necessario */
    scrollbar-width: thin; /* Rende la scrollbar più sottile nei browser compatibili */
    scrollbar-color: #444 #222; /* Colore barra e sfondo (Firefox) */
}

    .p3::-webkit-scrollbar {
        width: 6px;
    }

    .p3::-webkit-scrollbar-thumb {
        background-color: #444;
        border-radius: 3px;
    }

.p4 {
    padding: 1%;
    display: inline-block;
    /*height: 402px;*/
    height: 70%;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #444 #222;
    backdrop-filter: blur(12px);
}

    .p4::-webkit-scrollbar {
        width: 6px;
    }

    .p4::-webkit-scrollbar-thumb {
        background-color: #444;
        border-radius: 3px;
    }

/*.p4::-webkit-scrollbar-track {
                background: #222;
            }*/

#scorrimentoOrizzontale {
    display: flex;
    overflow: hidden;
    width: 100%; /* Imposta la larghezza della finestra di visualizzazione */
}

    #scorrimentoOrizzontale > div {
        flex-shrink: 0;
        width: 100%; /* Imposta la larghezza dei div a 100% */
        display: none; /* All'inizio tutti i div sono nascosti */
    }

.navigation {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    pointer-events: none; /* Impedisce ai pulsanti di bloccare il testo sotto */
}

.prev, .next {
    background-color: rgba(0, 0, 0, 0.7); /* Semi-trasparente */
    color: #fff;
    padding: 20px;
    border: none;
    cursor: pointer;
    font-size: 32px;
    width: 60px; /* Puoi aumentare se vuoi */
    /*height: 100%;*/
    height: 16%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: auto; /* Permette il click */
    transition: background-color 0.3s ease;
}

.prev {
    left: 0;
}

.next {
    right: 0;
}

    .prev:hover, .next:hover {
        /*background-color: rgba(85, 85, 85, 0.7); */ /* Cambia colore al passaggio del mouse */
        background-color: #c79b14; /* Cambia colore al passaggio del mouse */
    }

@keyframes vanish {
    0% {
        opacity: 1;
        transform: scale(1);
        filter: blur(0px);
    }

    50% {
        opacity: 0;
        transform: scale(1.05);
        filter: blur(5px);
    }

    100% {
        opacity: 0;
        transform: scale(1.1);
        filter: blur(10px);
    }
}

@keyframes appear {
    0% {
        opacity: 0;
        transform: scale(1.1);
        filter: blur(10px);
    }

    50% {
        opacity: 0.5;
        transform: scale(1.05);
        filter: blur(5px);
    }

    100% {
        opacity: 1;
        transform: scale(1);
        filter: blur(0px);
    }
}

.text-container {
    position: relative;
    font-size: 24px;
    line-height: 1.6;
    text-align: center;
    padding: 20px;
    transition: all 0.5s ease-in-out;
}

/* Nasconde il testo all'inizio del cambio */
.hidden {
    display: none;
}






.intest {
    max-width: 1170px;
}

.butAmb {
}

.container {
    max-width: 1170px;
    background-color: #28272775;
    color: white;
    padding: 10px;
    border-radius: 10px;
    backdrop-filter: blur(3px);
    /*            position: relative;
            bottom: -78px;*/
}

.container3 {
    max-width: 1170px;
    background-color: #28272775;
    color: white;
    padding: 10px;
    border-radius: 10px;
    backdrop-filter: blur(3px);
    /*            position: relative;
            bottom: -471px;*/
}




video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Assicura che il video copra l'intera area del paragrafo */
    z-index: -1; /* Imposta il video dietro al testo del paragrafo */
}

#testoParagrafo {
    position: absolute;
    z-index: 1; /* Imposta il testo del paragrafo sopra al video */
    padding: 20px;
}

@font-face {
    font-family: 'riseinside-regular';
    src: url('/content/fonts/riseinside-regular.ttf') format('truetype');
}

@font-face {
    font-family: 'imfellenglishsc-regular';
    src: url('/content/fonts/imfellenglishsc-regular.ttf') format('truetype');
}

/*.fkBtn {
    display: inline-block;*/ /* Mostra l'elemento come blocco in linea */
    /*color: white;*/ /* Colore del testo normale */
    /*text-decoration: none;*/ /* Sottolineatura normale */
    /*cursor: pointer;*/ /* Cursore che indica che è cliccabile */
    /*transition: all 0.3s ease;*/ /* Transizione per un effetto più fluido */
    /*font-family: "riseinside-regular", sans-serif;
    padding: 18px;
}

.fkBtn1 {
    display: inline-block;*/ /* Mostra l'elemento come blocco in linea */
    /*color: white;*/ /* Colore del testo normale */
    /*font-family: "imfellenglishsc-regular";
    padding: 18px;
    font-size: 1.5em;
}*/

/*.fkBtn:hover {
    color: red;*/ /* Colore del testo al passaggio del mouse */
    /*color: #c79b14;*/ /* Colore del testo al passaggio del mouse */
    /*text-decoration: none;*/ /* Rimuovi la sottolineatura al passaggio del mouse */
    /*cursor: pointer;*/ /* Cursore che indica che è cliccabile */
    /*transform: scale(1.3);*/ /* Rendi il testo più grande al passaggio del mouse */
    /*backdrop-filter: blur(1px);
            border-radius: 30%;*/
/*}*/

.logoY {
    font-family: "riseinside-regular", sans-serif;
    font-size: 2.2em;
}

.spanY {
    font-family: "riseinside-regular", sans-serif;
}



.container {
    width: 30%;
    float: left;
    padding: 20px;
}

.spacer {
    width: 40%;
    float: left;
}

.container3 {
    width: 30%;
    float: right;
    padding: 20px;
}

.accedi {
    margin-top: 13%;
    position: relative;
    right: 16%;
    font-size: 2.5em;
}

.registrati {
    position: relative;
    right: -11%;
    font-size: 2.5em;
}

.pintestazione {
    font-family: math;
    font-size: 1.2em;
}

.dnd {
    width: 150px;
    height: 150px;
    margin-top: 30%;
}

.pegi {
    width: 150px;
    height: 150px;
    margin-top: 30%;
}

.egoCopiryght {
    font-family: "imfellenglishsc-regular";
    font-size: 1.5em;
}



.egoButton {
    background-color: transparent !important;
    border: 1px solid #c79b14 !important;
    color: ghostwhite !important;
    border-radius: 0.25rem;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
    padding: 0.375rem 0.75rem;
    text-align: center;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    user-select: none;
    vertical-align: middle;
    font-weight: bolder;
}

    .egoButton:hover {
        color: #c79b14 !important; /* Cambia il colore del testo quando il link è in hover */
        text-shadow: 0 0 10px #ff9b00; /* Effetto di illuminazione */
        box-shadow: 0 0 10px rgba(199, 155, 20, 0.8); /* Effetto di alone */
    }



.cookie-banner {
    position: fixed;
    bottom: 105px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(25, 20, 35, 0.9);
    /*border: 2px solid rgba(255, 215, 140, 0.6);*/
    border-radius: 20px;
    box-shadow: 0 0 25px rgb(228 102 255 / 60%);
    backdrop-filter: blur(8px);
    color: #f5e4c3;
    padding: 20px 25px;
    width: 420px;
    z-index: 99999; /* 🔥 sopra tutto, anche sopra footer e card */
    animation: fadeInCookie 1s ease forwards;
    font-family: "imfellenglishsc-regular", serif;
    text-align: center;
}

.cookie-card {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(30, 25, 45, 0.95);
    border: 2px solid rgb(201 180 255 / 50%);
    border-radius: 20px;
    padding: 25px;
    color: #e3ccfc;
    box-shadow: 0 0 25px rgb(221 180 255 / 50%);
    z-index: 100000; /* 🔥 ancora sopra al banner */
    display: none;
    animation: unfold 0.5s ease forwards;
    width: 50%;
    height: 50%;
    overflow: auto;
}

.cookie-text {
    font-size: 1em;
    line-height: 1.5em;
    margin-bottom: 15px;
    text-shadow: 0 0 6px rgb(190 180 255 / 40%);
}

.cookie-link {
    background: none;
    border: none;
    color: #9a80ff;
    text-decoration: underline;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
}

    .cookie-link:hover {
        color: #fff0b3;
        text-shadow: 0 0 10px #ffb347;
    }

.cookie-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
}

.cookie-btn {
    background: rgb(54 43 61 / 15%);
    border: 1px solid rgb(204 140 255 / 22%);
    color: #ffecc8;
    border-radius: 10px;
    padding: 8px 14px;
    cursor: pointer;
    font-size: 0.95em;
    transition: all 0.4s ease;
    text-shadow: 0 0 5px rgb(172 125 255 / 40%);
}

    .cookie-btn:hover {
        transform: scale(1.08);
        box-shadow: 0 0 12px rgba(255, 215, 140, 0.6);
    }

.accept-all:hover {
    background: rgb(142 98 153 / 58%);
    color: #ffe6a3;
}

.accept-necessary:hover {
    background: rgba(180, 130, 255, 0.25);
    color: #e6d2ff;
}

/* Piccola animazione di apparizione */
@keyframes fadeInCookie {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(20px) scale(0.9);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0) scale(1);
    }
}



/* Animazione per aprire la carta */
@keyframes unfold {
    0% {
        transform: translate(-50%, -50%) rotateX(-90deg);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%) rotateX(0deg);
        opacity: 1;
    }
}
/* Stili per il bottone di chiusura */
.close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
}

.egoLinkPrivacy {
    display: inline-block;
    color: white;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: "riseinside-regular", sans-serif;
    padding: 3px;
}

    .egoLinkPrivacy:hover {
        color: #c79b14 !important; /* Cambia il colore del testo quando il link è in hover */
        text-shadow: 0 0 10px #ff9b00; /* Effetto di illuminazione */
        /*box-shadow: 0 0 10px rgba(199, 155, 20, 0.8);*/ /* Effetto di alone */
    }

::-webkit-scrollbar {
    width: 0px; /* Larghezza della barra di scorrimento */
}

/* Traccia della barra di scorrimento */
::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Colore di sfondo */
}

/* Impostazione del colore del manico (pollice) della barra di scorrimento */
::-webkit-scrollbar-thumb {
    background-color: #888; /* Colore del manico */
}

    /* Hover sul manico */
    ::-webkit-scrollbar-thumb:hover {
        background-color: #555; /* Colore del manico al passaggio del mouse */
    }

::-webkit-scrollbar {
    width: 0px; /* Larghezza personalizzata della barra di scorrimento */
}

.egoP {
    width: 70%;
}

.egoIcoDesc {
    text-align: center;
    color: bisque;
    width: 300px;
}

.egoTitle {
    font-family: "imfellenglishsc-regular";
    color: #c79b14;
    font-weight: bolder;
    font-size: 1.5em;
}

.egoSpan {
    font-family: "imfellenglishsc-regular";
    font-size: 1.1em;
}

.egoAllign {
    text-align: left;
}




.p1-sun {
    padding-top: 35px;
}

html, body {
    margin: 0 !important;
    padding: 0 !important;
    height: 100% !important;
    overflow: hidden !important; /* Impedisce lo scrolling dell’intera pagina */
}

.accedi2 {
    position: relative;
    /*right: 16%;
            right: -28%;*/
    font-size: 2.0em;
}

.back2 {
    position: relative;
    /*right: 28%;*/
    font-size: 2.0em;
}

.registrati2 {
    position: relative;
    /*right: -11% ⮞;
            right: -28%;*/
    font-size: 2.0em;
}

.fkBtn2 {
    display: inline-block;
    color: white;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: "imfellenglishsc-regular";
    padding-right: 20px;
}

    .fkBtn2:hover {
        color: red;
        color: #c79b14;
        cursor: pointer;
        text-shadow: 0 0 10px #ff9b00;
        text-decoration: underline
    }

.fkBtn {
    display: inline-block;
    position: relative;
    color: #f2e9dc;
    font-family: "imfellenglishsc-regular", serif;
    /*font-size: 1.2em;*/
    text-decoration: none;
    letter-spacing: 1px;
    padding: 8px 18px;
    transition: all 0.4s ease;
    cursor: pointer;
    text-shadow: 0 0 6px rgba(255, 180, 80, 0.6);
    transform: perspective(600px) rotateX(0deg) rotateY(0deg);
    transform: rotate(-2deg) scale(1.08);
    text-shadow: 0 0 12px #5447ff, 0 0 30px #8500ff;
}

    /* Effetto al passaggio del mouse */
    .fkBtn:hover {
        /*                color: #ffcf62;
                text-shadow: 0 0 12px #ffb347, 0 0 24px #ff8c00;
                transform: perspective(600px) rotateX(10deg) rotateY(8deg) scale(1.05);*/
        color: #d68cff;
        text-shadow: 0 0 12px #5447ff, 0 0 30px #8500ff;
        transform: rotate(2deg) scale(1.08);
    }

    /* Effetto contorno magico */
    .fkBtn::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        width: 0%;
        height: 2px;
        background: linear-gradient(90deg, #ffb347, #ffd452);
        background: linear-gradient(90deg, #7447ff, #af52ff);
        transition: all 0.4s ease;
        transform: translateX(-50%);
        box-shadow: 0 0 8px #ffb347;
    }

    .fkBtn:hover::after {
        width: 80%;
    }

    /* Versioni diverse per Accedi e Registrati */
    .fkBtn.accedi:hover {
        color: #d68cff;
        text-shadow: 0 0 12px #5447ff, 0 0 30px #8500ff;
        transform: rotate(2deg) scale(1.08);
    }

    .fkBtn.registrati:hover {
        color: #8d41c5;
        color: #dbabff;
        text-shadow: 0 0 12px #d68cff, 0 0 30px #a85cff;
        transform: rotate(2deg) scale(1.08);
    }

.daggerheart-footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    background: linear-gradient(180deg, rgba(0,0,0,0.8) 0%, rgba(10,0,20,0.9) 100%);
    color: #e4d3ff;
    text-align: center;
    padding: 15px 0;
    border-top: 2px solid #7b1fa2;
    box-shadow: 0 -2px 10px rgba(123, 31, 162, 0.4);
    font-family: 'Cinzel', 'Trajan Pro', serif;
    letter-spacing: 0.5px;
    z-index: 9999;
}

.footer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.footer-rating {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: center;
}

    .footer-rating h3 {
        margin: 0;
        font-size: 1.1em;
        font-weight: 600;
        color: #c39bff;
        text-shadow: 0 0 6px rgba(195, 155, 255, 0.5);
    }

.pegi-icon {
    height: 38px;
    width: auto;
    filter: drop-shadow(0 0 6px #6a00ff);
    transition: transform 0.3s ease;
}

    .pegi-icon:hover {
        transform: scale(1.1);
    }

.footer-text {
    margin: 0;
    font-size: 0.9em;
    opacity: 0.85;
}

.highlight {
    color: #ffb6f9;
    text-shadow: 0 0 6px #ffb6f9;
}