/* Quiet musical motion, independent of the page's existing scrolling. */
.hero-photo{translate:var(--hero-image-x,0px) var(--hero-image-y,0px);animation:hero-camera-breathe 18s ease-in-out infinite;will-change:transform,translate}
.hero-atmosphere{inset:0;background:radial-gradient(ellipse 58% 80% at var(--hero-glow-x,28%) var(--hero-glow-y,56%),#9874cf5e,transparent 72%);opacity:.46;mask-image:linear-gradient(90deg,#000 0 30%,transparent 66%);-webkit-mask-image:linear-gradient(90deg,#000 0 30%,transparent 66%)}
.hero .hero-optics{display:block;inset:0 auto 0 0;width:60%;z-index:-1;mix-blend-mode:screen;mask-image:linear-gradient(90deg,#000 0 52%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 0 52%,transparent 100%)}
.hero .hero-leak{inset:-30%;background:radial-gradient(ellipse 38% 60% at 30% 65%,#bea5e720,transparent 78%);filter:blur(18px);animation:hero-light-drift 15s ease-in-out infinite;opacity:.5}
.hero .hero-reflection{inset:0;background:radial-gradient(ellipse 50% 70% at var(--hero-glow-x,28%) var(--hero-glow-y,56%),#91d1fa0e,transparent 70%);opacity:.5}
.hero .hero-exposure{width:140%;height:170%;inset:auto auto -95% -65%;border:0;padding:2px;box-shadow:none;border-radius:50%;background:conic-gradient(from 25deg,transparent 8%,#bfa8e436 25%,#b6f0ef52 30%,#e9d4f855 34%,transparent 42%,transparent 100%);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask-composite:xor;filter:blur(1px);opacity:.48;animation:hero-orbit-drift 20s ease-in-out infinite}
.hero .stamp-orbit::before{border-color:#d4bdd935;border-top-color:#eee4ffe6;border-right-color:#a8eaf791;animation:badge-orbit 9s linear infinite}
.kit-wave{display:flex;align-items:center;gap:3px;width:76px;height:18px;margin-top:19px;opacity:.38;pointer-events:none}
.kit-wave i{width:2px;height:var(--kit-bar-height,10px);border-radius:5px;flex-shrink:0;background:linear-gradient(#d9d1eb,#a2b6d9);transform-origin:center;animation:kit-signal var(--kit-bar-speed,3s) ease-in-out infinite;animation-delay:var(--kit-bar-delay,0s)}
.sound-placement:hover .kit-wave{opacity:.75}.sound-placement:hover .kit-wave i{animation-duration:1.7s}
.sound-placement.has-artwork{display:grid;grid-template-columns:88px minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:0 18px;padding:24px}
.sound-cover{grid-column:1;grid-row:1/5;display:block;width:88px;height:88px;object-fit:cover;border-radius:13px;border:1px solid #ffffff20;box-shadow:0 8px 25px #0004;align-self:center;transition:transform .5s var(--ease)}
.sound-placement.has-artwork .sound-kit{grid-column:2;grid-row:1;font-size:7px;padding-right:15px}
.sound-placement.has-artwork h3{grid-column:2;grid-row:2;font-size:24px;margin-top:10px}
.sound-placement.has-artwork p{grid-column:2;grid-row:3;font-size:9px;line-height:1.6;margin-top:7px}
.sound-placement.has-artwork .kit-wave{grid-column:2;grid-row:4;margin-top:12px;align-self:end}
.sound-placement.has-artwork .placement-arrow{font-size:14px;right:15px;top:18px}
.sound-placement.has-artwork:hover .sound-cover{transform:translateY(-2px) rotate(-2deg)}
.impact-source span{transition:transform .3s ease}.impact-source:hover span{transform:translate(2px,-2px)}
.ambient-resting .kit-wave i,.hero.ambient-resting .hero-photo,.hero.ambient-resting .hero-atmosphere,.hero.ambient-resting .hero-optics i,.hero.ambient-resting .stamp-orbit::before{animation-play-state:paused}
body.motion-paused .hero-photo{translate:0 0;scale:1}body.motion-paused .hero-optics i{animation-play-state:paused!important}
@keyframes hero-camera-breathe{0%,100%{scale:1.006}50%{scale:1.022}}
@keyframes hero-light-drift{0%,100%{transform:translate(-3%,2%) rotate(-6deg);opacity:.35}50%{transform:translate(5%,-3%) rotate(3deg);opacity:.58}}
@keyframes hero-orbit-drift{0%,100%{transform:rotate(-18deg) translate(0,0)}50%{transform:rotate(-10deg) translate(12px,-8px)}}
@keyframes badge-orbit{to{transform:rotate(360deg)}}
@keyframes kit-signal{0%,100%{transform:scaleY(.38)}32%{transform:scaleY(.82)}62%{transform:scaleY(1)}82%{transform:scaleY(.5)}}
@media(max-width:1100px) and (min-width:761px){.sound-placement.has-artwork{grid-template-columns:70px minmax(0,1fr);gap:0 13px;padding:20px 17px}.sound-cover{width:70px;height:70px}.sound-placement.has-artwork h3{font-size:20px}.sound-placement.has-artwork .sound-kit{font-size:6px}}
@media(max-width:760px){.hero-photo{animation-duration:22s}.hero .hero-optics{width:100%;height:33%;top:auto;bottom:0;mask-image:linear-gradient(0deg,#000,transparent 90%);-webkit-mask-image:linear-gradient(0deg,#000,transparent 90%)}.hero .hero-exposure{inset:auto auto -80% -50%;height:200%;width:150%;opacity:.4}.hero-atmosphere{mask-image:linear-gradient(180deg,#000,transparent 33%,transparent 80%,#000);-webkit-mask-image:linear-gradient(180deg,#000,transparent 33%,transparent 80%,#000)}.sound-placement.has-artwork{grid-template-columns:96px minmax(0,1fr);padding:23px;gap:0 19px}.sound-cover{width:96px;height:96px}.sound-placement.has-artwork h3{font-size:25px}.sound-placement.has-artwork p{font-size:10px}.sound-placement.has-artwork .sound-kit{font-size:7px}}
@media(max-width:380px){.sound-placement.has-artwork{grid-template-columns:80px minmax(0,1fr);gap:0 15px;padding:20px}.sound-cover{width:80px;height:80px}.sound-placement.has-artwork h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){.hero-photo{animation:none;translate:0 0;scale:1;will-change:auto}.hero .hero-optics i,.hero .stamp-orbit::before,.kit-wave i{animation:none!important}.sound-placement.has-artwork:hover .sound-cover{transform:none}}
