/*!
Theme Name: customTheme
Author: Cowlab
Version: 1.2.0
*/
body {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    line-height: 1.875rem;
    color: var(--col-black);
    margin-top: 70px;
}
:root {
    --col-primary: #D54842;
    --col-secondary: #EDE3D4;
    --col-green: #8E9B88;
    --col-grey: #423E3B;
    --col-white: #ffffff;
    --col-black: #423E3B;
    --col-dark: #000000;
    --col-yellow: #E4A71A;

    --widthnoscroll: calc(100vw - var(--scrollbar-width));
    --spaziolat: calc(var(--widthnoscroll) - 1320px);
    --singolspaziola: calc(var(--spaziolat) /2);
}

.mansalva-regular {
  font-family: "Mansalva", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.jost-regular {
  font-family: "Jost", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.jost-medium {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}
  
.jost-semibold {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
}
  
.jost-bold {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}
  
/*--------------------------------------------------------------
## Custom theme style
--------------------------------------------------------------*/
/* ! Background color */
.back-primary {background: var(--col-primary);}
.back-secondary {background: var(--col-secondary);}
.back-green {background: var(--col-green)}
.back-grey {background: var(--col-grey)}
.back-white {background: var(--col-white);}
.back-black {background: var(--col-black);}
.back-dark {background: var(--col-dark);}
.back-yellow {background: var(--col-yellow) !important;}

 
/* ! Colors */
.color-primary {color: var(--col-primary);}
.color-secondary {color: var(--col-secondary);}
.color-green {color: var(--col-green) !important;}
.color-grey {color: var(--col-grey)}
.color-white {color: var(--col-white) !important;}
.color-black {color: var(--col-black);}
.color-dark {color: var(--col-dark);}
.color-yellow {color: var(--col-yellow) !important;}


/* ! Tipografy */
a {text-decoration: none; color: var(--col-black);}
a:hover {text-decoration: none;}

.title-label {
    font-size: 1.2rem;
}
.title-hero {
    font-size: 3.4375rem; 
    font-family: "Mansalva", sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: 4rem;
}
.sub-title-hero {
    font-size: 2rem; 
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    line-height: 2.25rem;
}

.title-sez h2 {color: var(--col-primary); margin-bottom: 0;}
.title-sez h2 strong {color: var(--col-secondary); font-weight: 500;}

.nopage-title {
    font-family: "Mansalva", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2rem;
    line-height: 3rem;
}
.text-jost-big {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 2.6875rem;
    line-height: 3rem;
}
.text-jost-medium {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 1.5rem;
    line-height: 2rem;
}

.title-mansalva {
    font-size: 2.6875rem;
    font-family: "Mansalva", sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: normal;
    color: var(--col-primary);
}

h3 {
    font-size: 1.5rem;
    line-height: 2rem;
}

/* .title-sez h2::after {
    content: '';
    display: block;
    width: 100px;
    height: 1px;
    background-color: var(--col-grey-light);
    margin: 8px auto 0; 
} */
/* .title-sez p {
    color: var(--col-primary);
    font-size: 1.2rem;
} */

/* ! Button */
.btn-primary {
    background: var(--col-primary);
    border-radius: 25px;
    border: 1px solid var(--col-primary);
    color: var(--col-white);
    padding: 5px 2rem;
    text-transform: uppercase;
}
.btn-primary:hover,
.btn:focus-visible,
.btn-check:checked+.btn:focus-visible, .btn.active:focus-visible, .btn.show:focus-visible, .btn:first-child:active:focus-visible, :not(.btn-check)+.btn:active:focus-visible,
.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active
{
    background-color: var(--col-secondary);
    border-color: var(--col-secondary);
    box-shadow: none;
    text-decoration: none;
    color: var(--col-black);
}

.btn-secondary {
    background: var(--col-secondary);
    border-radius: 25px;
    border: 1px solid var(--col-primary);
    color: var(--col-primary);
    padding: 5px 2rem;
    text-transform: uppercase;
}
.btn-secondary:hover,
.btn:focus-visible,
.btn-check:checked+.btn:focus-visible, .btn.active:focus-visible, .btn.show:focus-visible, .btn:first-child:active:focus-visible, :not(.btn-check)+.btn:active:focus-visible,
.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active
{
    background-color: var(--col-primary);
    border-color: var(--col-white);
    box-shadow: none;
}

.btn-light {
    background: var(--col-secondary);
    border-radius: 25px;
    border: 1px solid var(--col-secondary);
    color: var(--col-white);
    padding: 5px 2rem;
}
.btn-light:hover,
.btn:focus-visible,
.btn-check:checked+.btn:focus-visible, .btn.active:focus-visible, .btn.show:focus-visible, .btn:first-child:active:focus-visible, :not(.btn-check)+.btn:active:focus-visible,
.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active
{
    background-color: var(--col-primary);
    border-color: var(--col-primary);
    box-shadow: none;
    color: var(--col-white);
    text-decoration: none;
}


/* ! Header */
header {
    position: fixed; 
    z-index: 10000;
    top: 0;
}

/* ! News */

/* ! Modale */
.modal {z-index: 100000;}


/* ! Swiper HP */
.swiper-button-next:after,
.swiper-button-prev::after{
    content: none;
}
.swiper-button-next,
.swiper-button-prev {
  width: 54px;
  height: 24px;
  background: var(--col-primary);          
  border-radius: 999px;          

  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  /* position: relative; */
  border: none;
  background-image: none;
}

/* Freccia estesa (next) — usa SVG inline per nitidezza */
.swiper-button-next::before {
  content: "";
  display: block;
  width: 28px;           
  height: 8px;           
  background-image: url("data:image/svg+xml;utf8,<svg width='28' height='8' viewBox='0 0 28 8' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M27.3271 4.37992C27.5223 4.18466 27.5223 3.86808 27.3271 3.67281L24.1451 0.490833C23.9498 0.295571 23.6333 0.295571 23.438 0.490833C23.2427 0.686095 23.2427 1.00268 23.438 1.19794L26.2664 4.02637L23.438 6.85479C23.2427 7.05006 23.2427 7.36664 23.438 7.5619C23.6333 7.75716 23.9498 7.75716 24.1451 7.5619L27.3271 4.37992ZM0.0268555 4.02637V4.52637H26.9735V4.02637V3.52637H0.0268555V4.02637Z' fill='white'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
}


/* Freccia estesa (prev) — SVG speculare */
.swiper-button-prev::before {
  content: "";
  display: block;
  width: 28px;                   
  height: 9px;                   
  background-image: url("data:image/svg+xml;utf8,<svg width='28' height='9' viewBox='0 0 28 9' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0.672924 4.29977C0.477663 4.49503 0.477663 4.81161 0.672924 5.00688L3.8549 8.18886C4.05017 8.38412 4.36675 8.38412 4.56201 8.18886C4.75727 7.99359 4.75727 7.67701 4.56201 7.48175L1.73359 4.65332L4.56201 1.8249C4.75727 1.62963 4.75727 1.31305 4.56201 1.11779C4.36675 0.922526 4.05017 0.922526 3.8549 1.11779L0.672924 4.29977ZM27.9731 4.65332L27.9731 4.15332L1.02648 4.15332L1.02648 4.65332L1.02648 5.15332L27.9731 5.15332L27.9731 4.65332Z' fill='white'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
}

.swiper-button-next::before,
.swiper-button-prev::before {
  transition: filter 0.3s ease;
}

.swiper-button-next:hover::before,
.swiper-button-prev:hover::before,
.swiper-button-next:active::before,
.swiper-button-prev:active::before {
  /* Inverte i colori del pseudo-elemento, rendendo la freccia nera */
  filter: invert(1);
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background: var(--col-secondary);
}


.swiper-pagination-bullet {
    border-radius: 50% !important;
    width: 10px;
    height: 10px;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active {background: var(--col-primary) !important;}


/* .breadcrumb-hero {position: absolute; bottom: 10px; left: 0;}
.breadcrumb-hero #breadcrumbs a {color: var(--col-white);} */


/* ! Hero e Banner */
.image-container {
    position: relative;
    /* display: inline-block; */
    display: block;
    width: 100%;
}
.image-container img {
    display: block;
    width: 100%;
    height: auto;
}
.overlay {
    position: absolute;
    top: 0;
    /* left: 0; */
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: .3;
}
.over-text {position: absolute; top: 50%; left: 0; transform: translateY(-50%);}

.over-text.over-page {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(0);
    text-align: center;
    height: 100%;
}
.over-text.over-page h1 {
    font-family: "Mansalva", sans-serif;
    font-size: 2.8125rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    line-height: 3.5rem;
}

.hero .overlay {
    left: 0;
    /* background: url('inc/assets/images/back_hp.png') no-repeat; */
    background-size: cover;
    background-color: #000000;
    opacity: .3;
}


.over-dx .banner-text {position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.over-sx .banner-text {position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.banner-text h3 {font-size: 3rem; line-height: 3.8rem; margin-bottom: 1.5rem;}
.banner-text h4 {
    font-size: 1.25rem; 
    line-height: 2.125rem; 
    font-weight: normal; 
    margin-bottom: 1.5rem;
}



/* ! Filter */
.btn-filer-group .btn-primary {
    color: var(--col-dark);
}
.btn-filer-group .btn-primary.active {
    background: var(--col-secondary);
}

/* Scroll Filter */
.filter-cont {
    position: fixed;
    bottom: 0;
    z-index: 1000;
}

#filter-scroll-container {
    display: none;
}

#filter-scroll-container div {
    display: flex;   
    max-width: 100%;
    flex-direction: column;
    max-height: 70vh;
    overflow-x: auto;
}

.filter-header .icon-filter {
    width: 30px;
    height: 30px;
    border-radius: 50%;          
    background: var(--col-secondary);           
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    position: absolute;
    top: -45px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: all 0.5s;
}

.filter-header .icon-filter.active {
    opacity: 1;
}


.filter-header .icon-filter:before {
    content: '';
    position: absolute;
    width: 16px;   
    height: 1px;   /* spessore delle linee */
    background: #000; /* nero */
    border-radius: 1px;
    transform: rotate(45deg);
}
.filter-header .icon-filter:after {
    content: '';
    position: absolute;
    width: 16px;   
    height: 1px;   /* spessore delle linee */
    background: #000; /* nero */
    border-radius: 1px;
    transform: rotate(-45deg);
}



/* ! BoxCard listing */
.box-card .box-content {
    border-radius: 2%;
    overflow: hidden;
    position: relative;
}

.title-card {
    font-weight: normal;
    font-size: 1.5rem;
    color: var(--col-primary);
    line-height: 2rem;
}
.title-card.font-mansalva {
    font-family: "Mansalva", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2rem;
    line-height: 2.625rem;
}
.card {
    border: 0;
    border-radius: 0;
}
.card-body {
    padding-left: 0;
    padding-right: 0;
}

/* ! Link card */
.card a.link-card {
    text-transform: uppercase;
    color: var(--col-black);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.625rem;
    position: relative;
    float: left;
    transform: translateX(45px);
    transition: all 0.3s;
    display: block;
}
.card:hover a.link-card {
    transform: translateX(0);
}
.card a.link-card:before, 
.card a.link-card:after {
    content: '';
    display: block;
    position: absolute;
    height: 1px;
    top: 48%;
    background: #181B31;
    border-radius: 4px;
    transition: all 0.3s;
}
.card a.link-card:before {
    width: 30px;
    right: 110%;
}
.card a.link-card:after {
    width: 0%;
    left: calc(100% + 10px);
    transition-delay: 0s;
}
.card:hover a.link-card:before {
    width: 0;
}
.card:hover a.link-card:after {
    width: 30px;
}

.card a.link-card span {
    position: absolute;
    display: block;
    width: 30px;
    height: 100%;
    left: calc(100% + 8px);
    top: 1px;
    transform: translateZ(0);
    backface-visibility: hidden;   
}

.card a.link-card span:before, 
.card a.link-card span:after {
    content: '';
    display: block;
    position: absolute;
    width: 0;
    height: 1px;
    top: 0;
    right: 0;
    background: #181B31;
    border-radius: 4px;
    transform: rotate(45deg);
    transition: all 0.15s;
    transition-delay: 0.25s;
    opacity: 0;
}
.card a.link-card span:before {
    top: 30px;
    right: 0;
    /* transform: rotate(45deg); */
    transform: rotate(45deg) translateZ(0);
}
.card a.link-card span:after {
    top: 14px;
    right: 0;
    /* transform: rotate(-45deg); */
    transform: rotate(-45deg) translateZ(0);
}
.card:hover a.link-card span:before {
    width: 11px;
    top: 7px;
    right: -5px;
    opacity: 1;
    transition-delay: 0s;
}
.card:hover a.link-card span:after {
    width: 11px;
    top: 15px;
    right: -5px;
    opacity: 1;
    transition-delay: 0s;
}
.card .img-card-hover {
    position: relative;
    height: auto;
    line-height: 0;
    width: 100%;
}
.card .img-card-hover img {
    height: 267px;
    object-fit: cover;
}

.card .img-card-hover.masonry img {
    height: auto;
    object-fit: cover;
}

.sw-personaggi .card .img-card-hover:after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 50%;
    opacity: 1;
    bottom: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.9) 0%,   /* nero quasi pieno alla base */
        rgba(0,0,0,0.7) 30%,  /* ancora scuro un po' più su */
        rgba(0,0,0,0.3) 60%,  /* più leggero */
        rgba(0,0,0,0) 100%    /* trasparente in alto */
    );
    transition: all 0.15s;
}
.sw-personaggi .card:hover .img-card-hover:after {
    opacity: 0;
}

.sw-personaggi .card .img-card-hover:before,
.card .img-card-hover:before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--col-dark);
    opacity: 0;
    top: 0;
    transition: all 0.15s;
}
.sw-personaggi .card:hover .img-card-hover:before,
.card:hover .img-card-hover:before {
    opacity: .6;
}



