/*
 * Schaffer Holz – Modernisierung 2026
 * Overlay über dem bestehenden Bridge-Theme: Struktur, Inhalte und Markenfarben
 * bleiben, nur Typografie, Abstände, Header, Karten, Buttons und Footer werden
 * aufgefrischt. Zum Zurücksetzen den <link> auf diese Datei entfernen.
 */

:root {
  --sh-red: #76030e;
  --sh-red-dark: #5a020b;
  --sh-green: #0b7a3e;
  --sh-ink: #25221f;
  --sh-text: #383838;
  --sh-muted: #6b6560;
  --sh-surface: #faf7f4;
  --sh-radius: 14px;
  --sh-shadow: 0 10px 30px rgba(37, 34, 31, 0.12);
  --sh-font-head: "Poppins", "Cabin", system-ui, sans-serif;
}

html { scroll-behavior: smooth; }
::selection { background: var(--sh-red); color: #fff; }

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  color: var(--sh-text);
}

/* Volle Breite statt schmaler Box: horizontales Scrollen verhindern */
.wrapper { overflow-x: clip; }

/* ---------- Typografie ---------- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--sh-font-head);
  letter-spacing: -0.01em;
  color: var(--sh-ink);
}
h1.main-titel {
  color: #fff;
  font-family: var(--sh-font-head);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.35);
}
.content p, .content li { line-height: 1.75; }
.content .wpb_text_column p { max-width: 70ch; }
/* Blocksatz erzeugt ohne Silbentrennung unschöne Lücken */
.content p[style*="justify"] { text-align: left !important; }
.content .wpb_text_column[class*="white"] p { max-width: none; }

a { transition: color .2s ease, background-color .2s ease, opacity .2s ease; }

/* ---------- Header ---------- */
header.page_header .header_bottom {
  background-color: rgba(255, 255, 255, 0.82) !important;
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  backdrop-filter: saturate(180%) blur(14px);
  box-shadow: 0 1px 0 rgba(37, 34, 31, 0.08);
}
nav.main_menu > ul > li > a,
nav.main_menu > ul > li > a span {
  font-family: var(--sh-font-head) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em;
}
nav.main_menu > ul > li > a:hover { color: var(--sh-green) !important; }

nav.main_menu .second .inner {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--sh-shadow);
}
nav.main_menu .second .inner ul { border-radius: 12px; }
nav.main_menu .second .inner li a {
  font-family: var(--sh-font-head);
  font-size: 13px;
  letter-spacing: 0.02em;
}

/* Sprachumschalter */
.wpml-ls-flag {
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
  transition: transform .2s ease;
}
a:hover > .wpml-ls-flag, a:hover .wpml-ls-flag { transform: translateY(-1px) scale(1.08); }

/* ---------- Bildsektionen: volle Breite ---------- */
.content .vc_row.section[style*="background-image"] {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background-size: cover !important;
  background-position: center !important;
}
.content .vc_row.section .section_inner {
  width: 100%;
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Hero: Holzscheibe samt Standfläche zeigen, nicht oben/unten beschneiden */
.content .vc_row.section[data-q_id="#intro"] { background-position: center bottom !important; }

/* Luftigere, aber kompaktere Abstände zwischen den Sektionen */
.content .vc_empty_space[style*="height: 200px"] { height: 90px !important; }

/* Textkarte auf den Fotos (Startseite) */
.content .vc_col-has-fill > .vc_column-inner {
  background-color: rgba(28, 20, 17, 0.58) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-radius: 20px;
  max-width: 780px;
  margin: 0 auto;
  padding: 48px 44px 44px !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
}
.content .vc_col-has-fill h2 {
  font-size: 30px;
  font-weight: 600;
  color: #fff;
}
.content .vc_col-has-fill .wpb_text_column p {
  font-size: 18px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.95);
}

/* ---------- Buttons ---------- */
/* Primärer Button ("Mehr erfahren"): Pfeil, sanfter Verlauf, Druck-Effekt */
a.qbutton,
.qbutton {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--sh-font-head) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  min-height: 48px;
  height: auto !important;
  line-height: 1.2 !important;
  padding: 14px 32px !important;
  border-radius: 12px !important;
  border: 0 !important;
  background: linear-gradient(135deg, #8d0516 0%, var(--sh-red) 60%) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(118, 3, 14, 0.28);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease !important;
}
a.qbutton::after {
  content: "\2192";
  font-size: 1.15em;
  transition: transform .25s ease;
}
a.qbutton:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: 0 12px 24px rgba(118, 3, 14, 0.36);
}
a.qbutton:hover::after { transform: translateX(5px); }
a.qbutton:active { transform: translateY(0); box-shadow: 0 4px 10px rgba(118, 3, 14, 0.3); }

