/* Praxoria Startseite – v577: Animation als ruhige Premium-Fläche ohne duplizierenden Caption-Text. */

html body.home.homeRefinedV577 .whyStoryPanelV576{
  min-height:clamp(334px, 31vw, 420px) !important;
  padding:clamp(16px, 2vw, 22px) !important;
  background:
    radial-gradient(500px 300px at 8% 8%, color-mix(in oklab, var(--accent) 5.5%, transparent), transparent 74%),
    radial-gradient(500px 300px at 92% 92%, color-mix(in oklab, var(--accent2) 4.5%, transparent), transparent 76%),
    linear-gradient(145deg, rgba(255,255,255,.88), rgba(255,255,255,.56)) !important;
}

html body.home.homeRefinedV577 .whyStoryVisualV576{
  max-width:590px !important;
}

html body.home.homeRefinedV577 .storyGlowV576{
  inset:18px 18px 16px !important;
  border-radius:32px !important;
  filter:blur(22px) !important;
  opacity:.42 !important;
}

html body.home.homeRefinedV577 .storyFrameV576{
  min-height:clamp(292px, 24.5vw, 350px) !important;
  border-radius:30px !important;
  border-color:rgba(25,40,60,.078) !important;
  background:
    radial-gradient(330px 180px at 16% 18%, color-mix(in oklab, var(--storyActive) 6%, transparent), transparent 74%),
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.64)) !important;
  box-shadow:0 22px 52px rgba(18,32,48,.055), inset 0 1px 0 rgba(255,255,255,.92) !important;
}
html body.home.homeRefinedV577 .storyFrameV576::after{ display:none !important; }

html body.home.homeRefinedV577 .storyHeaderV576{
  height:40px !important;
  padding:0 16px !important;
  border-bottom-color:rgba(25,40,60,.052) !important;
  background:linear-gradient(90deg, color-mix(in oklab, var(--storyActive) 4.8%, white), rgba(255,255,255,.68)) !important;
  font-size:8.4px !important;
  letter-spacing:.13em !important;
}
html body.home.homeRefinedV577 .storyHeaderV576 em{
  opacity:.74 !important;
}
html body.home.homeRefinedV577 .storyStatusV576 i{
  width:6px !important;
  height:6px !important;
  opacity:.56 !important;
}

html body.home.homeRefinedV577 .storyCanvasV576{
  left:clamp(18px, 2.4vw, 30px) !important;
  right:clamp(18px, 2.4vw, 30px) !important;
  top:58px !important;
  height:clamp(178px, 16vw, 218px) !important;
  border-radius:26px !important;
  background:
    radial-gradient(circle at 17% 28%, color-mix(in oklab, var(--storyBlueLine) 5.4%, transparent), transparent 42%),
    radial-gradient(circle at 82% 36%, color-mix(in oklab, var(--storyGreenLine) 4.8%, transparent), transparent 45%),
    linear-gradient(135deg, rgba(255,255,255,.46), rgba(255,255,255,.22)) !important;
}
html body.home.homeRefinedV577 .storyCanvasV576::before{
  inset:12px !important;
  border-color:rgba(25,40,60,.043) !important;
}

html body.home.homeRefinedV577 .storyCaptionV576{
  display:none !important;
}

html body.home.homeRefinedV577 .storyStepsV576{
  left:50% !important;
  bottom:24px !important;
  transform:translateX(-50%) !important;
  gap:9px !important;
}
html body.home.homeRefinedV577 .storyStepsV576 span{
  width:22px !important;
  height:2.5px !important;
  background:rgba(25,40,60,.12) !important;
}
html body.home.homeRefinedV577 .whyStoryVisualV576.is-learn .storyStepsV576 .s1,
html body.home.homeRefinedV577 .whyStoryVisualV576.is-transfer .storyStepsV576 .s2,
html body.home.homeRefinedV577 .whyStoryVisualV576.is-document .storyStepsV576 .s3{
  width:42px !important;
  background:var(--storyActive) !important;
  opacity:.58 !important;
}

html body.home.homeRefinedV577 .learnCardV576,
html body.home.homeRefinedV577 .transferSourceV576,
html body.home.homeRefinedV577 .transferReflectV576,
html body.home.homeRefinedV577 .transferPracticeV576,
html body.home.homeRefinedV577 .certificateV576,
html body.home.homeRefinedV577 .proofCardV576{
  border-color:rgba(25,40,60,.072) !important;
  box-shadow:0 13px 28px rgba(20,34,52,.035), inset 0 1px 0 rgba(255,255,255,.82) !important;
}

html body.home.homeRefinedV577 .learnCardV576{
  top:45px !important;
  height:86px !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.69) !important;
}
html body.home.homeRefinedV577 .cardTaskV576{ left:7.2% !important; }
html body.home.homeRefinedV577 .cardNextV576{ right:7.2% !important; }
html body.home.homeRefinedV577 .learnCardV576 span,
html body.home.homeRefinedV577 .transferSourceV576 span,
html body.home.homeRefinedV577 .transferReflectV576 span,
html body.home.homeRefinedV577 .transferPracticeV576 strong,
html body.home.homeRefinedV577 .certificateV576 span,
html body.home.homeRefinedV577 .proofCardV576 span{
  color:rgba(25,40,60,.54) !important;
}

