/* English layout parity with ../assemblies-de/assemblies.css. Keep both versions in sync. */
/* Nur für die Seite "Assembly": Produktentstehung als Prozess von rechts nach links. */
.ee49a6cb .e105224a > .row {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) 44px minmax(120px, 1fr) 44px minmax(120px, 1fr) 44px minmax(120px, 1fr) 44px minmax(120px, 1fr);
  gap: 0;
  width: min(100%, 1180px);
  direction: rtl;
  align-items: start;
}

.ee49a6cb .e105224a .column {
  width: auto;
  padding: 0 8px;
  direction: ltr;
  text-align: center;
}

.ee49a6cb .e105224a .widget-image img {
  width: 82px !important;
  height: 82px !important;
  margin: 0 auto 18px;
  object-fit: contain;
}

.ee49a6cb .e105224a .e4dd3898,
.ee49a6cb .e105224a .e5593a1b,
.ee49a6cb .e105224a .e028504a,
.ee49a6cb .e105224a .edc5200e {
  padding-top: 26px;
}

.ee49a6cb .e105224a .e4dd3898 img,
.ee49a6cb .e105224a .e5593a1b img,
.ee49a6cb .e105224a .e028504a img,
.ee49a6cb .e105224a .edc5200e img {
  width: 34px !important;
  height: 34px !important;
  transform: none;
}

.ee49a6cb .e105224a .e9b74ee2 h2,
.ee49a6cb .e105224a .e9cb735e h2,
.ee49a6cb .e105224a .ead918ea h2,
.ee49a6cb .e105224a .ef46bb9d h2,
.ee49a6cb .e105224a .ed6bd5d4 h2 {
  color: var(--ink) !important;
  font-size: 1.08rem !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  line-height: 1.2 !important;
  text-transform: uppercase;
}

.ee49a6cb .e105224a .e493d623 h2,
.ee49a6cb .e105224a .e064ee22 h2,
.ee49a6cb .e105224a .ef78ac77 h2,
.ee49a6cb .e105224a .efadbc8a h2,
.ee49a6cb .e105224a .e0f0a35e h2 {
  color: var(--ink) !important;
  font-size: .93rem !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.48 !important;
  text-transform: none;
}

/* Die drei Begriffe unter dem Prozessbild sind Bildunterschriften, keine Abschnittsüberschriften. */
.ee49a6cb .e56927eb > .row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(100%, 820px);
  margin: 26px auto 0;
}

.ee49a6cb .e56927eb .column { width: 100%; padding: 8px; }

.ee49a6cb .e56927eb .widget-heading h2 {
  color: var(--ink) !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  line-height: 1.3 !important;
  text-align: center;
  text-transform: uppercase;
}

/* Bildmaterial als ein steuerbares, automatisch laufendes Karussell. */
.assembly-carousel {
  position: relative;
  width: min(100%, 1120px);
  margin: 34px auto 0;
}

