/**
 * Theme Name: Vanguard360 V.2025 Child
 * Theme URI: https://360smartweb.it
 * Description: Child theme for the Vanguard parent theme.
 * Author: Massimiliano
 * Author URI: https://360smartweb.it
 * Template: vanguard360-2025
 * Version: 1.0.0
 * Text Domain: vanguard360-child
 */

/* Custom CSS styles for the child theme */

/* -------------------------------------------------- */
/* ! Varie */
/* -------------------------------------------------- */
/* @ FONTS */
/* --- FONT 1 --- */
@font-face {
  font-family: 'Fontspring';
  src: url('custom/css/fonts/fontsprin.woff2') format('woff2'),
       url('custom/css/fonts/fontsprin.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Migliora il caricamento della pagina */
}
.fontspring{font-family: 'Fontspring';}

/* --- FONT 2 --- */
@font-face {
  font-family: 'Instruments';
  src: url('custom/css/fonts/instrumentserif.woff2') format('woff2'),
       url('custom/css/fonts/instrumentserif.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* --- FONT 3 --- */
@font-face {
  font-family: 'Market';
  src: url('custom/css/fonts/market.woff2') format('woff2'),
       url('custom/css/fonts/market.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


/* @ BODY */
body,
body main :is(p, ul, li, a),
body footer {
  font-family: 'Instruments';
}
body main :is(h1, h2, h3, h4){
  font-family: 'Fontspring';
}
body main :is(h1, h2, h3, h4, p) :is(i, em) {
  font-family: 'Market' !important;
  font-style: normal; /* Spesso i font calligrafici come "Market" sono già inclinati */
}
body main a.wp-block-button__link{
  font-family: 'Fontspring';
  text-transform: uppercase;
}
/* @ FIX NAVBAR */
body nav ul li {
  font-family: 'Fontspring';
}
body nav ul li {
  text-transform: uppercase;
  font-size: .95rem;
}
body.page-template-menu-trasparente .lang-switcher button span{
  color: #fff;
}
body.page-template-menu-trasparente.scrolled .lang-switcher span {
  color: #181818;
}
body.scrolled header:not(:has(.searchbar)) {
  border-bottom: 1px solid #ececec;
}

ul.menu > li > ul.sub-menu {
  background: var(--color2);
}
ul.menu li a:hover {
  background: var(--color1);
}
body.page-template-menu-trasparente.scrolled ul.menu > .menu-item.menu-item-has-children > a:after {
  color: #181818;
}
body.page-template-menu-black header ul.sub-menu li a,
body.page-template-menu-trasparente.scrolled header ul.sub-menu li a {
  color: #fff !important;
  text-align: center;
}

@media (max-width: 768px) {
  body header .container-header nav ul li a {
    color: #181818 !important;
  }
  .menu .sub-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease;
  }
  ul.menu:not(.active) .sub-menu {
  max-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

  .menu-item.is-open > .sub-menu {
    max-height: 500px; /* valore abbondante */
  }
} /* Fine query */

/* # FIX ALTEZZA E LARGHEZZA LOGO */
a.custom-logo img, a.logo-text img {
  max-width: 230px;
  height: auto;
  transition: all .3s cubic-bezier(.215, .61, .355, 1);
  max-height: var(--altezzaLogo);
}

/* # FIX LARGHEZZA BOXED */
body .searchbar,
body header.header.navbarBoxed .container-header,
body.page-template-default .hero-title h2 {
    max-width: 1450px;
}

/* # FIX dropdown */
@media (min-width: 1024px) {
  ul.menu > li > ul.sub-menu {
    top: 33px;
  }
} /* Fine query */

/* @ FIX Navbar da TAB */
/* # Stato base: chiuso */
.menu .sub-menu { display: none; }

/* Aperto quando il LI ha la classe */
.menu .menu-item.is-open > .sub-menu { display: block; }

/* # Pulsante freccina */
.submenu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: .5rem;
    border: 0;
    background: transparent;
    padding: .25rem;
    line-height: 1;
    cursor: pointer;
    max-width: 44px;
    position: absolute;
    right: 25px;
    width: 44px;
    height: 50px;
    /* border: 1px solid red; */
}
li.menu-item > ul.sub-menu > li.menu-item-has-children .submenu-toggle {
    right: 0px;
    width: 44px;
    height: 40px;
    border: 1px solid blue;
    top: 0;
}

/* # Nascondi freccina su desktop, la lasciamo solo per mobile/tablet */
@media (min-width: 992px) {
  .submenu-toggle { display: none; }
}

/* # (opzionale) icona caret minimale */
.submenu-toggle::after {
  content: "▾";
  font-size: .8rem;
  transform: rotate(0deg);
  transition: transform .2s ease;
}
.menu-item.is-open > .submenu-toggle::after { transform: rotate(180deg); }


/* -------------------------------------------------- */
/* ! TOGGLE NOVEMBRE 2025 */
/* -------------------------------------------------- */
button.toggle {
  position: relative;
  width: 50px;
  height: 50px;
  min-width: 50px;
  border:none;
  background: none;
}


/* @ Hamburger 1 */
button.hamburger1 .hamburgerNew {
  height: 75%;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-direction: column;
}
button.hamburger1 .hamburgerNew--1, 
button.hamburger1 .hamburgerNew--2, 
button.hamburger1 .hamburgerNew--3 {
  height: 1px;
  background: #121212;
  display: block !important;
}
button.hamburger1 span.hamburgerNew--1 {
  width: 30px;
}
button.hamburger1 span.hamburgerNew--2 {
  width: 40px;
}
button.hamburger1 span.hamburgerNew--3 {
  width: 19px;
}

/* @ Hamburger 2 */
button.hamburger2 .hamburgerNew {
  height: 75%;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  align-items: flex-start;
  flex-direction: column;
}
button.hamburger2 .hamburgerNew--1, 
button.hamburger2 .hamburgerNew--2, 
button.hamburger2 .hamburgerNew--3 {
  height: 1px;
  background: #121212;
  display: block !important;
}
button.hamburger2 span.hamburgerNew--1 {
  width: 30px;
}
button.hamburger2 span.hamburgerNew--2 {
  width: 40px;
}
button.hamburger2 span.hamburgerNew--3 {
  width: 19px;
}

/* @ Hamburger 3 */
button.hamburger3 .hamburgerNew {
  height: 75%;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  align-items: flex-end;
  flex-direction: column;
}
button.hamburger3 .hamburgerNew--1, 
button.hamburger3 .hamburgerNew--2, 
button.hamburger3 .hamburgerNew--3 {
  height: 1px;
  background: #121212;
  display: block !important;
}
button.hamburger3 span.hamburgerNew--1 {
  width: 30px;
}
button.hamburger3 span.hamburgerNew--2 {
  width: 40px;
}
button.hamburger3 span.hamburgerNew--3 {
  width: 19px;
}

/* @ Hamburger 4 */
button.hamburger4 .hamburgerNew {
  height: 65%;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-direction: column;
}
button.hamburger4 .hamburgerNew--1, 
button.hamburger4 .hamburgerNew--2, 
button.hamburger4 .hamburgerNew--3 {
  background: #121212;
  display: block !important;
}
button.hamburger4 span.hamburgerNew--1 {
  width: 5px;
  height: 5px;
  border-radius:10px;
}
button.hamburger4 span.hamburgerNew--2 {
  width: 5px;
  height: 5px;
  border-radius:10px;
}
button.hamburger4 span.hamburgerNew--3 {
  width: 5px;
  height: 5px;
  border-radius:10px;
}

/* @ Hamburger 5 */
button.hamburger5 .hamburgerNew {
  height: 75%;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  align-items: flex-end;
  flex-direction: column;
}
button.hamburger5 .hamburgerNew--1, 
button.hamburger5 .hamburgerNew--2, 
button.hamburger5 .hamburgerNew--3 {
  height: 1px;
  background: #121212;
  display: block !important;
}
button.hamburger5 span.hamburgerNew--1,
button.hamburger5 span.hamburgerNew--2,
button.hamburger5 span.hamburgerNew--3 {
  width: 100%;
}

/* # HAMBURGERS */
body.page-template-menu-trasparente button .hamburgerNew span{
  background-color: #fff;
}
body.page-template-menu-trasparente.scrolled button .hamburgerNew span{
  background-color: var(--colore_hamburger_scrolled);
}

/* @ Hover */
button .hamburgerNew--1, 
button .hamburgerNew--2, 
button .hamburgerNew--3 {
  transition: all .3s cubic-bezier(.215, .61, .355, 1);
}

button.hamburger1:hover .hamburgerNew--1, 
button.hamburger1:hover .hamburgerNew--2, 
button.hamburger1:hover .hamburgerNew--3,
button.hamburger2:hover .hamburgerNew--1, 
button.hamburger2:hover .hamburgerNew--2, 
button.hamburger2:hover .hamburgerNew--3,
button.hamburger3:hover .hamburgerNew--1, 
button.hamburger3:hover .hamburgerNew--2, 
button.hamburger3:hover .hamburgerNew--3 {
  width:100%;
}

button.hamburger4:hover .hamburgerNew--1, 
button.hamburger4:hover .hamburgerNew--3 {
  width:50%;
}


@media (max-width: 768px) {
  button.hamburger1.active .hamburgerNew .hamburgerNew--1,
  button.hamburger1.active .hamburgerNew .hamburgerNew--2,
  button.hamburger1.active .hamburgerNew .hamburgerNew--3{
    background-color: #181818;
  }

  header .container-header a.custom-logo {
    order:1;
  }
  header .container-header nav {
    order:2;
  }
  header .container-header .lang-switcher {
    order:3;
    width: 200px;
  }
  header .container-header button.toggle-navbar {
    order:4;
  }
  } /* Fine query */

/* @ POLYLANG */
.lang-switcher {
  position: relative;
  display: inline-block;
}

.lang-switcher__current {
  display: flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 4px 6px;
}

.lang-switcher img {
  width: 20px;
  height: auto;
  display: block;
}

.lang-switcher span {
  font-size: 0.85rem;
  letter-spacing: 1px;
}

.lang-switcher__dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  background: #fff;
  list-style: none;
  margin: 0;
  padding: 6px 0;
  min-width: 80px;
  box-shadow: 0 6px 20px rgba(0,0,0,.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(5px) translateX(50%);
  transition: all .2s ease;
  z-index: 99;
}

.lang-switcher:hover .lang-switcher__dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) translateX(0);
}
.lang-switcher__dropdown li a {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  text-decoration: none;
  color: inherit;
}

.lang-switcher__dropdown li a:hover {
  background: #f5f5f5;
}

/* -------------------------------------------------- */
/* ! NAVBAR */
/* -------------------------------------------------- */
body.page-template-menu-trasparente:not(.scrolled) ul.menu li.current-menu-item a {
  background: transparent;
  color: #fff !important;
  border-bottom: 2px solid;
  border-color: var(--color1);
}
ul.menu li.current-menu-item a, 
body.page-template-menu-trasparente.scrolled ul.menu li.current-menu-item a {
  background: transparent;
  color: #181818 !important;
  border-bottom: 2px solid;
  border-color: var(--color1);
}

body li.ctaNavbar a {
  background: var(--color2);
}
body.page-template-menu-black ul.menu li.ctaNavbar a {
  color: #fff !important;
}
body.page-template-menu-black ul.menu li.ctaNavbar.current-menu-item a {
  color: var(--color2) !important;
}

body.page-template-menu-trasparente.scrolled header ul li.ctaNavbar a {
  color: #fff !important;
}

/* -------------------------------------------------- */
/* ! GUTENBERG */
/* -------------------------------------------------- */
.has-mediumplus-font-size {
  line-height: 2.25rem;
  margin-bottom: 15px;
}
.wp-block-spacer{margin:0;}

:root :where(.wp-block-heading) {
  margin-bottom: 1.8rem;
}
.wp-block-button.is-style-outline a.wp-block-button__link {
  padding-bottom: 3px !important;
}

@media (max-width: 768px) {
  .has-mediumplus-font-size {
    font-size: 1.65rem !important; 
  }
  .has-large-font-size {
    font-size: 1.65rem !important;
    line-height: 1.95rem !important;
  }
  .has-mediumplusplus-font-size {
    font-size: 1.6rem !important;
    line-height: 2rem !important;
  }
  
} /* Fine query */

/* -------------------------------------------------- */
/* ! GRID SYSTEM */
/* -------------------------------------------------- */
body .grid {
    max-width: 1450px !important;
}
body main {
  padding-bottom:0 !important;
}
body main p {margin-bottom:20px;}

/* -------------------------------------------------- */
/* ! HELPERS */
/* -------------------------------------------------- */
/* @ TITOLI */
.wp-block-cover h1{text-shadow: 2px 2px 9px black;}
/* @ Padding */
@media (max-width: 768px) {
  .paddingMobileDefault {
    padding-bottom:50px;
  }
} /* Fine query */

/* @ alignment */
.alignEnd {
  justify-content: flex-end;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}

@media (max-width: 768px) {
  .alignEnd {
    justify-content: center;
    flex-direction: column;
    align-items: center;
  }
} /* Fine query */

/* @ Orded */
@media (max-width: 768px) {
  .o1{order:1;}
  .o2{order:2;}
  .o3{order:3;}
  .o4{order:4;}
  .o5{order:5;}
  .o6{order:6;}
} /* Fine query */

/* @ Controllo su Mobile */
.showMobile{display: none;}
.hideMobile{display: block;}

@media (max-width: 768px) {
  .showMobile{
    display:block;
  }
  .hideMobile{
    display:none;
  }
} /* Fine query */

/* @ DECORAZIONE */
.decorazione {
  position: relative;
  margin-bottom: 0;
}
.decorazione:before {
  position: absolute;
  top: 50%;
  left: 130px;
  width: 220px;
  height: 55px;
  content: url(/wp-content/themes/vanguard360-child/custom/img/brush.svg);
  transform: translateY(-50%) rotate(180deg);
}

.decorazione:after {
  position: absolute;
  top: 50%;
  right: 130px;
  width: 220px;
  height: 55px;
  content: url(/wp-content/themes/vanguard360-child/custom/img/brush.svg);
  transform: translateY(-50%);
}

@media (max-width: 768px) {
  .decorazione:before {
    left: 0;
    width: 75px;
  }
  .decorazione:after {
    right: 0;
    width: 75px;
  }
} /* Fine query */

/* -------------------------------------------------- */
/* ! Pagine */
/* -------------------------------------------------- */
/* @ Homepage */
/* # Sezione con fratelli */
.fratelliMontemagnoli {
  text-align: center;
}
.fratelliMontemagnoli img {
  max-width: 85%;
}

/* # Sezione con immagine sfalzata con storia e tradizione */
.colonneStoriaTradizione {
  overflow: visible !important;
}
.imgSfalsata {
  margin-top: 75px !important;
}
.colonneStoriaTradizione .wp-block-columns {
  gap: 75px;
}
.colonneStoriaTradizione .wp-block-column img {
  border-radius: 30px;
}
.colonneStoriaTradizione:last-child {
  margin-top: -60px;
}
.camereFade {
  position: relative;
}

/* # Blocco shortcode camere in home */
.camereFade__imageWrapper {
  position: relative;
  border-radius: 25px;
  overflow: hidden;
}
.camereFade__buttons button {
  color: #fff;
}

.camereFade__buttons {
  display: flex;
  justify-content: center;
  gap: 40px;
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}

.camereFade__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: auto;
  opacity: 0;
  transition: opacity .6s ease;
  border-radius: 25px;
}

.camereFade__image.active {
  opacity: 1;
  position: relative;
}

.camereFade__buttons {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 20px;
}

.camereFade__btn {
  background: none;
  border: none;
  font-size: 16px;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer;
  position: relative;
  opacity: .5;
}

.camereFade__btn.active {
  opacity: 1;
}

.camereFade__btn.active::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
}

