/* 1:1 aus der Einleitung des Showroom-Plugins v1.6 abgeleitete Maße.
   Ausschließlich für das Produkte-Plugin; keine SiteOrigin-Abhängigkeit. */
.bp-produkte {
  --bp-produkte-text: #222321;
  --bp-produkte-muted: #7f807c;
  --bp-produkte-max: 1330px;
  box-sizing: border-box;
  width: 100vw;
  max-width: 100vw;
  margin-inline: calc(50% - 50vw);
  overflow: hidden;
  color: var(--bp-produkte-text);
  background: #fff;
  font-size: 16px;
  line-height: 1.65;
  text-align: left;
}
.bp-produkte *, .bp-produkte *::before, .bp-produkte *::after { box-sizing: border-box; }
.bp-produkte__container {
  max-width: var(--bp-produkte-max);
  margin-inline: auto;
  padding-inline: clamp(24px, 5.8vw, 88px);
}
.bp-produkte__intro {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  align-items: center;
  gap: clamp(38px, 5vw, 82px);
  text-align: left;
  padding-top: clamp(78px, 8vw, 130px);
  padding-bottom: clamp(56px, 6vw, 93px);
}
.bp-produkte__intro-copy, .bp-produkte__hero { min-width: 0; }
/* Eyebrow: exakt die Typografie und Abstände des Showroom-Plugins v1.6 */
.bp-produkte__eyebrow {
  display: block;
  margin-bottom: clamp(21px, 2.4vw, 34px);
  color: var(--bp-produkte-muted);
  font-size: 11px;
  letter-spacing: .2em;
  line-height: 1.4;
  text-transform: uppercase;
}
.bp-produkte__title {
  color: var(--bp-produkte-text);
  font-size: clamp(42px, 5.2vw, 76px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.025em;
  margin: 0 0 clamp(24px, 3vw, 42px);
  padding: 0;
}
.bp-produkte__lead {
  max-width: 530px;
  color: #4b4b49;
  font-size: clamp(16px, 1.42vw, 20px);
  line-height: 1.8;
  font-weight: 400;
}
.bp-produkte__lead p { font-size: inherit; line-height: inherit; margin: 0 0 1.1em; }
.bp-produkte__lead p:last-child { margin-bottom: 0; }
.bp-produkte__hero-media {
  position: relative;
  width: 100%;
  aspect-ratio: 1.02;
  height: auto;
  min-height: 400px;
  overflow: hidden;
  background: #dad6cf;
}
.bp-produkte__hero-media video,
.bp-produkte__hero-media iframe,
.bp-produkte__hero-media .wp-video,
.bp-produkte__hero-media .wp-video-shortcode {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  border: 0;
}
/* Native Videos werden unverzerrt, wie ein Showroom-Bild, flächenfüllend gezeigt. */
.bp-produkte__hero-media video { position: absolute; inset: 0; object-fit: cover; }
.bp-produkte__hero-media iframe { position: absolute; inset: 0; }
.bp-produkte__placeholder,
.bp-produkte__fallback-link {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 26px;
  text-align: center;
  color: #42413e;
  font-size: 16px;
  text-decoration: none;
  background: linear-gradient(130deg, #e4e2dd 0%, #d2d0cb 46%, #b7b6b1 100%);
}
@media (max-width: 780px) {
  .bp-produkte__intro {
    grid-template-columns: 1fr;
    gap: 43px;
    padding-top: 76px;
    padding-bottom: 52px;
  }
  .bp-produkte__intro-copy { max-width: 650px; }
  .bp-produkte__eyebrow { font-size: 10px; }
  .bp-produkte__lead { line-height: 1.7; max-width: 650px; }
  .bp-produkte__hero-media { min-height: 0; aspect-ratio: 1.36; }
}
@media (max-width: 520px) {
  .bp-produkte__container { padding-inline: 24px; }
  .bp-produkte__intro { padding-top: 63px; padding-bottom: 44px; gap: 35px; }
  .bp-produkte__title { font-size: clamp(40px, 12vw, 56px); }
  .bp-produkte__lead { font-size: 16px; }
  .bp-produkte__hero-media { min-height: 330px; aspect-ratio: 1.02; }
}

/* ================================================
   Wiederholbare Produktbereiche – Version 1.10
   Auf dem Gestaltungsraster des Showroom-Plugins.
   ================================================ */
.bp-produkte__section {
  padding-top: clamp(58px, 6.9vw, 104px);
  padding-bottom: clamp(34px, 5vw, 75px);
}
.bp-produkte__section + .bp-produkte__section {
  padding-top: clamp(85px, 9vw, 145px);
}
.bp-produkte__section-title {
  color: var(--bp-produkte-text);
  font-size: clamp(35px, 4vw, 59px);
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.2;
  padding: 0;
  margin: 0 0 clamp(34px, 4.5vw, 62px);
  text-align: left;
}
/* Die Galerie nutzt exakt dieselbe innere Containerbreite wie die
   H2-Überschrift, Beschreibung und der Link. Keine ausbrechende
   1330px-Galerie und keine separaten seitlichen Bild-Abstände.
   Das gemeinsame Container-Padding sorgt responsiv für Randabstand. */
.bp-produkte__gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.2vw, 30px);
  width: 100%;
  max-width: 100%;
  margin: 0;
  transform: none;
}
.bp-produkte__gallery-item {
  min-width: 0;
  aspect-ratio: 4 / 3;
  background: #e7e5e1;
  overflow: hidden;
}
.bp-produkte__gallery-image,
.bp-produkte__gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
/* Beschreibung und Link stehen stets in getrennten Zeilen. */
.bp-produkte__section-bottom {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: clamp(24px, 2.5vw, 36px);
  margin-top: clamp(28px, 3.5vw, 48px);
}
.bp-produkte__description {
  width: 60%;
  max-width: none;
  color: #555652;
  font-size: clamp(19px, 1.65vw, 22px);
  line-height: 1.95;
}
.bp-produkte__description p { font-size: inherit; line-height: inherit; margin: 0 0 1.1em; }
.bp-produkte__description p:last-child { margin-bottom: 0; }
/* Typografie, Unterstreichung und Pfeildicke wie Showroom-Textlink. */
.bp-produkte__text-link {
  display: inline-flex;
  align-items: center;
  justify-self: end;
  justify-content: flex-end;
  gap: 24px;
  max-width: 100%;
  padding-bottom: 12px;
  border-bottom: 1px solid #757671;
  color: var(--bp-produkte-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  text-align: right;
  text-decoration: none !important;
  transition: gap .2s ease, color .2s ease;
}
.bp-produkte__text-link:hover { gap: 32px; color: #62635e; }
.bp-produkte__text-link:focus-visible { outline: 2px solid #242424; outline-offset: 4px; }
.bp-produkte__text-link svg {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (max-width: 780px) {
  .bp-produkte__section { padding-top: 64px; padding-bottom: 35px; }
  .bp-produkte__section + .bp-produkte__section { padding-top: 84px; }
  .bp-produkte__section-title { margin-bottom: 36px; }
  .bp-produkte__gallery { gap: 15px; }
  .bp-produkte__section-bottom { row-gap: 24px; }
  .bp-produkte__description { width: 100%; }
  .bp-produkte__text-link {
    justify-self: start;
    justify-content: flex-start;
    text-align: left;
  }
}
@media (max-width: 700px) {
  .bp-produkte__gallery { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 520px) {
  .bp-produkte__section { padding-top: 58px; padding-bottom: 25px; }
  .bp-produkte__section + .bp-produkte__section { padding-top: 76px; }
  .bp-produkte__section-title { font-size: 37px; margin-bottom: 30px; }
  .bp-produkte__gallery-item { aspect-ratio: 4 / 3; }
  .bp-produkte__description { font-size: 19px; }
}
@media (prefers-reduced-motion: reduce) {
  .bp-produkte__text-link { transition-duration: .01ms !important; }
}

/* Eigenständiger Play-Button für lokale Videodateien; alle übrigen
   Showroom-Maße, Textbreiten und Produktbereiche bleiben unverändert. */
.bp-produkte__play-button {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 78px;
  height: 78px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0 0 3px;
  border: 1px solid rgba(255, 255, 255, .85);
  border-radius: 50%;
  color: #fff;
  background: rgba(24, 24, 24, .62);
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.bp-produkte__play-button[hidden] { display: none !important; }
.bp-produkte__play-button:hover { background: rgba(24, 24, 24, .84); }
.bp-produkte__play-button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 520px) {
  .bp-produkte__play-button { width: 66px; height: 66px; }
}
@media (prefers-reduced-motion: reduce) {
  .bp-produkte__play-button { transition: none; }
}