/* Praxoria Startseite – v581: freigestellte, konkrete Lernreise ohne Hintergrundbox. */

html body.home.homeRefinedV581 .whyStoryPanelV581{
  position:sticky !important;
  top:96px !important;
  align-self:start !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:clamp(500px, 42vw, 620px) !important;
  padding:0 !important;
  margin:0 !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
html body.home.homeRefinedV581 .whyStoryPanelV581::before,
html body.home.homeRefinedV581 .whyStoryPanelV581::after{
  display:none !important;
  content:none !important;
}
html body.home.homeRefinedV581 .learningStoryV581{
  --story-blue:#4aa9cc;
  --story-blue-deep:#2e7896;
  --story-green:#8fb45f;
  --story-green-deep:#668942;
  --story-gold:#d2a54e;
  --story-gold-deep:#9a7432;
  --story-ink:#172134;
  --story-muted:#6f7886;
  --story-line:rgba(23,33,52,.15);
  --story-active:var(--story-blue-deep);
  --air-x:42%;
  --air-y:47%;
  position:relative !important;
  z-index:1 !important;
  width:min(100%, 790px) !important;
  aspect-ratio:760 / 540 !important;
  overflow:visible !important;
  isolation:isolate !important;
  pointer-events:none !important;
}
html body.home.homeRefinedV581 .learningStoryV581.is-transfer{
  --story-active:var(--story-gold-deep);
  --air-x:62%;
  --air-y:56%;
}
html body.home.homeRefinedV581 .learningStoryV581.is-document{
  --story-active:var(--story-green-deep);
  --air-x:54%;
  --air-y:50%;
}
html body.home.homeRefinedV581 .storyAirV581{
  position:absolute !important;
  z-index:0 !important;
  inset:-12% -10% -8% -8% !important;
  background:
    radial-gradient(circle at var(--air-x) var(--air-y), color-mix(in oklab, var(--story-active) 11%, transparent), transparent 30%),
    radial-gradient(circle at 28% 70%, rgba(74,169,204,.055), transparent 34%),
    radial-gradient(circle at 78% 76%, rgba(143,180,95,.07), transparent 38%) !important;
  filter:blur(18px) !important;
  opacity:.78 !important;
  transition:background .75s ease, opacity .75s ease !important;
  animation:storyAirV581 8s ease-in-out infinite !important;
}
html body.home.homeRefinedV581 .storyCanvasV581{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  width:100% !important;
  height:100% !important;
  overflow:visible !important;
}
html body.home.homeRefinedV581 .storyCanvasV581 *{
  vector-effect:non-scaling-stroke;
}
html body.home.homeRefinedV581 .storySceneV581{
  opacity:0 !important;
  transform:translate3d(0,18px,0) scale(.985) !important;
  transform-origin:center !important;
  transition:opacity .65s ease, transform .8s cubic-bezier(.2,.74,.22,1) !important;
}
html body.home.homeRefinedV581 .learningStoryV581.is-learn .storyLearnV581,
html body.home.homeRefinedV581 .learningStoryV581.is-transfer .storyTransferV581,
html body.home.homeRefinedV581 .learningStoryV581.is-document .storyDocumentV581{
  opacity:1 !important;
  transform:translate3d(0,0,0) scale(1) !important;
}

html body.home.homeRefinedV581 .storyGroundV581{
  fill:none !important;
  stroke:rgba(23,33,52,.11) !important;
  stroke-width:2.6 !important;
  stroke-linecap:round !important;
}
html body.home.homeRefinedV581 text{
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-weight:800 !important;
  letter-spacing:.04em !important;
  fill:var(--story-ink) !important;
}
html body.home.homeRefinedV581 .tinyLabelV581{
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.12em !important;
  fill:rgba(23,33,52,.62) !important;
}
html body.home.homeRefinedV581 .skinV581{ fill:#f4c9a2 !important; stroke:#e9b990 !important; stroke-width:1.3 !important; }
html body.home.homeRefinedV581 .hairV581{ fill:#243247 !important; opacity:.96 !important; }
html body.home.homeRefinedV581 .personBodyV581{ fill:#eef6f2 !important; stroke:rgba(102,137,66,.22) !important; stroke-width:1.5 !important; }
html body.home.homeRefinedV581 .personArmV581,
html body.home.homeRefinedV581 .carryArmV581,
html body.home.homeRefinedV581 .backArmV581,
html body.home.homeRefinedV581 .legV581{
  fill:none !important;
  stroke:#f0c19a !important;
  stroke-width:12 !important;
  stroke-linecap:round !important;
}

/* Lernführung: Zugangscode → Lern-Cockpit → Kurseinheit */
html body.home.homeRefinedV581 .accessCardV581{ animation:learnAccessV581 5.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .cardPaperV581,
html body.home.homeRefinedV581 .cockpitPaperV581,
html body.home.homeRefinedV581 .coursePaperV581,
html body.home.homeRefinedV581 .miniScreenV581,
html body.home.homeRefinedV581 .verifyPaperV581,
html body.home.homeRefinedV581 .certPaperV581{
  fill:rgba(255,255,255,.92) !important;
  stroke:rgba(23,33,52,.13) !important;
  stroke-width:1.5 !important;
}
html body.home.homeRefinedV581 .accessCardV581 .cardPaperV581{ stroke:rgba(74,169,204,.25) !important; fill:url(#storyBlueV581) !important; }
html body.home.homeRefinedV581 .inputV581,
html body.home.homeRefinedV581 .verifyInputV581{
  fill:rgba(255,255,255,.96) !important;
  stroke:rgba(23,33,52,.14) !important;
  stroke-width:1.2 !important;
}
html body.home.homeRefinedV581 .codeTextV581,
html body.home.homeRefinedV581 .verifyCodeV581{
  font-size:22px !important;
  letter-spacing:.16em !important;
  fill:#2a3344 !important;
}
html body.home.homeRefinedV581 .cursorV581{
  fill:none !important;
  stroke:var(--story-blue-deep) !important;
  stroke-width:2 !important;
  stroke-linecap:round !important;
  animation:cursorBlinkV581 1.1s steps(2,end) infinite !important;
}
html body.home.homeRefinedV581 .buttonV581,
html body.home.homeRefinedV581 .nextStepButtonV581{
  fill:rgba(74,169,204,.12) !important;
  stroke:rgba(74,169,204,.35) !important;
  stroke-width:1.2 !important;
}
html body.home.homeRefinedV581 .buttonTextV581,
html body.home.homeRefinedV581 .nextStepTextV581{
  font-size:14px !important;
  fill:#2e7896 !important;
  letter-spacing:.03em !important;
}
html body.home.homeRefinedV581 .loginCheckHaloV581{
  fill:rgba(143,180,95,.14) !important;
  stroke:rgba(143,180,95,.36) !important;
  stroke-width:1.4 !important;
  transform-origin:center !important;
  transform-box:fill-box !important;
  animation:checkHaloV581 5.8s ease-in-out infinite !important;
}
html body.home.homeRefinedV581 .loginCheckV581,
html body.home.homeRefinedV581 .validTickV581,
html body.home.homeRefinedV581 .sealClearV581 path{
  fill:none !important;
  stroke:var(--story-green-deep) !important;
  stroke-width:4.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
html body.home.homeRefinedV581 .learnFlowV581,
html body.home.homeRefinedV581 .documentFlowV581{
  fill:none !important;
  stroke:var(--story-blue-deep) !important;
  stroke-width:3 !important;
  stroke-linecap:round !important;
  stroke-dasharray:8 12 !important;
  marker-end:url(#arrowV581) !important;
  color:var(--story-blue-deep) !important;
  opacity:.68 !important;
  animation:flowDashV581 2.4s linear infinite !important;
}
html body.home.homeRefinedV581 .cockpitCardV581{ animation:cockpitOpenV581 5.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .cockpitTitleV581{ font-size:16px !important; letter-spacing:.01em !important; fill:#172134 !important; }
html body.home.homeRefinedV581 .miniTileV581 path{
  fill:rgba(255,255,255,.72) !important;
  stroke:rgba(23,33,52,.12) !important;
  stroke-width:1 !important;
}
html body.home.homeRefinedV581 .miniKeyV581{
  font-size:10px !important;
  letter-spacing:.12em !important;
  fill:rgba(23,33,52,.55) !important;
}
html body.home.homeRefinedV581 .miniValueV581{ font-size:21px !important; letter-spacing:.02em !important; fill:#172134 !important; }
html body.home.homeRefinedV581 .miniValueSmallV581{ font-size:14px !important; letter-spacing:.01em !important; fill:#172134 !important; }
html body.home.homeRefinedV581 .barBackV581{ fill:none !important; stroke:rgba(23,33,52,.14) !important; stroke-width:5 !important; stroke-linecap:round !important; }
html body.home.homeRefinedV581 .barFillV581{ fill:none !important; stroke:var(--story-blue-deep) !important; stroke-width:5 !important; stroke-linecap:round !important; animation:barGrowV581 5.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .nextArrowV581,
html body.home.homeRefinedV581 .unitArrowV581{
  fill:none !important;
  stroke:var(--story-blue-deep) !important;
  stroke-width:3 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
html body.home.homeRefinedV581 .courseUnitV581{ animation:courseArriveV581 5.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .coursePaperV581{ fill:rgba(255,255,255,.9) !important; stroke:rgba(74,169,204,.23) !important; }
html body.home.homeRefinedV581 .courseLineV581{ fill:none !important; stroke:rgba(23,33,52,.22) !important; stroke-width:6 !important; stroke-linecap:round !important; }
html body.home.homeRefinedV581 .unitDotV581{ fill:rgba(74,169,204,.12) !important; stroke:rgba(74,169,204,.35) !important; stroke-width:1.3 !important; }

/* Transfer: Wissen mitnehmen, Praxiserfahrung zurückführen */
html body.home.homeRefinedV581 .miniScreenV581{ fill:url(#storyBlueV581) !important; stroke:rgba(74,169,204,.22) !important; }
html body.home.homeRefinedV581 .miniBaseV581{
  fill:rgba(255,255,255,.82) !important;
  stroke:rgba(23,33,52,.13) !important;
  stroke-width:1.3 !important;
}
html body.home.homeRefinedV581 .screenLinesV581,
html body.home.homeRefinedV581 .knowledgeLineV581,
html body.home.homeRefinedV581 .certLineV581{
  fill:none !important;
  stroke:rgba(23,33,52,.23) !important;
  stroke-width:6 !important;
  stroke-linecap:round !important;
}
html body.home.homeRefinedV581 .impulsePillV581,
html body.home.homeRefinedV581 .validBadgeV581{
  fill:rgba(143,180,95,.15) !important;
  stroke:rgba(143,180,95,.35) !important;
  stroke-width:1.2 !important;
}
html body.home.homeRefinedV581 .pillTextV581,
html body.home.homeRefinedV581 .validTextV581{
  font-size:12px !important;
  letter-spacing:.03em !important;
  fill:var(--story-green-deep) !important;
}
html body.home.homeRefinedV581 .carryPathV581{
  fill:none !important;
  stroke:url(#flowGradientV581) !important;
  stroke-width:4 !important;
  stroke-linecap:round !important;
  stroke-dasharray:9 12 !important;
  opacity:.64 !important;
  marker-end:url(#arrowV581) !important;
  color:var(--story-gold-deep) !important;
  animation:flowDashV581 2.8s linear infinite !important;
}
html body.home.homeRefinedV581 .returnPathV581{
  fill:none !important;
  stroke:rgba(74,169,204,.48) !important;
  stroke-width:3 !important;
  stroke-linecap:round !important;
  stroke-dasharray:5 14 !important;
  opacity:.72 !important;
  marker-end:url(#arrowV581) !important;
  color:var(--story-blue-deep) !important;
  animation:flowDashBackV581 3.4s linear infinite !important;
}
html body.home.homeRefinedV581 .transferPersonV581{ animation:personStepV581 5.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .knowledgeCardV581{ animation:knowledgeCarryV581 5.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .knowledgePaperV581,
html body.home.homeRefinedV581 .returnPaperV581{
  fill:rgba(255,255,255,.93) !important;
  stroke:rgba(210,165,78,.28) !important;
  stroke-width:1.4 !important;
}
html body.home.homeRefinedV581 .kitaPlaceV581{ animation:kitaBreatheV581 6.6s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .kitaRoofV581{
  fill:none !important;
  stroke:var(--story-green) !important;
  stroke-width:13 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
html body.home.homeRefinedV581 .kitaWallV581{ fill:url(#storyGreenV581) !important; stroke:rgba(143,180,95,.28) !important; stroke-width:1.5 !important; }
html body.home.homeRefinedV581 .kitaDoorV581,
html body.home.homeRefinedV581 .kitaWindowV581{ fill:rgba(255,255,255,.78) !important; stroke:rgba(23,33,52,.10) !important; }
html body.home.homeRefinedV581 .kitaPlantV581{ fill:none !important; stroke:var(--story-green) !important; stroke-width:5 !important; stroke-linecap:round !important; }
html body.home.homeRefinedV581 .adultBodySmallV581{ fill:#eef6f2 !important; stroke:rgba(143,180,95,.22) !important; }
html body.home.homeRefinedV581 .childBodySmallV581{ fill:#fff4df !important; stroke:rgba(210,165,78,.22) !important; }
html body.home.homeRefinedV581 .adultReachV581{ fill:none !important; stroke:#f0c19a !important; stroke-width:10 !important; stroke-linecap:round !important; }
html body.home.homeRefinedV581 .practiceSceneV581{ animation:practiceMomentV581 4.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .blockV581{ stroke:rgba(23,33,52,.10) !important; stroke-width:1 !important; transform-box:fill-box !important; transform-origin:center !important; animation:blockLiftV581 3.6s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .blockV581.b1{ fill:color-mix(in oklab, var(--story-blue) 20%, #fff) !important; }
html body.home.homeRefinedV581 .blockV581.b2{ fill:color-mix(in oklab, var(--story-gold) 22%, #fff) !important; animation-delay:.2s !important; }
html body.home.homeRefinedV581 .blockV581.b3{ fill:color-mix(in oklab, var(--story-green) 22%, #fff) !important; animation-delay:.4s !important; }
html body.home.homeRefinedV581 .returnNoteV581{ animation:returnNoteV581 5.8s ease-in-out infinite !important; }

/* Dokumentation: klarer Nachweis + Prüfbarkeit statt unklarer Ornamentik */
html body.home.homeRefinedV581 .certPaperV581{ fill:url(#storyGreenV581) !important; stroke:rgba(143,180,95,.28) !important; }
html body.home.homeRefinedV581 .certTitleV581{ font-size:28px !important; letter-spacing:.01em !important; }
html body.home.homeRefinedV581 .gradeBadgeV581 path{ fill:rgba(210,165,78,.16) !important; stroke:rgba(210,165,78,.35) !important; stroke-width:1.2 !important; }
html body.home.homeRefinedV581 .gradeBadgeV581 text{ font-size:13px !important; letter-spacing:.04em !important; fill:var(--story-gold-deep) !important; }
html body.home.homeRefinedV581 .qrFrameClearV581{ fill:rgba(255,255,255,.82) !important; stroke:rgba(23,33,52,.16) !important; stroke-width:1.2 !important; }
html body.home.homeRefinedV581 .qrBitsClearV581{ fill:rgba(23,33,52,.26) !important; }
html body.home.homeRefinedV581 .qrLabelV581{ font-size:12px !important; letter-spacing:.08em !important; fill:rgba(23,33,52,.58) !important; }
html body.home.homeRefinedV581 .sealClearV581 circle{ fill:rgba(143,180,95,.14) !important; stroke:rgba(143,180,95,.38) !important; stroke-width:2 !important; animation:sealPulseV581 4.8s ease-in-out infinite !important; transform-origin:center !important; transform-box:fill-box !important; }
html body.home.homeRefinedV581 .documentFlowV581{ stroke:var(--story-green-deep) !important; color:var(--story-green-deep) !important; animation:flowDashV581 2.8s linear infinite !important; }
html body.home.homeRefinedV581 .verifyPaperV581{ fill:rgba(255,255,255,.94) !important; stroke:rgba(143,180,95,.25) !important; }
html body.home.homeRefinedV581 .verifyPanelV581{ animation:verifyArriveV581 5.8s ease-in-out infinite !important; }
html body.home.homeRefinedV581 .certificateV581{ animation:certificateSettleV581 5.8s ease-in-out infinite !important; }

html body.home.homeRefinedV581 .whyQualityNote.isStoryActiveV581 .whyQualityMark{
  transform:scale(1.08) !important;
  box-shadow:0 0 0 9px color-mix(in oklab, var(--accent) 11%, transparent) !important;
}

@keyframes storyAirV581{
  0%,100%{ transform:translate3d(0,0,0) scale(1); opacity:.72; }
  50%{ transform:translate3d(0,-8px,0) scale(1.03); opacity:.84; }
}
@keyframes cursorBlinkV581{ 0%,45%{opacity:1;} 46%,100%{opacity:.15;} }
@keyframes checkHaloV581{
  0%,24%{ transform:scale(.78); opacity:.15; }
  36%,100%{ transform:scale(1); opacity:1; }
}
@keyframes learnAccessV581{
  0%,100%{ transform:translate3d(0,0,0); }
  42%,64%{ transform:translate3d(-3px,-4px,0); }
}
@keyframes cockpitOpenV581{
  0%,18%{ opacity:.66; transform:translate3d(-18px,9px,0) scale(.985); }
  38%,100%{ opacity:1; transform:translate3d(0,0,0) scale(1); }
}
@keyframes courseArriveV581{
  0%,44%{ opacity:.25; transform:translate3d(-18px,-8px,0) scale(.97); }
  62%,100%{ opacity:1; transform:translate3d(0,0,0) scale(1); }
}
@keyframes barGrowV581{
  0%,20%{ stroke-dasharray:25 90; }
  55%,100%{ stroke-dasharray:42 90; }
}
@keyframes flowDashV581{ to{ stroke-dashoffset:-42; } }
@keyframes flowDashBackV581{ to{ stroke-dashoffset:46; } }
@keyframes personStepV581{
  0%,100%{ transform:translate3d(-4px,0,0); }
  45%,66%{ transform:translate3d(7px,-6px,0); }
}
@keyframes knowledgeCarryV581{
  0%,18%{ transform:translate3d(-170px,14px,0) scale(.88); opacity:.78; }
  44%,100%{ transform:translate3d(0,0,0) scale(1); opacity:1; }
}
@keyframes returnNoteV581{
  0%,54%{ opacity:.08; transform:translate3d(120px,-24px,0) scale(.92); }
  72%,100%{ opacity:1; transform:translate3d(0,0,0) scale(1); }
}
@keyframes kitaBreatheV581{ 0%,100%{ transform:translate3d(0,0,0); } 50%{ transform:translate3d(0,-5px,0); } }
@keyframes practiceMomentV581{ 0%,100%{ transform:translate3d(0,0,0); } 50%{ transform:translate3d(0,-4px,0); } }
@keyframes blockLiftV581{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
@keyframes sealPulseV581{ 0%,100%{ transform:scale(1); opacity:1; } 50%{ transform:scale(1.08); opacity:.88; } }
@keyframes verifyArriveV581{
  0%,30%{ opacity:.45; transform:translate3d(-20px,10px,0) scale(.975); }
  55%,100%{ opacity:1; transform:translate3d(0,0,0) scale(1); }
}
@keyframes certificateSettleV581{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-4px); } }

@media (max-width: 980px){
  html body.home.homeRefinedV581 .whyStoryPanelV581{
    position:relative !important;
    top:auto !important;
    min-height:clamp(360px, 74vw, 520px) !important;
  }
  html body.home.homeRefinedV581 .learningStoryV581{ width:min(100%, 760px) !important; }
}
@media (max-width: 640px){
  html body.home.homeRefinedV581 .learningStoryV581{ aspect-ratio:760 / 610 !important; transform:scale(.96); }
}
@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV581 .storyAirV581,
  html body.home.homeRefinedV581 .accessCardV581,
  html body.home.homeRefinedV581 .loginCheckHaloV581,
  html body.home.homeRefinedV581 .cockpitCardV581,
  html body.home.homeRefinedV581 .courseUnitV581,
  html body.home.homeRefinedV581 .barFillV581,
  html body.home.homeRefinedV581 .learnFlowV581,
  html body.home.homeRefinedV581 .documentFlowV581,
  html body.home.homeRefinedV581 .carryPathV581,
  html body.home.homeRefinedV581 .returnPathV581,
  html body.home.homeRefinedV581 .transferPersonV581,
  html body.home.homeRefinedV581 .knowledgeCardV581,
  html body.home.homeRefinedV581 .kitaPlaceV581,
  html body.home.homeRefinedV581 .practiceSceneV581,
  html body.home.homeRefinedV581 .blockV581,
  html body.home.homeRefinedV581 .returnNoteV581,
  html body.home.homeRefinedV581 .sealClearV581 circle,
  html body.home.homeRefinedV581 .verifyPanelV581,
  html body.home.homeRefinedV581 .certificateV581,
  html body.home.homeRefinedV581 .cursorV581{
    animation:none !important;
  }
  html body.home.homeRefinedV581 .storySceneV581{ transition:none !important; }
}