@media (max-width: 768px) {
  .wp-block-cover.colonneStoriaTradizione {
    min-height: auto;
    padding: 1rem;
  }
  .imgSfalsata {
    margin-top: 40px !important;
  }
  .colonneStoriaTradizione .wp-block-columns {
  gap: 30px;
  }
  .colonneStoriaTradizione:last-child {
    margin-top: -5px;
  }
} /* Fine query */

/* # sezione Esperienza italiana */
#esperienzaItaliana p em {
  color: var(--color1);
}

/* @ Storia */
.colonneServiziPaginaStoria .wp-block-columns .wp-block-column .wp-block-cover {
  border-radius: 25px;
}

@media (max-width: 768px) {
  .nonna {
    max-width: 280px;
  }
} /* Fine query */

/* @ Camere */
/* Gallery camere: invisibili ma presenti nel DOM */
figure.galleria_camere {display:none;}

#camereMontemagnoli .wp-block-gallery {
  display: none;
}
#camereMontemagnoli .wp-block-column .wp-block-cover {
  border-radius: 25px;
  /* cursor: pointer; */
}

/* @ Footer.php */
#footer-widget .col-flex a,
#footer-widget .col-flex p,
#footer-widget .col-flex li {
  margin-bottom:10px;
  font-family: 'Instruments';
}
#footer-widget .col-flex h2,
#footer-widget .col-flex h3,
#footer-widget .col-flex h4 {
  font-family: 'Fontspring';
}
.colonnaSocialFooter > *{
  line-height: 1.5rem;
}
.colonnaSocialFooter h2 {
  margin-right:10px;
}
.colonnaSocialFooter p a i {
  color: var(--color2);
  background: #fff;
  padding: 10px;
  border-radius: 20px;
  transition: all .3s cubic-bezier(.215, .61, .355, 1);
}
.colonnaSocialFooter p a:hover i {
  color: #fff;
  background: var(--color1);
}
.colonnaSocialFooter p a:not(:last-child) i {
  margin-right: 5px;
}

