* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body {
  height: 100%;
  font-family: 'Segoe UI', sans-serif;
}

.overlay {
  background-image: url('3d_mockup.png'); /* <-- HIER dein Bild */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content {
  background-color: rgba(0, 0, 0, 0.6);
  padding: 40px;
  border-radius: 12px;
  text-align: center;
  color: white;
  max-width: 2560px;
  width: 100%;
}

.content h1 {
  font-size: 32px;
  margin-bottom: 20px;
}

.content p {
  font-size: 18px;
  margin-bottom: 30px;
}

.social-icons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 25px;
}

.social-icons a {
  font-size: 28px;
  text-decoration: none;
  transition: transform 0.2s;
}

/* Farbige Icons */
.social-icons a[aria-label="Instagram"] { color: #e4405f; }
.social-icons a[aria-label="Spotify"] { color: #1DB954; }
.social-icons a[aria-label="SoundCloud"] { color: #ff7700; }
.social-icons a[aria-label="Facebook"] { color: #1877f2; }
.social-icons a[aria-label="Twitch"] { color: #9146ff; }
.social-icons a[aria-label="YouTube"] { color: #ff0000; }
.social-icons a[aria-label="X"] { color: #000000; }
.social-icons a[aria-label="Webshop"] { color: #ff9900; }

.social-icons a:hover {
  transform: scale(1.15);
}