/* BusinessAtNight V20.2 – Homepage clarity + 1×10 video sizing.
   Scoped, additive and reversible. No globe, budget or planner modifications. */
:root{--ban-film-cyan:#23cde9;--ban-film-lavender:#9fa8f0;--ban-film-magenta:#d884e9}
/* The founder wants a genuinely invisible glass bar over the original video. */
html body.home.ban-home-videos-v20 .site-header[data-ban-glass-header]{
  background:rgba(255,255,255,.005)!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:blur(1.2px) saturate(102%)!important;
  backdrop-filter:blur(1.2px) saturate(102%)!important;
}
/* Only the homepage's left side is empty – other pages keep their identity. */
html body.home.ban-home-videos-v20 .site-header .header-in{justify-content:flex-end!important}
html body.home.ban-home-videos-v20 .site-header .main-nav{margin-left:auto!important}
html body.home.ban-home-videos-v20 .site-header .main-nav>a,
html body.home.ban-home-videos-v20 .site-header .main-nav>a:not(.header-cta){
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  text-shadow:0 1px 2px rgba(4,16,27,.92),0 3px 12px rgba(3,16,28,.72)!important;
}
html body.home.ban-home-videos-v20 .site-header .main-nav>a.header-cta{
  background:rgba(5,28,48,.20)!important;
  border:1px solid rgba(255,255,255,.55)!important;
}
html body.home.ban-home-videos-v20 .site-header .nav-toggle span{
  background:#fff!important;
  box-shadow:0 1px 3px rgba(3,16,27,.88)!important;
}
@media(max-width:1020px){
  html body.home.ban-home-videos-v20 .site-header .main-nav.is-open{
    background:rgba(5,23,40,.91)!important;
    border:1px solid rgba(240,252,255,.28)!important;
    -webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important;
  }
}
/* The exact approved sentence now stands alone, centered beneath the phone film. */
html body.home.ban-home-videos-v20 .ban-home-story--intro.ban-home-story--centered{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  width:min(1040px,calc(100% - 48px))!important;
  margin-inline:auto!important;
  padding-block:clamp(32px,4.7vw,66px) clamp(55px,7vw,100px)!important;
  gap:0!important;
}
html body.home.ban-home-videos-v20 .ban-home-story--intro.ban-home-story--centered h1{
  font-family:Inter,'Helvetica Neue',Arial,sans-serif!important;
  color:#14222e!important;
  max-width:970px!important;
  margin:0 auto!important;
  font-size:clamp(24px,2.65vw,42px)!important;
  line-height:1.30!important;
  font-weight:680!important;
  letter-spacing:-.033em!important;
  text-wrap:balance;
  text-align:center!important;
}
html body.home.ban-home-videos-v20 .ban-home-story--intro.ban-home-story--centered .ban-home-soft-accent{
  background:linear-gradient(95deg,var(--ban-film-cyan),var(--ban-film-lavender) 60%,var(--ban-film-magenta));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
html body.home.ban-home-videos-v20 .ban-home-story--centered .ban-home-cta{
  justify-content:center!important; margin-top:clamp(25px,3.5vw,42px)!important;
}
html body.home.ban-home-videos-v20 .ban-home-story--centered .ban-home-micro{
  text-align:center!important;
}
/* 1×10 existing original Canva opening video: enlarged *visual contents*,
   not another iframe or an extra movie. Current source is portrait-ish 3258×2544,
   so the earlier fixed 16:9 video box artificially reduced the picture. */
html body .sub-hero.wrap:has(> .canva88-1x10-video){
  width:min(1700px,calc(100% - 34px))!important;
  max-width:none!important;
  display:grid!important;
  grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr)!important;
  gap:clamp(12px,1.3vw,28px)!important;
  align-items:center!important;
  overflow:hidden!important;
  padding-block:clamp(64px,6.4vw,98px) clamp(40px,4.5vw,75px)!important;
}
html body .sub-hero.wrap:has(> .canva88-1x10-video) > :first-child{
  min-width:0;position:relative;z-index:1;
}
html body .sub-hero.wrap:has(> .canva88-1x10-video) h1{
  font-size:clamp(43px,4.25vw,64px)!important;
  line-height:1.09!important;letter-spacing:-.06em!important;
  text-wrap:balance;
}
html body .sub-hero.wrap > .canva88-1x10-video{
  width:100%!important;max-width:none!important;min-width:0!important;
  position:relative!important;aspect-ratio:3/2!important;
  overflow:hidden!important;isolation:isolate;
  background:transparent!important;
  margin:0!important;
}
html body .sub-hero.wrap > .canva88-1x10-video video{
  position:absolute!important;
  width:140%!important;max-width:none!important;
  height:auto!important;aspect-ratio:auto!important;
  left:-18%!important;top:50%!important;
  transform:translateY(-50%)!important;
  object-fit:contain!important;
}
/* The third supplied film moves from the homepage to this page. */
html body .ban-one-ten-showcase{
  width:100%!important; max-width:none!important;
  background:#fff!important;
  padding:clamp(45px,6.5vw,98px) 0 clamp(70px,8vw,126px)!important;
  border-block:1px solid rgba(14,63,89,.06);
}
html body .ban-one-ten-showcase__inner{
  width:min(50vw,760px);max-width:calc(100% - 32px);
  margin-inline:auto!important;text-align:center;
}
html body .ban-one-ten-showcase__label{
  font:700 12px/1.5 Inter,'Helvetica Neue',Arial,sans-serif!important;
  letter-spacing:.14em;text-transform:uppercase;color:#526776!important;
  margin:0 0 18px!important;
}
html body .ban-one-ten-showcase__frame{
  width:100%;aspect-ratio:16/9;position:relative;overflow:hidden;
  background:#fff center center / contain no-repeat;
}
html body .ban-one-ten-showcase__frame video{
  display:block;width:100%;height:100%;object-fit:contain;
}
html body .ban-one-ten-showcase__inner>a{
  display:inline-flex;margin-top:21px;color:#177c9b;font-size:14px;font-weight:700;
}
/* Apply the film's restrained color language to highlighted words across public pages.
   Ordinary text and headlines remain neutral. */
body h1 .accent,body h2 .accent,body h3 .accent,
body .ban-home-soft-accent{
  color:var(--ban-film-cyan)!important;
  background-image:linear-gradient(103deg,var(--ban-film-cyan) 4%,var(--ban-film-lavender) 58%,var(--ban-film-magenta) 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}
/* Mobile: let the opening movie start behind the clear navigation too. */
@media(max-width:800px){
  html body.home.ban-home-videos-v20 .ban-home-film--hero{padding-top:0!important}
}
@media(max-width:940px){
  html body .sub-hero.wrap:has(> .canva88-1x10-video){
    width:min(100% - 32px,780px)!important;display:flex!important;
    flex-direction:column!important;gap:clamp(14px,3vw,26px)!important;
    padding-block:58px 34px!important;
  }
  html body .sub-hero.wrap > .canva88-1x10-video{
    aspect-ratio:16/10!important;
  }
  html body .sub-hero.wrap > .canva88-1x10-video video{
    width:116%!important;left:-8%!important;
  }
  html body .ban-one-ten-showcase__inner{width:min(75vw,760px)}
}
@media(max-width:600px){
  html body.home.ban-home-videos-v20 .ban-home-story--intro.ban-home-story--centered{
    width:calc(100% - 34px)!important;padding-block:30px 60px!important;
  }
  html body.home.ban-home-videos-v20 .ban-home-story--intro.ban-home-story--centered h1{
    font-size:clamp(22px,6.8vw,32px)!important;line-height:1.35!important;
  }
  html body .sub-hero.wrap > .canva88-1x10-video{aspect-ratio:4/3!important}
  html body .sub-hero.wrap > .canva88-1x10-video video{width:109%!important;left:-4.5%!important}
  html body .ban-one-ten-showcase__inner{width:calc(100% - 34px)}
}
@media(prefers-reduced-motion:reduce){
  html body .site-header[data-ban-glass-header]{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}
