/* O.CT V6 / V8 FourStroke */

body.page-fourstroke {
  color: #07111b;
  background: #f4f6f8;
}

body.page-fourstroke main {
  position: relative;
  z-index: 1;
}

body.page-fourstroke .nav::before {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.42) 55%, transparent 100%);
}

/* ── HERO (Foto — Typo wie Motor-Select / V8 Verado) ── */
.oct-fs-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 100vh;
  min-height: 100dvh;
  padding: calc(var(--nav-padding-top, 66px) + 24px) 0 48px;
  background-color: #060a10;
}

.oct-fs-hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden;
}

.oct-fs-hero__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 58% center;
  background: #060a10;
  transform: scale(1);
  transform-origin: 58% center;
  animation: octHeroKenBurnsZoom 24s ease-out forwards;
  will-change: transform;
}

.oct-fs-hero__shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(5, 8, 14, 0.9) 0%, rgba(5, 8, 14, 0.58) 34%, rgba(5, 8, 14, 0.16) 58%, rgba(5, 8, 14, 0.42) 100%);
}

.oct-fs-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 1px;
  z-index: 3;
  background: linear-gradient(90deg, transparent, rgba(255, 226, 0, 0.55), transparent);
}

.oct-fs-hero__inner {
  position: relative;
  z-index: 2;
  width: min(var(--max), calc(100% - var(--edge) * 2));
  margin: 0 auto;
  display: block;
}

.oct-fs-hero__copy {
  max-width: min(880px, 100%);
}

/* Unten links — gleicher 1600er Rahmen wie Platforms-Section */
.oct-fs-hero__stats {
  position: absolute;
  left: 50%;
  bottom: clamp(calc(36px + 2cm), calc(4.5vh + 2cm), calc(56px + 2cm));
  z-index: 4;
  transform: translateX(-50%);
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 14px;
  width: min(var(--max), calc(100% - var(--edge) * 2));
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.oct-fs-hero__stats .oct-fs-hero__stat {
  flex: 0 1 280px;
  max-width: 280px;
}

.oct-fs-hero__stat {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1 1 200px;
  min-width: 0;
  min-height: 96px;
  padding: 22px 20px 22px 22px;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.155) 0%, rgba(255,255,255,0.070) 30%, rgba(8,12,18,0.76) 58%, rgba(255,255,255,0.040) 100%),
    repeating-linear-gradient(115deg, rgba(255,255,255,0.035) 0px, rgba(255,255,255,0.035) 1px, rgba(255,255,255,0.000) 2px, rgba(255,255,255,0.000) 7px);
  border: 1px solid rgba(220, 226, 235, 0.30);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.040),
    inset 0 18px 28px rgba(255,255,255,0.040),
    0 14px 28px rgba(0,0,0,0.36);
  backdrop-filter: blur(12px) saturate(1.05);
  -webkit-backdrop-filter: blur(12px) saturate(1.05);
  transition: border-color 0.28s ease, background 0.28s ease, transform 0.28s ease, box-shadow 0.28s ease;
}

.oct-fs-hero__stat::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #FFE200;
  box-shadow: 0 0 10px rgba(255, 226, 0, 0.18);
  pointer-events: none;
}

.oct-fs-hero__stat::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,0.13) 0%, rgba(255,255,255,0.00) 34%, rgba(255,255,255,0.00) 100%);
  opacity: 0.55;
}

.oct-fs-hero__stat:hover {
  transform: translateY(-3px);
  border-color: rgba(255, 226, 0, 0.82);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.065),
    inset 0 18px 28px rgba(255,255,255,0.050),
    0 16px 34px rgba(0,0,0,0.46),
    0 0 18px rgba(255,226,0,0.12);
}

.oct-fs-hero__stat:hover::before {
  width: 3px;
}

.oct-fs-hero__stat-icon {
  position: relative;
  z-index: 2;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #FFE200;
}

.oct-fs-hero__stat h4 {
  position: relative;
  z-index: 2;
  margin: 0 0 5px;
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.2;
  font-weight: 800;
  color: #fff;
}

.oct-fs-hero__stat p {
  position: relative;
  z-index: 2;
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.78);
}

.oct-fs-hero .oct-kicker {
  display: block;
  margin: 0 0 18px;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--y);
  text-shadow: 0 0 18px rgba(255, 226, 0, 0.16), 0 4px 16px rgba(0, 0, 0, 0.48);
  opacity: 0;
  transform: translateX(-22px);
  animation: octFsKickerReveal 1s cubic-bezier(0.16, 1, 0.3, 1) 0.18s forwards;
}

.oct-fs-hero .oct-kicker::before {
  display: none;
  content: none;
}

.oct-fs-hero .oct-title {
  margin: 0 0 24px;
  max-width: 18ch;
  font-size: clamp(34px, 4.6vw, 52px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.6px;
  text-transform: uppercase;
  color: #fff;
  text-shadow: 0 8px 26px rgba(0, 0, 0, 0.42);
  opacity: 0;
  filter: blur(8px);
  clip-path: inset(0 100% 0 0);
  animation: octFsTitleReveal 1.25s cubic-bezier(0.16, 1, 0.3, 1) 0.42s forwards;
}

.oct-fs-hero .oct-title::after {
  content: "";
  display: block;
  width: 46px;
  height: 4px;
  margin: 18px 0 0;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 226, 0, 0.98), rgba(255, 226, 0, 0.84));
  box-shadow: 0 0 16px rgba(255, 226, 0, 0.14);
}

.oct-fs-hero .oct-lead {
  margin: 22px 0 0;
  max-width: 780px;
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.68;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.86);
  text-shadow: 0 4px 18px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform: translateY(18px);
  filter: blur(5px);
  animation: octFsLeadReveal 1.15s cubic-bezier(0.16, 1, 0.3, 1) 0.78s forwards;
}

@keyframes octFsKickerReveal {
  0% { opacity: 0; transform: translateX(-22px); filter: blur(5px); }
  100% { opacity: 1; transform: translateX(0); filter: blur(0); }
}

@keyframes octFsTitleReveal {
  0% { opacity: 0; filter: blur(8px); clip-path: inset(0 100% 0 0); transform: translateY(8px); }
  55% { opacity: 1; filter: blur(2px); }
  100% { opacity: 1; filter: blur(0); clip-path: inset(0 0 0 0); transform: translateY(0); }
}

@keyframes octFsLeadReveal {
  0% { opacity: 0; transform: translateY(18px); filter: blur(5px); }
  100% { opacity: 1; transform: translateY(0); filter: blur(0); }
}

