/* Roc Enhance 2.0 platform base (MODULE_CONTRACT.md s6.5). Applies to every
   site, before the site theme and module styles. */
*, *::before, *::after { box-sizing: border-box; }
body.site { margin: 0; }
:where(.site) img, :where(.site) video { max-width: 100%; display: block; }
/* A photo's width and height (s18.5) only reserve its shape while it loads; its
   drawn size comes from the page's CSS, as before. */
:where(.site img[width][height]) { height: auto; }

/* Full-height designs use calc(N * var(--m-vh)) instead of vh units, so they
   drop to content height in edit mode (s6.4). */
.site { --m-vh: 1svh; }
.site[data-mode="edit"] { --m-vh: 0px; }

/* Headings look the same at any level: the platform sets the level from where a
   module sits (s18.1), so the browser's own sizes and margins for h1-h6 are reset
   and each module styles its headings itself. */
:where(.site) :where(h1, h2, h3, h4, h5, h6) { margin: 0; font-size: inherit; font-weight: inherit; }

/* The frame. A module's own box is .m__inner. */
.m { position: relative; }
.m__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.m__bg-img { width: 100%; height: 100%; object-fit: cover; }
.m__inner { position: relative; z-index: 1; }

/* Edit mode: everything in its final state, nothing moving (s7). */
.site[data-mode="edit"] *, .site[data-mode="edit"] *::before, .site[data-mode="edit"] *::after { animation: none !important; transition: none !important; }
/* Reduced motion: looping and drifting animation stops, and entrance movement
   is skipped (see JS_FLAG in page.ts). Short hover and focus transitions stay,
   because a soft fade on a button is not the kind of motion this setting is for. */
@media (prefers-reduced-motion: reduce) {
  .site *, .site *::before, .site *::after { animation: none !important; scroll-behavior: auto !important; }
}

/* Library roles (MODULE_CONTRACT.md s9.4). Shared library modules use only these,
   never a site's own token names, so one module takes on every client's look.
   Each role falls back through the token names sites already share; a site's
   theme.css can set any of them itself, on :where(.site-<slug>). Roles are worked
   out once, on the page, so a module on a dark background uses the -dark roles
   (--lib-brand-text-dark, --lib-on-dark ...) rather than relying on a theme's
   per-surface variables. */
