/* =========================================================
   BG — Custom Styles (child theme) - CLEANED
   ========================================================= */

/* ----------------------------------
   FONT — default globali
   ---------------------------------- */

body, p, li, a, span, label, button, input, textarea, select {
  font-family: var(--f-sans);
}

h1, h2, h3, h4, h5, h6, .entry-title {
  font-family: var(--f-serif);
}

/* ----------------------------------
   HEADER / STICKY / MEGA-MENU
   ---------------------------------- */

/* Logo navbar — dimensione uniforme su tutte le pagine (riferimento: blog) */
#masthead .custom-logo-link img,
#masthead .custom-logo-link .custom-logo,
#masthead .ast-transparent-desktop-logo img,
#masthead .ast-transparent-desktop-logo .custom-logo,
#masthead .transparent-custom-logo img,
#masthead .transparent-custom-logo .custom-logo {
  max-width: 160px !important;
  width: 160px !important;
  height: auto !important;
}


/* Navbar sempre trasparente — tutte le pagine */
#masthead,
#masthead .ast-container,
#masthead .main-header-bar,
#masthead .main-header-bar-wrap,
.site-header,
.ast-masthead-custom-menu-items,
.main-header-bar {
  background: transparent !important;
}

/* Mobile: #ast-mobile-header sempre trasparente — tutte le pagine */
#ast-mobile-header,
#ast-mobile-header .ast-primary-header-bar,
#ast-mobile-header .ast-mobile-header-bar {
  background: transparent !important;
}


#masthead .main-header-bar {
  padding-top: 0 !important;
}

/* Header visibility logic */
#masthead {
  position: sticky !important;
  top: 0 !important;
  width: 100% !important;
  z-index: 1000;
}

/* Blocca padding-top dinamico di Astra su desktop (header sticky è in flow, non serve offset) */
@media (min-width: 769px) {
  #page {
    padding-top: 0 !important;
  }
}
body.hide-main-header #masthead {
  transform: none;
  opacity: 1;
  pointer-events: auto;
}

/* Sticky header */
#custom-sticky-header {
  position: fixed;
  top: 20px;
  left: 0;
  width: 100%;
  z-index: 999;
  background: transparent;
  height: 200px;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--dur-m) var(--ease-out), visibility 0s var(--dur-m);
  /* Container trasparente ai click — solo logo + burger sono interattivi (cfr. #bg-mobile-nav).
     Senza questo il box 200×100% intercetta tutti i click in cima al viewport. */
  pointer-events: none;
}
#custom-sticky-header .custom-logo,
#custom-sticky-header .custom-logo a,
#custom-sticky-header .burger-wrapper,
#custom-sticky-header .burger-wrapper button,
#custom-sticky-header .custom-hamburger {
  pointer-events: auto;
}
body.show-custom-sticky #custom-sticky-header {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

/* Logo: entra dall'alto (replica animazione originale header) */
#custom-sticky-header .custom-logo {
  transform: translateY(-200px);
  opacity: 1;
  transition: transform var(--dur-m) var(--ease-out),
              opacity var(--dur-m) var(--ease-out);
}
body.show-custom-sticky #custom-sticky-header .custom-logo {
  transform: translateY(0);
}
/* Sopra il footer il logo esce in dissolvenza sul posto (2026-08-01):
   niente ritorno verso l'alto, resta in posizione e sfuma. */
body.show-custom-sticky.sticky-logo-hidden #custom-sticky-header .custom-logo {
  opacity: 0;
  pointer-events: none;
}

/* Burger: entra da destra */
#custom-sticky-header .burger-wrapper {
  transform: translateX(60px);
  transition: transform var(--dur-m) var(--ease-out);
  margin-right: -1px;
}
body.show-custom-sticky #custom-sticky-header .burger-wrapper,
body.mega-menu-is-active #custom-sticky-header .burger-wrapper {
  transform: translateX(0);
}
/* Il burger resta visibile anche sopra il footer: e' l'unico accesso al menu. */


.custom-sticky-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  box-sizing: border-box;
}

#custom-sticky-header .custom-logo {
  align-self: flex-start;
  margin-top: 84px;
}

/* Logo verticale — rotate spostato dall'<img> all'<a> (2026-05-18):
   il box cliccabile del <a> ora ruota insieme al glyph → click area coincide
   col visibile (prima: box <a> orizzontale 180×20 ≠ glyph verticale ~20×200,
   con click "fantasma" fuori dal logo). */
#custom-sticky-header .custom-logo a {
  display: block;
  width: 170px;
  height: auto;
  padding-left: 8px;
  transform: translateY(-67px);
  rotate: -90deg;
  transform-origin: 50% 50%;
}
#custom-sticky-header .custom-logo img {
  content: url('https://brandogallo.com/wp-content/uploads/2025/11/borderless-logo.svg');
  display: block;
  width: 170px;
  height: auto;
}

/* Hamburger wrapper */
.burger-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
  align-self: flex-start;
  margin-top: -8px;
}

.burger-label {
  font-family: var(--f-sans);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text);
  line-height: 1;
  margin-right: -4px;
  margin-top: -3px;
  opacity: 0;
  transition: opacity var(--dur-sm) var(--ease-out);
}