/* Download-Buttons (PDF): Karte mit Icon-Kreis */
a.qode-btn {
  /* inline-flex statt flex: die Ausrichtung des Elternelements (zentriert/links) bleibt wie im Original */
  display: inline-flex !important;
  vertical-align: middle;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  max-width: 100%;
  box-sizing: border-box;
  min-height: 60px;
  height: auto !important;
  padding: 10px 14px 10px 24px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #8d0516 0%, var(--sh-red) 65%) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(118, 3, 14, 0.22);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease !important;
}
a.qode-btn .qode-btn-text {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0 !important;
  margin: 0 !important;
  overflow-wrap: normal !important;
  word-break: normal;
  white-space: normal;
  font-family: var(--sh-font-head);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  color: #fff !important;
}
a.qode-btn .qode-button-v2-icon-holder {
  position: static !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
  transition: transform .25s ease, background-color .25s ease;
}
a.qode-btn .qode-button-v2-icon-holder-inner {
  position: static !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  color: #fff !important;
  font-size: 18px;
  line-height: 1;
}
a.qode-btn:hover {
  transform: translateY(-3px);
  filter: brightness(1.08);
  box-shadow: 0 14px 26px rgba(118, 3, 14, 0.32);
}
a.qode-btn:hover .qode-button-v2-icon-holder { background: rgba(255, 255, 255, 0.3); }
a.qode-btn:active { transform: translateY(0); }

/* ---------- Inhalte ---------- */
.content .wpb_single_image img,
.content .vc_single_image-wrapper img,
.content .wpb_wrapper > img,
.content .wpb_gallery img,
.content .qode_image_gallery img {
  border-radius: var(--sh-radius);
}
.content .wpb_single_image a { display: inline-block; }
.content table { border-collapse: collapse; }
.content table td, .content table th { padding: 10px 14px; }

