/* Praxoria Startseite – v588: differenzierte Premium-Lernreise, sachlogisch und mit rechter Spalte synchronisiert. */

html body.home.homeRefinedV588{
  --journey-row-v588: clamp(520px, 55vh, 660px);
  --journey-total-v588: calc(var(--journey-row-v588) * 3);
  --journey-blue-v588:#45a8cc;
  --journey-blue-deep-v588:#2f86a6;
  --journey-gold-v588:#d2a54e;
  --journey-gold-deep-v588:#a77a30;
  --journey-green-v588:#8fb45f;
  --journey-green-deep-v588:#618841;
  --journey-ink-v588:#172134;
  --journey-muted-v588:#677180;
}

html body.home.homeRefinedV588 .whyNarrative{
  grid-template-columns:minmax(640px, 1.12fr) minmax(500px, .88fr) !important;
  gap:clamp(72px, 7vw, 118px) !important;
  align-items:start !important;
  padding-top:clamp(34px, 4vw, 64px) !important;
  padding-bottom:clamp(36px, 4vw, 68px) !important;
}

html body.home.homeRefinedV588 .whyEditorialLead.whyJourneyPanelV584{
  position:relative !important;
  min-height:var(--journey-total-v588) !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

html body.home.homeRefinedV588 .verticalLearningJourneyV584{
  position:relative !important;
  width:100% !important;
  max-width:820px !important;
  min-height:var(--journey-total-v588) !important;
  height:var(--journey-total-v588) !important;
  margin:0 auto !important;
  overflow:visible !important;
  transform:none !important;
  isolation:isolate !important;
  pointer-events:none !important;
}

html body.home.homeRefinedV588 .verticalLearningJourneyV584::before,
html body.home.homeRefinedV588 .verticalLearningJourneyV584::after{
  content:"" !important;
  position:absolute !important;
  inset:-70px -42px !important;
  z-index:-2 !important;
  background:
    radial-gradient(circle at 24% 10%, rgba(69,168,204,.08), transparent 27%),
    radial-gradient(circle at 74% 45%, rgba(210,165,78,.07), transparent 29%),
    radial-gradient(circle at 40% 88%, rgba(143,180,95,.075), transparent 28%) !important;
  filter:blur(34px) !important;
  opacity:.72 !important;
}
html body.home.homeRefinedV588 .verticalLearningJourneyV584::after{
  inset:0 !important;
  background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.46) 50%, rgba(255,255,255,0)) !important;
  filter:none !important;
  opacity:.50 !important;
  z-index:-1 !important;
}

/* Alte Experimente ausblenden; der Scrollzustand bleibt über .verticalLearningJourneyV584 erhalten. */
html body.home.homeRefinedV588 .premiumLearningJourneyV586,
html body.home.homeRefinedV588 .journeyCanvasV584{
  display:none !important;
}

html body.home.homeRefinedV588 .premiumLearningJourneyV588{
  position:relative !important;
  display:grid !important;
  grid-template-rows:repeat(3, var(--journey-row-v588)) !important;
  width:100% !important;
  min-height:var(--journey-total-v588) !important;
  height:var(--journey-total-v588) !important;
}

