/* Grundwerte: 80px im ZU-Zustand */
.sf-readmore { --collapsed-h: 110px; position: relative; }

.sf-readmore__content { position: relative; margin-bottom: .75rem; }

/* ZU-Zustand: nur die ersten 80px sichtbar */
.sf-readmore--collapsed .sf-readmore__content-inner{
  max-height: var(--collapsed-h);
  overflow: hidden;
}

/* Fade-Overlay unten, solange zugeklappt */
.sf-readmore--collapsed .sf-readmore__content::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height: 3.5em;
  pointer-events:none;
  background: linear-gradient(to bottom, rgba(255,255,255,0), var(--fade-bg, #f6f6f6));
}

/* Button sicher sichtbar halten (gegen Bootstrap-Resets) */
.wp-block-sf-readmore-fade .sf-readmore__toggle,
.sf-readmore .sf-readmore__toggle{
  display:inline-flex !important;
  align-items:center !important;
  gap:.5rem !important;
  padding:.8px 18px !important;
  border-radius:.5rem !important;
  border:1px solid rgba(0, 0, 0, 0.05) !important;
  background:rgba(0, 0, 0, 0.05)D !important;
  color:#000 !important;
  text-decoration:none !important;
  cursor:pointer !important;
  margin-top:1rem;
	margin-bottom:2rem;
}
.sf-readmore__toggle:hover{ opacity:.92; }
.sf-readmore__toggle:focus-visible{ outline:3px solid #0F313D; outline-offset:3px; }