/* ---------- Footer ---------- */
footer { background: #1d1b19 !important; color: #d9d4ce; }
footer .footer_top_holder, footer .footer_top { background: transparent !important; }
footer, footer p, footer .textwidget, footer .widget { color: #cfc8c0 !important; }
footer a { color: #fff !important; font-family: var(--sh-font-head); text-decoration: none; }
footer a:hover { color: #7fd6a3 !important; }
footer img { border-radius: 16px; }

/* Drei Spalten als Raster: links Kontakt, Mitte Anfahrt, rechts Navigation */
footer .footer_top { padding: 64px 0 44px !important; }
footer .footer_top .container_inner { width: auto !important; max-width: 1180px; margin: 0 auto !important; padding: 0 24px; box-sizing: border-box; }
footer .three_columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, .8fr);
  gap: 56px;
  align-items: start;
}
/* Clearfix-Pseudo-Elemente des Themes würden im Raster als leere Zellen zählen */
footer .three_columns::before, footer .three_columns::after { content: none !important; display: none !important; }
footer .three_columns > div { float: none !important; width: auto !important; padding: 0 !important; margin: 0 !important; }
footer .column_inner, footer .textwidget { text-align: left !important; padding: 0 !important; }
footer .widget { margin: 0 !important; }

/* Kontakt */
footer .sh-footer-name {
  margin: 0 0 14px;
  font-family: var(--sh-font-head);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.5;
  color: #fff !important;
}
footer address { margin: 0 0 16px; font-style: normal; font-size: 17px; line-height: 1.7; }
footer .sh-footer-links { margin: 0; font-size: 17px; line-height: 1.9; }
footer .sh-footer-links a { display: inline-block; padding: 2px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.25); transition: border-color .2s ease, color .2s ease; }
footer .sh-footer-links a:hover { border-color: #7fd6a3; }

/* Anfahrtskarte */
footer .footer_col2 img { display: block; width: 100%; height: auto; box-shadow: 0 14px 36px rgba(0, 0, 0, 0.4); }
footer .footer_col2 .vc_empty_space { display: none; }

/* Navigation */
footer .widget_nav_menu ul { list-style: none; margin: 0; padding: 0; }
footer .widget_nav_menu li { margin: 0 !important; padding: 0 !important; height: auto !important; line-height: 1.3 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
footer .widget_nav_menu li:first-child { border-top: 1px solid rgba(255, 255, 255, 0.1); }
footer .widget_nav_menu li a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between;
  box-sizing: border-box !important;
  min-height: 48px;
  height: 48px !important;
  padding: 0 2px !important;
  margin: 0 !important;
  font-size: 16px !important;
  line-height: 1.3 !important;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #ece7e1 !important;
  transition: color .2s ease, padding-left .25s ease;
}
footer .widget_nav_menu li a::after { content: "\2192"; opacity: 0; transform: translateX(-6px); transition: opacity .25s ease, transform .25s ease; }
footer .widget_nav_menu li a:hover { padding-left: 8px; color: #7fd6a3 !important; }
footer .widget_nav_menu li a:hover::after { opacity: 1; transform: none; }

/* Untere Leiste */
.sh-footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 20px 24px 24px;
  text-align: center;
  font-size: 13px;
  letter-spacing: 0.03em;
  color: #9c958d;
}

/* ---------- Barrierefreiheit ---------- */
a:focus-visible, button:focus-visible, .qbutton:focus-visible, input:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--sh-green);
  outline-offset: 3px;
  border-radius: 4px;
}
.sh-skip-link {
  position: absolute;
  left: 12px;
  top: -60px;
  z-index: 10000;
  padding: 10px 16px;
  background: var(--sh-red);
  color: #fff;
  border-radius: 8px;
  font-family: var(--sh-font-head);
  transition: top .2s ease;
}
.sh-skip-link:focus { top: 12px; color: #fff; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ---------- Reiter (Unternehmen) ---------- */
/* Ohne JavaScript bleibt die Leiste unsichtbar und alle Abschnitte stehen untereinander. */
.sh-tabs-wrap { display: none; }
html.sh-tabs-on .sh-tabs-wrap {
  display: block;
  position: sticky;
  top: 57px;
  z-index: 40;
  margin-top: 0; /* Der Abstand unter dem festen Seitenkopf kommt schon von der Seite selbst */
  background: rgba(255, 255, 255, 0.94);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid #efe8e1;
}
.sh-tabs {
  display: flex;
  justify-content: center;
  gap: 10px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 14px 16px;
  overflow-x: auto;
  scrollbar-width: none;
}
.sh-tabs::-webkit-scrollbar { display: none; }
.sh-tab {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0 22px;
  border: 1px solid #e3dcd4;
  border-radius: 999px;
  background: #fff;
  color: var(--sh-ink) !important;
  font-family: var(--sh-font-head);
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: .01em;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.sh-tab:hover { border-color: var(--sh-red); color: var(--sh-red) !important; transform: translateY(-1px); }
.sh-tab[aria-selected="true"] {
  background: linear-gradient(135deg, #8d0516 0%, var(--sh-red) 60%);
  border-color: transparent;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(118, 3, 14, 0.28);
}
.sh-tab:focus-visible { outline: 3px solid var(--sh-green); outline-offset: 3px; }

.sh-tabpanels { position: relative; }
.sh-tabpanel:not(.sh-off) { animation: sh-fade .5s ease both; }
/* Inaktive Abschnitte bleiben im Dokument (Suchmaschinen, Galerie-Berechnung), sind aber unsichtbar und nehmen keinen Platz ein */
html.sh-tabs-on .sh-tabpanel.sh-off {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 0;
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
}

/* ---------- Über uns (Unternehmen, Reiter 1) ---------- */
.sh-ab { max-width: 1100px; margin: 0 auto; padding: 72px 0 90px; color: var(--sh-text); }
.sh-ab h2, .sh-ab h3 { color: var(--sh-ink); }

/* Einleitung: Text links, Foto rechts */
.sh-ab-intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 56px; align-items: start; }
.sh-ab-kicker { margin: 0 0 14px !important; color: var(--sh-red) !important; font-family: var(--sh-font-head); font-size: 12.5px !important; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.sh-ab-intro h2 { margin: 0 0 22px; font-size: clamp(30px, 4vw, 44px); line-height: 1.12; letter-spacing: -.03em; }
.sh-ab-lead { margin: 0 0 22px !important; font-size: clamp(19px, 2vw, 22px) !important; line-height: 1.6 !important; color: var(--sh-ink) !important; font-weight: 500; }
.sh-ab-text p:not(.sh-ab-kicker):not(.sh-ab-lead) { margin: 0 0 18px; font-size: 17.5px; line-height: 1.8; max-width: 64ch; }
.sh-ab-figure { position: relative; margin: 8px 0 0; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 60px rgba(37, 34, 31, 0.22); }
.sh-ab-figure img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 62% center; transition: transform .8s ease; }
@media (hover: hover) { .sh-ab-figure:hover img { transform: scale(1.04); } }
.sh-ab-figure figcaption {
  position: absolute; left: 18px; bottom: 18px; padding: 9px 16px; border-radius: 999px;
  background: rgba(255, 255, 255, .92); color: var(--sh-red);
  font-family: var(--sh-font-head); font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}

/* Kennzahlen */
.sh-ab-facts {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 72px 0 80px;
  background: linear-gradient(135deg, #3a1a14 0%, #1d1b19 70%); border-radius: 26px; overflow: hidden; color: #fff;
  box-shadow: 0 26px 60px rgba(29, 27, 25, 0.3);
}
.sh-ab-fact { padding: 40px 22px 36px; text-align: center; border-left: 1px solid rgba(255, 255, 255, .1); }
.sh-ab-fact:first-child { border-left: 0; }
.sh-ab-numwrap, .sh-ab-fact > .sh-ab-num { display: block; font-family: var(--sh-font-head); font-size: clamp(34px, 4.4vw, 52px); font-weight: 700; line-height: 1.05; letter-spacing: -.02em; color: #fff; font-variant-numeric: tabular-nums; }
.sh-ab-unit { margin-left: 4px; font-size: .62em; color: #f0b9b0; }
.sh-ab-label { display: block; margin-top: 12px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .72); line-height: 1.45; }

/* Überschriften der Abschnitte */
.sh-ab-title { margin: 0 0 30px; text-align: center; font-size: clamp(26px, 3.2vw, 36px); letter-spacing: -.02em; }
.sh-ab-title::after { content: ""; display: block; width: 56px; height: 3px; margin: 14px auto 0; border-radius: 3px; background: var(--sh-red); }

/* Stärken */
.sh-ab-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-bottom: 84px; }
.sh-ab-card { display: flex; flex-direction: column; padding: 30px 26px 26px; transition: transform .3s ease, box-shadow .3s ease; }
@media (hover: hover) { .sh-ab-card:hover { transform: translateY(-5px) !important; box-shadow: 0 20px 44px rgba(37, 34, 31, 0.14); } }
.sh-ab-icon { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; margin-bottom: 18px; border-radius: 16px; background: #f6e8e4; color: var(--sh-red); }
.sh-ab-card h3 { margin: 0 0 10px; font-size: 19px; line-height: 1.3; }
.sh-ab-card p { margin: 0 0 18px; font-size: 15.5px; line-height: 1.7; color: var(--sh-muted); flex: 1 1 auto; }
.sh-ab-more { color: var(--sh-red) !important; font-family: var(--sh-font-head); font-size: 14.5px; font-weight: 600; text-decoration: none !important; }
.sh-ab-more span { display: inline-block; transition: transform .25s ease; }
.sh-ab-more:hover span { transform: translateX(5px); }

/* Zeitleiste */
.sh-ab-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 26px; margin: 0 0 26px; padding: 0; list-style: none; counter-reset: none; }
.sh-ab-step { position: relative; margin: 0; padding: 30px 0 0; border-top: 2px solid #e6ddd4; }
.sh-ab-step::before { content: ""; position: absolute; top: -8px; left: 0; width: 14px; height: 14px; border-radius: 50%; background: var(--sh-red); box-shadow: 0 0 0 5px #f6e8e4; }
.sh-ab-year { display: block; margin-bottom: 10px; font-family: var(--sh-font-head); font-size: 32px; font-weight: 700; letter-spacing: -.02em; color: var(--sh-red); }
.sh-ab-step p { margin: 0; font-size: 15.5px; line-height: 1.7; color: var(--sh-muted); }
.sh-ab-historylink { margin: 0 0 84px; text-align: center; }

/* Abschluss */
.sh-ab-closing { padding: 56px 32px; text-align: center; border-radius: 26px; background: linear-gradient(135deg, #faf1ee, #f4e6e1); }
.sh-ab-closing blockquote { margin: 0 0 14px; padding: 0; border: 0; background: none; font-family: var(--sh-font-head); font-size: clamp(26px, 3.6vw, 42px); font-weight: 600; line-height: 1.2; letter-spacing: -.02em; color: var(--sh-red); }
.sh-ab-closing blockquote::before, .sh-ab-closing blockquote::after { content: none; }
.sh-ab-closing p { max-width: 58ch; margin: 0 auto 26px; font-size: 17px; line-height: 1.7; color: var(--sh-text); }
.sh-ab-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.sh-ab-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 30px; border-radius: 12px; font-family: var(--sh-font-head); font-size: 15px; font-weight: 600; text-decoration: none !important; color: #fff !important; }
.sh-ab-btn--ghost { background: #fff; color: var(--sh-ink) !important; border: 1px solid #d8d0c7; transition: border-color .2s ease, color .2s ease, transform .2s ease; }
.sh-ab-btn--ghost:hover { border-color: var(--sh-red); color: var(--sh-red) !important; transform: translateY(-2px); }

/* ---------- Kontaktseite ---------- */
.sh-contact { max-width: 1100px; margin: 0 auto; padding: 56px 0 80px; }
.sh-contact-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 28px; align-items: stretch; }
.sh-card {
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #efe8e1;
  border-radius: 20px;
  box-shadow: 0 12px 34px rgba(37, 34, 31, 0.08);
  padding: 32px;
}
.sh-company h2 { margin: 0 0 14px; font-size: 20px; line-height: 1.35; letter-spacing: .02em; }
.sh-company address { margin: 0 0 26px; font-style: normal; font-size: 18px; line-height: 1.7; color: var(--sh-muted); }
.sh-sub { margin: 0 0 8px; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--sh-red); }
.sh-contact-list { list-style: none; margin: 0; padding: 0; }
.sh-contact-list li { margin: 0; padding: 0; }
.sh-contact-list a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 0;
  color: var(--sh-ink);
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: color .2s ease, transform .2s ease;
}
.sh-contact-list a svg { flex: 0 0 18px; color: var(--sh-red); }
.sh-contact-list a:hover { color: var(--sh-red); transform: translateX(3px); }
.sh-fax-label { display: block; padding: 9px 0 9px 30px; color: var(--sh-muted); }

/* Karte: erst Vorschau, Google Maps wird erst nach Klick geladen (Datenschutz) */
.sh-map { position: relative; display: flex; min-height: 400px; padding: 0; overflow: hidden; }
.sh-map-consent {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 36px;
  background: linear-gradient(135deg, #faf7f4, #f1ebe4);
}
.sh-map-consent::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url(/wp-content/uploads/2017/01/anfahrt_steiermark.jpg) center / cover no-repeat;
  opacity: .2;
  filter: grayscale(.5);
}
.sh-map-consent > * { position: relative; }
.sh-pin { color: var(--sh-red); }
.sh-map-consent h3 { margin: 8px 0 10px; font-size: 22px; }
.sh-map-consent p { max-width: 44ch; margin: 0 0 22px; font-size: 15px; line-height: 1.6; color: var(--sh-muted); }
.sh-map-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 22px; }
.sh-btn {
  font-family: var(--sh-font-head);
  font-size: 15px;
  font-weight: 600;
  min-height: 48px;
  padding: 0 28px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #8d0516 0%, var(--sh-red) 60%);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(118, 3, 14, 0.28);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.sh-btn:hover { transform: translateY(-2px); filter: brightness(1.08); box-shadow: 0 12px 24px rgba(118, 3, 14, 0.36); }
.sh-btn:active { transform: translateY(0); }
.sh-link { font-family: var(--sh-font-head); font-size: 15px; font-weight: 600; color: var(--sh-red); text-decoration: none; }
.sh-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.sh-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sh-map-loaded .sh-map-consent { display: none; }

/* Team */
.sh-team-title { margin: 64px 0 28px; text-align: center; font-size: 28px; }
.sh-team { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.sh-person { display: flex; align-items: center; gap: 26px; padding: 28px 30px; transition: transform .3s ease, box-shadow .3s ease; }
.sh-person-body { min-width: 0; flex: 1 1 auto; }
@media (hover: hover) { .sh-person:hover { transform: translateY(-5px) !important; box-shadow: 0 20px 44px rgba(37, 34, 31, 0.14); } }
.sh-avatar {
  display: block;
  flex: 0 0 120px;
  width: 120px;
  height: 120px;
  margin: 0;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid #fff;
  box-shadow: 0 0 0 2px var(--sh-red), 0 10px 24px rgba(0, 0, 0, 0.14);
}
.sh-role {
  margin: 0 0 6px;
  font-family: var(--sh-font-head);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .1em;
  line-height: 1.4;
  text-transform: uppercase;
  color: var(--sh-red);
}
.sh-name { margin: 0 0 10px; font-size: 20px; line-height: 1.3; }
.sh-person .sh-contact-list a { font-size: 15px; padding: 6px 0; }
@media (max-width: 1000px) { .sh-team { grid-template-columns: minmax(0, 1fr); } }
/* Zwei Ansprechpartner (Rohstoff): nebeneinander, solange Platz ist */
.sh-team--duo { max-width: 860px; margin: 8px auto 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1000px) { .sh-team--duo { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .sh-team--duo { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Einwilligungs-Banner ---------- */
.sh-consent {
  position: fixed;
  z-index: 100000;
  left: 16px;
  right: 16px;
  bottom: 16px;
  max-width: 960px;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 26px 30px 24px;
  background: #fff;
  border: 1px solid #e9e2db;
  border-radius: 22px;
  box-shadow: 0 28px 80px rgba(20, 14, 10, 0.32);
  color: var(--sh-text);
  font-family: "Cabin", system-ui, sans-serif;
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .45s ease, transform .45s cubic-bezier(.2, .7, .2, 1);
}
.sh-consent[hidden] { display: none; }
.sh-consent.sh-consent-in { opacity: 1; transform: none; }
.sh-consent:focus { outline: none; }
.sh-consent-title { margin: 0 0 8px; font-size: 20px; line-height: 1.3; }
.sh-consent-text { margin: 0 0 18px; font-size: 15.5px; line-height: 1.6; color: var(--sh-muted); max-width: 78ch; }
.sh-consent-text a { color: var(--sh-red); text-decoration: underline; text-underline-offset: 3px; }
.sh-consent-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 20px; }
.sh-consent-opt {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin: 0;
  padding: 14px 16px;
  border: 1px solid #efe8e1;
  border-radius: 14px;
  background: #faf7f4;
  cursor: pointer;
}
.sh-consent-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sh-switch {
  position: relative;
  flex: 0 0 44px;
  width: 44px;
  height: 26px;
  margin-top: 2px;
  border-radius: 999px;
  background: #cfc7be;
  transition: background-color .2s ease;
}
.sh-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  transition: transform .2s ease;
}
.sh-consent-opt input:checked + .sh-switch { background: var(--sh-green); }
.sh-consent-opt input:checked + .sh-switch::after { transform: translateX(18px); }
.sh-consent-opt input:disabled + .sh-switch { opacity: .6; }
.sh-consent-opt input:focus-visible + .sh-switch { outline: 3px solid var(--sh-green); outline-offset: 3px; }
.sh-consent-opt-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sh-consent-opt-text strong { font-family: var(--sh-font-head); font-size: 14.5px; font-weight: 600; color: var(--sh-ink); }
.sh-consent-opt-text small { font-size: 13.5px; line-height: 1.45; color: var(--sh-muted); }
.sh-consent-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.sh-consent-btn {
  flex: 1 1 180px;
  min-height: 48px;
  padding: 0 20px;
  border: 2px solid transparent;
  border-radius: 12px;
  font-family: var(--sh-font-head);
  font-size: 14.5px;
  font-weight: 600;
  cursor: pointer;
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.sh-consent-btn:hover { transform: translateY(-2px); filter: brightness(1.1); }
.sh-consent-btn:active { transform: translateY(0); }
/* "Nur notwendige" und "Alle akzeptieren" bewusst gleich groß und gleich auffällig */
.sh-consent-btn--neutral { background: #2b2724; color: #fff; }
.sh-consent-btn--accent { background: linear-gradient(135deg, #8d0516 0%, var(--sh-red) 60%); color: #fff; box-shadow: 0 6px 16px rgba(118, 3, 14, 0.25); }
.sh-consent-btn--ghost { background: #fff; color: var(--sh-ink); border-color: #d8d0c7; }

/* ---------- Effekte ---------- */
/* Einblenden beim Scrollen (modern.js setzt .sh-js; ohne JS bleibt alles sichtbar) */
.sh-js .sh-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .7s cubic-bezier(.2, .7, .2, 1), transform .7s cubic-bezier(.2, .7, .2, 1);
  transition-delay: var(--sh-delay, 0ms);
}
.sh-js .sh-reveal.sh-in { opacity: 1; transform: none; }

/* Hero-Intro beim Öffnen der Startseite:
   Hintergrund zoomt ruhig heraus, die Buchstaben von "SCHAFFERHOLZ" blenden einzeln aus der Unschärfe ein,
   der Titel "setzt sich" (zieht sich leicht zusammen), eine Linie wächst, dann folgt der Untertitel.
   Alles läuft nur über transform/opacity/filter auf eigenen Ebenen (keine Layout-Berechnung pro Bild),
   damit es auch auf iPhone/iPad (Safari) und schwächeren PCs flüssig bleibt. */
@keyframes sh-rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes sh-letter { from { opacity: 0; transform: translateY(.45em) scale(.92); filter: blur(10px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes sh-letter-soft { from { opacity: 0; } to { opacity: 1; } }
@keyframes sh-settle { from { transform: scale(1.12); } to { transform: none; } }
@keyframes sh-line { from { transform: scaleX(0); opacity: 0; } to { transform: scaleX(1); opacity: 1; } }
@keyframes sh-zoom { from { transform: scale(1.15); } to { transform: scale(1); } }

h1.main-titel { animation: sh-rise .9s cubic-bezier(.2, .7, .2, 1) both; } /* Rückfall ohne JavaScript */
h1.main-titel.sh-split { animation: sh-settle 2.4s cubic-bezier(.2, .7, .2, 1) both; }
.sh-ch {
  display: inline-block;
  opacity: 0;
  will-change: transform, opacity, filter;
  animation: sh-letter .9s cubic-bezier(.2, .7, .2, 1) both;
  animation-delay: calc(var(--i) * 70ms + 250ms);
}
h1.main-titel.sh-split::after {
  content: "";
  display: block;
  width: 120px;
  height: 2px;
  margin: 16px auto 0;
  background: rgba(255, 255, 255, 0.85);
  transform: scaleX(0);
  opacity: 0;
  animation: sh-line 1s 1.5s cubic-bezier(.2, .7, .2, 1) forwards;
}
/* Untertitel: erscheint nach Titel und Linie (nur im Intro-Modus, den ein kleines Inline-Skript am Titel einschaltet) */
html.sh-intro .content [data-q_id="#intro"] p { animation: sh-rise 1s 1.7s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes sh-fade { from { opacity: 0; } to { opacity: 1; } }

/* Das Intro startet erst, wenn das Hero-Bild geladen ist (Klasse sh-play); bis dahin steht alles auf Anfang */
html.sh-intro:not(.sh-play) h1.main-titel,
html.sh-intro:not(.sh-play) .sh-ch,
html.sh-intro:not(.sh-play) h1.main-titel::after,
html.sh-intro:not(.sh-play) .content [data-q_id="#intro"] p,
html.sh-intro:not(.sh-play) .content [data-q_id="#intro"]::before { animation-play-state: paused !important; }

/* Betriebssystem-Einstellung "Bewegung reduzieren": gleiche Reihenfolge (Buchstabe für Buchstabe), aber ohne Bewegung,
   Zoom und Unschärfe – nur sanftes Einblenden. */
html.sh-reduced h1.main-titel.sh-split { animation: none !important; }
html.sh-reduced h1.main-titel:not(.sh-split) { animation: sh-fade 1.6s ease both !important; }
html.sh-reduced .sh-ch {
  will-change: opacity;
  animation: sh-letter-soft .9s ease both !important;
  animation-delay: calc(var(--i) * 70ms + 250ms) !important;
}
html.sh-reduced h1.main-titel.sh-split::after { transform: none; animation: sh-fade 1s 1.5s ease both !important; }
html.sh-reduced .content [data-q_id="#intro"] p { animation: sh-fade 1.2s 1.6s ease both !important; }
html.sh-reduced .content [data-q_id="#intro"]::before { animation: none !important; }
.content [data-q_id="#intro"] { position: relative; overflow: hidden; }
.content [data-q_id="#intro"]::before {
  content: "";
  position: absolute;
  inset: 0;
  background: inherit;
  background-size: cover;
  transform-origin: 50% 100%;
  animation: sh-zoom 3s cubic-bezier(.2, .7, .2, 1) both;
  z-index: 0;
}
.content [data-q_id="#intro"] > * { position: relative; z-index: 1; }

/* Header: stärkerer Schatten, sobald gescrollt wird */
header.page_header .header_bottom { transition: box-shadow .3s ease, background-color .3s ease; }
.sh-scrolled header.page_header .header_bottom { box-shadow: 0 6px 24px rgba(37, 34, 31, 0.12); }

/* Karten und Bilder reagieren auf Hover */
.content .vc_col-has-fill > .vc_column-inner { transition: transform .4s ease, box-shadow .4s ease; }
@media (hover: hover) {
  .content .vc_col-has-fill > .vc_column-inner:hover { transform: translateY(-4px); box-shadow: 0 26px 60px rgba(0, 0, 0, 0.32); }
  .content .wpb_single_image .vc_single_image-wrapper { overflow: hidden; border-radius: var(--sh-radius); display: block; }
  .content .wpb_single_image img { transition: transform .6s ease; }
  .content .wpb_single_image a:hover img, .content .wpb_single_image .vc_single_image-wrapper:hover img { transform: scale(1.05); }
}

/* ---------- Mobil ---------- */
@media (max-width: 768px) {
  /* Hamburger-Menü: sichtbar, große Tippfläche */
  .mobile_menu_button { width: 48px; height: 48px; display: flex !important; align-items: center; justify-content: center; }
  .mobile_menu_button span, .mobile_menu_button .qode_icon_font_elegant { color: var(--sh-red) !important; opacity: 1 !important; font-size: 30px !important; }
  nav.mobile_menu { box-shadow: 0 14px 30px rgba(37, 34, 31, 0.14); }
  nav.mobile_menu > ul > li > a { min-height: 48px; display: flex; align-items: center; }

  /* Footer: Innenabstand, linksbündig, gestapelt */
  /* Seitenränder: Das Theme lässt auf dem Handy je ca. 37 px Rand plus 16 px Innenabstand (z. B. nur 257 px Inhalt auf einem 390-px-iPhone) */
  .content .container_inner.default_template_holder { width: auto !important; margin-left: 20px !important; margin-right: 20px !important; }
  .content .vc_row.section:not([style*="background-image"]) .section_inner { padding-left: 0; padding-right: 0; }

  /* Produkte: feste Spaltenbreiten, damit lange Wörter in der Zelle umbrechen statt über die Linien zu laufen (auch Safari/iPhone) */
  .product_table { width: 100% !important; table-layout: fixed; }
  .product_table td { overflow-wrap: anywhere; word-break: break-word; hyphens: auto; }
  .product_table td:first-child { width: 38%; }
  .product_title { overflow-wrap: anywhere; hyphens: auto; }

  /* Kontaktlisten: Symbol und Text behalten ihren Abstand (die Regel für antippbare Links darf das Layout nicht überschreiben) */
  .sh-contact-list a { display: flex !important; gap: 14px; padding: 10px 0; }
  .sh-contact-list a svg { margin-right: 2px; }

  /* Über uns */
  .sh-ab, .sh-ab span, .sh-ab p, .sh-ab h2, .sh-ab h3, .sh-ab li { overflow-wrap: normal !important; word-break: normal; hyphens: auto; }
  .sh-ab-intro h2 { font-size: 25px; }
  .sh-ab-numwrap, .sh-ab-fact > .sh-ab-num { font-size: 30px; white-space: nowrap; }
  .sh-ab-label { font-size: 11.5px; letter-spacing: .07em; }
  .sh-ab { margin: 0; padding: 44px 0 60px; }
  .sh-ab-intro { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .sh-ab-figure { order: -1; margin-top: 0; }
  .sh-ab-figure img { aspect-ratio: 16 / 11; object-position: center; }
  .sh-ab-text p:not(.sh-ab-kicker):not(.sh-ab-lead) { font-size: 16.5px; }
  .sh-ab-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 48px 0 56px; }
  .sh-ab-fact { padding: 28px 14px 26px; }
  .sh-ab-fact:nth-child(3) { border-left: 0; }
  .sh-ab-fact:nth-child(n + 3) { border-top: 1px solid rgba(255, 255, 255, .1); }
  .sh-ab-cards { grid-template-columns: minmax(0, 1fr); margin-bottom: 56px; }
  .sh-ab-timeline { grid-template-columns: minmax(0, 1fr); gap: 0; padding-left: 26px; }
  .sh-ab-step { padding: 0 0 30px 26px; border-top: 0; border-left: 2px solid #e6ddd4; }
  .sh-ab-step::before { top: 4px; left: -8px; }
  .sh-ab-historylink { margin-bottom: 56px; }
  .sh-ab-closing { padding: 38px 20px; border-radius: 20px; }
  .sh-ab-cta .sh-btn, .sh-ab-btn { width: 100%; }

  /* Reiter */
  html.sh-tabs-on .sh-tabs-wrap { top: 56px; }
  .sh-tabs { justify-content: flex-start; padding: 10px 14px; gap: 8px; }
  .sh-tab { min-height: 42px; padding: 0 16px; font-size: 13.5px; }

  /* Einwilligungs-Banner */
  .sh-consent { left: 10px; right: 10px; bottom: 10px; max-height: 88vh; overflow-y: auto; padding: 20px 18px 18px; border-radius: 18px; }
  .sh-consent-title { font-size: 18px; margin-bottom: 6px; }
  .sh-consent-text { font-size: 14px; line-height: 1.5; margin-bottom: 12px; }
  .sh-consent-options { grid-template-columns: minmax(0, 1fr); gap: 8px; margin-bottom: 14px; }
  .sh-consent-opt { padding: 10px 12px; gap: 12px; }
  .sh-consent-opt-text strong { font-size: 13.5px; }
  .sh-consent-opt-text small { font-size: 12.5px; line-height: 1.4; }
  .sh-consent-actions { gap: 8px; }
  .sh-consent-btn { flex: 1 1 100%; min-height: 44px; }

  /* Kontaktseite */
  .sh-contact { padding: 36px 0 56px; }
  .sh-contact-top { grid-template-columns: minmax(0, 1fr); }
  .sh-card { padding: 24px 20px; border-radius: 16px; }
  .sh-map { min-height: 340px; }
  .sh-map-consent { padding: 28px 18px; }
  .sh-team-title { margin: 44px 0 22px; font-size: 24px; }
  .sh-person { flex-direction: column; text-align: center; padding: 26px 18px; gap: 16px; }
  .sh-person .sh-contact-list a { justify-content: center; }
  .sh-map-actions .sh-btn { width: 100%; }

  footer .footer_top { padding: 40px 0 28px !important; }
  footer .footer_top .container_inner { padding: 0 24px; }
  footer .three_columns { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  footer img { max-width: 100%; height: auto; }
  footer .sh-footer-links a { padding: 8px 0; }
  .sh-footer-bottom { padding: 18px 20px 22px; line-height: 1.6; }

  /* Lange Wörter und Zeilen dürfen umbrechen (z. B. EU-Projekte) */
  .content strong, .content span, .content p, .content h2, .content h3 { white-space: normal; overflow-wrap: anywhere; }

  /* Tabellen nicht breiter als der Bildschirm */
  .content table { width: 100% !important; max-width: 100%; margin-left: 0 !important; table-layout: auto; }
  .content table td, .content table th { padding: 8px 10px; }

  /* Mail- und Telefon-Links gut antippbar */
  .content a[href^="mailto"], .content a[href^="tel"] { display: inline-block; padding: 10px 0; }

  /* Hero-Titel und Buttons */
  a.qbutton { width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; padding-left: 20px !important; padding-right: 20px !important; }
  footer a[href^="mailto"] { display: inline-block; padding: 10px 0; }

  .content .vc_col-has-fill > .vc_column-inner { padding: 30px 22px 28px !important; border-radius: 16px; }
  .content .vc_col-has-fill h2 { font-size: 24px; }
  .content .vc_col-has-fill .wpb_text_column p { font-size: 16.5px; }
  h1.main-titel { font-size: 38px !important; }
  .content .vc_row.section .section_inner { padding-left: 16px; padding-right: 16px; }
  /* Bridge-Spalten haben negative Außenränder, die die Karte an den Rand drücken */
  .content .vc_row.section .section_inner_margin { margin-left: 0 !important; margin-right: 0 !important; }
  .content .vc_col-has-fill > .vc_column-inner { width: 100%; box-sizing: border-box; }
}