/* Mobile home first fold: keep the hero self-contained before the service panel appears. */
@media(max-width:680px) and (orientation:portrait){
  .bw-home-hero{
    padding-top:18px;
    padding-bottom:0;
  }

  .bw-home-hero__grid{
    row-gap:16px;
    align-items:start;
  }

  .bw-home-hero__grid>div:first-child{
    display:flex;
    flex-direction:column;
    min-height:calc(100vh - 82px);
    min-height:calc(100svh - 82px);
  }

  .bw-home-hero h1{
    font-size:clamp(2.85rem,13.2vw,3.65rem);
  }

  .bw-home-hero .bw-copy{
    margin:14px 0 0;
    font-size:clamp(.92rem,3.9vw,1rem);
    line-height:1.55;
  }

  .bw-home-hero .bw-actions-row{
    margin-top:auto;
    padding-top:clamp(18px,4svh,34px);
    gap:10px;
  }

  .bw-home-proof{
    margin-top:14px;
    gap:6px 14px;
    padding-bottom:max(10px,env(safe-area-inset-bottom));
    font-size:clamp(.78rem,3.45vw,.88rem);
    line-height:1.35;
  }

  .bw-home-proof li{
    gap:6px;
  }

  .bw-home-system{
    margin-top:0;
  }

  /* Restore only a few of the original animated ambient points on phones.
     Keep them in the upper hero so the middle stays free for future content. */
  .bw-motion-particles{
    display:block!important;
    z-index:0!important;
    top:0!important;
    right:0!important;
    bottom:auto!important;
    left:0!important;
    height:min(58svh,520px)!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  .bw-motion-particles .bw-ambient-particle:nth-child(n+5){
    display:none!important;
  }
}


/* Mobile-only: use exactly the same Future surface as the member Service page. */
@media(max-width:680px) and (orientation:portrait){
  html[data-design="future"] body.bw-page-home{
    background:var(--bw-bg,#060d15)!important;
    background-attachment:scroll!important;
  }

  html[data-design="future"] body.bw-page-home .bw-home{
    background:var(--bw-bg,#060d15)!important;
  }

  html[data-design="future"] body.bw-page-home::before{
    display:none!important;
  }

  /* Keep the member-Service base, then render the homepage's own ambient field
     visibly above it. The old negative z-index put these layers behind .bw-home. */
  html[data-design="future"] .bw-home-hero::before{
    z-index:0!important;
    left:-48px!important;
    right:-48px!important;
    top:-74px!important;
    width:auto!important;
    height:520px!important;
    aspect-ratio:auto!important;
    border-radius:0!important;
    background:
      radial-gradient(ellipse at 62% 8%,rgba(5,185,242,.22),transparent 44%),
      radial-gradient(ellipse at 108% 18%,rgba(185,219,27,.11),transparent 40%)!important;
    filter:blur(2px)!important;
    opacity:1!important;
    animation:none!important;
  }

  html[data-design="future"] .bw-home-hero::after{
    z-index:0!important;
    inset:0!important;
    background-image:
      linear-gradient(rgba(105,205,242,.058) 1px,transparent 1px),
      linear-gradient(90deg,rgba(105,205,242,.058) 1px,transparent 1px),
      linear-gradient(rgba(105,205,242,.022) 1px,transparent 1px),
      linear-gradient(90deg,rgba(105,205,242,.022) 1px,transparent 1px)!important;
    background-size:42px 42px,42px 42px,14px 14px,14px 14px!important;
    -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.96),rgba(0,0,0,.72) 64%,transparent 94%)!important;
    mask-image:linear-gradient(to bottom,rgba(0,0,0,.96),rgba(0,0,0,.72) 64%,transparent 94%)!important;
    opacity:.78!important;
  }

  .bw-home-hero__grid{
    position:relative;
    z-index:1;
  }

  .bw-home-visual{
    margin-top:clamp(62px,8svh,84px);
  }
}

@media(max-width:620px) and (orientation:portrait){
  .bw-home-visual>.bw-ai-graph{
    top:10px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .bw-motion-particles{display:none!important}
}