:root {}
@font-face {
    font-family: 'Druk Trial';
    src: url('../fonts/druk-trial/Druk-Medium-Trial.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

.button-ecommerce,
.btn-iscriviti-al-corso {
    position: relative;
}

.panda-cart-count {
    position: absolute;
    top: -2px;
    right: -4px;
    background-color: #ff0000;
    color: white;
    font-family: 'Figtree', sans-serif;
    font-style: normal;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    min-width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px;
    box-sizing: border-box;
}
@media screen and (max-width:767px) {
.panda-cart-count {
    top: -10px;
    right: -8px;
}
}

/* Nasconde il badge se il carrello è vuoto */
.panda-cart-count:empty,
.panda-cart-count[data-count="0"] {
    display: none;
}

    .woocommerce .quantity.buttons_added {
        width: fit-content;
    }


    .woocommerce .coupon-form {
    display: none;
}

table.shop_table.cart td.product-name .name a {
    font-size:125%!important;
    color: #000;
}


body,
html {
    margin: 0 !important;
    padding: 0 !important;
    height: 100% !important;
}
a:hover {
    color: #ff0000;
}

/* Corpo e impaginazione base */
body {
    font-family: 'Figtree', sans-serif;
    /*font-style: italic;*/
}

/* HEADER */
header {
    display: flex;
    margin: 0 4vw;
    margin-top: 2vh;
    margin-bottom: 1vh;
    flex-wrap: wrap;
}

header .logo-mob,
header .menu-mob,
header .hamburger {
    display: none;
}

.logo-desk {
    height: auto;
}

/* Logo */
.logo-header {
    width: 74%;
    height: auto;
}

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

/* Menu di navigazione */
.nav-header {
    position: relative;
    width: 100%;
    display: flex;
    bottom: 0vh;
    padding-top: 2vh;
    justify-content: space-between;
    align-items: center;
}

.nav-header div {
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-header div a {
    font-family: 'Druk Trial', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 4vw;
    letter-spacing: 0;
    text-align: center;
    text-transform: uppercase;
    color: black;
    text-decoration: none;
    transition: color 0.3s ease;

    padding-top: 10px;
    line-height: 1em;
}

.nav-header div a:hover {
    color: red;
}


.nav-header .box-ecommerce {
    background-color: #000;
    padding: 4px 15px;
    gap: 10px;
    height: fit-content;
}
.nav-header .box-ecommerce button {
    background-color: #000;
    border: 0;
    padding: 1.2rem;
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.nav-header .box-ecommerce button svg {
    width: 1.8vw;
    height: auto;
}


.menu-mob .box-ecommerce {
    position: absolute;
    bottom: 40px;
    background-color: #000;
    padding: 12px 18px;
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.menu-mob .box-ecommerce button {
    background-color: #000;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.menu-mob .box-ecommerce button svg {
    width: 23px;
    height: auto;
}


/* ---- TEXT SWITCH (stile e fade) ---- */
.text-switch {
    color: black;
    width: 26%;
    height: auto;
    padding-left: 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-family: 'Figtree', sans-serif;
    font-size: 1vw;
    font-weight: 700;
    text-align: right;
}


.text-switch span {
    text-transform: uppercase;
    font-weight: 700;
    text-align: right;
    position: absolute;
    width: 100%;
    opacity: 0;
    transition: opacity .4s ease;
    padding: 0vh;
}

/* l’elemento visibile diventa "relativo" così occupa spazio e allinea il testo */
.text-switch span.ts-show {
    opacity: 1;
    position: relative;
    font-weight: 700;
}

/* mobile: tieni la tua logica */
@media (max-width:800px){
    header .logo-desk,
    header .menu-desk,
    header .text-switch {
        display: none;
    }
}

/* 1) DEFAULT: nascondi ovunque (forzato) */
header .box-ecommerce{
  display: none !important;
}

/* 2) WooCommerce: mostra (forzato) */
body.woocommerce header .box-ecommerce,
body.woocommerce-page header .box-ecommerce,
body.post-type-archive-product header .box-ecommerce,
body.tax-product_cat header .box-ecommerce,
body.tax-product_tag header .box-ecommerce,
body.single-product header .box-ecommerce,
body.woocommerce-cart header .box-ecommerce,
body.woocommerce-checkout header .box-ecommerce,
body.woocommerce-account header .box-ecommerce{
  display: flex !important; /* se ti serve block, cambia qui */
}




/* FOOTER */
footer {
    margin-top: calc(10vh + 10vw);
    height: 35vh;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    position: relative;
    padding-top: 20vh;
    margin-bottom: 20px;
}

.footer-dx a,
.footer-sx a {
    font-size: 1.3vw;
}

.footer-sx {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: calc(10px + 1vw);
    padding-left: 2vw;
    padding-bottom: 2vh;
}

.footer-center {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    justify-content: flex-end;
}

.footer-center img {
    max-height: 90%;
    width: auto;
    display: block;
    margin: 0 auto;
}

.img-testa-panda {
    transition: transform 0.3s ease;
    transform-origin: center bottom;
}

.footer-dx {
    text-align: right;
    padding-right: 2vw;
    padding-bottom: 2vh;
}

footer a {
    font-family: 'Figtree', sans-serif;
    font-weight: bold;
    font-style: normal;
    font-size: 1vw;
    color: black;
    text-decoration: none;
}

/* HOME PAGE */

#home {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#home .contatti {
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#home .contatti p {
    font-weight: 800;
    font-size: 2.5vw;
}

#home .btn-torna-news {
    width: 30%;
    margin-top: 1vh;
}



/* NEGOZIO SBAGLIATO - DA SOSTITUIRE HOME */
.woocommerce .products .product .item-image a {
    position: relative;
}

.woocommerce .products .product .item-image a::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("http://pandacore.it/wp-content/uploads/2025/10/cornicePandacore.svg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    pointer-events: none;
    z-index: 1000;
}

/* CHI SIAMO */
.row-autore {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4vw;
    padding: 8vh 0;
}

.txt-autore,
.img-autore {
    flex: 1;
}

.img-autore {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

.img-wrap {
    position: relative;
    display: contents;
    max-width: 100%;
    height: auto;
    line-height: 0;
}

.img-wrap img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.img-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("http://pandacore.it/wp-content/uploads/2025/10/cornicePandacore.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    pointer-events: none;
    z-index: 2;
}

.txt-autore {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    position: relative;
}

.row-autore:first-child {
    margin-right: 12vw;
    margin-left: 4vw;
}

.row-autore:nth-child(2) {
    margin-left: 12vw;
    margin-right: 4vw;
}

.txt-autore h1 {
    font-family: 'Druk Trial', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 4vw;
    line-height: 1;
    text-transform: uppercase;
    color: black;
}

.txt-autore p {
    margin-top: 5vh;
    font-size: 1.5vh;
    font-weight: 400;
    line-height: 1.6;
    margin: 0 auto;
    padding-bottom: 5vw;
    color: black;
}

.txt-autore .btn {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid black;
    border-radius: 50%;
    width: 3.5vw;
    height: 3.5vw;
    font-size: 2vw;
    cursor: pointer;
    box-sizing: border-box;
    padding: 0;
    user-select: none;
}

.txt-autore .btn-1 {
    position: absolute;
    right: 0;
    bottom: 0;
}

.txt-autore .btn-2 {
    position: absolute;
    left: 0;
    bottom: 0;
}

.txt-autore .firma {
    position: absolute;
    right: 5vw;
    bottom: -0.5vw;
    display: flex;
    gap: 10px;
}
.txt-autore .firma img {
    max-width: 50px;
}

/* ========== BASE MODALE ========== */
.modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgb(0, 0, 0);
    transition: opacity .32s ease;
    opacity: 0;
    pointer-events: none;
}

.modal.is-open {
    display: flex;
    opacity: 1;
    pointer-events: auto;
}

.modal__backdrop {
    position: absolute;
    inset: 0;
    cursor: pointer;
    background: transparent;
}


.modal__panel {
    position: relative;
    width: min(1200px, 94vw);
    max-width: 1200px;
    height: min(90vh, 860px);
    max-height: 90vh;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 1.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    color: #fff;
    outline: none;
}

.modal__close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: transparent;
    border: 1px solid white !important;
    color: #fff;
    font-size: 1.35rem;
    cursor: pointer;
}

/* ---------- HORIZONTAL SCROLL AREA ---------- */

#modal2 .btn-2 {
    left: unset;
    right: 0;
}

.hscroll {
    margin-top: 6rem;
    flex: 1 1 auto;
    display: flex;
    align-items: stretch;
    gap: 1.5rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.hscroll::-webkit-scrollbar {
    display: none;
}

.modal .gallery-container {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    height: 100%;
    width: max-content;
    padding: 0;
}

.gallery-container .img-autore {
    width: 20vw;
    flex-direction: column;
    align-items: center;
    justify-content: start;
}

.gallery-container .img-wrap {
    position: relative;
    height: 100%;
    height: auto;
    line-height: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.img-autore-title {
    background-color: #d3d3d3;
    color: black;
    width: 50%;
    text-align: center;
    font-weight: bold;
    margin-top: 1rem;
}

.box-foto-1,
.box-foto-2 {
    height: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    padding: 1rem;
    box-sizing: border-box;
    justify-content: flex-end;
}

.box-foto-1 {
    margin-left: 2vw;
}

.box-foto-1 img {
    height: auto;
    width: 100%;
    object-fit: cover;
}



/* --- PARTE ALTA --- */
.box-foto-1>div:nth-child(1) {
    display: flex;
    height: 60%;
    width: 50%;
    position: relative;
}

.box-foto-1>div:nth-child(1) p {
    width: 100%;
    font-size: 1.2rem;
    line-height: 1.2;
    margin: 0;
    padding: 0 1rem;
    margin-right: 1rem;
    color: #fff;
    position: absolute;
    top: 0;
    left: -1vw;
}

.box-foto-1>div:nth-child(2) {
    width: 50%;
    height: 60%;
}

/* --- PARTE BASSA --- */
.box-foto-1-bottom {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 0.5rem;
    height: 40%;
    width: 60%;
    overflow: hidden;
}

.box-foto-1-bottom>div {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.box-foto-1-bottom>div:first-child {
    width: 60%;
    height: 100%;
}

.box-foto-1-bottom>div:last-child {
    width: 40%;
    height: 60%;

}

.box-foto-1-bottom img,
.box-single-img img {
    width: auto;
    height: 100%;
    object-fit: cover;
}

.box-foto-1 p {
    padding: 0;
}

.box-foto-2 img {
    width: auto;
    height: 100%;
    object-fit: contain;
    display: block;
    padding: 0.5rem;
}

.box-foto-2>div {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    overflow: hidden;
}

.box-foto-2>div:first-child {
    position: absolute;
    top: 0;
    left: 0;
    height: 70%;
}

.box-foto-2>div:nth-child(2) {
    position: absolute;
    top: 0;
    right: 0;
    height: 55%;
}

.box-foto-2>div:nth-child(3) {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 30%;
}

.box-foto-2>div:last-child {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 45%;
}

.box-single-img {
    height: 80%;
}

.sez-instagram,
.sez-contatti {
    display: flex;
    flex-direction: column;
    height: 35vh;
    justify-content: center;
    align-items: center;
}

.sez-instagram h1,
.sez-contatti h1 {
    text-transform: uppercase;
}

.sez-instagram p,
.sez-contatti p {
    font-size: 1vw;
    font-weight: 400;
}

.insta {
    border: none;
    height: 5rem;
    aspect-ratio: 1 / 1;
    background-color: #fff;
}

.insta img {
    object-fit: cover;
}

.insta img:hover {
    filter: invert(18%) sepia(89%) saturate(7491%) hue-rotate(358deg) brightness(103%) contrast(107%);
}

.sez-contatti {
    background-color: #E6E7E9;
    padding: 4vh;
}

.sez-contatti h1 {
    margin-top: 0;
}

.contattaci {
    margin-top: 5vh;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}

.contact-giacomo,
.contact-pierpaolo {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 5rem;
    padding: 1rem;
    border: 1px solid black;
}

.contact-giacomo h1,
.contact-pierpaolo h1 {
    font-family: 'Druk Trial', sans-serif;
    font-size: 1.4vw;
    display: flex;
    align-items: center;
    margin: 0;
}

.contact-giacomo h1:hover,
.contact-pierpaolo h1:hover {
    color: red;
}

#newsletter,
#partner {
    display: flex;
    width: 100%;
    padding: 0 4vw;
}

#newslettre section {
    padding: 0;
}

#newsletter .contattaci {
    display: flex;
    align-items: flex-start;
    margin: 0;
    width: 18%;
}

#newsletter .container {
    width: 82%;
}

