/* Generic V3 sections (src/v3-page.tsx Section, v3-sections.tsx, v3-interactions.tsx VacancyDirectory, work-filter.tsx):
   page-only rules, scoped to .nx. Shared families (page-hero, hero, section, section-head, sk-cards, nx-steps, nx-acc,
   faq, more, band, nx-prose, nx-art--image) live in site.css and live.css. Tokens only: no hex values. */

/* Hero without an illustration: the copy holds a readable measure */
.nx .gen-hero--text { grid-template-columns: minmax(0, 1fr); }
.nx .gen-hero--text > div { max-width: 780px; }
.nx .page-hero .hero__actions { margin-top: var(--space-8); }

/* Body copy under a heading (longer paragraphs) */
.nx .gen-body { margin-top: var(--space-6); max-width: 72ch; font: 400 16px/1.7 var(--font-sans); color: var(--muted); }
.nx .gen-body p { margin: 0 0 var(--space-4); }
.nx .gen-body p:last-child { margin-bottom: 0; }
.nx .gen-body a { color: var(--indigo-text); }
.nx .gen-part__body p, .nx .gen-clause p { color: var(--muted); }
.nx .gen-note { margin: var(--space-6) 0 0; font-size: 14px; line-height: 1.6; color: var(--muted); }
.nx .gen-meta { margin: var(--space-2) 0 0; font-size: 14px; line-height: 1.5; color: var(--muted); }
.nx .gen-meta strong { color: var(--ink); font-weight: 600; }

/* Images inside a section: keep the intrinsic ratio, caption under the frame */
.nx .gen-figure { margin: var(--space-12) 0 0; }
.nx .gen-figure figcaption { margin-top: var(--space-3); font-size: 13px; line-height: 1.5; color: var(--muted); }

/* Headline figures */
.nx .gen-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-6); margin: var(--space-12) 0 0; }
.nx .gen-stats > div { display: flex; flex-direction: column-reverse; gap: var(--space-2); padding-top: var(--space-4); border-top: 2px solid var(--line); }
.nx .gen-stats dd { margin: 0; font: 600 clamp(30px, 3.6vw, 44px)/1.05 var(--font-sans); letter-spacing: -0.03em; color: var(--ink); }
.nx .gen-stats dt { margin: 0; font-size: 14px; line-height: 1.5; color: var(--muted); }
.nx .band .gen-stats > div { border-top-color: var(--band-line); }
.nx .band .gen-stats dd { color: var(--on-band); }
.nx .band .gen-stats dt { color: var(--on-band-muted); }

/* Checked outcomes: icon disc plus text */
.nx .gen-checks { list-style: none; margin: var(--space-8) 0 0; padding: 0; display: grid; gap: var(--space-4); max-width: 820px; }
.nx .gen-checks li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: var(--space-3); align-items: start; font: 400 16px/1.6 var(--font-sans); color: var(--ink); }
.nx .gen-check { width: 28px; height: 28px; border-radius: 50%; background: var(--indigo-50); color: var(--indigo-text); display: grid; place-items: center; }
.nx .gen-check--icon { width: 40px; height: 40px; border-radius: 12px; }
.nx .gen-check svg { width: 16px; height: 16px; }
.nx .gen-check--icon svg { width: 22px; height: 22px; }
.nx .band .gen-checks li { color: var(--on-band); }
.nx .band .gen-check { background: var(--band-2); color: var(--lime); }

/* Industry chips: same pill as the service links, for names without a link too */
.nx .gen-industries { margin-top: var(--space-8); }
.nx .gen-industries span { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border-radius: var(--radius-pill); background: var(--indigo-50); color: var(--ink); font: 500 14px/1.2 var(--font-sans); }

/* Evidence: quotes and offices */
.nx .gen-quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-6); margin-top: var(--space-12); }
.nx .gen-quote { margin: 0; padding: var(--space-8); border-radius: var(--radius-xl); background: var(--paper); border: 1px solid var(--line); }
.nx .gen-quote blockquote { margin: 0; font: 500 19px/1.5 var(--font-sans); letter-spacing: -0.01em; color: var(--ink); }
.nx .gen-quote figcaption { margin-top: var(--space-4); font-size: 14px; color: var(--muted); }
.nx .gen-offices { margin-top: var(--space-12); }
.nx .gen-offices .sk-card__text { font-size: 15px; }

/* Cards: a link arrow sits at the foot of each card */
.nx .sk-cards .nx-arrowlink { margin-top: auto; padding-top: var(--space-2); }
.nx .sk-cards .sk-card { min-width: 0; }
.nx .gen-paired { margin-top: var(--space-12); }
.nx .gen-stack { margin-top: var(--space-12); }
.nx .engagement-models .gen-meta-list { display: grid; gap: var(--space-4); margin: var(--space-4) 0 0; }
.nx .gen-meta-list div { display: grid; gap: 2px; }
.nx .gen-meta-list dt { font: 600 12px/1.4 var(--font-sans); letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.nx .gen-meta-list dd { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink); }

/* Steps in a band: the nx-steps counter already numbers the sequence */
.nx .gen-section-steps { margin-top: var(--space-12); }

