/* Mindalizer brand signature — the pattern made of the Mindalizer symbol (Mindalizer Brand/Patterns, "matrix").
   Same treatment everywhere: white, very light, fading in from one side, like the LinkedIn cover and the deck.
   Used only on dark blocks: page heroes, the call-to-action blocks, the home "How we work" band and the footer. */
.mz-pattern {
  position: absolute; inset: 0; pointer-events: none;
  background: url('/images/brand/pattern-matrix-white.svg') repeat;
  background-size: 64px 64px;
  opacity: .07;
  -webkit-mask-image: linear-gradient(100deg, transparent 25%, #000 85%);
          mask-image: linear-gradient(100deg, transparent 25%, #000 85%);
}
/* in the footer it comes down from the top edge */
.mz-pattern--top {
  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 70%);
          mask-image: linear-gradient(180deg, #000 0%, transparent 70%);
  opacity: .06;
}
/* blocks whose children are in normal flow: keep the content above the pattern */
.mz-host { position: relative; overflow: hidden; }
.mz-host > :not(.mz-pattern) { position: relative; }
/* home hero stacks background (0) · canvas (1) · overlay (2) · content (3): the pattern sits right after the overlay */
.hero > .mz-pattern--hero { z-index: 2; }
@media (max-width: 640px) { .mz-pattern { background-size: 48px 48px; } }
/* about: the banner paints a colour layer (::after) above its children, so the pattern goes above it */
.page-banner > .mz-pattern { z-index: 1; }