/* menu-system-final-912: regola unica condivisa per desktop/mobile */
/* Menu finale unico: desktop da 913px, mobile/tablet fino a 912px. */
@media (min-width: 913px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    height: 82px !important;
    min-height: 82px !important;
    padding: 0 42px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 42px !important;
    background: rgba(0, 0, 3, 0.98) !important;
    border: 0 !important;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.34) !important;
    backdrop-filter: blur(18px) saturate(1.08) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
    transform: none !important;
  }

  body > nav::before,
  body > nav::after,
  #page-wrap > nav::before,
  #page-wrap > nav::after,
  nav.site-nav::before,
  nav.site-nav::after,
  nav.topbar::before,
  nav.topbar::after,
  header.topbar::before,
  header.topbar::after {
    display: none !important;
    content: none !important;
  }

  header.topbar .brand-block {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 42px !important;
    width: 100% !important;
    height: 82px !important;
    min-height: 82px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body > nav .nav-symbol-link,
  #page-wrap > nav .nav-symbol-link,
  nav.site-nav .nav-symbol-link,
  nav.topbar .brand-symbol-link,
  header.topbar .brand-home {
    display: flex !important;
    position: static !important;
    flex: 0 0 255px !important;
    width: 255px !important;
    min-width: 255px !important;
    max-width: 255px !important;
    max-height: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    line-height: 0 !important;
  }

  body > nav .nav-symbol-link img,
  #page-wrap > nav .nav-symbol-link img,
  body > nav .nav-symbol,
  #page-wrap > nav .nav-symbol,
  nav.site-nav .nav-symbol-link img,
  nav.site-nav .nav-symbol,
  nav.topbar .brand-symbol-link img,
  header.topbar .brand-home img {
    content: url("logo_studio_six_header.png") !important;
    display: block !important;
    width: 255px !important;
    max-width: 255px !important;
    min-width: 255px !important;
    height: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  body > nav .nav-links,
  #page-wrap > nav .nav-links,
  nav.site-nav .nav-links,
  nav.topbar .nav-links,
  header.topbar .project-nav {
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 28px !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    position: static !important;
    list-style: none !important;
    transform: none !important;
  }

  body > nav .nav-links li,
  #page-wrap > nav .nav-links li {
    display: flex !important;
  }

  body > nav .nav-links a,
  body > nav .nav-links a.nav-midjourney,
  #page-wrap > nav .nav-links a,
  #page-wrap > nav .nav-links a.nav-midjourney,
  nav.site-nav .nav-links a,
  nav.site-nav .nav-links a.nav-midjourney,
  nav.topbar .nav-links a,
  nav.topbar .nav-links a.nav-midjourney,
  header.topbar .project-nav a,
  header.topbar .project-nav a.nav-midjourney {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 0 !important;
    padding: 10px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(255, 255, 255, 0.78) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 0.18em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transform: none !important;
    transition: color 180ms ease !important;
  }

  body > nav .nav-links a:hover,
  body > nav .nav-links a.nav-midjourney:hover,
  #page-wrap > nav .nav-links a:hover,
  #page-wrap > nav .nav-links a.nav-midjourney:hover,
  nav.site-nav .nav-links a:hover,
  nav.site-nav .nav-links a.nav-midjourney:hover,
  nav.topbar .nav-links a:hover,
  nav.topbar .nav-links a.nav-midjourney:hover,
  header.topbar .project-nav a:hover,
  header.topbar .project-nav a.nav-midjourney:hover {
    color: #fff !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .nav-heart {
    color: #f037a5 !important;
    margin: 0 0.38em !important;
  }

  .nav-hamburger,
  body > nav .nav-hamburger,
  #page-wrap > nav .nav-hamburger,
  nav.site-nav .nav-hamburger,
  nav.topbar .nav-hamburger,
  header.topbar .nav-hamburger {
    display: none !important;
  }

  .hero > .hero-logo {
    display: none !important;
  }
}