/* ── PLATTFORMEN (hell + Wave-BG als SVG, full-bleed, ohne Gelbfleck) ── */
.oct-fs-platforms {
  --fs-frame-inset: 56px;
  --fs-copy-bottom: 56px;
  --fs-cta-h: 48px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto;
  row-gap: 0;
  height: auto;
  max-height: none;
  min-height: 0;
  color: #07111b;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafb 48%, #ffffff 100%);
}

.oct-fs-platforms__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.58;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1800' height='1100' viewBox='0 0 1800 1100'%3E%3Cg fill='none' stroke='%23c5ced6' stroke-width='1'%3E%3Cpath d='M-80 90 C240 18 460 170 740 96 S1200 50 1520 108 S1820 70 1960 40' opacity='.55'/%3E%3Cpath d='M-80 118 C240 46 460 198 740 124 S1200 78 1520 136 S1820 98 1960 68' opacity='.38'/%3E%3Cpath d='M-60 520 C260 430 520 600 820 510 S1280 440 1580 520 S1840 560 1980 470' opacity='.32'/%3E%3Cpath d='M-80 980 C240 880 470 1060 760 970 S1220 900 1520 980 S1800 1020 1960 920' opacity='.5'/%3E%3Cpath d='M-80 1008 C240 908 470 1088 760 998 S1220 928 1520 1008 S1800 1048 1960 948' opacity='.34'/%3E%3C/g%3E%3Cg fill='none' stroke='%23FFE200' stroke-width='1.15'%3E%3Cpath d='M-40 210 C280 120 540 280 840 190 S1300 140 1600 200 S1840 150 1980 110' opacity='.32'/%3E%3Cpath d='M-40 860 C280 760 520 950 840 850 S1280 780 1580 860 S1820 900 1980 800' opacity='.26'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 100% auto;
  background-position: center top;
  background-repeat: repeat-y;
}

.oct-fs-platforms__inner {
  position: relative;
  z-index: 1;
  width: min(var(--max), calc(100% - var(--edge) * 2));
  margin: 0 auto;
}

.oct-fs-section-head {
  max-width: 760px;
  margin-bottom: 42px;
}

.oct-fs-section-head h2 {
  margin: 0;
  color: #fff;
  font-size: 34px;
  font-weight: 900;
  text-transform: uppercase;
}

.oct-fs-section-head .oct-fs-line {
  width: 58px;
  height: 3px;
  margin: 16px 0 18px;
  background: var(--y);
  box-shadow: 0 0 12px rgba(255, 226, 0, 0.22);
}

.oct-fs-section-head p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 18px;
  line-height: 1.68;
}

.oct-fs-section-head--light h2 {
  color: #07111b;
}

.oct-fs-section-head--light .oct-fs-line {
  box-shadow: none;
}

.oct-fs-section-head--light p {
  color: #4a5868;
}

.oct-fs-showcase {
  position: relative;
  z-index: 5;
  display: flex;
  min-height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.oct-fs-showcase--v6 {
  grid-row: 1;
  align-items: center;
  padding: clamp(36px, 5vh, 56px) 0 clamp(8px, 1.2vh, 18px);
  margin: 0;
  min-height: 0;
}

/* Nur noch V6-Showcase — volle Viewport-Höhe auf großen Screens */
.oct-fs-platforms--v6-only {
  grid-template-rows: auto;
  min-height: 100vh;
  min-height: 100svh;
  align-content: center;
}

.oct-fs-platforms--v6-only .oct-fs-showcase--v6 {
  padding: clamp(48px, 7vh, 80px) 0 clamp(48px, 7vh, 80px);
  min-height: inherit;
  display: flex;
  align-items: center;
}

.oct-fs-showcase--v8 {
  grid-row: 2;
  align-items: center;
  padding: clamp(8px, 1.2vh, 18px) 0 clamp(36px, 5vh, 56px);
  margin: 0;
  min-height: 0;
}

.oct-fs-showcase__shell {
  width: min(var(--max), calc(100% - clamp(90px, 6.5vw, 140px) * 2));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
  height: auto;
  min-height: 0;
  padding: clamp(28px, 4vh, 48px) 0;
  box-sizing: border-box;
}

.oct-fs-showcase--v6 .oct-fs-showcase__shell {
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
}

.oct-fs-showcase--v8 .oct-fs-showcase__shell {
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
}

.oct-fs-showcase--v6 .oct-fs-showcase__media {
  align-self: stretch;
}

.oct-fs-showcase--v6 .oct-fs-showcase__copy,
.oct-fs-showcase--v8 .oct-fs-showcase__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: center;
  justify-self: stretch;
  width: 100%;
  max-width: 560px;
  height: auto;
  min-height: 0;
  padding: clamp(24px, 4vh, 48px) clamp(8px, 2vw, 24px);
  margin: 0;
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  overflow: visible;
}

.oct-fs-showcase__media {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 10;
  width: 100%;
  height: 100%;
  min-height: min(420px, 52vh);
  overflow: visible;
  margin: 0;
  padding: clamp(16px, 3vh, 32px) clamp(8px, 2vw, 20px);
  box-sizing: border-box;
}

/* Dezenter Gold-Glow hinter dem Motor beim Hover */
.oct-fs-showcase__media::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 52%;
  z-index: 1;
  width: min(72%, 340px);
  height: min(58%, 440px);
  transform: translate(-50%, -50%) scale(0.88);
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(
      ellipse at 50% 58%,
      rgba(255, 226, 0, 0.14) 0%,
      rgba(255, 226, 0, 0.05) 38%,
      transparent 72%
    );
  transition:
    opacity 0.5s ease,
    transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}

.oct-fs-showcase__media::after {
  display: none !important;
  content: none !important;
}

.oct-fs-showcase--v8 .oct-fs-showcase__media {
  justify-content: center;
}

/* Desktop: Motoren in der jeweiligen Spalte zentriert (rechte / linke Hälfte) */
@media (min-width: 1101px) {
  .oct-fs-showcase__shell {
    width: min(var(--max), calc(100% - var(--edge) * 2));
  }

  .oct-fs-showcase--v6 .oct-fs-showcase__media,
  .oct-fs-showcase--v8 .oct-fs-showcase__media {
    justify-content: center;
    align-items: center;
    padding-left: clamp(8px, 1.5vw, 20px);
    padding-right: clamp(8px, 1.5vw, 20px);
  }

  .oct-fs-showcase--v6 .oct-fs-showcase__media img,
  .oct-fs-showcase--v8 .oct-fs-showcase__media img {
    margin-left: auto;
    margin-right: auto;
    object-position: center center;
    transform-origin: center 88%;
    max-width: min(100%, 500px);
  }
}

