/* ==========================================================================
   Spreckelsen — Seite "Manufaktur" (Seitenvorlage "page-manufaktur.php").
   Redesign der bisherigen Gutenberg-Block-Version (gleiche Inhalte/Bilder,
   Text, Reihenfolge) im einheitlichen Seiten-Stil: Marine #002e47 + Gold
   #b08a4e, Playfair Display kursiv für Überschriften, Open Sans für
   Fließtext. Wird nur auf page-manufaktur.php geladen (is_page_template-
   Prüfung in page-manufaktur.php).
   ========================================================================== */

.sh-mf-wrap {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 20px 80px;
}

/* ---- Banner-Bild (oben) ----
   Liegt im Markup (page-manufaktur.twig) bewusst AUSSERHALB von .sh-mf-wrap,
   direkt im echten Seitencontainer "#main.container" (width:100%,
   max-width:none, padding 24px) — dadurch füllt es automatisch dessen
   volle Breite, genau wie der Rest der Seite, ganz ohne 100vw-Trick. */
.sh-mf-hero {
    margin: 0 0 56px;
}

.sh-mf-hero-img {
    display: block;
    width: 100%;
    height: auto;
}

/* ---- Seitentitel + Unterzeile ---- */
.sh-mf-heading-row {
    text-align: center;
    margin-bottom: 56px;
}

.sh-mf-heading {
    font-family: 'Playfair Display', serif;
    font-weight: 500;
    font-size: 44px;
    color: #002e47;
    margin: 0 0 14px;
}

.sh-mf-heading em,
.sh-mf-section-title em {
    font-style: italic;
}

.sh-mf-subheading {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    letter-spacing: .4px;
    color: #b08a4e;
    line-height: 1.6;
    margin: 0;
}

/* ---- Bildreihen zwischen den Textabschnitten: kein Abstand
   (wie im Original: .no-gap { gap:0; margin-bottom:0; }); die Bilder
   behalten ihr natürliches Seitenverhältnis (keine Beschnitt-Kacheln). ---- */
.sh-mf-images {
    display: grid;
    gap: 0;
    margin-bottom: 60px;
}

.sh-mf-images--1 {
    grid-template-columns: 1fr;
}

.sh-mf-images--2 {
    grid-template-columns: repeat(2, 1fr);
}

.sh-mf-images-item img {
    display: block;
    width: 100%;
    height: auto;
}

/* ---- Textabschnitte: Titel + Fließtext auf Creme-Hintergrund ---- */
.sh-mf-section {
    max-width: 860px;
    margin: 0 auto 60px;
    padding: 48px 50px;
    background: #faf5f0;
    text-align: center;
}

.sh-mf-section-title {
    font-family: 'Playfair Display', serif;
    font-weight: 500;
    font-size: 28px;
    color: #002e47;
    margin: 0 0 22px;
}

.sh-mf-text {
    font-family: 'Open Sans', sans-serif;
    font-size: 15.5px;
    line-height: 1.85;
    color: #3d3d3d;
    margin: 0;
}

/* ---- Mobil ---- */
@media (max-width: 860px) {
    .sh-mf-heading {
        font-size: 32px;
    }
    .sh-mf-section-title {
        font-size: 22px;
    }
    .sh-mf-section {
        padding: 36px 24px;
    }
    .sh-mf-images--2 {
        grid-template-columns: 1fr;
    }
}