/* Motion is a brand language, not one effect reused six times. */
.animated{background:var(--bg);color:var(--fg)}.animated header{flex-wrap:wrap;gap:14px}.animated .hero{position:relative;overflow:hidden}.animated .hero .stage{border:0!important;border-radius:0!important;transform:none!important;isolation:isolate}.animated .stage-photo{display:none}.animated .stage-art{pointer-events:none}.animated .hero-copy{z-index:3}.animated .hero h1{max-width:none}.animated .intro{max-width:44ch}.animated .motion-story{padding:80px 6vw}.motion-story .chapter{font:11px/1.6 monospace;letter-spacing:.18em}.motion-story h2{font-size:clamp(38px,5.5vw,86px);line-height:1;margin:25px 0;max-width:18ch}.motion-points{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:50px}.motion-points article{padding:25px 0;border-top:2px solid currentColor}.motion-points h3{font-size:23px;margin:12px 0}.motion-points p{font:15px/1.8 Arial,sans-serif;max-width:42ch}.animated .selection{min-height:175px}.animated .closing h2{font-size:clamp(36px,4.5vw,64px);line-height:1.05}.animated a:focus-visible,.animated button:focus-visible{outline:3px solid currentColor;outline-offset:5px}.animated .pause{background:var(--bg);color:var(--fg);border-color:currentColor;min-height:38px}.animated .stage-meta{font:10px/1.5 monospace;color:var(--fg)}.motion-emblem{position:relative;transition:rotate .7s,scale .7s,background .7s,color .7s}
/* OVERDRIVE CLUB: compressed poster, heavy mark, heat and tension. */
body.kind-athlete{--bg:#181918!important;--fg:#f4ede0!important;--accent:#ff5b2b!important}.kind-athlete header{border-bottom:2px solid #ff5b2b}.kind-athlete .wordmark{font:italic 900 22px Impact,sans-serif;letter-spacing:.06em}.kind-athlete .hero{display:block!important;min-height:840px;padding:50px 5vw 70px!important;background:repeating-linear-gradient(90deg,transparent 0 24.9%,#f4ede00c 25%)}.kind-athlete .hero-copy{padding:10px 0!important;max-width:80%!important}.kind-athlete h1{font:italic 900 clamp(86px,12vw,180px)/.85 Impact,sans-serif!important;letter-spacing:-.03em;max-width:9ch!important}.kind-athlete .intro{max-width:32ch;font-size:17px}.kind-athlete .hero .stage{position:absolute;right:0;top:14%;width:43%;min-height:650px!important;background:none!important;z-index:1}.drive-mark{width:270px;height:430px;background:#ff5b2b;clip-path:polygon(40% 0,100% 0,60% 43%,95% 43%,15% 100%,36% 58%,0 58%);rotate:10deg;animation:driveTension 6s ease-in-out infinite}.drive-ring{position:absolute;width:430px;height:430px;border:2px solid #ff5b2b45;border-radius:50%}.kind-athlete .stage-meta{display:none}.kind-athlete .cta{background:#ff5b2b;color:#181918;border-color:#ff5b2b;border-radius:0}.kind-athlete .motion-story{background:#ff5b2b;color:#181918}.kind-athlete .motion-story h2,.kind-athlete .instrument h2{font-family:Impact,sans-serif;text-transform:uppercase;font-weight:400}.kind-athlete .instrument{background:#252823}.kind-athlete .mode{border-radius:0;font:700 12px monospace}.kind-athlete .editorial .image{clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);filter:grayscale(1)}.kind-athlete .closing{background:#f4ede0;color:#181918}.kind-athlete[data-state='1'] .drive-mark{rotate:-12deg;scale:.85}.kind-athlete[data-state='2'] .drive-mark{scale:1.1;filter:hue-rotate(25deg)}
/* LIVEROOM: warm living room, record ritual, gentle circular motion. */
body.kind-vinyl{--bg:#efe0c6!important;--fg:#3c2f27!important;--accent:#be553b!important}.kind-vinyl header{border-bottom:1px solid #3c2f2750}.kind-vinyl .wordmark{font:400 24px Georgia,serif;letter-spacing:-.05em}.kind-vinyl .hero{display:grid!important;grid-template-columns:.9fr 1.1fr!important;gap:3vw;padding:65px 6vw!important;min-height:740px}.kind-vinyl .hero-copy{padding:30px 0!important}.kind-vinyl h1{font:400 clamp(62px,7vw,108px)/1 Georgia,serif!important;letter-spacing:-.055em;text-transform:none!important}.kind-vinyl .intro{font:18px/1.8 Georgia,serif}.kind-vinyl .hero .stage{min-height:570px!important;background:#d4b38e!important;border-radius:220px 220px 12px 12px!important}.live-record{width:350px;height:350px;border-radius:50%;background:repeating-radial-gradient(circle,#262421 0 2px,#35312c 3px 4px);box-shadow:15px 22px 25px #3c2f2730;animation:liveSpin 24s linear infinite}.live-record:before{content:'LR';position:absolute;inset:32%;border-radius:50%;background:#be553b;display:grid;place-items:center;color:#efe0c6;font:italic 48px Georgia,serif}.live-record:after{content:'';position:absolute;inset:49%;border-radius:50%;background:#efe0c6}.live-sleeve{position:absolute;left:8%;top:13%;width:240px;height:320px;background:#f6ead5;rotate:-13deg;border:1px solid #3c2f2730;box-shadow:10px 12px 30px #3c2f2720}.kind-vinyl .hero .cta{border-radius:30px;background:#3c2f27;color:#efe0c6;border-color:#3c2f27}.kind-vinyl .motion-story{background:#3c2f27;color:#efe0c6}.kind-vinyl .motion-story h2{font:400 clamp(45px,5.5vw,80px)/1.1 Georgia,serif;text-transform:none}.kind-vinyl .motion-points article{border-width:1px}.kind-vinyl .instrument{background:#ead4b2}.kind-vinyl .instrument h2,.kind-vinyl .editorial h2{font-family:Georgia,serif;text-transform:none;font-weight:400}.kind-vinyl .mode{border-radius:24px;border:1px solid #3c2f2760;color:#3c2f27}.kind-vinyl .editorial .image{border-radius:120px 120px 0 0;filter:sepia(.3)}.kind-vinyl .closing{background:#be553b;color:#fff1dc}.kind-vinyl[data-state='1'] .live-sleeve{background:#b2bf9d;rotate:7deg}.kind-vinyl[data-state='2'] .live-sleeve{background:#bc8797;rotate:-5deg}
/* KINETIC DISTRICT: horizontal street type, hard grid and walking arrows. */
body.kind-street{--bg:#deded5!important;--fg:#192cbb!important;--accent:#192cbb!important}.kind-street header{border-bottom:3px solid #192cbb}.kind-street .wordmark{font:900 18px 'Arial Black',sans-serif;letter-spacing:-.05em}.kind-street .hero{display:flex!important;flex-direction:column!important;gap:0;padding:45px 4vw 0!important;min-height:0!important}.kind-street .hero-copy{padding:0!important;width:100%;display:grid;grid-template-columns:1.4fr .6fr;gap:25px 5vw}.kind-street .eyebrow{grid-column:1/-1}.kind-street h1{font:900 clamp(70px,9vw,145px)/.9 'Arial Black',Arial,sans-serif!important;letter-spacing:-.08em;grid-column:1;grid-row:2/4;rotate:-2deg}.kind-street .intro{grid-column:2;font:16px/1.7 Arial,sans-serif;align-self:end}.kind-street .cta{grid-column:2;justify-self:start;background:#192cbb;color:#deded5;border-radius:0}.kind-street .hero .stage{width:100%;min-height:300px!important;margin-top:35px;background:#192cbb!important}.district-arrows{display:flex;gap:35px;width:max-content;animation:districtWalk 7s linear infinite}.district-arrows i{display:block;width:170px;height:170px;background:#deded5;clip-path:polygon(0 30%,55% 30%,55% 0,100% 50%,55% 100%,55% 70%,0 70%)}.kind-street .stage-meta{color:#deded5}.kind-street .pause{background:#192cbb;color:#deded5}.kind-street .motion-story{display:grid;grid-template-columns:1fr 1fr;gap:7vw}.kind-street .motion-points{grid-template-columns:1fr;margin:0}.kind-street .motion-story h2{font-family:'Arial Black',sans-serif;letter-spacing:-.06em}.kind-street .instrument{background:#f1ef54;color:#17242b}.kind-street .mode{border-radius:0;font-family:monospace;border-color:#17242b}.kind-street .editorial .image{filter:grayscale(1);clip-path:inset(0 7%)}.kind-street .closing{background:#192cbb;color:#deded5}.kind-street[data-state='1'] .district-arrows{animation-direction:reverse}.kind-street[data-state='2'] .district-arrows{animation-duration:4s}
/* PLAYFIELD FEST: playful oversized circles, bright daylight and discovery. */
body.kind-festival{--bg:#ffb8d8!important;--fg:#4932ac!important;--accent:#f3ff71!important}.kind-festival header{border-bottom:1px solid #4932ac40}.kind-festival .wordmark{font:900 20px 'Trebuchet MS',Arial,sans-serif;letter-spacing:-.05em}.kind-festival .hero{display:flex!important;flex-direction:column!important;padding:55px 6vw 0!important;gap:25px;min-height:0!important;text-align:center}.kind-festival .hero-copy{padding:0!important;align-items:center}.kind-festival h1{font:900 clamp(74px,10vw,155px)/.9 'Trebuchet MS',Arial,sans-serif!important;letter-spacing:-.065em;text-transform:none!important;max-width:11ch!important}.kind-festival .intro{font:17px/1.8 Arial,sans-serif;max-width:48ch}.kind-festival .cta{border-radius:60px;background:#4932ac;color:#fff4f8;border-color:#4932ac}.kind-festival .hero .stage{width:100%;min-height:380px!important;background:transparent!important;overflow:visible}.play-ball{width:240px;height:240px;border-radius:50%;background:#f3ff71;animation:playBounce 7s ease-in-out infinite;position:relative;box-shadow:-260px 40px 0 -30px #fe734b,260px 40px 0 -30px #8bcac1}.play-ball:before{content:'';position:absolute;inset:25%;border:20px dotted #4932ac;border-radius:50%;animation:liveSpin 35s linear infinite}.play-ball:after{content:'✦';position:absolute;right:-35px;top:-35px;color:#4932ac;font-size:100px}.kind-festival .motion-story{background:#4932ac;color:#f3ff71;border-radius:60px 60px 0 0;text-align:center}.kind-festival .motion-story h2{margin-inline:auto;text-transform:none}.kind-festival .motion-points article{border:0;background:#ffffff0c;padding:35px;border-radius:45px}.kind-festival .instrument{background:#f3ff71;color:#4932ac}.kind-festival .mode{border-radius:40px;border:1px solid #4932ac;color:#4932ac}.kind-festival .mode[aria-pressed=true]{background:#4932ac;color:#f3ff71}.kind-festival .editorial .image{border-radius:50% 50% 15px 15px}.kind-festival .closing{background:#fe734b;color:#4932ac}.kind-festival[data-state='1'] .play-ball{background:#8bcac1;rotate:25deg}.kind-festival[data-state='2'] .play-ball{background:#fe734b;scale:.88}
/* PULSE ENGINE: sound energy, stacked text and controlled wave. */
body.kind-type{--bg:#0c1213!important;--fg:#e3f3e7!important;--accent:#56f6ad!important}.kind-type header{border-bottom:1px solid #56f6ad50}.kind-type .wordmark{font:700 16px Consolas,monospace;letter-spacing:.15em}.kind-type .hero{display:grid!important;grid-template-columns:40% 60%!important;gap:2vw;padding:50px 5vw!important;min-height:840px!important}.kind-type .hero-copy{padding:40px 0!important}.kind-type h1{font:900 clamp(70px,8.5vw,130px)/.87 Impact,sans-serif!important;letter-spacing:-.02em;color:#56f6ad;max-width:7ch!important}.kind-type .intro{font:16px/1.8 Arial,sans-serif;color:#acbeb2}.kind-type .hero .stage{min-height:650px!important;background:repeating-linear-gradient(0deg,transparent 0 49px,#56f6ad10 50px),repeating-linear-gradient(90deg,transparent 0 49px,#56f6ad10 50px)!important}.pulse-wave{width:90%;height:300px;display:flex;align-items:center;justify-content:center;gap:12px}.pulse-wave i{width:12px;height:calc(35px + var(--n)*24px);background:#56f6ad;border-radius:9px;animation:pulseWave 3.5s ease-in-out infinite;animation-delay:calc(var(--n)*-.25s);transform-origin:center}.pulse-core{position:absolute;width:350px;height:350px;border:1px solid #56f6ad40;border-radius:50%}.kind-type .motion-story{background:#56f6ad;color:#0c1213}.kind-type .motion-story h2{font-family:Impact,sans-serif;font-weight:400;text-transform:uppercase}.kind-type .motion-points h3{font-family:monospace}.kind-type .instrument{background:#172622}.kind-type .mode{border-radius:0;border:1px solid #56f6ad70;font-family:monospace}.kind-type .editorial .image{filter:grayscale(1);clip-path:polygon(0 10%,100% 0,100% 90%,0 100%)}.kind-type .closing{background:#e3f3e7;color:#0c1213}.kind-type[data-state='1'] .pulse-wave{rotate:90deg}.kind-type[data-state='2'] .pulse-wave{scale:.8;filter:hue-rotate(85deg)}.pulse-wave{transition:rotate 1s,scale 1s}
/* FLASHPOINT SYSTEMS: panoramic data runway, red/white, lightweight cadence. */
body.kind-network{--bg:#f0f1ed!important;--fg:#263239!important;--accent:#f24b36!important}.kind-network header{border-bottom:1px solid #26323930}.kind-network .wordmark{font:700 15px Consolas,monospace;letter-spacing:-.03em}.kind-network .hero{display:block!important;padding:60px 6vw 330px!important;min-height:850px;background:linear-gradient(90deg,#26323905 1px,transparent 1px);background-size:80px 100%}.kind-network .hero-copy{padding:0!important;max-width:100%!important;display:grid;grid-template-columns:1.4fr .6fr;gap:25px 5vw}.kind-network .eyebrow{grid-column:1/-1}.kind-network h1{font:500 clamp(65px,8.4vw,125px)/.97 Arial,sans-serif!important;letter-spacing:-.07em;grid-column:1;grid-row:2/4}.kind-network .intro{font:16px/1.8 Arial,sans-serif;grid-column:2;align-self:end}.kind-network .cta{grid-column:2;justify-self:start;border-radius:0;background:#f24b36;color:#fff;border-color:#f24b36}.kind-network .hero .stage{position:absolute;bottom:0;left:0;min-height:280px!important;width:100%;background:#263239!important}.data-runway{position:absolute;inset:25px 0;display:grid;align-content:center;gap:28px;overflow:hidden}.data-runway i{display:block;position:relative;height:2px;background:#ffffff17}.data-runway i:after{content:'';position:absolute;top:-3px;width:90px;height:8px;background:#f24b36;animation:dataFlight 7s linear infinite;animation-delay:calc(var(--n)*-1.3s)}.kind-network .stage-meta{color:#e8efec}.kind-network .pause{background:#263239;color:#e8efec}.kind-network .motion-story{display:grid;grid-template-columns:.9fr 1.1fr;gap:5vw}.kind-network .motion-story h2{font:500 clamp(45px,5vw,75px)/1.05 Arial,sans-serif;letter-spacing:-.06em}.kind-network .motion-points{grid-template-columns:1fr;margin:0;gap:0}.kind-network .motion-points article{border-width:1px;display:grid;grid-template-columns:150px 1fr;gap:20px}.kind-network .motion-points h3{font-family:monospace}.kind-network .instrument{background:#e3e5de}.kind-network .mode{border-radius:0;font-family:monospace;border:1px solid #26323970}.kind-network .editorial .image{filter:grayscale(1)}.kind-network .closing{background:#f24b36;color:#fff}.kind-network[data-state='1'] .data-runway i:after{animation-duration:5s}.kind-network[data-state='2'] .data-runway i:after{animation-duration:3.5s;background:#a7f5de}
@keyframes driveTension{50%{transform:translateY(-12px) skewY(-3deg)}}@keyframes liveSpin{to{transform:rotate(360deg)}}@keyframes districtWalk{to{transform:translateX(-205px)}}@keyframes playBounce{50%{transform:translateY(-18px) rotate(8deg)}}@keyframes pulseWave{50%{transform:scaleY(.3)}}@keyframes dataFlight{from{left:-90px}to{left:100%}}
.animated.paused *,.animated.paused *:before,.animated.paused *:after{animation-play-state:paused!important}
@media(max-width:900px){.animated .hero{display:flex!important;flex-direction:column!important;padding:40px 6vw!important;gap:30px!important;min-height:0!important}.animated .hero-copy{display:flex!important;flex-direction:column!important;padding:0!important;max-width:100%!important;gap:24px!important}.animated .hero h1{font-size:clamp(60px,12vw,100px)!important;max-width:100%!important}.animated .hero .stage{position:relative!important;left:auto;right:auto;top:auto;bottom:auto;width:100%!important;min-height:430px!important;margin:0!important}.kind-athlete .hero .stage{min-height:460px!important}.kind-street .hero .stage,.kind-network .hero .stage{min-height:280px!important}.animated .motion-story{display:block!important;padding:55px 6vw}.animated .motion-points{grid-template-columns:1fr!important}.kind-network .motion-points article{grid-template-columns:1fr;gap:0}.animated .editorial{grid-template-columns:1fr!important;padding:60px 6vw!important}.animated .editorial .image{height:380px!important;clip-path:none!important}.animated .closing{flex-direction:column;align-items:start}.kind-festival .hero-copy{align-items:center!important}.kind-festival .hero .stage{overflow:hidden}.kind-vinyl .live-record{width:280px;height:280px}.kind-vinyl .live-sleeve{scale:.85}.kind-type .hero .stage{min-height:400px!important}.pulse-wave{gap:9px}.pulse-wave i{width:9px}.animated header .demo-note{font-size:9px}}
@media(max-width:480px){.animated .hero h1{font-size:clamp(52px,12vw,72px)!important}.drive-mark{scale:.8}.drive-ring{width:310px;height:310px}.pulse-core{width:280px;height:280px}.kind-festival .play-ball{scale:.78}.animated .stage-meta{font-size:9px;left:15px;right:15px}.animated .motion-story h2{font-size:42px}.animated .closing .cta{white-space:normal;max-width:100%}}
@media(prefers-reduced-motion:reduce){.animated *,.animated *:before,.animated *:after{animation:none!important;transition:none!important}.animated .pause{display:none}}