@keyframes text-fly-in-effect--before{0%{translate:0 0}to{translate:0 -300%}}@keyframes text-fly-in-effect--after{0%{translate:0 300%}to{translate:0 0}}.scroll-by-element{--scroll-by-element-progress: 0;--progress: clamp(0, var(--scroll-by-element-progress), 1);--initial-w: 6.25rem;--initial-h: 9.375rem;--visible-w: calc(var(--initial-w) + var(--progress) * (100% - var(--initial-w)));--visible-h: calc(var(--initial-h) + var(--progress) * (100% - var(--initial-h)));--inset-w: calc((100% - var(--visible-w)) / 2);--inset-h: calc((100% - var(--visible-h)) / 2);--scroll-by-element-tail: 200lvh}@media(prefers-reduced-motion){.scroll-by-element{--scroll-by-element-progress: 1}}@media(min-width:768px){.scroll-by-element{--initial-w: 12.5rem;--initial-h: 18.75rem}}.scroll-by__grid{overflow:clip}.scroll-by__grid .grid-background__background{position:sticky;height:100lvh;margin-block-end:-100lvh;z-index:0}.scroll-by-element__bg{inset-block-start:0;height:100lvh;background:none;z-index:1}.scroll-by-element__bg-inner{width:100%;height:100%;overflow:hidden;clip-path:inset(var(--inset-h) var(--inset-w) var(--inset-h) var(--inset-w) round .25rem)}.scroll-by-element__bg-media{will-change:clip-path;clip-path:inset(var(--inset-h) var(--inset-w) var(--inset-h) var(--inset-w) round .25rem)}.scroll-by-element__bg .backdrop{opacity:var(--progress);will-change:opacity}.scroll-by-element__headline-line{text-overflow:clip}.scroll-by-element__headline{inset:0;width:100%;max-width:100%;min-width:0}.scroll-by-element__fg-text{grid-row:1;min-block-size:auto;align-self:center;will-change:transform;overflow:visible;transform:translateY(calc((1 - clamp(0,var(--scroll-by-element-progress) - 1,1))*100vh))}.scroll-by-element__spacer{block-size:var(--scroll-by-element-tail)}