/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/* Padding logo */
@media screen and (max-width: 768px) {
  .ast-site-identity {
    padding: 0 !important;
  }
}

/* Submenu lingua */
.menu-item-wpml-ls-2-it ul.sub-menu,
.menu-item-wpml-ls-2-en ul.sub-menu {
  max-width: 80px !important;
}
#menu-item-wpml-ls-2-en .menu-link {
  margin-bottom: 0;
}

/* Menu lingua mobile */
.ast-builder-language-switcher-item.ast-builder-language-switcher-item__active {
  text-decoration: underline !important;
  color: #ffffff;
  text-underline-offset: 2px;
}

/* Menu popup */
.ast-mobile-popup-drawer.active .menu-toggle-close:focus,
button.ast-menu-toggle:focus {
  border: none !important;
}
.ahfb-svg-iconset svg {
  width: 30px;
  height: 30px;
}
.ast-mobile-popup-content img {
  max-width: 250px;
}
.ast-mobile-popup-content .sub-menu li a {
  color: #ffffff !important;
}
.ast-mobile-popup-content .menu-item.wpml-ls-slot-2 {
  display: none;
}
.ast-header-break-point .main-navigation .stack-on-mobile li {
  max-width: 360px !important;
  margin: auto !important;
}
.sub-menu li a.menu-link {
  line-height: 1.5;
  font-size: 15px;
  margin-bottom: 10px;
}
span.ast-lswitcher-item-header {
  text-transform: uppercase !important;
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
}

/* Typography */
@media screen and (max-width: 768px) {
  .center-text-mobile {
    padding-top: 30px !important;
    text-align: center;
  }
  #n2-ss-54item1,
  #n2-ss-53item2,
  .n2-font-a9a645f25a44cd3682bb56c04f05f5d2-paragraph,
  #n2-ss-52item1,
  .n2-font-eacff4dcca4bdf09bb8001a0f6d3aaa6-paragraph,
  #n2-ss-4item1 {
    text-align: center !important;
  }
  .center-text-mobile .wp-block-buttons {
    justify-content: center !important;
  }
}

/* Griglia portfolio per pagina archivio */
.post-type-archive-portfolio {
  background-color: #000;
}
.titolo-portfolio {
  text-align: center;
  padding-bottom: 40px;
}
.portfolio-grid-archive {
  padding: 50px 0;
}
.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* Griglia a 4 colonne */
  gap: 0; /* Nessun margine tra i box */
  width: 100vw; /* Full width */
  margin-left: calc(
    -50vw + 50%
  ); /* Centra la griglia per la larghezza completa */
}
@media screen and (max-width: 768px) {
  .portfolio-grid {
    grid-template-columns: repeat(1, 1fr) !important; /* Griglia a 4 colonne */
  }
}
.portfolio-box {
  position: relative;
  overflow: hidden;
}
.portfolio-box a {
  text-decoration: none;
  color: inherit;
  display: block;
}
.portfolio-image-wrapper {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 300px; /* Altezza fissa per le immagini */
}
.portfolio-image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transition: transform 0.3s ease;
}
.portfolio-hover-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7); /* Sfondo trasparente scuro */
  color: #fff;
  opacity: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: opacity 0.3s ease;
}
.portfolio-box:hover .portfolio-hover-content {
  opacity: 1; /* Mostra titolo e categoria al passaggio del mouse */
}
.portfolio-title {
  font-size: 1.5em;
  margin-bottom: 10px;
}
.portfolio-category {
  font-size: 1em;
}
.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 colonne */
  gap: 0; /* Nessun margine tra i box */
  width: 100vw; /* Full width */
  margin-left: calc(
    -50vw + 50%
  ); /* Centra la griglia per la larghezza completa */
}
.portfolio-image-wrapper {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* Altezza per mantenere rapporto 16:9 (9/16 = 0.5625) */
}
.portfolio-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transition: transform 0.3s ease;
}
.portfolio-hover-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7); /* Sfondo trasparente scuro */
  color: #fff;
  opacity: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: opacity 0.3s ease;
}
.portfolio-box:hover .portfolio-hover-content {
  opacity: 1; /* Mostra titolo e categoria al passaggio del mouse */
}
.portfolio-title {
  font-size: 1.5em;
  margin-bottom: 10px;
}
.portfolio-category {
  font-size: 1em;
}
.portfolio-mobile-content {
  position: absolute;
  bottom: 10px;
  left: 10px;
  right: 10px;
  background-color: rgba(
    0,
    0,
    0,
    0.5
  ); /* Sfondo semitrasparente per migliorare la leggibilità */
  padding: 10px;
  color: #fff;
  font-size: 16px;
  text-align: center;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); /* Effetto ombreggiatura */
  border-radius: 5px;
}
.portfolio-mobile-content .portfolio-title {
  font-size: 18px;
  font-weight: bold;
  margin: 0;
}
.portfolio-mobile-content .portfolio-category {
  font-size: 14px;
  margin-top: 5px;
  display: block;
}

