/* Only decorative watercolor moves; content, pictures and diagrams retain their layout. */
[data-parallax-before]::before{translate:0 var(--parallax-before-y,0px)}
[data-parallax-after]::after{translate:0 var(--parallax-after-y,0px)}
.contact-marble[data-parallax-image]{translate:0 var(--parallax-image-y,0px)}
/* Detail pages share their parent page's watercolor vocabulary. */
.profile-hero,.project-detail{position:relative;isolation:isolate}
.profile-hero::before,.project-detail::before{content:"";position:absolute;pointer-events:none;z-index:-1;width:520px;height:520px;background:center/contain no-repeat;mix-blend-mode:multiply;opacity:.12}
.profile-hero::before{background-image:url('assets/marble_red_03.png');left:-230px;top:-70px;rotate:-32deg}
.project-detail::before{background-image:url('assets/marble_blue_04.png');right:-170px;top:20px;rotate:-26deg}
@media(max-width:820px){.profile-hero::before,.project-detail::before{width:300px;height:300px;opacity:.09}.profile-hero::before{left:-160px;top:20px}.project-detail::before{right:-150px;top:110px}}
@media(prefers-reduced-motion:reduce){[data-parallax-before]::before,[data-parallax-after]::after,.contact-marble[data-parallax-image]{translate:none!important}}
@media print{[data-parallax-before]::before,[data-parallax-after]::after,.contact-marble[data-parallax-image]{translate:none!important}}