
/* R31: shared animated three-color Earth / Moon / Mars canvas. */
:root{--earth:#d9efff;--moon:#f3f5fa;--mars:#ffe1d3}
@keyframes z-three-planets{
  0%,100%{background-position:0% 50%}
  33%{background-position:50% 50%}
  66%{background-position:100% 50%}
}
.zm-modern-sites,
.z-rf.z-product,
.z-rf.z-product .z-rf-inner,
.z-rf.z-product .z-rf-card,
.z-rf.z-product .z-rf-heading,
.z-rf.z-product .zp-header,
.z-rf.z-product .zp-body{
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
}
.zm-modern-sites,.z-rf.z-product{position:relative;isolation:isolate}
.zm-modern-sites::before,.z-rf.z-product::before{
  content:""!important;display:block!important;
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,var(--earth) 0%,var(--moon) 33%,var(--mars) 67%,var(--earth) 100%)!important;
  background-size:300% 300%!important;
  animation:z-three-planets 18s ease-in-out infinite!important;
}
.zm-modern-sites{padding-bottom:0!important}
.z-rf.z-product{margin-top:0!important;padding-top:20px!important}
.zm-modern-sites::before{bottom:-2px}
.z-rf.z-product::before{top:-2px}
.zm-modern-heading,.zm-logo-item,.z-rf.z-product{color:#17253b}
.z-rf.z-product .z-rf-card{border-radius:0!important}
@media(prefers-reduced-motion:reduce){
  .zm-modern-sites::before,.z-rf.z-product::before{animation:none!important;background-position:50% 50%!important}
}