/* Arrow */
.scroll-arrow {
  position: absolute;
  bottom: 0;
  left: 48%;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .scroll-arrow {
    left: 50%;
    transform: translateX(-50%);
  }
}
.scroll-arrow img {
  width: 50px;
  animation: bounce 2s;
}
@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translate(-50%, 0);
  }
  40% {
    transform: translate(-50%, -10px);
  }
  60% {
    transform: translate(-50%, -5px);
  }
}

/* Categoria portfolio */
.progetto-categoria {
  color: #50ebd0;
  font-weight: 700;
  font-size: 24px;
}

/* Barra menu trasparente */
.ast-theme-transparent-header .main-header-bar {
  transition: background-color 0.5s ease;
}

/* Load more */
.ast-load-more.active {
  background: #50ebd0;
  border-radius: 50px;
  padding: 5px 30px;
  text-transform: uppercase;
  font-weight: 700;
}
.ast-load-more.no-more.active {
  background: transparent !important;
}
.load-more-container {
  text-align: center;
  padding: 50px 0;
}
.loading-dots::after {
  display: inline-block;
  content: "";
  animation: dots 1s steps(3, end) infinite;
}
@keyframes dots {
  0% {
    content: "";
  }
  33% {
    content: ".";
  }
  66% {
    content: "..";
  }
  100% {
    content: "...";
  }
}
.ast-loader-wrapper {
  display: inline-block;
  background-color: #ffffff;
  padding: 5px;
  border-radius: 4px;
}

/* Hover menu */
.ast-advanced-headers
  .ast-primary-header
  .main-header-menu
  > .menu-item
  > .menu-link:hover,
.ast-advanced-headers
  .ast-primary-header
  .main-header-menu
  > .menu-item.current-menu-item
  > .menu-link {
  color: #50ebd0;
}

/* Ombra pulsante */
div#n2-ss-2 .n2-font-8c53cdfe3b9562182f2a41b70348b53c-link a,
.btn-scopri-di-piu {
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.9) !important;
}

/* Sottomenu */
/* .main-header-menu .sub-menu {
  width: fit-content !important;
} */

/* Slider portfolio */
div.n2-ss-shape-divider-inner svg path {
  fill: #000000 !important;
}

/* Archivio progetti */
.post-type-archive-progetti .site-content {
  background: #000000;
}

/* Servizi */
.type-servizi {
  padding: 0 !important;
}

/* Image */
.image-no-padding {
  padding: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}

/* Typography */
h2,
h3,
h4 {
  margin-top: 0 !important;
}