@media (max-width: 768px) {
  #footer-widget {
    padding: 75px 20px;
  }
  #footer-widget .col-flex {
    text-align: center;
  }
  .colonnaSocialFooter p {
    margin-top: 30px;
  }
  .footer-bar {
    padding-bottom: 50px;
  }
} /* Fine query */

/* -------------------------------------------------- */
/* ! QUANDOO */
/* -------------------------------------------------- */
#quandoo-booking-widget,
#quandoo-booking-widget iframe {
  height:650px;
}

/* -------------------------------------------------- */
/* ! ANIMAZIONI */
/* -------------------------------------------------- */
/* @ ANiMAZIONI GSAP*/
.text-reveal{transform: translateY(1rem);clip-path:polygon(0 0, 100% 0, 100% 0, 0 0);}
.fade-in {opacity:0;transform: translateY(1rem);}
.fade-up {opacity:0;transform: translateY(5rem);}

/* @ ANIMAZIONI CSS */
.slide-up {opacity:0;overflow:hidden;transform:translateY(-200px);transition: all 1s cubic-bezier(.215, .61, .355, 1);}
.in-page .slide-up {opacity:1;transform:translateY(0px);}

.slide-down {opacity:0;overflow:hidden;transform:translateY(200px);transition: all .6s cubic-bezier(.215, .61, .355, 1);}
.in-page .slide-down {opacity:1;transform:translateY(0px);}