#newsletter .contact-giacomo,
#newsletter .contact-pierpaolo {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    width: 50%;
    height: auto;
    padding: 0.8rem 0.5rem;
}

#newsletter .contact-giacomo h1,
#newsletter .contact-pierpaolo h1 {
    font-weight: 500;
    font-style: normal;
    font-size: 1.3vw;
    text-transform: uppercase;
}

.featured-post {
    padding: 0;
    max-width: 100%;
    margin-bottom: 15vh;
}

/* --- POST LIST --- */
.post-list {
    display: flex;
    flex-direction: column;
    gap: 15vh;
    width: 100%;
}

.featured-post article,
.post-list article {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: calc(18vh + 18vw);
    overflow: hidden;
}

.featured-post .imgNewsPage,
.post-list .imgNewsPage {
    flex: 0 0 55%;
    height: 100%;
    overflow: hidden;
    margin-right: 1vw;
    display: block;
}

.featured-post .imgNewsPage img,
.post-list .imgNewsPage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.testofeat {
    height: 100%;
    width: 45%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 2vw;
}

.leggi-piu {
    background-color: #fff;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    width: 40%;
    padding: 1vh 0;
    border: 1px solid black;
    bottom: 0;
    right: 0;
}

.leggi-piu h1 {
    font-family: 'Druk Trial', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 2vw;
    margin: 0;
}

