/**
 * 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 */

/* @ ANiMAZIONI GSAP*/
.cover__bg {
    opacity: 0;
    transform-origin: center center;
    will-change: transform, opacity;
}
.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);}

/* -------------------------------------------------- */
/* ! NAVBAR 2026 */
/* -------------------------------------------------- */
body.page-template-menu-trasparente header .container-header nav ul.sub-menu li a {
  color:#121212;
}
body.page-template-menu-trasparente header .container-header nav ul li a {
  color:#fff;
}
body.page-template-menu-trasparente.scrolled header .container-header nav ul li a {
  color:#141414;
}

@media (max-width: 1024px) {
  body.page-template-menu-trasparente header button.hamburger1 .hamburgerNew--1, 
  body.page-template-menu-trasparente header button.hamburger1 .hamburgerNew--2, 
  body.page-template-menu-trasparente header button.hamburger1 .hamburgerNew--3 {
    background: var(--colore_hamburger);
  }
  body.page-template-menu-trasparente.scrolled header button.hamburger1 .hamburgerNew--1, 
  body.page-template-menu-trasparente.scrolled header button.hamburger1 .hamburgerNew--2, 
  body.page-template-menu-trasparente.scrolled header button.hamburger1 .hamburgerNew--3,
  body.page-template-menu-trasparente header button.hamburger1.active .hamburgerNew--1, 
  body.page-template-menu-trasparente header button.hamburger1.active .hamburgerNew--2, 
  body.page-template-menu-trasparente header button.hamburger1.active .hamburgerNew--3 {
    background: var(--colore_hamburger_scrolled) !important;
  }
  ul.menu > li {
    padding: 5px 24px;
  }
  body.page-template-menu-trasparente header .container-header nav ul li a {
    font-size: 1.4rem;
    color:#141414;
  }
} /* 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;
}
.submenu-toggle::after {
  	font-size: 1.5rem !important;
  	line-height: 1 !important;
  	display: block !important;
}
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;
}
@media (max-width: 992px) {
  	.submenu-toggle::after,
	body.scrolled .submenu-toggle::after,
	body.page-template-menu-trasparente.scrolled ul.menu > .menu-item.menu-item-has-children > a:after{
		color:#121212 !important;
	}
}
/* 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); }

/* -------------------------------------------------- */
/* ! HERO */
/* -------------------------------------------------- */
@media (max-width: 768px) {
  body main article .wp-block-cover.alignfull.has-background {
    margin-bottom: 5vh;
  }
} /* Fine query */

/* -------------------------------------------------- */
/* ! 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%;
}

/* ! 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%;
}

/* -------------------------------------------------- */
/* ! MOUSE ATTRACTION */
/* -------------------------------------------------- */
/* ===========================================
   VG Mouse Attraction — versione Gutenberg
   File: assets/css/vg-mouse-attraction.css
   =========================================== */

/* --- Blocco Copertina con classe vg-mouse-section --- */
.vg-mouse-section {
    cursor: none;
    overflow: hidden;
}

/* --- Cursore personalizzato --- */
.vg-mouse-cursor {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.3;
    pointer-events: none;
    transform: translate(-50%, -50%);
    z-index: 10;
    left: -99px;
    top: -99px;
}

