/*
Theme Name: Unified 2026
Template: um-theme
Author: Unified Marketing
Description: Child theme for the 2026 unifiedmktg.com rebuild — Goats-pattern architecture (preloader, fullscreen video hero, overlay menu, scroll-driven statement, horizontal work gallery, video footer) with Unified's brand system.
Version: 2.0.0
Requires PHP: 7.4
Text Domain: unified2026-um
*/

/* ============================================================
   TOKENS
   ============================================================ */
:root {
  /* Unified Marketing brand: magenta #CC1C6C + navy #201B51 (from logo) */
  --paper: #F7F6F4;
  --cream: #ECEAF2;
  --ink: #201B51;
  --ink-soft: #4C4775;
  --line: #DDDAE8;
  --accent: #CC1C6C;
  --accent-deep: #A81357;
  --gold: #F0619F;
  --on-dark: #F5F4FA;
  --on-dark-soft: #A9A5C6;
  --display: "Bebas Neue", "Arial Narrow", sans-serif;
  --serif: "DM Serif Display", Georgia, serif;
  --body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;
  --wrap: 1180px;
  --wrap-wide: 1500px;
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

* { box-sizing: border-box; }

body {
  font-family: var(--body);
  color: var(--ink);
  background: var(--paper);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img { display: block; }
a { color: inherit; }

h1, h2, h3, .u-display {
  font-family: var(--display);
  font-weight: 400;
  letter-spacing: .01em;
  line-height: .95;
  margin: 0 0 .35em;
  text-transform: uppercase;
}
h1 { font-size: clamp(3.2rem, 9vw, 7.5rem); }
h2 { font-size: clamp(2.4rem, 5.5vw, 4.6rem); }
h3 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); letter-spacing: .03em; }
.u-serif { font-family: var(--serif); text-transform: none; font-style: italic; letter-spacing: 0; }
.u-kicker {
  font-family: var(--mono); font-size: .78rem; letter-spacing: .22em;
  text-transform: uppercase; color: var(--accent); display: block; margin-bottom: 1.1rem;
}
.u-dark .u-kicker { color: var(--gold); }
.u-lead { font-size: clamp(1.05rem, 1.6vw, 1.3rem); color: var(--ink-soft); max-width: 46em; }
.u-dark .u-lead { color: var(--on-dark-soft); }

.u-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); }
.u-wrap--wide { max-width: var(--wrap-wide); }
.u-sec { padding: clamp(72px, 10vw, 130px) 0; }
.u-sec--tight { padding: clamp(48px, 6vw, 80px) 0; }
.u-center { text-align: center; }
.u-center .u-lead { margin-left: auto; margin-right: auto; }
.u-dark { background: var(--ink); color: var(--on-dark); }
.u-cream { background: var(--cream); }
.u-grid { display: grid; gap: clamp(18px, 2.5vw, 30px); }
@media (min-width: 720px) {
  .u-grid--2 { grid-template-columns: 1fr 1fr; }
  .u-grid--3 { grid-template-columns: repeat(3, 1fr); }
}
.screen-reader-text {
  border: 0; clip-path: inset(50%); height: 1px; width: 1px;
  margin: -1px; overflow: hidden; padding: 0; position: absolute;
}

/* ============================================================
   PRELOADER — wordmark + counter, wipes up when ready.
   html.is-preloading is set by an inline boot script (with its
   own timeout failsafe), so a JS failure can never trap it.
   ============================================================ */
.nu-preloader {
  position: fixed; inset: 0; z-index: 200;
  background: var(--ink); color: var(--on-dark);
  display: flex; align-items: center; justify-content: center;
  transform: translateY(-102%);
  transition: transform .8s var(--ease-out);
  visibility: hidden;
}
html.is-preloading .nu-preloader { transform: none; visibility: visible; }
html.is-loaded .nu-preloader { transform: translateY(-102%); visibility: visible; transition: transform .8s var(--ease-out), visibility 0s .8s; }
html.is-loaded.is-loaded .nu-preloader { visibility: hidden; }
html.is-preloading body { overflow: hidden; }
.nu-preloader__mark img { width: clamp(240px, 46vw, 560px); height: auto; display: block; }
.nu-preloader__count {
  position: absolute; right: clamp(24px, 5vw, 64px); bottom: clamp(20px, 4vw, 48px);
  font-family: var(--display); font-size: clamp(4rem, 10vw, 8rem); line-height: 1;
  color: var(--accent);
}

/* ============================================================
   FIXED CHROME — header, socials rail, overlay menu, video toggle
   ============================================================ */
.nu-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 90;
  display: flex; align-items: center; justify-content: space-between;
  padding: 34px clamp(20px, 3.5vw, 48px) 20px;
  transition: background .3s var(--ease), box-shadow .3s var(--ease), padding .3s var(--ease);
}
.nu-header.is-scrolled {
  background: rgba(250, 247, 241, .9);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 var(--line);
  padding-top: 12px; padding-bottom: 12px;
}
.nu-logo { text-decoration: none; line-height: 0; display: inline-block; }
.nu-logo img { height: 30px; width: auto; display: block; }
.nu-logo .nu-logo--white { display: none; }
/* home hero is a dark video: show the white logo until the header goes solid */
body.home .nu-header:not(.is-scrolled) .nu-logo--color { display: none; }
body.home .nu-header:not(.is-scrolled) .nu-logo--white { display: block; }
body.menu-open .nu-logo .nu-logo--color { display: none; }
body.menu-open .nu-logo .nu-logo--white { display: block; }
/* keep header (and its burger) clickable ABOVE the open overlay menu */
body.menu-open .nu-header { z-index: 97; background: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
body.menu-open .nu-header .nu-cta { visibility: hidden; }
.nu-header__tools { display: flex; align-items: center; gap: clamp(16px, 2vw, 28px); }
.nu-cta {
  position: relative;
  display: inline-block; background: var(--ink); color: var(--paper) !important;
  padding: 14px 32px; border-radius: 999px; font-weight: 800; font-size: 1.04rem;
  text-decoration: none; transition: background .18s var(--ease), transform .18s var(--ease), color .18s;
}
.nu-cta:hover { background: var(--accent); transform: translateY(-1px); }
/* attention ring so people notice the CTA */
.nu-cta::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  animation: nu-cta-pulse 2.4s var(--ease) infinite;
}
@keyframes nu-cta-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(204, 28, 108, .55); }
  70%  { box-shadow: 0 0 0 13px rgba(204, 28, 108, 0); }
  100% { box-shadow: 0 0 0 0 rgba(204, 28, 108, 0); }
}
/* white pill over the dark hero on home */
body.home .nu-header:not(.is-scrolled) .nu-cta {
  background: #fff; color: var(--ink) !important; box-shadow: 0 8px 22px rgba(0, 0, 0, .28);
}
@media (max-width: 560px) { .nu-header .nu-cta { display: none; } }

.nu-burger {
  background: none; border: 0; padding: 12px 8px; cursor: pointer; z-index: 96; position: relative;
  animation: nu-burger-hint 3s var(--ease) infinite;
}
.nu-burger span {
  display: block; width: 36px; height: 3px; background: var(--ink); border-radius: 2px;
  margin: 7px 0; transition: transform .3s var(--ease), opacity .2s, background .3s;
}
/* white + noticeable over the dark hero on home */
body.home .nu-header:not(.is-scrolled) .nu-burger span {
  background: #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, .35);
}
@keyframes nu-burger-hint {
  0%, 86%, 100% { transform: scale(1); }
  93% { transform: scale(1.14); }
}
body.menu-open .nu-burger { animation: none; }
body.menu-open .nu-burger span { background: var(--on-dark); box-shadow: none; }
body.menu-open .nu-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.menu-open .nu-burger span:nth-child(2) { transform: translateY(-7px) rotate(-45deg); }
@media (prefers-reduced-motion: reduce) {
  .nu-cta::after, .nu-burger { animation: none; }
}

/* socials rail */
.nu-rail {
  position: fixed; left: clamp(10px, 1.6vw, 24px); bottom: clamp(20px, 4vw, 48px); z-index: 80;
  display: flex; flex-direction: column; gap: 18px; align-items: center;
}
.nu-rail a {
  font-family: var(--mono); font-size: .78rem; letter-spacing: .14em;
  text-decoration: none; color: var(--ink-soft);
  writing-mode: vertical-rl; transform: rotate(180deg);
  transition: color .2s var(--ease);
}
.nu-rail a:hover { color: var(--accent); }
.nu-rail::after { content: ""; width: 1px; height: 48px; background: var(--line); }
@media (max-width: 900px) { .nu-rail { display: none; } }

/* fullscreen overlay menu */
.nu-menu {
  position: fixed; inset: 0; z-index: 95;
  background: var(--ink); color: var(--on-dark);
  display: flex; align-items: flex-start; overflow-y: auto;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .45s var(--ease), visibility 0s .45s;
}
body.menu-open .nu-menu { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity .45s var(--ease); }
body.menu-open { overflow: hidden; }
.nu-menu__in { width: 100%; max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(96px, 14vh, 150px) clamp(24px, 5vw, 48px) clamp(48px, 8vh, 90px); display: grid; gap: clamp(28px, 4vw, 60px); }
@media (min-width: 960px) { .nu-menu__in { grid-template-columns: 1fr 1.35fr; align-items: start; } }
.nu-menu__nav ul { list-style: none; margin: 0; padding: 0; }
.nu-menu__nav a {
  font-family: var(--display); font-size: clamp(2.2rem, 5.2vh, 3.6rem); line-height: 1.12;
  text-transform: uppercase; text-decoration: none; color: var(--on-dark);
  display: inline-block; transition: color .2s var(--ease), transform .3s var(--ease);
  transform: translateY(24px); opacity: 0;
}
body.menu-open .nu-menu__nav a { transform: none; opacity: 1; transition: color .2s var(--ease), transform .6s var(--ease-out) var(--d, 0s), opacity .6s var(--ease-out) var(--d, 0s); }
.nu-menu__nav a:hover { color: var(--accent); }
.nu-menu__side { display: flex; flex-direction: column; gap: clamp(24px, 4vh, 44px); }
.nu-menu__cols { display: grid; gap: clamp(20px, 3vw, 38px); }
@media (min-width: 620px) { .nu-menu__cols { grid-template-columns: repeat(3, 1fr); } }
.nu-menu__col-h { font-family: var(--mono); font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); margin: 0 0 12px; }
.nu-menu__col a { display: block; color: var(--on-dark-soft); text-decoration: none; font-size: .96rem; line-height: 1.3; padding: 5px 0; transition: color .15s var(--ease); }
.nu-menu__col a:hover { color: var(--on-dark); }
.nu-menu__more { color: var(--gold) !important; margin-top: 8px; font-family: var(--mono); font-size: .78rem !important; letter-spacing: .1em; text-transform: uppercase; }
.nu-menu__meta { font-size: .95rem; color: var(--on-dark-soft); }
/* 7-hub services directory in the overlay */
.nu-menu__mega { display: grid; gap: clamp(14px, 1.6vw, 26px) clamp(16px, 1.8vw, 28px); grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: clamp(6px, 1.5vh, 18px); }
.nu-menu__group { display: flex; flex-direction: column; }
.nu-menu__group-h { font-family: var(--display); font-size: 1rem; letter-spacing: .02em; color: var(--on-dark); text-decoration: none; padding-bottom: 7px; margin-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.14); transition: color .15s var(--ease); }
.nu-menu__group-h:hover { color: var(--accent); }
.nu-menu__group a:not(.nu-menu__group-h) { display: block; color: var(--on-dark-soft); text-decoration: none; font-size: .855rem; line-height: 1.25; padding: 3.5px 0; transition: color .15s var(--ease); }
.nu-menu__group a:not(.nu-menu__group-h):hover { color: var(--accent); }
.nu-menu__cols--sub { grid-template-columns: 1fr; }
@media (min-width: 560px) { .nu-menu__cols--sub { grid-template-columns: repeat(2, 1fr); } }
.nu-menu__meta a { color: var(--gold); text-decoration: none; }
.nu-menu__meta a:hover { text-decoration: underline; }

/* ambient video pause toggle */
.nu-vtoggle {
  position: fixed; right: clamp(16px, 2.5vw, 32px); bottom: clamp(16px, 3vw, 32px); z-index: 80;
  width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--line);
  background: rgba(250, 247, 241, .85); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: transform .2s var(--ease), border-color .2s;
}
.nu-vtoggle:hover { transform: scale(1.08); border-color: var(--accent); }
.nu-vtoggle svg { width: 16px; height: 16px; fill: var(--ink); }
.nu-vtoggle .i-play { display: none; }
body.videos-paused .nu-vtoggle .i-pause { display: none; }
body.videos-paused .nu-vtoggle .i-play { display: block; }
@media (prefers-reduced-motion: reduce) { .nu-vtoggle { display: none; } }

/* ============================================================
   HERO — fullscreen ambient video
   ============================================================ */
.nu-hero-full { position: relative; }
.nu-hero-full__pin { position: sticky; top: 0; height: 100svh; min-height: 560px; overflow: clip; }
/* scroll-scrub mode adds a tall track so the drive plays as you scroll (JS-gated) */
html.nu-hero-scrub .nu-hero-full { height: 240vh; }
.nu-hero-full__media, .nu-hero-full__media video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.nu-hero-full__veil { position: absolute; inset: 0; background: radial-gradient(ellipse 70% 55% at 50% 50%, rgba(0,0,0,.42), transparent 70%), linear-gradient(180deg, rgba(0,0,0,.18), transparent 30%, transparent 60%, rgba(0,0,0,.34)); }
.nu-hero-full__title {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  text-align: center; width: min(92vw, 1120px); padding: 0 clamp(20px, 4vw, 48px);
}
.nu-hero-full__title h1 {
  font-size: clamp(2.6rem, 7vw, 6.2rem); line-height: 1.02; margin: 0;
  color: #fff; text-shadow: 0 2px 30px rgba(0, 0, 0, .55);
}
/* video-synced headline: hidden state only applies once JS confirms (html.nu-sync) */
.nu-hero-line { display: block; }
html.nu-sync .nu-hero-line {
  opacity: 0; transform: translateY(16px);
  transition: opacity .65s var(--ease), transform .65s var(--ease);
}
html.nu-sync .nu-hero-line.is-on { opacity: 1; transform: none; }
.nu-hero-full__title h1 em { font-style: normal; color: var(--accent); }
.nu-hero-full__scroll {
  position: absolute; bottom: clamp(22px, 4.5vh, 46px); left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  font-family: var(--mono); font-size: .78rem; letter-spacing: .3em; text-transform: uppercase;
  color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.6); z-index: 3;
}
/* glowing mouse capsule with a dropping wheel dot */
.nu-hero-full__scroll::before {
  content: ""; width: 26px; height: 42px; border: 2px solid rgba(255,255,255,.9); border-radius: 14px;
  box-shadow: 0 0 18px rgba(255,255,255,.25), inset 0 0 12px rgba(255,255,255,.12);
}
/* the wheel dot */
.nu-hero-full__scroll::after {
  content: ""; position: absolute; top: 9px; left: 50%; width: 4px; height: 9px; border-radius: 3px;
  background: #fff; box-shadow: 0 0 10px rgba(255,255,255,.9);
  transform: translateX(-50%); animation: nu-scroll-wheel 1.7s var(--ease) infinite;
}
@keyframes nu-scroll-wheel {
  0% { opacity: 0; transform: translate(-50%, 0); }
  30% { opacity: 1; }
  70% { opacity: 1; transform: translate(-50%, 14px); }
  100% { opacity: 0; transform: translate(-50%, 16px); }
}
@media (prefers-reduced-motion: reduce) { .nu-hero-full__scroll::after { animation: none; opacity: 1; } }

/* ============================================================
   INTRO — sticky statement, words reveal on scroll
   ============================================================ */
.nu-intro { position: relative; height: 230vh; background: var(--paper); }
.nu-intro__sticky {
  position: sticky; top: 0; height: 100svh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 0 clamp(20px, 4vw, 48px); overflow: clip;
}
/* warm vignette for depth behind the statement */
.nu-intro__sticky::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(120% 80% at 50% 42%, rgba(255,255,255,.55), rgba(247,246,244,0) 62%),
    radial-gradient(100% 100% at 50% 118%, rgba(32,27,81,.05), transparent 60%);
}
/* giant faint ghost word — reinforces "get found everywhere", drifts on scroll */
.nu-intro__ghost {
  position: absolute; left: 50%; top: 50%;
  transform: translate(calc(-50% + var(--gx, 0px)), -50%);
  font-family: var(--display); font-size: clamp(9rem, 34vw, 30rem);
  line-height: .8; letter-spacing: .02em;
  color: var(--ink); opacity: .05; white-space: nowrap;
  pointer-events: none; user-select: none; z-index: 0; will-change: transform;
}
.nu-intro__label, .nu-intro__title { position: relative; z-index: 1; }
.nu-intro__label { font-family: var(--mono); font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 2rem; }
.nu-intro__title { font-size: clamp(3rem, 9vw, 8.5rem); line-height: .98; margin: 0; max-width: 12em; }
.nu-intro .word { display: inline-block; opacity: .08; transform: translateY(.12em); transition: opacity .35s var(--ease), transform .35s var(--ease), color .35s; }
.nu-intro .word.is-on { opacity: 1; transform: none; }
.nu-intro .word--accent.is-on { color: var(--accent); }
.nu-intro .word--serif { font-family: var(--serif); text-transform: none; font-style: italic; }
@media (prefers-reduced-motion: reduce) {
  .nu-intro { height: auto; padding: clamp(72px, 10vw, 130px) 0; }
  .nu-intro__sticky { position: static; height: auto; }
  .nu-intro .word { opacity: 1; transform: none; }
  .nu-intro__ghost { display: none; }
}

/* ============================================================
   MAKE — sticky horizontal gallery: video screen → cards screen
   ============================================================ */
