/* ==========================================================================
   SHIFT AGENCY — Original Design System
   Direction: security-document engraving meets cinematic generation console.
   Everything foil-toned is a *verified* state. Never decorate with it.
   ========================================================================== */

/* --- 1. Tokens ----------------------------------------------------------- */

:root {
  /* Surface — passport ink, not pure black. Slight blue keeps foil readable. */
  --n-void:        #05060a;
  --n-base:        #0a0c13;
  --n-slate:       #10131d;
  --n-raised:      #171b28;
  --n-line:        rgba(242, 241, 237, 0.10);
  --n-line-strong: rgba(242, 241, 237, 0.20);

  /* Ink — warm off-white, the colour of passport paper */
  --n-paper:  #f2f1ed;
  --n-mist:   #9aa1b6;
  --n-faint:  #626a80;

  /* Foil — the one bold move. Iridescent security hologram. */
  --n-foil-a: #46f5d4;  /* verify cyan   */
  --n-foil-b: #9b6bff;  /* passport violet */
  --n-foil-c: #ffd166;  /* seal gold     */
  --n-seal:   #ff5a3c;  /* vermillion — revoked / denied only */

  --n-foil: linear-gradient(100deg,
    var(--n-foil-a) 0%,
    #7fd8ff 22%,
    var(--n-foil-b) 48%,
    #ff7bd5 68%,
    var(--n-foil-c) 100%);

  /* Type */
  --n-display: "Bricolage Grotesque", "Archivo", system-ui, sans-serif;
  --n-body:    "Inter Tight", "Inter", system-ui, sans-serif;
  --n-machine: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

  /* Scale — fluid, 1.28 ratio at the top end */
  --t-hero: clamp(2.9rem, 7.6vw, 7.4rem);
  --t-h2:   clamp(2rem, 4.4vw, 3.9rem);
  --t-h3:   clamp(1.25rem, 1.9vw, 1.65rem);
  --t-body: clamp(1rem, 1.05vw, 1.1rem);
  --t-mrz:  clamp(0.62rem, 0.78vw, 0.74rem);

  /* Space */
  --s-1: 0.5rem;  --s-2: 0.875rem; --s-3: 1.5rem;
  --s-4: 2.5rem;  --s-5: 4rem;     --s-6: 6.5rem;  --s-7: 10rem;

  --n-radius: 14px;
  --n-radius-lg: 22px;
  --n-shell: min(1240px, 92vw);

  /* Motion — springs are handled in JS; these are the CSS counterparts */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}

/* --- 2. Reset & base ----------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--n-void);
  color: var(--n-paper);
  font-family: var(--n-body);
  font-size: var(--t-body);
  line-height: 1.6;
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

::selection { background: var(--n-foil-b); color: #06070c; }

:focus-visible {
  outline: 2px solid var(--n-foil-a);
  outline-offset: 3px;
  border-radius: 4px;
}

/* --- 3. Typographic roles ------------------------------------------------ */

.n-display {
  font-family: var(--n-display);
  font-weight: 700;
  font-variation-settings: "wdth" 96, "opsz" 42;
  letter-spacing: -0.035em;
  line-height: 0.94;
  margin: 0;
}

.n-hero-type { font-size: var(--t-hero); }
.n-h2 { font-size: var(--t-h2); }

.n-h3 {
  font-family: var(--n-display);
  font-weight: 600;
  font-size: var(--t-h3);
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: 0;
}

/* Machine-readable face — used for anything a system would print, never for prose */
.n-machine,
.n-eyebrow,
.n-mrz,
.n-tag {
  font-family: var(--n-machine);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.7rem;
  font-weight: 500;
}

.n-eyebrow {
  color: var(--n-faint);
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}

.n-eyebrow::before {
  content: "";
  width: 22px; height: 1px;
  background: var(--n-foil);
}

.n-lede {
  color: var(--n-mist);
  font-size: clamp(1.05rem, 1.35vw, 1.25rem);
  line-height: 1.55;
  max-width: 56ch;
  margin: 0;
}

.n-foil-text {
  background: var(--n-foil);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: foil-drift 9s linear infinite;
}

@keyframes foil-drift {
  to { background-position: 220% 0; }
}

/* --- 4. Shell & sections ------------------------------------------------- */

.n-shell {
  width: var(--n-shell);
  margin-inline: auto;
}

.n-section { padding-block: var(--s-6); position: relative; }
.n-section--tight { padding-block: var(--s-5); }

.n-section-head {
  display: grid;
  gap: var(--s-2);
  max-width: 62ch;
  margin-bottom: var(--s-4);
}

/* Hairline that reads as a document rule, not a decoration */
.n-rule {
  height: 1px;
  border: 0;
  margin: 0;
  background: linear-gradient(90deg,
    transparent, var(--n-line-strong) 12%, var(--n-line-strong) 88%, transparent);
}

/* --- 5. Atmosphere: grain, guilloché, aurora ----------------------------- */

.n-grain {
  position: fixed;
  inset: 0;
  z-index: 60;
  pointer-events: none;
  opacity: 0.4;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.42'/%3E%3C/svg%3E");
}

.n-aurora {
  position: absolute;
  inset: -30% -10% auto -10%;
  height: 130vh;
  z-index: -2;
  pointer-events: none;
  filter: blur(90px);
  opacity: 0.5;
}

.n-aurora span {
  position: absolute;
  border-radius: 50%;
  will-change: transform;
}

.n-aurora span:nth-child(1) {
  width: 46vw; height: 46vw; left: 4%; top: 8%;
  background: radial-gradient(circle, rgba(70,245,212,0.32), transparent 68%);
}
.n-aurora span:nth-child(2) {
  width: 52vw; height: 52vw; right: 2%; top: 0%;
  background: radial-gradient(circle, rgba(155,107,255,0.34), transparent 68%);
}
.n-aurora span:nth-child(3) {
  width: 34vw; height: 34vw; left: 38%; top: 34%;
  background: radial-gradient(circle, rgba(255,209,102,0.20), transparent 70%);
}

/* Guilloché engraving — the passport's own texture, drawn by JS */
.n-guilloche {
  position: absolute;
  z-index: -1;
  pointer-events: none;
  opacity: 0.16;
  color: var(--n-foil-a);
}

/* --- 6. Header ----------------------------------------------------------- */

.n-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  padding-block: var(--s-2);
  transition: background 0.4s var(--ease-out), border-color 0.4s var(--ease-out);
  border-bottom: 1px solid transparent;
}

.n-header[data-stuck="true"] {
  background: rgba(5, 6, 10, 0.72);
  backdrop-filter: blur(18px) saturate(140%);
  border-bottom-color: var(--n-line);
}

.n-header__inner {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  justify-content: space-between;
}

.n-logo {
  display: inline-flex;
  align-items: baseline;
  gap: 0.35rem;
  font-family: var(--n-display);
  font-weight: 800;
  font-size: 1.22rem;
  letter-spacing: -0.045em;
}

.n-logo sup {
  font-family: var(--n-body);
  font-size: 0.5em;
  font-weight: 500;
  color: var(--n-mist);
  top: -0.9em;
}

.n-nav {
  display: flex;
  gap: var(--s-3);
  align-items: center;
}

.n-nav a {
  font-size: 0.9rem;
  color: var(--n-mist);
  position: relative;
  padding-block: 0.25rem;
  transition: color 0.25s var(--ease-out);
}

.n-nav a::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  height: 1px; width: 100%;
  background: var(--n-foil);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.42s var(--ease-out);
}

.n-nav a:hover { color: var(--n-paper); }
.n-nav a:hover::after { transform: scaleX(1); transform-origin: left; }

@media (max-width: 880px) { .n-nav { display: none; } }

/* Scroll progress — a foil thread across the top of the document */
.n-progress {
  position: fixed;
  inset: 0 0 auto 0;
  height: 2px;
  z-index: 55;
  background: var(--n-foil);
  transform-origin: 0 50%;
  transform: scaleX(0);
}

/* --- 7. Buttons ---------------------------------------------------------- */

.n-btn {
  --btn-bg: var(--n-raised);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  padding: 0.85rem 1.5rem;
  min-height: 46px;
  border-radius: 999px;
  border: 1px solid var(--n-line-strong);
  background: var(--btn-bg);
  color: var(--n-paper);
  font-family: var(--n-body);
  font-size: 0.94rem;
  font-weight: 500;
  cursor: pointer;
  overflow: hidden;
  isolation: isolate;
  transition: border-color 0.3s var(--ease-out), color 0.3s var(--ease-out);
  will-change: transform;
}

.n-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--n-foil);
  transform: translateY(101%);
  transition: transform 0.45s var(--ease-out);
}

.n-btn:hover { color: #06070c; border-color: transparent; }
.n-btn:hover::before { transform: translateY(0); }

.n-btn--primary {
  background: var(--n-foil);
  color: #06070c;
  border-color: transparent;
  font-weight: 600;
}
.n-btn--primary::before { background: var(--n-paper); }

.n-btn--ghost { background: transparent; }

/* --- 8. Hero: the generation console ------------------------------------- */

.n-hero {
  position: relative;
  padding-top: clamp(8rem, 15vh, 11rem);
  padding-bottom: var(--s-6);
  min-height: 100svh;
  display: flex;
  align-items: center;
  overflow: clip;
}

.n-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.82fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
  width: 100%;
}

@media (max-width: 1020px) {
  .n-hero__grid { grid-template-columns: 1fr; }
  .n-hero { min-height: auto; }
}

.n-hero__copy { display: grid; gap: var(--s-3); justify-items: start; }

.n-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: var(--s-2);
}

/* Word-level reveal target */
.n-reveal-line { display: block; overflow: hidden; }
.n-reveal-word { display: inline-block; will-change: transform, filter, opacity; }

/* Prompt console — where the page's job actually happens */
.n-console {
  border: 1px solid var(--n-line-strong);
  border-radius: var(--n-radius-lg);
  background: linear-gradient(180deg, rgba(23,27,40,0.92), rgba(10,12,19,0.92));
  backdrop-filter: blur(14px);
  padding: var(--s-2);
  width: 100%;
  max-width: 620px;
  box-shadow: 0 24px 70px -30px rgba(0,0,0,0.9);
}

.n-console__bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.35rem 0.4rem 0.6rem;
  border-bottom: 1px solid var(--n-line);
}

.n-console__field {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 0.4rem 0.4rem;
}

.n-console__input {
  flex: 1;
  min-width: 0;
  font-family: var(--n-body);
  font-size: 1rem;
  color: var(--n-paper);
  background: transparent;
  border: 0;
  padding: 0.4rem 0;
}
.n-console__input::placeholder { color: var(--n-faint); }
.n-console__input:focus { outline: none; }

.n-caret {
  width: 2px;
  height: 1.15em;
  background: var(--n-foil-a);
  animation: blink 1.1s steps(2) infinite;
}
@keyframes blink { 50% { opacity: 0; } }

/* --- 9. Passport chip — THE SIGNATURE ELEMENT ---------------------------- */

.n-chip-stage {
  perspective: 1400px;
  display: flex;
  justify-content: center;
}

.n-chip {
  position: relative;
  width: min(420px, 84vw);
  aspect-ratio: 1.586 / 1;      /* ID-1, the real passport-card ratio */
  border-radius: 18px;
  padding: 1.15rem 1.25rem;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 0.5rem;
  transform-style: preserve-3d;
  will-change: transform;
  border: 1px solid var(--n-line-strong);
  background:
    linear-gradient(155deg, rgba(155,107,255,0.16), transparent 45%),
    linear-gradient(15deg, rgba(70,245,212,0.14), transparent 52%),
    var(--n-slate);
  box-shadow:
    0 40px 90px -40px rgba(0,0,0,0.95),
    inset 0 1px 0 rgba(242,241,237,0.08);
  overflow: hidden;
}

/* The foil sweep tracks the pointer via --mx/--my set in JS */
.n-chip__foil {
  position: absolute;
  inset: -1px;
  pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(
    360px circle at var(--mx, 50%) var(--my, 0%),
    rgba(255,255,255,0.24),
    rgba(155,107,255,0.16) 28%,
    transparent 62%);
  mix-blend-mode: screen;
  opacity: 0.9;
}

.n-chip__engrave {
  position: absolute;
  inset: 0;
  opacity: 0.22;
  pointer-events: none;
  color: var(--n-foil-a);
}

.n-chip__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  transform: translateZ(28px);
}

.n-chip__body {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.9rem;
  align-items: center;
  transform: translateZ(20px);
}

.n-chip__portrait {
  width: 62px; height: 78px;
  border-radius: 8px;
  border: 1px solid var(--n-line-strong);
  background:
    conic-gradient(from 200deg at 50% 40%, rgba(70,245,212,0.5), rgba(155,107,255,0.5), rgba(255,209,102,0.4), rgba(70,245,212,0.5));
  filter: saturate(0.85) contrast(1.05);
  position: relative;
  overflow: hidden;
}

.n-chip__portrait::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg, rgba(5,6,10,0.5) 0 1px, transparent 1px 3px);
}

.n-chip__fields { display: grid; gap: 0.42rem; min-width: 0; }

.n-field { display: grid; gap: 0.1rem; }
.n-field dt {
  font-family: var(--n-machine);
  font-size: 0.56rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--n-faint);
}
.n-field dd {
  margin: 0;
  font-family: var(--n-machine);
  font-size: 0.78rem;
  color: var(--n-paper);
  letter-spacing: 0.02em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Machine-readable zone — the strip that makes it read as a real document */
.n-mrz {
  transform: translateZ(14px);
  border-top: 1px solid var(--n-line);
  padding-top: 0.5rem;
  font-size: var(--t-mrz);
  letter-spacing: 0.12em;
  color: var(--n-faint);
  white-space: nowrap;
  overflow: hidden;
  line-height: 1.5;
}

/* Ink stamp — presses in when the custody sequence resolves */
.n-stamp {
  position: absolute;
  right: 4%;
  bottom: 12%;
  width: 118px; height: 118px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 2.5px solid var(--n-foil-a);
  color: var(--n-foil-a);
  font-family: var(--n-machine);
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-align: center;
  transform: rotate(-16deg) scale(2.4) translateZ(48px);
  opacity: 0;
  mix-blend-mode: screen;
  pointer-events: none;
}

.n-stamp[data-stamped="true"] {
  animation: stamp-press 0.6s var(--ease-out) forwards;
}

@keyframes stamp-press {
  0%   { opacity: 0; transform: rotate(-16deg) scale(2.4) translateZ(48px); }
  55%  { opacity: 1; transform: rotate(-16deg) scale(0.92) translateZ(48px); }
  100% { opacity: 0.85; transform: rotate(-16deg) scale(1) translateZ(48px); }
}

/* Status pills */
.n-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.28rem 0.6rem;
  border-radius: 999px;
  border: 1px solid var(--n-line-strong);
  color: var(--n-mist);
  font-size: 0.6rem;
  background: rgba(5,6,10,0.5);
}

.n-tag--verified { color: var(--n-foil-a); border-color: rgba(70,245,212,0.4); }
.n-tag--revoked  { color: var(--n-seal);   border-color: rgba(255,90,60,0.4); }

.n-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 0 currentColor;
  animation: pulse 2.4s var(--ease-out) infinite;
}

@keyframes pulse {
  0%   { box-shadow: 0 0 0 0 rgba(70,245,212,0.5); }
  70%  { box-shadow: 0 0 0 8px rgba(70,245,212,0); }
  100% { box-shadow: 0 0 0 0 rgba(70,245,212,0); }
}

/* --- 10. Preset rail (velocity-skewed marquee) --------------------------- */

.n-rail {
  position: relative;
  overflow: hidden;
  padding-block: var(--s-3);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.n-rail__track {
  display: flex;
  gap: var(--s-2);
  width: max-content;
  will-change: transform;
}

.n-preset {
  position: relative;
  width: 268px;
  flex: 0 0 auto;
  border-radius: var(--n-radius);
  border: 1px solid var(--n-line);
  background: var(--n-base);
  overflow: hidden;
  transition: border-color 0.35s var(--ease-out), transform 0.45s var(--ease-out);
}

.n-preset:hover { border-color: var(--n-line-strong); transform: translateY(-6px); }

.n-preset__frame {
  aspect-ratio: 4 / 3;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 30% 10%, rgba(155,107,255,0.35), transparent 60%),
    radial-gradient(100% 80% at 80% 90%, rgba(70,245,212,0.28), transparent 62%),
    var(--n-slate);
}

.n-preset__frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, rgba(5,6,10,0.32) 0 1px, transparent 1px 4px);
  opacity: 0.5;
}

/* Camera-move glyph animates only on hover — motion previews the motion */
.n-preset__glyph {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--n-paper);
  opacity: 0.85;
}

.n-preset:hover .n-preset__glyph > * { animation-play-state: running; }
.n-preset__glyph > * { animation-play-state: paused; }

.n-preset__meta {
  padding: 0.85rem 1rem 1rem;
  display: grid;
  gap: 0.4rem;
}

.n-preset__name {
  font-family: var(--n-display);
  font-weight: 600;
  font-size: 1.02rem;
  letter-spacing: -0.015em;
}

.n-preset__note { color: var(--n-faint); font-size: 0.82rem; }

/* --- 11. Chain of custody (pinned sequence) ------------------------------ */

.n-custody { position: relative; }

.n-custody__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
}

@media (max-width: 1020px) { .n-custody__grid { grid-template-columns: 1fr; } }

.n-custody__sticky {
  position: sticky;
  top: 18vh;
  display: grid;
  gap: var(--s-3);
}

@media (max-width: 1020px) { .n-custody__sticky { position: static; } }

.n-steps { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }

.n-step {
  display: grid;
  grid-template-columns: 4.2rem 1fr;
  gap: var(--s-2);
  padding-block: var(--s-3);
  border-top: 1px solid var(--n-line);
  opacity: 0.35;
  transition: opacity 0.5s var(--ease-out);
}

.n-step:last-child { border-bottom: 1px solid var(--n-line); }
.n-step[data-active="true"] { opacity: 1; }

.n-step__index {
  font-family: var(--n-machine);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  color: var(--n-faint);
  padding-top: 0.35rem;
}

.n-step[data-active="true"] .n-step__index {
  background: var(--n-foil);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.n-step__body { display: grid; gap: 0.35rem; }
.n-step__body p { margin: 0; color: var(--n-mist); font-size: 0.98rem; }

/* --- 12. Model grid ------------------------------------------------------ */

.n-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--s-2);
}

.n-card {
  position: relative;
  padding: var(--s-3);
  border-radius: var(--n-radius);
  border: 1px solid var(--n-line);
  background: var(--n-base);
  display: grid;
  gap: 0.7rem;
  align-content: start;
  overflow: hidden;
  transition: border-color 0.35s var(--ease-out), background 0.35s var(--ease-out);
}

.n-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%),
    rgba(155,107,255,0.13), transparent 60%);
  transition: opacity 0.4s var(--ease-out);
}

.n-card:hover { border-color: var(--n-line-strong); }
.n-card:hover::before { opacity: 1; }

.n-card p { margin: 0; color: var(--n-mist); font-size: 0.94rem; }

.n-card__io {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  margin-top: 0.3rem;
}

/* Bento emphasis for the first card, without breaking the auto-fit grid */
@media (min-width: 900px) {
  .n-grid--bento > .n-card:first-child { grid-column: span 2; }
}

/* --- 13. Pricing --------------------------------------------------------- */

.n-plan {
  padding: var(--s-3);
  border-radius: var(--n-radius-lg);
  border: 1px solid var(--n-line);
  background: var(--n-base);
  display: grid;
  gap: var(--s-2);
  align-content: start;
}

.n-plan[data-featured="true"] {
  border-color: transparent;
  background:
    linear-gradient(var(--n-base), var(--n-base)) padding-box,
    var(--n-foil) border-box;
  border: 1px solid transparent;
}

.n-plan__price {
  font-family: var(--n-display);
  font-size: 2.6rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
}

.n-plan__price small {
  font-family: var(--n-body);
  font-size: 0.85rem;
  font-weight: 400;
  color: var(--n-faint);
  letter-spacing: 0;
}

.n-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }

.n-list li {
  display: grid;
  grid-template-columns: 1rem 1fr;
  gap: 0.6rem;
  font-size: 0.93rem;
  color: var(--n-mist);
}

.n-list li::before {
  content: "";
  width: 7px; height: 7px;
  margin-top: 0.55em;
  border-radius: 2px;
  background: var(--n-foil);
}

/* --- 14. Footer ---------------------------------------------------------- */

.n-footer {
  border-top: 1px solid var(--n-line);
  padding-block: var(--s-5) var(--s-4);
  margin-top: var(--s-6);
}

.n-footer__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--s-4);
}

.n-footer h4 {
  font-family: var(--n-machine);
  font-size: 0.66rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--n-faint);
  margin: 0 0 0.9rem;
  font-weight: 500;
}

.n-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.n-footer a { color: var(--n-mist); font-size: 0.92rem; }
.n-footer a:hover { color: var(--n-paper); }


/* --- 15. Cursor ---------------------------------------------------------- */

.n-cursor {
  position: fixed;
  top: 0; left: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  border: 1px solid var(--n-line-strong);
  pointer-events: none;
  z-index: 70;
  mix-blend-mode: difference;
  will-change: transform;
  opacity: 0;
  transition: opacity 0.3s, width 0.3s var(--ease-out), height 0.3s var(--ease-out);
}

.n-cursor[data-active="true"] { opacity: 1; }
.n-cursor[data-hot="true"] { width: 54px; height: 54px; background: var(--n-paper); }

@media (hover: none), (pointer: coarse) { .n-cursor { display: none; } }

/* --- 16. Scroll-reveal defaults ------------------------------------------ */

[data-reveal] { opacity: 0; }
.no-js [data-reveal], [data-reveal].is-in { opacity: 1; }

/* --- 17. Reduced motion -------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  [data-reveal] { opacity: 1 !important; transform: none !important; filter: none !important; }
  .n-cursor, .n-grain { display: none; }
  .n-rail__track { transform: none !important; }
}

/* --- 18. WordPress editor/admin harmony ---------------------------------- */