/* Progetti */
.hero-progetti {
  position: relative;
  width: 100%;
  height: 100dvh;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  text-align: center;
}
.hero-progetti .hero-content {
  position: relative;
  z-index: 2;
  padding: 20px;
}
.hero-progetti h1 {
  font-size: 60px;
  text-transform: uppercase;
}
.hero-progetti .hero-description {
  font-size: 1.2rem;
  margin-top: 10px;
}
.hero-progetti::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Oscura l'immagine */
  z-index: 1;
}
.related-projects {
  text-align: center;
}
#load-more-progetti {
  margin-top: 30px;
}
.single-progetti.ast-single-post.ast-page-builder-template
  .site-main
  > article {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Single prodotto: niente padding verticale (come single servizi) */
.single-prodotti .site-content {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Servizi */
.hero-servizi {
  position: relative;
  width: 100%;
  height: 100dvh;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  text-align: center;
}
.hero-servizi .hero-content {
  position: relative;
  z-index: 2;
  padding: 20px;
}
.hero-content h1 {
  font-size: 60px;
}
.hero-servizi .hero-description {
  font-size: 1.2rem;
  margin-top: 10px;
}
.hero-servizi::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Oscura l'immagine */
  z-index: 1;
}
.btn-scopri-di-piu {
  display: inline-block;
  margin-top: 20px;
  background: #50ebd0;
  opacity: 1;
  padding: 15px 40px 15px 40px;
  box-shadow: none;
  border: 0px solid RGBA(0, 0, 0, 1);
  border-radius: 50px;
  color: #000000;
  font-weight: 700;
}
.btn-scopri-di-piu:hover {
  color: #000000;
}
.uagb-ifb-title {
  margin-top: 0 !important;
}

/* Sopratitolo */
.sopratitolo {
  font-weight: 700;
  color: #50ebd0;
  font-size: 13px;
}

/* Footer basso */
.site-footer-below-section-4.site-footer-section.site-footer-section-4 {
  justify-content: normal !important;
}

/* Slider */
div#n2-ss-6 .n2-ss-slider-3 {
  background: #000000 !important;
}

/* Pagina servizi alternata */
.servizi-lista-alternata {
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin: 80px 0 !important;
}
.servizio-riga {
  display: flex;
  align-items: center;
  gap: 0px;
  background: #ffffff;
  border-radius: 10px !important;
  overflow: hidden;
}
.servizio-immagine {
  width: 50%;
  height: 500px;
  background-size: cover;
  background-position: center;
}
.servizio-testo {
  width: 50%;
  text-align: left;
  padding: 50px;
  color: #333 !important;
}
.servizio-testo p {
  color: #333 !important;
}
.servizio-riga .servizio-testo h3 {
  font-size: 30px;
  color: #333;
}
.servizio-testo p {
  margin: 15px 0;
  font-size: 1em;
  color: #ffffff;
  padding-bottom: 20px;
}
.servizio-riga .servizio-button {
  border-radius: 50px;
  padding: 15px 40px;
}
.servizio-riga.destra .servizio-immagine {
  order: 2; /* Sposta l'immagine a destra */
}
.servizio-riga.destra .servizio-testo {
  order: 1; /* Sposta il testo a sinistra */
}
.servizi-lista-alternata .servizio-button:hover {
  background: #000000;
  color: #ffffff !important;
}

/* Menu */
ul.sub-menu li a {
  color: #000000 !important;
}
ul.sub-menu li a:hover {
  color: #50ebd0 !important;
}

/* Footer */
#nav_menu-3 ul#menu-principale li a.menu-link {
  color: #ffffff !important;
}
#nav_menu-3 ul#menu-principale li {
  margin-bottom: 10px;
}

/* Contatti */
.form-container
  .wpforms-container.wpforms-container-full.wpforms-render-modern {
  margin-top: 0;
}
.form-container .wpforms-field-label,
.form-container .wpforms-field-sublabel.after {
  color: #ffffff !important;
}
.form-container div.wpforms-container-full input[type="email"],
.form-container div.wpforms-container-full input[type="text"],
.form-container div.wpforms-container-full textarea,
.form-container .wp-core-ui div.wpforms-container-full input[type="email"],
.form-container .wp-core-ui div.wpforms-container-full input[type="tel"],
.form-container .wp-core-ui div.wpforms-container-full input[type="text"],
.form-container .wp-core-ui div.wpforms-container-full textarea {
  background: transparent;
  border: 1px solid #424140;
  color: #333 !important;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  border-color: #ddd;
}
.wpforms-field-label-inline,
.wpforms-field-description {
  color: #333 !important;
}
div.wpforms-container-full button[type="submit"],
div.wpforms-container-full button[type="submit"]:hover,
div.wpforms-container-full button[type="submit"]:active {
  background: #50ebd0 !important;
  border-radius: 50px !important;
  padding: 10px 40px !important;
  color: #1e293b !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}
div.wpforms-container-full button[type="submit"]:hover {
  color: #ffffff !important;
  background: #000000 !important;
}
.form-container .wpforms-container ::-webkit-input-placeholder {
  /* Chrome and Safari */
  color: #333 !important;
}
.form-container .wpforms-container :-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #333 !important;
  opacity: 1 !important;
}
.form-container .wpforms-container ::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #333 !important;
  opacity: 1 !important;
}
.form-container .wpforms-container :-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #333 !important;
}
.form-container .wpforms-container ::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #333 !important;
}
.form-container .wpforms-container ::placeholder {
  color: #333 !important;
}
.box-contatti img {
  margin-right: 20px;
}
.box-contatti .uagb-ifb-title {
  margin-bottom: 0 !important;
}
.box-contatti .uagb-ifb-desc {
  font-size: 20px;
}
.box-contatti.middle {
  border-top: 1px solid #424140;
  border-bottom: 1px solid #424140;
  padding-top: 30px;
  padding-bottom: 10px;
}

