/* Protect the copy while leaving the center and right of the original footage visible. */
html body #main :is(.cine-hero,.cine-live-band){--video-shade-rgb:0,0,0;--video-shade-bottom-rgb:0,0,0}
html body.dulce-site #main .cine-hero{--video-shade-rgb:12,16,37;--video-shade-bottom-rgb:8,11,28}
html[data-experience="family"] body #main .cine-family{--video-shade-rgb:17,43,53;--video-shade-bottom-rgb:20,46,70}

html body #main .cine-hero:not(.cine-short)>.cine-shade,
html body #main .cine-live-band>.cine-shade{
 background:linear-gradient(90deg,rgba(var(--video-shade-rgb),.70) 0%,rgba(var(--video-shade-rgb),.62) 35%,rgba(var(--video-shade-rgb),.26) 60%,rgba(var(--video-shade-rgb),.06) 82%,rgba(var(--video-shade-rgb),.02) 100%),linear-gradient(0deg,rgba(var(--video-shade-bottom-rgb),.50),rgba(var(--video-shade-bottom-rgb),0) 36%)!important;
}

/* The mobile short-player matte starts below the video and remains unchanged. */
@media(min-width:761px){
 html body #main .cine-hero.cine-short>.cine-shade{
  background:linear-gradient(90deg,rgba(var(--video-shade-rgb),.70) 0%,rgba(var(--video-shade-rgb),.62) 35%,rgba(var(--video-shade-rgb),.26) 60%,rgba(var(--video-shade-rgb),.06) 82%,rgba(var(--video-shade-rgb),.02) 100%),linear-gradient(0deg,rgba(var(--video-shade-bottom-rgb),.50),rgba(var(--video-shade-bottom-rgb),0) 36%)!important;
 }
}

html body #main .institutional-hero::after{
 background:linear-gradient(90deg,rgba(22,22,22,.74) 0%,rgba(22,22,22,.64) 30%,rgba(22,22,22,.32) 52%,rgba(22,22,22,.06) 78%,rgba(22,22,22,.03) 100%),linear-gradient(0deg,rgba(22,22,22,.45),rgba(22,22,22,0) 28%);
}

html body #main .contact-hero::before{
 background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.58) 40%,rgba(0,0,0,.10) 78%,rgba(0,0,0,.05) 100%),linear-gradient(0deg,rgba(0,0,0,.18),transparent 32%);
}

html body #main .dulce-premiere-shade{
 background:linear-gradient(180deg,rgba(18,17,28,.30) 0%,rgba(18,17,28,.06) 34%,rgba(18,17,28,.25) 58%,rgba(18,17,28,.78) 100%),linear-gradient(90deg,rgba(18,17,28,.18),rgba(18,17,28,.02) 60%);
}

/* These shadows affect only copy painted over a video, never logos or controls. */
html body #main .cine-hero:not(.cine-short) h1,
html body #main .cine-live-band h2,
html body #main .institutional-hero h1,
html body #main .contact-hero h1,
html body #main .dulce-premiere-door-copy h2{
 text-shadow:0 2px 10px rgba(0,0,0,.40);
}
html body #main .cine-hero:not(.cine-short) .cine-hero-bottom>p,
html body #main .cine-live-band .cine-kicker,
html body #main .institutional-hero-copy>p,
html body #main .contact-hero-description,
html body #main .dulce-premiere-description{
 text-shadow:0 1px 3px rgba(0,0,0,.65);
}

@media(max-width:800px){
 html body #main .contact-hero::before{
  background:linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(0,0,0,.54) 42%,rgba(0,0,0,.15) 76%,rgba(0,0,0,.08) 100%);
 }
}

@media(max-width:760px){
 /* Full-width mobile copy needs protection across the complete picture. */
 html body #main .cine-hero:not(.cine-short)>.cine-shade,
 html body #main .cine-live-band>.cine-shade{
  background:linear-gradient(180deg,rgba(var(--video-shade-rgb),.28) 0%,rgba(var(--video-shade-rgb),.52) 38%,rgba(var(--video-shade-bottom-rgb),.68) 100%)!important;
 }
 /* Events and Films place their mobile copy below the 16:9 picture. */
 html body.dulce-site #main .cine-hero:not(.cine-short)>.cine-shade{
  background:linear-gradient(180deg,rgba(var(--video-shade-rgb),.06),rgba(var(--video-shade-rgb),0) 55%,rgba(var(--video-shade-bottom-rgb),.22))!important;
 }
 /* Remove the extra fade on the whole About media layer, not its changing frames. */
 html body #main .institutional-hero-media{opacity:1}
 html body #main .institutional-hero::after{
  background:linear-gradient(90deg,rgba(22,22,22,.68),rgba(22,22,22,.20)),linear-gradient(0deg,rgba(22,22,22,.35) 0%,rgba(22,22,22,.18) 35%,rgba(22,22,22,0) 65%);
 }
 /* The universe copy is already below these mobile previews on its dark panel. */
 html body #main .dulce-premiere-shade{
  background:linear-gradient(180deg,rgba(18,17,28,.16),transparent 45%,rgba(18,17,28,.24));
 }
 html body #main .dulce-premiere-door-copy :is(h2,p){text-shadow:none}
}