:where(.site) {
  --lib-paper: var(--t-paper, #f7f7f5);
  --lib-surface: var(--t-white, #ffffff);
  --lib-ink: var(--t-ink, #111111);
  --lib-muted: var(--t-text-2, #555555);
  --lib-line: var(--t-line, rgba(0, 0, 0, .12));
  --lib-brand: var(--t-brand, #e9511b);
  --lib-brand-fill: var(--t-grad, var(--t-brand, #e9511b));
  --lib-brand-text: var(--accent-text, var(--t-brand-text, var(--t-brand, #a83a10)));
  --lib-brand-text-dark: var(--t-brand-text-dark, var(--t-brand, #f27a4e));
  --lib-on-brand: var(--t-on-brand, #ffffff);
  --lib-dark: var(--t-dark, var(--t-ink, #111111));
  --lib-dark-2: var(--t-dark-2, var(--t-ink-2, #1d1d1d));
  --lib-on-dark: var(--t-on-dark, #ffffff);
  --lib-on-dark-2: var(--t-on-dark-2, rgba(255, 255, 255, .75));
  --lib-radius: var(--t-radius, 16px);
  --lib-radius-s: var(--t-radius-s, var(--t-radius, 10px));
  --lib-font-display: var(--t-font-display, inherit);
  --lib-font-body: var(--t-font-body, inherit);
  --lib-photo-wait: var(--t-photo-wait, rgba(0, 0, 0, .08));
}

.site-ntwrx{--t-ink:#111111;--t-card:#FBFAF7;--t-dark:#111111;--t-line:#D2D0CA;--t-brand:#FBB040;--t-paper:#F2F1ED;--t-white:#FFFFFF;--t-dark-2:#0B0B0B;--t-dark-3:#121212;--t-line-2:#E2E0DA;--t-radius:2px;--t-text-2:#2A2A2A;--t-on-dark:#F4F4F2;--t-paper-2:#F6F5F2;--t-space-l:110px;--t-space-m:72px;--t-space-s:40px;--t-on-brand:#000000;--t-space-xl:150px;--t-font-body:'Inter Tight', system-ui, sans-serif;--t-font-hand:'Caveat', cursive;--t-font-mono:'JetBrains Mono', monospace;--t-on-dark-2:#D9D9D5;--t-on-dark-3:#A8A8A4;--t-brand-text:#9A6200;--t-photo-wait:#D6D4CF;--t-space-none:0px;--t-font-display:'Archivo', sans-serif;}
.site-ntwrx .c-accent{color:var(--accent-text)}

/* NTWRX site theme: the shared pieces every NTWRX module uses (buttons, labels,
   the condensed display type, the page width, the reveal). Theme classes start
   "t-" and every selector starts with :where(.site-ntwrx), which adds no
   weight, so a module can override any theme style with a single class.
   Pairing table, carried over from the original site:
   paper / white: text ink, accent text brand-text, accent fills brand
   dark: text on-dark, accent text brand
   brand fill: text on-brand only */

:where(.site-ntwrx) { --accent-text: var(--t-brand-text); background: var(--t-paper); color: var(--t-ink); font-family: var(--t-font-body); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
:where(.site-ntwrx) [data-surface="dark"] { --accent-text: var(--t-brand); }
:where(.site-ntwrx) a { color: inherit; text-decoration: none; }
:where(.site-ntwrx) a:hover { color: var(--t-brand-text); }
:where(.site-ntwrx) [data-surface="dark"] a:hover { color: var(--t-brand); }
:where(.site-ntwrx) ::selection { background: var(--t-brand); color: var(--t-on-brand); }

:where(.site-ntwrx) .t-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:where(.site-ntwrx) .t-wrap { max-width: 1340px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 56px); position: relative; z-index: 1; width: 100%; }

:where(.site-ntwrx) .t-eyebrow { display: flex; align-items: center; gap: 14px; font-family: var(--t-font-mono); font-size: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); }
:where(.site-ntwrx) .t-eyebrow.t-line::after { content: ''; width: 80px; height: 1.5px; background: linear-gradient(90deg, var(--t-brand) 0 40%, transparent 40% 52%, var(--t-brand) 52%); }
:where(.site-ntwrx) .t-cond { font-family: var(--t-font-display); font-weight: 900; font-stretch: 72%; text-transform: uppercase; letter-spacing: -0.01em; margin: 0; line-height: .88; }

:where(.site-ntwrx) .t-btn { display: inline-flex; align-items: center; gap: 14px; padding: 17px 24px; border-radius: var(--t-radius); font-family: var(--t-font-display); font-weight: 800; font-stretch: 100%; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; transition: background .25s, color .25s, transform .25s; cursor: pointer; border: 0; }
:where(.site-ntwrx) .t-btn-amber { background: var(--t-brand); color: var(--t-on-brand); }
:where(.site-ntwrx) .t-btn-amber:hover { background: var(--t-ink); color: var(--t-brand) !important; }
:where(.site-ntwrx) .t-btn-amber .t-ar { transition: transform .25s; }
:where(.site-ntwrx) .t-btn-amber:hover .t-ar { transform: translateX(4px); }
:where(.site-ntwrx) .t-btn-ghost-l { border: 1.5px solid rgba(244, 244, 242, .5); color: var(--t-on-dark); }
:where(.site-ntwrx) .t-btn-ghost-l:hover { border-color: var(--t-brand); color: var(--t-brand) !important; }
:where(.site-ntwrx) .t-under-link { display: inline-flex; align-items: center; gap: 12px; font-family: var(--t-font-display); font-weight: 800; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--t-ink); padding-bottom: 8px; border-bottom: 2px solid var(--t-brand); width: fit-content; }

:where(.site-ntwrx) .t-sec-row { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 24px; margin-bottom: clamp(32px, 4vw, 52px); }
:where(.site-ntwrx) .t-sec-row :is(h1,h2,h3,h4,h5,h6) { font-size: clamp(40px, 5vw, 80px); }
:where(.site-ntwrx) .t-sec-row p { margin: 0; max-width: 30em; font-size: 16px; line-height: 1.65; color: var(--t-text-2); }

/* Reveal once (MODULE_CONTRACT.md s7). Hidden only while the page script is
   running, so content is always visible without it. */
:where(.site-ntwrx) [data-reveal] { transition: opacity .9s cubic-bezier(.2, .7, .2, 1), transform .9s cubic-bezier(.2, .7, .2, 1); }
.m-js :where(.site-ntwrx) [data-reveal]:not(.is-in) { opacity: 0; transform: translateY(18px); }

/* Collage photo frames: a clipped photo with paper sheets tucked behind it. */
:where(.site-ntwrx) .t-frame { filter: drop-shadow(0 16px 30px rgba(0, 0, 0, .14)); }
:where(.site-ntwrx) .t-frame-img { position: absolute; inset: 0; overflow: hidden; background: #D6D4CF; z-index: 1; }
:where(.site-ntwrx) .t-frame-img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 1.4s cubic-bezier(.2, .7, .2, 1); }
:where(.site-ntwrx) .t-frame:hover .t-frame-img img { transform: scale(1.08); }
:where(.site-ntwrx) .t-sheet { position: absolute; z-index: 0; background: #FBFAF7; }
:where(.site-ntwrx) .t-sheet.t-s1 { animation: site-ntwrx-float-b 6s ease-in-out infinite; }
:where(.site-ntwrx) .t-sheet.t-s2 { animation: site-ntwrx-float-c 7.5s ease-in-out -3s infinite; }
@keyframes site-ntwrx-float-a { 0%, 100% { translate: 0 0; } 50% { translate: 0 -9px; } }
@keyframes site-ntwrx-float-b { 0%, 100% { translate: 0 0; rotate: 0deg; } 50% { translate: 4px 6px; rotate: .6deg; } }
@keyframes site-ntwrx-float-c { 0%, 100% { translate: 0 0; } 50% { translate: -5px -5px; } }

/* client.ntwrx.about-hero v1 */
/* NTWRX about hero: copy beside a torn-paper photo with an amber block behind.
   The heading lines slide up once the copy is revealed. */
.m-client-ntwrx-about-hero { overflow: hidden; }
.m-client-ntwrx-about-hero > .m__inner { padding: var(--m-pt, clamp(28px, 4vw, 56px)) 0 var(--m-pb, clamp(40px, 5vw, 72px)); }
.m-client-ntwrx-about-hero__grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(28px, 4vw, 56px); align-items: center; }
.m-client-ntwrx-about-hero__copy { display: flex; flex-direction: column; gap: 28px; }
.m-client-ntwrx-about-hero__h { font-size: clamp(44px, 5.6vw, 104px); }
.m-client-ntwrx-about-hero__ln { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.m-client-ntwrx-about-hero__ln > span { display: block; transition: transform 1s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-about-hero__ln:nth-child(2) > span { transition-delay: .12s; }
.m-client-ntwrx-about-hero__ln:nth-child(3) > span { transition-delay: .24s; }
.m-js .m-client-ntwrx-about-hero__copy:not(.is-in) .m-client-ntwrx-about-hero__ln > span { transform: translateY(105%); }
.m-client-ntwrx-about-hero__body { margin: 0; font-size: 18px; line-height: 1.6; max-width: 30em; color: var(--t-text-2); }
.m-client-ntwrx-about-hero__ctas { display: flex; gap: 28px; align-items: center; flex-wrap: wrap; }

/* Text link with a round arrow button. */
.m-client-ntwrx-about-hero__txt { display: inline-flex; align-items: center; gap: 14px; font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--t-ink); }
.m-client-ntwrx-about-hero__play { width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid var(--t-ink); display: flex; align-items: center; justify-content: center; transition: background .25s, border-color .25s; }
.m-client-ntwrx-about-hero__play::after { content: '→'; font-family: var(--t-font-body); font-size: 14px; letter-spacing: 0; line-height: 1; color: var(--t-ink); }
.m-client-ntwrx-about-hero__txt:hover .m-client-ntwrx-about-hero__play { background: var(--t-brand); border-color: var(--t-brand); }

/* Photo collage (decorative shapes). */
.m-client-ntwrx-about-hero__art { position: relative; height: clamp(380px, 40vw, 560px); }
.m-client-ntwrx-about-hero__amber { position: absolute; left: 4%; top: 16%; width: 24%; height: 52%; background: var(--t-brand); transform: rotate(-1deg); animation: site-ntwrx-float-c 8.5s ease-in-out -1s infinite; }
.m-client-ntwrx-about-hero__frame { position: absolute; inset: 0 -4% 0 10%; animation: site-ntwrx-float-a 7s ease-in-out infinite; }
.m-client-ntwrx-about-hero__frame .t-frame-img { clip-path: polygon(0 7%, 24% 7%, 24.6% 0, 71% 0, 71.4% 4.5%, 100% 7%, 100% 97.5%, 3% 100%, 0 94%); }
.m-client-ntwrx-about-hero__frame .t-s1 { right: -2.5%; top: -2%; width: 34%; height: 42%; transform: rotate(2.5deg); clip-path: polygon(0 3%, 100% 0, 98% 100%, 2% 97%); }
.m-client-ntwrx-about-hero__frame .t-s2 { left: -2.5%; bottom: -3.5%; width: 46%; height: 20%; transform: rotate(-1.5deg); }

@media (max-width: 1100px) {
  .m-client-ntwrx-about-hero__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-about-hero__art { height: min(70vw, 560px); }
  .m-client-ntwrx-about-hero__h { font-size: clamp(44px, 9vw, 104px); }
}

/* client.ntwrx.about-mission v1 */
/* NTWRX mission: copy beside a photo, a dark panel that types out a few words
   once the section is seen, and a gold cross painted in as the visitor scrolls. */
.m-client-ntwrx-about-mission { background: var(--t-paper-2); overflow: hidden; }
.m-client-ntwrx-about-mission > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-about-mission__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 5vw, 80px); align-items: center; }
.m-client-ntwrx-about-mission__copy { display: flex; flex-direction: column; gap: 24px; }
.m-client-ntwrx-about-mission__h { font-size: clamp(44px, 5.4vw, 84px); }
.m-client-ntwrx-about-mission__body { display: flex; flex-direction: column; gap: 24px; }
.m-client-ntwrx-about-mission__body p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--t-text-2); max-width: 30em; }

.m-client-ntwrx-about-mission__art { position: relative; height: clamp(320px, 32vw, 440px); }
.m-client-ntwrx-about-mission__frame { position: absolute; left: 0; top: 4%; width: 78%; bottom: 0; animation: site-ntwrx-float-a 8s ease-in-out -2s infinite; }
.m-client-ntwrx-about-mission__frame .t-frame-img { clip-path: polygon(9% 3%, 100% 0, 100% 100%, 0 98.5%, 0 21%, 9% 19%); }
.m-client-ntwrx-about-mission__frame .t-s1 { left: -1.5%; top: -5%; width: 30%; height: 36%; transform: rotate(-3deg); }
.m-client-ntwrx-about-mission__frame .t-s2 { left: 20%; bottom: -4%; width: 50%; height: 16%; transform: rotate(1deg); }

/* Dark panel with typed words (decorative near-black, darker than the dark tokens). */
.m-client-ntwrx-about-mission__panel { position: absolute; right: 0; top: 0; width: 28%; min-width: 180px; height: 82%; background: #151515; color: var(--t-on-dark); padding: clamp(22px, 2.4vw, 34px) clamp(18px, 2vw, 28px); display: flex; flex-direction: column; gap: 10px; z-index: 2; box-shadow: 0 20px 50px rgba(0, 0, 0, .25); animation: site-ntwrx-float-b 9s ease-in-out -5s infinite; }
.m-client-ntwrx-about-mission__tw { font-family: var(--t-font-mono); font-size: clamp(11px, 1vw, 15px); letter-spacing: .2em; text-transform: uppercase; white-space: nowrap; width: fit-content; border-right: 2px solid transparent; padding-right: 2px; }
.m-js .m-client-ntwrx-about-mission__tw { clip-path: inset(0 100% 0 0); }
.m-client-ntwrx-about-mission.is-go .m-client-ntwrx-about-mission__tw { animation: m-client-ntwrx-about-mission-type 1s steps(12) forwards, m-client-ntwrx-about-mission-caret .8s step-end 3 forwards; }
.m-client-ntwrx-about-mission.is-go .m-client-ntwrx-about-mission__tw:nth-child(2) { animation-delay: .9s, .9s; }
.m-client-ntwrx-about-mission.is-go .m-client-ntwrx-about-mission__tw:nth-child(3) { animation-delay: 1.8s, 1.8s; }
.m-client-ntwrx-about-mission.is-go .m-client-ntwrx-about-mission__tw:nth-child(4) { animation-delay: 2.7s, 2.7s; }
@keyframes m-client-ntwrx-about-mission-type { to { clip-path: inset(0 0 0 0); } }
@keyframes m-client-ntwrx-about-mission-caret { 50% { border-right-color: var(--t-brand); } }
.m-client-ntwrx-about-mission__rule { width: 38px; height: 2px; background: var(--t-brand); margin-top: 14px; }

/* Painted gold cross. Drawn in full unless the behaviour takes it over. */
.m-client-ntwrx-about-mission__brush { position: absolute; right: 2%; bottom: -8%; width: clamp(140px, 17vw, 230px); height: clamp(140px, 17vw, 230px); z-index: 3; overflow: visible; }
.m-client-ntwrx-about-mission__mk { stroke-dasharray: 260; stroke-dashoffset: 0; }
.m-client-ntwrx-about-mission__splat circle { transform-box: fill-box; transform-origin: center; transition: opacity .25s, transform .35s cubic-bezier(.3, 1.8, .5, 1); }
.m-js .m-client-ntwrx-about-mission__brush.is-scrub:not(.is-splatted) .m-client-ntwrx-about-mission__splat circle { opacity: 0; transform: scale(.2); }

@media (max-width: 900px) {
  .m-client-ntwrx-about-mission__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-about-mission__art { height: 76vw; }
}

/* client.ntwrx.about-numbers v1 */
/* NTWRX numbers: figures on the left lined up with the page width, a photo
   running to the right edge. Figures count up once seen (behaviour.ts). */
.m-client-ntwrx-about-numbers { background: var(--t-paper-2); overflow: hidden; }
.m-client-ntwrx-about-numbers__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; min-height: clamp(260px, 22vw, 340px); }
/* The left padding lines the copy up with the 1340px page width (t-wrap). */
.m-client-ntwrx-about-numbers__copy { padding: var(--m-pt, clamp(48px, 5vw, 72px)) clamp(20px, 4vw, 56px) var(--m-pb, clamp(48px, 5vw, 72px)) max(clamp(20px, 4vw, 56px), calc(50vw - 670px + clamp(20px, 4vw, 56px))); display: flex; flex-direction: column; justify-content: center; gap: 30px; }
.m-client-ntwrx-about-numbers__stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; }
.m-client-ntwrx-about-numbers__stat { display: flex; flex-direction: column; gap: 14px; padding: 0 clamp(10px, 1.6vw, 28px); border-left: 1px solid #C9C7C1; }
.m-client-ntwrx-about-numbers__stat:first-child { border-left: 0; padding-left: 0; }
.m-client-ntwrx-about-numbers__counter { font-family: var(--t-font-display); font-weight: 900; font-stretch: 92%; font-size: clamp(38px, 3.6vw, 56px); line-height: .9; letter-spacing: -.02em; color: #000; white-space: nowrap; font-variant-numeric: tabular-nums; }
.m-client-ntwrx-about-numbers__s { font-size: .62em; vertical-align: .5em; margin-left: 2px; }
.m-client-ntwrx-about-numbers__lab { font-family: var(--t-font-mono); font-size: clamp(9.5px, .8vw, 11px); letter-spacing: .08em; text-transform: uppercase; line-height: 1.5; color: var(--t-text-2); }
.m-client-ntwrx-about-numbers__art { position: relative; min-height: 300px; }
.m-client-ntwrx-about-numbers__frame { position: absolute; inset: 0; animation: site-ntwrx-float-a 9s ease-in-out -4s infinite; }
.m-client-ntwrx-about-numbers__frame .t-frame-img { clip-path: polygon(0 2.5%, 100% 0, 100% 100%, 1.5% 100%); }
.m-client-ntwrx-about-numbers__frame .t-s1 { left: -2.5%; top: -4%; width: 26%; height: 34%; transform: rotate(-2deg); }
@media (max-width: 1240px) {
  .m-client-ntwrx-about-numbers__stats { grid-template-columns: 1fr 1fr; gap: 32px 0; }
  .m-client-ntwrx-about-numbers__stat:nth-child(3) { border-left: 0; padding-left: 0; }
}
@media (max-width: 900px) {
  .m-client-ntwrx-about-numbers__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-about-numbers__copy { padding: var(--m-pt, 56px) clamp(20px, 4vw, 56px) var(--m-pb, 56px); }
  .m-client-ntwrx-about-numbers__stats { grid-template-columns: 1fr 1fr; gap: 28px 0; }
  .m-client-ntwrx-about-numbers__art { min-height: 60vw; }
}

/* client.ntwrx.about-values v1 */
/* NTWRX values: a row of icon, title and sentence, split by thin rules. */
/* The background and rule colours are a shade darker than the paper and line
   tokens; the original used these literal values. */
.m-client-ntwrx-about-values { background: #EDECE8; }
.m-client-ntwrx-about-values > .m__inner { padding: var(--m-pt, clamp(64px, 7vw, 100px)) 0 var(--m-pb, clamp(64px, 7vw, 100px)); }
.m-client-ntwrx-about-values__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); margin-top: 36px; align-items: start; }
.m-client-ntwrx-about-values__val { display: flex; flex-direction: column; gap: 16px; padding: 0 clamp(16px, 2.4vw, 40px); border-left: 1px solid #C9C7C1; }
.m-client-ntwrx-about-values__val:first-child { border-left: 0; padding-left: 0; }
.m-client-ntwrx-about-values__val svg { width: 40px; height: 40px; fill: none; stroke: #E0901A; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s cubic-bezier(.3, 1.6, .5, 1); }
.m-client-ntwrx-about-values__val:hover svg { transform: translateY(-4px) rotate(-6deg) scale(1.08); }
.m-client-ntwrx-about-values__val :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 800; font-stretch: 100%; font-size: 18px; letter-spacing: .02em; text-transform: uppercase; margin: 6px 0 0; }
.m-client-ntwrx-about-values__val p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--t-text-2); max-width: 18em; }
@media (max-width: 980px) {
  .m-client-ntwrx-about-values__val { border-left: 0; padding: 0 0 28px; }
  .m-client-ntwrx-about-values__grid { gap: 20px 32px; }
}

/* client.ntwrx.approach v1 */
/* NTWRX approach: dark, big outlined words that fill with gold once seen.
   Filled is the resting state, so the words read the same without script. */
.m-client-ntwrx-approach { background: var(--t-dark-3); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-approach > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-approach__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-approach .t-sec-row p { color: var(--t-on-dark-2); }
.m-client-ntwrx-approach :is(h1,h2,h3,h4,h5,h6) { color: var(--t-on-dark); }
.m-client-ntwrx-approach__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: clamp(28px, 3vw, 48px); align-items: start; border-top: 1px solid #333333; padding-top: 36px; }
.m-client-ntwrx-approach__pillar { display: flex; flex-direction: column; gap: 14px; min-width: 0; container-type: inline-size; }
.m-client-ntwrx-approach__w { display: block; max-width: 100%; white-space: nowrap; font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(40px, 15cqi, 96px); line-height: .9; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1.5px var(--t-brand); background: linear-gradient(90deg, var(--t-brand) 0 50%, transparent 50% 100%) 0 0 / 200% 100%; -webkit-background-clip: text; background-clip: text; transition: background-position 1.4s cubic-bezier(.6, 0, .3, 1), -webkit-text-stroke-color 1.4s; }
.m-client-ntwrx-approach__pillar:nth-child(2) .m-client-ntwrx-approach__w { transition-delay: .35s; }
.m-client-ntwrx-approach__pillar:nth-child(3) .m-client-ntwrx-approach__w { transition-delay: .7s; }
.m-js .m-client-ntwrx-approach__grid:not(.is-in) .m-client-ntwrx-approach__w { background-position: 100% 0; -webkit-text-stroke-color: var(--t-on-dark); }
.m-client-ntwrx-approach__k { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--t-brand); }
.m-client-ntwrx-approach__pillar p { margin: 0; font-size: 16px; line-height: 1.6; color: var(--t-on-dark-2); max-width: 24em; }

/* client.ntwrx.challenge v1 */
/* NTWRX challenge: copy and numbered list beside a two-photo collage. */
.m-client-ntwrx-challenge { overflow: hidden; }
.m-client-ntwrx-challenge > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-challenge__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(36px, 5vw, 88px); align-items: center; }
.m-client-ntwrx-challenge__copy { display: flex; flex-direction: column; gap: 26px; }
.m-client-ntwrx-challenge__h { font-size: clamp(44px, 5.2vw, 84px); }
.m-client-ntwrx-challenge__body { margin: 0; font-size: 17px; line-height: 1.65; color: var(--t-text-2); max-width: 32em; }
.m-client-ntwrx-challenge__list { display: flex; flex-direction: column; border-top: 1.5px solid var(--t-ink); }
.m-client-ntwrx-challenge__row { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 14px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid var(--t-line); transition: padding .35s; }
.m-client-ntwrx-challenge__row:hover { padding-left: 10px; }
.m-client-ntwrx-challenge__n { font-family: var(--t-font-mono); font-size: 12px; color: var(--accent-text); letter-spacing: .1em; }
.m-client-ntwrx-challenge__row p { margin: 0; font-size: 17px; line-height: 1.5; font-weight: 500; }
.m-client-ntwrx-challenge__art { position: relative; height: clamp(400px, 40vw, 580px); }
.m-client-ntwrx-challenge__amber { position: absolute; right: -3%; top: 10%; width: 30%; height: 56%; background: var(--t-brand); animation: site-ntwrx-float-c 8.5s ease-in-out -1s infinite; }
.m-client-ntwrx-challenge__pa1 { position: absolute; left: 0; top: 0; width: 84%; height: 82%; animation: site-ntwrx-float-a 8s ease-in-out infinite; }
.m-client-ntwrx-challenge__pa1 .t-frame-img { clip-path: polygon(0 7%, 26% 7%, 26.6% 0, 100% 0, 100% 94%, 96% 100%, 0 100%); }
.m-client-ntwrx-challenge__pa1 .t-s1 { right: -2.5%; top: -2.5%; width: 32%; height: 34%; transform: rotate(2.5deg); }
.m-client-ntwrx-challenge__pa1 .t-s2 { left: -2.5%; bottom: -3%; width: 42%; height: 18%; transform: rotate(-1.5deg); }
.m-client-ntwrx-challenge__pa2 { position: absolute; right: 0; bottom: 0; width: 44%; height: 40%; z-index: 2; animation: site-ntwrx-float-a 6.5s ease-in-out -3s infinite; }
.m-client-ntwrx-challenge__pa2 .t-frame-img { clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%, 0 14%); }
.m-client-ntwrx-challenge__pa2 .t-s1 { left: -4%; bottom: -6%; width: 50%; height: 40%; transform: rotate(-2deg); }
@media (max-width: 1000px) {
  .m-client-ntwrx-challenge__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-challenge__art { height: min(80vw, 560px); }
}

/* client.ntwrx.contact-cta v1 */
/* NTWRX contact banner. The gold lines draw in once seen and then glow. */
.m-client-ntwrx-contact-cta { background: var(--t-dark-3); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-contact-cta > .m__inner { position: static; min-height: clamp(380px, 34vw, 480px); display: flex; align-items: center; }
.m-client-ntwrx-contact-cta__photo { position: absolute; top: 0; bottom: 0; right: 0; width: 58%; background-color: #3A3A38; clip-path: polygon(32% 0, 100% 0, 100% 100%, 0 100%); }
.m-client-ntwrx-contact-cta__photo img { width: 100%; height: 100%; object-fit: cover; }
.m-client-ntwrx-contact-cta__tex { position: absolute; inset: 0; background: radial-gradient(ellipse at 20% 30%, rgba(255, 255, 255, .05), transparent 60%), radial-gradient(ellipse at 60% 90%, rgba(251, 176, 64, .08), transparent 50%); pointer-events: none; }
.m-client-ntwrx-contact-cta__line { position: absolute; height: 1.5px; background: var(--t-brand); transform-origin: left center; pointer-events: none; box-shadow: 0 0 8px rgba(251, 176, 64, .6); animation: m-client-ntwrx-contact-cta-neon 4s ease-in-out infinite; transition: transform 1.2s cubic-bezier(.6, 0, .3, 1); }
.m-client-ntwrx-contact-cta__l1 { left: 38%; bottom: 4%; width: 32%; transform: rotate(-34deg) scaleX(1); }
.m-client-ntwrx-contact-cta__l2 { left: 52%; bottom: -2%; width: 20%; transform: rotate(-58deg) scaleX(1); transition-delay: .3s; animation-delay: -2s; }
.m-js .m-client-ntwrx-contact-cta:not(.is-seen) .m-client-ntwrx-contact-cta__l1 { transform: rotate(-34deg) scaleX(0); }
.m-js .m-client-ntwrx-contact-cta:not(.is-seen) .m-client-ntwrx-contact-cta__l2 { transform: rotate(-58deg) scaleX(0); }
@keyframes m-client-ntwrx-contact-cta-neon { 0%, 100% { opacity: .75; box-shadow: 0 0 3px rgba(251, 176, 64, .5), 0 0 8px rgba(251, 176, 64, .25); } 50% { opacity: 1; box-shadow: 0 0 6px #FBB040, 0 0 18px rgba(251, 176, 64, .75), 0 0 40px rgba(251, 176, 64, .4), 0 0 70px rgba(251, 176, 64, .18); } }
.m-client-ntwrx-contact-cta__copy { display: flex; flex-direction: column; gap: 20px; max-width: 560px; padding: var(--m-pt, clamp(56px, 6vw, 88px)) 0 var(--m-pb, clamp(56px, 6vw, 88px)); }
.m-client-ntwrx-contact-cta__copy :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 88%; font-size: clamp(32px, 3.4vw, 52px); line-height: .95; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-contact-cta__copy p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--t-on-dark-2); }
.m-client-ntwrx-contact-cta__btn { width: fit-content; }
/* Torn bottom edge, in the colour of the paper footer below (decorative). */
.m-client-ntwrx-contact-cta__edge { position: absolute; left: 0; right: 0; bottom: -1px; height: 22px; background: var(--t-paper); z-index: 2; pointer-events: none; clip-path: polygon(0.00% 1.99%,2.50% 2.37%,5.00% 10.63%,7.50% 10.34%,10.00% 6.00%,12.50% 19.20%,15.00% 3.76%,17.50% 1.57%,20.00% 0.05%,22.50% 25.07%,25.00% 26.08%,27.50% 1.33%,30.00% 23.04%,32.50% 9.55%,35.00% 12.07%,37.50% 27.25%,40.00% 23.90%,42.50% 0.35%,45.00% 29.80%,47.50% 6.16%,50.00% 19.29%,52.50% 12.83%,55.00% 1.00%,57.50% 5.18%,60.00% 22.66%,62.50% 22.62%,65.00% 7.47%,67.50% 25.73%,70.00% 24.40%,72.50% 9.54%,75.00% 13.78%,77.50% 8.97%,80.00% 7.60%,82.50% 26.45%,85.00% 26.10%,87.50% 20.35%,90.00% 14.95%,92.50% 26.00%,95.00% 24.59%,97.50% 24.39%,100.00% 22.82%,100% 2.50%,100% 5.00%,100% 7.50%,100% 10.00%,100% 12.50%,100% 15.00%,100% 17.50%,100% 20.00%,100% 22.50%,100% 25.00%,100% 27.50%,100% 30.00%,100% 32.50%,100% 35.00%,100% 37.50%,100% 40.00%,100% 42.50%,100% 45.00%,100% 47.50%,100% 50.00%,100% 52.50%,100% 55.00%,100% 57.50%,100% 60.00%,100% 62.50%,100% 65.00%,100% 67.50%,100% 70.00%,100% 72.50%,100% 75.00%,100% 77.50%,100% 80.00%,100% 82.50%,100% 85.00%,100% 87.50%,100% 90.00%,100% 92.50%,100% 95.00%,100% 97.50%,100% 100.00%,97.50% 100%,95.00% 100%,92.50% 100%,90.00% 100%,87.50% 100%,85.00% 100%,82.50% 100%,80.00% 100%,77.50% 100%,75.00% 100%,72.50% 100%,70.00% 100%,67.50% 100%,65.00% 100%,62.50% 100%,60.00% 100%,57.50% 100%,55.00% 100%,52.50% 100%,50.00% 100%,47.50% 100%,45.00% 100%,42.50% 100%,40.00% 100%,37.50% 100%,35.00% 100%,32.50% 100%,30.00% 100%,27.50% 100%,25.00% 100%,22.50% 100%,20.00% 100%,17.50% 100%,15.00% 100%,12.50% 100%,10.00% 100%,7.50% 100%,5.00% 100%,2.50% 100%,0.00% 100%,0% 97.50%,0% 95.00%,0% 92.50%,0% 90.00%,0% 87.50%,0% 85.00%,0% 82.50%,0% 80.00%,0% 77.50%,0% 75.00%,0% 72.50%,0% 70.00%,0% 67.50%,0% 65.00%,0% 62.50%,0% 60.00%,0% 57.50%,0% 55.00%,0% 52.50%,0% 50.00%,0% 47.50%,0% 45.00%,0% 42.50%,0% 40.00%,0% 37.50%,0% 35.00%,0% 32.50%,0% 30.00%,0% 27.50%,0% 25.00%,0% 22.50%,0% 20.00%,0% 17.50%,0% 15.00%,0% 12.50%,0% 10.00%,0% 7.50%,0% 5.00%,0% 2.50%); }
@media (max-width: 820px) {
  .m-client-ntwrx-contact-cta__photo { width: 100%; opacity: var(--phone-opacity, .35); clip-path: none; }
}

/* client.ntwrx.contact-hero v1 */
/* NTWRX contact hero: heading, intro and photo beside contact cards and the
   office clock. Ported rule by rule from the original contact page (.ch). */
.m-client-ntwrx-contact-hero { overflow: hidden; }
.m-client-ntwrx-contact-hero > .m__inner { padding: var(--m-pt, clamp(56px, 6vw, 96px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-contact-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 88px); align-items: start; }
/* The original's section clips overflow, so its sticky copy never actually
   sticks; Chrome just places it 120px below the start of the section's padded
   content, which pushes it down until it meets the bottom of the grid. The
   padding here sits on .m__inner, so the same offset is added back. */
.m-client-ntwrx-contact-hero__copy { display: flex; flex-direction: column; gap: 28px; position: sticky; top: calc(120px + var(--m-pt, clamp(56px, 6vw, 96px))); }
.m-client-ntwrx-contact-hero__h { font-size: clamp(56px, 6.2vw, 92px); }
.m-client-ntwrx-contact-hero__ln { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.m-client-ntwrx-contact-hero__ln > span { display: block; white-space: nowrap; transition: transform 1s cubic-bezier(.2, .7, .2, 1) .1s; }
.m-client-ntwrx-contact-hero__ln:nth-child(2) > span { transition-delay: .2s; }
.m-js .m-client-ntwrx-contact-hero__copy:not(.is-in) .m-client-ntwrx-contact-hero__ln > span { transform: translateY(105%); }
.m-client-ntwrx-contact-hero__sub { margin: 0; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.65; color: var(--t-text-2); max-width: 30em; }

.m-client-ntwrx-contact-hero__photo { position: relative; height: clamp(220px, 20vw, 300px); margin-top: 12px; }
.m-client-ntwrx-contact-hero__cp1 { position: absolute; left: 0; top: 0; width: 78%; height: 100%; animation: site-ntwrx-float-a 8s ease-in-out infinite; }
.m-client-ntwrx-contact-hero__cp1 .t-frame-img { clip-path: polygon(0 8%, 30% 8%, 30.6% 0, 100% 0, 100% 92%, 94% 100%, 0 100%); }
.m-client-ntwrx-contact-hero__cp1 .t-s1 { right: -3%; top: -6%; width: 30%; height: 40%; transform: rotate(2.5deg); }
.m-client-ntwrx-contact-hero__amber { position: absolute; right: 6%; bottom: -8%; width: 24%; height: 46%; background: var(--t-brand); animation: site-ntwrx-float-c 7s ease-in-out -2s infinite; }

.m-client-ntwrx-contact-hero__list { display: flex; flex-direction: column; gap: 16px; }
.m-client-ntwrx-contact-hero__cc { position: relative; background: var(--t-card); box-shadow: 0 14px 34px rgba(0, 0, 0, .07); padding: clamp(22px, 2.4vw, 32px); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 18px; align-items: end; overflow: hidden; transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s; }
.m-client-ntwrx-contact-hero__cc::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--t-brand); transition: width .45s cubic-bezier(.2, .7, .2, 1); z-index: 0; }
.m-client-ntwrx-contact-hero__cc:hover { transform: translateX(6px); box-shadow: 0 20px 44px rgba(0, 0, 0, .12); }
.m-client-ntwrx-contact-hero__cc:hover::before { width: 6px; }
.m-client-ntwrx-contact-hero__cc > * { position: relative; z-index: 1; }
.m-client-ntwrx-contact-hero__k { grid-column: 1 / -1; font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--t-brand-text); }
.m-client-ntwrx-contact-hero__v { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(30px, 3.4vw, 54px); line-height: .95; text-transform: uppercase; color: var(--t-ink); overflow-wrap: anywhere; min-width: 0; }
.m-client-ntwrx-contact-hero__v--a:hover { color: var(--t-brand-text); }
.m-client-ntwrx-contact-hero__v--lc { text-transform: none; font-stretch: 85%; }
.m-client-ntwrx-contact-hero__note { grid-column: 1 / -1; margin: 0; font-size: 14px; line-height: 1.5; color: #555; }
.m-client-ntwrx-contact-hero__cpy { all: unset; box-sizing: border-box; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border: 1.5px solid var(--t-ink); font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--t-ink); transition: background .25s, border-color .25s; }
.m-client-ntwrx-contact-hero__cpy:hover { background: var(--t-brand); border-color: var(--t-brand); }
.m-client-ntwrx-contact-hero__cpy:focus-visible { outline: 2px solid var(--t-brand); outline-offset: 2px; }
.m-client-ntwrx-contact-hero__d { display: none; }
.m-client-ntwrx-contact-hero__cpy.is-done { background: var(--t-ink); border-color: var(--t-ink); color: var(--t-brand); }
.m-client-ntwrx-contact-hero__cpy.is-done .m-client-ntwrx-contact-hero__c { display: none; }
.m-client-ntwrx-contact-hero__cpy.is-done .m-client-ntwrx-contact-hero__d { display: inline; }

/* The dark card with the office clock. */
.m-client-ntwrx-contact-hero__cc--dark { background: var(--t-dark-3); color: var(--t-on-dark); }
.m-client-ntwrx-contact-hero__clock { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 18px; align-items: end; }
.m-client-ntwrx-contact-hero__ck-l { grid-column: 1 / -1; font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--t-brand); }
.m-client-ntwrx-contact-hero__ck-t { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(40px, 4.4vw, 68px); line-height: .9; font-variant-numeric: tabular-nums; color: var(--t-on-dark); }
.m-client-ntwrx-contact-hero__ck-s { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--t-on-dark-2); grid-column: 1 / -1; }
.m-client-ntwrx-contact-hero__ck-s i { width: 9px; height: 9px; border-radius: 50%; background: #777; flex: none; }
.m-client-ntwrx-contact-hero__clock.is-open .m-client-ntwrx-contact-hero__ck-s i { background: var(--t-brand); box-shadow: 0 0 0 0 rgba(251, 176, 64, .6); animation: m-client-ntwrx-contact-hero-dot 2s ease-out infinite; }
@keyframes m-client-ntwrx-contact-hero-dot { to { box-shadow: 0 0 0 10px rgba(251, 176, 64, 0); } }

@media (max-width: 1000px) {
  .m-client-ntwrx-contact-hero__h { font-size: clamp(56px, 12vw, 140px); }
  .m-client-ntwrx-contact-hero__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-contact-hero__copy { position: static; }
  .m-client-ntwrx-contact-hero__ln > span { white-space: normal; }
}

/* client.ntwrx.contact-location v1 */
/* NTWRX location: copy and call button beside an angled map panel with a
   pulsing pin. Ported rule by rule from the original contact page (.loc).
   The copy column lines up with the page width on its own, so there is no
   t-wrap here. */
.m-client-ntwrx-contact-location { background: var(--t-dark-2); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-contact-location > .m__inner { padding: var(--m-pt, 0px) 0 var(--m-pb, 0px); }
.m-client-ntwrx-contact-location__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); min-height: clamp(420px, 40vw, 560px); }
.m-client-ntwrx-contact-location__copy { padding: clamp(56px, 7vw, 110px) clamp(20px, 4vw, 56px); display: flex; flex-direction: column; justify-content: center; gap: 22px; max-width: 620px; margin-left: auto; width: 100%; }
.m-client-ntwrx-contact-location__copy :is(h1,h2,h3,h4,h5,h6) { font-size: clamp(48px, 6vw, 104px); color: var(--t-on-dark); }
.m-client-ntwrx-contact-location__copy p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--t-on-dark-2); max-width: 28em; }
.m-client-ntwrx-contact-location__coords { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .14em; color: var(--t-brand); }
.m-client-ntwrx-contact-location__ctas { display: flex; gap: 14px; flex-wrap: wrap; }
.m-client-ntwrx-contact-location__map { position: relative; overflow: hidden; background: #2A2A28; clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%); }
.m-client-ntwrx-contact-location__map img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .85; }
.m-client-ntwrx-contact-location__pin { position: absolute; left: 56%; top: 48%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--t-brand); box-shadow: 0 0 0 0 rgba(251, 176, 64, .6); animation: m-client-ntwrx-contact-location-pulse 2.4s ease-out infinite; pointer-events: none; }
.m-client-ntwrx-contact-location__pin::after { content: ''; position: absolute; inset: -22px; border: 1.5px solid rgba(251, 176, 64, .6); border-radius: 50%; animation: m-client-ntwrx-contact-location-ring 2.4s ease-out infinite; }
@keyframes m-client-ntwrx-contact-location-pulse { to { box-shadow: 0 0 0 18px rgba(251, 176, 64, 0); } }
@keyframes m-client-ntwrx-contact-location-ring { from { transform: scale(.4); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }
@media (max-width: 900px) {
  .m-client-ntwrx-contact-location__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-contact-location__copy { margin: 0; max-width: none; }
  .m-client-ntwrx-contact-location__map { min-height: 320px; clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%); }
}

/* client.ntwrx.contact-next v1 */
/* NTWRX what happens next: numbered steps along a line that draws across when
   the steps come into view. Ported rule by rule from the original contact
   page (.nx). The steps sit dim and the line empty only while the page script
   runs; without it everything shows in its final state. */
.m-client-ntwrx-contact-next { background: var(--t-dark-3); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-contact-next > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-contact-next__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-contact-next .t-sec-row :is(h1,h2,h3,h4,h5,h6) { color: var(--t-on-dark); }
.m-client-ntwrx-contact-next .t-sec-row p { color: var(--t-on-dark-2); }
.m-client-ntwrx-contact-next__track { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: clamp(20px, 3vw, 48px); padding-top: 44px; }
.m-js .m-client-ntwrx-contact-next__track[data-reveal]:not(.is-in) { opacity: 1; transform: none; }
.m-client-ntwrx-contact-next__line { position: absolute; left: 0; right: 0; top: 10px; height: 2px; background: #333; }
.m-client-ntwrx-contact-next__line i { position: absolute; inset: 0; background: var(--t-brand); transform-origin: left; transition: transform 1.8s cubic-bezier(.6, 0, .3, 1) .2s; box-shadow: 0 0 12px rgba(251, 176, 64, .7); }
.m-client-ntwrx-contact-next__step { position: relative; display: flex; flex-direction: column; gap: 12px; transition: opacity .6s; }
.m-client-ntwrx-contact-next__step::before { content: ''; box-sizing: content-box; position: absolute; left: 0; top: -41px; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--t-brand); background: var(--t-brand); box-shadow: 0 0 0 6px rgba(251, 176, 64, .15); transition: border-color .4s, background .4s, box-shadow .4s; }
.m-client-ntwrx-contact-next__step:nth-child(3), .m-client-ntwrx-contact-next__step:nth-child(3)::before { transition-delay: .6s; }
.m-client-ntwrx-contact-next__step:nth-child(4), .m-client-ntwrx-contact-next__step:nth-child(4)::before { transition-delay: 1.2s; }
.m-client-ntwrx-contact-next__step:nth-child(5), .m-client-ntwrx-contact-next__step:nth-child(5)::before { transition-delay: 1.8s; }
.m-js .m-client-ntwrx-contact-next__track:not(.is-in) .m-client-ntwrx-contact-next__line i { transform: scaleX(0); }
.m-js .m-client-ntwrx-contact-next__track:not(.is-in) .m-client-ntwrx-contact-next__step { opacity: .25; }
.m-js .m-client-ntwrx-contact-next__track:not(.is-in) .m-client-ntwrx-contact-next__step::before { border-color: #555; background: var(--t-dark-3); box-shadow: none; }
.m-client-ntwrx-contact-next__k { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .14em; color: var(--t-brand); }
.m-client-ntwrx-contact-next__step :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(28px, 2.6vw, 40px); line-height: .95; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-contact-next__step p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--t-on-dark-2); max-width: 26em; }
@media (max-width: 900px) {
  .m-client-ntwrx-contact-next__track { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: 1fr; padding-top: 0; padding-left: 40px; gap: 32px; }
  .m-client-ntwrx-contact-next__line { left: 7px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; }
  .m-client-ntwrx-contact-next__line i { transform-origin: top; }
  .m-js .m-client-ntwrx-contact-next__track:not(.is-in) .m-client-ntwrx-contact-next__line i { transform: scaleY(0); }
  .m-client-ntwrx-contact-next__step::before { left: -40px; top: 4px; }
}

/* client.ntwrx.contact-people v1 */
/* NTWRX direct lines: a card per person with photo, role and contact rows.
   Ported rule by rule from the original contact page (.ppl). */
.m-client-ntwrx-contact-people > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-contact-people__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-contact-people__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: clamp(20px, 2.4vw, 32px); align-items: start; }
.m-client-ntwrx-contact-people__pc { display: flex; flex-direction: column; background: var(--t-card); box-shadow: 0 14px 34px rgba(0, 0, 0, .07); transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s; }
.m-client-ntwrx-contact-people__pc:hover { transform: translateY(-6px); box-shadow: 0 22px 44px rgba(0, 0, 0, .13); }
.m-client-ntwrx-contact-people__photo { aspect-ratio: 4 / 3; overflow: hidden; background: var(--t-photo-wait); flex: none; }
.m-client-ntwrx-contact-people__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-contact-people__pc:hover .m-client-ntwrx-contact-people__photo img { transform: scale(1.06); }
.m-client-ntwrx-contact-people__body { padding: 24px 24px 26px; display: flex; flex-direction: column; gap: 8px; }
.m-client-ntwrx-contact-people__body b { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: 28px; line-height: 1; text-transform: uppercase; }
.m-client-ntwrx-contact-people__r { font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--t-brand-text); }
.m-client-ntwrx-contact-people__links { display: flex; flex-direction: column; border-top: 1px solid var(--t-line); margin-top: 12px; }
.m-client-ntwrx-contact-people__row { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--t-line-2); font-size: 15px; font-weight: 600; color: var(--t-ink); transition: padding .3s, color .3s; }
.m-client-ntwrx-contact-people__row:hover { padding-left: 8px; color: var(--t-brand-text); }
.m-client-ntwrx-contact-people__t { font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: #555; font-weight: 400; }

/* client.ntwrx.contact-route v1 */
/* NTWRX ways in: heading row and big numbered cards that open a prefilled
   email. Ported rule by rule from the original contact page (.route). */
.m-client-ntwrx-contact-route { background: var(--t-paper-2); }
.m-client-ntwrx-contact-route > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-contact-route__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-contact-route__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: clamp(20px, 2.4vw, 32px); align-items: stretch; }
.m-client-ntwrx-contact-route__rt { position: relative; display: flex; flex-direction: column; gap: 16px; padding: clamp(28px, 3vw, 44px); background: var(--t-card); box-shadow: 0 14px 34px rgba(0, 0, 0, .07); color: var(--t-ink); overflow: hidden; transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s; }
.m-client-ntwrx-contact-route__rt:hover { transform: translateY(-6px); box-shadow: 0 22px 44px rgba(0, 0, 0, .13); color: var(--t-ink); }
.m-client-ntwrx-contact-route__big { position: absolute; right: -6px; bottom: -26px; font-family: var(--t-font-display); font-weight: 900; font-stretch: 72%; font-size: clamp(130px, 13vw, 200px); line-height: 1; color: #F0EEE8; pointer-events: none; transition: color .45s; }
.m-client-ntwrx-contact-route__rt:hover .m-client-ntwrx-contact-route__big { color: var(--t-brand); }
.m-client-ntwrx-contact-route__rt > :not(.m-client-ntwrx-contact-route__big) { position: relative; z-index: 1; }
.m-client-ntwrx-contact-route__k { font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--t-brand-text); }
.m-client-ntwrx-contact-route__rt :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(32px, 3vw, 48px); line-height: .95; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-contact-route__rt p { margin: 0; font-size: 16px; line-height: 1.6; color: var(--t-text-2); max-width: 28em; }
.m-client-ntwrx-contact-route__go { margin-top: auto; align-self: flex-start; }

/* client.ntwrx.footer v1 */
/* NTWRX footer, on paper. */
.m-client-ntwrx-footer { background: var(--f-colour, var(--t-paper)); color: var(--t-ink); }
.m-client-ntwrx-footer > .m__inner { padding: var(--m-pt, clamp(48px, 5vw, 72px)) 0 var(--m-pb, 32px); }
.m-client-ntwrx-footer__top { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 40px; }
.m-client-ntwrx-footer__brand { display: flex; flex-direction: column; gap: 16px; }
.m-client-ntwrx-footer__logo img { height: 34px; width: auto; max-width: 180px; object-fit: contain; }
.m-client-ntwrx-footer__tag { font-size: 15px; line-height: 1.5; color: var(--t-text-2); max-width: 30ch; }
.m-client-ntwrx-footer__cols { display: flex; gap: clamp(32px, 5vw, 72px); flex-wrap: wrap; font-size: 15px; line-height: 1.9; }
.m-client-ntwrx-footer__col { display: flex; flex-direction: column; }
.m-client-ntwrx-footer__col .t-eyebrow { margin-bottom: 8px; font-size: 11px; }
.m-client-ntwrx-footer__menu, .m-client-ntwrx-footer__contact { display: flex; flex-direction: column; }
.m-client-ntwrx-footer__bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; border-top: 1px solid #D2D0CA; margin-top: 48px; padding-top: 22px; font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #555555; }

/* Dark style */
.m-client-ntwrx-footer[data-surface="dark"] { background: var(--f-colour, var(--t-dark)); color: var(--t-on-dark); }
.m-client-ntwrx-footer[data-surface="dark"] .m-client-ntwrx-footer__tag { color: var(--t-on-dark-2); }
.m-client-ntwrx-footer[data-surface="dark"] .m-client-ntwrx-footer__bottom { border-top-color: rgba(244, 244, 242, .16); color: var(--t-on-dark-3); }

/* client.ntwrx.header v1 */
/* NTWRX header: logo, menu, button; a menu button on phones. Dark by default;
   the paper style is transparent over a light hero and frosts once scrolled. */
.m-client-ntwrx-header { position: sticky; top: 0; z-index: 50; color: var(--t-on-dark); background: var(--f-darkColour, var(--t-dark)); transition: background .35s, box-shadow .35s; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.m-client-ntwrx-header.is-scrolled { box-shadow: 0 1px 0 rgba(0, 0, 0, .08); }
.m-client-ntwrx-header__in { max-width: 1440px; margin: 0 auto; padding: 20px clamp(20px, 4vw, 56px); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.m-client-ntwrx-header__brand img { height: 30px; width: auto; max-width: 180px; object-fit: contain; }
.m-client-ntwrx-header__nav { display: flex; gap: clamp(20px, 3vw, 44px); font-size: 12px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.m-client-ntwrx-header__nav a { position: relative; padding: 6px 0; }
.m-client-ntwrx-header__nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: -4px; height: 2px; background: var(--t-brand); transform: scaleX(0); transition: transform .3s; }
.m-client-ntwrx-header__nav a:hover::after, .m-client-ntwrx-header__nav a.is-current::after { transform: scaleX(1); }
.m-client-ntwrx-header__nav a.is-current { color: var(--accent-text); }
.m-client-ntwrx-header__end { display: flex; align-items: center; gap: 12px; }
.m-client-ntwrx-header__cta { padding: 12px 16px; font-size: 12px; }
.m-client-ntwrx-header__burger { display: none; width: 46px; height: 46px; border: 1.5px solid var(--t-on-dark); border-radius: var(--t-radius); background: transparent; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 0; }
.m-client-ntwrx-header__burger span { display: block; width: 20px; height: 2px; background: var(--t-on-dark); transition: transform .3s, opacity .3s; }
.m-client-ntwrx-header__burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.m-client-ntwrx-header__burger.is-open span:nth-child(2) { opacity: 0; }
.m-client-ntwrx-header__burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.m-client-ntwrx-header__panel { display: none; flex-direction: column; max-height: 0; overflow: hidden; transition: max-height .45s ease; background: var(--f-darkColour, var(--t-dark)); padding: 0 clamp(20px, 4vw, 56px); }
.m-client-ntwrx-header__panel.is-open { max-height: 480px; border-top: 1px solid rgba(0, 0, 0, .1); }
.m-client-ntwrx-header__panel a { padding: 16px 0; border-bottom: 1px solid rgba(244, 244, 242, .12); font-family: var(--t-font-display); font-weight: 800; font-size: 18px; text-transform: uppercase; }
@media (max-width: 980px) {
  .m-client-ntwrx-header__nav, .m-client-ntwrx-header__cta { display: none; }
  .m-client-ntwrx-header__burger { display: flex; }
  .m-client-ntwrx-header__panel { display: flex; }
}

/* Paper style */
.m-client-ntwrx-header[data-surface="paper"] { color: var(--t-ink); background: rgba(242, 241, 237, 0); }
.m-client-ntwrx-header[data-surface="paper"].is-scrolled { background: color-mix(in srgb, var(--f-lightColour, var(--t-paper)) 92%, transparent); }
.m-client-ntwrx-header[data-surface="paper"] .m-client-ntwrx-header__burger { border-color: var(--t-ink); }
.m-client-ntwrx-header[data-surface="paper"] .m-client-ntwrx-header__burger span { background: var(--t-ink); }
.m-client-ntwrx-header[data-surface="paper"] .m-client-ntwrx-header__panel { background: var(--f-lightColour, var(--t-paper)); }
.m-client-ntwrx-header[data-surface="paper"] .m-client-ntwrx-header__panel a { border-bottom-color: rgba(0, 0, 0, .08); }

/* client.ntwrx.hero v1 */
/* NTWRX hero. Fills the first screen on the live site; drops to its content
   height in edit mode (MODULE_CONTRACT.md s6.4). */
.m-client-ntwrx-hero { background: var(--t-dark-2); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-hero > .m__inner { min-height: calc(100 * var(--m-vh) - 80px); display: flex; align-items: center; justify-content: center; padding: var(--m-pt, clamp(80px, 9vw, 130px)) 0 var(--m-pb, clamp(110px, 11vw, 160px)); }
.m-client-ntwrx-hero__bg { position: absolute; inset: 0; background-color: #2A2A28; }
.m-client-ntwrx-hero__bg video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.m-client-ntwrx-hero__shade { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 50% 42%, rgba(11, 11, 11, .25) 0%, rgba(11, 11, 11, .85) 72%), linear-gradient(180deg, rgba(11, 11, 11, 0) 55%, var(--t-dark-2) 100%); }
.m-client-ntwrx-hero__network { position: absolute; inset: 0; }
.m-client-ntwrx-hero__network canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }

.m-client-ntwrx-hero__content { position: relative; z-index: 1; width: min(1000px, 90%); display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(24px, 3vw, 38px); }
.m-client-ntwrx-hero__eyebrow { justify-content: center; }
.m-client-ntwrx-hero__eyebrow::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--t-brand); box-shadow: 0 0 12px var(--t-brand); }
.m-client-ntwrx-hero__logo { width: min(440px, 64vw); height: auto; transition: opacity 1s .1s, transform 1.2s cubic-bezier(.2, .7, .2, 1) .1s; }
.m-client-ntwrx-hero__h { font-size: clamp(min(32px, 7.8vw), 6vw, 96px); transition: opacity 1.1s .35s, transform 1.2s cubic-bezier(.2, .7, .2, 1) .35s; }
.m-js .m-client-ntwrx-hero__content:not(.is-in) .m-client-ntwrx-hero__logo { opacity: 0; transform: translateY(10px) scale(.98); }
.m-js .m-client-ntwrx-hero__content:not(.is-in) .m-client-ntwrx-hero__h { opacity: 0; transform: translateY(28px); }
.m-client-ntwrx-hero__sub { margin: 0; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.6; color: var(--t-on-dark-2); max-width: 36em; }
.m-client-ntwrx-hero__ctas { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; }
.m-client-ntwrx-hero__disc { display: flex; gap: 10px 22px; flex-wrap: wrap; justify-content: center; font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--t-on-dark-3); }
.m-client-ntwrx-hero__disc span { display: flex; align-items: center; gap: 22px; }
.m-client-ntwrx-hero__disc span + span::before { content: ''; width: 4px; height: 4px; background: var(--t-brand); transform: rotate(45deg); }

.m-client-ntwrx-hero__scroll { position: absolute; left: 50%; bottom: clamp(44px, 5vw, 64px); z-index: 2; transform: translateX(-50%); width: 1.5px; height: 44px; background: rgba(244, 244, 242, .2); overflow: hidden; pointer-events: none; }
.m-client-ntwrx-hero__scroll::after { content: ''; position: absolute; left: 0; top: -50%; width: 100%; height: 50%; background: var(--t-brand); animation: m-client-ntwrx-hero-cue 2.2s ease-in-out infinite; }
@keyframes m-client-ntwrx-hero-cue { to { top: 110%; } }

/* Torn bottom edge, in the colour of the paper sections below (decorative). */
.m-client-ntwrx-hero__edge { position: absolute; left: 0; right: 0; bottom: -1px; height: 26px; background: var(--t-paper); z-index: 2; pointer-events: none; clip-path: polygon(0 70%, 4% 40%, 7% 62%, 11% 30%, 15% 55%, 19% 38%, 23% 66%, 27% 34%, 31% 58%, 35% 28%, 39% 52%, 43% 40%, 47% 64%, 51% 32%, 55% 56%, 59% 36%, 63% 60%, 67% 30%, 71% 54%, 75% 42%, 79% 66%, 83% 34%, 87% 58%, 91% 38%, 95% 62%, 100% 40%, 100% 100%, 0 100%); }

/* client.ntwrx.industries v1 */
/* NTWRX industries list. The hover photo follows the mouse (behaviour.ts sets --mx and --my). */
.m-client-ntwrx-industries > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-industries__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-industries__list { position: relative; border-top: 1.5px solid var(--t-ink); --mx: 50%; --my: 50%; }
.m-client-ntwrx-industries__row { position: static; display: grid; grid-template-columns: 64px minmax(0, 1.2fr) minmax(0, 1fr) 40px; gap: clamp(14px, 2vw, 32px); align-items: center; padding: clamp(20px, 2.4vw, 32px) 0; border-bottom: 1px solid var(--t-line); color: var(--t-ink); transition: padding .4s; }
.m-client-ntwrx-industries__row:hover { padding-left: 14px; color: var(--t-ink); }
.m-client-ntwrx-industries__n { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .1em; color: var(--accent-text); }
.m-client-ntwrx-industries__row :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(30px, 3.8vw, 60px); line-height: .95; text-transform: uppercase; margin: 0; transition: color .3s; }
.m-client-ntwrx-industries__row:hover :is(h1,h2,h3,h4,h5,h6) { color: var(--accent-text); }
.m-client-ntwrx-industries__row p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--t-text-2); }
.m-client-ntwrx-industries__ar { font-size: 24px; justify-self: end; transition: transform .3s; }
.m-client-ntwrx-industries__row:hover .m-client-ntwrx-industries__ar { transform: translateX(6px); }
.m-client-ntwrx-industries__hov { position: absolute; left: 0; top: 0; width: clamp(200px, 20vw, 300px); aspect-ratio: 4 / 3; z-index: 5; pointer-events: none; opacity: 0; transform: translate(calc(var(--mx) + 24px), calc(var(--my) - 50%)) rotate(-3deg) scale(.9); transition: opacity .3s, transform .5s cubic-bezier(.2, .7, .2, 1); box-shadow: 0 20px 44px rgba(0, 0, 0, .25); overflow: hidden; background: var(--t-photo-wait); clip-path: polygon(0 6%, 100% 0, 100% 100%, 4% 100%); }
.m-client-ntwrx-industries__hov img { width: 100%; height: 100%; object-fit: cover; }
.m-client-ntwrx-industries__row:hover .m-client-ntwrx-industries__hov { opacity: 1; transform: translate(calc(var(--mx) + 24px), calc(var(--my) - 50%)) rotate(-3deg) scale(1); }
@media (max-width: 820px) {
  .m-client-ntwrx-industries__row { grid-template-columns: 44px minmax(0, 1fr) 28px; }
  .m-client-ntwrx-industries__row p { grid-area: 2 / 2; }
  .m-client-ntwrx-industries__hov { display: none; }
}
@media (hover: none) { .m-client-ntwrx-industries__hov { display: none; } }