/* Directory of child services (hub pages) reuses the more link list */
.nx .gen-directory { margin-top: var(--space-12); }
.nx .gen-directory a { min-width: 0; }

/* Forms: contact-form section and the newsletter block */
.nx .gen-form { margin-top: var(--space-12); max-width: 680px; display: grid; gap: var(--space-4); }
.nx .gen-form label { display: grid; gap: var(--space-2); font: 500 14px/1.4 var(--font-sans); color: var(--ink); }
.nx .gen-form label span { font-weight: 400; color: var(--muted); }
.nx .gen-form input, .nx .gen-form textarea, .nx .gen-newsletter input { width: 100%; min-height: 48px; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); font: 400 16px/1.4 var(--font-sans); }
.nx .gen-form textarea { min-height: 140px; resize: vertical; }
.nx .gen-form input:focus-visible, .nx .gen-form textarea:focus-visible, .nx .gen-newsletter input:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.nx .gen-form .nx-btn { justify-self: start; }
.nx .gen-newsletter { margin-top: var(--space-12); max-width: 560px; }
.nx .gen-newsletter form { display: grid; gap: var(--space-4); }
.nx .gen-newsletter label { display: grid; gap: var(--space-2); font: 500 14px/1.4 var(--font-sans); color: var(--ink); }
.nx .gen-newsletter .nx-btn { justify-self: start; }
.nx .gen-newsletter p[role="status"] { margin: 0; font-size: 14px; color: var(--muted); }

/* FAQ: category headings and the solo accordion */
.nx .gen-faq { align-items: start; }
.nx .gen-faq--solo { grid-template-columns: minmax(0, 1fr); }
.nx .gen-faq__body { min-width: 0; }
.nx .gen-faq-group + .gen-faq-group { margin-top: var(--space-16); }
.nx .gen-faq-group__title { margin: 0 0 var(--space-4); font: 600 clamp(22px, 2.6vw, 30px)/1.2 var(--font-sans); letter-spacing: -0.03em; color: var(--ink); }
.nx .gen-faq-group .nx-acc { margin-bottom: 0; }

/* Split layout for editorial parts that are not legal documents */
.nx .gen-split { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--space-16); align-items: start; }
.nx .gen-split__head { position: sticky; top: 120px; }
.nx .gen-split__body { min-width: 0; }
.nx .gen-clauses { display: grid; gap: var(--space-8); margin-top: var(--space-8); }
.nx .gen-clause { padding-top: var(--space-6); border-top: 1px solid var(--line); }
.nx .gen-clause h3 { margin: 0 0 var(--space-2); font: 600 20px/1.3 var(--font-sans); letter-spacing: -0.02em; color: var(--ink); }
.nx .gen-clause p { margin: 0; font-size: 15px; line-height: 1.65; }

/* Legal documents: contents rail, numbered parts, readable measure (after legal.css) */
.nx .gen-legal { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 70ch); gap: var(--space-16); align-items: start; justify-content: start; }
.nx .gen-toc { position: sticky; top: 100px; border-left: 1px solid var(--line); padding-left: var(--space-6); }
.nx .gen-toc__title { margin: 0 0 var(--space-4); font: 500 12px/1.4 var(--font-sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.nx .gen-toc__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.nx .gen-toc__list a { display: block; min-height: 36px; padding: 6px 10px; margin-left: -11px; border-left: 2px solid transparent; border-radius: 4px; color: var(--muted); text-decoration: none; font: 500 14px/1.35 var(--font-sans); transition: color var(--duration-fast), border-color var(--duration-fast), background var(--duration-fast); }
.nx .gen-toc__list a:hover { color: var(--ink); background: var(--indigo-50); }
.nx .gen-toc__list a:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.nx .gen-doc { max-width: 70ch; min-width: 0; font-size: 16px; line-height: 1.7; color: var(--ink); }
.nx .gen-part { scroll-margin-top: 100px; }
.nx .gen-part + .gen-part { margin-top: var(--space-12); padding-top: var(--space-12); border-top: 1px solid var(--line); }
.nx .gen-part h2 { display: flex; gap: var(--space-3); margin: 0 0 var(--space-4); font: 600 clamp(22px, 2.4vw, 26px)/1.25 var(--font-sans); letter-spacing: -0.02em; color: var(--ink); }
.nx .gen-part__num { flex: none; min-width: 1.2em; color: var(--indigo-text); font-variant-numeric: tabular-nums; }
.nx .gen-part__body { margin: 0; }
.nx .gen-part .gen-clauses { margin-top: var(--space-6); }
.nx .gen-part .nx-acc { margin-top: var(--space-6); }
.nx .gen-part p { margin: 0 0 var(--space-4); }
.nx .gen-part p:last-child { margin-bottom: 0; }
.nx .gen-part a { color: var(--indigo-text); font-weight: 500; }

/* Rich text tables (cookie and retention tables) scroll inside their own box */
.nx .nx-prose table { display: block; width: 100%; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: var(--space-6) 0; font-size: 14px; line-height: 1.5; }
.nx .nx-prose th, .nx .nx-prose td { padding: var(--space-3) var(--space-4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); min-width: 120px; }
.nx .nx-prose th { font: 500 12px/1.4 var(--font-sans); letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); background: var(--paper); }
.nx .nx-prose td { color: var(--ink); }
.nx .nx-prose ol, .nx .nx-prose ul { color: inherit; }

/* Comparison table in a scroll box (data-allow-overflow) */
.nx .gen-table { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: var(--space-12); border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--surface); }
.nx .gen-table:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.nx .gen-table table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 15px; line-height: 1.55; }
.nx .gen-table th, .nx .gen-table td { padding: var(--space-6); text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.nx .gen-table thead th { font: 500 12px/1.4 var(--font-sans); letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); background: var(--paper); }
.nx .gen-table tbody th { font-weight: 600; color: var(--ink); }
.nx .gen-table td { color: var(--muted); }
.nx .gen-table tbody tr:last-child th, .nx .gen-table tbody tr:last-child td { border-bottom: 0; }

