:root {
  --theme-bg: #f4f1ec;
  --theme-text: #242231;
  --theme-muted: #777386;
  --theme-accent: #565ec4;
  --theme-surface: #ebe7e1;
  --theme-border: rgba(36,34,49,.12);
  --bg-color: var(--theme-bg);
  --text-color: var(--theme-text);
  --text-muted: var(--theme-muted);
  --primary-color: var(--theme-accent);
  --accent-color: var(--theme-accent);
}

html[data-theme="dark"] {
  --theme-bg: #070709;
  --theme-text: #f3f3f3;
  --theme-muted: #777789;
  --theme-accent: #69e2fd;
  --theme-surface: #121216;
  --theme-border: rgba(255,255,255,.10);
}

body {
  background-color: var(--theme-bg) !important;
  background-image: none !important;
  color: var(--theme-text) !important;
  font-family: var(--theme-font-body, Inter, sans-serif) !important;
  transition: background-color .45s ease, color .45s ease;
}

/* L’immagine di sfondo è riservata alla sola homepage. */
body.home-page {
  position: relative;
  isolation: isolate;
}
body.home-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: var(--theme-background-image, none);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: var(--theme-background-opacity, 1);
  transition: opacity .45s ease, background-image .2s ease;
}
.project-name, .project-logo, .logo, .info-title, .project-intro h1, .viewer-info h2 { font-family: var(--theme-font-display, 'Playfair Display', serif) !important; }
.project-caption, .project-description, .project-nav, .info-content, .info-link { font-family: var(--theme-font-body, Inter, sans-serif) !important; }
.header { background: transparent !important; transition: none; }
.logo, .logo a, h1, h2, h3 { color: var(--theme-text) !important; }
.info-link, .portfolio-link, .project-subtitle, .footer { color: var(--theme-muted) !important; }
.info-link:hover, .portfolio-link:hover, .description a, .info-content a { color: var(--theme-accent) !important; }
.description, .info-content, .bio-text, .exhibitions-text { color: var(--theme-text) !important; }
.project-image, .image-wrapper { border-color: var(--theme-border) !important; }
.subtitle-follower { color: var(--theme-text) !important; background: color-mix(in srgb, var(--theme-bg) 82%, transparent) !important; border-left-color: var(--theme-accent) !important; }
.project-name::after { background-color: var(--theme-accent) !important; }
.project-item:hover .project-name { color: var(--theme-text) !important; }

.theme-actions { display:flex; align-items:center; gap:14px; }
.theme-toggle {
  width: 28px;
  height: 28px;
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--theme-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 21px;
  line-height: 1;
  transition: color .25s ease, transform .35s ease, background-color .25s ease;
}
.theme-toggle:hover { color: var(--theme-accent); background: var(--theme-surface); transform: rotate(18deg); }
.theme-toggle:focus-visible { outline: 1px solid var(--theme-accent); outline-offset: 3px; }

html[data-theme="light"] .project-name { color: color-mix(in srgb, var(--theme-text) 42%, var(--theme-bg)) !important; }
/* v3.0.60 — separatori homepage equilibrati e discreti in entrambi i temi. */
html[data-theme="light"] .project-item {
  border-bottom-color: color-mix(in srgb, var(--theme-text) 6.5%, transparent) !important;
}
html[data-theme="dark"] .project-item {
  border-bottom-color: color-mix(in srgb, var(--theme-text) 5.5%, transparent) !important;
}

html[data-theme="light"] body:not(.home-page)::before { opacity: .22; }
html[data-theme="dark"] body:not(.home-page)::before { opacity: 1; }

.back-follower { background-color: var(--theme-text) !important; color: var(--theme-bg) !important; }
.description strong { color: var(--theme-text) !important; }
.description a:hover, .info-content a:hover { color: var(--theme-text) !important; border-color: var(--theme-accent) !important; }

/* Elenco mostre: colori sempre coerenti con il tema selezionato */
.exhibitions-content,
.exhibitions-content .cv-title,
.exhibitions-content .cv-title strong,
.exhibitions-content .cv-desc {
  color: var(--theme-text) !important;
}

.exhibitions-content .cv-date {
  color: var(--theme-accent) !important;
}

.exhibitions-content .cv-title::before {
  color: var(--theme-muted) !important;
}

/* Homepage: nel tema chiaro le immagini rollover non hanno bordo */
html[data-theme="light"] .cursor-follower .image-wrapper {
  border: none !important;
}

/* v2.2.5 — testata realmente condivisa in tutto il sito */
.header,
.project-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 52px;
  min-height: 52px;
  padding: 14px 18px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  box-sizing: border-box;
  background: transparent !important;
}
.header .logo,
.project-logo {
  margin: 0;
  padding: 0;
  font-family: 'Playfair Display', serif;
  font-size: 17px !important;
  line-height: 1 !important;
  font-weight: 700;
  font-style: italic;
  letter-spacing: -0.5px;
}
.header .nav,
.project-nav {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 0;
  line-height: 1;
}
.header .info-link,
.header .portfolio-link,
.header .adesso-link,
.project-nav a {
  display: inline-flex;
  align-items: flex-start;
  margin: 0;
  padding: 0;
  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: 1.7px !important;
  text-transform: uppercase;
}
.header .theme-toggle,
.project-header .theme-toggle {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: -2px 0 0 0;
  padding: 0 !important;
  font-size: 16px !important;
  line-height: 16px !important;
  align-self: flex-start;
}
.footer,
.project-footer {
  font-size: 10px !important;
  line-height: 1.2 !important;
  letter-spacing: .85px !important;
}
@media (max-width: 800px) {
  .header,
  .project-header {
    height: 46px;
    min-height: 46px;
    padding: 12px 14px;
  }
  .header .logo,
  .project-logo { font-size: 16px !important; }
  .header .info-link,
  .header .portfolio-link,
  .header .adesso-link,
  .project-nav a { font-size: 10px !important; }
  .footer,
  .project-footer { font-size: 9px !important; }
}



/* Colore della selezione del testo, configurabile dal CMS per ogni tema.
   La regola esplicita su tutti gli elementi evita differenze tra pagine,
   campi, titoli, descrizioni e contenuti generati dinamicamente. */
