.oecd-cursor{display:none}
.hero-viz{isolation:isolate}
.hero-viz::before{content:"";position:absolute;inset:-12%;border-radius:50%;background:repeating-linear-gradient(90deg,transparent 0 11%,rgba(55,215,237,.11) 11.5% 12%,transparent 12.5% 23%);animation:globeDrift 12s linear infinite;z-index:-1}
.orbit{will-change:transform}
.orbit-a{animation:orbitSpin 14s linear infinite}
.orbit-b{animation:orbitTiltA 11s linear infinite}
.orbit-c{animation:orbitTiltB 16s linear infinite}
.hero-number{z-index:1}
.viz-label{z-index:3;box-shadow:0 5px 18px rgba(0,0,0,.18)}
.label-two{top:18%;bottom:auto;left:8%}
.bars i{transform:scaleY(0);transform-origin:bottom;opacity:.35}
.bars.in-view i{animation:barRise .8s cubic-bezier(.2,.8,.2,1) forwards}
.bars.in-view i:nth-child(2){animation-delay:.09s}
.bars.in-view i:nth-child(3){animation-delay:.18s}
.bars.in-view i:nth-child(4){animation-delay:.27s}
.bars.in-view i:nth-child(5){animation-delay:.36s}
.bars.in-view i:nth-child(6){animation-delay:.45s}
@keyframes globeDrift{to{transform:translateX(23%)}}
@keyframes orbitSpin{to{transform:rotate(360deg)}}
@keyframes orbitTiltA{from{transform:rotate(24deg)}to{transform:rotate(384deg)}}
@keyframes orbitTiltB{from{transform:rotate(-24deg)}to{transform:rotate(336deg)}}
@keyframes barRise{to{transform:scaleY(1);opacity:1}}
@property --ring-progress{syntax:"<angle>";inherits:false;initial-value:0deg}
.ring{position:relative;border:0;background:conic-gradient(var(--cyan) var(--ring-progress),rgba(255,255,255,.18) 0);transform:scale(.82);opacity:0}
.ring::before{content:"";position:absolute;inset:20px;border-radius:50%;background:var(--blue)}
.ring span{position:relative;z-index:1}
.audience-graphic.in-view .ring{animation:ringDraw 1.25s cubic-bezier(.2,.75,.2,1) forwards}
.audience-graphic.in-view #ringCaption{animation:captionRise .65s .72s ease both}
.consequence-list>div{opacity:0;transform:translateY(28px)}
.consequence-list.in-view>div{animation:listReveal .65s cubic-bezier(.2,.75,.2,1) forwards}
.consequence-list.in-view>div:nth-child(2){animation-delay:.12s}
.consequence-list.in-view>div:nth-child(3){animation-delay:.24s}
.consequence-list.in-view>div:nth-child(4){animation-delay:.36s}
@keyframes ringDraw{0%{--ring-progress:0deg;transform:scale(.82) rotate(-8deg);opacity:0}100%{--ring-progress:280.8deg;transform:scale(1) rotate(0);opacity:1}}
@keyframes captionRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes listReveal{to{opacity:1;transform:none}}
@media(pointer:fine){html,body,a,button{cursor:none!important}.oecd-cursor{position:fixed;display:block;left:0;top:0;z-index:9999;pointer-events:none;color:var(--cyan);font-size:11px;font-weight:800;line-height:1;letter-spacing:.08em;transform:translate(8px,8px);text-shadow:-1px -1px 0 var(--ink),1px -1px 0 var(--ink),-1px 1px 0 var(--ink),1px 1px 0 var(--ink);opacity:0;transition:opacity .12s}.oecd-cursor.visible{opacity:1}.oecd-cursor.active{color:#fff;transform:translate(8px,8px) scale(.9)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-viz::before,.orbit,.bars.in-view i,.audience-graphic.in-view .ring,.audience-graphic.in-view #ringCaption,.consequence-list.in-view>div{animation:none}.bars i,.ring,.consequence-list>div{transform:none;opacity:1}.ring{--ring-progress:280.8deg}.oecd-cursor{transition:none}}