/* ==========================================================================
   GUTENBERG BASIS-CSS FÜR CUSTOM THEMES
   ========================================================================== */

/* --- 1. Allgemeine Ausrichtungen --- */
.alignnone { margin-bottom: 1.5em; }
.aligncenter { clear: both; display: block; margin: 0 auto 1.5em; text-align: center; }
.alignleft { float: left; margin: 0 1.5em 1.5em 0; }
.alignright { float: right; margin: 0 0 1.5em 1.5em; }

/* --- 2. Spalten (Columns) - Behebt dein Hauptproblem --- */
.wp-block-columns {
    display: flex;
    margin-bottom: 1.75em;
    box-sizing: border-box;
    flex-wrap: wrap; /* Auf mobilen Geräten umbrechen */
    gap: 2em; /* Standard-Abstand zwischen Spalten */
}

.is-vertically-aligned-center {
  align-self: anchor-center;
}

/* Ab Tablet-Breite nebeneinander anzeigen */
@media (min-width: 782px) {
    .wp-block-columns {
        flex-wrap: nowrap;
    }
}

.wp-block-column {
    flex-grow: 1;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: break-word;
}

/* --- 3. Bilder & Galerien --- */
.wp-block-image { margin-bottom: 1.5em; }
.wp-block-image img {
    height: auto;
    max-width: 100%;
    vertical-align: bottom;
}

.wp-block-gallery {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none;
    padding: 0;
    gap: 1em;
}
.wp-block-gallery .wp-block-image {
    margin-bottom: 0;
    width: calc(50% - 0.5em); /* 2 Spalten als Standard für Galerien */
}

/* --- 4. Medien und Text (Media & Text) --- */
.wp-block-media-text {
    display: grid;
    grid-template-columns: 1fr; /* Mobile: Untereinander */
    gap: 2em;
    margin-bottom: 1.5em;
}

@media (min-width: 782px) {
    .wp-block-media-text {
        grid-template-columns: 50% 1fr; /* Desktop: Nebeneinander */
        align-items: center;
    }
    .wp-block-media-text.has-media-on-the-right {
        grid-template-columns: 1fr 50%;
    }
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
        grid-column: 2;
        grid-row: 1;
    }
}

.wp-block-media-text__media img {
    max-width: 100%;
    height: auto;
}

/* --- 5. Trennzeichen (Separator) --- */
.wp-block-separator {
    border: none;
    border-bottom: 1px solid #ccc;
    margin: 2em auto;
}
.wp-block-separator.is-style-wide {
    border-bottom-width: 2px;
}
.wp-block-separator.is-style-dots {
    background: none;
    border: none;
    text-align: center;
    max-width: none;
    line-height: 1;
    height: auto;
}
.wp-block-separator.is-style-dots::before {
    content: "\00b7 \00b7 \00b7";
    color: currentColor;
    font-size: 2em;
    letter-spacing: 1em;
    padding-left: 1em;
}

/* --- 6. Zitate (Quotes) --- */
.wp-block-quote {
    border-left: 4px solid #000;
    padding-left: 1em;
    margin: 1.5em 0;
}
.wp-block-quote cite,
.wp-block-quote footer {
    font-size: 0.8em;
    font-style: normal;
    opacity: 0.7;
}

.wp-block-pullquote {
    border-top: 4px solid #000;
    border-bottom: 4px solid #000;
    padding: 2em 0;
    text-align: center;
    margin: 2em 0;
}