/* --- Sticky Header für Astra (Free) --- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  background: #ffffff; /* Header-Hintergrundfarbe */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); /* leichter Schatten */
}

/* Verhindert, dass der Header unter Content verschwindet */
body {
  scroll-padding-top: 80px; /* anpassen an deine Headerhöhe */
}

.runde-ecken img {
  border-radius: 20px;   /* z. B. 30px abrunden */
}

.ast-primary-header-bar {
  position: sticky;
  top: 0;
  z-index: 9999;
}

.bildrahmen img {
  border: 20px solid #1F1F1F; /* hellgrau */
  border-radius: 12px; /* optional, für runde Ecken */
  padding: 4px; /* Abstand zum Bild */
}

.linie-bild::after {
  content: "";
  position: absolute;
  top: 50%;              /* Höhe (mittig vom Bild) */
  left: 100%;            /* Startpunkt: direkt rechts vom Bild */
  width: 120px;          /* Länge der Linie */
  height: 2px;           /* Dicke der Linie */
  background-color: #000; /* Farbe */
}

@media (max-width: 600px) {
  .review-text {
    font-size: 16px !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 600px) {
  .adress-text {
    font-size: 22px !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 600px) {
  .header-text {
    font-size: 30px !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 600px) {
  .spacer-mobile-small {
    height: 15px !important;
  }
}

/* Desktop bleibt wie eingestellt */
.smaller-mobile-heading { font-size: inherit; }

/* Mobile Darstellung */
@media (max-width: 768px) {
  h1.smaller-mobile-heading,
  h2.smaller-mobile-heading,
  h3.smaller-mobile-heading,
  .wp-block-heading.smaller-mobile-heading {
    font-size: 2.8rem !important;   /* <- jetzt richtig groß */
    line-height: 1.25;
  }
}

/* Desktop unverändert lassen */
.mobile-edge-image img { max-width: 100%; height: auto; }

/* Mobil: fast randnah mit kleinem Abstand */
@media (max-width: 768px) {
  /* Für Gutenberg-Blocks */
  figure.wp-block-image.mobile-edge-image,
  .mobile-edge-image {
    /* bricht ggf. Container-Breiten nicht auf */
  }

  figure.wp-block-image.mobile-edge-image img,
  .mobile-edge-image img {
    display: block;
    width: calc (100dvw - 12dvw); !important; /* ~3vw Abstand links/rechts */
    max-width: none !important;          /* Theme-Limitierungen aufheben */
    height: auto;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Basis */
.mobile-edge-image img {
  display: block;
  height: auto;
}

/* Mobil: randnah + sauber zentriert */
@media (max-width: 768px) {
  .mobile-edge-image img {
    width: calc(100vw - 12vw) !important; /* Abstand links/rechts ~3vw */
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important; /* ← ZENTRIERT */
  }
}

/* NUR MOBIL */
@media (max-width: 768px) {
  /* Klasse MUSS am Figure/Block hängen: figure.wp-block-image.mobile-edge-image */
  .entry-content figure.wp-block-image.mobile-edge-image,
  .entry-content .wp-block-image.mobile-edge-image {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100dvw - 12dvw);     /* ~3dvw Abstand je Seite */
    max-width: none !important;
    margin: 0 !important;           /* verhindert verschobene Ränder */
  }

  /* Bild selbst füllt die neue Breite */
  .entry-content figure.wp-block-image.mobile-edge-image img,
  .entry-content .wp-block-image.mobile-edge-image img {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 auto !important;      /* zentriert */
  }

  /* Falls ein Columns-Block das Bild einengt */
  .entry-content .wp-block-columns .wp-block-image.mobile-edge-image {
    width: calc(100dvw - 12dvw) !important;
  }

  /* Typische Ausrichtungs-Klassen neutralisieren */
  .wp-block-image.mobile-edge-image.alignleft,
  .wp-block-image.mobile-edge-image.alignright {
    float: none !important;
    margin: 0 !important;
  }
}