/* This class is attached only to the section containing the page title.
   The outer chart fades before it reaches the main reading area. */
:root body main > section[data-chart-hero] {
  --chart-art:url('/assets/hero-market-blue-wide-v1.svg');
  background-color:#071a30;
  /* Dim the composited chart, grid and blue gradients below the content. */
  background-image:linear-gradient(rgb(0 0 0 / 60%),rgb(0 0 0 / 60%)),var(--chart-art),
    radial-gradient(ellipse at 100% 21%,rgba(32,89,146,.38),transparent 47%),
    radial-gradient(ellipse at 0% 60%,rgba(23,69,119,.44),transparent 42%),
    linear-gradient(168deg,#0b223d 0%,#081b33 49%,#07172b 88%,#061626 100%);
  background-position:center,center top,center,center,center;
  background-size:100% 100%,100% min(100%,740px),100% 100%,100% 100%,100% 100%;
  background-repeat:no-repeat;
}
:root body main > section[data-chart-hero]::before,
:root body main > section[data-chart-hero]::after {content:none}
:root body main > section[data-chart-hero] > :is(.scene-art,.rm-bg-glow) {display:none}
@media(max-width:700px){
  :root body main > section[data-chart-hero]{
    --chart-art:url('/assets/hero-market-blue-mobile-v1.svg');
    background-size:100% 100%,100% min(100%,680px),100% 100%,100% 100%,100% 100%;
  }
}