/* Nelliza Cuneapen — motion package (additive layer; removing this file + motion.js restores the static build) */

@media (prefers-reduced-motion: no-preference) {

  /* page cross-fade between navigations (Chrome/Edge/Safari; ignored elsewhere) */
  @view-transition { navigation: auto; }
  ::view-transition-old(root) { animation-duration: .3s; }
  ::view-transition-new(root) { animation-duration: .3s; }

  /* reveal on scroll */
  .rv {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity .65s ease var(--d, 0s), transform .65s cubic-bezier(.22,.61,.36,1) var(--d, 0s);
  }
  .rv.in { opacity: 1; transform: none; }

  /* Ken Burns hero */
  .hero img { animation: nc-kenburns 9s cubic-bezier(.25,.46,.45,.94) both; }
  @keyframes nc-kenburns { from { transform: scale(1.09) } to { transform: scale(1) } }
  body.js-anim:not(.go) .hero img { animation-play-state: paused; }

  /* hero title rise on load */
  body.js-anim .hero-overlay h1,
  body.js-anim .hero-overlay p { opacity: 0; transform: translateY(34px); }
  body.js-anim.go .hero-overlay h1 {
    opacity: 1; transform: none;
    transition: opacity .8s .15s ease, transform .8s .15s cubic-bezier(.22,.61,.36,1);
  }
  body.js-anim.go .hero-overlay p {
    opacity: 1; transform: none;
    transition: opacity .8s .4s ease, transform .8s .4s cubic-bezier(.22,.61,.36,1);
  }

  /* logo stitches sew themselves on load */
  @keyframes nc-sew { from { stroke-dashoffset: 40 } to { stroke-dashoffset: 0 } }
  .site-header .brand svg g g + g path { animation: nc-sew 1.1s ease-out .15s backwards; }

  /* scroll-drawn racing line (collection page) */
  #raceline { position: absolute; top: 0; left: 0; pointer-events: none; }
  #raceline path { stroke: var(--papaya); stroke-width: 3; fill: none; opacity: .55; stroke-linecap: round; }
  #raceline .flag { opacity: 0; transition: opacity .4s; }
  #raceline .flag.show { opacity: 1; }

  /* lights-out flash on look numbers entering view */
  @keyframes nc-lightsout {
    0%   { color: var(--rule); }
    25%  { color: #e10600; }
    55%  { color: #e10600; }
    100% { color: var(--rule); }
  }
  .look-num.lit { animation: nc-lightsout 1.4s ease both; }

  /* marquee ticker */
  .ticker-track { animation: nc-ticker 26s linear infinite; }
  @keyframes nc-ticker { to { transform: translateX(-50%); } }

  /* lightbox: blurred backdrop (zoom-from-tile handled in motion.js) */
  .lightbox { background: rgba(8,8,8,.82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
}

/* marquee ticker — layout (static strip if motion is reduced) */
.ticker { overflow: hidden; background: #0c0c0c; padding: 15px 0; }
.ticker-track { display: flex; white-space: nowrap; width: max-content; }
.ticker-track span {
  color: var(--papaya); font-size: .78rem; font-weight: 600;
  letter-spacing: .34em; text-transform: uppercase; padding-right: 3.4em;
}

/* speed-italic hovers (desktop pointers only) */
@media (hover: hover) and (pointer: fine) {
  nav.primary a { transition: transform .18s ease; }
  nav.primary a:hover { transform: skewX(-8deg); }
  .email { transition: transform .18s ease, color .2s ease; }
  .email:hover { transform: skewX(-6deg); }
  .project-card .label h3 { transition: transform .25s ease; }
  .project-card:hover .label h3 { transform: skewX(-6deg) translateX(4px); }
}