.burger-wrapper:hover .burger-label {
  opacity: 1;
}

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

/* Hamburger menu */
.custom-hamburger {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 15px 11px 15px 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  z-index: 10001;
}

.hamburger-svg {
  display: block;
  width: 20px;
  height: auto;
  overflow: visible;
}

.hamburger-svg rect {
  transform-box: fill-box;
  transform-origin: center;
  transition: transform var(--dur-sm) var(--ease-out), opacity var(--dur-sm) var(--ease-out);
}

body.mega-menu-is-active .custom-hamburger .hamburger-svg rect:nth-child(1) {
  transform: translateY(7.75px) rotate(45deg);
}
body.mega-menu-is-active .custom-hamburger .hamburger-svg rect:nth-child(2) {
  opacity: 0;
}
body.mega-menu-is-active .custom-hamburger .hamburger-svg rect:nth-child(3) {
  transform: translateY(-7.75px) rotate(-45deg);
}

/* Mega Menu */
#custom-mega-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 10000;
  background: transparent;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--dur-m) var(--ease-out), visibility 0s var(--dur-m);
  overflow: hidden;
}
body.mega-menu-is-active #custom-mega-menu {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}
body.mega-menu-is-active {
  overflow: hidden;
  position: fixed;
  width: 100%;
  height: 100%;
}
html.mega-menu-is-active {
  overflow: hidden;
}

.mega-menu-container {
  display: flex;
  width: 100%;
  height: 100%;
  background: var(--bg);
}
.mega-menu-image-col {
  flex-basis: 45%;
  position: relative;
  overflow: hidden;
  align-self: stretch;
}
.mega-menu-bg-image {
  width: 100%;
  height: 100%;
  min-height: 100vh;
  object-fit: cover;
  object-position: top;
}

.mega-menu-site-logo {
  position: absolute;
  top: 30px;
  left: 30px;
  z-index: 0;
}
.mega-menu-site-logo img {
  width: 160px !important;
  height: auto;
}

/* Rimuove ::after "Italy" su tutti i viewport */
.mega-menu-content-col::after {
  content: none !important;
  display: none !important;
}

.mega-menu-content-col {
  flex-basis: 55%;
  background: var(--bg);
  padding: 40px 20px 60px 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  box-sizing: border-box;
}

.mega-menu-content-grid {
  display: flex;
  gap: 20px;
  width: 100%;
}
.mega-menu-main-nav,
.mega-menu-secondary-info {
  display: flex;
  flex-direction: column;
}
.mega-menu-main-nav {
  flex-basis: 65%;
  justify-content: flex-start;
}
.mega-menu-secondary-info {
  flex-basis: 35%;
  justify-content: space-between;
}

.spacer-40 {
  height: 60px;
}

#custom-mega-menu .mega-menu-main-nav nav.secondary-nav {
  margin-top: 60px;
}
.spacer-20 {
  height: 20px;
}

.mega-menu-main-nav nav a {
  display: block;
  text-decoration: none;
  font-family: var(--f-serif);
  font-weight: 500;
  font-size: 64px;
  color: var(--white);
  line-height: 1.2;
  margin-bottom: 10px;
  transition: opacity .3s ease;
}
.mega-menu-main-nav nav.secondary-nav a {
  font-size: 48px;
}
.mega-menu-main-nav nav a:hover {
  opacity: .7;
}

.mega-menu-secondary-info p {
  margin: 0 0 10px 0;
}
.services-list p {
  font-family: var(--f-serif);
  font-weight: 400;
  font-style: italic;
  font-size: 24px;
  color: var(--white);
  margin-top: 10px;
}
.contact-details p {
  font-family: var(--f-serif);
  font-weight: 400;
  font-size: 16px;
  color: var(--white);
  line-height: 1.5;
}

/* SHOP disabled + badge */
#custom-mega-menu .mega-menu-main-nav nav a.shop-disabled {
  display: inline-flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  line-height: 1 !important;
  pointer-events: none !important;
  cursor: default !important;
  text-decoration: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
}
#custom-mega-menu .mega-menu-main-nav nav a.shop-disabled::before {
  content: "COMING SOON";
  order: -1;
  margin-bottom: 0.25em;
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: var(--track-meta);
  text-transform: uppercase;
  white-space: nowrap;
  padding: 2px 6px;
  background: var(--accent);
  color: var(--white);
  border-radius: 0;
}

/* Responsive mega menu */
@media (max-width: 921px) {
  .mega-menu-image-col {
    flex-basis: 38%;
    position: relative;
    overflow: hidden;
    align-self: stretch;
  }
  .mega-menu-content-col {
    flex-basis: 62%;
    padding: 50px 20px 72px 24px;
  }
  .mega-menu-content-grid {
    flex-direction: column;
  }
  .mega-menu-main-nav {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
  }
  .mega-menu-secondary-info {
    display: block;
    justify-content: initial;
  }
  .mega-menu-secondary-info {
    margin-top: 40px;
  }
}