.leggi-piu h1:hover {
    color: red;
}


.title-postFeat,
#partner h1 {
    font-family: 'Druk Trial', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 4vw;
    color: black;
}

#partner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 8vh;
}

#partner h1 {
    margin-bottom: 2vh;
}

.cosa-fate,
.lavorato-con,
.form-contattaci {
    width: 60%;
    height: auto;
    text-align: center;
}

.cosa-fate,
.lavorato-con {
    margin-bottom: 10vh;
}

.form-contattaci span {
    font-size: 1.5rem;
    font-weight: 800;
}

.p-big {
    font-size: 2vw;
    font-weight: 800;
    color: black;
}

.lavorato-con {
    width: 100%;
}

.container-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 3rem;
    width: auto;
    padding: 1rem;
}

.container-logo a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 10vw;
    box-sizing: border-box;
}

.container-logo a img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
}


#Single-post,
#Single-post .post-content {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 3vh;
    gap: 4vh;
}

.post-content img {
    max-height: 100vh;
    object-fit: contain;
}

/* === CONTENITORE PRINCIPALE === */
#Single-post .post-thumbnail {
    position: relative;
    width: 75%;
    /* occupa il 75% della larghezza del contenitore genitore */
    aspect-ratio: 1255 / 670;
    /* proporzioni esatte della cornice */
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    /* evita overflow su resize */
}

