
.activity-playground{position:relative;isolation:isolate;padding:clamp(20px,4vw,48px);margin:48px 0;border-radius:32px;background:#211044;color:#fff;overflow:hidden}
.activity-playground:before{content:"";position:absolute;z-index:-1;width:450px;height:450px;border-radius:50%;right:-200px;top:-220px;background:radial-gradient(circle,#ed258e66,transparent 70%);pointer-events:none}
.activity-playground .activities-heading{margin:0 0 32px;position:relative}.activity-playground .eyebrow{color:#ffda58;margin-top:24px}.activity-playground h3{color:#fff;letter-spacing:-.03em}.activity-playground .activities-heading>p:last-child{color:#e0d6ed}
.activity-badge{display:inline-flex;align-items:center;gap:14px;border:1px solid #ffffff44;border-radius:30px;padding:10px 16px;font-size:11px;font-weight:900;letter-spacing:.13em;color:#fff}.activity-badge b{color:#ffda58;display:inline-block}
.activity-playground .kyf-activities{margin:0;gap:18px}.activity-playground .kyf-activity{position:relative;min-width:0;padding:18px 20px 24px;border:1px solid #ffffff55;border-radius:23px;color:#251044;background:#fff1cf;box-shadow:0 8px 0 #10042066;transition:transform .3s,box-shadow .3s;overflow:hidden}
.activity-playground .kyf-activity:nth-child(3n+2){background:#ffe0ee}.activity-playground .kyf-activity:nth-child(3n){background:#d8f5ff}.activity-playground .kyf-activity h4{position:relative;font-size:1.25rem;margin:12px 0;line-height:1.2}.activity-playground .kyf-activity p{font-size:.9rem;line-height:1.5}.activity-number{position:absolute;top:14px;left:15px;font-size:11px!important;color:#5c397a!important;background:#ffffffbb;padding:5px 8px;border-radius:8px}
.activity-scene{height:130px;position:relative;display:grid;place-items:center;margin-bottom:14px}.activity-icon{position:relative;z-index:2;font-size:66px;line-height:1;filter:drop-shadow(0 8px 2px #30125122)}.activity-orbit{position:absolute;width:100px;height:100px;border:1px dashed #44216b44;border-radius:50%;transform:rotate(-25deg) scaleX(1.45)}.activity-floor{position:absolute;bottom:8px;width:72px;height:10px;border-radius:50%;background:#3e176322;filter:blur(2px)}.activity-spark{position:absolute;color:#a70c68;font-size:22px}.spark-a{left:12%;top:22px}.spark-b{right:9%;bottom:15px;font-size:15px}
.activity-playground.is-visible .activity-icon{animation:activity-bob 3.5s ease-in-out infinite}.activity-playground.is-visible .activity-spark{animation:activity-twinkle 3s ease-in-out infinite}.activity-playground.is-visible .activity-badge b{animation:activity-spin 10s linear infinite}.activity-playground.is-visible .kyf-activity{animation:activity-arrive .65s backwards cubic-bezier(.2,.7,.2,1)}
.activity-playground .activity-2{animation-delay:.08s!important}.activity-playground .activity-3{animation-delay:.16s!important}.activity-playground .activity-4{animation-delay:.24s!important}.activity-playground .activity-5{animation-delay:.32s!important}.activity-playground .activity-6{animation-delay:.4s!important}.activity-playground .activity-7{animation-delay:.48s!important}.activity-playground .activity-8{animation-delay:.56s!important}.kyf-activity:nth-child(even) .activity-icon{animation-delay:-1.6s}.kyf-activity:nth-child(3n) .activity-icon{animation-delay:-.8s}
@keyframes activity-bob{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-10px) rotate(5deg)}}@keyframes activity-twinkle{0%,100%{opacity:.4;transform:scale(.75)}50%{opacity:1;transform:scale(1.12)}}@keyframes activity-spin{to{transform:rotate(360deg)}}@keyframes activity-arrive{from{opacity:0;transform:translateY(25px) scale(.96)}to{opacity:1;transform:none}}
@media(hover:hover){.activity-playground .kyf-activity:hover{transform:translateY(-7px);box-shadow:0 15px 0 #10042044}.kyf-activity:hover .activity-icon{animation-duration:1.5s}}
@media(max-width:900px){.activity-playground .kyf-activities{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:500px){.activity-playground{padding:18px 12px;border-radius:24px}.activity-playground .kyf-activities{gap:12px}.activity-playground .kyf-activity{padding:12px 12px 18px;border-radius:16px}.activity-scene{height:110px}.activity-icon{font-size:54px}.activity-orbit{width:75px;height:75px}.activity-playground .kyf-activity h4{font-size:1.02rem}.activity-playground .kyf-activity p{font-size:.82rem}.activity-playground .activities-heading{padding:0 6px}}
@media(prefers-reduced-motion:reduce){.activity-playground *, .activity-playground.is-visible *{animation:none!important;transition:none!important}}
