/* Praxoria Startseite – v576: scrollgeführte, leichte Erklärvideo-Bühne für Lernführung, Transfer und Dokumentation. */

html body.home.homeRefinedV576 .whyStoryPanelV576{
  position:sticky !important;
  top:96px !important;
  align-self:start !important;
  display:flex !important;
  align-items:stretch !important;
  justify-content:center !important;
  min-height:clamp(398px, 36vw, 488px) !important;
  padding:clamp(16px, 2.2vw, 24px) !important;
  overflow:hidden !important;
  background:
    radial-gradient(520px 320px at 10% 8%, color-mix(in oklab, var(--accent) 7%, transparent), transparent 72%),
    radial-gradient(520px 320px at 92% 92%, color-mix(in oklab, var(--accent2) 6%, transparent), transparent 74%),
    linear-gradient(142deg, rgba(255,255,255,.91), rgba(255,255,255,.64)) !important;
}
html body.home.homeRefinedV576 .whyStoryPanelV576::before{ display:none !important; }

html body.home.homeRefinedV576 .whyStoryVisualV576{
  --storyBlue: color-mix(in oklab, var(--accent) 72%, white);
  --storyBlueLine: color-mix(in oklab, var(--accent) 70%, var(--ink));
  --storyGold: color-mix(in oklab, var(--accent3) 74%, white);
  --storyGoldLine: color-mix(in oklab, var(--accent3) 70%, var(--ink));
  --storyGreen: color-mix(in oklab, var(--accent2) 76%, white);
  --storyGreenLine: color-mix(in oklab, var(--accent2) 68%, var(--ink));
  --storyInk: color-mix(in oklab, var(--ink) 88%, var(--muted));
  --storySoftInk: color-mix(in oklab, var(--ink) 65%, var(--muted));
  --storyActive: var(--storyBlueLine);
  position:relative !important;
  width:100% !important;
  max-width:560px !important;
  margin:0 !important;
  opacity:1 !important;
  pointer-events:none !important;
}
html body.home.homeRefinedV576 .whyStoryVisualV576.is-transfer{ --storyActive: var(--storyGoldLine); }
html body.home.homeRefinedV576 .whyStoryVisualV576.is-document{ --storyActive: var(--storyGreenLine); }

html body.home.homeRefinedV576 .storyGlowV576{
  position:absolute;
  inset:10px 8px 6px;
  border-radius:34px;
  background:radial-gradient(circle at 50% 18%, color-mix(in oklab, var(--storyActive) 13%, transparent), transparent 62%);
  filter:blur(18px);
  opacity:.62;
  transition:background .55s ease, opacity .55s ease;
}

html body.home.homeRefinedV576 .storyFrameV576{
  position:relative;
  min-height:clamp(362px, 31vw, 432px);
  border-radius:30px;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(25,40,60,.105);
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.74)),
    radial-gradient(380px 190px at 12% 12%, color-mix(in oklab, var(--storyActive) 9%, transparent), transparent 72%);
  box-shadow:0 24px 50px rgba(18,32,48,.07), inset 0 1px 0 rgba(255,255,255,.94);
  transition:background .55s ease, border-color .55s ease, box-shadow .55s ease;
}
html body.home.homeRefinedV576 .storyFrameV576::after{
  content:"";
  position:absolute;
  left:clamp(20px, 3vw, 32px);
  right:clamp(20px, 3vw, 32px);
  bottom:58px;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, color-mix(in oklab, var(--storyActive) 18%, transparent), transparent);
  opacity:.7;
  z-index:0;
}