@media (min-width: 1400px) {
  .oct-fs-showcase--v6 .oct-fs-showcase__media img,
  .oct-fs-showcase--v8 .oct-fs-showcase__media img {
    max-width: min(100%, 540px);
  }
}

/* Ganzer Motor (freigestellt) — zentriert in der Spalte */
.oct-fs-showcase__media img {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  z-index: 2;
  display: block;
  width: auto;
  max-width: min(100%, 420px);
  height: auto;
  max-height: min(78vh, 78dvh, 780px);
  margin: 0 auto;
  padding: 0;
  border: 0;
  object-fit: contain;
  object-position: center center;
  transform: scale(1) translateY(0);
  transform-origin: center 88%;
  pointer-events: none;
  filter:
    drop-shadow(0 22px 28px rgba(20, 28, 38, 0.18))
    drop-shadow(0 10px 14px rgba(20, 28, 38, 0.1));
  transition:
    transform 0.65s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.45s ease;
}

@media (hover: hover) and (pointer: fine) {
  .oct-fs-showcase__media:hover::before {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.02);
  }

  .oct-fs-showcase__media:hover img {
    transform: scale(1.055) translateY(-8px);
    filter:
      drop-shadow(0 28px 36px rgba(20, 28, 38, 0.22))
      drop-shadow(0 14px 20px rgba(20, 28, 38, 0.12))
      drop-shadow(0 0 28px rgba(255, 226, 0, 0.08));
  }
}

@media (prefers-reduced-motion: reduce) {
  .oct-fs-showcase__media::before,
  .oct-fs-showcase__media img {
    transition: none !important;
  }

  .oct-fs-showcase__media:hover::before,
  .oct-fs-showcase__media:hover img {
    transform: none !important;
    opacity: inherit !important;
    filter:
      drop-shadow(0 22px 28px rgba(20, 28, 38, 0.18))
      drop-shadow(0 10px 14px rgba(20, 28, 38, 0.1)) !important;
  }
}

@media (min-width: 1400px) {
  .oct-fs-showcase__media img {
    max-height: min(82vh, 82dvh, 860px);
  }
}

.oct-fs-showcase__copy {
  max-width: none;
}


.oct-fs-showcase__label {
  display: block;
  margin-bottom: 18px;
  color: #7a8794;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  line-height: 1.3;
}

.oct-fs-showcase__copy h3 {
  margin: 0 0 24px;
  color: #07111b;
  font-size: clamp(34px, 4.6vw, 52px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.6px;
  text-transform: uppercase;
}

.oct-fs-showcase__copy h3::after {
  content: "";
  display: block;
  width: 46px;
  height: 4px;
  margin-top: 18px;
  border-radius: 999px;
  background: #ffe200;
}

.oct-fs-showcase__lead {
  margin: 0 0 28px;
  max-width: 560px;
  color: #4a5868;
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.68;
  font-weight: 400;
}

.oct-fs-showcase__specs {
  margin: 0;
  padding: 0;
  list-style: none;
  max-width: 100%;
}

.oct-fs-showcase__specs li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(7, 17, 27, 0.12);
  color: #07111b;
}

.oct-fs-showcase__specs li:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

.oct-fs-showcase__specs span {
  color: #6a7785;
  font-size: 16px;
  font-weight: 500;
}

.oct-fs-showcase__specs strong {
  font-size: 17px;
  font-weight: 800;
  text-align: right;
}

/* legacy card CTA hover keep if referenced */
.oct-fs-platform-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  padding: 12px 18px;
  border: 1px solid rgba(255, 226, 0, 0.45);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  transition: background 0.25s, transform 0.25s;
}

.oct-fs-platform-card__cta:hover {
  background: rgba(255, 226, 0, 0.1);
  transform: translateY(-2px);
}

/* ── BOOT-BILD (vollbreit nach Platforms) ── */
.oct-fs-scene {
  position: relative;
  margin: 0;
  padding: 0;
  overflow: hidden;
  line-height: 0;
  background: #0a1520;
}

/* Nur Boot-Szene: volle Fensterhöhe */
.oct-fs-scene:not(.oct-fs-scene--pic5) {
  height: 100vh;
  height: 100dvh;
}

.oct-fs-scene:not(.oct-fs-scene--pic5) img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* Zweites Bild: Höhe am Bild, kein Extra-Abstand darunter */
.oct-fs-scene--pic5 {
  height: auto;
}

.oct-fs-scene--pic5 img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center center;
}

/* ── LINEUP — Einzelmotoren wie Collage, weiß, gleiche Höhe ── */
.oct-fs-lineup {
  padding: 225px 0 40px;
  background: #fff;
  overflow: visible;
}

.oct-fs-lineup__row {
  width: min(var(--max), calc(100% - var(--edge) * 2));
  margin: 0 auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(10px, 1.6vw, 28px);
  box-sizing: border-box;
}

.oct-fs-lineup__item {
  flex: 1 1 0;
  margin: 0;
  padding: 0;
  line-height: 0;
  text-align: center;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.oct-fs-lineup__item img {
  display: block;
  width: auto;
  max-width: 100%;
  height: min(62vh, 640px);
  margin: 0 auto;
  object-fit: contain;
  object-position: center bottom;
  transform: scale(1);
  transform-origin: center bottom;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}

.oct-fs-lineup__item:hover img,
.oct-fs-lineup__item:focus-within img {
  transform: scale(1.1);
}

/* ── LEAN BURN — heller Hintergrund wie Startseite Bodensee-Section ── */
.oct-fs-lean {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 75px 0 120px;
  color: #07111b;
  background: linear-gradient(180deg, #ffffff 0%, #fbfcfc 48%, #ffffff 100%);
}

.oct-fs-lean__fx {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.72;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1800' height='900' viewBox='0 0 1800 900'%3E%3Cg fill='none' stroke='%23c8d0d8' stroke-width='1'%3E%3Cpath d='M-80 96 C 220 20 420 188 710 110 S 1180 68 1510 114 S 1810 72 1940 40' opacity='.55'/%3E%3Cpath d='M-80 122 C 220 46 420 214 710 136 S 1180 94 1510 140 S 1810 98 1940 66' opacity='.4'/%3E%3Cpath d='M-40 430 C 240 335 520 510 790 416 S 1170 340 1485 414 S 1760 480 1900 396' opacity='.34'/%3E%3Cpath d='M-80 740 C 240 640 470 838 740 744 S 1160 660 1460 740 S 1760 780 1940 670' opacity='.5'/%3E%3Cpath d='M-80 766 C 240 666 470 864 740 770 S 1160 686 1460 766 S 1760 806 1940 696' opacity='.36'/%3E%3C/g%3E%3Cg fill='none' stroke='%23FFE200' stroke-width='1.2'%3E%3Cpath d='M-60 190 C 260 100 520 260 820 170 S 1280 120 1580 180 S 1820 130 1960 90' opacity='.32'/%3E%3Cpath d='M-40 800 C 280 700 520 880 820 780 S 1260 710 1560 790 S 1800 840 1960 720' opacity='.26'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 100% auto;
  background-position: center top;
  background-repeat: repeat-y;
}

.oct-fs-lean__fx::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 48%;
  width: min(720px, 70vw);
  height: min(720px, 70vw);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(7, 17, 27, 0.06) 0%, rgba(7, 17, 27, 0.03) 38%, transparent 68%);
  filter: blur(10px);
  opacity: 0.7;
}

