/* Only motion and the automatic photo slideshow. Original design: styles.css. */
:root {
  --motion-short:600ms;
  --motion-medium:900ms;
  --motion-long:1200ms;
  --motion-ease:cubic-bezier(.22,.61,.36,1);
}
#doria-nuevo *,#doria-nuevo *::before,#doria-nuevo *::after {
  transition-duration:var(--motion-short);
  transition-timing-function:var(--motion-ease);
}
#doria-nuevo .project-image img {transition-duration:var(--motion-long)}
#doria-nuevo.motion-enabled .reveal {
  transform:translate3d(0,8px,0);
  transition-duration:var(--motion-medium);
}
#doria-nuevo.motion-enabled .reveal.in-view {transform:none}
@keyframes scene-arrival {from{opacity:.25}to{opacity:1}}
@keyframes glass-arrival {
  from{opacity:0;transform:translate3d(0,8px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes content-arrival {
  from{opacity:0;transform:translate3d(0,4px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes quiet-fade {from{opacity:0}to{opacity:1}}
html[data-intro=full] #doria-nuevo .environment {
  animation:scene-arrival var(--motion-medium) var(--motion-ease) both;
}
html[data-intro=full] #doria-nuevo .hero-composition {
  animation:glass-arrival var(--motion-long) var(--motion-ease) 120ms both;
}
html[data-intro=full] #doria-nuevo .hero-title,
html[data-intro=full] #doria-nuevo .hero-index {
  animation:content-arrival var(--motion-medium) var(--motion-ease) 440ms both;
}
html[data-intro=full] #doria-nuevo .site-header {
  animation:quiet-fade var(--motion-medium) var(--motion-ease) 300ms both;
}
html[data-intro=full] #doria-nuevo .hero-bottom {
  animation:quiet-fade var(--motion-medium) var(--motion-ease) 500ms both;
}
#doria-nuevo .studio-material>img {visibility:visible}
#doria-nuevo .studio-material .slide-image {
  transition:opacity var(--motion-long) var(--motion-ease);
}
/* Captions can now describe any project, including the new photographs. */
#doria-nuevo .studio-material>span {max-width:calc(100% - 36px);line-height:1.5}
#doria-nuevo .project-dialog[open],#doria-nuevo .project-dialog[open]::backdrop {
  animation:quiet-fade var(--motion-short) var(--motion-ease) both;
}
@media(prefers-reduced-motion:reduce) {
  #doria-nuevo *,#doria-nuevo *::before,#doria-nuevo *::after {
    animation:none!important;transition:none!important;
  }
  #doria-nuevo.motion-enabled .reveal {opacity:1;transform:none}
}
html[data-intro=fade] #doria-nuevo {
  animation:quiet-fade var(--motion-short) var(--motion-ease) both!important;
}