/* === IMMAGINE INTERNA === */
#Single-post .post-thumbnail img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* riempie l’area rispettando le proporzioni */
    transform: translate(-50%, -50%);
    z-index: 1;
    border-radius: 0;
    /* opzionale */
}

/* === CORNICE SVG SOVRAPPOSTA === */
#Single-post .post-thumbnail::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("http://pandacore.it/wp-content/uploads/2025/10/Cornice-Oriz.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    pointer-events: none;
    z-index: 2;
}

#Single-post p {
    font-size: 1vw;
    font-weight: 400;
    font-style: normal;
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    width: 100%;
}

#Single-post h1,
#home h1 {
    font-family: 'Druk Trial', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 5rem;
    color: black;
    margin: 0;
}

#Single-post .post-content {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

#Single-post .post-content img {
    width: 100%;
}

.btn-torna-news {
    background-color: #fff;
    border: 1px solid black;
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    width: fit-content;
    padding: 1.2rem 2rem 1rem 2rem;
}

#Single-post .btn-torna-news h1,
#home .btn-torna-news h1 {
    font-size: 2vw;
    margin: 0;
    text-align: center;
}

#Single-post .btn-torna-news h1:hover,
#home .btn-torna-news h1:hover {
    color: red;
}



/* ========== RESPONSIVE ========== */

