/* Keep the original page design; this stylesheet only places the monument. */
:root {
  --monument-ink: #142d52;
  --monument-opacity: .28;
}
body { isolation: isolate; }
/* Every content section is painted above the independent fixed background. */
body > section, body > footer {
  position: relative; z-index: 1; isolation: isolate;
}
/* Headline ink stays opaque instead of blending with the sculpture. */
.hero h1 { mix-blend-mode: normal; }
.site-background.hero-mark {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none; overflow: hidden;
  display: block; background: transparent; opacity: var(--monument-opacity);
}
.site-background.hero-mark svg {
  position: absolute; left: 56%; top: 6%; height: 80%; width: 40%;
  margin: 0; opacity: .2; color: var(--monument-ink); filter: none; transform: none;
}
.hero-mark canvas { width: 100%; height: 100%; display: block; }
.hero-mark.is-ready svg { display: none; }
@media (max-width: 767px) {
  .site-background.hero-mark svg { top: 2%; left: 24%; height: 55%; width: 68%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero .line-mask > span { transition: none; }
}
