.mk-edgeanchor { height: 0; overflow: hidden; --mk-w: 56vw; --mk-x: -2vw; }
.elementor-editor-active .mk-edgeanchor { height: auto; overflow: visible; padding: 10px 14px; border: 1px dashed #8da3b2; border-radius: 8px; color: #4d6b80; font: 500 12px/1.4 system-ui, sans-serif; text-align: center; }
.elementor-editor-active .mk-edgeanchor::before { content: attr(data-label); }
.elementor-editor-active .mk-edgeanchor:not([data-label])::before { content: 'Edge logo (drawn across the section edge)'; }
/* editor-only guide: full logo, unclipped, drawn over the section */
.mk-edge.mk-edge--ghost { overflow: visible; z-index: 50; opacity: .3; }
.mk-edge.mk-edge--ghost .mk-edge__a { outline: 1px dashed #ff2d78; }

.mk-has-edge { position: relative; isolation: isolate; }
/* One clipped layer per section; each shows only its own part of the logo. */
.mk-edge { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; }
.mk-edge__a {
	position: absolute; width: var(--w); height: calc(var(--w) * var(--ar));
	background: var(--c);
	-webkit-mask: var(--logo) center / 100% 100% no-repeat; mask: var(--logo) center / 100% 100% no-repeat;
	transform: translateY(var(--rise, 0px)); will-change: transform;
}
.mk-edge--right .mk-edge__a { right: var(--x); }
.mk-edge--left .mk-edge__a { left: var(--x); }
/* --k = share of the logo that lies in the upper section */
.mk-edge--up .mk-edge__a { bottom: calc(var(--w) * var(--ar) * (var(--k) - 1)); }
.mk-edge--down .mk-edge__a { top: calc(var(--w) * var(--ar) * var(--k) * -1); }
@media (prefers-reduced-motion: reduce) { .mk-edge__a { transform: none; } }

@media (max-width: 767px) { .mk-edgeanchor[data-preset="alpine"] { --mk-w: 78vw !important; --mk-x: -8vw !important; } }
