/*
 * /karriere/ + /bewerben/ — 1:1 port of the live Webflow homepage
 * (recruiting story) and /bewerbung form page.
 *
 * Source of truth: lythgmbh.webflow.shared.c7e277e00.min.css (extracted
 * 2026-08-12). Visual look and dramaturgy stay 1:1; Webflow IX2, the
 * Webflow slider and jQuery are NOT ported — interactions are rebuilt in
 * vanilla CSS/JS (see assets/js/karriere.js / bewerben.js).
 *
 * Everything is scoped under .lyth-karriere so the generic Webflow class
 * names (.my-section, .slider, …) cannot leak into the rest of the theme.
 * Asset URLs resolve relative to this file (assets/css/).
 */

.lyth-karriere {
  /* Webflow variable names, mapped to the same values as site.css tokens */
  --light-blue: #acd7e1;
  --dark-slate-blue: #293c54;
  --steel-blue: #548bab;

  background-color: var(--light-blue);
  color: #333;
  font-size: 14px;
  line-height: 20px;
}

/* The ported pages bring their own Webflow footer (grass + schild + pipe);
   hide the generic site footer so the page closes exactly like the original. */
body.page-template-page-karriere .site-footer,
body.page-template-page-bewerben .site-footer,
body.page-template-page-unterwelt .site-footer {
  display: none;
}

/* Unterwelt: header floats transparent over the Lottie and scrolls out with
   the page. The "Second part" animation STARTS in the light sky world (the
   character climbs into the pipe), so the floating nav is navy like the
   original cms-nav. The animation draws its own logo (click area ported). */
body.page-template-page-unterwelt .site-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: transparent;
  z-index: 50;
}
body.page-template-page-unterwelt .site-header { color: var(--lyth-navy); }
body.page-template-page-unterwelt .site-header .menu-primary__list a { color: var(--lyth-navy); }
body.page-template-page-unterwelt .site-header .menu-toggle { color: var(--lyth-navy); border-color: var(--lyth-navy); }
body.page-template-page-unterwelt .site-header .site-brand { visibility: hidden; }

/* Header floats transparent over the Lottie sky at the top (mirrors the
   original page, where the nav floated over the animation) and scrolls out
   with the page — no sticky bar (user decision 2026-08-13).
   NOTE: /dienstleistungen/ has NO Lottie hero and therefore uses the normal
   site header + footer. */
body.page-template-page-karriere .site-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: transparent;
  z-index: 50;
}
body.page-template-page-karriere .site-header { color: var(--lyth-navy); }
body.page-template-page-karriere .site-header .menu-primary__list a { color: var(--lyth-navy); }
body.page-template-page-karriere .site-header .menu-toggle { color: var(--lyth-navy); border-color: var(--lyth-navy); }
/* The hero animation draws its own LYTH logo top-left (like the original,
   which only put an invisible click area on top). */
body.page-template-page-karriere .site-header .site-brand { visibility: hidden; }

/* ------------------------------------------------------------------ */
/* Layout primitives (Webflow .my-section / .my-container)            */
/* ------------------------------------------------------------------ */

.lyth-karriere .my-section {
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-top: 5vh;
  padding-bottom: 5vh;
  display: flex;
  overflow: hidden;
}
.lyth-karriere .my-section.dark-blue-bg { background-color: var(--dark-slate-blue); }
.lyth-karriere .my-section.light-blue-bg { background-color: var(--light-blue); }
.lyth-karriere .my-section.ground-bg {
  background-image: url("../svg/bg-floor.svg");
  background-position: 50% 0;
  background-repeat: repeat-y;
  background-size: 100%;
}
.lyth-karriere .my-section.sternenhimmel-bg {
  background-image: url("../svg/bg-sternenhimmel.svg");
  background-repeat: repeat-y;
  background-size: 100%;
}
.lyth-karriere .my-section.footer {
  background-color: var(--light-blue);
  padding-top: 50px;
  padding-bottom: 0;
  position: relative;
}

.lyth-karriere .my-container {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 80%;
  max-width: 1600px;
  height: auto;
  display: flex;
  position: relative;
}
.lyth-karriere .my-container.align-right { align-items: flex-end; }
.lyth-karriere .my-container.footer {
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  margin-top: 5vh;
}

/* ------------------------------------------------------------------ */
/* Typography                                                          */
/* ------------------------------------------------------------------ */

.lyth-karriere .my-heading {
  color: #fff;
  width: 100%;
  margin-top: 0;
  margin-bottom: 30px;
  font-size: 2rem;
  font-weight: 400;
  line-height: 2.5rem;
  text-decoration: none;
}
.lyth-karriere .my-heading.dark-blue { color: var(--dark-slate-blue); }
.lyth-karriere .my-heading.middle { text-align: center; }

.lyth-karriere .my-par {
  color: #fff;
  width: 100%;
  font-size: 1.2rem;
  line-height: 1.6rem;
}
.lyth-karriere .my-par.m-top-bottom {
  margin-top: 50px;
  margin-bottom: 50px;
  font-size: 1.3rem;
}
.lyth-karriere .my-par.cap {
  text-transform: uppercase;
  margin-bottom: 0;
}

.lyth-karriere a { text-decoration: none; }

/* ------------------------------------------------------------------ */
/* Buttons (Webflow .w-button + .bewirb-dich-button)                   */
/* ------------------------------------------------------------------ */