/* client.ntwrx.industries-detail v1 */
/* NTWRX industry details: alternating rows of copy and a two-photo collage. */
.m-client-ntwrx-industries-detail > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-industries-detail__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 5vw, 88px); align-items: center; padding: clamp(48px, 5vw, 72px) 0; border-top: 1px solid var(--t-line); scroll-margin-top: 90px; }
.m-client-ntwrx-industries-detail__row:first-child { border-top: 0; }
.m-client-ntwrx-industries-detail__row:nth-child(2n) .m-client-ntwrx-industries-detail__media { order: 2; }
.m-client-ntwrx-industries-detail__media { position: relative; height: clamp(360px, 34vw, 480px); }
.m-client-ntwrx-industries-detail__m1 { position: absolute; left: 0; top: 0; width: 82%; height: 84%; animation: site-ntwrx-float-a 8s ease-in-out infinite; }
.m-client-ntwrx-industries-detail__m1 .t-frame-img { clip-path: polygon(0 0, 100% 0, 100% 92%, 94% 100%, 0 100%); }
.m-client-ntwrx-industries-detail__m1 .t-s1 { left: -3%; top: -4%; width: 32%; height: 30%; transform: rotate(-2deg); }
.m-client-ntwrx-industries-detail__m2 { position: absolute; right: 0; bottom: 0; width: 44%; height: 46%; z-index: 2; animation: site-ntwrx-float-c 7s ease-in-out -2.5s infinite; }
.m-client-ntwrx-industries-detail__m2 .t-frame-img { clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%, 0 12%); }
.m-client-ntwrx-industries-detail__m2 .t-s1 { right: -5%; bottom: -6%; width: 46%; height: 40%; transform: rotate(2deg); }
.m-client-ntwrx-industries-detail__copy { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-industries-detail__num { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(72px, 8vw, 128px); line-height: .8; color: transparent; -webkit-text-stroke: 1.5px #E0901A; }
.m-client-ntwrx-industries-detail__copy :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(34px, 3.6vw, 56px); line-height: .92; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-industries-detail__copy > p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--t-text-2); max-width: 32em; }
.m-client-ntwrx-industries-detail__k { font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-text); margin-bottom: 10px; display: block; }
.m-client-ntwrx-industries-detail__split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 22px; padding-top: 20px; border-top: 1.5px solid var(--t-ink); }
.m-client-ntwrx-industries-detail__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.m-client-ntwrx-industries-detail__chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 13px; font-weight: 500; line-height: 1.2; border: 1.5px solid var(--t-ink); background: var(--t-white); color: var(--t-ink); border-radius: var(--t-radius); }
.m-client-ntwrx-industries-detail__chip--sub { border-color: #C9C7C1; background: transparent; color: var(--t-text-2); }
.m-client-ntwrx-industries-detail__chip--em { border-color: var(--t-brand); background: #FFF6E6; }
.m-client-ntwrx-industries-detail__chip--em::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #E0901A; animation: m-client-ntwrx-industries-detail-pulse 2.4s ease-in-out infinite; }
@keyframes m-client-ntwrx-industries-detail-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(224, 144, 26, .5); } 50% { box-shadow: 0 0 0 5px rgba(224, 144, 26, 0); } }
@media (max-width: 900px) {
  .m-client-ntwrx-industries-detail__row { grid-template-columns: 1fr; }
  .m-client-ntwrx-industries-detail__row:nth-child(2n) .m-client-ntwrx-industries-detail__media { order: 0; }
  .m-client-ntwrx-industries-detail__media { height: 76vw; }
}