html body.home.homeRefinedV577 .docIconV576,
html body.home.homeRefinedV577 .nextPillV576{
  height:31px !important;
  bottom:15px !important;
  background:rgba(255,255,255,.62) !important;
  border-color:rgba(25,40,60,.058) !important;
}
html body.home.homeRefinedV577 .ringV576{
  top:34px !important;
  width:48px !important;
  height:48px !important;
  margin-left:-24px !important;
  box-shadow:0 10px 18px rgba(20,34,52,.032) !important;
}
html body.home.homeRefinedV577 .flowBaseV576,
html body.home.homeRefinedV577 .bridgeBaseV576,
html body.home.homeRefinedV577 .docBaseV576{
  stroke:rgba(25,40,60,.066) !important;
  stroke-width:2.2 !important;
}
html body.home.homeRefinedV577 .flowActiveV576,
html body.home.homeRefinedV577 .bridgeActiveV576,
html body.home.homeRefinedV577 .docActiveV576{
  stroke-width:2.4 !important;
  opacity:.58 !important;
}

html body.home.homeRefinedV577 .transferSourceV576{
  left:9% !important;
  top:38px !important;
  width:32% !important;
  height:72px !important;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyGoldLine) 6%, white), rgba(255,255,255,.70)) !important;
}
html body.home.homeRefinedV577 .transferReflectV576{
  left:20% !important;
  bottom:31px !important;
  width:27% !important;
  height:54px !important;
  background:rgba(255,255,255,.65) !important;
}
html body.home.homeRefinedV577 .transferPracticeV576{
  right:9% !important;
  top:48px !important;
  width:29% !important;
  height:96px !important;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyGreenLine) 7%, white), rgba(255,255,255,.72)) !important;
}
html body.home.homeRefinedV577 .transferPracticeV576 span{
  color:rgba(25,40,60,.50) !important;
}
html body.home.homeRefinedV577 .personV576{
  background:color-mix(in oklab, var(--storyGreenLine) 12%, white) !important;
  border-color:color-mix(in oklab, var(--storyGreenLine) 20%, transparent) !important;
}

html body.home.homeRefinedV577 .certificateV576{
  left:13% !important;
  top:30px !important;
  height:118px !important;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyGreenLine) 5.5%, white), rgba(255,255,255,.74)) !important;
}
html body.home.homeRefinedV577 .proofCardV576{
  right:11% !important;
  top:58px !important;
  height:80px !important;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyBlueLine) 5%, white), rgba(255,255,255,.70)) !important;
}
html body.home.homeRefinedV577 .certificateV576 strong,
html body.home.homeRefinedV577 .proofCardV576 strong{
  color:rgba(25,40,60,.65) !important;
}
html body.home.homeRefinedV577 .sealV576{
  opacity:.62 !important;
}

html body.home.homeRefinedV577 .whyQualityNote:not(.isStoryActiveV576){
  opacity:.82 !important;
}
html body.home.homeRefinedV577 .whyQualityNote.isStoryActiveV576 .whyQualityBody h3{
  color:var(--ink) !important;
}

@media (max-width:1120px){
  html body.home.homeRefinedV577 .whyStoryPanelV576{
    min-height:0 !important;
    max-width:820px !important;
  }
  html body.home.homeRefinedV577 .storyFrameV576{
    min-height:clamp(288px, 42vw, 340px) !important;
  }
  html body.home.homeRefinedV577 .storyCanvasV576{
    height:clamp(176px, 27vw, 214px) !important;
  }
}

@media (max-width:720px){
  html body.home.homeRefinedV577 .storyFrameV576{
    min-height:318px !important;
    border-radius:24px !important;
  }
  html body.home.homeRefinedV577 .storyCanvasV576{
    left:12px !important;
    right:12px !important;
    top:54px !important;
    height:194px !important;
    border-radius:20px !important;
  }
  html body.home.homeRefinedV577 .storyStepsV576{
    bottom:20px !important;
  }
  html body.home.homeRefinedV577 .learnCardV576{
    top:46px !important;
    height:78px !important;
  }
  html body.home.homeRefinedV577 .transferPracticeV576{
    height:90px !important;
  }
  html body.home.homeRefinedV577 .certificateV576{
    height:112px !important;
  }
  html body.home.homeRefinedV577 .proofCardV576{
    height:76px !important;
  }
}

@media (max-width:430px){
  html body.home.homeRefinedV577 .storyFrameV576{
    min-height:314px !important;
  }
  html body.home.homeRefinedV577 .storyCanvasV576{
    height:184px !important;
  }
}

@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV577 .storyGlowV576,
  html body.home.homeRefinedV577 .storySceneV576,
  html body.home.homeRefinedV577 .storyStepsV576 span,
  html body.home.homeRefinedV577 .storyFrameV576{
    transition:none !important;
    animation:none !important;
  }
}