/* Night City Archive — motion pass 3. Local only. transform/opacity focused.
   Hidden-initial ONLY under html.js-motion + not reduced-motion. */

/* —— Safety stagger (from pass 2) —— */
html.js-motion:not([data-reduced-motion="1"]) .nc-stagger:not(.is-in) {
  opacity: 0;
  transform: translateY(14px);
}
html.js-motion:not([data-reduced-motion="1"]) .nc-stagger {
  transition: opacity .55s var(--ease), transform .55s var(--ease);
  transition-delay: calc(var(--i, 0) * 55ms);
}
html.js-motion:not([data-reduced-motion="1"]) .nc-stagger.is-in {
  opacity: 1;
  transform: none;
}

/* DISABLED: flowing neon grid — removed for constructivist identity */
html.js-motion:not([data-reduced-motion="1"]) .nc-nav,
html.js-motion:not([data-reduced-motion="1"]) .nc-main,
html.js-motion:not([data-reduced-motion="1"]) .nc-foot {
  position: relative;
  z-index: 1;
}
@keyframes nc-grid-drift {
  0% { transform: translate3d(0, 0, 0) scale(1.05); }
  50% { transform: translate3d(-18px, 22px, 0) scale(1.08); }
  100% { transform: translate3d(-36px, 0, 0) scale(1.05); }
}

/* —— Hero entrance —— */
html.js-motion:not([data-reduced-motion="1"]) .hero-copy.is-in .hero-kicker {
  animation: nc-fade-up .5s var(--ease) both;
}
html.js-motion:not([data-reduced-motion="1"]) .hero-copy.is-in h1 {
  animation: nc-title-scan .75s var(--ease) .05s both;
}
html.js-motion:not([data-reduced-motion="1"]) .hero-copy.is-in .lead {
  animation: nc-fade-up .55s var(--ease) .12s both;
}
html.js-motion:not([data-reduced-motion="1"]) .hero-copy.is-in .hero-actions {
  animation: nc-fade-up .55s var(--ease) .2s both;
}
html.js-motion:not([data-reduced-motion="1"]) .hero-visual.nc-hero-ready img,
html.js-motion:not([data-reduced-motion="1"]) .entity-hero .visual.nc-hero-ready img {
  animation: nc-ken-enter 1.35s var(--ease) both;
}
html.js-motion:not([data-reduced-motion="1"]) .hero-visual.nc-hero-ready::before,
html.js-motion:not([data-reduced-motion="1"]) .entity-hero .visual.nc-hero-ready::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(94, 200, 197, .12) 48%,
    rgba(226, 59, 109, .08) 52%,
    transparent 100%
  );
  background-size: 100% 220%;
  opacity: 0;
  animation: nc-holo-sweep .85s ease-out .1s both;
}
html.js-motion:not([data-reduced-motion="1"]) .page-intro.is-in h1,
html.js-motion:not([data-reduced-motion="1"]) .entity-hero .copy.is-in h1 {
  animation: nc-title-scan .65s var(--ease) both;
}
@keyframes nc-ken-enter {
  from { transform: scale(1.14); opacity: .85; }
  to { transform: scale(1.04); opacity: 1; }
}
@keyframes nc-title-scan {
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: none; }
}
@keyframes nc-fade-up {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
@keyframes nc-holo-sweep {
  0% { opacity: .85; transform: translateY(-40%); }
  100% { opacity: 0; transform: translateY(40%); }
}

/* —— Card hover + zoom (neon glow retuned to accent) —— */
html.js-motion:not([data-reduced-motion="1"]) .media-card {
  transition: transform .25s var(--ease), opacity .25s;
}
html.js-motion:not([data-reduced-motion="1"]) .media-card:hover {
  transform: translateY(-3px);
  box-shadow:
    0 0 0 1px rgba(94, 200, 197, .5),
    0 0 24px rgba(94, 200, 197, .22),
    0 16px 40px rgba(0, 0, 0, .45);
  border-color: var(--accent);
}
html.js-motion:not([data-reduced-motion="1"]) .media-card .thumb img,
html.js-motion:not([data-reduced-motion="1"]) .poster-card .ph img {
  transition: transform .5s var(--ease), opacity .2s;
}
html.js-motion:not([data-reduced-motion="1"]) .media-card:hover .thumb img {
  transform: scale(1.08);
}
html.js-motion:not([data-reduced-motion="1"]) .poster-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0 0 0 2px var(--accent),
    0 0 20px rgba(94, 200, 197, .28),
    0 18px 40px rgba(0, 0, 0, .35);
}
html.js-motion:not([data-reduced-motion="1"]) .poster-card:hover .ph img {
  transform: scale(1.07);
}

/* —— Occasional card image glitch (class toggled by JS) —— */
/* CHANGED: img RGB-flicker → soft data-corrosion opacity fade */
html.js-motion:not([data-reduced-motion="1"]) .nc-img-glitch {
  animation: nc-img-corrode .35s ease-out both;
}
@keyframes nc-img-corrode {
  0% { opacity: 1; filter: none; }
  40% { opacity: .72; filter: contrast(1.05); }
  100% { opacity: 1; filter: none; }
}
@keyframes nc-img-flicker {
  0%, 100% { opacity: 1; }
}