@media (max-width: 912px) {
  html {
    scroll-padding-top: 102px !important;
  }

  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar,
  body.logo-docked > nav,
  body.logo-docked #page-wrap > nav,
  body.logo-docked nav.site-nav,
  body.logo-docked nav.topbar,
  body.logo-docked header.topbar,
  body.mobile-menu-open > nav,
  body.mobile-menu-open #page-wrap > nav,
  body.mobile-menu-open nav.site-nav,
  body.mobile-menu-open nav.topbar,
  body.mobile-menu-open header.topbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 10020 !important;
    width: 100% !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 22px 0 32px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    background: #000000 !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transform: none !important;
  }

  body > nav::before,
  body > nav::after,
  #page-wrap > nav::before,
  #page-wrap > nav::after,
  nav.site-nav::before,
  nav.site-nav::after,
  nav.topbar::before,
  nav.topbar::after,
  header.topbar::before,
  header.topbar::after {
    display: none !important;
    content: none !important;
  }

  header.topbar .brand-block {
    display: contents !important;
  }

  body > nav .nav-links,
  #page-wrap > nav .nav-links,
  nav.site-nav .nav-links,
  nav.topbar .nav-links,
  header.topbar .project-nav {
    display: none !important;
  }

  body > nav .nav-symbol-link,
  #page-wrap > nav .nav-symbol-link,
  nav.site-nav .nav-symbol-link,
  nav.topbar .brand-symbol-link,
  header.topbar .brand-home {
    display: flex !important;
    position: static !important;
    flex: 0 0 255px !important;
    width: 255px !important;
    min-width: 255px !important;
    max-width: 255px !important;
    max-height: none !important;
    margin: 0 auto 0 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    line-height: 0 !important;
  }

  body > nav .nav-symbol-link img,
  #page-wrap > nav .nav-symbol-link img,
  body > nav .nav-symbol,
  #page-wrap > nav .nav-symbol,
  nav.site-nav .nav-symbol-link img,
  nav.site-nav .nav-symbol,
  nav.topbar .brand-symbol-link img,
  header.topbar .brand-home img {
    content: url("logo_studio_six_header.png") !important;
    display: block !important;
    width: 255px !important;
    max-width: 255px !important;
    min-width: 255px !important;
    height: auto !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .nav-hamburger,
  body > nav .nav-hamburger,
  #page-wrap > nav .nav-hamburger,
  nav.site-nav .nav-hamburger,
  nav.topbar .nav-hamburger,
  header.topbar .nav-hamburger {
    display: flex !important;
    position: absolute !important;
    top: 15px !important;
    right: 22px !important;
    left: auto !important;
    transform: none !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: 0 !important;
    z-index: 10030 !important;
  }

  .nav-hamburger span {
    display: block !important;
    width: 24px !important;
    height: 1px !important;
    background: #fff !important;
  }

  body.mobile-menu-open {
    overflow: hidden !important;
  }

  body.mobile-menu-open .nav-drawer,
  .nav-drawer.open {
    display: flex !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 9000 !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(18px, 4vh, 34px) !important;
    padding: 104px 30px 42px !important;
    overflow: hidden !important;
    isolation: isolate !important;
    background: linear-gradient(145deg, #050208 0%, #180026 48%, #09000f 100%) !important;
    counter-reset: none !important;
  }

  body.mobile-menu-open .nav-drawer::before,
  .nav-drawer.open::before {
    content: '' !important;
    display: block !important;
    visibility: visible !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.6 !important;
    background-image:
      linear-gradient(180deg, rgba(42,0,70,0.18), rgba(5,0,12,0.32)),
      url("mobile-menu-portrait.png") !important;
    background-size: cover, cover !important;
    background-position: center center, center center !important;
    background-repeat: no-repeat, no-repeat !important;
    filter: saturate(1.22) contrast(1.05) brightness(0.98) !important;
    mix-blend-mode: normal !important;
    transform: none !important;
  }

  body.mobile-menu-open .nav-drawer::after,
  .nav-drawer.open::after {
    content: '' !important;
    display: block !important;
    visibility: visible !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    border: 0 !important;
    opacity: 1 !important;
    background-image:
      radial-gradient(circle at 70% 18%, rgba(205,246,100,0.34), transparent 42%),
      radial-gradient(circle at 20% 78%, rgba(255,45,140,0.22), transparent 38%),
      linear-gradient(180deg, rgba(7,0,16,0.18), rgba(18,0,34,0.38)),
      url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grain)' opacity='0.46'/%3E%3C/svg%3E") !important;
    background-size: cover, cover, cover, 160px 160px !important;
    background-repeat: no-repeat, no-repeat, no-repeat, repeat !important;
    mix-blend-mode: normal !important;
  }

  body.mobile-menu-open .nav-drawer a,
  .nav-drawer.open a {
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 64px) !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(255,255,255,0.92) !important;
    font-family: var(--serif) !important;
    font-style: italic !important;
    font-weight: 500 !important;
    font-size: clamp(38px, 7.2vw, 76px) !important;
    line-height: 0.96 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-align: left !important;
    text-decoration: none !important;
    transform: none !important;
    text-shadow: 0 0 26px rgba(40,0,70,0.34) !important;
  }

  body.mobile-menu-open .nav-drawer a::before,
  body.mobile-menu-open .nav-drawer a::after,
  .nav-drawer.open a::before,
  .nav-drawer.open a::after {
    display: none !important;
    content: none !important;
  }

  body.mobile-menu-open .nav-drawer a:hover,
  body.mobile-menu-open .nav-drawer a:focus-visible,
  .nav-drawer.open a:hover,
  .nav-drawer.open a:focus-visible {
    color: #fff !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: translateX(6px) !important;
  }

  body.mobile-menu-open .nav-drawer .nav-heart,
  .nav-drawer.open .nav-heart {
    color: #f037a5 !important;
    margin: 0 0.18em !important;
  }

  .hero > .hero-logo {
    display: none !important;
  }
}

