/* Praxoria Startseite – v587: abgestimmte Premium-Lernreise in drei ruhigen Höhenebenen. */

html body.home.homeRefinedV587{
  --journey-row-v587: clamp(430px, 45vh, 560px);
  --journey-total-v587: clamp(1290px, 135vh, 1680px);
}

html body.home.homeRefinedV587 .whyNarrative{
  grid-template-columns:minmax(560px, .98fr) minmax(520px, 1.02fr) !important;
  gap:clamp(76px, 8vw, 132px) !important;
  align-items:stretch !important;
  padding-top:clamp(26px, 3.8vw, 54px) !important;
  padding-bottom:clamp(24px, 4vw, 58px) !important;
}

html body.home.homeRefinedV587 .whyEditorialLead.whyJourneyPanelV584{
  position:relative !important;
  top:auto !important;
  align-self:stretch !important;
  display:block !important;
  min-height:var(--journey-total-v587) !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}

html body.home.homeRefinedV587 .verticalLearningJourneyV584{
  --journey-blue:#4ba9cc;
  --journey-blue-deep:#2f7f9d;
  --journey-gold:#d4a74e;
  --journey-gold-deep:#9b722f;
  --journey-green:#8fb45f;
  --journey-green-deep:#64883f;
  --journey-ink:#172134;
  --journey-muted:#66717f;
  --journey-active:var(--journey-blue-deep);
  position:relative !important;
  width:100% !important;
  max-width:760px !important;
  height:100% !important;
  min-height:var(--journey-total-v587) !important;
  margin:0 auto !important;
  overflow:visible !important;
  pointer-events:none !important;
  transform:none !important;
  isolation:isolate !important;
}

html body.home.homeRefinedV587 .verticalLearningJourneyV584::before,
html body.home.homeRefinedV587 .premiumLearningJourneyV586::before{
  content:"" !important;
  position:absolute !important;
  inset:-2% -8% !important;
  z-index:-1 !important;
  background:
    radial-gradient(circle at 30% 8%, rgba(75,169,204,.075), transparent 22%),
    radial-gradient(circle at 58% 48%, rgba(212,167,78,.065), transparent 24%),
    radial-gradient(circle at 42% 88%, rgba(143,180,95,.07), transparent 25%) !important;
  filter:blur(30px) !important;
  opacity:.70 !important;
}

html body.home.homeRefinedV587 .journeyCanvasV584{
  display:none !important;
}

html body.home.homeRefinedV587 .premiumLearningJourneyV586{
  position:relative !important;
  inset:auto !important;
  z-index:2 !important;
  display:grid !important;
  grid-template-rows:repeat(3, var(--journey-row-v587)) !important;
  height:auto !important;
  min-height:var(--journey-total-v587) !important;
  overflow:visible !important;
  filter:saturate(.96) !important;
}

/* Ein einziger Reisefaden: nah an der rechten Textspalte, aber ohne zweite Leiste. */
html body.home.homeRefinedV587 .journeyRailV586{
  position:absolute !important;
  left:78% !important;
  top:clamp(68px, 7.2vh, 90px) !important;
  bottom:clamp(68px, 7.2vh, 90px) !important;
  width:42px !important;
  transform:translateX(-50%) !important;
  z-index:1 !important;
}
html body.home.homeRefinedV587 .journeyRailLineV586,
html body.home.homeRefinedV587 .journeyRailProgressV586{
  left:50% !important;
  width:2px !important;
  transform:translateX(-50%) !important;
}
html body.home.homeRefinedV587 .journeyRailLineV586{
  background:linear-gradient(180deg, rgba(47,127,157,.22), rgba(155,114,47,.18) 50%, rgba(100,136,63,.22)) !important;
}
html body.home.homeRefinedV587 .journeyRailProgressV586{
  background:linear-gradient(180deg, var(--journey-blue), var(--journey-gold) 50%, var(--journey-green)) !important;
  opacity:.62 !important;
  box-shadow:0 0 18px color-mix(in oklab, var(--journey-active) 15%, transparent) !important;
}
html body.home.homeRefinedV587 .journeyRailNodeV586{
  width:22px !important;
  height:22px !important;
  border:1px solid rgba(23,33,52,.12) !important;
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 10px 24px rgba(18,36,58,.06) !important;
}
html body.home.homeRefinedV587 .nodeLearnV586{ top:0% !important; }
html body.home.homeRefinedV587 .nodeTransferV586{ top:50% !important; }
html body.home.homeRefinedV587 .nodeDocumentV586{ top:100% !important; }