.card .img-card-hover a {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
    z-index: 101;
}
.card .title-top {position: absolute; bottom: 20px; left: 10px; z-index: 10; font-size: 1.25rem;}

.badge-category {
    position: absolute;
    top: 0;
    padding: 0 15px;
    background: var(--col-secondary);
    font-size: 1rem;
    line-height: 1.5rem;
    text-transform: uppercase;
    color: var(--col-black);
    z-index: 100;
}


/* ! Lista titoli colorati (Servizi) */
/* Colonne 1, 4, 7... */
.color-list .row .col:nth-child(3n+1) h3.title-card {
  color: var(--col-primary);
}

/* Colonne 2, 5, 8... */
.color-list .row .col:nth-child(3n+2) h3.title-card {
  color: var(--col-yellow);
}

/* Colonne 3, 6, 9... */
.color-list .row .col:nth-child(3n+3) h3.title-card {
  color: var(--col-green);
}




/* ! Single eventi */
.header-single-mobile .single-title .cont-page {
    display: block;
}
.header-single-mobile .single-title h1 {
    font-size: 2.8125rem;
    color: var(--col-white);
    font-family: "Mansalva", sans-serif;
    font-weight: 400;
    font-style: normal;
}


.header-single {
    /* min-height: 70vh; */
    min-height: 470px;
    height: 100%;
    position: relative;
}
.header-single .single-title .cont-page {
    position: relative;
    display: none;
    /* top: 50%;
    transform: translateY(-50%); */
}
.header-single .single-title h1 {
    font-size: 2.8125rem;
    color: var(--col-white);
    font-family: "Mansalva", sans-serif;
    font-weight: 400;
    font-style: normal;
}
.single-title .badge-category {
    position: relative;
    display: inline-block;
}
.path-single-img {
    margin-top: -25rem;
}



