/* Praxoria Startseite – v571: konkrete Mini-Erklärszene statt abstrakter Linien.
   Viele Quellen → Person am Arbeitsplatz → Lern-Cockpit → geführte Lernspur. */

html body.home.homeRefinedV571 .whyLearningSceneV571{
  width:min(100%, 455px) !important;
  margin: clamp(16px, 1.9vw, 24px) 0 0 !important;
  opacity:1 !important;
}

html body.home.homeRefinedV571 .learningSceneSvgV571{
  display:block !important;
  width:100% !important;
  height:auto !important;
  overflow:visible !important;
}

html body.home.homeRefinedV571 .learningSceneSvgV571 *{
  vector-effect:non-scaling-stroke;
}

html body.home.homeRefinedV571 .sceneWashV571{
  fill:color-mix(in oklab, white 84%, var(--accent) 4%) !important;
  opacity:.58;
}

html body.home.homeRefinedV571 .sceneSourcesV571{
  fill:url(#sceneDeskV571) !important;
  stroke:color-mix(in oklab, var(--ink) 30%, var(--accent)) !important;
  stroke-width:1.2 !important;
}
html body.home.homeRefinedV571 .sceneSourcesV571 .scenePaper,
html body.home.homeRefinedV571 .sceneSourcesV571 .sceneBook,
html body.home.homeRefinedV571 .sceneSourcesV571 .sceneNote,
html body.home.homeRefinedV571 .sceneSourcesV571 .sceneSticky{
  transform-box:fill-box;
  transform-origin:center;
  filter:drop-shadow(0 12px 18px rgba(20,34,52,.045));
  animation: sourceToOrderV571 7.8s cubic-bezier(.34,.02,.16,1) infinite;
}
html body.home.homeRefinedV571 .paperA{ --x:64px; --y:38px; --r:4deg; animation-delay:.02s; }
html body.home.homeRefinedV571 .paperB{ --x:34px; --y:46px; --r:-4deg; animation-delay:.08s; }
html body.home.homeRefinedV571 .paperC{ --x:70px; --y:-30px; --r:-2deg; animation-delay:.14s; }
html body.home.homeRefinedV571 .paperD{ --x:28px; --y:-24px; --r:3deg; animation-delay:.20s; }
html body.home.homeRefinedV571 .learningSceneSvgV571 .fold,
html body.home.homeRefinedV571 .learningSceneSvgV571 .pin,
html body.home.homeRefinedV571 .learningSceneSvgV571 .spine{
  fill:none !important;
  stroke:color-mix(in oklab, var(--ink) 22%, var(--accent)) !important;
  opacity:.42;
}
html body.home.homeRefinedV571 .learningSceneSvgV571 .line{
  fill:none !important;
  stroke-width:1.45 !important;
  opacity:.65;
}
html body.home.homeRefinedV571 .learningSceneSvgV571 .blue{ stroke:color-mix(in oklab, var(--accent) 68%, var(--ink)) !important; }
html body.home.homeRefinedV571 .learningSceneSvgV571 .gold{ stroke:color-mix(in oklab, var(--accent3) 62%, var(--ink)) !important; }
html body.home.homeRefinedV571 .learningSceneSvgV571 .green{ stroke:color-mix(in oklab, var(--accent2) 62%, var(--ink)) !important; }
html body.home.homeRefinedV571 .learningSceneSvgV571 .blueFill{ fill:color-mix(in oklab, var(--accent) 44%, white) !important; stroke:none !important; }

html body.home.homeRefinedV571 .sceneWalkPersonV571,
html body.home.homeRefinedV571 .sceneSeatedPersonV571,
html body.home.homeRefinedV571 .sceneDeskV571,
html body.home.homeRefinedV571 .sceneLaptopV571{
  fill:none !important;
  stroke:color-mix(in oklab, var(--ink) 45%, var(--accent2)) !important;
  stroke-width:1.55 !important;
}
html body.home.homeRefinedV571 .sceneWalkPersonV571{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center bottom;
  animation: walkToDeskV571 7.8s cubic-bezier(.34,.02,.16,1) infinite;
}
html body.home.homeRefinedV571 .sceneWalkPersonV571 .head,
html body.home.homeRefinedV571 .sceneSeatedPersonV571 .head{
  fill:color-mix(in oklab, white 74%, var(--accent3) 11%) !important;
  stroke:color-mix(in oklab, var(--ink) 38%, var(--accent3)) !important;
}
html body.home.homeRefinedV571 .sceneWalkPersonV571 .hair,
html body.home.homeRefinedV571 .sceneSeatedPersonV571 .hair{
  stroke:color-mix(in oklab, var(--ink) 50%, var(--accent3)) !important;
  opacity:.60;
}
html body.home.homeRefinedV571 .sceneSeatedPersonV571{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center bottom;
  animation: seatedPersonInV571 7.8s cubic-bezier(.34,.02,.16,1) infinite;
}
html body.home.homeRefinedV571 .sceneSeatedPersonV571 .arm.a{
  transform-box:fill-box;
  transform-origin:left center;
  animation: handToLaptopV571 7.8s ease-in-out infinite;
}
html body.home.homeRefinedV571 .sceneDeskV571{
  opacity:0;
  stroke:color-mix(in oklab, var(--ink) 28%, var(--accent2)) !important;
  animation: deskCalmV571 7.8s ease-in-out infinite;
}
html body.home.homeRefinedV571 .sceneChairV571{ opacity:.62; }

html body.home.homeRefinedV571 .sceneLaptopV571{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center bottom;
  animation: laptopOpensV571 7.8s cubic-bezier(.34,.02,.16,1) infinite;
}
html body.home.homeRefinedV571 .sceneLaptopV571 .screenOuter,
html body.home.homeRefinedV571 .sceneLaptopV571 .base{
  fill:color-mix(in oklab, white 82%, var(--accent2) 6%) !important;
  stroke:color-mix(in oklab, var(--ink) 22%, var(--accent2)) !important;
}
html body.home.homeRefinedV571 .sceneLaptopV571 .screenInner{
  fill:url(#sceneScreenV571) !important;
  stroke:color-mix(in oklab, var(--accent2) 24%, var(--ink)) !important;
}
html body.home.homeRefinedV571 .sceneLaptopV571 .keyboard{
  stroke:color-mix(in oklab, var(--ink) 20%, var(--accent2)) !important;
  opacity:.55;
}

html body.home.homeRefinedV571 .sceneGatherV571 .gatherPath{
  stroke-width:2.2 !important;
  stroke-dasharray:1 !important;
  stroke-dashoffset:1;
  opacity:0;
  animation:gatherVisibleV571 7.8s cubic-bezier(.28,.02,.16,1) infinite;
}
html body.home.homeRefinedV571 .sceneGatherV571 .gp2{ animation-delay:.08s; }
html body.home.homeRefinedV571 .sceneGatherV571 .gp3{ animation-delay:.16s; }

html body.home.homeRefinedV571 .sceneScreenUiV571{
  stroke-width:1.8 !important;
}
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiRail,
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiTitle,
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiRow,
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiCard,
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiProgress{
  stroke-dasharray:1 !important;
  stroke-dashoffset:1;
  opacity:0;
  animation: uiDrawV571 7.8s cubic-bezier(.28,.02,.16,1) infinite;
}
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiRail{ stroke:color-mix(in oklab, var(--accent) 66%, var(--ink)) !important; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiTitle{ stroke:color-mix(in oklab, var(--ink) 40%, var(--accent2)) !important; animation-delay:.05s; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiRow{ stroke:color-mix(in oklab, var(--ink) 31%, var(--accent2)) !important; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .r1{ animation-delay:.10s; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .r2{ animation-delay:.16s; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiCard{ stroke:color-mix(in oklab, var(--accent3) 46%, var(--ink)) !important; animation-delay:.22s; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiProgress{ stroke:color-mix(in oklab, var(--accent2) 72%, var(--ink)) !important; stroke-width:2.6 !important; animation-delay:.28s; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .uiDot{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  fill:color-mix(in oklab, var(--accent2) 55%, white) !important;
  stroke:color-mix(in oklab, var(--accent2) 48%, var(--ink)) !important;
  stroke-width:1.05 !important;
  animation: uiDotInV571 7.8s ease-in-out infinite;
}
html body.home.homeRefinedV571 .sceneScreenUiV571 .d1{ fill:color-mix(in oklab, var(--accent) 48%, white) !important; animation-delay:.05s; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .d2{ fill:color-mix(in oklab, var(--accent3) 48%, white) !important; animation-delay:.12s; }
html body.home.homeRefinedV571 .sceneScreenUiV571 .d3{ animation-delay:.20s; }

html body.home.homeRefinedV571 .sceneOutcomeV571 .guidedPath{
  stroke-width:2.15 !important;
  stroke-dasharray:1 !important;
  stroke-dashoffset:1;
  opacity:0;
  animation: outcomePathV571 7.8s cubic-bezier(.28,.02,.16,1) infinite;
}
html body.home.homeRefinedV571 .sceneOutcomeV571 .outDot{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  animation: outcomeDotV571 7.8s ease-in-out infinite;
}
html body.home.homeRefinedV571 .sceneOutcomeV571 .o1{ fill:color-mix(in oklab, var(--accent) 54%, white) !important; stroke:color-mix(in oklab, var(--accent) 48%, var(--ink)) !important; }
html body.home.homeRefinedV571 .sceneOutcomeV571 .o2{ fill:color-mix(in oklab, var(--accent3) 48%, white) !important; stroke:color-mix(in oklab, var(--accent3) 50%, var(--ink)) !important; animation-delay:.08s; }
html body.home.homeRefinedV571 .sceneOutcomeV571 .o3{ fill:color-mix(in oklab, var(--accent2) 58%, white) !important; stroke:color-mix(in oklab, var(--accent2) 50%, var(--ink)) !important; animation-delay:.16s; }

@keyframes sourceToOrderV571{
  0%,13%{ opacity:.88; transform:translate(0,0) rotate(0deg) scale(1); }
  31%,44%{ opacity:.70; transform:translate(var(--x), var(--y)) rotate(var(--r)) scale(.74); }
  55%,78%{ opacity:.22; transform:translate(var(--x), var(--y)) rotate(var(--r)) scale(.70); }
  100%{ opacity:.88; transform:translate(0,0) rotate(0deg) scale(1); }
}
@keyframes walkToDeskV571{
  0%,8%{ opacity:0; transform:translateX(-20px) translateY(6px); }
  14%,31%{ opacity:.78; transform:translateX(38px) translateY(0); }
  40%,100%{ opacity:0; transform:translateX(80px) translateY(2px); }
}
@keyframes deskCalmV571{
  0%,22%{ opacity:0; }
  34%,100%{ opacity:.32; }
}
@keyframes seatedPersonInV571{
  0%,34%{ opacity:0; transform:translateY(7px); }
  45%,82%{ opacity:.86; transform:translateY(0); }
  100%{ opacity:.62; transform:translateY(0); }
}
@keyframes handToLaptopV571{
  0%,47%{ transform:translate(-5px,2px) rotate(-4deg); }
  60%,100%{ transform:translate(0,0) rotate(0deg); }
}
@keyframes laptopOpensV571{
  0%,36%{ opacity:0; transform:translateY(7px) scaleY(.92); }
  48%,82%{ opacity:.94; transform:translateY(0) scaleY(1); }
  100%{ opacity:.66; transform:translateY(0) scaleY(1); }
}
@keyframes gatherVisibleV571{
  0%,17%{ stroke-dashoffset:1; opacity:0; }
  28%{ opacity:.64; }
  45%,58%{ stroke-dashoffset:0; opacity:.42; }
  78%,100%{ stroke-dashoffset:0; opacity:.10; }
}
@keyframes uiDrawV571{
  0%,50%{ stroke-dashoffset:1; opacity:0; }
  63%,82%{ stroke-dashoffset:0; opacity:.70; }
  100%{ stroke-dashoffset:0; opacity:.42; }
}
@keyframes uiDotInV571{
  0%,55%{ opacity:0; transform:scale(.72); }
  67%,84%{ opacity:.78; transform:scale(1); }
  100%{ opacity:.44; transform:scale(.92); }
}
@keyframes outcomePathV571{
  0%,60%{ stroke-dashoffset:1; opacity:0; }
  76%,88%{ stroke-dashoffset:0; opacity:.52; }
  100%{ stroke-dashoffset:0; opacity:.20; }
}
@keyframes outcomeDotV571{
  0%,70%{ opacity:0; transform:scale(.7); }
  81%,90%{ opacity:.82; transform:scale(1.05); }
  100%{ opacity:.42; transform:scale(.92); }
}

@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV571 .learningSceneSvgV571 *{
    animation:none !important;
    transition:none !important;
  }
  html body.home.homeRefinedV571 .sceneSourcesV571 .scenePaper,
  html body.home.homeRefinedV571 .sceneSourcesV571 .sceneBook,
  html body.home.homeRefinedV571 .sceneSourcesV571 .sceneNote,
  html body.home.homeRefinedV571 .sceneSourcesV571 .sceneSticky,
  html body.home.homeRefinedV571 .sceneDeskV571,
  html body.home.homeRefinedV571 .sceneSeatedPersonV571,
  html body.home.homeRefinedV571 .sceneLaptopV571,
  html body.home.homeRefinedV571 .sceneScreenUiV571 .uiRail,
  html body.home.homeRefinedV571 .sceneScreenUiV571 .uiTitle,
  html body.home.homeRefinedV571 .sceneScreenUiV571 .uiRow,
  html body.home.homeRefinedV571 .sceneScreenUiV571 .uiCard,
  html body.home.homeRefinedV571 .sceneScreenUiV571 .uiProgress,
  html body.home.homeRefinedV571 .sceneScreenUiV571 .uiDot,
  html body.home.homeRefinedV571 .sceneOutcomeV571 .guidedPath,
  html body.home.homeRefinedV571 .sceneOutcomeV571 .outDot{
    opacity:.72 !important;
    stroke-dashoffset:0 !important;
  }
  html body.home.homeRefinedV571 .sceneWalkPersonV571,
  html body.home.homeRefinedV571 .sceneGatherV571{ opacity:0 !important; }
}