/* Fix #1 + #2 — font size e padding su mobile */
@media (max-width: 768px) {
  .mega-menu-main-nav nav a {
    font-size: 42px;
    margin-bottom: 6px;
  }
  .mega-menu-main-nav nav.secondary-nav a {
    font-size: 30px;
  }
  .mega-menu-content-col {
    padding: 40px 20px 64px 24px;
  }
  .mega-menu-secondary-info {
    margin-top: 24px;
    padding-right: 10px;
    box-sizing: border-box;
  }
  .services-list p {
    font-size: 18px;
  }
  /* Nasconde il vecchio ::after "Italy" dal DB */
  .mega-menu-content-col::after {
    display: none !important;
  }
}


/* Reset header buttons */
#custom-sticky-header button,
#custom-sticky-header .custom-hamburger,
.bg-mobile-nav__burger {
  -webkit-appearance: none;
  appearance: none;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none !important;
  -webkit-tap-highlight-color: transparent;
}
#custom-sticky-header button::before,
#custom-sticky-header button::after,
#custom-sticky-header .custom-hamburger::before,
#custom-sticky-header .custom-hamburger::after,
.bg-mobile-nav__burger::before,
.bg-mobile-nav__burger::after {
  content: none !important;
}

/* =========================================
   HOME/FRONT-PAGE — Project Carousel (HPS)
   ========================================= */
body.home .hps,
body.front-page .hps {
  --gap: 20px;
  --card-w: 299px;
  --img-h: 445px;
  margin: 0 auto;
  max-width: 1440px;
  position: relative;
}

body.home .hps-track,
body.front-page .hps-track {
  display: flex;
  gap: var(--gap);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  padding: 0 4px 12px;
  cursor: grab;
  overscroll-behavior-x: contain;
  -webkit-user-select: none;
  user-select: none;
  touch-action: pan-x;
  scrollbar-width: thin;
  scrollbar-color: #333 transparent;
}
body.home .hps-track::-webkit-scrollbar,
body.front-page .hps-track::-webkit-scrollbar {
  height: 8px;
}
body.home .hps-track::-webkit-scrollbar-thumb,
body.front-page .hps-track::-webkit-scrollbar-thumb {
  background: #333;
  border-radius: 20px;
}
body.home .hps-track::-webkit-scrollbar-track,
body.front-page .hps-track::-webkit-scrollbar-track {
  background: transparent;
}
body.home .hps-track.is-dragging,
body.front-page .hps-track.is-dragging {
  scroll-snap-type: none;
  cursor: grabbing;
}

body.home .hps-card,
body.front-page .hps-card {
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  min-width: var(--card-w);
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
body.home .hps-figure,
body.front-page .hps-figure {
  width: var(--card-w);
  height: var(--img-h);
  border-radius: 5px;
  overflow: hidden;
  background: var(--bg);
}
body.home .hps-figure img,
body.front-page .hps-figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  -webkit-user-drag: none;
}
body.home .hps-title,
body.front-page .hps-title {
  width: var(--card-w);
  margin-top: 20px;
  color: var(--white);
  font-family: var(--f-serif);
  font-size: 32px;
  font-weight: 500;
  line-height: 36px;
  letter-spacing: -1.6px;
}

/* Mobile HPS */
@media (max-width: 640px) {
  body.home .hps .hps-card,
  body.front-page .hps .hps-card {
    flex: 0 0 var(--hps-w, 296px) !important;
    width: var(--hps-w, 296px) !important;
    min-width: var(--hps-w, 296px) !important;
    max-width: var(--hps-w, 296px) !important;
    scroll-snap-align: center !important;
  }
  body.home .hps .hps-figure,
  body.front-page .hps .hps-figure {
    width: var(--hps-w, 296px) !important;
    height: var(--hps-h, 444px) !important;
    border-radius: 6px;
    background: var(--bg);
  }
  body.home .hps .hps-title,
  body.front-page .hps .hps-title {
    width: var(--hps-w, 296px) !important;
    font-size: clamp(22px, 5.2vw, 28px);
    line-height: 1.2;
    margin-top: 14px;
  }
  body.home .hps-track,
  body.front-page .hps-track {
    scroll-snap-stop: always;
    scroll-padding-left: calc((100vw - var(--hps-w, 296px)) / 2);
    scroll-padding-right: calc((100vw - var(--hps-w, 296px)) / 2);
  }
}

/* =========================================
   PROJECT GRID
   ========================================= */
.hps-grid {
  --gap: 5px;
  --ratio: 1 / 1;
  --radius: 5px;
  --cols: 4;
  --cols-md: 3;
  --cols-sm: 2;
  display: grid;
  grid-template-columns: repeat(var(--cols), 1fr);
  gap: var(--gap);
  padding: 0;
  max-width: 1440px;
  margin: 0 auto;
  box-sizing: border-box;
}
@media (max-width: 1024px) {
  .hps-grid {
    grid-template-columns: repeat(var(--cols-md), 1fr);
  }
}
@media (max-width: 640px) {
  .hps-grid {
    grid-template-columns: repeat(var(--cols-sm), 1fr);
  }
}

