:root{--motion-ease:cubic-bezier(.22,1,.36,1);--motion-fast:220ms;--motion-slow:650ms}
html{scroll-behavior:smooth;scroll-padding-top:90px}
a,button,input,summary{transition:color var(--motion-fast) ease,background-color var(--motion-fast) ease,border-color var(--motion-fast) ease,box-shadow 300ms ease,transform 360ms var(--motion-ease),opacity var(--motion-fast) ease}
a,button,input{-webkit-tap-highlight-color:transparent}
button:active,.btn:active{transform:scale(.97)}
input:focus{box-shadow:0 0 0 4px var(--accent-soft,#e8f0ef)}
.chevron{transition:transform 420ms var(--motion-ease)!important}
details.motion-closing>summary .chevron{transform:rotate(0)!important}
.rule{transform-origin:left center}
@media(hover:hover) and (pointer:fine){
  button:hover,.btn:hover,.meta a:hover,.links a:hover,.proposal-more:hover,.text-button:hover{transform:translateY(-2px)}
  .ctrl:hover,.header-whatsapp:hover{transform:translateY(-2px) rotate(-4deg)}
  figure img,.week-card img,.proposal-ref img,.awkito-image img,.masonry img{transition:transform 850ms var(--motion-ease),opacity 300ms ease}
  figure:hover img,.week-card:hover img,.awkito-image:hover img{transform:scale(1.025)}
  .masonry img:hover{transform:translateY(-3px)}
  .service,.copy-box,.week-card,.vidcard,.awkito-image{transition:border-color 300ms ease,box-shadow 450ms ease,transform 600ms var(--motion-ease)}
  .service:hover,.copy-box:hover,.week-card:hover,.vidcard:hover{transform:translateY(-3px)}
  summary:hover{color:var(--accent)}
  .week>summary:hover,.deliverable>summary:hover{background-color:var(--accent-soft)}
  #week-links a:hover,.photo-filter:hover,.proposal-switch button:hover,.filters button:hover{transform:translateY(-2px)}
}
.cv-dialog[open],.image-dialog[open]{animation:motion-dialog-in 420ms var(--motion-ease)}
dialog[open]::backdrop{animation:motion-backdrop-in 300ms ease}
.lb.open{animation:motion-backdrop-in 280ms ease}
.lb.open img{animation:motion-dialog-in 440ms var(--motion-ease)}
@keyframes motion-dialog-in{from{opacity:0;transform:translateY(18px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes motion-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes motion-auth-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
.auth-motion main>*{animation:motion-auth-in 700ms var(--motion-ease) both}
.auth-motion main>h1{animation-delay:60ms}.auth-motion main>p{animation-delay:120ms}.auth-motion main>form{animation-delay:180ms}.auth-motion main>.signature{animation-delay:240ms}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
@media print{*,*::before,*::after{animation:none!important;transition:none!important;translate:none!important;opacity:1!important}}
