/* V3.5 motion layer. No brand, type, color, canvas or model changes. */
.company-scroll-track { position:relative; overflow:visible; }
.portfolio.has-scroll-sequence .directory {
  position:sticky;
  top:var(--sequence-top,112px);
  height:var(--sequence-height,640px);
  align-items:start;
}
.portfolio.has-scroll-sequence .directory-index {
  display:flex; flex-direction:column; height:100%; min-height:0;
}
.portfolio.has-scroll-sequence .directory-guide { flex:none; }
.company-list-window { position:relative; }
.portfolio.has-scroll-sequence .company-list-window {
  flex:1; min-height:0; overflow:hidden; overflow:clip;
  /* Only the directory names are windowed; the sculpture is never clipped. */
  padding:1px 0;
}
.portfolio.has-scroll-sequence .company-list {
  transform:translate3d(0,var(--index-shift,0px),0); will-change:transform;
}
.portfolio.has-scroll-sequence .company-preview {
  position:relative; top:auto; align-self:start;
}
.portfolio.has-scroll-sequence .preview-picture img,
.portfolio.has-flow-sequence .preview-picture img {
  transform:translate3d(0,var(--image-shift,0px),0) scale(1.045);
  will-change:transform;
}
.portfolio .company-choice { scroll-margin-top:var(--sequence-top,140px); }
.portfolio.has-flow-sequence .company-row { scroll-margin-top:var(--sequence-top,140px); }
.portfolio.has-flow-sequence .company-preview { will-change:auto; }
.portfolio .company-preview.is-entering .preview-meta,
.portfolio .company-preview.is-entering .preview-title,
.portfolio .company-preview.is-entering .preview-sub,
.portfolio .company-preview.is-entering .preview-desc {
  animation:orbis-company-enter 380ms cubic-bezier(.22,.61,.36,1) both;
}
.portfolio .company-preview.is-entering .preview-sub { animation-delay:35ms; }
.portfolio .company-preview.is-entering .preview-desc { animation-delay:65ms; }
@keyframes orbis-company-enter {
  from { opacity:.3; transform:translate3d(0,9px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
/* The opening animation uses opacity and small text translations.
   The 3D parent only fades: its geometry, dimensions, camera and drag stay intact. */
@media(prefers-reduced-motion:no-preference) {
  .orbis-intro-pending .hero-kicker,
  .orbis-intro-pending #heroTitle>span,
  .orbis-intro-pending .hero-edge,
  .orbis-intro-pending .hero-foot,
  .orbis-intro-pending .hero-baseline { opacity:0; }
  .orbis-intro-pending .hero-art.hero-art--3d { opacity:0; animation:none; }
  .orbis-intro-running .hero-kicker {
    animation:orbis-banner-enter 650ms cubic-bezier(.2,.65,.3,1) both;
  }
  .orbis-intro-running #heroTitle>span {
    animation:orbis-banner-enter 820ms cubic-bezier(.2,.65,.3,1) 60ms both;
  }
  .orbis-intro-running #heroTitle>span:nth-child(2) { animation-delay:160ms; }
  .orbis-intro-running .hero-art.hero-art--3d {
    animation:orbis-object-enter 900ms ease-out 180ms both;
  }
  .orbis-intro-running .hero-edge {
    animation:orbis-banner-enter 750ms ease-out 240ms both;
  }
  .orbis-intro-running .hero-foot {
    animation:orbis-banner-enter 760ms cubic-bezier(.2,.65,.3,1) 290ms both;
  }
  .orbis-intro-running .hero-baseline {
    animation:orbis-object-enter 750ms ease-out 360ms both;
  }
}
@keyframes orbis-banner-enter {
  from { opacity:0; transform:translate3d(0,14px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
@keyframes orbis-object-enter { from {opacity:0;} to {opacity:1;} }
@media(prefers-reduced-motion:reduce) {
  .orbis-intro-pending .hero-kicker,
  .orbis-intro-pending #heroTitle>span,
  .orbis-intro-pending .hero-edge,
  .orbis-intro-pending .hero-foot,
  .orbis-intro-pending .hero-baseline,
  .orbis-intro-pending .hero-art.hero-art--3d { opacity:1; }
  .portfolio .company-preview, .portfolio .preview-picture img { transform:none!important; }
}
.portfolio .company-preview.is-entering .preview-picture {
  animation:orbis-company-photo 380ms ease-out both;
}
@keyframes orbis-company-photo { from {opacity:.55;} to {opacity:1;} }