.hpsg-card {
  display: block;
  text-decoration: none;
  color: inherit;
}
.hpsg-figure {
  width: 100%;
  aspect-ratio: var(--ratio);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--bg);
}
.hpsg-figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hpsg-title {
  margin-top: 6px;
  font-family: var(--f-serif);
  font-weight: 500;
  font-size: 18px;
  line-height: 1.2;
  color: var(--white);
}

/* Full-bleed helper */
.hps-grid--full.alignfull {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  box-sizing: border-box;
}

/* =========================================
   SINGLE PAGES — Dark theme + typography
   ========================================= */
body.single,
body.single-post,
body.single-portfolio,
body.single-project,
body.single-progetti {
  background: var(--bg);
  color: var(--white);
}
body.single h1, body.single h2, body.single h3, body.single h4, body.single h5, body.single h6 {
  color: var(--white);
}
body.single p, body.single li, body.single figcaption {
  color: #e9e9e9;
}

/* Content links */
body.single .entry-content a {
  color: var(--accent, #f1c24b);
}
body.single .entry-content a:hover {
  color: var(--accent, #f1c24b);
  opacity: .85;
}

/* Header styling */
body.single #masthead,
body.single .site-header {
  background: transparent;
  color: var(--white);
}
body.single .site-header a {
  color: var(--white);
}

/* Content centering */
body.single .entry-content {
  max-width: 1200px;
  margin-inline: auto;
}

/* Remove background boxes */
body.single article,
body.single .site-main,
body.single .content-area,
body.single .post-inner,
body.single .entry-header,
body.single .entry-content,
body.single .wp-block-group.has-background,
body.single .wp-block-group[style*="background"],
body.single [class*="card"],
body.single .container,
body.single .section,
body.single .wrap {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Remove white backgrounds
   NB: i 4 selettori [style*="..."] cercano stringhe LETTERALI nell'HTML
   (blocchi Gutenberg con colore inline). I valori #fff vanno tenuti
   hardcoded — sostituirli con var(--white) romperebbe il match. */
body.single [style*="background:#fff"],
body.single [style*="background: #fff"],
body.single [style*="background-color:#fff"],
body.single [style*="background-color: #fff"],
body.single [style*="rgb(255, 255, 255)"] {
  background: transparent !important;
}

/* Typography components */
body.single hr,
body.single .wp-block-separator {
  border-color: rgba(255,255,255,.2) !important;
}
body.single table {
  color: var(--white);
  border-color: rgba(255,255,255,.2);
}
body.single code, body.single pre {
  background: var(--bg-elev-1);
  color: var(--white);
}
body.single blockquote {
  color: var(--white);
  border-left: 4px solid rgba(255,255,255,.25);
}
body.single figcaption {
  font-size: .9rem;
  color: rgba(255,255,255,.65);
}

/* Hero image */
body.single .wp-block-cover:first-of-type {
  margin: 0 auto 60px;
  width: 100%;
  min-height: 70vh;
}
body.single .wp-block-cover:first-of-type .wp-block-cover__image-background,
body.single .wp-block-cover:first-of-type img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body.single .wp-block-post-featured-image {
  margin: 0 auto 60px;
  max-width: none;
}
body.single .wp-block-post-featured-image img {
  display: block;
  width: 100%;
  height: 70vh;
  object-fit: cover;
}

/* Hide Astra entry-header (title + meta) on progetto — Elementor title handles it */
.single-progetto .entry-header {
  display: none !important;
}

/* Hide post meta */
.single-progetto .wp-block-post-author,
.single-progetto .wp-block-post-date,
.single-progetto .wp-block-post-terms,
.single-progetto .entry-meta,
.single-progetto .post-meta,
.single-progetto .byline,
.single-progetto .posted-on,
.single-progetto .tax-links,
.single-progetto .ast-post-meta,
.single-project .wp-block-post-author,
.single-project .wp-block-post-date,
.single-project .wp-block-post-terms,
.single-project .entry-meta,
.single-project .post-meta,
.single-project .byline,
.single-project .posted-on,
.single-project .tax-links,
.single-project .ast-post-meta,
.single-portfolio .wp-block-post-author,
.single-portfolio .wp-block-post-date,
.single-portfolio .wp-block-post-terms,
.single-portfolio .entry-meta,
.single-portfolio .post-meta,
.single-portfolio .byline,
.single-portfolio .posted-on,
.single-portfolio .tax-links,
.single-portfolio .ast-post-meta {
  display: none !important;
}

/* =========================================
   MENU COLORS
   ========================================= */
#masthead a,
#masthead .menu a,
#masthead .main-header-menu a,
#masthead #custom-mega-menu a,
#custom-mega-menu a {
  color: var(--white) !important;
  opacity: 1 !important;
  transition: color var(--dur-s) var(--ease-out);
}
/* Hover rosso solo nel menu */
#custom-mega-menu a:hover,
.mega-menu-main-nav nav a:hover {
  color: #F4421E !important;
  opacity: 1 !important;
}


/* Indicatore pagina corrente — stellina sotto voce attiva */
#masthead .main-navigation .current-menu-item > a,
#masthead .main-navigation .current-menu-ancestor > a {
  position: relative;
}
#masthead .main-navigation .current-menu-item > a::after,
#masthead .main-navigation .current-menu-ancestor > a::after,
#masthead .main-navigation .menu-item > a:hover::after {
  content: '';
  position: absolute;
  bottom: -16px;
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 12px;
  background: var(--text);
  clip-path: polygon(50% 0%, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0% 50%, 38% 38%);
  opacity: 0;
  transition: opacity var(--dur-s) var(--ease-out);
}
#masthead .main-navigation .current-menu-item > a::after,
#masthead .main-navigation .current-menu-ancestor > a::after {
  opacity: 1;
}
#masthead .main-navigation .menu-item > a:hover::after {
  opacity: 1;
}