.editor-styles-wrapper { background: var(--n-void); }
.wp-site-blocks > * { margin-block: 0; }
.n-screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden; clip-path: inset(50%);
  white-space: nowrap;
}

/* --- 19. Camera-move glyphs ---------------------------------------------
   Each preset card previews its own motion. The glyph is the demo. */

.mv { width: 62%; aspect-ratio: 16/9; border: 1px solid currentColor; border-radius: 3px;
      position: relative; opacity: 0.9; }
.mv::after { content:""; position:absolute; inset:22% 30%; border:1px solid currentColor; opacity:0.55; border-radius:2px; }

.mv--zoom    { animation: mv-zoom 2.4s var(--ease-in-out) infinite; }
.mv--dolly   { animation: mv-dolly 3s var(--ease-in-out) infinite; }
.mv--orbit   { animation: mv-orbit 4s linear infinite; }
.mv--pan     { animation: mv-pan 2.6s var(--ease-in-out) infinite; }
.mv--crane   { animation: mv-crane 3.2s var(--ease-in-out) infinite; }
.mv--vertigo { animation: mv-vertigo 3.4s var(--ease-in-out) infinite; }
.mv--hand    { animation: mv-hand 1.1s linear infinite; }
.mv--bullet  { animation: mv-bullet 3.6s var(--ease-in-out) infinite; }

@keyframes mv-zoom    { 0%,100% { transform: scale(1); } 50% { transform: scale(1.45); } }
@keyframes mv-dolly   { 0%,100% { transform: scale(1.3) translateZ(0); } 50% { transform: scale(0.82); } }
@keyframes mv-orbit   { to { transform: rotateY(360deg); } }
@keyframes mv-pan     { 0%,100% { transform: translateX(-14%) rotateY(-14deg); } 50% { transform: translateX(14%) rotateY(14deg); } }
@keyframes mv-crane   { 0%,100% { transform: translateY(-12%) rotateX(12deg); } 50% { transform: translateY(12%) rotateX(-8deg); } }
@keyframes mv-vertigo { 0%,100% { transform: scale(1) perspective(300px) rotateX(0); } 50% { transform: scale(1.35) perspective(140px) rotateX(10deg); } }
@keyframes mv-hand    { 0% { transform: translate(0,0) rotate(0); } 25% { transform: translate(1.5%,-1%) rotate(0.5deg); }
                        50% { transform: translate(-1%,1.5%) rotate(-0.4deg); } 75% { transform: translate(1%,1%) rotate(0.3deg); }
                        100% { transform: translate(0,0) rotate(0); } }
@keyframes mv-bullet  { 0%,100% { transform: rotateY(0) scale(1); } 45% { transform: rotateY(180deg) scale(1.1); } 55% { transform: rotateY(180deg) scale(1.1); } }

.n-preset__glyph { perspective: 600px; }
.n-preset__glyph .mv { transform-style: preserve-3d; }

/* --- 20. Stat band ------------------------------------------------------- */
.n-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--s-3); }
.n-stat { display: grid; gap: 0.3rem; padding-left: var(--s-2); border-left: 1px solid var(--n-line); }
.n-stat__num { font-family: var(--n-display); font-size: clamp(2rem, 3.4vw, 3rem); font-weight: 700;
               letter-spacing: -0.04em; line-height: 1; }
.n-stat__label { color: var(--n-faint); font-size: 0.86rem; }

/* ========================================================================== 
   13. SHIFT AGENCY™ — integrated studio + flagship product system
   ========================================================================== */

.n-logo--brand { gap:.62rem; align-items:center; }
.n-brand-icon { width:28px; height:28px; display:block; flex:0 0 28px; background:url("../brand/shift-agency-site-icon.png") center/contain no-repeat; opacity:.98; }
.n-brand-wordmark { display:block; width:auto; height:32px; max-width:min(215px,42vw); object-fit:contain; }
.n-brand-lockup { display:block; width:186px; aspect-ratio:362 / 93; background:transparent url("../brand/shift-agency-wordmark.svg") center/contain no-repeat; border-radius:0; opacity:.98; }
.n-logo--full { gap:0; line-height:0; align-items:center; flex:0 0 auto; }
.n-logo--brand span { display:inline-flex; align-items:flex-start; }
.n-header__actions { display:flex; align-items:center; gap:.75rem; }

.n-menu-toggle {
  display:none; width:44px; height:44px; border:1px solid var(--n-line-strong); border-radius:999px;
  background:rgba(255,255,255,.02); color:var(--n-paper); padding:0; cursor:pointer; position:relative;
}
.n-menu-toggle span { position:absolute; left:12px; right:12px; height:1px; background:currentColor; transition:.3s var(--ease-out); }
.n-menu-toggle span:first-child { top:17px; }
.n-menu-toggle span:last-child { top:25px; }
.n-menu-toggle[aria-expanded="true"] span:first-child { top:21px; transform:rotate(45deg); }
.n-menu-toggle[aria-expanded="true"] span:last-child { top:21px; transform:rotate(-45deg); }
.n-mobile-menu { display:none; }

.n-agency-hero {
  min-height:100svh; position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center;
  padding:clamp(8rem,13vw,11rem) 0 clamp(5rem,8vw,7rem);
}
.n-agency-hero__video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-5; opacity:.44; }
.n-agency-hero__veil { position:absolute; inset:0; z-index:-4; background:linear-gradient(90deg,rgba(5,6,10,.96) 0%,rgba(5,6,10,.78) 48%,rgba(5,6,10,.60) 100%),linear-gradient(180deg,rgba(5,6,10,.35),var(--n-void) 98%); }
.n-agency-hero__grid { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr); gap:clamp(3rem,6vw,7rem); align-items:center; }
.n-agency-hero__copy { display:grid; gap:1.4rem; }
.n-agency-title { font-size:clamp(3rem,6.7vw,6.8rem); max-width:11.5ch; }
.n-agency-lede { max-width:60ch; }

.n-studio-orbit {
  border:1px solid var(--n-line-strong); border-radius:26px; overflow:hidden; min-height:560px; position:relative;
  background:linear-gradient(180deg,rgba(23,27,40,.82),rgba(8,10,16,.92)); box-shadow:0 40px 120px rgba(0,0,0,.35);
  backdrop-filter:blur(16px); transform:perspective(1200px) rotateY(-3deg) rotateX(1deg);
}
.n-studio-orbit::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(120deg,transparent 42%,rgba(255,255,255,.05),transparent 58%); transform:translateX(-120%); animation:n-sheen 8s ease-in-out infinite; }
@keyframes n-sheen { 0%,60%{transform:translateX(-120%)} 82%,100%{transform:translateX(120%)} }
.n-studio-orbit__chrome,.n-studio-orbit__footer { display:flex; justify-content:space-between; align-items:center; padding:1rem 1.15rem; color:var(--n-faint); font-family:var(--n-machine); font-size:.58rem; letter-spacing:.12em; }
.n-studio-orbit__chrome { border-bottom:1px solid var(--n-line); }
.n-studio-orbit__footer { position:absolute; inset:auto 0 0; border-top:1px solid var(--n-line); }
.n-studio-orbit__canvas { position:relative; min-height:455px; overflow:hidden; }
.n-studio-orbit__canvas::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--n-line) 1px,transparent 1px),linear-gradient(90deg,var(--n-line) 1px,transparent 1px); background-size:42px 42px; opacity:.28; mask-image:radial-gradient(circle at center,#000,transparent 78%); }
.n-studio-orbit__core { position:absolute; left:50%; top:50%; width:160px; height:160px; transform:translate(-50%,-50%); border:1px solid var(--n-line-strong); border-radius:50%; display:grid; place-content:center; text-align:center; gap:.35rem; background:rgba(5,6,10,.78); box-shadow:0 0 0 28px rgba(155,107,255,.035),0 0 90px rgba(70,245,212,.1); }
.n-studio-orbit__core b { font-family:var(--n-display); letter-spacing:-.03em; font-size:1.8rem; }
.n-studio-orbit__core small { font-family:var(--n-machine); color:var(--n-faint); font-size:.48rem; letter-spacing:.13em; }
.n-studio-pulse { width:9px; height:9px; border-radius:50%; background:var(--n-foil-a); position:absolute; top:20px; left:50%; transform:translateX(-50%); box-shadow:0 0 0 0 rgba(70,245,212,.35); animation:n-pulse 2.4s infinite; }
@keyframes n-pulse { 60%{box-shadow:0 0 0 18px rgba(70,245,212,0)} 100%{box-shadow:0 0 0 18px rgba(70,245,212,0)} }
.n-studio-node { position:absolute; width:150px; padding:.85rem .95rem; border:1px solid var(--n-line-strong); border-radius:12px; background:rgba(10,12,19,.88); backdrop-filter:blur(10px); display:grid; gap:.1rem; animation:n-float 7s ease-in-out infinite; }
.n-studio-node span { font-family:var(--n-machine); color:var(--n-faint); font-size:.54rem; letter-spacing:.12em; }
.n-studio-node strong { font-family:var(--n-display); font-size:1rem; }
.n-studio-node small { color:var(--n-mist); font-size:.72rem; }
.n-studio-node--one { top:16%; left:7%; }
.n-studio-node--two { top:12%; right:8%; animation-delay:-1.2s; }
.n-studio-node--three { bottom:17%; left:8%; animation-delay:-2.3s; }
.n-studio-node--four { bottom:15%; right:7%; animation-delay:-3.4s; }
@keyframes n-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-9px)} }

.n-proof { border-top:1px solid var(--n-line); border-bottom:1px solid var(--n-line); background:rgba(255,255,255,.012); }
.n-proof__grid { display:grid; grid-template-columns:repeat(4,1fr); }
.n-proof__item { min-height:120px; padding:1.4rem 1.5rem; border-right:1px solid var(--n-line); display:flex; flex-direction:column; justify-content:center; gap:.3rem; }
.n-proof__item:last-child { border-right:0; }
.n-proof__item strong { font-family:var(--n-display); font-size:clamp(1.35rem,2.1vw,2rem); letter-spacing:-.03em; }
.n-proof__item span { color:var(--n-faint); font-family:var(--n-machine); text-transform:uppercase; letter-spacing:.08em; font-size:.58rem; }

.n-agency-service-grid { width:var(--n-shell); margin-inline:auto; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--n-line-strong); border-left:1px solid var(--n-line-strong); }
.n-agency-service { min-height:330px; border-right:1px solid var(--n-line-strong); border-bottom:1px solid var(--n-line-strong); padding:clamp(1.5rem,2.2vw,2.2rem); position:relative; overflow:hidden; display:flex; flex-direction:column; }
.n-agency-service::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(155,107,255,.12),transparent 38%); opacity:0; transition:opacity .35s ease; pointer-events:none; }
.n-agency-service:hover::before { opacity:1; }
.n-agency-service__index { font-family:var(--n-machine); color:var(--n-faint); font-size:.6rem; letter-spacing:.12em; }
.n-agency-service h3 { margin:auto 0 .85rem; font-family:var(--n-display); font-size:clamp(1.5rem,2vw,2rem); letter-spacing:-.03em; }
.n-agency-service p { color:var(--n-mist); margin:0 0 1.4rem; }
.n-agency-service__tags { display:flex; flex-wrap:wrap; gap:.4rem; }

.n-product-feature { background:linear-gradient(180deg,rgba(155,107,255,.035),transparent 70%); overflow:hidden; }
.n-product-feature__grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,.86fr); gap:clamp(3rem,7vw,8rem); align-items:center; }
.n-product-feature__copy { display:grid; gap:1.2rem; }
.n-product-feature__copy sup { font-size:.27em; vertical-align:top; margin-left:.08em; }
.n-product-feature__points { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; margin:.4rem 0 .8rem; }
.n-product-feature__points span { border-top:1px solid var(--n-line); padding:.8rem 0; color:var(--n-mist); font-size:.9rem; }

.n-agency-work-grid { width:var(--n-shell); margin-inline:auto; display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--n-line-strong); border:1px solid var(--n-line-strong); }
.n-agency-work { background:var(--n-base); min-height:410px; padding:clamp(1.5rem,2.6vw,2.7rem); position:relative; overflow:hidden; display:flex; flex-direction:column; }
.n-agency-work::after { content:""; position:absolute; inset:0; background:linear-gradient(145deg,transparent 45%,rgba(70,245,212,.05),rgba(155,107,255,.07)); transform:translateY(20%); transition:.5s var(--ease-out); }
.n-agency-work:hover::after { transform:translateY(0); }
.n-agency-work__meta { display:flex; justify-content:space-between; font-family:var(--n-machine); font-size:.57rem; letter-spacing:.1em; color:var(--n-faint); text-transform:uppercase; }
.n-agency-work h3 { margin:auto 0 .8rem; font-family:var(--n-display); font-size:clamp(1.8rem,3vw,3rem); line-height:1; letter-spacing:-.04em; position:relative; z-index:1; }
.n-agency-work p { color:var(--n-mist); max-width:52ch; margin:0; position:relative; z-index:1; }

.n-process { border-top:1px solid var(--n-line); }
.n-process__grid { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--n-line-strong); }
.n-process__grid li { min-height:290px; padding:1.5rem; border-right:1px solid var(--n-line); display:flex; flex-direction:column; }
.n-process__grid li:last-child { border-right:0; }
.n-process__grid span { font-family:var(--n-machine); color:var(--n-faint); font-size:.58rem; }
.n-process__grid h3 { margin:auto 0 .7rem; font-family:var(--n-display); font-size:1.5rem; letter-spacing:-.025em; }
.n-process__grid p { margin:0; color:var(--n-mist); font-size:.94rem; }
.n-agency-cta { overflow:hidden; border-top:1px solid var(--n-line); }

.n-subhero { position:relative; min-height:70svh; display:flex; align-items:center; padding:clamp(8rem,12vw,11rem) 0 clamp(5rem,8vw,7rem); overflow:hidden; }
.n-subhero .n-shell { display:grid; gap:1.35rem; }
.n-subhero__grid { grid-template-columns:minmax(0,1fr) minmax(420px,.9fr)!important; align-items:center; gap:clamp(3rem,7vw,7rem)!important; }
.n-product-hero { min-height:90svh; }

.n-platform-console { border:1px solid var(--n-line-strong); border-radius:22px; overflow:hidden; background:linear-gradient(180deg,var(--n-raised),var(--n-base)); box-shadow:0 35px 100px rgba(0,0,0,.3); }
.n-platform-console__top { display:flex; justify-content:space-between; padding:1rem 1.1rem; border-bottom:1px solid var(--n-line); font-family:var(--n-machine); font-size:.56rem; color:var(--n-faint); letter-spacing:.11em; }
.n-platform-console__body { min-height:420px; display:grid; grid-template-columns:120px 1fr; }
.n-platform-console__body aside { border-right:1px solid var(--n-line); padding:1rem; display:grid; align-content:start; gap:.45rem; }
.n-platform-console__body aside span,.n-platform-console__body aside b { padding:.7rem .55rem; font-size:.72rem; border-radius:8px; }
.n-platform-console__body aside b { background:rgba(255,255,255,.06); }
.n-platform-console__body aside span { color:var(--n-faint); }
.n-platform-console__main { padding:1.3rem; display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.n-platform-console__metric { padding:1.1rem; border:1px solid var(--n-line); border-radius:12px; display:grid; gap:.25rem; }
.n-platform-console__metric span,.n-platform-console__metric small { color:var(--n-faint); font-size:.68rem; }
.n-platform-console__metric strong { font-family:var(--n-display); font-size:2rem; }
.n-platform-console__timeline,.n-platform-console__rows { grid-column:1/-1; border:1px solid var(--n-line); border-radius:12px; }
.n-platform-console__timeline { min-height:130px; padding:1rem; display:flex; align-items:flex-end; gap:.55rem; }
.n-platform-console__timeline i { flex:1; height:45%; border-radius:4px 4px 0 0; background:var(--n-foil); opacity:.45; }
.n-platform-console__timeline i:nth-child(2){height:68%}.n-platform-console__timeline i:nth-child(3){height:58%}.n-platform-console__timeline i:nth-child(4){height:82%}.n-platform-console__timeline i:nth-child(5){height:70%}.n-platform-console__timeline i:nth-child(6){height:92%}
.n-platform-console__rows { padding:.8rem 1rem; display:grid; gap:.55rem; font-family:var(--n-machine); font-size:.52rem; letter-spacing:.08em; color:var(--n-mist); }
.n-platform-pillars { display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid var(--n-line-strong); }
.n-platform-pillars article { padding:1.4rem; border-right:1px solid var(--n-line); min-height:270px; display:flex; flex-direction:column; }
.n-platform-pillars article:last-child { border-right:0; }
.n-platform-pillars span { color:var(--n-faint); font-family:var(--n-machine); font-size:.57rem; }
.n-platform-pillars h3 { margin:auto 0 .6rem; font-family:var(--n-display); font-size:1.35rem; }
.n-platform-pillars p { margin:0; color:var(--n-mist); font-size:.88rem; }

.n-about-manifest { border:1px solid var(--n-line-strong); border-radius:20px; min-height:360px; padding:1.5rem; display:grid; align-content:center; justify-items:start; background:linear-gradient(145deg,rgba(155,107,255,.07),rgba(70,245,212,.025)); }
.n-about-manifest > span,.n-about-manifest small { font-family:var(--n-machine); letter-spacing:.12em; color:var(--n-faint); font-size:.58rem; }
.n-about-manifest strong { font-family:var(--n-display); font-size:clamp(3.2rem,6vw,6rem); line-height:.9; margin-top:1.5rem; }
.n-about-principles { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--n-line-strong); }
.n-about-principles article { min-height:300px; padding:1.5rem; border-right:1px solid var(--n-line); display:flex; flex-direction:column; }
.n-about-principles article:last-child { border-right:0; }
.n-about-principles span { font-family:var(--n-machine); color:var(--n-faint); font-size:.58rem; }
.n-about-principles h3 { margin:auto 0 .7rem; font-family:var(--n-display); font-size:1.6rem; }
.n-about-principles p { color:var(--n-mist); margin:0; }