/* client.ntwrx.industries-hero v1 */
/* NTWRX industries hero: copy beside a three-photo collage. The heading lines
   slide up once the copy is revealed; with scripts off they are simply there. */
.m-client-ntwrx-industries-hero { overflow: hidden; }
.m-client-ntwrx-industries-hero > .m__inner { padding: var(--m-pt, clamp(28px, 4vw, 56px)) 0 var(--m-pb, clamp(56px, 6vw, 96px)); }
.m-client-ntwrx-industries-hero__grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
.m-client-ntwrx-industries-hero__copy { display: flex; flex-direction: column; gap: 28px; }
.m-client-ntwrx-industries-hero__h { font-size: clamp(44px, 5.4vw, 80px); }
.m-client-ntwrx-industries-hero__ln { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.m-client-ntwrx-industries-hero__ln span { display: block; white-space: nowrap; transition: transform 1s cubic-bezier(.2, .7, .2, 1); }
.m-js .m-client-ntwrx-industries-hero__copy:not(.is-in) .m-client-ntwrx-industries-hero__ln span { transform: translateY(105%); }
.m-client-ntwrx-industries-hero__body { margin: 0; font-size: 18px; line-height: 1.6; max-width: 30em; color: var(--t-text-2); }
.m-client-ntwrx-industries-hero__ctas { display: flex; gap: 28px; align-items: center; flex-wrap: wrap; }
.m-client-ntwrx-industries-hero__txt { display: inline-flex; align-items: center; gap: 14px; font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--t-ink); }
.m-client-ntwrx-industries-hero__play { width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid var(--t-ink); display: flex; align-items: center; justify-content: center; transition: background .25s, border-color .25s; }
.m-client-ntwrx-industries-hero__play::after { content: "→"; font-family: "Inter Tight", sans-serif; font-size: 14px; letter-spacing: 0; line-height: 1; color: var(--t-ink); }
.m-client-ntwrx-industries-hero__txt:hover .m-client-ntwrx-industries-hero__play { background: var(--t-brand); border-color: var(--t-brand); }