::selection,
*::selection {
  background-color: var(--theme-selection, var(--theme-accent)) !important;
  color: var(--theme-selection-text, var(--theme-bg)) !important;
  text-shadow: none !important;
}
::-moz-selection,
*::-moz-selection {
  background-color: var(--theme-selection, var(--theme-accent)) !important;
  color: var(--theme-selection-text, var(--theme-bg)) !important;
  text-shadow: none !important;
}

/* =========================================================
   PORTFOLIO 3.0 — dynamic scrollbars and theme breathing
   ========================================================= */
html {
  scrollbar-width: thin;
  scrollbar-color: var(--theme-accent) var(--theme-bg);
  scrollbar-gutter: stable;
}
* {
  scrollbar-width: thin;
  scrollbar-color: var(--theme-accent) var(--theme-bg);
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--theme-bg); }
::-webkit-scrollbar-thumb {
  background: var(--theme-accent);
  border-radius: 999px;
  border: 2px solid var(--theme-bg);
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--theme-accent) 82%, var(--theme-text));
  background-clip: padding-box;
}
::-webkit-scrollbar-corner { background: var(--theme-bg); }

/* Theme changes arrive in a short sequence: surface, type, then accents. */
body,
.header,
.project-header,
.gallery-description-item,
.subtitle-follower {
  transition-property: background-color, color, border-color, opacity, transform;
  transition-duration: .42s, .34s, .28s, .28s, .42s;
  transition-timing-function: ease, ease, ease, ease, cubic-bezier(.16,1,.3,1);
}
html.theme-transitioning .logo,
html.theme-transitioning .logo a,
html.theme-transitioning h1,
html.theme-transitioning h2,
html.theme-transitioning h3,
html.theme-transitioning .description,
html.theme-transitioning .info-content,
html.theme-transitioning .bio-text,
html.theme-transitioning .exhibitions-text,
html.theme-transitioning .info-link,
html.theme-transitioning .portfolio-link,
html.theme-transitioning .footer,
html.theme-transitioning .project-footer {
  transition: color .34s ease;
}
html.theme-transitioning .theme-toggle,
html.theme-transitioning .project-entry-signature path,
html.theme-transitioning .preview-lines path,
html.theme-transitioning .project-name::after {
  transition: color .26s ease, stroke .26s ease, background-color .26s ease;
}

/* Cursor polish: slightly more elastic, without changing interactions. */
.project-back-follower,
.back-follower {
  will-change: transform, opacity;
  transition: opacity .2s ease, transform .46s cubic-bezier(.16,1,.3,1) !important;
}
.gallery-cursor {
  will-change: transform, opacity;
  transition: opacity .16s ease, transform .42s cubic-bezier(.16,1,.3,1) !important;
}

