/* V602: Nur Browserleiste/Zugangscode-Zeitpunkt und Impuls-Kartenübergang geschärft.
   Inhalte bleiben unverändert. */

/* Die Impulskarte darf am Szenenübergang kurz über die erste Ebene hinauswandern. */
html body.home.homeRefinedV602 .sceneLearnV588{
  overflow:visible !important;
  contain:none !important;
}

/* Browserkontext ist von Beginn an Teil des Laptop-Displays. */
html body.home.homeRefinedV602 .sceneLearnV588 .browserChromeV601{
  opacity:1 !important;
  transform:none !important;
  animation:none !important;
  top:20px !important;
  left:15.5% !important;
  width:69% !important;
  z-index:18 !important;
}

html body.home.homeRefinedV602 .sceneLearnV588 .browserAddressV601{
  font-size:9.6px !important;
  letter-spacing:.01em !important;
}

/* Damit die Code-Eingabe als Formular im Browser wirkt und nicht mit der Leiste kollidiert. */
html body.home.homeRefinedV602 .sceneLearnV588 .accessMomentV595{
  top:112px !important;
  z-index:17 !important;
  animation:v602AccessRedeem 8.8s cubic-bezier(.2,.72,.18,1) 1 forwards !important;
}

html body.home.homeRefinedV602 .sceneLearnV588 .accessMomentV595::after{
  animation:v602AccessCheck 8.8s ease-in-out 1 forwards !important;
}

/* Nach dem eingelösten Code baut sich das Cockpit unter der Browserleiste auf. */
html body.home.homeRefinedV602 .sceneLearnV588 .cockpitMomentV595{
  top:62px !important;
  min-height:242px !important;
  animation:v602CockpitReveal 8.8s cubic-bezier(.2,.72,.18,1) 1 forwards !important;
}

html body.home.homeRefinedV602 .sceneLearnV588 .courseFlowV588{
  margin:14px 0 13px !important;
  gap:9px !important;
}

html body.home.homeRefinedV602 .sceneLearnV588 .nextPillV588{
  width:248px !important;
  min-height:54px !important;
  animation:v602NextEmphasis 8.8s cubic-bezier(.2,.72,.18,1) 1 forwards !important;
}

html body.home.homeRefinedV602 .sceneLearnV588 .nextPillV588::before{
  animation:v602NextShine 8.8s ease-in-out 1 forwards !important;
}

/* Kurseinheit öffnet sich aus dem Cockpit und bildet die Ausgangskarte für den Transfer. */
html body.home.homeRefinedV602 .sceneLearnV588 .unitMomentV595{
  top:198px !important;
  left:27% !important;
  width:360px !important;
  z-index:15 !important;
  animation:v602ImpulseOpen 8.8s cubic-bezier(.2,.72,.18,1) 1 forwards !important;
}

/* Die kleine Impulskarte fährt sichtbar nach unten in Richtung Transferkarte.
   Sie übernimmt den erzählerischen Weg, ohne Text oder Transferinhalt zu ändern. */
html body.home.homeRefinedV602 .sceneLearnV588 .impulseCarryV595{
  left:55% !important;
  top:52% !important;
  width:206px !important;
  z-index:16 !important;
  animation:v602ImpulseCarryToTransfer 8.8s cubic-bezier(.2,.72,.18,1) 1 forwards !important;
  transform-origin:left top !important;
}

html body.home.homeRefinedV602 .sceneTransferV588 .courseImpulseV588{
  transition:opacity .45s ease, transform .45s ease !important;
}

/* Während die Learn-Szene aktiv ist, bleibt die eigentliche Transferkarte ruhig im Hintergrund.
   Beim Scrollanker Transfer übernimmt sie regulär. */
html body.home.homeRefinedV602 .verticalLearningJourneyV584.is-learn .sceneTransferV588 .courseImpulseV588{
  opacity:.48 !important;
  transform:translateY(0) scale(.985) !important;
}