html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-learn .nodeLearnV586,
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-transfer .nodeTransferV586,
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-document .nodeDocumentV586{
  background:color-mix(in oklab, var(--journey-active) 14%, #fff) !important;
  border-color:color-mix(in oklab, var(--journey-active) 48%, #fff) !important;
  transform:translate(-50%, -50%) scale(1.12) !important;
  box-shadow:
    0 0 0 18px color-mix(in oklab, var(--journey-active) 7%, transparent),
    0 0 42px color-mix(in oklab, var(--journey-active) 22%, transparent),
    0 16px 34px rgba(18,36,58,.07) !important;
}

/* Drei Szenen stehen untereinander und korrespondieren mit den drei Textankern rechts. */
html body.home.homeRefinedV587 .journeyChapterV586{
  position:relative !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  width:100% !important;
  min-height:var(--journey-row-v587) !important;
  height:var(--journey-row-v587) !important;
  opacity:.44 !important;
  filter:saturate(.82) blur(.05px) !important;
  transform:none !important;
  transition:opacity .45s ease, filter .45s ease, transform .45s ease !important;
  z-index:2 !important;
}
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-learn .chapterLearnV586,
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-transfer .chapterTransferV586,
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-document .chapterDocumentV586{
  opacity:1 !important;
  filter:none !important;
  transform:translateX(0) !important;
}
html body.home.homeRefinedV587 .chapterLearnV586,
html body.home.homeRefinedV587 .chapterTransferV586,
html body.home.homeRefinedV587 .chapterDocumentV586{
  max-width:none !important;
}

html body.home.homeRefinedV587 .chapterLearnV586::after,
html body.home.homeRefinedV587 .chapterTransferV586::after,
html body.home.homeRefinedV587 .chapterDocumentV586::after{
  content:"" !important;
  position:absolute !important;
  left:calc(78% - 64px) !important;
  right:calc(22% + 18px) !important;
  top:50% !important;
  height:2px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg, rgba(255,255,255,0), color-mix(in oklab, var(--journey-active) 20%, transparent), rgba(255,255,255,0)) !important;
  opacity:.35 !important;
}

html body.home.homeRefinedV587 .accessCardV586,
html body.home.homeRefinedV587 .cockpitCardV586,
html body.home.homeRefinedV587 .unitCardV586,
html body.home.homeRefinedV587 .impulseCardV586,
html body.home.homeRefinedV587 .knowledgeSlipV586,
html body.home.homeRefinedV587 .returnQuestionV586,
html body.home.homeRefinedV587 .completionCardV586,
html body.home.homeRefinedV587 .certificateV586{
  border-radius:22px !important;
  background:linear-gradient(135deg, rgba(255,255,255,.88), rgba(255,255,255,.66)) !important;
  border:1px solid rgba(23,33,52,.10) !important;
  box-shadow:0 24px 64px rgba(18,36,58,.07), inset 0 1px 0 rgba(255,255,255,.86) !important;
  backdrop-filter:blur(13px) !important;
}
html body.home.homeRefinedV587 .eyebrowV586{
  font-size:10px !important;
  letter-spacing:.17em !important;
  color:rgba(23,33,52,.54) !important;
}
html body.home.homeRefinedV587 .premiumLearningJourneyV586 strong{
  font-size:clamp(13.5px, .86vw, 16px) !important;
  line-height:1.2 !important;
  letter-spacing:-.02em !important;
}
html body.home.homeRefinedV587 .premiumLearningJourneyV586 span{
  font-size:clamp(11px, .72vw, 13px) !important;
}

/* Lernführung: Zugangscode und Lern-Cockpit bleiben gemeinsam sichtbar; der nächste Schritt wird klar. */
html body.home.homeRefinedV587 .chapterLearnV586 .humanLearnV586{ left:4% !important; top:31% !important; }
html body.home.homeRefinedV587 .chapterLearnV586 .accessCardV586{
  left:12% !important;
  top:26% !important;
  width:190px !important;
  padding:16px 18px !important;
  border-color:rgba(75,169,204,.22) !important;
}
html body.home.homeRefinedV587 .chapterLearnV586 .cockpitCardV586{
  left:39% !important;
  right:auto !important;
  top:14% !important;
  width:245px !important;
  padding:20px 22px !important;
  border-color:rgba(75,169,204,.22) !important;
}
html body.home.homeRefinedV587 .chapterLearnV586 .unitCardV586{
  left:31% !important;
  bottom:12% !important;
  width:310px !important;
  padding:18px 22px !important;
  border-color:rgba(212,167,78,.24) !important;
}
html body.home.homeRefinedV587 .nextStepV586{
  background:rgba(75,169,204,.075) !important;
}

/* Transfer: Lernen wird als Weg in die Praxis gezeigt, nicht als dichte Objektcollage. */
html body.home.homeRefinedV587 .chapterTransferV586 .impulseCardV586{
  left:6% !important;
  top:12% !important;
  width:235px !important;
  padding:18px 20px !important;
  border-color:rgba(212,167,78,.24) !important;
}
html body.home.homeRefinedV587 .chapterTransferV586 .knowledgeSlipV586{
  left:35% !important;
  right:auto !important;
  top:31% !important;
  width:240px !important;
  padding:17px 19px !important;
  border-color:rgba(212,167,78,.22) !important;
}
html body.home.homeRefinedV587 .chapterTransferV586 .humanWalkV586{
  left:22% !important;
  top:54% !important;
}
html body.home.homeRefinedV587 .chapterTransferV586 .practiceSceneV586{
  right:8% !important;
  bottom:18% !important;
  width:220px !important;
  height:158px !important;
  opacity:.92 !important;
}
html body.home.homeRefinedV587 .chapterTransferV586 .returnQuestionV586{
  left:8% !important;
  bottom:8% !important;
  width:280px !important;
  padding:17px 20px !important;
  border-color:rgba(75,169,204,.20) !important;
}
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-transfer .humanWalkV586{
  animation:journeyWalkV587 7.8s ease-in-out infinite !important;
}
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-transfer .knowledgeSlipV586{
  animation:knowledgeCarryV587 7.8s ease-in-out infinite !important;
}
html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-transfer .returnQuestionV586{
  animation:returnQuestionV587 7.8s ease-in-out infinite !important;
}

/* Dokumentation: weniger Dekoration, klarer Abschlussfluss. */
html body.home.homeRefinedV587 .chapterDocumentV586 .completionCardV586{
  left:10% !important;
  top:20% !important;
  width:260px !important;
  padding:20px 22px !important;
  border-color:rgba(75,169,204,.18) !important;
}
html body.home.homeRefinedV587 .chapterDocumentV586 .certificateV586{
  left:46% !important;
  right:auto !important;
  top:29% !important;
  width:260px !important;
  min-height:174px !important;
  padding:22px 24px !important;
  border-color:rgba(143,180,95,.26) !important;
}
html body.home.homeRefinedV587 .chapterDocumentV586 .humanDocV586{
  left:38% !important;
  top:55% !important;
}
html body.home.homeRefinedV587 .certificateV586 .sealV586{
  right:22px !important;
  top:22px !important;
}
html body.home.homeRefinedV587 .certificateV586 .qrV586{
  right:22px !important;
  bottom:24px !important;
}

/* Rechte Spalte: gleiche Höhenlogik wie die linke Reise, aktiver Punkt bleibt subtil. */
html body.home.homeRefinedV587 .whyQualityWeave{
  display:grid !important;
  grid-template-rows:repeat(3, var(--journey-row-v587)) !important;
  gap:0 !important;
  align-content:start !important;
}
html body.home.homeRefinedV587 .whyQualityWeave::before{
  width:1px !important;
  opacity:.30 !important;
  background:linear-gradient(180deg, rgba(75,169,204,.34), rgba(212,167,78,.26) 50%, rgba(143,180,95,.32)) !important;
}
html body.home.homeRefinedV587 .whyQualityNote{
  min-height:var(--journey-row-v587) !important;
  height:var(--journey-row-v587) !important;
  display:flex !important;
  align-items:flex-start !important;
  padding-top:clamp(48px, 8vh, 88px) !important;
  opacity:.76 !important;
}
html body.home.homeRefinedV587 .whyQualityNote.isStoryActiveV585,
html body.home.homeRefinedV587 .whyQualityNote.isStoryActiveV584{
  opacity:1 !important;
}
html body.home.homeRefinedV587 .whyQualityNote .whyQualityBody{
  max-width:520px !important;
}
html body.home.homeRefinedV587 .whyQualityNote .whyQualityMark{
  background:rgba(255,255,255,.94) !important;
  border-color:color-mix(in oklab, var(--pillar-accent) 35%, #fff) !important;
  transition:box-shadow .45s ease, transform .45s ease, background .45s ease !important;
}
html body.home.homeRefinedV587 .whyQualityNote.isStoryActiveV585 .whyQualityMark,
html body.home.homeRefinedV587 .whyQualityNote.isStoryActiveV584 .whyQualityMark{
  transform:scale(1.08) !important;
  background:color-mix(in oklab, var(--pillar-accent) 10%, #fff) !important;
  box-shadow:
    0 0 0 13px color-mix(in oklab, var(--pillar-accent) 7%, transparent),
    0 0 32px color-mix(in oklab, var(--pillar-accent) 22%, transparent) !important;
}

@keyframes journeyWalkV587{
  0%,100%{ transform:translateX(-8px) translateY(0); }
  42%,66%{ transform:translateX(92px) translateY(-8px); }
}
@keyframes knowledgeCarryV587{
  0%,18%{ transform:translate(-70px,-34px) scale(.94); opacity:.48; }
  44%,72%{ transform:translate(20px,6px) scale(1); opacity:1; }
  100%{ transform:translate(0,0) scale(1); opacity:1; }
}
@keyframes returnQuestionV587{
  0%,54%{ transform:translate(80px,-54px) scale(.94); opacity:.10; }
  76%,100%{ transform:translate(0,0) scale(1); opacity:1; }
}

@media (max-width: 1180px){
  html body.home.homeRefinedV587{
    --journey-row-v587: clamp(390px, 43vh, 520px);
    --journey-total-v587: clamp(1170px, 129vh, 1560px);
  }
  html body.home.homeRefinedV587 .whyNarrative{
    grid-template-columns:minmax(470px, 1fr) minmax(440px, 1fr) !important;
    gap:clamp(42px, 5.6vw, 76px) !important;
  }
  html body.home.homeRefinedV587 .chapterLearnV586 .cockpitCardV586{ left:36% !important; width:220px !important; }
  html body.home.homeRefinedV587 .chapterDocumentV586 .certificateV586{ left:42% !important; width:238px !important; }
}

@media (max-width: 980px){
  html body.home.homeRefinedV587{
    --journey-row-v587: auto;
  }
  html body.home.homeRefinedV587 .whyNarrative{
    grid-template-columns:1fr !important;
  }
  html body.home.homeRefinedV587 .whyEditorialLead.whyJourneyPanelV584,
  html body.home.homeRefinedV587 .verticalLearningJourneyV584,
  html body.home.homeRefinedV587 .premiumLearningJourneyV586{
    min-height:760px !important;
  }
  html body.home.homeRefinedV587 .premiumLearningJourneyV586{
    display:block !important;
  }
  html body.home.homeRefinedV587 .journeyChapterV586{
    position:absolute !important;
    height:760px !important;
    min-height:760px !important;
    inset:0 auto auto 0 !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
  html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-learn .chapterLearnV586,
  html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-transfer .chapterTransferV586,
  html body.home.homeRefinedV587 .verticalLearningJourneyV584.is-document .chapterDocumentV586{
    opacity:1 !important;
  }
  html body.home.homeRefinedV587 .journeyRailV586{
    display:none !important;
  }
  html body.home.homeRefinedV587 .whyQualityWeave{
    display:grid !important;
    grid-template-rows:none !important;
    gap:0 !important;
  }
  html body.home.homeRefinedV587 .whyQualityNote{
    height:auto !important;
    min-height:auto !important;
    padding-top:20px !important;
  }
}

@media (max-width: 680px){
  html body.home.homeRefinedV587 .whyEditorialLead.whyJourneyPanelV584,
  html body.home.homeRefinedV587 .verticalLearningJourneyV584,
  html body.home.homeRefinedV587 .premiumLearningJourneyV586,
  html body.home.homeRefinedV587 .journeyChapterV586{
    min-height:680px !important;
    height:680px !important;
  }
  html body.home.homeRefinedV587 .accessCardV586,
  html body.home.homeRefinedV587 .cockpitCardV586,
  html body.home.homeRefinedV587 .unitCardV586,
  html body.home.homeRefinedV587 .impulseCardV586,
  html body.home.homeRefinedV587 .knowledgeSlipV586,
  html body.home.homeRefinedV587 .returnQuestionV586,
  html body.home.homeRefinedV587 .completionCardV586,
  html body.home.homeRefinedV587 .certificateV586{
    transform:scale(.86) !important;
    transform-origin:center !important;
  }
}

@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV587 .premiumLearningJourneyV586 *,
  html body.home.homeRefinedV587 .journeyRailNodeV586{
    animation:none !important;
    transition:none !important;
  }
}