.n-contact-grid { grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr)!important; gap:clamp(3rem,8vw,8rem)!important; align-items:start; }
.n-contact-panel { border:1px solid var(--n-line-strong); border-radius:22px; padding:clamp(1.4rem,2.5vw,2.5rem); background:linear-gradient(180deg,rgba(23,27,40,.86),rgba(10,12,19,.92)); }
.n-contact-form { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.n-contact-form label { display:grid; gap:.4rem; color:var(--n-mist); font-size:.82rem; }
.n-contact-form label.n-contact-form__wide { grid-column:1/-1; }
.n-contact-form input,.n-contact-form textarea,.n-contact-form select { width:100%; background:rgba(5,6,10,.64); color:var(--n-paper); border:1px solid var(--n-line-strong); border-radius:10px; padding:.9rem 1rem; font:inherit; }
.n-contact-form textarea { min-height:150px; resize:vertical; }
.n-contact-form__hp { position:absolute!important; left:-9999px!important; }
.n-contact-notice { grid-column:1/-1; padding:.8rem 1rem; border:1px solid var(--n-line); border-radius:10px; color:var(--n-mist); }

.n-footer__grid--studio { grid-template-columns:1.6fr 1fr 1fr 1fr; }
.n-footer__statement { color:var(--n-mist); max-width:38ch; margin:.9rem 0 0; font-size:.94rem; }
.n-footer__bottom { border-top:1px solid var(--n-line); margin-top:2.4rem; padding-top:1rem; display:flex; justify-content:space-between; gap:1rem; font-family:var(--n-machine); color:var(--n-faint); font-size:.55rem; letter-spacing:.1em; }

@media (max-width: 1080px) {
  .n-agency-hero__grid,.n-product-feature__grid,.n-subhero__grid,.n-contact-grid { grid-template-columns:1fr!important; }
  .n-studio-orbit { max-width:760px; width:100%; transform:none; }
  .n-agency-service-grid { grid-template-columns:repeat(2,1fr); }
  .n-proof__grid { grid-template-columns:repeat(2,1fr); }
  .n-proof__item:nth-child(2) { border-right:0; }
  .n-proof__item:nth-child(-n+2) { border-bottom:1px solid var(--n-line); }
  .n-process__grid,.n-platform-pillars { grid-template-columns:repeat(2,1fr); }
  .n-process__grid li:nth-child(2n),.n-platform-pillars article:nth-child(2n) { border-right:0; }
  .n-process__grid li,.n-platform-pillars article { border-bottom:1px solid var(--n-line); }
  .n-about-principles { grid-template-columns:1fr; }
  .n-about-principles article { border-right:0; border-bottom:1px solid var(--n-line); }
  .n-footer__grid--studio { grid-template-columns:1.5fr 1fr 1fr; }
  .n-footer__grid--studio > div:last-child { grid-column:2; }
}

@media (max-width: 880px) {
  .n-header__cta { display:none; }
  .n-menu-toggle { display:block; }
  .n-mobile-menu { display:block; position:absolute; left:4vw; right:4vw; top:calc(100% + .35rem); border:1px solid var(--n-line-strong); border-radius:18px; background:rgba(5,6,10,.96); backdrop-filter:blur(20px); transform:translateY(-8px); opacity:0; pointer-events:none; transition:.28s var(--ease-out); }
  .n-mobile-menu[data-open="true"] { transform:translateY(0); opacity:1; pointer-events:auto; }
  .n-mobile-menu nav { display:grid; padding:.55rem; }
  .n-mobile-menu a { padding:.85rem 1rem; border-bottom:1px solid var(--n-line); font-family:var(--n-display); font-size:1.1rem; }
  .n-mobile-menu a:last-child { border-bottom:0; }
  .n-agency-hero { min-height:auto; }
  .n-agency-hero__grid { gap:3rem; }
  .n-agency-title { font-size:clamp(2.9rem,12vw,5rem); }
  .n-studio-orbit { min-height:470px; }
  .n-studio-orbit__canvas { min-height:385px; }
  .n-agency-work-grid { grid-template-columns:1fr; }
  .n-agency-work { min-height:330px; }
  .n-footer__grid--studio { grid-template-columns:1fr 1fr; }
  .n-footer__grid--studio > div:first-child { grid-column:1/-1; }
  .n-footer__grid--studio > div:last-child { grid-column:auto; }
}

@media (max-width: 640px) {
  .n-agency-service-grid,.n-proof__grid,.n-process__grid,.n-platform-pillars { grid-template-columns:1fr; }
  .n-agency-service { min-height:285px; }
  .n-proof__item { border-right:0!important; border-bottom:1px solid var(--n-line); }
  .n-proof__item:last-child { border-bottom:0; }
  .n-process__grid li,.n-platform-pillars article { border-right:0!important; }
  .n-product-feature__points { grid-template-columns:1fr; }
  .n-studio-orbit { min-height:430px; }
  .n-studio-orbit__canvas { min-height:345px; }
  .n-studio-node { width:126px; padding:.7rem; }
  .n-studio-node--one { top:9%; left:4%; }.n-studio-node--two { top:8%; right:4%; }.n-studio-node--three { bottom:11%; left:4%; }.n-studio-node--four { bottom:10%; right:4%; }
  .n-studio-orbit__core { width:130px; height:130px; }
  .n-platform-console__body { grid-template-columns:78px 1fr; }
  .n-platform-console__body aside { padding:.55rem; }
  .n-platform-console__body aside b,.n-platform-console__body aside span { padding:.55rem .35rem; font-size:.58rem; }
  .n-platform-console__main { padding:.75rem; gap:.6rem; }
  .n-platform-console__metric { padding:.75rem; }
  .n-contact-form { grid-template-columns:1fr; }
  .n-contact-form label.n-contact-form__wide { grid-column:auto; }
  .n-footer__grid--studio { grid-template-columns:1fr; }
  .n-footer__bottom { flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  .n-studio-node,.n-studio-orbit::after,.n-studio-pulse { animation:none!important; }
  .n-agency-hero__video { display:none; }
}

/* ==========================================================================
   Work / interactive portfolio — v2.2
   ========================================================================== */
.n-work-hero { position:relative; min-height:min(820px,88vh); display:flex; align-items:center; overflow:hidden; padding:clamp(7.5rem,13vw,12rem) 0 clamp(4rem,8vw,7rem); border-bottom:1px solid var(--n-line-strong); background:radial-gradient(circle at 72% 25%,rgba(155,107,255,.12),transparent 30%),radial-gradient(circle at 25% 85%,rgba(70,245,212,.07),transparent 30%),var(--n-void); }
.n-work-hero::before { content:""; position:absolute; inset:0; opacity:.28; pointer-events:none; background-image:linear-gradient(var(--n-line) 1px,transparent 1px),linear-gradient(90deg,var(--n-line) 1px,transparent 1px); background-size:72px 72px; -webkit-mask-image:linear-gradient(90deg,#000,transparent 78%); mask-image:linear-gradient(90deg,#000,transparent 78%); }
.n-work-hero__grid { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1.06fr) minmax(360px,.74fr); gap:clamp(2.5rem,7vw,8rem); align-items:center; }
.n-work-hero__copy { min-width:0; }
.n-work-title { font-size:clamp(3.2rem,7.3vw,7.1rem); max-width:10.2ch; margin:.8rem 0 1.6rem; }
.n-work-hero__lede { max-width:52ch; margin:0; }
.n-work-hero__actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.n-work-index { position:relative; min-width:0; border:1px solid var(--n-line-strong); background:rgba(10,12,19,.72); backdrop-filter:blur(18px); overflow:hidden; }
.n-work-index__top,.n-work-index__foot { display:flex; justify-content:space-between; gap:1rem; align-items:center; min-height:44px; padding:.75rem 1rem; color:var(--n-faint); border-bottom:1px solid var(--n-line); font:500 .58rem/1 var(--n-machine); letter-spacing:.12em; text-transform:uppercase; }
.n-work-index__foot { border-top:1px solid var(--n-line); border-bottom:0; }
.n-work-index__matrix { height:clamp(90px,10vw,130px); position:relative; display:grid; grid-template-columns:repeat(10,1fr); gap:1px; align-items:end; padding:1rem; overflow:hidden; border-bottom:1px solid var(--n-line); background:linear-gradient(180deg,rgba(255,255,255,.02),transparent); }
.n-work-index__matrix::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(70,245,212,.08),transparent); transform:translateX(-100%); animation:n-work-scan 5.5s linear infinite; }
.n-work-index__matrix span { position:relative; display:block; min-height:18px; height:calc(18% + (var(--i) * 6%)); border:1px solid var(--n-line-strong); background:linear-gradient(180deg,rgba(242,241,237,.16),rgba(242,241,237,.02)); transform-origin:bottom; animation:n-work-bar 4.6s ease-in-out infinite alternate; animation-delay:calc(var(--i) * -170ms); }
.n-work-index__rows div { display:grid; grid-template-columns:44px 1fr 34px; align-items:center; min-height:58px; padding:.55rem 1rem; border-bottom:1px solid var(--n-line); }
.n-work-index__rows div:last-child { border-bottom:0; }
.n-work-index__rows span,.n-work-index__rows em { color:var(--n-faint); font:500 .58rem/1 var(--n-machine); letter-spacing:.1em; font-style:normal; }
.n-work-index__rows strong { font-size:.85rem; font-weight:500; letter-spacing:-.01em; }
.n-work-index__rows em { text-align:right; color:var(--n-paper); }
@keyframes n-work-scan { to { transform:translateX(100%); } }
@keyframes n-work-bar { 0% { transform:scaleY(.55); opacity:.48; } 100% { transform:scaleY(1); opacity:1; } }

.n-portfolio-section { padding-top:0; overflow:clip; }
.n-portfolio-intro { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.65fr); gap:clamp(2rem,6vw,7rem); align-items:end; padding:clamp(4rem,7vw,7rem) 0 clamp(2.2rem,4vw,4rem); }
.n-portfolio-intro .n-h2 { max-width:12ch; margin:.65rem 0 0; }
.n-portfolio-intro .n-lede { margin:0; max-width:47ch; justify-self:end; }

.n-portfolio-explorer { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr); min-height:clamp(480px,48vw,650px); border:1px solid var(--n-line-strong); background:var(--n-base); margin-bottom:clamp(3rem,6vw,6rem); }
.n-portfolio-explorer__visual { position:relative; min-height:440px; overflow:hidden; background:var(--n-slate); border-right:1px solid var(--n-line-strong); }
.n-explorer-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center; opacity:0; transform:scale(1.035); filter:saturate(.82) contrast(1.02); transition:opacity .55s ease,transform 1s var(--ease-out),filter .6s ease; }
.n-explorer-image.is-active { opacity:1; transform:scale(1); filter:saturate(1) contrast(1); }
.n-portfolio-explorer__overlay { position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(5,6,10,.02) 45%,rgba(5,6,10,.88) 100%),linear-gradient(90deg,rgba(5,6,10,.24),transparent 38%); }
.n-portfolio-explorer__caption { position:absolute; z-index:2; left:clamp(1.2rem,3vw,2.5rem); right:clamp(1.2rem,3vw,2.5rem); bottom:clamp(1.2rem,3vw,2.4rem); display:grid; grid-template-columns:auto 1fr auto; gap:.5rem 1.2rem; align-items:end; color:#fff; }
.n-portfolio-explorer__caption p { grid-column:1/-1; margin:0 0 .35rem; font:500 .58rem/1 var(--n-machine); letter-spacing:.12em; color:rgba(255,255,255,.62); }
.n-portfolio-explorer__caption h3 { margin:0; font:650 clamp(2rem,4.2vw,4.8rem)/.94 var(--n-display); letter-spacing:-.055em; }
.n-portfolio-explorer__caption > span { align-self:center; font:500 .58rem/1.25 var(--n-machine); letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.68); }
.n-portfolio-explorer__link { justify-self:end; align-self:center; display:inline-flex; align-items:center; gap:.65rem; min-height:42px; padding:.65rem .85rem; border:1px solid rgba(255,255,255,.36); background:rgba(4,6,10,.45); backdrop-filter:blur(10px); font:500 .58rem/1 var(--n-machine); letter-spacing:.1em; text-transform:uppercase; transition:background .25s ease,color .25s ease,border-color .25s ease; }
.n-portfolio-explorer__link:hover { background:#fff; color:#08090d; border-color:#fff; }
.n-portfolio-explorer__list { display:flex; flex-direction:column; min-width:0; }
.n-explorer-row { flex:1; min-height:58px; width:100%; display:grid; grid-template-columns:34px minmax(0,1fr) auto 20px; gap:.75rem; align-items:center; padding:.7rem 1rem; border:0; border-bottom:1px solid var(--n-line); background:transparent; color:var(--n-paper); text-align:left; cursor:pointer; transition:background .25s ease,color .25s ease,padding .3s var(--ease-out); }
.n-explorer-row:last-child { border-bottom:0; }
.n-explorer-row:hover,.n-explorer-row.is-active { background:var(--n-paper); color:var(--n-base); padding-left:1.2rem; }
.n-explorer-row span,.n-explorer-row em { font:500 .55rem/1.15 var(--n-machine); letter-spacing:.08em; text-transform:uppercase; color:var(--n-faint); font-style:normal; }
.n-explorer-row strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.78rem; font-weight:550; }
.n-explorer-row em { max-width:115px; text-align:right; }
.n-explorer-row i { font-style:normal; opacity:.55; }
.n-explorer-row.is-active span,.n-explorer-row.is-active em,.n-explorer-row:hover span,.n-explorer-row:hover em { color:rgba(10,12,19,.58); }

.n-portfolio-toolbar { display:flex; align-items:center; gap:.55rem; min-height:66px; padding:.65rem 0; border-top:1px solid var(--n-line-strong); border-bottom:1px solid var(--n-line-strong); overflow-x:auto; scrollbar-width:none; position:relative; }
.n-portfolio-toolbar::-webkit-scrollbar { display:none; }
.n-portfolio-filter { appearance:none; border:1px solid var(--n-line-strong); background:transparent; color:var(--n-mist); border-radius:999px; padding:.63rem .9rem; white-space:nowrap; font-family:var(--n-machine); font-size:.61rem; line-height:1; letter-spacing:.08em; text-transform:uppercase; cursor:pointer; transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s var(--ease-out); }
.n-portfolio-filter:hover { color:var(--n-paper); border-color:rgba(255,255,255,.34); transform:translateY(-1px); }
.n-portfolio-filter.is-active { background:var(--n-paper); border-color:var(--n-paper); color:var(--n-base); }
.n-portfolio-count { margin-left:auto; padding-left:1rem; color:var(--n-faint); font-family:var(--n-machine); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.n-portfolio-count b { color:var(--n-paper); font-weight:500; }
.n-portfolio-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(1.2rem,2.2vw,2.4rem); padding:clamp(2.5rem,5vw,5rem) 0 0; }
.n-portfolio-card { min-width:0; opacity:1; transform:translateY(0) scale(1); transition:opacity .32s ease,transform .45s var(--ease-out),filter .32s ease; perspective:1200px; }
.n-portfolio-card:nth-child(4n+2),.n-portfolio-card:nth-child(4n+3) { margin-top:clamp(0rem,3vw,2rem); }
.n-portfolio-card.is-filtering-out { opacity:0; transform:translateY(14px) scale(.985); filter:blur(4px); pointer-events:none; }
.n-portfolio-card[hidden] { display:none !important; }
.n-portfolio-card__link { display:block; color:inherit; text-decoration:none; }
.n-browser-frame { --mx:50%; --my:50%; position:relative; border:1px solid var(--n-line-strong); overflow:hidden; background:var(--n-panel,var(--n-slate)); box-shadow:0 20px 65px rgba(0,0,0,.12); transform-style:preserve-3d; transition:transform .45s var(--ease-out),border-color .35s ease,box-shadow .55s var(--ease-out); }
.n-portfolio-card:hover .n-browser-frame { border-color:rgba(255,255,255,.35); box-shadow:0 32px 90px rgba(0,0,0,.24); }
.n-browser-frame__bar { min-height:42px; display:grid; grid-template-columns:72px 1fr 72px; align-items:center; padding:0 .9rem; border-bottom:1px solid var(--n-line-strong); background:var(--n-base); color:var(--n-faint); }
.n-browser-dots { display:flex; gap:5px; }
.n-browser-dots i { width:6px; height:6px; border-radius:50%; border:1px solid currentColor; opacity:.65; }
.n-browser-domain { text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--n-machine); font-size:.58rem; letter-spacing:.06em; }
.n-browser-open { justify-self:end; font-family:var(--n-machine); font-size:.8rem; }
.n-portfolio-shot { aspect-ratio:16/9; position:relative; overflow:hidden; background:var(--n-slate); }
.n-portfolio-shot img { width:100%; height:100%; object-fit:cover; object-position:top center; position:relative; z-index:1; transition:transform .9s var(--ease-out),filter .45s ease; }
.n-portfolio-card:hover .n-portfolio-shot img { transform:scale(1.035); }
.n-portfolio-shot__glint { position:absolute; z-index:2; inset:0; pointer-events:none; opacity:0; background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.15),transparent 28%); transition:opacity .3s ease; }
.n-portfolio-card:hover .n-portfolio-shot__glint { opacity:1; }
.n-portfolio-shot__veil { position:absolute; inset:auto 0 0; z-index:3; display:flex; justify-content:space-between; align-items:center; padding:1rem 1.15rem; background:linear-gradient(180deg,transparent,rgba(3,5,8,.86)); color:#fff; font-family:var(--n-machine); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; transform:translateY(100%); transition:transform .4s var(--ease-out); }
.n-portfolio-card:hover .n-portfolio-shot__veil { transform:translateY(0); }
.n-portfolio-card__body { padding:1.05rem .1rem 1.4rem; }
.n-portfolio-card__meta { display:flex; justify-content:space-between; gap:1rem; margin-bottom:.7rem; color:var(--n-faint); font-family:var(--n-machine); font-size:.58rem; letter-spacing:.09em; text-transform:uppercase; }
.n-portfolio-card__body h3 { margin:0; font-family:var(--n-display); font-size:clamp(1.45rem,2.45vw,2.35rem); line-height:1.05; letter-spacing:-.045em; }
.n-portfolio-card__body p { margin:.35rem 0 0; color:var(--n-faint); font-family:var(--n-machine); font-size:.64rem; letter-spacing:.04em; }

@media (max-width:1050px) {
  .n-work-hero__grid { grid-template-columns:1fr; }
  .n-work-index { max-width:720px; }
  .n-portfolio-explorer { grid-template-columns:1fr; }
  .n-portfolio-explorer__visual { min-height:min(62vw,560px); border-right:0; border-bottom:1px solid var(--n-line-strong); }
  .n-portfolio-explorer__list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .n-explorer-row:nth-child(odd) { border-right:1px solid var(--n-line); }
}
@media (max-width:900px) {
  .n-work-hero { min-height:auto; }
  .n-portfolio-intro { grid-template-columns:1fr; gap:1.2rem; }
  .n-portfolio-intro .n-lede { justify-self:start; }
  .n-portfolio-grid { grid-template-columns:1fr; }
  .n-portfolio-card:nth-child(n) { margin-top:0; }
  .n-portfolio-count { display:none; }
}
@media (max-width:650px) {
  .n-work-hero__grid { gap:2rem; }
  .n-work-title { font-size:clamp(3rem,15vw,4.7rem); }
  .n-work-index__matrix { height:84px; }
  .n-work-index__rows div { min-height:52px; }
  .n-portfolio-explorer__visual { min-height:68vw; }
  .n-portfolio-explorer__caption { grid-template-columns:1fr auto; }
  .n-portfolio-explorer__caption h3 { grid-column:1/-1; font-size:clamp(2rem,10vw,3.2rem); }
  .n-portfolio-explorer__caption > span { display:none; }
  .n-portfolio-explorer__link { justify-self:start; }
  .n-portfolio-explorer__list { grid-template-columns:1fr; }
  .n-explorer-row:nth-child(odd) { border-right:0; }
  .n-explorer-row em { display:none; }
  .n-portfolio-toolbar { margin-inline:calc(var(--n-gutter,4vw) * -1); padding-inline:var(--n-gutter,4vw); }
  .n-browser-frame__bar { grid-template-columns:52px 1fr 52px; min-height:38px; padding-inline:.7rem; }
  .n-portfolio-card__meta { font-size:.54rem; }
  .n-portfolio-shot__veil { display:none; }
}
@media (hover:none), (pointer:coarse) {
  .n-explorer-row:hover { background:transparent; color:var(--n-paper); padding-left:1rem; }
  .n-explorer-row:hover span,.n-explorer-row:hover em { color:var(--n-faint); }
  .n-explorer-row.is-active { background:var(--n-paper); color:var(--n-base); padding-left:1.2rem; }
  .n-explorer-row.is-active span,.n-explorer-row.is-active em { color:rgba(10,12,19,.58); }
}
@media (prefers-reduced-motion:reduce) {
  .n-work-index__matrix::before,.n-work-index__matrix span { animation:none!important; }
  .n-portfolio-card,.n-browser-frame,.n-portfolio-shot img,.n-portfolio-shot__veil,.n-explorer-image,.n-explorer-row { transition:none!important; }
}


/* ==========================================================================
   Projects / full-preview presentation — v2.3
   ========================================================================== */
.n-portfolio-explorer__visual {
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  min-height:0;
  overflow:hidden;
  background:#080a0f;
}
.n-portfolio-explorer__stage {
  position:relative;
  min-height:clamp(390px,38vw,560px);
  overflow:hidden;
  background:
    linear-gradient(135deg,rgba(255,255,255,.022),transparent 34%),
    #080a0f;
}
.n-explorer-image {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  opacity:0;
  transform:none;
  filter:none;
  transition:opacity .45s ease;
}
.n-explorer-image.is-active {
  opacity:1;
  transform:none;
  filter:none;
}
.n-portfolio-explorer__overlay {
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.018),transparent 18%,transparent 82%,rgba(0,0,0,.06));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}
.n-portfolio-explorer__caption {
  position:relative;
  left:auto;
  right:auto;
  bottom:auto;
  z-index:2;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:.55rem 1.2rem;
  align-items:end;
  min-height:122px;
  padding:1.15rem clamp(1.15rem,2.4vw,2rem) 1.3rem;
  color:#fff;
  background:#080a0f;
  border-top:1px solid var(--n-line-strong);
}
.n-portfolio-explorer__caption p { margin:0; }
.n-portfolio-explorer__caption h3 {
  font-size:clamp(1.9rem,3vw,3.4rem);
  white-space:normal;
  overflow-wrap:anywhere;
}
.n-portfolio-explorer__link { background:rgba(255,255,255,.02); }

.n-portfolio-shot {
  aspect-ratio:16/9;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#080a0f;
}
.n-portfolio-shot img {
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  transform:none!important;
  filter:none;
}
.n-portfolio-card:hover .n-portfolio-shot img { transform:none!important; }
.n-portfolio-shot__veil { background:linear-gradient(180deg,transparent,rgba(3,5,8,.72)); }

@media (max-width:1050px) {
  .n-portfolio-explorer__visual { min-height:0; }
  .n-portfolio-explorer__stage { min-height:clamp(360px,56vw,560px); }
}
@media (max-width:650px) {
  .n-portfolio-explorer__stage { min-height:0; aspect-ratio:16/10; }
  .n-portfolio-explorer__caption {
    grid-template-columns:1fr auto;
    min-height:0;
    padding:1rem;
  }
  .n-portfolio-explorer__caption h3 { grid-column:1/-1; font-size:clamp(1.9rem,9vw,2.8rem); }
  .n-portfolio-explorer__caption > span { display:none; }
  .n-portfolio-explorer__link { justify-self:start; }
}

/* v2.4 — contact, legal and Shift Agency demo refinements */
.n-btn--demo{border-color:rgba(255,255,255,.34);background:linear-gradient(100deg,rgba(70,245,212,.11),rgba(155,107,255,.12),rgba(255,209,102,.11));}
@media (hover:hover) and (pointer:fine){.n-btn--demo:hover{border-color:rgba(255,255,255,.6);background:linear-gradient(100deg,rgba(70,245,212,.18),rgba(155,107,255,.2),rgba(255,209,102,.18));}}
.n-contact-hero{background:radial-gradient(circle at 82% 20%,rgba(155,107,255,.1),transparent 33%),radial-gradient(circle at 14% 74%,rgba(70,245,212,.08),transparent 30%);}
.n-contact-orbit{position:absolute;right:-8%;top:6%;width:min(640px,55vw);aspect-ratio:1;border:1px solid rgba(255,255,255,.04);border-radius:50%;pointer-events:none;opacity:.75;}
.n-contact-orbit:before,.n-contact-orbit:after,.n-contact-orbit span{content:"";position:absolute;inset:12%;border:1px solid rgba(122,151,189,.12);border-radius:48% 52% 44% 56%;transform:rotate(28deg);}
.n-contact-orbit:after{inset:25%;transform:rotate(74deg);border-radius:58% 42% 51% 49%;}
.n-contact-orbit span:nth-child(1){inset:5% 24%;transform:rotate(-18deg)}
.n-contact-orbit span:nth-child(2){inset:26% 5%;transform:rotate(43deg)}
.n-contact-orbit span:nth-child(3){inset:36%;transform:rotate(92deg)}
.n-contact-copy{position:relative;z-index:2;}
.n-contact-direct{margin-top:2.25rem;padding:1.15rem 0;border-top:1px solid var(--n-line);border-bottom:1px solid var(--n-line);display:grid;gap:.45rem;max-width:560px;}
.n-contact-direct__label,.n-contact-panel__head,.n-contact-meta span{font-family:var(--n-machine);font-size:.66rem;letter-spacing:.16em;color:var(--n-faint);}
.n-contact-direct a{font-size:clamp(1.15rem,1.8vw,1.45rem);color:var(--n-paper);text-decoration:none;}
.n-contact-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:1rem;max-width:560px;border:1px solid var(--n-line);background:var(--n-line);}
.n-contact-meta>div{display:grid;gap:.35rem;padding:1rem;background:rgba(7,9,14,.94);}
.n-contact-meta strong{font-size:.78rem;font-weight:500;color:var(--n-mist);}
.n-contact-panel{position:relative;z-index:2;}
.n-contact-panel__head{display:flex;justify-content:space-between;gap:1rem;padding-bottom:1rem;margin-bottom:1.2rem;border-bottom:1px solid var(--n-line);}
.n-contact-form select{appearance:auto;}
.n-contact-form button{min-height:48px;}
.n-contact-form input:focus,.n-contact-form textarea:focus,.n-contact-form select:focus{outline:2px solid rgba(127,216,255,.45);outline-offset:2px;border-color:rgba(127,216,255,.5);}
.n-contact-followup{padding:clamp(3rem,7vw,6rem) 0;border-top:1px solid var(--n-line);}
.n-contact-followup__grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(2.5rem,8vw,8rem);}
.n-contact-steps{display:grid;border-top:1px solid var(--n-line);}
.n-contact-step{display:grid;grid-template-columns:56px 1fr;gap:1.2rem;padding:1.35rem 0;border-bottom:1px solid var(--n-line);}
.n-contact-step span{font-family:var(--n-machine);font-size:.68rem;color:var(--n-faint);letter-spacing:.12em;}
.n-contact-step h3{font-size:1rem;margin:0 0 .35rem;color:var(--n-paper);}
.n-contact-step p{margin:0;color:var(--n-mist);font-size:.92rem;line-height:1.55;}