/* =========================================
   MOBILE LAYOUT — Edge padding
   ========================================= */
@media (max-width: 767.98px) {
  body.home, body.front-page {
    --edge: max(12px, 2.5vw);
  }

  /* Apply padding to specific content blocks (exclude full-width containers) */
  body.home .wp-block-paragraph:not(.alignfull):not([class*="full"]),
  body.front-page .wp-block-paragraph:not(.alignfull):not([class*="full"]),
  body.home .wp-block-heading:not(.alignfull):not([class*="full"]),
  body.front-page .wp-block-heading:not(.alignfull):not([class*="full"]),
  body.home .wp-block-list:not(.alignfull):not([class*="full"]),
  body.front-page .wp-block-list:not(.alignfull):not([class*="full"]),
  body.home .wp-block-quote:not(.alignfull):not([class*="full"]),
  body.front-page .wp-block-quote:not(.alignfull):not([class*="full"]),
  body.home .wp-block-image:not(.alignfull):not([class*="full"]),
  body.front-page .wp-block-image:not(.alignfull):not([class*="full"]) {
    padding-left: var(--edge) !important;
    padding-right: var(--edge) !important;
    box-sizing: border-box;
  }

  /* Esclude esplicitamente elementi che devono rimanere full-width */
  body.home .hps,
  body.front-page .hps,
  body.home .hps *,
  body.front-page .hps *,
  body.home [class*="hero"],
  body.front-page [class*="hero"],
  body.home [class*="slider"],
  body.front-page [class*="slider"],
  body.home .alignfull,
  body.front-page .alignfull {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Reset container margins */
  body.home .row,
  body.front-page .row,
  body.home .wp-block-columns,
  body.front-page .wp-block-columns {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Reset container padding */
  body.home .container,
  body.front-page .container,
  body.home .container-fluid,
  body.front-page .container-fluid,
  body.home .ast-container,
  body.front-page .ast-container,
  body.home .ct-container,
  body.front-page .ct-container,
  body.home .grid-container,
  body.front-page .grid-container,
  body.home .wp-block-group__inner-container,
  body.front-page .wp-block-group__inner-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* Full-width elements */
  body.home .alignfull,
  body.front-page .alignfull,
  body.home .wp-block-cover,
  body.front-page .wp-block-cover,
  body.home .full-bleed,
  body.front-page .full-bleed,
  body.home .hero,
  body.front-page .hero,
  body.home .slider,
  body.front-page .slider {
    margin-left: calc(-1 * var(--edge)) !important;
    margin-right: calc(-1 * var(--edge)) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* HPS stays centered */
  body.home .hps,
  body.front-page .hps {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Columns responsive */
  body.home .wp-block-column,
  body.front-page .wp-block-column {
    min-width: 0 !important;
  }

  /* Hero image mobile spacing */
  body.single .wp-block-cover:first-of-type,
  body.single .wp-block-post-featured-image {
    margin-top: var(--header-h, 80px);
  }
}

/* =========================================
   SERVICES GRID — Responsive layout
   ========================================= */
@media (min-width: 768px) {
  body.home .services-grid,
  body.front-page .services-grid,
  body.home .wp-block-columns.services,
  body.front-page .wp-block-columns.services {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
}
@media (min-width: 1024px) {
  body.home .services-grid,
  body.front-page .services-grid,
  body.home .wp-block-columns.services,
  body.front-page .wp-block-columns.services {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
/* ======= HPS — Hot-fix mobile ======= */

/* 1) Impedisci lo scroll orizzontale della pagina */
html { overflow-y: scroll; scrollbar-gutter: stable; }
body { overflow-x: hidden; }

/* 2) Variabili e layout mobile (≤ 768px) */
@media (max-width: 768px){
  .hps{
    /* card a tutta larghezza con margini laterali */
    --gap: 15px;
    --left-pad: 15px;
    --card-w: calc(100vw - (var(--left-pad) * 2));
    --img-h: auto;
    padding: 0 var(--left-pad);
  }

  /* Track: niente “sbordi” */
  .hps-track{
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    padding: 0 0 14px 0;
    margin: 0;
    /* eliminare eventuali larghezze intrinseche anomale */
    min-width: 0;
  }

  /* Ogni slide occupa tutta la larghezza utile */
  .hps-slide,
  .hps-card{
    flex: 0 0 var(--card-w);
    width: var(--card-w);
    scroll-snap-align: center;
  }

  /* Le immagini non devono mai allargare il track */
  .hps-card img{
    display:block;
    width:100%;
    height:auto;
    max-width:100%;
  }

  /* Evita padding/translate che causano “traslazione” della pagina */
  .hps-track > *{ transform:none !important; }
}

/* 3) In ogni caso, elementi del carosello non devono forzare larghezze */
.hps, .hps *{ box-sizing: border-box; }
.hps-track{ width:100%; max-width:100%; }

/* =========================================
   MOBILE NAVBAR — solo viewport < 769px
   ========================================= */

/* Nascosta su desktop */
#bg-mobile-nav {
  display: none;
}

@media (max-width: 768px) {

  /* Fix #3 — offset body per navbar fixed (esclusa home: hero già full-viewport) */
  body:not(.home) #page {
    padding-top: 60px;
  }

  /* Nasconde tutti gli header desktop/Astra su mobile */
  #custom-sticky-header,
  #masthead {
    display: none !important;
  }

  /* Navbar mobile — fixed in cima */
  #bg-mobile-nav {
    display: flex;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    padding: 28px 0 16px;
    box-sizing: border-box;
    background: transparent;
    pointer-events: none;
  }

  /* Logo — sinistra, bianco */
  .bg-mobile-nav__logo {
    display: block;
    pointer-events: auto;
    margin-left: 20px;
  }
  .bg-mobile-nav__logo img {
    display: block;
    width: 150px;
    height: auto;
    filter: brightness(0) invert(1);
  }

  /* Burger — destra, bianco, nessuna animazione */
  .bg-mobile-nav__burger {
    display: flex;
    background: transparent;
    border: none;
    padding: 0px;
    cursor: pointer;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
    margin-left: auto;
    margin-right: 20px;
  }
  .bg-mobile-nav__burger .hamburger-svg rect {
    fill: var(--text);
  }

  #bg-mobile-nav {
    transition: background var(--dur-sm) var(--ease-out), z-index 0s .5s;
  }
  body.mega-menu-is-active #bg-mobile-nav {
    z-index: 10001;
    transition-delay: 0s;
  }

  /* Scrolled: sfondo nero opaco dopo la hero */
  #bg-mobile-nav.bg-mobile-nav--scrolled {
    background: var(--bg);
    pointer-events: auto;
  }
}

