/* ==========================================================================
   Onega fold mark · hero float
   The mark rests on the hero panel and floats: a slow rise and settle, with a
   soft shadow beneath that tightens and fades as the mark lifts.
   The mark moves as one flat piece and by translation only: no rotation, no
   3D tilt, no cut or clipped pieces. That keeps its edges as crisp as the
   logo file at every frame. Without this file the static mark renders.
   ========================================================================== */

.hero-mark { --hm-lift: 14px; isolation: isolate; }

.hm-float {
  position: relative; z-index: 1;
  animation:
    hm-enter 900ms var(--ease-out) both,
    hm-float 7s cubic-bezier(.45, 0, .55, 1) 900ms infinite;
  will-change: transform;
}
.hm-float svg { display: block; width: 100%; height: auto; }

.hm-shadow {
  position: absolute; z-index: 0;
  inset-inline: 16%; bottom: -8%; height: 10%;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(18, 11, 24, 0.6), rgba(18, 11, 24, 0));
  animation:
    hm-shadow-in 900ms var(--ease-out) both,
    hm-shadow 7s cubic-bezier(.45, 0, .55, 1) 900ms infinite;
}

@keyframes hm-enter {
  from { opacity: 0; transform: translate3d(0, 12px, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes hm-float {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50%      { transform: translate3d(0, calc(-1 * var(--hm-lift)), 0); }
}
@keyframes hm-shadow-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes hm-shadow {
  0%, 100% { transform: scaleX(1);    opacity: 1; }
  50%      { transform: scaleX(0.84); opacity: 0.6; }
}

/* Smaller lift where the mark sits in the narrow top band */
@media (max-width: 63.99em) {
  .hero-mark { --hm-lift: 7px; }
  .hm-shadow { bottom: -10%; }
}

/* Reduced motion: the static mark, nothing moves */
@media (prefers-reduced-motion: reduce) {
  .hm-float, .hm-shadow { animation: none; }
  .hm-float { will-change: auto; }
}

@media print {
  .hm-float, .hm-shadow { animation: none !important; }
}