/* Quick links and section CTA band */
.nx .gen-cta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--space-8); }
.nx .gen-cta > div:first-child { max-width: 720px; }
.nx .gen-cta .h-section { margin-top: var(--space-4); }
.nx .gen-cta .lead { margin-top: var(--space-4); }
.nx .gen-cta__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-6); }
.nx .band .gen-cta .nx-arrowlink { color: var(--on-band); }
.nx .band .nx-arrowlink:hover { color: var(--lime); }
.nx .gen-midcta { padding: var(--space-8) 0; }
.nx .gen-panel { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-6) var(--space-8); padding: var(--space-8) var(--space-12); border-radius: var(--radius-xl); background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow-card); }
.nx .gen-panel p { margin: 0; max-width: 640px; font-size: 16px; line-height: 1.6; color: var(--muted); }
.nx .gen-panel p strong { color: var(--ink); }

/* Work filters (work-filter.tsx) */
.nx .gen-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-8); }
.nx .gen-filter { min-height: 40px; padding: 0 16px; border-radius: var(--radius-pill); border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); font: 500 14px/1 var(--font-sans); cursor: pointer; transition: background var(--duration-fast), color var(--duration-fast), border-color var(--duration-fast); }
.nx .gen-filter:hover { border-color: var(--indigo); color: var(--indigo-text); }
.nx .gen-filter[aria-pressed="true"] { background: var(--indigo); border-color: var(--indigo); color: var(--on-indigo); }
.nx .gen-filter:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* Open roles (VacancyDirectory in v3-interactions.tsx): the careers prototype role list */
.nx .role-list { list-style: none; margin: var(--space-8) 0 0; padding: 0; border-top: 1px solid var(--line); }
.nx .role-row { display: flex; justify-content: space-between; align-items: center; gap: var(--space-6); padding: var(--space-6) 0; border-bottom: 1px solid var(--line); min-width: 0; }
.nx .role-row__main { display: grid; gap: var(--space-2); min-width: 0; }
.nx .role-row__title { margin: 0; font: 600 20px/1.3 var(--font-sans); letter-spacing: -0.02em; color: var(--ink); }
.nx .role-row__team { margin: 0; font-size: 15px; color: var(--muted); }
.nx .role-row__badges { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-1); }
.nx .role-row__link { flex: none; min-height: 44px; align-items: center; }
.nx .role-empty { margin-top: var(--space-8); display: grid; gap: var(--space-3); justify-items: start; padding: var(--space-8); border-radius: var(--radius-xl); border: 1.5px dashed var(--line-strong); background: var(--surface); }
.nx .role-empty__text { margin: 0; font-size: 15px; line-height: 1.6; color: var(--muted); }

@media (max-width: 1100px) {
  .nx .gen-legal { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
  .nx .gen-toc { position: static; border-left: 0; padding-left: 0; }
  .nx .gen-toc__list { display: flex; flex-wrap: wrap; gap: var(--space-2); }
  .nx .gen-toc__list a { margin-left: 0; min-height: 44px; padding: 0 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); display: inline-flex; align-items: center; }
  .nx .gen-split { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
  .nx .gen-split__head { position: static; }
}

@media (max-width: 720px) {
  .nx .gen-part + .gen-part { margin-top: var(--space-8); padding-top: var(--space-8); }
  .nx .gen-doc { font-size: 15px; }
  .nx .nx-prose th, .nx .nx-prose td { padding: var(--space-3); }
  .nx .gen-table th, .nx .gen-table td { padding: var(--space-4); }
  .nx .gen-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nx .gen-quote { padding: var(--space-6); }
  .nx .gen-panel { padding: var(--space-6); }
  .nx .gen-panel .nx-btn, .nx .gen-cta__actions .nx-btn { width: 100%; justify-content: center; }
  .nx .gen-cta__actions { width: 100%; }
  .nx .role-row { flex-direction: column; align-items: flex-start; gap: var(--space-4); }
  .nx .role-row__link { min-height: 44px; }
  .nx .role-empty { padding: var(--space-6); }
  .nx .gen-faq-group + .gen-faq-group { margin-top: var(--space-12); }
}