html body.home.homeRefinedV576 .storyHeaderV576{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:44px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 17px;
  z-index:6;
  border-bottom:1px solid rgba(25,40,60,.07);
  background:linear-gradient(90deg, color-mix(in oklab, var(--storyActive) 6%, white), rgba(255,255,255,.76));
  color:rgba(25,40,60,.66);
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
html body.home.homeRefinedV576 .storyHeaderV576 strong{ font-weight:900; }
html body.home.homeRefinedV576 .storyHeaderV576 em{
  margin-left:auto;
  font-style:normal;
  letter-spacing:.07em;
  color:rgba(25,40,60,.45);
}
html body.home.homeRefinedV576 .storyStatusV576{
  display:inline-flex;
  gap:5px;
  align-items:center;
  margin-right:3px;
}
html body.home.homeRefinedV576 .storyStatusV576 i{
  display:block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:color-mix(in oklab, var(--storyActive) 68%, white);
  opacity:.74;
  transition:background .45s ease, transform .45s ease;
}
html body.home.homeRefinedV576 .storyStatusV576 i:nth-child(2){ opacity:.52; }
html body.home.homeRefinedV576 .storyStatusV576 i:nth-child(3){ opacity:.36; }

html body.home.homeRefinedV576 .storyCanvasV576{
  position:absolute;
  left:clamp(16px, 2.2vw, 24px);
  right:clamp(16px, 2.2vw, 24px);
  top:60px;
  height:clamp(176px, 16vw, 218px);
  border-radius:24px;
  overflow:hidden;
  background:
    radial-gradient(circle at 20% 25%, color-mix(in oklab, var(--storyBlueLine) 7%, transparent), transparent 38%),
    radial-gradient(circle at 80% 32%, color-mix(in oklab, var(--storyGreenLine) 6%, transparent), transparent 42%),
    linear-gradient(135deg, rgba(255,255,255,.62), rgba(255,255,255,.34));
}
html body.home.homeRefinedV576 .storyCanvasV576::before{
  content:"";
  position:absolute;
  inset:14px;
  border-radius:20px;
  border:1px solid rgba(25,40,60,.055);
  z-index:0;
}

html body.home.homeRefinedV576 .storySceneV576{
  position:absolute;
  inset:0;
  z-index:1;
  opacity:0;
  transform:translateY(10px) scale(.985);
  transition:opacity .46s ease, transform .52s cubic-bezier(.2,.8,.25,1);
}
html body.home.homeRefinedV576 .whyStoryVisualV576.is-learn .sceneLearnV576,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-transfer .sceneTransferV576,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-document .sceneDocumentV576{
  opacity:1;
  transform:translateY(0) scale(1);
}

/* Szene 1: Lernführung */
html body.home.homeRefinedV576 .learnCardV576{
  position:absolute;
  top:38px;
  width:29%;
  height:94px;
  border-radius:18px;
  border:1px solid rgba(25,40,60,.09);
  background:rgba(255,255,255,.78);
  box-shadow:0 15px 28px rgba(20,34,52,.045), inset 0 1px 0 rgba(255,255,255,.86);
  z-index:3;
}
html body.home.homeRefinedV576 .learnCardV576 span{
  position:absolute;
  left:13px;
  top:12px;
  font-size:8.5px;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:900;
  color:rgba(25,40,60,.62);
  white-space:nowrap;
}
html body.home.homeRefinedV576 .cardTaskV576{ left:8%; background:linear-gradient(145deg, color-mix(in oklab, var(--storyBlueLine) 8%, white), rgba(255,255,255,.80)); }
html body.home.homeRefinedV576 .cardStandV576{ left:50%; transform:translateX(-50%); background:linear-gradient(145deg, color-mix(in oklab, var(--storyGoldLine) 9%, white), rgba(255,255,255,.82)); }
html body.home.homeRefinedV576 .cardNextV576{ right:8%; background:linear-gradient(145deg, color-mix(in oklab, var(--storyGreenLine) 9%, white), rgba(255,255,255,.82)); }

html body.home.homeRefinedV576 .docIconV576,
html body.home.homeRefinedV576 .nextPillV576{
  position:absolute;
  left:14px;
  right:14px;
  bottom:16px;
  height:34px;
  border-radius:12px;
  border:1px solid rgba(25,40,60,.08);
  background:rgba(255,255,255,.76);
}
html body.home.homeRefinedV576 .docIconV576 b{
  position:absolute;
  left:12px;
  height:3px;
  border-radius:999px;
  background:rgba(25,40,60,.18);
}
html body.home.homeRefinedV576 .docIconV576 b:first-child{ top:11px; width:44%; background:var(--storyBlueLine); opacity:.64; }
html body.home.homeRefinedV576 .docIconV576 b:last-child{ top:21px; width:62%; }
html body.home.homeRefinedV576 .ringV576{
  position:absolute;
  left:50%;
  top:36px;
  width:52px;
  height:52px;
  margin-left:-26px;
  border-radius:50%;
  background:conic-gradient(var(--storyGoldLine) 0 252deg, rgba(25,40,60,.08) 252deg 360deg);
  box-shadow:0 12px 20px rgba(20,34,52,.04);
}
html body.home.homeRefinedV576 .ringV576::before{
  content:"";
  position:absolute;
  inset:7px;
  border-radius:50%;
  background:rgba(255,255,255,.88);
}
html body.home.homeRefinedV576 .ringV576 b{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-style:normal;
  font-weight:900;
  color:rgba(25,40,60,.68);
}
html body.home.homeRefinedV576 .nextPillV576::before,
html body.home.homeRefinedV576 .nextPillV576 b{
  content:"";
  position:absolute;
  left:12px;
  right:28px;
  top:50%;
  height:3px;
  margin-top:-1.5px;
  border-radius:999px;
  background:var(--storyGreenLine);
  opacity:.62;
}
html body.home.homeRefinedV576 .nextPillV576::after{
  content:"";
  position:absolute;
  right:13px;
  top:50%;
  width:10px;
  height:10px;
  border-top:2px solid var(--storyGreenLine);
  border-right:2px solid var(--storyGreenLine);
  transform:translateY(-50%) rotate(45deg);
  opacity:.62;
}
html body.home.homeRefinedV576 .learnFlowV576,
html body.home.homeRefinedV576 .transferBridgeV576,
html body.home.homeRefinedV576 .documentLinkV576{
  position:absolute;
  inset:24px 20px 12px;
  z-index:2;
  overflow:visible;
}
html body.home.homeRefinedV576 .flowBaseV576,
html body.home.homeRefinedV576 .bridgeBaseV576,
html body.home.homeRefinedV576 .docBaseV576{
  fill:none;
  stroke:rgba(25,40,60,.09);
  stroke-width:2.5;
  stroke-linecap:round;
}
html body.home.homeRefinedV576 .flowActiveV576,
html body.home.homeRefinedV576 .bridgeActiveV576,
html body.home.homeRefinedV576 .docActiveV576{
  fill:none;
  stroke:var(--storyActive);
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:1;
  stroke-dashoffset:1;
  opacity:.76;
}
html body.home.homeRefinedV576 .whyStoryVisualV576.is-learn .flowActiveV576,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-transfer .bridgeActiveV576,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-document .docActiveV576{
  animation:storyDrawV576 2.9s ease-in-out infinite;
}

/* Szene 2: Transfer */
html body.home.homeRefinedV576 .transferSourceV576,
html body.home.homeRefinedV576 .transferReflectV576,
html body.home.homeRefinedV576 .transferPracticeV576{
  position:absolute;
  z-index:3;
  border:1px solid rgba(25,40,60,.09);
  background:rgba(255,255,255,.78);
  box-shadow:0 15px 28px rgba(20,34,52,.045), inset 0 1px 0 rgba(255,255,255,.86);
}
html body.home.homeRefinedV576 .transferSourceV576{
  left:9%;
  top:34px;
  width:34%;
  height:76px;
  border-radius:17px;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyGoldLine) 8%, white), rgba(255,255,255,.82));
}
html body.home.homeRefinedV576 .transferReflectV576{
  left:20%;
  bottom:30px;
  width:28%;
  height:58px;
  border-radius:16px;
}
html body.home.homeRefinedV576 .transferPracticeV576{
  right:9%;
  top:47px;
  width:30%;
  height:102px;
  border-radius:24px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:4px;
  padding:14px;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyGreenLine) 10%, white), rgba(255,255,255,.84));
}
html body.home.homeRefinedV576 .transferSourceV576 span,
html body.home.homeRefinedV576 .transferReflectV576 span,
html body.home.homeRefinedV576 .transferPracticeV576 strong{
  display:block;
  font-size:9px;
  line-height:1.05;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:900;
  color:rgba(25,40,60,.62);
}
html body.home.homeRefinedV576 .transferSourceV576 span,
html body.home.homeRefinedV576 .transferReflectV576 span{ position:absolute; left:13px; top:12px; }
html body.home.homeRefinedV576 .transferSourceV576 b,
html body.home.homeRefinedV576 .transferReflectV576 i{
  position:absolute;
  left:13px;
  height:3px;
  border-radius:999px;
  background:rgba(25,40,60,.18);
}
html body.home.homeRefinedV576 .transferSourceV576 b:nth-of-type(1){ top:34px; width:64%; background:var(--storyGoldLine); opacity:.58; }
html body.home.homeRefinedV576 .transferSourceV576 b:nth-of-type(2){ top:46px; width:74%; }
html body.home.homeRefinedV576 .transferSourceV576 b:nth-of-type(3){ top:58px; width:48%; }
html body.home.homeRefinedV576 .transferReflectV576 i:nth-of-type(1){ top:33px; width:58%; background:var(--storyBlueLine); opacity:.48; }
html body.home.homeRefinedV576 .transferReflectV576 i:nth-of-type(2){ top:44px; width:40%; }
html body.home.homeRefinedV576 .transferPracticeV576 span{
  display:block;
  font-size:12px;
  line-height:1.25;
  color:var(--storySoftInk);
}
html body.home.homeRefinedV576 .personV576{
  position:absolute;
  left:16px;
  top:16px;
  width:34px;
  height:34px;
  border-radius:50% 50% 48% 48%;
  background:color-mix(in oklab, var(--storyGreenLine) 18%, white);
  border:1px solid color-mix(in oklab, var(--storyGreenLine) 28%, transparent);
}
html body.home.homeRefinedV576 .personV576::before{
  content:"";
  position:absolute;
  left:11px;
  top:8px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:color-mix(in oklab, var(--storyGreenLine) 62%, var(--ink));
  opacity:.54;
}
html body.home.homeRefinedV576 .personV576::after{
  content:"";
  position:absolute;
  left:8px;
  bottom:8px;
  width:16px;
  height:8px;
  border-radius:999px 999px 6px 6px;
  background:color-mix(in oklab, var(--storyGreenLine) 62%, var(--ink));
  opacity:.36;
}