.box-card .info h3 {
    font-size: 1.2rem;
    font-weight: normal;
}


.box-card .content-carat {
    position: absolute;
    bottom: 15px;
    display: none;
}

.box-card .content-carat.center {
    left: 50%;
    translate: -50%;
}

.box-card .content-carat.in-page {
    position: relative;
    bottom: auto;
}
.box-card .content-carat div {
    display: flex;
    align-items: center;
    margin-bottom: .5rem;
}
.box-card .content-carat div img {
    width: 35px;
}
.box-card .content-carat div p {
    margin: 0;
    font-size: .8rem;
}


.box-card .content-carat.in-page div p {
    font-size: 1rem;
}

.box-card hr {
    opacity: 1;
    width: 20%;
    margin: 0 auto;
    margin-top: 1rem;
    margin-bottom: 1rem;
    border-top: var(--col-white) solid;
}


/* ! Utility */
.font-w-normal {font-weight: 400;}
.font-w-medium {font-weight: 500;}
.font-w-semibold {font-weight: 600;}
.font-w-bold {font-weight: 700;}

.font-sz-small {font-size: .8rem; line-height: 1rem;}
.font-sz-normal {font-size: 1rem; line-height: 1.2rem;}
.font-sz-big {font-size: 2rem; line-height: 2.6rem;}

