/* Header mit hellgrünem Balken + horizontale Navigation */
.site-header{background:var(--brand-green); border-bottom:1px solid #b7dcbc}
.site-header .topbar{padding:18px 0; text-align:center; font-weight:700; font-size:28px}
.site-nav{
  background:#eef6ef; border-top:1px solid #dbeedd; border-bottom:1px solid #dbeedd;
}
.site-nav .nav{
  display:flex; gap:28px; justify-content:center; align-items:center;
  padding:12px 0; flex-wrap:wrap;
}
.site-nav .nav a{
  padding:6px 8px; border-radius:6px; color:#1f2937;
}
.site-nav .nav a.active, .site-nav .nav a:hover{background:#e6f4e7}

/* Hauptbereich in Karten-Spalten wie im Screenshot: links Text, Mitte Tool, rechts Login */
.page-grid{
  display:grid; gap:20px; padding:24px 0;
  grid-template-columns: 1.2fr 1.4fr 1.1fr;   /* 3 Spalten */
}
@media (max-width:980px){ .page-grid{grid-template-columns:1fr; }}

/* Karten */
.card{
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:18px; box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.card h2, .card h3{margin:0 0 12px}

/* Footer */
.site-footer{
  background:var(--brand-green); margin-top:24px; border-top:1px solid #b7dcbc;
}
.site-footer .foot{padding:12px 0; text-align:center; font-size:14px; color:#334155}