@media (max-width: 800px) {
  ::-webkit-scrollbar { width: 6px; height: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  body, .header, .project-header, .gallery-description-item, .subtitle-follower,
  .project-back-follower, .back-follower, .gallery-cursor { transition-duration: .01ms !important; }
}


/* ADESSO È ORA — voce effimera globale */
.nav .adesso-link[hidden] { display: none !important; }
.nav .adesso-link {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
  margin: 0;
  padding: 0;
  font-family: var(--theme-font-body, Inter, sans-serif) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 500;
  letter-spacing: 1.7px !important;
  text-transform: uppercase;
  color: var(--theme-muted) !important;
  text-decoration: none;
  white-space: nowrap;
}
.nav .adesso-link:hover { color: var(--theme-text) !important; }
.adesso-dot {
  width: 6px;
  height: 6px;
  min-width: 6px;
  margin-top: 2px;
  border-radius: 50%;
  background: #e32727 !important;
  box-shadow: 0 0 0 0 rgba(227,39,39,.42);
  animation: adesso-breathe 1.8s ease-in-out infinite;
}
@keyframes adesso-breathe {
  0%,100% { opacity:.38; transform:scale(.72); box-shadow:0 0 0 0 rgba(227,39,39,0); }
  50% { opacity:1; transform:scale(1.18); box-shadow:0 0 0 5px rgba(227,39,39,.12); }
}
@media (max-width: 800px) {
  .nav .adesso-link { font-size:10px !important; }
}
@media (prefers-reduced-motion: reduce) { .adesso-dot { animation:none; opacity:1; } }


/* RC4.11 — mobile header alignment and slightly larger controls. */
@media (max-width: 800px) {
  .header,
  .project-header,
  .adesso-header {
    height: 52px !important;
    min-height: 52px !important;
    padding: 14px 15px !important;
    align-items: center !important;
  }
  .header .logo,
  .project-logo,
  .adesso-logo {
    font-size: 17.5px !important;
    line-height: 1 !important;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
  }
  .header .nav,
  .project-nav,
  .adesso-header .nav {
    align-items: center !important;
    gap: 9px !important;
    line-height: 1 !important;
  }
  .header .info-link,
  .header .portfolio-link,
  .header .adesso-link,
  .project-nav a,
  .adesso-header .nav a {
    font-size: 10.5px !important;
    line-height: 1 !important;
    letter-spacing: 1.25px !important;
    align-items: center !important;
  }
  .header .theme-toggle,
  .project-header .theme-toggle,
  .adesso-header .theme-toggle {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    margin: -1px 0 0 !important;
    font-size: 18px !important;
    line-height: 18px !important;
    align-self: center !important;
  }
}
@media (max-width: 390px) {
  .header .nav,
  .project-nav,
  .adesso-header .nav { gap: 7px !important; }
  .header .info-link,
  .header .portfolio-link,
  .header .adesso-link,
  .project-nav a,
  .adesso-header .nav a { font-size: 10px !important; letter-spacing: 1px !important; }
  .header .logo,
  .project-logo,
  .adesso-logo { font-size: 17px !important; }
}

/* RC4.34 — ADESSO È ORA come estensione temporanea del logo. */
.brand-live-group{
  display:inline-flex;
  align-items:center;
  gap:16px;
  min-width:0;
  white-space:nowrap;
}
.brand-live-group .adesso-link,
.brand-live-group .adesso-current{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin:0;
  padding:0;
  font-family:var(--theme-font-body,Inter,sans-serif)!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:500;
  letter-spacing:1.55px!important;
  text-transform:uppercase;
  color:var(--theme-muted)!important;
  text-decoration:none!important;
  white-space:nowrap;
}
.brand-live-group .adesso-link:hover{color:var(--theme-text)!important}
.brand-live-group .adesso-link[hidden]{display:none!important}
.adesso-header .brand-live-group .adesso-current{
  color:var(--theme-text)!important;
  pointer-events:none;
}

@media(max-width:800px){
  .brand-live-group{gap:9px;max-width:calc(100vw - 130px)}
  .brand-live-group .adesso-link,
  .brand-live-group .adesso-current{
    font-size:9.5px!important;
    letter-spacing:.85px!important;
    gap:5px;
  }
  .brand-live-group .adesso-dot{
    width:5px;
    height:5px;
    min-width:5px;
    margin-top:0;
  }
}
@media(max-width:390px){
  .brand-live-group{gap:7px;max-width:calc(100vw - 116px)}
  .brand-live-group .adesso-link,
  .brand-live-group .adesso-current{
    font-size:8.7px!important;
    letter-spacing:.55px!important;
  }
}



/* RC4.35 — riallineamento ottico del nome rispetto alla voce live. */
.brand-live-group > .logo,
.brand-live-group > .project-logo,
.brand-live-group > .adesso-logo{
  transform: translateY(-1.5px);
}
@media(max-width:800px){
  .brand-live-group > .logo,
  .brand-live-group > .project-logo,
  .brand-live-group > .adesso-logo{
    transform: translateY(-1px);
  }
}


/* RC4.36 — allineamento tipografico definitivo nome / voce live. */
.brand-live-group{
  align-items:baseline!important;
  gap:15px;
}
.brand-live-group > .logo,
.brand-live-group > .project-logo,
.brand-live-group > .adesso-logo{
  transform:none!important;
  position:relative;
  top:0;
}
.brand-live-group .adesso-link,
.brand-live-group .adesso-current{
  align-self:baseline;
  transform:none;
}
.brand-live-group .adesso-dot{
  position:relative;
  top:-1px;
}
@media(max-width:800px){
  .brand-live-group{
    align-items:baseline!important;
    gap:9px;
  }
  .brand-live-group > .logo,
  .brand-live-group > .project-logo,
  .brand-live-group > .adesso-logo{
    transform:none!important;
  }
  .brand-live-group .adesso-dot{top:-1px}
}

/* RC4.43 — ulteriore abbassamento ottico del blocco di navigazione destro. */
.header > .nav,
.adesso-header > .nav,
.project-header > .project-nav{
  transform:translateY(5px);
}
@media(max-width:800px){
  .header > .nav,
  .adesso-header > .nav,
  .project-header > .project-nav{
    transform:translateY(5px);
  }
}



/* RC4.52 — firma originale come identità del sito. */
.site-signature{display:block;width:152px;height:auto;max-width:none;pointer-events:none;transition:filter .45s ease}
.logo,.logo a,.project-logo,.adesso-logo{line-height:0!important}
html[data-theme="dark"] .site-signature{filter:invert(1)}
@media(max-width:800px){.site-signature{width:112px}}
@media(max-width:390px){.site-signature{width:98px}}

/* RC4.84 — voce AUTENTICA ORA nel menu globale. */
.header .authenticate-link,
.project-nav .authenticate-link{
  display:inline-flex;
  align-items:flex-start;
  margin:0;
  padding:0;
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:1.7px!important;
  text-transform:uppercase;
  font-family:var(--theme-font-body,Inter,sans-serif)!important;
  color:var(--theme-muted)!important;
  text-decoration:none;
  white-space:nowrap;
}
.header .authenticate-link:hover,
.project-nav .authenticate-link:hover{color:var(--theme-accent)!important}
@media(max-width:800px){
  .header .authenticate-link,
  .project-nav .authenticate-link{font-size:10px!important;letter-spacing:1.1px!important}
}

/* RC4.85 — AUTENTICA ORA sotto al cambio tema. */
.theme-auth-stack{
  display:inline-flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:flex-start;
  gap:7px;
  margin-top:-2px;
  flex:none;
}
.theme-auth-stack .theme-toggle{
  align-self:flex-end!important;
  margin:0!important;
}
.header .theme-auth-stack .authenticate-link,
.project-nav .theme-auth-stack .authenticate-link{
  font-size:9px!important;
  line-height:1!important;
  letter-spacing:1.05px!important;
  white-space:nowrap;
  text-align:right;
}
@media(max-width:800px){
  .theme-auth-stack{
    gap:5px;
    margin-top:-1px;
  }
  .header .theme-auth-stack .authenticate-link,
  .project-nav .theme-auth-stack .authenticate-link{
    font-size:8px!important;
    letter-spacing:.75px!important;
  }
}
@media(max-width:420px){
  .header .nav,
  .project-nav,
  .adesso-header .nav{
    gap:8px!important;
  }
}

/* RC4.86 — AUTENTICA ORA non occupa larghezza nella riga principale. */
.theme-auth-stack{
  position:relative!important;
  display:inline-flex!important;
  width:16px!important;
  min-width:16px!important;
  height:16px!important;
  margin:0!important;
  padding:0!important;
  flex:none!important;
  overflow:visible!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
}
.theme-auth-stack .theme-toggle{
  position:relative!important;
  z-index:2;
  margin:-2px 0 0 0!important;
  flex:none!important;
}
.header .theme-auth-stack .authenticate-link,
.project-nav .theme-auth-stack .authenticate-link{
  position:absolute!important;
  top:25px!important;
  right:0!important;
  width:max-content!important;
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:1.7px!important;
  text-align:right!important;
  text-decoration:none!important;
  border-bottom:1px solid currentColor!important;
  padding-bottom:2px!important;
  white-space:nowrap!important;
}
@media(max-width:800px){
  .theme-auth-stack{
    width:16px!important;
    min-width:16px!important;
    height:16px!important;
  }
  .header .theme-auth-stack .authenticate-link,
  .project-nav .theme-auth-stack .authenticate-link{
    top:23px!important;
    font-size:10px!important;
    letter-spacing:1.35px!important;
    padding-bottom:2px!important;
  }
}

/* RC4.87 — refine finale menu AUTENTICA ORA. */
.header .nav a,
.project-nav a{
  text-decoration:none!important;
  border-bottom:0!important;
}

.theme-auth-stack{
  position:relative!important;
  width:16px!important;
  min-width:16px!important;
  height:16px!important;
  overflow:visible!important;
}

.header .theme-auth-stack .authenticate-link,
.project-nav .theme-auth-stack .authenticate-link{
  position:absolute!important;
  top:24px!important;
  right:22px!important; /* lascia a destra lo spazio dell'icona tema */
  width:max-content!important;
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:1.7px!important;
  font-weight:500!important;
  text-decoration:none!important;
  border-bottom:0!important;
  padding:0!important;
  color:var(--theme-muted)!important;
  white-space:nowrap!important;
}
.header .theme-auth-stack .authenticate-link:hover,
.project-nav .theme-auth-stack .authenticate-link:hover{
  color:var(--theme-accent)!important;
}

.authenticate-page .nav .portfolio-link,
.authenticate-page .nav .info-link,
.authenticate-page .nav .authenticate-link{
  text-decoration:none!important;
  border-bottom:0!important;
}

@media(max-width:800px){
  .header .theme-auth-stack .authenticate-link,
  .project-nav .theme-auth-stack .authenticate-link{
    top:22px!important;
    right:20px!important;
    font-size:10px!important;
    letter-spacing:1.1px!important;
    font-weight:500!important;
  }
}

/* RC4.88 — AUTENTICA ORA allineato realmente sotto INFO. */
.header .theme-auth-stack .authenticate-link,
.project-nav .theme-auth-stack .authenticate-link{
  right:26px!important;
  transform:translateX(50%)!important;
}
@media(max-width:800px){
  .header .theme-auth-stack .authenticate-link,
  .project-nav .theme-auth-stack .authenticate-link{
    right:24px!important;
    transform:translateX(50%)!important;
  }
}

/* RC4.89 — allineamento geometrico: AUTENTICA ORA sotto INFO. */
.header .nav,
.project-nav,
.adesso-header .nav{
  position:relative!important;
}

/* Lo stack non deve più essere il riferimento di posizionamento. */
.theme-auth-stack{
  position:static!important;
}

/* Bordo destro di AUTENTICA ORA = bordo destro di INFO.
   16px icona tema + 12px gap desktop. */
.header .theme-auth-stack .authenticate-link,
.project-nav .theme-auth-stack .authenticate-link{
  position:absolute!important;
  top:25px!important;
  right:28px!important;
  transform:none!important;
  width:max-content!important;
  max-width:none!important;
  white-space:nowrap!important;
  text-align:right!important;
}

/* Su mobile il gap del menu è più stretto. */
@media(max-width:800px){
  .header .theme-auth-stack .authenticate-link,
  .project-nav .theme-auth-stack .authenticate-link{
    top:23px!important;
    right:24px!important;
    transform:none!important;
  }
}

/* MOBILE — sfondo Home: nel tema chiaro usa l'opacità scelta nel CMS */
@media (max-width: 800px) {
  html[data-theme="light"] body.home-page::before,
  html[data-theme="dark"] body.home-page::before {
    opacity: var(--theme-background-opacity, 1) !important;
  }
}

/* HOME — sfondo sempre all'opacità scelta nel CMS, desktop e mobile */
html[data-theme="light"] body.home-page::before,
html[data-theme="dark"] body.home-page::before{
  opacity: var(--theme-background-opacity, 1) !important;
}

/* GRADIENTI TEMA — tinta piatta se disattivati */
body{
  background-color:var(--theme-bg)!important;
  background-image:var(--theme-bg-gradient,none)!important;
  background-attachment:fixed;
}
/* La Home mantiene l'immagine scelta sopra al colore/gradiente di base. */
body.home-page{
  background-color:var(--theme-bg)!important;
  background-image:var(--theme-bg-gradient,none)!important;
}


/* Design credit: stesso aspetto fisso del copyright in entrambi i temi */
.footer a[href="https://www.occhioiperteso.it/"],
.footer a[href="https://www.occhioiperteso.it"]{
  color:inherit!important;
  text-decoration:none!important;
  border:0!important;
  border-bottom:0!important;
  background:none!important;
  box-shadow:none!important;
}
.footer a[href="https://www.occhioiperteso.it/"]:hover,
.footer a[href="https://www.occhioiperteso.it"]:hover,
.footer a[href="https://www.occhioiperteso.it/"]:focus,
.footer a[href="https://www.occhioiperteso.it"]:focus,
.footer a[href="https://www.occhioiperteso.it/"]:visited,
.footer a[href="https://www.occhioiperteso.it"]:visited{
  color:inherit!important;
  text-decoration:none!important;
  border:0!important;
  border-bottom:0!important;
  background:none!important;
  box-shadow:none!important;
}


/* FINAL FIX — copyright/design credit coerente su tutte le pagine */
.footer,
.project-footer{
  text-transform:none!important;
  white-space:nowrap!important;
}
.footer p,
.project-footer p{
  white-space:nowrap!important;
}
.footer a[href="https://www.occhioiperteso.it/"],
.footer a[href="https://www.occhioiperteso.it"],
.project-footer a[href="https://www.occhioiperteso.it/"],
.project-footer a[href="https://www.occhioiperteso.it"]{
  color:inherit!important;
  text-decoration:none!important;
  border:0!important;
  border-bottom:0!important;
  background:none!important;
  box-shadow:none!important;
  text-transform:none!important;
  white-space:nowrap!important;
}
.footer a[href="https://www.occhioiperteso.it/"]:hover,
.footer a[href="https://www.occhioiperteso.it/"]:focus,
.footer a[href="https://www.occhioiperteso.it/"]:visited,
.project-footer a[href="https://www.occhioiperteso.it/"]:hover,
.project-footer a[href="https://www.occhioiperteso.it/"]:focus,
.project-footer a[href="https://www.occhioiperteso.it/"]:visited{
  color:inherit!important;
  text-decoration:none!important;
  border:0!important;
  border-bottom:0!important;
}
@media(max-width:800px){
  .footer,
  .project-footer{
    letter-spacing:.55px!important;
    font-size:8px!important;
  }
}

/* FINAL FIX — IT/ENG allineato verticalmente alle altre voci */
.language-switch,
.header .nav .language-switch,
.project-nav .language-switch,
.adesso-header .nav .language-switch{
  position:relative!important;
  top:0!important;
}


/* HOME — il titolo del progetto attivo mantiene il colore pieno
   anche quando lo spostamento elastico lo porta fuori dal puntatore. */
html[data-theme="light"] body.home-page .project-item.is-active-project .project-name,
html[data-theme="light"] body.home-page .project-item:hover .project-name{
  color:#000!important;
}
html[data-theme="dark"] body.home-page .project-item.is-active-project .project-name,
html[data-theme="dark"] body.home-page .project-item:hover .project-name{
  color:var(--theme-text)!important;
}


/* =========================================================
   MENU GLOBALE — navigazione separata dai controlli tecnici
   ========================================================= */
.header .nav,
.adesso-header .nav,
.project-nav{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:flex-end!important;
  gap:24px!important;
  overflow:visible!important;
}

/* Navigazione: link principali sopra, autenticazione sotto */
.nav-navigation{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:flex-start;
  gap:12px;
  min-width:0;
}
.nav-primary{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:14px;
  min-height:16px;
}
.nav-auth-row{
  display:flex;
  justify-content:flex-end;
  width:100%;
}
.header .nav-auth-row .authenticate-link,
.project-nav .nav-auth-row .authenticate-link{
  position:static!important;
  inset:auto!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  font-size:11px!important;
  line-height:1.1!important;
  letter-spacing:1.7px!important;
  text-align:right!important;
  white-space:nowrap!important;
  text-decoration:none!important;
  color:var(--theme-muted)!important;
}
.header .nav-auth-row .authenticate-link:hover,
.project-nav .nav-auth-row .authenticate-link:hover{
  color:var(--theme-accent)!important;
}

/* Controlli tecnici: blocco separato e verticale */
.nav-tools{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  flex:none;
  min-width:38px;
  padding:7px 8px 8px;
  box-sizing:border-box;
  background:color-mix(in srgb,var(--theme-surface) 88%,var(--theme-bg));
  border:1px solid var(--theme-border);
}
.nav-tools .theme-toggle,
.nav-tools .language-switch{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  padding:0!important;
  width:22px!important;
  min-width:22px!important;
  height:18px!important;
  min-height:18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
  background:transparent!important;
  border:0!important;
  color:var(--theme-muted)!important;
}
.nav-tools .theme-toggle{
  font-size:16px!important;
}
.nav-tools .language-switch{
  font-size:10px!important;
  letter-spacing:1.25px!important;
  font-family:var(--theme-font-body,Inter,sans-serif)!important;
}
.nav-tools .theme-toggle:hover,
.nav-tools .language-switch:hover{
  color:var(--theme-accent)!important;
}

/* Il vecchio wrapper non è più usato nelle pagine nuove. */
.theme-auth-stack{display:none!important}

/* Tablet / mobile: stesso principio, più compatto */
@media(max-width:800px){
  .header .nav,
  .adesso-header .nav,
  .project-nav{
    gap:14px!important;
  }
  .nav-navigation{
    gap:8px;
  }
  .nav-primary{
    gap:10px;
  }
  .header .nav-auth-row .authenticate-link,
  .project-nav .nav-auth-row .authenticate-link{
    font-size:9px!important;
    letter-spacing:1.15px!important;
  }
  .nav-tools{
    min-width:34px;
    padding:6px 6px 7px;
    gap:6px;
  }
  .nav-tools .theme-toggle{
    font-size:15px!important;
  }
  .nav-tools .language-switch{
    font-size:9px!important;
    letter-spacing:1px!important;
  }
}

@media(max-width:560px){
  .header .nav,
  .adesso-header .nav,
  .project-nav{
    gap:10px!important;
  }
  .nav-primary{
    gap:8px;
  }
  .nav-navigation{
    gap:7px;
  }
  .header .nav-auth-row .authenticate-link,
  .project-nav .nav-auth-row .authenticate-link{
    font-size:8px!important;
    letter-spacing:.9px!important;
  }
  .nav-tools{
    min-width:31px;
    padding:5px;
  }
}


/* =========================================================
   MENU — allineamento finale desktop + mobile
   Il pannello tecnico si appoggia all'angolo alto destro.
   ========================================================= */

/* Il blocco tecnico non deve spingere né abbassare la navigazione. */
.header .nav,
.adesso-header .nav,
.project-nav{
  position:relative!important;
  padding-right:54px!important;
  align-items:flex-start!important;
}

/* Prima riga: stessa linea di base per OPERE / INFO. */
.nav-primary{
  min-height:22px!important;
  align-items:flex-start!important;
}
.nav-primary > a{
  line-height:1!important;
}

/* AUTENTICA mantiene la stessa presenza tipografica dei link principali. */
.header .nav-auth-row .authenticate-link,
.project-nav .nav-auth-row .authenticate-link{
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:1.7px!important;
}

/* Pannello tecnico: fissato all'angolo del viewport/header. */
.nav-tools{
  position:fixed!important;
  top:0!important;
  right:0!important;
  z-index:1005!important;
  width:48px!important;
  min-width:48px!important;
  padding:11px 7px 10px!important;
  gap:9px!important;
  border-top:0!important;
  border-right:0!important;
  box-sizing:border-box!important;
}

/* Tema e lingua partono dalla stessa quota visiva della navigazione. */
.nav-tools .theme-toggle{
  height:18px!important;
  min-height:18px!important;
  line-height:18px!important;
}
.nav-tools .language-switch{
  height:18px!important;
  min-height:18px!important;
  line-height:18px!important;
}

/* MOBILE: nessun ridimensionamento speciale di AUTENTICA.
   Il pannello tecnico resta nell'angolo e non interferisce col menu. */
@media(max-width:800px){
  .header .nav,
  .adesso-header .nav,
  .project-nav{
    padding-right:43px!important;
    gap:0!important;
  }
  .nav-navigation{
    gap:8px!important;
  }
  .nav-primary{
    gap:10px!important;
    min-height:18px!important;
  }
  .header .nav-auth-row .authenticate-link,
  .project-nav .nav-auth-row .authenticate-link{
    font-size:10px!important;
    line-height:1!important;
    letter-spacing:1.1px!important;
  }
  .nav-tools{
    width:38px!important;
    min-width:38px!important;
    padding:8px 5px 8px!important;
    gap:7px!important;
  }
  .nav-tools .theme-toggle{
    font-size:15px!important;
  }
  .nav-tools .language-switch{
    font-size:10px!important;
    letter-spacing:1.1px!important;
  }
}

@media(max-width:560px){
  .header .nav,
  .adesso-header .nav,
  .project-nav{
    padding-right:41px!important;
  }
  .header .nav-auth-row .authenticate-link,
  .project-nav .nav-auth-row .authenticate-link{
    font-size:10px!important;
    letter-spacing:1.1px!important;
  }
  .nav-tools{
    width:36px!important;
    min-width:36px!important;
  }
}


/* =========================================================
   MENU TECNICO — FIX ASSOLUTO AL VIEWPORT
   ========================================================= */
html,body{
  overflow-x:hidden;
}

/* Il pannello tecnico vive nel viewport, non nel layout dell'header. */
.nav-tools{
  position:fixed!important;
  top:0!important;
  right:0!important;
  left:auto!important;
  bottom:auto!important;

  margin:0!important;
  transform:none!important;

  width:52px!important;
  min-width:52px!important;
  height:auto!important;
  min-height:72px!important;

  padding:8px 7px 10px!important;
  box-sizing:border-box!important;

  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;

  background:color-mix(in srgb,var(--theme-surface) 92%,var(--theme-bg))!important;
  border-left:1px solid var(--theme-border)!important;
  border-bottom:1px solid var(--theme-border)!important;
  border-top:0!important;
  border-right:0!important;

  z-index:9999!important;
}

/* I due controlli partono davvero dall'alto del box. */
.nav-tools .theme-toggle,
.nav-tools .language-switch{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  transform:none!important;
  align-self:center!important;
  flex:none!important;

  width:28px!important;
  min-width:28px!important;
  height:20px!important;
  min-height:20px!important;
  padding:0!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  line-height:20px!important;
  vertical-align:top!important;

  background:transparent!important;
  border:0!important;
}

.nav-tools .theme-toggle{
  font-size:16px!important;
}

.nav-tools .language-switch{
  font-size:10px!important;
  letter-spacing:1.15px!important;
}

/* Il menu principale lascia solo lo spazio necessario a destra. */
.header .nav,
.adesso-header .nav,
.project-nav{
  padding-right:58px!important;
}

/* Mobile: stesso principio, box tecnico sempre in angolo. */
@media(max-width:800px){
  .nav-tools{
    top:0!important;
    right:0!important;
    width:42px!important;
    min-width:42px!important;
    min-height:64px!important;
    padding:7px 5px 8px!important;
    gap:6px!important;
  }

  .nav-tools .theme-toggle,
  .nav-tools .language-switch{
    width:26px!important;
    min-width:26px!important;
    height:19px!important;
    min-height:19px!important;
    line-height:19px!important;
  }

  .nav-tools .theme-toggle{
    font-size:15px!important;
  }

  .nav-tools .language-switch{
    font-size:10px!important;
    letter-spacing:1px!important;
  }

  .header .nav,
  .adesso-header .nav,
  .project-nav{
    padding-right:46px!important;
  }
}


/* =========================================================
   MENU / AEO LIVE — FIX MOBILE STRUTTURALE
   ========================================================= */

/* Pannello tecnico: ancorato realmente all'angolo del viewport */
.nav-tools{
  position:fixed!important;
  top:0!important;
  right:0!important;
  left:auto!important;
  bottom:auto!important;
  margin:0!important;
  transform:none!important;
  z-index:2147483000!important;

  width:50px!important;
  min-width:50px!important;
  height:68px!important;
  min-height:68px!important;
  max-height:68px!important;

  padding:7px 0 6px!important;
  box-sizing:border-box!important;

  display:grid!important;
  grid-template-rows:26px 24px!important;
  grid-template-columns:1fr!important;
  align-items:center!important;
  justify-items:center!important;
  row-gap:5px!important;

  background:var(--theme-surface)!important;
  border:0!important;
  border-left:1px solid var(--theme-border)!important;
  border-bottom:1px solid var(--theme-border)!important;
  border-radius:0!important;
  box-shadow:none!important;
}

.nav-tools .theme-toggle,
.nav-tools .language-switch{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  transform:none!important;
  padding:0!important;

  width:30px!important;
  min-width:30px!important;
  max-width:30px!important;
  height:24px!important;
  min-height:24px!important;
  max-height:24px!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  line-height:24px!important;
  text-align:center!important;
  vertical-align:middle!important;
  background:transparent!important;
  border:0!important;
}

.nav-tools .theme-toggle{
  grid-row:1!important;
  font-size:16px!important;
}
.nav-tools .language-switch{
  grid-row:2!important;
  font-size:10px!important;
  letter-spacing:1px!important;
}

/* Il menu non passa sotto al box tecnico. */
.header .nav,
.adesso-header .nav,
.project-nav{
  padding-right:58px!important;
}

/* MOBILE: AEO live sempre sotto il logo, mai dentro la fascia del menu */
@media(max-width:800px){
  .header,
  .project-header,
  .adesso-header{
    align-items:flex-start!important;
  }

  .brand-live-group{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    gap:8px!important;
    min-width:0!important;
  }

  .brand-live-group .logo,
  .brand-live-group .project-logo,
  .brand-live-group .adesso-logo{
    display:block!important;
    flex:none!important;
  }

  .brand-live-group .adesso-link,
  .brand-live-group .adesso-current{
    position:static!important;
    inset:auto!important;
    margin:0!important;
    transform:none!important;
    width:max-content!important;
    max-width:calc(100vw - 120px)!important;

    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;

    font-size:9px!important;
    line-height:1!important;
    letter-spacing:1.15px!important;
    white-space:nowrap!important;
  }

  .brand-live-group .adesso-dot{
    flex:none!important;
    width:6px!important;
    height:6px!important;
    margin:0!important;
  }

  /* Se AEO live viene inserito direttamente nell'header fuori dal brand group,
     lo riportiamo comunque sotto il logo a sinistra. */
  .header > .adesso-link,
  .project-header > .adesso-link,
  .adesso-header > .adesso-link{
    position:absolute!important;
    left:14px!important;
    top:44px!important;
    right:auto!important;
    margin:0!important;
    z-index:20!important;
  }

  .nav-tools{
    top:0!important;
    right:0!important;
    width:42px!important;
    min-width:42px!important;
    height:62px!important;
    min-height:62px!important;
    max-height:62px!important;
    grid-template-rows:24px 22px!important;
    row-gap:4px!important;
    padding:6px 0!important;
  }

  .nav-tools .theme-toggle,
  .nav-tools .language-switch{
    width:28px!important;
    min-width:28px!important;
    max-width:28px!important;
    height:22px!important;
    min-height:22px!important;
    max-height:22px!important;
    line-height:22px!important;
  }

  .header .nav,
  .adesso-header .nav,
  .project-nav{
    padding-right:48px!important;
  }
}

@media(max-width:560px){
  .brand-live-group{
    gap:7px!important;
  }
  .brand-live-group .adesso-link,
  .brand-live-group .adesso-current{
    font-size:8.5px!important;
    letter-spacing:1px!important;
  }
}


/* =========================================================
   MENU TECNICO — POSIZIONE DEFINITIVA IN BASSO A SINISTRA
   Sopra il marquee, fuori dalla navigazione superiore.
   ========================================================= */

/* Menu alto: solo navigazione */
.header .nav,
.adesso-header .nav,
.project-nav{
  padding-right:0!important;
  gap:0!important;
}

/* Blocco tecnico indipendente dalla navigazione */
.nav-tools{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  top:auto!important;
  bottom:40px!important; /* altezza marquee desktop */
  z-index:2147483000!important;

  width:48px!important;
  min-width:48px!important;
  height:auto!important;
  min-height:68px!important;
  max-height:none!important;

  margin:0!important;
  padding:7px 0 7px!important;
  transform:none!important;

  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:24px 22px!important;
  align-items:center!important;
  justify-items:center!important;
  row-gap:5px!important;

  box-sizing:border-box!important;
  background:var(--theme-surface)!important;
  border:0!important;
  border-top:1px solid var(--theme-border)!important;
  border-right:1px solid var(--theme-border)!important;
  border-radius:0!important;
  box-shadow:none!important;
}

/* Controlli centrati sulla stessa asse */
.nav-tools .theme-toggle,
.nav-tools .language-switch{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;

  width:30px!important;
  min-width:30px!important;
  max-width:30px!important;
  height:22px!important;
  min-height:22px!important;
  max-height:22px!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  background:transparent!important;
  border:0!important;
  line-height:22px!important;
  text-align:center!important;
}

.nav-tools .theme-toggle{
  grid-row:1!important;
  font-size:16px!important;
}
.nav-tools .language-switch{
  grid-row:2!important;
  font-size:10px!important;
  letter-spacing:1px!important;
}

/* Navigazione alta pulita e stabile */
.nav-navigation{
  align-items:flex-end!important;
}
.nav-primary{
  display:flex!important;
  align-items:flex-start!important;
  gap:14px!important;
}
.nav-auth-row{
  margin-top:10px!important;
}

/* MOBILE: box tecnico sopra il marquee mobile */
@media(max-width:800px){
  .nav-tools{
    left:0!important;
    right:auto!important;
    top:auto!important;
    bottom:37px!important; /* altezza marquee mobile */
    width:42px!important;
    min-width:42px!important;
    min-height:62px!important;
    padding:6px 0!important;
    grid-template-rows:22px 20px!important;
    row-gap:5px!important;
  }

  .nav-tools .theme-toggle,
  .nav-tools .language-switch{
    width:28px!important;
    min-width:28px!important;
    max-width:28px!important;
    height:20px!important;
    min-height:20px!important;
    max-height:20px!important;
    line-height:20px!important;
  }

  .nav-tools .theme-toggle{
    font-size:15px!important;
  }

  .nav-tools .language-switch{
    font-size:10px!important;
    letter-spacing:1px!important;
  }

  .header .nav,
  .adesso-header .nav,
  .project-nav{
    padding-right:0!important;
  }

  .nav-primary{
    gap:10px!important;
  }

  .nav-auth-row{
    margin-top:8px!important;
  }

  .header .nav-auth-row .authenticate-link,
  .project-nav .nav-auth-row .authenticate-link{
    font-size:10px!important;
    letter-spacing:1.1px!important;
  }
}


/* =========================================================
   FIX — TEMA + LINGUA DEVONO RESTARE NEL BOX IN BASSO
   ========================================================= */
html body .nav-tools{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  top:auto!important;
  bottom:40px!important;
}

html body .nav-tools > .theme-toggle,
html body .nav-tools > .language-switch,
html body .header .nav-tools > .theme-toggle,
html body .header .nav-tools > .language-switch,
html body .project-nav .nav-tools > .theme-toggle,
html body .project-nav .nav-tools > .language-switch,
html body .adesso-header .nav-tools > .theme-toggle,
html body .adesso-header .nav-tools > .language-switch{
  position:static!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  inset:auto!important;
  float:none!important;
  margin:0!important;
  transform:none!important;
  align-self:center!important;
}

html body .nav-tools > .theme-toggle{
  grid-row:1!important;
}
html body .nav-tools > .language-switch{
  grid-row:2!important;
}

@media(max-width:800px){
  html body .nav-tools{
    left:0!important;
    right:auto!important;
    top:auto!important;
    bottom:37px!important;
  }
}


/* =========================================================
   NAV TOOLS — ELEMENTO INDIPENDENTE DAL MENU
   Tema + lingua sono ora figli diretti del body.
   ========================================================= */
body > .nav-tools{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  top:auto!important;
  bottom:40px!important;
  z-index:2147483000!important;

  width:48px!important;
  min-width:48px!important;
  height:66px!important;
  min-height:66px!important;
  max-height:66px!important;

  margin:0!important;
  padding:7px 0!important;
  transform:none!important;

  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:24px 22px!important;
  place-items:center!important;
  row-gap:5px!important;

  background:var(--theme-surface)!important;
  border:0!important;
  border-top:1px solid var(--theme-border)!important;
  border-right:1px solid var(--theme-border)!important;
  box-sizing:border-box!important;
  border-radius:0!important;
}

body > .nav-tools > .theme-toggle,
body > .nav-tools > .language-switch{
  position:static!important;
  inset:auto!important;
  float:none!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;

  width:30px!important;
  min-width:30px!important;
  max-width:30px!important;
  height:22px!important;
  min-height:22px!important;
  max-height:22px!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  background:transparent!important;
  border:0!important;
  line-height:22px!important;
  text-align:center!important;
  color:var(--theme-muted)!important;
}

body > .nav-tools > .theme-toggle{
  grid-row:1!important;
  font-size:16px!important;
}

body > .nav-tools > .language-switch{
  grid-row:2!important;
  font-size:10px!important;
  letter-spacing:1px!important;
}

/* Il menu alto non deve più riservare spazio ai tools. */
.header .nav,
.adesso-header .nav,
.project-nav{
  padding-right:0!important;
}

/* Mobile: stessa posizione, box leggermente più compatto. */
@media(max-width:800px){
  body > .nav-tools{
    left:0!important;
    right:auto!important;
    top:auto!important;
    bottom:37px!important;
    width:42px!important;
    min-width:42px!important;
    height:60px!important;
    min-height:60px!important;
    max-height:60px!important;
    grid-template-rows:22px 20px!important;
    row-gap:4px!important;
    padding:6px 0!important;
  }

  body > .nav-tools > .theme-toggle,
  body > .nav-tools > .language-switch{
    width:28px!important;
    min-width:28px!important;
    max-width:28px!important;
    height:20px!important;
    min-height:20px!important;
    max-height:20px!important;
    line-height:20px!important;
  }

  body > .nav-tools > .theme-toggle{font-size:15px!important}
  body > .nav-tools > .language-switch{
    font-size:10px!important;
    letter-spacing:1px!important;
  }
}


/* =========================================================
   NAV TOOLS — POSIZIONE BASSO DESTRA, SOLO FONDO
   ========================================================= */
body > .nav-tools{
  left:auto!important;
  right:0!important;
  top:auto!important;
  bottom:40px!important;
  background:var(--theme-surface)!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}

@media(max-width:800px){
  body > .nav-tools{
    left:auto!important;
    right:0!important;
    top:auto!important;
    bottom:37px!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
  }
}


/* AEO LIVE — mobile: stessa dimensione delle voci di menu */
@media(max-width:800px){
  .brand-live-group .adesso-link,
  .brand-live-group .adesso-current{
    font-size:10px!important;
    line-height:1!important;
    letter-spacing:1.1px!important;
  }

  .brand-live-group .adesso-dot{
    width:6px!important;
    height:6px!important;
    min-width:6px!important;
  }
}


/* =========================================================
   FIX DEFINITIVO — TEMA + LINGUA IN BASSO A DESTRA
   ========================================================= */
html body > .nav-tools{
  position:fixed!important;
  left:auto!important;
  right:0!important;
  top:auto!important;
  bottom:40px!important;
  margin:0!important;
  transform:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:var(--theme-surface)!important;
  z-index:2147483000!important;
}

@media(max-width:800px){
  html body > .nav-tools{
    left:auto!important;
    right:0!important;
    top:auto!important;
    bottom:37px!important;
    margin:0!important;
    transform:none!important;
  }
}


/* =========================================================
   MARQUEE — fondo più marcato e livello sopra ai controlli
   ========================================================= */

/* Il box tecnico resta sotto al marquee: non deve coprirne il bordo. */
html body > .nav-tools{
  z-index:900!important;
}

/* Marquee sempre sopra ai controlli tecnici. */
#adesso-marquee,
.adesso-marquee,
.adesso-marquee-bar,
.adesso-marquee-wrap{
  z-index:1100!important;
}

/* Fondo leggermente più marcato, coerente con entrambi i temi. */
#adesso-marquee,
.adesso-marquee{
  background:color-mix(in srgb,var(--theme-surface) 82%,var(--theme-text) 18%)!important;
}


/* =========================================================
   FIRMA VISIVA — linee sopra al box tema/lingua
   ========================================================= */

/* Home: SVG con bordo/linee dagli angoli del viewport */
body.home-page .preview-stage,
body.home-page .preview-lines{
  z-index:1300!important;
}

/* Pagine opera: linee/contorno di ingresso e viewer */
.project-entry-signature,
.viewer-signature{
  z-index:1300!important;
}

/* Il box tecnico resta sotto alle linee. */
html body > .nav-tools{
  z-index:900!important;
}

/* Il marquee continua a stare sopra al box tecnico in basso. */
.adesso-marquee,
#adesso-marquee{
  z-index:1100!important;
}


