/* Organic data flow: a quiet, consistent field behind the homepage content. */
.homepage-trace{--bg:#fcfdfb}
.homepage-trace .site-mast{background:#fcfdfb}
.homepage-trace .mast-art:before{
  background-image:url('./flow-light.png');background-size:cover;
  background-position:78% center;opacity:.25;filter:none;mix-blend-mode:multiply;
  mask-image:linear-gradient(110deg,transparent 18%,#000 100%);
}
.homepage-trace .site-mast .nav-links>a:not(.nav-cta),
.homepage-trace .site-mast .frame-caption{color:var(--body)}
.homepage-trace .payment-spread-section{position:relative;isolation:isolate;background:#fcfdfb}
.homepage-trace .reveal{background:#fcfdfb}
.homepage-trace .faq{position:relative;isolation:isolate;background:#fff}
.homepage-trace .footer{position:relative;isolation:isolate;background:#fff}
.homepage-trace .payment-spread-section:before,
.homepage-trace .reveal:before,
.homepage-trace .faq:before,
.homepage-trace .footer:before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  background-image:url('./flow-light.png');background-repeat:no-repeat;
  mix-blend-mode:multiply;
}
/* A quiet field behind the animation, with the strongest fade around its labels. */
.homepage-trace .payment-spread-section:before{
 inset:0;background-size:cover;background-position:center 65%;opacity:.25;
 mask-image:radial-gradient(ellipse 48% 55% at 48% 44%,transparent 18%,rgba(0,0,0,.2)58%,#000 100%);
}
.homepage-trace .reveal:before{
 inset:0 0 auto;height:820px;background-size:1600px auto;background-position:right top;
 opacity:.25;mask-image:linear-gradient(180deg,#000 55%,transparent);
}
.homepage-trace .faq:before{
 inset:0 56% 0 0;background-size:1250px auto;background-position:right bottom;
 transform:scale(-1);opacity:.25;
 mask-image:radial-gradient(ellipse 110% 90% at 100% 50%,#000 15%,transparent 95%);
}
.homepage-trace .footer:before{
 inset:0 60% 0 0;background-size:1000px auto;background-position:right 80%;
 transform:scale(-1);opacity:.2;
 mask-image:linear-gradient(90deg,transparent,#000);
}
/* The closing invitation carries the same soft field as the video section. */
.homepage-trace .closing{background:#fcfdfb}
.homepage-trace .closing:before{
  background-image:url('./flow-light.png');background-size:1440px auto;
  background-position:right 70%;opacity:.25;filter:none;mix-blend-mode:multiply;
  mask-image:linear-gradient(90deg,transparent 5%,#000 80%);
}
@media(max-width:900px){.homepage-trace .faq:before{display:none}}
@media(max-width:700px){
 .homepage-trace .payment-spread-section:before{background-size:auto 560px;background-position:75% 50%;opacity:.2;mask-image:linear-gradient(180deg,transparent 48%,rgba(0,0,0,.08)76%,#000 100%)}
 .homepage-trace .mast-art:before{height:auto;background-size:1100px auto;background-position:right 70px;opacity:.2;mask-image:linear-gradient(90deg,transparent 10%,rgba(0,0,0,.15)75%,#000 100%)}
 .homepage-trace .reveal:before{height:500px;background-size:1000px auto;opacity:.2}
 .homepage-trace .closing:before{background-size:1100px auto;background-position:74% 72%;opacity:.2;mask-image:linear-gradient(90deg,transparent,#000)}
 .homepage-trace .footer:before{inset:0 0 auto;height:120px;transform:none;background-position:right 65%;opacity:.2;mask-image:linear-gradient(180deg,#000,transparent)}
}