@keyframes v602AccessRedeem{
  0%,25%{ opacity:1; transform:translateY(0) scale(1); }
  31%,39%{ opacity:1; transform:translateY(-2px) scale(1.012); }
  48%,100%{ opacity:0; transform:translate(0,-22px) scale(.74); pointer-events:none; }
}

@keyframes v602AccessCheck{
  0%,24%{ opacity:0; transform:scale(.78); }
  31%,42%{ opacity:1; transform:scale(1); }
  48%,100%{ opacity:0; transform:scale(.88); }
}

@keyframes v602CockpitReveal{
  0%,43%{ opacity:0; transform:translateY(10px) scale(.988); }
  53%,100%{ opacity:1; transform:translateY(0) scale(1); }
}

@keyframes v602NextEmphasis{
  0%,62%{ opacity:1; transform:translateY(0) scale(1); box-shadow:0 15px 36px rgba(69,168,204,.07); }
  70%,77%{ opacity:1; transform:translateY(-1px) scale(1.035); box-shadow:0 20px 50px rgba(69,168,204,.14); }
  88%,100%{ opacity:.28; transform:translateY(2px) scale(.985); box-shadow:0 12px 30px rgba(69,168,204,.04); }
}

@keyframes v602NextShine{
  0%,63%{ opacity:0; transform:translateX(-120%); }
  71%{ opacity:.82; }
  83%,100%{ opacity:0; transform:translateX(120%); }
}

@keyframes v602ImpulseOpen{
  0%,71%{ opacity:0; transform:translateY(8px) scale(.94); }
  79%,91%{ opacity:1; transform:translateY(0) scale(1); }
  100%{ opacity:.84; transform:translate(34px,34px) scale(.88); }
}

@keyframes v602ImpulseCarryToTransfer{
  0%,80%{ opacity:0; transform:translate(-10px,-18px) scale(.78); }
  88%{ opacity:.96; transform:translate(0,0) scale(1); }
  96%{ opacity:.88; transform:translate(-410px,315px) scale(1.42); }
  100%{ opacity:0; transform:translate(-410px,315px) scale(1.42); }
}

@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV602 .sceneLearnV588 .browserChromeV601,
  html body.home.homeRefinedV602 .sceneLearnV588 .accessMomentV595,
  html body.home.homeRefinedV602 .sceneLearnV588 .accessMomentV595::after,
  html body.home.homeRefinedV602 .sceneLearnV588 .cockpitMomentV595,
  html body.home.homeRefinedV602 .sceneLearnV588 .nextPillV588,
  html body.home.homeRefinedV602 .sceneLearnV588 .nextPillV588::before,
  html body.home.homeRefinedV602 .sceneLearnV588 .unitMomentV595,
  html body.home.homeRefinedV602 .sceneLearnV588 .impulseCarryV595{
    animation:none !important;
  }
  html body.home.homeRefinedV602 .sceneLearnV588 .accessMomentV595{ opacity:0 !important; }
  html body.home.homeRefinedV602 .sceneLearnV588 .cockpitMomentV595,
  html body.home.homeRefinedV602 .sceneLearnV588 .unitMomentV595{
    opacity:1 !important;
    transform:none !important;
  }
  html body.home.homeRefinedV602 .sceneLearnV588 .impulseCarryV595{
    opacity:.8 !important;
    transform:translate(-120px,190px) scale(1.08) !important;
  }
}

@media (max-width:680px){
  html body.home.homeRefinedV602 .sceneLearnV588 .browserChromeV601{
    top:18px !important;
    left:14% !important;
    width:72% !important;
  }
  html body.home.homeRefinedV602 .sceneLearnV588 .accessMomentV595{
    top:104px !important;
  }
  html body.home.homeRefinedV602 .sceneLearnV588 .unitMomentV595{
    left:20% !important;
    width:62% !important;
  }
}