@media (max-width:1200px) {

    .modal__panel {
        width: min(980px, 94vw);
        height: 78vh;
    }

    .row-autore:first-child {
        margin-right: 4vw;
    }

    .row-autore:nth-child(2) {
        margin-left: 4vw;
    }

    .sez-contatti .contattaci {
        height: 5rem;
        padding: 1rem;
        width: 70%;
    }

    .contact-giacomo,
    .contact-pierpaolo {
        width: 30%;
    }

    .contact-giacomo h1,
    .contact-pierpaolo h1 {
        font-size: 2vw;
    }

    #newsletter {
        flex-direction: column-reverse;
        align-items: center;
        gap: 5vh;
    }

    #newsletter .container {
        width: 100%;
    }

    .title-postFeat {
        font-size: 5vw
    }

    #newsletter .contattaci {
        width: 30%;
    }

    #newsletter .contact-giacomo h1,
    #newsletter .contact-pierpaolo h1 {
        font-size: 2vw;
    }
}


@media (max-width: 1024px) {

    footer {
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
        height: auto;
        padding-top: 7vh;
        margin-top: 0;
        padding-bottom: 20px;
    }

    .footer-sx,
    .footer-dx {
        width: 100%;
        display: flex;
        justify-content: center;
        text-align: center;
        padding: 1rem 0;
    }

    .footer-sx {
        flex-wrap: wrap;
        gap: 1.5rem;
    }

    .footer-dx {
        order: 3;
        padding-bottom: 1.5rem;
    }

    .footer-center {
        position: relative;
        transform: none;
        left: auto;
        bottom: auto;
        margin: 2rem 0;
        height: auto;
    }

    .footer-center img {
        max-width: 200px;
        height: auto;
    }

    .footer-dx a,
    .footer-sx a {
        font-size: 2vw;
    }

    .testa-panda .img-testa-panda {
        max-width: 165px;
    }

    .row-autore:first-child {
        margin-right: 4vw;
        margin-left: 4vw;
    }

    .row-autore:nth-child(2) {
        margin-left: 4vw;
        margin-right: 4vw;
    }

    .txt-autore .btn {
        width: 6vh;
        height: 6vh;
    }

    .sez-instagram p,
    .sez-contatti p {
        font-size: 2vw;
    }

    #newsletter .contact-giacomo h1,
    #newsletter .contact-pierpaolo h1 {
        font-size: 4vw;
    }

    #newsletter .contattaci {
        width: 60%;
    }

    #Single-post .post-thumbnail {
        width: 85%;
    }

    #Single-post .post-content {
        width: 60%;
    }

    #Single-post p {
        font-size: 2.2vw;
    }

    .p-big {
        font-size: 2.5vw;
    }
}



