/* Actualis Orbital FX 1.0.0 */
.fx-canvas{position:fixed;left:0;top:0;width:100%;height:100vh;height:100lvh;z-index:-1;pointer-events:none;display:block;contain:strict}
/* pre-boot: hide hero copy/art until the FX layer decides; 3s failsafe if JS never runs */
html.fx-pre:not(.fx-gl):not(.fx-nogl) .hero .hero-copy,html.fx-pre:not(.fx-gl):not(.fx-nogl) .hero .art{opacity:0;animation:fx-failsafe .6s ease 3s forwards}
@keyframes fx-failsafe{to{opacity:1}}
html.fx-gl body.actualis-site,html.fx-gl body{background:transparent!important}
html.fx-gl{background:#070e1e}
html.fx-gl .hero .art svg{visibility:hidden}
html.fx-gl .services-section,html.fx-gl .top,html.fx-gl main>section{background-color:transparent}

/* split words */
.fx-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.fx-wi{display:inline-block;will-change:transform}
html.fx-gl:not(.fx-ready) .hero h1 .fx-wi{transform:translate3d(0,110%,0) rotate(4deg)}
html.fx-gl .hero h1 .fx-wi{transition:transform 1.15s cubic-bezier(.16,1,.3,1) calc(var(--i)*.07s + .05s)}
.fx-w.fx-fade{overflow:visible}
html.fx-gl:not(.fx-ready) .hero .lead .fx-wi{opacity:0;filter:blur(6px)}
html.fx-gl .hero .lead .fx-wi{transition:opacity .9s ease calc(var(--i)*.022s + .45s),filter .9s ease calc(var(--i)*.022s + .45s)}
html.fx-gl:not(.fx-ready) .hero .eyebrow{opacity:0;transform:translateX(-14px)}
html.fx-gl .hero .eyebrow{transition:opacity .8s ease .1s,transform .8s cubic-bezier(.16,1,.3,1) .1s}
html.fx-intro-full .actualis-header{opacity:0;transform:translateY(-10px)}
html.fx-gl .actualis-header{transition:opacity .9s ease .35s,transform .9s cubic-bezier(.16,1,.3,1) .35s}
html.fx-intro-full main>*:not(.hero){opacity:0}
html.fx-gl main>*{transition:opacity .9s ease .5s}

/* scroll reveals */
html.fx-gl .fx-rv:not(.fx-in) h2 .fx-wi,html.fx-gl h2.fx-rv:not(.fx-in) .fx-wi{transform:translate3d(0,110%,0)}
html.fx-gl h2 .fx-wi{transition:transform 1s cubic-bezier(.16,1,.3,1) calc(var(--i)*.055s)}
html.fx-gl .fx-tile.fx-rv:not(.fx-in),html.fx-gl .step.fx-rv:not(.fx-in),html.fx-gl .contact.fx-rv:not(.fx-in),html.fx-gl .simplu-home.fx-rv:not(.fx-in){opacity:0;transform:translate3d(0,40px,0) scale(.98);clip-path:inset(0 0 18% 0 round 12px)}
html.fx-gl .fx-tile.fx-rv,html.fx-gl .step.fx-rv,html.fx-gl .contact.fx-rv,html.fx-gl .simplu-home.fx-rv{transition:opacity .9s ease var(--d,0s),transform 1.1s cubic-bezier(.16,1,.3,1) var(--d,0s),clip-path 1.1s cubic-bezier(.16,1,.3,1) var(--d,0s)}

/* service tiles — glass, spotlight, tilt */
html.fx-gl .service.fx-tile{position:relative;isolation:isolate;background:linear-gradient(135deg,rgba(21,35,58,.78),rgba(9,18,33,.86))!important;transform-style:preserve-3d}
html.fx-gl .service.fx-tile.fx-in{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(0);transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .3s,opacity .9s ease var(--d,0s),clip-path 1.1s cubic-bezier(.16,1,.3,1) var(--d,0s)}
@media (hover:hover) and (pointer:fine){html.fx-gl .service.fx-tile:hover{border-color:rgba(97,213,255,.55)}}
html.fx-gl .service.fx-tile:after{content:'';position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;transition:opacity .35s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(56,190,255,.16),transparent 45%)}
@media (hover:hover) and (pointer:fine){html.fx-gl .service.fx-tile:hover:after{opacity:1}}
html.fx-gl .service.fx-tile:focus-visible{border-color:rgba(97,213,255,.7)}
html.fx-gl .service.fx-tile:before{z-index:-1}
html.fx-gl .service.fx-tile h3,html.fx-gl .service.fx-tile .card-top{transform:translateZ(24px)}

/* magnetic buttons */
.fx-mag{transform:translate3d(var(--tx,0px),var(--ty,0px),0);transition:transform .5s cubic-bezier(.16,1,.3,1),background .2s,box-shadow .25s}

/* readability over the live background on small / mid screens */
@media (max-width:899px){html.fx-gl .hero-copy{text-shadow:0 2px 28px rgba(7,14,30,.9),0 0 2px rgba(7,14,30,.6)}
  html.fx-gl .service.fx-tile{background:linear-gradient(135deg,rgba(21,35,58,.88),rgba(9,18,33,.93))!important}}
@media (max-width:599px){html.fx-gl .fx-tile.fx-rv:not(.fx-in){transform:translate3d(0,26px,0)}}
/* lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

@media (prefers-reduced-motion:reduce){
  .fx-wi,.fx-tile,.fx-mag{transition:none!important;transform:none!important;opacity:1!important;filter:none!important;clip-path:none!important}
}