.n-legal-page{background:var(--n-ink);}
.n-legal-hero{padding:clamp(8rem,13vw,11rem) 0 clamp(3rem,6vw,5rem);border-bottom:1px solid var(--n-line);background:radial-gradient(circle at 78% 30%,rgba(155,107,255,.08),transparent 32%);}
.n-legal-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,.34fr);gap:clamp(2rem,7vw,7rem);align-items:end;}
.n-legal-meta{display:grid;gap:.5rem;padding-left:1.25rem;border-left:1px solid var(--n-line);font-family:var(--n-machine);font-size:.68rem;letter-spacing:.11em;color:var(--n-faint);}
.n-legal-meta strong{font-family:var(--n-body);font-size:.92rem;letter-spacing:0;color:var(--n-paper);font-weight:500;}
.n-legal-meta a{color:var(--n-mist);text-decoration:none;letter-spacing:0;}
.n-legal-layout{display:grid!important;grid-template-columns:220px minmax(0,760px);gap:clamp(2.5rem,7vw,7rem);justify-content:start;padding-top:clamp(3rem,7vw,6rem);padding-bottom:clamp(5rem,9vw,8rem);}
.n-legal-rail{position:sticky;top:110px;align-self:start;display:grid;gap:.72rem;font-size:.78rem;}
.n-legal-rail span{font-family:var(--n-machine);font-size:.64rem;letter-spacing:.17em;color:var(--n-faint);padding-bottom:.75rem;border-bottom:1px solid var(--n-line);}
.n-legal-rail a{color:var(--n-mist);text-decoration:none;padding:.2rem 0;}
.n-legal-rail a:hover{color:var(--n-paper);}
.n-legal-content{max-width:760px!important;margin:0!important;color:var(--n-mist);font-size:clamp(.98rem,1.25vw,1.08rem);line-height:1.75;}
.n-legal-content>p:first-child{font-size:clamp(1.15rem,1.75vw,1.35rem);line-height:1.6;color:var(--n-paper);margin-top:0;}
.n-legal-content h2{font-family:var(--n-display);font-size:clamp(1.7rem,3.2vw,2.45rem);font-weight:520;line-height:1.05;color:var(--n-paper);margin:4rem 0 1.1rem;padding-top:1rem;border-top:1px solid var(--n-line);}
.n-legal-content h3{color:var(--n-paper);font-size:1rem;margin:2rem 0 .75rem;}
.n-legal-content a{color:var(--n-paper);text-underline-offset:3px;}
.n-legal-content ul{padding-left:1.3rem;}
.n-legal-content li{margin:.45rem 0;}
.n-legal-content .n-legal-note{border:1px solid var(--n-line);padding:1.15rem 1.25rem;border-radius:12px;background:rgba(255,255,255,.02);font-size:.9rem;}

@media (max-width:900px){
  .n-contact-meta{grid-template-columns:1fr;}
  .n-contact-followup__grid,.n-legal-hero__grid,.n-legal-layout{grid-template-columns:1fr!important;}
  .n-legal-rail{position:static;grid-template-columns:repeat(2,minmax(0,1fr));padding-bottom:1.5rem;border-bottom:1px solid var(--n-line);}
  .n-legal-rail span{grid-column:1/-1;}
  .n-legal-meta{padding-left:0;border-left:0;border-top:1px solid var(--n-line);padding-top:1rem;}
}
@media (max-width:600px){
  .n-contact-orbit{width:90vw;right:-35%;opacity:.45;}
  .n-contact-panel{padding:1.1rem;}
  .n-contact-panel__head{font-size:.58rem;}
  .n-legal-rail{grid-template-columns:1fr 1fr;}
}

/* ==========================================================================
   v2.5 — responsive, performance and accessibility hardening
   ========================================================================== */
:root {
  --n-ink: var(--n-void);
  --n-gutter: clamp(1.1rem, 4vw, 4rem);
  --n-shell: min(1320px, calc(100% - (var(--n-gutter) * 2)));
  color-scheme: dark;
}

html {
  scroll-padding-top: 88px;
}

body {
  min-width: 320px;
  overflow-wrap: break-word;
}

.n-display,
.n-h2,
.n-h3,
.n-agency-title,
.n-work-title {
  text-wrap: balance;
}

.n-lede,
.n-agency-service p,
.n-agency-work p,
.n-process__grid p,
.n-about-principles p,
.n-legal-content,
.n-footer__statement {
  text-wrap: pretty;
}

.n-header {
  padding-block: .7rem;
}
.n-header__inner { min-height: 48px; }
.n-nav { gap: clamp(.85rem, 1.7vw, 1.65rem); }
.n-nav a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.n-nav a[aria-current="page"] { color: var(--n-paper); }
.n-nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.n-header__cta { white-space: nowrap; }

.n-agency-service-grid,
.n-agency-work-grid,
.n-portfolio-section,
.n-product-feature,
.n-process,
.n-contact-followup {
  content-visibility: auto;
  contain-intrinsic-size: 1px 780px;
}

.n-agency-hero__copy,
.n-product-feature__copy,
.n-work-hero__copy,
.n-contact-copy,
.n-portfolio-explorer,
.n-portfolio-card,
.n-legal-content,
.n-footer__grid--studio > * {
  min-width: 0;
}

.n-btn,
.n-menu-toggle,
.n-portfolio-filter,
.n-explorer-row,
.n-portfolio-explorer__link {
  -webkit-tap-highlight-color: transparent;
}

.n-contact-form input,
.n-contact-form textarea,
.n-contact-form select {
  min-height: 48px;
}

.n-legal-content a,
.n-contact-direct a,
.n-footer a {
  overflow-wrap: anywhere;
}

@media (min-width: 1440px) {
  .n-section { padding-block: clamp(6.5rem, 7vw, 8.5rem); }
  .n-agency-hero__grid { gap: clamp(4rem, 6vw, 7rem); }
  .n-studio-orbit { min-height: 580px; }
}

@media (max-width: 1180px) {
  .n-nav { gap: .9rem; }
  .n-nav a { font-size: .86rem; }
  .n-header__cta { padding-inline: 1.2rem; }
}

@media (max-width: 1080px) {
  .n-agency-hero { min-height: auto; }
  .n-agency-hero__grid { gap: clamp(2.5rem, 6vw, 4rem); }
  .n-studio-orbit { justify-self: start; }
  .n-subhero { min-height: auto; }
  .n-work-hero { min-height: auto; }
}