/* Desktop — burger visibile sopra il mega menu */
body.mega-menu-is-active #custom-sticky-header {
  z-index: 10001;
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}
body.mega-menu-is-active #custom-sticky-header .burger-wrapper {
  pointer-events: auto;
}

/* ============================================================
   FOOTER — rimosso 2026-05-19
   Footer ora è PHP custom (inc/footer-section.php) con CSS scoped
   in assets/css/footer.css. Tutte le regole .site-above-footer-wrap,
   .site-primary-footer-wrap, .site-below-footer-wrap e
   .ast-footer-copyright qui esistenti erano override del Footer
   Builder Astra ora disattivato.
   ============================================================ */

@media (max-width: 921px) {
  .single .post-navigation a p {
    display: inline-flex;
  }
  .wp-block-uagb-container.uagb-is-root-container .uagb-block-56805377 {
    max-width: 100%;
    width: 55% !important;
  }
  .wp-block-uagb-container.uagb-is-root-container .uagb-block-91a01daf {
    max-width: 100%;
    width: 55% !important;
  }
}

/* =========================================
   STICKY HEADER — Admin bar / piccoli schermi
   ========================================= */
.logged-in #custom-sticky-header {
  transform: translateY(32px) !important;
}
@media (max-width: 550px) {
  #custom-sticky-header {
    transform: translateX(400%) !important;
    opacity: 1 !important;
    width: 20%;
  }
}

/* =========================================
   MEGA MENU — Pulsante close
   ========================================= */
.mega-menu-close {
  padding: 0;
}
button.mega-menu-close {
  background-color: transparent !important;
}
.logged-in #custom-mega-menu .mega-menu-close {
  top: 32px !important;
}
@media (min-width: 922px) {
  #custom-mega-menu .mega-menu-close {
    position: absolute;
    top: 0 !important;
    right: 12px;
    font-size: 48px;
    color: #888;
    padding: 0;
  }
}
@media (max-width: 921px) and (min-width: 300px) {
  #custom-mega-menu .mega-menu-close {
    position: fixed !important;
    top: -9px;
    right: 5px !important;
    font-size: 48px;
    padding: 15px;
    left: unset !important;
  }
}

/* =========================================
   MEGA MENU — Allineamento desktop
   ========================================= */
