/* =====================================================================
   ANIMATIONS — decoded from the REAL Figma Sites file ("el swedy2.site").

   Source: canvas.fig inside the .site archive → zstd document chunk →
   kiwi-decoded with the file's own embedded schema. The motion lives on
   node `behaviors`, and the values below are read verbatim from it:

     appear  x163  trigger THIS_LAYER_IN_VIEW · direction UP · 0.6s OUT_CUBIC
                   NOT IMPLEMENTED — see note below.
     hover   x18   opacity → 0.41, OUT_CUBIC, 0.3s
     press   x2    OUT_CUBIC, 0.3s        (Primary button)
     marquee x7    direction LEFT, speed 50, loops forever, pauseOnHover

   OUT_CUBIC easingFunction = [0.215, 0.61, 0.355, 1]
   → cubic-bezier(0.215, 0.61, 0.355, 1)

   This file adds MOTION ONLY — nothing here changes size, position or
   colour in the settled/resting state.
   ===================================================================== */

:root{
  /* Figma OUT_CUBIC, verbatim from the decoded easingFunction */
  --fig-ease:       cubic-bezier(0.215, 0.61, 0.355, 1);
  --fig-appear-dur: 600ms;   /* appear.enterTransition.transitionDuration */
  --fig-hover-dur:  300ms;   /* hover.transition.transitionDuration      */
  --fig-hover-op:   0.41;    /* hover.state.opacity                      */
  --fig-appear-y:   28px;    /* direction: UP travel                     */
}

/* ---- HOVER: opacity → 0.41 over 300ms ----------------------------- */
#stage a,
#stage button,
#stage [data-filter],
.sol-tab,
.svc-arrow-btn,
.cert-arrow-btn,
.ins-card-arrow,
.ftr-pin{
  transition: opacity var(--fig-hover-dur) var(--fig-ease),
              transform var(--fig-hover-dur) var(--fig-ease);
}

#stage a:hover,
#stage button:hover,
.sol-tab:hover,
.svc-arrow-btn:hover,
.cert-arrow-btn:hover,
.ins-card-arrow:hover,
.ftr-pin:hover{ opacity: var(--fig-hover-op); }

/* ---- PRESS: same curve/duration on the primary buttons ------------- */
#stage a:active,
#stage button:active,
.svc-arrow-btn:active,
.cert-arrow-btn:active,
.ins-card-arrow:active,
.ftr-pin:active{ opacity: var(--fig-hover-op); }

.sol-tab,
.svc-arrow-btn,
.cert-arrow-btn,
.ins-card-arrow,
.ftr-pin{ cursor: pointer; }

/* ---- SCROLL_TO (prototype interactions) --------------------------- */
html{ scroll-behavior: smooth; }

/* ---- MARQUEE: pause on hover (speed/direction already in the build) */
.sol-marquee:hover .sol-marquee-track,
[class*="marquee"]:hover [class*="track"]{ animation-play-state: paused; }

/* ---- Reduced motion ------------------------------------------------ */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  #stage a,
  #stage button,
  .sol-tab,
  .svc-arrow-btn,
  .cert-arrow-btn,
  .ins-card-arrow,
  .ftr-pin{ transition: none; }
  .sol-marquee-track,
  [class*="marquee"] [class*="track"]{ animation: none; }
}

/* ---- WHY THE SCROLL-APPEAR IS NOT IMPLEMENTED ----------------------- *
   The Figma Sites file applies `appear` to individual LAYERS. In this
   carbon-copy build every section is an absolutely-positioned wrapper
   whose own box does NOT cover its content (several are 0px tall and sit
   at the canvas origin while their children live thousands of px below).
   Driving opacity from those wrappers made whole sections vanish - with
   playsOnce=false the wrapper leaves the viewport exactly when you scroll
   to its content, hiding it. Re-adding this needs per-element targets
   (real content nodes), not the section shells.                         */