/* ============================================================
   Fassung 9 — Liegt zuoberst.
   ============================================================ */
.held{padding:calc(var(--nav-h) + 180px) 0 140px}

/* Kasten: Wort sitzt auf derselben Grundlinie wie "werden" */
.kasten{display:inline-grid;grid-template-columns:100%;align-items:baseline;vertical-align:baseline;height:auto;line-height:.9;padding:.07em .18em .09em;overflow:hidden;margin-top:0}
.kasten__w{grid-area:1/1;position:static;left:auto;top:auto;white-space:nowrap}

/* Tool: kommt von unten, bleibt gleich hoch */
.tool{height:640px}
.tool__haupt{overflow:hidden;height:100%;box-sizing:border-box}
.tool__screen--an{height:100%;display:flex;flex-direction:column}
.tool__liste{flex:1;min-height:0}
.tool__projekt{flex:1;min-height:0}
.tool__kal{flex:1;grid-template-columns:repeat(6,1fr);grid-auto-rows:1fr;gap:6px}
.tool__tag2{min-height:0;padding:8px 10px;font-size:.72rem;display:flex;flex-direction:column}
.tool__termin{font-size:.66rem;padding:5px 7px;margin-top:6px}
@media(max-width:820px){.tool{height:auto}.tool__haupt{height:auto}.tool__screen--an{height:auto}.tool__kal{grid-template-columns:repeat(6,1fr);grid-auto-rows:auto}.tool__tag2{min-height:44px}}

/* Sequenz: Panel bis an den Rand, Ecken oben und unten rund, dickere Punkte */
.zeigen__panel{left:0;right:0;top:0;border-radius:34px}
.zeigen__punkte i{height:6px;width:32px}
.zeigen__punkte i.an{width:56px}
.dreh__schalter i{background:transparent;border:1px solid rgba(255,255,255,.3)}
.dreh__karte ul{margin-bottom:0}
.dreh__karte{gap:16px}

/* Story: eigenes Video */
.story__video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.story__video--an img,.story__video--an .story__play,.story__video--an .story__dauer{display:none}
.story__video--an{cursor:default}

/* Monster */
.wort-tuerkis{font-style:normal;color:var(--tuerkis)}
.futter__knopf{margin-left:-4px}

/* Baukasten */
#lego .lede--mitte .h2{max-width:none}

/* Zitate: eine Schriftgroesse */
.zitat--unten p{font-size:clamp(1.9rem,2.6vw,2.6rem)}
.zitat--unten:nth-of-type(4){grid-column:2/4}.zitat--unten:nth-of-type(5){grid-column:4/6}
@media(max-width:900px){.zitat--unten:nth-of-type(4),.zitat--unten:nth-of-type(5){grid-column:auto}}

/* Downloads: Cover naeher am Text, Blaetter bewegen sich */
.dl{gap:10px;padding-bottom:22px}
.stapel{margin:6px auto 0}
.stapel i{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.stapel i:nth-child(1){animation:blatt1 7s ease-in-out infinite}
.stapel i:nth-child(2){animation:blatt2 8s ease-in-out infinite}
.stapel__sticker{animation:sticker 5s ease-in-out infinite}
.dl:hover .stapel i:nth-child(1){transform:rotate(-5deg) translate(-6px,2px)}
.dl:hover .stapel i:nth-child(2){transform:rotate(4deg) translate(6px,-2px)}
.dl:hover .stapel__blatt{transform:translateY(-6px)}
.stapel__blatt{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
@keyframes blatt1{0%,100%{transform:rotate(-2.4deg)}50%{transform:rotate(-3.6deg) translateX(-3px)}}
@keyframes blatt2{0%,100%{transform:rotate(1.8deg)}50%{transform:rotate(3deg) translateX(3px)}}
@keyframes sticker{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(-2deg) translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.stapel i,.stapel__sticker{animation:none}}