.oct-fs-lean__ring {
  position: absolute;
  display: block;
  border-radius: 50%;
  border: 1px solid rgba(7, 17, 27, 0.16);
  box-sizing: border-box;
  animation: octLeanRing ease-in-out infinite;
}

.oct-fs-lean__ring--a {
  width: min(48vw, 560px);
  height: min(48vw, 560px);
  top: -14%;
  right: -6%;
  border-color: rgba(7, 17, 27, 0.14);
  animation-duration: 14s;
}

.oct-fs-lean__ring--b {
  width: min(30vw, 360px);
  height: min(30vw, 360px);
  top: -2%;
  right: 6%;
  border-color: rgba(255, 226, 0, 0.42);
  animation-duration: 11s;
  animation-delay: -3s;
}

.oct-fs-lean__ring--c {
  width: min(28vw, 320px);
  height: min(28vw, 320px);
  bottom: -10%;
  left: -4%;
  border-color: rgba(7, 17, 27, 0.12);
  animation-duration: 16s;
  animation-delay: -7s;
}

.oct-fs-lean__ring--d {
  width: min(18vw, 220px);
  height: min(18vw, 220px);
  bottom: 12%;
  right: 18%;
  border-color: rgba(255, 226, 0, 0.3);
  animation-duration: 12s;
  animation-delay: -5s;
}

@keyframes octLeanRing {
  0%,
  100% {
    opacity: 0.45;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.04);
  }
}

.oct-fs-lean__inner {
  position: relative;
  z-index: 1;
  width: min(var(--max), calc(100% - var(--edge) * 2));
  margin: 0 auto;
  box-sizing: border-box;
}

.oct-fs-lean__head {
  max-width: 860px;
  margin: 0 0 42px;
}

.oct-fs-lean__kicker {
  display: block;
  margin: 0 0 18px;
  color: #7a8794;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  line-height: 1.3;
}

.oct-fs-lean__head h2 {
  margin: 0 0 24px;
  color: #07111b;
  font-size: clamp(34px, 4.6vw, 52px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.6px;
  text-transform: uppercase;
}

.oct-fs-lean__head h2::after {
  content: "";
  display: block;
  width: 46px;
  height: 4px;
  margin-top: 18px;
  border-radius: 999px;
  background: #ffe200;
}

.oct-fs-lean__intro {
  margin: 0;
  max-width: 780px;
  color: #4a5868;
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.68;
  font-weight: 400;
}

.oct-fs-lean__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2.5vw, 28px);
  margin: 0 0 48px;
}

.oct-fs-lean__stat {
  position: relative;
  padding: 28px 28px 26px;
  border: 1px solid rgba(7, 17, 27, 0.1);
  background:
    linear-gradient(180deg, #fafbfc 0%, #f4f6f8 100%);
  overflow: hidden;
}

.oct-fs-lean__stat::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #ffe200;
}

.oct-fs-lean__stat strong {
  display: block;
  margin: 0 0 10px;
  color: #07111b;
  font-size: clamp(42px, 5vw, 56px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -1px;
}

.oct-fs-lean__stat span {
  display: block;
  max-width: 28ch;
  color: #4a5868;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 500;
}

.oct-fs-lean__columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 64px);
}

.oct-fs-lean__col h3 {
  margin: 0 0 22px;
  color: #07111b;
  font-size: clamp(20px, 1.6vw, 24px);
  font-weight: 800;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  line-height: 1.2;
}

.oct-fs-lean__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.oct-fs-lean__list li {
  position: relative;
  padding: 18px 0 18px 26px;
  border-bottom: 1px solid rgba(7, 17, 27, 0.08);
  color: #24303d;
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.68;
  font-weight: 400;
}

.oct-fs-lean__list li:last-child {
  border-bottom: 0;
}

.oct-fs-lean__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(18px + 0.84em - 1.5px);
  width: 10px;
  height: 3px;
  background: #ffe200;
}