.lyth-karriere .bewirb-dich-button {
  color: #fff;
  cursor: pointer;
  background-color: transparent;
  border: 5px solid #fff;
  border-radius: 0;
  padding: 9px 15px;
  font-family: inherit;
  font-size: 1.4rem;
  line-height: 2.5rem;
  text-decoration: none;
  display: inline-block;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .bewirb-dich-button.inverted {
  border-color: var(--light-blue);
  background-color: var(--dark-slate-blue);
  color: #fff;
}
.lyth-karriere .bewirb-dich-button.inverted.zur-unterseite { margin-top: 60px; }
.lyth-karriere .bewirb-dich-button.cms {
  border-color: var(--light-blue);
  background-color: var(--dark-slate-blue);
}

@media (hover: hover) and (pointer: fine) {
  .lyth-karriere .bewirb-dich-button {
    transition: transform 120ms ease, box-shadow 120ms ease;
  }
  .lyth-karriere .bewirb-dich-button:hover {
    transform: translate(4px, 4px);
    box-shadow: 4px 4px #000;
  }
}

/* ------------------------------------------------------------------ */
/* Hero: scroll-driven Lottie (desktop) + play-once Lottie (mobile)    */
/* ------------------------------------------------------------------ */

.lyth-karriere .lottie-wrapper {
  background-color: #77b9ca;
  background-image: linear-gradient(to bottom, var(--light-blue), var(--light-blue));
  height: 400vh;
  position: relative;
}
.lyth-karriere .lottie {
  justify-content: center;
  align-items: center;
  width: 100%;
  position: sticky;
  top: 0;
}
.lyth-karriere .lottie-animation {
  z-index: 10;
  width: 100%;
  height: 56.25vw;
  display: flex;
  position: relative;
}
.lyth-karriere .lottie-animation.mobile { display: none; }
.lyth-karriere .paragraph-5 {
  z-index: 20;
  margin-top: 11%;
  margin-left: 5%;
  font-size: 1.6vw;
  font-weight: 700;
  line-height: 3rem;
  position: absolute;
  top: 0;
  left: 0;
}

/* Invisible click area over the animation's built-in logo (ported from
   Webflow .clickable-logo-in-header) */
.lyth-karriere .clickable-logo-in-header {
  z-index: 20;
  background-color: transparent;
  width: 30vw;
  height: 30vh;
  position: absolute;
  inset: 0% auto auto 0%;
}

/* Reduced motion / JS unavailable: collapse the 400vh scroll runway */
.lyth-karriere .lottie-wrapper.is-static { height: auto; }
.lyth-karriere .lottie-wrapper.is-static .lottie { position: relative; }

/* ------------------------------------------------------------------ */
/* Textbox row (phone + bewerben speech bubbles)                       */
/* ------------------------------------------------------------------ */

.lyth-karriere ._3-col-wrapper {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex: 0 auto;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-content: stretch;
  place-items: stretch stretch;
  width: 100%;
  margin-top: -100px;
  padding-top: 100px;
  padding-bottom: 100px;
  display: grid;
}
.lyth-karriere ._3-col-image {
  width: 100%;
  height: 121.05px;
  max-height: 121.05vh;
  position: static;
}
/* Base w-node rules from the original: the two textboxes hug the center of
   the row (left box right-aligned, right box left-aligned). As non-stretched
   grid items they shrink to the SVG's natural aspect (~378x121) instead of
   stretching across the whole column. */
.lyth-karriere .link-block-main-top { display: block; }
.lyth-karriere .link-block-main-top.image-right { justify-self: end; }
.lyth-karriere .link-block-main-top.image-left { justify-self: start; }

/* ------------------------------------------------------------------ */
/* Consulting section: 60/40 + 7-sprite grid                           */
/* ------------------------------------------------------------------ */

.lyth-karriere ._60-40-col-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-direction: column;
  grid-template-rows: auto;
  grid-template-columns: 40% 60%;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
}
.lyth-karriere ._60-40-one-wrapper {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}
.lyth-karriere ._2-3-grid {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.lyth-karriere ._2-3-grid-box-wrapper {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}
.lyth-karriere ._2-3-grid-box {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 40fr 60fr;
  grid-auto-columns: 1fr;
  align-items: center;
  width: 100%;
  display: grid;
}
.lyth-karriere ._2-3-grid-box-image {
  width: 100%;
  min-width: 100px;
  max-width: 100%;
  height: 100px;
  min-height: 100px;
  max-height: 100px;
}

@media (hover: hover) and (pointer: fine) {
  .lyth-karriere ._2-3-grid-box-wrapper {
    transition: transform 150ms ease;
  }
  .lyth-karriere ._2-3-grid-box-wrapper:hover {
    transform: translateY(-4px);
  }
}

/* ------------------------------------------------------------------ */
/* Offene Stellen (cms heading + job card)                             */
/* ------------------------------------------------------------------ */

.lyth-karriere .cms-heading-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  width: 100%;
  margin-bottom: 5vh;
  display: grid;
}
.lyth-karriere .cms-heading-text {
  font-size: 3rem;
  line-height: 2.5rem;
  margin: 0;
  font-weight: 400;
}
.lyth-karriere .cms-heading-image-wrapper {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.lyth-karriere .cms-heading-image { width: 15%; }

.lyth-karriere .cms-collection-lis-wrapper,
.lyth-karriere .collection-list-wrapper-2 { width: 100%; }
.lyth-karriere .collection-item {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1.5fr 3fr;
  grid-auto-columns: 1fr;
  place-items: center;
  display: grid;
}
.lyth-karriere .image-4 { width: 100%; }

.lyth-karriere .bow-wrapper { margin-bottom: 5vh; }
.lyth-karriere .bow-wrapper._100 { width: 100%; height: auto; }
.lyth-karriere .bow-wrapper.bm { margin-bottom: 5vh; }

.lyth-karriere .box-heading {
  font-size: 2rem;
  line-height: 2.5rem;
  display: inline-block;
  margin: 0;
  font-weight: 700; /* measured 700 on live Webflow (Ubuntumono bold face) */
}
.lyth-karriere .box-heading.button {
  background-color: transparent;
  font-weight: 700;
  cursor: pointer;
  padding: 9px 15px;
}
.lyth-karriere .box-heading.button.dark { color: var(--dark-slate-blue); }
.lyth-karriere .box-heading.button.gaf { padding: 20px 30px; color: #fff; }

.lyth-karriere .box-heading-wrapper {
  border: 5px solid var(--dark-slate-blue);
  background-color: var(--light-blue);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  margin-bottom: -5px;
  padding: 10px 30px;
  display: inline-block;
  position: relative;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .box-heading-wrapper.dark-blue-white {
  background-color: var(--dark-slate-blue);
  color: var(--light-blue);
  border-color: #fff;
}
.lyth-karriere .box-heading-wrapper.dark-blue-light-blue {
  border-color: var(--light-blue);
  background-color: var(--dark-slate-blue);
  color: #fff;
}

.lyth-karriere .box-par-wrapper {
  z-index: 2;
  border: 5px solid var(--dark-slate-blue);
  background-color: #fff;
  padding: 40px 30px;
  position: relative;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .box-par-wrapper.full-stack { border-color: #fff; }
.lyth-karriere .box-par-wrapper.dark-blue-light-blue {
  border-color: var(--light-blue);
  background-color: var(--light-blue);
}

.lyth-karriere .bow-par {
  font-size: 1.2rem;
  line-height: 1.6rem;
  margin: 0 0 10px;
}

.lyth-karriere .box-after-element {
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  display: flex;
}
.lyth-karriere .box-after-element-wrapper {
  justify-content: flex-end;
  display: flex;
}
.lyth-karriere .after-box-content {
  z-index: 3;
  border: 5px solid var(--dark-slate-blue);
  background-color: var(--light-blue);
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  margin-top: -5px;
  padding: 10px 20px;
  position: relative;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .after-box-content.dark-blue-light-blue {
  border-color: var(--light-blue);
  background-color: var(--dark-slate-blue);
  color: #fff;
}
.lyth-karriere .after-box-content.dark-blue-light-blue.grossealtiveflaeche { padding: 0; }

/* ------------------------------------------------------------------ */
/* 2-column text sections                                              */
/* ------------------------------------------------------------------ */

.lyth-karriere ._2-cols-text-wrapper {
  grid-column-gap: 50px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.lyth-karriere ._2-cols-text-wrapper.stay_split {
  grid-template-columns: 1fr 1fr;
  width: 100%;
}

/* ------------------------------------------------------------------ */
/* Kollegen slider — rebuilt as CSS scroll-snap (no Webflow slider)    */
/* ------------------------------------------------------------------ */

.lyth-karriere .top-icons-wrapper {
  justify-content: flex-end;
  width: 100%;
  display: flex;
}
.lyth-karriere .kollegen-image {
  width: 40%;
  margin-bottom: 10vh;
}

.lyth-karriere .kollegen-slider {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  margin-top: 30px;
  margin-bottom: 50px;
  display: flex;
  position: relative;
}
.lyth-karriere .kollegen-slider__mask {
  border: 5px solid var(--dark-slate-blue);
  width: 75%;
  height: auto;
  overflow-x: auto;
  overflow-y: hidden;
  box-shadow: 8px 8px #000;
  display: flex;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  /* Like the original .w-slider-mask: transparent, the section background
     (light blue) shows through the slides. */
  background-color: transparent;
}
.lyth-karriere .kollegen-slider__mask::-webkit-scrollbar { display: none; }
.lyth-karriere .kollegen-slide {
  flex: 0 0 100%;
  scroll-snap-align: start;
  padding: 30px;
}
.lyth-karriere .kollegen-slide__heading {
  color: var(--dark-slate-blue);
  text-align: center;
  font-size: 1.6rem;
  line-height: 2.6rem;
  font-weight: 700;
  margin: 0 0 10px;
}
.lyth-karriere .kollegen-slide__par {
  color: var(--dark-slate-blue);
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.6rem;
  margin: 0;
}
.lyth-karriere .kollegen-slider__arrow {
  flex: 0 0 auto;
  width: 100px;
  height: 100px;
  border: 0;
  cursor: pointer;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: 50%;
}
.lyth-karriere .kollegen-slider__arrow--left { background-image: url("../svg/arrow-dark-left.svg"); }
.lyth-karriere .kollegen-slider__arrow--right { background-image: url("../svg/arrow-dark-right.svg"); }

/* ------------------------------------------------------------------ */
/* Pictures grid (office photos)                                       */
/* ------------------------------------------------------------------ */

.lyth-karriere .pictures-grid {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto 20% auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  margin-top: 100px;
  display: grid;
}
.lyth-karriere .pictures-grid-image-wrapper {
  background-image: url("../img/karriere/buero-1.webp");
  background-position: 0 0;
  background-size: auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
}
.lyth-karriere .pictures-grid-image-wrapper._1 { background-size: cover; }
.lyth-karriere .pictures-grid-image-wrapper._2 {
  background-image: url("../img/karriere/buero-2.webp");
  background-position: 50% 30%;
  background-size: cover;
}
.lyth-karriere .pictures-grid-image-wrapper._3 {
  background-image: url("../img/karriere/buero-3.webp");
  background-position: 50%;
  background-size: cover;
}
.lyth-karriere .pictures-grid-image-wrapper._4 {
  background-image: url("../img/karriere/buero-4.jpg");
  background-size: cover;
  height: 100vh;
  /* Base w-node rule from the original: the tall photo spans all three
     rows of the grid (photos 1-3 stack in the left column beside it). */
  grid-row: span 3;
}

/* ------------------------------------------------------------------ */
/* Chefs image                                                          */
/* ------------------------------------------------------------------ */

.lyth-karriere .image-2 {
  width: 100%;
  display: block;
}

/* ------------------------------------------------------------------ */
/* FullStack program                                                    */
/* ------------------------------------------------------------------ */

.lyth-karriere .full-stack-list-item {
  font-size: 1.2rem;
  line-height: 1.6rem;
}
.lyth-karriere .full-stack-images-wrapper {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 40%;
  display: grid;
  position: absolute;
  right: 360px;
}
.lyth-karriere .full-stack-image { min-width: 100px; width: 100%; }

/* ------------------------------------------------------------------ */
/* Überzeugt? (Keks closing)                                            */
/* ------------------------------------------------------------------ */

.lyth-karriere .cookie-uberzeugt {
  width: 134px;
  position: absolute;
  top: -88px;
  right: -72px;
}

/* ------------------------------------------------------------------ */
/* Footer world (grass, schild, pipe) — ported Webflow footer          */
/* ------------------------------------------------------------------ */

.lyth-karriere .footer-world { /* marker class on .my-section.footer */ }
.lyth-karriere .footer-wrapper {
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  width: 66%;
  height: auto;
  margin-right: 33%;
  display: flex;
  position: relative;
}
.lyth-karriere .div-block-6 {
  width: 50%;
  height: 100%;
  margin-right: 100px;
  position: relative;
  display: inline-block;
}
.lyth-karriere .image-3 {
  width: 100%;
  max-width: none;
  height: 100%;
  display: block;
}
.lyth-karriere .footer-text {
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 50%;
  height: 100%;
  display: flex;
}
.lyth-karriere .footer-list {
  list-style: none;
  padding-left: 0;
  margin: 0 0 20px;
}
.lyth-karriere .footer-li {
  color: var(--dark-slate-blue);
  font-size: 1.2rem;
  line-height: 1.6rem;
}
.lyth-karriere .footer-li.space {
  grid-column-gap: 20px;
  gap: 20px;
  display: flex;
}
.lyth-karriere .footer-impr-link {
  color: var(--dark-slate-blue);
  font-size: 1.2rem;
  line-height: 1.6rem;
  text-decoration: underline;
}
.lyth-karriere .footer-impr-text {
  color: var(--dark-slate-blue);
  font-size: 1.2rem;
  line-height: 1.6rem;
  margin: 0;
}
.lyth-karriere .footer-pipe-wrapper {
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  width: 33%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: auto 0% 0% auto;
}
.lyth-karriere .image-7 { width: 33%; }
.lyth-karriere .pipe-wrapper { width: 66%; position: relative; }
.lyth-karriere .footer-pipe {
  width: 100%;
  height: 100%;
  display: block;
}
.lyth-karriere .footer-button {
  z-index: 99;
  background-color: transparent;
  position: absolute;
  inset: 0%;
}
.lyth-karriere .footer-grass {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

/* ------------------------------------------------------------------ */
/* Bewerben form                                                        */
/* ------------------------------------------------------------------ */

.lyth-karriere .bewerbungs-form { width: 100%; }
.lyth-karriere .form-box { margin-bottom: 50px; }
.lyth-karriere .form-box-heading2 {
  font-size: 2rem;
  line-height: 2rem;
  margin: 0;
  font-weight: 400;
}
.lyth-karriere .box-par-wrapper.form {
  padding-top: 10px;
  padding-bottom: 10px;
}
.lyth-karriere .form-name-wrapper,
.lyth-karriere .form-email-wrapper,
.lyth-karriere .form-text-area-wrapper { width: 100%; }
.lyth-karriere .form-text-field {
  color: #333;
  background-color: #fff;
  border: 0 solid #000;
  width: 100%;
  height: 38px;
  margin-bottom: 0;
  padding: 8px 12px 8px 0;
  font-family: inherit;
  font-size: 1.5rem;
  line-height: 1.5rem;
  display: block;
}
.lyth-karriere .form-text-field:focus { outline: 0; }
.lyth-karriere .form-text-area {
  color: #333;
  background-color: #fff;
  border: 0 solid #000;
  width: 100%;
  min-height: 120px;
  margin-bottom: 0;
  padding: 8px 12px 8px 0;
  font-family: inherit;
  font-size: 1.2rem;
  line-height: 1.4rem;
  overflow: visible;
  resize: vertical;
}
.lyth-karriere .form-text-area:focus { outline: 0; }

.lyth-karriere .form-checkbox-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}
.lyth-karriere .form-checkbox-label-wrapper {
  justify-content: flex-start;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 1.5rem;
  line-height: 1.5rem;
  display: flex;
  cursor: pointer;
}
.lyth-karriere .form-checkbox-label-wrapper input[type="checkbox"] {
  opacity: 0;
  position: absolute;
  z-index: -1;
}
.lyth-karriere .form-checkbox {
  border: 3px solid var(--dark-slate-blue);
  border-radius: 2px;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  background-color: #fff;
}
.lyth-karriere .form-checkbox-label-wrapper input[type="checkbox"]:checked + .form-checkbox {
  background-color: var(--dark-slate-blue);
  background-image: url("../img/checkbox-checkmark.svg");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}
.lyth-karriere .form-checkbox-label-wrapper input[type="checkbox"]:focus-visible + .form-checkbox {
  outline: 2px solid var(--steel-blue);
  outline-offset: 2px;
}
.lyth-karriere .form-checkbox-label {
  margin-left: 20px;
  font-weight: 700;
}

.lyth-karriere .form-file-wrapper {
  margin: 10px;
  position: relative;
}
.lyth-karriere .form-file-upload {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 1.5rem;
  display: flex;
}
.lyth-karriere input[type="file"] { display: none; }
.lyth-karriere .custom-file-upload {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100px;
  border: 4px dashed;
  padding: 0;
  margin: 0;
  text-align: center;
}
.lyth-karriere .custom-file-upload:hover {
  background-color: #b5dbe4;
  cursor: pointer;
}
.lyth-karriere .upload-success {
  justify-content: center;
  align-items: center;
  height: 100px;
  font-size: 1.5rem;
  line-height: 2rem;
  display: none;
}

.lyth-karriere .form-submit-wrapper { width: 100%; }

.lyth-karriere .success-message {
  background-color: var(--steel-blue);
  padding: 60px 30px;
  text-align: center;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .text-block {
  color: var(--light-blue);
  font-size: 2rem;
  font-weight: 700;
  line-height: 2rem;
}
.lyth-karriere .error-message {
  margin-top: 5vh;
  margin-bottom: 5vh;
  padding: 20px;
  background-color: #fff;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .text-block-2 {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 2rem;
}

/* ------------------------------------------------------------------ */
/* Breakpoint: <= 991px                                                */
/* ------------------------------------------------------------------ */

@media screen and (max-width: 991px) {
  .lyth-karriere .lottie-wrapper { height: auto; display: none; }
  .lyth-karriere .lottie-animation.mobile {
    width: 100%;
    height: 56.25vw;
    display: flex;
    position: relative;
  }
  .lyth-karriere ._3-col-wrapper {
    margin-top: 0;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .lyth-karriere ._60-40-col-wrapper { grid-template-columns: 1fr; }
  .lyth-karriere ._60-40-one-wrapper {
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
  }
  .lyth-karriere .my-heading { font-size: 1.5rem; line-height: 2rem; }
  .lyth-karriere .my-par { font-size: 1rem; }
  .lyth-karriere .my-par.m-top-bottom {
    margin-top: 0;
    margin-bottom: 30px;
    font-size: 1rem;
  }
  .lyth-karriere .bewirb-dich-button { font-size: 0.9rem; }
  .lyth-karriere ._2-3-grid { grid-template-columns: 1fr 1fr; }
  .lyth-karriere ._2-3-grid-box { grid-template-columns: 15fr 60fr; }
  .lyth-karriere .kollegen-slide__heading { font-size: 1.5rem; line-height: 1.7rem; }
  .lyth-karriere .kollegen-slide__par { font-size: 1rem; }
  .lyth-karriere .footer-wrapper {
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin-right: 0%;
  }
  .lyth-karriere .footer-li { font-size: 1rem; }
  .lyth-karriere .footer-li.space { justify-content: center; }
  .lyth-karriere .footer-list { text-align: center; width: 100%; }
  .lyth-karriere .footer-impr-link,
  .lyth-karriere .footer-impr-text { font-size: 1rem; }
  .lyth-karriere .bow-wrapper { width: 100%; }
  .lyth-karriere .bow-wrapper._100 { margin-top: 20px; }
  .lyth-karriere .box-heading { font-size: 1.5rem; line-height: 2rem; }
  .lyth-karriere .bow-par { font-size: 1rem; }
  .lyth-karriere .full-stack-list-item { font-size: 1rem; }
  .lyth-karriere .cms-heading-text { font-size: 2rem; }
  .lyth-karriere .footer-pipe-wrapper {
    width: 40%;
    margin-top: 30px;
    position: relative;
  }
  .lyth-karriere .div-block-6 { margin-bottom: 50px; margin-right: 0; }
  .lyth-karriere ._2-cols-text-wrapper {
    flex-direction: column;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
  }
  .lyth-karriere ._2-cols-text-wrapper.stay_split {
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
  }
  .lyth-karriere .form-checkbox-wrapper { grid-template-columns: 1fr; }
  .lyth-karriere .my-container.footer {
    flex-direction: column;
    align-items: center;
  }
}

/* ------------------------------------------------------------------ */
/* Breakpoint: <= 767px                                                */
/* ------------------------------------------------------------------ */

@media screen and (max-width: 767px) {
  .lyth-karriere ._3-col-wrapper {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  .lyth-karriere .my-heading { font-size: 1.2rem; line-height: 1.4rem; }
  .lyth-karriere ._2-3-grid { grid-template-columns: 1fr; }
  .lyth-karriere ._2-3-grid-box { grid-template-columns: 15fr 50fr; }
  .lyth-karriere .kollegen-slider__arrow { width: 50px; height: 50px; background-size: contain; }
  .lyth-karriere .kollegen-slide__heading {
    margin-bottom: 20px;
    font-size: 1.2rem;
    line-height: 1.4rem;
  }
  .lyth-karriere .footer-text { width: 80%; }
  .lyth-karriere .bow-wrapper._100._80 { margin-top: -80px; }
  .lyth-karriere .box-heading { font-size: 1.2rem; line-height: 1.4rem; }
  .lyth-karriere ._3-col-image { width: 80%; }
  .lyth-karriere .kollegen-image { margin-bottom: 5vh; }
  .lyth-karriere .full-stack-image { min-width: 50px; }
  .lyth-karriere .full-stack-images-wrapper { right: 40px; }
  .lyth-karriere .cms-heading-text { font-size: 1.2rem; line-height: 1.4rem; }
  .lyth-karriere .collection-item {
    grid-template-rows: auto;
    grid-template-columns: 1fr;
  }
  .lyth-karriere .image-4 {
    z-index: 100;
    width: 30%;
    margin-top: 30px;
    margin-left: 60%;
    position: relative;
  }
  .lyth-karriere .footer-pipe-wrapper { width: 60%; }
  .lyth-karriere .div-block-6 { width: 80%; }
  .lyth-karriere .link-block-main-top { justify-content: center; display: flex; }
  .lyth-karriere .text-block { font-size: 1.5rem; }
}

/* ------------------------------------------------------------------ */
/* Breakpoint: <= 479px                                                */
/* ------------------------------------------------------------------ */

@media screen and (max-width: 479px) {
  .lyth-karriere .my-container { width: 90%; }
  .lyth-karriere .kollegen-slider__mask { width: 90%; }
  .lyth-karriere .kollegen-slider__arrow { display: none; }
  .lyth-karriere .footer-wrapper {
    flex-direction: column;
    align-items: center;
  }
  .lyth-karriere .footer-text { width: 100%; }
  .lyth-karriere .bow-par { line-height: 1.4rem; }
  .lyth-karriere .box-par-wrapper.full-stack { padding-bottom: 60px; }
  .lyth-karriere .kollegen-image { width: 60%; }
  .lyth-karriere .full-stack-images-wrapper { top: auto; bottom: 0; right: 179px; }
  .lyth-karriere .footer-pipe-wrapper { width: 50%; }
  .lyth-karriere ._2-3-grid-box-wrapper { text-align: left; }
  .lyth-karriere .box-heading.mr-30 { margin-right: 30%; }
}

/* ================================================================== */
/* UNTERWELT (easter egg page, 1:1 port of Webflow /unterwelt)         */
/* ================================================================== */

.lyth-karriere .lottie-wrapper.unterwelt {
  background-color: transparent;
  background-image: url("../svg/bg-sternenhimmel.svg");
  background-position: 50% 0;
  background-repeat: repeat-y;
  background-size: 100%;
  height: 450vh;
}

/* Mobile-only intro (the desktop content lives inside the Lottie) */
.lyth-karriere .my-section.hide-on-desktop { display: none; }

.lyth-karriere .align-left {
  align-items: flex-start;
  /* The uw-heading block is horizontally CENTERED on the live page
     (measured: 622px block at x=407 inside the 1140px container). */
  justify-content: center;
  width: 100%;
  display: flex;
}
.lyth-karriere .uw-heading-wrapper {
  border: 5px solid var(--light-blue);
  background-color: var(--dark-slate-blue);
  margin-bottom: 50px;
  padding: 10px;
  display: inline-block;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .uw-heading {
  color: #fff;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 2rem;
  line-height: 2.5rem;
  font-weight: 700; /* measured 700 on live Webflow */
}
.lyth-karriere .uw-cookie-wrapper {
  width: 200px;
  position: absolute;
  bottom: -81px;
  right: -72px;
}
.lyth-karriere .uw-cookie-wrapper img { width: 100%; }

/* Team photo grid */
.lyth-karriere .uw-image-grid {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  display: grid;
  position: relative;
}
.lyth-karriere .uw-image-grid-image-wrapper {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 400px;
  display: flex;
  overflow: hidden;
}
.lyth-karriere .uw-image-grid-image-wrapper.triple {
  height: 100%;
  position: relative;
  grid-row: span 3;
}
.lyth-karriere .uw-image-grid-image {
  object-fit: cover;
  width: 100%;
  max-width: none;
  height: 100%;
}

/* Video boxes (Teamevents / Room Tour) */
.lyth-karriere .box-content-wrapper-2-cols {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-content: center;
  place-items: start center;
  display: grid;
  width: 100%;
}
.lyth-karriere .box-content-col-1 {
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}
.lyth-karriere .right-col {
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  display: flex;
}
.lyth-karriere .html-embed {
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 400px;
  display: flex;
}
.lyth-karriere .html-embed iframe { width: 100%; height: 100%; border: 0; }
.lyth-karriere .box-par-wrapper.dark-blue-light-blue.centered {
  flex-direction: column;
  align-items: center;
  display: flex;
}
.lyth-karriere .after-box-content.eduard {
  background-color: var(--steel-blue);
  color: #fff;
  border-radius: 20px;
  width: 100%;
  margin-top: 0%;
  margin-right: 14px;
  position: relative;
}
.lyth-karriere .after-box-content-image {
  width: 50px;
  margin-left: 20px;
  margin-right: 20px;
}

/* Sliders: box slides on transparent mask (Teamevents / So tickt unser Team) */
.lyth-karriere .kollegen-slider--boxes { width: 100%; margin-bottom: 0; }
.lyth-karriere .kollegen-slider--boxes .kollegen-slider__mask {
  border: 0;
  box-shadow: none;
  background: transparent;
  width: 75%;
}
.lyth-karriere .kollegen-slider--boxes .kollegen-slide { padding: 30px; }
.lyth-karriere .kollegen-slider--boxes .kollegen-slide .box-par-wrapper { text-align: left; }

/* Slider: steel mask with avatar (Flexible Arbeitszeit) */
.lyth-karriere .kollegen-slider--steel { position: relative; width: 100%; }
.lyth-karriere .kollegen-slider--steel .kollegen-slider__mask {
  background-color: var(--steel-blue);
}
.lyth-karriere .kollegen-slider--steel .kollegen-slide {
  text-align: center;
  padding: 30px 30px 30px 40%;
  color: #fff;
}
.lyth-karriere .kollegen-slider--steel .kollegen-slide p {
  color: #fff;
  font-size: 1.2rem;
  line-height: 1.6rem;
  margin: 0;
  text-align: center; /* matches .slider-par on the live page */
}
.lyth-karriere .kollegen-slider__arrow--white-left { background-image: url("../svg/arrow-white-left.svg"); }
.lyth-karriere .kollegen-slider__arrow--white-right { background-image: url("../svg/arrow-white-right.svg"); }
.lyth-karriere .uw-avatar {
  z-index: 3;
  width: 30%;
  max-width: 300px;
  position: absolute;
  left: 150px; /* clears the 100px arrow button (was 8% = overlapped it) */
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

/* Weiterbildung box */
.lyth-karriere .box-heading-wrapper.dark-blue-white.pr-20 { margin-right: 20%; }
.lyth-karriere .box-heading.white { color: #fff; }
.lyth-karriere .box-par-wrapper.unterwelt-box-kollegen {
  align-items: center;
  padding-right: 191px;
  display: flex;
  border-color: #fff;
}
.lyth-karriere .unterwelt-box-kollegen-image.big-absolute.less {
  z-index: 100;
  width: 300px;
  position: absolute;
  top: -10%;
  right: -10%;
}

/* Chefs: circle portrait swaps to photo on hover (was IX2, now CSS) */
.lyth-karriere .bow-wrapper.chef {
  justify-content: flex-end;
  align-items: center;
  display: flex;
  position: relative;
  width: 100%;
}
.lyth-karriere .bow-wrapper.chef.reverse { justify-content: flex-start; }
.lyth-karriere .unterwelt-box-chef-image {
  z-index: 30;
  width: 300px;
  height: 300px;
  position: absolute;
  left: 0;
}
.lyth-karriere .unterwelt-box-chef-image.reverse { left: auto; right: 0; }
.lyth-karriere .chef-image-normal { width: 300px; position: absolute; top: 0; left: 0; }
.lyth-karriere .chef-image-hover { display: none; width: 300px; position: absolute; top: 0; left: 0; }
@media (hover: hover) and (pointer: fine) {
  .lyth-karriere .unterwelt-box-chef-image:hover .chef-image-normal { display: none; }
  .lyth-karriere .unterwelt-box-chef-image:hover .chef-image-hover { display: block; }
}
.lyth-karriere .uw-chef-facts {
  border: 5px solid var(--dark-slate-blue);
  background-color: var(--steel-blue);
  width: 75%;
  padding: 30px 200px 30px 30px;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .bow-wrapper.chef.reverse .uw-chef-facts { padding: 30px 30px 30px 200px; }
.lyth-karriere .uw-chef-facts p {
  color: #fff;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.6rem;
  margin: 0;
}

/* --- Unterwelt breakpoints ---------------------------------------- */
@media screen and (max-width: 991px) {
  .lyth-karriere .my-section.hide-on-desktop { display: flex; }
  .lyth-karriere .uw-heading { font-size: 1.5rem; line-height: 2rem; }
  .lyth-karriere .uw-cookie-wrapper { width: 150px; bottom: 39px; right: -2px; }
  .lyth-karriere .uw-image-grid-image-wrapper { height: 300px; }
  .lyth-karriere .box-content-wrapper-2-cols {
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
    position: relative;
  }
  .lyth-karriere .right-col { height: auto; }
  .lyth-karriere .unterwelt-box-chef-image { width: 200px; height: 200px; }
  .lyth-karriere .chef-image-normal,
  .lyth-karriere .chef-image-hover { width: 200px; }
  .lyth-karriere .unterwelt-box-kollegen-image.big-absolute.less { width: 150px; top: 0%; }
  .lyth-karriere .bow-wrapper.chef { justify-content: center; align-items: center; }
  .lyth-karriere .kollegen-slider--steel .kollegen-slide { padding-left: 35%; }
}

@media screen and (max-width: 767px) {
  .lyth-karriere .uw-cookie-wrapper { right: -35px; }
  .lyth-karriere .uw-image-grid-image-wrapper { height: 150px; }
  .lyth-karriere .after-box-content-image { margin-left: 10px; margin-right: 10px; }
  .lyth-karriere .unterwelt-box-chef-image { display: none; }
  .lyth-karriere .uw-chef-facts { padding: 20px; width: 100%; }
  .lyth-karriere .bow-wrapper.chef.reverse .uw-chef-facts { padding: 20px; }
  .lyth-karriere .box-par-wrapper.unterwelt-box-kollegen { padding-right: 89px; }
  .lyth-karriere .kollegen-slider--boxes .kollegen-slider__mask { width: 90%; }
  .lyth-karriere .kollegen-slider--steel .kollegen-slide { padding: 20px; }
  .lyth-karriere .uw-avatar { display: none; }
}

@media screen and (max-width: 479px) {
  .lyth-karriere .uw-cookie-wrapper { bottom: -52px; }
  .lyth-karriere .box-par-wrapper.unterwelt-box-kollegen { flex-direction: column; padding-right: 30px; }
  .lyth-karriere .unterwelt-box-kollegen-image.big-absolute { display: none; }
}

/* ================================================================== */
/* DIENSTLEISTUNGEN (B2B Onshoring page, 1:1 port of /dienstleistung)  */
/* ================================================================== */

.lyth-karriere .my-section.dark-green-bg { background-color: #27626e; }
.lyth-karriere .my-section.dark-green-bg.overflow { overflow: visible; }
.lyth-karriere .my-section.dark-green-bg.spacing {
  justify-content: space-between;
  align-items: center;
  padding-top: 10vh;
  padding-bottom: 10vh;
}

/* Dienstleistungen carries the site-wide 3-band sky (lyth-sky-page on the
   wrapper): the flat light-blue sections go transparent so the bands from
   site.css show through. */
.lyth-karriere.lyth-sky-page .my-section.light-blue-bg { background-color: transparent; }
.lyth-karriere.lyth-sky-page { background-color: var(--lyth-sky); }
/* Breathing room between the intro box and the first color section */
.lyth-karriere.lyth-sky-page .lyth-page-hero { padding-bottom: 64px; }

/* Target sprite hangs over the bottom-right corner of the intro box
   (same pattern as the Keks on the Karriere closing box). */
.lyth-karriere .lyth-dienst-target {
  width: 170px;
  position: absolute;
  bottom: -70px;
  right: -55px;
  z-index: 3;
}
@media screen and (max-width: 767px) {
  .lyth-karriere .lyth-dienst-target { width: 110px; bottom: -45px; right: -20px; }
}

/* Original: 3-column grid whose children all span all 3 columns (verified
   against the live page at 1440px) — i.e. full-width stacked copy. */
.lyth-karriere ._3-col-wrapper.b2b {
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  padding-top: 60px;
  padding-bottom: 40px;
  margin-top: 0;
}
.lyth-karriere ._3-col-wrapper.b2b > * { grid-column: span 3; }
/* B2B typography normalized to the site-wide scale (site.css :root tokens):
   body copy 1.3rem, section headings 2rem — the live Webflow B2B page used
   larger sizes (24-40px) than the rest of the ported world; unified per
   user request 2026-08-14. */
.lyth-karriere .b2b-heading {
  color: var(--dark-slate-blue);
  text-align: left;
  align-self: flex-start;
  font-size: 2rem;
  line-height: 2.5rem;
  font-weight: 400;
  margin: 0;
  display: flex;
}
.lyth-karriere .b2b-heading.white { color: #fff; padding-bottom: 0; }
.lyth-karriere .b2b-heading.white.padding-bottom { padding-bottom: 100px; }
.lyth-karriere .b2b-heading.white.center { text-align: center; align-self: center; }
.lyth-karriere .b2b-heading.padding { padding-top: 20px; padding-bottom: 40px; }
.lyth-karriere .b2b-par {
  color: var(--dark-slate-blue);
  padding-top: 20px;
  padding-bottom: 10px;
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 1.7rem;
  margin: 0;
}
.lyth-karriere .b2b-par.black { color: #333; }
.lyth-karriere .b2b-par.white-center { color: #fff; text-align: center; padding-bottom: 40px; }
.lyth-karriere .b2b-list-item { font-size: 1.3rem; line-height: 1.7rem; }
.lyth-karriere .b2b-list-item.no-item {
  color: var(--dark-slate-blue);
  padding-bottom: 0;
  list-style-type: none;
  margin: 0;
}

.lyth-karriere .bow-wrapper._100.bm.b2b {
  flex-flow: column;
  justify-content: flex-end;
  width: 90%;
  display: flex;
}
.lyth-karriere .box-heading.b2b { font-size: 1.3rem; line-height: 2rem; }
.lyth-karriere .box-heading-wrapper.dark-green-white {
  width: 75%;
  color: var(--light-blue);
  background-color: #27626e;
  border-color: #fff;
  display: inline-block;
}
.lyth-karriere .box-par-wrapper.full-stack.small-padding {
  justify-content: space-between;
  align-items: center;
  height: 77%;
  min-height: 300px;
  padding: 10px 10px 10px 5px;
  display: flex;
}
.lyth-karriere .full-stack-list.strech {
  grid-column-gap: 1.2rem;
  grid-row-gap: 1.2rem;
  gap: 1.2rem;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
  margin: 0;
}

.lyth-karriere .div-block-16 {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  grid-template-rows: auto auto auto auto auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  padding-bottom: 5vh;
  padding-left: 0;
  display: grid;
  width: 100%;
}
.lyth-karriere ._2-cols-text-wrapper.b2b-list {
  grid-template-rows: auto;
  grid-template-columns: 1fr 7.25fr;
  line-height: 20px;
  align-items: center;
}
.lyth-karriere .number {
  background-color: var(--dark-slate-blue);
  color: #fff;
  width: 58px;
  height: 60px;
  box-shadow: 8px 8px #000;
}
.lyth-karriere .number-heading {
  text-align: center;
  color: #fff;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 40px;
  line-height: 40px;
  font-weight: 400;
  margin: 0;
}

.lyth-karriere .b2b-image {
  z-index: 6;
  align-self: flex-end;
  width: 5rem;
  min-width: 50px;
}
.lyth-karriere .b2b-image.overflow {
  width: auto;
  max-width: 400px;
  margin-bottom: -5%;
  padding-right: 220px;
  position: relative;
  bottom: 110px;
}
.lyth-karriere .b2b-image.wrapped { width: 10rem; }
.lyth-karriere .b2b-image-wrapper {
  justify-content: flex-end;
  align-items: flex-start;
  display: flex;
  position: relative;
  left: 4rem;
}
.lyth-karriere .box-par-wrapper.branche-box { width: 70%; height: 100%; position: relative; }
.lyth-karriere .text-block-2.padding-bottom { padding-bottom: 20px; display: block; margin: 0; }
.lyth-karriere .text-block-2.padding-bottom.bold { font-size: 1.5rem; }
.lyth-karriere .full-stack-images-wrapper.position-right {
  grid-template-columns: 1fr 1fr 1fr;
  right: 40px;
}
.lyth-karriere .b2b-tech-list { margin: 0; }
.lyth-karriere .full-stack-list-item.dark-blue { color: var(--dark-slate-blue); }
.lyth-karriere .dienstleistungen-hands { width: 15%; min-width: 140px; }

@media screen and (max-width: 991px) {
  .lyth-karriere .b2b-heading { font-size: 1.8rem; line-height: 2.2rem; }
  .lyth-karriere .b2b-par { font-size: 1.2rem; }
  .lyth-karriere .b2b-list-item { font-size: 1.1rem; line-height: 1.5rem; }
  .lyth-karriere .b2b-image-wrapper { left: 2rem; }
  .lyth-karriere .b2b-heading.white.padding-bottom { padding-bottom: 40px; }
}

@media screen and (max-width: 767px) {
  .lyth-karriere .full-stack-images-wrapper.position-right { top: auto; }
  .lyth-karriere .box-par-wrapper.branche-box { width: 90%; padding: 10px 5px; }
  .lyth-karriere .b2b-image.overflow { padding-right: 0; }
  .lyth-karriere .bow-wrapper._100.bm.b2b { width: 100%; }
}

@media screen and (max-width: 479px) {
  .lyth-karriere ._3-col-wrapper.b2b { grid-template-columns: 1fr; }
  .lyth-karriere .b2b-image-wrapper { left: auto; }
  .lyth-karriere .box-heading-wrapper.dark-green-white { width: 100%; }
}

/* ------------------------------------------------------------------ */
/* Reduced motion                                                      */
/* ------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  .lyth-karriere .kollegen-slider__mask { scroll-behavior: auto; }
  .lyth-karriere .bewirb-dich-button,
  .lyth-karriere ._2-3-grid-box-wrapper {
    transition: none;
  }
}