#custom-mega-menu .elementor-container {
  display: flex;
  align-items: flex-start;
}
#custom-mega-menu .elementor-column {
  margin-top: 0 !important;
}
#custom-mega-menu .mega-menu-secondary-info .info-top-section {
  margin-top: 10px !important;
  padding-top: 0 !important;
}
#custom-mega-menu .mega-menu-main-nav nav a {
  transition: color var(--dur-s) var(--ease-out), background-color var(--dur-s) var(--ease-out) !important;
}
@media (max-width: 767px) {
  #custom-mega-menu .mega-menu-secondary-info .info-top-section {
    margin-top: 0 !important;
  }
  /* L'immagine parte sotto il logo (banda nera voluta). Si accorcia invece di
     sforare: con height:100% + min-height:100vh sporgeva di 150px oltre il
     fondo della colonna e overflow:hidden ne tagliava via il 18% inferiore,
     irrecuperabile perché in verticale object-fit:cover non lascia margine. */
  .mega-menu-bg-image {
    margin-top: 150px !important;
    height: calc(100% - 150px) !important;
    min-height: 0 !important;
  }
  #custom-mega-menu .mega-menu-main-nav nav a {
    transition: none !important;
  }
  .mega-menu-site-logo {
    display: block !important;
    position: fixed !important;
    top: 21px !important;
    left: 20px !important;
    z-index: 9999 !important;
    max-width: 150px !important;
  }
  .mega-menu-site-logo img {
    width: 100% !important;
    height: auto !important;
  }
  body.admin-bar .mega-menu-site-logo {
    top: 55px !important;
  }
}

/* =========================================
   HPS — Override layout / force
   ========================================= */
body.home,
body.front-page {
  --edge: max(0vw) !important;
}
.hps.hps-force .hps-track {
  padding-right: 8px !important;
}
section.hps.hps-force {
  --hps-w: 100% !important;
}
body.home .hps .hps-figure,
body.front-page .hps .hps-figure {
  border-radius: 0 !important;
}
.hps-card img,
.hps-card figure {
  border-radius: 0 !important;
}

/* Tablet HPS (769px–1440px) */
@media screen and (min-width: 769px) and (max-width: 1440px) {
  body.home .hps-track,
  body.front-page .hps-track {
    gap: 290px !important;
  }
  .hps-track {
    grid-auto-columns: calc(4% - 20px) !important;
  }
  .ast-plain-container.ast-no-sidebar .entry-content > .alignfull,
  .ast-page-builder-template .ast-no-sidebar .entry-content > .alignfull {
    max-width: 1440px;
    width: 1440px !important;
  }
}

/* =========================================
   CAROUSEL — Static (BDT Element Pack)
   ========================================= */
.bdt-ep-static-carousel-title a {
  color: var(--white);
  text-decoration: none !important;
}
.caro-track {
  align-items: center !important;
}
.caro-slide div {
  height: 100% !important;
}
.bdt-ep-static-carousel-readmore-wrap {
  display: flex;
  justify-content: flex-end;
}

/* Swiper scrollbar — nascosto forzato */
#bdt-static-carousel-e730cc3,
.elementor-element-e730cc3,
.elementor-element-e730cc3 .bdt-static-carousel {
  overflow: hidden !important;
}
#bdt-static-carousel-e730cc3 .swiper-scrollbar,
#bdt-static-carousel-e730cc3 .swiper-scrollbar-drag,
.elementor-element-e730cc3 .swiper-scrollbar,
.elementor-element-e730cc3 .swiper-scrollbar-drag {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
  transform: none !important;
  transition: none !important;
}

/* =========================================
   POST NAVIGATION
   ========================================= */
.single .post-navigation a {
  color: var(--white);
}
.single .post-navigation a .ast-post-nav {
  color: var(--white);
  display: none;
}
.single .post-navigation a p {
  font-size: 48px;
  line-height: 56px;
  font-weight: 500;
}
@media (max-width: 769px) {
  .single .post-navigation a p {
    font-size: 24px !important;
    line-height: 26px;
    font-weight: 500;
  }
  .single .post-navigation .nav-links {
    display: inline-flex;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

/* =========================================
   HAMBURGER LINE (legacy)
   ========================================= */
.hamburger-line {
  width: 24px;
  height: 2px;
  background-color: var(--white);
  transform-origin: center;
  border-radius: 2px;
  transition: transform .3s ease, opacity .3s ease;
  outline: 1px solid #b9b9b9;
}
#custom-sticky-header .custom-sticky-container .custom-hamburger .hamburger-line {
  outline: unset !important;
}

/* =========================================
   TOC — Table of Contents (UAGB)
   ========================================= */
.uagb-block-193fb94a .uagb-toc__wrap {
  background: var(--bg) !important;
  padding: 0 !important;
}
.uagb-block-193fb94a .uagb-toc__list-wrap li a {
  color: #e9e9e9;
}

/* =========================================
   TEAM
   ========================================= */
.uagb-block-e78e1dfc .uagb-team__prefix {
  font-family: var(--f-sans);
  font-weight: 300;
  font-size: 23px;
  color: var(--white);
}

/* =========================================
   UAGB — Override blocchi specifici
   ========================================= */
.wp-block-uagb-container.uagb-block-191add67.wp-block-uagb-container * {
  color: var(--white) !important;
}
@media only screen and (max-width: 767px) {
  .wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-c96ca233 > .uagb-container-inner-blocks-wrap {
    --inner-content-custom-width: min(100%, 100%);
    max-width: var(--inner-content-custom-width);
    width: 100%;
    align-items: center;
    flex-wrap: wrap;
    padding: 10px;
  }
}

/* =========================================
   LOGO — Transparent header (piccoli schermi)
   ========================================= */
@media (max-width: 543px) {
  .ast-theme-transparent-header #masthead .site-logo-img .transparent-custom-logo img {
    max-width: 150px;
    width: 150px;
    z-index: 9999 !important;
  }
  .ast-theme-transparent-header #masthead .site-logo-img .transparent-custom-logo .astra-logo-svg {
    width: 150px !important;
  }
  .wp-block-uagb-container.uagb-block-a9d0c052.wp-block-uagb-container {
    color: #f9f9f9 !important;
  }
}
@media (max-width: 544px) {
  .ast-theme-transparent-header #masthead .site-logo-img .transparent-custom-logo img {
    max-width: 180px;
    width: 180px;
  }
}

