/* Matteo Brioschi - synchronized hero sections, version 20261016.
   This is an ADDITIVE stylesheet, does not overwrite the existing styles or the video cards. */
body.page-original-scores .page-hero.page-hero-dark,
body.page-live-production .page-hero.page-hero-dark {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-sizing: border-box;
  height: 600px;
  min-height: 600px;
  padding: 74px 0;
  display: flex;
  align-items: center;
}
body.page-original-scores .page-hero.page-hero-dark > .wrap,
body.page-live-production .page-hero.page-hero-dark > .wrap {
  position: relative;
  z-index: 5;
}
body.page-original-scores .page-hero h1,
body.page-live-production .page-hero h1 {
  font-size: clamp(46px, 6.2vw, 88px);
  line-height: 1.04;
  letter-spacing: -.085em;
  max-width: 1000px;
  margin: 22px 0 28px;
}
body.page-original-scores .page-hero h1 i,
body.page-live-production .page-hero h1 i {
  display: inline-block;
  font-size: .78em;
  line-height: 1.12;
  letter-spacing: -.082em;
  font-weight: 400;
}
body.page-original-scores .page-hero p,
body.page-live-production .page-hero p {
  max-width: 650px;
  margin: 0;
  line-height: 1.85;
}
/* ORIGINAL SCORES | third video: crop native black bar out of the MP4, blend the left edge into the hero. */
body.page-original-scores .page-hero.page-hero-dark { background: #121516; }
body.page-original-scores .scores-hero-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
  background: #121516;
  isolation: isolate;
}
/* Still fallback gets exactly the same feathering as the moving image. */
body.page-original-scores .scores-hero-media::before {
  content: "";
  position: absolute;
  inset: 0 0 0 auto;
  width: 70%;
  background: url('/assets/video/scores-hero-v4-poster.jpg') center 46% / cover no-repeat;
  filter: contrast(1.04) brightness(.78) saturate(.94);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.08) 12%, rgba(0,0,0,.55) 33%, #000 66%, #000 100%);
  mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.08) 12%, rgba(0,0,0,.55) 33%, #000 66%, #000 100%);
}
/* The still is a loading fallback, NEVER a second image below the moving video.
   Otherwise the feathered edge creates a permanent double exposure of the face. */
body.page-original-scores .scores-hero-media.video-ready::before { display: none; }
body.page-original-scores .scores-hero-media video {
  position: absolute;
  inset: 0 0 0 auto;
  width: 70%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 46%;
  filter: contrast(1.04) brightness(.78) saturate(.94);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.08) 12%, rgba(0,0,0,.55) 33%, #000 66%, #000 100%);
  mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.08) 12%, rgba(0,0,0,.55) 33%, #000 66%, #000 100%);
}
/* Light extra shade over the center to protect the text, no rectangular edge. */
body.page-original-scores .scores-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(90deg, #121516 0%, rgba(18,21,22,.98) 15%, rgba(18,21,22,.47) 47%, transparent 80%),
              linear-gradient(0deg, rgba(8,10,11,.38), transparent 24%, transparent 84%, rgba(8,10,11,.2));
}
@media (max-width: 800px) {
  body.page-original-scores .page-hero.page-hero-dark,
  body.page-live-production .page-hero.page-hero-dark {height:540px;min-height:540px;padding:58px 0;}
  body.page-original-scores .page-hero h1,
  body.page-live-production .page-hero h1 {font-size:clamp(44px,8.9vw,75px);}
  body.page-original-scores .scores-hero-media::before,
  body.page-original-scores .scores-hero-media video {width:92%;object-position:62% 46%;}
  body.page-original-scores .scores-hero-media::after {
    background: linear-gradient(90deg,rgba(18,21,22,.95) 0%,rgba(18,21,22,.8) 28%,rgba(18,21,22,.46) 70%,rgba(18,21,22,.23) 100%);
  }
}
@media (max-width: 540px) {
  body.page-original-scores .page-hero.page-hero-dark,
  body.page-live-production .page-hero.page-hero-dark {height:500px;min-height:500px;padding:43px 0;}
  body.page-original-scores .page-hero h1,
  body.page-live-production .page-hero h1 {font-size:clamp(39px,10.5vw,58px);letter-spacing:-.075em;}
  body.page-original-scores .page-hero h1 i,
  body.page-live-production .page-hero h1 i {font-size:.72em;}
  body.page-original-scores .page-hero p,
  body.page-live-production .page-hero p {font-size:14px;max-width:310px;}
  body.page-original-scores .scores-hero-media::before,
  body.page-original-scores .scores-hero-media video {width:100%;object-position:57% 47%;}
  body.page-original-scores .scores-hero-media::after {
    background: linear-gradient(90deg, rgba(18,21,22,.91),rgba(18,21,22,.77) 48%,rgba(18,21,22,.46));
  }
}
@media (prefers-reduced-motion: reduce) {
  body.page-original-scores .scores-hero-media video {display:none}
}