/* Szene 3: Dokumentation */
html body.home.homeRefinedV576 .certificateV576,
html body.home.homeRefinedV576 .proofCardV576{
  position:absolute;
  z-index:3;
  border:1px solid rgba(25,40,60,.09);
  background:rgba(255,255,255,.82);
  box-shadow:0 15px 30px rgba(20,34,52,.046), inset 0 1px 0 rgba(255,255,255,.88);
}
html body.home.homeRefinedV576 .certificateV576{
  left:13%;
  top:26px;
  width:35%;
  height:128px;
  border-radius:18px;
  padding:16px;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyGreenLine) 7%, white), rgba(255,255,255,.86));
}
html body.home.homeRefinedV576 .proofCardV576{
  right:11%;
  top:56px;
  width:34%;
  height:86px;
  border-radius:20px;
  padding:15px;
  background:linear-gradient(145deg, color-mix(in oklab, var(--storyBlueLine) 6%, white), rgba(255,255,255,.84));
}
html body.home.homeRefinedV576 .certificateV576 span,
html body.home.homeRefinedV576 .proofCardV576 span{
  display:block;
  font-size:8.5px;
  letter-spacing:.13em;
  text-transform:uppercase;
  font-weight:900;
  color:rgba(25,40,60,.58);
}
html body.home.homeRefinedV576 .certificateV576 strong,
html body.home.homeRefinedV576 .proofCardV576 strong{
  display:block;
  margin-top:8px;
  font-size:14px;
  line-height:1.05;
  letter-spacing:-.02em;
  color:rgba(25,40,60,.72);
}
html body.home.homeRefinedV576 .sealV576{
  position:absolute;
  right:16px;
  top:18px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:conic-gradient(from 20deg, color-mix(in oklab, var(--storyGreenLine) 70%, white), color-mix(in oklab, var(--storyGoldLine) 54%, white), color-mix(in oklab, var(--storyGreenLine) 70%, white));
  opacity:.78;
}
html body.home.homeRefinedV576 .sealV576::after{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:50%;
  background:rgba(255,255,255,.84);
}
html body.home.homeRefinedV576 .certLineV576{
  position:absolute;
  left:16px;
  height:3px;
  border-radius:999px;
  background:rgba(25,40,60,.18);
}
html body.home.homeRefinedV576 .certLineV576.l1{ bottom:36px; width:58%; background:var(--storyGreenLine); opacity:.54; }
html body.home.homeRefinedV576 .certLineV576.l2{ bottom:24px; width:42%; }
html body.home.homeRefinedV576 .proofCardV576 i{
  display:inline-block;
  width:22px;
  height:22px;
  margin:15px 6px 0 0;
  border-radius:7px;
  background:linear-gradient(135deg, color-mix(in oklab, var(--storyBlueLine) 14%, white), rgba(255,255,255,.75));
  border:1px solid rgba(25,40,60,.08);
}
html body.home.homeRefinedV576 .proofCardV576 i:nth-of-type(2){ background:linear-gradient(135deg, color-mix(in oklab, var(--storyGreenLine) 13%, white), rgba(255,255,255,.75)); }
html body.home.homeRefinedV576 .proofCardV576 i:nth-of-type(3){ background:linear-gradient(135deg, color-mix(in oklab, var(--storyGoldLine) 13%, white), rgba(255,255,255,.75)); }