/* =========================================
   PAGE-SPECIFIC — Logo invertito (mobile)
   ========================================= */
@media (max-width: 767px) {
  body.page-id-211 header .custom-logo {
    filter: invert(1);
  }
  body.page-id-211 header .hamburger-line {
    width: 24px;
    height: 2px;
    background-color: var(--bg);
    transform-origin: center;
    border-radius: 2px;
    transition: transform .3s ease, opacity .3s ease;
  }
  body.page-id-191 header .custom-logo,
  body.page-id-1007 header .custom-logo,
  body.page-id-1143 header .custom-logo,
  body.page-id-1159 header .custom-logo,
  body.page-id-1155 header .custom-logo,
  body.page-id-1151 header .custom-logo,
  body.page-id-1147 header .custom-logo {
    filter: invert(1);
  }
  body.page-id-191 header .hamburger-line {
    width: 24px;
    height: 2px;
    background-color: var(--bg);
    transform-origin: center;
    border-radius: 2px;
    transition: transform .3s ease, opacity .3s ease;
  }
  .page-id-1155 h1.entry-title,
  .page-id-1159 h1.entry-title {
    display: none;
  }
  .page-id-682 .ast-article-single h4.elementor-heading-title.elementor-size-default span {
    color: white !important;
  }
}

/* =========================================
   ACCORDION — EAEL Advanced
   ========================================= */
svg.fa-toggle.e-font-icon-svg.e-fas-plus {
  width: 40px !important;
}
.eael-adv-accordion .eael-accordion-list .eael-accordion-header.active .fa-toggle {
  -webkit-transform: rotate(225deg) !important;
  -ms-transform: rotate(225deg) !important;
  transform: rotate(225deg) !important;
}

/* =========================================
   SERVICE BUTTONS
   ========================================= */
.service-btn-border .wp-block-uagb-buttons .uagb-buttons-repeater {
  border: 2px solid !important;
}

/* =========================================
   UTILITY
   ========================================= */
.pc-none a {
  pointer-events: none;
  cursor: none;
}

/* =========================================
   BIO + CONTATTI — reset Gutenberg
   ========================================= */

/* Override hero.css — rimuove padding/max-width/margin-auto su .bg-page-content */
body.bg-bio-page .bg-page-content,
body.bg-contatti-page .bg-page-content {
  padding: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* Reset Astra — rimuove max-width e padding dal chain di container */
body.bg-bio-page #content .ast-container,
body.bg-bio-page #content,
body.bg-bio-page .site-content,
body.bg-bio-page #primary,
body.bg-bio-page #main,
body.bg-bio-page .site-main,
body.bg-bio-page .entry-content,
body.bg-contatti-page #content .ast-container,
body.bg-contatti-page #content,
body.bg-contatti-page .site-content,
body.bg-contatti-page #primary,
body.bg-contatti-page #main,
body.bg-contatti-page .site-main,
body.bg-contatti-page .entry-content {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Home: azzera il cap di larghezza di Astra (Container Width ~1200px) sulla
   catena container, così le .bg-home-section raggiungono il loro --max-width
   (1280px, o 1440px sopra 1680px — vedi home-sections.css). Solo asse
   orizzontale: padding/margin verticali e resto del layout Astra intatti. */
body.home #content .ast-container,
body.front-page #content .ast-container,
body.home #content,
body.front-page #content,
body.home .site-content,
body.front-page .site-content,
body.home #primary,
body.front-page #primary,
body.home #main,
body.front-page #main,
body.home .site-main,
body.front-page .site-main {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Reset padding verticale site-main */
body.bg-bio-page .site-main,
body.bg-contatti-page .site-main {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Reset block-gap automatico Gutenberg */
body.bg-bio-page .entry-content > * + *,
body.bg-contatti-page .entry-content > * + * {
  margin-block-start: 0 !important;
}

/* Reset wrapper shortcode Gutenberg */
body.bg-bio-page .wp-block-shortcode,
body.bg-contatti-page .wp-block-shortcode {
  margin: 0 !important;
  padding: 0 !important;
}

/* Paragrafi vuoti nascosti */
body.bg-bio-page .site-main > p:empty,
body.bg-contatti-page .site-main > p:empty {
  display: none !important;
}