.simplePageMain{
  align-items:flex-start;
  padding-bottom:16px;
}

body.streamingPage{
  background-color:var(--color--ember, #3c0b13) !important;
  background-image:var(--surface--stream-stage, linear-gradient(180deg, #4b0f18 0%, #26060d 100%)) !important;
  background-position:center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

body.streamingPage .simplePageMain{
  min-height:100vh;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  padding:calc(var(--navH) + 38px) 0 75px;
  background:var(--surface--stream-stage, linear-gradient(180deg, #4b0f18 0%, #26060d 100%)) !important;
}

body.streamingPage #siteFooter.single2Section,
body.streamingPage #siteFooter.single2Section > .single2FooterMain{
  background:var(--surface--stream-stage, linear-gradient(180deg, #4b0f18 0%, #26060d 100%)) !important;
}

html[data-color-scheme]:not([data-color-scheme="default"]) body.streamingPage{
  background-color:var(--surface--scheme-stage-flat, var(--color--ember, #3c0b13)) !important;
  background-image:none !important;
}

html[data-color-scheme]:not([data-color-scheme="default"]) body.streamingPage .simplePageMain,
html[data-color-scheme]:not([data-color-scheme="default"]) body.streamingPage #siteFooter.single2Section,
html[data-color-scheme]:not([data-color-scheme="default"]) body.streamingPage #siteFooter.single2Section > .single2FooterMain{
  background:var(--surface--scheme-stage-flat, var(--surface--stream-stage, linear-gradient(180deg, #4b0f18 0%, #26060d 100%))) !important;
}

.simpleFrame{
  min-height:0;
  height:auto;
  padding:28px 26px 38px;
}

body.streamingPage .simpleFrame{
  width:min(80vw, calc(100% - 150px));
  margin-left:auto;
  margin-right:auto;
  border:1px solid rgba(245, 197, 197, .2);
  border-radius:34px;
  background:var(--surface--stream-frame, linear-gradient(180deg, rgba(109, 27, 40, .8), rgba(59, 12, 22, .82)));
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.035),
    0 22px 58px rgba(24, 3, 8, .38);
}

.simpleFrame::before{
  background: var(--all-other-frame-image, linear-gradient(#000000, #000000)) right center / cover no-repeat;
}

body.streamingPage .simpleFrame::before{
  background:none !important;
}

body.streamingPage .simpleFrame::after{
  background:var(--surface--stream-sheen,
    linear-gradient(90deg, rgba(173, 79, 96, .14) 0%, rgba(67, 14, 24, .05) 32%, rgba(67, 14, 24, .05) 68%, rgba(173, 79, 96, .14) 100%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.012))) !important;
}

.simpleContent{
  position:relative;
  z-index:2;
  width:100%;
  min-height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  padding-bottom:0;
}

body.streamingPage .single2SectionTitleDeck{
  width:min(80%, 1360px);
  align-self:center;
}

.streamingSectionTitle{
  width:100%;
}

.aiSectionIntro{
  width:min(1100px, 92%);
  margin:0 auto 18px;
  color:rgba(255,255,255,.9);
  text-align:center;
  font-size:clamp(13px, 1.05vw, 18px);
  line-height:1.48;
  font-weight:400;
}

body.streamingPage .overviewFrame{
  width:min(80%, 1360px);
  min-height:0;
  max-height:none;
  border:1px solid rgba(255,255,255,.16);
  border-radius:34px;
  background:var(--surface--stream-inner, linear-gradient(180deg, rgba(24,13,7,.97), rgba(8,4,2,.96)));
  box-shadow:0 22px 58px rgba(0,0,0,.32);
  overflow:hidden;
  padding:22px;
}

body.streamingPage .overviewFrame{
  border-color:var(--surface--panel-border);
  box-shadow:0 20px 50px rgba(0, 0, 0, .3);
}

.servicesPanel{
  width:min(72ch, 100%);
  height:100%;
  max-height:100%;
  overflow-y:auto;
  padding:18px 20px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.2);
  background:var(--surface--media-pane, linear-gradient(180deg, rgba(8,12,20,.66), rgba(8,12,20,.44)));
  box-shadow:0 16px 36px rgba(0,0,0,.28);
  margin:0 auto;
}

.servicesPanel.aiPanel{
  width:100%;
  max-width:100%;
  padding:0;
  overflow:hidden;
  border:none;
  background:transparent;
  box-shadow:none;
  border-radius:0;
}

.streamingFramePanel{
  min-height:0;
}

.streamingSectionFrame .aiCarousel{
  width:100%;
  max-width:none;
  gap:12px;
}

.streamingSectionFrame .aiCarouselViewport{
  position:relative;
  border:2px solid rgba(255,255,255,.88);
  border-radius:28px;
  background:var(--surface--media-pane, #04070d);
}

.streamingSectionFrame--empty{
  padding:22px;
}

.streamingSectionPlaceholder{
  min-height:clamp(250px, 28vw, 420px);
  border:2px solid rgba(255,255,255,.88);
  border-radius:28px;
  background:var(--surface--stream-placeholder, linear-gradient(180deg, rgba(39, 8, 14, .72), rgba(16, 3, 7, .6)));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.streamingSectionMedia{
  display:block;
  width:100%;
  min-height:clamp(250px, 28vw, 420px);
  border:2px solid rgba(255,255,255,.88);
  border-radius:28px;
  overflow:hidden;
  background:var(--surface--stream-placeholder, linear-gradient(180deg, rgba(39, 8, 14, .72), rgba(16, 3, 7, .6)));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.streamingSectionPhoto{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}

.streamingSectionLead{
  width:min(80%, 1360px);
  margin:0 auto 26px;
  color:rgba(255,255,255,.9);
  text-align:left;
  align-self:center;
}

.streamingSectionLead p{
  margin:0;
  font-size:clamp(14px, 1.04vw, 18px);
  line-height:1.62;
}

body.streamingPage .streamingSectionBody{
  width:min(80%, 1360px);
  margin:26px auto 0;
  color:rgba(255,255,255,.9);
  text-align:left;
  align-self:center;
}

.streamingSectionBody p{
  margin:0;
  font-size:clamp(14px, 1.04vw, 18px);
  line-height:1.62;
}

.streamingSectionBody p + p{
  margin-top:18px;
}

.streamingSectionSupportList{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px 34px;
  margin:24px 0 0;
  padding:0;
}

.streamingSectionSupportList li{
  position:relative;
  margin:0;
  padding-left:20px;
  font-size:clamp(14px, 1vw, 17px);
  line-height:1.52;
}

.streamingSectionSupportList li::before{
  content:"•";
  position:absolute;
  left:0;
  top:0;
  color:rgba(240, 147, 147, .96);
}

.streamingSectionCta{
  text-decoration:none;
  padding:14px 24px;
  border-radius:999px;
  font-family:inherit;
  font-size:15px;
  font-weight:700;
  line-height:1.2;
  transition:transform .25s ease, background .25s ease, border-color .25s ease, color .25s ease;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:flex-start;
  margin:34px 0 0 calc(50% + 44px);
  min-width:320px;
  letter-spacing:.01em;
  color:#ffffff;
  background:var(--menu-bar-bg, linear-gradient(90deg, #000000 0%, #0d3b66 100%)) !important;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}

.streamingSectionCta:hover,
.streamingSectionCta:focus-visible{
  transform:translateY(-1px);
  background:var(--menu-bar-bg, linear-gradient(90deg, #000000 0%, #0d3b66 100%)) !important;
  border-color:rgba(255,255,255,.32);
}

.aiTopRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) clamp(260px, 24vw, 390px);
  gap:14px;
  align-items:start;
  height:100%;
}

.aiMainPane{
  min-width:0;
  display:flex;
  justify-content:center;
}

.aiPlayerFrame{
  position:relative;
  width:min(calc(var(--hero-title-width, 538px) * var(--hero-content-scale, 1)), 100%);
  aspect-ratio:16 / 9;
  border:2px solid #fff;
  background:#000;
  box-shadow:0 14px 38px rgba(0,0,0,.42);
  overflow:hidden;
}

.aiCarousel{
  width:100%;
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:0;
}

.aiCarouselViewport{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:#000;
}

.aiCarouselTrack{
  display:flex;
  height:100%;
  transition:transform .42s ease;
  will-change:transform;
}

.aiCarouselSlide{
  position:relative;
  min-width:100%;
  height:100%;
  background:#000;
}

.aiCarouselMedia{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}

.aiCarouselCaption{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  margin:0;
  padding:6px 10px;
  border-radius:10px;
  background:rgba(0,0,0,.62);
  border:1px solid rgba(255,255,255,.25);
  color:rgba(255,255,255,.95);
  font-size:12px;
  line-height:1.3;
  text-align:center;
  pointer-events:none;
}

.aiCarouselControl{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border:none;
  border-radius:999px;
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index:3;
  font-size:22px;
  line-height:1;
  color:rgba(255,255,255,.95);
  background:rgba(7,12,20,.58);
  border:1px solid rgba(255,255,255,.34);
}

.aiCarouselControl.prev{ left:8px; }
.aiCarouselControl.next{ right:8px; }

.aiCarouselControl:hover{
  background:rgba(10,18,32,.85);
}

.aiCarouselDots{
  display:none;
}

.aiCarouselDot{
  width:9px;
  height:9px;
  border:0;
  border-radius:999px;
  padding:0;
  cursor:pointer;
  background:rgba(255,255,255,.38);
}

.aiCarouselDot.is-active{
  background:#38bdf8;
}

.aiRail{
  min-height:0;
  height:100%;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(6,10,16,.88);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.aiRailHeading{
  margin:0;
  padding:10px 12px 8px;
  border-bottom:1px solid rgba(255,255,255,.22);
  font-size:23px;
  line-height:1.05;
  letter-spacing:.03em;
  text-transform:none;
  text-align:center;
  color:rgba(255,255,255,.9);
}

.aiListFrame{
  flex:1;
  min-height:0;
  overflow:hidden;
}

.aiList{
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 2px 0 8px;
}

.aiItem{
  width:100%;
  border:none;
  border-bottom:1px solid rgba(255,255,255,.22);
  background:transparent;
  color:inherit;
  display:grid;
  grid-template-columns:minmax(106px, 42%) minmax(0, 1fr);
  align-items:start;
  gap:12px;
  text-align:left;
  cursor:pointer;
  padding:10px 0;
}

.aiItem:hover,
.aiItem:focus-visible{
  background:rgba(255,255,255,.04);
}

.aiItem.is-active{
  background:rgba(255,255,255,.07);
}

.aiItemThumbWrap{
  position:relative;
  display:block;
}

.aiItemThumb{
  display:block;
  width:100%;
  aspect-ratio:16 / 9;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.18);
  background:#060910;
}

.aiItemThumbPlay{
  position:absolute;
  left:8px;
  bottom:8px;
  width:28px;
  height:28px;
  border-radius:50%;
  background:rgba(0,0,0,.86);
}

.aiItemThumbPlay::before{
  content:"";
  position:absolute;
  left:11px;
  top:7px;
  border-style:solid;
  border-width:7px 0 7px 11px;
  border-color:transparent transparent transparent rgba(255,255,255,.95);
}

.aiItemText{
  font-family:inherit;
  font-size:clamp(14px, .95vw, 18px);
  line-height:1.22;
  font-weight:700;
  color:rgba(255,255,255,.94);
}

.aiList::-webkit-scrollbar{
  width:9px;
}

.aiList::-webkit-scrollbar-track{
  background:rgba(56,189,248,.24);
  border-radius:999px;
}

.aiList::-webkit-scrollbar-thumb{
  background:rgba(56,189,248,.92);
  border-radius:999px;
}

.servicesList{
  display:grid;
  gap:18px;
}

.serviceBlock h2{
  margin:0 0 6px;
  font-size:18px;
  line-height:1.2;
  letter-spacing:-.2px;
  color:rgba(255,255,255,.96);
}

.serviceBlock p{
  margin:0;
  font-size:14px;
  line-height:1.52;
  color:rgba(255,255,255,.86);
}

.simpleCopyright{
  display:block;
  margin:0;
  width:auto;
  text-align:left;
  position:fixed;
  left:12px;
  bottom:10px;
  z-index:140;
  pointer-events:none;
  font-size:13px;
  font-weight:400;
  letter-spacing:.02em;
  color:rgba(255,255,255,.96);
  text-shadow:0 2px 10px rgba(0,0,0,.75);
}

@media (max-width:980px){
  body.streamingPage .simplePageMain{
    padding:calc(var(--navH) + 18px) 18px 18px;
  }

  .simpleFrame{
    height:auto;
    padding:18px;
  }

  body.streamingPage .simpleFrame{
    width:100%;
  }

  .single2SectionTitleDeck{ width:100%; }

  .aiSectionIntro{
    width:100%;
    margin:0 auto 14px;
    font-size:clamp(12px, 1.7vw, 16px);
    line-height:1.42;
  }

  .overviewFrame{
    width:100%;
    min-height:0;
    max-height:none;
    padding:12px;
  }

  .servicesPanel{
    width:100%;
    max-height:100%;
    padding:14px;
  }

  .servicesPanel.aiPanel{
    padding:0;
  }

  .streamingSectionFrame .aiCarouselViewport{
    border-radius:18px;
  }

  .streamingSectionPlaceholder{
    min-height:clamp(180px, 34vw, 300px);
    border-radius:18px;
  }

  .streamingSectionMedia{
    min-height:clamp(180px, 34vw, 300px);
    border-radius:18px;
  }

  .streamingSectionLead{
    width:100%;
    margin-bottom:20px;
  }

  .streamingSectionBody{
    width:100%;
    margin-top:20px;
  }

  .streamingSectionSupportList{
    gap:12px 20px;
  }

  .aiTopRow{
    grid-template-columns:1fr;
    gap:10px;
  }

  .aiPlayerFrame{
    width:100%;
  }

  .aiRail{
    height:auto;
    max-height:none;
  }

  .aiRailHeading{
    display:none;
  }

  .aiList{
    height:auto;
    overflow:visible;
    padding:8px;
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(118px, 1fr));
    gap:8px;
  }

  .aiItem{
    display:block;
    border:none;
    padding:0;
    background:transparent;
  }

  .aiItemText{
    display:none;
  }

  .aiItemThumbPlay{
    display:none;
  }

  .aiItem.is-active{
    background:transparent;
  }

  .aiItem.is-active .aiItemThumb{
    border-color:#ff684d;
    box-shadow:0 0 0 2px rgba(255,104,77,.45);
  }

  .serviceBlock h2{
    font-size:16px;
  }

  .serviceBlock p{
    font-size:13px;
  }
}

@media (max-width:640px){
  .aiSectionIntro{
    font-size:clamp(12px, 2.3vw, 14px);
    margin-bottom:12px;
  }

  .overviewFrame{
    min-height:0;
  }

  .aiCarouselControl{
    width:30px;
    height:30px;
    font-size:20px;
  }

  .aiList{
    grid-template-columns:repeat(auto-fit, minmax(96px, 1fr));
    gap:6px;
    padding:6px;
  }

  .streamingSectionSupportList{
    grid-template-columns:minmax(0, 1fr);
    gap:10px;
  }
}

/* Responsive pass 2: streaming usability on phones, tablets, and narrow desktop */
@media (max-width:1180px){
  body.streamingPage .single2SectionTitleDeck,
  .streamingSectionLead,
  body.streamingPage .streamingSectionBody,
  body.streamingPage .overviewFrame{
    width:min(100% - 28px, 1100px);
  }

  body.streamingPage .single2SectionTitle{
    font-size:clamp(34px, 5.8vw, 60px);
  }

  .streamingSectionLead p,
  .streamingSectionBody p{
    font-size:16px;
    line-height:1.58;
  }

  .streamingSectionSupportList{
    gap:12px 24px;
  }

  .streamingSectionCta{
    margin-left:0;
    align-self:flex-start;
  }
}

@media (max-width:900px){
  body.streamingPage .overviewFrame{
    padding:16px;
    border-radius:22px;
  }

  .streamingSectionLead,
  body.streamingPage .streamingSectionBody{
    width:100%;
  }

  .streamingSectionSupportList{
    grid-template-columns:minmax(0, 1fr);
    gap:10px;
  }

  .streamingSectionCta{
    min-width:280px;
  }
}

@media (max-width:767px){
  body.streamingPage .single2SectionTitle{
    font-size:clamp(28px, 8vw, 42px);
  }

  body.streamingPage .simpleFrame{
    width:calc(100% - 16px);
    padding:18px 10px 22px;
    border-radius:24px;
  }

  body.streamingPage .overviewFrame{
    width:100%;
    padding:12px;
    border-radius:18px;
  }

  .streamingSectionLead p,
  .streamingSectionBody p{
    font-size:15px;
    line-height:1.56;
  }

  .streamingSectionMedia,
  .streamingSectionPlaceholder{
    min-height:clamp(180px, 50vw, 260px);
    border-radius:18px;
  }

  .streamingSectionCta{
    width:100%;
    min-width:0;
    justify-content:center;
  }
}

/* Keep standalone streaming rounded frame aligned with 95% hero width on narrow screens. */
@media (max-width:1180px){
  body.streamingPage .simpleFrame{
    width:min(95vw, 1400px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
}