/* MARQUEE — fondo leggermente meno marcato */
#adesso-marquee,
.adesso-marquee{
  background:color-mix(in srgb,var(--theme-surface) 90%,var(--theme-text) 10%)!important;
}


/* MARQUEE — fondo molto leggero */
#adesso-marquee,
.adesso-marquee{
  background:color-mix(in srgb,var(--theme-surface) 96%,var(--theme-text) 4%)!important;
}


/* TEMA — nessun cerchio/background attorno all'icona */
body > .nav-tools > .theme-toggle,
body > .nav-tools > .theme-toggle:hover,
body > .nav-tools > .theme-toggle:active,
body > .nav-tools > .theme-toggle:focus,
body > .nav-tools > .theme-toggle:focus-visible{
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  transform:none!important;
}

/* manteniamo solo il cambio colore, senza forma circolare */
body > .nav-tools > .theme-toggle:hover,
body > .nav-tools > .theme-toggle:focus-visible{
  color:var(--theme-accent)!important;
}


/* =========================================================
   AEO LIVE — sotto il logo anche su desktop
   ========================================================= */
.brand-live-group{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:8px!important;
  min-width:0!important;
}

.brand-live-group .logo,
.brand-live-group .project-logo,
.brand-live-group .adesso-logo{
  display:block!important;
  flex:none!important;
}

