/* Revuity Group Holdings motion layer.
   Progressive enhancement: everything below the "motion-ready" gate is added by motion.js,
   and motion.js does nothing under prefers-reduced-motion. Without JS the site is fully static. */

:root{--ease:cubic-bezier(.16,1,.3,1);--ease-soft:cubic-bezier(.4,0,.2,1)}

/* ---------- always-on micro-interactions (killed by the reduced-motion rule in styles.css) ---------- */
.desktop-nav a{position:relative;padding:6px 0}
.desktop-nav a::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--gold);scale:0 1;transform-origin:left;transition:scale .4s var(--ease)}
.desktop-nav a:hover::after,.desktop-nav a.active::after{scale:1 1}
.btn span{display:inline-block;transition:translate .3s var(--ease)}
.btn:hover span{translate:3px -3px}
.btn-accent{position:relative;overflow:hidden}
.btn-accent::after{content:'';position:absolute;top:0;bottom:0;left:0;width:36%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);translate:-160% 0;transition:translate .8s var(--ease);pointer-events:none}
.btn-accent:hover::after{translate:420% 0}
.pulse-dot{position:relative}
.pulse-dot::after{content:'';position:absolute;inset:0;border-radius:50%;border:1px solid var(--gold);animation:ring 2.4s var(--ease-soft) infinite}
@keyframes ring{0%{scale:1;opacity:.8}100%{scale:3.2;opacity:0}}
.terminal-content p .code-lime{display:inline-block;animation:dot 2.2s ease-in-out infinite}
@keyframes dot{50%{opacity:.35}}

/* ---------- gated: only when motion.js confirmed motion is allowed ---------- */
.motion-ready:not(.motion-go) body{visibility:hidden}

.scroll-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:60;background:var(--gold);box-shadow:0 0 12px rgba(232,198,124,.6);transform:scaleX(0);transform-origin:left;pointer-events:none}
.cursor-glow{position:fixed;left:0;top:0;width:680px;height:680px;margin:-340px 0 0 -340px;z-index:-1;pointer-events:none;border-radius:50%;background:radial-gradient(circle,rgba(232,198,124,.075),transparent 66%);opacity:0;transition:opacity .8s var(--ease-soft);will-change:transform}
.cursor-glow.on{opacity:1}
.motion-ready .site-grid::after{content:'';position:absolute;left:0;right:0;top:0;height:160px;background:linear-gradient(to bottom,transparent,rgba(232,198,124,.05),transparent);animation:sweep 11s linear infinite}
@keyframes sweep{from{translate:0 -180px}to{translate:0 1200px}}

.header{transition:background .4s var(--ease-soft),box-shadow .4s var(--ease-soft),border-color .4s var(--ease-soft)}
.header.is-scrolled{background:rgba(10,9,7,.96);border-color:#2b2824;box-shadow:0 14px 40px rgba(0,0,0,.45)}

/* reveal: opacity + translate (individual transform props, so existing transforms survive) */
.motion-ready [data-reveal]:not([data-reveal=split]):not(.in){opacity:0;translate:0 26px}
.motion-ready [data-reveal=hero]:not(.in){filter:blur(8px);translate:0 34px}
.motion-ready [data-reveal=line]:not(.in){translate:-10px 0}
.motion-ready [data-reveal]:not([data-reveal=split]){transition:opacity 1s var(--ease) var(--d,0ms),translate 1s var(--ease) var(--d,0ms),filter 1s var(--ease) var(--d,0ms)}
.motion-ready [data-reveal].done{transition-delay:0ms}

/* headline word mask */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .06em .1em 0;margin:0 -.06em -.1em 0}
.wi{display:inline-block}
.motion-ready [data-reveal=split]:not(.in) .wi{translate:0 112%;rotate:3deg}
.motion-ready [data-reveal=split] .wi{transition:translate 1.1s var(--ease) calc(var(--d,0ms) + var(--i) * 70ms),rotate 1.1s var(--ease) calc(var(--d,0ms) + var(--i) * 70ms);transform-origin:0 100%}

/* hero details */
.motion-ready .hero-footnote .line-mark{scale:0 1;transform-origin:left;transition:scale 1.1s var(--ease) 1.1s}
.motion-ready .hero-footnote.in .line-mark{scale:1 1}
.motion-ready .terminal{transition:transform .6s var(--ease),opacity 1s var(--ease) var(--d,0ms),translate 1s var(--ease) var(--d,0ms),filter 1s var(--ease) var(--d,0ms)}
.motion-ready .terminal.tilting{transform:perspective(1300px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotate(.4deg)}

/* cards: cursor-lit spotlight + lift */
.spot{position:relative;overflow:hidden}
.spot>*{position:relative}
.spot::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .45s var(--ease-soft);background:radial-gradient(460px circle at var(--mx,50%) var(--my,50%),rgba(232,198,124,.1),transparent 62%)}
.spot:hover::before{opacity:1}
.motion-ready .spot.done{transition:border-color .4s var(--ease-soft),translate .5s var(--ease),box-shadow .5s var(--ease)}
.motion-ready .spot.done:hover{translate:0 -5px;border-color:#938462;box-shadow:0 26px 60px rgba(0,0,0,.5),0 0 0 1px rgba(232,198,124,.12)}

/* page-to-page crossfade where the browser supports cross-document view transitions */
@media(prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:vt-out .28s var(--ease-soft) both}
  ::view-transition-new(root){animation:vt-in .5s var(--ease) both}
  @keyframes vt-out{to{opacity:0}}
  @keyframes vt-in{from{opacity:0}}
}

@media(prefers-reduced-motion:reduce){
  .cursor-glow,.scroll-progress{display:none}
  .site-grid::after,.pulse-dot::after{display:none}
}
