/* OneShotLens interior motion system — editorial, restrained, responsive. */

.site-motion-ready body:not(.is-site-settled):not(.site-motion-home) > :where(main, section, footer) {
  opacity: 0;
  transform: translate3d(0, 8px, 0);
}

.site-motion-ready body:not(.site-motion-home) > :where(main, section, footer) {
  transition: opacity 480ms var(--oneshot-ease, cubic-bezier(.22,.72,.18,1)), transform 580ms cubic-bezier(.16,1,.3,1);
}

.site-motion-target {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity 620ms var(--oneshot-ease, cubic-bezier(.22,.72,.18,1)), transform 740ms cubic-bezier(.16,1,.3,1);
}

.site-motion-target.is-motion-visible {
  opacity: 1;
  transform: none;
}

/* AI: information assembles in a deliberate hierarchy. */
.ai-page .osl-experiment .intro > div {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity 680ms var(--oneshot-ease), transform 820ms cubic-bezier(.16,1,.3,1);
}

.ai-page.is-site-settled .osl-experiment .intro > div {
  opacity: 1;
  transform: none;
}

.ai-page .osl-experiment .intro > div:nth-child(2) { transition-delay: 90ms; }

.ai-page .instrument .territories button,
.ai-page .instrument .controls,
.ai-page .instrument .below,
.ai-page .instrument .directory {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  transition: opacity 520ms var(--oneshot-ease), transform 640ms cubic-bezier(.16,1,.3,1);
}

.ai-page .instrument.is-motion-visible .territories button,
.ai-page .instrument.is-motion-visible .controls,
.ai-page .instrument.is-motion-visible .below,
.ai-page .instrument.is-motion-visible .directory {
  opacity: 1;
  transform: none;
}

.ai-page .instrument .territories button { transition-delay: var(--motion-delay, 0ms); }
.ai-page .instrument .stage {
  opacity: .18;
  transform: translate3d(0, 14px, 0) scale(.974);
  transform-origin: 50% 48%;
  transition: opacity 720ms var(--oneshot-ease), transform 920ms cubic-bezier(.16,1,.3,1);
}
.ai-page .instrument.is-motion-visible .stage { opacity: 1; transform: none; }

.ai-page .instrument { position: relative; border-top-color: transparent; }
.ai-page .instrument::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--oneshot-navy, #1d2f4e);
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 820ms cubic-bezier(.16,1,.3,1);
}
.ai-page .instrument.is-motion-visible::before { transform: scaleX(1); }
.ai-page .instrument .controls { transition-delay: 120ms; }
.ai-page .instrument .below { transition-delay: 170ms; }
.ai-page .instrument .directory { transition-delay: 220ms; }

.ai-page .capability-horizon-art {
  transform: scale(1.018);
  transform-origin: 70% 60%;
  transition: opacity 800ms var(--oneshot-ease), transform 1100ms cubic-bezier(.16,1,.3,1);
}
.ai-page .capability-horizon.is-motion-visible .capability-horizon-art { transform: none; }

/* Photography: the print settles before the caption asks for attention. */
.timeline-item {
  transform: translate3d(-18px, 8px, 0);
  transition: opacity 660ms var(--oneshot-ease), transform 820ms cubic-bezier(.16,1,.3,1);
}
.timeline-item.side-right { transform: translate3d(18px, 8px, 0); }
.timeline-item.is-visible { transform: none; }

.timeline-photo {
  opacity: .62;
  filter: saturate(.88) contrast(.985);
  transform: scale(1.018);
  transition: opacity 760ms var(--oneshot-ease), filter 900ms var(--oneshot-ease), transform 1050ms cubic-bezier(.16,1,.3,1);
}

.timeline-item.is-visible .timeline-photo {
  opacity: 1;
  filter: none;
  transform: none;
}

.timeline-caption {
  opacity: 0;
  transform: translate3d(0, 7px, 0);
  transition: opacity 480ms var(--oneshot-ease) 120ms, transform 620ms cubic-bezier(.16,1,.3,1) 120ms;
}
.timeline-item.is-visible .timeline-caption { opacity: 1; transform: none; }

.hero-camera-outline {
  transform-origin: 50% 55%;
  animation: camera-settle 1100ms cubic-bezier(.16,1,.3,1) both;
}

@keyframes camera-settle {
  from { opacity: 0; transform: translate3d(-50%, 12px, 0) scale(1.015); }
  to { opacity: .058; transform: translate3d(-50%, 0, 0); }
}