/* ── HIGHLIGHTS / Merkmalskästchen (Hintergrund wie Über uns) ── */
.oct-fs-highlights {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 75px 0;
  color: #fff;
  background-color: #060a10;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1800' height='900' viewBox='0 0 1800 900'%3E%3Cg fill='none'%3E%3Cpath d='M-80 130 C170 54 320 214 570 126 C820 38 1010 170 1245 90 C1480 10 1600 90 1880 34' stroke='%236a7d8c' stroke-opacity='.22' stroke-width='1.25'/%3E%3Cpath d='M-90 160 C170 82 325 242 575 154 C825 66 1015 198 1250 118 C1485 38 1605 118 1885 62' stroke='%236a7d8c' stroke-opacity='.16' stroke-width='1'/%3E%3Cpath d='M-90 190 C170 112 325 272 575 184 C825 96 1015 228 1250 148 C1485 68 1605 148 1885 92' stroke='%236a7d8c' stroke-opacity='.11' stroke-width='1'/%3E%3Cpath d='M-110 770 C155 680 340 850 610 754 C880 658 1030 810 1305 700 C1580 590 1650 730 1910 650' stroke='%236a7d8c' stroke-opacity='.20' stroke-width='1.25'/%3E%3Cpath d='M-110 812 C155 722 340 892 610 796 C880 700 1030 852 1305 742 C1580 632 1650 772 1910 692' stroke='%236a7d8c' stroke-opacity='.13' stroke-width='1'/%3E%3Cpath d='M-130 604 C170 548 372 640 662 590 C952 540 1120 640 1398 568 C1676 496 1735 556 1915 514' stroke='%23FFE200' stroke-opacity='.18' stroke-width='1.3'/%3E%3Cpath d='M-120 104 C170 70 392 132 662 96 C932 60 1120 142 1398 88 C1676 34 1760 84 1925 50' stroke='%23FFE200' stroke-opacity='.14' stroke-width='1.1'/%3E%3C/g%3E%3C/svg%3E") center center / cover no-repeat,
    radial-gradient(circle at 68% 46%, rgba(255, 226, 0, 0.035) 0%, transparent 42%),
    radial-gradient(circle at 16% 22%, rgba(110, 130, 148, 0.08) 0%, transparent 34%),
    linear-gradient(180deg, #050810 0%, #070d14 48%, #050810 100%);
}

.oct-fs-highlights__glow {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.34;
  background:
    radial-gradient(circle at 78% 42%, rgba(255, 226, 0, 0.05) 0 118px, transparent 119px),
    radial-gradient(circle at 78% 42%, transparent 0 182px, rgba(110, 130, 148, 0.08) 183px 184px, transparent 185px),
    radial-gradient(circle at 78% 42%, transparent 0 248px, rgba(110, 130, 148, 0.05) 249px 250px, transparent 251px),
    conic-gradient(from 35deg at 78% 42%, transparent 0deg, transparent 24deg, rgba(255, 226, 0, 0.07) 35deg, transparent 48deg, transparent 112deg, rgba(110, 130, 148, 0.08) 124deg, transparent 138deg, transparent 220deg, rgba(255, 226, 0, 0.05) 236deg, transparent 252deg, transparent 360deg);
  filter: grayscale(0.15) brightness(0.52);
}

.oct-fs-highlights__inner {
  position: relative;
  z-index: 1;
  width: min(var(--max), calc(100% - var(--edge) * 2));
  margin: 0 auto;
}

.oct-fs-highlights .oct-fs-section-head {
  max-width: 880px;
  margin-bottom: 48px;
}

.oct-fs-highlights .oct-fs-section-head h2 {
  margin: 0 0 24px;
  color: #fff;
  font-size: clamp(34px, 4.6vw, 52px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.6px;
  text-transform: uppercase;
  text-shadow: 0 8px 26px rgba(0, 0, 0, 0.42);
}

.oct-fs-highlights .oct-fs-section-head h2::after {
  content: "";
  display: block;
  width: 46px;
  height: 4px;
  margin-top: 18px;
  border-radius: 999px;
  background: #ffe200;
  box-shadow: 0 0 12px rgba(255, 226, 0, 0.22);
}

.oct-fs-highlights .oct-fs-section-head .oct-fs-line {
  display: none;
}

.oct-fs-highlights .oct-fs-section-head p {
  color: rgba(255, 255, 255, 0.86);
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.68;
  font-weight: 400;
  text-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

.oct-fs-highlight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}

.oct-fs-highlight {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 300px;
  padding: 32px 28px 30px;
  overflow: hidden;
  border: 1px solid rgba(220, 226, 235, 0.2);
  background:
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.035) 30%,
      rgba(8, 12, 18, 0.78)
    ),
    repeating-linear-gradient(
      115deg,
      rgba(255, 255, 255, 0.025) 0,
      rgba(255, 255, 255, 0.025) 1px,
      transparent 2px,
      transparent 8px
    );
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.34);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  opacity: 0;
  transform: translateY(22px);
  animation: octFsFeatIn 0.9s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  animation-delay: calc(0.08s * var(--d, 0) + 0.12s);
  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;
}

.oct-fs-highlight::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #ffe200;
  opacity: 0.88;
  box-shadow: 0 0 10px rgba(255, 226, 0, 0.14);
  z-index: 1;
}

.oct-fs-highlight::after {
  content: "";
  position: absolute;
  right: -80px;
  top: -80px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(
    circle,
    rgba(255, 226, 0, 0.12) 0%,
    rgba(255, 226, 0, 0.04) 38%,
    rgba(255, 226, 0, 0) 72%
  );
  opacity: 0.4;
  z-index: 1;
  transition: opacity 0.35s ease, transform 0.45s ease;
}

.oct-fs-highlight:hover {
  transform: translateY(-8px);
  border-color: rgba(255, 226, 0, 0.78);
  box-shadow:
    0 24px 46px rgba(0, 0, 0, 0.48),
    0 0 22px rgba(255, 226, 0, 0.1);
}

.oct-fs-highlight:hover::after {
  opacity: 0.85;
  transform: translate(-12px, 16px) scale(1.08);
}

.oct-fs-highlight__icon {
  position: relative;
  z-index: 3;
  display: block;
  margin: 0 0 22px;
  color: #ffe200;
  font-size: 34px;
  line-height: 1;
  transition: transform 0.35s ease, text-shadow 0.35s ease;
}

.oct-fs-highlight:hover .oct-fs-highlight__icon {
  transform: translateY(-2px) scale(1.08);
  text-shadow: 0 0 16px rgba(255, 226, 0, 0.28);
}

.oct-fs-highlight h3 {
  position: relative;
  z-index: 3;
  margin: 0 0 14px;
  color: #fff;
  font-size: clamp(18px, 1.45vw, 22px);
  line-height: 1.28;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: -0.2px;
}

.oct-fs-highlight p {
  position: relative;
  z-index: 3;
  margin: 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: clamp(16px, 1.25vw, 18px);
  line-height: 1.65;
  font-weight: 400;
}

