/* Localized supports are measured from the text. Original artwork stays intact. */
[data-readability] .scene-copy{isolation:isolate}
[data-readability="lateral"]{
  --readability-top-rgb:222 237 252;
  --readability-top-height:0px;
  --readability-top-alpha:0;
}
[data-readability-surface],
[data-readability="lateral"] .scene-copy:not([data-readability-ready="true"])::before,
[data-readability="title"] .scene-copy:not([data-readability-ready="true"]) h2::before{
  position:absolute;
  display:block;
  z-index:-1;
  pointer-events:none;
  user-select:none;
  margin:0;
  padding:0;
  border:0;
  background:rgb(var(--readability-surface-rgb) / var(--readability-surface-alpha));
  /* Four linear alpha ramps, combined by multiplication. No image blur. */
  -webkit-mask-image:
    linear-gradient(to right,transparent 0,#000 var(--readability-fade-left),#000 calc(100% - var(--readability-fade-right)),transparent 100%),
    linear-gradient(to bottom,transparent 0,#000 var(--readability-fade-top),#000 calc(100% - var(--readability-fade-bottom)),transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(to right,transparent 0,#000 var(--readability-fade-left),#000 calc(100% - var(--readability-fade-right)),transparent 100%),
    linear-gradient(to bottom,transparent 0,#000 var(--readability-fade-top),#000 calc(100% - var(--readability-fade-bottom)),transparent 100%);
  mask-composite:intersect;
}

/* These local supports remain available while fonts/modules load and without JS.
   Only a successfully decorated copy replaces its own CSS fallback. */
[data-readability="lateral"] .scene-copy:not([data-readability-ready="true"])::before{
  content:"";
  --readability-surface-rgb:252 250 247;--readability-surface-alpha:.58;
  --readability-fade-left:0px;--readability-fade-right:48px;
  --readability-fade-top:24px;--readability-fade-bottom:0px;
  top:-24px;bottom:-48px;left:calc(-1 * min(84.334px,var(--gutter)));right:-48px;
}
.service-marque[data-readability="lateral"] .scene-copy:not([data-readability-ready="true"])::before{
  left:-48px;right:calc(-1 * min(84.334px,var(--gutter)));
  --readability-fade-left:48px;--readability-fade-right:0px;
}
[data-readability="title"] .scene-copy h2{position:relative}
[data-readability="title"] .scene-copy:not([data-readability-ready="true"]) h2::before{
  content:"";inset:-8px -12px;
  --readability-surface-rgb:252 250 247;--readability-surface-alpha:.55;
  --readability-fade-left:12px;--readability-fade-right:12px;
  --readability-fade-top:8px;--readability-fade-bottom:8px;
}

/* Retain the separately approved navigation wash on mobile Marque. */
@media(max-width:699px){
  [data-readability="lateral"] .scene-copy:not([data-readability-ready="true"])::before,
  .service-marque[data-readability="lateral"] .scene-copy:not([data-readability-ready="true"])::before{
    left:calc(-1 * min(84.334px,var(--gutter)));right:-16px;bottom:-32px;
    --readability-fade-left:0px;--readability-fade-right:16px;
  }
  [data-readability-pilot="marque-mobile"]{--readability-top-height:120px;--readability-top-alpha:.85}
  [data-readability-pilot="marque-mobile"]::before{
    content:"";position:absolute;inset:0 0 auto;height:var(--readability-top-height);
    z-index:0;pointer-events:none;
    background:linear-gradient(to bottom,rgb(var(--readability-top-rgb) / var(--readability-top-alpha)),rgb(var(--readability-top-rgb) / 0));
  }
}
