/* =========================
   HEADER NAME WRAPPER
   ========================= */

#Header_Name {
  width: fit-content;
  margin: 200px auto 200px;
  text-align: center;
}

/* =========================
   HEADER IMAGE (LOGO)
   ========================= */

#Header_Name .header-logo {
  display: block;
  width: 100%;
  max-width: 1200px; /* optional – an dein Bild anpassen */
  height: auto;

  margin: 0 auto;

  opacity: 0.35;
  filter: blur(0.1px) brightness(0.85);

  transition:
    opacity 0.8s ease-in-out,
    filter 0.8s ease-in-out,
    transform 0.8s ease-in-out;
}

/* Hover-Effekt für das Bild */
#Header_Name a:hover .header-logo {
  opacity: 1;
  filter:
    blur(0)
    brightness(1)
   drop-shadow(0 0 12px rgba(121, 32, 61, 0.35)) 
 drop-shadow(0 0 28px rgba(151, 148, 106, 0.25));
	
  transform: scale(1.01);
}


/* =========================
   SUBLINE (TEXT + LINIEN)
   ========================= */

#Header_Name font {
  font-family: 'Wolfpack', 'Times', serif;
  text-transform: uppercase;
  font-size: 15px;
  letter-spacing: 13px;

  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  column-gap: 25px;
  margin-top: -1px;
  transition:
    font-size 0.8s ease-in-out,
    margin-top 0.8s ease-in-out,
    color 0.8s ease-in-out;
}

/* Symmetrische Linien links & rechts */
#Header_Name font::before,
#Header_Name font::after {
  content: "";
  height: 1px;
  flex-grow: 1;
  opacity: 0.6;
}