.w-80 {
    width: 80% !important;
}

.min-height-custom {min-height: 350px;}

.element-fluid {
    margin-left: calc( -50vw + 50%) !important; 
    margin-right: calc( -50vw + 50%) !important; 
    max-width: 100vw;
}

#breadcrumbs {
    display: none;
    padding: 10px 0; 
    color: var(--col-white);
    /* white-space: nowrap;  */
    overflow-x: hidden;
}
#breadcrumbs a {color: var(--col-white);}
#breadcrumbs .breadcrumb_last {font-weight: 700;}

.wp-block-separator {
    width: 50%;
    margin: 0 auto;
    /* margin: 1rem 0; */
    margin-bottom: 2rem;
    margin-top: 1rem;
    border-top: 1px solid;
}

.wp-embed-aspect-16-9 iframe{
    height: 250px;
}

#mysticky-wrap {
    position: fixed;
    z-index: 9999;
    width: 100%;
}

/* Maps in contatti */
.map-responsive {
    overflow: hidden;
    padding-bottom: 77%; /* Rapporto 4:3, per un rapporto 16:9 usa il 56.25% */
    position: relative;
    height: 0;
}
.map-responsive iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}


/* ! Menu */
.navbar-toggler {border: none; }
.navbar-toggler:focus {box-shadow: none;}
/* .navbar-nav {margin-left: 2rem; margin-right: 2rem !important;} */
.navbar-nav .nav-link {color: var(--col-white); padding: 0px 10px !important; font-size: 1.2rem; line-height: 1.8rem; text-transform: uppercase; font-weight: 400;}
.navbar-nav .nav-link.active {color: var(--col-white); padding: 0px 10px !important; font-size: 1rem; text-transform: uppercase; font-weight: 400; text-decoration: underline;}
.navbar-nav .nav-link.dropdown-toggle.show {color: var(--col-white);}
.navbar-nav .dropdown-item.active,
.navbar-nav .dropdown-item:active {background: none; font-style: italic;}

#mnu-head li {padding-bottom: 1rem;}

/* header .path-menu>div{display: none;} */
header .dropdown-menu {
    background: none;
    border: none;
    color: var(--col-white);
}
header .dropdown-menu a {color: var(--col-white);}

.custom-menu-trick {
     height: calc(100vh - 84px); 
     overflow-x: scroll; 
     position: relative; 
     display: flex; 
     flex-direction: column; 
     justify-content: space-between;
}

/* Masory */
/* clearfix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- grid-item ---- */
.grid-sizer,
.grid-item { width: 100%; }

.gutter-sizer {
  width: 4%;
}

.grid-item {
  height: auto;
  float: left;
}

.grid-item--width2 { width: 320px; }
.grid-item--width3 { width: 480px; }
.grid-item--width4 { width: 640px; }

.grid-item--height2 { height: 200px; }
.grid-item--height3 { height: 260px; }
.grid-item--height4 { height: 360px; }