/* --- Elemento animato: aggiungi vg-mouse-el a qualsiasi inner block --- */
.vg-mouse-section .vg-mouse-el {
    will-change: transform;
    transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

/* --- Livelli di forza (opzionali, default = medium) --- */
/* Assegnabili come classe aggiuntiva dall'editor Gutenberg */

/* .vg-strength--soft    → ~15px di spostamento massimo */
/* .vg-strength--medium  → ~30px (default se nessuna classe) */
/* .vg-strength--strong  → ~50px */

/* --- Touch device: disabilita tutto --- */
@media (hover: none) {
    .vg-mouse-section {
        cursor: auto;
    }
    .vg-mouse-cursor {
        display: none;
    }
    .vg-mouse-section .vg-mouse-el {
        transition: none !important;
    }
}








/* Necessario perché clip-path funzioni oltre i bordi del contenitore padre */
.vg-clip-expand {
    overflow: visible;
    width: 100%;
}

.wp-block-cover.vg-clip-expand,
.vg-clip-expand .wp-block-cover__inner-container {
    overflow: visible;
}

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

/* @ Altro */

.wp-block-columns {
  gap:0 !important;
}
.wp-block-columns .wp-block-column:not(:has(.wp-block-image)) {
  padding: 75px !important;
}
/* La colonna immagine deve allungarsi all'altezza della riga, non centrarsi */
.wp-block-columns .wp-block-column:has(.wp-block-image){
  align-self: stretch;
  display: flex; /* fa riempire la figure dentro la colonna */
}

/* La figure riempie tutta la colonna, niente margini di default */
.wp-block-columns .wp-block-column:has(.wp-block-image) figure{
  flex: 1;
  margin: 0;
  height: 100%;
}

/* L'immagine riempie la figure e taglia l'eccesso */
.wp-block-columns .wp-block-column:has(.wp-block-image) figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.wp-block-columns .wp-block-column:has(.wp-block-image) figure.aligncenter img {
  margin: 0 auto;
}

@media (max-width: 768px) {
  .wp-block-columns .wp-block-column:not(:has(.wp-block-image)),
  .wp-block-columns .wp-block-column:has(.wp-block-image) {
    padding: 10px !important;
  }
  .alignfull {
    padding:10px !important;
  }
} /* Fine query */

/* -------------------------------------------------- */
/* ! FORM DI CONTATTO */
/* -------------------------------------------------- */
.wpcf7 form .grid .col-50 label,
.wpcf7 form .grid .col-100 label{
  color:#fff;
  margin-bottom: 7px;
  display: inline-block;
}
.wpcf7 form .grid span.wpcf7-form-control-wrap,
.wpcf7 form .grid span.wpcf7-form-control-wrap input,
.wpcf7 form .grid span.wpcf7-form-control-wrap textarea {
  width: 100% !important;
}
.wpcf7 form .grid span.wpcf7-form-control-wrap input,
.wpcf7 form .grid span.wpcf7-form-control-wrap textarea {
  padding: 10px;
  border-radius: 25px;
  color: #ededed;
  background: #181818;
  border: 0;
  box-shadow:0px 10px 10px -12px #fff;
}

/* Reset della checkbox: annulla gli stili globali degli input testuali */
.wpcf7 form .grid span.wpcf7-form-control-wrap input[type="checkbox"] {
  width: auto !important;
  padding: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  flex: 0 0 auto;
  margin: 3px 0 0 0; /* micro allineamento con la prima riga di testo */
}

/* La label dell'acceptance: flag a sinistra, testo a destra */
.wpcf7-acceptance .wpcf7-list-item {
  margin: 0;
}
.wpcf7-acceptance .wpcf7-list-item label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
}
.wpcf7-acceptance .wpcf7-list-item-label {
  flex: 1;
  color: #fff; /* testo bianco coerente con il resto del form */
}

/* Il <p> contenitore di CF7 non deve aggiungere margini extra */
.wpcf7 form .grid .col-100 p {
  margin: 0;
}

.wpcf7 form [type=button],
.wpcf7 form [type=reset],
.wpcf7 form [type=submit], button {
  -webkit-appearance: button;
  appearance: button;
  background: var(--color2);
  color: #fff;
  border: none;
  padding: 15px 45px;
  margin-top: 35px;
  border-radius: 50px;
}

/* -------------------------------------------------- */
/* ! PAGINE */
/* -------------------------------------------------- */
/* @ HOMEPAGE */
.p6px {padding:6px;}

@media (max-width: 768px) {
  .p6px {
    padding:20px !important;
    gap: 0!important;
  }
  .wp-block-gallery.p6px.has-nested-images figure.wp-block-image {
    padding: 5px;
  }
} /* Fine query */

/* @ BLOG - INDEX.PHP */
section.hero{
  background: var(--color1);
  display: flex;
  align-items: center;
  justify-content: center;
}
section.hero h1 {
  text-align:center;
}
body.blog main article {
  margin-bottom:35px;
}
body.blog main article a img {
  aspect-ratio: 5 / 3;
  object-fit: cover;
  padding-bottom: 0 !important;
}
body.blog main article a.link-massi {
  font-size: clamp(1.4rem, 4vw, 1.52rem);
  line-height: 1;
}

/* -------------------------------------------------- */
/* ! FOOTER */
/* -------------------------------------------------- */
footer p {
  margin: 0 0 10px 0 !important;
  line-height: 1.5;
}