/* =========================================================
   ELEVARE GROWTH — PREMIUM MOTION LAYER (additive)
   Loads after style.css. Colors/fonts come from existing tokens.
   ========================================================= */

/* ---------- SMOOTH SCROLL (Lenis) ---------- */
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
.lenis [data-lenis-prevent]{overscroll-behavior:contain}

/* ---------- SCROLL REVEALS: masked word reveal ---------- */
.pm-ready .pm-split .pw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.pm-ready .pm-split .pw>i{display:inline-block;font-style:inherit;transform:translate3d(0,108%,0);transition:transform 1.05s var(--ease);transition-delay:calc(var(--w,0)*55ms)}
.pm-ready .pm-split.pm-in .pw>i{transform:none}
.pm-ready .pm-split{opacity:1!important;transform:none!important}

/* ---------- THIN RULES THAT DRAW ---------- */
.pm-rule{position:relative}
.pm-rule::before{content:"";position:absolute;left:var(--edge);right:var(--edge);top:0;height:1px;background:var(--border-hi);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease);pointer-events:none;z-index:2}
.pm-rule.pm-in::before{transform:scaleX(1)}

/* ---------- MICRO INTERACTIONS ---------- */
.btn,.opening__hero-link,.premium-service-link,.home-resources-hub__cta,.footer-primary-link{translate:var(--mx,0px) var(--my,0px)}
.btn .btn-arrow,.btn>span[aria-hidden],.home-resources-hub__cta span,.opening__hero-link span,.footer-primary-link span{display:inline-block;transition:transform .5s var(--ease)}
.btn:hover .btn-arrow,.btn:hover>span[aria-hidden],.home-resources-hub__cta:hover span,.footer-primary-link:hover span{transform:translateX(6px)}
.opening__hero-link:hover span{transform:translate(3px,-3px)}
.btn:active{scale:.98}

/* ---------- FINAL CTA ---------- */
[data-pm-drift]{will-change:transform}

/* ---------- MOBILE: calmer motion ---------- */
@media(max-width:900px),(hover:none){
  .btn,.opening__hero-link,.premium-service-link,.home-resources-hub__cta,.footer-primary-link{translate:none}
  .pm-ready .pm-split .pw>i{transition-duration:.8s;transition-delay:calc(var(--w,0)*35ms)}
}

/* ---------- REDUCED MOTION ---------- */
@media(prefers-reduced-motion:reduce){
  .pm-ready .pm-split .pw>i,  .pm-rule::before{transform:none!important;transition:none!important}
  [data-pm-drift]{transform:none!important}
}


/* Ready to Elevate: preserve original Elevare CTA instead of premium motion overrides */
.global-ready-cta .btn{translate:none!important}
.global-ready-cta h2{transform:none!important}
.global-ready-cta h2 .pw{overflow:visible!important}
.global-ready-cta h2 .pw>i{transform:none!important;opacity:1!important;filter:none!important}

/* =========================================================
   STABLE PREMIUM INTERACTIONS — layout-safe final overrides
   Buttons never move their own box. Motion lives inside them.
   ========================================================= */
.btn,
.nav-cta,
.conversion-primary-cta,
.booking-secure-link,
.scorecard-analyze,
.global-ready-cta .btn{
  translate:none!important;
  transform:none!important;
  scale:none!important;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:box-shadow .45s var(--ease),border-color .4s ease,background-color .4s ease,color .4s ease,opacity .4s ease!important;
}
.btn:hover,.btn:active,.btn:focus-visible,
.nav-cta:hover,.conversion-primary-cta:hover,.booking-secure-link:hover,
.global-ready-cta .btn:hover{
  translate:none!important;
  transform:none!important;
  scale:none!important;
}
.btn::before,.global-ready-cta .btn::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:0;
  transform:translate3d(-115%,0,0) skewX(-14deg);
  background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.16) 50%,transparent 72%);
  transition:transform .85s cubic-bezier(.16,1,.3,1),opacity .3s ease;
}
.btn:hover::before,.global-ready-cta .btn:hover::before{
  opacity:1;
  transform:translate3d(115%,0,0) skewX(-14deg);
}
.btn .btn-arrow,.btn>span[aria-hidden],.global-ready-cta .btn span{
  display:inline-block;
  transform:none;
  transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .35s ease!important;
}
.btn:hover .btn-arrow,.btn:hover>span[aria-hidden],.global-ready-cta .btn:hover span{
  transform:translate3d(4px,0,0)!important;
}

/* Controlled section transition: a soft top rule + light pass, no layout movement. */
main > section{position:relative}
main > section::selection{background:rgba(111,168,240,.24)}
.pm-rule::after{
  content:"";
  position:absolute;
  left:var(--edge);right:var(--edge);top:0;height:1px;
  pointer-events:none;z-index:2;
  background:linear-gradient(90deg,transparent,rgba(133,184,248,.48),transparent);
  opacity:0;
  transition:opacity 1.1s ease .15s;
}
.pm-rule.pm-in::after{opacity:1}

/* Ready to Elevate keeps its original geometry; only its container fades in. */
.js-motion .global-ready-cta .btn,
.global-ready-cta.is-active .btn{
  transform:none!important;
  translate:none!important;
  filter:none!important;
}

@media(prefers-reduced-motion:reduce){
  .btn::before,.global-ready-cta .btn::before,.pm-rule::after{display:none!important}
  .btn .btn-arrow,.btn>span[aria-hidden],.global-ready-cta .btn span{transform:none!important;transition:none!important}
}