/**
 * GUL Separators — 20 SVG dividers, applied via .gul-sep-top-<slug> / .gul-sep-bot-<slug>.
 * Implementation: each separator is a CSS mask of an inline SVG that gets filled
 * with the next/previous section color. Flip via .gul-sep-top-flip / .gul-sep-bot-flip.
 *
 * The block wrapper MUST be position:relative; we add it on every gul-* block.
 */
[class*="gul-sep-top-"],
[class*="gul-sep-bot-"] { position: relative; overflow: hidden; }

.gul-sep, .gul-sep-top, .gul-sep-bot {
	position: absolute;
	left: 0;
	right: 0;
	height: 80px;
	pointer-events: none;
	z-index: 2;
	background: var(--gul-sep-color, #ffffff);
}
.gul-sep-top { top: 0; }
.gul-sep-bot { bottom: 0; }
.gul-sep-top.is-flip,
.gul-sep-top-flip > .gul-sep-top { transform: scaleX(-1); }
.gul-sep-bot.is-flip,
.gul-sep-bot-flip > .gul-sep-bot { transform: scaleX(-1); }

/* All 20 separator masks. mask-image inherited from top variant; bottom variant rotates 180. */
.gul-sep[data-shape="waves"]                { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40 Q 360 0 720 40 T 1440 40 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E");                mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40 Q 360 0 720 40 T 1440 40 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="wave-soft"]            { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 60 Q 720 0 1440 60 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E");                                mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 60 Q 720 0 1440 60 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="wave-layered"]         { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 50 Q 200 10 400 50 T 800 50 T 1200 50 T 1440 50 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E");      mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 50 Q 200 10 400 50 T 800 50 T 1200 50 T 1440 50 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="splash"]               { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40 C 200 80 400 0 600 40 C 800 80 1000 0 1200 40 C 1320 60 1380 30 1440 50 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40 C 200 80 400 0 600 40 C 800 80 1000 0 1200 40 C 1320 60 1380 30 1440 50 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="water"]                { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 30 Q 180 70 360 30 T 720 30 T 1080 30 T 1440 30 V 80 H 0 Z M 0 55 Q 180 80 360 55 T 720 55 T 1080 55 T 1440 55 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 30 Q 180 70 360 30 T 720 30 T 1080 30 T 1440 30 V 80 H 0 Z M 0 55 Q 180 80 360 55 T 720 55 T 1080 55 T 1440 55 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="triangle"]             { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 720 80 L 1440 0 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E");                                  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 720 80 L 1440 0 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="triangle-asymmetric"]  { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 1080 80 L 1440 0 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E");                                 mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 1080 80 L 1440 0 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="arrow-up"]             { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 720 0 L 1440 80 Z' fill='%23000'/%3E%3C/svg%3E");                                  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 720 0 L 1440 80 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="arrow-down"]           { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 720 80 L 1440 0 Z M 0 0 V 80 H 0 Z M 1440 0 V 80 H 1440 Z' fill='%23000'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 720 80 L 1440 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="tilt"]                 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 1440 0 V 80 Z' fill='%23000'/%3E%3C/svg%3E");                                          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 1440 0 V 80 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="tilt-opposite"]        { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 1440 80 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E");                                       mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L 1440 80 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="curve"]                { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 Q 720 0 1440 80 Z' fill='%23000'/%3E%3C/svg%3E");                                       mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 Q 720 0 1440 80 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="curve-asymmetric"]     { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 Q 1080 0 1440 60 V 80 Z' fill='%23000'/%3E%3C/svg%3E");                                  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 Q 1080 0 1440 60 V 80 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="mountains"]            { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 180 30 L 360 60 L 540 10 L 720 50 L 900 20 L 1080 60 L 1260 30 L 1440 70 V 80 Z' fill='%23000'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 180 30 L 360 60 L 540 10 L 720 50 L 900 20 L 1080 60 L 1260 30 L 1440 70 V 80 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="zigzag"]               { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L 120 0 L 240 40 L 360 0 L 480 40 L 600 0 L 720 40 L 840 0 L 960 40 L 1080 0 L 1200 40 L 1320 0 L 1440 40 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L 120 0 L 240 40 L 360 0 L 480 40 L 600 0 L 720 40 L 840 0 L 960 40 L 1080 0 L 1200 40 L 1320 0 L 1440 40 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="book"]                 { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 Q 720 80 1440 0 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E");                                        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0 Q 720 80 1440 0 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="clouds"]               { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 60 Q 120 20 240 60 Q 360 30 480 60 Q 600 25 720 60 Q 840 30 960 60 Q 1080 25 1200 60 Q 1320 30 1440 60 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 60 Q 120 20 240 60 Q 360 30 480 60 Q 600 25 720 60 Q 840 30 960 60 Q 1080 25 1200 60 Q 1320 30 1440 60 V 80 H 0 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="half-circle"]          { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 A 720 80 0 0 1 1440 80 V 80 Z' fill='%23000'/%3E%3C/svg%3E");                                  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 A 720 80 0 0 1 1440 80 V 80 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="pyramids"]             { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 144 0 L 288 80 L 432 0 L 576 80 L 720 0 L 864 80 L 1008 0 L 1152 80 L 1296 0 L 1440 80 Z' fill='%23000'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 L 144 0 L 288 80 L 432 0 L 576 80 L 720 0 L 864 80 L 1008 0 L 1152 80 L 1296 0 L 1440 80 Z' fill='%23000'/%3E%3C/svg%3E"); }
.gul-sep[data-shape="steps"]                { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 V 60 H 240 V 40 H 480 V 20 H 720 V 0 H 1440 V 80 Z' fill='%23000'/%3E%3C/svg%3E");                            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80 V 60 H 240 V 40 H 480 V 20 H 720 V 0 H 1440 V 80 Z' fill='%23000'/%3E%3C/svg%3E"); }

.gul-sep { -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: bottom; mask-position: bottom; }
.gul-sep-bot { transform: rotate(180deg); }
.gul-sep-top-flip > .gul-sep-top.is-flip-x { transform: scaleX(-1); }
.gul-sep-bot-flip > .gul-sep-bot { transform: rotate(180deg) scaleX(-1); }

@media (max-width: 768px) {
	.gul-sep, .gul-sep-top, .gul-sep-bot { height: 48px; }
}
