/* NCDE Chapter 02 — Production Module presentation ownership v1.1 */
/* =========================================================
   Chapter 02 Living City Invitation v1.6
   Narrative invitation resolves first; CTA alone unlocks rewind.
   ========================================================= */
.ncs3--video-engine .ncs3__travel-cta{
  position:absolute;left:50%;bottom:clamp(34px,6.5vh,76px);z-index:14;
  display:flex;flex-direction:column;align-items:center;gap:12px;
  min-width:min(82vw,420px);padding:12px 24px 8px;
  border:0;background:transparent;color:#fff8e9;
  font:600 clamp(.72rem,.9vw,.88rem)/1.25 system-ui,sans-serif;
  letter-spacing:.14em;text-transform:uppercase;text-align:center;
  opacity:0;visibility:hidden;transform:translate3d(-50%,14px,0);
  filter:blur(4px);pointer-events:none;cursor:pointer;
  text-shadow:0 2px 18px rgba(0,0,0,.8);
  transition:opacity .62s ease,transform .72s cubic-bezier(.22,1,.36,1),filter .62s ease,visibility 0s linear .72s;
}
.ncs3--video-engine .ncs3__travel-cta i{
  width:18px;height:18px;border-right:1.5px solid #d8b86a;border-bottom:1.5px solid #d8b86a;
  transform:rotate(45deg);animation:ncs3TravelPulse 1.8s ease-in-out infinite;
  filter:drop-shadow(0 0 8px rgba(216,184,106,.42));
}
.ncs3--video-engine .ncs3__travel-cta.is-visible{
  opacity:1;visibility:visible;transform:translate3d(-50%,0,0);filter:none;
  pointer-events:auto;transition-delay:0s;
}
.ncs3--video-engine .ncs3__travel-cta:hover span,
.ncs3--video-engine .ncs3__travel-cta:focus-visible span{color:#f1d58c}
.ncs3--video-engine .ncs3__travel-cta:focus-visible{outline:1px solid rgba(216,184,106,.65);outline-offset:8px;border-radius:999px}
.ncs3--video-engine[data-story-state="history-video"] .ncs3__travel-cta,
.ncs3--video-engine[data-story-state="forest-hold"] .ncs3__travel-cta{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
@keyframes ncs3TravelPulse{0%,100%{transform:translateY(0) rotate(45deg);opacity:.62}50%{transform:translateY(7px) rotate(45deg);opacity:1}}
@media(max-width:760px){
  .ncs3--video-engine .ncs3__travel-cta{bottom:max(28px,calc(env(safe-area-inset-bottom) + 22px));min-width:calc(100vw - 48px);font-size:.68rem;letter-spacing:.11em}
}
@media(prefers-reduced-motion:reduce){.ncs3--video-engine .ncs3__travel-cta,.ncs3--video-engine .ncs3__travel-cta i{transition:none!important;animation:none!important}}


/* =========================================================
   Chapter 02 Typography Choreography v1.7
   Typewritten lead + object-style cinematic emphasis.
   ========================================================= */
.ncs3--video-engine .ncs3__narrative-text.is-choreographed{display:flex!important;flex-direction:column;align-items:flex-start;gap:.14em;white-space:normal!important}
.ncs3--video-engine .ncs3__narrative-lead{display:block;font-family:"Iowan Old Style","Baskerville","Palatino Linotype",Georgia,serif;font-size:.58em;font-weight:400;letter-spacing:-.015em;color:#fffaf0}
.ncs3--video-engine .ncs3__narrative-lead.is-typing::after{content:"";display:inline-block;width:.055em;height:.82em;margin-left:.08em;background:#d8b86a;vertical-align:-.04em;animation:ncs3TypeCursor .8s steps(1,end) infinite}
.ncs3--video-engine .ncs3__narrative-emphasis{display:block;font-family:"Iowan Old Style","Baskerville","Palatino Linotype",Georgia,serif;font-size:1em;font-style:italic;font-weight:500;line-height:.98;letter-spacing:-.045em;color:#f1d58c;opacity:0;transform:translate3d(0,18px,0) scale(.96);filter:blur(7px);transition:opacity .82s ease,transform 1.05s cubic-bezier(.22,1,.36,1),filter .82s ease;text-shadow:0 3px 24px rgba(0,0,0,.55)}
.ncs3--video-engine .ncs3__narrative-emphasis.is-revealed{opacity:1;transform:translate3d(0,0,0) scale(1);filter:none}
.ncs3--video-engine .ncs3__travel-cta span{text-transform:none;letter-spacing:.1em;font-size:clamp(.78rem,1vw,.94rem)}
@media(max-width:760px){.ncs3--video-engine .ncs3__narrative-text.is-choreographed{gap:.2em}.ncs3--video-engine .ncs3__narrative-lead{font-size:.62em}.ncs3--video-engine .ncs3__narrative-emphasis{font-size:.94em;line-height:1.02}}
@media(prefers-reduced-motion:reduce){.ncs3--video-engine .ncs3__narrative-emphasis{transition:none!important;filter:none!important}.ncs3--video-engine .ncs3__narrative-lead.is-typing::after{display:none!important}}


/* =========================================================
   Chapter 02 Narrative Choreography Mastering v1.8
   Larger opening beat, organic type rhythm, staged emphasis.
   ========================================================= */
.ncs3--video-engine .ncs3__narrative-text.is-choreographed.is-opening-beat .ncs3__narrative-lead{font-size:.82em;font-weight:500;letter-spacing:-.028em}
.ncs3--video-engine .ncs3__narrative-emphasis{display:flex;flex-wrap:wrap;column-gap:.18em;row-gap:.04em}
.ncs3--video-engine .ncs3__narrative-emphasis-part{display:inline-block;opacity:0;transform:translate3d(0,16px,0) scale(.97);filter:blur(6px);transition:opacity .72s ease,transform .92s cubic-bezier(.22,1,.36,1),filter .72s ease}
.ncs3--video-engine .ncs3__narrative-emphasis-part.is-revealed{opacity:1;transform:translate3d(0,0,0) scale(1);filter:none}
@media(max-width:760px){.ncs3--video-engine .ncs3__narrative-text.is-choreographed.is-opening-beat .ncs3__narrative-lead{font-size:.86em}.ncs3--video-engine .ncs3__narrative-emphasis{column-gap:.14em}}


/* Chapter 02 v1.9 — timeline-locked nonlinear Time Rewind Engine */
.ncs3__time-rewind{
  position:absolute;
  z-index:42;
  left:clamp(24px,5.2vw,88px);
  bottom:clamp(34px,7vh,92px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-width:min(72vw,520px);
  opacity:0;
  visibility:hidden;
  transform:translate3d(0,14px,0);
  transition:opacity .42s ease,transform .55s cubic-bezier(.2,.72,.2,1),visibility 0s linear .55s;
  pointer-events:none;
  text-shadow:0 3px 18px rgba(0,0,0,.78),0 1px 4px rgba(0,0,0,.9);
}
.ncs3__time-rewind.is-visible{
  opacity:1;
  visibility:visible;
  transform:translate3d(0,0,0);
  transition-delay:0s;
}
.ncs3__time-rewind[data-phase="ending"]{opacity:0;transform:translate3d(0,-10px,0)}
.ncs3__time-rewind-kicker{
  min-height:1.25em;
  font-family:var(--ncde-font-sans,"Inter",sans-serif);
  font-size:clamp(10px,.72vw,13px);
  font-weight:600;
  letter-spacing:.24em;
  color:rgba(238,205,139,.86);
  text-transform:uppercase;
  margin:0 0 .36rem .12em;
}
.ncs3__time-rewind-value{
  display:block;
  max-width:min(82vw,760px);
  font-family:var(--ncde-font-display,"Cormorant Garamond",serif);
  font-size:clamp(48px,8.4vw,132px);
  font-weight:500;
  line-height:.82;
  letter-spacing:-.045em;
  color:#f4ead5;
  white-space:nowrap;
  transform-origin:left center;
  filter:drop-shadow(0 5px 18px rgba(0,0,0,.5));
}
.ncs3__time-rewind-value.is-ticking{animation:ncs3-time-tick .14s cubic-bezier(.2,.8,.2,1)}
.ncs3__time-rewind.is-anchor .ncs3__time-rewind-value{animation:ncs3-time-anchor .68s cubic-bezier(.2,.8,.2,1)}
.ncs3__time-rewind-line{
  width:clamp(72px,10vw,170px);
  height:1px;
  margin-top:clamp(12px,1.4vw,20px);
  background:linear-gradient(90deg,rgba(207,164,79,.92),rgba(207,164,79,0));
  transform-origin:left center;
  opacity:.76;
}
.ncs3__time-rewind[data-phase^="anchor-before"] .ncs3__time-rewind-value,
.ncs3__time-rewind[data-phase="anchor-primeval"] .ncs3__time-rewind-value{
  font-size:clamp(37px,6.2vw,94px);
  line-height:.92;
  letter-spacing:-.025em;
  white-space:normal;
}
@keyframes ncs3-time-tick{
  0%{opacity:.18;transform:translate3d(0,14%,0);filter:blur(2.5px) drop-shadow(0 5px 18px rgba(0,0,0,.5))}
  100%{opacity:1;transform:translate3d(0,0,0);filter:blur(0) drop-shadow(0 5px 18px rgba(0,0,0,.5))}
}
@keyframes ncs3-time-anchor{
  0%{transform:scale(.975);opacity:.72}
  42%{transform:scale(1.035);opacity:1}
  100%{transform:scale(1);opacity:1}
}
@media (max-width:720px){
  .ncs3__time-rewind{left:22px;bottom:max(42px,7.5vh);min-width:0;max-width:calc(100vw - 44px)}
  .ncs3__time-rewind-value{font-size:clamp(50px,17vw,88px)}
  .ncs3__time-rewind[data-phase^="anchor-before"] .ncs3__time-rewind-value,
  .ncs3__time-rewind[data-phase="anchor-primeval"] .ncs3__time-rewind-value{font-size:clamp(34px,11vw,56px);max-width:86vw}
}
@media (prefers-reduced-motion:reduce){
  .ncs3__time-rewind,.ncs3__time-rewind-value{animation:none!important;transition:none!important}
}


/* =========================================================
   Chapter 02 Living Forest Endpoint v2.0
   Replaces city-14.webp with forest-living.mp4 and enforces a clean end state.
   ========================================================= */
.ncs3--video-engine .ncs3__video--forest{
  z-index:3;object-position:50% 48%;opacity:0;visibility:hidden;
  transition:opacity .92s cubic-bezier(.22,1,.36,1),visibility 0s linear .92s!important;
}
.ncs3--video-engine[data-story-state="forest-hold"] .ncs3__video--history{
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
}
.ncs3--video-engine[data-story-state="forest-hold"] .ncs3__video--forest,
.ncs3--video-engine.is-forest-living-ready[data-story-state="forest-hold"] .ncs3__video--forest{
  opacity:1!important;visibility:visible!important;
  transition:opacity .92s cubic-bezier(.22,1,.36,1),visibility 0s linear 0s!important;
}
.ncs3--video-engine[data-story-state="forest-hold"] .ncs3__narrative-stage,
.ncs3--video-engine[data-story-state="forest-hold"] .ncs3__travel-cta,
.ncs3--video-engine[data-story-state="forest-hold"] .ncs3__time-rewind,
.ncs3--video-engine[data-story-state="forest-hold"] .ncs3__labels{
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
}
@media(max-width:760px){.ncs3--video-engine .ncs3__video--forest{object-position:50% 48%!important}}
@media(max-width:430px) and (min-height:760px){.ncs3--video-engine .ncs3__video--forest{object-position:50% 47%!important}}
@media(prefers-reduced-motion:reduce){.ncs3--video-engine .ncs3__video--forest{transition:none!important}}