.m-client-ntwrx-industries-hero__nest { position: relative; height: clamp(420px, 42vw, 600px); }
.m-client-ntwrx-industries-hero__amber { position: absolute; right: -2%; bottom: 6%; width: 22%; height: 40%; background: var(--t-brand); z-index: 0; animation: site-ntwrx-float-c 8s ease-in-out -3s infinite; }
.m-client-ntwrx-industries-hero__n1 { position: absolute; inset: 0 0 0 6%; animation: site-ntwrx-float-a 9s ease-in-out infinite; }
.m-client-ntwrx-industries-hero__n1 .t-frame-img { clip-path: polygon(0 6%, 30% 6%, 30.6% 0, 100% 0, 100% 100%, 4% 100%, 0 92%); }
.m-client-ntwrx-industries-hero__n1 .t-s1 { right: -2%; top: -2.5%; width: 30%; height: 30%; transform: rotate(2deg); }
.m-client-ntwrx-industries-hero__n2 { position: absolute; left: 0; bottom: 8%; width: 56%; height: 56%; z-index: 2; animation: site-ntwrx-float-c 7s ease-in-out -2s infinite; }
.m-client-ntwrx-industries-hero__n2 .t-frame-img { clip-path: polygon(0 0, 92% 0, 100% 8%, 100% 100%, 0 100%); }
.m-client-ntwrx-industries-hero__n2 .t-s1 { left: -3%; top: -4%; width: 40%; height: 30%; transform: rotate(-2deg); }
.m-client-ntwrx-industries-hero__n3 { position: absolute; left: 30%; bottom: -2%; width: 30%; height: 34%; z-index: 3; animation: site-ntwrx-float-a 6s ease-in-out -4s infinite; }
.m-client-ntwrx-industries-hero__n3 .t-frame-img { clip-path: polygon(6% 0, 100% 0, 100% 100%, 0 100%, 0 10%); }
.m-client-ntwrx-industries-hero__n3 .t-s1 { right: -4%; bottom: -6%; width: 50%; height: 40%; transform: rotate(3deg); }
.m-client-ntwrx-industries-hero__lvl { position: absolute; z-index: 4; background: var(--t-ink); color: var(--t-on-dark); padding: 9px 12px; font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; display: flex; gap: 10px; white-space: nowrap; }
.m-client-ntwrx-industries-hero__lvl b { color: var(--t-brand); font-weight: 500; }
.m-client-ntwrx-industries-hero__lv1 { right: 4%; top: 8%; }
.m-client-ntwrx-industries-hero__lv2 { left: 2%; top: calc(36% - 18px); }
.m-client-ntwrx-industries-hero__lv3 { left: calc(30% + 8px); bottom: calc(32% + 2px); }

@media (max-width: 1100px) {
  .m-client-ntwrx-industries-hero__h { font-size: clamp(40px, 10vw, 96px); }
  .m-client-ntwrx-industries-hero__ln span { white-space: normal; }
  .m-client-ntwrx-industries-hero__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-industries-hero__nest { height: min(80vw, 600px); }
  .m-client-ntwrx-industries-hero__lvl { font-size: 10px; }
}

