.offlineVideoOverlay{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:72px 24px 24px;background:rgba(1,11,20,.94)}
.offlineVideoOverlay video{display:block;width:min(1120px,100%,calc((100dvh - 96px)*16/9));height:auto;max-width:100%;max-height:calc(100dvh - 96px);aspect-ratio:16/9;object-fit:contain;background:#000;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.offlineVideoOverlay button{position:absolute;top:24px;right:30px;width:42px;height:42px;border:1px solid rgba(255,255,255,.5);border-radius:50%;background:#fff;color:#071b2d;font-size:28px;line-height:1;cursor:pointer}
@media(max-width:900px){.mobileSolutions[hidden]{display:none}.mobileSolutions{display:block}.offlineVideoOverlay{padding:68px 12px 16px}.offlineVideoOverlay video{width:min(100%,calc((100dvh - 84px)*16/9));max-height:calc(100dvh - 84px);aspect-ratio:16/9;object-fit:contain}.offlineVideoOverlay button{top:14px;right:14px}}

/* Video teaser cards at 50% of the original desktop size. */
html body .storyCard,html body .storyCard.compact{
  box-sizing:border-box;
  width:min(295px,100%)!important;
  max-width:100%;
  height:auto!important;
  aspect-ratio:16/9!important;
  grid-template-columns:40px minmax(0,1fr) 14px!important;
  padding:0 13px 13px!important;
}
html body .storyCard.compact{width:min(280px,100%)!important;height:auto!important}
html body .storyCardPlay{width:34px!important;height:34px!important}
html body .storyCardCopy small{font-size:.5rem!important}
html body .storyCardCopy strong{font-size:.86rem!important;line-height:1.15!important}
html body .storyCardCopy em{font-size:.52rem!important}

/* V50: the Home hero owns the full first viewport. */
html body .v3c .heroChapter{
  box-sizing:border-box;
  height:100svh!important;
  height:100dvh!important;
  min-height:100svh!important;
  min-height:100dvh!important;
  overflow:hidden!important;
  background-position:center!important;
}

/* Keep the How We Work hero content visible on short laptop screens. */
@media(min-width:901px) and (max-height:900px){
  .howV3e .howHeroV3e{
    box-sizing:border-box;
    height:auto!important;
    min-height:max(100svh,760px);
    overflow:visible!important;
  }
  .howHeroV3e .howCopy{
    position:relative!important;
    top:auto!important;
    bottom:auto!important;
    padding-top:clamp(118px,15svh,148px);
    padding-bottom:64px;
  }
}
@media(max-width:900px){
  .howV3e .howHeroV3e{
    height:auto!important;
    min-height:100svh;
    overflow:visible!important;
  }
  html body .storyCard,html body .storyCard.compact{
    width:min(280px,calc(100vw - 44px))!important;
    height:auto!important;
    aspect-ratio:16/9!important;
    object-fit:contain;
  }
  html body .storyCard img{width:100%!important;height:100%!important;object-fit:cover!important}

  /* Compact, fully framed navigation on every mobile page. */
  html body .v2Mobile{
    box-sizing:border-box;
    width:min(88vw,380px);
    max-width:calc(100vw - 24px);
    height:100dvh;
    padding:max(14px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom));
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  html body .mobileHead{min-height:66px;gap:14px}
  html body .mobileHead img{width:min(190px,calc(100% - 50px));height:58px;padding:0;object-fit:contain;object-position:left center}
  html body .mobileHead button{flex:0 0 36px;width:36px;height:36px;margin-left:auto;padding:0;font:300 30px/1 Arial,sans-serif}
  html body .v2Mobile nav>a,html body .v2Mobile nav>button{box-sizing:border-box;min-height:54px;padding:14px 0;font-size:17px;line-height:1.3}
  html body .mobileSolutions{padding:5px 0 8px 12px}
  html body .mobileSolutions a{
    box-sizing:border-box;
    grid-template-columns:minmax(0,1fr) 14px;
    align-items:center;
    gap:10px;
    width:100%;
    padding:9px 0;
    font-size:13.5px;
    line-height:1.35;
    white-space:normal;
    overflow-wrap:anywhere;
    display:grid;
  }
  html body .mobileSolutions a span{
    position:relative;
    width:12px;
    height:12px;
    font-size:0;
    color:transparent;
    display:block;
  }
  html body .mobileSolutions a span:before{
    content:"";
    box-sizing:border-box;
    position:absolute;
    top:3px;
    right:1px;
    width:7px;
    height:7px;
    border-top:1px solid #8edfd0;
    border-right:1px solid #8edfd0;
    transform:rotate(45deg);
  }
  html body .mobileSolutions a span:after{
    content:"";
    position:absolute;
    width:9px;
    height:1px;
    top:6px;
    left:0;
    background:#8edfd0;
    transform:none;
  }

  /* One restrained right-arrow system for every mobile link. */
  html body :is(.solutionGroupCompact a,.solutionsGroupColumn>a,.insightsChannelList a,.solutionLinks a,.v2Button,.chapterLink,.v2NavCta,.storyCard) :is(b,span):last-child{
    position:relative;
    box-sizing:border-box;
    flex:0 0 13px;
    width:13px;
    height:13px;
    font-size:0!important;
    color:transparent!important;
    display:inline-block;
  }
  html body :is(.solutionGroupCompact a,.solutionsGroupColumn>a,.insightsChannelList a,.solutionLinks a,.v2Button,.chapterLink,.v2NavCta,.storyCard) :is(b,span):last-child:before{
    content:"";
    position:absolute;
    top:6px;
    left:1px;
    width:10px;
    height:1px;
    background:currentColor;
    color:#00a984;
    box-shadow:0 0 0 0 #00a984;
  }
  html body :is(.solutionGroupCompact a,.solutionsGroupColumn>a,.insightsChannelList a,.solutionLinks a,.v2Button,.chapterLink,.v2NavCta,.storyCard) :is(b,span):last-child:after{
    content:"";
    position:absolute;
    top:3px;
    right:1px;
    width:7px;
    height:7px;
    border-top:1px solid #00a984;
    border-right:1px solid #00a984;
    transform:rotate(45deg);
  }
  html body .howText li:before{
    content:""!important;
    width:4px;
    height:4px;
    margin:0 12px 2px 0;
    border-radius:50%;
    background:#00a984;
    display:inline-block;
  }
}
