.ns-page-hero {
  display: grid;
  grid-template-columns: minmax(300px, 1.15fr) minmax(260px, .65fr);
  column-gap: clamp(3rem, 7vw, 8rem);
  row-gap: clamp(1.75rem, 3vh, 2.5rem);
  align-items: end;
  align-content: center;
  max-width: 1580px;
  min-height: clamp(30rem, 58svh, 38rem);
  margin: 0 auto;
  padding: clamp(8rem, 12vh, 9.5rem) clamp(1.5rem, 5vw, 5rem) clamp(3.25rem, 6vh, 4.5rem);
  box-sizing: border-box;
}

.ns-page-hero .ns-kicker { grid-column: 1 / -1; margin: 0; }
.ns-page-hero h1 { margin: 0; color: var(--ns-bone); font: 600 clamp(3.4rem, 6.2vw, 6.6rem)/.92 "Playfair Display", Georgia, serif; letter-spacing: -.06em; }
.ns-page-hero h1 em { color: var(--ns-gold); font-weight: 500; }
.ns-page-hero__aside { display: grid; gap: 1.2rem; align-self: end; max-width: 32rem; padding-bottom: .65rem; }
.ns-page-hero .ns-lede { max-width: 31rem; margin: 0; color: #b5aea3; font-size: clamp(1rem, 1.15vw, 1.12rem); line-height: 1.72; }
.ns-page-hero__index { margin: .35rem 0 0; color: var(--ns-gold); font: 500 .59rem/1.4 "DM Mono", monospace; letter-spacing: .14em; }
.ns-page-hero__guide { max-width: 30rem; margin: 0; color: #7f7a72; font-size: .86rem; line-height: 1.7; }

.ns-work-gallery { padding: 0 clamp(1.5rem, 5vw, 5rem) clamp(6rem, 10vw, 10rem); }
.ns-complete-work__intro { display:grid; grid-template-columns:minmax(300px,1.15fr) minmax(260px,.65fr); gap:clamp(2.5rem,7vw,8rem); align-items:end; max-width:1580px; margin:0 auto clamp(3.5rem,6vw,6rem); padding-top:clamp(5rem,9vw,8rem); }
.ns-complete-work__intro h2 { margin:0; color:var(--ns-bone); font:600 clamp(3rem,5.8vw,6.2rem)/.94 "Playfair Display",Georgia,serif; letter-spacing:-.06em; }
.ns-complete-work__intro h2 em { color:var(--ns-gold); font-weight:500; }
.ns-complete-work__aside { display:grid; gap:1rem; color:var(--ns-muted); line-height:1.7; }
.ns-complete-work__aside p { margin:0; }
.ns-work-gallery__layout { display: block; max-width: 1580px; margin: 0 auto; }
.ns-work-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; padding: 0; margin: 0 0 1.4rem; border-top: 1px solid var(--ns-line); border-bottom: 1px solid var(--ns-line); }
.ns-work-rail li { display: flex; min-width: 0; }
.ns-work-rail button { width: 100%; min-height: 4.4rem; padding: .9rem 1rem; border: 0; border-right: 1px solid var(--ns-line); background: transparent; color: var(--ns-muted); text-align: left; cursor: pointer; font: 500 .7rem/1.4 "DM Mono", monospace; letter-spacing: .04em; transition: color .2s ease, background .2s ease; }
.ns-work-rail li:nth-child(4n) button { border-right: 0; }
.ns-work-rail button:hover { color: var(--ns-bone); background: rgba(255,255,255,.025); }
.ns-work-rail button[aria-selected="true"] { color: #15130f; background: var(--ns-gold); }
.ns-work-rail button:focus-visible { outline: 2px solid var(--ns-bone); outline-offset: -4px; }

.ns-work-details-container { display: block; }
.ns-work-detail__panel { display: none; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .45fr); gap: clamp(2rem, 4vw, 5rem); align-items: start; }
.ns-work-detail__panel[data-active="true"] { display: grid; animation: ns-work-panel-in .28s ease both; }
@keyframes ns-work-panel-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.ns-work-detail__media { min-width: 0; padding: clamp(.45rem, .8vw, .75rem); border: 1px solid rgba(189,142,73,.28); background: #171612; box-shadow: 0 28px 80px rgba(0,0,0,.42); }
.ns-work-detail__media img { display: block; width: 100%; height: auto; object-position: top center; background: #f3f4f5; }
.ns-work-detail__media video { display: block; width: 100%; max-height: 78svh; aspect-ratio: 4 / 5; object-fit: contain; background: #080b12; }
.ns-work-detail__media > * + * { margin-top: .75rem; }
.ns-proof-demo { position: relative; overflow: hidden; }
.ns-proof-demo > img { margin: 0; }
.ns-proof-demo--handy { background: #edeae2; }
.ns-proof-demo--handy::after { content:""; position:absolute; top:19.4%; right:9.1%; width:17.7%; height:4.4%; border-radius:999px; border:2px solid rgba(255,210,45,.86); box-shadow:0 0 0 0 rgba(255,210,45,.35); pointer-events:none; animation:ns-export-confirm 6s ease-in-out infinite; }
.ns-handy-playback { position:absolute; inset:0; pointer-events:none; font:600 clamp(.4rem,.56vw,.62rem) Manrope,sans-serif; color:#243554; }
.ns-handy-select { position:absolute; display:flex; align-items:center; padding:0 .72%; border:1px solid #9fb3cc; border-radius:7px; background:#fff; opacity:0; box-sizing:border-box; animation:ns-handy-select 6s ease-in-out infinite; }
.ns-handy-select::after { content:""; position:absolute; right:7%; width:.42em; height:.42em; border-radius:50%; background:#4e6f96; opacity:0; animation:ns-handy-click 6s ease-in-out infinite; }
.ns-handy-select--assembly { left:35.8%; top:78.2%; width:15.4%; height:4%; animation-delay:.7s; }.ns-handy-select--size { left:51.8%; top:78.2%; width:15.4%; height:4%; animation-delay:1.65s; }.ns-handy-select--rating { left:2.7%; top:85.9%; width:15.4%; height:4%; animation-delay:2.6s; }
.ns-handy-playback b { position:absolute; left:2.8%; top:70%; padding:.15% .35%; border-radius:4px; background:#fff; color:#263b55; font-size:.92em; opacity:0; animation:ns-handy-count 6s ease-in-out infinite; }
.ns-proof-demo--insurance { background:#f8f9f6; }.ns-proof-demo__insurance-state { position:absolute; top:14%; left:38%; right:8%; color:#1d352d; }.ns-proof-demo__insurance-state small { color:#87682e; font:700 .5rem "DM Mono",monospace; letter-spacing:.12em; }.ns-proof-demo__insurance-state h4 { margin:.65rem 0; color:#1d352d; font-size:clamp(.9rem,1.55vw,1.45rem); }.ns-typed-question { width:min(82%,28rem); margin:0; padding:.72rem .8rem; border:1px solid #cad9d0; border-radius:.55rem; background:#fff; font-size:clamp(.62rem,1vw,.88rem); overflow:hidden; white-space:nowrap; animation:ns-type 6s steps(31,end) infinite; }.ns-typing { display:flex; align-items:center; gap:.3rem; margin:.6rem 0; font-size:.52rem; color:#66746c; opacity:0; animation:ns-reveal 6s ease infinite; }.ns-typing i { width:.28rem; height:.28rem; border-radius:50%; background:#215e4b; animation:ns-dot .8s infinite alternate; }.ns-typing i:nth-child(2){animation-delay:.15s}.ns-typing i:nth-child(3){animation-delay:.3s}.ns-proof-demo__insurance-state article { width:min(84%,30rem); padding:.7rem .8rem; border-left:3px solid #b88d3a; background:#fff; box-shadow:0 8px 22px rgba(36,69,55,.1); opacity:0; transform:translateY(8px); animation:ns-answer 6s ease infinite; }.ns-proof-demo__insurance-state article b,.ns-proof-demo__insurance-state article strong,.ns-proof-demo__insurance-state article p { display:block; }.ns-proof-demo__insurance-state article b{font:.48rem "DM Mono",monospace; color:#87682e; letter-spacing:.08em}.ns-proof-demo__insurance-state article strong{margin:.35rem 0;font-size:clamp(.6rem,.95vw,.8rem)}.ns-proof-demo__insurance-state article p{margin:0;color:#64736b;font-size:.52rem}
@keyframes ns-export-confirm {0%,56%{opacity:0;box-shadow:0 0 0 0 rgba(255,210,45,0)}64%,82%{opacity:1;box-shadow:0 0 0 5px rgba(255,210,45,.18)}100%{opacity:0;box-shadow:0 0 0 0 rgba(255,210,45,0)}} @keyframes ns-handy-select {0%,10%{opacity:0;transform:scale(.99)}16%,72%{opacity:1;transform:scale(1);box-shadow:0 0 0 2px rgba(58,105,158,.1)}78%,100%{opacity:0}} @keyframes ns-handy-click {0%,7%{opacity:0;transform:scale(.4)}10%{opacity:.8;transform:scale(1.8)}14%,100%{opacity:0;transform:scale(1)}} @keyframes ns-handy-count {0%,48%{opacity:0}55%,82%{opacity:1}100%{opacity:0}} @keyframes ns-type { 0%,8%{width:0} 38%,100%{width:min(86%,34rem)} } @keyframes ns-reveal {0%,38%{opacity:0}45%,67%{opacity:1}78%,100%{opacity:0}} @keyframes ns-answer {0%,58%{opacity:0;transform:translateY(8px)}70%,93%{opacity:1;transform:none}100%{opacity:0}} @keyframes ns-dot {to{transform:translateY(-3px);opacity:.45}}
.ns-work-detail__copy { position: sticky; top: 7rem; display: flex; flex-direction: column; align-items: flex-start; padding: 1.2rem 0 0; }
.ns-work-detail__type { margin: 0 0 1.25rem; color: var(--ns-gold); font: 500 .64rem/1.45 "DM Mono", monospace; letter-spacing: .13em; }
.ns-work-detail__copy h3 { margin: 0; color: var(--ns-bone); font: 500 clamp(2.1rem, 3.6vw, 4rem)/1 "Playfair Display", Georgia, serif; letter-spacing: -.045em; }
.ns-work-detail__summary { margin: 1.6rem 0 0; color: #c6c0b5; font-size: .96rem; line-height: 1.75; }
.ns-work-detail__note { margin: 1rem 0 2rem; color: var(--ns-muted); font: .62rem/1.55 "DM Mono", monospace; letter-spacing: .07em; text-transform: uppercase; }
.ns-work-detail__cta { margin-top: auto; padding: .95rem 1.1rem; border: 1px solid var(--ns-gold); background: transparent; color: var(--ns-bone); cursor: pointer; font: 600 .66rem Manrope, sans-serif; letter-spacing: .08em; text-transform: uppercase; transition: background .2s ease, color .2s ease; }
.ns-work-detail__cta:hover { background: var(--ns-gold); color: #15130f; }
.ns-work-detail__cta span { margin-left: .5rem; }

.ns-mobile-work-cards { display: none; }

@media (max-width: 1000px) {
  .ns-work-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ns-work-rail li:nth-child(2n) button { border-right: 0; }
  .ns-work-rail li:nth-child(-n+6) button { border-bottom: 1px solid var(--ns-line); }
  .ns-work-detail__panel { grid-template-columns: 1fr; gap: 1.5rem; }
  .ns-work-detail__copy { position: static; max-width: 46rem; padding-top: 0; }
  .ns-work-detail__cta { margin-top: .5rem; }
}

@media (max-width: 700px) {
  .ns-page-hero { grid-template-columns: 1fr; gap: 1.5rem; padding-top: 7.5rem; }
  .ns-page-hero .ns-kicker { grid-column: 1; margin-bottom: 0; }
  .ns-work-gallery__layout { display: none; }
  .ns-mobile-work-cards { display: grid; gap: 4.5rem; }
  .ns-mobile-work-card { margin: 0; }
  .ns-mobile-work-card figure { margin: 0 -.75rem; overflow: hidden; border: 1px solid rgba(189,142,73,.3); background: #11110f; box-shadow: 0 24px 55px rgba(0,0,0,.38); }
  .ns-mobile-work-card figure img,
  .ns-mobile-work-card figure video { display: block; width: 100%; height: auto; max-height: 72svh; object-fit: contain; object-position: center top; background: #11110f; }
  .ns-mobile-work-card__media-stack > * + * { border-top: 1px solid rgba(189,142,73,.3); }
  .ns-mobile-work-card__copy { padding: 1.4rem 0 0; }
  .ns-mobile-work-card__copy > p:first-child { margin: 0 0 .9rem; color: var(--ns-gold); font: 500 .61rem/1.45 "DM Mono", monospace; letter-spacing: .12em; }
  .ns-mobile-work-card h2 { margin: 0; color: var(--ns-bone); font: 500 clamp(2.1rem, 10vw, 3.25rem)/.98 "Playfair Display", Georgia, serif; letter-spacing: -.045em; }
  .ns-mobile-work-card__copy > p:last-child { margin: 1.2rem 0 0; color: #c6c0b5; font-size: .9rem; line-height: 1.7; }
}

@media (prefers-reduced-motion: reduce) { .ns-work-detail__panel[data-active="true"],.ns-proof-demo * { animation: none !important; }.ns-proof-demo__insurance-state .ns-typing { opacity:0; }.ns-proof-demo__insurance-state article { opacity:1; transform:none; }.ns-typed-question { width:min(86%,34rem); } }

/* --------------------------------------------------------------------------
   System Reel v10 — six families, one reusable guided product stage
   -------------------------------------------------------------------------- */

.ns-work-gallery .ns-work-gallery__layout { display: block; max-width: 1580px; margin: 0 auto; }
.ns-work-gallery .ns-work-rail {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  list-style: none;
  margin: 0 0 clamp(2.5rem, 4vw, 4rem);
  padding: 0;
  border: 1px solid var(--ns-line);
  border-bottom: 1px solid var(--ns-line);
  background: #0d0d0c;
}

.ns-work-gallery .ns-work-rail li { display: flex; min-width: 0; }
.ns-work-gallery .ns-work-rail button {
  position: relative;
  display: grid;
  grid-template-columns: 2.1rem 1fr;
  grid-template-rows: auto auto;
  width: 100%;
  min-height: 6.6rem;
  padding: 1.25rem 1.1rem;
  border: 0;
  border-right: 1px solid var(--ns-line);
  background: transparent;
  color: #a9a398;
  text-align: left;
  cursor: pointer;
  transition: color .25s ease, background .25s ease, transform .25s ease;
}

.ns-work-gallery .ns-work-rail li:last-child button { border-right: 0; }
.ns-work-gallery .ns-work-rail button > span { grid-row: 1 / 3; color: var(--ns-gold); font: 500 .62rem/1.5 "DM Mono", monospace; }
.ns-work-gallery .ns-work-rail button strong { color: inherit; font: 600 clamp(.72rem, .9vw, .86rem)/1.35 Manrope, sans-serif; }
.ns-work-gallery .ns-work-rail button small { align-self: end; margin-top: .4rem; color: #9a948a; font: 500 .55rem/1.35 "DM Mono", monospace; letter-spacing: .11em; text-transform: uppercase; transition: color .25s ease; }
.ns-work-gallery .ns-work-rail button:hover { color: var(--ns-bone); background: rgba(255,255,255,.025); transform: none; }
.ns-work-gallery .ns-work-rail button[aria-selected="true"] { color: #17130d; background: var(--ns-gold); }
.ns-work-gallery .ns-work-rail button[aria-selected="true"] > span,
.ns-work-gallery .ns-work-rail button[aria-selected="true"] small { color: #3d2d17; }
.ns-work-gallery .ns-work-rail button:focus-visible { z-index: 2; outline: 2px solid var(--ns-bone); outline-offset: -4px; }

.page-work .ns-featured-case__media--leadmaster { isolation: isolate; background: #001024; transform-origin: right top; }
.page-work .ns-featured-case__media--leadmaster::before {
  content: "";
  position: absolute;
  inset: -5%;
  z-index: -1;
  background: #001024 url("../assets/images/northshore-site-image-pack/portfolio/leadmaster-opportunity-mapping.png") center / cover no-repeat;
  filter: blur(24px) brightness(.44);
  transform: scale(1.08);
}
.page-work .ns-featured-case__image--leadmaster {
  position: relative;
  z-index: 1;
  width: 70% !important;
  margin-left: auto;
  object-fit: contain !important;
  object-position: center top !important;
  background: transparent !important;
}

.page-work .rivet-fab {
  right: 18px;
  bottom: 18px;
  min-width: 154px;
  height: 56px;
  padding-inline: 21px;
}

.ns-system-reel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--ns-line);
  background: linear-gradient(145deg, #151411 0%, #0d0d0c 66%);
  box-shadow: 0 35px 100px rgba(0, 0, 0, .42);
  clip-path: inset(1.25rem 1.25rem 0 round 1.5rem 1.5rem 0 0);
  transform: scale(.985);
  transform-origin: top center;
  animation: ns-reel-expand .72s cubic-bezier(.22,.72,.24,1) both;
}

@keyframes ns-reel-expand {
  to { clip-path: inset(0 round 0); transform: scale(1); }
}

.ns-system-reel::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: 3;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--ns-gold), transparent);
  opacity: .72;
}

.ns-system-reel__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .6fr);
  gap: clamp(2rem, 5vw, 6rem);
  align-items: end;
  padding: clamp(2rem, 4vw, 4rem);
  border-bottom: 1px solid var(--ns-line);
}

.ns-system-reel__eyebrow { margin: 0 0 .9rem; color: var(--ns-gold); font: 500 .6rem/1.45 "DM Mono", monospace; letter-spacing: .14em; }
.ns-system-reel__header h3 { margin: 0; color: var(--ns-bone); font: 500 clamp(2.6rem, 5vw, 5.6rem)/.94 "Playfair Display", Georgia, serif; letter-spacing: -.052em; }
.ns-system-reel__header > p { max-width: 32rem; margin: 0; color: #bdb6aa; font-size: clamp(.92rem, 1.15vw, 1.06rem); line-height: 1.75; }

.ns-system-reel__stage {
  display: grid;
  grid-template-columns: minmax(0, 1.58fr) minmax(17rem, .42fr);
  min-width: 0;
  border-bottom: 1px solid var(--ns-line);
}

.ns-reel-media {
  --reel-ratio: 16 / 9;
  min-width: 0;
  margin: 0;
  padding: clamp(.65rem, 1.2vw, 1.15rem);
  border-right: 1px solid var(--ns-line);
  background: #0a0a09;
}

.ns-reel-media__frame {
  position: relative;
  display: grid;
  place-items: center;
  container: reel-frame / size;
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  max-height: 720px;
  min-height: 0;
  overflow: hidden;
  background: #11171a;
  isolation: isolate;
}

.ns-reel-media__frame::before {
  content: "";
  position: absolute;
  inset: -5%;
  z-index: 0;
  background-image: var(--reel-backdrop-image);
  background-position: center top;
  background-size: cover;
  filter: blur(22px) saturate(.72) brightness(.48);
  opacity: .62;
  transform: scale(1.06);
  pointer-events: none;
}

.ns-reel-media[data-reel-kind="business"] .ns-reel-media__frame { background: #0d0c0b; }
.ns-reel-media[data-reel-kind="handy"] .ns-reel-media__frame { background: #edeae2; }
.ns-reel-media[data-reel-kind="handy-video"] .ns-reel-media__frame { background: #eef3f5; }
.ns-reel-media[data-reel-kind="insurance"] .ns-reel-media__frame { background: #f5f6f2; }
.ns-reel-media[data-reel-kind="cost-schedule"] .ns-reel-media__frame,
.ns-reel-media[data-reel-kind="project-intelligence"] .ns-reel-media__frame { background: #f5f7fa; }
.ns-reel-media[data-reel-kind="evidence-video"] .ns-reel-media__frame { background: #080b12; }

.ns-reel-media__frame > img,
.ns-reel-media__frame > video {
  grid-area: 1 / 1;
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-height: inherit;
  object-fit: contain;
  object-position: center top;
  background: transparent;
}

.ns-reel-media__frame > video[data-reel-video] {
  pointer-events: none;
}

.ns-reel-media[data-reel-fill="fill"] .ns-reel-media__frame > img {
  object-fit: fill;
}

.ns-reel-media[data-reel-fill="fill"].is-cinematic .ns-reel-media__frame > img {
  animation: none !important;
}

.ns-reel-media.is-cinematic[data-reel-motion="push"] .ns-reel-media__frame > img {
  animation: ns-reel-image-push var(--reel-duration, 2600ms) cubic-bezier(.22,.61,.36,1) both;
}

.ns-reel-media.is-cinematic[data-reel-motion="drift"] .ns-reel-media__frame > img {
  animation: ns-reel-image-drift var(--reel-duration, 2600ms) cubic-bezier(.22,.61,.36,1) both;
}

.ns-reel-media.is-cinematic[data-reel-motion="pull"] .ns-reel-media__frame > img {
  animation: ns-reel-image-pull var(--reel-duration, 2600ms) cubic-bezier(.22,.61,.36,1) both;
}

@keyframes ns-reel-image-push {
  from { transform: scale(1.012) translate3d(0,0,0); }
  to { transform: scale(1.055) translate3d(-.45%,-.55%,0); }
}

@keyframes ns-reel-image-drift {
  from { transform: scale(1.052) translate3d(.7%,0,0); }
  to { transform: scale(1.026) translate3d(-.7%,-.35%,0); }
}

@keyframes ns-reel-image-pull {
  from { transform: scale(1.058) translate3d(-.35%,-.5%,0); }
  to { transform: scale(1.014) translate3d(0,0,0); }
}

.ns-reel-media__frame > video[hidden], .ns-reel-media__frame > img[hidden] { display: none; }
.ns-reel-rotation-image { z-index: 1; object-fit: contain !important; background: #f5f7fa !important; opacity: 0; }
.ns-reel-media[data-reel-kind="cost-schedule"].is-animating .ns-reel-rotation-image { animation: ns-cost-schedule-rotation var(--reel-duration, 4800ms) ease-in-out infinite; }
@keyframes ns-cost-schedule-rotation { 0%,39%{opacity:0}48%,90%{opacity:1}99%,100%{opacity:0} }
.ns-reel-media.is-transitioning .ns-reel-media__frame { animation: ns-reel-frame-change .64s cubic-bezier(.2,.7,.2,1) both; }
@keyframes ns-reel-frame-change {
  0% { opacity: .3; filter: blur(7px); clip-path: inset(0 7% 0 7%); transform: scale(1.012); }
  100% { opacity: 1; filter: none; clip-path: inset(0); transform: none; }
}

.ns-reel-media figcaption { display: flex; justify-content: space-between; gap: 1rem; margin-top: .72rem; color: #847f76; font: 500 .54rem/1.4 "DM Mono", monospace; letter-spacing: .12em; }

.ns-reel-narrative {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  padding: clamp(2rem, 4vw, 4rem) clamp(1.4rem, 3vw, 3rem);
  background: radial-gradient(circle at 100% 0, rgba(189,142,73,.09), transparent 42%);
}

.ns-reel-narrative__phase { margin: 0 0 1.2rem; color: var(--ns-gold); font: 500 .61rem/1.4 "DM Mono", monospace; letter-spacing: .16em; }
.ns-reel-narrative h4 { margin: 0; color: var(--ns-bone); font: 500 clamp(2rem, 3.2vw, 3.5rem)/1 "Playfair Display", Georgia, serif; letter-spacing: -.045em; }
.ns-reel-narrative > p:not(.ns-reel-narrative__phase):not(.ns-reel-narrative__note) { margin: 1.5rem 0 0; color: #c2bbb0; font-size: .93rem; line-height: 1.78; }
.ns-reel-narrative__note { margin: 1.3rem 0 2.4rem; color: #999289; font: 500 .56rem/1.6 "DM Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.ns-reel-narrative .ns-work-detail__cta { margin-top: auto; min-height: 44px; }

.ns-system-reel__footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.25rem 2rem;
  align-items: center;
  padding: 1.25rem clamp(1rem, 2vw, 1.75rem) 1rem;
  background: #0b0b0a;
}

.ns-reel-chapters { display: flex; min-width: 0; gap: .55rem; }
.ns-reel-chapter {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  min-height: 4.25rem;
  padding: 1.05rem .75rem .55rem;
  overflow: hidden;
  border: 0;
  border-top: 1px solid #3e3b36;
  background: transparent;
  color: #9a948b;
  text-align: left;
  cursor: pointer;
}

.ns-reel-chapter::before,
.ns-reel-chapter::after { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; transform-origin: left; }
.ns-reel-chapter::before { background: rgba(189,142,73,.23); }
.ns-reel-chapter::after { background: var(--ns-gold); transform: scaleX(0); }
.ns-reel-chapter.is-progressing::after { animation: ns-reel-progress var(--reel-duration, 2600ms) linear both; }
.ns-reel-chapter[aria-current="step"] { color: var(--ns-bone); }
.ns-reel-chapter[aria-current="step"]:not(.is-progressing)::after { transform: scaleX(1); }
@keyframes ns-reel-progress { to { transform: scaleX(1); } }
.ns-reel-chapter span { display: block; margin-bottom: .25rem; color: var(--ns-gold); font: 500 .5rem/1.3 "DM Mono", monospace; letter-spacing: .1em; }
.ns-reel-chapter strong { display: block; overflow: hidden; color: inherit; font: 600 .68rem/1.35 Manrope, sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.ns-reel-chapter:focus-visible { outline: 2px solid var(--ns-bone); outline-offset: 2px; }

.ns-reel-transport { display: flex; align-items: stretch; gap: .45rem; }
.ns-reel-transport button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-width: 44px;
  min-height: 44px;
  padding: .7rem .85rem;
  border: 1px solid #3f3c36;
  background: #121210;
  color: var(--ns-bone);
  cursor: pointer;
  font: 600 .62rem Manrope, sans-serif;
}
.ns-reel-transport button:hover { border-color: var(--ns-gold); }
.ns-reel-transport button:focus-visible { outline: 2px solid var(--ns-gold); outline-offset: 2px; }
.ns-reel-control-icon { width:1rem; height:1rem; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.ns-reel-toggle-icon { position:relative; display:inline-block; width:1rem; height:1rem; border:1px solid currentColor; border-radius:50%; color:var(--ns-gold); }
.ns-reel-toggle-icon::before,.ns-reel-toggle-icon::after { content:""; position:absolute; top:50%; width:1.5px; height:.42rem; background:currentColor; transform:translateY(-50%); }
.ns-reel-toggle-icon::before { left:.32rem; }.ns-reel-toggle-icon::after { right:.32rem; }
.ns-reel-transport button[aria-pressed="true"] .ns-reel-toggle-icon::before { top:.25rem; left:.38rem; width:0; height:0; border-top:.24rem solid transparent; border-bottom:.24rem solid transparent; border-left:.36rem solid currentColor; background:transparent; transform:none; }
.ns-reel-transport button[aria-pressed="true"] .ns-reel-toggle-icon::after { display:none; }
.ns-reel-status { grid-column: 1 / -1; margin: 0; color: #969087; font: 500 .52rem/1.4 "DM Mono", monospace; letter-spacing: .09em; text-transform: uppercase; }

/* HANDY: overlays stay inside the real screenshot controls. */
.ns-handy-demo, .ns-insurance-demo, .ns-rex-demo, .ns-project-intelligence-demo, .ns-project-spec-video { display: none; }
.ns-reel-media[data-reel-kind="handy"] .ns-handy-demo,
.ns-reel-media[data-reel-kind="insurance"] .ns-insurance-demo,
.ns-reel-media[data-reel-kind="rex"] .ns-rex-demo,
.ns-reel-media[data-reel-kind="project-intelligence"] .ns-project-intelligence-demo { position: absolute; inset: 0; z-index: 2; display: block; pointer-events: none; }

/* Size these overlays to the visible object-fit:contain image, not the outer frame. */
.ns-reel-media[data-reel-kind="insurance"] .ns-insurance-demo {
  inset: auto;
  top: 0;
  left: 50%;
  width: min(100cqw, calc(100cqh * 1730 / 1478));
  height: min(100cqh, calc(100cqw * 1478 / 1730));
  transform: translateX(-50%);
}
.ns-reel-media[data-reel-kind="rex"] .ns-rex-demo {
  inset: auto;
  top: 0;
  left: 50%;
  width: min(100cqw, calc(100cqh * 2952 / 1774));
  height: min(100cqh, calc(100cqw * 1774 / 2952));
  transform: translateX(-50%);
}
.ns-handy-demo__field {
  position: absolute;
  display: flex;
  align-items: center;
  padding: 0 .75%;
  border: 1px solid #8ba6c5;
  border-radius: 7px;
  background: #fff;
  color: #243554;
  opacity: 0;
  font: 600 clamp(.38rem,.56vw,.62rem) Manrope, sans-serif;
  box-shadow: 0 0 0 2px rgba(55,101,157,.09);
}
.ns-handy-demo__field--assembly { left: 35.8%; top: 78.2%; width: 15.4%; height: 4%; }
.ns-handy-demo__field--size { left: 51.8%; top: 78.2%; width: 15.4%; height: 4%; }
.ns-handy-demo__field--rating { left: 2.7%; top: 85.9%; width: 15.4%; height: 4%; }
.ns-handy-demo__count { position: absolute; left: 2.75%; top: 70.2%; min-width: 12.5%; height: 2.4%; padding: .05% .3%; overflow: hidden; border-radius: 3px; background: #fff; color: #263b55; font: 600 clamp(.34rem,.52vw,.57rem) Manrope,sans-serif; }
.ns-handy-demo__count i, .ns-handy-demo__count b { position: absolute; inset: 0; display: flex; align-items: center; padding: 0 3%; font-style: normal; }
.ns-handy-demo__count b { opacity: 0; }
.ns-handy-demo__rows { position: absolute; left: 2.5%; right: 31.5%; top: 94.7%; height: 4.5%; padding: .3%; background: rgba(249,250,252,.96); opacity: 0; }
.ns-handy-demo__rows i { display: block; height: 22%; margin-bottom: 2%; border-radius: 99px; background: linear-gradient(90deg,#dbe4ef 0 10%,#b6c7da 10% 24%,#dfe6ed 24% 56%,#b7c9d7 56% 66%,#dce4ea 66%); }
.ns-handy-demo__export { position: absolute; top: 19.35%; right: 10.25%; display: flex; align-items: center; justify-content: center; width: max(12px,2.35%); aspect-ratio: 1; overflow: hidden; border: 1px solid rgba(255,255,255,.9); border-radius: 50%; background: rgba(255,255,255,.96); color: #0d2c26; opacity: 0; font-size: 0; }
.ns-handy-demo__export b { margin: 0; font: 800 clamp(.42rem,.7vw,.72rem)/1 Manrope,sans-serif; }
.ns-handy-demo__cursor { position: absolute; left: 37%; top: 80%; width: clamp(8px,.8vw,13px); aspect-ratio: 1; border: 2px solid #d39d2f; border-radius: 50%; background: rgba(255,227,136,.38); opacity: 0; box-shadow: 0 0 0 7px rgba(211,157,47,.13); }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__field--assembly { animation: ns-handy-field 5.4s .35s ease both; }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__field--size { animation: ns-handy-field 4.45s 1.3s ease both; }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__field--rating { animation: ns-handy-field 3.5s 2.25s ease both; }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__count i { animation: ns-handy-count-old 5.75s ease both; }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__count b { animation: ns-handy-count-new 5.75s ease both; }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__rows { animation: ns-handy-rows 5.75s ease both; }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__export { animation: ns-handy-export 5.75s ease both; }
.ns-reel-media[data-reel-kind="handy"].is-animating .ns-handy-demo__cursor { animation: ns-handy-cursor 5.75s cubic-bezier(.22,.7,.22,1) both; }
@keyframes ns-handy-field { 0%,8%{opacity:0;transform:scale(.985)}15%,100%{opacity:1;transform:none} }
@keyframes ns-handy-count-old { 0%,54%{opacity:1}60%,100%{opacity:0} }
@keyframes ns-handy-count-new { 0%,54%{opacity:0}60%,100%{opacity:1} }
@keyframes ns-handy-rows { 0%,56%{opacity:0;clip-path:inset(0 0 100%)}64%,100%{opacity:1;clip-path:inset(0)} }
@keyframes ns-handy-export { 0%,76%{opacity:0;box-shadow:0 0 0 0 rgba(255,210,45,0)}82%,94%{opacity:1;box-shadow:0 0 0 8px rgba(255,210,45,.2)}100%{opacity:1;box-shadow:0 0 0 0 rgba(255,210,45,0)} }
@keyframes ns-handy-cursor { 0%{left:37%;top:80%;opacity:0}6%{opacity:1}18%{left:37%;top:80%;opacity:1}27%{left:53%;top:80%;opacity:1}38%{left:53%;top:80%;opacity:1}47%{left:4%;top:87.6%;opacity:1}61%{left:4%;top:87.6%;opacity:1}76%{left:81.5%;top:21.5%;opacity:1}88%{left:81.5%;top:21.5%;opacity:1}100%{left:81.5%;top:21.5%;opacity:0} }

/* Insurance: type into the real question area, then emphasize the real cited card. */
.ns-insurance-demo__question { position: absolute; left: 31.1%; top: 22.4%; width: 58%; height: 7%; display: flex; align-items: center; overflow: hidden; padding: 0 1.3%; background: #fff; color: #232a27; white-space: nowrap; font: 500 clamp(.42rem,.85vw,.9rem) Manrope,sans-serif; }
.ns-insurance-demo__question b { display: block; width: 0; overflow: hidden; font: inherit; white-space: nowrap; }
.ns-insurance-demo__send { position: absolute; left: 77.1%; top: 33.2%; z-index: 3; width: 18.5%; height: 5%; border: 2px solid rgba(190,139,48,0); border-radius: 9px; opacity: 0; box-shadow: 0 0 0 0 rgba(190,139,48,0); }
.ns-insurance-demo__typing { position: absolute; left: 31.9%; top: 35.5%; z-index: 3; display: flex; align-items: center; gap: .35em; padding: .25em .5em; border-radius: 999px; background: rgba(249,250,247,.95); color: #64716b; opacity: 0; font: 500 clamp(.3rem,.52vw,.56rem) Manrope,sans-serif; }
.ns-insurance-demo__typing i { width: .42em; height: .42em; border-radius: 50%; background: #1f604d; animation: ns-insurance-dot .65s infinite alternate; }
.ns-insurance-demo__typing i:nth-child(2) { animation-delay: .14s; }.ns-insurance-demo__typing i:nth-child(3) { animation-delay: .28s; }
.ns-insurance-demo__results-mask { position: absolute; left: 28.3%; right: 0; top: 40.7%; bottom: 0; z-index: 1; display: block; background: #f7f8f4; opacity: 1; }
.ns-insurance-demo__answer { position: absolute; left: 31%; top: 41.8%; z-index: 3; display: block; padding: .45em .7em; border-left: 3px solid #b88935; background: rgba(255,255,255,.94); color: #1d533f; opacity: 0; transform: translateY(6px); box-shadow: 0 8px 24px rgba(26,75,58,.12); font: 700 clamp(.3rem,.52vw,.56rem) Manrope,sans-serif; }
.ns-reel-media[data-reel-kind="insurance"].is-animating .ns-insurance-demo__question b { animation: ns-insurance-type 5.4s .2s steps(29,end) both; }
.ns-reel-media[data-reel-kind="insurance"].is-animating .ns-insurance-demo__send { animation: ns-insurance-send 5.4s ease both; }
.ns-reel-media[data-reel-kind="insurance"].is-animating .ns-insurance-demo__typing { animation: ns-insurance-typing 5.4s ease both; }
.ns-reel-media[data-reel-kind="insurance"].is-animating .ns-insurance-demo__results-mask { animation: ns-insurance-results 5.4s ease both; }
.ns-reel-media[data-reel-kind="insurance"].is-animating .ns-insurance-demo__answer { animation: ns-insurance-answer 5.4s ease both; }
@keyframes ns-insurance-type { 0%,8%{width:0}42%,100%{width:100%} }
@keyframes ns-insurance-send { 0%,39%{opacity:0}43%{opacity:1;border-color:#c28c32;box-shadow:0 0 0 7px rgba(194,140,50,.18)}51%,100%{opacity:0;border-color:#c28c32;box-shadow:0 0 0 0 rgba(194,140,50,0)} }
@keyframes ns-insurance-typing { 0%,46%{opacity:0}52%,68%{opacity:1}74%,100%{opacity:0} }
@keyframes ns-insurance-results { 0%,70%{opacity:1}82%,100%{opacity:0} }
@keyframes ns-insurance-answer { 0%,74%{opacity:0;transform:translateY(6px)}84%,100%{opacity:1;transform:none} }
@keyframes ns-insurance-dot { to { transform: translateY(-2px); opacity: .38; } }

/* Rex: use the real bottom composer, then reveal the supplied conversation. */
.ns-rex-demo__conversation-mask { position: absolute; left: 25.2%; right: 2.4%; top: 15.1%; bottom: 22.8%; z-index: 1; display: block; border-radius: 0 0 10px 10px; background: #15283d; opacity: 1; }
.ns-rex-demo__composer { position: absolute; left: 27.55%; right: 3.55%; top: 86.25%; height: 9.1%; z-index: 3; display: flex; align-items: flex-start; overflow: hidden; padding: 1.25% 1.15%; border: 1px solid #39516d; border-radius: 7px; background: #10243a; color: #d6e2ef; box-shadow: 0 0 0 0 rgba(124,191,220,0); font: 500 clamp(.38rem,.72vw,.78rem) Manrope,sans-serif; }
.ns-rex-demo__composer b { display: block; width: 0; overflow: hidden; font: inherit; white-space: nowrap; }
.ns-rex-demo__typing { position: absolute; left: 27.4%; top: 24.5%; z-index: 3; display: flex; align-items: center; gap: .35em; padding: .42em .7em; border: 1px solid rgba(117,158,197,.34); border-radius: 999px; background: rgba(20,43,65,.96); color: #a9bfd3; opacity: 0; font: 600 clamp(.3rem,.5vw,.54rem) Manrope,sans-serif; }
.ns-rex-demo__typing i { width: .42em; height: .42em; border-radius: 50%; background: #79bdd6; animation: ns-rex-dot .65s infinite alternate; }
.ns-rex-demo__typing i:nth-child(2) { animation-delay: .14s; }
.ns-rex-demo__typing i:nth-child(3) { animation-delay: .28s; }
.ns-reel-media[data-reel-kind="rex"].is-animating .ns-rex-demo__composer { animation: ns-rex-composer 5.8s ease both; }
.ns-reel-media[data-reel-kind="rex"].is-animating .ns-rex-demo__composer b { animation: ns-rex-type 5.8s .2s steps(38,end) both; }
.ns-reel-media[data-reel-kind="rex"].is-animating .ns-rex-demo__typing { animation: ns-rex-typing 5.8s ease both; }
.ns-reel-media[data-reel-kind="rex"].is-animating .ns-rex-demo__conversation-mask { animation: ns-rex-conversation 5.8s ease both; }
@keyframes ns-rex-type { 0%,8%{width:0}40%,100%{width:100%} }
@keyframes ns-rex-composer { 0%,40%{opacity:1;box-shadow:0 0 0 0 rgba(124,191,220,0)}46%{opacity:1;box-shadow:0 0 0 7px rgba(124,191,220,.18)}54%{opacity:1;box-shadow:0 0 0 0 rgba(124,191,220,0)}62%,100%{opacity:0} }
@keyframes ns-rex-typing { 0%,48%{opacity:0}55%,70%{opacity:1}78%,100%{opacity:0} }
@keyframes ns-rex-conversation { 0%,70%{opacity:1}82%,100%{opacity:0} }
@keyframes ns-rex-dot { to { transform: translateY(-2px); opacity: .38; } }

/* Project Intelligence: two real question/result flows share one combined chapter. */
.ns-project-intelligence-demo__conversation-mask { position: absolute; left: 1.4%; right: 1.3%; top: 45.8%; bottom: 13.6%; z-index: 1; display: block; background: #f7f9fc; opacity: 1; }
.ns-project-intelligence-demo__composer { position: absolute; left: 5.4%; right: 5.4%; top: 88.2%; height: 5.25%; z-index: 3; display: flex; align-items: center; overflow: hidden; padding: 0 1.1%; border: 0; border-radius: 3px; background: #fff; color: #394354; box-shadow: 0 0 0 0 rgba(243,160,10,0); font: 500 clamp(.34rem,.66vw,.72rem) Manrope,sans-serif; }
.ns-project-intelligence-demo__composer b { display: block; width: 0; overflow: hidden; font: inherit; white-space: nowrap; }
.ns-project-intelligence-demo__send { position: absolute; right: 1.35%; top: 88.2%; z-index: 4; width: 3.8%; height: 5.25%; border: 2px solid rgba(243,160,10,0); border-radius: 999px; opacity: 0; box-shadow: 0 0 0 0 rgba(243,160,10,0); }
.ns-project-intelligence-demo__typing { position: absolute; left: 3.5%; top: 56%; z-index: 3; display: flex; align-items: center; gap: .35em; padding: .42em .7em; border: 1px solid rgba(243,160,10,.28); border-radius: 999px; background: rgba(255,255,255,.96); color: #7b6a4f; opacity: 0; font: 600 clamp(.3rem,.5vw,.54rem) Manrope,sans-serif; }
.ns-project-intelligence-demo__typing i { width: .42em; height: .42em; border-radius: 50%; background: #f3a00a; animation: ns-project-intelligence-dot .65s infinite alternate; }
.ns-project-intelligence-demo__typing i:nth-child(2) { animation-delay: .14s; }
.ns-project-intelligence-demo__typing i:nth-child(3) { animation-delay: .28s; }
.ns-reel-media .ns-project-spec-video { position: absolute; inset: 0; z-index: 5; display: none; width: 100%; height: 100%; object-fit: contain; object-position: center; background: #f1f2f4; opacity: 0; pointer-events: none; }
.ns-reel-media[data-reel-kind="project-intelligence"] .ns-project-spec-video { display: block; }
.ns-reel-media[data-reel-kind="project-intelligence"].is-animating .ns-project-intelligence-demo__composer { animation: ns-project-intelligence-composer var(--reel-duration, 15000ms) ease both; }
.ns-reel-media[data-reel-kind="project-intelligence"].is-animating .ns-project-intelligence-demo__composer b { animation: ns-project-intelligence-type var(--reel-duration, 15000ms) .2s steps(46,end) both; }
.ns-reel-media[data-reel-kind="project-intelligence"].is-animating .ns-project-intelligence-demo__send { animation: ns-project-intelligence-send var(--reel-duration, 15000ms) ease both; }
.ns-reel-media[data-reel-kind="project-intelligence"].is-animating .ns-project-intelligence-demo__typing { animation: ns-project-intelligence-typing var(--reel-duration, 15000ms) ease both; }
.ns-reel-media[data-reel-kind="project-intelligence"].is-animating .ns-project-intelligence-demo__conversation-mask { animation: ns-project-intelligence-conversation var(--reel-duration, 15000ms) steps(1,end) both; }
.ns-reel-media[data-reel-kind="project-intelligence"].is-animating .ns-project-spec-video { animation: ns-project-spec-video-stage var(--reel-duration, 15000ms) steps(1,end) both; }

@media (min-width: 701px) {
  .page-work #site-header,
  .page-work .site-header { background: #0a0a09 !important; backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@keyframes ns-project-intelligence-type { 0%,2%{width:0}12%,100%{width:100%} }
@keyframes ns-project-intelligence-composer { 0%,12%{opacity:1;box-shadow:0 0 0 0 rgba(243,160,10,0)}14%{opacity:1;box-shadow:0 0 0 6px rgba(243,160,10,.16)}16%,100%{opacity:0;box-shadow:0 0 0 0 rgba(243,160,10,0)} }
@keyframes ns-project-intelligence-send { 0%,12%{opacity:0}14%{opacity:1;border-color:#f3a00a;box-shadow:0 0 0 6px rgba(243,160,10,.16)}16%,100%{opacity:0;border-color:#f3a00a;box-shadow:0 0 0 0 rgba(243,160,10,0)} }
@keyframes ns-project-intelligence-typing { 0%,15%{opacity:0}17%,22%{opacity:1}24%,100%{opacity:0} }
@keyframes ns-project-intelligence-conversation { 0%,25.99%{opacity:1}26%,100%{opacity:0} }
@keyframes ns-project-spec-video-stage { 0%,31.99%{opacity:0}32%,100%{opacity:1} }
@keyframes ns-project-intelligence-dot { to { transform: translateY(-2px); opacity: .38; } }

@media (max-width: 1080px) {
  .ns-work-gallery .ns-work-rail { grid-template-columns: repeat(6, minmax(10rem, 1fr)); overflow-x: auto; scroll-snap-type: x proximity; }
  .page-work .ns-featured-case__image--leadmaster { width: 85% !important; }
  .ns-work-gallery .ns-work-rail li { scroll-snap-align: start; }
  .ns-system-reel__stage { grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr); }
  .ns-system-reel__header { grid-template-columns: 1fr; gap: 1.25rem; }
}

@media (max-width: 1366px) {
  .page-work.ns-system-reel-visible .rivet-fab {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(12px) scale(.94) !important;
  }
}

@media (max-width: 700px) {
  .ns-page-hero { grid-template-columns: 1fr; gap: 1.6rem; min-height: auto; padding: 7.5rem 1rem 4.5rem; }
  .ns-page-hero .ns-kicker { grid-column: 1; margin-bottom: 0; }
  .ns-page-hero h1 { font-size: clamp(3.1rem, 15.5vw, 4.5rem); }
  .ns-work-gallery { padding: 0 max(1rem, env(safe-area-inset-left)) calc(5rem + env(safe-area-inset-bottom)); }
  .ns-page-hero__aside { max-width: none; padding-bottom: 0; }
  .ns-complete-work__intro { grid-template-columns:1fr; gap:1.5rem; padding-top:4.5rem; margin-bottom:2.5rem; }
  .ns-complete-work__intro h2 { font-size:clamp(2.8rem,13vw,4.1rem); }
  .ns-work-gallery .ns-work-gallery__layout { display: block !important; }
  .ns-work-gallery .ns-work-rail { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(12.5rem, 72vw); margin: 0 -1rem 2rem; padding: 0 1rem; border-right: 0; border-left: 0; overscroll-behavior-inline: contain; scroll-padding-inline: 1rem; }
  .ns-work-gallery .ns-work-rail button { min-height: 6.4rem; border-bottom: 0; }
  .ns-system-reel { margin: 0 -.25rem; clip-path: inset(.6rem .6rem 0 round 1rem 1rem 0 0); }
  .ns-system-reel__header { grid-template-columns: 1fr; gap: 1rem; padding: 1.6rem 1.1rem; }
  .ns-system-reel__header h3 { font-size: clamp(2.55rem, 13vw, 4rem); }
  .ns-system-reel__header > p { font-size: .96rem; }
  .ns-system-reel__stage { grid-template-columns: 1fr; }
  .ns-reel-media { padding: .55rem; border-right: 0; border-bottom: 1px solid var(--ns-line); }
  .ns-reel-media__frame { aspect-ratio: 16 / 9; height: auto; max-height: 560px; }
  .page-work .ns-featured-case__media--leadmaster .ns-featured-case__image--leadmaster { width: 100% !important; object-fit: contain !important; }
  .ns-reel-media figcaption { font-size: .48rem; }
  .ns-reel-narrative { padding: 1.7rem 1.1rem 2rem; }
  .ns-reel-narrative h4 { font-size: clamp(2.1rem, 10.5vw, 3.3rem); }
  .ns-reel-narrative > p:not(.ns-reel-narrative__phase):not(.ns-reel-narrative__note) { font-size: 1rem; }
  .ns-reel-narrative .ns-work-detail__cta { width: 100%; justify-content: center; }
  .ns-system-reel__footer { grid-template-columns: 1fr; padding: 1rem .65rem calc(1rem + env(safe-area-inset-bottom)); }
  .ns-reel-chapters { margin: 0 -.65rem; padding: .1rem .65rem .7rem; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-inline: contain; }
  .ns-reel-chapter { flex: 0 0 min(11rem, 64vw); min-height: 4.75rem; scroll-snap-align: start; }
  .ns-reel-chapter strong { font-size: .72rem; }
  .ns-reel-transport { justify-content: stretch; }
  .ns-reel-transport button { flex: 1 1 0; min-height: 48px; }
  .ns-reel-status { grid-column: 1; }
  .ns-handy-demo__field { border-radius: 4px; }
  .page-work .rivet-fab { right: max(12px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); width: 48px; min-width: 48px; height: 48px; padding: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ns-system-reel,
  .ns-reel-media.is-transitioning .ns-reel-media__frame,
  .ns-reel-media.is-cinematic .ns-reel-media__frame > img,
  .ns-reel-chapter.is-progressing::after,
  .ns-handy-demo *,
  .ns-insurance-demo *,
  .ns-rex-demo *,
  .ns-project-intelligence-demo *,
  .ns-reel-rotation-image { animation: none !important; transition: none !important; }
  .ns-system-reel { clip-path: none; transform: none; }
  .ns-reel-media[data-reel-kind="handy"] .ns-handy-demo__field,
  .ns-reel-media[data-reel-kind="handy"] .ns-handy-demo__count b,
  .ns-reel-media[data-reel-kind="handy"] .ns-handy-demo__rows,
  .ns-reel-media[data-reel-kind="handy"] .ns-handy-demo__export { opacity: 1; }
  .ns-reel-media[data-reel-kind="handy"] .ns-handy-demo__count i,
  .ns-reel-media[data-reel-kind="handy"] .ns-handy-demo__cursor { opacity: 0; }
  .ns-reel-media[data-reel-kind="insurance"] .ns-insurance-demo__question b { width: 100%; }
  .ns-reel-media[data-reel-kind="insurance"] .ns-insurance-demo__send,
  .ns-reel-media[data-reel-kind="insurance"] .ns-insurance-demo__typing { opacity: 0; }
  .ns-reel-media[data-reel-kind="insurance"] .ns-insurance-demo__results-mask { opacity: 0; }
  .ns-reel-media[data-reel-kind="insurance"] .ns-insurance-demo__answer { opacity: 1; transform: none; }
  .ns-reel-media[data-reel-kind="rex"] .ns-rex-demo__composer,
  .ns-reel-media[data-reel-kind="rex"] .ns-rex-demo__typing { opacity: 0; }
  .ns-reel-media[data-reel-kind="rex"] .ns-rex-demo__conversation-mask { opacity: 0; }
  .ns-reel-media[data-reel-kind="project-intelligence"] .ns-project-intelligence-demo__composer,
  .ns-reel-media[data-reel-kind="project-intelligence"] .ns-project-intelligence-demo__send,
  .ns-reel-media[data-reel-kind="project-intelligence"] .ns-project-intelligence-demo__typing { opacity: 0; }
  .ns-reel-media[data-reel-kind="project-intelligence"] .ns-project-intelligence-demo__conversation-mask { opacity: 0; }
  .ns-reel-media[data-reel-kind="project-intelligence"] .ns-project-spec-video { opacity: 1; }
}
