/* =========================
   BASIS
========================= */
html { font-size:16px; }
body{
  margin:0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size:1rem;
  line-height:1.6;
  color:#000;
  background:#ffffff;
}

a{
  color:teal;
  font-weight:600;
  text-decoration:none;
}
a:hover{ text-decoration:underline; }

img{ max-width:100%; height:auto; display:block; }

/* =========================
   HEADER
========================= */
.site-header { 
  background: none; 
}

.header-top{
  display:flex;
  justify-content:flex-end;
  padding:0.6rem;
  background:#e1e1e1;
}

/* Header main: Logo + Services als gleich breite Spalten */
.header-main{
  display:flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  padding: 1.5rem;
}

.logo, .services {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.logo img{ width:6.8rem; }

.services h1{
  font-size:1.2rem;
  margin:0.2rem 0;
  color:#777;
  font-weight:600;
  letter-spacing:0.04em;
  text-align:center;
}

/* =========================
   CONTENT
========================= */
.content{
  max-width:55rem;
  margin:auto;
  padding:1.5rem;
}

/* =========================
   ACCORDION
========================= */
.accordion-item{
  border-bottom:1px solid #ddd;
  padding:1.6rem 0;
}

.headline{ font-size:1.4rem; font-weight:700; margin-bottom:0.2rem; }

/* DATE */
.date {
  font-size: 0.8rem;
  color: #777;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0.3rem 0 0.7rem 0;

  border-bottom: 1px solid teal;
  padding-bottom: 0.2rem;
  display: inline-block;
}

.abstract{ font-size:0.95rem; color:#555; margin-bottom:0.8rem; }

/* FULLTEXT / TOGGLE */
.fulltext{
  max-height:0;
  overflow:hidden;
  transition:max-height 0.35s ease;
  margin-top:0.6rem;
}

.fulltext.open{
  max-height:2000rem; /* groß genug für langen Artikel */
}

.toggle{
  width:100%;
  background:#056e70;
  color:#fff;
  border:none;
  border-radius:0.3rem;
  padding:0.8rem 1rem;
  font-size:0.95rem;
  font-weight:600;
  text-align:left;
  cursor:pointer;
  transition:background 0.2s ease;
}

.toggle:hover{ background:#045c5e; }

.toggle::before{
  content:"▼ ";
  display:inline-block;
  margin-right:0.2rem;
  transition:transform 0.25s ease;
}

.toggle.active::before{ transform:rotate(-180deg); }

/* Close-Button am Ende des Artikels */
.close-article{
  display:none;
  width:100%;
  background:#e15656; /* andere Farbe */
  color:#fff;
  border:none;
  border-radius:0.3rem;
  padding:0.8rem 1rem;
  font-size:0.95rem;
  font-weight:600;
  text-align:left;
  cursor:pointer;
  margin-top:1rem;
}

.close-article::before{
  content:"▲ ";
  display:inline-block;
  margin-right:0.2rem;
}

/* SIGNATURE */
.signature{ text-align:center; margin-top:1.2rem; }

/* =========================
   FOOTER
========================= */
.site-footer{
  margin-top:2rem;
}

.footer-top{
  display:flex;
  justify-content:left;
  padding:0.6rem;
  background:#e1e1e1;
}

.footer-contact{
    max-width: 55rem;
    margin: auto;  
   padding: 1.3rem;
}
.footer-contact p{ font-size:0.9rem; }

/* =======================
     FÜR IMPRESSUM
======================== */

.impressum.content {
  margin-top:0.6rem;
}



/* =========================
   LISTS
========================= */
ul{ 
    padding-left: 0rem;
    list-style:none; }
ul li{
  position: relative;
  margin-bottom:0.3rem;
  padding-left:1.5rem;
}
ul li::before{
  content:"■";
  position:absolute;
  left:0;
  top:0.1em;
  font-size:1.2rem;
  color:#056e70;
  line-height:1;
}

.header-link{
font-size: 1rem;
margin-right: 10px;
padding-top: 11px; 
    }
h3 {
    font-size:1.2rem;
    font-weight:500;
    color:#056e70;
    }   

/* =========================
   RESPONSIVE
========================= */
@media (max-width:700px){

  .header-main{
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    gap:1rem;
    padding-left:1rem;
  }
  .logo img{ width:5.4rem; }

  .corner-logo{ width:2.2rem; }

.header-link{
font-size: 0.8rem;
margin-right: 10px;
padding-top: 5px; 
    }


  .services h1{ font-size:1.1rem; }

 

  .headline{ font-size:1.25rem; }
  .date{ font-size:0.75rem; margin:0.2rem 0 0.5rem 0; }
  .abstract{ font-size:0.9rem; }
  .toggle{ font-size:1rem; padding:1rem; }

  .footer-contact p{ font-size:0.85rem; }
}