/* ! Menu drawer button animation */
.background {
  width: auto;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.menu__icon {
  width: 30px;
  height: 30px;
  padding: 4px;
}

.menu__icon span {
  display: block;
  width: 100%;
  height: 0.125rem;
  border-radius: 2px;
  background-color: var(--col-white);
  box-shadow: 0 .5px 2px 0 hsla(0, 0%, 0%, .2);
  transition: background-color .4s;
  position: relative;
}

.menu__icon span+span {
  margin-top: .375rem;
}

.menu__icon.inactive span:nth-child(1) {
  animation: ease .8s menu-icon-top-2 forwards;
}

.menu__icon.inactive span:nth-child(2) {
  animation: ease .8s menu-icon-scaled-2 forwards;
}

.menu__icon.inactive span:nth-child(3) {
  animation: ease .8s menu-icon-bottom-2 forwards;
}

.menu__icon.active span:nth-child(1) {
  animation: ease .8s menu-icon-top forwards;
}

.menu__icon.active span:nth-child(2) {
  animation: ease .8s menu-icon-scaled forwards;
}

.menu__icon.active span:nth-child(3) {
  animation: ease .8s menu-icon-bottom forwards;
  background-color: var(--col-white);
}

@keyframes menu-icon-top {
  0% {
    top: 0;
    transform: rotate(0);
  }

  50% {
    top: .5rem;
    transform: rotate(0);
  }

  100% {
    top: .5rem;
    transform: rotate(45deg);
  }
}

@keyframes menu-icon-top-2 {
  0% {
    top: .5rem;
    transform: rotate(45deg);
  }

  50% {
    top: .5rem;
    transform: rotate(0);
  }

  100% {
    top: 0;
    transform: rotate(0);
  }
}

@keyframes menu-icon-bottom {
  0% {
    bottom: 0;
    transform: rotate(0);
  }

  50% {
    bottom: .5rem;
    transform: rotate(0);
  }

  100% {
    bottom: .5rem;
    transform: rotate(135deg);
  }
}

@keyframes menu-icon-bottom-2 {
  0% {
    bottom: .5rem;
    transform: rotate(135deg);
  }

  50% {
    bottom: .5rem;
    transform: rotate(0);
  }

  100% {
    bottom: 0;
    transform: rotate(0);
  }
}

@keyframes menu-icon-scaled {
  50% {
    transform: scale(0);
  }

  100% {
    transform: scale(0);
  }
}

@keyframes menu-icon-scaled-2 {
  0% {
    transform: scale(0);
  }

  50% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

/* ! Swiper generico */
.swiper-pagination {position: static;}
.swiper-pagination-bullet {border-radius: 0;}
.swiper-pagination-bullet.swiper-pagination-bullet-active {background: var(--col-secondary);}


/* ! Pagination */
.page-link {
    border-radius: 0 !important;
    background-color: var(--col-white);
    color: var(--col-blu-dark);
    font-size: .8rem;
    padding: 5px 16px;
    border-radius: 20px !important;
}
.page-link.current {
    background-color: var(--col-secondary);
    color: var(--col-blu-dark);
    border-color: var(--col-secondary);
}
.page-item {
    margin-left: 4px;
    margin-right: 4px;
    width: 40px;
    height: 40px;
}

/* ! FOOTER */
footer .legal-info {font-size: .8rem;}
footer .legal-info a{color: inherit; text-decoration: none;}
footer .title-footer {
    font-size: 1.5rem;
}
footer .widget_nav_menu ul {
    list-style: none;
    padding-left: 0;
}
footer .widget_nav_menu ul li a { 
    color: var(--col-white);
    text-decoration: none;
}
footer .widget_nav_menu ul li.current-menu-item a, footer a {
    color: var(--col-white);
}
footer .media-info img {
    max-width: 40px;
}
footer .media-info .wp-block-media-text .wp-block-media-text__content {
    padding: 0;
    line-height: 1.3rem;
}
footer .media-foot3 {
    overflow: hidden;
}

footer .media-foot3 .wp-block-media-text .wp-block-media-text__content {
    line-height: 1.3rem;
}

footer .media-foot3 a {
    color: var(--col-white);
    text-decoration: none;
}
footer .media-foot3 a:hover {
    text-decoration: none;
}

footer .social-icon a {display: inline-block;}
footer .widget_text {color: var(--col-white);}
footer .widget_text a {color: var(--col-white);}
footer .widget_text strong {font-weight: normal; font-size: 1.2rem; line-height: 1.6rem;}

.pre-header {
    background-color: #363354;
    color: var(--col-white);
    display: block;
}
header .navbar {
    background: var(--col-grey);
}
/* header .navbar-brand img {
    max-width: 60%;
} */
 .logo-header {max-width: 55%;}

.customSelect {
    color: var(--col-grey);
    border: 2px solid var(--col-secondary);
}

.cth_custom .wp-block-media-text__content {
    margin-top: 1.2rem;
    padding: 0 0;
}

.navbar {padding-bottom: 0;}
.navbar-collapse {
    background: var(--col-primary);
    margin-left: -12px;
    margin-right: -12px;
    padding: 10px;
/* 
    height: calc(100vh - 66px);
    overflow-x: scroll; */
}



/*Path per Gallery plugin */
.ngg-galleryoverview.default-view .ngg-gallery-thumbnail {
    margin: 10px !important;
}

.ngg-galleryoverview.default-view .ngg-gallery-thumbnail img {
    border-radius: 10px !important;
}

/* Slider HP */
.attr {
        width: calc(var(--widthnoscroll) - var(--singolspaziola) - 25%);
    }


.sw-wrapper {
    position: relative;
}

.sw-container {
    position: relative; 
}

.sw-eventi,
.sw-personaggi {
    padding-right: 150px;
}

option {
    color: var(--col-dark)
}

.clear {clear: both;}

.video-container {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.video-container video {
  width: 100%;
  height: 100%;
  object-fit: cover;  /* fa sì che il video si comporti come background */
}

.video-container .overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0));
}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    body {margin-top: 79px;}

    #breadcrumbs {display: block;}

    .text_format {
        line-height: 1.3rem;
    }

    /* Path per Hero con header fixed */
    :root{
        --widthnoscroll: calc(100vw - var(--scrollbar-width));
        --spaziolat: calc(var(--widthnoscroll) - 720px);
        --singolspaziola: calc(var(--spaziolat) /2);
    }

    .title-hero {
        font-size: 5rem; 
        line-height: 5.5rem;
    }
    .sub-title-hero {
        font-size: 2rem; 
        font-optical-sizing: auto;
        line-height: normal;
    }

    h3 {
        font-size: 2rem;
        line-height: 2.625rem;
    }

    .title-card.font-mansalva {
        font-style: normal;
        font-size: 2.625rem;
        line-height: 2.8rem;
    }
    .banner-text h4 {
        font-size: 1.6rem; 
        line-height: 2.1rem; 
        margin-bottom: 1.5rem;
    }

    .sw-container {
        position: absolute;
        top: 0;
        left: 25%; /* perché col-3 = 25% */
        right: 0;
        
    }

    /* Menu */
    .navbar-nav .dropdown-item.active:after {
        content: "";
        display: inline-block;
        width: 16px;   /* dimensioni della freccia */
        height: 16px;
        margin-left: 6px; /* spazio tra testo e freccia */
        background-image: url("inc/assets/images/arrow-menu.png"); /* il tuo file immagine */
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
        transform: translateX(30px);
        opacity: 2;
    }
    .navbar-nav .dropdown {position: static;} 
    
    header .dropdown-menu:before {
        content: '';
        position: fixed;
        top: 0;
        left: -100%;
        background-color: var(--col-dark);
        opacity: .8;
        width: 100%;
        height: 100vh;
        z-index: -11;
        transition: all .5s;
    }
    header .dropdown-menu.show:before {
        left: 0;
    }
    header .dropdown-menu:after {
        content: '';
        position: fixed;
        top: 0;
        left: -100%;
        background-color: var(--col-primary);
        opacity: 1;
        width: 30%;
        height: 100vh;
        z-index: -11;
        transition: all .3s;
    }
    header .dropdown-menu.show:after {
        left: 0;
    }
    header .path-menu {height: auto;}
    header .path-menu>div{display: block;}

    .pb-md-custom {
        padding-bottom: 5px !important;
    }

    .path-single-img {
        margin-top: -220px;
    }

    /* Single eventi */
    .header-single {
        min-height: 300px;
        height: 100%;
        position: relative;
    }
    .header-single .single-title h1 {
        font-size: 3.75rem;
    }

    .header-single .single-title .cont-page {
        position: relative;
        display: block;
    }
    .header-single-mobile .single-title .cont-page {
        display: none;
    }

 
    .btn-filer-group {
        display: flex;
        flex-direction: row;
    }
    .filter-cont {position: relative; z-index: 100; bottom: 0;}

    #filter-scroll-container {
        display: block;
        width: 100%;
    }
    #filter-scroll-container div {
        flex-direction: row;
        overflow-x: hidden;
        margin: 0 auto;
        white-space: nowrap;
       
        
    }
    /* #filter-scroll-container div {
        flex-direction: row;
    } */
    .filter-cont {
        position: static;
        
    }
    
    /* .filter-header */
    .filter-body {
        display: block;
    }
    .filter-header>div {
        white-space: nowrap;
        padding-right: 20px;
    }
    .filter-header .icon-filter {display: none;}

    .map-responsive {
        overflow: hidden;
        padding-bottom: 33%; /* Rapporto 4:3, per un rapporto 16:9 usa il 56.25% */
        position: relative;
        height: 0;
    }

    .w-md-50 {
        width: 50% !important;
    }

    .custom-menu-trick {
        height: auto;
        overflow: hidden;
        flex-direction: row;
        position: static;
    }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    header {
        position: fixed; 
        z-index: 10000;
        top: 0;
    }
    header .navbar-brand img {
        max-width: 100%;
    }

    /* .navbar-nav {margin-right: auto !important;} */

    .banner-text h3 {font-size: 3rem; line-height: 3.8rem; margin-bottom: .5rem;}
    .banner-text h4 {font-size: 1.6rem; line-height: 2.1rem; font-weight: normal; margin-bottom: .5rem;}

    .text_format {
        line-height: initial;
    }

    .box-card .content-carat {
        position: absolute;
        bottom: 15px;
        display: block;
    }

    .box-card hr {
        opacity: 1;
        width: 20%;
        margin: 0 auto;
        margin-top: 1rem;
        margin-bottom: 1rem;
        border-top: var(--col-white) solid;
        display: block;
    }
    .box-card .box-content .sup-image.plus {
        bottom: calc(-50% + 95px);
        height: 50%;
    }
    /* .box-card:hover .box-content .sup-image {
        bottom: 0;
    } */
    .cth_custom .wp-block-media-text__content {
        margin-top: 0;
        padding: 0 8%;
    }


    .efx-cardhover .box-content img {
        transition: transform 0.3s ease; /* durata e tipo di transizione */
    }
    .efx-cardhover:hover .box-content img {
        transform: scale(1.1);
    }

    /* Tipografy */
    .nopage-title {
        font-family: "Mansalva", sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 3.75rem;
        line-height: 4rem;
    }

    .text-jost-big {
        font-family: "Jost", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 2.6875rem;
        line-height: 3rem;
    }
    .text-jost-medium {
        font-family: "Jost", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size: 2rem;
        line-height: 3rem;
    }

    .over-text.over-page h1 {
        font-size: 3.75rem;
        line-height: 4.5rem;
    }


    .grid-sizer,
    .grid-item { width: calc(33.33333333% - 12px); }

    .gutter-sizer {
        width: 12px;
    }

    :root{
        --widthnoscroll: calc(100vw - var(--scrollbar-width));
        --spaziolat: calc(var(--widthnoscroll) - 960px);
        --singolspaziola: calc(var(--spaziolat) /2);
    }

    .navbar-nav .dropdown-menu {
        height: 90vh;
        width: 30%;
        border-radius: 0;
        margin-top: -10px;
        z-index: 10;
        /* background: var(--col-primary); */
        padding: 5rem;
        left: -1000px;
        opacity: 0;
        transition: all .8s;

        display: block !important;
        opacity: 1;
        left: -100%;
        z-index: -10;
        background: none;
    }
    .navbar-nav .dropdown-menu.show {
        left: 0;
        opacity: 1;
    }
    .navbar-nav .dropdown-item {
        color: var(--col-white);
        font-size: 2.625rem;
        line-height: 3.5rem;
        font-weight: 400;
        position: relative;
    }
    .navbar-nav .dropdown-item:hover,
    .navbar-nav .dropdown-item:focus {
        background: none;
        font-style: italic;
    }
    .navbar-nav .dropdown-item:after {
        content: "";
        display: inline-block;
        width: 16px;   /* dimensioni della freccia */
        height: 16px;
        margin-left: 6px; /* spazio tra testo e freccia */
        background-image: url("inc/assets/images/arrow-menu.png"); /* il tuo file immagine */
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
        transform: translateX(0);
        opacity: 0;
        transition: all 0.3s;

    }
    .navbar-nav .dropdown-item:hover:after {  
        transform: translateX(30px);
        opacity: 1;
    }
    .navbar {padding-bottom: 0;}
    .navbar-collapse {
        background: none;
        margin-left: 0;
        margin-right: 0;
        padding: 0;
        height: auto;
        overflow: auto;
    }
    #mnu-head li {padding-bottom: 0;}

    .min-height-custom {min-height: 770px;}

    .w-lg-80 {
        width: 80% !important;
    }

    .custom-desk-claim {
        padding-left: 12px; 
        position: absolute; 
        bottom: 0; 
        padding-right: 80px;
    }
    
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .wp-embed-aspect-16-9 iframe{
        height: 400px;
    }

    :root{
        --widthnoscroll: calc(100vw - var(--scrollbar-width));
        --spaziolat: calc(var(--widthnoscroll) - 1140px);
        --singolspaziola: calc(var(--spaziolat) /2);
    }
}

