/**
 * Scroll Float — React Bits scrub (portfolio) + one-shot (about).
 */

/* —— 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%;
  will-change: opacity, transform;
  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);
  will-change: opacity, transform;
}

/* —— Portfolio: scrub driven by JS inline styles every scroll frame —— */
body.home-navy.page-inner .scroll-float-zone .port-box2.sf-float,
body.page-inner .scroll-float-zone .port-box2.sf-float {
  overflow: hidden;
  transform-origin: 50% 0%;
  transition: none !important;
  /* Hidden until first scrub paint */
  opacity: 0;
}

/* First row — crisp from load */
body.home-navy.page-inner .scroll-float-zone .port-box2.sf-float.sf-open,
body.page-inner .scroll-float-zone .port-box2.sf-float.sf-open {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  pointer-events: auto !important;
}

/* Reduced motion */
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;
}

@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;
  }
}