/* Loghi white */
.loghi-white .partner-logo img {
  filter: brightness(0) invert(1);
}

/* Blog */
.hero-container,
.container-articolo,
.author-bio-box {
  max-width: 1200px !important;
  margin: auto;
}
.hero-container {
  text-align: center;
}
.hero-container h1 {
  font-size: 50px;
  line-height: 1 !important;
  font-weight: 700;
}
.hero-container .breadcrumb {
  font-size: 13px;
  margin-bottom: 10px;
}
.container-articolo {
  margin-top: 50px;
}
.container-articolo h2 {
  font-size: 30px;
}
.container-articolo h3 {
  font-size: 20px;
}
.wp-block-search__input {
  min-height: 50px;
}
.sidebar-main .widget.widget_block.widget_text p,
.sidebar-main .wp-block-categories-list.wp-block-categories a {
  color: #333333 !important;
}
.container-articolo h2,
.container-articolo h3,
.container-articolo h4 {
  margin-top: 30px !important;
}
.entry-meta * {
  color: #ddd !important;
}
.ast-post-format-.single-layout-1.ast-no-date-box .entry-meta {
  color: #ddd !important;
  font-size: 13px;
  margin-bottom: 20px;
  text-align: center;
}
.ast-post-format-.single-layout-1.ast-no-date-box h2 {
  font-size: 30px;
}
.ast-post-format-.single-layout-1.ast-no-date-box h3 {
  font-size: 25px;
}
.sidebar-main .wp-block-categories-list.wp-block-categories a:hover,
.sidebar-main .wp-block-categories-list.wp-block-categories a:active {
  color: #50ebd0 !important;
}

/* Box icona */
.box-icona {
  background: #ffffff;
  border-radius: 10px;
}
.box-icona h3 {
  color: #333;
}
.box-icona p {
  margin-bottom: 0 !important;
  color: #333;
}

/* Footer */
#block-12 img {
  width: 200px;
}

/* Griglia social */
.social-icons-grid {
  display: flex;
  gap: 15px;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .social-icons-grid {
    justify-content: center !important;
  }
}
.social-icon img {
  width: 35px; /* Puoi modificare la dimensione a seconda del bisogno */
  height: auto;
  transition: transform 0.3s ease;
}
.social-icon:hover img {
  transform: scale(1.1); /* Ingrandisce leggermente al passaggio del mouse */
}

/* Griglia articoli blog */
.latest-posts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}
@media screen and (max-width: 768px) {
  .latest-posts-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}
.latest-post-box {
  overflow: hidden;
  text-align: center;
}
.latest-post-box .post-image {
  border-radius: 10px !important;
}
.latest-post-box a {
  text-decoration: none;
  color: inherit;
  display: block;
  cursor: pointer;
  text-decoration: none !important;
}
.latest-post-box h3 {
  font-size: 1.25em;
  padding: 20px 0;
}
.latest-post-box {
  width: 100%;
}
.post-image-wrapper {
  width: 100%;
  padding-top: 56.25%; /* Rapporto 16:9 */
  position: relative;
  overflow: hidden; /* Importante per mantenere l'immagine all'interno della cornice */
  border-radius: 8px; /* Aggiungi un bordo arrotondato opzionale */
  background-color: #f0f0f0; /* Placeholder per sfondo */
  border-radius: 10px !important;
}
.post-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transition: transform 0.3s ease; /* Transizione per l'effetto zoom */
}

/* Pulsanti */
.entry-content .wp-block-buttons {
  margin-bottom: 0 !important;
}

