/* Responsive rules scoped to the actual page sections. */
html { scroll-behavior:smooth; margin-top:0!important; }
body { min-width:0; }
.nb-honeypot {position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.nb-form-feedback {padding:12px 14px;border-radius:10px;background:#e9f7ee;color:#176437;font:600 14px/1.4 var(--font-body)}
.nb-form-feedback.is-error {background:#fff1f0;color:#9e2525}
.nb-contact-form button:disabled {opacity:.55;cursor:wait!important}
/* Give every page the same header geometry; compact links fit the long menu. */
.nb-site-header > div {box-sizing:border-box;width:100%;max-width:1128px!important;height:68px!important;padding-left:clamp(20px,4vw,48px)!important;padding-right:clamp(20px,4vw,48px)!important}
.nb-site-header > div > a:first-child {flex:none}
.nb-site-header > div > a:first-child img {display:block;width:126px!important;height:auto!important;max-width:none!important;max-height:none!important;margin-right:8px!important}
@media (min-width:1200px) {
  .nb-site-header > div {gap:12px!important}
  .nb-site-header nav {white-space:nowrap!important;flex:none;gap:0!important;font-size:14px!important}
  .nb-site-header nav > a,
  .nb-site-header nav > span > a {padding-left:6px!important;padding-right:6px!important;white-space:nowrap!important}
  .nb-site-header > div > div:last-child {flex:none;gap:10px!important}
}
/* The submenu touches its trigger, so the pointer cannot cross a dead gap. */
@media (min-width:1200px) {
  header nav > span:first-child > span {margin-top:0!important}
  header nav > span:first-child:hover > span,
  header nav > span:first-child:focus-within > span {display:block!important}
}
@media (min-width:1051px) and (max-width:1199px) {
  .nb-site-header > div {height:auto!important;min-height:68px}
  header > div {gap:12px!important;height:auto!important;min-height:64px;flex-wrap:wrap;padding-top:8px!important;padding-bottom:8px!important}
  header > div > a:first-child {margin-right:auto}
  .nb-mobile-toggle {display:block;order:3}
  header > div > nav {display:none!important;order:4;flex:0 0 100%;width:100%;height:auto;flex-direction:column;align-items:stretch!important;white-space:normal!important;padding:10px 0 14px;gap:0!important;border-top:1px solid var(--color-neutral-200)}
  header.nb-menu-open > div > nav {display:flex!important}
  header > div > nav > span {display:block!important}
  header > div > nav a {display:block!important;height:auto!important;margin:0!important;padding:12px 14px!important;white-space:normal!important}
  header > div > nav > span > span {display:block!important;position:static!important;width:auto!important;box-shadow:none!important;padding-left:12px!important}
  header > div > div:last-child {margin-left:0!important;gap:8px!important}
}
img,video,iframe,canvas { max-width:100%; }
[id] { scroll-margin-top:76px; }
.nb-mobile-toggle { display:none; border:0; background:transparent; color:var(--color-text); font:600 28px/1 var(--font-body); padding:8px 10px; cursor:pointer; }
@media (max-width:1050px) {
  .nb-site-header > div {height:auto!important;min-height:68px}
  header > div { gap:12px!important; height:auto!important; min-height:64px; flex-wrap:wrap; padding-top:8px!important; padding-bottom:8px!important; }
  header > div > a:first-child { margin-right:auto; }
  .nb-mobile-toggle { display:block; order:3; }
  header > div > nav { display:none!important; order:4; flex:0 0 100%; width:100%; height:auto; flex-direction:column; align-items:stretch!important; white-space:normal!important; padding:10px 0 14px; gap:0!important; border-top:1px solid var(--color-neutral-200); }
  header.nb-menu-open > div > nav { display:flex!important; }
  header > div > nav > span { display:block!important; }
  header > div > nav a { display:block!important; height:auto!important; margin:0!important; padding:12px 14px!important; white-space:normal!important; }
  header > div > nav > span > span { display:block!important; position:static!important; width:auto!important; box-shadow:none!important; padding-left:12px!important; }
  header > div > div:last-child { margin-left:0!important; gap:8px!important; }
  header > div > div:last-child a { padding:10px 12px!important; font-size:12px!important; }
  .nb-tall { min-height:0!important; }
  .nb-grid-5 { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  .nb-grid-4 { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .nb-grid-3 { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #schema .nb-process-steps { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #matrix,#tech { overflow-x:auto; }
  .nb-matrix-row { min-width:900px; }
}
@media (max-width:700px) {
  .nb-site-header > div {padding-left:16px!important;padding-right:16px!important}
  header > div { padding-left:16px!important; padding-right:16px!important; }
  .nb-site-header > div > a:first-child img { width:126px!important; height:auto!important; max-width:none!important; max-height:none!important; }
  header > div > div:last-child { order:2; }
  header > div > div:last-child a { display:none!important; }
  section > div { max-width:100%; }
  .nb-tall { padding-top:56px!important; padding-bottom:56px!important; }
  #services .nb-grid-wide, #contact .nb-grid-wide,
  #top .nb-grid-wide, #problems .nb-grid-wide,
  #roi .nb-grid-wide, #schema .nb-grid-wide,
  #problem .nb-grid-wide, #security .nb-grid-wide,
  #contact + footer .nb-grid-wide { grid-template-columns:minmax(0,1fr)!important; }
  #cases .nb-before-after { grid-template-columns:minmax(0,1fr)!important; }
  #cases .nb-before-after > :nth-child(2) { transform:rotate(90deg); padding:4px 0; }
  #process .nb-grid-5 { grid-template-columns:minmax(0,1fr)!important; }
  #trust .nb-grid-4, #rollout .nb-grid-4, #security .nb-grid-4 { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #models .nb-grid-3,#industries .nb-grid-3,#pricing .nb-grid-3,#library .nb-grid-3,#problem .nb-grid-3 { grid-template-columns:minmax(0,1fr)!important; }
  #schema .nb-process-steps { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #matrix,#tech { overflow-x:auto; }
  h1 { font-size:clamp(32px,8.5vw,46px)!important; overflow-wrap:break-word; }
  h2 { overflow-wrap:break-word; }
  input,textarea,select { max-width:100%; }
  form { min-width:0; }
}
@media (max-width:440px) {
  #trust .nb-grid-4,#rollout .nb-grid-4,#security .nb-grid-4 { grid-template-columns:minmax(0,1fr)!important; }
  #schema .nb-process-steps { grid-template-columns:minmax(0,1fr)!important; }
  header > div > div:last-child { gap:2px!important; }
}
/* Layout refinements after reviewing the mobile captures. */
@media (min-width:701px) and (max-width:900px) {
  #top .nb-grid-wide, #contact .nb-grid-wide { grid-template-columns:minmax(0,1fr)!important; }
  #schema .nb-process-steps { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #cases .nb-before-after { grid-template-columns:minmax(0,1fr)!important; }
  #cases .nb-before-after > :nth-child(2) {transform:rotate(90deg);padding:6px 0}
}
@media (max-width:700px) {
  section > div { padding-left:20px!important; padding-right:20px!important; }
  #top .nb-tall, section:first-of-type .nb-tall { gap:28px!important; }
  /* Three narrative cards need readable text, not narrow half-width boxes. */
  section:first-of-type .nb-grid-3,
  #library .nb-grid-3,
  #problem .nb-grid-3,
  #models .nb-grid-3,
  #industries .nb-grid-3,
  #pricing .nb-grid-3 { grid-template-columns:minmax(0,1fr)!important; }
  #cases .nb-before-after { display:grid!important; grid-template-columns:minmax(0,1fr)!important; gap:8px!important; }
  #cases .nb-before-after > :nth-child(2) {transform:rotate(90deg);padding:0!important;line-height:1!important}
  #schema .nb-process-steps { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important; }
  #schema .nb-process-steps button { min-height:130px; width:100%; }
  #tech [style*="white-space:nowrap"] { white-space:normal!important; }
  #contact .nb-grid-wide { gap:26px!important; }
  #contact form { width:100%; box-sizing:border-box; padding:22px!important; }
  #contact form input,#contact form textarea {box-sizing:border-box;width:100%;}
  #top .nb-grid-wide > *,#contact .nb-grid-wide > *,#problems .nb-grid-wide > *,#problem .nb-grid-wide > * {min-width:0}
  footer .nb-grid-wide {grid-template-columns:minmax(0,1fr)!important;gap:28px!important}
}
@media (max-width:420px) {
  #schema .nb-process-steps {grid-template-columns:minmax(0,1fr)!important}
  #schema .nb-process-steps button {min-height:0}
  section > div {padding-left:18px!important;padding-right:18px!important}
}
.nb-swipe-hint {display:none}
@media (max-width:900px) {
  .nb-interactive-grid {grid-template-columns:minmax(0,1fr)!important}
  .nb-interactive-grid > * {min-width:0!important;max-width:100%}
  .nb-interactive-grid > div:first-child {max-height:320px;overflow-y:auto;overscroll-behavior:contain}
  .nb-interactive-grid button {max-width:100%;box-sizing:border-box}
  .nb-matrix-window {overflow-x:auto!important;overflow-y:hidden!important;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch}
  .nb-matrix-row {min-width:840px!important;grid-template-columns:180px repeat(6,100px)!important}
  .nb-swipe-hint {display:block;margin:18px 0 8px;color:var(--color-accent-700);font:600 13px/1.4 var(--font-body)}
  #matrix > div,#tech > div {min-width:0!important;width:100%;box-sizing:border-box}
  #matrix > div > div,#tech > div > div {min-width:0!important;max-width:100%}
}
@media (max-width:700px) {
  .nb-interactive-grid {gap:14px!important}
  .nb-interactive-grid > div:first-child {max-height:260px}
  .nb-interactive-grid > div:last-child {padding:20px!important;overflow:visible!important}
  #models .nb-grid-3 > div {padding:28px 24px!important}
  #contact [style*="gap:28px"] {flex-wrap:wrap;gap:10px!important}
}
/* Individual composition fixes from the close-up phone captures. */
@media (max-width:900px) {
  #process .nb-timeline {display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px!important}
  #process .nb-timeline > div {min-width:0!important;padding:18px;border:1px solid color-mix(in srgb,#fff 24%,transparent);border-radius:18px;background:color-mix(in srgb,#fff 8%,transparent)}
  #process .nb-timeline > div:last-child {grid-column:1/-1}
  .nb-callout {grid-template-columns:minmax(0,1fr)!important;gap:16px!important}
  .nb-callout > a {justify-self:start;max-width:100%;white-space:normal!important;text-align:center}
  #pricing .nb-pricing-cards {grid-template-columns:minmax(0,1fr)!important}
}
@media (max-width:700px) {
  #process .nb-timeline {grid-template-columns:minmax(0,1fr)!important;gap:12px!important;margin-top:28px!important}
  #process .nb-timeline > div:last-child {grid-column:auto}
  #process .nb-timeline > div {gap:8px!important;padding:18px 20px}
  #process .nb-timeline > div > div:first-child > span:nth-child(2),#process .nb-timeline > div > div:first-child > span:nth-child(3) {display:none!important}
  .nb-pricing-cards > div {padding:24px!important}
  .nb-callout {padding:22px!important}
  .nb-interactive-grid > div:first-child {max-height:none!important;overflow:visible!important}
  /* The artwork contains absolute badges extending below its window. Reserve
     their full height before placing the caption in the next grid row. */
  #product-cycle-studio .studio-hero {min-height:0!important;grid-template-columns:minmax(0,1fr)!important;align-items:start!important}
  #product-cycle-studio .studio-art {width:100%;max-width:100%;height:335px!important}
  #product-cycle-studio .studio-team-badge {top:auto!important;bottom:8px!important;left:2%!important}
  #product-cycle-studio .studio-caption {padding:16px 8px 20px!important;min-width:0}
  #product-cycle-studio .studio-caption h3 {font-size:clamp(24px,7vw,29px)!important;min-height:0!important;overflow-wrap:break-word}
  #product-cycle-studio .studio-caption p {min-height:0!important}
  #product-cycle-studio .studio-entry {margin-top:20px!important;flex-wrap:wrap}
}
@media (max-width:390px) {
  #product-cycle-studio .studio-art {height:315px!important}
  #product-cycle-studio .studio-stack {width:75%!important;left:9%!important;height:190px!important}
  #product-cycle-studio .studio-team-badge {bottom:4px!important}
}
@media (min-width:701px) and (max-width:900px) {
  #product-cycle-studio .studio-hero {grid-template-columns:minmax(0,1fr)!important;min-height:0!important}
  #product-cycle-studio .studio-art {height:325px!important}
  #product-cycle-studio .studio-team-badge {top:auto!important;bottom:8px!important}
  #product-cycle-studio .studio-caption {padding:18px 8px 22px!important;text-align:center!important}
  #product-cycle-studio .studio-caption p {min-height:0!important}
}
@media (min-width:480px) and (max-width:700px) {
  #product-cycle-studio .studio-stages {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  #product-cycle-studio .studio-stages li:nth-child(n) {grid-column:auto!important;grid-row:auto!important}
  #product-cycle-studio .studio-stage {font-size:13px!important;gap:7px!important}
}
@media (min-width:701px) and (max-width:1050px) {
  section:first-of-type .nb-grid-3 > :last-child,
  #models .nb-grid-3 > :last-child,
  #industries .nb-grid-3 > :last-child,
  #library .nb-grid-3 > :last-child,
  #pricing .nb-grid-3 > :last-child,
  #problem .nb-grid-3 > :last-child {grid-column:1/-1}
}
@media (max-width:700px) {
  #pricing .nb-pricing-extras {grid-template-columns:minmax(0,1fr)!important}
  #pricing .nb-pricing-extras > div {min-width:0;padding:22px!important}
  #models .nb-grid-3 {border-radius:18px!important}
  #models .nb-grid-3 > div {border-right:0!important;border-bottom:1px solid var(--color-neutral-200)}
  #problems .nb-grid-wide > div {padding:0 18px 38px!important}
  #problems .nb-grid-wide > span[aria-hidden] {display:none!important}
}
/* Outsource hero globe: original 614px absolute position clips on narrow screens. */
@media (max-width:900px) {
  .nb-outsource-hero .nb-grid-wide > div:last-child {width:100%;min-width:0;min-height:0!important;height:auto!important;overflow:visible}
  .nb-outsource-hero team-globe {position:relative!important;display:block;top:auto!important;right:auto!important;left:auto!important;transform:none!important;width:100%!important;max-width:560px!important;height:auto!important;margin:0 auto!important;box-sizing:border-box}
}
@media (max-width:700px) {
  .nb-outsource-hero .nb-grid-wide {gap:8px!important}
  .nb-outsource-hero team-globe {max-width:calc(100vw - 36px)!important}
}
/* Assistant questions should occupy the phone's full reading width. */
@media (max-width:700px) {
  .nb-assistant-faq {columns:1!important;column-gap:0!important;margin-top:22px!important}
  .nb-assistant-faq button {font-size:15px!important;line-height:1.45!important;padding:16px 0!important}
  .nb-assistant-faq button > span:first-child {flex:0 0 14px}
}
/* Each project phase is a separate unit on tablets and phones. */
@media (max-width:1050px) {
  #process .nb-grid-5 {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
  #process .nb-grid-5 > div {min-width:0;padding:22px;border:1px solid color-mix(in srgb,#fff 24%,transparent);border-radius:18px;background:color-mix(in srgb,#fff 9%,transparent)}
}
@media (max-width:700px) {
  #process .nb-grid-5 {grid-template-columns:minmax(0,1fr)!important;gap:14px!important;margin-top:28px!important}
  #process .nb-grid-5 > div {display:grid!important;grid-template-columns:40px minmax(0,1fr);column-gap:14px!important;row-gap:8px!important;padding:18px!important}
  #process .nb-grid-5 > div > span:first-child {grid-column:1;grid-row:1;width:36px;height:36px}
  #process .nb-grid-5 > div > span:nth-child(2) {grid-column:2;grid-row:1;align-self:center}
  #process .nb-grid-5 > div > span:nth-child(3),
  #process .nb-grid-5 > div > span:nth-child(4) {grid-column:2;margin-top:0!important}
}