@media (max-width: 520px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar,
  body.logo-docked > nav,
  body.logo-docked #page-wrap > nav,
  body.logo-docked nav.site-nav,
  body.logo-docked nav.topbar,
  body.logo-docked header.topbar,
  body.mobile-menu-open > nav,
  body.mobile-menu-open #page-wrap > nav,
  body.mobile-menu-open nav.site-nav,
  body.mobile-menu-open nav.topbar,
  body.mobile-menu-open header.topbar {
    padding-left: 22px !important;
  }

  body > nav .nav-symbol-link,
  #page-wrap > nav .nav-symbol-link,
  nav.site-nav .nav-symbol-link,
  nav.topbar .brand-symbol-link,
  header.topbar .brand-home {
    flex-basis: 220px !important;
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
  }

  body > nav .nav-symbol-link img,
  #page-wrap > nav .nav-symbol-link img,
  body > nav .nav-symbol,
  #page-wrap > nav .nav-symbol,
  nav.site-nav .nav-symbol-link img,
  nav.site-nav .nav-symbol,
  nav.topbar .brand-symbol-link img,
  header.topbar .brand-home img {
    width: 220px !important;
    max-width: 220px !important;
    min-width: 220px !important;
  }

  body.mobile-menu-open .nav-drawer::before,
  .nav-drawer.open::before {
    background-size: cover, cover !important;
    background-position: center center, center center !important;
    opacity: 0.6 !important;
  }
}

