/**
 * Scroll Float — portfolio pop-in + about one-shot.
 */

/* —— About (char / block) —— */
body.page-inner .scroll-float-zone .scroll-float {
  overflow: hidden;
}

body.page-inner .scroll-float-zone .sf-char {
  display: inline-block;
  opacity: 0;
  transform: translate3d(0, 120%, 0) scaleY(2.3) scaleX(0.7);
  transform-origin: 50% 0%;
  font: inherit;
  color: inherit;
  vertical-align: baseline;
}

body.page-inner .scroll-float-zone .sf-char--space {
  white-space: pre;
}

body.page-inner .scroll-float-zone .sf-item:not(.sf-float) {
  opacity: 0;
  transform: translate3d(0, 48px, 0);
}

/* —— Portfolio: visible squash pop on enter —— */
body.home-navy.page-inner .scroll-float-zone .port-box2.sf-float,
body.page-inner .scroll-float-zone .port-box2.sf-float {
  overflow: visible;
  transform-origin: 50% 0%;
  opacity: 0;
  transform: translate3d(0, 88px, 0) scaleY(1.85) scaleX(0.78);
  transition:
    opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform, opacity;
}

body.home-navy.page-inner .scroll-float-zone .port-box2.sf-float.is-in,
body.page-inner .scroll-float-zone .port-box2.sf-float.is-in {
  opacity: 1;
  transform: translate3d(0, 0, 0) scaleY(1) scaleX(1);
}

body.page-inner .scroll-float-zone.sf-reduced .sf-char,
body.page-inner .scroll-float-zone.sf-reduced .sf-item,
body.page-inner .scroll-float-zone.sf-reduced .port-box2.sf-float {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
  pointer-events: auto !important;
  animation: none !important;
}

@media (prefers-reduced-motion: reduce) {
  body.page-inner .scroll-float-zone .sf-char,
  body.page-inner .scroll-float-zone .sf-item,
  body.page-inner .scroll-float-zone .port-box2.sf-float {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
    pointer-events: auto !important;
    animation: none !important;
  }
}

@media (max-width: 991px) {
  body.page-inner .scroll-float-zone .sf-char,
  body.page-inner .scroll-float-zone .sf-item,
  body.page-inner .scroll-float-zone .port-box2.sf-float {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
    pointer-events: auto !important;
    animation: none !important;
  }
}