@media (max-width:800px) {

    header .logo-mob,
    header .menu-mob,
    header .hamburger {
        display: block;
    }

    header {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1rem 2rem;
    }

    /* Logo mobile centrato */
    header .logo-mob {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
    }

    header .logo-header {
        height: 15vh;
    }

    header .logo-mob img {
        width: 65vw;
        height: 100%;
        object-fit: contain;
    }

    /* Pulsante hamburger */
    .hamburger {
        position: absolute;
        right: 2rem;
        top: 50%;
        transform: translateY(-50%);
        width: 3rem;
        height: 1.5rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        cursor: pointer;
        z-index: 1001;
    }

    .hamburger span {
        display: block;
        height: 3px;
        width: 100%;
        background-color: black;
        border-radius: 2px;
        transition: all 0.3s ease;
    }

    .hamburger span:nth-child(2) {
        margin: 0.5rem 0;
    }

    /* Effetto "X" */
    .hamburger.active span:nth-child(1) {
        transform: rotate(45deg) translateY(11px);
    }

    .hamburger.active span:nth-child(2) {
        opacity: 0;
    }

    .hamburger.active span:nth-child(3) {
        transform: rotate(-45deg) translateY(-11px);
    }

    /* MENU MOBILE nascosto */
    header .menu-mob {
        position: fixed;
        top: 0;
        right: -100%;
        width: 100%;
        height: 100vh;
        background-color: white;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2rem;
        text-align: center;
        transition: right 0.4s ease;
        z-index: 1000;
        opacity: 0;
    }

    /* MENU MOBILE attivo */
    header .menu-mob.active {
        right: 0;
        opacity: 1;
    }

    /* Link del menu */
    header .menu-mob a {
        font-family: 'Druk Trial', sans-serif;
        font-size: 8vw;
        font-weight: 500;
        color: black;
        text-decoration: none;
        text-transform: uppercase;
        opacity: 0;
        transform: translateY(20px);
        animation: fadeInUp 0.5s ease forwards;
    }

    /* Effetto apparizione graduale */
    header .menu-mob.active a:nth-child(1) {
        animation-delay: 0.2s;
    }

    header .menu-mob.active a:nth-child(2) {
        animation-delay: 0.35s;
    }

    header .menu-mob.active a:nth-child(3) {
        animation-delay: 0.5s;
    }

    header .menu-mob.active a:nth-child(4) {
        animation-delay: 0.65s;
    }

    /* Animazione "fade in up" */
    @keyframes fadeInUp {
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* Blocca scroll quando il menu è aperto */
    body.no-scroll {
        overflow: hidden;
    }

    .modal__panel {
        width: calc(100vw - 0rem);
        height: calc(100vh - 3rem);
        padding: 1rem;
    }
    .modal .gallery-container {
        display: flex;
        flex-wrap: nowrap;
        align-items: stretch;
        height: 100%;
        width: 100%;
        padding: 0;
        flex-direction: column;
    }
    .gallery-container .img-autore {
    width: 80vw;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    }
    .box-foto-1>div:nth-child(1) p {
    width: 100%;
    font-size: 1.2rem;
    line-height: 1.2;
    margin: 0;
    padding: 0 1rem;
    margin-right: 1rem;
    color: #fff;
    position: absolute;
    top: 0;
    left: -5vw;
    }
    .box-single-img {
    display: none;
    }
    .box-foto-1 {
    margin-left: 0vw;
    }
    .box-foto-1-bottom {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    height: 40%;
    width: 80%;
    overflow: hidden;
    flex-direction: row;
    justify-content: flex-end;
    }
    .box-foto-2 {
    height: 50%;
    }

    .hscroll {
        padding: 0 1rem;
        margin-top: 0rem;
        gap: 1rem;
    }

    .featured-post article,
    .post-list article,
    .testofeat {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        width: 100%;
    }

    .title-postFeat {
        font-size: 6vw;
    }

    .leggi-piu {
        position: relative;
        width: 25%;
    }

    .leggi-piu h1 {
        font-size: 3vw;
    }

    .post-list {
        gap: 5vh;
    }

    .featured-post {
        margin-bottom: 5vh;
    }

    .chi-siamo {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 0 10vw;
        overflow: hidden;
    }

    .chi-siamo .row-autore {
        margin: 0;
        gap: 1vh;
    }

    .chi-siamo .row-autore:nth-child(2) {
        flex-direction: column-reverse;
    }

    .img-wrap {
        width: 90%;
    }

    .row-autore {
        flex-direction: column;
        margin: 0 5vw;
        padding: 5vh 0;
    }

    .txt-autore {
        align-items: center;
    }

    .txt-autore h1 {
        font-size: 6vw;
    }

    .txt-autore p {
        font-size: 3vw;
    }

    .txt-autore .btn {
        width: 6vh;
        height: 6vh;
        font-size: 8vw;
        right: 0;
        bottom: -25px;
    }

    .txt-autore .firma {
        right: 15vw!important;
        bottom: -25px;
    }

    .sez-instagram,
    .sez-contatti {
        text-align: center;
    }

    .sez-instagram p,
    .sez-contatti p {
        font-size: 3vw;
    }

    .sez-contatti {
        width: 100vw;
        padding: 0 10vw;
        height: 50vh;
        margin-top: 2vh;
    }

    .sez-contatti .contattaci {
        height: 5rem;
        padding: 1rem;
        width: 70%;
    }

    .contact-giacomo,
    .contact-pierpaolo {
        width: 100%;
    }

    .contact-giacomo h1,
    .contact-pierpaolo h1 {
        font-size: 4vw;
    }

    #Single-post .post-content {
        width: 70%;
    }

    img #newsletter .contattaci {
        width: 60%;
    }

    #Single-post .btn-torna-news h1 {
        font-size: 1.5vw;
    }

    #Single-post .post-content {
        width: 82%;
    }
    #Single-post h1 {
        font-size: 3.6rem;
    }

    #Single-post p {
        font-size: 2.2vw;
    }

    .cosa-fate,
    .lavorato-con,
    .form-contattaci {
        width: 75%;
    }

    .p-big {
        font-size: 3vw;
    }
}