.brand-live-group .adesso-link,
.brand-live-group .adesso-current{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  transform:none!important;
  width:max-content!important;
  max-width:calc(100vw - 160px)!important;

  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;

  white-space:nowrap!important;
}

/* Mobile conserva esattamente la disposizione già approvata */
@media(max-width:800px){
  .brand-live-group{
    gap:8px!important;
  }
}


/* AEO LIVE — 6px più in basso sotto il logo */
.brand-live-group .adesso-link,
.brand-live-group .adesso-current{
  margin-top:6px!important;
}


/* =========================================================
   INFO — ripristino griglia e colonna sinistra sticky
   ========================================================= */
html:has(body.info-page){
  overflow-x:clip!important;
  overflow-y:auto!important;
}

body.info-page{
  overflow-x:visible!important;
  overflow-y:visible!important;
}

body.info-page .info-grid{
  display:grid!important;
  grid-template-columns:1fr 2fr!important;
  gap:80px!important;
  align-items:start!important;
}

body.info-page .info-col-left,
body.info-page .info-col-right{
  margin-top:0!important;
  padding-top:0!important;
}

body.info-page .info-col-left{
  position:sticky!important;
  top:140px!important;
  align-self:start!important;
  height:max-content!important;
}

@media(max-width:768px){
  html:has(body.info-page){
    overflow-x:clip!important;
  }

  body.info-page .info-grid{
    grid-template-columns:1fr!important;
    gap:40px!important;
  }

  body.info-page .info-col-left{
    position:static!important;
    top:auto!important;
    height:auto!important;
  }
}