@supports (animation-timeline: view()){
  main .s-head h2,main .i3-head h2,main .tstate-k h2,main .sstep h3,main .prof-txt h2,main .a-txt h3,main .cta h2,main .mhero-txt h1{
    animation:maskUp linear both;animation-timeline:view();animation-range:entry 5% cover 28%}
  @keyframes maskUp{from{clip-path:inset(0 0 100% 0);translate:0 .45em}to{clip-path:inset(0 0 -20% 0);translate:0 0}}
  main .area .m1,main .side-tile,main .who-plate img,main .reach-stage,main .mapcard{
    animation:unveil linear both;animation-timeline:view();animation-range:entry 0% cover 32%}
  @keyframes unveil{from{clip-path:inset(14% 6% 14% 6% round 22px)}to{clip-path:inset(0 0 0 0 round 16px)}}
  main .stats .stat,main .qa{animation:liftIn linear both;animation-timeline:view();animation-range:entry 0% entry 80%}
  @keyframes liftIn{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
}
@media (prefers-reduced-motion:reduce){main *{animation:none!important}}



.globe-sec{position:relative;padding:clamp(70px,7vw,120px) 0;overflow:hidden;background:radial-gradient(60% 80% at 30% 50%,rgba(59,90,124,.1),rgba(59,90,124,0) 70%),var(--paper)}
.globe-g{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,4vw,70px);align-items:center}
.globe-txt h2{font-size:28px;font-weight:200;letter-spacing:-.028em;margin:0 0 clamp(22px,2.4vw,34px)}
.globe-list{list-style:none;margin:0;padding:0}
.globe-list li{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);font-size:17px;color:var(--muted);cursor:default;
  transition:color .4s ease,padding .34s cubic-bezier(.16,.84,.3,1)}
.globe-list li:first-child{border-top:1px solid var(--line)}
.globe-list li .gdot{width:8px;height:8px;border-radius:50%;background:rgba(59,90,124,.35);transition:transform .4s ease,background .4s ease}
.globe-list li.on,.globe-list li:hover{color:var(--ink);padding-inline-start:8px}
.globe-list li.on .gdot,.globe-list li:hover .gdot{background:var(--pine);transform:scale(1.5)}
.globe-stage{position:relative;height:clamp(420px,42vw,620px);cursor:grab}
.globe-stage:active{cursor:grabbing}
#globe{position:absolute;inset:0;width:100%;height:100%}
@media (max-width:1000px){.globe-g{grid-template-columns:1fr}.globe-stage{height:min(92vw,460px)}}



@supports (animation-timeline: view()){
  .hero .rv,.phero .rv,.thero .rv,.mhero .rv,.lhero .rv{animation:none!important;
    transition:opacity .67s ease,transform .8s cubic-bezier(.16,.84,.3,1)!important}
  .hero .rv.d1,.phero .rv.d1,.thero .rv.d1,.mhero .rv.d1{transition-delay:.14s!important}
  .hero .rv.d2,.phero .rv.d2,.thero .rv.d2,.mhero .rv.d2{transition-delay:.28s!important}
  .hero .rv.d3,.phero .rv.d3,.thero .rv.d3,.mhero .rv.d3{transition-delay:.42s!important}
  .mhero-txt h1{animation:none!important}
}



html:not(.go) .hero .msk span,html:not(.go) .hero .rv,html:not(.go) .phero .rv,html:not(.go) .thero .rv,html:not(.go) .mhero .rv,
html:not(.go) .phero-media,html:not(.go) .tframe,html:not(.go) .mstack{opacity:0!important;transform:translateY(38px)!important;transition:none!important}
html.go .phero-media,html.go .mstack{transition:opacity .8s ease .2s,transform .94s cubic-bezier(.16,.84,.3,1) .2s}