.jev-muster,
.jev-fliess ul li::before {
--jev-muster-figur: var(--jev-signal);
--jev-muster-grund: var(--jev-text);
--jev-muster-kachel: 48px;
background-color: var(--jev-muster-grund);
color: var(--jev-muster-figur);
}
.jev-muster--lagune { --jev-muster-figur: var(--jev-flaeche-hell);   --jev-muster-grund: var(--jev-text-titel); }
.jev-muster--duene  { --jev-muster-figur: var(--jev-text);    --jev-muster-grund: var(--jev-flaeche-hell); }
.jev-muster--terrakotta { --jev-muster-figur: var(--jev-grund); --jev-muster-grund: var(--jev-terrakotta); }
.jev-muster--kreis {
background-image: radial-gradient(circle at 50% 50%, currentColor 48%, transparent 49%);
background-size: var(--jev-muster-kachel) var(--jev-muster-kachel);
}
.jev-muster--halbkreis {
background-image: radial-gradient(circle at 0% 50%, currentColor 48%, transparent 49%);
background-size: var(--jev-muster-kachel) var(--jev-muster-kachel);
}
.jev-muster--schachbrett {
background-image:
linear-gradient(45deg, currentColor 25%, transparent 25%, transparent 75%, currentColor 75%),
linear-gradient(45deg, currentColor 25%, transparent 25%, transparent 75%, currentColor 75%);
background-size: var(--jev-muster-kachel) var(--jev-muster-kachel);
background-position: 0 0, calc(var(--jev-muster-kachel) / 2) calc(var(--jev-muster-kachel) / 2);
}
.jev-muster--raute,
.jev-fliess ul li::before {
background-image:
linear-gradient(45deg,  currentColor 25%, transparent 25%),
linear-gradient(-45deg, currentColor 25%, transparent 25%),
linear-gradient(45deg,  transparent 75%, currentColor 75%),
linear-gradient(-45deg, transparent 75%, currentColor 75%);
background-size: var(--jev-muster-kachel) var(--jev-muster-kachel);
}
.jev-muster--pfeil {
background-image: linear-gradient(135deg, currentColor 25%, transparent 25%, transparent 75%, currentColor 75%);
background-size: var(--jev-muster-kachel) var(--jev-muster-kachel);
}
.jev-muster--linien {
background-image: repeating-linear-gradient(
to bottom,
currentColor 0, currentColor 2px,
transparent 2px, transparent 8px
);
background-size: var(--jev-muster-kachel) var(--jev-muster-kachel);
}
.jev-muster--bogen {
background-image: radial-gradient(circle at 0% 100%, currentColor 70%, transparent 71%);
background-size: var(--jev-muster-kachel) var(--jev-muster-kachel);
}
.jev-muster--flower,
.jev-muster--tulip,
.jev-muster--eye,
.jev-muster--funnel,
.jev-muster--opening {
background-color: var(--jev-muster-grund);
background-image: none;
}
.jev-muster--flower  { --jev-muster-datei: url("https://jeveaux.company/wp-content/themes/jeveaux/assets/muster/flower.svg"); }
.jev-muster--tulip   { --jev-muster-datei: url("https://jeveaux.company/wp-content/themes/jeveaux/assets/muster/tulip.svg"); }
.jev-muster--eye     { --jev-muster-datei: url("https://jeveaux.company/wp-content/themes/jeveaux/assets/muster/eye.svg"); }
.jev-muster--funnel  { --jev-muster-datei: url("https://jeveaux.company/wp-content/themes/jeveaux/assets/muster/funnel.svg"); }
.jev-muster--opening { --jev-muster-datei: url("https://jeveaux.company/wp-content/themes/jeveaux/assets/muster/opening.svg"); }
.jev-muster--flower::before,
.jev-muster--tulip::before,
.jev-muster--eye::before,
.jev-muster--funnel::before,
.jev-muster--opening::before {
content: "";
position: absolute;
inset: 0;
background: currentColor;
-webkit-mask: var(--jev-muster-datei) 0 0 / var(--jev-muster-kachel) var(--jev-muster-kachel) repeat;
mask: var(--jev-muster-datei) 0 0 / var(--jev-muster-kachel) var(--jev-muster-kachel) repeat;
}
.jev-muster--flower,
.jev-muster--tulip,
.jev-muster--eye,
.jev-muster--funnel,
.jev-muster--opening { position: relative; }
.jev-muster--flower::before,
.jev-muster--tulip::before,
.jev-muster--eye::before,
.jev-muster--funnel::before,
.jev-muster--opening::before { border-radius: inherit; }
.jev-band {
height: var(--jev-muster-kachel);
width: 100%;
}
.jev-band--doppelt { height: calc(var(--jev-muster-kachel) * 2); }
.jev-muster--fein { --jev-muster-kachel: 32px; }
.jev-muster--grob { --jev-muster-kachel: 72px; }
.jev-muster--komposition {
background-color: var(--jev-flaeche-tief);
background-image: url("https://jeveaux.company/wp-content/themes/jeveaux/assets/muster/komposition.svg");
background-size: 560px 560px;
background-repeat: repeat;
}
.jev-muster--komposition::before { content: none; }
.jev-flaeche { min-height: 320px; }