/* Supplied five-label composition, using only the Pol’N blue and type system. */
.poln-playground{position:relative;margin-block:30px 40px;isolation:isolate;scroll-margin-top:120px;color:var(--blue)}
.poln-playground__scene{position:relative;min-height:850px}
.playground-pinned .poln-playground__scene{position:sticky;top:var(--scene-top);height:var(--scene-height);min-height:0}
.poln-playground__heading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:1;text-align:center;transform:translateY(calc(var(--title-y,0px) + var(--title-parallax,0px))) scale(var(--title-scale,1))}
.poln-playground__heading h2{font:800 clamp(54px,7.8vw,112px)/.95 var(--heading);letter-spacing:-.035em;text-transform:none}
.poln-playground__labels{list-style:none;margin:0;padding:0}
.playground-item{position:absolute;width:min(360px,28vw);transform:translateY(var(--parallax-y,0px))}
.playground-item--1{left:12%;top:18%;--tilt:-3deg}
.playground-item--2{right:12%;top:15%;--tilt:2deg}
.playground-item--3{left:20%;bottom:10%;--tilt:2deg}
.playground-item--4{right:18%;bottom:8%;--tilt:-2deg}
.playground-item--5{left:50%;top:50%;translate:-50% -50%;--tilt:1deg}
.playground-card{position:relative;padding:28px;background:#fff;border:1px solid var(--blue);color:var(--blue);transform:rotate(var(--tilt));transform-origin:center}
.playground-card__number{display:block;margin-bottom:clamp(24px,4svh,60px);font:300 11px/1.4 var(--body);letter-spacing:.12em;text-transform:uppercase}
.playground-card h3{margin:0 0 14px;font:800 clamp(28px,2.5vw,38px)/1.04 var(--heading);letter-spacing:-.025em;text-transform:none}
.playground-card p{margin:0;font:400 14px/1.5 var(--body);color:inherit}
/* Independent wrapper preserves both scroll entry and parallax transforms. */
.playground-float{animation:playground-drift 6s ease-in-out infinite}
.playground-item--2 .playground-float{animation-duration:7s;animation-delay:-2s}
.playground-item--3 .playground-float{animation-duration:6.5s;animation-delay:-4s}
.playground-item--4 .playground-float{animation-duration:7.5s;animation-delay:-1s}
.playground-item--5 .playground-float{animation-duration:6.8s;animation-delay:-3s}
@keyframes playground-drift{0%,100%{transform:translateY(-6px)}50%{transform:translateY(6px)}}
.playground-card{transition:background-color .25s ease,color .25s ease}
.playground-card h3,.playground-card__number{color:inherit}
@media(hover:hover) and (pointer:fine){
 .playground-card:hover{background:var(--blue);color:#fff}
}
.playground-enabled .playground-reveal{opacity:var(--reveal-opacity,0);transform:translate(var(--arrival-x,0px),var(--arrival-y,180px)) scale(var(--arrival-scale,.8)) rotate(var(--arrival-rotate,0deg))}
@media(max-width:800px){
 .poln-playground__heading h2{font-size:clamp(42px,12vw,70px)}
 .playground-item{width:78%}
 .playground-card{padding:20px}
 .playground-card__number{margin-bottom:24px;font-size:10px}
 .playground-card h3{font-size:30px}
 .playground-card p{font-size:13px}
 .playground-item--1{left:4%;top:10%}
 .playground-item--2{right:2%;top:22%}
 .playground-item--3{left:5%;bottom:24%}
 .playground-item--4{right:3%;bottom:8%}
 .playground-item--5{left:50%;top:52%}
}
@media(max-height:599px),(prefers-reduced-motion:reduce){
 .poln-playground{padding-block:45px}
 .poln-playground__scene{min-height:0}
 .poln-playground__heading{position:relative;inset:auto;width:100%;margin-bottom:55px}
 .playground-item:nth-child(n){position:relative;inset:auto;translate:none;width:82%;max-width:400px;margin:0 auto 35px}
 .playground-item:nth-child(even){margin-right:3%}
}
@media(prefers-reduced-motion:reduce){
 .playground-float{animation:none}
 .playground-card{transition:none}
 .poln-playground__heading,.playground-item,.playground-enabled .playground-reveal{transform:none!important;opacity:1!important}
}