/* Caption und Progress */
html body.home.homeRefinedV576 .storyCaptionV576{
  position:absolute;
  left:clamp(22px, 3vw, 32px);
  right:clamp(22px, 3vw, 32px);
  bottom:44px;
  min-height:92px;
  z-index:6;
}
html body.home.homeRefinedV576 .storyCopyV576{
  position:absolute;
  inset:0;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .42s ease, transform .48s ease;
}
html body.home.homeRefinedV576 .whyStoryVisualV576.is-learn .copyLearnV576,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-transfer .copyTransferV576,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-document .copyDocumentV576{
  opacity:1;
  transform:translateY(0);
}
html body.home.homeRefinedV576 .storyCopyV576 span{
  display:block;
  margin-bottom:8px;
  font-size:10px;
  line-height:1.1;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:900;
  color:color-mix(in oklab, var(--storyActive) 70%, var(--ink));
}
html body.home.homeRefinedV576 .storyCopyV576 strong{
  display:block;
  font-size:clamp(22px, 2vw, 30px);
  line-height:1.05;
  letter-spacing:-.045em;
  color:var(--storyInk);
}
html body.home.homeRefinedV576 .storyCopyV576 p{
  margin:9px 0 0;
  max-width:29rem;
  font-size:clamp(14px, .95vw, 16px);
  line-height:1.46;
  color:var(--storySoftInk);
}
html body.home.homeRefinedV576 .storyStepsV576{
  position:absolute;
  left:clamp(22px, 3vw, 32px);
  bottom:23px;
  display:flex;
  align-items:center;
  gap:8px;
  z-index:7;
}
html body.home.homeRefinedV576 .storyStepsV576 span{
  display:block;
  width:24px;
  height:3px;
  border-radius:999px;
  background:rgba(25,40,60,.16);
  transition:width .45s ease, background .45s ease, opacity .45s ease;
}
html body.home.homeRefinedV576 .whyStoryVisualV576.is-learn .storyStepsV576 .s1,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-transfer .storyStepsV576 .s2,
html body.home.homeRefinedV576 .whyStoryVisualV576.is-document .storyStepsV576 .s3{
  width:48px;
  background:var(--storyActive);
  opacity:.72;
}