/* Slider */
div#n2-ss-3 .n2-ss-slide {
  border-radius: 10px;
}
.n2-ss-shape-divider-inner svg path {
  fill: #f3f3f4 !important;
}

/* Griglia servizi (shortcode) */
.servizi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .servizi-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}
.servizio-box {
  background-color: #fff;
  border-radius: 10px;
  overflow: hidden; /* Nasconde tutto ciò che esce dal box */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  text-align: center;
}
.servizio-box a {
  text-decoration: none;
  color: inherit;
  display: block;
}
.servizio-image-wrapper {
  position: relative;
  overflow: hidden; /* Nasconde l'overflow dell'immagine quando viene ingrandita */
  width: 100%;
  height: 300px;
}
.servizio-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-position: center;
  transition: transform 0.3s ease; /* Aggiunta transizione per il zoom dell'immagine */
}
.servizio-title {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  font-size: 1.25em;
  padding: 10px;
  text-align: center;
  margin: 0 !important;
}
.servizio-box p {
  margin: 15px 0;
  font-size: 1em;
  padding: 0 10px;
  color: #1e293b;
}
.servizio-button {
  padding: 10px 30px;
  background: #50ebd0;
  color: #000000 !important;
  text-decoration: none !important;
  text-transform: uppercase;
  font-weight: 700;
}
/* Effetto hover solo su dispositivi con schermi superiori a 768px */
@media (min-width: 769px) {
  .servizio-box:hover .servizio-image {
    transform: scale(1.1);
    transition: transform 0.3s ease;
  }
  .portfolio-box:hover .portfolio-image {
    transform: scale(1.1);
    transition: transform 0.3s ease;
  }
  .post-image-wrapper:hover .post-image {
    transform: scale(1.1); /* Effetto zoom */
  }
}

/* Effetto ripple pulsanti */
.servizio-button,
.wp-block-button__link {
  position: relative !important;
  overflow: hidden;
  display: inline-block;
}
.c-ripple__circle {
  position: absolute;
  border-radius: 50%;
  transform: scale(0);
  animation: ripple-animation 2s linear;
  background: rgba(255, 255, 255, 0.5); /* Colore bianco trasparente */
  pointer-events: none;
}
@keyframes ripple-animation {
  to {
    transform: scale(4);
    opacity: 0;
  }
}

/* Iframe */
.responsive-iframe {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100% !important;
}
.responsive-iframe iframe,
.responsive-iframe object,
.responsive-iframe embed {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

/* Slick */
.slick-slide {
  margin: 0 10px; /* Spazio per mostrare la slide successiva */
}
.js-servizi-slider .slick-dots {
  bottom: -50px !important;
  padding-left: 0;
}
.js-blog-slider .slick-dots {
  bottom: -10px !important;
  padding-left: 0;
}
.js-portfolio-slider .slick-dots {
  bottom: -50px !important;
}
.slick-dots li button::before {
  color: #ffffff !important;
}

/* Mobile */
@media screen and (max-width: 768px) {
  .site-content {
    background: #000000;
  }
  .contatti-form {
    text-align: center !important;
  }
  .box-contatti img {
    margin-right: 0 !important;
  }
  .servizio-riga {
    flex-direction: column !important;
  }
  .servizio-immagine,
  .servizio-testo {
    width: 100%;
    height: 300px;
    text-align: center;
  }
  .servizio-testo {
    padding: 20px 20px 40px 20px;
    height: unset;
  }
  .servizio-riga.destra .servizio-immagine {
    order: 1 !important;
  }
  body
    .ast-container
    .wp-block-uagb-container
    > .uagb-container-inner-blocks-wrap
    > .wp-block-uagb-container
    > ul {
    margin-left: 0 !important;
  }
  .hero-servizi {
    padding-left: 20px;
    padding-right: 20px;
  }
  .hero-content h1,
  .hero-container h1 {
    font-size: 45px;
  }
  .blog .site-content {
    background: #ffffff;
    padding: 20px;
  }
  .ast-separate-container .ast-article-inner {
    background: #000000;
  }
}

@media screen and (max-width: 768px) {
  .prodotti-template-default .wp-block-group-is-layout-flex {
    flex-wrap: wrap;
  }
}