/* Game-day campus cinema, sized from the runner; the page grid returns on exit. */
.grid-home #wp-content [data-yta-marketing='main'] .friends-cinema {
  position: relative;
  z-index: 26;
  scroll-margin-top: 100px;
  max-width: none;
  width: 100%;
  margin: 64px auto 96px;
  --friends-shift: 1;
  --friends-copy: 1;
  --friends-backdrop: 0;
  --friends-accents: 0;
  --friends-film-width: 30%;
  --friends-film-height: 90%;
  --friends-stage-height: 620px;
}
[data-friends-cinema] .friends-surround {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 40%, #293b54, #101f34 78%);
  opacity: var(--friends-backdrop);
  visibility: hidden;
}
[data-friends-cinema].cinema-motion .friends-surround {
  visibility: visible;
}
[data-friends-cinema] .friends-banner {
  position: absolute;
  top: 94px;
  width: clamp(100px, 13vw, 200px);
  height: clamp(160px, 23vw, 340px);
  padding: 30px 12px 55px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: #e8b955;
  color: #17283e;
  border-top: 8px solid #f8e6b7;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 84%, 0 100%);
  font:
    900 clamp(30px, 4vw, 64px)/1 Impact,
    'Arial Black',
    sans-serif !important;
  letter-spacing: -0.03em;
  text-align: center;
  opacity: var(--friends-accents);
  transform-origin: top center;
  transform: translateY(calc((1 - var(--friends-accents)) * -55px)) rotate(-7deg);
}
[data-friends-cinema] .friends-banner span {
  padding-top: 12px;
  border-top: 2px solid currentColor;
  font:
    800 clamp(10px, 1vw, 14px)/1.2 'Inter Tight',
    sans-serif !important;
  letter-spacing: 0.12em;
}
[data-friends-cinema] .friends-banner:first-child {
  left: 24px;
}
[data-friends-cinema] .friends-banner:nth-child(2) {
  right: 24px;
  background: #ce5a40;
  color: #fff1cd;
  border-top-color: #ed9e71;
  transform: translateY(calc((1 - var(--friends-accents)) * -55px)) rotate(7deg);
}
[data-friends-cinema] .friends-stripes {
  position: absolute;
  bottom: 8%;
  left: -50px;
  width: clamp(180px, 24vw, 400px);
  height: 92px;
  border-block: 14px solid #e8b955;
  background: linear-gradient(transparent 40%, #e8b955 40% 60%, transparent 60%);
  opacity: var(--friends-accents);
  transform: rotate(-32deg);
}
[data-friends-cinema] .friends-stripes:last-child {
  left: auto;
  right: -50px;
  transform: rotate(32deg);
}
[data-friends-cinema] .friends-pin {
  z-index: 1;
}
[data-friends-cinema].is-pinned {
  height: calc(var(--friends-pin-height) + 95svh);
}
[data-friends-cinema].is-pinned .friends-pin {
  position: sticky;
  top: var(--friends-pin-top, 96px);
}
.grid-home #wp-content [data-yta-marketing='main'] [data-friends-cinema] .amy-friends-section {
  display: block;
  position: relative;
  width: 100%;
  max-width: none;
  height: var(--friends-stage-height);
  min-height: 400px;
  margin: 0;
  isolation: isolate;
  perspective: 1600px;
  background: linear-gradient(125deg, #e7bd68, #f4e5bd 58%, #edcf8f) !important;
  border: 3px solid #17283e;
  border-radius: calc(12px + var(--friends-shift) * 26px) 12px
    calc(12px + var(--friends-shift) * 26px) 12px;
  box-shadow: 10px 12px 0 #0b192b55;
}
[data-friends-cinema] .amy-friends-section::before {
  content: '';
  position: absolute;
  inset: 14px;
  border: 2px solid #17283e25;
  border-top: 8px solid #17283e;
  border-radius: inherit;
  pointer-events: none;
  opacity: var(--friends-copy);
}
.grid-home [data-friends-cinema] .use-case-film {
  position: absolute;
  z-index: 2;
  top: 5%;
  left: calc(
    (1 - var(--friends-shift)) * (50% - var(--friends-film-width) / 2) + var(--friends-shift) * 6%
  );
  width: var(--friends-film-width);
  height: var(--friends-film-height);
  max-height: 90%;
  margin: 0;
  padding: 0;
  display: block;
  overflow: hidden;
  border: 4px solid #fff0c9;
  border-radius: calc(14px + var(--friends-shift) * 28px) 14px
    calc(14px + var(--friends-shift) * 28px) 14px;
  background: #17283e;
  transform: rotateY(calc(var(--friends-shift) * 10deg)) rotateZ(calc(var(--friends-shift) * -2deg));
  box-shadow: 0 24px 48px -20px #3c493c66;
}
.grid-home [data-friends-cinema] .use-case-film video {
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  object-fit: cover;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
}
.grid-home [data-friends-cinema].friends-enhanced:not(.film-ready) video {
  opacity: 0;
}
.grid-home [data-friends-cinema].film-ready video {
  opacity: 1;
}
[data-friends-cinema] .friends-poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  visibility: hidden;
}
[data-friends-cinema].friends-enhanced:not(.film-ready) .friends-poster {
  visibility: visible;
}
[data-friends-cinema].film-ready .friends-poster {
  visibility: hidden;
}
.grid-home [data-friends-cinema] .use-case-film figcaption {
  position: absolute;
  bottom: 32px;
  left: 12px;
  right: 12px;
  margin: 0;
  color: white;
  text-shadow: 0 1px 6px #000;
  font-size: 11px;
  pointer-events: none;
}
.grid-home [data-friends-cinema] .use-case-friends-copy {
  position: absolute;
  inset: 0 7% 0 47%;
  padding: 30px 0;
  opacity: var(--friends-copy);
  transform: translateY(calc((1 - var(--friends-copy)) * 28px));
}
[data-friends-cinema] .use-case-friends-copy:focus-within {
  opacity: 1;
  transform: none;
}
.grid-home #wp-content [data-yta-marketing='main'] [data-friends-cinema] .use-case-friends-copy h2 {
  font-size: clamp(32px, 4.3vw, 62px) !important;
}
[data-friends-cinema] .friends-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
[data-friends-cinema] .friends-campus-note {
  display: none;
}
[data-friends-cinema] .friends-crest {
  width: 44px;
  height: 50px;
  margin-bottom: 22px;
  display: grid;
  place-items: center;
  color: #f7e6bb;
  background: #17283e;
  font:
    900 28px Impact,
    'Arial Black',
    sans-serif !important;
  border: 3px solid #17283e;
  outline: 2px solid #17283e;
  outline-offset: 3px;
  border-radius: 3px;
}
@media (max-width: 899px) {
  .grid-home
    #wp-content
    [data-yta-marketing='main']
    [data-friends-cinema]
    .use-case-friends-copy
    h2 {
    font-size: 34px !important;
  }
  [data-friends-cinema] .friends-crest {
    margin-bottom: 12px;
  }
}
@media (max-width: 600px) {
  [data-friends-cinema] .friends-campus-note {
    display: block;
    position: absolute;
    top: 100px;
    right: 24px;
    padding: 20px 8px 30px;
    background: #17283e;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 89%, 0 100%);
    color: #f7e6bb;
    font:
      900 30px/1 Impact,
      'Arial Black',
      sans-serif !important;
    letter-spacing: 0.02em;
    transform: rotate(6deg);
    opacity: var(--friends-copy);
  }
  .grid-home [data-friends-cinema] .use-case-film figcaption {
    font-size: 9px !important;
    line-height: 1.35;
    bottom: 38px;
  }
  .grid-home #wp-content [data-yta-marketing='main'] [data-friends-cinema] .amy-friends-section {
    height: auto;
    min-height: 0;
    padding-top: calc(var(--friends-film-height) + 42px);
    border-radius: calc(12px + var(--friends-shift) * 16px) 12px 28px 12px;
  }
  .grid-home [data-friends-cinema] .use-case-film {
    top: 24px;
    max-height: none;
  }
  .grid-home [data-friends-cinema] .use-case-friends-copy {
    position: relative;
    inset: auto;
    padding: 12px 28px 32px;
  }
  .grid-home
    #wp-content
    [data-yta-marketing='main']
    [data-friends-cinema]
    .use-case-friends-copy
    h2 {
    font-size: 34px !important;
  }
  [data-friends-cinema] .friends-crest {
    display: none;
  }
  [data-friends-cinema] .friends-banner {
    width: 80px;
    height: 145px;
    padding: 18px 8px 30px;
    top: 82px;
  }
  [data-friends-cinema] .friends-banner:first-child {
    left: 6px;
  }
  [data-friends-cinema] .friends-banner:nth-child(2) {
    right: 6px;
  }
  [data-friends-cinema] .friends-stripes {
    bottom: 4%;
    height: 60px;
    border-block-width: 8px;
  }
  .grid-home [data-friends-cinema] .use-case-watch {
    min-height: 44px;
  }
}
@media (prefers-reduced-motion: reduce), print {
  [data-friends-cinema] .friends-surround {
    display: none;
  }
  .grid-home [data-friends-cinema] .use-case-film,
  .grid-home [data-friends-cinema] .use-case-friends-copy {
    transform: none;
  }
  [data-friends-cinema] .friends-pin {
    position: relative !important;
    top: 0 !important;
  }
}