@keyframes octFsFeatIn {
  from {
    opacity: 0;
    transform: translateY(22px);
    filter: blur(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .oct-fs-highlight {
    opacity: 1;
    transform: none;
    animation: none;
    filter: none;
  }

  .oct-fs-lean__ring {
    animation: none;
  }
}

/* ── SPECS (dunkel, Atmosphäre wie Über uns / Merkmale) ── */
.oct-fs-specs {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100svh;
  padding-top: clamp(88px, 10vh, 150px) !important;
  padding-bottom: clamp(72px, 8vh, 120px) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  color: #fff;
  background-color: #060a10;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1800' height='900' viewBox='0 0 1800 900'%3E%3Cg fill='none'%3E%3Cpath d='M-80 130 C170 54 320 214 570 126 C820 38 1010 170 1245 90 C1480 10 1600 90 1880 34' stroke='%236a7d8c' stroke-opacity='.22' stroke-width='1.25'/%3E%3Cpath d='M-90 160 C170 82 325 242 575 154 C825 66 1015 198 1250 118 C1485 38 1605 118 1885 62' stroke='%236a7d8c' stroke-opacity='.16' stroke-width='1'/%3E%3Cpath d='M-90 190 C170 112 325 272 575 184 C825 96 1015 228 1250 148 C1485 68 1605 148 1885 92' stroke='%236a7d8c' stroke-opacity='.11' stroke-width='1'/%3E%3Cpath d='M-110 770 C155 680 340 850 610 754 C880 658 1030 810 1305 700 C1580 590 1650 730 1910 650' stroke='%236a7d8c' stroke-opacity='.20' stroke-width='1.25'/%3E%3Cpath d='M-110 812 C155 722 340 892 610 796 C880 700 1030 852 1305 742 C1580 632 1650 772 1910 692' stroke='%236a7d8c' stroke-opacity='.13' stroke-width='1'/%3E%3Cpath d='M-130 604 C170 548 372 640 662 590 C952 540 1120 640 1398 568 C1676 496 1735 556 1915 514' stroke='%23FFE200' stroke-opacity='.18' stroke-width='1.3'/%3E%3Cpath d='M-120 104 C170 70 392 132 662 96 C932 60 1120 142 1398 88 C1676 34 1760 84 1925 50' stroke='%23FFE200' stroke-opacity='.14' stroke-width='1.1'/%3E%3C/g%3E%3C/svg%3E") center center / cover no-repeat,
    radial-gradient(circle at 68% 46%, rgba(255, 226, 0, 0.035) 0%, transparent 42%),
    radial-gradient(circle at 16% 22%, rgba(110, 130, 148, 0.08) 0%, transparent 34%),
    linear-gradient(180deg, #050810 0%, #070d14 48%, #050810 100%);
}

.oct-fs-specs::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.34;
  background:
    radial-gradient(circle at 78% 42%, rgba(255, 226, 0, 0.05) 0 118px, transparent 119px),
    radial-gradient(circle at 78% 42%, transparent 0 182px, rgba(110, 130, 148, 0.08) 183px 184px, transparent 185px),
    radial-gradient(circle at 78% 42%, transparent 0 248px, rgba(110, 130, 148, 0.05) 249px 250px, transparent 251px),
    conic-gradient(from 35deg at 78% 42%, transparent 0deg, transparent 24deg, rgba(255, 226, 0, 0.07) 35deg, transparent 48deg, transparent 112deg, rgba(110, 130, 148, 0.08) 124deg, transparent 138deg, transparent 220deg, rgba(255, 226, 0, 0.05) 236deg, transparent 252deg, transparent 360deg);
  filter: grayscale(0.15) brightness(0.52);
}

#oct-fs-specs.oct-fs-specs {
  padding-top: clamp(88px, 10vh, 150px) !important;
  padding-bottom: clamp(72px, 8vh, 120px) !important;
}

.oct-fs-specs__inner {
  position: relative;
  z-index: 1;
  width: min(var(--max), calc(100% - var(--edge) * 2));
  margin: 0 auto;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Headline wie Verado Specs */
.oct-fs-specs__headline {
  width: 100%;
  max-width: none;
  margin: 0 0 clamp(28px, 4vh, 48px);
  text-align: left;
}

.oct-fs-specs__kicker {
  margin: 0 0 18px;
  color: #ffe200;
  font-size: clamp(18px, 1.6vw, 24px);
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.oct-fs-specs__headline h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(32px, 4vw, 42px);
  line-height: 1.06;
  font-weight: 900;
  letter-spacing: -0.5px;
  text-transform: uppercase;
  text-shadow: 0 8px 26px rgba(0, 0, 0, 0.42);
}

.oct-fs-specs__headline h2::after {
  display: none;
}

.oct-fs-specs__line {
  width: 58px;
  height: 3px;
  margin: 18px 0 24px;
  background: #ffe200;
  box-shadow: 0 0 12px rgba(255, 226, 0, 0.22);
}

.oct-fs-specs__headline p {
  max-width: 930px;
  margin: 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.68;
  font-weight: 400;
  text-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

.oct-fs-specs .oct-fs-section-head {
  max-width: 1100px;
  margin-bottom: 42px;
}

.oct-fs-specs .oct-fs-section-head h2 {
  margin: 0 0 24px;
  color: #fff;
  font-size: clamp(34px, 4.6vw, 52px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.6px;
  text-transform: uppercase;
}

.oct-fs-specs .oct-fs-section-head h2::after {
  content: "";
  display: block;
  width: 46px;
  height: 4px;
  margin-top: 18px;
  border-radius: 999px;
  background: #ffe200;
}

.oct-fs-specs .oct-fs-section-head p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.68;
  font-weight: 400;
}

.oct-fs-tabs {
  display: none;
}

.oct-fs-tab {
  appearance: none;
  cursor: pointer;
  padding: 22px 24px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0;
  background: #0a1018;
  text-align: left;
  font-family: inherit;
  transition: border-color 0.25s, background 0.25s, box-shadow 0.25s, transform 0.25s;
}

.oct-fs-tab:hover {
  border-color: rgba(255, 255, 255, 0.28);
  transform: translateY(-2px);
}

.oct-fs-tab.is-active {
  border-color: rgba(255, 255, 255, 0.18);
  background: #10161e;
  box-shadow: inset 3px 0 0 #ffe200;
}

.oct-fs-tab__kicker {
  display: block;
  margin-bottom: 6px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.oct-fs-tab.is-active .oct-fs-tab__kicker {
  color: rgba(255, 255, 255, 0.7);
}

.oct-fs-tab__title {
  display: block;
  color: #fff;
  font-size: 22px;
  font-weight: 900;
  text-transform: uppercase;
}

.oct-fs-tab__hint {
  display: block;
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 16px;
  line-height: 1.45;
  font-weight: 700;
}

.oct-fs-tab.is-active .oct-fs-tab__hint {
  color: rgba(255, 255, 255, 0.9);
}

.oct-fs-spec-panel {
  display: none;
}

.oct-fs-spec-panel.is-active {
  display: block;
}

.oct-fs-spec-console {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #0a1018;
  box-shadow: 0 24px 52px rgba(0, 0, 0, 0.35);
}

.oct-fs-spec-console::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #ffe200;
  box-shadow: 0 0 14px rgba(255, 226, 0, 0.18);
  z-index: 8;
  pointer-events: none;
}

.oct-fs-spec-console-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  padding: 24px 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: #080e16;
}

.oct-fs-spec-console-head h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 22px;
  font-weight: 900;
  text-transform: uppercase;
}

.oct-fs-spec-console-head p {
  margin: 0;
  max-width: 640px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 15px;
  line-height: 1.55;
}

.oct-fs-spec-badge {
  flex-shrink: 0;
  padding: 10px 14px;
  border: 1px solid rgba(255, 226, 0, 0.55);
  background: rgba(255, 226, 0, 0.14);
  color: #ffe200;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  white-space: nowrap;
}

.oct-fs-spec-table-wrap {
  overflow-x: auto;
}

.oct-fs-power-strip {
  display: grid;
  min-width: 100%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: #121820;
}

.oct-fs-power-strip[data-cols="6"] {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.oct-fs-power-strip[data-cols="6"] .oct-fs-power-item:nth-child(6n) {
  border-right: none;
}

.oct-fs-power-strip[data-cols="6"] .oct-fs-power-item {
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.oct-fs-power-item {
  padding: 20px 10px 16px;
  text-align: center;
}

.oct-fs-power-item strong {
  display: block;
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.4px;
  text-transform: uppercase;
}

.oct-fs-power-item span {
  display: block;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  font-weight: 900;
}

.oct-fs-power-item small {
  display: block;
  margin-top: 4px;
  color: #ffe200;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.oct-fs-spec-table {
  width: 100%;
  min-width: 1100px;
  table-layout: fixed;
  border-collapse: collapse;
}

.oct-fs-spec-table th,
.oct-fs-spec-table td {
  padding: 18px 14px;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  text-align: center;
  font-size: 17px;
  line-height: 1.45;
  font-weight: 400;
}

.oct-fs-spec-table th:last-child,
.oct-fs-spec-table td:last-child {
  border-right: none;
}

.oct-fs-spec-table thead th {
  color: #fff;
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: 900;
  text-transform: uppercase;
  line-height: 1.25;
  letter-spacing: 0.02em;
  background: #10161e;
}

.oct-fs-spec-table thead th:first-child {
  color: rgba(255, 255, 255, 0.92);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.04em;
  box-shadow: inset 2px 0 0 #ffe200;
}

.oct-fs-spec-table thead th:first-child,
.oct-fs-spec-table tbody td:first-child {
  width: 250px;
  text-align: left;
  padding-left: 24px;
  padding-right: 18px;
  background: #0c121a;
}

.oct-fs-spec-table tbody td:first-child {
  font-size: 17px;
  font-weight: 400;
  color: #ffffff;
  box-shadow: inset 2px 0 0 #ffe200;
}

.oct-fs-spec-table tbody td {
  color: rgba(255, 255, 255, 0.82);
  font-weight: 400;
  background: #0a1018;
}

.oct-fs-spec-table tbody tr:hover td {
  background: #121a24;
}

.oct-fs-spec-table .oct-fs-spec-shared {
  color: rgba(255, 255, 255, 0.88);
  font-weight: 400;
}

.oct-fs-spec-table .oct-fs-spec-check {
  color: #ffe200;
  font-weight: 400;
  text-transform: uppercase;
}

.oct-fs-spec-note {
  padding: 18px 28px 22px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 13px;
  line-height: 1.55;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: #080e16;
}

@media (max-width: 1100px) {
  .oct-fs-lineup {
    padding: 56px 0 40px;
  }

  .oct-fs-lineup__row {
    gap: 6px;
  }

  .oct-fs-lineup__item img {
    height: min(48vh, 420px);
  }

  .oct-fs-lean__stats,
  .oct-fs-lean__columns {
    grid-template-columns: 1fr;
  }

  .oct-fs-lean {
    padding: 36px 0 80px;
  }

  .oct-fs-platforms {
    height: auto;
    max-height: none;
    grid-template-rows: auto auto;
    row-gap: 0;
    min-height: 0;
    padding-top: 40px;
  }

  .oct-fs-showcase--v6,
  .oct-fs-showcase--v8 {
    padding: 0;
    align-items: stretch;
    min-height: 0;
  }

  .oct-fs-showcase__shell,
  .oct-fs-showcase--v6 .oct-fs-showcase__shell,
  .oct-fs-showcase--v8 .oct-fs-showcase__shell {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    gap: 12px;
    padding-top: 0;
    min-height: 0;
    height: auto;
    width: min(100% - 28px, var(--max));
    align-content: stretch;
  }

  .oct-fs-showcase--v6 .oct-fs-showcase__copy,
  .oct-fs-showcase--v8 .oct-fs-showcase__copy {
    order: 2;
    height: auto;
    min-height: 0;
    padding: 20px 18px 32px !important;
    overflow: visible;
  }

  .oct-fs-showcase--v6 .oct-fs-showcase__media,
  .oct-fs-showcase--v8 .oct-fs-showcase__media {
    order: 1;
    position: relative;
    height: auto;
    min-height: 0;
    padding: 40px 18px 4px;
    background: none;
    border-radius: 0;
    margin-inline: 0;
    text-align: center !important;
  }

  .oct-fs-showcase__media::after,
  .oct-fs-showcase--v6 .oct-fs-showcase__media::after,
  .oct-fs-showcase--v8 .oct-fs-showcase__media::after {
    display: none !important;
  }

  .oct-fs-showcase__media img,
  .oct-fs-showcase--v6 .oct-fs-showcase__media img,
  .oct-fs-showcase--v8 .oct-fs-showcase__media img {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: min(72%, 320px) !important;
    height: auto !important;
    max-height: min(52vh, 480px) !important;
    margin: 0 auto !important;
    display: block !important;
    object-fit: contain !important;
    object-position: center center !important;
    filter:
      drop-shadow(0 16px 20px rgba(20, 28, 38, 0.16)) !important;
  }

  .oct-fs-showcase__copy,
  .oct-fs-showcase--v6 .oct-fs-showcase__copy,
  .oct-fs-showcase--v8 .oct-fs-showcase__copy {
    justify-self: start;
    max-width: none;
  }

  .oct-fs-highlight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .oct-fs-highlight {
    min-height: 0;
    padding: 22px 18px 20px;
  }
}

@media (max-width: 767px) {
  .oct-fs-hero {
    height: auto;
    min-height: 0;
    flex-direction: column;
    align-items: stretch;
    padding: calc(var(--nav-padding-top, 44px) + 72px) 0 36px;
  }

  .oct-fs-hero__inner {
    width: min(100% - 28px, var(--max));
    padding-inline: 14px;
    box-sizing: border-box;
  }

  .oct-fs-hero__copy {
    max-width: calc(100% - 8px);
    margin-top: 20px;
  }

  .oct-fs-hero__media img {
    /* Beide Motoren besser sichtbar — weniger Zoom, Fokus auf Cowling */
    object-position: 58% 28%;
    transform: none;
    transform-origin: 58% 28%;
    animation: none;
  }

  .oct-fs-hero .oct-kicker {
    font-size: 14px;
    letter-spacing: 1.2px;
    margin-bottom: 12px;
  }

  .oct-fs-hero .oct-title {
    font-size: clamp(28px, 8vw, 36px);
    margin-bottom: 16px;
  }

  .oct-fs-hero .oct-lead {
    font-size: 15px;
    line-height: 1.55;
    margin-top: 14px;
  }

  .oct-fs-hero__stats {
    position: relative;
    left: auto;
    bottom: auto;
    transform: none;
    width: min(100% - 28px, var(--max));
    margin: 28px auto 0;
    flex-wrap: wrap;
    gap: 10px;
  }

  .oct-fs-hero__stats .oct-fs-hero__stat,
  .oct-fs-hero__stat {
    flex: 1 1 calc(50% - 10px);
    max-width: none;
    min-height: 84px;
  }

  .oct-fs-platforms {
    min-height: 0;
    height: auto;
    max-height: none;
    grid-template-rows: auto auto;
    row-gap: 0;
    padding-top: 32px;
  }

  .oct-fs-showcase--v6,
  .oct-fs-showcase--v8 {
    min-height: 0;
  }

  .oct-fs-showcase__shell,
  .oct-fs-showcase--v6 .oct-fs-showcase__shell,
  .oct-fs-showcase--v8 .oct-fs-showcase__shell {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    height: auto;
    min-height: 0;
    gap: 12px;
  }

  .oct-fs-showcase--v6 .oct-fs-showcase__copy,
  .oct-fs-showcase--v8 .oct-fs-showcase__copy {
    order: 2;
    height: auto;
    padding: 20px 18px 32px !important;
    overflow: visible;
  }

  .oct-fs-showcase--v6 .oct-fs-showcase__media,
  .oct-fs-showcase--v8 .oct-fs-showcase__media {
    order: 1;
    position: relative;
    height: auto;
    min-height: 0;
    padding: 36px 18px 4px;
    background: none;
    border-radius: 0;
    margin-inline: 0;
    text-align: center !important;
  }

  .oct-fs-showcase__media::after,
  .oct-fs-showcase--v6 .oct-fs-showcase__media::after,
  .oct-fs-showcase--v8 .oct-fs-showcase__media::after {
    display: none !important;
  }

  .oct-fs-showcase__media img,
  .oct-fs-showcase--v6 .oct-fs-showcase__media img,
  .oct-fs-showcase--v8 .oct-fs-showcase__media img {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: min(78%, 280px) !important;
    height: auto !important;
    max-height: min(48vh, 420px) !important;
    margin: 0 auto !important;
    display: block !important;
    object-fit: contain !important;
    object-position: center center !important;
    filter:
      drop-shadow(0 14px 18px rgba(20, 28, 38, 0.14)) !important;
  }

  .oct-fs-showcase__label {
    font-size: 16px;
  }

  .oct-fs-showcase__copy h3 {
    font-size: clamp(26px, 7vw, 34px);
  }

  .oct-fs-showcase__lead {
    font-size: 15px;
  }

  .oct-fs-tabs,
  .oct-fs-highlight-grid {
    grid-template-columns: 1fr;
  }

  .oct-fs-tab {
    padding: 18px 16px;
  }

  .oct-fs-tab__title {
    font-size: 18px;
  }

  .oct-fs-spec-console-head {
    flex-direction: column;
    padding: 20px 16px;
  }

  .oct-fs-spec-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  .oct-fs-power-strip[data-cols="6"] {
    grid-template-columns: 150px repeat(6, 118px);
    min-width: 858px;
    width: 858px;
  }

  .oct-fs-power-strip[data-cols="6"]::before {
    content: "";
    display: block;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    background: #12181f;
    position: sticky;
    left: 0;
    z-index: 2;
  }

  .oct-fs-power-strip,
  .oct-fs-spec-table {
    min-width: 858px;
    width: 858px;
  }

  .oct-fs-spec-table {
    table-layout: fixed;
  }

  .oct-fs-spec-table thead {
    display: none;
  }

  .oct-fs-spec-table thead th:first-child,
  .oct-fs-spec-table tbody td:first-child {
    width: 150px;
    min-width: 150px;
    max-width: 150px;
    padding-left: 14px;
    padding-right: 10px;
    position: sticky;
    left: 0;
    z-index: 3;
    background: #12181f !important;
    box-shadow:
      inset 2px 0 0 #ffe200,
      6px 0 12px rgba(0, 0, 0, 0.35);
  }

  .oct-fs-spec-table tbody td:first-child {
    font-size: 13px;
  }

  .oct-fs-spec-table tbody td:not(:first-child) {
    width: 118px;
    min-width: 118px;
    max-width: 118px;
  }

  .oct-fs-power-item {
    padding: 14px 6px 12px;
  }

  .oct-fs-power-item span {
    font-size: 22px;
  }

  .oct-fs-spec-table th,
  .oct-fs-spec-table td {
    padding: 14px 10px;
    font-size: 13px;
  }

  .oct-fs-lineup {
    padding: 36px 0 28px;
  }

  .oct-fs-lineup__item img {
    height: min(42vh, 360px);
  }

  .oct-fs-highlight {
    min-height: 0;
    padding: 22px 18px 20px;
  }
}

@media (max-width: 900px) {
  .oct-fs-platforms--v6-only,
  .oct-fs-specs,
  #oct-fs-specs.oct-fs-specs {
    min-height: 0;
  }

  .oct-fs-platforms--v6-only .oct-fs-showcase--v6 {
    min-height: 0;
  }

  .oct-fs-specs__inner {
    justify-content: flex-start;
  }
}

@media (min-width: 1800px) and (min-height: 950px) {
  .oct-fs-platforms--v6-only,
  .oct-fs-specs {
    min-height: 100vh;
    min-height: 100svh;
  }
}

@media (min-width: 2200px) and (min-height: 1200px) {
  .oct-fs-platforms--v6-only,
  .oct-fs-specs {
    min-height: 100vh;
    min-height: 100svh;
  }
}
