:root{
/* Near none, but never abrupt. Slow fades. Stillness reads as confidence. */
--ease:cubic-bezier(.25,.1,.25,1); /* @kind other */
--ease-out:cubic-bezier(.19,1,.22,1); /* @kind other */        /* entrances, reveals — long tail, no overshoot */
--dur-state:220ms; /* @kind other */                          /* hover/press */
--dur-fade:640ms; /* @kind other */                           /* element fades */
--dur-enter:1200ms; /* @kind other */                         /* scroll reveals */
--dur-page:800ms; /* @kind other */                           /* screen transitions */
--rise:18px; /* @kind spacing */              /* reveal travel; nothing moves further */
/* Editorial kinetics — the three scroll devices. Everything else stays still. */
--counter-amp:84px; /* @kind spacing */       /* counter-scroll column travel, each direction */
--dur-marquee:36s; /* @kind other */          /* one full marquee loop — slow enough to read */
--drift:6vh; /* @kind spacing */              /* hero portrait drift over a full viewport of scroll */
}
/* Reveal on scroll: opacity + a short rise. No scale, no bounce, no slide-in from the side. */
@keyframes hc-rise{from{opacity:0;transform:translateY(var(--rise))}to{opacity:1;transform:none}}
@keyframes hc-fade{from{opacity:0}to{opacity:1}}
/* A rule that draws itself — the brand's one signature motion. */
@keyframes hc-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hc-reveal{opacity:0}
.hc-reveal.is-in{animation:hc-rise var(--dur-enter) var(--ease-out) forwards}
.hc-fade-in{animation:hc-fade var(--dur-page) var(--ease) both}
.hc-draw{transform-origin:left center;animation:hc-draw var(--dur-enter) var(--ease-out) both}
@media (prefers-reduced-motion:reduce){
  .hc-reveal,.hc-reveal.is-in,.hc-fade-in,.hc-draw{animation:none!important;opacity:1!important;transform:none!important}
  *{transition-duration:.01ms!important}
}