/* ===========================
   HEADER – robust (namespaced)
   =========================== */


.site-header{
  background: linear-gradient(
    to bottom,
    #4c545b,
    #3f464c
  );
  box-shadow: 0 3px 8px rgba(218, 14, 14, 0.25);
  border-bottom:1ch solid #111;
}

.site-header{
  box-shadow: 0 2px 6px rgba(0,0,0,0.35);
}

.site-header .header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px 20px;
}

/* links: Logo */
.site-header .brand{
  display:flex;
  align-items:center;
  gap:0;              /* nachdem du den Text entfernt hast */
  text-decoration:none;
  flex:0 0 180;
}

.site-header .brand img{
  height:70px;        /* dein größerer Wert */
  width:auto;
  display:block;
}

/* Mitte: Titel */

.site-header .site-title{
  margin:0;
  flex:1;
  text-align:center;
  font: 3rem/1.1 Arial, Helvetica, sans-serif;
  font-weight:600;
  letter-spacing:1px;
  color:#c8f500; /* weicheres Grün */
  text-shadow: 0 2px 6px rgba(0,0,0,0.35);
}

.site-header .site-title span{
  color:#d8ff00;
}

.site-header .site-title span{
  color:#d8ff00;
}
/* rechts: Links */
.site-header .header-links{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:6px;
  flex:0 0 180;
}

.site-header .header-links a{
  font: 1.35rem/1.2 Arial, Helvetica, sans-serif;  /* größer */
  font-weight:500;
  color:#adbae4;
  text-decoration:none;
}

.site-header .header-links a:hover{
  color:#ffffff;
  text-decoration:underline;
}

/* Tablet */
@media (max-width: 900px){
  .site-header .header-inner{
    flex-wrap:wrap;
  }

  .site-header .site-title{
    order:3;
    flex:1 1 100%;
    text-align:left;
    font-size:2.2rem;
  }

  .site-header .header-links{
    align-items:flex-start;
  }
}