/* Hard reset condiviso: quando il mobile menu e' aperto, il drawer e' sempre overlay pieno. */
body.mobile-menu-open .nav-drawer,
body.mobile-menu-open #drawer,
.nav-drawer.open,
#drawer.open {
  display: flex !important;
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  inset: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  min-width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  z-index: 9000 !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(16px, 3.4vh, 30px) !important;
  padding: 104px clamp(24px, 7vw, 72px) 42px !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(145deg, #050208 0%, #180026 48%, #09000f 100%) !important;
  box-shadow: none !important;
  transform: none !important;
  isolation: isolate !important;
}

body.mobile-menu-open .nav-drawer::before,
body.mobile-menu-open #drawer::before,
.nav-drawer.open::before,
#drawer.open::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  opacity: 0.6 !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(180deg, rgba(42,0,70,0.18), rgba(5,0,12,0.32)),
    url("mobile-menu-portrait.png") !important;
  background-size: cover, cover !important;
  background-position: center center, center center !important;
  background-repeat: no-repeat, no-repeat !important;
  filter: saturate(1.22) contrast(1.05) brightness(0.98) !important;
}

body.mobile-menu-open .nav-drawer::after,
body.mobile-menu-open #drawer::after,
.nav-drawer.open::after,
#drawer.open::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background-image:
    radial-gradient(circle at 70% 18%, rgba(205,246,100,0.34), transparent 42%),
    radial-gradient(circle at 20% 78%, rgba(255,45,140,0.22), transparent 38%),
    linear-gradient(180deg, rgba(7,0,16,0.18), rgba(18,0,34,0.38)),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grain)' opacity='0.46'/%3E%3C/svg%3E") !important;
  background-size: cover, cover, cover, 160px 160px !important;
  background-repeat: no-repeat, no-repeat, no-repeat, repeat !important;
}

body.mobile-menu-open .nav-drawer a,
body.mobile-menu-open #drawer a,
.nav-drawer.open a,
#drawer.open a {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: min(760px, calc(100vw - 56px)) !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(255,255,255,0.92) !important;
  font-family: var(--serif) !important;
  font-style: italic !important;
  font-weight: 500 !important;
  font-size: clamp(34px, 7vw, 72px) !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: left !important;
  white-space: normal !important;
  text-decoration: none !important;
  transform: none !important;
}

body.mobile-menu-open .nav-drawer .nav-heart,
body.mobile-menu-open #drawer .nav-heart,
.nav-drawer.open .nav-heart,
#drawer.open .nav-heart {
  color: #f037a5 !important;
  margin: 0 0.18em !important;
}

