:root{--gold:#C9AB6A;--gold-dark:#b49356;--bg:#f8f8f8;--text:#222;--card:#fff}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);margin:0}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.navbar{background:#000;color:#fff}
.navbar .logo{color:var(--gold);text-decoration:none;font-weight:700}
.nav{display:flex;gap:16px;list-style:none;margin:0;padding:16px 0}
.nav a{color:#fff;text-decoration:none}
.nav a:hover{color:var(--gold)}
.card{background:var(--card);margin:16px auto;padding:20px;border-radius:12px;box-shadow:0 3px 8px rgba(0,0,0,.08)}
h1,h2,h3{margin:0 0 12px}
.btn{display:inline-block;background:var(--gold);color:#fff;padding:.6rem 1rem;border-radius:8px;text-decoration:none;border:0;cursor:pointer;font-weight:600}
.btn:hover{background:var(--gold-dark)}
.btn.secondary{background:#444}.btn.secondary:hover{background:#000}
.input{width:100%;padding:.6rem;border:1px solid #ccc;border-radius:6px}
form{display:flex;flex-direction:column;gap:.75rem}
.badge{display:inline-block;background:#e6ffe6;border:1px solid #b5e3b5;color:#245d24;padding:.4rem .6rem;border-radius:6px}
.footer{background:#111;color:#fff;margin-top:32px;padding:16px 0;text-align:center}
@media (max-width:700px){.nav{flex-wrap:wrap}}
/* Logo-Anpassung: dezenter, kleiner, besser ausbalanciert */
.logo img {
  height: 32px;              /* kleiner und dezenter */
  object-fit: contain;
  vertical-align: middle;
  transition: opacity 0.3s ease;
  margin-top: 4px;           /* leicht nach unten versetzt für Balance */
}

.logo img:hover {
  opacity: 0.8;
}

.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 16px;         /* etwas kompakter */
}

@media (max-width: 700px) {
  .logo img {
    height: 26px;            /* kleinere Variante für Mobilgeräte */
    margin-top: 2px;
  }
}
.nav a[href="/anleitung.php"] {
  color: var(--gold);
  font-weight: 600;
}

.nav a[href="/anleitung.php"]:hover {
  color: #fff;
}

.footer .heart {
  margin-left: 6px;
  font-size: 0.95rem;
  color: var(--gold);
}

.footer .emoji {
  color: #e63946; /* schönes, warmes Rot */
}