/* client.ntwrx.industries-overview v1 */
/* NTWRX industry panels. Pure CSS: the first panel is open; hovering or
   focusing another opens it and closes the first. On phones every panel is
   open and stacked. */
.m-client-ntwrx-industries-overview { background: var(--t-paper-2); }
.m-client-ntwrx-industries-overview > .m__inner { padding: var(--m-pt, clamp(64px, 7vw, 110px)) 0 var(--m-pb, clamp(64px, 7vw, 110px)); }
.m-client-ntwrx-industries-overview__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-industries-overview__row { display: flex; gap: 10px; height: clamp(460px, 40vw, 580px); }
.m-client-ntwrx-industries-overview__panel { position: relative; flex: 1 1 0%; min-width: 0; overflow: hidden; background: #2A2A28; color: var(--t-on-dark); transition: flex .7s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-industries-overview__panel:hover { color: var(--t-on-dark); }
.m-client-ntwrx-industries-overview__row:hover .m-client-ntwrx-industries-overview__panel,
.m-client-ntwrx-industries-overview__row:focus-within .m-client-ntwrx-industries-overview__panel { flex: 1 1 0%; }
.m-client-ntwrx-industries-overview__panel:first-child,
.m-client-ntwrx-industries-overview__row .m-client-ntwrx-industries-overview__panel:hover,
.m-client-ntwrx-industries-overview__row .m-client-ntwrx-industries-overview__panel:focus-within { flex: 3.2 1 0%; }
.m-client-ntwrx-industries-overview__row:hover .m-client-ntwrx-industries-overview__panel:first-child:not(:hover) { flex: 1 1 0%; }
.m-client-ntwrx-industries-overview__panel > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); transition: transform 1.4s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-industries-overview__panel:hover > img { transform: scale(1.02); }
.m-client-ntwrx-industries-overview__shade { position: absolute; inset: 0; background: linear-gradient(rgba(0, 0, 0, .15) 0%, rgba(0, 0, 0, .35) 40%, rgba(0, 0, 0, .88) 100%); pointer-events: none; }
.m-client-ntwrx-industries-overview__n { position: absolute; left: 22px; top: 22px; font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: 44px; line-height: 1; color: var(--t-brand); }
.m-client-ntwrx-industries-overview__v { position: absolute; left: 22px; bottom: 24px; writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: 26px; text-transform: uppercase; white-space: nowrap; transition: opacity .3s; }
.m-client-ntwrx-industries-overview__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px; display: flex; flex-direction: column; gap: 14px; opacity: 0; transform: translateY(16px); transition: opacity .4s, transform .5s; min-width: 340px; }
.m-client-ntwrx-industries-overview__body :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(30px, 2.8vw, 44px); line-height: .92; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-industries-overview__body p { margin: 0; font-size: 15px; line-height: 1.55; color: #E6E6E2; max-width: 28em; }
.m-client-ntwrx-industries-overview__more { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--t-brand); width: fit-content; border-bottom: 1.5px solid var(--t-brand); padding-bottom: 4px; }
.m-client-ntwrx-industries-overview__panel:first-child .m-client-ntwrx-industries-overview__body,
.m-client-ntwrx-industries-overview__panel:hover .m-client-ntwrx-industries-overview__body,
.m-client-ntwrx-industries-overview__panel:focus-within .m-client-ntwrx-industries-overview__body { opacity: 1; transform: none; transition-delay: .2s; }
.m-client-ntwrx-industries-overview__panel:first-child .m-client-ntwrx-industries-overview__v,
.m-client-ntwrx-industries-overview__panel:hover .m-client-ntwrx-industries-overview__v,
.m-client-ntwrx-industries-overview__panel:focus-within .m-client-ntwrx-industries-overview__v { opacity: 0; }
.m-client-ntwrx-industries-overview__row:hover .m-client-ntwrx-industries-overview__panel:first-child:not(:hover) .m-client-ntwrx-industries-overview__body { opacity: 0; transform: translateY(16px); transition-delay: 0s; }
.m-client-ntwrx-industries-overview__row:hover .m-client-ntwrx-industries-overview__panel:first-child:not(:hover) .m-client-ntwrx-industries-overview__v { opacity: 1; }
@media (max-width: 900px) {
  .m-client-ntwrx-industries-overview__row { flex-direction: column; height: auto; }
  .m-client-ntwrx-industries-overview__panel { height: 360px; flex: 0 0 auto !important; }
  .m-client-ntwrx-industries-overview__body { min-width: 0; opacity: 1 !important; transform: none !important; }
  .m-client-ntwrx-industries-overview__v { opacity: 0 !important; }
}

/* client.ntwrx.industries-roles v1 */
/* NTWRX changing roles: a timeline of stages on a dark band. The gold line
   and the stage dots are drawn complete unless script is running, when they
   start empty and fill in once the band is seen (behaviour.ts adds .is-seen). */
.m-client-ntwrx-industries-roles { background: var(--t-dark-3); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-industries-roles > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-industries-roles__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-industries-roles .t-sec-row p { color: var(--t-on-dark-2); }
.m-client-ntwrx-industries-roles__track { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); padding-top: 44px; }
.m-client-ntwrx-industries-roles__line { position: absolute; left: 0; right: 0; top: 9px; height: 2px; background: #333333; }
.m-client-ntwrx-industries-roles__line span { position: absolute; inset: 0; background: var(--t-brand); transform-origin: left center; transition: transform 2.2s cubic-bezier(.6, 0, .3, 1) .2s; box-shadow: 0 0 10px rgba(251, 176, 64, .6); }
.m-js .m-client-ntwrx-industries-roles:not(.is-seen) .m-client-ntwrx-industries-roles__line span { transform: scaleX(0); }
.m-client-ntwrx-industries-roles__stage { position: relative; display: flex; flex-direction: column; gap: 14px; }
.m-client-ntwrx-industries-roles__stage::before { content: ""; position: absolute; top: -44px; left: 0; box-sizing: content-box; width: 20px; height: 20px; border-radius: 50%; background: var(--t-brand); border: 2px solid var(--t-brand); transition: border-color .4s, background .4s; transition-delay: var(--stage-delay, 0s); }
.m-client-ntwrx-industries-roles__stage:last-of-type::before { background: var(--t-dark-3); box-shadow: 0 0 0 6px rgba(251, 176, 64, .15); }
.m-js .m-client-ntwrx-industries-roles:not(.is-seen) .m-client-ntwrx-industries-roles__stage::before { border-color: #555555; background: var(--t-dark-3); box-shadow: none; }
.m-client-ntwrx-industries-roles__k { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--t-brand); }
.m-client-ntwrx-industries-roles__stage :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(28px, 2.6vw, 40px); text-transform: uppercase; margin: 0; line-height: .95; }
.m-client-ntwrx-industries-roles__stage p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--t-on-dark-2); }
.m-client-ntwrx-industries-roles__stage ul { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; border-top: 1px solid #333333; }
.m-client-ntwrx-industries-roles__stage li { padding: 12px 0; border-bottom: 1px solid #333333; font-size: 15px; font-weight: 500; display: flex; justify-content: space-between; gap: 12px; }
.m-client-ntwrx-industries-roles__tag { font-family: var(--t-font-mono); font-size: 11px; color: var(--t-on-dark-3); letter-spacing: .1em; text-transform: uppercase; }
/* A lone stage on the last row sits in the middle column (three columns wide). */
@media (min-width: 821px) {
  .m-client-ntwrx-industries-roles__stage:last-of-type:nth-of-type(3n + 1):not(:first-of-type) { grid-column: 2 / span 1; }
}
@media (max-width: 820px) {
  .m-client-ntwrx-industries-roles__track { grid-template-columns: 1fr; padding-top: 0; padding-left: 40px; }
  .m-client-ntwrx-industries-roles__line { left: 9px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; }
  .m-client-ntwrx-industries-roles__line span { transform-origin: center top; }
  .m-js .m-client-ntwrx-industries-roles:not(.is-seen) .m-client-ntwrx-industries-roles__line span { transform: scaleY(0); }
  .m-client-ntwrx-industries-roles__stage::before { top: 0; left: -40px; }
}

/* client.ntwrx.partner v1 */
/* NTWRX ways to partner: heading row and photo cards. */
.m-client-ntwrx-partner { background: var(--t-paper-2); }
.m-client-ntwrx-partner > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-partner__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-partner__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: clamp(20px, 2.4vw, 32px); align-items: start; }
.m-client-ntwrx-partner__card { background: var(--t-card); box-shadow: 0 14px 34px rgba(0, 0, 0, .07); display: flex; flex-direction: column; transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s, opacity .9s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-partner__card:hover { transform: translateY(-6px); box-shadow: 0 22px 44px rgba(0, 0, 0, .13); }
.m-client-ntwrx-partner__photo { position: relative; aspect-ratio: 16 / 11; overflow: hidden; background: var(--t-photo-wait); flex: 0 0 auto; clip-path: polygon(0 0, 100% 0, 100% 90%, 90% 100%, 0 100%); }
.m-client-ntwrx-partner__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-partner__card:hover .m-client-ntwrx-partner__photo img { transform: scale(1.06); }
.m-client-ntwrx-partner__n { position: absolute; right: 16px; bottom: 10px; z-index: 2; font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: 54px; line-height: 1; color: var(--t-brand); text-shadow: 0 2px 14px rgba(0, 0, 0, .35); pointer-events: none; }
.m-client-ntwrx-partner__body { padding: 26px 26px 28px; display: flex; flex-direction: column; gap: 12px; }
.m-client-ntwrx-partner__body :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(28px, 2.4vw, 36px); line-height: .95; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-partner__tag { font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-text); }
.m-client-ntwrx-partner__body p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--t-text-2); }
.m-client-ntwrx-partner__body ul { list-style: none; margin: 6px 0 0; padding: 0; border-top: 1px solid var(--t-line); }
.m-client-ntwrx-partner__body li { padding: 10px 0; border-bottom: 1px solid var(--t-line-2); font-size: 14px; font-weight: 500; display: flex; gap: 10px; align-items: center; }
.m-client-ntwrx-partner__body li::before { content: ''; width: 6px; height: 6px; background: var(--t-brand); transform: rotate(45deg); flex: 0 0 auto; }
.m-client-ntwrx-partner__more { margin-top: 36px; }

