.contact-logo{position:relative;width:100%;max-width:440px;aspect-ratio:480 / 300;pointer-events:none;user-select:none;-webkit-user-select:none}
.contact-logo-canvas{display:block;width:100%;height:100%;transition:filter .5s cubic-bezier(.4,0,.2,1),opacity .5s cubic-bezier(.4,0,.2,1)}
/* Paused while the contact form is in use: frozen frame blurs and dips, the fully formed still fades in on top */
.contact-logo-still{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;transition:opacity .5s cubic-bezier(.4,0,.2,1)}
.contact-logo.is-paused .contact-logo-canvas{filter:blur(10px);opacity:.7}
.contact-logo.is-paused .contact-logo-still{opacity:1}
@media (prefers-reduced-motion:reduce){.contact-logo-canvas,.contact-logo-still{transition:none}}
/* Desktop: text block on top, animation as its own unit, bottom-aligned with the form card */
@media(min-width:981px){
  .contact-intro{display:flex;flex-direction:column;align-self:stretch}
  .contact-intro .contact-alt{margin-bottom:72px}
  .contact-logo{margin-top:auto}
}
/* Stacked layout: centred between the email line and the form, 48px clear above and below */
@media(max-width:980px){
  .contact-logo{width:min(100%,384px);max-width:none;max-height:240px;margin:48px auto calc(48px - clamp(40px,6vw,90px))}
}