/* ==========================================================
   FILE:  assets/css/logo.css   (Child Theme: TDR)
   SCOPO: Gestione logo header e wordmark (solo header)
   NOTE:  Versione UNMINIFIED — WIP documentale
   ========================================================== */

/*
 Theme Name: TDR
 Template: inspiro
 Version: 3.1.88
*/

/* ================================
   [BLOCCO 1] RESET LOGHI (header)
   Disattiva le varianti predefinite e normalizza dimensioni.
   ================================ */
.site-logo .logo,
.site-logo .logo-overlay,
.site-logo .logo-dark,
.site-logo .logo-variant{
  display:none !important;
  height:auto !important;
  width:auto !important;
  opacity:0;
  transition:opacity .25s ease !important;
  will-change:opacity,height;
}
/* sizing uniforme per tutti i loghi nell’header */
.site-logo img{
  max-height:clamp(35px,7vw,70px) !important;
  width:auto !important;
}

/* ================================
   [BLOCCO 2] ACCESSIBILITÀ LOGO (focus tastiera)
   ================================ */
.site-logo a:focus-visible{
  outline:2px solid currentColor;
  outline-offset:2px;
}

/* ================================
   [BLOCCO 3] HOMEPAGE overlay (pre-scroll)
   ================================ */
body.home:not(.scrolled) .site-logo .logo-overlay,
body.inspiro-front-page:not(.scrolled) .site-logo .logo-overlay{
  display:inline-block !important;
  opacity:1;
}

/* ================================
   [BLOCCO 4] PAGINE INTERNE overlay (pre-scroll)
   ================================ */
body.page:not(.home):not(.scrolled) .site-logo .logo-overlay,
body.single:not(.scrolled) .site-logo .logo-overlay,
body.archive:not(.scrolled) .site-logo .logo-overlay,
body.search:not(.scrolled) .site-logo .logo-overlay{
  display:inline-block !important;
  opacity:1;
}

/* ================================
   [BLOCCO 5] STICKY dopo scroll
   Alterna overlay/dark in stato .scrolled.
   ================================ */
body.scrolled .site-logo .logo-dark{
  display:inline-block !important;
  opacity:1;
}
body.scrolled .site-logo .logo-overlay{
  display:none !important;
  opacity:0;
}

/* ================================
   [BLOCCO 6] POSIZIONAMENTO HEADER
   ================================ */
.header-logo-wrapper{margin-left:0 !important;padding-left:0 !important}
.header-inner{justify-content:flex-start !important}

/* ================================
   [BLOCCO 7] ANTI-FLICKER (pre .page-loaded)
   ================================ */
body:not(.page-loaded) .site-logo img{transition:none !important}

/* ================================
   [BLOCCO 8] RIDUZIONE ANIMAZIONI (prefers-reduced-motion)
   ================================ */
@media (prefers-reduced-motion: reduce){
  .logo-glitch,
  .logo-glitch::before,
  .logo-glitch::after{
    animation:none !important;
  }
  .site-logo .logo,
  .site-logo .logo-overlay,
  .site-logo .logo-dark,
  .site-logo .logo-variant{
    transition:none !important;
  }
}

/* ================================
   [BLOCCO 9] EFFETTO GLITCH wordmark (decorativo)
   ================================ */
.logo-glitch{position:relative;display:inline-block;animation:glitch-glow .8s ease-in-out infinite}
.logo-glitch::before,
.logo-glitch::after{
  content:attr(alt);
  position:absolute;left:0;top:0;width:100%;
  overflow:hidden;clip:rect(0,900px,0,0)
}
.logo-glitch::before{animation:glitch-rgb-1 .8s linear infinite;color:#aaf0ff}
.logo-glitch::after{animation:glitch-rgb-2 .8s linear infinite;color:#aaf0ff}
@keyframes glitch-glow{
  0%{filter:drop-shadow(0 0 2px #aaf0ff) drop-shadow(0 0 4px #aaf0ff)}
  25%{filter:drop-shadow(0 0 6px #aaf0ff) drop-shadow(0 0 10px #aaf0ff)}
  50%{filter:drop-shadow(0 0 12px #aaf0ff) drop-shadow(0 0 18px #aaf0ff)}
  75%{filter:drop-shadow(0 0 6px #aaf0ff) drop-shadow(0 0 10px #aaf0ff)}
  100%{filter:drop-shadow(0 0 2px #aaf0ff) drop-shadow(0 0 4px #aaf0ff)}
}
@keyframes glitch-rgb-1{
  0%{clip:rect(0,9999px,0,0);transform:translate(-2px,-1px)}
  20%{clip:rect(10px,9999px,70px,0);transform:translate(2px,1px)}
  40%{clip:rect(5px,9999px,60px,0);transform:translate(-1px,0)}
  60%{clip:rect(15px,9999px,90px,0);transform:translate(1px,-1px)}
  100%{clip:rect(0,9999px,0,0);transform:translate(0,0)}
}
@keyframes glitch-rgb-2{
  0%{clip:rect(0,9999px,0,0);transform:translate(2px,1px)}
  20%{clip:rect(15px,9999px,80px,0);transform:translate(-2px,0)}
  40%{clip:rect(25px,9999px,100px,0);transform:translate(1px,1px)}
  60%{clip:rect(5px,9999px,50px,0);transform:translate(-1px,0)}
  100%{clip:rect(0,9999px,0,0);transform:translate(0,0)}
}

/* ================================
   [BLOCCO 99] NOTE
   - Footer rimosso da questo file per evitare conflitti.
   - Gestisci il footer in /style.css [BLOCCO 30] o in /assets/css/footer.css.
   ================================ */
