/* V20.8 — homepage correction only. Approved 4K phone footage and existing
   later chapters unchanged. Overrides V20.7 styling without global effects. */

/* First video: fluorescent white hero lettering instead of multicolor data title */
html body.home.ban-home-videos-v20 #ban-home-hero .ban-v207-hero-overlay,
html body.home.ban-home-videos-v20 #ban-home-hero .ban-v207-hero-overlay p,
html body.home.ban-home-videos-v20 #ban-home-hero .ban-v207-hero-overlay .ban-v207-gradient {
  color:#fff !important;
  background:none !important;
  background-image:none !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:0 0 3px rgba(255,255,255,.98), 0 0 15px rgba(120,255,255,.95), 0 2px 13px rgba(9,28,66,.88) !important;
}
html body.home.ban-home-videos-v20 #ban-home-hero .ban-v207-hero-overlay .ban-v207-gradient {
  font-weight:750;
  text-shadow:0 0 5px #fff, 0 0 15px #00ffff, 0 2px 13px rgba(6,25,62,.9) !important;
}
/* Phone introduction: approximately half of the previous desktop type size;
   multiple weights and a compact three-line pyramid, all on the center axis. */
html body.home.ban-home-videos-v20 .ban-home-story--intro.ban-home-story--centered {
  width:min(1170px,calc(100% - 44px)) !important;
  max-width:1170px!important;
  margin:clamp(-32px,-1.2vw,-10px) auto 0 !important;
  padding:0 0 clamp(9px,1.3vw,20px) !important;
  text-align:center!important;
  position:relative!important;
  z-index:4!important;
}
html body.home.ban-home-videos-v20 .ban-home-story--intro #ban-home-title.ban-v208-phone-title {
  font-family:Inter,'Helvetica Neue',Arial,sans-serif!important;
  font-size:clamp(15px,1.2vw,18px)!important;
  line-height:1.36!important;
  font-weight:500!important;
  letter-spacing:-.025em!important;
  width:100%!important;max-width:none!important;
  text-align:center!important;margin:0 auto!important;
}
html body.home.ban-home-videos-v20 #ban-home-title .ban-v208-phone-line {
  display:block;white-space:nowrap;font-size:1em!important;font-weight:500;
  text-align:center;margin-inline:auto;
}
html body.home.ban-home-videos-v20 #ban-home-title .ban-v208-phone-line + .ban-v208-phone-line {margin-top:.05em;}
html body.home.ban-home-videos-v20 #ban-home-title .ban-v208-phone-line--middle {font-weight:580;}
html body.home.ban-home-videos-v20 #ban-home-title .ban-v208-phone-line--end {font-weight:460;}
html body.home.ban-home-videos-v20 #ban-home-title strong {font-weight:750;letter-spacing:-.045em;}
html body.home.ban-home-videos-v20 #ban-home-title em {font-style:normal;font-weight:740;}
html body.home.ban-home-videos-v20 .ban-home-story--intro .ban-home-cta {
  justify-content:center!important;margin-top:clamp(12px,1.4vw,19px)!important;
}
/* Exact story order: opening phone video -> small caption -> mobility film.
   Title over the uploaded video, CTA immediately below, same x-axis. */
html body.home.ban-home-videos-v20 #network-compounding.ban-v208-mobility {
  width:min(1440px,100%)!important;max-width:1440px!important;
  margin:0 auto!important;padding:0!important;border:0!important;
  background:#fff!important;display:block!important;
  position:relative!important;isolation:isolate!important;
}
html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-stage {
  position:relative;width:min(1380px,calc(100% - 40px));margin:0 auto;
  aspect-ratio:16/9;background:#fff;
}
html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-media {
  position:absolute;inset:0;background-color:#fff;
  background-size:contain;background-position:center;background-repeat:no-repeat;
}
html body.home.ban-home-videos-v20 #network-compounding video {
  display:block;width:100%;height:100%;object-fit:contain;
}
html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-overlay {
  position:absolute;z-index:2;left:50%;top:clamp(10px,3%,35px);
  transform:translateX(-50%);width:min(1080px,calc(100% - 36px));
  text-align:center;pointer-events:none;
}
html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-overlay h2 {
  margin:0!important;padding:0!important;
  font-family:Inter,'Helvetica Neue',Arial,sans-serif!important;
  color:#122b3f!important;font-weight:740!important;
  font-size:clamp(25px,3vw,43px)!important;
  line-height:1.08!important;letter-spacing:-.048em!important;
  text-align:center!important;
}
html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-overlay h2 span {
  display:block;color:#08bce1!important;
  background:linear-gradient(98deg,#00cfff,#ff00ff);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-buttons {
  display:flex;justify-content:center;text-align:center;
  margin:clamp(-12px,-.3vw,0px) auto clamp(16px,2vw,28px);
  width:min(1100px,calc(100% - 30px));position:relative;z-index:3;
}
html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-buttons .button-row {
  display:flex;flex-wrap:wrap;gap:12px;justify-content:center;
  margin:0 auto!important;
}
@media(max-width:900px) {
  html body.home.ban-home-videos-v20 .ban-home-story--intro.ban-home-story--centered {
    margin:8px auto 0!important;width:calc(100% - 32px)!important;
  }
  html body.home.ban-home-videos-v20 .ban-home-story--intro #ban-home-title.ban-v208-phone-title {
    font-size:clamp(14px,2.2vw,17px)!important;line-height:1.35!important;
  }
  html body.home.ban-home-videos-v20 #ban-home-title .ban-v208-phone-line {
    white-space:normal!important;text-wrap:balance;
  }
  html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-stage {width:calc(100% - 20px);}
  html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-overlay h2 {
    font-size:clamp(16px,3.6vw,29px)!important;
  }
}
@media(max-width:480px) {
  html body.home.ban-home-videos-v20 #ban-home-hero .ban-v207-hero-overlay {
    color:#fff!important;text-shadow:0 0 6px rgba(255,255,255,.8),0 2px 7px #134065!important;
  }
  html body.home.ban-home-videos-v20 .ban-home-story--intro #ban-home-title.ban-v208-phone-title {
    font-size:14px!important;line-height:1.36!important;
  }
  html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-overlay {
    top:0px;width:calc(100% - 10px);
  }
  html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-overlay h2 {
    font-size:clamp(12px,3.5vw,15px)!important;
    line-height:1.1!important;
  }
  html body.home.ban-home-videos-v20 #network-compounding .ban-v208-mobility-buttons {
    margin:4px auto 22px;
  }
}