html body.home.homeRefinedV576 .whyQualityNote{
  transition:opacity .32s ease, transform .32s ease;
}
html body.home.homeRefinedV576 .whyQualityNote:not(.isStoryActiveV576){
  opacity:.74;
}
html body.home.homeRefinedV576 .whyQualityNote.isStoryActiveV576 .whyQualityMark{
  box-shadow:0 0 0 9px color-mix(in oklab, var(--pillar-accent) 7%, transparent), 0 8px 22px color-mix(in oklab, var(--pillar-accent) 13%, transparent) !important;
}
html body.home.homeRefinedV576 .whyQualityNote.isStoryActiveV576 .whyQualityBody h3{
  color:color-mix(in oklab, var(--pillar-accent) 28%, var(--ink)) !important;
}

@keyframes storyDrawV576{
  0%{ stroke-dashoffset:1; opacity:.2; }
  18%, 64%{ stroke-dashoffset:0; opacity:.72; }
  100%{ stroke-dashoffset:-1; opacity:.18; }
}

@media (max-width:1120px){
  html body.home.homeRefinedV576 .whyStoryPanelV576{
    position:relative !important;
    top:auto !important;
    max-width:820px !important;
    min-height:0 !important;
  }
  html body.home.homeRefinedV576 .whyStoryVisualV576{ max-width:760px !important; }
  html body.home.homeRefinedV576 .storyFrameV576{ min-height:clamp(352px, 52vw, 420px); }
  html body.home.homeRefinedV576 .storyCanvasV576{ height:clamp(176px, 28vw, 220px); }
}

