/* Only the two leading CCTV sections: copy on the left, scroll-controlled UI on the right. */
.cc-watch-page .cc-scroll-section {
  --cc-travel: 480px;
  position: relative;
  display: block;
  height: calc(100svh - 64px + var(--cc-travel));
  min-height: 0;
  padding: 0;
  overflow: visible;
}
.cc-watch-page .cc-scroll-sticky {
  position: sticky;
  top: 64px;
  height: calc(100svh - 64px);
  min-height: 620px;
  display: flex;
  align-items: center;
}
.cc-watch-page .cc-scroll-grid {
  width: min(1420px, calc(100% - 96px));
  display: grid;
  grid-template-columns: minmax(270px, .75fr) minmax(0, 2.15fr);
  gap: 52px;
  align-items: center;
}
.cc-watch-page .cc-scroll-copy {
  position: relative;
  display: block;
  padding: 0;
  min-width: 0;
}
.cc-watch-page .cc-scroll-copy h1,
.cc-watch-page .cc-scroll-copy h2 {
  font-size: clamp(28px, 2.25vw, 34px) !important;
  line-height: 1.48 !important;
  letter-spacing: -.045em !important;
  font-weight: 550 !important;
  word-break: keep-all;
  margin: 0 !important;
}
.cc-watch-page .cc-scroll-copy h2 em { color: #4c00ff; font-style: normal; }
.cc-watch-page .cc-scroll-copy .hm-hero-actions { margin-top: 36px; }
.cc-watch-page .cc-scroll-copy .hm-button { padding: 12px 17px; font-size: 13px; }
.cc-watch-page .cc-scroll-section .hm-scene { width: 100%; max-width: none; margin: 0; aspect-ratio: auto; }
.cc-watch-page .cc-scroll-copy #cmLangSwitch.hm-language { top: -62px !important; left: 0 !important; right: auto !important; }
.cc-scroll-steps { display: flex; gap: 16px; margin-top: 32px; }
.cc-scroll-steps button { flex: 1; min-width: 0; background: none; border: 0; padding: 0; text-align: left; font-size: 12px; color: #9a90a5; cursor: pointer; }
.cc-scroll-steps i { display: block; height: 2px; background: #e7e1ee; margin-bottom: 11px; }
.cc-scroll-steps [aria-current] { color: #4c00ff; }
.cc-scroll-steps [aria-current] i { background: #4c00ff; }
.cc-watch-page .cc-watch-layout { grid-template-columns: minmax(0, 1fr) 250px; }
.cc-watch-page .cc-watch-bar { padding: 17px 19px; }
.cc-watch-page .cc-watch-alerts { padding: 18px 12px; }
.cc-watch-page .cc-watch-list { gap: 8px; }
.cc-watch-page .cc-watch-event { min-height: 85px; padding: 7px; gap: 9px; }
.cc-watch-page .hm-scene .cc-watch-event > svg { width: 68px !important; height: 62px !important; }
.cc-watch-page .cc-watch-event-copy strong { font-size: 12px; }
.cc-watch-page .cc-watch-event-copy > span { font-size: 10px; }
.cc-watch-page .cc-watch-task { margin-top: 18px; padding: 13px 5px 0; border-top: 1px solid #eee8f4; }
.cc-watch-page .cc-watch-task-title { font-size: 13px; }
.cc-watch-event:disabled { cursor: default; pointer-events: none; }
.cc-watch-page .cc-watch-footer { padding: 12px 18px; }
@media (min-width: 761px) and (max-width: 1150px) {
  .cc-watch-page .cc-scroll-grid { width: calc(100% - 56px); grid-template-columns: 255px minmax(0, 1fr); gap: 28px; }
  .cc-watch-page .cc-scroll-copy h1, .cc-watch-page .cc-scroll-copy h2 { font-size: 27px !important; }
  .cc-watch-page .cc-watch-layout { grid-template-columns: minmax(0, 1fr) 208px; }
  .cc-watch-page .hm-scene .cc-watch-event > svg { width: 51px !important; height: 56px !important; }
  .cc-watch-page .cc-watch-event { gap: 7px; min-height: 78px; }
}
@media (min-width: 761px) and (max-height: 700px) {
  .cc-watch-page .cc-scroll-sticky { min-height: 560px; }
}
@media (max-width: 760px) {
  .cc-watch-page .cc-scroll-section { --cc-travel: 380px; }
  .cc-watch-page .cc-scroll-sticky { height: auto; min-height: calc(100svh - 64px); padding-block: 24px; box-sizing: border-box; }
  .cc-watch-page .cc-scroll-grid { width: calc(100% - 32px); grid-template-columns: 1fr; gap: 24px; }
  .cc-watch-page .cc-scroll-copy h1, .cc-watch-page .cc-scroll-copy h2 { font-size: 24px !important; line-height: 1.4 !important; }
  .cc-watch-page .cc-scroll-copy .hm-hero-actions { position: absolute; right: 0; bottom: 1px; margin: 0; }
  .cc-watch-page .cc-scroll-copy .hm-button { min-height: 33px; font-size: 10px; padding: 8px 10px; gap: 6px; }
  .cc-scroll-steps { margin-top: 17px; max-width: 212px; gap: 13px; }
  .hm-hero .cc-scroll-steps { width: calc(100% - 112px); }
  .cc-scroll-steps button { font-size: 10px; }
  .cc-scroll-steps i { margin-bottom: 7px; }
    .cc-watch-page .cc-scroll-copy #cmLangSwitch.hm-language { top: -34px !important; right: 0 !important; left: auto !important; }
  .cc-watch-page .cc-watch-layout { grid-template-columns: 1fr; }
  .cc-watch-page .cc-watch-bar { padding: 12px; }
  .cc-watch-page .cc-watch-alerts { padding: 10px; }
  .cc-watch-page .cc-watch-list { gap: 6px; }
  .cc-watch-page .cc-watch-event { min-height: 0; padding: 5px; }
  .cc-watch-page .hm-scene .cc-watch-event > svg { width: 100% !important; height: 47px !important; }
  .cc-watch-page .cc-watch-event-copy strong { font-size: 10px; }
  .cc-watch-page .cc-watch-event-copy > span { font-size: 9px; }
  .cc-watch-page .cc-watch-task { margin-top: 11px; padding-top: 9px; }
  .cc-watch-page .cc-watch-task-title { font-size: 12px; }
  .cc-watch-page .cc-watch-footer { padding: 9px 11px; }
  .cc-connect-section .cc-scroll-steps { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .cc-watch-page .cc-scroll-section { height: auto; }
  .cc-watch-page .cc-scroll-sticky { position: relative; top: 0; height: auto; min-height: 0; padding-block: 95px; }
  .cc-scroll-steps { display: none; }
}