/* Bio: the portrait arrives like a print settling onto a table. */
.bio-page .about-portrait-wrap.reveal {
  opacity: 0;
  transform: translate3d(-12px, 26px, 0) rotate(-1.35deg) scale(.965);
  transform-origin: 46% 58%;
  transition: opacity 760ms var(--oneshot-ease), transform 1120ms cubic-bezier(.16,1,.3,1);
}

.bio-page .about-portrait-wrap.reveal.is-visible {
  opacity: 1;
  transform: none;
}

.bio-page .about-portrait-photo {
  transform: scale(1.035);
  transition: transform 1380ms cubic-bezier(.16,1,.3,1);
}

.bio-page .about-portrait-wrap.is-visible .about-portrait-photo { transform: none; }

/* Contact: one composed closing sequence, not a stack of unrelated fields. */
.contact-block,
.newsletter-block { position: relative; }

.contact-page .about-copy > h1,
.contact-page .about-copy > p,
.contact-page .contact-block,
.contact-page .newsletter-block,
.contact-page .contact-form .btn {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  transition: opacity 500ms var(--oneshot-ease), transform 640ms cubic-bezier(.16,1,.3,1);
}

.contact-page .about-copy.is-visible > h1,
.contact-page .about-copy.is-visible > p,
.contact-page .about-copy.is-visible .contact-block,
.contact-page .about-copy.is-visible .newsletter-block,
.contact-page .about-copy.is-visible .contact-form .btn {
  opacity: 1;
  transform: none;
}

.contact-page .about-copy > p { transition-delay: 70ms; }
.contact-page .contact-block { transition-delay: 140ms; }
.contact-page #contact-form .btn { transition-delay: 430ms; }
.contact-page .newsletter-block { transition-delay: 520ms; }
.contact-page #newsletter-form .btn { transition-delay: 690ms; }

.contact-block::before,
.newsletter-block::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, var(--oneshot-gold-shadow), var(--oneshot-gold-highlight), transparent 82%);
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 760ms cubic-bezier(.16,1,.3,1);
}

.is-motion-visible .contact-block::before,
.is-motion-visible .newsletter-block::before,
.about-copy.is-visible .contact-block::before,
.about-copy.is-visible .newsletter-block::before { transform: scaleX(1); }

.contact-form .form-row {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  transition: opacity 520ms var(--oneshot-ease), transform 640ms cubic-bezier(.16,1,.3,1);
  transition-delay: var(--motion-delay, 80ms);
}

.about-copy.is-visible .contact-form .form-row,
.is-motion-visible .contact-form .form-row { opacity: 1; transform: none; }

.form-row input,
.form-row textarea {
  transition: border-color 160ms var(--oneshot-ease), box-shadow 180ms var(--oneshot-ease), background-color 180ms var(--oneshot-ease);
}

.form-row input:focus,
.form-row textarea:focus { box-shadow: 0 3px 0 rgba(198, 161, 83, .13); }

/* Let active controls feel physical without turning them into effects. */
:where(.timeline-sort-btn, .shutter-toggle-btn, .osl-experiment button:not(.node)):active {
  transform: translate3d(0, 1px, 0) scale(.985);
}

@media (max-width: 720px) {
  .site-motion-target { transform: translate3d(0, 11px, 0); transition-duration: 500ms, 600ms; }
  .timeline-item,
  .timeline-item.side-right { transform: translate3d(0, 12px, 0); }
  .timeline-item.is-visible { transform: none; }
  .ai-page .osl-experiment .intro > div { transform: translate3d(0, 12px, 0); }
  .ai-page .instrument .territories button { transition-delay: var(--motion-delay-mobile, 0ms); }
  .contact-form .form-row { transform: translate3d(0, 7px, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .site-motion-ready body > :where(main, section, footer),
  .site-motion-target,
  .ai-page .osl-experiment .intro > div,
  .ai-page .instrument .territories button,
  .ai-page .instrument .stage,
  .ai-page .instrument .controls,
  .ai-page .instrument .below,
  .ai-page .instrument .directory,
  .ai-page .capability-horizon-art,
  .timeline-item,
  .timeline-photo,
  .timeline-caption,
  .bio-page .about-portrait-wrap.reveal,
  .bio-page .about-portrait-photo,
  .contact-page .about-copy > h1,
  .contact-page .about-copy > p,
  .contact-page .contact-block,
  .contact-page .newsletter-block,
  .contact-page .contact-form .btn,
  .contact-form .form-row {
    opacity: 1;
    filter: none;
    transform: none;
    animation: none;
    transition: none;
  }
  .contact-block::before,
  .newsletter-block::before,
  .ai-page .instrument::before { transform: scaleX(1); transition: none; }
}