/* One 2048 × 1080 composition, scaled as a whole at every screen size.
 * The heading occupies 199 reference pixels above the original 881px facts.
 * 1cqw = 20.48 reference pixels. No minimum fonts or mobile rearrangement.
 */
.bimmerle_strength,
.bimmerle_strength *,
.bimmerle_strength *::before,
.bimmerle_strength *::after {
  box-sizing: border-box;
}

.bimmerle_strength {
  --bs-accent: #b80e1d;
  --bs-ink: #f3f3f3;
  --bs-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --bs-intro-pace: 1.6;
  --bs-intro-delay: 0.5s;
  position: relative;
  width: auto;
  margin: 0 calc(50% - 50vw);
  color: var(--bs-ink);
  background: transparent;
  text-align: left;
  overflow: visible;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.bs-frame {
  position: relative;
  container-type: inline-size;
  width: 100%;
  max-width: calc(100svh * 2048 / 1080);
  aspect-ratio: 2048 / 1080;
  margin: 0 auto;
}

.bs-canvas {
  position: absolute;
  inset: 9.716797cqw 0 0;
}

.bs-masthead {
  position: absolute;
  inset: 0 0 auto;
  height: 9.716797cqw;
}

.bs-heading-backdrop {
  position: absolute;
  top: -15%;
  left: 50%;
  width: 57.128906cqw;
  height: 130%;
  transform: translateX(-50%);
  pointer-events: none;
  mask-image: linear-gradient(to right, transparent, #000 15%, #000 85%, transparent);
  --bs-fade-duration: 1.5s;
  --bs-motion-duration: 1.8s;
  --bs-fade-ease: cubic-bezier(0.42, 0, 0.22, 1);
  --bs-enter-y: 0.292969cqw;
  --bs-enter-scale-x: 0.98;
  --bs-enter-scale-y: 0.98;
  --bs-delay: 0s;
}

.bimmerle_strength .bs-heading-image {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  opacity: 0.18;
}

.bimmerle_strength .bs-heading {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin: 0;
  padding: 0;
  color: var(--bs-ink);
  font-family: 'DM Sans', sans-serif;
  font-style: normal;
  text-align: center;
  text-transform: none;
  letter-spacing: normal;
}

.bs-headline-main,
.bs-headline-script {
  /* A gentle fade onset, with the longer rise settling after the fade. */
  --bs-fade-duration: 1.25s;
  --bs-motion-duration: 1.5s;
  --bs-fade-ease: cubic-bezier(0.42, 0, 0.22, 1);
  --bs-enter-scale-x: 0.985;
  --bs-enter-scale-y: 0.985;
}

.bs-headline-main {
  display: block;
  font-size: 3.330078cqw;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  --bs-enter-y: 1.171875cqw;
  --bs-delay: 0s;
}

.bs-headline-script {
  display: block;
  color: var(--bs-accent);
  font-family: 'Dancing Script', cursive;
  font-size: 3.759766cqw;
  line-height: 1.05;
  font-weight: 600;
  --bs-enter-y: 1.367188cqw;
  --bs-fade-duration: 1.35s;
  --bs-motion-duration: 1.65s;
  --bs-delay: 0.3s;
}

.bs-column {
  position: absolute;
  top: 0;
  height: 100%;
  /* Headings, stems and circle centers share the column's center axis. */
  --bs-node-x: 50%;
  --bs-text-x: calc(var(--bs-node-x) + 1.5625cqw);
}

.bs-column--company { left: 0; width: 24.316406%; }
.bs-column--production { left: 24.316406%; width: 25.390625%; }
.bs-column--capacity { left: 49.707031%; width: 25.585938%; }
.bs-column--logistics { left: 75.292969%; width: 24.707031%; }

.bimmerle_strength .bs-title {
  position: absolute;
  top: 4.76731%;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  color: var(--bs-ink);
  font-family: 'DM Sans', sans-serif;
  font-size: 1.3671875cqw;
  line-height: 1.2;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
}

.bs-underline {
  position: absolute;
  top: 9.761635%;
  left: calc(50% - 2.099609cqw);
  width: 4.199219cqw;
  height: 0.097656cqw;
  background: linear-gradient(to right, transparent, var(--bs-accent) 35%, var(--bs-accent) 65%, transparent);
  --bs-delay: calc(var(--bs-column-delay) + 0.14s);
}

.bs-separator {
  position: absolute;
  top: 4.540295%;
  right: 0;
  width: 1px;
  height: 91.941%;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.24), transparent);
  --bs-delay: calc(var(--bs-column-delay) + 0.22s);
}

