/* Dark Layout bleibt gleich */
body { background: #111; color: #fff; font-family: 'Arial', sans-serif; margin:0; padding:0; }
header { background:#222; padding:20px; text-align:center; }

/* Akzentfarben → GOLD */
header h1 { color: #C8A24A; font-size:2.5rem; }
header nav a { color:#C8A24A; margin:0 15px; text-decoration:none; font-weight:bold; transition:0.3s; }
header nav a:hover { color:#fff; }

main { padding:20px; }
main h2 { text-align:center; color:#C8A24A; margin-bottom:30px; }

.gallery { display:grid; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap:25px; }
.card { background:#222; border-radius:15px; overflow:hidden; box-shadow:0 5px 15px rgba(0,0,0,0.5); transition:0.3s; }
/* Pinker Hover-Schatten → goldener Schimmer */
.card:hover { transform: scale(1.05); box-shadow:0 10px 20px rgba(200,162,74,0.6); }

.img-container { position:relative; }
.img-container img { width:100%; display:block; border-radius:15px; }

.overlay {
  position:absolute;
  bottom:0;
  width:100%;
  padding:15px;
  background: linear-gradient(transparent, rgba(0,0,0,0.8));
  color:#fff;
  opacity:0;
  transition:0.3s;
  text-align:center;
}
.img-container:hover .overlay { opacity:1; }

/* Overlay-Titel → Gold */
.overlay h3 { font-size:1.3rem; margin:0; color:#C8A24A; }
.overlay p { margin:5px 0 0; font-size:0.9rem; }

footer { text-align:center; padding:15px; background:#222; color:#888; margin-top:30px; }

input, button { display:block; margin:10px 0; padding:10px; width:100%; max-width:400px; border-radius:5px; border:none; }
/* Buttons → Gold + dunklerer Hover */
button { background:#C8A24A; color:#111; cursor:pointer; font-weight:bold; transition:0.3s; }
button:hover { background:#B8923F; color:#111; }