/* Small, purposeful motion layered over the static layout. */
.brand-mark i{transform-origin:left center;animation:equalizer 2.7s ease-in-out infinite}
.brand-mark i:nth-child(2){animation-delay:.18s}.brand-mark i:nth-child(3){animation-delay:.35s}
.hero-glow{animation:glowDrift 9s ease-in-out infinite alternate}
.orbit-one{animation:orbit 42s linear infinite}.orbit-two{animation:orbitReverse 58s linear infinite}
.hero-copy{animation:arrive .8s both}.hero-visual{animation:arrive .95s .16s both}
.phone-back{animation:floatBack 7s ease-in-out infinite}.phone-front{animation:floatFront 6s ease-in-out infinite}
.floating-note{animation:noteFloat 4.5s ease-in-out infinite}
.download-disc{animation:discTurn 28s linear infinite}.disc-center{animation:discCenter 28s linear infinite}
.status-dot{animation:statusPulse 3.2s ease-out infinite}

.download-link{position:relative;isolation:isolate;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,background .25s ease,border-color .25s ease}
.download-link::after{content:"";position:absolute;inset:-75%;z-index:1;background:linear-gradient(110deg,transparent 43%,rgba(255,255,255,.46) 50%,transparent 57%);transform:translateX(-115%) rotate(14deg);transition:transform .7s ease;pointer-events:none}
.download-link:hover::after,.download-link:focus-visible::after{transform:translateX(115%) rotate(14deg)}
.button-green{box-shadow:0 0 0 0 rgba(35,219,118,0),0 15px 35px rgba(10,86,43,.23)}
.button-green:hover,.button-green:focus-visible{transform:translateY(-4px) scale(1.025);box-shadow:0 0 0 7px rgba(35,219,118,.13),0 22px 42px rgba(15,126,60,.35)}
.nav-cta:hover,.nav-cta:focus-visible{transform:translateY(-3px);background:rgba(35,219,118,.1);box-shadow:0 11px 26px rgba(0,0,0,.2)}
.download-link:active,.download-link.is-pressed{transform:translateY(1px) scale(.975)}
.download-link>span[aria-hidden]{display:inline-block;transition:transform .25s ease}
.download-link:hover>span[aria-hidden],.download-link:focus-visible>span[aria-hidden]{transform:translateY(4px)}
.nav-cta:hover>span[aria-hidden],.nav-cta:focus-visible>span[aria-hidden]{transform:translate(3px,-3px)}
.click-ripple{position:absolute;z-index:2;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:rgba(255,255,255,.55);pointer-events:none;animation:ripple .7s ease-out forwards}
.download-link:focus-visible,.text-link:focus-visible,.desktop-nav a:focus-visible,.underlined-link:focus-visible{outline:3px solid #b6ffce;outline-offset:5px}
.showcase-display .phone,.library-phone{transition:transform .5s ease,box-shadow .5s ease}
.showcase-display:hover .phone{transform:translateY(-12px) rotate(-2deg);box-shadow:0 35px 65px rgba(0,0,0,.45)}
.library-art:hover .library-phone{transform:translateY(-10px) rotate(1deg)}
.motion-ready .reveal-target{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.motion-ready .reveal-target.is-visible{opacity:1;transform:translateY(0)}

@keyframes equalizer{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.72)}}
@keyframes glowDrift{from{transform:translate(-30px,-12px) scale(.9);opacity:.11}to{transform:translate(32px,16px) scale(1.22);opacity:.22}}
@keyframes orbit{from{transform:rotate(-20deg)}to{transform:rotate(340deg)}}
@keyframes orbitReverse{from{transform:rotate(20deg)}to{transform:rotate(-340deg)}}
@keyframes arrive{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
@keyframes floatBack{0%,100%{transform:translateY(0) rotate(-12deg)}50%{transform:translateY(-14px) rotate(-10deg)}}
@keyframes floatFront{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(13px) rotate(6deg)}}
@keyframes noteFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes discTurn{to{transform:rotate(346deg)}}
@keyframes discCenter{to{transform:rotate(-360deg)}}
@keyframes statusPulse{0%,100%{box-shadow:0 0 0 4px rgba(35,219,118,.15)}45%{box-shadow:0 0 0 10px rgba(35,219,118,0)}}
@keyframes ripple{to{transform:scale(32);opacity:0}}

@media(max-width:560px){.brand{font-size:15px;letter-spacing:-.055em}.brand-mark{flex:none}}
@media(max-width:380px){.brand{font-size:13px}.nav-cta{font-size:10px;padding:9px 10px}}
@media(prefers-reduced-motion:reduce){
  .brand-mark i,.hero-glow,.orbit,.hero-copy,.hero-visual,.phone-back,.phone-front,.floating-note,.download-disc,.disc-center,.status-dot{animation:none!important}
  .download-link,.download-link::after,.download-link>span[aria-hidden],.showcase-display .phone,.library-phone,.motion-ready .reveal-target{transition:none!important}
  .motion-ready .reveal-target{opacity:1;transform:none}
  .click-ripple{display:none}
}