/* client.ntwrx.solutions-compare v1 */
/* NTWRX compare models: a table of row names and one column per model. */
.m-client-ntwrx-solutions-compare > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-solutions-compare__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-solutions-compare__grid { display: grid; grid-template-columns: minmax(140px, .7fr) repeat(var(--cols, 3), minmax(0, 1fr)); align-items: stretch; border-top: 1.5px solid var(--t-ink); }
.m-client-ntwrx-solutions-compare__keys { display: grid; grid-template-rows: 96px repeat(var(--rows, 4), minmax(78px, auto)) 72px; }
.m-client-ntwrx-solutions-compare__keys span { display: flex; align-items: center; border-bottom: 1px solid var(--t-line); font-family: var(--t-font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #555555; }
.m-client-ntwrx-solutions-compare__keys span:first-child, .m-client-ntwrx-solutions-compare__keys span:last-child { border-bottom: 0; }
.m-client-ntwrx-solutions-compare__col { display: grid; grid-template-rows: 96px repeat(var(--rows, 4), minmax(78px, auto)) 72px; padding: 0 clamp(12px, 1.6vw, 24px); transition: background .35s, box-shadow .35s, transform .35s; position: relative; }
.m-client-ntwrx-solutions-compare__col::before { content: ''; position: absolute; left: 0; right: 0; top: -1.5px; height: 4px; background: var(--t-brand); transform: scaleX(0); transform-origin: left center; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-solutions-compare__col:hover { background: var(--t-card); box-shadow: 0 18px 40px rgba(0, 0, 0, .1); transform: translateY(-6px); }
.m-client-ntwrx-solutions-compare__col:hover::before { transform: scaleX(1); }
.m-client-ntwrx-solutions-compare__col :is(h1,h2,h3,h4,h5,h6) { align-self: center; font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(22px, 2.2vw, 32px); line-height: .95; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-solutions-compare__c { display: flex; align-items: center; border-bottom: 1px solid var(--t-line); font-size: 15px; line-height: 1.45; font-weight: 500; color: #1E1E1E; }
.m-client-ntwrx-solutions-compare__k { display: none; }
.m-client-ntwrx-solutions-compare__go { align-self: center; }

@media (max-width: 900px) {
  .m-client-ntwrx-solutions-compare__grid { grid-template-columns: 1fr; border-top: 0; gap: 18px; }
  .m-client-ntwrx-solutions-compare__keys { display: none; }
  .m-client-ntwrx-solutions-compare__col { grid-template-rows: auto; background: var(--t-card); box-shadow: 0 10px 26px rgba(0, 0, 0, .07); padding: 22px; gap: 4px; }
  .m-client-ntwrx-solutions-compare__col :is(h1,h2,h3,h4,h5,h6) { margin-bottom: 8px; }
  .m-client-ntwrx-solutions-compare__c { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; padding: 10px 0; }
  .m-client-ntwrx-solutions-compare__k { display: block; font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: #555555; font-weight: 400; }
  .m-client-ntwrx-solutions-compare__go { margin-top: 12px; }
}

/* client.ntwrx.solutions-hero v1 */
/* NTWRX solutions opening: copy beside a fan of three photos. The heading lines
   rise in and the photos fan out once seen; fanned out is the resting state, so
   it reads the same without script. */
.m-client-ntwrx-solutions-hero { overflow: hidden; }
.m-client-ntwrx-solutions-hero > .m__inner { padding: var(--m-pt, clamp(56px, 6vw, 96px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-solutions-hero__grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.m-client-ntwrx-solutions-hero__copy { display: flex; flex-direction: column; gap: 28px; }
.m-client-ntwrx-solutions-hero__h { font-size: clamp(44px, 4.4vw, 64px); }
.m-client-ntwrx-solutions-hero__ln { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.m-client-ntwrx-solutions-hero__ln > span { display: block; white-space: nowrap; transition: transform 1s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(.1s + var(--i, 0) * .12s); }
.m-js .m-client-ntwrx-solutions-hero:not(.is-go) .m-client-ntwrx-solutions-hero__ln > span { transform: translateY(105%); }
.m-client-ntwrx-solutions-hero__sub { margin: 0; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.65; color: var(--t-text-2); max-width: 32em; }
.m-client-ntwrx-solutions-hero__ctas { display: flex; gap: 14px; flex-wrap: wrap; }
.m-client-ntwrx-solutions-hero__out { border: 1.5px solid var(--t-ink); color: var(--t-ink); }
.m-client-ntwrx-solutions-hero__out:hover { background: var(--t-ink); color: var(--t-white) !important; }

.m-client-ntwrx-solutions-hero__fan { position: relative; height: clamp(420px, 42vw, 600px); }
.m-client-ntwrx-solutions-hero__frame { position: absolute; top: 8%; left: 24%; width: 52%; height: 78%; transition: transform 1.3s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-solutions-hero__fa { z-index: 1; transform: translate(-44%, 6%) rotate(-7deg); }
.m-client-ntwrx-solutions-hero__fb { z-index: 2; transform: translate(0, -4%) rotate(0deg); }
.m-client-ntwrx-solutions-hero__fc { z-index: 3; transform: translate(44%, 8%) rotate(6deg); }
.m-js .m-client-ntwrx-solutions-hero:not(.is-go) .m-client-ntwrx-solutions-hero__fa { transform: rotate(-2deg); }
.m-js .m-client-ntwrx-solutions-hero:not(.is-go) .m-client-ntwrx-solutions-hero__fb { transform: rotate(1deg); }
.m-js .m-client-ntwrx-solutions-hero:not(.is-go) .m-client-ntwrx-solutions-hero__fc { transform: rotate(3deg); }
.m-client-ntwrx-solutions-hero__frame .t-frame-img { clip-path: polygon(0 4%, 100% 0, 100% 96%, 0 100%); }
.m-client-ntwrx-solutions-hero__fb .t-frame-img { clip-path: polygon(0 0, 100% 3%, 98% 100%, 2% 97%); }
.m-client-ntwrx-solutions-hero__float { position: absolute; inset: 0; animation: site-ntwrx-float-a 8s ease-in-out infinite; }
.m-client-ntwrx-solutions-hero__fb .m-client-ntwrx-solutions-hero__float { animation-delay: -3s; }
.m-client-ntwrx-solutions-hero__fc .m-client-ntwrx-solutions-hero__float { animation-delay: -5s; }
.m-client-ntwrx-solutions-hero__amber { position: absolute; right: 2%; bottom: 0; width: 26%; height: 22%; background: var(--t-brand); animation: site-ntwrx-float-c 8s ease-in-out -2s infinite; }

@media (max-width: 1100px) {
  .m-client-ntwrx-solutions-hero__h { font-size: clamp(40px, 9vw, 88px); }
  .m-client-ntwrx-solutions-hero__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-solutions-hero__ln > span { white-space: normal; }
  .m-client-ntwrx-solutions-hero__fan { height: min(86vw, 560px); }
}

/* client.ntwrx.solutions-process v1 */
/* NTWRX how it works: steps along a line that draws in and lights each step in
   turn. Drawn and lit is the resting state, so it reads the same without script. */
.m-client-ntwrx-solutions-process { background: var(--t-dark-3); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-solutions-process > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-solutions-process__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-solutions-process .t-sec-row :is(h1,h2,h3,h4,h5,h6) { color: var(--t-on-dark); }
.m-client-ntwrx-solutions-process .t-sec-row p { color: var(--t-on-dark-2); }

.m-client-ntwrx-solutions-process__track { position: relative; display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); gap: clamp(16px, 2vw, 32px); padding-top: 44px; }
.m-client-ntwrx-solutions-process__line { position: absolute; left: 0; right: 0; top: 10px; height: 2px; background: #333333; }
.m-client-ntwrx-solutions-process__line i { position: absolute; inset: 0; background: var(--t-brand); transform-origin: left center; transition: transform 2.2s cubic-bezier(.6, 0, .3, 1) .2s; box-shadow: 0 0 12px rgba(251, 176, 64, .7); }
.m-js .m-client-ntwrx-solutions-process:not(.is-go) .m-client-ntwrx-solutions-process__line i { transform: scaleX(0); }
.m-client-ntwrx-solutions-process__step { position: relative; display: flex; flex-direction: column; gap: 12px; transition: opacity .6s; transition-delay: calc(var(--i, 0) * .4s); }
/* 20px outside: the original drew a 16px dot plus its 2px border. */
.m-client-ntwrx-solutions-process__step::before { content: ''; position: absolute; left: 0; top: -41px; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--t-brand); background: var(--t-brand); box-shadow: 0 0 0 6px rgba(251, 176, 64, .15); transition: border-color .4s, background .4s, box-shadow .4s; transition-delay: calc(var(--i, 0) * .4s); }
.m-js .m-client-ntwrx-solutions-process:not(.is-go) .m-client-ntwrx-solutions-process__step { opacity: .25; }
.m-js .m-client-ntwrx-solutions-process:not(.is-go) .m-client-ntwrx-solutions-process__step::before { border-color: #555555; background: var(--t-dark-3); box-shadow: none; }
.m-client-ntwrx-solutions-process__k { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .14em; color: var(--t-brand); }
.m-client-ntwrx-solutions-process__step :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(28px, 2.6vw, 40px); line-height: .95; text-transform: uppercase; margin: 0; }
.m-client-ntwrx-solutions-process__step p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--t-on-dark-2); }

@media (max-width: 900px) {
  .m-client-ntwrx-solutions-process__track { grid-template-columns: 1fr; padding-top: 0; padding-left: 40px; gap: 32px; }
  .m-client-ntwrx-solutions-process__line { inset: 0 auto 0 7px; width: 2px; height: auto; }
  .m-client-ntwrx-solutions-process__line i { transform-origin: center top; }
  .m-js .m-client-ntwrx-solutions-process:not(.is-go) .m-client-ntwrx-solutions-process__line i { transform: scaleY(0); }
  .m-client-ntwrx-solutions-process__step::before { left: -40px; top: 4px; }
}

/* client.ntwrx.solutions-scenarios v1 */
/* NTWRX scenarios: photo collage beside questions that open to show answers. */
.m-client-ntwrx-solutions-scenarios { overflow: hidden; }
.m-client-ntwrx-solutions-scenarios > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-solutions-scenarios__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(32px, 5vw, 88px); align-items: center; }

.m-client-ntwrx-solutions-scenarios__art { position: relative; height: clamp(420px, 40vw, 600px); }
.m-client-ntwrx-solutions-scenarios__pa { position: absolute; left: 0; top: 0; width: 80%; height: 84%; animation: site-ntwrx-float-a 8s ease-in-out infinite; }
.m-client-ntwrx-solutions-scenarios__pa .t-frame-img { clip-path: polygon(0 0, 74% 0, 74.6% 5%, 100% 5%, 100% 100%, 6% 100%, 0 93%); }
.m-client-ntwrx-solutions-scenarios__pa .t-s1 { left: -3%; top: -3%; width: 40%; height: 30%; transform: rotate(-2deg); }
.m-client-ntwrx-solutions-scenarios__pa .t-s2 { right: -3%; bottom: -4%; width: 36%; height: 24%; transform: rotate(2deg); }
.m-client-ntwrx-solutions-scenarios__amber { position: absolute; right: 0; bottom: 2%; width: 34%; height: 30%; background: var(--t-brand); animation: site-ntwrx-float-c 7s ease-in-out -1s infinite; }

.m-client-ntwrx-solutions-scenarios__copy { display: flex; flex-direction: column; gap: 28px; }
.m-client-ntwrx-solutions-scenarios__h { font-size: clamp(40px, 4.8vw, 76px); }
.m-client-ntwrx-solutions-scenarios__list { border-top: 1.5px solid var(--t-ink); }
.m-client-ntwrx-solutions-scenarios__acc { border-bottom: 1px solid var(--t-line); interpolate-size: allow-keywords; }
.m-client-ntwrx-solutions-scenarios__q { all: unset; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; gap: 20px; width: 100%; padding: 22px 0; font-family: var(--t-font-display); font-weight: 800; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.25; color: var(--t-ink); cursor: pointer; transition: color .3s; }
.m-client-ntwrx-solutions-scenarios__q::-webkit-details-marker { display: none; }
.m-client-ntwrx-solutions-scenarios__q:hover { color: var(--accent-text); }
.m-client-ntwrx-solutions-scenarios__q:focus-visible { outline: 2px solid var(--t-brand); outline-offset: 2px; }
.m-client-ntwrx-solutions-scenarios__q i { position: relative; flex: 0 0 auto; width: 34px; height: 34px; border: 1.5px solid var(--t-ink); border-radius: 50%; transition: background .3s, border-color .3s, transform .45s; }
.m-client-ntwrx-solutions-scenarios__q i::before, .m-client-ntwrx-solutions-scenarios__q i::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 1.5px; background: var(--t-ink); transform: translate(-50%, -50%); }
.m-client-ntwrx-solutions-scenarios__q i::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .45s; }
.m-client-ntwrx-solutions-scenarios__acc[open] .m-client-ntwrx-solutions-scenarios__q i { background: var(--t-brand); border-color: var(--t-brand); transform: rotate(180deg); }
.m-client-ntwrx-solutions-scenarios__acc[open] .m-client-ntwrx-solutions-scenarios__q i::after { transform: translate(-50%, -50%) rotate(0deg); }
/* The answer slides open where the browser can animate a details element. */
.m-client-ntwrx-solutions-scenarios__acc::details-content { height: 0; overflow: hidden; transition: height .5s cubic-bezier(.2, .7, .2, 1), content-visibility .5s allow-discrete; }
.m-client-ntwrx-solutions-scenarios__acc[open]::details-content { height: auto; }
.m-client-ntwrx-solutions-scenarios__a p { margin: 0; padding: 0 56px 24px 0; font-size: 16px; line-height: 1.65; color: var(--t-text-2); }

@media (max-width: 1000px) {
  .m-client-ntwrx-solutions-scenarios__grid { grid-template-columns: 1fr; }
  .m-client-ntwrx-solutions-scenarios__art { height: min(80vw, 520px); }
}

/* client.ntwrx.solutions-statement v1 */
/* NTWRX statement band: centred words over a dimmed, slowly drifting photo. */
.m-client-ntwrx-solutions-statement { background: var(--t-dark-2); color: var(--t-on-dark); overflow: hidden; text-align: center; }
.m-client-ntwrx-solutions-statement > .m__inner { position: static; padding: var(--m-pt, clamp(96px, 12vw, 180px)) 0 var(--m-pb, clamp(96px, 12vw, 180px)); }
.m-client-ntwrx-solutions-statement__bg { position: absolute; inset: -8% 0; background-color: #2A2A28; opacity: .45; animation: m-client-ntwrx-solutions-statement-kb 18s ease-in-out infinite alternate; }
.m-client-ntwrx-solutions-statement__bg img { width: 100%; height: 100%; object-fit: cover; }
@keyframes m-client-ntwrx-solutions-statement-kb { from { transform: scale(1.02); } to { transform: scale(1.1); } }
.m-client-ntwrx-solutions-statement__shade { position: absolute; inset: 0; background: radial-gradient(rgba(11, 11, 11, .2), rgba(11, 11, 11, .85) 75%); pointer-events: none; }
.m-client-ntwrx-solutions-statement__wrap { display: flex; flex-direction: column; align-items: center; gap: 24px; }
.m-client-ntwrx-solutions-statement__h { font-size: clamp(40px, 6vw, 104px); max-width: 14ch; }
.m-client-ntwrx-solutions-statement__wrap p { margin: 0; max-width: 34em; font-size: 17px; line-height: 1.6; color: var(--t-on-dark-2); }

/* client.ntwrx.solutions-tabs v1 */
/* NTWRX ways to partner: heading row, a numbered tab list and one panel at a time. */
.m-client-ntwrx-solutions-tabs { background: var(--t-paper-2); }
.m-client-ntwrx-solutions-tabs > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(72px, 8vw, 120px)); }
.m-client-ntwrx-solutions-tabs__head { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-solutions-tabs__layer { display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr); gap: clamp(24px, 4vw, 64px); align-items: start; }

.m-client-ntwrx-solutions-tabs__nav { display: flex; flex-direction: column; border-top: 1.5px solid var(--t-ink); }
.m-client-ntwrx-solutions-tabs__btn { all: unset; box-sizing: border-box; position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px; align-items: center; padding: 18px 14px 18px 0; border-bottom: 1px solid var(--t-line); color: #555555; cursor: pointer; transition: padding .35s, color .3s; }
.m-client-ntwrx-solutions-tabs__btn:focus-visible { outline: 2px solid var(--t-brand); outline-offset: 2px; }
.m-client-ntwrx-solutions-tabs__btn::after { content: ''; position: absolute; left: 0; bottom: -1px; height: 2px; width: 0; background: var(--t-brand); transition: width .5s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-solutions-tabs__n { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .1em; color: var(--accent-text); }
.m-client-ntwrx-solutions-tabs__l { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(20px, 1.8vw, 26px); text-transform: uppercase; line-height: 1; }
.m-client-ntwrx-solutions-tabs__btn:hover { color: var(--t-ink); padding-left: 6px; }
.m-client-ntwrx-solutions-tabs__btn.is-on { color: var(--t-ink); padding-left: 10px; }
.m-client-ntwrx-solutions-tabs__btn.is-on::after { width: 100%; }

.m-client-ntwrx-solutions-tabs__panels { position: relative; }
.m-client-ntwrx-solutions-tabs__panel { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(20px, 3vw, 40px); align-items: center; animation: m-client-ntwrx-solutions-tabs-in .7s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-solutions-tabs__panel[hidden] { display: none; }
@keyframes m-client-ntwrx-solutions-tabs-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.m-client-ntwrx-solutions-tabs__img { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--t-photo-wait); clip-path: polygon(0 0, 100% 0, 100% 92%, 88% 100%, 0 100%); box-shadow: 0 18px 40px rgba(0, 0, 0, .12); }
.m-client-ntwrx-solutions-tabs__img img { width: 100%; height: 100%; object-fit: cover; animation: m-client-ntwrx-solutions-tabs-kb 12s ease-in-out infinite alternate; }
@keyframes m-client-ntwrx-solutions-tabs-kb { from { transform: scale(1.02); } to { transform: scale(1.1); } }
.m-client-ntwrx-solutions-tabs__big { position: absolute; left: 18px; bottom: 12px; font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(56px, 6vw, 96px); line-height: 1; color: var(--t-brand); text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }
.m-client-ntwrx-solutions-tabs__copy { display: flex; flex-direction: column; gap: 20px; }
.m-client-ntwrx-solutions-tabs__copy :is(h1,h2,h3,h4,h5,h6) { font-size: clamp(34px, 3.6vw, 56px); }
.m-client-ntwrx-solutions-tabs__copy p { margin: 0; font-size: 17px; line-height: 1.65; color: var(--t-text-2); }

@media (max-width: 1000px) {
  .m-client-ntwrx-solutions-tabs__layer { grid-template-columns: 1fr; }
  .m-client-ntwrx-solutions-tabs__nav { flex-direction: row; overflow-x: auto; border-top: 0; border-bottom: 1.5px solid var(--t-ink); gap: 22px; scrollbar-width: none; }
  .m-client-ntwrx-solutions-tabs__btn { border-bottom: 0; padding: 14px 0; flex: 0 0 auto; grid-template-columns: auto auto; }
  .m-client-ntwrx-solutions-tabs__btn.is-on, .m-client-ntwrx-solutions-tabs__btn:hover { padding-left: 0; }
}
@media (max-width: 700px) {
  .m-client-ntwrx-solutions-tabs__panel { grid-template-columns: 1fr; }
  .m-client-ntwrx-solutions-tabs__img { aspect-ratio: 4 / 3; }
}

/* client.ntwrx.team-crew v1 */
/* NTWRX team members: heading and intro, then a grid of member cards. The
   grid fits as many 290px-plus columns as the width allows. */
.m-client-ntwrx-team-crew > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 120px)) 0 var(--m-pb, clamp(80px, 9vw, 130px)); }
.m-client-ntwrx-team-crew__head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(28px, 4vw, 64px); align-items: end; margin-bottom: clamp(48px, 5vw, 72px); }
.m-client-ntwrx-team-crew__title { display: flex; flex-direction: column; gap: 22px; }
.m-client-ntwrx-team-crew__h { font-size: clamp(44px, 5.4vw, 84px); }
.m-client-ntwrx-team-crew__head p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--t-text-2); max-width: 30em; }
.m-client-ntwrx-team-crew__head .m-client-ntwrx-team-crew__lead { margin: 0 0 10px; font-size: 18px; font-weight: 500; color: var(--t-ink); }

.m-client-ntwrx-team-crew__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); gap: clamp(20px, 2.4vw, 32px); align-items: start; max-width: 1180px; }
.m-client-ntwrx-team-crew__card { background: var(--t-card); box-shadow: 0 14px 34px rgba(0, 0, 0, .08); display: flex; flex-direction: column; transition: opacity .9s cubic-bezier(.2, .7, .2, 1), transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s; }
.m-client-ntwrx-team-crew__card:hover { transform: translateY(-6px); box-shadow: 0 22px 44px rgba(0, 0, 0, .14); }
.m-client-ntwrx-team-crew__photo { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--t-photo-wait); flex: none; }
.m-client-ntwrx-team-crew__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-team-crew__card:hover .m-client-ntwrx-team-crew__photo img { transform: scale(1.05); }
.m-client-ntwrx-team-crew__body { padding: 24px 24px 26px; display: flex; flex-direction: column; gap: 12px; }
/* Names are pure black on the original (a shade darker than the ink token). */
.m-client-ntwrx-team-crew__body :is(h1,h2,h3,h4,h5,h6) { font-family: var(--t-font-display); font-weight: 900; font-stretch: 80%; font-size: clamp(26px, 2.2vw, 32px); line-height: .95; text-transform: uppercase; margin: 0; color: #000; }
.m-client-ntwrx-team-crew__role { font-family: var(--t-font-mono); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-text); }
.m-client-ntwrx-team-crew__body p { margin: 4px 0 0; font-size: 15px; line-height: 1.6; color: var(--t-text-2); }
.m-client-ntwrx-team-crew__rule { width: 30px; height: 2px; background: var(--t-brand); margin: 8px 0 4px; transition: width .4s; }
.m-client-ntwrx-team-crew__card:hover .m-client-ntwrx-team-crew__rule { width: 64px; }
.m-client-ntwrx-team-crew__soc { display: flex; gap: 14px; align-items: center; }
.m-client-ntwrx-team-crew__soc a { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: var(--t-radius); color: var(--t-ink); transition: background .25s, color .25s; }
.m-client-ntwrx-team-crew__soc a:hover { background: var(--t-brand); color: var(--t-on-brand); }
.m-client-ntwrx-team-crew__soc svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.m-client-ntwrx-team-crew__soc svg.m-client-ntwrx-team-crew__fill { fill: currentColor; stroke: none; }
@media (max-width: 900px) {
  .m-client-ntwrx-team-crew__head { grid-template-columns: 1fr; }
}