@media (min-width: 1300px) {
    .navbar-nav .nav-link,
    .navbar-nav .nav-link.active {
        font-size: .9rem;
    }
    .navbar-nav .dropdown-menu {
        padding: 3rem;
    }
    .navbar-nav .dropdown-item {
        font-size: 2rem;
    }
}


/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
    :root{
        --widthnoscroll: calc(100vw - var(--scrollbar-width));
        --spaziolat: calc(var(--widthnoscroll) - 1320px);
        --singolspaziola: calc(var(--spaziolat) /2);
    }
}



/* iPad Mini in portrait */
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: portrait) {
    .image-container img {
        object-fit: cover;
        /* max-height: 400px; */
    }

    .box-card .content-carat.tablet-none {display: none;}

    .box-card .info h3 {font-size: 1rem; line-height: 1.2rem;}

    .box-card .content-carat div img {display: none;}

    .box-card .content-carat div {margin-bottom: 0;}

    .btn-primary {font-size: .8rem; padding: 3px 2rem;}
    
    header .container {
        max-width: 100%;
    }
    header .navbar {padding-bottom: 0 !important; padding-top: 0 !important;}

    header .dropdown-menu:before,
    header .dropdown-menu:after {content: none;}
    header .path-menu {
        height: 50vh;
    }

    .navbar-expand-lg .navbar-collapse { 
        margin-left: -24px;
        margin-right: -24px;    
    }
    .pb-md-custom {
        padding-bottom: 13px !important;
        padding-top: 13px;
    }

    .custom-desk-claim {display: none !important;}
    .custom-menu-trick {flex-direction: column;}
    .path-menu {align-items: flex-end !important;}
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) {
    .image-container img {
        object-fit: cover;
        /* max-height: 400px; */
    }
   
    header {
        position: fixed;
        z-index: 10000;
        top: 0;
    }
    .navbar-expand-lg {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .navbar-toggler {
        display: block;
    }
    
    .navbar-expand-lg .navbar-collapse {
        flex-basis: 100% !important;
        flex-grow: 1;
        align-items: center;
        display: block !important;

        background: var(--col-primary);
        margin-left: -24px;
        margin-right: -24px;
        padding: 10px;
    }
    .collapse:not(.show) {
        display: none !important;
    }
    .navbar-expand-lg .navbar-toggler {
        display: block;
    }

    .navbar-expand-lg .navbar-nav {
        display: block;
    }

    .text_format {display: none !important;}

    .box-card .content-carat.tablet-none {display: none;}
    .box-card .info h3 {font-size: 1rem; line-height: 1.2rem;}

    .box-card .content-carat div img {display: none;}
    .box-card .content-carat div {margin-bottom: 0;}

    .btn-primary {font-size: .8rem; padding: 3px 2rem;}
    header .container {
        max-width: 100%;
    }
    header .navbar {padding-bottom: 0 !important; padding-top: 0 !important;}

    .navbar-nav .dropdown-menu {
        height: auto;
        width: auto;
        border-radius: 0;
        margin-top: auto;
        z-index: 10;
        /* background: var(--col-primary); */
        padding: inherit;
        left: -1000px;
        opacity: 0;
        transition: all .8s;

        display: none !important;
        opacity: 1;
        left: -100%;
        z-index: -10;
        background: none;
        position: static !important;
    }
    .navbar-nav .dropdown-menu.show {
        left: 0;
        opacity: 1;
        display: block !important;
    }
    .navbar-nav .dropdown-item {
        color: var(--col-white);
        font-size: inherit;
        line-height: inherit;
        font-weight: 400;
        position: relative;
    }
    .navbar-nav .dropdown-item:hover,
    .navbar-nav .dropdown-item:focus {
        background: none;
        font-style: italic;
    }
    .navbar-nav .dropdown-item:after {
        content: "";
        display: inline-block;
        width: 16px;   /* dimensioni della freccia */
        height: 16px;
        margin-left: 6px; /* spazio tra testo e freccia */
        background-image: url("inc/assets/images/arrow-menu.png"); /* il tuo file immagine */
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
        transform: translateX(0);
        opacity: 0;
        transition: all 0.3s;

    }
    .navbar-nav .dropdown-item:hover:after {  
        transform: translateX(30px);
        opacity: 1;
    }
    .navbar {padding-bottom: 0;}
    .navbar-collapse {
        background: none;
        margin-left: 0;
        margin-right: 0;
        padding: 0;
    }
    header .dropdown-menu:before,
    header .dropdown-menu:after {content: none;}
    header .path-menu {
        height: 50vh;
    }

    .pb-md-custom {
        padding-bottom: 13px !important;
        padding-top: 13px;
    }
    .custom-menu-trick {
        flex-direction: column;
        justify-content: space-between;
    }
    .custom-menu-trick #mnu-head {
        margin-left: 0 !important;
    }
    .path-menu {display: flex !important; align-items: flex-end !important;}
}


