/* =========================================================================
NIGHTLINE DACHSCHINDEL-ZICK-ZACK
========================================================================= */

/* 1. Volle Breite erzwingen */
body, #page-wrapper, #wrapper {
overflow-x: hidden !important;
}

.alignfull {
width: 100vw !important;
max-width: 100vw !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
}

/* 2. Grundgerüst: Jeder Block rutscht unter den vorherigen /
.wp-block-media-text.is-style-nl-slant-down,
.wp-block-media-text.is-style-nl-slant-up,
.wp-block-group.is-style-nl-slant-down,
.wp-block-group.is-style-nl-slant-up {
position: relative !important;
margin-top: -6vw !important; / Zieht den Block 6vw nach oben über den alten Block /
margin-bottom: 0 !important;
padding: 10vw 2rem 6vw 2rem !important;
border: none !important;
/ Da sie im HTML nacheinander kommen, liegt der untere Block automatisch ÜBER dem oberen */
}

/* FALLBACK FARBE, falls im Color-Picker nichts gewählt wird /
.wp-block-media-text[class="nl-slant"]:not(.has-background),
.wp-block-group[class*="nl-slant"]:not(.has-background) {
background-color: #2a2f35;
color: #ffffff;
}

/* 3. Die Schnitte (NUR DIE OBERKANTE WIRD GESCHNITTEN, UNTEN BLEIBT GERADE!) */

/* Zick-Zack: Links hoch, Rechts tief () */
.is-style-nl-slant-down {
clip-path: polygon(0 0, 100% 6vw, 100% 100%, 0 100%) !important;
}

/* Zick-Zack: Links tief, Rechts hoch (/) */
.is-style-nl-slant-up {
clip-path: polygon(0 6vw, 100% 0, 100% 100%, 0 100%) !important;
}

/* 4. Der allererste Block im Wrapper darf nicht oben angeschnitten sein oder verrutschen /
#wrapper > .alignfull:first-child {
margin-top: 0 !important;
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%) !important; / Oben kerzengerade */
padding-top: 6vw !important;
}