.nu-make { position: relative; height: 400vh; background: var(--ink); }
.nu-make__sticky { position: sticky; top: 0; height: 100svh; overflow: clip; }
.nu-make__screen { position: absolute; inset: 0; }
.nu-make__screen--intro video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.nu-make__intro-title {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  text-align: center; padding: 0 clamp(20px, 4vw, 48px);
}
.nu-make__intro-title h2 { color: var(--on-dark); font-size: clamp(2.6rem, 7vw, 6.5rem); text-shadow: 0 2px 30px rgba(23,19,16,.5); }
.nu-make__intro-title .u-serif { color: var(--gold); }
.nu-make__screen--cards {
  background: var(--ink); transform: translateX(100%);
  display: flex; flex-direction: column; justify-content: center;
  will-change: transform;
}
.nu-make__head { padding: 0 clamp(20px, 4vw, 48px); margin-bottom: clamp(20px, 3vh, 40px); }
.nu-make__head h2 { color: var(--on-dark); font-size: clamp(2rem, 4.5vw, 3.8rem); margin: 0; }
.nu-make__head .u-serif { color: var(--accent); }
.nu-make__row {
  display: flex; gap: clamp(16px, 2vw, 28px); padding: 0 clamp(20px, 4vw, 48px);
  width: max-content; will-change: transform;
}
.nu-make__card { width: clamp(280px, 34vw, 520px); flex: none; text-decoration: none; }
.nu-make__cover {
  aspect-ratio: 4 / 3; border-radius: 14px; overflow: clip; position: relative;
  display: flex; align-items: flex-end; padding: 22px;
  background:
    linear-gradient(180deg, rgba(10, 8, 6, 0) 45%, rgba(10, 8, 6, .66) 100%),
    var(--img, linear-gradient(135deg, var(--c1, #2b2b2b), var(--c2, #555)));
  background-size: cover, cover; background-position: center, center;
  color: #fff; transition: transform .35s var(--ease);
}
.nu-make__card:hover .nu-make__cover { transform: scale(1.03); }
.nu-make__cover strong { font-family: var(--display); font-size: clamp(1.3rem, 1.8vw, 1.8rem); letter-spacing: .03em; display: block; }
.nu-make__cover span { font-family: var(--mono); font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; opacity: .85; }
.nu-make__progress {
  margin: clamp(20px, 4vh, 44px) clamp(20px, 4vw, 48px) 0;
  height: 2px; background: rgba(246, 241, 231, .18); border-radius: 2px; overflow: hidden;
}
.nu-make__progress-fill {
  display: block; height: 100%; width: 100%; background: var(--accent);
  transform: scaleX(0); transform-origin: left; will-change: transform;
}
@media (prefers-reduced-motion: reduce), (max-width: 860px) {
  .nu-make { height: auto; }
  .nu-make__sticky { position: static; height: auto; overflow: visible; }
  .nu-make__screen { position: static; }
  .nu-make__screen--intro { height: 70svh; position: relative; }
  .nu-make__screen--cards { transform: none !important; padding: clamp(48px, 8vw, 80px) 0; }
  .nu-make__row { width: auto; overflow-x: auto; -webkit-overflow-scrolling: touch; transform: none !important; scroll-snap-type: x mandatory; }
  .nu-make__card { scroll-snap-align: start; }
  .nu-make__progress { display: none; }
}

/* ============================================================
   CLIENTS — big-type grid
   ============================================================ */
.nu-clients { background: var(--cream); padding: clamp(72px, 10vw, 130px) 0; }
.nu-clients h2 { text-align: center; margin-bottom: clamp(32px, 5vw, 64px); }
.nu-clients h2 .u-serif { color: var(--accent); }
.nu-clients__grid {
  list-style: none; margin: 0 auto; padding: 0; max-width: var(--wrap-wide);
  display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line);
}
@media (min-width: 860px) { .nu-clients__grid { grid-template-columns: repeat(4, 1fr); } }
.nu-clients__grid li {
  border-bottom: 1px solid var(--line); border-right: 1px solid var(--line);
  padding: clamp(22px, 3vw, 40px) clamp(14px, 2vw, 28px);
  text-align: center; font-family: var(--display);
  font-size: clamp(1.15rem, 2vw, 1.7rem); letter-spacing: .04em; text-transform: uppercase;
  color: var(--ink-soft); transition: color .25s var(--ease), background .25s var(--ease);
}
.nu-clients__grid li:hover { color: var(--accent); background: var(--paper); }
.nu-clients__grid li:nth-child(2n), .nu-clients__grid li:last-child { border-right: 0; }
@media (min-width: 860px) { .nu-clients__grid li { border-right: 1px solid var(--line); } .nu-clients__grid li:nth-child(2n) { border-right: 1px solid var(--line); } .nu-clients__grid li:nth-child(4n) { border-right: 0; } }
.nu-clients__grid small { display: block; font-family: var(--mono); font-size: .78rem; letter-spacing: .18em; color: var(--ink-soft); opacity: .7; margin-top: 4px; }

/* ============================================================
   FOOTER — video background, big wordmark
   ============================================================ */
.nu-foot { position: relative; background: #000; color: var(--on-dark); overflow: clip; --beacon: .5; }
.nu-foot__crowd { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 58%; opacity: .92; filter: grayscale(1) contrast(1.05); }
.nu-foot__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.7), rgba(0,0,0,.28) 45%, rgba(0,0,0,.86)); }

/* ---- one phone in the crowd flashing a pink/blue laser: "found in a crowded space" ---- */
.nu-foot__beacon {
  position: absolute; left: 46%; top: 60%; width: 0; height: 0; z-index: 1; pointer-events: none;
  opacity: calc(.55 + .45 * var(--beacon));
  animation: nu-beacon-hue 2s linear infinite alternate;
}
.nu-foot__beacon-beam {
  position: absolute; left: 0; bottom: 0; transform: translateX(-50%);
  width: 3px; height: clamp(120px, 22vh, 280px);
  background: linear-gradient(to top, rgba(255,70,175,.95), rgba(255,70,175,.5) 28%, rgba(120,150,255,.16) 72%, transparent);
  filter: blur(1px) drop-shadow(0 0 7px rgba(255,60,170,.9));
  animation: nu-beacon-flicker 1.1s ease-in-out infinite;
}
.nu-foot__beacon-glow {
  position: absolute; left: 0; top: 0; transform: translate(-50%, -50%);
  width: calc(150px * (.7 + .6 * var(--beacon))); height: calc(150px * (.7 + .6 * var(--beacon))); border-radius: 50%;
  background: radial-gradient(circle, rgba(255,90,190,.9) 0%, rgba(120,150,255,.4) 40%, transparent 70%);
  filter: blur(7px); animation: nu-beacon-flicker 1.1s ease-in-out infinite;
}
.nu-foot__beacon-core {
  position: absolute; left: 0; top: 0; transform: translate(-50%, -50%);
  width: 16px; height: 16px; border-radius: 50%;
  background: radial-gradient(circle, #fff 0%, rgba(255,150,215,.95) 45%, transparent 78%);
  filter: drop-shadow(0 0 11px #fff);
  animation: nu-beacon-flicker .9s ease-in-out infinite;
}
@keyframes nu-beacon-hue { 0% { filter: hue-rotate(0deg); } 100% { filter: hue-rotate(-95deg); } }
@keyframes nu-beacon-flicker { 0%,100% { opacity: .8; } 45% { opacity: 1; } 55% { opacity: .62; } }
@media (prefers-reduced-motion: reduce) {
  .nu-foot__beacon, .nu-foot__beacon-beam, .nu-foot__beacon-glow, .nu-foot__beacon-core { animation: none; }
}

.nu-foot__in { position: relative; z-index: 2; max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(80px, 12vh, 160px) clamp(20px, 4vw, 48px) 28px; }
.nu-foot__brand { margin: 0; }
.nu-foot__brand img { width: min(64vw, 300px); height: auto; display: block; }
.nu-foot__tag { color: var(--on-dark); font-family: var(--serif); font-style: italic; font-size: clamp(1.35rem, 2.6vw, 2.1rem); line-height: 1.25; max-width: 18em; margin: 1.4rem 0 2.4rem; }
.nu-foot__tag em { font-style: italic; color: var(--accent); }
.nu-foot__email {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--display); font-size: clamp(1.5rem, 3.4vw, 2.6rem); letter-spacing: .03em;
  color: var(--on-dark); text-decoration: none; border-bottom: 2px solid var(--accent);
  padding-bottom: 4px; transition: color .2s var(--ease);
}
.nu-foot__email:hover { color: var(--gold); }
.nu-foot__cols { display: flex; flex-wrap: wrap; gap: 16px 40px; margin-top: clamp(36px, 6vh, 64px); }
.nu-foot__cols a { color: var(--on-dark-soft); text-decoration: none; font-size: .95rem; }
.nu-foot__cols a:hover { color: var(--gold); }
.nu-foot__base {
  display: flex; flex-wrap: wrap; gap: 10px 24px; justify-content: space-between;
  border-top: 1px solid rgba(246, 241, 231, .14); margin-top: clamp(36px, 6vh, 64px);
  padding-top: 20px; font-size: .8rem; color: var(--on-dark-soft);
}
.nu-foot__base a { color: inherit; text-decoration: none; }
.nu-foot__base a:hover { color: var(--gold); }

/* ============================================================
   WHAT WE DO — page title + grid/list service listing
   ============================================================ */
.nu-wtd-title { padding: calc(90px + clamp(50px, 7vw, 90px)) 0 clamp(28px, 4vw, 48px); }
.nu-wtd-title h1 { font-size: clamp(3.4rem, 11vw, 10rem); margin: 0; }
.nu-wtd-title h1 .u-serif { color: var(--accent); }
.nu-wtd { padding-bottom: clamp(72px, 10vw, 130px); }
.nu-wtd__toggle { display: flex; gap: 10px; margin-bottom: clamp(24px, 3.5vw, 44px); }
.nu-wtd__toggle-btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase;
  background: none; border: 1px solid var(--line); border-radius: 999px;
  padding: 10px 18px; cursor: pointer; color: var(--ink-soft);
  transition: border-color .2s var(--ease), color .2s var(--ease), background .2s var(--ease);
}
.nu-wtd__toggle-btn svg { width: 14px; height: 14px; }
.nu-wtd__toggle-btn:hover { border-color: var(--accent); color: var(--accent); }
.nu-wtd__toggle-btn.is-active { background: var(--ink); border-color: var(--ink); color: var(--paper); }

/* grid view */
.nu-wtd__items--grid { display: grid; gap: clamp(18px, 2.5vw, 32px); }
@media (min-width: 720px) { .nu-wtd__items--grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .nu-wtd__items--grid { grid-template-columns: repeat(3, 1fr); } }
.nu-wtd-card { text-decoration: none; display: block; }
.nu-wtd-card__media {
  display: flex; align-items: center; justify-content: center;
  aspect-ratio: 4 / 3; border-radius: 16px; overflow: clip; position: relative;
  background:
    var(--img, radial-gradient(120% 130% at 80% 10%, rgba(255, 255, 255, .16), transparent 55%)),
    linear-gradient(135deg, var(--c1, var(--ink)), var(--c2, var(--ink-soft)));
  background-size: cover; background-position: center;
  transition: transform .35s var(--ease);
}
.nu-wtd-card:hover .nu-wtd-card__media { transform: scale(1.03); }
.nu-wtd-card__num {
  font-family: var(--display); font-size: clamp(5rem, 9vw, 8rem); line-height: 1;
  color: rgba(250, 247, 241, .9); text-shadow: 0 4px 40px rgba(0, 0, 0, .25);
}
.nu-wtd-card[style*="--img"] .nu-wtd-card__num { opacity: 0; }
.nu-wtd-card__bar {
  display: flex; align-items: center; gap: 12px; padding: 16px 4px 0;
}
.nu-wtd-card__arrow {
  width: 34px; height: 34px; border-radius: 50%; flex: none;
  background: var(--accent); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform .25s var(--ease);
}
.nu-wtd-card__arrow svg { width: 16px; height: 16px; }
.nu-wtd-card:hover .nu-wtd-card__arrow { transform: rotate(45deg); }
.nu-wtd-card__title { font-family: var(--display); font-size: clamp(1.3rem, 2vw, 1.7rem); letter-spacing: .03em; color: var(--ink); text-transform: uppercase; }
.nu-wtd-card__desc { display: none; }

/* list view */
.nu-wtd__items--list { display: block; border-top: 1px solid var(--line); }
.nu-wtd__items--list .nu-wtd-card {
  display: flex; align-items: center; gap: clamp(14px, 2.5vw, 32px);
  padding: clamp(18px, 2.5vw, 28px) 4px; border-bottom: 1px solid var(--line);
  transition: background .2s var(--ease);
}
.nu-wtd__items--list .nu-wtd-card:hover { background: var(--cream); }
.nu-wtd__items--list .nu-wtd-card__media { display: none; }
.nu-wtd__items--list .nu-wtd-card__bar { padding: 0; flex: 1; }
.nu-wtd__items--list .nu-wtd-card__title { font-size: clamp(1.6rem, 3.4vw, 2.8rem); }
.nu-wtd__items--list .nu-wtd-card__desc {
  display: block; color: var(--ink-soft); font-size: .95rem; max-width: 34em; flex: 1;
}
@media (max-width: 720px) { .nu-wtd__items--list .nu-wtd-card__desc { display: none; } }

/* ============================================================
   SCROLL REVEALS (inner pages + odds and ends)
   Gate class .nu-anim is set by site.js — JS failure hides nothing.
   ============================================================ */