/* —— Timeline light-up —— */
html.js-motion:not([data-reduced-motion="1"]) .timeline-item:not(.is-lit) {
  opacity: .45;
  transition: opacity .45s var(--ease);
}
html.js-motion:not([data-reduced-motion="1"]) .timeline-item.is-lit {
  opacity: 1;
}
html.js-motion:not([data-reduced-motion="1"]) .timeline-item.is-lit::before {
  transform: scale(1.35);
  opacity: 1;
  box-shadow: 0 0 12px rgba(94, 200, 197, .65);
  background: var(--accent);
  transition: transform .35s var(--ease), opacity .35s;
}
html.js-motion:not([data-reduced-motion="1"]) .timeline-item:not(.is-lit)::before {
  opacity: .35;
  transform: scale(1);
  transition: transform .35s var(--ease), opacity .35s;
}
html.js-motion:not([data-reduced-motion="1"]) .timeline-item.is-lit .year {
  opacity: 1;
  transform: none;
}
html.js-motion:not([data-reduced-motion="1"]) .timeline-item:not(.is-lit) .year {
  opacity: .5;
}

/* —— Page scan / load bar —— */
.nc-load-bar {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 28%;
  z-index: 3000;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, var(--accent), var(--accent), var(--accent));
  box-shadow: 0 0 10px rgba(94, 200, 197, .55);
  transform: scaleX(0);
  transform-origin: left center;
}
body[data-loading="1"] .nc-load-bar {
  opacity: 1;
  animation: nc-load-bar .85s var(--ease) forwards;
}
@keyframes nc-load-bar {
  0% { opacity: 1; transform: scaleX(0.05); }
  70% { opacity: 1; transform: scaleX(0.78); }
  100% { opacity: 1; transform: scaleX(1); }
}
.nc-page-scan {
  /* CHANGED: page scan → soft data-corrosion fade (no RGB split) */
  position: fixed;
  inset: 0;
  z-index: 2990;
  pointer-events: none;
  background: rgba(18, 21, 26, 0.35);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 40%, #000 60%, transparent);
  mask-image: linear-gradient(180deg, transparent, #000 40%, #000 60%, transparent);
  opacity: 0;
  transform: translateY(-60%);
}
html.js-motion:not([data-reduced-motion="1"]) .nc-page-scan.nc-run {
  animation: nc-page-sweep .7s ease-out both;
}
@keyframes nc-page-sweep {
  0% { opacity: .8; transform: translateY(-60%); }
  100% { opacity: 0; transform: translateY(60%); }
}

/* —— Cursor glow (desktop; colors retuned, kept) —— */
.nc-cursor-glow {
  position: fixed;
  top: 0;
  left: 0;
  width: 420px;
  height: 420px;
  margin: -210px 0 0 -210px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  background: radial-gradient(circle, rgba(94, 200, 197, .16) 0%, rgba(226, 59, 109, .06) 35%, transparent 68%);
  transform: translate3d(-9999px, -9999px, 0);
  will-change: transform, opacity;
  transition: opacity .25s ease;
}
html.js-motion:not([data-reduced-motion="1"]) .nc-cursor-glow.is-on {
  opacity: 1;
}

/* —— Button / link hover glitch —— */
html.js-motion:not([data-reduced-motion="1"]) .btn,
html.js-motion:not([data-reduced-motion="1"]) .nc-link,
html.js-motion:not([data-reduced-motion="1"]) .nc-cta,
html.js-motion:not([data-reduced-motion="1"]) .nc-brand {
  transition: transform .15s var(--ease), opacity .15s;
}
/* DISABLED: button/link RGB-offset glitch hover */
html.js-motion:not([data-reduced-motion="1"]) .btn:hover,
html.js-motion:not([data-reduced-motion="1"]) .nc-cta:hover,
html.js-motion:not([data-reduced-motion="1"]) .nc-link:hover,
html.js-motion:not([data-reduced-motion="1"]) .nc-brand:hover {
  animation: none;
}
@keyframes nc-link-glitch {
  0% { transform: translate(0, 0); opacity: 1; }
  25% { transform: translate(-2px, 1px); opacity: .75; }
  50% { transform: translate(2px, -1px); opacity: 1; }
  75% { transform: translate(-1px, 0); opacity: .85; }
  100% { transform: none; opacity: 1; }
}

/* Decode target keeps layout stable */
.nc-decode {
  display: inline-block;
  min-height: 1em;
}

@media (prefers-reduced-motion: reduce) {
  body.nc-body::before,
  .nc-stagger, [data-reveal],
  .hero-visual img, .entity-hero .visual img,
  .hero-visual::before, .entity-hero .visual::before,
  .nc-load-bar, .nc-page-scan, .nc-cursor-glow,
  .btn, .nc-link, .nc-cta, .nc-brand,
  .timeline-item, .media-card, .poster-card {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .nc-load-bar, .nc-page-scan, .nc-cursor-glow,
  body.nc-body::before { display: none !important; }
}
