@layer components{.hero-shape{background:var(--shape-bg);position:absolute;inset:0;overflow:hidden}.hero-shape:after{content:"";background:var(--shape-fg);position:absolute;inset:0}.hero-shape[data-form=block]:after{inset:22% 30%}.hero-shape[data-form=triangle]:after{clip-path:polygon(0 100%,50% 18%,100% 100%)}.hero-shape[data-form=band]:after{inset:56% 0 18%}.hero-shape[data-form=step]:after{clip-path:polygon(0 100%,0 64%,34% 64%,34% 38%,67% 38%,67% 12%,100% 12%,100% 100%)}.hero-shape[data-form=split]:after{clip-path:polygon(0 0,100% 100%,0 100%)}}