
.base p {
    margin-bottom: 2px;
    font-weight: bolder;
}

.base p span {
    margin-bottom: 2px;
    font-weight: normal;
}

.slick-slider {
    touch-action: auto !important;
}

/* Headline-Bereich */
.page-head {
text-align: center;
padding: 40px 16px 24px;
}

/* Zeile mit Linien links/rechts von der Überschrift */
.page-head__row {
display: flex;
align-items: center;
gap: 16px;
justify-content: center;
margin-bottom: 10px;
}

/* Die Zierlinien – mit sanften Ausblendungen an den Enden */
.page-head__line {
height: 1px;
flex: 1 1 120px;          /* wächst, bleibt aber auf kleinen Screens kurz */
max-width: 360px;
background: linear-gradient(to right, transparent 0, currentColor 20%, currentColor 80%, transparent 100%);
opacity: 0.6;
}

/* Die Zierlinien – mit sanften Ausblendungen an den Enden */
.page-head__line_white {
height: 1px;
flex: 1 1 120px;          /* wächst, bleibt aber auf kleinen Screens kurz */
max-width: 360px;
background: linear-gradient(to right, transparent 0, currentColor 20%, currentColor 80%, transparent 100%);
opacity: 0.6;
color: #000;
}

/* Überschrift – gern serifenbetont, sonst erbt die Theme-Schrift */
.page-head__title {
font-family: "Garamond", Georgia, "Times New Roman", serif; /* falls vorhanden */
font-weight: 800;
font-size: clamp(28px, 4vw, 56px);
letter-spacing: .5px;
margin: 0;
line-height: 1.15;
color: #111; /* ggf. an dein Theme anpassen */
transform: scaleX(0.90);
}

/* Untertitel */
.page-head__subtitle {
font-family: "Garamond", Georgia, "Times New Roman", serif;
font-style: italic;
font-size: clamp(16px, 1.8vw, 22px);
margin: 0;
color: #706f6fff;
}

/* Feintuning auf sehr kleinen Bildschirmen */
@media (max-width: 480px) {
.page-head__row { gap: 10px; }
.page-head__line { flex-basis: 80px; }
}

/* Alle Ziel-Sektionen auf index.php bekommen einen oberen "Scrollpuffer"
   (damit der fixe Header sie nicht überdeckt) */
#geschichte, #leistungen, #glossar, #bewertungen, #wallpaper, #kontakt {
  scroll-margin-top: 90px;  /* ggf. auf 100–110px anpassen, wenn euer Header höher ist */
}
.pe-3 {
font-weight: bolder;
}

#toTopBtn {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 99;
  font-size: 24px;
  border: none;
  outline: none;
  background: #222;
  color: white;
  cursor: pointer;
  padding: 10px 17px;
  border-radius: 50%;
  box-shadow: 0 4px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0;
  pointer-events: none;
}

#toTopBtn:hover {
  background: #555;
  transform: translateY(-3px) scale(1.05);
}

/* sichtbar, wenn aktiv */
#toTopBtn.show {
  opacity: 1;
  pointer-events: auto;
}