/* HHS scroll effects - compositor-only (transform/opacity). Hidden states exist only when JS is running. */
:root {
  --hhs-ease: cubic-bezier(.16, 1, .3, 1);
  --hhs-dur: .8s;
  --hhs-accent: #1b3a8a;
}
html, body { overflow-x: clip; }

/* scroll progress bar */
.hhs-progress {
  position: fixed; inset: 0 0 auto 0; height: 4px; z-index: 99999; pointer-events: none;
  transform-origin: 0 50%; transform: scaleX(0);
  background: linear-gradient(90deg, #e63946, #ffb703 55%, var(--hhs-accent));
  will-change: transform;
}

/* reveal states */
.hhs-js .hhs-reveal {
  opacity: 0; transform: translate3d(0, 38px, 0);
  transition: opacity var(--hhs-dur) var(--hhs-ease), transform var(--hhs-dur) var(--hhs-ease);
  transition-delay: calc(var(--hhs-i, 0) * 90ms);
}
.hhs-js .hhs-reveal[data-fx="left"]  { transform: translate3d(-56px, 0, 0); }
.hhs-js .hhs-reveal[data-fx="right"] { transform: translate3d(56px, 0, 0); }
.hhs-js .hhs-reveal[data-fx="zoom"]  { transform: scale(.92); }
.hhs-js .hhs-reveal.is-in { opacity: 1; transform: none; }

/* image reveal: soft fade + scale (never fully hidden by clipping) */
.hhs-js .hhs-img-reveal { opacity: 0; transform: scale(.95); transition: opacity 1s var(--hhs-ease), transform 1s var(--hhs-ease); }
.hhs-js .hhs-img-reveal.is-in { opacity: 1; transform: none; }
/* fail-safe: if the script stalls, everything becomes visible after 4s */
.hhs-js.hhs-failsafe .hhs-reveal, .hhs-js.hhs-failsafe .hhs-img-reveal { opacity: 1 !important; transform: none !important; }

/* interactive tilt/lift on cards */
.hhs-card { transition: transform .35s var(--hhs-ease), box-shadow .35s var(--hhs-ease); will-change: transform; }
.hhs-card:hover { box-shadow: 0 18px 40px rgba(16, 32, 80, .18); }

/* parallax layers are moved by JS via --hhs-py */
.hhs-parallax { transform: translate3d(0, var(--hhs-py, 0px), 0); will-change: transform; }

/* sticky header shrink */
header, .ehf-header, #masthead { transition: box-shadow .3s ease, transform .35s var(--hhs-ease); }
.hhs-scrolled .ehf-header, .hhs-scrolled #masthead { box-shadow: 0 6px 24px rgba(0, 0, 0, .12); }

/* back-to-top */
.hhs-top {
  position: fixed; right: 18px; bottom: 96px; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--hhs-accent); color: #fff; font-size: 20px; line-height: 1; z-index: 9998;
  opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .3s, transform .3s var(--hhs-ease);
}
.hhs-top.is-on { opacity: 1; transform: none; pointer-events: auto; }
.hhs-top:focus-visible, .hhs-card:focus-visible { outline: 3px solid #ffb703; outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .hhs-js .hhs-reveal, .hhs-js .hhs-img-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .hhs-parallax { transform: none !important; }
  .hhs-progress { display: none; }
}