.bs-column:last-child .bs-separator { display: none; }

.bs-stem,
.bs-separator {
  transform-origin: center center;
}

.bimmerle_strength .bs-facts,
.bimmerle_strength .bs-stat,
.bimmerle_strength .bs-value,
.bimmerle_strength .bs-label {
  margin: 0;
  padding: 0;
  border: 0;
}

.bs-fact {
  position: absolute;
  left: 0;
  width: 100%;
  height: 22.701475%;
}

/* Dot centers match the reference, including the uneven production spacing. */
.bs-fact--founded { top: 15.096481%; }
.bs-fact--employees { top: 40.976163%; }
.bs-fact--locations { top: 68.671964%; }
.bs-fact--stills { top: 10.783201%; }
.bs-fact--rectification { top: 31.328036%; }
.bs-fact--filling { top: 53.68899%; }
.bs-fact--climate { top: 73.439274%; }
.bs-fact--tanks { top: 24.631101%; }
.bs-fact--barrels { top: 61.066969%; }
.bs-fact--pallets { top: 28.036322%; }
.bs-fact--trucks { top: 61.520999%; }

.bs-art {
  position: absolute;
  left: 5%;
  top: 0;
  width: 40%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  --bs-delay: var(--bs-fact-delay);
}

.bs-column--production .bs-art { left: 10%; width: 32%; }
.bs-column--capacity .bs-art { left: 5%; width: 42%; }
.bs-column--logistics .bs-art { left: 5%; width: 38%; }
.bs-fact--pallets .bs-art { top: -18%; height: 136%; }
.bs-fact--climate .bs-art { left: 12%; width: 27%; height: 78%; top: 11%; }

.bimmerle_strength .bs-image,
.bs-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.bs-placeholder { color: rgba(255, 255, 255, 0.42); }

.bs-stem {
  position: absolute;
  left: calc(var(--bs-node-x) - 0.5px);
  top: 0;
  width: 1px;
  height: 100%;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.75), transparent);
  --bs-delay: calc(var(--bs-fact-delay) + 0.06s);
}

.bs-dot {
  position: absolute;
  left: calc(var(--bs-node-x) - 0.390625cqw);
  top: calc(50% - 0.390625cqw);
  width: 0.78125cqw;
  height: 0.78125cqw;
  border-radius: 50%;
  background: #fff;
  --bs-delay: calc(var(--bs-fact-delay) + 0.12s);
}

.bimmerle_strength .bs-value {
  position: absolute;
  left: var(--bs-text-x);
  top: calc(50% - 1.3671875cqw);
  color: var(--bs-accent);
  font-size: 2.44140625cqw;
  line-height: 1.1;
  font-weight: 500;
  white-space: nowrap;
  --bs-delay: calc(var(--bs-fact-delay) + 0.18s);
}

