/* The live homepage shell; interactive screen styles stay inside their own root. */
.impact:has(.connected-home){background:radial-gradient(ellipse at 50% 36%,#10395d88,transparent 62%),#030b14}
.connected-home{position:relative;margin:0 auto 3.5rem;max-width:1320px;scroll-margin-top:110px;color:#f0f8ff}
.connected-home__intro{max-width:840px;margin:0 auto 28px;text-align:center}
.connected-home__intro h2{margin:0 0 18px;font-size:clamp(35px,4.4vw,64px);font-weight:750;line-height:1.04;letter-spacing:-.052em}
.connected-home__intro>p{max-width:660px;margin:0 auto;color:#a9c2d7;font-size:clamp(15px,1.35vw,18px);line-height:1.65}
/* The two opening phrases land first; the original finale follows 2.2s later. */
.connected-home__intro h2.reveal{opacity:1;transform:none;transition:none}
.connected-title-hop{--hop-direction:-1;display:inline-block;white-space:nowrap;transform-origin:50% 100%;opacity:0}
.connected-title-hop--app{--hop-direction:1}
.connected-home__intro .is-visible .connected-title-hop{animation:connectedTitleHop 1.32s .1s linear both}
.connected-home__intro .is-visible .connected-title-hop--app{animation-delay:.82s}
.connected-home__intro .impact-reality{font-size:1em}
.connected-home__intro .impact-word--reality{color:transparent;opacity:0;transform:none;background-image:linear-gradient(103deg,#fff 0%,#e1f4ff 13%,#a5ddff 27%,#51b4ff 41%,#2588ef 56%,#1264d4 70%,#6ab9ff 82%,#b5e4ff 92%,#fff 100%)}
.connected-home__intro .impact-reality::before{background:radial-gradient(ellipse,rgba(41,121,235,.31) 0%,rgba(75,169,255,.23) 35%,rgba(103,199,255,.08) 56%,transparent 73%)}
.connected-home__intro .impact-reality::after{background:linear-gradient(90deg,transparent,#9ad9ff 14%,#fff 38%,#4ca7ff 61%,#237bdf 82%,transparent);box-shadow:0 0 12px rgba(127,196,255,.78),0 0 27px rgba(38,126,235,.42)}
.connected-home__intro .impact-reality>i{box-shadow:0 0 6px #fff,0 0 15px #91d0ff,0 0 26px rgba(51,141,255,.72)}
.connected-home__intro .is-visible .impact-word--reality{animation:impactRealityFinale 1.38s 2.44s cubic-bezier(.16,1,.3,1) both,impactRealitySheen 1.72s 2.48s cubic-bezier(.22,.72,.2,1) both}
.connected-home__intro .is-visible .impact-reality::before{animation:impactRealityHalo 1.72s 2.36s cubic-bezier(.16,1,.3,1) both}
.connected-home__intro .is-visible .impact-reality::after{animation:impactRealityUnderline 1.18s 2.82s cubic-bezier(.16,1,.3,1) both}
.connected-home__intro .is-visible .impact-reality>i{animation:impactRealitySpark .78s calc(var(--spark-delay) - .2s) cubic-bezier(.16,1,.3,1) both}
@keyframes connectedTitleHop{
  0%{opacity:0;transform:translate3d(calc(var(--hop-direction) * .9em),-1.05em,0) rotate(calc(var(--hop-direction) * 6deg)) scale(.94,1.08);animation-timing-function:cubic-bezier(.55,0,1,.7)}
  8%{opacity:1}
  24%{opacity:1;transform:translate3d(calc(var(--hop-direction) * .42em),0,0) rotate(calc(var(--hop-direction) * 2deg)) scale(1.1,.8);animation-timing-function:cubic-bezier(0,.55,.35,1)}
  43%{transform:translate3d(calc(var(--hop-direction) * .18em),-.62em,0) rotate(calc(var(--hop-direction) * -3deg)) scale(.96,1.06);animation-timing-function:cubic-bezier(.55,0,1,.65)}
  61%{transform:translate3d(calc(var(--hop-direction) * .04em),0,0) rotate(0deg) scale(1.07,.88);animation-timing-function:cubic-bezier(0,.55,.35,1)}
  74%{transform:translate3d(0,-.22em,0) rotate(0deg) scale(.98,1.035);animation-timing-function:cubic-bezier(.55,0,1,.65)}
  86%{transform:translate3d(0,0,0) rotate(0deg) scale(1.025,.965);animation-timing-function:ease-out}
  94%{transform:translate3d(0,-.035em,0) rotate(0deg) scale(.995,1.01);animation-timing-function:ease-in}
  100%{opacity:1;transform:translate3d(0,0,0) rotate(0deg) scale(1)}
}
.connected-home__widget{position:relative;display:block;min-height:760px;color:#edf7ff;font-family:'Segoe UI Variable Text','Segoe UI',system-ui,sans-serif;isolation:isolate}
.connected-home__fallback{display:grid;justify-items:center;gap:12px;margin:0;padding:18px 0 24px;text-align:center}
.connected-home__fallback img{display:block;width:min(100%,1000px);height:auto;aspect-ratio:1320/680;object-fit:contain}
.connected-home__fallback p{margin:0;color:#a9c2d7;font-size:14px;max-width:660px;line-height:1.6}
.connected-home__fallback button{min-height:44px;padding:10px 18px;border:1px solid #619cc5;border-radius:5px;background:#91d9ff;color:#062342;font:700 14px 'Segoe UI',sans-serif;cursor:pointer}
.connected-home__fallback button:focus-visible{outline:3px solid #9be4ff;outline-offset:4px}
.connected-home__cta{text-align:center;margin:30px auto 0}
.connected-home__cta .button{max-width:100%;white-space:normal}
/* Let the desktop demo use the viewport without widening the content below it. */
@media(min-width:1200px){.connected-home{width:min(calc(100vw - 80px),1960px);max-width:none;margin-inline:calc((100% - min(calc(100vw - 80px),1960px))/2)}.connected-home__fallback img{width:min(100%,1480px)}}
@media(max-width:800px){.connected-home{margin-bottom:2rem;scroll-margin-top:90px}.connected-home__intro{margin-bottom:23px}.connected-home__intro h2{font-size:clamp(34px,6.7vw,52px)}.connected-home__intro>p{max-width:510px}.connected-home__widget{min-height:600px}.connected-home__cta{margin-top:22px}}
/* Keep the hopping phrases beside each other on narrow phones. */
.mobile-connected{display:none}
@media(max-width:800px){
  .connected-home__widget{display:none}
  .mobile-connected{display:block;max-width:520px;margin:0 auto;color:#edf7ff}
  .mobile-connected__choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-bottom:22px}
  .mobile-connected__choices button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:72px;padding:9px 3px;border:1px solid #25465d;border-radius:12px;background:#0a1c2b;color:#adc6d8;font-family:inherit;font-weight:600;font-size:11px;line-height:1.25;cursor:pointer}
  .mobile-connected__choices button span{font-size:11px;line-height:1.25}
  .mobile-connected svg{width:21px;height:21px;flex-shrink:0}
  .mobile-connected__choices button[aria-pressed=true]{background:#133f5b;border-color:#76d5ff;color:#eefaff;box-shadow:0 0 18px #26a9ed21}
  .mobile-connected__story{padding:22px 18px;border:1px solid #2c526c;border-radius:22px;background:radial-gradient(ellipse at 100% 0,#12415b88,transparent 65%),#081725;box-shadow:0 22px 65px #0004;overflow:hidden}
  .mobile-connected__heading{display:flex;align-items:center;gap:12px}
  .mobile-connected__heading>span{display:grid;place-items:center;flex:0 0 42px;height:42px;border:1px solid #3c799a;border-radius:12px;background:#12384e;color:#8addff}
  .mobile-connected__heading h3{margin:0;font-size:24px;line-height:1.15;letter-spacing:-.035em;color:#f0f8ff}
  .mobile-connected__description{margin:16px 0 22px;color:#adc6d8;font-size:14px;line-height:1.65}
  .mobile-connected__screen{padding:17px;border:1px solid #31546b;border-radius:14px;background:#10283a}
  .mobile-connected__bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;margin-bottom:22px;color:#a7c7dc;font-size:11px}
  .mobile-connected__bar span:last-child{color:#80bbd6}
  .mobile-connected__screen>strong{display:block;font-size:19px;line-height:1.3}
  .mobile-connected__screen>p{margin:8px 0 20px;color:#b6cfdf;font-size:14px}
  .mobile-connected__action{width:100%;min-height:48px;padding:12px;border:1px solid #9de3ff;border-radius:9px;background:linear-gradient(110deg,#a2e3ff,#61bdf4);color:#06253b;font-family:inherit;font-weight:700;font-size:14px;line-height:1.4;cursor:pointer}
  .mobile-connected__connection{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;height:56px;color:#8fb7ce;font-size:11px}
  .mobile-connected__connection i{position:relative;width:2px;height:34px;background:#31576d}
  .mobile-connected__connection i:after{content:'';position:absolute;top:0;left:-2px;width:6px;height:6px;border-radius:50%;background:#8dddff}
  .mobile-connected__result{padding:17px;border:1px solid #284354;border-radius:14px;background:#091e2c;transition:border-color .3s,background .3s}
  .mobile-connected__result>span{display:block;margin-bottom:12px;color:#8fb7ce;font-size:12px}
  .mobile-connected__result strong{display:block;font-size:18px;line-height:1.35}
  .mobile-connected__result p{margin:9px 0 0;color:#adc6d8;font-size:13px;line-height:1.6}
  .mobile-connected.is-connected .mobile-connected__result{border-color:#58bdad;background:#0b2b31}
  .mobile-connected.is-connected .mobile-connected__result strong{color:#a1efdb}
  .mobile-connected.is-connected .mobile-connected__connection i:after{animation:mobileConnection .65s ease-out 2 forwards}
  .mobile-connected__reset{display:block;margin:12px auto -8px;min-height:44px;padding:8px 12px;border:0;background:transparent;color:#9edfff;font:inherit;font-size:13px;cursor:pointer}
  .mobile-connected__reset[hidden]{display:none}
  .mobile-connected button:focus-visible{outline:3px solid #b0e9ff;outline-offset:3px}
}
@keyframes mobileConnection{from{transform:translateY(0);box-shadow:0 0 10px #8dddff}to{transform:translateY(28px);box-shadow:0 0 14px #8dddff}}
@media(prefers-reduced-motion:reduce){.mobile-connected.is-connected .mobile-connected__connection i:after{animation:none}.mobile-connected__result{transition:none}}
@media(max-width:380px){.connected-home__intro .connected-title-hop{font-size:.82em}}
@media(prefers-reduced-motion:reduce){.connected-home__intro .connected-title-hop,.connected-home__intro .is-visible .connected-title-hop{animation:none;opacity:1;transform:none}.connected-home__intro .impact-word--reality,.connected-home__intro .is-visible .impact-word--reality{animation:none;opacity:1;transform:none;background-position:100% 50%}.connected-home__intro .is-visible .impact-reality::before,.connected-home__intro .is-visible .impact-reality::after,.connected-home__intro .is-visible .impact-reality>i{animation:none}.connected-home__intro .impact-reality::after{opacity:.88;transform:scaleX(1)}}