/*
Theme Name: D. V. Srl - Duplipack
Theme URI: https://www.nasuellidesign.it/
Author: Nasuelli Claudio
Author URI: https://www.nasuellidesign.it/
Description: D. V. Srl - Duplipack Theme
Version: 1.0
Requires at least: 5.0
Tested up to: 5.4
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nextframe
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


/* ! Reset */
body, html{ font-size: 16px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif; box-sizing: border-box;margin: 0;padding: 0;}
*,*:before,*:after{ box-sizing: border-box; }
h1,h2,h3,h4,h5,h6, p, ol, ul{margin: 0;padding: 0;}
ol,ul{list-style-type: none;}
img{height: auto;}
a{text-decoration: none;}
hr{border:none; border-bottom: 1px solid #ddd}

:root{
  --menu-bg: #000000;
  --menu-text: #ffffff;
}



a{text-decoration: none;color: #FE0000;}
p{line-height: 1.3}

.spacer{height: 110px;}

/* ! Title System */
.text-0{font-size: 5rem; line-height: 1;}
h1, .text-1{font-size: 3.4rem;}
h2, .text-2{font-size: 2.2rem;}
h3, .text-3{font-size: 1.5rem;}
h4, p, .text-4{font-size: 1rem;}

h1, h2, h3, h4, p, ol, ul{margin-bottom: 1rem;}

h1, .title-1{font-size: 1.2rem;}
h2, .title-2{font-size: clamp(1.743rem, 1.743rem +((1vw - 0.2rem)* 2.052), 3rem); line-height: 1.1;}

@media (max-width: 768px) {
  .text-0{font-size: 4rem}
  h2, .title-2{font-size: 1.3rem; line-height: 1.1;}
}

/* ! Button system */
.button,
.wp-block-button__link{font-size: 1.2rem; text-transform: uppercase; font-weight: bold; background: #FE0000; color:#fff; padding: 14px 25px;display: inline-block;border-radius: 4px; transition: all 1s cubic-bezier(.215, .61, .355, 1);}
.button:hover,
.wp-block-button__link{background: #800000;}

/* ! Salta al contenuto */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: #000;
  color: #fff;
  padding: 8px 16px;
  z-index: 1000;
  text-decoration: none;
  transition: top 0.3s;
}

.skip-link:focus {
  top: 0;
}




/* ! Header */
/*----------------------------------------------------------------------------------- */
.header-container{position: fixed;background: var(--menu-bg);top:0;left:0;z-index: 9999;width: 100%;}
.logged-in .header-container{top:30px}
.header{ display: flex; justify-content: space-between;width: 100%;max-width: 1300px;margin: 0 auto; padding: 1%;}
.header a{color:var(--menu-text); display: block; padding: 15px;}

.header__menu{margin-bottom: 0;}

.header__menu li{display: inline-block; position: relative;}
.header__menu li a{position: relative;}

.header__menu > li.menu-item-has-children > a:after{
  content: " ";
  width: 16px;height: 16px;
  position: absolute;
  top:50%; 
  transform: translateY(-50%);
  right:-5px;
  filter: invert(1);
  background-size: 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Down%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 184l144 144 144-144'/%3E%3C/svg%3E");
}


.header__menu li ul{border-radius: 5px;}	
.header__menu li ul{position: absolute;left:0; width: 180px;background: #eee; display: none; visibility: hidden;box-shadow: 0 10px 10px rgba(0,0,0,.09);}
.header__menu li ul{z-index: 999!important;}	
.header__menu li ul li{width: 100%;}
.header__menu li:hover > ul{display: block;visibility: visible;}
li.menu-item-has-children li a{color: #000;}
li.menu-item-has-children li a:hover {background: #ccc; color: #000; border-radius: 5px; transition: all 0.4s cubic-bezier(.215, .61, .355, 1);}

.header a.header__logo{font-weight: bold;padding: 0;}
.header__logo img{height: 55px;margin: 10px;}
.header__hamburger{display: none;}


@media (max-width: 768px) {
  .header-container{background: #000000!important;}
  .header__logo img{height: 55px;margin: 10px;}
  .header__hamburger{display: block;width: 40px;height: 35px; margin-top: 18px;margin-right: 4px;}
  .header__hamburger span{width: 33px;height: 2px;background: #fff; margin-top: 8px;display: block;transition: all 0.15s cubic-bezier(.215, .61, .355, 1);}
  .header__menu{position:absolute;top:93px; right:0; width: 100%;background: #ffffff; height: 100vh;overflow: hidden; transform: translateX(100%); transition: all 1s cubic-bezier(.215, .61, .355, 1);}
  .header__menu li {display: block; border-bottom: 1px solid #000; width: 90%; margin: 0 5%;} 
  .header__menu li a{color:#000000!important;  opacity: 1; font-size: 16px; padding: 18px 18px; font-weight: normal;} 

  .header__menu > li.menu-item-has-children > a:after{filter: invert(0);}

  .header__menu ul li a{  opacity: 1; font-size: 14px; padding: 0px;} 


  .header__menu li ul li { border: none; width: 95%;}

  /*.header__menu li ul {padding: 10px;}*/

   /* Voci del sottomenu */
   .header__menu li ul li {
    padding: 8px 0;           /* spaziatura verticale */
  }

  /* Rimuovi il bordo all'ultima voce del sottomenu */
  .header__menu li ul li:last-child {
    border-bottom: none;
  }

   /* Voci del sottomenu */
   .header__menu li ul li {
    padding: 8px 0;           /* spaziatura verticale */
    /*border-bottom: 1px solid #000;  opzionale: separatore nero */
  }

  /* Rimuovi il bordo all'ultima voce del sottomenu */
  .header__menu li ul li:last-child {
    border-bottom: none;
  }

} 

@media (max-width: 768px) {

  .header__menu li ul{position: relative;width: 100%;padding-left: 12px; }
  .header__menu > li.menu-item-has-children > a:after{right: 10px;}


  .header__menu li ul {
    position: relative !important;
    width: 100% !important;
    background: none !important;        
    box-shadow: none !important;           
  }
} 

  .menu-open .header__hamburger span:nth-child(1){transform: translateY(5px) rotate(45deg);}
  .menu-open .header__hamburger span:nth-child(2){transform: translateY(-5px) rotate(-45deg);}

  .menu-open .header__menu{transform: translateX(0%);}
  .menu-open{overflow:hidden;}

  .header__quick {padding-top: 12px;}


/* Chiusura submenu + Js da mobile */

@media (max-width: 768px) {
  .header__menu li ul {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
  }

  .header__menu li.open > ul {
    max-height: 400px; /* o auto, ma meglio un valore per l'animazione */
  }
}


@media (max-width: 768px) {

  /* Forza i li con sottomenu ad avere la stessa altezza delle altre voci */
  .header__menu > li.menu-item-has-children {
    margin-bottom: 0;
    padding-bottom: 0;
  }

  /* Elimina ogni margine/padding interno al submenu chiuso */
  .header__menu li ul {
    margin: 0;
    padding: 0 0 0 12px; /* mantieni solo indentazione a sinistra */
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
  }

  /* Quando aperto */
  .header__menu li.open > ul {
    max-height: 400px; /* oppure auto, se vuoi dinamico */
    padding-bottom: 115px; transition: all 1s cubic-bezier(.215, .61, .355, 1);
  }

  /* Opzionale: per uniformare il click area dei genitori */
  .header__menu > li.menu-item-has-children > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .header__menu > li.menu-item-has-children > a::after {
    content: "";
    font-size: 12px;
    margin-left: 8px;
    transition: transform 0.3s ease;
  }

  /* Gira la freccia quando aperto */
  .header__menu li.open > a::after {
    transform: rotate(-180deg);
  }
}

/* Fine codice submenu animato correttamente */


/* @media (min-width: 768px) {

  .header-container{padding-top: 40px;}
  
} */

/* ! trasparent menu in template home */

.page-template-home-template .header-container{background: transparent; transition: all 1s cubic-bezier(.215, .61, .355, 1)!important;}
.page-template-sezioni-template .header-container{background: transparent; transition: all 1s cubic-bezier(.215, .61, .355, 1)!important;}
.page-template-vinili-template .header-container{background: transparent; transition: all 1s cubic-bezier(.215, .61, .355, 1)!important;}
.page-template-home-template .header-container .header > .header__menu > li > a{color:#ffffff}
.scroll-down.page-template-home-template .header-container {background: #000; transition: all 1s cubic-bezier(.215, .61, .355, 1);}
.scroll-down.page-template-sezioni-template .header-container {background: #000; transition: all 1s cubic-bezier(.215, .61, .355, 1);}
.scroll-down.page-template-vinili-template .header-container {background: #000; transition: all 1s cubic-bezier(.215, .61, .355, 1);}
.scroll-down .header-container { background: #000; transition: all 1s cubic-bezier(.215, .61, .355, 1);}








/* ! Index */
/*----------------------------------------------------------------------------------- */


/* ! Single */
/*----------------------------------------------------------------------------------- */


/* ! Footer */
/*----------------------------------------------------------------------------------- */

.footer-pv{background:transparent;}
.footer {color:#fff!important; background: #000;
  background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(65, 71, 71, 1) 100%);}
.footer a{color:#fff!important;}
.footer__logo{height: 50px; width: auto;margin-bottom: 20px;}
.icon-social{opacity: 1;}

.icon-acces {
  list-style: none;
  padding: 0;
  margin: 0;
}

.icon-acces li {
  display: inline-block;
  margin: 0 5px;
}


.footer-bottom{
  background: #000;
  color:#fff!important; margin-bottom: 0;padding: 20px;font-weight: 300;font-size: 14px;}
.footer-bottom a{color:#fff!important;}

.eu-text{color:#fff;font-size: 16px;width: 100%;
  background: #000;
background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(65, 71, 71, 1) 100%);
  margin-bottom: 0;padding: 30px;text-align: center;}
.eu-text img{width: 30px;margin-right: 10px;position: relative; bottom: -4px;}
.eu-text a{color:#fff!important; font-size: 16px!important; font-weight: bold!important;}

/* Loghi Footer */
.logos-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  align-items: center;
  margin-top: 1rem;
}

.logos-grid img {
  height: 55px;
  max-width: 100%;
  object-fit: contain;
}

@media (max-width: 600px) {
  .logos-grid {
    gap: 15px;
  }

  .logos-grid img {
    height: 60px;
  }
}



/* ! Grid System */
/*----------------------------------------------------------------------------------- */
.grid{display: flex; flex-wrap: wrap; max-width: 1650px; margin: 0 auto}
.grid--small{max-width: 900px}
.grid--center{justify-content: center;}
.grid--full{max-width: 100%}

.col-20{width:20%}
.col-25{width:25%}
.col-30{width:30%}
.col-33{width:33.33%}
.col-40{width:40%}
.col-50{width:50%}
.col-60{width:60%}
.col-70{width:70%}
.col-80{width:80%}
.col-90{width:90%}
.col-100{width:100%}

[class*='col-']{padding: 3%;}

.grid--full [class*='col-'],
.grid .grid [class*='col-'] {padding: 0;}


@media (max-width: 768px) {
  [class*='col-']{width: 100%}
  .sma-33{width: 33.33%}
  .sma-50{width: 50%}
  .sma-25{width: 25%}
}


/* ! Helpers */
/*----------------------------------------------------------------------------------- */


.br{border: 1px solid red;}
.img-res{width: 100%;}
.video-res{width: 100%;height: 100%;overflow: hidden;}
.video-res video{width: 100%;height: 100%;object-fit: cover}

.mt-0{margin-top: 0;}
.mt-1{margin-top: 1rem;}
.mt-2{margin-top: 2rem;}
.mt-3{margin-top: 3rem;}
.mt-4{margin-top: 4rem;}

.mb-0{margin-bottom: 0;}
.mb-1{margin-bottom: 1rem;}
.mb-2{margin-bottom: 2rem;}
.mb-3{margin-bottom: 3rem;}
.mb-4{margin-bottom: 4rem;}

.text-center{text-align: center}
.text-left{text-align: left}
.text-right{text-align: right}

.p-0{padding: 0;}
.p-1{padding: 1rem;}
.p-2{padding: 2rem;}
.p-3{padding: 3rem;}
.p-4{padding: 4rem;}

.pt-0{padding-top: 0;}
.pt-1{padding-top: 1rem;}
.pt-2{padding-top: 2rem;}
.pt-3{padding-top: 3rem;}
.pt-4{padding-top: 4rem;}

.pb-0{padding-bottom: 0;}
.pb-1{padding-bottom: 1rem;}
.pb-2{padding-bottom: 2rem;}
.pb-3{padding-bottom: 3rem;}
.pb-4{padding-bottom: 4rem;}


.icon-small{width: 40px;padding: 8px;}
.icon-white{filter: invert(1);}
.bg-dark{background: #000;}
.text-white{color:#fff}   
.text-red{color:#FE0000} 
.text-dark{color:#000}
.v-center{display: flex; justify-content: center; flex-flow: column;align-items: flex-start;}

.font-normal{font-weight: 400;}

.none{display: none;}
@media (max-width: 768px) {
  .sma-none{display: none;}
}

@media (min-width: 768px) {
  .desktop-none{display: none;}
}



/* ! Wordpress Styles */
/*----------------------------------------------------------------------------------- */

input, textarea{border: 3px solid #ddd; border-radius: 3px;padding: 10px;}
input[type=submit], button{border: 3px solid #ddd; background: #ddd; border-radius: 3px;padding: 10px;}

.form-search{width: 100%;border: 3px solid #FE0000;border-radius: 100px; padding-left: 15px;}
.form-search input{width: calc(100% - 40px); border:none;}
.form-search button{padding: 0;background:transparent; border: none;}
.form-search img{width: 25px;margin-bottom: -8px;}
.form-search input[type="text"]::placeholder {
  color: #FE0000; /* blu*/
  font-weight: bold;
  font-size: 16px;
}


.alignfull{width: 100vw;margin-left: calc(50% - 50vw);}
.alignwide{width: 90vw;margin-left: calc(50% - 45vw);}




/*------ Modulo Contatto ---------*/


.wpcf7 input[type="file"] {
	cursor: pointer;
	/*color: transparent;*/
}

.wpcf7{background: #fff; color: #000; border: 4px solid #000; padding: 3%; border-radius: 20px;max-width: 650px!important; margin: 0 auto;box-shadow: 0 5px 20px rgba(0, 0, 0, 0.32);}
.wpcf7 a{color: #000!important;}
@media (max-width: 768px) {
.wpcf7{padding: 5%;}
}

.wp-block-embed__wrapper{
  border-radius: 30px;
  overflow: hidden;
}

.wpcf7 input,
.wpcf7 textarea{width: 100%;}

input[type=text],
input[type=email] { color: #000; width: 100%;margin-right: 10px; padding: 10px; border: 1px solid #000; border-radius: 100px; background: #fff; -webkit-appearance: none;font-size: 18px;}
input[type=tel] { color: #000; width: 100%;margin-right: 10px; padding: 10px; border: 1px solid #000; border-radius: 100px; background: #fff; -webkit-appearance: none;font-size: 18px;}
input[type=date] { color: #000; width: 100%;margin-right: 10px; padding: 10px; border: 1px solid #000; border-radius: 100px; background: #fff; -webkit-appearance: none;font-size: 18px;}
textarea {color: #000; padding: 10px; width: 100%; border: 1px solid #000; background: #fff; -webkit-appearance: none;border-radius: 20px;font-size: 18px;}
input[type=submit] { margin-top: 10px; padding: 15px 20px; color: #000; text-transform: uppercase; background: #ff0000; border-radius: 4px; font-size: 18px; border: none;}
#comments { width: 100%; }
.form-search{width: 100%;border: 3px solid #000;border-radius: 100px; padding-left: 15px;}
.form-search input{width: calc(100% - 40px); border:none;background: transparent;}
.form-search button{padding: 0;background:transparent; border: none;}
.form-search img{width: 25px;margin-bottom: -8px;}


.wpcf7 input.wpcf7-submit{
  
  width: auto;
  font-size: 1.2rem;
  
  background: #FE0000;
  
  color:#fff!important; padding: 14px 25px;border-radius: 4px; border: 3px solid 000;}
  .wpcf7 input.wpcf7-submit:hover {background: #800000; color: #ffffff!important; transition: all 1s cubic-bezier(.215, .61, .355, 1);}


   /* Pulsante accettazione
   -------------------------------------------------------- */
   input[type="checkbox" i] {
    background-color: initial;
    cursor: default;
    -webkit-appearance: checkbox;
    box-sizing: border-box;
    margin: 1px 23px 1px 1px;
    padding: initial;
    border: initial;
}