.page-headinghandbuch {
  font-size: 2.2em;
  margin-top: 9.5vw;
  margin-left: 12vw;
  text-align: left;
  color: #de800e;
}

.page-subheadinghandbuch {
  font-size: 1.7em;     /* etwas kleiner als die Hauptüberschrift */
  margin-top: -2vw;
  margin-bottom: -3vw;
  margin-left: 12vw;
  text-align: left;   /* mittig */
  color: #444;          /* etwas helleres Grau */
  font-weight: normal;  /* dezenter als h2 */
}

/* //////////////////////////////////////////////////////////////////////////////////////////////// Footer Space */

.footer-spacer-handbücher {
  height: 7vw;  /* Abstand in Höhe */
}

/*.----------------------------------------------- Inhaltsverzeichnis */

/* eingerückte Unterpunkte */
.product-description details ul {
  font-size: 1em;
  color: #666;
  margin-top: 1.5em;
}

.product-description summary {
  display: inline-block;    /* schrumpft auf Textbreite */
  position: relative;
  cursor: pointer;
  font-weight: bold;
}

.product-description summary::after {
  content: "▼";
  position: absolute;
  left: 50%;
  transform: translateX(-50%); /* mittig unter Text */
  bottom: -1.5em;              /* Abstand nach unten */
  font-size: 0.8em;
  color: #de800e;
  transition: transform 0.25s ease;
}

/* wenn aufgeklappt: Pfeil nach oben */
.product-description details[open] summary::after {
  transform: translateX(-50%) rotate(180deg);
}

/*.----------------------------------------------- abstand extra point */

#extra-point {
  margin-top: 2.5em; /* mehr Abstand nur bei Produkt 1 */
}

/*.----------------------------------------------- Inhaltsverzeichnis offen */

.product-description details ul {
  margin: 1.5em 0 0 1.5em;
  font-size: 1em;
  color: #444;
  list-style-type: none; /* Browser-Bullets ausblenden */
  padding-left: 0;
}

.product-description details ul ul {
  margin: 0.4em 0 0.4em 1.5em;
  font-size: 0.95em;
  color: #555;
}

/*.----------------------------------------------- SPRUNG zum Handbuch 1 grün leuchten */

html {
  scroll-behavior: smooth;  /* weiches Scrollen */
  scroll-padding-top: 12vw; /* Höhe deines fixierten Headers */
}

/* Normalzustand */
.product-title {
  color: #444;              /* ganz normales Grau */
  position: relative;
  display: inline-block;
}

/* Nur wenn angesprungen: Effekt aktiv */
#handbuchv0101:target .product-title {
  background-image: linear-gradient(
    90deg,
    #444 0%,
    #444 45%,
    #de800e 50%,
    #444 55%,
    #444 100%
  );
  background-size: 200% 100%;
  background-position: 100% 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent; /* damit nur der Verlauf sichtbar ist */
  animation: sweepText 1.6s ease forwards;
}

/* Keyframes: grüner Streifen fährt durch */
@keyframes sweepText {
  from { background-position: 100% 0; }
  to   { background-position: 0 0; }
}

/* Nach der Animation automatisch zurücksetzen */
#handbuchv0101:target .product-title {
  animation: sweepText 1.6s ease forwards, resetColor 0s linear 1.6s forwards;
}

@keyframes resetColor {
  to {
    background: none;
    -webkit-text-fill-color: #444;
    color: #444;
  }
}

/*.----------------------------------------------- SPRUNG zum Handbuch 1,2 grün leuchten */

/* Effekt-Klasse für „beide leuchten“ (JS setzt/entfernt sie kurz) */
.sweep-once {
  background-image: linear-gradient(90deg,#444 0%,#444 45%,#de800e 50%,#444 55%,#444 100%);
  background-size: 200% 100%;
  background-position: 100% 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: sweepText 1.6s ease forwards, resetColor 0s linear 1.6s forwards;
}


/* //////////////////////////////////////////////////////////////////////////////////////////////// SeitenNavigation */

.pagination {
  display: flex;
  justify-content: space-between;   /* verteilt: links = Zahlenblock, rechts = "nächste Seite" */
  align-items: center;
  margin-top: 3.5vw;                  /* Abstand nach oben */
  font-size: 1em;                   /* Grundgröße Schrift */
  font-family: Arial, sans-serif;
  padding: 0 2vw;                   /* Abstand rechts/links relativ zur Bildschirmbreite */
}

.page-numbers {
  display: flex;
  gap: 0.5em;                         /* Abstand zwischen 1 und 2 */
  margin: 0 auto;                   /* Block mittig */
}

.pagination a {
  color: #333;
  text-decoration: none;
  padding: 0.2em 0.8em;             /* Innenabstand relativ zur Schriftgröße */
  border-radius: 0.3em;
  transition: background-color 0.2s ease;
}

.pagination a:hover {
  background-color: rgba(0,0,0,0.05);
}

.pagination a.active {
  font-weight: bold;
  text-decoration: underline;
  color: #de800e;                    /* aktive Zahl orange */
}

.page-subheading-alt {
  font-size: 1.3em;     /* etwas kleiner als die Hauptüberschrift */
  margin-top: 3vw;
  margin-bottom: -2vw;
  margin-left: 16vw;
  text-align: left;   /* mittig */
  color: #444;          /* etwas helleres Grau */
  font-weight: normal;  /* dezenter als h2 */
}