/* iPad Air in portrait */
@media only screen and (min-device-width: 820px) and (max-device-width: 820px) and (orientation: portrait) {
    .image-container img {
        object-fit: cover;
        /* max-height: 400px; */
    }

    .box-card .content-carat.tablet-none {display: none;}
    .box-card .info h3 {font-size: 1rem; line-height: 1.2rem;}

    .box-card .content-carat div img {display: none;}
    .box-card .content-carat div {margin-bottom: 0;}

    .btn-primary {font-size: .8rem; padding: 3px 2rem;}

    header .container {
        max-width: 100%;
    }
    header .navbar {padding-bottom: 0 !important; padding-top: 0 !important;}

    .navbar-expand-lg .navbar-collapse { 
        margin-left: -24px;
        margin-right: -24px;    
    }
    .pb-md-custom {
        padding-bottom: 13px !important;
        padding-top: 13px;
    }
    header .dropdown-menu:before,
    header .dropdown-menu:after {content: none;}
    /* header .path-menu {
        height: 50vh;
    } */

    .custom-desk-claim {display: none !important;}

    .custom-menu-trick {
        height: 70vh;
        overflow-x: auto;
        flex-direction: column;
        justify-content: inherit;
    }

    header .path-menu {
        position: absolute;
        bottom: 0;
    }
}
@media only screen and (min-device-width: 1180px) and (max-device-width: 1180px) and (orientation: landscape) {
    .image-container img {
        object-fit: cover;
        /* max-height: 400px; */
    }
   
    .box-card .content-carat.tablet-none {display: none;}
    .box-card .info h3 {font-size: 1rem; line-height: 1.2rem;}

    .box-card .content-carat div img {display: none;}
    .box-card .content-carat div {margin-bottom: 0;}

    .btn-primary {font-size: .8rem; padding: 3px 2rem;}

    header {
        position: fixed;
        z-index: 10000;
        top: 0;
    }

    .min-height-custom {min-height: 450px;}

    .navbar-expand-lg {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .navbar-toggler {
        display: block;
    }
    
    .navbar-expand-lg .navbar-collapse {
        flex-basis: 100% !important;
        flex-grow: 1;
        align-items: center;
        display: block !important;

        background: var(--col-primary);
        margin-left: -24px;
        margin-right: -24px;
        padding: 10px;
    }
    .collapse:not(.show) {
        display: none !important;
    }
    .navbar-expand-lg .navbar-toggler {
        display: block;
    }

    .navbar-expand-lg .navbar-nav {
        display: block;
    }

    .text_format {display: none !important;}

    header .container {
        max-width: 100%;
    }
    header .navbar {padding-bottom: 0 !important; padding-top: 0 !important;}

    .navbar-nav .dropdown-menu {
        height: auto;
        width: auto;
        border-radius: 0;
        margin-top: auto;
        z-index: 10;
        /* background: var(--col-primary); */
        padding: inherit;
        left: -1000px;
        opacity: 0;
        transition: all .8s;

        display: none !important;
        opacity: 1;
        left: -100%;
        z-index: -10;
        background: none;
        position: static !important;
    }
    .navbar-nav .dropdown-menu.show {
        left: 0;
        opacity: 1;
        display: block !important;
    }
    .navbar-nav .dropdown-item {
        color: var(--col-white);
        font-size: inherit;
        line-height: inherit;
        font-weight: 400;
        position: relative;
    }
    .navbar-nav .dropdown-item:hover,
    .navbar-nav .dropdown-item:focus {
        background: none;
        font-style: italic;
    }
    .navbar-nav .dropdown-item:after {
        content: "";
        display: inline-block;
        width: 16px;   /* dimensioni della freccia */
        height: 16px;
        margin-left: 6px; /* spazio tra testo e freccia */
        background-image: url("inc/assets/images/arrow-menu.png"); /* il tuo file immagine */
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
        transform: translateX(0);
        opacity: 0;
        transition: all 0.3s;

    }
    .navbar-nav .dropdown-item:hover:after {  
        transform: translateX(30px);
        opacity: 1;
    }
    .navbar {padding-bottom: 0;}
    .navbar-collapse {
        background: none;
        margin-left: 0;
        margin-right: 0;
        padding: 0;
    }
    header .dropdown-menu:before,
    header .dropdown-menu:after {content: none;}
    header .path-menu {
        height: 50vh;
    }

    .pb-md-custom {
        padding-bottom: 13px !important;
        padding-top: 13px;
    }

    .custom-menu-trick {
        flex-direction: column;
        justify-content: space-between;
    }
    .custom-menu-trick #mnu-head {
        margin-left: 0 !important;
    }
    .path-menu {display: flex !important; align-items: flex-end !important;}

}