/*  Eigene Korrekturen an der Vorlage.
 *  ---------------------------------------------------------------------
 *  Bewusst in einer eigenen Datei, damit style.css unverändert bleibt und
 *  bei einem Vorlagen-Update ersetzt werden kann. Wird nach style.css
 *  eingebunden und gewinnt deshalb bei gleicher Spezifität.
 */

/* ---------------------------------------------------------------------
 * Angebots-Kacheln (.service-block13)
 *
 * Die geschwungene Kachelform stammt nicht aus CSS, sondern aus einer
 * Rastergrafik (bg-mask1.png / bg-mask2.png, 416 x 453 px), die ohne
 * background-size eingebunden war. Dadurch passte die Form nur bei genau
 * einer Kachelbreite: ab etwa 1320px Fensterbreite. Darunter wurde die
 * Maske rechts abgeschnitten, die Kerbe an der unteren rechten Ecke
 * verschwand und der Pfeil-Knopf stand frei neben der Kachel.
 *
 * Zwei Korrekturen:
 *   1. Die Maske skaliert mit der Kachel, statt starr zu bleiben.
 *   2. Kacheln einer Reihe werden gleich hoch, auch wenn eine Überschrift
 *      umbricht. Das Symbol wird dabei nach unten geschoben, damit es in
 *      allen Kacheln auf gleicher Höhe sitzt.
 * ------------------------------------------------------------------- */

.service-block13 .inner-box .content-box {
   background-size: 100% 100%;
}

.service-block13 {
   display: flex;
}

.service-block13 .inner-box {
   width: 100%;
   display: flex;
   flex-direction: column;
}

.service-block13 .inner-box .content-box {
   flex: 1 1 auto;
   display: flex;
   flex-direction: column;
}

.service-block13 .inner-box .content-box .thumb-icon {
   margin-top: auto;
}

/* ---------------------------------------------------------------------
 * Landingpages
 *
 * Nur die wenigen Bausteine, die das Theme nicht mitbringt: Brotkrumenpfad,
 * Themenkasten für Querverweise und etwas Rhythmus im Fließtext. Alles
 * Übrige (Farben, Schriften, Abstände, Schaltflächen) kommt unverändert
 * aus style.css.
 * ------------------------------------------------------------------- */