/* Ein einziger Reisefaden – nicht als Zusatzleiste, sondern als dramaturgische Achse. */
html body.home.homeRefinedV588 .journeySpineV588{
  position:absolute !important;
  top:calc(var(--journey-row-v588) * .18) !important;
  bottom:calc(var(--journey-row-v588) * .18) !important;
  right:clamp(28px, 4.3vw, 54px) !important;
  width:34px !important;
  z-index:9 !important;
}
html body.home.homeRefinedV588 .spineLineV588,
html body.home.homeRefinedV588 .spineProgressV588{
  position:absolute !important;
  left:50% !important;
  top:0 !important;
  width:2px !important;
  transform:translateX(-50%) !important;
  border-radius:99px !important;
}
html body.home.homeRefinedV588 .spineLineV588{
  bottom:0 !important;
  background:linear-gradient(180deg, rgba(69,168,204,.20), rgba(210,165,78,.18) 50%, rgba(143,180,95,.22)) !important;
}
html body.home.homeRefinedV588 .spineProgressV588{
  height:calc(var(--journey-progress, 0) * 100%) !important;
  max-height:100% !important;
  background:linear-gradient(180deg, var(--journey-blue-v588), var(--journey-gold-v588) 50%, var(--journey-green-v588)) !important;
  box-shadow:0 0 26px rgba(69,168,204,.16) !important;
  transition:height .36s ease !important;
}
html body.home.homeRefinedV588 .spineNodeV588{
  position:absolute !important;
  left:50% !important;
  width:22px !important;
  height:22px !important;
  transform:translate(-50%, -50%) !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.92) !important;
  border:1px solid rgba(23,33,52,.12) !important;
  box-shadow:0 10px 26px rgba(18,36,58,.07) !important;
  transition:background .45s ease, border-color .45s ease, box-shadow .45s ease, transform .45s ease !important;
}
html body.home.homeRefinedV588 .spineNodeV588 i{
  position:absolute !important;
  inset:6px !important;
  border-radius:50% !important;
  background:rgba(23,33,52,.16) !important;
}
html body.home.homeRefinedV588 .spineNodeLearnV588{ top:0% !important; }
html body.home.homeRefinedV588 .spineNodeTransferV588{ top:50% !important; }
html body.home.homeRefinedV588 .spineNodeDocumentV588{ top:100% !important; }
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-learn .spineNodeLearnV588,
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-transfer .spineNodeTransferV588,
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-document .spineNodeDocumentV588{
  transform:translate(-50%, -50%) scale(1.16) !important;
  background:rgba(255,255,255,.98) !important;
  border-color:color-mix(in oklab, var(--journey-active-v588, var(--journey-blue-v588)) 48%, #fff) !important;
  box-shadow:
    0 0 0 15px color-mix(in oklab, var(--journey-active-v588, var(--journey-blue-v588)) 8%, transparent),
    0 0 42px color-mix(in oklab, var(--journey-active-v588, var(--journey-blue-v588)) 24%, transparent),
    0 18px 32px rgba(18,36,58,.08) !important;
}
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-learn{ --journey-active-v588:var(--journey-blue-v588); }
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-transfer{ --journey-active-v588:var(--journey-gold-v588); }
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-document{ --journey-active-v588:var(--journey-green-v588); }
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-learn .spineNodeLearnV588 i{ background:var(--journey-blue-deep-v588) !important; }
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-transfer .spineNodeTransferV588 i{ background:var(--journey-gold-deep-v588) !important; }
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-document .spineNodeDocumentV588 i{ background:var(--journey-green-deep-v588) !important; }

/* Szenen: drei saubere Höhenebenen, jeweils ohne Hintergrundkasten. */
html body.home.homeRefinedV588 .journeySceneV588{
  position:relative !important;
  min-height:var(--journey-row-v588) !important;
  height:var(--journey-row-v588) !important;
  overflow:hidden !important;
  opacity:.42 !important;
  filter:saturate(.74) contrast(.98) !important;
  transform:translateY(4px) !important;
  transition:opacity .5s ease, filter .5s ease, transform .5s ease !important;
  contain:layout paint !important;
}
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-learn .sceneLearnV588,
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-transfer .sceneTransferV588,
html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-document .sceneDocumentV588{
  opacity:1 !important;
  filter:none !important;
  transform:translateY(0) !important;
}
html body.home.homeRefinedV588 .sceneWashV588{
  position:absolute !important;
  inset:8% 4% 10% 2% !important;
  z-index:0 !important;
  border-radius:48% !important;
  filter:blur(34px) !important;
  opacity:.34 !important;
}
html body.home.homeRefinedV588 .washLearnV588{ background:radial-gradient(circle, rgba(69,168,204,.24), transparent 62%) !important; }
html body.home.homeRefinedV588 .washTransferV588{ background:radial-gradient(circle, rgba(210,165,78,.22), transparent 64%) !important; }
html body.home.homeRefinedV588 .washDocumentV588{ background:radial-gradient(circle, rgba(143,180,95,.23), transparent 64%) !important; }

html body.home.homeRefinedV588 .accessMomentV588,
html body.home.homeRefinedV588 .cockpitMomentV588,
html body.home.homeRefinedV588 .unitMomentV588,
html body.home.homeRefinedV588 .courseImpulseV588,
html body.home.homeRefinedV588 .knowledgeCardV588,
html body.home.homeRefinedV588 .practiceQuestionV588,
html body.home.homeRefinedV588 .abschlussPanelV588,
html body.home.homeRefinedV588 .certificateMomentV588{
  position:absolute !important;
  z-index:3 !important;
  border-radius:22px !important;
  background:linear-gradient(135deg, rgba(255,255,255,.88), rgba(255,255,255,.64)) !important;
  border:1px solid rgba(23,33,52,.095) !important;
  box-shadow:0 22px 58px rgba(18,36,58,.07), inset 0 1px 0 rgba(255,255,255,.86) !important;
  backdrop-filter:blur(12px) saturate(1.06) !important;
  -webkit-backdrop-filter:blur(12px) saturate(1.06) !important;
  color:var(--journey-ink-v588) !important;
}
html body.home.homeRefinedV588 .sceneEyebrowV588{
  display:block !important;
  margin:0 0 9px 0 !important;
  font-size:10px !important;
  line-height:1.1 !important;
  font-weight:900 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  color:rgba(23,33,52,.54) !important;
}
html body.home.homeRefinedV588 .premiumLearningJourneyV588 strong{
  display:block !important;
  font-size:clamp(16px, 1.18vw, 20px) !important;
  line-height:1.16 !important;
  font-weight:900 !important;
  letter-spacing:-.035em !important;
  color:#172134 !important;
}
html body.home.homeRefinedV588 .premiumLearningJourneyV588 span{
  font-size:13px !important;
  line-height:1.32 !important;
  font-weight:750 !important;
  color:rgba(23,33,52,.62) !important;
}

/* Menschen als erzählerische Träger, nicht als Dekoration. */
html body.home.homeRefinedV588 .learnerFigureV588,
html body.home.homeRefinedV588 .transferFigureV588,
html body.home.homeRefinedV588 .documentFigureV588{
  position:absolute !important;
  z-index:5 !important;
  width:76px !important;
  height:126px !important;
}
html body.home.homeRefinedV588 .personHeadV588{
  position:absolute !important;
  left:25px !important;
  top:0 !important;
  width:34px !important;
  height:34px !important;
  border-radius:50% !important;
  background:#f3c49b !important;
  box-shadow:inset 0 0 0 1px rgba(132,82,41,.14) !important;
}
html body.home.homeRefinedV588 .personHeadV588::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:34px !important;
  height:16px !important;
  border-radius:17px 17px 5px 5px !important;
  background:#26334a !important;
}
html body.home.homeRefinedV588 .personBodyV588{
  position:absolute !important;
  left:18px !important;
  top:41px !important;
  width:52px !important;
  height:68px !important;
  border-radius:28px 28px 18px 18px !important;
  background:linear-gradient(180deg, #eff8f2, #e7f3ee) !important;
  border:1px solid rgba(23,33,52,.08) !important;
}
html body.home.homeRefinedV588 .personArmV588,
html body.home.homeRefinedV588 .personLegV588{
  position:absolute !important;
  display:block !important;
  width:13px !important;
  height:62px !important;
  border-radius:999px !important;
  background:#f1bd91 !important;
  transform-origin:top center !important;
  box-shadow:inset 0 0 0 1px rgba(141,88,46,.08) !important;
}
html body.home.homeRefinedV588 .personLegV588{
  height:50px !important;
  background:#9eb9ab !important;
}

/* 1 Lernführung: Zugang, Cockpit und nächster Schritt sichtbar und sachlogisch verbunden. */
html body.home.homeRefinedV588 .sceneLearnV588 .learnerAtCodeV588{
  left:3.5% !important;
  top:33% !important;
}
html body.home.homeRefinedV588 .armInputV588{
  left:58px !important;
  top:48px !important;
  transform:rotate(55deg) !important;
  animation:v588TypeGesture 3.4s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .accessMomentV588{
  left:12.5% !important;
  top:31% !important;
  width:190px !important;
  padding:18px 20px !important;
  border-color:rgba(69,168,204,.22) !important;
}
html body.home.homeRefinedV588 .codeFieldV588{
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  height:42px !important;
  padding:0 14px !important;
  border-radius:14px !important;
  border:1px solid rgba(69,168,204,.22) !important;
  background:rgba(255,255,255,.68) !important;
}
html body.home.homeRefinedV588 .codeFieldV588 b{
  display:block !important;
  width:7px !important;
  height:7px !important;
  border-radius:50% !important;
  background:#172134 !important;
  opacity:.82 !important;
  animation:v588CodeDot 4.2s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .codeFieldV588 b:nth-child(2){ animation-delay:.18s !important; }
html body.home.homeRefinedV588 .codeFieldV588 b:nth-child(3){ animation-delay:.36s !important; }
html body.home.homeRefinedV588 .codeFieldV588 b:nth-child(4){ animation-delay:.54s !important; }
html body.home.homeRefinedV588 .codeFieldV588 i{
  display:block !important;
  width:2px !important;
  height:26px !important;
  border-radius:4px !important;
  background:var(--journey-blue-deep-v588) !important;
  animation:v588Cursor 1.1s steps(2,end) infinite !important;
}
html body.home.homeRefinedV588 .cockpitMomentV588{
  left:40% !important;
  top:15% !important;
  width:min(360px, 43%) !important;
  min-height:276px !important;
  padding:24px 26px !important;
  border-color:rgba(69,168,204,.20) !important;
}
html body.home.homeRefinedV588 .courseFlowV588{
  display:grid !important;
  gap:13px !important;
  margin:22px 0 20px !important;
}
html body.home.homeRefinedV588 .flowRowV588{
  position:relative !important;
  display:block !important;
  padding-left:34px !important;
  font-size:14px !important;
  font-weight:840 !important;
}
html body.home.homeRefinedV588 .flowRowV588::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:50% !important;
  width:20px !important;
  height:20px !important;
  transform:translateY(-50%) !important;
  border-radius:50% !important;
  border:1px solid rgba(69,168,204,.26) !important;
  background:#fff !important;
}
html body.home.homeRefinedV588 .isDoneV588::after{
  content:"✓" !important;
  position:absolute !important;
  left:3px !important;
  top:50% !important;
  transform:translateY(-58%) !important;
  color:var(--journey-green-deep-v588) !important;
  font-size:18px !important;
  font-weight:950 !important;
}
html body.home.homeRefinedV588 .isActiveV588::before{
  background:rgba(69,168,204,.14) !important;
  border-color:rgba(69,168,204,.62) !important;
  box-shadow:0 0 0 7px rgba(69,168,204,.06) !important;
  animation:v588ActiveRing 2.6s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .isQuietV588{ opacity:.56 !important; }
html body.home.homeRefinedV588 .nextPillV588{
  display:inline-flex !important;
  align-items:center !important;
  min-height:44px !important;
  padding:0 17px !important;
  border-radius:15px !important;
  background:linear-gradient(135deg, rgba(69,168,204,.12), rgba(255,255,255,.66)) !important;
  border:1px solid rgba(69,168,204,.17) !important;
  font-size:13px !important;
  font-weight:880 !important;
  color:#223248 !important;
}
html body.home.homeRefinedV588 .unitMomentV588{
  left:20% !important;
  bottom:13% !important;
  width:330px !important;
  padding:20px 22px !important;
  border-color:rgba(210,165,78,.20) !important;
}
html body.home.homeRefinedV588 .motionTraceV588{
  position:absolute !important;
  z-index:1 !important;
  height:2px !important;
  border-radius:99px !important;
  background:linear-gradient(90deg, rgba(69,168,204,0), rgba(69,168,204,.45), rgba(69,168,204,0)) !important;
  transform-origin:left center !important;
  opacity:.38 !important;
}
html body.home.homeRefinedV588 .traceLearnOneV588{ left:33% !important; top:39% !important; width:22% !important; transform:rotate(-8deg) !important; }
html body.home.homeRefinedV588 .traceLearnTwoV588{ left:43% !important; top:70% !important; width:18% !important; transform:rotate(-12deg) !important; background:linear-gradient(90deg, rgba(210,165,78,0), rgba(210,165,78,.43), rgba(210,165,78,0)) !important; }

/* 2 Transfer: Kursimpuls, konkreter Praxisraum, Rückfrage ins Weiterlernen. */
html body.home.homeRefinedV588 .courseImpulseV588{
  left:6% !important;
  top:14% !important;
  width:270px !important;
  padding:21px 23px !important;
  border-color:rgba(210,165,78,.26) !important;
}
html body.home.homeRefinedV588 .knowledgeCardV588{
  left:35% !important;
  top:28% !important;
  width:210px !important;
  padding:18px 20px !important;
  border-color:rgba(210,165,78,.22) !important;
  animation:v588KnowledgeCarry 8s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .transferFigureV588{
  left:31% !important;
  top:47% !important;
  animation:v588WalkCycle 8s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .transferFigureV588 .armCarryFrontV588{ left:56px !important; top:50px !important; transform:rotate(48deg) !important; animation:v588CarryArm 8s ease-in-out infinite !important; }
html body.home.homeRefinedV588 .transferFigureV588 .armCarryBackV588{ left:12px !important; top:52px !important; transform:rotate(142deg) !important; opacity:.85 !important; }
html body.home.homeRefinedV588 .transferFigureV588 .legA{ left:24px !important; top:102px !important; transform:rotate(20deg) !important; animation:v588LegA 8s ease-in-out infinite !important; }
html body.home.homeRefinedV588 .transferFigureV588 .legB{ left:50px !important; top:102px !important; transform:rotate(-25deg) !important; animation:v588LegB 8s ease-in-out infinite !important; }
html body.home.homeRefinedV588 .practiceRoomV588{
  position:absolute !important;
  z-index:2 !important;
  right:9% !important;
  top:18% !important;
  width:260px !important;
  height:238px !important;
}
html body.home.homeRefinedV588 .roomRoofV588{
  position:absolute !important;
  left:72px !important;
  top:6px !important;
  width:120px !important;
  height:86px !important;
  border-left:14px solid rgba(143,180,95,.78) !important;
  border-top:14px solid rgba(143,180,95,.78) !important;
  border-radius:10px 0 0 0 !important;
  transform:rotate(45deg) !important;
}
html body.home.homeRefinedV588 .roomFloorV588{
  position:absolute !important;
  left:34px !important;
  bottom:20px !important;
  width:220px !important;
  height:2px !important;
  border-radius:99px !important;
  background:linear-gradient(90deg, rgba(23,33,52,0), rgba(23,33,52,.12), rgba(23,33,52,0)) !important;
}
html body.home.homeRefinedV588 .adultV588,
html body.home.homeRefinedV588 .childV588{
  position:absolute !important;
  border:1px solid rgba(23,33,52,.08) !important;
  box-shadow:0 14px 28px rgba(18,36,58,.045) !important;
}
html body.home.homeRefinedV588 .adultV588{
  left:58px !important;
  top:119px !important;
  width:48px !important;
  height:62px !important;
  border-radius:27px 27px 17px 17px !important;
  background:#edf7ee !important;
}
html body.home.homeRefinedV588 .adultV588::before,
html body.home.homeRefinedV588 .childV588::before{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:-28px !important;
  width:36px !important;
  height:36px !important;
  transform:translateX(-50%) !important;
  border-radius:50% !important;
  background:#f3c49b !important;
}
html body.home.homeRefinedV588 .childV588{
  width:34px !important;
  height:42px !important;
  border-radius:20px 20px 13px 13px !important;
  background:#fff3df !important;
}
html body.home.homeRefinedV588 .childOneV588{ left:164px !important; top:141px !important; }
html body.home.homeRefinedV588 .childTwoV588{ left:203px !important; top:147px !important; background:#edf7f2 !important; transform:scale(.88) !important; }
html body.home.homeRefinedV588 .snackTableV588{
  position:absolute !important;
  left:82px !important;
  top:188px !important;
  width:116px !important;
  height:28px !important;
  border-radius:50% !important;
  background:rgba(255,248,235,.88) !important;
  border:1px solid rgba(210,165,78,.24) !important;
  display:block !important;
}
html body.home.homeRefinedV588 .snackTableV588 i{
  position:absolute !important;
  top:9px !important;
  width:10px !important;
  height:10px !important;
  border-radius:50% !important;
  background:var(--journey-gold-v588) !important;
  opacity:.84 !important;
  animation:v588SnackPulse 4.2s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .snackTableV588 i:nth-child(1){ left:28px !important; }
html body.home.homeRefinedV588 .snackTableV588 i:nth-child(2){ left:49px !important; animation-delay:.15s !important; }
html body.home.homeRefinedV588 .snackTableV588 i:nth-child(3){ left:70px !important; animation-delay:.3s !important; }
html body.home.homeRefinedV588 .snackTableV588 i:nth-child(4){ left:91px !important; animation-delay:.45s !important; }
html body.home.homeRefinedV588 .practiceQuestionV588{
  left:17% !important;
  bottom:12% !important;
  width:330px !important;
  padding:19px 22px !important;
  border-color:rgba(69,168,204,.20) !important;
  animation:v588ReturnNote 8s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .travelArcV588{
  position:absolute !important;
  z-index:1 !important;
  height:2px !important;
  border-radius:99px !important;
  background:linear-gradient(90deg, rgba(210,165,78,0), rgba(210,165,78,.44), rgba(210,165,78,0)) !important;
  opacity:.48 !important;
}
html body.home.homeRefinedV588 .arcOutV588{ left:30% !important; top:40% !important; width:44% !important; transform:rotate(-10deg) !important; }
html body.home.homeRefinedV588 .arcBackV588{ left:35% !important; bottom:22% !important; width:30% !important; transform:rotate(8deg) !important; background:linear-gradient(90deg, rgba(69,168,204,0), rgba(69,168,204,.42), rgba(69,168,204,0)) !important; }

/* 3 Dokumentation: Abschlusslogik statt Ornamentik. */
html body.home.homeRefinedV588 .abschlussPanelV588{
  left:8% !important;
  top:25% !important;
  width:300px !important;
  padding:23px 24px !important;
  border-color:rgba(69,168,204,.18) !important;
}
html body.home.homeRefinedV588 .abschlussStepV588{
  position:relative !important;
  display:block !important;
  padding-left:32px !important;
  margin:15px 0 0 !important;
  font-size:14px !important;
  font-weight:850 !important;
  color:rgba(23,33,52,.70) !important;
}
html body.home.homeRefinedV588 .abschlussStepV588::before{
  content:"✓" !important;
  position:absolute !important;
  left:0 !important;
  top:50% !important;
  transform:translateY(-55%) !important;
  width:21px !important;
  height:21px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:50% !important;
  background:rgba(143,180,95,.12) !important;
  border:1px solid rgba(143,180,95,.34) !important;
  color:var(--journey-green-deep-v588) !important;
  font-size:14px !important;
  font-weight:950 !important;
  animation:v588CheckStep 5.6s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .abschlussStepV588:nth-child(3)::before{ animation-delay:.35s !important; }
html body.home.homeRefinedV588 .abschlussStepV588:nth-child(4)::before{ animation-delay:.7s !important; }
html body.home.homeRefinedV588 .documentFigureV588{
  left:40% !important;
  top:49% !important;
}
html body.home.homeRefinedV588 .documentFigureV588 .armPlaceV588{
  left:58px !important;
  top:52px !important;
  transform:rotate(47deg) !important;
  animation:v588PlaceDoc 5.6s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .certificateMomentV588{
  right:10% !important;
  top:22% !important;
  width:304px !important;
  min-height:218px !important;
  padding:25px 26px !important;
  border-color:rgba(143,180,95,.26) !important;
}
html body.home.homeRefinedV588 .certLineV588{
  display:block !important;
  width:136px !important;
  height:7px !important;
  margin-top:22px !important;
  border-radius:99px !important;
  background:rgba(23,33,52,.15) !important;
}
html body.home.homeRefinedV588 .certLineV588.short{
  width:92px !important;
  margin-top:10px !important;
}
html body.home.homeRefinedV588 .proofCodeV588{
  position:absolute !important;
  left:26px !important;
  bottom:28px !important;
  padding:7px 10px !important;
  border-radius:9px !important;
  background:rgba(23,33,52,.055) !important;
  font-size:11px !important;
  font-weight:900 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  color:rgba(23,33,52,.58) !important;
}
html body.home.homeRefinedV588 .qrMarkV588{
  position:absolute !important;
  right:28px !important;
  bottom:26px !important;
  width:50px !important;
  height:50px !important;
  border-radius:8px !important;
  border:1px solid rgba(23,33,52,.13) !important;
  background:
    linear-gradient(90deg, rgba(23,33,52,.22) 5px, transparent 5px) 0 0/16px 16px,
    linear-gradient(rgba(23,33,52,.16) 5px, transparent 5px) 0 0/16px 16px,
    #fff !important;
  opacity:.72 !important;
}
html body.home.homeRefinedV588 .qrMarkV588::after{
  content:"" !important;
  position:absolute !important;
  left:-8px !important;
  right:-8px !important;
  top:50% !important;
  height:2px !important;
  background:rgba(69,168,204,.55) !important;
  box-shadow:0 0 16px rgba(69,168,204,.32) !important;
  transform:translateY(-50%) !important;
  animation:v588Scan 4.8s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .sealMarkV588{
  position:absolute !important;
  right:27px !important;
  top:28px !important;
  width:58px !important;
  height:58px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:50% !important;
  background:rgba(143,180,95,.13) !important;
  border:1px solid rgba(143,180,95,.42) !important;
  box-shadow:0 0 0 12px rgba(143,180,95,.055), 0 18px 30px rgba(18,36,58,.07) !important;
  color:var(--journey-green-deep-v588) !important;
  font-size:30px !important;
  font-weight:950 !important;
  animation:v588Seal 5.6s ease-in-out infinite !important;
}
html body.home.homeRefinedV588 .documentFlowV588{
  position:absolute !important;
  z-index:1 !important;
  left:44% !important;
  top:43% !important;
  width:24% !important;
  height:2px !important;
  border-radius:99px !important;
  background:linear-gradient(90deg, rgba(143,180,95,0), rgba(143,180,95,.48), rgba(143,180,95,0)) !important;
  transform:rotate(-3deg) !important;
  opacity:.55 !important;
}

/* Rechte Spalte: gleiche Höhenlogik, ruhiger und enger mit der Reise verschränkt. */
html body.home.homeRefinedV588 .whyQualityWeave{
  display:grid !important;
  grid-template-rows:repeat(3, var(--journey-row-v588)) !important;
  gap:0 !important;
  align-content:start !important;
}
html body.home.homeRefinedV588 .whyQualityWeave::before{
  width:1px !important;
  opacity:.34 !important;
  background:linear-gradient(180deg, rgba(69,168,204,.34), rgba(210,165,78,.28) 50%, rgba(143,180,95,.34)) !important;
}
html body.home.homeRefinedV588 .whyQualityNote{
  min-height:var(--journey-row-v588) !important;
  height:var(--journey-row-v588) !important;
  display:flex !important;
  align-items:center !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  opacity:.72 !important;
  transition:opacity .45s ease, transform .45s ease !important;
}
html body.home.homeRefinedV588 .whyQualityNote.isStoryActiveV585,
html body.home.homeRefinedV588 .whyQualityNote.isStoryActiveV584{
  opacity:1 !important;
  transform:translateX(0) !important;
}
html body.home.homeRefinedV588 .whyQualityNote .whyQualityBody{
  max-width:520px !important;
}
html body.home.homeRefinedV588 .whyQualityNote .whyQualityMark{
  background:rgba(255,255,255,.94) !important;
  border-color:color-mix(in oklab, var(--pillar-accent) 34%, #fff) !important;
  transition:box-shadow .45s ease, transform .45s ease, background .45s ease, border-color .45s ease !important;
}
html body.home.homeRefinedV588 .whyQualityNote.isStoryActiveV585 .whyQualityMark,
html body.home.homeRefinedV588 .whyQualityNote.isStoryActiveV584 .whyQualityMark{
  transform:scale(1.12) !important;
  background:color-mix(in oklab, var(--pillar-accent) 9%, #fff) !important;
  border-color:color-mix(in oklab, var(--pillar-accent) 58%, #fff) !important;
  box-shadow:
    0 0 0 14px color-mix(in oklab, var(--pillar-accent) 7%, transparent),
    0 0 34px color-mix(in oklab, var(--pillar-accent) 23%, transparent),
    0 14px 28px rgba(18,36,58,.06) !important;
}
html body.home.homeRefinedV588 .whyQualityNote.isStoryActiveV585 .whyQualityBody .k,
html body.home.homeRefinedV588 .whyQualityNote.isStoryActiveV584 .whyQualityBody .k{
  color:color-mix(in oklab, var(--pillar-accent) 70%, #172134) !important;
}

@keyframes v588TypeGesture{
  0%,100%{ transform:rotate(48deg) translateY(0); }
  45%{ transform:rotate(61deg) translateY(2px); }
  68%{ transform:rotate(53deg) translateY(-1px); }
}
@keyframes v588CodeDot{
  0%,22%{ transform:scale(.55); opacity:.20; }
  36%,100%{ transform:scale(1); opacity:.82; }
}
@keyframes v588Cursor{ 0%,48%{ opacity:1; } 49%,100%{ opacity:.12; } }
@keyframes v588ActiveRing{
  0%,100%{ box-shadow:0 0 0 7px rgba(69,168,204,.06); }
  48%{ box-shadow:0 0 0 12px rgba(69,168,204,.10); }
}
@keyframes v588WalkCycle{
  0%,100%{ transform:translate(-18px, 0); }
  42%,68%{ transform:translate(118px, -6px); }
}
@keyframes v588CarryArm{
  0%,100%{ transform:rotate(52deg); }
  50%{ transform:rotate(39deg); }
}
@keyframes v588LegA{
  0%,100%{ transform:rotate(18deg); }
  45%{ transform:rotate(-18deg); }
  70%{ transform:rotate(12deg); }
}
@keyframes v588LegB{
  0%,100%{ transform:rotate(-24deg); }
  45%{ transform:rotate(20deg); }
  70%{ transform:rotate(-12deg); }
}
@keyframes v588KnowledgeCarry{
  0%,20%{ transform:translateX(-28px) translateY(-6px) scale(.96); opacity:.68; }
  44%,68%{ transform:translateX(54px) translateY(28px) scale(1); opacity:1; }
  100%{ transform:translateX(0) translateY(0) scale(1); opacity:1; }
}
@keyframes v588ReturnNote{
  0%,50%{ transform:translate(58px,-26px) scale(.96); opacity:.30; }
  70%,100%{ transform:translate(0,0) scale(1); opacity:1; }
}
@keyframes v588SnackPulse{
  0%,100%{ transform:translateY(0); opacity:.72; }
  45%{ transform:translateY(-3px); opacity:1; }
}
@keyframes v588CheckStep{
  0%,100%{ transform:translateY(-55%) scale(1); }
  48%{ transform:translateY(-55%) scale(1.12); }
}
@keyframes v588PlaceDoc{
  0%,100%{ transform:rotate(44deg) translateY(0); }
  45%{ transform:rotate(56deg) translateY(2px); }
}
@keyframes v588Scan{
  0%,100%{ top:18%; opacity:0; }
  25%,70%{ opacity:1; }
  82%{ top:82%; opacity:0; }
}
@keyframes v588Seal{
  0%,100%{ transform:scale(1); }
  48%{ transform:scale(1.06); }
}

@media (max-width: 1220px){
  html body.home.homeRefinedV588{
    --journey-row-v588: clamp(500px, 52vh, 620px);
  }
  html body.home.homeRefinedV588 .whyNarrative{
    grid-template-columns:minmax(540px, 1fr) minmax(460px, .94fr) !important;
    gap:clamp(42px, 5.2vw, 76px) !important;
  }
  html body.home.homeRefinedV588 .cockpitMomentV588{ left:37% !important; width:340px !important; }
  html body.home.homeRefinedV588 .practiceRoomV588{ right:5% !important; }
  html body.home.homeRefinedV588 .certificateMomentV588{ right:6% !important; }
}

@media (max-width: 980px){
  html body.home.homeRefinedV588{
    --journey-row-v588: 720px;
  }
  html body.home.homeRefinedV588 .whyNarrative{
    grid-template-columns:1fr !important;
  }
  html body.home.homeRefinedV588 .whyEditorialLead.whyJourneyPanelV584,
  html body.home.homeRefinedV588 .verticalLearningJourneyV584,
  html body.home.homeRefinedV588 .premiumLearningJourneyV588{
    min-height:var(--journey-row-v588) !important;
    height:var(--journey-row-v588) !important;
  }
  html body.home.homeRefinedV588 .premiumLearningJourneyV588{
    display:block !important;
  }
  html body.home.homeRefinedV588 .journeySceneV588{
    position:absolute !important;
    inset:0 !important;
    height:var(--journey-row-v588) !important;
    min-height:var(--journey-row-v588) !important;
    opacity:0 !important;
    visibility:hidden !important;
  }
  html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-learn .sceneLearnV588,
  html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-transfer .sceneTransferV588,
  html body.home.homeRefinedV588 .verticalLearningJourneyV584.is-document .sceneDocumentV588{
    opacity:1 !important;
    visibility:visible !important;
  }
  html body.home.homeRefinedV588 .journeySpineV588{
    display:none !important;
  }
  html body.home.homeRefinedV588 .whyQualityWeave{
    display:grid !important;
    grid-template-rows:none !important;
  }
  html body.home.homeRefinedV588 .whyQualityNote{
    height:auto !important;
    min-height:auto !important;
    padding-top:20px !important;
    padding-bottom:20px !important;
  }
}

@media (max-width: 680px){
  html body.home.homeRefinedV588{
    --journey-row-v588: 650px;
  }
  html body.home.homeRefinedV588 .verticalLearningJourneyV584{
    max-width:100% !important;
  }
  html body.home.homeRefinedV588 .accessMomentV588{ left:16% !important; top:18% !important; transform:scale(.88) !important; transform-origin:left top !important; }
  html body.home.homeRefinedV588 .learnerAtCodeV588{ left:2% !important; top:21% !important; transform:scale(.82) !important; }
  html body.home.homeRefinedV588 .cockpitMomentV588{ left:12% !important; top:34% !important; width:76% !important; transform:scale(.92) !important; transform-origin:left top !important; }
  html body.home.homeRefinedV588 .unitMomentV588{ left:14% !important; bottom:7% !important; width:72% !important; transform:scale(.9) !important; transform-origin:left bottom !important; }
  html body.home.homeRefinedV588 .courseImpulseV588{ left:8% !important; top:10% !important; width:78% !important; transform:scale(.92) !important; transform-origin:left top !important; }
  html body.home.homeRefinedV588 .knowledgeCardV588{ left:15% !important; top:29% !important; transform:scale(.9) !important; }
  html body.home.homeRefinedV588 .practiceRoomV588{ right:4% !important; top:38% !important; transform:scale(.85) !important; transform-origin:right top !important; }
  html body.home.homeRefinedV588 .transferFigureV588{ left:12% !important; top:48% !important; transform:scale(.82) !important; }
  html body.home.homeRefinedV588 .practiceQuestionV588{ left:11% !important; bottom:8% !important; width:78% !important; transform:scale(.9) !important; transform-origin:left bottom !important; }
  html body.home.homeRefinedV588 .abschlussPanelV588{ left:8% !important; top:10% !important; width:78% !important; transform:scale(.92) !important; transform-origin:left top !important; }
  html body.home.homeRefinedV588 .certificateMomentV588{ left:10% !important; right:auto !important; top:42% !important; width:78% !important; transform:scale(.9) !important; transform-origin:left top !important; }
  html body.home.homeRefinedV588 .documentFigureV588{ left:13% !important; top:70% !important; transform:scale(.78) !important; }
}

@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV588 .premiumLearningJourneyV588 *,
  html body.home.homeRefinedV588 .spineProgressV588,
  html body.home.homeRefinedV588 .whyQualityNote .whyQualityMark{
    animation:none !important;
    transition:none !important;
  }
}

/* finale Priorität für Textlabels nach den generischen Span-Regeln */
html body.home.homeRefinedV588 .premiumLearningJourneyV588 .sceneEyebrowV588{
  display:block !important;
  margin:0 0 9px 0 !important;
  font-size:10px !important;
  line-height:1.1 !important;
  font-weight:900 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  color:rgba(23,33,52,.54) !important;
}
html body.home.homeRefinedV588 .premiumLearningJourneyV588 .unitMomentV588 > span:not(.sceneEyebrowV588),
html body.home.homeRefinedV588 .premiumLearningJourneyV588 .courseImpulseV588 > span:not(.sceneEyebrowV588),
html body.home.homeRefinedV588 .premiumLearningJourneyV588 .knowledgeCardV588 > span:not(.sceneEyebrowV588),
html body.home.homeRefinedV588 .premiumLearningJourneyV588 .practiceQuestionV588 > span:not(.sceneEyebrowV588){
  display:block !important;
  margin-top:7px !important;
  font-size:13px !important;
  font-weight:760 !important;
  color:rgba(23,33,52,.62) !important;
}