@media (max-width: 880px) {
  html { scroll-padding-top: 76px; }
  .n-header {
    padding-top: max(.55rem, env(safe-area-inset-top));
    padding-bottom: .55rem;
    background: rgba(5, 6, 10, .86);
    border-bottom-color: var(--n-line);
    backdrop-filter: blur(14px) saturate(125%);
  }
  .n-header__inner { min-height: 46px; }
  .n-logo { font-size: 1.14rem; }
  .n-brand-icon { width: 26px; height: 26px; flex-basis: 26px; }
  .n-brand-wordmark { height: 29px; max-width: 170px; }
  .n-brand-lockup { width: 160px; }
  .n-menu-toggle { flex: 0 0 44px; }
  .n-mobile-menu {
    left: var(--n-gutter);
    right: var(--n-gutter);
    max-height: calc(100vh - 88px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .n-mobile-menu a {
    min-height: 48px;
    display: flex;
    align-items: center;
  }
  html.n-menu-open,
  html.n-menu-open body { overflow: hidden; }

  .n-agency-hero {
    padding-top: clamp(7rem, 18vw, 8.5rem);
    padding-bottom: clamp(3.5rem, 10vw, 5rem);
  }
  .n-agency-title { max-width: 10.5ch; }
  .n-agency-lede { max-width: 48ch; }
  .n-subhero {
    padding-top: clamp(7rem, 18vw, 8.5rem);
    padding-bottom: clamp(3.75rem, 10vw, 5rem);
  }
  .n-work-hero {
    padding-top: clamp(7rem, 18vw, 8.5rem);
    padding-bottom: clamp(3.75rem, 10vw, 5rem);
  }
  .n-work-title { font-size: clamp(2.75rem, 11vw, 5rem); }
  .n-section { padding-block: clamp(3.75rem, 10vw, 5.5rem); }
  .n-section--tight { padding-block: clamp(3rem, 8vw, 4rem); }

  .n-portfolio-explorer__caption { align-items: center; }
  .n-portfolio-explorer__link { min-height: 46px; }
  .n-explorer-row { min-height: 56px; }
  .n-portfolio-filter { min-height: 44px; }

  .n-footer { padding-bottom: max(2rem, env(safe-area-inset-bottom)); }
}

@media (max-width: 640px) {
  :root { --n-gutter: clamp(1rem, 5vw, 1.35rem); }

  .n-agency-title { font-size: clamp(2.65rem, 13vw, 4.15rem); max-width: 9.5ch; }
  .n-h2 { font-size: clamp(2rem, 10vw, 3.15rem); }
  .n-lede { font-size: 1rem; line-height: 1.58; }
  .n-eyebrow { font-size: .62rem; letter-spacing: .13em; }

  .n-hero__actions { width: 100%; gap: .65rem; }
  .n-hero__actions .n-btn { flex: 1 1 170px; min-width: 0; padding-inline: 1rem; }

  .n-agency-service { min-height: 250px; }
  .n-agency-work { min-height: 290px; }
  .n-process__grid li,
  .n-platform-pillars article,
  .n-about-principles article { min-height: 245px; }

  .n-proof__item { min-height: 100px; padding: 1.15rem; }
  .n-footer__grid--studio { gap: 2rem; }
  .n-footer__bottom { gap: .45rem; }

  .n-contact-form input,
  .n-contact-form textarea,
  .n-contact-form select { font-size: 16px; }
  .n-contact-step { grid-template-columns: 42px 1fr; gap: .8rem; }

  .n-legal-hero { padding-top: clamp(7rem, 18vw, 8.5rem); }
  .n-legal-layout { padding-inline: 0; }
  .n-legal-content h2 { margin-top: 3rem; }
}

@media (max-width: 560px) {
  .n-studio-orbit {
    min-height: 0;
    border-radius: 18px;
    transform: none;
    backdrop-filter: none;
  }
  .n-studio-orbit__canvas {
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
    padding: .8rem;
  }
  .n-studio-orbit__canvas::before { opacity: .18; }
  .n-studio-node,
  .n-studio-node--one,
  .n-studio-node--two,
  .n-studio-node--three,
  .n-studio-node--four {
    position: relative;
    inset: auto;
    width: auto;
    min-height: 104px;
    padding: .75rem;
    animation: none;
    backdrop-filter: none;
    z-index: 1;
  }
  .n-studio-node strong { font-size: .95rem; }
  .n-studio-node small { font-size: .68rem; line-height: 1.35; }
  .n-studio-orbit__core {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    grid-column: 1 / -1;
    width: 100%;
    height: auto;
    min-height: 108px;
    border-radius: 14px;
  }
  .n-studio-pulse { top: 15px; }
  .n-studio-orbit__footer { position: static; gap: .8rem; flex-wrap: wrap; }

  .n-portfolio-explorer__stage { aspect-ratio: 16 / 11; }
  .n-portfolio-explorer__caption { padding: .9rem; }
  .n-portfolio-explorer__caption h3 { font-size: clamp(1.75rem, 9vw, 2.5rem); }
  .n-browser-domain { font-size: .58rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .n-portfolio-card__body h3 { font-size: clamp(1.5rem, 8vw, 2rem); }

  .n-legal-rail { grid-template-columns: 1fr; }
  .n-legal-rail span { grid-column: auto; }
}

@media (max-width: 430px) {
  .n-hero__actions .n-btn { flex-basis: 100%; width: 100%; }
  .n-agency-title { font-size: clamp(2.5rem, 13.5vw, 3.65rem); }
  .n-mobile-menu { border-radius: 14px; }
  .n-contact-panel { border-radius: 16px; }
  .n-contact-meta > div { padding: .85rem; }
  .n-studio-orbit__chrome,
  .n-studio-orbit__footer { font-size: .52rem; }
}

@media (max-width: 760px), (pointer: coarse) {
  .n-grain { opacity: .14; }
  .n-studio-node,
  .n-studio-orbit,
  .n-mobile-menu,
  .n-contact-panel { backdrop-filter: none; }
  .n-agency-service:hover::before,
  .n-agency-work:hover::after,
  .n-portfolio-card:hover .n-portfolio-shot__glint { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

@media (max-width: 420px) {
  .n-brand-lockup { width: 146px; }
}

/* Shift Agency white canvas — visual geometry, responsive breakpoints and motion remain source-original. */
:root {--n-void:#ffffff;--n-base:#ffffff;--n-slate:#f5f7f9;--n-raised:#edf1f5;--n-paper:#0d1828;--n-mist:#546278;--n-faint:#687587;--n-line:rgba(12,29,47,.11);--n-line-strong:rgba(12,29,47,.2);--n-foil-a:#153c69;--n-foil-b:#356d9e;--n-foil-c:#879fb9;--n-foil:linear-gradient(105deg,#111f33,#356b9c 51%,#7c9fbb);color-scheme:light}
html,body,.wp-site-blocks{background:#fff;color:#101a29;color-scheme:light}
.n-header{background:rgba(255,255,255,.94);border-color:var(--n-line);box-shadow:0 8px 24px rgba(9,24,37,.03)}
.n-header .n-brand-lockup,.n-footer .n-brand-lockup{background-image:url('../brand/shift-agency-wordmark.svg');width:clamp(160px,17vw,220px);height:56px;aspect-ratio:auto}
.n-agency-hero{background:#fff}.n-agency-hero__veil{background:linear-gradient(90deg,rgba(255,255,255,.99),rgba(255,255,255,.88) 65%,rgba(250,252,254,.72))}
.n-aurora{opacity:.17}.n-guilloche{opacity:.08!important}.n-studio-orbit{background:linear-gradient(180deg,#f7f9fc,#eef2f7);box-shadow:0 28px 80px rgba(9,35,60,.08)}
.n-studio-orbit__core{background:rgba(255,255,255,.94);box-shadow:0 0 0 28px rgba(29,69,108,.03),0 0 90px rgba(29,69,108,.08)}
.n-studio-node{background:rgba(255,255,255,.96);box-shadow:0 10px 35px rgba(10,35,57,.08)}
.n-studio-orbit__canvas:before,.n-studio-orbit__canvas:after{border-color:rgba(9,39,70,.13)}
.n-btn--primary{--btn-bg:#0e1c31;background:#0e1c31;color:#fff;border-color:#0e1c31}.n-btn--primary:hover{background:#1c3855;color:#fff}.n-btn--primary::before{background:#fff;opacity:.13}.n-btn--ghost{background:transparent;border-color:rgba(14,34,59,.28);color:#101a29}.n-btn--ghost:hover{background:#e8eef3;color:#101a29}
.n-foil-text{-webkit-text-fill-color:transparent}.n-proof{background:#fff}.n-agency-service{background:#fff}.n-agency-service:hover,.n-agency-work:hover{background:#f2f6fa}.n-agency-work{background:#fff}.n-agency-work-grid{background:var(--n-line)}
.n-product-feature{background:#f5f8fb}.n-shift-feature-visual{min-height:340px;position:relative;display:grid;place-items:center;border:1px solid var(--n-line-strong);border-radius:22px;background:radial-gradient(circle at 50% 48%,#dbe4ee,transparent 52%),linear-gradient(145deg,#fff,#edf3f8);overflow:hidden}
.n-shift-feature-mark{font:800 clamp(8rem,16vw,14rem)/1 var(--n-display);letter-spacing:-.09em;color:#122d4f}.n-feature-orbit-label{position:absolute;padding:10px 14px;border:1px solid var(--n-line-strong);background:#fff;font:600 .68rem var(--n-machine);letter-spacing:.08em}.n-feature-orbit-label--one{top:15%;left:12%}.n-feature-orbit-label--two{top:23%;right:8%}.n-feature-orbit-label--three{bottom:18%;left:9%}.n-feature-orbit-label--four{bottom:10%;right:10%}
.n-work-hero{background:radial-gradient(circle at 72% 25%,rgba(28,69,110,.06),transparent 30%),#fff}.n-work-index{background:rgba(255,255,255,.94)}.n-work-index__matrix span{background:linear-gradient(180deg,#9eafc0,#f5f7f9)}
.n-portfolio-explorer{background:#fff}.n-portfolio-explorer__visual,.n-portfolio-explorer__stage,.n-portfolio-shot{background:#f0f3f6}.n-portfolio-explorer__stage{background:linear-gradient(135deg,#e3ecf3,#f7f9fb)}
.n-portfolio-explorer__caption{background:#0e1c31;color:#fff}.n-portfolio-explorer__caption .n-portfolio-explorer__link{color:#fff}.n-portfolio-explorer__overlay{background:linear-gradient(180deg,transparent 75%,rgba(10,32,54,.04))}
.n-contact-panel{background:#f5f8fb;box-shadow:none}.n-contact-form input,.n-contact-form textarea,.n-contact-form select,.n-inquiry-form input,.n-inquiry-form textarea,.n-inquiry-form select{background:#fff;color:#122036;border:1px solid #b9c8d8}.n-inquiry-form{display:grid;gap:1rem}.n-inquiry-form label{display:grid;gap:.35rem}.n-inquiry-form input,.n-inquiry-form textarea,.n-inquiry-form select{display:block;padding:.8rem;max-width:100%;border-radius:8px;font:inherit}.n-inquiry-form button{justify-self:start}.n-honeypot{position:absolute!important;left:-9999px!important;opacity:0!important}.n-consent{display:flex!important;align-items:flex-start;gap:.7rem}.n-consent input{width:18px;height:18px;flex:0 0 18px;margin-top:3px}.n-contact-hero{background:#fff}.n-contact-orbit{border-color:var(--n-line)}
.n-about-manifest{background:#f5f8fb}.n-footer{background:#fff;border-top:1px solid var(--n-line)}.n-footer__statement,.n-footer__grid h4,.n-footer__grid a,.n-footer__bottom{color:#152238}.n-footer__bottom{border-color:var(--n-line)}
.n-mobile-menu{background:#fff;box-shadow:0 24px 55px rgba(7,30,52,.12)}.n-mobile-menu a{color:#0d192b}.n-menu-toggle{color:#101c2f;border-color:#becbd7;background:#fff}.n-menu-toggle span{background:#101c2f}
.n-subhero{background:#fff}.n-grid .n-card{background:#fff}.n-editorial{max-width:900px;margin:0 auto;padding:4rem 1.2rem 6rem;line-height:1.7}.n-editorial h1{font:700 clamp(2.8rem,5vw,4.3rem)/1.1 var(--n-display);letter-spacing:-.04em}.n-editorial h2{font-size:1.55rem;margin-top:2rem}.n-editorial a{text-decoration:underline}
.n-form-notice{padding:1rem;border:1px solid #b7c1cb;background:#fff}.n-form-notice--success{border-color:#86bfa5}
@media(max-width:760px){.n-header .n-brand-lockup{width:170px;height:48px}.n-studio-orbit{min-height:450px}.n-shift-feature-visual{min-height:300px}}
@media(prefers-reduced-motion:reduce){.n-studio-node,.n-studio-orbit:after{animation:none!important}}


/* ========================================================================== 
   Shift Agency v4.1 — centered editorial geometry / original studio layout
   Intent: retain all source panels, text, interactions and right-hand system
   illustration. Correct spacing and replace the legacy S brand mark.
   ========================================================================== */
:root {
  --n-gutter: clamp(1.5rem, 7vw, 7rem);
  --n-shell: min(1168px, calc(100% - (var(--n-gutter) * 2)));
}

/* The same circular three-bar mark appears on the favicon and beside the wordmark. */
.n-header .n-brand-lockup,
.n-footer .n-brand-lockup {
  display: flex;
  align-items: center;
  position: relative;
  width: clamp(190px, 19vw, 240px);
  height: 56px;
  background-image: url('../brand/shift-agency-wordmark.svg');
  background-size: calc(100% - 41px) auto;
  background-repeat: no-repeat;
  background-position: right center;
  opacity: 1;
}
.n-header .n-brand-lockup::before,
.n-footer .n-brand-lockup::before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  background: #fff url('../brand/shift-favicon-192.png') center / contain no-repeat;
  border-radius: 50%;
  flex: 0 0 32px;
}
.n-header { padding-block: .55rem; }
.n-header__inner { min-height: 57px; }
.n-nav { gap: clamp(1.1rem, 2vw, 2rem); }
.n-nav a { font-size: .9rem; }

/* Content in every section aligns to the same centered column, not screen edges. */
.n-shell, .n-agency-service-grid, .n-agency-work-grid { max-width: 1168px; }
.n-section { padding-block: clamp(5rem, 7vw, 7.8rem); }
.n-section--tight { padding-block: clamp(3.25rem, 4vw, 4.8rem); }
.n-section-head { gap: 1.1rem; margin-bottom: clamp(2.5rem, 4.2vw, 4rem); }
.n-product-feature__grid, .n-contact-grid, .n-subhero__grid,
.n-work-hero__grid { gap: clamp(2.5rem, 5vw, 5.5rem) !important; }

/* Lower headline, resolve blank title-to-lede gap; the original right graphic stays intact. */
.n-agency-hero {
  min-height: max(820px, 100svh);
  padding-top: clamp(12rem, 19vh, 16rem);
  padding-bottom: clamp(6rem, 10vh, 8rem);
}
.n-agency-hero__grid {
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  align-items: center;
  gap: clamp(2.3rem, 4.2vw, 4.4rem);
}
.n-agency-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(1rem, 2.25vh, 1.5rem);
  padding-top: clamp(2.5rem, 5vh, 4rem);
  min-width: 0;
}
.n-agency-title {
  max-width: 11.5ch;
  font-size: clamp(3.45rem, 5.8vw, 6.2rem);
  line-height: .985;
  text-wrap: balance;
}
.n-agency-title .n-reveal-line { display: block; overflow: visible; }
.n-agency-title [data-split] { display: inline; }
.n-agency-lede {
  max-width: 49ch;
  font-size: clamp(1.03rem, 1.25vw, 1.18rem);
  line-height: 1.6;
}
.n-agency-hero .n-hero__actions { margin-top: .2rem; }
.n-studio-orbit {
  align-self: center;
  justify-self: stretch;
  width: 100%;
  min-height: 560px;
}
/* The 'strategy/design/development/growth' image remains, with the same favicon mark. */
.n-shift-feature-mark {
  width: clamp(120px, 17vw, 205px);
  height: clamp(120px, 17vw, 205px);
  background: #fff url('../brand/shift-favicon-512.png') center / contain no-repeat;
  border-radius: 50%;
  box-shadow: 0 18px 48px rgba(13, 24, 40, .08);
}

@media (max-width: 1080px) {
  .n-agency-hero { min-height: 0; padding-top: clamp(9.5rem, 14vw, 12rem); padding-bottom: 5.5rem; }
  .n-agency-hero__grid { grid-template-columns: 1fr; gap: clamp(3rem, 6vw, 5rem); }
  .n-agency-hero__copy { padding-top: 0; }
  .n-agency-title { max-width: 12ch; font-size: clamp(3.5rem, 8vw, 5.5rem); }
  .n-studio-orbit { justify-self: stretch; max-width: 760px; }
}
@media (max-width: 880px) {
  :root { --n-gutter: clamp(1.4rem, 6.5vw, 3rem); }
  .n-header { padding-block: .5rem; }
  .n-header .n-brand-lockup { width: 203px; height: 52px; background-size: calc(100% - 39px) auto; }
  .n-header .n-brand-lockup::before { width: 30px; height: 30px; }
  .n-agency-hero { padding-top: 10.5rem; }
  .n-agency-hero__grid { gap: 3.5rem; }
  .n-agency-title { font-size: clamp(3.25rem, 9vw, 5.1rem); }
}
@media (max-width: 640px) {
  :root { --n-gutter: clamp(1.4rem, 6vw, 2.25rem); }
  .n-agency-hero { padding-top: 9.8rem; padding-bottom: 4.6rem; }
  .n-agency-hero__copy { gap: 1.15rem; }
  .n-agency-title { font-size: clamp(3.1rem, 12vw, 4.25rem); max-width: 10.5ch; line-height: .99; }
  .n-agency-lede { font-size: 1rem; }
  .n-studio-orbit { width: 100%; }
  .n-section { padding-block: clamp(4.1rem, 12vw, 5.5rem); }
  .n-section-head { margin-bottom: 2.3rem; }
  .n-shift-feature-mark { width: 145px; height: 145px; }
}
@media (max-width: 420px) {
  .n-header .n-brand-lockup { width: 178px; height: 46px; background-size: calc(100% - 35px) auto; }
  .n-header .n-brand-lockup::before { width: 27px; height: 27px; }
  .n-agency-title { font-size: clamp(2.85rem, 12.25vw, 3.4rem); }
  .n-agency-hero { padding-top: 9.25rem; }
}

/* ============================================================================
 Shift Agency 4.2 / Monochrome interactive art direction, original layout retained
 ============================================================================ */
:root {
  --n-void:#fff;--n-base:#fff;--n-slate:#f5f5f3;--n-raised:#ededeb;
  --n-paper:#101010;--n-mist:#525252;--n-faint:#707070;
  --n-line:rgba(0,0,0,.12);--n-line-strong:rgba(0,0,0,.22);
  --n-foil:linear-gradient(105deg,#0d0d0d,#676767 55%,#c9c9c9);
  --n-foil-a:#151515;--n-foil-b:#555;--n-foil-c:#aaa;
}
body,html,.wp-site-blocks { background:#fff; color:#101010; }
.n-header {background:rgba(255,255,255,.94);border-bottom:1px solid rgba(0,0,0,.085)}
.n-header[data-stuck="true"] {background:rgba(255,255,255,.92);border-bottom-color:rgba(0,0,0,.16);box-shadow:0 8px 28px rgba(0,0,0,.045)}
.n-header .n-brand-lockup,.n-footer .n-brand-lockup {
  display:inline-flex;align-items:center;gap:.74rem;height:auto;min-height:52px;
  width:auto;max-width:100%;background:none!important;opacity:1;aspect-ratio:auto;
}
.n-brand-lockup::before,.n-header .n-brand-lockup::before,.n-footer .n-brand-lockup::before{content:none!important;display:none!important}
.n-brand-emblem { width:37px;height:37px;flex:0 0 37px;display:block;
  background:transparent url('../brand/shift-favicon-192.png') center/contain no-repeat;
  border-radius:50%; }
.n-brand-wordmark {color:#101010;font:800 clamp(1.14rem,1.45vw,1.5rem)/1 var(--n-display,Arial,sans-serif);letter-spacing:-.045em;white-space:nowrap}
.n-brand-wordmark sup {position:relative;vertical-align:super;top:-.25em;font-size:.42em;letter-spacing:0;margin-left:.13em}
.n-footer .n-brand-wordmark{font-size:1.48rem}
.n-footer .n-brand-emblem{width:39px;height:39px;flex-basis:39px}
.n-logo--full{line-height:1.2;white-space:nowrap}
.n-agency-hero{background:#fff}
.n-agency-hero__veil{background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.86) 55%,rgba(255,255,255,.63))}
.n-agency-hero__copy{gap:clamp(.9rem,1.7vw,1.4rem)}
.n-agency-title {font-size:clamp(3.2rem,5.7vw,6rem)}
.n-agency-lede{max-width:53ch;color:#505050}
.n-studio-orbit{background:linear-gradient(155deg,#fafafa,#e9e9e9);border:1px solid rgba(0,0,0,.14);box-shadow:0 35px 85px rgba(0,0,0,.075)}
.n-studio-orbit__core {background:#fff;box-shadow:0 0 0 28px rgba(0,0,0,.03),0 0 70px rgba(0,0,0,.08)}
.n-studio-node{background:rgba(255,255,255,.95);box-shadow:0 18px 44px rgba(0,0,0,.065)}
.n-btn--primary{background:#121212;border-color:#121212;color:#fff}.n-btn--primary:hover{background:#343434;border-color:#343434;color:#fff}
.n-btn--ghost{border-color:rgba(0,0,0,.27);color:#101010}.n-btn--ghost:hover{background:#eee;color:#101010}
.n-proof{background:#f3f3f2;color:#171717}
.n-proof__item{border-color:rgba(0,0,0,.12)}
/* Alternating monochrome backgrounds create editorial rhythm without changing content order. */
#services.n-section{background:#111;color:#fff}
#services .n-eyebrow,#services .n-lede{color:#bdbdbd}
#services .n-eyebrow::before{background:#ddd}
#services .n-agency-service-grid{border-color:rgba(255,255,255,.23);background:#151515}
#services .n-agency-service {background:#151515;color:#fff;border-color:rgba(255,255,255,.19);transition:background .35s ease,transform .35s ease}
#services .n-agency-service:hover{background:#222;transform:translateY(-3px)}
#services .n-agency-service::before{background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.09),transparent 45%)}
#services .n-agency-service p,#services .n-agency-service__index{color:#b8b8b8}
#services .n-agency-service__tags span{color:#eee;border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.045)}
.n-product-feature{background:#f3f3f1}
.n-shift-feature-visual{background:linear-gradient(140deg,#fff,#e9e9e7);border-color:rgba(0,0,0,.14)}
.n-shift-feature-mark{box-shadow:0 18px 45px rgba(0,0,0,.08)}
.n-feature-orbit-label{color:#1e1e1e;border-color:rgba(0,0,0,.18)}
#projects.n-section{background:#fff}
#projects .n-section-head{margin-bottom:clamp(2.2rem,4vw,3.8rem)}
.shift-project-controls{display:flex;gap:1rem;justify-content:space-between;align-items:center;margin-bottom:clamp(1.3rem,3vw,2rem);flex-wrap:wrap}
.shift-project-filters{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.shift-project-filter{font:600 .78rem var(--n-body,Arial,sans-serif);color:#4d4d4d;background:#f6f6f5;border:1px solid #ddd;border-radius:99px;padding:.8rem 1.12rem;min-height:44px;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.shift-project-filter.is-active,.shift-project-filter:hover{color:#fff;background:#111;border-color:#111}
.shift-project-filter:focus-visible,.shift-project-tile a:focus-visible{outline:3px solid #666;outline-offset:4px}
.shift-project-all{font-size:.88rem;font-weight:600;white-space:nowrap;border-bottom:1px solid #111;padding:.45rem 0}
.shift-project-showcase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.2rem,3vw,2.5rem)}
.shift-project-tile{min-width:0;transition:opacity .25s,transform .25s}
.shift-project-tile[hidden]{display:none!important}
.shift-project-tile a{display:block;text-decoration:none;color:inherit}
.shift-project-image{aspect-ratio:1.36;position:relative;border-radius:5px;overflow:hidden;background:#eaeaea;border:1px solid #e3e3e3}
.shift-project-image::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 67%,rgba(0,0,0,.12));opacity:.65}
.shift-project-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .75s cubic-bezier(.2,.8,.2,1),filter .55s}
.shift-project-tile:hover .shift-project-image img{transform:scale(1.05);filter:contrast(1.025)}
.shift-project-visit{position:absolute;z-index:2;right:1.1rem;top:1.1rem;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#111;box-shadow:0 6px 22px rgba(0,0,0,.09);transform:translateY(-6px);opacity:0;transition:transform .3s,opacity .3s}
.shift-project-tile:hover .shift-project-visit,.shift-project-tile a:focus-visible .shift-project-visit{transform:translateY(0);opacity:1}
.shift-project-meta{display:flex;justify-content:space-between;gap:1rem;margin:1.12rem 0 .6rem;color:#777;font:600 .62rem var(--n-machine,monospace);letter-spacing:.14em}
.shift-project-bottom{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.shift-project-bottom h3{font-family:var(--n-display,Arial,sans-serif);font-size:clamp(1.5rem,2.4vw,2.4rem);letter-spacing:-.045em;line-height:1.1;margin:0}
.shift-project-bottom p{font-size:.86rem;color:#5c5c5c;margin:0}
.shift-portfolio-disclosure{font-size:.75rem;color:#777;margin-top:2rem;line-height:1.6}
.n-process{background:#f3f3f2;border-top:0}
.n-process__grid li{border-color:rgba(0,0,0,.17)}
.n-agency-cta{background:#0c0c0c;color:#fff;border:0}
.n-agency-cta .n-lede,.n-agency-cta .n-eyebrow{color:#bcbcbc}
.n-agency-cta .n-eyebrow::before{background:#fff}
.n-agency-cta .n-foil-text{background:linear-gradient(105deg,#fff,#8e8e8e);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.n-agency-cta .n-btn--primary{background:#fff;color:#111;border-color:#fff}
.n-agency-cta .n-btn--primary:hover{background:#d7d7d7;color:#111}
.n-footer{background:#fff}
.n-footer__statement{max-width:42ch;color:#555}
.n-portfolio-explorer__caption{background:#171717}
.n-subhero,.n-work-hero{background:#fff}
.shift-service-deliverables{font:600 .68rem var(--n-machine,monospace);letter-spacing:.14em;text-transform:uppercase;color:#555;max-width:65ch;line-height:2}
.shift-service-landing .n-shell{justify-items:start}
@media (max-width:800px){
 .shift-project-showcase{gap:1.8rem}
 .shift-project-bottom{display:block}
 .shift-project-bottom p{margin-top:.45rem}
 .n-brand-emblem{width:31px;height:31px;flex-basis:31px}
 .n-header .n-brand-lockup{width:auto;height:auto;min-height:46px;background:none!important}
}
@media (max-width:620px){
 .shift-project-showcase{grid-template-columns:minmax(0,1fr);gap:2.2rem}
 .shift-project-controls{align-items:flex-start}
 .shift-project-filters{width:100%}
 .shift-project-filter{padding:.72rem .95rem;font-size:.71rem}
 .shift-project-image{aspect-ratio:1.38}
 .shift-project-visit{opacity:1;transform:none;width:38px;height:38px}
 .n-header .n-brand-lockup{width:auto;max-width:220px;height:auto;background:none!important}
 .n-brand-wordmark{font-size:1.23rem}
 .n-footer .n-brand-wordmark{font-size:1.28rem}
 #services .n-agency-service:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){.shift-project-image img,.shift-project-tile,.shift-project-visit,#services .n-agency-service{transition:none!important;transform:none!important}}
/* Keep substantial editorial panels painted even during fast scroll and full-page capture. */
.n-product-feature,.n-process,.n-agency-service-grid,.n-agency-work-grid{content-visibility:visible!important;contain-intrinsic-size:auto!important}


/* ========================================================================
  Shift Agency 4.3 — cinematic hero / independent method / composed portfolio
   ======================================================================== */
.n-hero--cinematic { background:#fff; overflow:hidden; }
.n-hero--cinematic .n-agency-hero__grid { grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:clamp(2rem,4.6vw,5rem); }
.n-hero--cinematic .n-agency-hero__copy { padding-top:clamp(1.5rem,4vh,3rem); }
.n-hero--cinematic .n-agency-title { max-width:11.5ch; font-size:clamp(3.1rem,5.5vw,5.85rem); }
.n-hero--cinematic .n-agency-hero__video, .n-hero--cinematic .n-agency-hero__veil { display:none!important; }
.shift-hero-index {width:100%;border-top:1px solid #dfdfdf;margin-top:clamp(2rem,5vh,4rem);padding-top:1rem;display:flex;gap:.8rem;justify-content:space-between;flex-wrap:wrap;color:#737373;font:500 .59rem var(--n-machine,monospace);letter-spacing:.12em}
.shift-hero-film { min-width:0; background:#101113; border:1px solid #232527; border-radius:14px; overflow:hidden; color:#fff; box-shadow:0 40px 90px rgba(12,15,23,.17); }
.shift-hero-film__top,.shift-hero-film__bottom {min-height:57px;padding:1.15rem 1.3rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;color:#c6c9ce;font:600 .59rem var(--n-machine,monospace);letter-spacing:.13em;}
.shift-hero-film__top i,.shift-hero-film__live i {display:inline-block;height:7px;width:7px;margin-right:.45rem;border-radius:50%;background:#acffa0;box-shadow:0 0 14px #acffa077}
.shift-hero-film__screen {position:relative;background:radial-gradient(ellipse at 70% 12%,#454c54 0%,#15191d 42%,#0d1014 100%);height:clamp(390px,40vw,580px);isolation:isolate;overflow:hidden;}
.shift-hero-film__fallback {position:absolute;inset:0;z-index:0;display:flex;align-items:center;justify-content:center;padding:2.5rem;text-align:left;color:#e7e8eb;font-family:var(--n-display,Arial,sans-serif);font-size:clamp(2.4rem,4.4vw,4.9rem);font-weight:800;letter-spacing:-.055em;line-height:1.02;}
.shift-hero-film__fallback:after {position:absolute;content:'';width:350px;height:350px;border:1px solid #fff2;box-shadow:0 0 0 55px #ffffff08,0 0 0 120px #ffffff06;border-radius:50%;transform:translate(65%,-28%);pointer-events:none;}
.shift-hero-film__period {color:#a7efa2}
.shift-hero-film__video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:1;opacity:1;background:transparent}
.shift-hero-film__shade {position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.02),transparent 48%,rgba(0,0,0,.44));}
.shift-hero-film__overlay {position:absolute;z-index:3;bottom:1.35rem;left:1.35rem;right:1.35rem;display:flex;align-items:center;justify-content:space-between;gap:.8rem;color:#fff;font:600 .6rem var(--n-machine,monospace);letter-spacing:.12em}
.shift-hero-film__live {padding:.55rem .75rem;border:1px solid #ffffff55;border-radius:40px;background:#0007;white-space:nowrap}
.shift-hero-film__actions {display:flex;align-items:center;gap:1.4rem;}
.shift-hero-film__bottom a,.shift-hero-film__toggle {font:inherit;color:#fff;text-decoration:none;letter-spacing:inherit;background:transparent;border:0;padding:.2rem 0;cursor:pointer;}
.shift-hero-film__bottom a:hover,.shift-hero-film__toggle:hover {color:#c5f6bf}
.shift-hero-film__bottom .shift-hero-film__toggle:focus-visible {outline:2px solid #fff;outline-offset:4px}
.shift-method {background:#f5f5f3!important;border-top:1px solid #e6e6e6}
.shift-method__grid {display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2.6rem,5.5vw,6rem);align-items:center;}
.shift-method__copy {align-self:center;min-width:0;}
.shift-method__copy .n-h2 {max-width:11ch;margin:1.4rem 0 1.5rem;letter-spacing:-.05em}
.shift-method__copy .n-h2 em {font-style:normal;text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.12em;}
.shift-method__period{color:#868686}
.shift-method__copy .n-lede {font-size:clamp(1.08rem,1.45vw,1.25rem);line-height:1.65;max-width:43ch;color:#525252}
.shift-method__steps {display:grid;grid-template-columns:1fr 1fr;gap:0;margin:clamp(2.2rem,4vw,3.5rem) 0 2.1rem;border-top:1px solid #dadada;border-left:1px solid #dadada}
.shift-method__steps>div {display:grid;gap:.32rem;min-height:110px;padding:1.1rem 1rem;border-right:1px solid #dadada;border-bottom:1px solid #dadada;}
.shift-method__steps span {font:600 .62rem var(--n-machine,monospace);letter-spacing:.1em;color:#767676}
.shift-method__steps strong {font-size:1.05rem;line-height:1.2;color:#191919}
.shift-method__steps small {font-size:.78rem;color:#737373}
.shift-method__link {border-bottom:1px solid #121212;font-weight:700;display:inline-flex;gap:2rem;padding-bottom:.4rem;color:#171717;text-decoration:none}
.shift-method__link:hover {gap:2.4rem}
.shift-method__diagram {min-height:0;max-width:100%;width:100%;justify-self:stretch;border-radius:16px;overflow:hidden;background:linear-gradient(150deg,#fff,#ececec)}
.shift-method__diagram .n-studio-orbit__canvas {min-height:480px}
/* Keep screenshots entirely in-frame, centered and non-cropped across filters. */
.shift-project-image {aspect-ratio:16/9;display:grid;place-items:center;background:#f0f1f2;overflow:hidden}
.shift-project-image img {position:relative;object-fit:contain!important;object-position:center center!important;width:100%;height:100%;max-width:100%;max-height:100%;transform:none!important;filter:none!important;}
.shift-project-tile:hover .shift-project-image img {transform:none!important}
.shift-project-tile:hover {transform:translateY(-3px)}
.shift-project-image::after {background:none}
.n-portfolio-shot img,.n-explorer-image {object-fit:contain!important;object-position:center center!important;transform:none!important;background:#f0f1f2}
.n-portfolio-card:hover .n-portfolio-shot img {transform:none!important}
/* Footer rebuilt into one brand column and three balanced link columns. */
.shift-footer {background:#fff;margin-top:0;padding:0;border-top:1px solid #e3e3e3}
.shift-footer__top {display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1.4rem;padding:clamp(3.5rem,6vw,5.5rem) 0;border-bottom:1px solid #dedede}
.shift-footer__top>span {font:600 .65rem var(--n-machine,monospace);color:#767676;letter-spacing:.2em;}
.shift-footer__cta {font:800 clamp(1.5rem,2.8vw,2.8rem)/1.12 var(--n-display,Arial,sans-serif)!important;letter-spacing:-.04em;text-decoration:none;color:#131313!important;}
.shift-footer__cta span {font-size:.65em;margin-left:.35em;}
.shift-footer__grid {display:grid!important;grid-template-columns:minmax(0,1.9fr) repeat(3,minmax(120px,.65fr))!important;gap:clamp(2rem,4vw,5rem)!important;padding:clamp(3rem,5vw,5rem) 0 4rem}
.shift-footer__grid>div {grid-column:auto!important;min-width:0}
.shift-footer__brand .n-brand-lockup{min-height:46px}
.shift-footer__brand .n-footer__statement {max-width:34ch!important;font-size:1rem;line-height:1.7;color:#4f4f4f;margin-top:1.45rem}
.shift-footer__column h4 {font-size:.69rem;letter-spacing:.17em;color:#777;margin:.8rem 0 1.45rem}
.shift-footer__column ul {display:grid;gap:.9rem}
.shift-footer__column a {color:#242424;font-size:.88rem;text-decoration:none}
.shift-footer__column a:hover {text-decoration:underline;text-underline-offset:.2em}
.shift-footer__bottom {display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.4rem 0 2.2rem;color:#666;border-top:1px solid #e1e1e1;font-size:.7rem}
.shift-footer__bottom span:nth-child(2){font-family:var(--n-machine,monospace);letter-spacing:.1em;font-size:.6rem}
.shift-footer__bottom a {font-size:.75rem;color:#333}
@media(max-width:1090px){.n-hero--cinematic .n-agency-hero__grid {grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.shift-method__grid {grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.shift-footer__grid{grid-template-columns:1.4fr repeat(3,minmax(100px,1fr))!important;gap:2rem!important}}
@media(max-width:880px){.n-hero--cinematic .n-agency-hero__grid{grid-template-columns:1fr;gap:3rem}.shift-hero-film {max-width:740px;width:100%;justify-self:center}.shift-hero-film__screen{height:clamp(370px,65vw,550px)}.shift-method__grid{grid-template-columns:1fr;gap:2.7rem}.shift-method__copy .n-h2 {max-width:none}.shift-method__diagram{max-width:760px;margin-inline:auto}.shift-footer__grid{grid-template-columns:1.5fr 1fr 1fr!important}.shift-footer__brand {grid-column:1/-1!important}.shift-footer__grid>.shift-footer__column:last-child{grid-column:auto!important}}
@media(max-width:620px){.n-hero--cinematic .n-agency-hero__copy {padding-top:0}.shift-hero-film__top,.shift-hero-film__bottom{padding:.9rem;font-size:.52rem;flex-wrap:wrap}.shift-hero-film__screen{height:380px}.shift-hero-film__fallback{font-size:2.7rem}.shift-hero-index{display:none}.shift-method__diagram .n-studio-orbit__canvas{min-height:345px}.shift-method__steps>div{min-height:98px}.shift-footer__grid{grid-template-columns:1fr 1fr!important;gap:2.3rem 1.4rem!important}.shift-footer__brand{grid-column:1/-1!important}.shift-footer__top{align-items:flex-start}.shift-footer__bottom{align-items:flex-start;flex-direction:column}.shift-project-image{aspect-ratio:16/9}}
@media(max-width:390px){.shift-hero-film__screen{height:330px}.shift-footer__grid{grid-template-columns:1fr 1fr!important}.shift-hero-film__actions{gap:.65rem}.shift-hero-film__overlay{font-size:.5rem}}
@media(prefers-reduced-motion:reduce){.shift-hero-film__video{display:none!important}.shift-project-tile:hover{transform:none}.shift-method__diagram .n-studio-node{animation:none!important}}
/* ========================================================================
 Shift Agency v4.4 — premium, distinctly designed inner pages and navigation
 Source images are existing portfolio screenshots; no stock-image dependencies.
 ======================================================================== */
.n-header__inner{display:grid;grid-template-columns:minmax(185px,1fr) auto minmax(185px,1fr);column-gap:clamp(1.4rem,2.3vw,3rem);align-items:center}
.n-header__actions{justify-self:end}
.n-nav.shift-main-nav{display:flex;align-items:center;gap:clamp(1.2rem,2.35vw,2.6rem);white-space:nowrap}
.shift-main-nav>a,.shift-nav-group>a{color:#252525;text-decoration:none;font-size:.87rem;font-weight:600;letter-spacing:-.01em}
.shift-nav-group{position:relative;display:flex;align-items:center}
.shift-nav-group>a{display:flex;align-items:center;gap:.45rem;padding:1rem 0}
.shift-chevron{font-size:1rem;line-height:1;transform:translateY(-2px);transition:transform .2s}
.shift-nav-group:hover .shift-chevron,.shift-nav-group:focus-within .shift-chevron{transform:translateY(-2px) rotate(180deg)}
.shift-nav-dropdown{display:grid;gap:0;position:absolute;top:100%;left:-1.4rem;z-index:50;width:min(355px,80vw);padding:1.15rem;border:1px solid #e4e4e4;border-radius:14px;box-shadow:0 24px 70px #00000018;background:#fff;visibility:hidden;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s,transform .2s,visibility .2s}
.shift-nav-group:hover .shift-nav-dropdown,.shift-nav-group:focus-within .shift-nav-dropdown{visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto}
.shift-nav-dropdown p{margin:0 0 .5rem;padding:.35rem .75rem .7rem;color:#747474;font:700 .6rem var(--n-machine,monospace);letter-spacing:.14em}
.shift-nav-dropdown a{display:grid;gap:.28rem;padding:.8rem .75rem;border-radius:8px;text-decoration:none;color:#161616!important}
.shift-nav-dropdown a:hover,.shift-nav-dropdown a:focus-visible{background:#f2f2f0}
.shift-nav-dropdown a:after{display:none!important}
.shift-nav-dropdown strong{font-size:.95rem}
.shift-nav-dropdown a span{font-size:.76rem;font-weight:400;color:#6a6a6a}
@media(max-width:1060px){.n-header__inner{grid-template-columns:auto 1fr auto}.n-nav.shift-main-nav{gap:1.15rem}}
@media(max-width:880px){.n-nav.shift-main-nav{display:none}.n-header__inner{display:flex;justify-content:space-between}.n-header__actions{margin-left:auto}}
/* Shared inner-page composition */
.shift-inner-hero,.shift-about-hero,.shift-services-hero,.shift-insights-hero{background:#fff;color:#111;padding:clamp(9.5rem,16vw,13rem) 0 clamp(4rem,7vw,7rem)}
.shift-inner-hero__layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(2.5rem,5vw,6rem);align-items:center}
.shift-inner-hero__copy{min-width:0}
.shift-inner-hero__heading{font:800 clamp(3.1rem,5.05vw,5.7rem)/1.045 var(--n-display,Arial,sans-serif);letter-spacing:-.065em;color:#101010;text-wrap:balance;margin:1.25rem 0 1.55rem}
.shift-inner-hero__lede,.shift-insights-hero__grid>p{font:400 clamp(1.04rem,1.38vw,1.22rem)/1.65 var(--n-body,Arial,sans-serif);color:#555;max-width:51ch;margin:0}
.shift-inner-hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:1.4rem;margin-top:2.2rem}
.shift-text-link{display:inline-flex;gap:.65rem;align-items:center;width:max-content;max-width:100%;color:#1b1b1b;text-decoration:none;font-weight:700;font-size:.87rem;border-bottom:1px solid #333;padding-bottom:.4rem;transition:gap .25s}
.shift-text-link:hover{gap:1rem}
.shift-inner-hero__strip{display:flex;gap:.75rem;flex-wrap:wrap;border-top:1px solid #ddd;margin-top:clamp(4rem,7vw,7rem);padding-top:1.5rem}
.shift-inner-hero__strip span{padding:.73rem 1.06rem;border:1px solid #d7d7d7;border-radius:90px;color:#444;font:.68rem var(--n-machine,monospace);text-transform:uppercase;letter-spacing:.04em}
.shift-visual-card{min-width:0}
.shift-browser{border:1px solid #d6d6d6;background:#f3f3f3;border-radius:13px;box-shadow:0 24px 62px #16161614;overflow:hidden;transition:transform .45s,box-shadow .45s}
.shift-visual-card:hover .shift-browser{transform:translateY(-7px);box-shadow:0 32px 68px #16161622}
.shift-browser__bar{height:45px;display:flex;align-items:center;justify-content:space-between;gap:.9rem;padding:0 1rem;background:#fff;border-bottom:1px solid #ddd;color:#707070;font:600 .59rem var(--n-machine,monospace);letter-spacing:.055em;text-transform:uppercase}
.shift-browser__dots{display:flex;gap:5px}.shift-browser__dots i{width:7px;height:7px;border-radius:50%;background:#c9c9c9}
.shift-browser img{width:100%;height:auto;aspect-ratio:1.58;object-fit:contain;object-position:center;display:block;background:#f3f3f3}
.shift-visual-caption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;align-items:baseline;margin-top:1rem}
.shift-visual-caption span{font:600 .62rem var(--n-machine,monospace);letter-spacing:.12em;color:#7b7b7b}
.shift-visual-caption strong{font-size:.96rem;color:#252525}
.shift-inner-feature{background:#f2f2f1!important}
.shift-inner-feature__layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(3rem,8vw,8rem);align-items:center}
.shift-inner-feature__copy h2,.shift-about-values__intro h2,.shift-inner-process__head h2{font:800 clamp(2.25rem,4.1vw,4.35rem)/1.09 var(--n-display,Arial,sans-serif);letter-spacing:-.055em;color:#141414;margin:1.15rem 0}
.shift-inner-feature__copy p:not(.n-eyebrow){line-height:1.75;color:#555;max-width:46ch;margin-bottom:1.9rem}
.shift-inner-process{background:#111!important;color:#fff}
.shift-inner-process .n-eyebrow,.shift-inner-process__head>p{color:#bbb!important}
.shift-inner-process__head{display:grid;grid-template-columns:1.2fr .8fr;gap:3rem;align-items:end;margin-bottom:3rem}
.shift-inner-process__head h2{color:#fff;max-width:13ch}
.shift-inner-process__head>p{max-width:30ch;line-height:1.6;justify-self:end}
.shift-inner-process__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #555;border-left:1px solid #555}
.shift-inner-step{border-right:1px solid #555;border-bottom:1px solid #555;min-height:185px;padding:1.45rem;transition:background .25s}
.shift-inner-step[open],.shift-inner-step:hover{background:#232323}
.shift-inner-step summary{cursor:pointer;list-style:none;display:grid;gap:1.1rem;align-items:start}
.shift-inner-step summary::-webkit-details-marker{display:none}
.shift-inner-step summary span{font:600 .68rem var(--n-machine,monospace);color:#aaa}
.shift-inner-step summary strong{font-size:clamp(1.05rem,1.5vw,1.4rem);letter-spacing:-.03em}
.shift-inner-step summary b{font-size:1.3rem;font-weight:300;color:#bbb}
.shift-inner-step[open] summary b{transform:rotate(45deg)}
.shift-inner-step p{font-size:.88rem;color:#c8c8c8;line-height:1.6;margin:1.3rem 0 0}
/* About */
.shift-about-hero__intro,.shift-services-hero__intro,.shift-insights-hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,7vw,7rem);align-items:end}
.shift-about-hero__intro .shift-inner-hero__lede{margin:0 0 .3rem}
.shift-about-hero__visuals{display:grid;grid-template-columns:1.25fr .75fr;align-items:start;gap:clamp(1rem,3vw,2.2rem);margin-top:clamp(3rem,5vw,5rem)}
.shift-about-image{margin:0;min-width:0}
.shift-about-image:nth-child(2){margin-top:clamp(2rem,7vw,7rem)}
.shift-about-image img{display:block;width:100%;height:auto;aspect-ratio:1.43;object-fit:contain;object-position:center;background:#ededed;border:1px solid #dedede}
.shift-about-image figcaption{font:600 .65rem var(--n-machine,monospace);letter-spacing:.14em;color:#777;margin-top:.9rem}
.shift-credentials{background:#111!important;color:#fff!important}
.shift-credentials__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid #484848;border-bottom:1px solid #484848}
.shift-credentials__item{display:grid;align-content:center;gap:.55rem;min-height:155px;padding:1.75rem 2rem;border-right:1px solid #484848}
.shift-credentials__item:last-child{border-right:0}
.shift-credentials__item strong{font:800 clamp(2rem,4vw,4.3rem)/1 var(--n-display,Arial,sans-serif);letter-spacing:-.055em;color:#fff}
.shift-credentials__item strong span{font-size:.72em}
.shift-credentials__item>span{font:600 .67rem var(--n-machine,monospace);letter-spacing:.14em;color:#bdbdbd;text-transform:uppercase}
.shift-about-values{background:#f3f3f1!important}
.shift-about-values__intro{display:grid;grid-template-columns:.28fr 1fr;gap:3rem;align-items:start;margin-bottom:3rem}
.shift-about-values__intro h2{margin:0;max-width:19ch}
.shift-about-values__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #cacaca}
.shift-about-values__grid article{padding:2.2rem 2rem 2.5rem 0;border-right:1px solid #d1d1d1;margin-right:2rem}
.shift-about-values__grid article:last-child{border-right:0;margin-right:0}
.shift-about-values__grid article span,.shift-about-location span{font:600 .66rem var(--n-machine,monospace);letter-spacing:.15em;color:#747474}
.shift-about-values__grid h3{font:700 clamp(1.4rem,2vw,2rem)/1.2 var(--n-display,Arial,sans-serif);letter-spacing:-.04em;margin:2rem 0 1rem}
.shift-about-values__grid p{color:#555;line-height:1.65}
.shift-about-location{display:flex;align-items:center;flex-wrap:wrap;gap:1.5rem;border-top:1px solid #c6c6c6;margin-top:4rem;padding-top:2rem}
.shift-about-location strong{font:800 2rem var(--n-display,Arial,sans-serif)}
.shift-about-location span:last-child{margin-left:auto}
/* Services overview */
.shift-services-hero__intro h1,.shift-insights-hero h1,.shift-contact-v44 h1{font:800 clamp(3.1rem,5.5vw,6rem)/1.06 var(--n-display,Arial,sans-serif);letter-spacing:-.06em;color:#111;margin:1rem 0 0;text-wrap:balance}
.shift-services-hero__intro>p{font-size:clamp(1.06rem,1.48vw,1.29rem);color:#555;line-height:1.7}
.shift-services-hero__gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:4rem}
.shift-services-hero__gallery figure{margin:0;min-width:0}
.shift-services-hero__gallery img{width:100%;height:auto;aspect-ratio:1.27;object-fit:contain;background:#f3f3f3;border:1px solid #dedede}
.shift-services-hero__gallery figcaption{font:600 .64rem var(--n-machine,monospace);letter-spacing:.12em;color:#777;margin-top:.7rem}
.shift-services-directory{background:#f3f3f2!important}
.shift-services-directory__grid{display:grid;grid-template-columns:1fr 1fr;margin-top:2.7rem;border-top:1px solid #bfbfbf;border-left:1px solid #bfbfbf}
.shift-services-directory__grid a{position:relative;display:block;color:#111;text-decoration:none;padding:clamp(2rem,4vw,4rem);border-right:1px solid #bfbfbf;border-bottom:1px solid #bfbfbf;min-height:265px;transition:background .25s,color .25s}
.shift-services-directory__grid a:hover{background:#121212;color:#fff}
.shift-services-directory__grid a span{font:600 .62rem var(--n-machine,monospace);letter-spacing:.15em;color:#777}
.shift-services-directory__grid a:hover span{color:#bbb}
.shift-services-directory__grid a h2{font:700 clamp(1.6rem,2.6vw,2.8rem)/1.15 var(--n-display,Arial,sans-serif);letter-spacing:-.045em;margin:2rem 0 1rem}
.shift-services-directory__grid a p{font-size:.97rem;max-width:37ch;line-height:1.6;color:#666}
.shift-services-directory__grid a:hover p{color:#ccc}
.shift-services-directory__grid a b{position:absolute;right:2rem;top:2rem;font-size:1.2rem;font-weight:400}
/* Editorial insights — actual site previews, not generic imagery */
.shift-insights-hero__grid{align-items:end}
.shift-insights-hero__featured{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;margin-top:4rem;padding:clamp(1.5rem,3vw,3rem);background:#111;color:#fff}
.shift-insights-hero__featured>div>span,.shift-insights-topics__grid a>span{font:600 .63rem var(--n-machine,monospace);letter-spacing:.15em;color:#aaa}
.shift-insights-hero__featured h2{font:750 clamp(2rem,3.6vw,3.9rem)/1.1 var(--n-display,Arial,sans-serif);letter-spacing:-.05em;color:#fff;margin:1.5rem 0}
.shift-insights-hero__featured p{font-size:1rem;line-height:1.7;color:#ccc;max-width:48ch}
.shift-insights-hero__featured a{display:inline-flex;margin-top:1.6rem;color:#fff;border-bottom:1px solid #fff;text-decoration:none;padding-bottom:.4rem}
.shift-insights-hero__featured img{width:100%;height:auto;aspect-ratio:1.33;object-fit:contain;background:#e8e8e8}
.shift-insights-topics{background:#f4f4f3!important}
.shift-insights-topics__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;margin-top:3rem}
.shift-insights-topics__grid a{text-decoration:none;color:#141414;display:block;min-width:0}
.shift-insights-topics__grid a img{display:block;width:100%;height:auto;aspect-ratio:1.43;object-fit:contain;background:#ddd;transition:transform .25s}
.shift-insights-topics__grid a:hover img{transform:translateY(-4px)}
.shift-insights-topics__grid a>span{display:block;color:#777;margin:1.2rem 0}
.shift-insights-topics__grid h3{font:700 clamp(1.25rem,1.8vw,2rem)/1.2 var(--n-display,Arial,sans-serif);letter-spacing:-.035em}
.shift-insights-topics__grid p{line-height:1.6;color:#606060}
/* Contact: explicit surface colors eliminate inherited dark-theme artifacts */
.shift-contact-v44,.shift-contact-v44 *{box-sizing:border-box}
.shift-contact-v44{background:#fff!important;color:#151515!important;padding:clamp(9rem,15vw,12.5rem) 0 clamp(5rem,8vw,8rem);position:relative;isolation:isolate}
.shift-contact-v44__head{text-align:left;max-width:1168px}
.shift-contact-v44__head h1{max-width:17ch;margin:1.15rem 0}
.shift-contact-v44__head>p:last-child{color:#525252;font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.65;max-width:59ch}
.shift-contact-v44__body{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(2rem,7vw,7rem);margin-top:clamp(3rem,5vw,5rem);align-items:start}
.shift-contact-v44__aside{display:grid;gap:1rem}
.shift-contact-v44__quote{background:#151515!important;color:#fff!important;padding:clamp(1.7rem,3.4vw,3.5rem);border-radius:12px}
.shift-contact-v44__quote span{font:600 .66rem var(--n-machine,monospace);letter-spacing:.15em;color:#bbb!important}
.shift-contact-v44__quote h2{font:750 clamp(2rem,3.2vw,3.4rem)/1.15 var(--n-display,Arial,sans-serif);letter-spacing:-.05em;color:#fff!important;margin:2.5rem 0 1rem}
.shift-contact-v44__quote p{color:#c9c9c9!important;line-height:1.65}
.shift-contact-v44__quote a{color:#fff!important;display:inline-flex;text-decoration:none;border-bottom:1px solid #eee;padding-bottom:.5rem;margin-top:2rem}
.shift-contact-v44__detail{display:grid;gap:.55rem;padding:1.25rem 0;border-bottom:1px solid #d8d8d8}
.shift-contact-v44__detail span{font:600 .63rem var(--n-machine,monospace);letter-spacing:.14em;color:#777!important}
.shift-contact-v44__detail strong{color:#171717!important;font-weight:600}
.shift-contact-v44__panel{border:1px solid #dcdcdc;background:#f8f8f7!important;color:#111!important;padding:clamp(1.5rem,3vw,3rem);border-radius:12px;box-shadow:0 20px 55px #0000000b;min-width:0}
.shift-contact-v44__panel-head{display:flex;justify-content:space-between;gap:.75rem;padding-bottom:1.25rem;margin-bottom:1.6rem;border-bottom:1px solid #d0d0d0;color:#666;font:600 .64rem var(--n-machine,monospace);letter-spacing:.1em}
.shift-contact-v44__panel .n-inquiry-form{display:grid;gap:1.15rem;color:#111!important}
.shift-contact-v44__panel .n-inquiry-form label{display:grid;gap:.43rem;color:#292929!important;font-size:.85rem;font-weight:600}
.shift-contact-v44__panel .n-inquiry-form input:not([type="checkbox"]),.shift-contact-v44__panel .n-inquiry-form textarea,.shift-contact-v44__panel .n-inquiry-form select{display:block;width:100%;max-width:100%;border:1px solid #b8b8b8!important;background:#fff!important;color:#161616!important;border-radius:6px;padding:1rem!important;min-height:51px;font:400 1rem/1.5 inherit!important}
.shift-contact-v44__panel .n-inquiry-form textarea{min-height:150px;resize:vertical}
.shift-contact-v44__panel .n-inquiry-form input:focus,.shift-contact-v44__panel .n-inquiry-form select:focus,.shift-contact-v44__panel .n-inquiry-form textarea:focus{outline:2px solid #191919!important;outline-offset:2px;border-color:#111!important}
.shift-contact-v44__panel .n-inquiry-form .n-consent{display:flex!important;gap:.7rem;align-items:flex-start;color:#3f3f3f!important;line-height:1.55;font-size:.77rem}
.shift-contact-v44__panel .n-consent input{width:18px;height:18px;margin-top:2px;flex:0 0 18px;accent-color:#111}
.shift-contact-v44__panel .n-consent a{color:#1d1d1d!important;text-decoration:underline}
.shift-contact-v44__panel .n-btn--primary{background:#111!important;border-color:#111!important;color:#fff!important;min-height:52px}
.shift-contact-v44__panel .n-form-notice{color:#222;background:#e9e9e9;border-radius:6px;padding:1rem}
/* Inner page general color consistency and accessibility */
.shift-inner-hero .n-eyebrow,.shift-about-hero .n-eyebrow,.shift-services-hero .n-eyebrow,.shift-insights-hero .n-eyebrow,.shift-contact-v44 .n-eyebrow{color:#676767!important}
.shift-inner-hero .n-eyebrow:before,.shift-about-hero .n-eyebrow:before,.shift-services-hero .n-eyebrow:before,.shift-insights-hero .n-eyebrow:before,.shift-contact-v44 .n-eyebrow:before{background:#111!important}
.shift-inner-feature .shift-text-link:focus-visible,.shift-services-directory__grid a:focus-visible,.shift-main-nav a:focus-visible{outline:2px solid #111;outline-offset:4px}
@media(max-width:1080px){.shift-inner-hero__layout{grid-template-columns:1fr 1fr;gap:2rem}.shift-inner-hero__heading{font-size:clamp(2.7rem,5.2vw,4rem)}.shift-inner-feature__layout{grid-template-columns:1fr 1fr}.shift-inner-process__steps{grid-template-columns:1fr 1fr}}
@media(max-width:880px){.shift-inner-hero,.shift-about-hero,.shift-services-hero,.shift-insights-hero{padding-top:8rem}.shift-inner-hero__layout,.shift-inner-feature__layout,.shift-about-hero__intro,.shift-services-hero__intro,.shift-insights-hero__grid,.shift-contact-v44__body{grid-template-columns:1fr;gap:2.4rem}.shift-inner-hero__heading{font-size:clamp(3rem,8vw,5rem)}.shift-contact-v44{padding-top:8rem}.shift-inner-hero__visual{max-width:760px}}
@media(max-width:620px){.shift-inner-hero,.shift-about-hero,.shift-services-hero,.shift-insights-hero{padding-top:7.5rem}.shift-inner-hero__heading,.shift-contact-v44 h1{font-size:clamp(2.7rem,11.5vw,4rem)}.shift-inner-hero__strip{margin-top:3rem}.shift-inner-hero__strip span{font-size:.6rem}.shift-inner-process__head,.shift-about-values__intro,.shift-insights-hero__featured{grid-template-columns:1fr;gap:1rem}.shift-inner-process__steps,.shift-about-values__grid,.shift-credentials__grid,.shift-services-directory__grid,.shift-insights-topics__grid{grid-template-columns:1fr}.shift-inner-step{min-height:unset}.shift-credentials__item{border-right:0;border-bottom:1px solid #484848;min-height:135px}.shift-credentials__item:last-child{border-bottom:0}.shift-about-hero__visuals{grid-template-columns:1fr}.shift-about-image:nth-child(2){margin-top:0}.shift-about-values__grid article{border-right:0;border-bottom:1px solid #d1d1d1;padding:1.5rem 0;margin:0}.shift-about-location span:last-child{margin-left:0}.shift-services-hero__gallery{grid-template-columns:1fr 1fr;gap:1.3rem}.shift-services-hero__gallery figure:last-child{grid-column:1/-1}.shift-services-directory__grid a{min-height:210px}.shift-insights-hero__featured{padding:1.5rem}.shift-contact-v44__panel{padding:1.25rem}.shift-contact-v44{padding-top:7.5rem}.shift-contact-v44__panel-head{font-size:.58rem}}
@media(prefers-reduced-motion:reduce){.shift-browser,.shift-insights-topics__grid a img,.shift-text-link,.shift-services-directory__grid a{transition:none!important;transform:none!important}}

/* Project overview: genuine portfolio imagery, not an abstract generic index. */
.shift-projects-hero{background:#fff;padding:clamp(10rem,17vw,14rem) 0 clamp(4rem,8vw,7.5rem)}
.shift-projects-hero__grid{display:grid;grid-template-columns:.93fr 1.07fr;gap:clamp(3rem,6vw,7rem);align-items:center}
.shift-projects-hero h1{font:800 clamp(3.2rem,5.5vw,6.2rem)/1.04 var(--n-display,Arial,sans-serif);letter-spacing:-.062em;color:#111;margin:1.2rem 0}
.shift-projects-hero__grid>div:first-child>p:not(.n-eyebrow){font-size:clamp(1.05rem,1.5vw,1.25rem);color:#565656;line-height:1.65;max-width:45ch;margin-bottom:2rem}
.shift-projects-hero__art{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:center}
.shift-projects-hero__art img{width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;object-position:center;background:#ebebeb;border:1px solid #dadada;box-shadow:0 18px 35px #0000000c}
.shift-projects-hero__art img:nth-child(2){margin-top:4rem}
.shift-projects-hero__art span{grid-column:1/-1;font:600 .62rem var(--n-machine,monospace);color:#777;letter-spacing:.15em}
@media(max-width:880px){.shift-projects-hero__grid{grid-template-columns:1fr}.shift-projects-hero{padding-top:8rem}.shift-projects-hero h1{max-width:14ch}}
@media(max-width:620px){.shift-projects-hero{padding-top:7rem}.shift-projects-hero h1{font-size:clamp(2.65rem,11vw,4rem)}.shift-projects-hero__art img:nth-child(2){margin-top:1.5rem}}
/* Strong keyboard-focus fallback for the navigation flyout. */
.shift-nav-group:focus-within > .shift-nav-dropdown{visibility:visible!important;opacity:1!important;transform:translateY(0)!important;pointer-events:auto!important}


/* v4.5 Pricing page */
.shift-pricing-hero{padding:10rem 0 3.5rem;background:linear-gradient(180deg,#f7f7f7 0%,#fff 70%)}
.shift-pricing-hero__layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.95fr);gap:3rem;align-items:center}
.shift-pricing-hero__copy{max-width:650px}.shift-pricing-hero__actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.8rem}
.shift-pricing-grid-section{background:#fff}.shift-pricing-grid__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,430px);gap:2rem;align-items:end;margin-bottom:2.4rem}
.shift-pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.shift-price-card{background:#fff;border:1px solid #d8d8d8;border-radius:28px;padding:2rem;display:flex;flex-direction:column;min-height:100%;box-shadow:0 16px 45px rgba(17,24,39,.05);transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease}
.shift-price-card:hover{transform:translateY(-4px);box-shadow:0 24px 60px rgba(17,24,39,.09);border-color:#b7c0ca}.shift-price-card--featured{border-color:#0f172a;box-shadow:0 26px 70px rgba(15,23,42,.12)}
.shift-price-card__label{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:#51606f}.shift-price-card h3{font-size:2rem;line-height:1.05;margin:.9rem 0 .7rem;color:#0d1b2a}.shift-price-card__price{font-size:2.2rem;font-weight:700;line-height:1.1;margin-bottom:1.3rem;color:#0d1b2a}
.shift-price-card ul{list-style:none;padding:0;margin:0;display:grid;gap:.88rem;color:#475569}.shift-price-card li{position:relative;padding-left:1.1rem;line-height:1.45}.shift-price-card li:before{content:'•';position:absolute;left:0;top:0;color:#111827;font-weight:700}
.shift-price-card__link{margin-top:1.6rem;display:inline-flex;align-items:center;gap:.35rem;font-weight:600;color:#0d1b2a;text-decoration:none}.shift-price-card__link:hover{text-decoration:underline}
.shift-pricing-grid__note{margin-top:1.5rem;font-size:1.02rem;color:#475569}
.shift-pricing-includes{background:#0f172a;color:#eef2f7}.shift-pricing-includes__layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:2rem;align-items:start}.shift-pricing-includes__copy .n-eyebrow{color:#b8c0ca}.shift-pricing-includes__copy h2{color:#fff}
.shift-pricing-includes__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.shift-pricing-includes__grid>div{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:1.4rem;backdrop-filter:blur(8px)}
.shift-pricing-includes__grid span{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#9fb1c6;margin-bottom:.65rem}.shift-pricing-includes__grid strong{display:block;font-size:1.2rem;color:#fff;margin-bottom:.45rem}.shift-pricing-includes__grid p{margin:0;color:#d4dbe4;line-height:1.5}
@media(max-width:1080px){.shift-pricing-hero__layout,.shift-pricing-grid__head,.shift-pricing-includes__layout{grid-template-columns:1fr}.shift-pricing-grid{grid-template-columns:1fr 1fr}.shift-pricing-hero__visual{max-width:760px}}
@media(max-width:700px){.shift-pricing-hero{padding-top:8rem}.shift-pricing-grid{grid-template-columns:1fr}.shift-pricing-includes__grid{grid-template-columns:1fr}.shift-price-card__price{font-size:2rem}}

/* v4.5.3 editorial Insights and single articles — no generic stock imagery */
.shift-insights-hero--editorial{padding-bottom:5rem;background:linear-gradient(180deg,#fff 0%,#f7f7f6 100%)}
.shift-insights-hero--editorial .shift-insights-hero__grid h1{max-width:15ch}
.shift-insights-hero__signature{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:4.5rem;padding-top:1.3rem;border-top:1px solid #ddd;font:600 .66rem/1.4 var(--n-machine,monospace);letter-spacing:.12em;color:#52606b}
.shift-insights-articles{background:#f7f7f6;color:#111}
.shift-insights-articles__head{display:grid;grid-template-columns:1fr minmax(0,340px);align-items:end;gap:2rem;margin-bottom:2.75rem}
.shift-insights-articles__head h2{font:750 clamp(2.45rem,4.5vw,4.6rem)/1.04 var(--n-display,Arial,sans-serif);letter-spacing:-.05em;color:#101010;margin:.65rem 0 0}
.shift-insights-articles__head>p{line-height:1.6;color:#565e69;margin:0}
.shift-insights-articles__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2.5vw,2.5rem)}
.shift-insights-article-card{background:#fff;border:1px solid #dedede;border-radius:20px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column;min-width:0}
.shift-insights-article-card:hover{transform:translateY(-5px);box-shadow:0 18px 60px rgba(0,0,0,.08)}
.shift-insights-article-card__image{display:block;background:#ededed;aspect-ratio:16/9;overflow:hidden}
.shift-insights-article-card__image img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.shift-insights-article-card__fallback{display:flex;align-items:center;justify-content:center;height:100%;font:700 clamp(1.2rem,3vw,2rem) var(--n-display,Arial,sans-serif);color:#1b1b1b;letter-spacing:-.02em}
.shift-insights-article-card__body{display:flex;flex-direction:column;padding:clamp(1.3rem,2.3vw,2.2rem);flex:1}
.shift-insights-article-card__meta{font:600 .69rem/1.4 var(--n-machine,monospace);text-transform:uppercase;letter-spacing:.095em;color:#777}
.shift-insights-article-card__body h3{font:750 clamp(1.5rem,2.3vw,2.25rem)/1.13 var(--n-display,Arial,sans-serif);letter-spacing:-.035em;margin:.6rem 0 .8rem}
.shift-insights-article-card__body h3 a{color:#141414;text-decoration:none}.shift-insights-article-card__body>p:not(.shift-insights-article-card__meta){line-height:1.65;color:#4a4f56}
.shift-insights-article-card__read{margin-top:auto;padding-top:1.3rem;display:inline-flex;gap:.6rem;color:#101820;text-decoration:none;border-bottom:1px solid transparent;align-self:flex-start;font-weight:650}
.shift-insights-article-card__read:hover{text-decoration:underline}
.shift-insights-empty{border:1px solid #ddd;background:white;padding:2rem;max-width:720px;border-radius:14px}
.shift-article-page{background:#fff;color:#151515;padding:clamp(8.8rem,13vw,12rem) 0 6rem}
.shift-article-page__head{max-width:1080px!important}
.shift-article-page__title{font:800 clamp(2.75rem,6.2vw,6rem)/1.045 var(--n-display,Arial,sans-serif)!important;letter-spacing:-.06em!important;max-width:19ch;margin:.6rem 0 1.2rem!important;color:#111!important}
.shift-article-page__lede{font:400 clamp(1.05rem,1.5vw,1.35rem)/1.65 var(--n-body,Arial,sans-serif);max-width:760px;color:#4d5762}
.shift-article-page__meta{border-top:1px solid #ddd;margin-top:2.2rem;padding-top:1.2rem;gap:1.5rem!important;font-size:.82rem;color:#555}
.shift-article-page__meta a{color:#111;text-decoration:underline;text-underline-offset:3px}
.shift-article-page__cover{margin-top:3rem;max-width:1200px}.shift-article-page__cover figure{margin:0!important}.shift-article-page__cover img{display:block;width:100%;max-height:640px;height:auto;object-fit:contain;background:#f0f0ee;border-radius:14px}
.shift-article-page__body{max-width:790px!important;margin:3rem auto 0!important;color:#292d32;font-size:1.06rem;line-height:1.79}
.shift-article-page__body h2{font:750 clamp(1.7rem,2.8vw,2.45rem)/1.15 var(--n-display,Arial,sans-serif);letter-spacing:-.035em;color:#111;margin:3.2rem 0 1.1rem}
.shift-article-page__body h3{font:700 1.4rem/1.25 var(--n-display,Arial,sans-serif);color:#111;margin:2rem 0 .8rem}
.shift-article-page__body p{margin:1.1rem 0;color:#31363d}.shift-article-page__body ul,.shift-article-page__body ol{padding-left:1.6rem;margin:1.2rem 0 1.8rem}.shift-article-page__body li{padding-left:.25rem;margin:.65rem 0}
.shift-article-page__body a{color:#131e2a;text-decoration:underline;text-underline-offset:3px}.shift-article-page__body a:hover{color:#526171}
.shift-article-page__end{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:4rem;padding-top:1.3rem;border-top:1px solid #ddd}
@media(max-width:800px){.shift-insights-articles__head{grid-template-columns:1fr}.shift-insights-articles__grid{gap:1rem}.shift-article-page__cover{margin-top:2rem}}
@media(max-width:640px){.shift-insights-articles__grid{grid-template-columns:1fr}.shift-insights-hero__signature{gap:.75rem 1.2rem;margin-top:2rem}.shift-article-page{padding-top:7.5rem}.shift-article-page__title{font-size:clamp(2.4rem,10vw,3.4rem)!important}.shift-article-page__body{margin-top:2rem!important;font-size:1rem}.shift-article-page__body h2{margin-top:2.2rem}}
@media(prefers-reduced-motion:reduce){.shift-insights-article-card{transition:none}.shift-insights-article-card:hover{transform:none}}

/* v4.5.4: preserve the complete user-provided corporate website screenshots. */
.shift-project-tile[data-category="corporate"] .shift-project-image{background:#f7f8fa}
.shift-project-tile[data-category="corporate"] .shift-project-image img{object-fit:contain!important;object-position:center center!important;transform:none!important}
.n-portfolio-card[data-category="corporate"] .n-portfolio-shot img{object-fit:contain!important;object-position:center center!important;transform:none!important}
.n-portfolio-filter[data-portfolio-filter="corporate"],.shift-project-filter[data-shift-project-filter="corporate"]{white-space:nowrap}
/* v4.5.6 — Cohesive editorial capabilities, service storytelling, and FAQs.
   Inspired by modern enterprise product information architecture; original Shift styling/copy. */
.shift-expansion,.shift-exp-services,.shift-exp-services-process,.shift-exp-services-end{color:#111b29}
.shift-expansion h2,.shift-exp-services h2,.shift-exp-services-process h2,.shift-exp-services-end h2{font-size:clamp(2.2rem,4.4vw,4.5rem);line-height:1.03;letter-spacing:-.045em;margin:.35em 0 .5em;font-weight:690;color:inherit}
.shift-expansion h3,.shift-exp-services h3,.shift-exp-services-process h3{color:inherit;letter-spacing:-.025em}
.shift-expansion p,.shift-exp-services p,.shift-exp-services-process p,.shift-exp-services-end p{line-height:1.65}
.shift-expansion .n-eyebrow,.shift-exp-services .n-eyebrow,.shift-exp-services-process .n-eyebrow,.shift-exp-services-end .n-eyebrow{letter-spacing:.16em;font-size:.72rem}
.shift-exp-capabilities{background:#f7f7f6;padding-block:clamp(5rem,8vw,9rem)}
.shift-exp-intro{margin-bottom:3rem}.shift-exp-intro__row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(250px,.7fr);align-items:end;gap:3rem}.shift-exp-intro__row h2{max-width:750px}.shift-exp-intro__row>p{max-width:440px;color:#455262;font-size:1.05rem;margin:0 0 1.3rem}
.shift-exp-capabilities__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#d9dcdf;border:1px solid #d9dcdf}
.shift-exp-card{background:#fff;padding:clamp(1.6rem,2.5vw,2.75rem);min-height:280px;display:flex;flex-direction:column;transition:background .25s ease, transform .25s ease}
.shift-exp-card:hover{background:#f3f4f2}.shift-exp-card__kicker{display:flex;justify-content:space-between;gap:1rem;color:#6d7783;font-size:.64rem;letter-spacing:.12em;margin-bottom:3.5rem;font-weight:650}
.shift-exp-card h3{font-size:clamp(1.25rem,1.8vw,1.75rem);font-weight:650;margin:0 0 .85rem}.shift-exp-card p{margin:0;color:#4f5b68;font-size:.95rem}
.shift-exp-story{background:white;padding-block:clamp(5rem,8vw,9rem)}.shift-exp-story__grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1fr);gap:clamp(2.5rem,7vw,7rem);align-items:center}
.shift-exp-photo{position:relative;margin:0;min-width:0}.shift-exp-photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;filter:saturate(.8);border-radius:3px;background:#e7e7e4}.shift-exp-photo figcaption{font-size:.65rem;letter-spacing:.16em;margin-top:1rem;color:#64748b}
.shift-exp-story__copy h2{max-width:650px}.shift-exp-story__copy>p:not(.n-eyebrow){font-size:1.06rem;color:#4d5b68;max-width:640px}
.shift-exp-story__copy ol{margin:2.2rem 0 0;padding:0;list-style:none;border-top:1px solid #d8dde3}.shift-exp-story__copy li{display:flex;gap:1rem;padding:.95rem 0;border-bottom:1px solid #d8dde3;line-height:1.45;color:#17263b}.shift-exp-story__copy li span{width:2rem;flex:none;font-size:.73rem;letter-spacing:.1em;color:#87929e}
.shift-exp-deliver{background:#0b192b;color:white;padding-block:clamp(5rem,8vw,9rem)}.shift-exp-deliver__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2.5rem,7vw,7rem)}
.shift-exp-deliver .n-eyebrow{color:#b3c5d9}.shift-exp-deliver h2{color:white}.shift-exp-deliver p{max-width:560px;color:#c2cedb;font-size:1.04rem}.shift-exp-deliver ul{list-style:none;padding:0;margin:0;border-top:1px solid #607184}.shift-exp-deliver li{display:flex;gap:1rem;align-items:flex-start;font-size:clamp(1rem,1.5vw,1.28rem);padding:1.3rem 0;border-bottom:1px solid #425369;line-height:1.4}.shift-exp-deliver li>span{flex:none;color:#d3e1ee}
.shift-exp-link{display:inline-flex;gap:.75rem;align-items:center;text-decoration:none;font-weight:650;border-bottom:1px solid currentColor;padding:0 0 .45rem;color:inherit;margin-top:1rem}.shift-exp-link:hover{opacity:.72}
.shift-exp-faq{background:#f4f5f3;padding-block:clamp(5rem,8vw,9rem)}.shift-exp-faq__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,7vw,7rem);align-items:start}.shift-exp-faq__grid>div:first-child>p:not(.n-eyebrow){max-width:450px;color:#556272}
.shift-exp-faq__photo{margin-top:2.5rem;max-width:400px;overflow:hidden;border-radius:2px}.shift-exp-faq__photo img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;filter:saturate(.75);background:#e2e4e7}
.shift-exp-faq__list{border-top:1px solid #cdd2d8}.shift-exp-faq__item{border-bottom:1px solid #cdd2d8;padding:.15rem 0}.shift-exp-faq__item summary{list-style:none;display:flex;gap:1.25rem;justify-content:space-between;align-items:center;cursor:pointer;padding:1.45rem .25rem;font-weight:650;font-size:1.09rem;line-height:1.35;color:#172337}.shift-exp-faq__item summary::-webkit-details-marker{display:none}.shift-exp-faq__item summary span{font-size:1.45rem;transition:transform .2s;line-height:1}.shift-exp-faq__item[open] summary span{transform:rotate(45deg)}.shift-exp-faq__item>p{color:#556271;max-width:650px;margin:0 0 1.6rem;padding-right:2.4rem}.shift-exp-faq__item summary:focus-visible{outline:2px solid #1d4e83;outline-offset:3px}
.shift-exp-related{background:white;padding-block:clamp(4rem,6vw,7rem)}.shift-exp-related__head{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2.3rem}.shift-exp-related__head h2{margin-bottom:0}
.shift-exp-related__links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #dbe0e4}.shift-exp-related__links a{padding:2rem 1.3rem;text-decoration:none;display:flex;align-items:center;justify-content:space-between;gap:.5rem;color:#172337;border-right:1px solid #dbe0e4;font-size:1.08rem;font-weight:650;transition:background .2s ease}.shift-exp-related__links a:last-child{border-right:0}.shift-exp-related__links a:hover{background:#f2f4f4}
.shift-exp-services{padding-block:clamp(5rem,8vw,8rem);background:#f5f5f3}.shift-exp-services__intro{max-width:790px;margin-bottom:2.8rem}.shift-exp-services__intro p:last-child{max-width:690px;color:#556372;font-size:1.05rem}
.shift-exp-services__editorial{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}.shift-exp-services__item{display:block;min-width:0;background:white;border:1px solid #e0e2e4;color:#152438;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}.shift-exp-services__item:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(11,25,43,.07)}.shift-exp-services__photo{width:100%;aspect-ratio:16/9;background:#e8e8e5;overflow:hidden}.shift-exp-services__photo img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.84);transition:transform .6s ease}.shift-exp-services__item:hover img{transform:scale(1.035)}.shift-exp-services__caption{padding:clamp(1.3rem,2.5vw,2.4rem)}.shift-exp-services__caption>span{font-size:.66rem;letter-spacing:.16em;color:#667588}.shift-exp-services__caption h3{font-size:clamp(1.5rem,2.1vw,2.4rem);margin:1rem 0 .8rem}.shift-exp-services__caption p{margin:0 0 1.5rem;color:#556373}.shift-exp-services__caption strong{font-size:.88rem}
.shift-exp-services-process{background:#0d1a2b;color:white;padding-block:clamp(5rem,8vw,9rem)}.shift-exp-services-process h2{color:white}.shift-exp-services-process__intro{max-width:720px}.shift-exp-services-process__intro>p:last-child{max-width:690px;color:#c6d2de}.shift-exp-services-process .n-eyebrow{color:#abbccc}
.shift-exp-services-process__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;margin-top:4rem}.shift-exp-services-process__grid>div{border-top:1px solid #768395;padding-top:1.4rem}.shift-exp-services-process__grid span{font-size:.7rem;letter-spacing:.17em;color:#adbdce}.shift-exp-services-process__grid h3{font-size:1.55rem;margin:3rem 0 .6rem;color:white}.shift-exp-services-process__grid p{color:#c3cfda}
.shift-exp-services-end{background:white;padding-block:clamp(5rem,8vw,9rem)}.shift-exp-services-end__grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:4rem;align-items:center}.shift-exp-services-end__grid>div:first-child{max-width:720px}.shift-exp-services-end__grid>div:first-child>p:last-child{max-width:600px;color:#566372}.shift-exp-services-end__actions{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem}
@media(max-width:1020px){.shift-exp-intro__row,.shift-exp-story__grid,.shift-exp-deliver__grid,.shift-exp-faq__grid,.shift-exp-services-end__grid{grid-template-columns:1fr}.shift-exp-capabilities__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shift-exp-story__grid{gap:2.5rem}.shift-exp-photo img{aspect-ratio:16/10}.shift-exp-faq__photo{display:none}.shift-exp-services-process__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.shift-exp-capabilities__grid,.shift-exp-services__editorial,.shift-exp-services-process__grid,.shift-exp-related__links{grid-template-columns:1fr}.shift-exp-card{min-height:220px}.shift-exp-card__kicker{margin-bottom:2rem}.shift-exp-story__copy>p:not(.n-eyebrow){font-size:1rem}.shift-exp-related__links a{border-right:0;border-bottom:1px solid #dbe0e4;padding:1.2rem 1.5rem}.shift-exp-related__links a:last-child{border-bottom:0}.shift-exp-related__head{display:block}.shift-exp-services-process__grid h3{margin-top:1.2rem}.shift-exp-faq__item summary{font-size:1rem}.shift-exp-faq__grid>div:first-child>p:not(.n-eyebrow){margin-bottom:2rem}}
@media(hover:none){.shift-exp-card:hover,.shift-exp-services__item:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.shift-exp-card,.shift-exp-services__item,.shift-exp-services__item img,.shift-exp-faq__item summary span{transition:none!important}}

/* Additional AI Engineering editorial card */
.shift-exp-services__item--wide{grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;align-items:center}.shift-exp-services__item--wide .shift-exp-services__photo{height:100%;min-height:330px;aspect-ratio:auto}.shift-exp-services__item--wide .shift-exp-services__caption{padding:clamp(2rem,5vw,5rem)}
@media(max-width:680px){.shift-exp-services__item--wide{display:block}.shift-exp-services__item--wide .shift-exp-services__photo{min-height:0;aspect-ratio:16/9}}

/* Keep first-party fallback screenshots fully visible until editorial photography loads. */
.shift-exp-photo img[data-shift-external]:not([data-shift-external-loaded="1"]){object-fit:contain;background:#e8e9e8}
.shift-exp-faq__photo img[data-shift-external]:not([data-shift-external-loaded="1"]){object-fit:contain;background:#e8e9e8}

/* v4.5.7 — calm editorial covers and consistent section rhythm */
:root{--shift-ink:#101820;--shift-muted:#58616c;--shift-line:#dce0e4;--shift-soft:#f5f6f6}
.shift-inner-hero,.shift-services-hero,.shift-insights-hero{position:relative;overflow:hidden}
.shift-inner-hero{background:linear-gradient(140deg,#fafafa 0%,#fff 64%);padding-top:clamp(10rem,16vw,14.4rem);padding-bottom:clamp(3.3rem,6vw,6rem)}
.shift-inner-hero__layout{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(2.4rem,6vw,6.2rem);align-items:center}
.shift-inner-hero__copy{position:relative;z-index:2}
.shift-inner-hero__heading{font-size:clamp(3rem,4.75vw,5.65rem);letter-spacing:-.065em;line-height:1.065;max-width:14.5ch;margin:1rem 0 1.6rem}
.shift-inner-hero__lede{max-width:52ch;color:#515a65}
.shift-inner-hero__actions{gap:1.15rem;margin-top:2rem}
.shift-inner-hero__visual--photographic{min-width:0;width:100%}
.shift-hero-cover{margin:0;min-height:470px;height:clamp(485px,44vw,680px);width:100%;border:1px solid #d8dce0;overflow:hidden;position:relative;background:#e9edef;isolation:isolate;box-shadow:0 24px 70px rgba(18,28,35,.095)}
.shift-hero-cover:before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,18,29,.24) 0%,rgba(8,18,29,.0) 37%,rgba(7,15,25,.68) 100%);pointer-events:none}
.shift-hero-cover__image{position:absolute;display:block;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;transition:transform .8s cubic-bezier(.2,.75,.24,1),filter .6s ease;background:#e8ebed}
.shift-hero-cover__image[data-shift-external-loaded="1"]{object-fit:cover}
.shift-hero-cover:hover .shift-hero-cover__image{transform:scale(1.025)}
.shift-hero-cover__index{position:absolute;top:1.65rem;left:1.6rem;z-index:2;color:#fff;font:600 .64rem/1.3 var(--n-machine,monospace);letter-spacing:.14em;text-shadow:0 1px 5px #0006}
.shift-hero-cover__caption{position:absolute;left:clamp(1.4rem,3vw,3rem);bottom:clamp(1.5rem,3vw,3rem);right:clamp(1.4rem,3vw,3rem);z-index:2;color:#fff;display:flex;flex-direction:column;gap:.65rem;text-shadow:0 1px 5px #0007}
.shift-hero-cover__caption>span:first-child{font:600 .65rem/1.3 var(--n-machine,monospace);letter-spacing:.14em;text-transform:uppercase}
.shift-hero-cover__caption strong{font:700 clamp(2rem,3vw,3.35rem)/1.07 var(--n-display,Arial,sans-serif);letter-spacing:-.04em;color:#fff}
.shift-hero-cover__caption>span:last-child{font:400 clamp(.87rem,1.1vw,1.05rem)/1.5 var(--n-body,Arial,sans-serif);color:#f0f3f5;max-width:34ch}
.shift-hero-cover__credit{margin-top:.8rem;color:#6e7882;font:500 .6rem/1.5 var(--n-machine,monospace);letter-spacing:.08em}
.shift-inner-hero__strip{margin-top:clamp(3rem,5vw,5rem)}
.shift-inner-feature{background:#fff}
.shift-inner-feature__layout{align-items:center}
.shift-inner-feature__copy>p:not(.n-eyebrow){max-width:53ch;color:#56606a}
.shift-inner-process{background:#131b24;color:#f4f5f6}
.shift-inner-process .n-eyebrow,.shift-inner-process__head>p{color:#c1cad2}
.shift-inner-process h2{color:#fff}
.shift-inner-step{border-color:#526071;color:#eef2f5}
.shift-exp-capabilities{background:#f5f6f6}
.shift-exp-card{transition:background .25s ease,transform .25s ease}
.shift-exp-card:hover{background:#fff;transform:translateY(-2px)}
.shift-exp-story{background:#fff}
.shift-exp-story__copy h2{max-width:16ch}
.shift-exp-related{background:#f6f7f7}
.shift-exp-faq{background:#fff}
.shift-services-hero{background:linear-gradient(180deg,#fff,#f6f7f7)}
.shift-services-hero__intro{grid-template-columns:1.2fr .8fr;align-items:end}
.shift-services-hero__intro h1{max-width:17ch}
.shift-services-hero__gallery--editorial{gap:1rem;margin-top:clamp(2.5rem,4vw,4rem)}
.shift-services-hero__gallery--editorial img{width:100%;height:clamp(260px,26vw,380px);aspect-ratio:auto;object-fit:contain;object-position:center;border:0;background:#e9ecef;transition:transform .45s ease}
.shift-services-hero__gallery--editorial img[data-shift-external-loaded="1"]{object-fit:cover}
.shift-services-hero__gallery--editorial figure{overflow:hidden}
.shift-services-hero__gallery--editorial figure:hover img{transform:scale(1.018)}
.shift-services-hero__gallery--editorial figcaption{font-size:.63rem;color:#53606b;letter-spacing:.14em;margin-top:.9rem}
.shift-exp-services{background:#fff}
.shift-exp-services__item{border-color:#d9dfe5}
.shift-services-directory{background:#f8f8f8}
.shift-insights-entry{min-height:74vh;background:linear-gradient(145deg,#fff,#f4f5f5);padding:clamp(11rem,16vw,15rem) 0 7rem}
.shift-insights-entry h1{font:750 clamp(3rem,6vw,6rem)/1.07 var(--n-display,Arial,sans-serif);letter-spacing:-.06em;max-width:13ch;margin:1.2rem 0 1.1rem}
.shift-insights-entry p:not(.n-eyebrow){font:400 clamp(1.1rem,1.5vw,1.32rem)/1.6 var(--n-body,Arial,sans-serif);max-width:48ch;color:#515e6b;margin-bottom:2rem}
.shift-insights-articles{background:#fff}
.shift-insights-article-card{transition:transform .25s ease,box-shadow .25s ease}
.shift-insights-article-card:hover{transform:translateY(-3px);box-shadow:0 16px 35px #10182012}
.shift-contact-v44,.shift-pricing-hero,.shift-about-hero,.shift-projects-hero{scroll-margin-top:95px}
.shift-footer__column h4{letter-spacing:.095em}
@media(max-width:1050px){.shift-inner-hero__layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem}.shift-hero-cover{height:clamp(440px,52vw,590px)}}
@media(max-width:880px){.shift-inner-hero{padding-top:8.4rem}.shift-inner-hero__layout,.shift-services-hero__intro{grid-template-columns:1fr;gap:2.1rem}.shift-inner-hero__heading{max-width:18ch}.shift-hero-cover{height:min(68vw,550px);min-height:370px}.shift-services-hero__gallery--editorial{grid-template-columns:repeat(3,minmax(0,1fr))}.shift-services-hero__gallery--editorial img{height:260px}}
@media(max-width:640px){.shift-inner-hero{padding-top:7.6rem}.shift-inner-hero__heading{font-size:clamp(2.6rem,11vw,4rem);margin:1rem 0 1.1rem}.shift-hero-cover{min-height:380px;height:440px}.shift-hero-cover__index{top:1.2rem;left:1.2rem}.shift-hero-cover__caption{left:1.3rem;right:1.3rem;bottom:1.5rem}.shift-services-hero__gallery--editorial{grid-template-columns:1fr 1fr}.shift-services-hero__gallery--editorial figure:last-child{grid-column:1/-1}.shift-services-hero__gallery--editorial img{height:210px}.shift-services-hero__gallery--editorial figure:last-child img{height:265px}.shift-hero-cover__credit{font-size:.55rem}}
@media(max-width:390px){.shift-hero-cover{height:390px;min-height:390px}.shift-services-hero__gallery--editorial img{height:165px}}
@media(prefers-reduced-motion:reduce){.shift-hero-cover__image,.shift-exp-card,.shift-insights-article-card,.shift-services-hero__gallery img{transition:none!important;transform:none!important}}

/* First-paint project fallbacks must remain visually strong if licensed remote photos are blocked. */
.shift-hero-cover__image{object-fit:cover;object-position:top center}
.shift-services-hero__gallery--editorial img{object-fit:cover;object-position:center top}

/* v4.5.8: avoid duplicating method pillars beside the interactive diagram. */
.shift-method__copy .shift-method__link { margin-top: clamp(1.5rem, 3vw, 2.4rem); }
/* Only top-level links belong in the mobile navigation; keep the detailed dropdown for desktop. */
@media (max-width: 880px) {
  .n-header .shift-main-nav,
  .n-header .shift-nav-dropdown { display: none !important; }
  .n-mobile-menu nav > a { display: flex; }
  .n-mobile-menu nav > .shift-nav-dropdown,
  .n-mobile-menu nav > .shift-nav-group { display: none !important; }
}

/* v4.5.9: simplified service pages; two sections including embedded FAQ. */
.shift-simple-service-page{background:#fff;color:#121d2d}
.shift-simple-service-hero{background:#f8f8f7;padding:clamp(8rem,12vw,11rem) 0 clamp(3.2rem,5vw,5rem)}
.shift-simple-service-hero__layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.shift-simple-service-hero__copy{min-width:0}
.shift-simple-service-hero__copy h1{font-size:clamp(3.25rem,5vw,6rem);font-weight:770;line-height:1.05;letter-spacing:-.066em;max-width:13ch;margin:1rem 0 1.3rem;color:#111c2b}
.shift-simple-service-hero__lede{max-width:49ch;font-size:clamp(1.05rem,1.35vw,1.26rem);line-height:1.7;color:#4e5967}
.shift-simple-service-hero__buttons{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem;margin-top:2.4rem}
.shift-simple-service-hero__media{margin:0;position:relative;min-height:450px;aspect-ratio:1.03;overflow:hidden;background:radial-gradient(ellipse at 18% 15%,#8e99a1,transparent 45%),linear-gradient(140deg,#d9dfe0 5%,#72808a 58%,#121e29 100%);border-radius:3px}
.shift-simple-service-hero__media:after{content:"";pointer-events:none;position:absolute;inset:0;background:linear-gradient(to bottom,transparent 52%,rgba(8,16,29,.66));}
.shift-simple-service-hero__media img{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover;filter:saturate(.65);transition:transform .7s ease,opacity .3s ease}
.shift-simple-service-hero__media:hover img{transform:scale(1.025)}
.shift-simple-service-hero__media img[data-load-error="1"]{opacity:0}
.shift-simple-service-hero__media figcaption{position:absolute;z-index:2;left:clamp(1.4rem,3vw,3rem);right:1.5rem;bottom:clamp(1.4rem,3vw,3rem);color:white;display:grid;gap:.55rem;text-shadow:0 1px 8px #0007}
.shift-simple-service-hero__media figcaption span{font-size:.67rem;letter-spacing:.16em;text-transform:uppercase;color:#e5eaf0}
.shift-simple-service-hero__media figcaption strong{font-size:clamp(1.35rem,2.3vw,2.3rem);line-height:1.18;max-width:22ch}
.shift-simple-service-hero__tags{display:flex;flex-wrap:wrap;gap:clamp(.65rem,2vw,1.5rem);border-top:1px solid #d9dfe1;padding-top:1.5rem;margin-top:clamp(2.5rem,4vw,4rem)}
.shift-simple-service-hero__tags span{font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;color:#627180}
.shift-simple-service-content{padding:clamp(4.5rem,7vw,8rem) 0 clamp(5rem,7vw,8rem);background:#fff}
.shift-simple-service-content__intro{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:end;margin-bottom:2.4rem}
.shift-simple-service-content__intro h2{font-size:clamp(2.2rem,3.6vw,4.2rem);letter-spacing:-.055em;line-height:1.11;max-width:18ch;margin:.8rem 0 0}
.shift-simple-service-content__intro>p{color:#55616d;font-size:clamp(1rem,1.2vw,1.19rem);line-height:1.65;max-width:52ch}
.shift-simple-service-content__cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #d5dce2}
.shift-compact-card{padding:clamp(1.2rem,2.1vw,2.15rem);border-right:1px solid #d5dce2;min-width:0;transition:background .2s ease}
.shift-compact-card:hover{background:#f4f6f6}.shift-compact-card:last-child{border-right:0}
.shift-compact-card__no{font-size:.7rem;letter-spacing:.14em;color:#748294}
.shift-compact-card h3{font-size:clamp(1.2rem,1.65vw,1.55rem);line-height:1.25;margin:2.4rem 0 .85rem}
.shift-compact-card p{color:#596575;font-size:.94rem;line-height:1.6;margin:0}
.shift-simple-service-content__deliver{display:grid;grid-template-columns:.8fr 1.2fr;gap:2rem;padding:clamp(2.2rem,4vw,4rem) 0;border-bottom:1px solid #dbe0e4}
.shift-simple-service-content__deliver h3{font-size:clamp(1.45rem,2.3vw,2.3rem);letter-spacing:-.04em;line-height:1.15;max-width:19ch}
.shift-simple-service-content__deliver ul{margin:0;padding:0;list-style:none;display:grid;gap:.1rem}
.shift-simple-service-content__deliver li{position:relative;padding:1rem 0 1rem 1.5rem;border-bottom:1px solid #e3e8eb;color:#405062;line-height:1.5}
.shift-simple-service-content__deliver li:before{content:'↗';position:absolute;left:0;top:1rem;color:#0e192a}
.shift-simple-service-content__faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,5vw,5rem);padding:clamp(3.3rem,6vw,6rem) 0}
.shift-simple-service-content__faq-head h2{font-size:clamp(2.15rem,3.2vw,3.35rem);line-height:1.1;letter-spacing:-.05em;margin:1rem 0}
.shift-simple-service-content__faq-head p:last-child{color:#5b6975;line-height:1.65}
.shift-simple-service-content__faq .shift-exp-faq__item{border-color:#dce2e6}
.shift-simple-service-content__end{background:#111e30;color:white;padding:clamp(1.5rem,3vw,3rem);display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.shift-simple-service-content__end p{font-size:clamp(1.25rem,2vw,2rem);letter-spacing:-.03em;margin:0;color:white}
.shift-simple-service-content__end .n-btn--primary{background:white;color:#111e30;border-color:white}
@media(max-width:1080px){.shift-simple-service-content__cards{grid-template-columns:repeat(2,minmax(0,1fr))}.shift-compact-card:nth-child(2){border-right:0}.shift-compact-card:nth-child(-n+2){border-bottom:1px solid #d5dce2}.shift-simple-service-hero__media{min-height:390px}}
@media(max-width:850px){.shift-simple-service-hero__layout,.shift-simple-service-content__intro,.shift-simple-service-content__deliver,.shift-simple-service-content__faq{grid-template-columns:1fr;gap:2rem}.shift-simple-service-hero{padding-top:8rem}.shift-simple-service-hero__copy h1{max-width:16ch}.shift-simple-service-hero__media{min-height:420px;max-height:560px;aspect-ratio:16/11}.shift-simple-service-content__intro h2{max-width:25ch}}
@media(max-width:550px){.shift-simple-service-hero{padding-top:7.3rem}.shift-simple-service-hero__copy h1{font-size:clamp(2.7rem,11vw,4rem)}.shift-simple-service-hero__media{min-height:345px;aspect-ratio:4/3}.shift-simple-service-content__cards{grid-template-columns:1fr}.shift-compact-card{border-right:0!important;border-bottom:1px solid #d5dce2!important}.shift-compact-card:last-child{border-bottom:0!important}.shift-compact-card h3{margin-top:1.1rem}.shift-simple-service-content__end{flex-direction:column;align-items:flex-start}.shift-simple-service-hero__tags{gap:.85rem}}
@media(prefers-reduced-motion:reduce){.shift-simple-service-hero__media img,.shift-compact-card{transition:none!important}.shift-simple-service-hero__media:hover img{transform:none!important}}
/* Avoid aspect-ratio/min-height combinations forcing hero photography wider than a mobile viewport. */
.shift-simple-service-hero__media{min-width:0;width:100%;max-width:100%}
@media(max-width:550px){.shift-simple-service-hero__media{height:clamp(300px,92vw,420px);min-height:0;aspect-ratio:auto}}

/* 4.6.0 — editorial service imagery, without creating extra sections. */
.shift-service-context{min-width:0;display:grid;gap:1.1rem;align-content:start}
.shift-service-context>p{color:#55616d;font-size:clamp(1rem,1.2vw,1.19rem);line-height:1.65;max-width:52ch;margin:0}
.shift-service-context__photo{margin:0;min-height:160px;aspect-ratio:16/7;position:relative;overflow:hidden;border-radius:3px;background:linear-gradient(120deg,#dfe4e7,#a9b4c1 55%,#546476);}
.shift-service-context__photo img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.65);transition:transform .45s ease;}
.shift-service-context__photo img[data-load-error="1"]{opacity:0}
.shift-service-context__photo:hover img{transform:scale(1.015)}
.shift-service-context__photo figcaption{position:absolute;left:1rem;bottom:.7rem;font-size:.68rem;letter-spacing:.055em;color:#fff;background:#111c2bd9;padding:.45rem .62rem}
@media(max-width:850px){.shift-service-context__photo{max-height:265px}}
@media(prefers-reduced-motion:reduce){.shift-service-context__photo img{transition:none!important}.shift-service-context__photo:hover img{transform:none!important}}
/* Prevent intrinsically wide photographs from forcing a wider mobile grid. */
.shift-simple-service-content__intro,.shift-service-context,.shift-service-context__photo{min-width:0;max-width:100%}
.shift-service-context__photo{width:100%}
@media(max-width:850px){.shift-simple-service-content__intro{grid-template-columns:minmax(0,1fr)}}

/* Do not expose browser broken-image glyphs if a remote editorial photo is unavailable. */
.shift-simple-service-hero__media img,.shift-service-context__photo img{opacity:0}
.shift-simple-service-hero__media img[data-load-success="1"],.shift-service-context__photo img[data-load-success="1"]{opacity:1}

/* Editorial Services photos are unique Unsplash sources, not repeated portfolio screenshots. */
.shift-services-hero__gallery figure,.shift-exp-services__photo{background:linear-gradient(135deg,#e6e6e3 0%,#c0c7ca 52%,#7d8b96 100%)}
.shift-services-hero__gallery img,.shift-exp-services__photo img{opacity:0}
.shift-services-hero__gallery img[data-load-success="1"],.shift-exp-services__photo img[data-load-success="1"]{opacity:1}
.shift-services-hero__gallery img[data-load-error="1"],.shift-exp-services__photo img[data-load-error="1"]{opacity:0}