.snb-krumen {
   margin-bottom: 26px;
   font-family: var(--text-font, "Plus Jakarta Sans"), system-ui, sans-serif;
   font-size: 13px;
}
.snb-krumen ol {
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
   list-style: none;
   margin: 0;
   padding: 0;
   justify-content: center;
}
.snb-krumen li + li::before {
   content: "›";
   margin-right: 8px;
   color: #b3aca3;
}
.snb-krumen a { color: var(--theme-color1, #781f2f); text-decoration: none; }
.snb-krumen a:hover { text-decoration: underline; }
.snb-krumen [aria-current] { color: #8a7f74; }

.snb-intro { font-size: 17px; line-height: 1.9; }

.snb-abschnitt { padding: 80px 0; }
.snb-abschnitt.is-sand { background: #f5f2e6; }
.snb-abschnitt h2 {
   font-family: var(--title-font, "Cormorant"), Georgia, serif;
   font-weight: 500;
   color: var(--headings-color, #1C1A1D);
   margin-bottom: 22px;
}
.snb-abschnitt h3 {
   font-family: var(--title-font, "Cormorant"), Georgia, serif;
   font-weight: 500;
   font-size: 24px;
   color: var(--headings-color, #1C1A1D);
   margin: 34px 0 14px;
}
.snb-abschnitt p { line-height: 1.95; margin-bottom: 18px; }

.snb-fakten {
   list-style: none;
   margin: 26px 0 0;
   padding: 0;
   border-top: 1px solid #e7e1d8;
}
.snb-fakten li {
   display: flex;
   justify-content: space-between;
   gap: 20px;
   padding: 15px 0;
   border-bottom: 1px solid #e7e1d8;
   line-height: 1.7;
}
.snb-fakten strong { color: var(--headings-color, #1C1A1D); font-weight: 600; }

.snb-teaser {
   height: 100%;
   background: #fff;
   border: 1px solid #e7e1d8;
   border-radius: 4px;
   padding: 30px 30px 26px;
   transition: border-color .25s ease, transform .25s ease;
}
.snb-teaser:hover { border-color: var(--theme-color1, #781f2f); transform: translateY(-3px); }
.snb-teaser h3 {
   margin: 0 0 12px;
   font-family: var(--title-font, "Cormorant"), Georgia, serif;
   font-weight: 500;
   font-size: 23px;
   color: var(--headings-color, #1C1A1D);
}
.snb-teaser p { line-height: 1.85; margin-bottom: 16px; }
.snb-teaser-link {
   display: inline-block;
   color: var(--theme-color1, #781f2f);
   font-size: 13px;
   letter-spacing: .08em;
   text-transform: uppercase;
   text-decoration: none;
   border-bottom: 1px solid currentColor;
   padding-bottom: 2px;
}
.snb-teaser-link:hover { opacity: .75; }

.snb-bild img {
   width: 100%;
   height: auto;
   border-radius: 4px;
   display: block;
}
.snb-bild figcaption {
   font-size: 13px;
   color: #a09890;
   margin-top: 10px;
   line-height: 1.7;
}

.snb-zitat {
   border-left: 3px solid #f5f2e6;
   padding: 6px 0 6px 24px;
   margin: 30px 0;
}
.snb-zitat p { font-style: italic; line-height: 1.95; margin-bottom: 10px; }
.snb-zitat cite { font-style: normal; font-size: 14px; color: #a09890; }

.snb-schluss { padding: 90px 0 100px; background: #f9f6f1; }

/* Sichtbarer Tastaturfokus, im Theme nicht durchgängig vorhanden */
.snb-krumen a:focus-visible,
.snb-teaser-link:focus-visible,
.snb-abschnitt a:focus-visible {
   outline: 2px solid var(--theme-color1, #781f2f);
   outline-offset: 3px;
}

@media (max-width: 767.98px) {
   .snb-abschnitt { padding: 56px 0; }
   .snb-fakten li { flex-direction: column; gap: 4px; }
}

/* ---------------------------------------------------------------------
 * Preisübersicht und Vorstellung auf den Landingpages
 * ------------------------------------------------------------------- */

/* Die Preisangabe im Theme trägt einen hellgrauen Hintergrund, der die
   Punktlinie überdeckt. Damit dieser Kasten nicht sichtbar wird, übernimmt
   die Sektion denselben Ton wie die Preisliste der Startseite. */
.snb-preise { padding: 90px 0 80px; background: #F7F5F4; }
.snb-preise .pricing-block-six .inner-box .content-box .price { background-color: #F7F5F4; }
.snb-preise .pricing-block-six.is-fokus .inner-box .content-box .price { background-color: #f9f6f1; }
.snb-preise .sec-title { margin-bottom: 30px; }

/* Das Format, um das es auf der jeweiligen Seite geht, wird leicht
   hervorgehoben, ohne den ruhigen Gesamteindruck zu stören. */
.snb-preise .pricing-block-six.is-fokus .inner-box {
   background: #f9f6f1;
   box-shadow: inset 3px 0 0 var(--theme-color1, #781f2f);
   border-radius: 2px;
}
.snb-preise .pricing-block-six.is-fokus .content-box { padding-left: 18px; }

.snb-team-koepfe {
   display: flex;
   justify-content: center;
   gap: 46px;
   flex-wrap: wrap;
   margin-bottom: 34px;
}
.snb-team-koepfe figure { margin: 0; text-align: center; }
.snb-team-koepfe img {
   width: 150px;
   height: 150px;
   border-radius: 50%;
   object-fit: cover;
   display: block;
   border: 3px solid #fff;
   box-shadow: 0 8px 26px rgba(120, 31, 47, .12);
}
.snb-team-koepfe figcaption {
   margin-top: 14px;
   font-family: var(--title-font, "Cormorant"), Georgia, serif;
   font-size: 20px;
   color: var(--headings-color, #1C1A1D);
}
.snb-team-text {
   line-height: 1.95;
   margin-bottom: 18px;
   text-align: center;
}

@media (max-width: 575.98px) {
   .snb-team-koepfe { gap: 28px; }
   .snb-team-koepfe img { width: 118px; height: 118px; }
   .snb-team-text { text-align: left; }
}

/* Auf schmalen Bildschirmen reicht die Breite nicht für Titel und Preis
   nebeneinander, der Betrag brach hinter dem Komma um. Dort rückt der Preis
   unter den Titel; die gestrichelte Führungslinie entfällt, weil sie ohne
   Gegenstück ins Leere liefe. */
@media (max-width: 575.98px) {
   .snb-preise .pricing-block-six .inner-box .content-box {
      display: block;
   }
   .snb-preise .pricing-block-six .inner-box .content-box .inner .title::after {
      display: none;
   }
   .snb-preise .pricing-block-six .inner-box .content-box .price {
      display: block;
      padding-left: 0;
      margin-top: 10px;
      white-space: nowrap;
      background: transparent;
   }
   .snb-preise .pricing-block-six.is-fokus .content-box { padding: 4px 14px 10px; }
}

/* ---------------------------------------------------------------------
 * Hero der Startseite
 *
 * Der Bereich lag in einem owl-Karussell mit genau einem Slide. Da
 * .owl-carousel bis zur Initialisierung display:none trägt, war die H1
 * ohne JavaScript nicht vorhanden, und bei einem Skriptfehler blieb sie
 * dauerhaft unsichtbar. Jetzt ist es ein normaler Block; die Abstände
 * kommen unverändert aus .banner-section-eight .slide-item.
 * ------------------------------------------------------------------- */
.banner-static { width: 100%; }