.assembly-carousel__viewport { overflow: hidden; background: #11191c; }
.assembly-carousel__track { display: flex; transition: transform 520ms ease; }
.assembly-carousel__slide { flex: 0 0 100%; margin: 0; aspect-ratio: 16 / 9; }
.assembly-carousel__slide img { width: 100%; height: 100%; object-fit: cover; }

.assembly-carousel__control {
  position: absolute;
  top: calc(50% - 22px);
  z-index: 1;
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  place-items: center;
  color: #fff;
  font-size: 1.5rem;
  background: rgb(6 7 7 / 82%);
  border: 1px solid rgb(255 255 255 / 48%);
  cursor: pointer;
}

.assembly-carousel__control:hover { background: var(--accent); }
.assembly-carousel__control--prev { left: 18px; }
.assembly-carousel__control--next { right: 18px; }
.assembly-carousel__dots { display: flex; justify-content: center; gap: 8px; padding: 14px 0 0; }

.assembly-carousel__dot {
  width: 8px;
  height: 8px;
  padding: 0;
  background: #b2bcbe;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}

.assembly-carousel__dot[aria-current="true"] { background: var(--ink); }

.assembly-carousel__caption {
  margin: 18px 0 0;
  color: var(--ink);
  font-size: clamp(1.35rem, 2vw, 2rem);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.15;
}

/* YouTube: Vorschaubild und eindeutiger Play-Button, anschließend das eingebettete Video. */
.assembly-video { position: relative; overflow: hidden; width: 100%; aspect-ratio: 16 / 9; background: #101719; }
.assembly-video__trigger { position: relative; display: grid; width: 100%; height: 100%; padding: 0; place-items: center; background: #101719; border: 0; cursor: pointer; }
.assembly-video__poster { width: 100%; height: 100%; object-fit: cover; opacity: .78; transition: opacity 180ms ease; }
.assembly-video__trigger:hover .assembly-video__poster { opacity: .58; }
.assembly-video__play { position: absolute; display: grid; width: 74px; height: 74px; padding-left: 4px; place-items: center; color: #fff; font-size: 2rem; line-height: 1; background: rgb(6 7 7 / 86%); border: 1px solid rgb(255 255 255 / 75%); border-radius: 50%; }
.assembly-video__trigger:hover .assembly-video__play { background: var(--accent); }
.assembly-video iframe { width: 100%; height: 100%; border: 0; }

@media (max-width: 920px) {
  .ee49a6cb .e105224a > .row { grid-template-columns: repeat(5, minmax(106px, 1fr)); gap: 22px; }
  .ee49a6cb .e105224a .ec1dbe22,
  .ee49a6cb .e105224a .e8a5b0e2,
  .ee49a6cb .e105224a .ea414e9f,
  .ee49a6cb .e105224a .e510c8cb { display: none; }
}

@media (max-width: 620px) {
  .ee49a6cb .e105224a > .row { grid-template-columns: 1fr; max-width: 330px; gap: 28px; }
  .ee49a6cb .e105224a .column { padding: 0; }
  .ee49a6cb .e105224a .e4dd3898,
  .ee49a6cb .e105224a .e5593a1b,
  .ee49a6cb .e105224a .e028504a,
  .ee49a6cb .e105224a .edc5200e { display: block; padding: 0; }
  .ee49a6cb .e105224a .e4dd3898 img,
  .ee49a6cb .e105224a .e5593a1b img,
  .ee49a6cb .e105224a .e028504a img,
  .ee49a6cb .e105224a .edc5200e img { margin: 0 auto; transform: none; }
  .ee49a6cb .e56927eb > .row { grid-template-columns: 1fr; gap: 6px; }
  .assembly-carousel__control--prev { left: 8px; }
  .assembly-carousel__control--next { right: 8px; }
}

/* Kompaktere Folge der beiden Teile: Prozess und Bereichsbild. */
.ee49a6cb {
  padding-top: 48px !important;
  padding-bottom: 56px !important;
}

.ee49a6cb .e7e39540 {
  margin-top: 34px;
}

/* Der Übergang "Schneller in den Markt" bleibt bewusst kurz. */
.e7b1a524 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

/* Die fünf Detailphasen behalten Inhalte und Bildsprache, benötigen aber weniger Höhe. */
.e47c9258,
.ef91f8d6,
.e2fcabd2,
.e5517223,
.ebd084b4 {
  padding-top: clamp(46px, 5vw, 72px) !important;
  padding-bottom: clamp(46px, 5vw, 72px) !important;
}

.e47c9258 .spacer,
.ef91f8d6 .spacer,
.e2fcabd2 .spacer,
.e5517223 .spacer,
.ebd084b4 .spacer {
  max-height: 24px;
}

.e47c9258 .widget-image img,
.ef91f8d6 .widget-image img,
.e2fcabd2 .widget-image img,
.e5517223 .widget-image img,
.ebd084b4 .widget-image img {
  width: 100%;
  max-height: 360px;
  object-fit: contain;
}

/* Rabatt-Button über dem Produktionsvideo statt unterhalb. */
.e212bc36 { position: relative; }

.e212bc36 > .row { position: static; }

.e212bc36 .e13d45e5 {
  position: absolute;
  z-index: 2;
  top: clamp(90px, 12vw, 170px);
  right: clamp(32px, 8vw, 120px);
  width: min(380px, 44vw);
  padding: 0;
}

.e212bc36 .e9d1f174 img {
  width: 100% !important;
  height: auto;
}

/* Das Statement liegt auf schwarzem Grund und braucht deshalb eine helle Schrift. */
.e86e0ec1 .ee337662 h2 {
  color: #fff !important;
  font-weight: 400 !important;
}

/* Die Videovorschau wird vollständig gezeigt, ohne Anschnitt. */
.assembly-video__poster {
  object-fit: contain;
  background: #050505;
}

/* Die Beschriftung neben der Videovorschau ist eine Nebenheadline. */
.ed7f9d85 .e35f4509 h2 {
  color: var(--ink) !important;
  font-size: clamp(1.35rem, 2vw, 2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -.025em !important;
  line-height: 1.15 !important;
}

/* Nur der Kontakt-Button bleibt sichtbar; der graue Container darum entfällt. */
.e577b4e9 .e167d685 {
  padding: 0 !important;
  background: transparent !important;
}

.e577b4e9 .e167d685 .button {
  display: inline-block;
}

@media (max-width: 620px) {
  .ee49a6cb { padding-top: 36px !important; }
  .ee49a6cb .e7e39540 { margin-top: 26px; }
  .e47c9258 .widget-image img,
  .ef91f8d6 .widget-image img,
  .e2fcabd2 .widget-image img,
  .e5517223 .widget-image img,
  .ebd084b4 .widget-image img { max-height: 280px; }
  .e212bc36 .e13d45e5 { top: 78px; right: 28px; width: 264px; }
}