/* V27: each app screen owns a complete chapter, without overlapping scenes. */
@keyframes introCopy{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes introProduct{from{opacity:0;transform:perspective(1100px) translateY(65px) rotateY(-13deg) rotateX(7deg) scale(.92)}to{opacity:1;transform:perspective(1100px) translateY(0) rotateY(0) rotateX(0) scale(1)}}
@keyframes introProgress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes introDetail{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.hero{background:radial-gradient(ellipse at 90% 40%,#d2eadd 0%,transparent 45%),linear-gradient(115deg,#fff 0%,#fff 52%,#edf5f0 100%)}
.intro-copy{animation:introCopy .9s cubic-bezier(.22,1,.36,1) both}
.intro-product{animation:introProduct 1.3s cubic-bezier(.16,1,.3,1) .1s both;perspective:1100px}
.intro-product .status-bar span{transform-origin:left;animation:introProgress 1.4s cubic-bezier(.22,1,.36,1) .8s both}
.intro-product .next-card{animation:introDetail .8s ease 1s both}.intro-product .verified-card{animation:introDetail .8s ease 1.2s both}.intro-product .verified-card:nth-child(2){animation-delay:1.4s}
.app-journey{background:#082f2e;color:#fff;overflow:clip}
.journey-heading{padding:80px 0 28px}.journey-heading>.eyebrow{color:#a3c7b8}.journey-heading h2{font-size:clamp(2.3rem,4.5vw,4rem);line-height:1.12;letter-spacing:-.045em;margin:0 0 18px}.journey-heading>p{font-size:1.0625rem;color:#b6d0c4;line-height:1.6;max-width:540px}
.journey-nav{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 0}.journey-nav a{border:1px solid #47685d;border-radius:10px;padding:12px 16px;font-size:.875rem;transition:background .2s,color .2s}.journey-nav a span{color:#ffb17d;margin-right:6px}.journey-nav a:hover{background:#fff;color:#143d32}.journey-nav a:hover span{color:#87502c}
.journey-chapter{position:relative;min-height:calc(100svh - 88px);display:flex;align-items:center;padding:72px 0;border-top:1px solid #ffffff17;scroll-margin-top:88px;--chapter-progress:0}
.journey-chapter:nth-child(odd){background:#0d3b36}.journey-chapter .story-layout{gap:100px;width:min(1180px,calc(100% - 40px))}
.journey-chapter .story-narrative>.eyebrow{font-size:.75rem;display:block;line-height:1.5}
.journey-chapter .story-copy{opacity:1;visibility:visible;transform:none;position:static}
.journey-chapter .story-copy h2{max-width:530px}.journey-chapter .story-chapter{display:block;font-size:.875rem;color:#ffa56b}
.journey-tip{border-left:2px solid #ffac73;padding:8px 0 8px 16px;display:flex;gap:10px;line-height:1.55;font-size:.9375rem;max-width:420px;color:#e5efe8;margin-top:26px}.journey-tip>span{color:#ffac73}
.chapter-next{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem;color:#bcd4c8;padding:10px 0;margin-top:18px;text-underline-offset:5px}.chapter-next:hover{text-decoration:underline}
.journey-chapter .story-product{position:relative;isolation:isolate}.journey-chapter .story-app{position:relative;z-index:1;transition:box-shadow .6s ease;box-shadow:0 35px 80px #00181677}
.screen-number{position:absolute;top:-76px;right:-38px;font-size:11rem;font-weight:750;line-height:1;letter-spacing:-.08em;color:#ffffff08;z-index:0;pointer-events:none}
.journey-chapter .story-screen{display:block;position:static;opacity:1;visibility:visible;transform:none;min-height:350px}
.journey-chapter .story-app-nav{display:flex}.story-app-nav .selected{color:#0b4745;font-weight:750;position:relative}.story-app-nav .selected::before{content:"";height:2px;background:#f7833e;position:absolute;top:-17px;left:0;right:0}
.overview-banner{background:#0b4745;border-radius:14px;padding:20px;color:#fff}.overview-banner>span{font-size:.8125rem;color:#bddbcf}.overview-banner strong{display:block;font-size:1.5rem;line-height:1.2;margin-top:6px}.overview-banner p{font-size:.875rem;line-height:1.5;color:#c4dacf;margin:10px 0 0}
.demo-next{padding:16px;border:1px solid #f5dbc7;border-radius:12px;background:#fff4e9}.demo-next small{font-size:.75rem;color:#805a3d}.demo-next strong{display:block;font-size:1rem;margin-top:5px}.demo-next>span{display:inline-flex;padding-top:12px;font-size:.875rem;color:#0b4745;font-weight:700}
/* Scroll transforms never hide content or combine app screens. */
.motion-ready .journey-chapter .story-app{transform:perspective(1100px) translateY(calc((1 - var(--chapter-progress)) * 36px)) rotateY(calc((1 - var(--chapter-progress)) * -5deg));transform-origin:50% 70%;will-change:transform}
.motion-ready .journey-chapter .story-narrative{transform:translateY(calc((1 - var(--chapter-progress)) * 20px))}
.motion-ready #app-dokumente .demo-track i{transform-origin:left;transform:scaleX(calc(.3 + var(--chapter-progress) * .7))}
.motion-ready #app-hochladen .demo-file{transform:translateY(calc((1 - var(--chapter-progress)) * 18px));opacity:calc(.4 + var(--chapter-progress) * .6)}
.motion-ready #app-nachrichten .reply{transform:translateY(calc((1 - var(--chapter-progress)) * 22px));opacity:calc(.3 + var(--chapter-progress) * .7)}
.motion-ready #app-abschluss .demo-finished>span{transform:scale(calc(.7 + var(--chapter-progress) * .3))}
@media(max-width:900px){.journey-chapter .story-layout{gap:36px}.journey-chapter{scroll-margin-top:76px}.screen-number{right:0;font-size:9rem}.journey-chapter .story-copy h2{font-size:2.3rem}}
@media(max-width:680px){
 .journey-heading{padding:48px 0 28px}.journey-heading h2{font-size:2.15rem}.journey-heading>p{font-size:1rem}.journey-nav{gap:8px;margin-top:22px}.journey-nav a{font-size:.8125rem;padding:10px 12px}
 .journey-chapter{min-height:0;padding:44px 0 48px;scroll-margin-top:72px}.journey-chapter .story-layout{display:grid;grid-template-columns:1fr;gap:30px;width:calc(100% - 36px)}
 .journey-chapter .story-copy h2{font-size:2rem;line-height:1.12;margin:10px 0 14px;max-width:370px}.journey-chapter .story-copy p{font-size:1rem;line-height:1.6}.journey-chapter .story-narrative>.eyebrow{font-size:.75rem}.journey-tip{font-size:.875rem;margin-top:16px}.chapter-next{margin-top:8px}
 .journey-chapter .story-product{max-width:400px}.journey-chapter .story-screen{min-height:0;padding-top:16px}.journey-chapter .story-screen h3{font-size:1.4rem;margin-bottom:16px}.journey-chapter .demo-screen-label{display:block;font-size:.75rem}.journey-chapter .story-app{padding:20px;border-radius:22px}
 .journey-chapter .demo-drop{min-height:132px}.journey-chapter .demo-field,.journey-chapter .demo-file{padding:13px}.journey-chapter .demo-bubble{padding:14px;font-size:.9375rem}.journey-chapter .demo-row{padding:16px 0}.journey-chapter .demo-finished{padding:24px 0}
 .journey-chapter .story-app-nav{padding-top:15px;margin-top:20px;font-size:.75rem}.story-app-nav .selected::before{top:-16px}.journey-chapter .story-disclaimer{margin-top:12px;font-size:.75rem}.screen-number{font-size:7rem;top:-43px;right:0}
}
@media(prefers-reduced-motion:reduce){.intro-copy,.intro-product,.intro-product *{animation:none!important}.motion-ready .journey-chapter .story-app,.motion-ready .journey-chapter .story-narrative,.motion-ready .journey-chapter .demo-file,.motion-ready .journey-chapter .reply,.motion-ready .journey-chapter .demo-finished>span{transform:none!important;opacity:1!important}}