/* Gemeinsame Styles für alle Projektdetailseiten */

.project-header {
  padding-top: 120px;
  padding-bottom: 16px;
  text-align: center;
}

.project-header h1 {
  font-size: 2.5rem;
  color: white;
  margin-bottom: 16px;
}

.project-desc {
  font-size: 1.2rem;
  color: #c9d1d9;
  max-width: 800px;
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
}

/* Alle Projekt-Sektionen haben dieselbe Box-Optik */
.project-code,
.project-install,
.project-start,
.project-controls,
.project-features,
.project-code-overview,
.project-highscore,
.project-troubleshooting,
.project-license {
  background: rgba(30, 30, 40, 0.3);
  border: 2px solid white;
  border-radius: 12px;
  padding: 24px;
  margin: 24px auto;
  max-width: 800px;
  text-align: left;
}

.project-code h2,
.project-install h2,
.project-start h2,
.project-controls h2,
.project-features h2,
.project-code-overview h2,
.project-highscore h2,
.project-troubleshooting h2,
.project-license h2 {
  color: white;
  margin-bottom: 12px;
  font-size: 1.5rem;
}

/* Links */
.project-code a { color: #58a6ff; text-decoration: underline; font-weight: bold; font-size: 1.1rem; }
.project-code a:hover { color: #79c0ff; }
.project-code ul { list-style: none; padding-left: 0; margin: 0; }

/* Code-Blöcke */
.project-install code,
.project-start code,
.project-code-overview code {
  background: #21262d;
  color: #58a6ff;
  padding: 2px 6px;
  border-radius: 6px;
  font-size: 1rem;
}

/* Listen */
.project-install ol,
.project-start ol,
.project-features ol { margin-left: 20px; margin-bottom: 16px; }
.project-install li,
.project-start li,
.project-features li { margin-bottom: 12px; font-size: 1.1rem; }
.project-features ul,
.project-code ul { list-style: none; padding-left: 0; }
.project-features li,
.project-highscore ul,
.project-troubleshooting ul { font-size: 1.1rem; }
.project-code-overview ul { margin-bottom: 8px; }
.project-license p { font-size: 1.1rem; }

/* Tabelle (Steuerung) */
.project-controls table { width: 100%; border-collapse: collapse; margin-top: 8px; }
.project-controls th,
.project-controls td { padding: 8px; text-align: left; font-size: 1.1rem; }
.project-controls th { color: #58a6ff; }

/* Responsive */
@media (max-width: 900px) {
  .project-header,
  .project-code,
  .project-install,
  .project-start,
  .project-controls,
  .project-features,
  .project-code-overview,
  .project-highscore,
  .project-troubleshooting,
  .project-license {
    max-width: 98vw;
    padding: 18px;
    margin: 18px auto;
  }
  .project-header h1 { font-size: 2rem; }
}

@media (max-width: 600px) {
  .project-header h1 { font-size: 1.3rem; }
  .project-desc { font-size: 1rem; }
  .project-code,
  .project-install,
  .project-start,
  .project-controls,
  .project-features,
  .project-code-overview,
  .project-highscore,
  .project-troubleshooting,
  .project-license {
    padding: 10px;
    margin: 10px auto;
    max-width: 85vw;
  }
  .project-controls th,
  .project-controls td { font-size: 0.9rem; padding: 6px; }
}