/* client.ntwrx.team-hero v1 */
/* NTWRX team hero: copy on the left, the team photo on the right behind a
   rough painted edge, with a gold brush stroke over the join. On tablets and
   phones the photo drops below the copy with an angled top. */
.m-client-ntwrx-team-hero { background: var(--t-dark); color: var(--t-on-dark); overflow: hidden; }
.m-client-ntwrx-team-hero > .m__inner { min-height: clamp(520px, 46vw, 660px); display: flex; align-items: center; }

/* The photo panel. The rough left edge is decorative art; the grey shows
   while the photo loads. */
.m-client-ntwrx-team-hero__photo { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; z-index: 0; background: #3A3A38; overflow: hidden; clip-path: polygon(100% 0, 100% 100%, 0.00% 100.00%, 0.11% 98.33%, 0.99% 96.67%, 0.00% 95.00%, 0.60% 93.33%, 1.45% 91.67%, 2.13% 90.00%, 2.33% 88.33%, 2.55% 86.67%, 3.11% 85.00%, 3.98% 83.33%, 3.88% 81.67%, 4.19% 80.00%, 4.98% 78.33%, 4.49% 76.67%, 4.81% 75.00%, 5.82% 73.33%, 6.08% 71.67%, 6.56% 70.00%, 6.84% 68.33%, 7.11% 66.67%, 7.63% 65.00%, 8.09% 63.33%, 8.71% 61.67%, 8.56% 60.00%, 8.79% 58.33%, 9.25% 56.67%, 9.49% 55.00%, 9.82% 53.33%, 10.71% 51.67%, 10.78% 50.00%, 11.26% 48.33%, 11.75% 46.67%, 12.18% 45.00%, 12.40% 43.33%, 12.54% 41.67%, 13.30% 40.00%, 13.71% 38.33%, 13.93% 36.67%, 14.67% 35.00%, 14.96% 33.33%, 15.47% 31.67%, 15.16% 30.00%, 16.11% 28.33%, 15.98% 26.67%, 16.19% 25.00%, 17.21% 23.33%, 17.24% 21.67%, 17.63% 20.00%, 18.17% 18.33%, 17.91% 16.67%, 18.66% 15.00%, 18.79% 13.33%, 19.53% 11.67%, 19.44% 10.00%, 20.18% 8.33%, 20.82% 6.67%, 20.53% 5.00%, 21.45% 3.33%, 21.58% 1.67%, 22.00% 0.00%); }
.m-client-ntwrx-team-hero__photo img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); animation: m-client-ntwrx-team-hero-drift 18s ease-in-out infinite alternate; }
@keyframes m-client-ntwrx-team-hero-drift { to { transform: scale(1.1) translateX(-1.5%); } }

/* The painted brush stroke over the photo's edge (decorative). It wipes in
   from the top once the section is on screen (behaviour.ts adds .is-go). */
.m-client-ntwrx-team-hero__brush { position: absolute; z-index: 2; left: calc(40% + 60% * .22 * .55 - clamp(80px, 9vw, 140px)); top: 8%; width: clamp(160px, 18vw, 280px); height: 78%; object-fit: contain; pointer-events: none; clip-path: inset(0 0 0 0); transition: clip-path 1.2s cubic-bezier(.6, 0, .3, 1) .35s; }
.m-js .m-client-ntwrx-team-hero:not(.is-go) .m-client-ntwrx-team-hero__brush { clip-path: inset(0 0 100% 0); }

.m-client-ntwrx-team-hero__wrap { max-width: none; pointer-events: none; }
.m-client-ntwrx-team-hero__copy { pointer-events: auto; position: relative; z-index: 1; display: flex; flex-direction: column; gap: 26px; max-width: min(500px, calc(40vw - clamp(20px, 4vw, 56px) - 56px)); padding: var(--m-pt, clamp(56px, 6vw, 88px)) 0 var(--m-pb, clamp(56px, 6vw, 88px)); }
.m-client-ntwrx-team-hero__h { font-size: clamp(56px, 6.4vw, 112px); }
/* Each heading line slides up out of its own mask once the section is seen. */
.m-client-ntwrx-team-hero__ln { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.m-client-ntwrx-team-hero__ln > span { display: block; transition: transform 1s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-team-hero__ln:nth-child(2) > span { transition-delay: .12s; }
.m-client-ntwrx-team-hero__ln:nth-child(3) > span { transition-delay: .24s; }
.m-js .m-client-ntwrx-team-hero:not(.is-go) .m-client-ntwrx-team-hero__ln > span { transform: translateY(105%); }
.m-client-ntwrx-team-hero__body { margin: 0; font-size: 18px; line-height: 1.6; color: var(--t-on-dark-2); max-width: 30em; }
.m-client-ntwrx-team-hero__btn { width: fit-content; }

@media (max-width: 1100px) {
  .m-client-ntwrx-team-hero > .m__inner { flex-direction: column; align-items: stretch; }
  .m-client-ntwrx-team-hero__brush { display: none; }
  .m-client-ntwrx-team-hero__wrap { pointer-events: auto; }
  .m-client-ntwrx-team-hero__copy { max-width: none; }
  .m-client-ntwrx-team-hero__photo { position: relative; width: 100%; height: 68vw; clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%); order: 2; }
}

/* client.ntwrx.team-photo v1 */
/* NTWRX team photo: the team teaser's copy beside one landscape photo of the whole team. */
.m-client-ntwrx-team-photo > .m__inner { padding: var(--m-pt, clamp(72px, 8vw, 110px)) 0 var(--m-pb, clamp(80px, 8vw, 120px)); }
.m-client-ntwrx-team-photo__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.m-client-ntwrx-team-photo__copy { display: flex; flex-direction: column; gap: 22px; }
.m-client-ntwrx-team-photo__h { font-size: clamp(40px, 4.6vw, 72px); }
.m-client-ntwrx-team-photo__copy p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--t-text-2); max-width: 30em; }
.m-client-ntwrx-team-photo__figure { margin: 0; display: flex; flex-direction: column; gap: 14px; }
.m-client-ntwrx-team-photo__photo { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--t-photo-wait); box-shadow: 0 14px 30px rgba(0, 0, 0, .1); }
.m-client-ntwrx-team-photo__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.m-client-ntwrx-team-photo__photo:hover img { transform: scale(1.04); }
.m-client-ntwrx-team-photo__figure figcaption { font-family: var(--t-font-mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-text); }
@media (max-width: 900px) {
  .m-client-ntwrx-team-photo__grid { grid-template-columns: 1fr; }
}

/* client.ntwrx.technologies v1 */
/* NTWRX technologies: heading row and a looping band of names. */
.m-client-ntwrx-technologies { overflow: hidden; }
.m-client-ntwrx-technologies > .m__inner { padding: var(--m-pt, clamp(64px, 7vw, 100px)) 0 var(--m-pb, clamp(56px, 6vw, 88px)); }
.m-client-ntwrx-technologies__top { margin-bottom: 32px; }
.m-client-ntwrx-technologies__top .t-sec-row { margin-bottom: 0; }
.m-client-ntwrx-technologies__head { display: flex; flex-direction: column; gap: 20px; }
/* The bands only loop when the page script runs and the visitor has not asked
   for less motion (.m-js). Otherwise, and in the editor, the names wrap onto
   centred rows so every one shows, and the looping copy is left out. */
.m-client-ntwrx-technologies__band { position: relative; z-index: 1; overflow: hidden; padding: 8px clamp(20px, 4vw, 48px); }
.m-client-ntwrx-technologies__track { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.m-client-ntwrx-technologies__item[aria-hidden="true"] { display: none; }
.m-js .m-client-ntwrx-technologies__band { padding: 8px 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.m-js .m-client-ntwrx-technologies__track { flex-wrap: nowrap; justify-content: flex-start; gap: 0; width: max-content; animation: m-client-ntwrx-technologies-loop var(--speed, 40s) linear infinite; }
.m-js .m-client-ntwrx-technologies__item[aria-hidden="true"] { display: flex; }
.m-js .m-client-ntwrx-technologies__band:hover .m-client-ntwrx-technologies__track { animation-play-state: paused; }
.m-client-ntwrx-technologies__item { display: flex; align-items: center; gap: 12px; padding: 14px 22px; border: 1.5px solid var(--t-ink); background: var(--t-white); font-family: var(--t-font-display); font-weight: 800; font-stretch: 90%; font-size: clamp(16px, 1.4vw, 20px); text-transform: uppercase; white-space: nowrap; transition: background .25s; }
.m-js .m-client-ntwrx-technologies__item { margin-right: 12px; }
.m-client-ntwrx-technologies__item:hover { background: var(--t-brand); }
.m-client-ntwrx-technologies__item img { height: 1.2em; width: auto; }
/* Second band: scrolls the other way, outlined. */
.m-js .m-client-ntwrx-technologies__band--rev .m-client-ntwrx-technologies__track { animation-direction: reverse; }
.m-client-ntwrx-technologies__band--rev .m-client-ntwrx-technologies__item { background: transparent; border-color: #C9C7C1; }
@keyframes m-client-ntwrx-technologies-loop { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }
/* Still, on a phone: smaller names, so the wrapped rows stay compact. */
@media (max-width: 600px) {
  .m-client-ntwrx-technologies__track { gap: 8px; }
  .m-client-ntwrx-technologies__item { gap: 8px; padding: 9px 13px; font-size: 14px; }
  .m-js .m-client-ntwrx-technologies__item { gap: 12px; padding: 14px 22px; font-size: clamp(16px, 1.4vw, 20px); }
}