.m-slanted {
  --slanted-angle-negative: -3deg;
  --slanted-angle-positive: 3deg;
  --slanted-angle-sine: 0.05234;
  --slanted-angle-cosine: 0.99863;
  --slanted-width: 100vw;

  --slanted-spacing: calc( var(--slanted-width) * var(--slanted-angle-sine) / var(--slanted-angle-cosine) );

  transform-origin: 100% 0;
  transform: skewY( var(--slanted-angle-negative) );
  overflow: hidden;

  position: relative;
  z-index: 10;

  /* Since the transform origin is top-right, it needs a bottom margin equal to the triangle height */
  margin-bottom: var(--slanted-spacing);
}

/* Use m-slanted--reset instead of a regular container to benefit from the --slanted-spacing variable */
.m-slanted--reset {
  transform: skewY(0deg);
  margin-bottom: 0;
}

.m-slanted--pull-top {
  /* Substract 1 more pixel to avoid fine gaps */
  margin-top: calc( ( var(--slanted-spacing) / -1 ) - 1px );
}

.m-slanted--pull-bottom {
  /* Substract 1 more pixel to avoid fine gaps */
  margin-bottom: -1px;
}

.m-slanted > .w153-pbd-element__inner--0 {
  transform-origin: center center;
  transform: skewY( var(--slanted-angle-positive) );

  margin-top: calc( var(--slanted-spacing) / -2 );
  margin-bottom: calc( var(--slanted-spacing) / -2 );
}

.m-slanted--reset > .w153-pbd-element__inner--0 {
  transform: skewY(0deg);

  margin-top: 0;
  margin-bottom: 0;
}

.m-slanted--padding-t > .w153-pbd-element__inner--0,
.m-slanted--padding-tb > .w153-pbd-element__inner--0 {
  padding-top: var(--slanted-spacing);
}

.m-slanted--padding-b > .w153-pbd-element__inner--0,
.m-slanted--padding-tb > .w153-pbd-element__inner--0 {
  padding-bottom: var(--slanted-spacing);
}

/* Element over the meeting point of 2 slanted sections */
.m-slanted-over {
  --height: 20rem;

  position: relative;
  z-index: 20;
  height: var(--height);
  top: calc( var(--height) / -2 );
  bottom: calc( var(--height) / -1.5 );
}

.m-slanted-over > .is-picture {
  height: var(--height);
}

.m-slanted-over > .is-picture > .is-picture-img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
}