@media (max-width: 600px) {
    footer {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: auto;
        gap: 1.5rem;
    }

    .footer-sx,
    .footer-dx {
        flex-direction: column;
        align-items: center;
        gap: 1rem;
        padding: 0;
    }

    .footer-center {
        order: 2;
        margin: 1.5rem 0;
    }

    .footer-dx a,
    .footer-sx a {
        font-size: 3vw;
    }

    .cosa-fate,
    .lavorato-con,
    .form-contattaci {
        width: 85%;
    }

    .p-big {
        font-size: 3.7vw;
    }

}


@media (max-width: 480px) {

    header .logo-header {
        height: auto;
    }

    .txt-autore h1 {
        font-size: 8vw;
    }

    .txt-autore p {
        font-size: 3.5vw;
        padding-bottom: 12vw;
    }

    .txt-autore .btn {
        bottom: -25px;
    }

    .txt-autore .btn-2 {
        right: 0;
        left: unset;
    }

    .txt-autore .firma {
        right: 10vw;
        bottom: -25px;
    }

    .sez-instagram p,
    .sez-contatti p {
        font-size: 4vw;
    }

    #newsletter .contattaci {
        width: 70%;
    }

    .leggi-piu {
        position: relative;
        width: 40%;
    }

    .leggi-piu h1 {
        font-size: 4vw;
    }

    #Single-post .btn-torna-news h1 {
        font-size: 4.5vw;
    }

    #Single-post .post-content {
        width: 90%;
    }

    #Single-post p {
        font-size: 14px;
    }

    .cosa-fate,
    .lavorato-con,
    .form-contattaci {
        width: 90%;
    }

    .p-big {
        font-size: 6vw;
    }
}


.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:before {
    width: fit-content;
}