.slide-left {opacity:0;overflow:hidden;transform:translateX(-200px);transition: all 1s cubic-bezier(.215, .61, .355, 1);}
.in-page .slide-left {opacity:1;transform:translateX(0px);}

.slide-right {opacity:0;overflow:hidden;transform:translateX(200px);transition: all 1s cubic-bezier(.215, .61, .355, 1);}
.in-page .slide-right {opacity:1;transform:translateX(0px);}

.zoom-in {opacity:0;overflow:hidden;transform:scale(.4);}
.in-page .zoom-in {opacity:1;transform:scale(1);animation: zoom .75s 1 cubic-bezier(0, 0.95, 0.49, 0.98);}

@keyframes zoom{

	0% {opacity:1;transform: scale(.4);}
	60%{transform: scale(1.1);}
	100% {transform: scale(1);}

}

/* # Animazioni più carine */
.fadeUp {transition-property:opacity,transform;overflow:hidden;opacity:0;transition-delay: .4s;transform: translate3d(0,100px,0);transition: all .4s cubic-bezier(.215, .61, .355, 1);}
.in-page .fadeUp {opacity:1;transform: translateZ(0);}
.fadeDown {transition-property:opacity,transform;overflow:hidden;opacity:0;transition-delay: .4s;transform: translate3d(0,-100px,0);transition: all .4s cubic-bezier(.215, .61, .355, 1);}
.in-page .fadeDown {opacity:1;transform: translateZ(0);}
.fadeLeft {transition-property:opacity,transform;overflow:hidden;opacity:0;transition-delay: .4s;transform: translate3d(-100px,0,0);transition: all .4s cubic-bezier(.215, .61, .355, 1);}
.in-page .fadeLeft {opacity:1;transform: translateZ(0);}
.fadeRight {transition-property:opacity,transform;overflow:hidden;opacity:0;transition-delay: .4s;transform: translate3d(100px,0,0);transition: all .4s cubic-bezier(.215, .61, .355, 1);}
.in-page .fadeRight {opacity:1;transform: translateZ(0);}