/* -------------------- */
/* 0. Variablen & Setup (FARBSCHEMA WIEDERHERGESTELLT) */
/* -------------------- */
:root {
  /* Farbschema: Dark Mode / Deep Navy */
  --bg-dark: #051220; /* Sehr dunkles Navy */
  --bg-light: #0d2942; /* Etwas helleres Petrol */
  --primary: #238ad2; /* Dein ursprüngliches Hellblau als Akzent */
  --accent: #3da9f5; /* Noch helleres Blau für Hover */

  --glass-dark: rgba(10, 25, 41, 0.85); /* Dunkler Glas-Hintergrund für Boxen */
  --glass-border: rgba(255, 255, 255, 0.15); /* Feine helle Kante */

  --text-main: #ffffff;
  --text-muted: rgba(255, 255, 255, 0.8);
}

/* ========================================= */
/* Impressum & Datenschutz - Clean Version  */
/* ========================================= */

/* Reduzierte Section-Abstände */
.impressum,
.datenschutz,
.bildnachweis {
  max-width: 800px;
  margin: 20px auto !important; /* Reduziert + überschreibt global */
  padding: 30px;
  /* KORREKTUR: rgba(0, 0, 0, 0.6) ersetzt durch Variable */
  background-color: var(--glass-dark);
  border-radius: 12px;
  text-align: left;
  word-wrap: break-word;
}

/* Überschriften - Überschreiben der globalen Styles */
.main .impressum h2,
.main .datenschutz h2,
.main .bildnachweis h2 {
  font-size: 28px !important;
  font-weight: bold;
  margin-bottom: 20px;
  text-align: left;
  word-break: break-word;
}

.impressum p,
.datenschutz p,
.datenschutz ul,
.bildnachweis ul {
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 12px;
  /* KORREKTUR: #fff ersetzt durch Variable */
  color: var(--text-main);
}

.datenschutz ul,
.bildnachweis ul {
  list-style: disc;
  padding-left: 20px;
}

.datenschutz ul li,
.bildnachweis ul li {
  margin-bottom: 6px;
}

/* Links im Impressum - WEISS wie global */
.impressum a,
.datenschutz a,
.bildnachweis a {
  /* KORREKTUR: #fff ersetzt durch Variable */
  color: var(--text-main);
  font-weight: 400;
  text-decoration: none;
}

.impressum a:hover,
.datenschutz a:hover,
.bildnachweis a:hover {
  /* KORREKTUR: #fff ersetzt durch Variable */
  color: var(--text-main);
  font-weight: bold;
  text-decoration: underline;
  text-underline-offset: 3px;
}



.bildnachweis .button-back {
  display: inline-block;
  margin-top: 20px;
  padding: 12px 25px;
  background-color: var(--bg-light);
  border: solid 1px var(--primary);
  border-radius: 20px !important;
  color: #fff !important;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s;
  cursor: pointer;
  /* Wichtig: display: flex setzen, wenn es ein 'a' wäre, aber als 'button' geht inline-block */
}

.bildnachweis .button-back:hover {
  background: var(--accent);
  border-color: var(--accent);
  animation: none;
  font-weight: 600;
}

/* ========================================= */
/* H1 Spezifisch für Impressum-Seite       */
/* ========================================= */
.main h1 {
  font-size: 48px;
  text-align: center;
}

/* ========================================= */
/* Responsive - Tablet                      */
/* ========================================= */
@media (max-width: 768px) {
  .impressum,
  .datenschutz,
  .bildnachweis {
    max-width: 90%;
    padding: 25px 20px;
    margin: 15px auto !important;
  }

  /* H2 kleiner als H1 */
  .main .impressum h2,
  .main .datenschutz h2,
  .main .bildnachweis h2 {
    font-size: 24px !important;
  }

  .impressum p,
  .datenschutz p,
  .datenschutz ul,
  .bildnachweis p,
  .bildnachweis ul {
    font-size: 15px;
  }

  .main h1 {
    font-size: 28px;
    margin: 30px 20px 25px 20px;
  }
}

/* ========================================= */
/* Responsive - Kleine Mobile               */
/* ========================================= */
@media (max-width: 375px) {
  .impressum,
  .datenschutz,
  .bildnachweis {
    max-width: 95%;
    padding: 20px 15px;
    margin: 12px auto !important;
  }

  /* H1 größer als H2 */
  .main h1 {
    font-size: 26px;
    margin: 25px 15px 20px 15px;
  }

  .main .impressum h2,
  .main .datenschutz h2,
  .main .bildnachweis h2 {
    font-size: 22px !important;
    line-height: 1.3;
  }

  .impressum p,
  .datenschutz p,
  .datenschutz ul,
  .bildnachweis p,
  .bildnachweis ul {
    font-size: 14px;
  }
}