/* Nuova UI: Scrivimi fucsia, menu invariato. */
@media (min-width: 913px) {
  body > nav .nav-links a[href^="mailto"],
  #page-wrap > nav .nav-links a[href^="mailto"],
  nav.site-nav .nav-links a[href^="mailto"],
  nav.topbar .nav-links a[href^="mailto"],
  header.topbar .project-nav a[href^="mailto"] {
    padding: 10px 18px !important;
    border-radius: 999px !important;
    background: var(--accessible-footer-magenta, #9b004f) !important;
    color: #fff !important;
    font-weight: 800 !important;
    border: 0 !important;
    box-shadow: 0 0 22px rgba(240,55,165,0.34) !important;
  }

  body > nav .nav-links a[href^="mailto"]:hover,
  #page-wrap > nav .nav-links a[href^="mailto"]:hover,
  nav.site-nav .nav-links a[href^="mailto"]:hover,
  nav.topbar .nav-links a[href^="mailto"]:hover,
  header.topbar .project-nav a[href^="mailto"]:hover {
    background: var(--accessible-footer-magenta, #9b004f) !important;
    color: #fff !important;
    filter: brightness(1.08) !important;
  }
}

body.mobile-menu-open .nav-drawer a[href^="mailto"],
body.mobile-menu-open #drawer a[href^="mailto"],
.nav-drawer.open a[href^="mailto"],
#drawer.open a[href^="mailto"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  max-width: min(760px, calc(100vw - 56px)) !important;
  padding: 0.12em 0.42em 0.18em !important;
  border-radius: 999px !important;
  background: var(--accessible-footer-magenta, #9b004f) !important;
  color: #fff !important;
  font-family: var(--sans, Outfit, sans-serif) !important;
  font-style: normal !important;
  font-weight: 800 !important;
  box-shadow: 0 0 32px rgba(240,55,165,0.34) !important;
}


/* Menu desktop: stessa larghezza delle sezioni principali, su tutte le pagine */
@media (min-width: 913px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar {
    width: min(100% - clamp(32px, 9vw, 120px), 1480px) !important;
    max-width: 1480px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}


/* Fix finale: menu 1480 centrato anche nelle pagine dettaglio */
@media (min-width: 913px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar {
    box-sizing: border-box !important;
    width: min(100% - clamp(32px, 9vw, 120px), 1480px) !important;
    max-width: 1480px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  header.topbar .brand-block,
  nav.site-nav > .brand-block,
  nav.topbar > .brand-block {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
}


/* Fix finale home: barra full, contenuto allineato a 1480 */
@media (min-width: 913px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    padding-left: max(calc(clamp(32px, 9vw, 120px) / 2), calc((100vw - 1480px) / 2)) !important;
    padding-right: max(calc(clamp(32px, 9vw, 120px) / 2), calc((100vw - 1480px) / 2)) !important;
  }
}

/* Mobile/tablet: piu altezza per mostrare il logo completo */
@media (max-width: 912px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar,
  body.logo-docked > nav,
  body.logo-docked #page-wrap > nav,
  body.logo-docked nav.site-nav,
  body.logo-docked nav.topbar,
  body.logo-docked header.topbar,
  body.mobile-menu-open > nav,
  body.mobile-menu-open #page-wrap > nav,
  body.mobile-menu-open nav.site-nav,
  body.mobile-menu-open nav.topbar,
  body.mobile-menu-open header.topbar {
    height: 86px !important;
    min-height: 86px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-items: center !important;
  }

  body > nav .nav-symbol-link,
  #page-wrap > nav .nav-symbol-link,
  nav.site-nav .nav-symbol-link,
  nav.topbar .brand-symbol-link,
  header.topbar .brand-home {
    height: 86px !important;
    max-height: 86px !important;
    align-items: center !important;
  }

  .nav-hamburger,
  body > nav .nav-hamburger,
  #page-wrap > nav .nav-hamburger,
  nav.site-nav .nav-hamburger,
  nav.topbar .nav-hamburger,
  header.topbar .nav-hamburger {
    top: 20px !important;
  }
}


/* Mobile/tablet finale: header nero piu alto per logo completo */
@media (max-width: 912px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar,
  body.logo-docked > nav,
  body.logo-docked #page-wrap > nav,
  body.logo-docked nav.site-nav,
  body.logo-docked nav.topbar,
  body.logo-docked header.topbar,
  body.mobile-menu-open > nav,
  body.mobile-menu-open #page-wrap > nav,
  body.mobile-menu-open nav.site-nav,
  body.mobile-menu-open nav.topbar,
  body.mobile-menu-open header.topbar {
    height: 105px !important;
    min-height: 105px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-items: center !important;
    background: #000000 !important;
  }

  body > nav .nav-symbol-link,
  #page-wrap > nav .nav-symbol-link,
  nav.site-nav .nav-symbol-link,
  nav.topbar .brand-symbol-link,
  header.topbar .brand-home {
    height: 105px !important;
    max-height: 105px !important;
    align-items: center !important;
  }

  .nav-hamburger,
  body > nav .nav-hamburger,
  #page-wrap > nav .nav-hamburger,
  nav.site-nav .nav-hamburger,
  nav.topbar .nav-hamburger,
  header.topbar .nav-hamburger {
    top: 29px !important;
  }
}


/* Header definitivo: spazio nero adeguato al logo Studio Six completo */
@media (min-width: 913px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar {
    height: 132px !important;
    min-height: 132px !important;
    background: #000000 !important;
    align-items: center !important;
    overflow: visible !important;
  }
  header.topbar .brand-block {
    height: 132px !important;
    min-height: 132px !important;
    align-items: center !important;
  }
  body > nav .nav-symbol-link,
  #page-wrap > nav .nav-symbol-link,
  nav.site-nav .nav-symbol-link,
  nav.topbar .brand-symbol-link,
  header.topbar .brand-home {
    height: 132px !important;
    max-height: 132px !important;
    align-items: center !important;
  }
  body > nav .nav-symbol-link img,
  #page-wrap > nav .nav-symbol-link img,
  body > nav .nav-symbol,
  #page-wrap > nav .nav-symbol,
  nav.site-nav .nav-symbol-link img,
  nav.site-nav .nav-symbol,
  nav.topbar .brand-symbol-link img,
  header.topbar .brand-home img {
    width: 255px !important;
    max-width: 255px !important;
    min-width: 255px !important;
    height: auto !important;
  }
}
@media (max-width: 912px) {
  body > nav,
  #page-wrap > nav,
  nav.site-nav,
  nav.topbar,
  header.topbar,
  body.logo-docked > nav,
  body.logo-docked #page-wrap > nav,
  body.logo-docked nav.site-nav,
  body.logo-docked nav.topbar,
  body.logo-docked header.topbar,
  body.mobile-menu-open > nav,
  body.mobile-menu-open #page-wrap > nav,
  body.mobile-menu-open nav.site-nav,
  body.mobile-menu-open nav.topbar,
  body.mobile-menu-open header.topbar {
    height: 105px !important;
    min-height: 105px !important;
    background: #000000 !important;
    align-items: center !important;
  }
}


/* Menu mobile globale sotto 912: nero, senza foto, font normale */
@media (max-width: 912px) {
  body.mobile-menu-open .nav-drawer,
  body.mobile-menu-open #drawer,
  .nav-drawer.open,
  #drawer.open {
    background: #000000 !important;
    background-image: none !important;
    background-color: #000000 !important;
  }
  body.mobile-menu-open .nav-drawer::before,
  body.mobile-menu-open #drawer::before,
  .nav-drawer.open::before,
  #drawer.open::before,
  body.mobile-menu-open .nav-drawer::after,
  body.mobile-menu-open #drawer::after,
  .nav-drawer.open::after,
  #drawer.open::after,
  body.mobile-menu-open .drawer-orb,
  body.mobile-menu-open .drawer-logo,
  body.mobile-menu-open .drawer-services,
  .nav-drawer.open .drawer-orb,
  .nav-drawer.open .drawer-logo,
  .nav-drawer.open .drawer-services {
    display: none !important;
    content: none !important;
    background: none !important;
    background-image: none !important;
  }
  body.mobile-menu-open .nav-drawer a,
  body.mobile-menu-open #drawer a,
  .nav-drawer.open a,
  #drawer.open a {
    font-family: var(--serif) !important;
    font-style: normal !important;
    font-weight: 500 !important;
    text-transform: none !important;
  }
}


/* Menu mobile moderno: pulito, nero, leggibile */
@media (max-width: 912px) {
  body.mobile-menu-open .nav-drawer,
  body.mobile-menu-open #drawer,
  .nav-drawer.open,
  #drawer.open {
    display: flex !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    z-index: 9000 !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: clamp(126px, 17vh, 170px) clamp(22px, 6vw, 58px) clamp(32px, 6vh, 58px) !important;
    margin: 0 !important;
    overflow: hidden auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background:
      radial-gradient(circle at 92% 8%, rgba(240,55,165,.18), transparent 34%),
      radial-gradient(circle at 8% 92%, rgba(205,246,100,.08), transparent 30%),
      #000000 !important;
    background-image:
      radial-gradient(circle at 92% 8%, rgba(240,55,165,.18), transparent 34%),
      radial-gradient(circle at 8% 92%, rgba(205,246,100,.08), transparent 30%) !important;
    background-color: #000000 !important;
    box-shadow: none !important;
    isolation: isolate !important;
  }

  body.mobile-menu-open .nav-drawer::before,
  body.mobile-menu-open #drawer::before,
  .nav-drawer.open::before,
  #drawer.open::before,
  body.mobile-menu-open .nav-drawer::after,
  body.mobile-menu-open #drawer::after,
  .nav-drawer.open::after,
  #drawer.open::after,
  body.mobile-menu-open .drawer-orb,
  body.mobile-menu-open .drawer-logo,
  body.mobile-menu-open .drawer-services,
  .nav-drawer.open .drawer-orb,
  .nav-drawer.open .drawer-logo,
  .nav-drawer.open .drawer-services {
    display: none !important;
    content: none !important;
  }

  body.mobile-menu-open .nav-drawer a,
  body.mobile-menu-open #drawer a,
  .nav-drawer.open a,
  #drawer.open a {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: min(100%, 640px) !important;
    min-height: 58px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(255,255,255,.92) !important;
    font-family: var(--serif, 'Playfair Display', Georgia, serif) !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: clamp(25px, 6.2vw, 48px) !important;
    line-height: 1 !important;
    letter-spacing: -.01em !important;
    text-transform: none !important;
    text-align: left !important;
    text-decoration: none !important;
  }

  body.mobile-menu-open .nav-drawer a::before,
  body.mobile-menu-open #drawer a::before,
  .nav-drawer.open a::before,
  #drawer.open a::before {
    content: "" !important;
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    margin-right: 14px !important;
    border-radius: 50% !important;
    background: #f037a5 !important;
    box-shadow: 0 0 16px rgba(240,55,165,.55) !important;
    flex: 0 0 auto !important;
    opacity: .82 !important;
  }

  body.mobile-menu-open .nav-drawer a::after,
  body.mobile-menu-open #drawer a::after,
  .nav-drawer.open a::after,
  #drawer.open a::after {
    content: "→" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    color: #ffffff !important;
    font-family: var(--sans, Outfit, sans-serif) !important;
    font-size: .52em !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    opacity: .95 !important;
  }

  body.mobile-menu-open .nav-drawer .nav-heart,
  body.mobile-menu-open #drawer .nav-heart,
  .nav-drawer.open .nav-heart,
  #drawer.open .nav-heart {
    color: #f037a5 !important;
    margin: 0 .12em !important;
  }

  body.mobile-menu-open .nav-drawer a[href^="mailto"],
  body.mobile-menu-open #drawer a[href^="mailto"],
  .nav-drawer.open a[href^="mailto"],
  #drawer.open a[href^="mailto"] {
    justify-content: center !important;
    width: min(100%, 640px) !important;
    min-height: 52px !important;
    margin-top: 22px !important;
    padding: 0 24px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--accessible-footer-magenta, #9b004f) !important;
    color: #ffffff !important;
    font-family: var(--sans, Outfit, sans-serif) !important;
    font-style: normal !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    box-shadow: 0 16px 42px rgba(240,55,165,.28) !important;
  }

  body.mobile-menu-open .nav-drawer a[href^="mailto"]::before,
  body.mobile-menu-open #drawer a[href^="mailto"]::before,
  .nav-drawer.open a[href^="mailto"]::before,
  #drawer.open a[href^="mailto"]::before {
    display: none !important;
    content: none !important;
  }
  body.mobile-menu-open .nav-drawer a[href^="mailto"]::after,
  body.mobile-menu-open #drawer a[href^="mailto"]::after,
  .nav-drawer.open a[href^="mailto"]::after,
  #drawer.open a[href^="mailto"]::after {
    content: "→" !important;
    margin-left: 12px !important;
    color: #ffffff !important;
    font-size: 1em !important;
  }
}