.bs-suffix {
  margin-left: 0.24em;
  font-size: 0.64em;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.bs-suffix--percent { margin-left: 0; font-size: 1em; letter-spacing: 0; font-weight: inherit; }

.bimmerle_strength .bs-label {
  position: absolute;
  left: var(--bs-text-x);
  top: calc(50% + 1.513672cqw);
  width: calc(100% - var(--bs-text-x) - 3%);
  color: var(--bs-ink);
  font-size: 1.025390625cqw;
  line-height: 1.35;
  font-weight: 400;
  white-space: pre-line;
  --bs-delay: calc(var(--bs-fact-delay) + 0.24s);
}

/* Explicit start frames also animate slides that are active on first paint. */
@keyframes bs-enter-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes bs-enter-rise {
  from { translate: 0 var(--bs-enter-y, 0.683594cqw); }
  to { translate: 0 0; }
}

@keyframes bs-enter-scale {
  from { scale: var(--bs-enter-scale-x, 1) var(--bs-enter-scale-y, 1); }
  to { scale: 1; }
}

/* Fade the parent on exit while its children's intro frames stay intact. */
.bimmerle_strength.is-enhanced {
  transition: opacity 0.45s var(--bs-ease);
}

.bimmerle_strength.is-enhanced.bs-leaving { opacity: 0; }
.bimmerle_strength.bs-leaving .bs-reveal { animation-play-state: paused; }

/* Visible final content is the default if JavaScript is unavailable. */
.bimmerle_strength.is-enhanced .bs-reveal {
  opacity: 0;
  translate: 0 0.683594cqw;
  transition: opacity 0.75s var(--bs-ease), translate 0.95s var(--bs-ease), scale 0.95s var(--bs-ease);
  transition-delay: 0s;
}

.bimmerle_strength.is-enhanced .bs-underline {
  --bs-enter-y: 0cqw;
  --bs-enter-scale-x: 0;
  translate: none;
  scale: 0 1;
}
.bimmerle_strength.is-enhanced .bs-stem,
.bimmerle_strength.is-enhanced .bs-separator {
  --bs-enter-y: 0cqw;
  --bs-enter-scale-y: 0;
  translate: none;
  scale: 1 0;
}
.bimmerle_strength.is-enhanced .bs-dot {
  --bs-enter-y: 0cqw;
  --bs-enter-scale-x: 0.65;
  --bs-enter-scale-y: 0.65;
  translate: none;
  scale: 0.65;
}

.bimmerle_strength.is-enhanced.is-visible .bs-reveal {
  opacity: 1;
  translate: 0 0;
  scale: 1;
  --bs-enter-delay: calc(var(--bs-intro-delay) + var(--bs-delay, var(--bs-column-delay, 0s)) * var(--bs-intro-pace));
  animation:
    bs-enter-fade calc(var(--bs-fade-duration, 0.75s) * var(--bs-intro-pace)) var(--bs-fade-ease, var(--bs-ease)) var(--bs-enter-delay) both,
    bs-enter-rise calc(var(--bs-motion-duration, 0.95s) * var(--bs-intro-pace)) var(--bs-ease) var(--bs-enter-delay) both,
    bs-enter-scale calc(var(--bs-motion-duration, 0.95s) * var(--bs-intro-pace)) var(--bs-ease) var(--bs-enter-delay) both;
}

/* Hover uses parents and inner artwork/number nodes so its transitions stay
 * independent of the staggered intro on .bs-reveal.
 */
@media (hover: hover) and (pointer: fine) {
  .bimmerle_strength .bs-column,
  .bimmerle_strength .bs-fact {
    transition: opacity 0.4s var(--bs-ease);
  }

  .bimmerle_strength .bs-image,
  .bimmerle_strength .bs-placeholder {
    opacity: 0.85;
    transition: opacity 0.4s var(--bs-ease), filter 0.4s var(--bs-ease), color 0.4s var(--bs-ease);
  }

  .bimmerle_strength .bs-number,
  .bimmerle_strength .bs-suffix {
    display: inline-block;
    transition: filter 0.4s var(--bs-ease);
  }

  .bimmerle_strength:has(.bs-fact:hover) .bs-column:not(:has(.bs-fact:hover)),
  .bimmerle_strength:has(.bs-fact:hover) .bs-column:has(.bs-fact:hover) .bs-fact:not(:hover) {
    opacity: 0.6;
  }

  .bimmerle_strength .bs-fact:hover .bs-image,
  .bimmerle_strength .bs-fact:hover .bs-placeholder {
    opacity: 1;
    filter: brightness(1.15);
  }

  .bimmerle_strength .bs-fact:hover .bs-placeholder {
    color: rgba(255, 255, 255, 0.7);
  }

  .bimmerle_strength .bs-fact:hover .bs-number,
  .bimmerle_strength .bs-fact:hover .bs-suffix {
    filter: brightness(1.2);
  }
}

@media (prefers-reduced-motion: reduce) {
  .bimmerle_strength.is-enhanced,
  .bimmerle_strength .bs-column,
  .bimmerle_strength .bs-fact,
  .bimmerle_strength .bs-image,
  .bimmerle_strength .bs-placeholder,
  .bimmerle_strength .bs-number,
  .bimmerle_strength .bs-suffix {
    transition: none;
  }

  .bimmerle_strength.is-enhanced .bs-reveal,
  .bimmerle_strength.is-enhanced.is-visible .bs-reveal {
    opacity: 1;
    translate: none;
    scale: none;
    transition: none;
    animation: none;
  }
}