.mt-page {
  position: relative;
  background: #ffffff;
  --text-25: rgba(16, 16, 22, 0.74);
  --mt-dust: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='156' height='156'%3E%3Cfilter id='d' x='0%25' y='0%25' width='100%25' height='100%25' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch' seed='11'/%3E%3CfeColorMatrix type='saturate' values='0.4'/%3E%3CfeColorMatrix type='matrix' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0 1'/%3E%3C/filter%3E%3Crect width='156' height='156' filter='url(%23d)'/%3E%3C/svg%3E");
  --mt-ramp-a: linear-gradient(142deg,
    #d9e6fe 0%, #c6d8fd 20%, #b0c8fc 42%, #99b8fb 64%, #83a7fa 84%, #7099fa 100%);
  --mt-ramp-b: linear-gradient(138deg,
    #d3e2fe 0%, #b7cdfd 18%, #97b5fc 38%, #739ffa 58%, #5583f9 80%, #4369f6 100%);
  --mt-ramp-c: linear-gradient(227deg,
    #dbe8fe 0%, #c8d9fd 22%, #b3cafd 42%, #a0bffc 60%, #8db1fb 74%,
    #7aa5fb 85%, #5d88f9 93%, #3f55f3 100%);
  --mt-flow-a:
    radial-gradient(42% 48% at 24% 28%, rgba(116, 196, 255, 0.38), rgba(116, 196, 255, 0) 70%),
    radial-gradient(46% 42% at 76% 24%, rgba(88, 168, 255, 0.32), rgba(88, 168, 255, 0) 68%),
    radial-gradient(50% 54% at 56% 80%, rgba(140, 210, 255, 0.36), rgba(140, 210, 255, 0) 72%);
  --mt-flow-b:
    radial-gradient(44% 46% at 30% 22%, rgba(104, 188, 255, 0.38), rgba(104, 188, 255, 0) 70%),
    radial-gradient(40% 46% at 74% 62%, rgba(146, 212, 255, 0.34), rgba(146, 212, 255, 0) 70%),
    radial-gradient(52% 48% at 44% 86%, rgba(82, 164, 255, 0.32), rgba(82, 164, 255, 0) 72%);
  --mt-flow-c:
    radial-gradient(40% 44% at 72% 24%, rgba(124, 200, 255, 0.38), rgba(124, 200, 255, 0) 70%),
    radial-gradient(48% 44% at 26% 46%, rgba(92, 174, 255, 0.32), rgba(92, 174, 255, 0) 68%),
    radial-gradient(46% 52% at 62% 82%, rgba(148, 214, 255, 0.34), rgba(148, 214, 255, 0) 72%);
  --mt-ramp-d: linear-gradient(150deg,
    #d5e4fe 0%, #b8cefd 15%, #99b9fc 34%, #7ba4fb 53%, #5b86f9 72%, #4670f7 88%, #3f5bf4 100%);
  --mt-flow-d:
    radial-gradient(42% 46% at 26% 26%, rgba(112, 194, 255, 0.38), rgba(112, 194, 255, 0) 70%),
    radial-gradient(44% 42% at 78% 44%, rgba(96, 178, 255, 0.32), rgba(96, 178, 255, 0) 68%),
    radial-gradient(50% 50% at 48% 84%, rgba(144, 212, 255, 0.36), rgba(144, 212, 255, 0) 72%);
  --mt-ramp-e: linear-gradient(158deg,
    #c9dbfe 0%, #a8c5fd 14%, #8db1fc 32%, #7ba4fb 50%, #5583f9 70%, #4169f6 88%, #3a54f2 100%);
  --mt-flow-e:
    radial-gradient(44% 46% at 30% 24%, rgba(108, 192, 255, 0.36), rgba(108, 192, 255, 0) 70%),
    radial-gradient(42% 44% at 74% 52%, rgba(140, 208, 255, 0.32), rgba(140, 208, 255, 0) 68%),
    radial-gradient(48% 50% at 44% 86%, rgba(86, 170, 255, 0.34), rgba(86, 170, 255, 0) 72%);
}
.theme-light.mt-page {
  background: #ffffff;
}
.mt-field {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1700px;
  z-index: 0;
  overflow: hidden;      
  pointer-events: none;
}
.mt-page > .page-header,
.mt-page > main,
.mt-page > .footer {
  position: relative;
  z-index: 1;
}
.mt-shape {
  position: absolute;
  isolation: isolate;
}
.mt-shape__blur {
  position: absolute;
  inset: 0;
  filter: blur(7px);
}
.mt-shape__fill {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-size: 260% 240%, 300% 220%, 240% 300%, 100% 100%;
  background-blend-mode: screen, screen, screen, normal;
  animation: mtFlow 26s ease-in-out infinite;
  will-change: background-position;
}
.mt-shape__grain {
  position: absolute;
  inset: 7%;
  background-image: var(--mt-dust);
  background-size: 156px 156px;
  mix-blend-mode: overlay;
  opacity: 0.7;
  -webkit-mask-image: radial-gradient(closest-side, #000 52%, transparent 100%);
  mask-image: radial-gradient(closest-side, #000 52%, transparent 100%);
}
@keyframes mtFlow {
  0%,
  100% { background-position:  0%   0%, 100% 20%, 40% 100%, 0 0; }
  33%  { background-position: 72%  44%,  18% 82%, 92%  28%, 0 0; }
  66%  { background-position: 28%  96%,  84%  4%,  4%  66%, 0 0; }
}
.mt-shape--triangle {
  left: 15%;
  top: 48px;
  width: clamp(200px, 21.6vw, 352px);
  aspect-ratio: 2 / 1.7320508;
  transform: rotate(-16deg);
}
.mt-shape--triangle .mt-shape__fill,
.mt-shape--triangle .mt-shape__grain {
  clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}
.mt-shape--triangle .mt-shape__fill {
  background-image: var(--mt-flow-a), var(--mt-ramp-a);
  animation-duration: 24s;
}
.mt-shape--triangle .mt-shape__grain {
  inset: 18% 12% 8%;
}
.mt-shape--circle {
  right: 4%;
  top: 320px;
  width: clamp(196px, 21vw, 344px);
  aspect-ratio: 1;
}
.mt-shape--circle .mt-shape__fill,
.mt-shape--circle .mt-shape__grain {
  border-radius: 50%;
}
.mt-shape--circle .mt-shape__fill {
  background-image: var(--mt-flow-b), var(--mt-ramp-b);
  animation-duration: 31s;
  animation-delay: -7s;
}
.mt-shape--square {
  left: 2%;
  top: 700px;
  width: clamp(213px, 24.8vw, 378px);
  aspect-ratio: 1;
  transform: rotate(-6deg);
}
.mt-shape--square .mt-shape__fill,
.mt-shape--square .mt-shape__grain {
  border-radius: 4px;
}
.mt-shape--square .mt-shape__fill {
  background-image: var(--mt-flow-c), var(--mt-ramp-c);
  animation-duration: 28s;
  animation-delay: -14s;
}
.mt-shape--pentagon {
  right: 21%;
  top: 1345px;
  width: clamp(180px, 17.6vw, 310px);
  aspect-ratio: 1.0515;
  transform: rotate(8deg);
}
.mt-shape--pentagon .mt-shape__fill,
.mt-shape--pentagon .mt-shape__grain {
  clip-path: polygon(50% 0%, 100% 38.2%, 80.9% 100%, 19.1% 100%, 0% 38.2%);
}
.mt-shape--pentagon .mt-shape__fill {
  background-image: var(--mt-flow-d), var(--mt-ramp-d);
  animation-duration: 34s;
  animation-delay: -21s;
}
.mt-shape--pentagon .mt-shape__grain {
  inset: 16% 12% 10%;
}
.mt-page .multithink-roles {
  position: relative;
}
.mt-shape--burst {
  position: absolute;
  z-index: -1;
  left: -13%;
  top: -22%;
  width: clamp(210px, 26vw, 400px);
  aspect-ratio: 1;
  transform: rotate(-5deg);
  pointer-events: none;
}
.mt-shape--burst .mt-shape__fill,
.mt-shape--burst .mt-shape__grain {
  clip-path: polygon(
    50.00% 0.00%, 58.10% 9.30%, 69.13% 3.81%, 73.06% 15.49%,
    85.36% 14.64%, 84.51% 26.94%, 96.19% 30.87%, 90.70% 41.90%,
    100.00% 50.00%, 90.70% 58.10%, 96.19% 69.13%, 84.51% 73.06%,
    85.36% 85.36%, 73.06% 84.51%, 69.13% 96.19%, 58.10% 90.70%,
    50.00% 100.00%, 41.90% 90.70%, 30.87% 96.19%, 26.94% 84.51%,
    14.64% 85.36%, 15.49% 73.06%, 3.81% 69.13%, 9.30% 58.10%,
    0.00% 50.00%, 9.30% 41.90%, 3.81% 30.87%, 15.49% 26.94%,
    14.64% 14.64%, 26.94% 15.49%, 30.87% 3.81%, 41.90% 9.30%
  );
}
.mt-shape--burst .mt-shape__fill {
  background-image: var(--mt-flow-e), var(--mt-ramp-e);
  animation-duration: 37s;
  animation-delay: -11s;
}
.mt-shape--burst .mt-shape__grain {
  inset: 14%;
}
.mt-page .multithink-role {
  position: relative;
  z-index: 1;
  background: rgba(255, 255, 255, 0.62);
}
.mt-page .multithink-role:hover {
  background: rgba(255, 255, 255, 0.74);
}
.mt-page .multithink-role__tag {
  color: var(--accent-muted);
}
.mt-page main .section {
  perspective: 1100px;
  perspective-origin: 50% 42%;
}
.mt-page main .section > .container {
  transform-origin: 50% 30%;
}
@media (prefers-reduced-motion: reduce) {
  .mt-shape__fill { animation: none; }
}
@media (max-width: 1440px) {
  .mt-shape--circle { right: 1.5%; }
  .mt-shape--square { left: 2%; }
  .mt-page {
    --mt-ramp-c: linear-gradient(227deg,
      #d2e1fe 0%, #c8d9fd 20%, #b9d0fd 42%, #aac7fc 62%, #9bbcfc 82%, #8fb4fc 100%);
  }
}
@media (max-width: 900px) {
  .mt-field { height: 200vh; }
  .mt-shape--triangle { left: -12%; top: 8vh; }
  .mt-shape--circle   { right: -6%; top: 46vh; }
  .mt-shape--square   { left: 2%; top: 90vh; }
  .mt-shape--pentagon { top: 155vh; }
}
@media (max-width: 560px) {
  .mt-shape--triangle { width: 200px; left: -20%; }
  .mt-shape--circle   { width: 196px; right: -24%; }
  .mt-shape--pentagon { width: 180px; right: -4%; }
  .mt-page {
    --mt-ramp-d: linear-gradient(150deg,
      #d2e1fe 0%, #c8d9fd 18%, #b9d0fd 40%, #aac7fc 62%, #9bbcfc 82%, #8fb4fc 100%);
    --mt-ramp-b: linear-gradient(138deg,
      #d2e1fe 0%, #c8d9fd 20%, #b9d0fd 42%, #aac7fc 64%, #9bbcfc 84%, #8fb4fc 100%);
  }
  .mt-shape--square   { width: 187px; left: 4%; }
}
.mt-page .multithink-figure img {
  filter: brightness(0.62) saturate(1.3) hue-rotate(-24deg);
}
.mt-page {
  --mt-ramp-f: linear-gradient(116deg,
    #d3e2fe 0%, #b7cdfd 18%, #97b5fc 38%, #739ffa 58%, #5583f9 80%, #4369f6 100%);
  --mt-ramp-h: linear-gradient(116deg,
    #dae7fe 0%, #c8d9fd 22%, #b6ccfd 45%, #a6c1fc 68%, #99b9fc 86%, #8fb4fc 100%);
  --mt-ramp-i: linear-gradient(244deg,
    #dae7fe 0%, #c8d9fd 22%, #b6ccfd 45%, #a6c1fc 68%, #99b9fc 86%, #8fb4fc 100%);
  --mt-ramp-g: linear-gradient(244deg,
    #d3e2fe 0%, #b7cdfd 18%, #97b5fc 38%, #739ffa 58%, #5583f9 80%, #4369f6 100%);
  --mt-ramp-k: linear-gradient(334deg,
    #dfeafe 0%, #cedcfe 24%, #bdd0fd 48%, #accbfc 70%, #9dbcfc 88%, #8fb4fc 100%);
}
.mt-page .section--shaped,
.mt-page .footer {
  position: relative;
  overflow-x: clip;
}
.mt-shape--hexagon,
.mt-shape--chevron,
.mt-shape--trapezoid,
.mt-shape--octagon,
.mt-shape--butterfly,
.mt-shape--crescent,
.mt-shape--leaf,
.mt-shape--arch,
.mt-shape--cross {
  position: absolute;
  z-index: -1;
  pointer-events: none;
}
.mt-shape--hexagon {
  right: 1%;
  top: 920px;
  width: clamp(214px, 23.5vw, 376px);
  aspect-ratio: 1.1547;
  transform: rotate(11deg);
}
.mt-shape--hexagon .mt-shape__fill,
.mt-shape--hexagon .mt-shape__grain {
  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
}
.mt-shape--hexagon .mt-shape__fill {
  background-image: var(--mt-flow-b), var(--mt-ramp-f);
  animation-duration: 29s;
  animation-delay: -4s;
}
.mt-shape--chevron {
  right: 0%;
  top: 300px;
  width: clamp(218px, 24vw, 382px);
  aspect-ratio: 1.15;
  transform: rotate(13deg);
}
.mt-shape--chevron .mt-shape__fill,
.mt-shape--chevron .mt-shape__grain {
  clip-path: polygon(100% 0%, 55% 0%, 0% 50%, 55% 100%, 100% 100%, 45% 50%);
}
.mt-shape--chevron .mt-shape__fill {
  background-image: var(--mt-flow-c), var(--mt-ramp-f);
  animation-duration: 33s;
  animation-delay: -17s;
}
.mt-shape--chevron .mt-shape__grain {
  inset: 0;
  -webkit-mask-image:
    radial-gradient(13% 12% at 60% 16%, #000 0 40%, transparent 100%),
    radial-gradient(13% 12% at 60% 84%, #000 0 40%, transparent 100%);
  mask-image:
    radial-gradient(13% 12% at 60% 16%, #000 0 40%, transparent 100%),
    radial-gradient(13% 12% at 60% 84%, #000 0 40%, transparent 100%);
}
.mt-shape--trapezoid {
  right: 1%;
  top: 30px;
  width: clamp(210px, 23vw, 366px);
  aspect-ratio: 1.06;
  transform: rotate(14deg);
}
.mt-shape--trapezoid .mt-shape__fill,
.mt-shape--trapezoid .mt-shape__grain {
  clip-path: polygon(22% 0%, 78% 0%, 100% 100%, 0% 100%);
}
.mt-shape--trapezoid .mt-shape__fill {
  background-image: var(--mt-flow-d), var(--mt-ramp-f);
  animation-duration: 27s;
  animation-delay: -13s;
}
.mt-shape--trapezoid .mt-shape__grain {
  inset: 16% 14% 8%;
}
.mt-shape--octagon {
  right: 1%;
  top: 300px;
  width: clamp(216px, 23.8vw, 380px);
  aspect-ratio: 1;
  transform: rotate(-9deg);
}
.mt-shape--octagon .mt-shape__fill,
.mt-shape--octagon .mt-shape__grain {
  clip-path: polygon(29.3% 0%, 70.7% 0%, 100% 29.3%, 100% 70.7%,
                     70.7% 100%, 29.3% 100%, 0% 70.7%, 0% 29.3%);
}
.mt-shape--octagon .mt-shape__fill {
  background-image: var(--mt-flow-e), var(--mt-ramp-h);
  animation-duration: 30s;
  animation-delay: -22s;
}
.mt-shape--butterfly {
  left: 50%;
  top: 372px;
  width: clamp(330px, 52vw, 840px);
  aspect-ratio: 1.3548;
  transform: translateX(-50%);
}
.mt-shape--butterfly .mt-shape__fill,
.mt-shape--butterfly .mt-shape__grain {
  clip-path: url(#mt-butterfly);
}
.mt-shape--butterfly .mt-shape__fill {
  background-image: var(--mt-flow-a), var(--mt-ramp-k);
  animation-duration: 39s;
  animation-delay: -25s;
}
.mt-shape--butterfly .mt-shape__blur {
  filter: blur(2px);
}
.mt-shape--butterfly .mt-shape__grain {
  inset: 0;
  -webkit-mask-image: radial-gradient(38% 36% at 50% 50%, #000 0 20%, transparent 82%);
  mask-image: radial-gradient(38% 36% at 50% 50%, #000 0 20%, transparent 82%);
}
.mt-shape--crescent {
  left: 1%;
  top: 1540px;
  width: clamp(206px, 22.6vw, 360px);
  aspect-ratio: 1;
  transform: rotate(-12deg);
}
.mt-shape--crescent .mt-shape__fill,
.mt-shape--crescent .mt-shape__grain {
  border-radius: 50%;
}
.mt-shape--crescent .mt-shape__fill {
  background-image: var(--mt-flow-b), var(--mt-ramp-g);
  animation-duration: 32s;
  animation-delay: -6s;
  -webkit-mask-image: radial-gradient(58% 58% at 72% 36%, transparent 0 98%, #000 100%);
  mask-image: radial-gradient(58% 58% at 72% 36%, transparent 0 98%, #000 100%);
}
.mt-shape--crescent .mt-shape__grain {
  inset: 0;
  -webkit-mask-image:
    radial-gradient(60% 60% at 72% 36%, transparent 0 98%, #000 100%),
    radial-gradient(closest-side, #000 62%, transparent 100%);
  mask-image:
    radial-gradient(60% 60% at 72% 36%, transparent 0 98%, #000 100%),
    radial-gradient(closest-side, #000 62%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}
.mt-shape--leaf {
  left: 0%;
  top: 928px;
  width: clamp(200px, 22vw, 348px);
  aspect-ratio: 1;
  transform: rotate(-24deg);
}
.mt-shape--leaf .mt-shape__fill,
.mt-shape--leaf .mt-shape__grain {
  border-radius: 4% 100% 4% 100%;
}
.mt-shape--leaf .mt-shape__fill {
  background-image: var(--mt-flow-e), var(--mt-ramp-g);
  animation-duration: 35s;
  animation-delay: -19s;
}
.mt-shape--leaf .mt-shape__grain {
  inset: 15%;
}
.mt-shape--arch {
  left: 6%;
  top: 961px;
  width: clamp(212px, 23.4vw, 372px);
  aspect-ratio: 2;
  transform: rotate(70deg);
}
.mt-shape--arch .mt-shape__fill,
.mt-shape--arch .mt-shape__grain {
  border-radius: 100% 100% 0 0 / 100% 100% 0 0;
}
.mt-shape--arch .mt-shape__fill {
  background-image: var(--mt-flow-a), var(--mt-ramp-i);
  animation-duration: 30s;
  animation-delay: -11s;
}
.mt-shape--arch .mt-shape__grain {
  inset: 22% 12% 6%;
}
.mt-shape--cross {
  left: 1%;
  top: 340px;
  width: clamp(196px, 21.4vw, 342px);
  aspect-ratio: 1;
  transform: rotate(16deg);
}
.mt-shape--cross .mt-shape__fill,
.mt-shape--cross .mt-shape__grain {
  clip-path: polygon(35% 0%, 65% 0%, 65% 35%, 100% 35%, 100% 65%, 65% 65%,
                     65% 100%, 35% 100%, 35% 65%, 0% 65%, 0% 35%, 35% 35%);
}
.mt-shape--cross .mt-shape__fill {
  background-image: var(--mt-flow-d), var(--mt-ramp-g);
  animation-duration: 38s;
  animation-delay: -27s;
}
.mt-shape--cross .mt-shape__grain {
  inset: 12%;
}


/* Phones: the field shapes are scenery. At this width they land behind
   body text, so they step well back. */
@media (max-width: 640px) {
  .mt-shape,
  [class*="mt-shape--"] {
    opacity: 0.32;
  }
}

/* Phones: no filter: blur() at all. iOS Safari paints a blurred layer
   tile by tile, and with the fill's background animating underneath it,
   tiles went stale: the circle, which hangs off the right edge, showed
   its unrounded fill as hard rectangles beside it that shifted while
   scrolling. The soft edge comes from a mask instead, which is painted
   in one pass. Polygons keep a crisp edge; at this opacity it reads the
   same. */
@media (max-width: 640px) {
  .mt-shape__blur,
  .mt-shape--butterfly .mt-shape__blur {
    filter: none;
  }
  .mt-shape--circle .mt-shape__fill {
    -webkit-mask-image: radial-gradient(closest-side, #000 calc(100% - 14px), transparent);
    mask-image: radial-gradient(closest-side, #000 calc(100% - 14px), transparent);
  }
  .mt-shape--square .mt-shape__fill {
    -webkit-mask-image:
      linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 12px), transparent),
      linear-gradient(180deg, transparent, #000 12px, #000 calc(100% - 12px), transparent);
    mask-image:
      linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 12px), transparent),
      linear-gradient(180deg, transparent, #000 12px, #000 calc(100% - 12px), transparent);
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
  }
}