@media (max-width:720px){
  html body.home.homeRefinedV576 .whyStoryPanelV576{
    padding:14px !important;
    border-radius:26px !important;
  }
  html body.home.homeRefinedV576 .storyFrameV576{
    min-height:376px;
    border-radius:24px;
  }
  html body.home.homeRefinedV576 .storyHeaderV576 em{ display:none; }
  html body.home.homeRefinedV576 .storyCanvasV576{
    left:12px;
    right:12px;
    top:56px;
    height:188px;
    border-radius:20px;
  }
  html body.home.homeRefinedV576 .learnCardV576{
    top:42px;
    height:80px;
    border-radius:15px;
  }
  html body.home.homeRefinedV576 .learnCardV576 span,
  html body.home.homeRefinedV576 .transferSourceV576 span,
  html body.home.homeRefinedV576 .transferReflectV576 span,
  html body.home.homeRefinedV576 .certificateV576 span,
  html body.home.homeRefinedV576 .proofCardV576 span{ font-size:7.6px; letter-spacing:.1em; }
  html body.home.homeRefinedV576 .cardTaskV576{ left:5%; }
  html body.home.homeRefinedV576 .cardNextV576{ right:5%; }
  html body.home.homeRefinedV576 .ringV576{ width:44px; height:44px; margin-left:-22px; }
  html body.home.homeRefinedV576 .docIconV576,
  html body.home.homeRefinedV576 .nextPillV576{ left:10px; right:10px; height:30px; }
  html body.home.homeRefinedV576 .transferSourceV576{ left:6%; width:38%; }
  html body.home.homeRefinedV576 .transferReflectV576{ left:11%; width:35%; }
  html body.home.homeRefinedV576 .transferPracticeV576{ right:6%; width:38%; padding:12px; }
  html body.home.homeRefinedV576 .certificateV576{ left:7%; width:42%; }
  html body.home.homeRefinedV576 .proofCardV576{ right:6%; width:40%; }
  html body.home.homeRefinedV576 .storyCaptionV576{ left:20px; right:20px; bottom:44px; }
}

@media (max-width:430px){
  html body.home.homeRefinedV576 .storyFrameV576{ min-height:386px; }
  html body.home.homeRefinedV576 .storyCanvasV576{ height:178px; }
  html body.home.homeRefinedV576 .storyCopyV576 strong{ font-size:22px; }
  html body.home.homeRefinedV576 .storyCopyV576 p{ font-size:13.5px; }
  html body.home.homeRefinedV576 .learnCardV576{ width:30.5%; }
  html body.home.homeRefinedV576 .learnCardV576 span{ left:8px; }
  html body.home.homeRefinedV576 .cardTaskV576{ left:3%; }
  html body.home.homeRefinedV576 .cardNextV576{ right:3%; }
}

@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV576 .storySceneV576,
  html body.home.homeRefinedV576 .storyCopyV576,
  html body.home.homeRefinedV576 .storyStepsV576 span,
  html body.home.homeRefinedV576 .storyFrameV576,
  html body.home.homeRefinedV576 .storyGlowV576,
  html body.home.homeRefinedV576 .whyQualityNote{
    transition:none !important;
    animation:none !important;
  }
  html body.home.homeRefinedV576 .flowActiveV576,
  html body.home.homeRefinedV576 .bridgeActiveV576,
  html body.home.homeRefinedV576 .docActiveV576{
    animation:none !important;
    stroke-dashoffset:0 !important;
  }
}

/* v576 fine tuning: more room for the visual panel and neutralize older lead-text overrides inside the caption. */
html body.home.homeRefinedV576 .whyNarrative{
  grid-template-columns:minmax(420px, .98fr) minmax(430px, 1.02fr) !important;
  gap:clamp(30px, 4.2vw, 68px) !important;
}
html body.home.homeRefinedV576 .storyCopyV576 span{
  margin:0 0 8px !important;
  font-size:10px !important;
  line-height:1.1 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  font-weight:900 !important;
  color:color-mix(in oklab, var(--storyActive) 70%, var(--ink)) !important;
}
html body.home.homeRefinedV576 .storyCopyV576 strong{
  margin:0 !important;
  max-width:12.8em !important;
  font-size:clamp(22px, 1.9vw, 29px) !important;
  line-height:1.04 !important;
  letter-spacing:-.045em !important;
  font-weight:820 !important;
  color:var(--storyInk) !important;
}
html body.home.homeRefinedV576 .whyEditorialLead .storyCopyV576 p{
  margin:9px 0 0 !important;
  max-width:27rem !important;
  font-size:clamp(14px, .9vw, 15.5px) !important;
  line-height:1.45 !important;
  letter-spacing:0 !important;
  font-weight:520 !important;
  color:var(--storySoftInk) !important;
}
@media (max-width:1120px){
  html body.home.homeRefinedV576 .whyNarrative{ grid-template-columns:1fr !important; }
}