/* soft-relief-dividers runtime styles, scoped under .mm-soft-relief */
.mm-soft-relief { position: relative; width: 100%; line-height: 0; --srd-height: 160px; }
.mm-soft-relief .srd-divider { position: relative; z-index: 1; line-height: 0; height: var(--srd-height); margin-top: -1px; margin-bottom: -1px; overflow: hidden; overflow: clip; background: var(--srd-top); }
/* The band is the whole module: the relief fills (drawn 200px past the edge for the animation) stop at its own box. */
.mm-soft-relief .srd-divider svg { display: block; overflow: visible; shape-rendering: geometricPrecision; }
/* Demo areas: library demo and editor preview only (data-mm-chrome, never exported) */
.mm-soft-relief .srd-area { position: relative; display: flex; justify-content: center; line-height: 1.3; box-sizing: border-box; }
.mm-soft-relief .srd-area--top { align-items: flex-start; padding-top: 18px; }
.mm-soft-relief .srd-area--bottom { align-items: flex-end; padding-bottom: 18px; }
.mm-soft-relief .srd-area__label { position: relative; z-index: 3; padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: 0.02em; color: #fff; background: rgba(14, 23, 38, 0.55); white-space: nowrap; pointer-events: none; }
.mm-soft-relief .srd-area.is-dark .srd-area__label { background: rgba(255, 255, 255, 0.16); }
.mm-soft-relief.has-demo .srd-divider::before,
.mm-soft-relief.has-demo .srd-divider::after { content: ""; position: absolute; left: 0; right: 0; z-index: 4; height: 0; border-top: 2px dotted rgba(127, 127, 127, 0.85); pointer-events: none; }
.mm-soft-relief.has-demo .srd-divider::before { top: 1px; }
.mm-soft-relief.has-demo .srd-divider::after { bottom: 1px; }
/* Demo and editor preview only (has-demo): a section that shows through (or has an image) runs under the divider. On live pages and in Beaver Builder the divider always keeps its own height inside its own box (no negative margin), even when a section is transparent. */
/* A section that shows through (or has an image) runs under the divider: the divider overlaps it by its own height, the relief stays on top. */
.mm-soft-relief.has-demo.top-clear .srd-divider { margin-top: calc(-1 * var(--srd-height)); }
.mm-soft-relief.has-demo.bottom-clear .srd-divider { margin-bottom: calc(-1 * var(--srd-height)); }
.mm-soft-relief .srd-area { z-index: 0; }

/* Beaver Builder edit mode (server flag): no CSS animation or transition, the divider stays still. */
[data-mm-static="1"] *, [data-mm-static="1"] *::before, [data-mm-static="1"] *::after { animation: none !important; transition: none !important; }