html.nu-anim [data-anim] {
  opacity: 0; transform: translateY(26px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
  transition-delay: var(--d, 0s);
}
html.nu-anim [data-anim="fade"] { transform: none; }
html.nu-anim [data-anim].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.nu-anim [data-anim] { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ============================================================
   INNER-PAGE COMPONENTS (services / work / about / contact)
   ============================================================ */
.nu-inner-hero { padding: calc(90px + clamp(60px, 8vw, 110px)) 0 clamp(48px, 6vw, 80px); text-align: center; }
.nu-hero { padding: calc(90px + clamp(60px, 8vw, 110px)) 0 clamp(48px, 6vw, 80px); position: relative; }

.u-btn {
  display: inline-block; text-decoration: none; font-weight: 700;
  padding: 16px 34px; border-radius: 999px; font-size: 1rem;
  transition: transform .18s var(--ease), background .18s var(--ease), color .18s var(--ease), box-shadow .18s var(--ease);
}
.u-btn--accent { background: var(--accent); color: #fff; }
.u-btn--accent:hover { background: var(--accent-deep); transform: translateY(-2px); box-shadow: 0 12px 28px rgba(228, 85, 31, .28); }
.u-btn--ghost { border: 2px solid currentColor; color: var(--ink); }
.u-dark .u-btn--ghost { color: var(--on-dark); }
.u-btn--ghost:hover { color: var(--accent); transform: translateY(-2px); }
.u-btn-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 2rem; }
.u-center .u-btn-row { justify-content: center; }

.u-card {
  background: #fff; border: 1px solid var(--line); border-radius: 18px;
  padding: clamp(26px, 3vw, 38px);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}
.u-card:hover { transform: translateY(-5px); border-color: var(--accent); box-shadow: 0 18px 40px rgba(23, 19, 16, .08); }
.u-card h3 { margin-top: .8rem; }
.u-card p { color: var(--ink-soft); font-size: .98rem; margin-bottom: 0; }
.u-card__icon { font-size: 1.6rem; line-height: 1; }
a.u-card { display: block; text-decoration: none; }

.nu-work { display: grid; gap: clamp(16px, 2vw, 26px); }
@media (min-width: 720px) { .nu-work { grid-template-columns: repeat(3, 1fr); } }
.nu-work a { text-decoration: none; display: block; border-radius: 18px; overflow: hidden; position: relative; }
.nu-work__cover {
  aspect-ratio: 4 / 3; display: flex; align-items: flex-end; padding: 24px;
  background:
    linear-gradient(180deg, rgba(10, 8, 6, 0) 45%, rgba(10, 8, 6, .62) 100%),
    var(--img, linear-gradient(135deg, var(--c1, #2b2b2b), var(--c2, #555)));
  background-size: cover, cover; background-position: center, center;
  color: #fff; transition: transform .35s var(--ease);
}
.nu-work a:hover .nu-work__cover { transform: scale(1.04); }
.nu-work__mark { position: absolute; top: 20px; left: 24px; font-family: var(--display); font-size: 3rem; opacity: .35; color: #fff; }
.nu-work__meta { position: relative; }
.nu-work__meta strong { font-family: var(--display); font-size: 1.5rem; letter-spacing: .03em; display: block; }
.nu-work__meta span { font-family: var(--mono); font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; opacity: .8; }

.nu-steps { counter-reset: step; display: grid; gap: 22px; }
@media (min-width: 860px) { .nu-steps { grid-template-columns: repeat(5, 1fr); } }
.nu-step { border-top: 3px solid var(--line); padding-top: 18px; transition: border-color .3s var(--ease); }
.nu-step:hover { border-color: var(--accent); }
.nu-step i { font-family: var(--mono); font-style: normal; font-size: .78rem; letter-spacing: .2em; color: var(--accent); }
.nu-step strong { font-family: var(--display); font-size: 1.35rem; display: block; margin: 6px 0 4px; letter-spacing: .04em; }
.nu-step p { font-size: .9rem; color: var(--ink-soft); margin: 0; }

.nu-form { display: grid; gap: 16px; max-width: 640px; }
.nu-form input, .nu-form textarea, .nu-form select {
  font: inherit; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px;
  background: #fff; width: 100%;
}
.nu-form input:focus, .nu-form textarea:focus { outline: 2px solid var(--accent); border-color: transparent; }

.u-prose { max-width: 760px; margin: 0 auto; }
.u-prose h2 { font-size: clamp(1.9rem, 3.5vw, 2.6rem); margin-top: 2.2em; }
.u-prose ul { padding-left: 1.2em; }

/* legacy band helpers still used on inner pages */
.nu-band { position: relative; overflow: clip; }
.nu-band__bg { position: absolute; inset: -18% 0; background-size: cover; background-position: center; will-change: transform; }
.nu-hero .nu-band__bg {
  background-image:
    radial-gradient(900px 420px at 80% 20%, rgba(204, 28, 108, .10), transparent 60%),
    radial-gradient(700px 380px at 15% 75%, rgba(32, 27, 81, .08), transparent 60%);
}
.u-dark .nu-band__bg {
  background-image:
    radial-gradient(1000px 480px at 75% 25%, rgba(204, 28, 108, .25), transparent 60%),
    radial-gradient(800px 420px at 20% 80%, rgba(240, 97, 159, .12), transparent 60%);
}
.nu-band__bg--wash { background-image: linear-gradient(180deg, rgba(32, 27, 81, .04), transparent 45%); opacity: 1; }
.nu-band__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.u-dark .nu-band__video { opacity: .82; }
@media (prefers-reduced-motion: reduce) { .nu-band__video { display: none; } }
.nu-stats { display: grid; gap: 28px; text-align: center; }
@media (min-width: 720px) { .nu-stats { grid-template-columns: repeat(4, 1fr); } }
.nu-stats b { font-family: var(--display); font-size: clamp(3rem, 5.5vw, 4.6rem); line-height: 1; display: block; color: var(--gold); }
.nu-stats small { font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--on-dark-soft); }
.u-rule { width: 0; height: 4px; background: var(--accent); margin: 26px auto 0; transition: width 1s var(--ease) .3s; }
.is-in .u-rule, .u-rule.is-in { width: 96px; }

/* ============================================================
   CASE STUDIES — /case-studies/
   ============================================================ */
.nu-cs { background: var(--paper); }
.nu-cs-hero {
  max-width: var(--wrap-wide); margin: 0 auto;
  padding: clamp(120px, 18vh, 220px) clamp(20px, 4vw, 48px) clamp(40px, 6vh, 70px);
}
.nu-cs-hero__label { font-family: var(--mono); font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin: 0 0 1rem; }
.nu-cs-hero__title { font-size: clamp(3rem, 9vw, 8rem); line-height: .95; margin: 0; }
.nu-cs-hero__lead { max-width: 34em; margin: 1.4rem 0 0; font-size: clamp(1.05rem, 1.6vw, 1.3rem); color: var(--ink-soft); }
.nu-cs-hero__stats { display: flex; flex-wrap: wrap; gap: clamp(28px, 6vw, 72px); margin-top: clamp(36px, 6vh, 60px); }
.nu-cs-hero__stats strong { font-family: var(--display); font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1; display: block; color: var(--ink); }
.nu-cs-hero__stats span { font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); }

.nu-cs-filter {
  position: sticky; top: 0; z-index: 20; display: flex; flex-wrap: wrap; gap: 10px;
  max-width: var(--wrap-wide); margin: 0 auto; padding: 16px clamp(20px, 4vw, 48px);
  background: rgba(247,246,244,.9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.nu-cs-filter button {
  font-family: var(--mono); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase;
  padding: 9px 18px; border-radius: 999px; border: 1px solid var(--line); background: transparent;
  color: var(--ink-soft); cursor: pointer; transition: all .18s var(--ease);
}
.nu-cs-filter button:hover { border-color: var(--ink); color: var(--ink); }
.nu-cs-filter button.is-active { background: var(--ink); border-color: var(--ink); color: var(--paper); }

.nu-cs-item {
  display: grid; gap: clamp(24px, 4vw, 60px); align-items: center;
  max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(48px, 8vh, 96px) clamp(20px, 4vw, 48px);
  border-top: 1px solid var(--line);
}
@media (min-width: 900px) { .nu-cs-item { grid-template-columns: 1.1fr 1fr; } .nu-cs-item:nth-child(even) .nu-cs-item__media { order: 2; } }
.nu-cs-item[hidden] { display: none; }
.nu-cs-item__media {
  border-radius: 16px; overflow: clip; box-shadow: 0 30px 70px rgba(32,27,81,.18);
  border: 1px solid var(--line); background: var(--ink);
}
.nu-cs-item__media img { display: block; width: 100%; height: auto; }
.nu-cs-item__eyebrow { font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); margin: 0 0 .6rem; }
.nu-cs-item__name { font-family: var(--display); font-size: clamp(2.2rem, 4.4vw, 3.6rem); line-height: 1; margin: 0; }
.nu-cs-item__sub { font-family: var(--serif); font-style: italic; font-size: clamp(1.1rem, 1.8vw, 1.5rem); color: var(--ink); margin: .7rem 0 1.4rem; }
.nu-cs-item__block h3 { font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); margin: 1.2rem 0 .4rem; }
.nu-cs-item__block p { margin: 0; color: var(--ink-soft); line-height: 1.6; }
.nu-cs-item__metrics { list-style: none; display: flex; flex-wrap: wrap; gap: clamp(20px, 3vw, 44px); padding: 0; margin: 1.6rem 0 0; }
.nu-cs-item__metrics strong { font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1; display: block; color: var(--ink); }
.nu-cs-item__metrics span { font-family: var(--mono); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); }
.nu-cs-faq { margin-top: 1.6rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.nu-cs-faq summary { cursor: pointer; font-weight: 700; color: var(--ink); list-style: none; }
.nu-cs-faq summary::-webkit-details-marker { display: none; }
.nu-cs-faq summary::before { content: "+ "; color: var(--accent); }
.nu-cs-faq[open] summary::before { content: "\2013 "; }
.nu-cs-faq p { margin: .8rem 0 0; color: var(--ink-soft); line-height: 1.6; }

.nu-cs-cta { text-align: center; background: var(--ink); color: var(--on-dark); padding: clamp(72px, 12vh, 140px) clamp(20px, 4vw, 48px); }
.nu-cs-cta h2 { font-size: clamp(2.4rem, 6vw, 5rem); margin: 0; color: var(--on-dark); }
.nu-cs-cta p { color: var(--on-dark-soft); margin: 1rem auto 2rem; max-width: 34em; }
.nu-cs-cta__btn { display: inline-block; background: var(--accent); color: #fff; font-weight: 800; padding: 16px 40px; border-radius: 999px; text-decoration: none; transition: transform .18s var(--ease), background .18s; }
.nu-cs-cta__btn:hover { background: var(--accent-deep); transform: translateY(-2px); }

/* ============================================================
   CASE STUDIES RAIL — homepage horizontal scroller
   ============================================================ */
.nu-csrail { background: var(--ink); color: var(--on-dark); padding: clamp(64px, 10vh, 120px) 0; overflow: clip; }
.nu-csrail__head {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 16px;
  max-width: var(--wrap-wide); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px) clamp(28px, 4vh, 44px);
}
.nu-csrail__head h2 { font-size: clamp(2.2rem, 5vw, 4rem); margin: 0; color: var(--on-dark); }
.nu-csrail__head .u-serif { color: var(--accent); }
.nu-csrail__all { font-family: var(--mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--on-dark-soft); text-decoration: none; transition: color .2s var(--ease); }
.nu-csrail__all:hover { color: var(--accent); }
.nu-csrail__track {
  display: flex; gap: clamp(16px, 2vw, 26px);
  padding: 0 clamp(20px, 4vw, 48px); scroll-padding-left: clamp(20px, 4vw, 48px);
  overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.nu-csrail__track::-webkit-scrollbar { display: none; }
.nu-csrail__card {
  position: relative; flex: none; width: clamp(280px, 40vw, 460px); aspect-ratio: 4 / 3;
  border-radius: 16px; overflow: clip; scroll-snap-align: start; text-decoration: none;
  display: flex; flex-direction: column; justify-content: flex-end; padding: 24px;
  background: linear-gradient(180deg, rgba(10,8,20,0) 40%, rgba(10,8,20,.86) 100%), var(--img);
  background-size: cover; background-position: center; color: #fff;
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(var(--lift, 0px));
  transition: transform .18s var(--ease); border: 1px solid rgba(255,255,255,.08); will-change: transform;
}
.nu-csrail__card:hover { --lift: -6px; }
.nu-csrail__eyebrow { font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.nu-csrail__name { font-family: var(--display); font-size: clamp(1.4rem, 2.4vw, 2rem); letter-spacing: .02em; line-height: 1; margin: 6px 0 8px; }
.nu-csrail__metric { font-family: var(--mono); font-size: .78rem; letter-spacing: .04em; color: rgba(255,255,255,.82); }

/* ============================================================
   INTERIOR PAGES — reusable (About / Services / Insights)
   ============================================================ */
.nu-page { background: var(--paper); }
.nu-page-hero { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(120px, 18vh, 220px) clamp(20px, 4vw, 48px) clamp(30px, 5vh, 56px); }
.nu-page-hero__label { font-family: var(--mono); font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin: 0 0 1rem; }
.nu-page-hero__title { font-size: clamp(2.8rem, 8vw, 7rem); line-height: .95; margin: 0; }
.nu-page-hero__lead { max-width: 34em; margin: 1.4rem 0 0; font-size: clamp(1.05rem, 1.6vw, 1.3rem); color: var(--ink-soft); line-height: 1.6; }

/* Cinematic dark hero band — pillar image + navy scrim + white headline */
.nu-page-hero--media { position: relative; overflow: clip; min-height: clamp(440px, 66vh, 720px); display: flex; align-items: flex-end; padding: 0; margin: 0; background: #120e26; }
.nu-crumbs + .nu-page-hero--media { padding-top: 0; }
.nu-page-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: 0; }
.nu-page-hero__scrim { position: absolute; inset: 0; z-index: 1; background:
  linear-gradient(90deg, rgba(18,14,38,.95) 0%, rgba(18,14,38,.78) 30%, rgba(18,14,38,.30) 60%, rgba(18,14,38,.06) 100%),
  linear-gradient(0deg, rgba(18,14,38,.6) 0%, rgba(18,14,38,0) 42%); }
.nu-page-hero--media .nu-page-hero__inner { position: relative; z-index: 2; width: 100%; max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(72px, 12vh, 150px) clamp(20px, 4vw, 48px) clamp(44px, 7vh, 84px); }
.nu-page-hero--media .nu-page-hero__label { color: var(--accent); }
.nu-page-hero--media .nu-page-hero__title { color: #fff; text-wrap: balance; }
.nu-page-hero--media .nu-page-hero__title .u-serif { color: var(--accent); }
.nu-page-hero--media .nu-page-hero__lead { color: rgba(255,255,255,.84); }
@media (max-width: 620px) {
  .nu-page-hero--media { min-height: clamp(380px, 60vh, 520px); }
  .nu-page-hero__bg { object-position: center; }
  .nu-page-hero__scrim { background:
    linear-gradient(90deg, rgba(18,14,38,.92) 0%, rgba(18,14,38,.68) 55%, rgba(18,14,38,.4) 100%),
    linear-gradient(0deg, rgba(18,14,38,.72) 0%, rgba(18,14,38,0) 55%); }
}

.nu-page-prose { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(40px, 7vh, 90px) clamp(20px, 4vw, 48px); display: grid; gap: clamp(20px, 4vw, 60px); border-top: 1px solid var(--line); }
@media (min-width: 860px) { .nu-page-prose { grid-template-columns: 1fr 1.2fr; } }
.nu-page-prose h2 { font-size: clamp(2rem, 4.5vw, 3.4rem); margin: 0; }
.nu-page-prose p { margin: 0 0 1.1rem; color: var(--ink-soft); line-height: 1.7; font-size: clamp(1rem, 1.3vw, 1.15rem); }

.nu-features { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(40px, 7vh, 90px) clamp(20px, 4vw, 48px); }
.nu-features__head h2 { font-size: clamp(2rem, 4.5vw, 3.4rem); margin: 0 0 clamp(28px, 4vh, 48px); }
.nu-features__grid { display: grid; gap: clamp(16px, 2vw, 28px); }
@media (min-width: 720px) { .nu-features__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .nu-features__grid--4 { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 860px) { .nu-features__grid--3 { grid-template-columns: repeat(3, 1fr); } }
.nu-feature { border: 1px solid var(--line); border-radius: 14px; padding: clamp(24px, 3vw, 38px); background: #fff; }
.nu-feature__no { font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; color: var(--accent); }
.nu-feature h3 { font-family: var(--display); font-size: clamp(1.4rem, 2.4vw, 2rem); letter-spacing: .01em; margin: .5rem 0 .6rem; }
.nu-feature p { margin: 0; color: var(--ink-soft); line-height: 1.6; }

.nu-page-band { background: var(--ink); color: var(--on-dark); }
.nu-page-band__in { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(64px, 11vh, 130px) clamp(20px, 4vw, 48px); }
.nu-page-band__label { font-family: var(--mono); font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); margin: 0 0 1rem; }
.nu-page-band__in h2 { font-size: clamp(2.2rem, 5.5vw, 4.6rem); margin: 0 0 clamp(30px, 5vh, 56px); color: var(--on-dark); }
.nu-page-band .nu-steps { display: grid; gap: clamp(20px, 2.5vw, 34px); counter-reset: step; }
/* auto-fit: 3 steps fill the row instead of leaving an empty 4th column */
@media (min-width: 720px) { .nu-page-band .nu-steps { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); } }
.nu-page-band .nu-step { border-top: 2px solid var(--accent); padding-top: 16px; }
.nu-page-band .nu-step strong { display: block; font-family: var(--display); font-size: clamp(1.4rem, 2.4vw, 2rem); letter-spacing: .02em; color: var(--on-dark); }
.nu-page-band .nu-step span { display: block; margin-top: 8px; color: var(--on-dark-soft); font-size: 1rem; line-height: 1.6; }

.nu-page-faq { max-width: 60rem; margin: 0 auto; padding: clamp(48px, 8vh, 96px) clamp(20px, 4vw, 48px); }
.nu-page-faq > h2 { font-size: clamp(2rem, 4.5vw, 3.4rem); margin: 0 0 clamp(20px, 3vh, 36px); }

/* ---- Tier-2 template blocks (breadcrumbs, answer-first, stats, areas, byline, related) ---- */
.nu-crumbs { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(96px, 13vh, 138px) clamp(20px, 4vw, 48px) 0; font-family: var(--mono); font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; }
.nu-crumbs a { color: var(--ink-soft); text-decoration: none; }
.nu-crumbs a:hover { color: var(--accent); }
.nu-crumbs__sep { opacity: .45; margin: 0 4px; }
.nu-crumbs [aria-current] { color: var(--ink); }
.nu-crumbs + .nu-page-hero { padding-top: clamp(24px, 3.5vh, 46px); }

.nu-answer { max-width: var(--wrap-wide); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px) clamp(32px, 5vh, 60px); }
.nu-answer__label { font-family: var(--mono); font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); margin: 0 0 .6rem; }
.nu-answer__text { font-family: var(--serif); font-style: italic; font-size: clamp(1.3rem, 2.4vw, 1.9rem); line-height: 1.42; color: var(--ink); max-width: 36em; margin: 0; border-left: 3px solid var(--accent); padding-left: clamp(16px, 2vw, 26px); }

.nu-statband { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.nu-statband__in { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(32px, 5vh, 58px) clamp(20px, 4vw, 48px); display: flex; flex-wrap: wrap; gap: clamp(28px, 6vw, 80px); }
.nu-statband strong { display: block; font-family: var(--display); font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1; color: var(--ink); }
.nu-statband span { font-family: var(--mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); }

.nu-areas { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: clamp(20px, 3vh, 34px) 0 0; }
.nu-areas li { font-family: var(--mono); font-size: .76rem; letter-spacing: .06em; padding: 9px 18px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; color: var(--on-dark); }

.nu-byline { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(4px, 1vh, 10px) clamp(20px, 4vw, 48px) clamp(30px, 4vh, 46px); display: flex; align-items: center; gap: 14px; }
.nu-byline__dot { width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--ink)); flex: none; }
.nu-byline strong { display: block; color: var(--ink); }
.nu-byline span { font-family: var(--mono); font-size: .78rem; letter-spacing: .06em; color: var(--ink-soft); }

.nu-related { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(40px, 7vh, 82px) clamp(20px, 4vw, 48px); border-top: 1px solid var(--line); }
.nu-related > h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); margin: 0 0 clamp(20px, 3vh, 34px); }
.nu-related__grid { display: grid; gap: clamp(12px, 1.5vw, 20px); }
@media (min-width: 720px) { .nu-related__grid { grid-template-columns: repeat(3, 1fr); } }
.nu-related__grid a { display: flex; flex-direction: column; gap: 5px; padding: clamp(18px, 2vw, 28px); border: 1px solid var(--line); border-radius: 12px; text-decoration: none; background: #fff; transition: border-color .18s var(--ease), transform .18s var(--ease); }
.nu-related__grid a:hover { border-color: var(--ink); transform: translateY(-3px); }
.nu-related__grid span { font-family: var(--display); font-size: clamp(1.1rem, 1.8vw, 1.4rem); letter-spacing: .02em; color: var(--ink); }
.nu-related__grid em { font-family: var(--mono); font-style: normal; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }

/* Testimonial — social proof before the FAQ */
.nu-quote { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(40px, 7vh, 90px) clamp(20px, 4vw, 48px); }
.nu-quote__text { font-family: var(--serif); font-size: clamp(1.5rem, 3.4vw, 2.6rem); line-height: 1.32; color: var(--ink); margin: 0; max-width: 22ch; }
.nu-quote__text::before { content: "\201C"; color: var(--accent); }
.nu-quote__text::after { content: "\201D"; color: var(--accent); }
.nu-quote__cite { margin: clamp(20px, 3vh, 34px) 0 0; display: flex; flex-direction: column; gap: 3px; }
.nu-quote__cite strong { font-family: var(--display); font-size: 1.15rem; letter-spacing: .02em; color: var(--ink); }
.nu-quote__cite span { font-family: var(--mono); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }

/* Immersive work reel — full-bleed cinematic panels, parallax mockups, giant index */
.nu-wf-reel { position: relative; }
.nu-wf { position: relative; min-height: 100vh; display: grid; grid-template-columns: 1fr; align-items: center; justify-items: center; gap: clamp(24px, 4vh, 46px); padding: clamp(84px, 12vh, 150px) clamp(22px, 5vw, 80px); overflow: clip; }
.nu-wf--dark { background: #120e26; color: #fff; }
.nu-wf--light { background: var(--paper); color: var(--ink); }
@media (min-width: 900px) {
  .nu-wf { grid-template-columns: 1.22fr .78fr; gap: clamp(40px, 5vw, 96px); justify-items: stretch; }
  .nu-wf--flip .nu-wf__media { order: 2; }
  .nu-wf--flip .nu-wf__text { order: 1; }
}
.nu-wf__media { position: relative; z-index: 2; width: 100%; max-width: 940px; margin: 0; border-radius: 18px; line-height: 0; perspective: 1100px;
  box-shadow: 0 50px 110px -44px rgba(0,0,0,.7);
  transform: translateY(var(--wfp, 0)) scale(var(--wfs, 1)); will-change: transform; }
.nu-wf--light .nu-wf__media { box-shadow: 0 44px 96px -40px rgba(18,14,38,.5); }
.nu-wf__shot { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; display: block; border-radius: 18px;
  transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .18s var(--ease); will-change: transform; }
.nu-wf__index { position: absolute; z-index: 1; font-family: var(--display); font-weight: 400; font-size: clamp(11rem, 42vh, 34rem); line-height: .66; letter-spacing: -.04em; top: 50%; transform: translateY(calc(-50% + var(--wfi, 0px))); pointer-events: none; user-select: none; }
/* index ghosts in the text-side negative space (opposite the mockup), bleeding off the outer edge */
.nu-wf--dark .nu-wf__index { color: #fff; opacity: .09; right: -.06em; left: auto; }
.nu-wf--light .nu-wf__index { color: var(--ink); opacity: .06; left: -.06em; right: auto; }
@media (max-width: 899px) { .nu-wf__index { top: clamp(40px, 8vh, 90px); transform: translateY(var(--wfi, 0px)); opacity: .05 !important; } }
.nu-wf__text { position: relative; z-index: 3; max-width: 30ch; }
.nu-wf__cat { display: block; font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.nu-wf__name { font-family: var(--display); font-size: clamp(2.2rem, 4.6vw, 3.7rem); line-height: 1; letter-spacing: .01em; margin: .42em 0 .34em; color: inherit; }
.nu-wf__line { margin: 0; font-size: clamp(1rem, 1.3vw, 1.16rem); line-height: 1.55; color: inherit; opacity: .82; }
/* fixed scroll-progress indicator (mix-blend adapts it to dark + light panels) */
.nu-wf-progress { position: fixed; right: clamp(14px, 2vw, 30px); top: 50%; transform: translateY(-50%); z-index: 40; display: flex; flex-direction: column; align-items: center; gap: 12px; font-family: var(--mono); font-size: .78rem; letter-spacing: .12em; color: #fff; mix-blend-mode: difference; opacity: 0; transition: opacity .4s var(--ease); pointer-events: none; }
.nu-wf-progress.is-on { opacity: 1; }
.nu-wf-progress__bar { position: relative; width: 2px; height: clamp(90px, 16vh, 150px); background: rgba(255,255,255,.28); }
.nu-wf-progress__bar i { position: absolute; inset: 0; background: #fff; transform: scaleY(var(--wfprog, 0)); transform-origin: top; }
@media (max-width: 560px) { .nu-wf-progress { display: none; } }
@media (prefers-reduced-motion: reduce) { .nu-wf__media { transform: none !important; } .nu-wf__index { transform: translateY(-50%) !important; } }

/* ============================================================
   LAUNCH QA FIXES (2026-10-07 audit: 53 pages x desktop 1440 + mobile 390)
   ============================================================ */
/* Logo: the white SVG is cropped tighter than the color one, so equal HEIGHT
   made it 373px wide and pushed the burger off-screen on mobile home. Size by width. */
.nu-logo img { height: auto; width: min(255px, 60vw); }
.nu-logo { min-height: 44px; display: inline-flex; align-items: center; }

/* Social rail: no real profile URLs yet; hidden until they exist (links were href="#") */
.nu-rail { display: none !important; }

/* Tap targets >= 44px on touch */
.nu-crumbs a, .nu-crumbs [aria-current] { display: inline-block; padding: 12px 0; }
.nu-crumbs { line-height: 1.4; }
.nu-foot__cols { gap: 4px 32px; }
.nu-foot__cols a, .nu-foot__base a { display: inline-flex; align-items: center; min-height: 44px; }
.nu-cs-faq summary { padding-top: 16px; padding-bottom: 16px; }
.nu-csrail__all { display: inline-flex; align-items: center; min-height: 44px; }

/* Footer legibility over the crowd photo */
.nu-foot__cols a { color: rgba(255,255,255,.88); font-size: 1rem; }
/* stronger shade where the nav + base sit (links were grey-on-crowd) */
.nu-foot__shade { background: linear-gradient(180deg, rgba(0,0,0,.7), rgba(0,0,0,.3) 40%, rgba(0,0,0,.72) 68%, rgba(0,0,0,.9)); }

/* "In short" block sat flush against the hero / crumbs */
.nu-page-hero + .nu-answer, .nu-page-hero--media + .nu-answer { padding-top: clamp(28px, 5vh, 56px); }
.nu-answer__text { font-weight: 400; }

/* Media hero: magenta label on the pink art was low-contrast */
.nu-page-hero--media .nu-page-hero__label { color: rgba(255,255,255,.78); }

/* Breadcrumb bar on media-hero pages needed breathing room above the band */
.nu-crumbs + .nu-page-hero--media { margin-top: 10px; }

/* Grids: no orphan cards */
@media (min-width: 860px) {
  .nu-features__grid--3:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1040px) {
  .nu-features__grid--3:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, 1fr); }
}

/* Work rail cards: eyebrow/metric sat over busy screenshots */
.nu-csrail__card { background: linear-gradient(180deg, rgba(10,8,20,0) 30%, rgba(10,8,20,.72) 62%, rgba(10,8,20,.94) 100%), var(--img); background-size: cover; background-position: center; }
.nu-csrail__eyebrow { color: #F0619F; }

/* Clients grid: category labels were 9.9px at 70% opacity */
.nu-clients__grid small { opacity: 1; color: var(--ink-soft); }
.nu-clients__grid li { color: var(--ink); }

/* Linked feature cards (Insights hub) */
a.nu-feature--link { display: block; text-decoration: none; color: inherit; transition: border-color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease); }
a.nu-feature--link:hover { border-color: var(--ink); transform: translateY(-3px); box-shadow: 0 14px 30px rgba(32,27,81,.08); }
a.nu-feature--link h3 { color: var(--ink); }
.nu-feature__no { text-transform: uppercase; }
.nu-feature__more { display: inline-block; margin-top: 14px; font-family: var(--mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }

/* Contact (v2) */
.nu-contact { border-top: 1px solid var(--line); background: var(--cream); }
.nu-contact__in { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(48px, 8vh, 110px) clamp(20px, 4vw, 48px); display: grid; gap: clamp(40px, 6vw, 96px); }
@media (min-width: 900px) { .nu-contact__in { grid-template-columns: 1fr 1.1fr; align-items: start; } }
.nu-contact__next h2 { font-size: clamp(1.9rem, 3.5vw, 2.8rem); margin: 0 0 clamp(20px, 3vh, 32px); }
.nu-contact__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.nu-contact__steps li { border-top: 2px solid var(--accent); padding-top: 14px; }
.nu-contact__steps span { font-family: var(--mono); font-size: .78rem; letter-spacing: .2em; color: var(--accent); }
.nu-contact__steps strong { display: block; font-family: var(--display); font-size: clamp(1.4rem, 2.2vw, 1.8rem); letter-spacing: .03em; color: var(--ink); margin: 4px 0 2px; }
.nu-contact__steps p { margin: 0; color: var(--ink-soft); }
.nu-contact__direct { margin: 2rem 0 0; }
.nu-contact__direct a { color: var(--accent); font-weight: 700; display: inline-block; padding: 10px 0; }
.nu-contact__form { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: clamp(22px, 3vw, 40px); }
.nu-contact .nu-form { max-width: none; }
.nu-form label { display: grid; gap: 6px; }
.nu-form label span { font-size: .9rem; font-weight: 600; color: var(--ink); }
.nu-form input, .nu-form textarea { font-size: 16px; min-height: 48px; }
.nu-form button { border: 0; cursor: pointer; justify-self: start; min-height: 48px; font: inherit; font-weight: 700; }

/* Homepage crawlable layer (South Florida) under the cinematic sections */
.nu-home-found { background: var(--paper); }
.nu-home-found .nu-page-prose { border-top: 0; }
.nu-home-found .nu-answer__label { margin-bottom: 1rem; }
.nu-home-found__lead { font-family: var(--serif); font-style: italic; font-size: clamp(1.2rem, 2vw, 1.5rem); line-height: 1.5; color: var(--ink); }
@media (min-width: 1040px) { .nu-related--7 .nu-related__grid { grid-template-columns: repeat(4, 1fr); } }
.nu-related__all { background: var(--ink) !important; border-color: var(--ink) !important; }
.nu-related__all span { color: #fff !important; }
.nu-related__all em { color: #F0619F !important; }
.nu-home-found__more { margin: 18px 0 0; }
.nu-home-found__more a { font-family: var(--mono); font-size: .82rem; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); text-decoration: none; display: inline-block; padding: 12px 0; }

/* Legal pages */
.nu-legal { max-width: 760px; margin: 0 auto; padding: clamp(24px, 4vh, 48px) clamp(20px, 4vw, 48px) clamp(64px, 10vh, 120px); }
.nu-legal h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); margin: 2.2rem 0 .6rem; }
.nu-legal p { color: var(--ink-soft); line-height: 1.75; margin: 0 0 1rem; }
.nu-legal a { color: var(--accent); }

/* Video pause button: visible only while an ambient video is in view (site.js toggles .is-off) */
.nu-vtoggle { transition: opacity .25s var(--ease), transform .18s var(--ease); }
.nu-vtoggle.is-off { opacity: 0; pointer-events: none; }

/* Footer socials (verified profiles only) */
.nu-foot__social { display: inline-flex; flex-wrap: wrap; gap: 0 24px; }

/* FAQ v2 — bigger questions, bold magenta plus disc that turns into an × (site-wide) */
.nu-cs-faq { margin: 0; padding: 0; border-top: 1px solid var(--line); }
.nu-cs-faq:last-of-type { border-bottom: 1px solid var(--line); }
.nu-cs-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: clamp(18px, 2.4vh, 26px) 0; font-weight: 800; font-size: clamp(1.12rem, 1.6vw, 1.38rem); line-height: 1.35; letter-spacing: -.005em; }
.nu-cs-faq summary::before, .nu-cs-faq[open] summary::before { content: none; }
.nu-cs-faq summary::after {
  content: ""; flex: none; width: 44px; height: 44px; border-radius: 50%;
  background: linear-gradient(#fff, #fff) center / 16px 3px no-repeat,
              linear-gradient(#fff, #fff) center / 3px 16px no-repeat, var(--accent);
  transition: transform .3s var(--ease), background-color .3s var(--ease);
}
.nu-cs-faq summary:hover::after { transform: scale(1.08); }
.nu-cs-faq[open] summary::after { transform: rotate(45deg); background-color: var(--ink); }
.nu-cs-faq p { margin: 0; padding: 0 64px clamp(20px, 2.6vh, 28px) 0; font-size: clamp(1rem, 1.2vw, 1.1rem); line-height: 1.7; }
.u-dark .nu-cs-faq summary, .nu-page-band .nu-cs-faq summary { color: var(--on-dark); }

/* Link cards v2 (cities, related services, hubs) — bolder type + arrow */
.nu-related > h2 { font-size: clamp(2rem, 4.5vw, 3.4rem); }
.nu-related__grid { gap: clamp(14px, 1.6vw, 22px); }
.nu-related__grid a { position: relative; gap: 10px; padding: clamp(24px, 2.6vw, 34px) clamp(22px, 2.4vw, 32px); padding-right: 76px; border-radius: 16px; border-width: 1.5px; }
.nu-related__grid span { font-size: clamp(1.45rem, 2.3vw, 2.05rem); line-height: 1.05; letter-spacing: .015em; }
.nu-related__grid em { font-size: .82rem; letter-spacing: .14em; }
.nu-related__grid a::after {
  content: ""; position: absolute; right: clamp(20px, 2vw, 28px); top: 50%; width: 40px; height: 40px; margin-top: -20px; border-radius: 50%;
  background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 20px no-repeat;
  transition: transform .2s var(--ease);
}
.nu-related__grid a:hover { background: var(--ink); border-color: var(--ink); }
.nu-related__grid a:hover span { color: #fff; }
.nu-related__grid a:hover em { color: #F0619F; }
.nu-related__grid a:hover::after { transform: translateX(4px); }
.nu-related__all::after { background-color: #fff !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23CC1C6C' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") !important; }
.nu-home-found__more a { font-size: .95rem; font-weight: 700; }

/* Work-that-sells: real screenshots need a stronger caption scrim; 9 cards → longer pin */
@media (min-width: 861px) and (prefers-reduced-motion: no-preference) { .nu-make { height: 520vh; } }
/* screenshot on top, caption strip below — captions never sit on the client's own headline */
.nu-make__cover { aspect-ratio: auto; display: block; padding: 0; background: #17123d; border: 1px solid rgba(255,255,255,.1); }
.nu-make__cover::before { content: ""; display: block; aspect-ratio: 4 / 3; background: var(--img) top center / cover no-repeat; }
.nu-make__cover > div { padding: 16px 20px 18px; }
.nu-make__cover strong { margin-bottom: 4px; }

/* Case studies v2 */
.nu-cs .nu-crumbs + .nu-cs-hero { padding-top: clamp(24px, 3.5vh, 46px); }
.nu-cs-hero + .nu-answer { padding-top: clamp(28px, 5vh, 56px); }
.nu-cs-item__media img { border-radius: 14px; }
.nu-cs-item__metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 28px; }
@media (min-width: 1200px) { .nu-cs-item__metrics:has(> li:nth-child(4)) { grid-template-columns: repeat(4, minmax(0, 1fr)); } .nu-cs-item__metrics:not(:has(> li:nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.nu-cs-item__metrics li { border-top: 2px solid var(--accent); padding-top: 12px; }
.nu-cs-item__metrics span { display: block; margin-top: 6px; line-height: 1.4; }
.nu-cs-note { max-width: var(--wrap-wide); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px) clamp(32px, 5vh, 56px); font-size: .9rem; color: var(--ink-soft); }

/* ============================================================
   NX — interior pages v2 (services + hubs), 2026-10-08
   Dark cinematic hero with the answer up front, numbered chapters,
   sticky process band, verified proof, full service map.
   ============================================================ */
.nx { overflow-x: clip; }
body.nx-dark .nu-header:not(.is-scrolled) .nu-logo--color { display: none; }
body.nx-dark .nu-header:not(.is-scrolled) .nu-logo--white { display: block; }
body.nx-dark .nu-header:not(.is-scrolled) .nu-cta { background: #fff; color: var(--ink) !important; box-shadow: 0 8px 22px rgba(0,0,0,.28); }
body.nx-dark .nu-header:not(.is-scrolled) .nu-burger span { background: #fff; box-shadow: 0 1px 6px rgba(0,0,0,.35); }

/* hero */
.nx-hero { position: relative; isolation: isolate; overflow: hidden; min-height: min(100svh, 1000px); display: flex; flex-direction: column; justify-content: flex-end; background: #120e33; color: var(--on-dark); }
.nx-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -3; transform: scale(1.08); animation: nx-kb 16s var(--ease-out) forwards; }
@keyframes nx-kb { to { transform: scale(1); } }
.nx-hero__scrim { position: absolute; inset: 0; z-index: -2;
  background: linear-gradient(90deg, rgba(18,14,51,.95) 0%, rgba(18,14,51,.8) 42%, rgba(18,14,51,.3) 100%), linear-gradient(0deg, #120e33 0%, rgba(18,14,51,0) 50%); }
.nx-hero__grain { position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .14; mix-blend-mode: overlay;
  background-image: radial-gradient(rgba(255,255,255,.55) 1px, transparent 1px); background-size: 3px 3px; }
.nx-hero__in { width: 100%; max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(120px, 17vh, 180px) clamp(20px, 4vw, 48px) clamp(36px, 5vw, 64px); box-sizing: border-box; }
.nx-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; margin: 0 0 clamp(28px, 6vh, 64px); font-family: var(--mono); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--on-dark-soft); }
.nx-crumbs a { display: inline-flex; align-items: center; min-height: 44px; color: var(--on-dark-soft); text-decoration: none; transition: color .2s; }
.nx-crumbs a:hover { color: #fff; }
.nx-crumbs [aria-current] { color: #fff; }
.nx-kicker { display: flex; align-items: center; gap: 14px; margin: 0 0 20px; font-family: var(--mono); font-size: .82rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.nx-kicker__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); animation: nx-pulse 2.4s var(--ease) infinite; }
@keyframes nx-pulse { 0% { box-shadow: 0 0 0 0 rgba(204,28,108,.6); } 70% { box-shadow: 0 0 0 12px rgba(204,28,108,0); } 100% { box-shadow: 0 0 0 0 rgba(204,28,108,0); } }
.nx-hero__title { margin: 0; max-width: 15ch; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(3.3rem, 9vw, 9.6rem); line-height: .88; letter-spacing: .004em; color: #fff; text-wrap: balance; }
.nx-hero__title .u-serif { color: var(--gold); font-size: .9em; }
.nx-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 540px); gap: clamp(28px, 5vw, 88px); align-items: start; margin-top: clamp(28px, 4vw, 52px); }
.nx-hero__lead { margin: 6px 0 28px; max-width: 42ch; font-size: clamp(1.1rem, 1.4vw, 1.35rem); line-height: 1.55; color: rgba(245,244,250,.88); }
.nx-hero__actions, .nx-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.nx-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 30px; border-radius: 999px; font-weight: 800; font-size: 1.02rem; text-decoration: none; transition: transform .25s var(--ease-out), background .25s, color .25s, border-color .25s; }
.nx-btn--accent { background: var(--accent); color: #fff; }
.nx-btn--accent:hover { background: #fff; color: var(--ink); transform: translateY(-2px); }
.nx-btn--ghost { border: 1.5px solid rgba(255,255,255,.42); color: #fff; }
.nx-btn--ghost:hover { border-color: #fff; background: rgba(255,255,255,.08); transform: translateY(-2px); }
.nx-answer { position: relative; padding: clamp(24px, 2.6vw, 34px) clamp(24px, 2.6vw, 34px) clamp(24px, 2.6vw, 34px) clamp(28px, 3vw, 40px); border-radius: 22px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.nx-answer::before { content: ""; position: absolute; left: 0; top: 26px; bottom: 26px; width: 3px; border-radius: 0 3px 3px 0; background: linear-gradient(var(--accent), var(--gold)); }
.nx-answer__label { margin: 0 0 12px; font-family: var(--mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.nx-answer__text { margin: 0; font-family: var(--serif); font-size: clamp(1.06rem, 1.25vw, 1.24rem); line-height: 1.5; color: #fff; }
.nx-index { position: relative; border-top: 1px solid rgba(255,255,255,.12); background: rgba(12,9,38,.55); }
.nx-index__in { max-width: var(--wrap-wide); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); display: flex; flex-wrap: wrap; gap: 0 clamp(18px, 3vw, 44px); box-sizing: border-box; }
.nx-index a { display: inline-flex; align-items: center; gap: 10px; min-height: 58px; font-family: var(--mono); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--on-dark-soft); text-decoration: none; border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; }
.nx-index a span { color: var(--gold); }
.nx-index a:hover { color: #fff; border-bottom-color: var(--accent); }

/* chapters */
.nx-ch { padding: clamp(80px, 10vw, 150px) 0; scroll-margin-top: 70px; }
.nx-ch + .nx-ch { border-top: 1px solid var(--line); }
.nx-ch__in { max-width: var(--wrap-wide); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); box-sizing: border-box; }
.nx-ch__label { display: flex; align-items: center; gap: 14px; margin: 0 0 clamp(24px, 3vw, 40px); font-family: var(--mono); font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); }
.nx-ch__label span { color: var(--accent); font-weight: 700; }
.nx-ch__label::after { content: ""; width: 72px; height: 1px; background: currentColor; opacity: .35; }
.nx-h2 { margin: 0 0 clamp(32px, 4vw, 60px); max-width: 17ch; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(2.6rem, 6vw, 5.8rem); line-height: .92; letter-spacing: .004em; color: var(--ink); text-wrap: balance; }
.nx-h2 .u-serif { color: var(--accent); }
.nx-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 110px); align-items: start; }
.nx-split .nx-h2 { margin: 0; position: sticky; top: 110px; }
.nx-prose p { margin: 0 0 1.2em; font-size: clamp(1.03rem, 1.15vw, 1.15rem); line-height: 1.75; color: var(--ink-soft); }
.nx-prose .nx-lede { font-family: var(--serif); font-size: clamp(1.4rem, 2.1vw, 1.95rem); line-height: 1.38; color: var(--ink); }
.nx-prose p:last-child { margin-bottom: 0; }

/* why it matters: editorial rows */
.nx-rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.nx-row { position: relative; display: grid; grid-template-columns: clamp(80px, 11vw, 170px) minmax(0, 1fr) minmax(0, 1.3fr); gap: clamp(16px, 3vw, 48px); align-items: baseline; padding: clamp(26px, 3vw, 42px) 0; border-bottom: 1px solid var(--line); }
.nx-row::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease-out); }
.nx-row:hover::before { transform: scaleX(1); }
.nx-row__no { font-family: var(--display); font-size: clamp(3rem, 6vw, 5.6rem); line-height: .8; color: transparent; -webkit-text-stroke: 1.5px var(--ink); transition: color .35s, -webkit-text-stroke-color .35s; }
.nx-row:hover .nx-row__no { color: var(--accent); -webkit-text-stroke-color: var(--accent); }
.nx-row h3 { margin: 0; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(1.7rem, 2.5vw, 2.4rem); line-height: 1; color: var(--ink); }
.nx-row p { margin: 0; font-size: 1.06rem; line-height: 1.68; color: var(--ink-soft); }

/* process band */
.nx-band { position: relative; overflow: clip; padding: clamp(90px, 11vw, 160px) 0; background: radial-gradient(55vw 55vw at 100% 0%, rgba(204,28,108,.32), transparent 62%), var(--ink); color: var(--on-dark); scroll-margin-top: 70px; }
.nx-band__in { position: relative; max-width: var(--wrap-wide); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(44px, 7vw, 130px); box-sizing: border-box; }
.nx-band__head { position: sticky; top: 110px; align-self: start; }
.nx-band .nx-ch__label { color: var(--on-dark-soft); }
.nx-band .nx-ch__label span { color: var(--gold); }
.nx-band .nx-h2 { color: #fff; margin-bottom: 24px; }
.nx-band .nx-h2 .u-serif { color: var(--gold); }
.nx-band__note { margin: 0; max-width: 36ch; font-size: 1.06rem; line-height: 1.6; color: var(--on-dark-soft); }
.nx-steps { list-style: none; margin: 0; padding: 0 0 0 clamp(30px, 3vw, 48px); border-left: 1px solid rgba(255,255,255,.2); }
.nx-step { position: relative; padding: 0 0 clamp(52px, 6vw, 90px); }
.nx-step:last-child { padding-bottom: 0; }
.nx-step::before { content: ""; position: absolute; left: calc(-1 * clamp(30px, 3vw, 48px) - 8px); top: 4px; width: 15px; height: 15px; border-radius: 50%; box-sizing: border-box; background: var(--ink); border: 2px solid var(--gold); transition: background .5s, border-color .5s, box-shadow .5s; }
.nx-step.is-in::before, html:not(.nu-anim) .nx-step::before { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 7px rgba(204,28,108,.25); }
.nx-step__no { font-family: var(--mono); font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.nx-step h3 { margin: 12px 0 14px; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(2.3rem, 4.2vw, 3.8rem); line-height: .95; color: #fff; }
.nx-step p { margin: 0; max-width: 52ch; font-size: 1.08rem; line-height: 1.7; color: rgba(245,244,250,.8); }

/* what you get: cards */
.nx-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
.nx-card { position: relative; overflow: hidden; display: flex; flex-direction: column; min-height: 280px; padding: clamp(28px, 3vw, 42px); border-radius: 24px; background: #fff; border: 1px solid var(--line); transition: transform .4s var(--ease-out), box-shadow .4s, border-color .4s; }
.nx-card::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: linear-gradient(90deg, var(--accent), var(--gold)); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease-out); }
.nx-card:hover { transform: translateY(-6px); border-color: transparent; box-shadow: 0 26px 56px rgba(32,27,81,.13); }
.nx-card:hover::after { transform: scaleX(1); }
.nx-card__no { margin-bottom: auto; padding-bottom: 44px; font-family: var(--display); font-size: 4.4rem; line-height: .8; color: var(--accent); }
.nx-card h3 { margin: 0 0 12px; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(1.75rem, 2.2vw, 2.15rem); line-height: 1; color: var(--ink); }
.nx-card p { margin: 0; font-size: 1.02rem; line-height: 1.65; color: var(--ink-soft); }

/* hub: where to start router */
.nx-routes { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.nx-route { position: relative; display: grid; background: linear-gradient(var(--ink), var(--ink)) no-repeat left bottom / 100% 0%; transition: color .4s, background-size .5s var(--ease-out); grid-template-columns: 64px minmax(0, 1.35fr) minmax(0, 1fr) 58px; gap: 20px; align-items: center; padding: clamp(22px, 2.6vw, 34px) clamp(10px, 1.6vw, 22px); border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.nx-route:hover, .nx-route:focus-visible { color: #fff; }
.nx-route:hover, .nx-route:focus-visible { background-size: 100% 100%; }
.nx-route__no { font-family: var(--mono); font-size: .85rem; color: var(--accent); }
.nx-route:hover .nx-route__no { color: var(--gold); }
.nx-route__name { font-family: var(--display); font-size: clamp(2rem, 4.2vw, 3.9rem); line-height: .95; text-transform: uppercase; }
.nx-route__sub { font-size: 1.05rem; line-height: 1.5; color: var(--ink-soft); transition: color .4s; }
.nx-route:hover .nx-route__sub { color: var(--on-dark-soft); }
.nx-route__go, .nx-pairs a::after { position: relative; width: 58px; height: 58px; border-radius: 50%; justify-self: end; background: var(--accent); transition: transform .45s var(--ease-out), background .3s; }
.nx-route__go::after, .nx-pairs a::before { content: ""; position: absolute; inset: 0; background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 22px no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 22px no-repeat; }
.nx-route:hover .nx-route__go { transform: rotate(-45deg); }

/* results */
.nx-proof { padding: clamp(90px, 11vw, 160px) 0; background: #120e33; color: var(--on-dark); scroll-margin-top: 70px; }
.nx-proof .nx-ch__label { color: var(--on-dark-soft); }
.nx-proof .nx-ch__label span { color: var(--gold); }
.nx-proof__head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; align-items: end; margin-bottom: clamp(36px, 4vw, 60px); }
.nx-proof__head .nx-h2 { margin: 0; color: #fff; }
.nx-proof__head .nx-h2 .u-serif { color: var(--gold); }
.nx-proof__head p { margin: 0; max-width: 44ch; font-size: 1.08rem; line-height: 1.6; color: var(--on-dark-soft); }
.nx-cases { list-style: none; margin: 0 0 44px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); }
.nx-cases--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nx-cases--1 { grid-template-columns: minmax(0, 760px); }
.nx-case a { display: flex; flex-direction: column; height: 100%; overflow: hidden; border-radius: 24px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.12); color: inherit; text-decoration: none; transition: transform .45s var(--ease-out), border-color .3s, background .3s; }
.nx-case a:hover { transform: translateY(-8px); border-color: rgba(240,97,159,.6); background: rgba(255,255,255,.07); }
.nx-case__shot { display: block; aspect-ratio: 16 / 11; overflow: hidden; background: #0c0926; }
.nx-case__shot img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform 1.4s var(--ease-out); }
.nx-case a:hover .nx-case__shot img { transform: scale(1.05); }
.nx-case__body { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: clamp(22px, 2.4vw, 32px); }
.nx-case__eyebrow { font-family: var(--mono); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); }
.nx-case__name { font-family: var(--display); font-size: clamp(1.9rem, 2.6vw, 2.5rem); line-height: .95; text-transform: uppercase; color: #fff; }
.nx-case__sub { font-size: 1rem; line-height: 1.55; color: var(--on-dark-soft); }
.nx-case__metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: auto; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.12); }
.nx-case__metrics span { display: flex; flex-direction: column; gap: 6px; font-size: .84rem; line-height: 1.35; color: var(--on-dark-soft); }
.nx-case__metrics strong { font-family: var(--display); font-weight: 400; font-size: clamp(2.1rem, 2.8vw, 2.7rem); line-height: .9; color: #fff; }
.nx-case__more { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-weight: 800; color: #fff; }
.nx-case__more::after { content: "\2192"; color: var(--gold); transition: transform .3s var(--ease-out); }
.nx-case a:hover .nx-case__more::after { transform: translateX(6px); }
.nx-link { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--mono); font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: #fff; text-decoration: none; border-bottom: 1px solid var(--gold); }
.nx-link::after { content: "\2192"; margin-left: 10px; color: var(--gold); }

/* faq */
.nx-faq { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr); gap: clamp(32px, 6vw, 100px); align-items: start; }
.nx-faq .nx-h2 { margin: 0; position: sticky; top: 110px; }

/* pairs well with */
.nx-ch--pairs { padding-top: 0; }
.nx-ch + .nx-ch--pairs { border-top: 0; }
.nx-ch--pairs .nx-h2 { font-size: clamp(2.2rem, 4vw, 3.6rem); }
.nx-pairs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.nx-pairs a { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 10px; min-height: 150px; padding: 28px 96px 28px 30px; border-radius: 22px; background: var(--cream); text-decoration: none; transition: background .35s, transform .35s var(--ease-out); box-sizing: border-box; }
.nx-pairs a::after { content: ""; position: absolute; right: 26px; top: 50%; width: 48px; height: 48px; margin-top: -24px; }
.nx-pairs a::before { inset: auto; right: 26px; top: 50%; width: 48px; height: 48px; margin-top: -24px; z-index: 1; -webkit-mask-size: 20px; mask-size: 20px; }
.nx-pairs a:hover { background: var(--ink); transform: translateY(-4px); }
.nx-pairs a:hover::after { transform: rotate(-45deg); }
.nx-pairs span { font-family: var(--display); font-size: clamp(1.7rem, 2.2vw, 2.1rem); line-height: 1; text-transform: uppercase; color: var(--ink); transition: color .35s; }
.nx-pairs em { font-style: normal; font-family: var(--mono); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); transition: color .35s; }
.nx-pairs a:hover span { color: #fff; }
.nx-pairs a:hover em { color: var(--gold); }

/* service map */
.nx-map { padding: clamp(80px, 9vw, 130px) 0; background: var(--cream); }
.nx-map__head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; align-items: end; margin-bottom: clamp(36px, 4vw, 56px); }
.nx-map__head .nx-h2 { margin: 0; }
.nx-map__head p { margin: 0; max-width: 46ch; font-size: 1.08rem; line-height: 1.6; color: var(--ink-soft); }
.nx-map__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 clamp(16px, 2.4vw, 36px); border-top: 1px solid var(--ink); }
.nx-map__col { padding: 22px 0 26px; border-bottom: 1px solid var(--line); }
.nx-map__hub { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-family: var(--display); font-size: clamp(1.5rem, 1.9vw, 1.85rem); line-height: 1; text-transform: uppercase; color: var(--ink); text-decoration: none; transition: color .2s; }
.nx-map__hub:hover { color: var(--accent); }
.nx-map__col.is-current .nx-map__hub::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.nx-map__col ul { list-style: none; margin: 4px 0 0; padding: 0; }
.nx-map__col li a { display: flex; align-items: center; min-height: 44px; font-size: 1rem; line-height: 1.3; color: var(--ink-soft); text-decoration: none; transition: color .2s, transform .2s; }
.nx-map__col li a:hover { color: var(--accent); transform: translateX(4px); }
.nx-map [aria-current] { color: var(--accent) !important; font-weight: 800; }
.nx-map__foot { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: clamp(32px, 4vw, 48px); }
.nx-map__label { margin: 0 0 12px; font-family: var(--mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); }
.nx-map__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nx-map__chips a { display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--ink); font-weight: 700; font-size: .96rem; text-decoration: none; transition: background .25s, color .25s, border-color .25s; }
.nx-map__chips a:hover { background: var(--ink); border-color: var(--ink); color: #fff; }

/* cta */
.nx-cta { position: relative; overflow: clip; padding: 0 0 clamp(90px, 10vw, 140px); background: var(--ink); color: #fff; text-align: center; }
.nx-cta__marquee { overflow: hidden; white-space: nowrap; padding: clamp(18px, 2.2vw, 30px) 0; margin-bottom: clamp(64px, 8vw, 110px); border-bottom: 1px solid rgba(255,255,255,.1); }
.nx-cta__marquee div { display: inline-block; font-family: var(--display); font-size: clamp(3rem, 8vw, 7.6rem); line-height: 1; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.38); animation: nx-marquee 48s linear infinite; }
.nx-cta__marquee i { display: inline-block; width: .32em; height: .32em; margin: 0 .45em; border-radius: 50%; background: var(--accent); vertical-align: middle; }
@keyframes nx-marquee { to { transform: translateX(-50%); } }
.nx-cta__in { max-width: 1000px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); }
.nx-cta__title { margin: 0 0 22px; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(2.8rem, 7vw, 6.6rem); line-height: .9; color: #fff; text-wrap: balance; }
.nx-cta__title .u-serif { color: var(--gold); }
.nx-cta p { margin: 0 auto 34px; max-width: 46ch; font-size: 1.15rem; line-height: 1.6; color: var(--on-dark-soft); }
.nx-cta__actions { justify-content: center; }

@media (max-width: 1100px) {
  .nx-cases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nx-map__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .nx-hero { min-height: 0; }
  .nx-hero__grid, .nx-split, .nx-band__in, .nx-faq, .nx-proof__head, .nx-map__head, .nx-map__foot { grid-template-columns: minmax(0, 1fr); }
  .nx-split .nx-h2, .nx-band__head, .nx-faq .nx-h2 { position: static; }
  .nx-row { grid-template-columns: 64px minmax(0, 1fr); }
  .nx-row p { grid-column: 2; }
  .nx-route { grid-template-columns: minmax(0, 1fr) 48px; gap: 8px 16px; }
  .nx-route__no { display: none; }
  .nx-route__sub { grid-column: 1; grid-row: 2; }
  .nx-route__go { grid-column: 2; grid-row: 1 / span 2; width: 48px; height: 48px; }
}
@media (max-width: 700px) {
  .nx-index { display: none; }
  .nx-hero__in { padding-top: 110px; }
  .nx-hero__title { font-size: clamp(3rem, 14vw, 4.6rem); }
  .nx-btn { flex: 1 1 auto; }
  .nx-cases, .nx-cases--2 { grid-template-columns: minmax(0, 1fr); }
  .nx-map__grid { grid-template-columns: minmax(0, 1fr); }
  .nx-card { min-height: 0; }
  .nx-card__no { padding-bottom: 28px; font-size: 3.4rem; }
  .nx-pairs a { padding-right: 88px; }
}
@media (prefers-reduced-motion: reduce) {
  .nx-hero__bg, .nx-cta__marquee div, .nx-kicker__dot { animation: none; }
  .nx-hero__bg { transform: none; }
}

/* NX: imageless heroes, city areas, linked cards, article byline */
.nx-hero:not(:has(.nx-hero__bg)) { background:
  radial-gradient(60% 80% at 85% 20%, rgba(204,28,108,.42), transparent 60%),
  radial-gradient(50% 60% at 10% 100%, rgba(240,97,159,.18), transparent 60%),
  linear-gradient(160deg, #1d1650 0%, #120e33 60%); }
.nx-hero:not(:has(.nx-hero__bg)) .nx-hero__scrim { display: none; }
.nx-hero:not(:has(.nx-hero__bg))::after { content: ""; position: absolute; z-index: -1; right: 3vw; top: 14%; width: min(40vw, 560px); aspect-ratio: 1; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.12); box-shadow: 0 0 0 70px rgba(255,255,255,.025), 0 0 0 140px rgba(255,255,255,.02); pointer-events: none; }
.nx-areas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.nx-areas li { display: inline-flex; align-items: center; min-height: 56px; padding: 0 26px; border-radius: 999px; background: #fff; border: 1px solid var(--line);
  font-family: var(--display); font-size: clamp(1.3rem, 1.8vw, 1.7rem); text-transform: uppercase; color: var(--ink); transition: background .3s, color .3s, transform .3s var(--ease-out); }
.nx-areas li:hover { background: var(--ink); color: #fff; transform: translateY(-3px); }
.nx-card--link { padding: 0; }
.nx-card--link > a { display: flex; flex-direction: column; height: 100%; padding: clamp(28px, 3vw, 42px); color: inherit; text-decoration: none; box-sizing: border-box; }
.nx-card__more { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 18px; font-weight: 800; color: var(--accent); }
.nx-card__more::after { content: "\2192"; transition: transform .3s var(--ease-out); }
.nx-card--link:hover .nx-card__more::after { transform: translateX(6px); }
.nx-byline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 18px; font-size: .95rem; color: var(--on-dark-soft); }
.nx-byline strong { color: #fff; }
.nx-byline__dot { width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--gold)); }
.nx-byline span + span::before { content: "\00b7"; margin-right: 14px; }
.nx-byline__dot + strong::before { content: none; }
@media (max-width: 700px) { .nx-hero:not(:has(.nx-hero__bg))::after { display: none; } }

/* NX local pages (service x area engine) */
.nx-h2--sm { font-size: clamp(2.2rem, 4.2vw, 3.9rem); max-width: 18ch; }
.nx-intro { max-width: 62ch; margin: -12px 0 clamp(28px, 3vw, 44px); font-size: clamp(1.05rem, 1.2vw, 1.2rem); line-height: 1.7; color: var(--ink-soft); }
.nx-prose h3 { margin: 1.6em 0 .5em; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(1.4rem, 1.8vw, 1.75rem); line-height: 1.05; color: var(--ink); }
.nx-prose ul, .nx-prose ol { margin: 0 0 1.3em; padding: 0; list-style: none; counter-reset: nxo; }
.nx-prose li { position: relative; margin: 0 0 .7em; padding-left: 30px; font-size: clamp(1.02rem, 1.12vw, 1.12rem); line-height: 1.65; color: var(--ink-soft); }
.nx-prose ul > li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.nx-prose ol > li { counter-increment: nxo; }
.nx-prose ol > li::before { content: counter(nxo, decimal-leading-zero); position: absolute; left: 0; top: .15em; font-family: var(--mono); font-size: .8rem; color: var(--accent); font-weight: 700; }
.nx-prose a { color: var(--accent); font-weight: 700; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.nx-prose a:hover { color: var(--ink); }
.nx-prose strong { color: var(--ink); }
.nx-callout { position: relative; margin: 1.4em 0 !important; padding: 22px 24px 22px 28px; border-radius: 16px; background: var(--cream); color: var(--ink) !important; font-family: var(--serif); font-size: clamp(1.1rem, 1.4vw, 1.3rem) !important; line-height: 1.5 !important; }
.nx-callout::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 3px; border-radius: 0 3px 3px 0; background: var(--accent); }
.nx-table { margin: 0 0 1.4em; overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.nx-table table { width: 100%; border-collapse: collapse; font-size: .98rem; }
.nx-table th { padding: 14px 16px; text-align: left; font-family: var(--mono); font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: var(--ink); }
.nx-table td { padding: 14px 16px; border-top: 1px solid var(--line); color: var(--ink-soft); line-height: 1.5; vertical-align: top; }
.nx-table td:first-child { color: var(--ink); font-weight: 700; }
.nx-fig { margin: 32px 0 0; border-radius: 22px; overflow: hidden; aspect-ratio: 16 / 10; background: var(--ink); }
.nx-fig img { display: block; width: 100%; height: 100%; object-fit: cover; }
.nx-split > div:first-child .nx-h2 { position: static; }
.nx-split > div:first-child { position: sticky; top: 110px; align-self: start; }
.nx-areas--sm { margin-top: 24px; gap: 8px; }
.nx-areas--sm li { min-height: 44px; padding: 0 18px; font-size: 1.1rem; }
.nx-citylist { columns: 3 200px; column-gap: 24px; }
.nx-citylist li { break-inside: avoid; margin-bottom: 0; padding-left: 0; }
.nx-citylist li::before { display: none; }
.nx-citylist a { display: inline-flex; align-items: center; min-height: 44px; }
.nx-near { margin-top: 36px; grid-template-columns: 1fr; }
@media (max-width: 900px) { .nx-split > div:first-child { position: static; } }
.nu-foot__nap { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; margin: 22px 0 0; font-size: .98rem; color: var(--on-dark-soft); }
.nu-foot__nap a { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--display); font-size: 1.7rem; letter-spacing: .02em; color: #fff; text-decoration: none; }
.nu-foot__nap a:hover { color: var(--gold); }

/* ============================================================
   SX — signature kit ported from 360 Narrative (2026-10-08)
   badge ring, scroll-boosted marquee, gradient words, word fill,
   count-up gradient stats, practice orbit, CTA glow, progress line
   ============================================================ */
:root { --grad: linear-gradient(100deg, #3d2f9e 0%, #cc1c6c 58%, #e8508f 100%); --grad-hi: linear-gradient(100deg, #9b8cff 0%, #f0619f 52%, #ff9a6b 100%); }
.nx .u-serif, .nu-home-found .u-serif, .nu-cs .u-serif, .sx-grad { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent !important; padding-right: .08em; }
.nx-hero .u-serif, .nx-band .u-serif, .nx-proof .u-serif, .nx-cta .u-serif, .sx-dark .u-serif, .sx-orbit .u-serif { background-image: var(--grad-hi); }
/* progress line */
.sx-progress { position: fixed; left: 0; right: 0; top: 0; height: 3px; z-index: 120; pointer-events: none; }
.sx-progress i { display: block; height: 100%; background: var(--grad-hi); transform: scaleX(0); transform-origin: left; }
/* badge ring */
.sx-badge { position: absolute; right: clamp(20px, 4vw, 48px); top: clamp(110px, 16vh, 160px); width: clamp(120px, 12vw, 180px); aspect-ratio: 1; z-index: 2; display: grid; place-items: center; pointer-events: none; }
.sx-badge svg { position: absolute; inset: 0; width: 100%; height: 100%; animation: sx-spin 24s linear infinite; overflow: visible; }
.sx-badge text { font: 700 11.5px var(--mono); letter-spacing: .14em; fill: rgba(255,255,255,.85); }
.sx-badge b { font-family: var(--display); font-weight: 400; font-size: clamp(2.8rem, 4.6vw, 4.4rem); line-height: 1; background: var(--grad-hi); -webkit-background-clip: text; background-clip: text; color: transparent; }
@keyframes sx-spin { to { transform: rotate(360deg); } }
@media (max-width: 1000px) { .sx-badge { display: none; } }
/* marquee */
.sx-ticker { background: #0f0b2b; color: #fff; padding: clamp(14px, 1.8vw, 24px) 0; border-top: 1px solid rgba(255,255,255,.08); overflow: hidden; }
.sx-marquee { overflow: hidden; }
.sx-marquee__track { display: flex; align-items: center; width: max-content; animation: sx-slide 52s linear infinite; will-change: transform; }
.sx-marquee__track span { white-space: nowrap; font-family: var(--display); font-size: clamp(2.4rem, 5.4vw, 5.2rem); line-height: 1.05; text-transform: uppercase; letter-spacing: .01em; }
.sx-marquee__track span:nth-of-type(even) { color: transparent; -webkit-text-stroke: 1.4px rgba(255,255,255,.55); }
.sx-marquee__track i { flex: none; width: .3em; height: .3em; margin: 0 .55em; border-radius: 50%; background: var(--grad-hi); }
@keyframes sx-slide { to { transform: translateX(-50%); } }
/* word fill */
[data-words] .w { opacity: .16; transition: opacity .45s ease; }
[data-words] .w.on { opacity: 1; }
/* gradient stats */
.sx-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); padding: clamp(36px, 4vw, 56px) 0 0; border-top: 1.5px solid var(--line); }
.sx-stat b { display: block; font-family: var(--display); font-weight: 400; font-size: clamp(3.6rem, 8vw, 8.4rem); line-height: .88; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; }
.sx-stat > span { display: block; margin-top: 14px; max-width: 22ch; font-weight: 700; font-size: clamp(1rem, 1.3vw, 1.2rem); line-height: 1.35; color: var(--ink); }
.sx-dark .sx-stats { border-top-color: rgba(255,255,255,.14); }
.sx-dark .sx-stat b { background-image: var(--grad-hi); }
.sx-dark .sx-stat > span { color: var(--on-dark); }
@media (max-width: 900px) { .sx-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* orbit */
.sx-orbit { position: relative; overflow: hidden; padding: clamp(90px, 11vw, 170px) 0; background: #120e33; color: #fff; }
.sx-orbit::before { content: ""; position: absolute; left: -12%; top: 18%; width: 70%; aspect-ratio: 1; background: radial-gradient(closest-side, rgba(204,28,108,.32), transparent); pointer-events: none; }
.sx-orbit__in { position: relative; max-width: var(--wrap-wide); margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); box-sizing: border-box; }
.sx-orbit__head { margin-bottom: clamp(56px, 7vw, 110px); }
.sx-orbit__head .nx-h2 { color: #fff; margin: 0; }
.sx-orbit__hint { margin: 18px 0 0; color: var(--on-dark-soft); font-size: 1rem; }
.sx-orbit__stage { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 130px); align-items: center; }
.sx-orbit__wheel { --rot: 0deg; position: relative; width: 100%; max-width: 620px; aspect-ratio: 1; container-type: inline-size; justify-self: center; touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; outline: none; }
.sx-orbit__wheel:focus-visible { box-shadow: 0 0 0 3px var(--gold); border-radius: 50%; }
.sx-orbit__wheel.dragging { cursor: grabbing; }
.sx-orbit__wheel::before { content: ""; position: absolute; inset: -5%; border-radius: 50%; border: 1px dashed rgba(255,255,255,.18); animation: sx-spin 90s linear infinite; }
.sx-orbit__wheel::after { content: ""; position: absolute; left: 50%; top: -2.2%; width: 2px; height: 5%; background: #fff; transform: translateX(-50%); border-radius: 2px; }
.sx-orbit__ring { position: absolute; inset: 0; }
.sx-orbit__ring::before { content: ""; position: absolute; inset: 0; border-radius: 50%; transform: rotate(var(--rot)); transition: transform 1s var(--ease-out);
  background: repeating-conic-gradient(from -0.4deg, rgba(255,255,255,.5) 0 .8deg, transparent .8deg 5deg);
  -webkit-mask: radial-gradient(closest-side, transparent 96.4%, #000 96.6%); mask: radial-gradient(closest-side, transparent 96.4%, #000 96.6%); }
.sx-orbit__ring::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.22); }
.sx-orbit__node { --step: calc(360deg / var(--n)); position: absolute; left: 50%; top: 50%; width: 13cqw; height: 13cqw; min-width: 44px; min-height: 44px; margin: -6.5cqw 0 0 -6.5cqw; padding: 0; border-radius: 50%;
  background: #1d1650; border: 1.5px solid rgba(255,255,255,.3); color: #fff; display: grid; place-items: center; font: 700 clamp(.8rem, 2.6cqw, 1.05rem)/1 var(--mono); cursor: pointer; z-index: 2;
  transform: rotate(calc(var(--i) * var(--step) + var(--rot))) translateY(-50cqw) rotate(calc(var(--i) * var(--step) * -1 - var(--rot)));
  transition: transform 1s var(--ease-out), background .4s, border-color .4s, scale .5s var(--ease-out); }
.sx-orbit__wheel.dragging .sx-orbit__ring::before, .sx-orbit__wheel.dragging .sx-orbit__node { transition-duration: 0s, .4s, .4s, .5s; }
.sx-orbit__node:hover { border-color: #fff; }
.sx-orbit__node.on { background: var(--grad); border-color: transparent; scale: 1.28; box-shadow: 0 0 0 8px rgba(204,28,108,.18), 0 14px 40px -8px rgba(204,28,108,.8); }
.sx-orbit__core { position: absolute; inset: 15%; border-radius: 50%; overflow: hidden; background: #0c0926; box-shadow: 0 40px 120px -30px rgba(204,28,108,.6); }
.sx-orbit__core img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.18); transition: opacity .9s ease, transform 1.4s var(--ease-out); pointer-events: none; -webkit-user-drag: none; }
.sx-orbit__core img.on { opacity: 1; transform: none; }
.sx-orbit__deg { position: absolute; left: 50%; bottom: 7%; transform: translateX(-50%); z-index: 3; padding: 10px 16px; border-radius: 999px; background: rgba(11,8,38,.65); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  font: 700 .82rem/1 var(--mono); letter-spacing: .2em; font-variant-numeric: tabular-nums; pointer-events: none; }
.sx-orbit__slides { display: grid; }
.sx-orbit__slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(26px); transition: opacity .5s ease, transform .7s var(--ease-out), visibility 0s .5s; }
.sx-orbit__slide.on { opacity: 1; visibility: visible; transform: none; transition-delay: .15s, .15s, 0s; }
.sx-orbit__num { display: block; margin-bottom: 18px; font: 700 .82rem/1 var(--mono); letter-spacing: .2em; color: var(--gold); }
.sx-orbit__slide h3 { margin: 0 0 18px; font-family: var(--display); font-weight: 400; text-transform: uppercase; font-size: clamp(2.6rem, 5.4vw, 5.4rem); line-height: .92; color: #fff; }
.sx-orbit__line { margin: 0 0 14px; font-family: var(--serif); font-style: italic; font-size: clamp(1.3rem, 1.9vw, 1.75rem); line-height: 1.3; background: var(--grad-hi); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sx-orbit__slide p { max-width: 48ch; color: rgba(245,244,250,.82); font-size: 1.06rem; line-height: 1.65; }
.sx-orbit__pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 0; padding: 0; list-style: none; }
.sx-orbit__pills a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.22); color: #fff; text-decoration: none; font-size: .92rem; font-weight: 700; transition: background .25s, border-color .25s; }
.sx-orbit__pills a:hover { background: rgba(255,255,255,.1); border-color: #fff; }
.sx-orbit__ctrl { display: flex; gap: 14px; margin-top: 34px; }
.sx-round { width: 54px; height: 54px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.35); background: transparent; color: #fff; display: grid; place-items: center; cursor: pointer; transition: background .25s, border-color .25s; }
.sx-round:hover { background: var(--accent); border-color: var(--accent); }
@media (max-width: 900px) { .sx-orbit__stage { grid-template-columns: minmax(0, 1fr); } .sx-orbit__wheel { max-width: min(440px, 84vw); } .sx-orbit__slide h3 { min-height: 1.9em; } }
/* CTA glow + magnetic */
.nx-cta, .nu-cs-cta { --mx: 50%; --my: 70%; isolation: isolate; }
.nx-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(40vw 40vw at var(--mx) var(--my), rgba(204,28,108,.5), rgba(61,47,158,.3) 45%, transparent 70%); pointer-events: none; }
.nx-cta__title { font-size: clamp(3.2rem, 10vw, 10rem); line-height: .86; }
.sx-mag { transition: transform .35s var(--ease-out); }
/* footer watermark */
.nu-foot__mark { display: block; margin: clamp(40px, 6vw, 80px) 0 0; font-family: var(--display); font-size: clamp(5rem, 24vw, 24rem); line-height: .78; letter-spacing: .01em; color: transparent; -webkit-text-stroke: 1.2px rgba(240,97,159,.28); text-align: center; user-select: none; pointer-events: none; white-space: nowrap; overflow: hidden; }
@media (prefers-reduced-motion: reduce) {
  .sx-badge svg, .sx-orbit__wheel::before { animation: none; }
  .sx-marquee__track { animation: none !important; }
  [data-words] .w { opacity: 1; }
}

/* SX part 2 — Goats + noth.in moves: smooth scroll, curtain footer, fold-in, horizontal process, giant wordmark */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
/* curtain: the page lifts off a fixed footer (desktop only, set by JS when the footer fits the viewport) */
.sx-curtain .nu-foot { position: sticky; bottom: 0; z-index: 0; }
.sx-curtain .sx-lift { position: relative; z-index: 1; border-radius: 0 0 clamp(28px, 3vw, 48px) clamp(28px, 3vw, 48px); overflow: clip; box-shadow: 0 40px 80px -20px rgba(0,0,0,.55); background: var(--paper); }
/* fold-in: scale + radius driven by --fs from site.js */
.sx-fold { scale: var(--fs, 1); transform-origin: 50% 100%; will-change: scale; }
/* hero image drifts slower than the page */
.nx-hero__bg { translate: 0 var(--py, 0px); }
/* horizontal process (desktop): the band pins and the steps travel sideways */
.nx-band.sx-h { padding: 0; }
.sx-h .nx-band__in { position: sticky; top: 0; height: 100vh; align-items: center; grid-template-columns: minmax(280px, .75fr) minmax(0, 2fr); overflow: hidden; }
.sx-h .nx-band__head { position: static; }
.sx-h .nx-steps { display: flex; gap: clamp(28px, 3vw, 48px); width: max-content; padding: 0; border-left: 0; will-change: transform; }
.sx-h .nx-step { width: clamp(320px, 30vw, 460px); padding: 36px 0 0; border-top: 1px solid rgba(255,255,255,.22); }
.sx-h .nx-step::before { left: 0; top: -8px; }
.sx-h .nx-step h3 { font-size: clamp(2.6rem, 4.4vw, 4.4rem); }
.sx-h .nx-band__bar { position: absolute; left: clamp(20px, 4vw, 48px); right: clamp(20px, 4vw, 48px); bottom: 7vh; height: 2px; background: rgba(255,255,255,.12); }
.sx-h .nx-band__bar i { display: block; height: 100%; background: var(--grad-hi); transform: scaleX(var(--hp, 0)); transform-origin: left; }
/* giant wordmark (noth.in) */
.nu-foot__mark { color: transparent; -webkit-text-stroke: 0; background: linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(240,97,159,.85) 100%); -webkit-background-clip: text; background-clip: text; line-height: .74; margin-top: clamp(30px, 5vw, 70px); }
@media (max-width: 700px) { .nu-foot__mark { font-size: 27vw; } }
.sx-home-stats { grid-column: 1 / -1; width: 100%; margin-top: clamp(36px, 4vw, 60px); }
.sx-orbit__wheel { margin-top: 8cqw; margin-bottom: 8cqw; }
@media (max-width: 900px) { .sx-orbit__head { margin-bottom: 24px; } .sx-orbit__wheel { margin-top: 12vw; margin-bottom: 10vw; } }
.sx-h .nx-band__in { padding-top: 96px; padding-bottom: 40px; box-sizing: border-box; }
.sx-h .nx-band__head { position: relative; z-index: 2; align-self: stretch; display: flex; flex-direction: column; justify-content: center; background: var(--ink); box-shadow: 60px 0 50px -10px var(--ink); padding-right: 24px; }
.sx-h .nx-steps { position: relative; z-index: 1; }
@media (min-width: 901px) { .nu-foot__mark { font-size: 15vw; margin-top: 24px; } }
.sx-h .nx-band__head { box-shadow: 60px 0 50px -10px var(--ink), -120px 0 0 0 var(--ink); }
.sx-h .nx-band__in { padding-top: 84px; padding-bottom: 24px; }
.sx-h .nx-band .nx-h2, .sx-h .nx-h2 { font-size: clamp(2.4rem, 4.6vw, 4.8rem); margin-bottom: 18px; }
@media (max-width: 700px) {
  .nx-table { overflow: visible; }
  .nx-table table { table-layout: fixed; font-size: .86rem; }
  .nx-table th, .nx-table td { padding: 10px 8px; overflow-wrap: anywhere; hyphens: auto; }
  .nx-table th { font-size: .78rem; letter-spacing: .02em; }
}

/* Footer ghost text (replaces the UNIFIED wordmark, 2026-10-08) */
.nu-foot__mark { background: none; -webkit-background-clip: border-box; background-clip: border-box; color: rgba(255,255,255,.035); -webkit-text-stroke: 1px rgba(255,255,255,.13); font-size: 8.6vw; line-height: .9; letter-spacing: .005em; white-space: nowrap; margin-top: clamp(30px, 4vw, 56px); }
.nu-foot__mark span { display: inline-block; }
@media (max-width: 700px) {
  .nu-foot__mark { font-size: 21vw; line-height: .86; white-space: normal; }
  .nu-foot__mark span { display: block; }
}

/* Case studies CTA subline: serif italic, larger (2026-10-08) */
.nu-cs-cta p { font-family: var(--serif); font-style: italic; font-size: clamp(1.35rem, 2.4vw, 2rem); line-height: 1.3; letter-spacing: 0; color: var(--on-dark); max-width: 26em; margin: 1.4rem auto 2.4rem; }

/* Footer: email removed; phone, address and nav bold + much larger (2026-10-08) */
.nu-foot__nap { flex-direction: column; align-items: flex-start; gap: 6px; margin-top: 0; font-weight: 700; font-size: clamp(1.15rem, 1.8vw, 1.5rem); color: #fff; line-height: 1.35; }
.nu-foot__nap a { font-size: clamp(2.6rem, 5.4vw, 4.6rem); font-weight: 400; line-height: 1; min-height: 0; margin-bottom: 8px; }
.nu-foot__cols { gap: 6px 36px; margin-top: clamp(40px, 6vh, 64px); }
.nu-foot__cols a { font-weight: 700; font-size: clamp(1.2rem, 1.9vw, 1.6rem); color: #fff; }
@media (max-width: 700px) {
  .nu-foot__cols { gap: 0 26px; }
}

/* Menu: everything larger (2026-10-08) */
.nu-menu__nav a { font-size: clamp(2.8rem, 7vh, 5rem); line-height: 1.08; }
.nu-menu__mega { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: clamp(18px, 2vw, 32px) clamp(18px, 2vw, 32px); }
.nu-menu__group-h { font-size: clamp(1.3rem, 1.6vw, 1.6rem); padding-bottom: 8px; margin-bottom: 8px; }
.nu-menu__group a:not(.nu-menu__group-h) { font-size: clamp(1rem, 1.1vw, 1.12rem); font-weight: 600; color: rgba(255,255,255,.82); padding: 5px 0; }
.nu-menu__col-h { font-size: .92rem; margin-bottom: 14px; }
.nu-menu__col a { font-size: clamp(1.1rem, 1.3vw, 1.3rem); font-weight: 600; color: rgba(255,255,255,.82); padding: 6px 0; }
.nu-menu__more { font-size: .9rem !important; }
@media (min-width: 960px) { .nu-menu__in { grid-template-columns: .8fr 1.6fr; } }

/* Pairs/related cards: equal width + height in every row (2026-10-08) */
.nx-pairs { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; }
.nx-pairs li { display: flex; }
.nx-pairs a { flex: 1; height: 100%; box-sizing: border-box; min-height: 168px; }
@media (max-width: 1000px) { .nx-pairs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .nx-pairs { grid-template-columns: 1fr; grid-auto-rows: auto; } .nx-pairs a { min-height: 128px; } }

/* E-E-A-T: reviewer byline in heroes + author card (2026-10-08) */
.nx-byline--rev { margin: 0 0 20px; }
.nx-byline--rev img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(255,255,255,.55); flex: none; }
.nx-byline--rev a { color: #fff; text-decoration: underline; text-decoration-color: rgba(255,255,255,.35); text-underline-offset: 3px; }
.nx-byline--rev a:hover { text-decoration-color: var(--accent); }
.nx-byline--rev img + span::before { content: none; }
.nx-byline--rev a + span::before { content: "\00b7"; margin-right: 14px; }
.nx-author { background: var(--paper); padding: clamp(64px, 8vw, 110px) clamp(20px, 4vw, 48px); border-top: 1px solid var(--line); }
.nx-author__in { max-width: 1080px; margin: 0 auto; display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); align-items: center; }
.nx-author__img { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 6px #fff, 0 0 0 7px var(--line); }
.nx-author__label { margin: 0 0 8px; font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.nx-author__name { margin: 0; font-family: var(--display); font-size: clamp(2.6rem, 4.6vw, 3.8rem); line-height: 1; text-transform: uppercase; color: var(--ink); }
.nx-author__role { margin: 8px 0 18px; font-family: var(--serif); font-style: italic; font-size: 1.25rem; color: var(--ink); }
.nx-author__body > p:not([class]) { margin: 0; font-size: 1.08rem; line-height: 1.65; color: var(--ink-soft); max-width: 62ch; }
.nx-author__links { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 0; }
.nx-author__links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 999px; border: 1.5px solid var(--ink); color: var(--ink); font-weight: 700; text-decoration: none; transition: background .2s, color .2s; }
.nx-author__links a:hover { background: var(--ink); color: #fff; }
@media (max-width: 700px) {
  .nx-author__in { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .nx-author__img { width: 140px; height: 140px; }
  .nx-author__links { justify-content: center; }
}
.nx-author--about { scroll-margin-top: 90px; }
.nx-author--about .nx-author__body > p:not([class]) + p:not([class]) { margin-top: 1em; }

/* Hero background loops (Higgsfield), fade in over the still once playing (2026-10-08) */
.nx-hero__vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -3; opacity: 0; transition: opacity 1.2s var(--ease); pointer-events: none; }
.nx-hero__vid.is-on { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .nx-hero__vid { display: none; } }
@media (max-width: 700px) {
  .nx-byline--rev { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 12px; row-gap: 0; align-items: center; font-size: .88rem; }
  .nx-byline--rev img { grid-row: span 3; }
  .nx-byline--rev > :not(img) { grid-column: 2; }
  .nx-byline--rev span + span::before, .nx-byline--rev a + span::before { content: none; }
  .nx-byline--rev > :last-child { opacity: .8; }
}

/* ============================================================
   NU-SPOT — commercial-led home hero ("The Review"), 2026-10-08
   ============================================================ */
.nu-spot { position: relative; min-height: 100svh; display: flex; align-items: flex-end; overflow: clip; background: #120e30; color: #fff; isolation: isolate; }
.nu-spot__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.nu-spot__veil { position: absolute; inset: 0; z-index: -1; background:
  linear-gradient(90deg, rgba(18,14,48,.82) 0%, rgba(18,14,48,.55) 38%, rgba(18,14,48,.08) 70%),
  linear-gradient(0deg, rgba(18,14,48,.85) 0%, rgba(18,14,48,0) 45%); }
.nu-spot__in { width: 100%; max-width: var(--wrap-wide); margin: 0 auto; padding: 140px clamp(20px, 4vw, 48px) clamp(48px, 8vh, 96px); }
.nu-spot__kicker { margin: 0 0 18px; font-family: var(--mono); font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: #f0a6c9; display: flex; align-items: center; gap: 10px; }
.nu-spot__kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 14px var(--accent); }
.nu-spot h1 { margin: 0; font-family: var(--display); font-weight: 400; font-size: clamp(3.6rem, 9.5vw, 9.5rem); line-height: .86; letter-spacing: .005em; text-transform: uppercase; max-width: 11ch; }
.nu-spot h1 em { text-transform: none; padding-right: .06em; }
.nu-spot__lead { margin: 22px 0 0; max-width: 40ch; font-size: clamp(1.08rem, 1.5vw, 1.35rem); line-height: 1.55; color: rgba(255,255,255,.9); }
.nu-spot__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; align-items: center; }
.nu-spot__play { display: inline-flex; align-items: center; gap: 12px; min-height: 52px; padding: 0 22px 0 8px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.55); background: rgba(255,255,255,.06); color: #fff; font: 700 1rem var(--body, Inter, sans-serif); cursor: pointer; backdrop-filter: blur(6px); transition: background .2s, border-color .2s; }
.nu-spot__play:hover { background: rgba(255,255,255,.14); border-color: #fff; }
.nu-spot__play i { width: 38px; height: 38px; border-radius: 50%; background: var(--accent); display: grid; place-items: center; box-shadow: 0 0 22px rgba(204,28,108,.7); }
.nu-spot__play i::after { content: ""; margin-left: 3px; border-style: solid; border-width: 7px 0 7px 11px; border-color: transparent transparent transparent #fff; }
.nu-spot__play span { opacity: .7; font-weight: 500; font-size: .85rem; }
.nu-spot__proof { margin: 28px 0 0; font-size: .92rem; letter-spacing: .04em; color: rgba(255,255,255,.72); }
.nu-spot__proof b { color: #fff; font-weight: 700; }
.nu-spot__modal { width: min(1200px, 94vw); max-height: 94svh; padding: 0; border: 0; border-radius: 18px; background: #000; overflow: hidden; box-shadow: 0 40px 120px rgba(0,0,0,.6); }
.nu-spot__modal::backdrop { background: rgba(10,8,30,.86); backdrop-filter: blur(4px); }
.nu-spot__modal video { display: block; width: 100%; max-height: 94svh; background: #000; }
.nu-spot__modal[data-f="916"] { width: min(440px, 92vw); }
.nu-spot__modal[data-f="43"] { width: min(960px, 94vw); }
.nu-spot__close { position: absolute; top: 10px; right: 10px; z-index: 2; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(0,0,0,.55); color: #fff; font-size: 1.6rem; line-height: 1; cursor: pointer; }
@media (max-width: 700px) {
  .nu-spot__veil { background: linear-gradient(0deg, rgba(18,14,48,.92) 0%, rgba(18,14,48,.55) 45%, rgba(18,14,48,.15) 75%); }
  .nu-spot__in { padding-bottom: 40px; }
  .nu-spot__cta .nx-btn, .nu-spot__play { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .nu-spot__bg[data-loop] { display: none; } .nu-spot { background: #120e30 var(--spot-poster) center/cover no-repeat; } }

/* ============================================================
   UF — "The Signal" footer (2026-10-08). Overrides legacy .nu-foot.
   ============================================================ */
.nu-foot.uf { background: #0d0a26; color: #fff; overflow: clip; position: relative; isolation: isolate; }
.uf__aurora { position: absolute; inset: -20% -10% auto; height: 120%; z-index: -2; filter: blur(70px) saturate(1.2); opacity: .75; pointer-events: none; }
.uf__aurora i { position: absolute; border-radius: 50%; mix-blend-mode: screen; }
.uf__aurora i:nth-child(1) { width: 55vw; height: 55vw; left: -8vw; top: -14vw; background: radial-gradient(circle, #5b2bd6 0%, transparent 62%); animation: uf-a 22s ease-in-out infinite alternate; }
.uf__aurora i:nth-child(2) { width: 48vw; height: 48vw; right: -6vw; top: -6vw; background: radial-gradient(circle, #cc1c6c 0%, transparent 60%); animation: uf-b 26s ease-in-out infinite alternate; }
.uf__aurora i:nth-child(3) { width: 40vw; height: 40vw; left: 30vw; top: 12vw; background: radial-gradient(circle, #ff8a5c 0%, transparent 60%); opacity: .45; animation: uf-c 30s ease-in-out infinite alternate; }
@keyframes uf-a { to { transform: translate(14vw, 8vw) scale(1.15); } }
@keyframes uf-b { to { transform: translate(-12vw, 10vw) scale(.9); } }
@keyframes uf-c { to { transform: translate(-10vw, -6vw) scale(1.2); } }
.uf__grid { position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: radial-gradient(rgba(255,255,255,.09) 1px, transparent 1px); background-size: 28px 28px; -webkit-mask-image: linear-gradient(180deg, transparent, #000 25%, #000 70%, transparent); mask-image: linear-gradient(180deg, transparent, #000 25%, #000 70%, transparent); }
.uf__in { max-width: var(--wrap-wide); margin: 0 auto; padding: clamp(80px, 11vh, 140px) clamp(20px, 4vw, 48px) 24px; position: relative; }
.uf__cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(24px, 4vw, 64px); align-items: end; padding-bottom: clamp(48px, 7vh, 80px); border-bottom: 1px solid rgba(255,255,255,.12); }
.uf__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 22px; font-family: var(--mono); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.7); }
.uf__live { width: 9px; height: 9px; border-radius: 50%; background: #3ee08f; box-shadow: 0 0 0 0 rgba(62,224,143,.6); animation: uf-pulse 2s infinite; }
@keyframes uf-pulse { 70% { box-shadow: 0 0 0 10px rgba(62,224,143,0); } 100% { box-shadow: 0 0 0 0 rgba(62,224,143,0); } }
.uf__sep { opacity: .4; }
.uf__clock { color: #fff; font-variant-numeric: tabular-nums; }
.uf__title { margin: 0; font-family: var(--display); font-weight: 400; font-size: clamp(3.4rem, 9vw, 9rem); line-height: .86; text-transform: uppercase; color: #fff; }
.uf__title em { text-transform: none; padding-right: .06em; }
.uf__phone-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin: 28px 0 0; }
.uf__phone { font-family: var(--display); font-size: clamp(2rem, 3.6vw, 3.2rem); letter-spacing: .02em; color: #fff; text-decoration: none; background: linear-gradient(90deg, #fff, #fff) 0 100% / 0 2px no-repeat; transition: background-size .35s var(--ease); }
.uf__phone:hover { background-size: 100% 2px; }
.uf__phone-row span { font-size: 1rem; color: rgba(255,255,255,.65); }
.uf__badge { position: relative; display: grid; place-items: center; width: clamp(150px, 15vw, 210px); aspect-ratio: 1; border-radius: 50%; color: #fff; text-decoration: none; background: radial-gradient(circle at 50% 40%, rgba(255,255,255,.12), rgba(255,255,255,.02) 70%); border: 1px solid rgba(255,255,255,.18); transition: transform .5s var(--ease-out), border-color .3s; }
.uf__badge > svg { position: absolute; inset: 0; width: 100%; height: 100%; animation: uf-spin 18s linear infinite; }
.uf__badge text { fill: #fff; font: 700 13.5px var(--mono); letter-spacing: .22em; }
.uf__badge-core { width: 46%; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, #8b5cf6, #cc1c6c 60%, #ff8a5c); box-shadow: 0 0 40px rgba(204,28,108,.55); transition: transform .4s var(--ease-out); }
.uf__badge:hover { border-color: rgba(255,255,255,.5); }
.uf__badge:hover .uf__badge-core { transform: scale(1.1) rotate(45deg); }
@keyframes uf-spin { to { transform: rotate(360deg); } }
.uf__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px clamp(24px, 3vw, 48px); padding: clamp(48px, 7vh, 80px) 0; }
.uf__h { margin: 0 0 16px; font-family: var(--mono); font-size: .76rem; letter-spacing: .18em; text-transform: uppercase; color: #f0a6c9; }
.uf__cols a { display: block; width: fit-content; padding: 7px 0; color: rgba(255,255,255,.86); text-decoration: none; font-size: 1.04rem; font-weight: 600; background: linear-gradient(90deg, var(--accent), #ff8a5c) 0 100% / 0 2px no-repeat; transition: color .2s, background-size .35s var(--ease); }
.uf__cols a:hover { color: #fff; background-size: 100% 2px; }
.uf__cols .uf__more { color: #f0a6c9; font-family: var(--mono); font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; margin-top: 6px; }
.uf__visit address { font-style: normal; color: rgba(255,255,255,.7); font-size: .98rem; line-height: 1.55; margin: 0 0 18px; }
.uf__visit strong { display: block; color: #fff; font-size: 1.04rem; margin-bottom: 2px; }
.uf__visit .uf__dir { margin-top: 4px; font-size: .92rem; color: #f0a6c9; }
.uf__social { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; }
.uf__social a { font-size: .95rem; }
/* spotlight wordmark: outline base + gradient copy revealed by a radial mask at the pointer */
.uf__mark { position: relative; user-select: none; margin: 0 0 clamp(20px, 3vh, 36px); --mx: 50%; --my: 50%; --r: 0px; }
.uf__mark p { margin: 0; font-family: var(--display); font-size: clamp(2.6rem, 8.4vw, 9.2rem); line-height: .92; letter-spacing: .005em; text-transform: uppercase; white-space: nowrap; text-align: center; }
.uf__mark-base { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.16); }
.uf__mark-lit { position: absolute; inset: 0; background: linear-gradient(90deg, #a78bfa, #f0619f 50%, #ff9a6b); -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-mask-image: radial-gradient(circle var(--r) at var(--mx) var(--my), #000 0%, rgba(0,0,0,.55) 55%, transparent 100%); mask-image: radial-gradient(circle var(--r) at var(--mx) var(--my), #000 0%, rgba(0,0,0,.55) 55%, transparent 100%); transition: --r .3s; }
.uf__base { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 24px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); font-size: .88rem; color: rgba(255,255,255,.55); }
.uf__base-links { display: flex; align-items: center; gap: 22px; }
.uf__base a { color: rgba(255,255,255,.7); text-decoration: none; }
.uf__base a:hover { color: #fff; }
.uf__top { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: 999px; border: 1px solid rgba(255,255,255,.25); background: transparent; color: #fff; font: 600 .88rem var(--body, Inter, sans-serif); cursor: pointer; }
.uf__top:hover { background: rgba(255,255,255,.08); }
@media (max-width: 1000px) {
  .uf__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .uf__cta { grid-template-columns: 1fr; }
  .uf__badge { justify-self: start; width: 140px; }
  .uf__cols { grid-template-columns: 1fr 1fr; gap: 32px 20px; }
  .uf__cols a { font-size: 1rem; padding: 8px 0; }
  .uf__visit { grid-column: 1 / -1; }
  .uf__mark p { white-space: normal; font-size: 19vw; line-height: .86; }
  .uf__mark p span { display: block; }
  .uf__base { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .uf__aurora i, .uf__badge > svg, .uf__live { animation: none; }
  .uf__mark-lit { -webkit-mask-image: none; mask-image: none; opacity: .5; }
}
/* UF film: "A Day at The Blue Hour" loop behind the CTA band */
.uf__film { position: absolute; left: 0; right: 0; top: 0; height: var(--uf-film-h, 640px); z-index: -1; overflow: hidden; pointer-events: none; }
.uf__film video { width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.4s var(--ease); }
.uf__film video.is-on { opacity: .62; }
.uf__film::after { content: ""; position: absolute; inset: 0; background:
  linear-gradient(90deg, rgba(13,10,38,.88) 0%, rgba(13,10,38,.55) 45%, rgba(13,10,38,.25) 100%),
  linear-gradient(180deg, rgba(13,10,38,.35) 0%, rgba(13,10,38,0) 30%, rgba(13,10,38,.6) 75%, #0d0a26 100%); }
@media (max-width: 700px) { .uf__film::after { background: linear-gradient(180deg, rgba(13,10,38,.55) 0%, rgba(13,10,38,.62) 55%, #0d0a26 100%); } .uf__film video.is-on { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .uf__film { display: none; } }

/* Preloader v2 (2026-10-08): logo blooms in from black, counter counts, then dissolves straight into the hero video */
.nu-preloader { background: #000; transform: none !important; opacity: 0; visibility: hidden; transition: opacity .9s var(--ease) .1s, visibility 0s 1.1s; }
html.is-preloading .nu-preloader { opacity: 1; visibility: visible; transition: none; }
html.is-loaded .nu-preloader { opacity: 0; visibility: hidden; transition: opacity 1s var(--ease) .15s, visibility 0s 1.2s; }
.nu-preloader__mark { position: relative; }
.nu-preloader__mark::before { content: ""; position: absolute; left: 50%; top: 50%; width: 140%; aspect-ratio: 2.2; translate: -50% -50%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(204,28,108,.55), rgba(139,92,246,.25) 55%, transparent 75%); filter: blur(30px); opacity: 0; animation: nu-pre-glow 2.2s ease-out .3s forwards; }
.nu-preloader__mark::after { content: ""; position: absolute; left: 0; right: 0; bottom: calc(-1 * clamp(18px, 3vw, 30px)); height: 2px; margin: 0 auto; width: 0;
  background: linear-gradient(90deg, transparent, #a78bfa, #f0619f, #ff9a6b, transparent); animation: nu-pre-line 1.1s cubic-bezier(.2,.7,.2,1) 1s forwards; }
.nu-preloader__mark img { position: relative; animation: nu-pre-logo 1.7s cubic-bezier(.2,.7,.2,1) .15s both; }
@keyframes nu-pre-logo { from { opacity: 0; filter: blur(20px) brightness(.3); transform: scale(1.16); } 55% { opacity: 1; } to { opacity: 1; filter: blur(0) brightness(1) drop-shadow(0 0 24px rgba(240,97,159,.45)); transform: scale(1); } }
@keyframes nu-pre-glow { 0% { opacity: 0; transform: scale(.6); } 60% { opacity: 1; } 100% { opacity: .7; transform: scale(1); } }
@keyframes nu-pre-line { to { width: 100%; } }
html.is-loaded .nu-preloader__mark img { transform: scale(1.4); filter: blur(8px); opacity: 0; transition: transform 1.1s cubic-bezier(.6,0,.2,1), filter 1s, opacity .8s .15s; animation: none; }
.nu-preloader__count { background: linear-gradient(180deg, #fff, #f0619f); -webkit-background-clip: text; background-clip: text; color: transparent; opacity: 0; animation: nu-pre-count .6s ease .5s forwards; font-variant-numeric: tabular-nums; }
@keyframes nu-pre-count { to { opacity: .9; } }
/* the hero video rises out of the black as the curtain lifts */
@media (prefers-reduced-motion: no-preference) {
  html.is-loaded .nu-spot__bg { animation: nu-spot-in 2s cubic-bezier(.2,.7,.2,1) both; }
  html.is-loaded .nu-spot__in > * { animation: nu-spot-txt .9s cubic-bezier(.2,.7,.2,1) both; }
  html.is-loaded .nu-spot__in > :nth-child(1) { animation-delay: .55s; } html.is-loaded .nu-spot__in > :nth-child(2) { animation-delay: .7s; }
  html.is-loaded .nu-spot__in > :nth-child(3) { animation-delay: .85s; } html.is-loaded .nu-spot__in > :nth-child(4) { animation-delay: 1s; } html.is-loaded .nu-spot__in > :nth-child(5) { animation-delay: 1.12s; }
}
@keyframes nu-spot-in { from { transform: scale(1.1); filter: brightness(.25); } to { transform: none; filter: none; } }
@keyframes nu-spot-txt { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
.uf__title { font-size: clamp(3rem, 7vw, 7.4rem); max-width: 13ch; }

/* ============================================================
   NU-SIGNAL "The Signal" (fal, 2026-10-08): one point of light, a city ignites,
   flare, logo resolves, straight into the commercial hero. Hidden unless html.nu-signal-on.
   ============================================================ */
.nu-signal { display: none; }
html.nu-signal-on .nu-signal { display: block; position: fixed; inset: 0; z-index: 300; background: #000; overflow: hidden; transition: opacity 1.05s cubic-bezier(.6,0,.2,1), filter 1.05s; }
html.nu-signal-on body { overflow: hidden; }
html.nu-signal-out .nu-signal { opacity: 0; filter: brightness(2.2) blur(6px); pointer-events: none; }
.nu-signal video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nu-signal__shade { position: absolute; inset: 0; background: radial-gradient(ellipse 60% 45% at 50% 50%, rgba(0,0,0,0), rgba(0,0,0,.35) 100%); opacity: 0; transition: opacity .8s; }
.nu-signal.is-logo .nu-signal__shade { opacity: 1; background: radial-gradient(ellipse 55% 40% at 50% 50%, rgba(10,6,30,.55), rgba(0,0,0,.2) 100%); }
.nu-signal__logo { position: absolute; left: 50%; top: 50%; translate: -50% -50%; display: flex; flex-direction: column; align-items: center; gap: clamp(14px, 2vw, 22px); opacity: 0; transform: scale(1.25); filter: blur(16px); transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform 1.4s cubic-bezier(.2,.7,.2,1), filter 1s; }
.nu-signal__logo img { width: clamp(240px, 42vw, 620px); height: auto; filter: drop-shadow(0 0 30px rgba(240,97,159,.75)) drop-shadow(0 0 80px rgba(139,92,246,.5)); }
.nu-signal__tag { font-family: var(--mono); font-size: clamp(.7rem, 1.1vw, .9rem); letter-spacing: .32em; text-transform: uppercase; color: rgba(255,255,255,.85); opacity: 0; transition: opacity .8s .5s; }
.nu-signal.is-logo .nu-signal__logo { opacity: 1; transform: scale(1); filter: blur(0); }
.nu-signal.is-logo .nu-signal__tag { opacity: 1; }
html.nu-signal-out .nu-signal__logo { transform: scale(1.6); filter: blur(10px); opacity: 0; transition: transform 1.1s cubic-bezier(.6,0,.2,1), filter 1s, opacity .7s .2s; }
.nu-signal__count { position: absolute; right: clamp(20px, 4vw, 56px); bottom: clamp(16px, 3.5vw, 44px); font-family: var(--display); font-size: clamp(3.4rem, 8vw, 7rem); line-height: 1; font-variant-numeric: tabular-nums;
  background: linear-gradient(180deg, #fff, #f0619f); -webkit-background-clip: text; background-clip: text; color: transparent; opacity: .9; }
.nu-signal__skip { position: absolute; left: clamp(20px, 4vw, 56px); bottom: clamp(20px, 3.5vw, 48px); min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.25); color: rgba(255,255,255,.85); font: 600 .78rem var(--mono); letter-spacing: .18em; text-transform: uppercase; cursor: pointer; }
.nu-signal__skip:hover { background: rgba(255,255,255,.12); color: #fff; }
/* the commercial hero rises out of the flash as the intro lifts */
@media (prefers-reduced-motion: no-preference) {
  html.nu-signal-out .nu-spot__bg { animation: nu-spot-in 2s cubic-bezier(.2,.7,.2,1) both; }
  html.nu-signal-out .nu-spot__in > * { animation: nu-spot-txt .9s cubic-bezier(.2,.7,.2,1) both; }
  html.nu-signal-out .nu-spot__in > :nth-child(1) { animation-delay: .45s; } html.nu-signal-out .nu-spot__in > :nth-child(2) { animation-delay: .6s; }
  html.nu-signal-out .nu-spot__in > :nth-child(3) { animation-delay: .75s; } html.nu-signal-out .nu-spot__in > :nth-child(4) { animation-delay: .9s; } html.nu-signal-out .nu-spot__in > :nth-child(5) { animation-delay: 1.02s; }
}
/* About: "The Unified Times" founder film above the bio (plays once, holds on the smile) */
.nx-author__film { max-width: 1080px; margin: 0 auto clamp(36px, 5vw, 64px); border-radius: 22px; overflow: hidden; background: #e9e1f0; box-shadow: 0 30px 80px -30px rgba(32,27,81,.45); }
.nx-author__film video { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

/* Media page hero: edge to edge (base .nu-page-hero caps at --wrap-wide) + optional looping video above the still, under the scrim */
.nu-page-hero--media { max-width: none; width: 100%; }
.nu-page-hero--media .nx-hero__vid { z-index: 0; }
.nu-page-hero--media .nu-page-hero__title .u-serif { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent !important; padding-right: .08em; }
.nu-page-hero--media .nx-crumbs { margin-bottom: clamp(18px, 3vh, 32px); }
/* Media page heroes match the tall nx-hero (Adam 2026-10-09: "I like the taller versions") */
.nu-page-hero--media { min-height: min(100svh, 1000px); }
@media (max-width: 620px) { .nu-page-hero--media { min-height: min(88svh, 760px); } }
/* Phones: hero videos are native 9:16 cuts (-m.mp4); keep poster + video centred so nothing jumps sideways */
@media (max-width: 900px) { .nx-hero__vid, .nx-hero__bg, .nu-page-hero__bg { object-position: center center; } }
/* Chapter index under heroes + section chapter labels: bigger (Adam 2026-10-09). Index text white, numbers pink. */
.nx-index a { font-size: clamp(.95rem, 1.15vw, 1.08rem); letter-spacing: .1em; color: #fff; min-height: 64px; }
.nx-index a span { color: var(--gold); font-weight: 700; }
.nx-ch__label { font-size: clamp(1rem, 1.3vw, 1.2rem); letter-spacing: .14em; gap: 16px; }
.nx-ch__label span { font-size: 1.15em; }
.nx-ch__label::after { width: 96px; }
/* Phones: GHL already pads the form inside its iframe; drop our card padding so fields get the width */
@media (max-width: 620px) {
  .nu-contact__form { padding: 0 !important; background: transparent !important; box-shadow: none !important; border: 0 !important; }
  .nu-contact__form iframe { border-radius: 18px !important; box-shadow: 0 18px 40px -26px rgba(32, 27, 81, .45); }
}

/* ============ Homepage intro v3 "The search" (Adam 2026-10-09): white, bright, about what we do ============
   Search bar types "best marketing agency near me", results cascade, Unified result glows magenta, flies at the camera,
   resolves into the colour logo, then the overlay fades into the page. Driver: inline script in functions.php. */
html.nu-signal-on .nu-signal.nu-search { background: radial-gradient(120% 90% at 50% 0%, #ffffff 0%, #f7f6fb 60%, #efedf6 100%); }
html.nu-signal-out .nu-signal.nu-search { filter: blur(4px); }
.nus__stage { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(18px, 3vh, 30px); padding: 0 16px; transition: opacity .5s ease .15s; }
.nu-search.is-logo .nus__stage { opacity: 0; }
.nus__bar { display: flex; align-items: center; gap: 14px; width: min(680px, 92vw); min-height: 64px; padding: 0 22px; border-radius: 999px; background: #fff; color: #5b5780;
  box-shadow: 0 1px 2px rgba(32,27,81,.08), 0 14px 40px -18px rgba(32,27,81,.35); border: 1px solid #e6e3f0;
  opacity: 0; transform: translateY(18px) scale(.97); transition: opacity .5s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.nu-search.is-bar .nus__bar { opacity: 1; transform: none; }
.nus__q { font: 500 clamp(17px, 2.2vw, 21px)/1.2 -apple-system, "Inter", "Helvetica Neue", Arial, sans-serif; color: #201B51; white-space: nowrap; overflow: hidden; }
.nus__caret { width: 2px; height: 24px; background: #CC1C6C; animation: nus-blink .8s steps(1) infinite; margin-left: -10px; }
.nu-search.is-results .nus__caret { opacity: 0; }
@keyframes nus-blink { 50% { opacity: 0; } }
.nus__results { width: min(680px, 92vw); display: grid; gap: 10px; }
.nus__r { display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 14px; background: #fff; border: 1px solid #ece9f4;
  opacity: 0; transform: translateY(16px); transition: opacity .35s ease, transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .4s, border-color .4s, filter .4s; }
.nu-search.is-results .nus__r { opacity: 1; transform: none; }
.nu-search.is-results .nus__r:nth-child(2) { transition-delay: .07s; } .nu-search.is-results .nus__r:nth-child(3) { transition-delay: .14s; }
.nu-search.is-results .nus__r:nth-child(4) { transition-delay: .21s; } .nu-search.is-results .nus__r:nth-child(5) { transition-delay: .28s; }
.nu-search.is-results .nus__r:nth-child(6) { transition-delay: .35s; }
.nus__fav { flex: 0 0 34px; height: 34px; border-radius: 50%; background: #ece9f4; }
.nus__fav--u { display: grid; place-items: center; background: linear-gradient(135deg, #8b5cf6, #CC1C6C); color: #fff; font: 800 16px/1 -apple-system, "Inter", sans-serif; }
.nus__tx { display: grid; gap: 6px; flex: 1; min-width: 0; }
.nus__tx b:empty, .nus__tx i { display: block; height: 10px; border-radius: 6px; background: #e9e6f2; }
.nus__tx b:empty { width: 46%; height: 12px; background: #dcd8ea; } .nus__tx i { width: 82%; } .nus__tx i.s { width: 60%; }
.nus__win b { font: 700 clamp(16px, 2vw, 19px)/1.15 -apple-system, "Inter", sans-serif; color: #201B51; }
.nus__win em { font: 500 13px/1 -apple-system, "Inter", sans-serif; font-style: normal; color: #2a7a3f; }
.nus__stars { color: #f5a623; font-size: 15px; letter-spacing: 1px; } .nus__stars small { color: #5b5780; letter-spacing: 0; font: 500 13px -apple-system, "Inter", sans-serif; }
.nu-search.is-pick .nus__r:not(.nus__win) { opacity: .35; filter: blur(1px); }
.nu-search.is-pick .nus__win { border-color: #CC1C6C; box-shadow: 0 0 0 4px rgba(204,28,108,.14), 0 18px 50px -12px rgba(204,28,108,.55); transform: scale(1.04); }
.nu-search.is-fly .nus__win { transform: translate(var(--dx, 0), var(--dy, 0)) scale(7); opacity: 0; filter: blur(8px);
  transition: transform .75s cubic-bezier(.6,0,.3,1), opacity .5s ease .3s, filter .6s ease .15s; }
.nu-search.is-fly .nus__r:not(.nus__win), .nu-search.is-fly .nus__bar { opacity: 0; transition: opacity .35s; }
/* logo on white */
.nu-search .nu-signal__logo img { filter: none; }
.nu-search .nu-signal__tag { color: #4C4775; }
.nu-search .nu-signal__skip { border-color: rgba(32,27,81,.2); background: rgba(255,255,255,.7); color: #4C4775; }
.nu-search .nu-signal__skip:hover { background: #fff; color: #201B51; }
@media (max-width: 620px) { .nus__r:nth-child(n+5) { display: none; } .nus__bar { min-height: 56px; } }
@media (min-width: 1100px) {
  .nus__bar, .nus__results { width: 780px; }
  .nus__bar { min-height: 72px; } .nus__q { font-size: 23px; }
  .nus__r { padding: 14px 18px; } .nus__win b { font-size: 21px; }
}

/* Touch phones + tablets: no scroll-jacking (2026-10-09). The pinned intro (230vh) and the "work that sells" pan
   (520vh on tablets in landscape) made swipes feel endless. Same layout as reduced motion; site.js skips the scrubbing. */
@media (hover: none), (pointer: coarse) {
  .nu-intro { height: auto; padding: clamp(72px, 10vw, 130px) 0; }
  .nu-intro__sticky { position: static; height: auto; }
  .nu-intro .word { opacity: 1; transform: none; }
  .nu-intro__ghost { display: none; }
  .nu-make, html.nu-hero-scrub .nu-make { height: auto; }
  .nu-make__sticky { position: static; height: auto; overflow: visible; }
  .nu-make__screen { position: static; }
  .nu-make__screen--intro { height: 70svh; position: relative; }
  .nu-make__screen--cards { transform: none !important; padding: clamp(48px, 8vw, 80px) 0; }
  .nu-make__row { width: auto; overflow-x: auto; -webkit-overflow-scrolling: touch; transform: none !important; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; }
  .nu-make__card { scroll-snap-align: start; }
  .nu-make__progress { display: none; }
  html.nu-hero-scrub .nu-hero-full { height: auto; }
}