:root {
  --nf-ink: #0E0F11;
  --nf-paper: #F5F3ED;
  --nf-signal: #FF5A36;
  --nf-white: #FFFFFF;
  --nf-dark: #17191C;
  --nf-elevated: #202328;
  --nf-graphite: #60656C;
  --nf-muted: #A4A8AE;
  --nf-border: #D8D6CF;
  --nf-border-dark: #30343A;
  --page-max: 1440px;
  --content-max: 1280px;
  --font-primary: "Manrope Variable", "Manrope", "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--nf-paper); }
body { margin: 0; color: var(--nf-ink); background: var(--nf-paper); font-family: var(--font-primary); font-size: 1rem; line-height: 1.625; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, input, textarea { font: inherit; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
::selection { background: var(--nf-signal); color: var(--nf-ink); }
.skip-link { position: fixed; left: 16px; top: 16px; z-index: 999; padding: 12px 16px; background: var(--nf-ink); color: var(--nf-paper); text-decoration: none; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 2px solid var(--nf-signal); outline-offset: 2px; box-shadow: 0 0 0 1px var(--nf-ink); }
.site-shell { min-height: 100vh; overflow: clip; }
.container { width: min(var(--content-max), calc(100% - 128px)); margin-inline: auto; }
.site-header { position: relative; z-index: 10; border-bottom: 1px solid rgba(14,15,17,0.12); background: var(--nf-paper); }
.header-inner { min-height: 96px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand-link { display: inline-flex; align-items: center; min-height: 44px; flex: 0 0 auto; }
.brand-lockup { width: 248px; height: auto; }
.site-nav { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; justify-content: flex-end; }
.site-nav a { min-height: 44px; display: inline-flex; align-items: center; padding: 10px 12px; text-decoration: none; color: var(--nf-graphite); font-size: 0.875rem; font-weight: 600; }
.site-nav a:hover { color: var(--nf-ink); }
.nav-contact { border: 1px solid var(--nf-ink); border-radius: 8px; margin-left: 8px; color: var(--nf-ink) !important; transition: background-color 160ms cubic-bezier(0.2,0.8,0.2,1); }
.nav-contact:hover { background: var(--nf-white); }
.nav-contact:active { background: var(--nf-paper); }
.mobile-nav { display: none; position: relative; }
.mobile-nav summary { list-style: none; min-height: 44px; display: inline-flex; align-items: center; padding: 10px 14px; border: 1px solid var(--nf-ink); border-radius: 8px; font-size: 0.875rem; font-weight: 600; cursor: pointer; }
.mobile-nav summary::-webkit-details-marker { display: none; }
.mobile-nav[open] nav { position: absolute; right: 0; top: calc(100% + 10px); min-width: 250px; padding: 10px; background: var(--nf-paper); border: 1px solid var(--nf-border); z-index: 30; }
.mobile-nav nav a { display: flex; min-height: 44px; align-items: center; padding: 10px 12px; text-decoration: none; font-size: 0.875rem; font-weight: 600; }
.mobile-nav-primary { margin-top: 6px; background: var(--nf-ink); color: var(--nf-paper); border-radius: 6px; }
.hero { min-height: clamp(650px, 76vh, 760px); display: grid; align-items: center; padding: 80px 0 96px; }
.hero-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: end; }
.hero-copy { grid-column: 1 / span 8; }
.eyebrow, .section-label, .service-index, .tier-label, .work-kicker, .work-label, .studio-world-code, .legal-kicker, .product-row-kicker { margin: 0; font-family: var(--font-mono); font-size: 0.75rem; line-height: 1.333333; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.eyebrow { margin-bottom: 28px; color: var(--nf-graphite); }
.hero h1 { margin: 0; max-width: 860px; font-size: 5.5rem; line-height: 0.954545; letter-spacing: -0.045em; font-weight: 600; }
.hero-lead { margin: 40px 0 0; max-width: 760px; font-size: 1.25rem; line-height: 1.5; color: var(--nf-graphite); }
.hero-actions { margin-top: 44px; display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.button-primary { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 12px 20px; background: var(--nf-ink); color: var(--nf-paper); text-decoration: none; font-size: 0.9375rem; line-height: 1.333333; font-weight: 600; border: 1px solid var(--nf-ink); border-radius: 8px; transition: background-color 160ms cubic-bezier(0.2,0.8,0.2,1), color 160ms cubic-bezier(0.2,0.8,0.2,1); cursor: pointer; }
.button-primary:hover { background: var(--nf-dark); }
.button-primary:active { background: var(--nf-elevated); }
.text-link { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; font-size: 0.9375rem; font-weight: 600; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.text-link::after { content: "↘"; font-family: var(--font-mono); }
.hero-constraint { grid-column: 10 / span 3; align-self: end; justify-self: stretch; }
.constraint-label { margin: 0 0 12px; color: var(--nf-graphite); font-family: var(--font-mono); font-size: 0.75rem; line-height: 1.333333; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.constraint-field { position: relative; min-height: 240px; border-top: 1px solid var(--nf-border); border-left: 1px solid var(--nf-border); overflow: hidden; }
.constraint-axis { position: absolute; display: block; background: var(--nf-border); }
.constraint-axis-x { left: 0; right: 0; top: 50%; height: 1px; }
.constraint-axis-y { top: 0; bottom: 0; left: 50%; width: 1px; }
.constraint-origin { position: absolute; left: calc(50% - 4px); top: calc(50% - 4px); width: 8px; height: 8px; background: var(--nf-ink); }
.constraint-field img { position: absolute; right: 24px; bottom: 24px; width: 96px; height: 96px; }
.section { padding: 128px 0; border-top: 1px solid var(--nf-border); }
.section-surface { background: var(--nf-white); }
.section-dark, .work-section { background: var(--nf-ink); color: var(--nf-paper); border-top: 0; }
.section-head { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; margin-bottom: 72px; }
.section-label { grid-column: 1 / span 3; color: var(--nf-graphite); }
.section-title-wrap { grid-column: 4 / span 9; }
.section-title { margin: 0; max-width: 920px; font-size: 2.75rem; line-height: 1.090909; letter-spacing: -0.025em; font-weight: 600; }
.section-intro { margin: 28px 0 0; max-width: 760px; font-size: 1.25rem; line-height: 1.5; color: var(--nf-graphite); }
.section-dark .section-label, .work-section .section-label { color: var(--nf-muted); }
.section-dark .section-intro, .work-section .section-intro { color: var(--nf-muted); }
.principle-statement { margin: 84px 0 0; max-width: 1120px; font-size: 5.5rem; line-height: 0.954545; letter-spacing: -0.045em; font-weight: 600; }
.principle-statement span { display: block; white-space: nowrap; }
.signal-rule { width: 56px; height: 8px; background: var(--nf-signal); margin-top: 56px; }

/* Systems: primary solutions plus supporting capabilities. */
.service-tier { margin-top: 72px; }
.service-tier:first-of-type { margin-top: 0; }
.tier-label { color: var(--nf-graphite); margin-bottom: 18px; }
.service-major-list { border-top: 1px solid var(--nf-ink); }
.service-major { display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; align-items: start; padding: 42px 0 46px; border-bottom: 1px solid var(--nf-border); }
.service-index { grid-column: 1 / span 1; color: var(--nf-signal); padding-top: 8px; }
.service-name-wrap { grid-column: 2 / span 3; }
.service-name-wrap h3 { margin: 0; font-size: 2.375rem; line-height: 1.105263; letter-spacing: -0.025em; font-weight: 600; }
.service-name-wrap p { margin: 10px 0 0; color: var(--nf-graphite); font-size: 0.875rem; line-height: 1.571429; }
.service-copy { grid-column: 5 / span 5; color: var(--nf-graphite); }
.service-copy > p:first-child { margin: 2px 0 0; font-size: 1.0625rem; line-height: 1.588235; }
.service-rule { margin: 18px 0 0; color: var(--nf-ink); font-weight: 600; }
.service-entry { margin: 18px 0 0; font-family: var(--font-mono); font-size: 0.6875rem; line-height: 1.636364; letter-spacing: 0.05em; text-transform: uppercase; }
.service-link { grid-column: 10 / span 3; justify-self: end; min-height: 44px; display: inline-flex; align-items: center; font-size: 0.875rem; font-weight: 600; text-underline-offset: 5px; }
.service-tier-extended { margin-top: 82px; }
.service-secondary-grid { display: grid; grid-template-columns: repeat(12,1fr); border-top: 1px solid var(--nf-ink); border-bottom: 1px solid var(--nf-border); }
.service-secondary { grid-column: span 6; padding: 34px 40px 38px 0; min-width: 0; border-bottom: 1px solid var(--nf-border); }
.service-secondary:nth-child(even) { padding-left: 40px; border-left: 1px solid var(--nf-border); }
.service-secondary:nth-last-child(-n+2) { border-bottom: 0; }
.service-secondary .service-index { color: var(--nf-graphite); }
.service-secondary h3 { margin: 22px 0 0; font-size: 1.75rem; line-height: 1.214286; font-weight: 600; }
.service-secondary-meta { margin: 7px 0 20px; color: var(--nf-graphite); font-family: var(--font-mono); font-size: 0.6875rem; line-height: 1.636364; text-transform: uppercase; letter-spacing: 0.05em; }
.service-secondary > p:not(.service-index):not(.service-secondary-meta) { margin: 0; max-width: 520px; color: var(--nf-graphite); }
.service-secondary .service-link { margin-top: 22px; }

/* Products remain a scalable owner-controlled layer. */
.products-section { background: var(--nf-white); }
.product-rows { border-top: 1px solid var(--nf-ink); }
.product-row { --product-accent: var(--nf-signal); display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: center; padding: 38px 0 40px; border-bottom: 1px solid var(--nf-border); position: relative; }
.product-row::before { content: ""; position: absolute; left: 0; top: -1px; width: 56px; height: 4px; background: var(--product-accent); }
.product-row-fahrtig { --product-accent: #2ED3A7; }
.product-row-versiq { --product-accent: #28D7C5; }
.product-row-icon { grid-column: 1 / span 1; }
.product-row-icon img { width: 72px; border-radius: 16px; }
.product-row-brand { grid-column: 2 / span 3; }
.product-row-brand img { width: auto; max-width: 250px; max-height: 52px; }
.product-row-copy { grid-column: 5 / span 5; }
.product-row-copy p { margin: 0; color: var(--nf-graphite); }
.product-row-kicker { margin-bottom: 10px !important; color: var(--nf-ink) !important; }
.product-row-link { grid-column: 10 / span 3; justify-self: end; min-height: 44px; display: inline-flex; align-items: center; font-size: 0.875rem; font-weight: 600; text-underline-offset: 5px; }

/* Work uses actual product identity inside NEEDFORM framing. */
.work-head { margin-bottom: 58px; }
.work-cases { border-top: 1px solid var(--nf-border-dark); }
.work-case { --work-accent: var(--nf-signal); display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; padding: 44px 0 48px; border-bottom: 1px solid var(--nf-border-dark); position: relative; }
.work-case::before { content: ""; position: absolute; top: -1px; left: 0; width: 56px; height: 4px; background: var(--work-accent); }
.work-case-fahrtig { --work-accent: #2ED3A7; }
.work-case-versiq { --work-accent: #28D7C5; }
.work-brand { grid-column: 1 / span 3; }
.work-brand img { margin-top: 28px; max-width: 220px; max-height: 50px; width: auto; }
.work-kicker, .work-label { color: var(--nf-muted); }
.work-fact { grid-column: span 3; }
.work-fact > p:last-of-type { margin: 14px 0 0; color: var(--nf-muted); font-size: 0.9375rem; line-height: 1.666667; }
.work-fact a { margin-top: 20px; min-height: 44px; display: inline-flex; align-items: center; color: var(--nf-paper); font-size: 0.875rem; font-weight: 600; text-underline-offset: 5px; }

/* Studio: two active worlds, no invented Labs layer. */
.studio-worlds { display: grid; grid-template-columns: repeat(12,1fr); border-top: 1px solid var(--nf-ink); border-bottom: 1px solid var(--nf-border); }
.studio-world { grid-column: span 6; padding: 38px 46px 42px 0; }
.studio-world + .studio-world { padding-left: 46px; border-left: 1px solid var(--nf-border); }
.studio-world-code { color: var(--nf-signal); }
.studio-world h3 { margin: 24px 0 0; max-width: 500px; font-size: 1.75rem; line-height: 1.214286; letter-spacing: -0.015em; font-weight: 600; }
.studio-world p:last-child { margin: 18px 0 0; max-width: 540px; color: var(--nf-graphite); }

/* Contact is the need-first intake. */
.contact-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; align-items: start; }
.contact-copy { grid-column: 1 / span 5; }
.contact-copy .section-label { color: var(--nf-muted); margin-bottom: 34px; }
.contact-copy h2 { margin: 0; max-width: 560px; font-size: 3.25rem; line-height: 1.076923; letter-spacing: -0.03em; font-weight: 600; }
.contact-copy > p:not(.section-label) { margin: 28px 0 0; max-width: 540px; color: var(--nf-muted); font-size: 1.125rem; line-height: 1.611111; }
.contact-email { margin-top: 24px; display: inline-flex; min-height: 44px; align-items: center; color: var(--nf-paper); text-underline-offset: 5px; }
.contact-form { grid-column: 7 / span 6; border-top: 1px solid var(--nf-border-dark); padding-top: 28px; }
.form-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 22px 18px; }
.field { min-width: 0; }
.field-wide { grid-column: 1 / -1; }
.field label { display: block; margin-bottom: 8px; color: var(--nf-muted); font-size: 0.8125rem; font-weight: 600; }
.field label span { color: #777C83; font-weight: 400; }
.field input, .field textarea { width: 100%; min-height: 48px; padding: 12px 13px; color: var(--nf-paper); background: var(--nf-dark); border: 1px solid var(--nf-border-dark); border-radius: 8px; outline: none; }
.field textarea { min-height: 146px; resize: vertical; line-height: 1.55; }
.field input::placeholder, .field textarea::placeholder { color: #777C83; }
.field input:hover, .field textarea:hover { border-color: #4A4F56; }
.field input:focus-visible, .field textarea:focus-visible { border-color: var(--nf-signal); box-shadow: 0 0 0 2px var(--nf-signal); }
.form-submit-row { display: flex; align-items: center; gap: 20px; margin-top: 26px; }
.section-dark .button-primary { background: var(--nf-paper); color: var(--nf-ink); border-color: var(--nf-paper); }
.section-dark .button-primary:hover { background: var(--nf-white); }
.form-submit-row p { margin: 0; max-width: 360px; color: var(--nf-muted); font-size: 0.75rem; line-height: 1.583333; }
.form-submit-row a { color: var(--nf-paper); text-underline-offset: 4px; }

.site-footer { padding: 44px 0 36px; background: var(--nf-ink); color: var(--nf-paper); border-top: 1px solid var(--nf-border-dark); }
.footer-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: end; }
.footer-brand { grid-column: 1 / span 4; }
.footer-brand img { width: 210px; }
.footer-meta { grid-column: 5 / span 3; color: var(--nf-muted); font-size: 0.8125rem; }
.footer-links { grid-column: 8 / span 5; display: flex; gap: 18px; justify-content: flex-end; flex-wrap: wrap; }
.footer-links a { min-height: 44px; display: inline-flex; align-items: center; color: var(--nf-paper); font-size: 0.8125rem; text-underline-offset: 4px; }

.legal-main { padding: 88px 0 128px; }
.legal-wrap { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }
.legal-aside { grid-column: 1 / span 3; }
.legal-content { grid-column: 4 / span 7; }
.legal-kicker { color: var(--nf-graphite); }
.legal-content h1 { margin: 18px 0 48px; font-size: 4rem; line-height: 1.03125; letter-spacing: -0.035em; font-weight: 600; }
.legal-content h2 { margin: 56px 0 18px; font-size: 1.625rem; line-height: 1.2; letter-spacing: -0.02em; font-weight: 600; }
.legal-content h3 { margin: 32px 0 12px; font-size: 1.1875rem; line-height: 1.3; }
.legal-content p, .legal-content li { color: #30343A; overflow-wrap: break-word; }
.legal-content a { text-underline-offset: 4px; }
.legal-content ul { padding-left: 20px; }
.legal-content address { font-style: normal; color: #30343A; }
.legal-note { padding: 20px 22px; background: var(--nf-white); border: 1px solid var(--nf-border); margin: 32px 0; }
.back-link { min-height: 44px; display: inline-flex; align-items: center; font-size: 0.875rem; font-weight: 600; text-underline-offset: 4px; }
.not-found { min-height: calc(100vh - 96px); display: grid; align-items: center; padding: 72px 0; }
.not-found-grid, .status-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }
.not-found-copy { grid-column: 1 / span 8; }
.not-found h1 { margin: 20px 0 24px; font-size: 5.5rem; line-height: 0.954545; letter-spacing: -0.045em; }
.not-found p { max-width: 560px; color: var(--nf-graphite); font-size: 1.1875rem; }
.status-main { min-height: calc(100vh - 96px); display: grid; align-items: center; padding: 96px 0; }
.status-grid > .legal-kicker { grid-column: 1 / span 3; }
.status-copy { grid-column: 4 / span 7; }
.status-copy h1 { margin: 0; font-size: 4rem; line-height: 1.03125; letter-spacing: -0.035em; font-weight: 600; }
.status-copy p { margin: 28px 0 34px; max-width: 600px; color: var(--nf-graphite); font-size: 1.125rem; line-height: 1.611111; }

@media (max-width: 1100px) {
  .desktop-nav { display: none; }
  .mobile-nav { display: block; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .container { width: min(var(--content-max), calc(100% - 80px)); }
  .brand-lockup { width: 220px; }
  .hero { min-height: auto; padding: 88px 0 104px; }
  .hero-grid, .section-head, .service-major, .contact-grid, .footer-grid, .legal-wrap, .not-found-grid, .status-grid { grid-template-columns: repeat(6, 1fr); gap: 24px; }
  .hero-copy { grid-column: 1 / span 4; }
  .hero h1 { font-size: 3.5rem; line-height: 1; }
  .principle-statement { font-size: 3.5rem; line-height: 1; }
  .principle-statement span { white-space: nowrap; }
  .hero-constraint { grid-column: 5 / span 2; }
  .constraint-field { min-height: 200px; }
  .constraint-field img { width: 80px; height: 80px; right: 18px; bottom: 18px; }
  .section { padding: 104px 0; }
  .section-label { grid-column: 1 / span 2; }
  .section-title-wrap { grid-column: 3 / span 4; }
  .service-index { grid-column: 1 / span 1; }
  .service-name-wrap { grid-column: 2 / span 2; }
  .service-copy { grid-column: 4 / span 3; }
  .service-link { grid-column: 4 / span 3; justify-self: start; margin-top: -4px; }
  .service-secondary-grid, .studio-worlds, .work-case { grid-template-columns: repeat(6,1fr); }
  .service-secondary { grid-column: span 3; }
  .product-row { grid-template-columns: repeat(6,1fr); }
  .product-row-icon { grid-column: 1 / span 1; }
  .product-row-brand { grid-column: 2 / span 2; }
  .product-row-copy { grid-column: 4 / span 3; }
  .product-row-link { grid-column: 4 / span 3; justify-self: start; margin-top: -8px; }
  .work-brand { grid-column: 1 / span 2; }
  .work-fact { grid-column: span 2; }
  .studio-world { grid-column: span 3; }
  .contact-copy { grid-column: 1 / span 3; }
  .contact-form { grid-column: 4 / span 3; }
  .form-grid { grid-template-columns: 1fr; }
  .field-wide { grid-column: auto; }
  .form-submit-row { align-items: flex-start; flex-direction: column; }
  .footer-brand { grid-column: 1 / span 2; }
  .footer-meta { grid-column: 3 / span 2; }
  .footer-links { grid-column: 5 / span 2; }
  .legal-aside, .status-grid > .legal-kicker { grid-column: 1 / span 2; }
  .legal-content, .status-copy { grid-column: 3 / span 4; }
  .not-found-copy { grid-column: 1 / span 5; }
}
@media (max-width: 767px) {
  .container { width: calc(100% - 48px); }
  .header-inner { min-height: 84px; gap: 18px; }
  .brand-lockup { width: 178px; }
  .mobile-nav[open] nav { min-width: min(280px, calc(100vw - 48px)); }
  .hero { padding: 76px 0 84px; }
  .hero-grid, .section-head, .service-major, .contact-grid, .footer-grid, .legal-wrap, .not-found-grid, .status-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .hero-copy { grid-column: 1 / -1; }
  .hero h1 { font-size: 2.75rem; line-height: 1.045455; letter-spacing: -0.045em; }
  .hero-lead { margin-top: 30px; font-size: 1.25rem; line-height: 1.5; }
  .hero-actions { margin-top: 34px; align-items: stretch; }
  .button-primary { width: 100%; }
  .text-link { width: auto; }
  .hero-constraint { grid-column: 3 / span 2; margin-top: 56px; }
  .constraint-field { min-height: 132px; }
  .constraint-field img { width: 64px; height: 64px; right: 14px; bottom: 14px; }
  .constraint-label { font-size: 0.6875rem; }
  .section { padding: 84px 0; }
  .section-head { margin-bottom: 52px; }
  .section-label { grid-column: 1 / -1; margin-bottom: 12px; }
  .section-title-wrap { grid-column: 1 / -1; }
  .section-title { font-size: 2.125rem; line-height: 1.147059; letter-spacing: -0.025em; }
  .section-intro { font-size: 1rem; line-height: 1.625; }
  .principle-statement { margin-top: 58px; font-size: clamp(36px, 10vw, 44px); line-height: 1.045; text-wrap: balance; }
  .principle-statement span { white-space: normal; }
  .principle-statement span + span { margin-top: 6px; }
  .service-tier { margin-top: 54px; }
  .service-major { padding: 30px 0 34px; }
  .service-index { grid-column: 1 / span 1; }
  .service-name-wrap { grid-column: 2 / span 3; }
  .service-name-wrap h3 { font-size: 1.875rem; line-height: 1.133333; }
  .service-copy { grid-column: 2 / span 3; margin-top: 4px; }
  .service-link { grid-column: 2 / span 3; justify-self: start; margin-top: 2px; }
  .service-tier-extended { margin-top: 64px; }
  .service-secondary-grid { grid-template-columns: repeat(4,1fr); }
  .service-secondary { grid-column: 1 / -1; padding: 30px 0 34px; }
  .service-secondary + .service-secondary { padding-left: 0; border-left: 0; border-top: 1px solid var(--nf-border); }
  .product-row { grid-template-columns: repeat(4,1fr); gap: 16px; padding: 30px 0 34px; }
  .product-row-icon { grid-column: 1 / span 1; }
  .product-row-icon img { width: 58px; border-radius: 13px; }
  .product-row-brand { grid-column: 2 / span 3; }
  .product-row-brand img { max-width: 210px; max-height: 44px; }
  .product-row-copy { grid-column: 2 / span 3; margin-top: 8px; }
  .product-row-link { grid-column: 2 / span 3; justify-self: start; margin-top: 4px; }
  .work-case { grid-template-columns: repeat(4,1fr); gap: 16px; }
  .work-brand { grid-column: 1 / -1; }
  .work-brand img { margin-top: 22px; max-width: 200px; }
  .work-fact { grid-column: 1 / -1; padding-top: 8px; }
  .studio-worlds { grid-template-columns: repeat(4,1fr); }
  .studio-world { grid-column: 1 / -1; padding: 30px 0 34px; }
  .studio-world + .studio-world { padding-left: 0; border-left: 0; border-top: 1px solid var(--nf-border); }
  .contact-copy { grid-column: 1 / -1; }
  .contact-copy h2 { font-size: 2.375rem; line-height: 1.105263; }
  .contact-form { grid-column: 1 / -1; margin-top: 52px; }
  .form-grid { grid-template-columns: 1fr; }
  .field-wide { grid-column: auto; }
  .form-submit-row { align-items: stretch; flex-direction: column; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-brand img { width: 188px; }
  .footer-meta { grid-column: 1 / -1; margin-top: 18px; }
  .footer-links { grid-column: 1 / -1; justify-content: flex-start; margin-top: 12px; }
  .legal-main { padding: 64px 0 96px; }
  .legal-aside, .status-grid > .legal-kicker { grid-column: 1 / -1; }
  .legal-content, .status-copy { grid-column: 1 / -1; }
  .legal-content h1, .status-copy h1 { margin-top: 12px; font-size: 2.75rem; line-height: 1.090909; }
  .not-found-copy { grid-column: 1 / -1; }
  .not-found h1 { font-size: 2.75rem; line-height: 1.045455; }
}
@media (max-width: 390px) {
  .brand-lockup { width: 156px; }
  .mobile-nav summary { padding-inline: 11px; }
}
@media (max-width: 340px) {
  .container { width: calc(100% - 40px); }
  .brand-lockup { width: 142px; }
  .mobile-nav summary { font-size: 0.8125rem; padding-inline: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}

/* Product visual containment. Product identities remain their own owners inside the global NEEDFORM site system. */
.product-site-header { background: var(--nf-paper); color: var(--nf-ink); }
.product-header-nav { display: flex; align-items: center; justify-content: flex-end; gap: 4px; }
.product-header-nav a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 10px 12px;
  color: var(--nf-graphite);
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
}
.product-header-nav a:hover { color: var(--nf-ink); }

.product-hero { padding: 108px 0 116px; }
.product-hero-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; align-items: center; }
.product-hero-copy { grid-column: 1 / span 8; }
.product-owner, .product-section-label {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  line-height: 1.454545;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.product-hero-logo { width: auto; height: auto; margin: 34px 0 44px; }
.fahrtig-logo { max-width: 430px; max-height: 90px; }
.versiq-logo { max-width: 430px; max-height: 80px; }
.product-hero h1 {
  margin: 0;
  max-width: 820px;
  font-size: 4.5rem;
  line-height: 1;
  letter-spacing: -0.045em;
  font-weight: 600;
}
.product-lead { margin: 30px 0 0; max-width: 720px; font-size: 1.25rem; line-height: 1.5; }
.product-actions { margin-top: 38px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.product-button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  border: 1px solid currentColor;
  border-radius: 10px;
  font-size: 0.9375rem;
  line-height: 1.333333;
  font-weight: 700;
  text-decoration: none;
}
.product-text-link { min-height: 44px; display: inline-flex; align-items: center; font-weight: 600; text-underline-offset: 5px; }
.product-hero-icon { grid-column: 10 / span 3; justify-self: end; }
.product-hero-icon img { width: 220px; border-radius: 48px; }

.product-hero-fahrtig { background: #0B1014; color: #F7F8F5; }
.product-hero-fahrtig .product-owner, .product-hero-fahrtig .product-lead { color: #AAB3B8; }
.product-hero-fahrtig .product-button { background: #2ED3A7; border-color: #2ED3A7; color: #0B1014; }
.product-hero-fahrtig .product-button:hover { background: #F7F8F5; border-color: #F7F8F5; }
.product-hero-fahrtig .product-text-link { color: #F7F8F5; }
.product-hero-versiq { background: #07080A; color: #F5F7F9; }
.product-hero-versiq .product-owner, .product-hero-versiq .product-lead { color: #A7ADB6; }
.product-hero-versiq .product-button { background: #28D7C5; border-color: #28D7C5; color: #07080A; }
.product-hero-versiq .product-button:hover { background: #F5F7F9; border-color: #F5F7F9; }
.product-hero-versiq .product-text-link { color: #F5F7F9; }

.product-detail-section { padding: 112px 0 120px; background: #F7F8F5; color: #0B1014; }
.versiq-detail { background: var(--nf-paper); color: var(--nf-ink); }
.product-detail-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; }
.product-detail-intro { grid-column: 1 / span 4; }
.product-detail-intro .product-section-label { color: var(--nf-graphite); margin-bottom: 18px; }
.product-detail-intro h2 { margin: 0; font-size: 2.5rem; line-height: 1.125; letter-spacing: -0.025em; font-weight: 600; max-width: 390px; }
.product-detail-rows { grid-column: 6 / span 7; border-top: 1px solid currentColor; }
.product-detail-row { display: grid; grid-template-columns: 64px 1fr; gap: 20px; padding: 26px 0; border-bottom: 1px solid var(--nf-border); }
.product-detail-row > p { margin: 3px 0 0; font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.08em; color: var(--nf-graphite); }
.product-detail-row h3 { margin: 0; font-size: 1.25rem; line-height: 1.3; font-weight: 600; }
.product-detail-row div p { margin: 8px 0 0; color: var(--nf-graphite); }

.product-trust-section { padding: 112px 0; }
.product-trust-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; }
.product-trust-grid > .product-section-label { grid-column: 1 / span 3; }
.product-trust-grid > div { grid-column: 4 / span 8; }
.product-trust-grid h2 { margin: 0; font-size: 2.75rem; line-height: 1.090909; letter-spacing: -0.025em; font-weight: 600; max-width: 800px; }
.product-trust-grid p { margin: 26px 0 0; max-width: 760px; font-size: 1.125rem; line-height: 1.611111; }
.product-trust-grid .product-text-link { margin-top: 22px; }
.fahrtig-trust { background: #182027; color: #F7F8F5; }
.fahrtig-trust .product-section-label, .fahrtig-trust p { color: #AAB3B8; }
.fahrtig-trust .product-text-link { color: #F7F8F5; }
.versiq-trust { background: #111318; color: #F5F7F9; }
.versiq-trust .product-section-label, .versiq-trust p { color: #A7ADB6; }
.versiq-trust .product-text-link { color: #F5F7F9; }

.product-utility-section { padding: 88px 0; background: #F7F8F5; color: #0B1014; }
.versiq-utility { background: #07080A; color: #F5F7F9; border-top: 1px solid #2B3039; }
.product-utility-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; align-items: end; }
.product-utility-grid > div:first-child { grid-column: 1 / span 7; }
.product-utility-grid h2 { margin: 12px 0 0; font-size: 2.375rem; line-height: 1.105263; font-weight: 600; }
.product-utility-grid p { margin: 14px 0 0; }
.product-utility-grid a { text-underline-offset: 5px; }
.product-utility-links { grid-column: 9 / span 4; display: flex; justify-content: flex-end; gap: 20px; flex-wrap: wrap; }
.product-utility-links a { min-height: 44px; display: inline-flex; align-items: center; font-size: 0.875rem; font-weight: 600; }

.product-legal-main { padding: 88px 0 128px; background: var(--nf-paper); color: var(--nf-ink); }
.product-legal-wrap { display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; }
.product-legal-aside { grid-column: 1 / span 3; }
.product-legal-aside img { max-width: 220px; max-height: 58px; width: auto; }
.product-legal-aside p { margin: 24px 0 0; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--nf-graphite); }
.product-legal-content { grid-column: 4 / span 7; }
.product-legal-content > .product-section-label { color: var(--nf-graphite); }
.product-legal-content h1 { margin: 16px 0 42px; font-size: 3.625rem; line-height: 1.068966; letter-spacing: -0.035em; font-weight: 600; }
.product-legal-content h2 { margin: 52px 0 16px; font-size: 1.5625rem; line-height: 1.25; letter-spacing: -0.015em; font-weight: 600; }
.product-legal-content p, .product-legal-content li, .product-legal-content address { color: #30343A; overflow-wrap: break-word; }
.product-legal-content address { font-style: normal; }
.product-legal-content a { text-underline-offset: 4px; }
.support-callout { margin: 36px 0 0; padding: 22px 24px; border-left: 3px solid var(--nf-signal); background: #FFFFFF; }
.support-callout p { margin: 8px 0 0; }
.fahrtig-theme .support-callout { border-left-color: #2ED3A7; }
.versiq-theme .support-callout { border-left-color: #28D7C5; }

@media (min-width: 768px) and (max-width: 1199px) {
  .product-hero-grid, .product-detail-grid, .product-trust-grid, .product-utility-grid, .product-legal-wrap { grid-template-columns: repeat(6,1fr); }
  .product-hero-copy { grid-column: 1 / span 4; }
  .product-hero-icon { grid-column: 5 / span 2; }
  .product-hero-icon img { width: 170px; border-radius: 38px; }
  .product-hero h1 { font-size: 3.5rem; line-height: 1.035714; }
  .product-detail-intro { grid-column: 1 / span 2; }
  .product-detail-rows { grid-column: 3 / span 4; }
  .product-trust-grid > .product-section-label { grid-column: 1 / span 2; }
  .product-trust-grid > div { grid-column: 3 / span 4; }
  .product-utility-grid > div:first-child { grid-column: 1 / span 4; }
  .product-utility-links { grid-column: 5 / span 2; }
  .product-legal-aside { grid-column: 1 / span 2; }
  .product-legal-content { grid-column: 3 / span 4; }
}

@media (max-width: 767px) {
  .product-header-nav a:first-child { display: none; }
  .product-header-nav a { padding-inline: 8px; font-size: 0.75rem; }
  .product-hero { padding: 72px 0 80px; }
  .product-hero-grid, .product-detail-grid, .product-trust-grid, .product-utility-grid, .product-legal-wrap { grid-template-columns: repeat(4,1fr); gap: 16px; }
  .product-hero-copy { grid-column: 1 / -1; }
  .product-hero-logo { margin: 28px 0 34px; }
  .fahrtig-logo { max-width: 310px; }
  .versiq-logo { max-width: 300px; }
  .product-hero h1 { font-size: 2.75rem; line-height: 1.045455; }
  .product-lead { font-size: 1.125rem; line-height: 1.555556; }
  .product-actions { align-items: stretch; }
  .product-button { width: 100%; }
  .product-hero-icon { grid-column: 3 / span 2; justify-self: end; margin-top: 42px; }
  .product-hero-icon img { width: 124px; border-radius: 28px; }
  .product-detail-section, .product-trust-section { padding: 84px 0; }
  .product-detail-intro { grid-column: 1 / -1; }
  .product-detail-intro h2 { font-size: 2.125rem; line-height: 1.147059; max-width: none; }
  .product-detail-rows { grid-column: 1 / -1; margin-top: 48px; }
  .product-detail-row { grid-template-columns: 48px 1fr; gap: 12px; }
  .product-trust-grid > .product-section-label { grid-column: 1 / -1; }
  .product-trust-grid > div { grid-column: 1 / -1; margin-top: 12px; }
  .product-trust-grid h2 { font-size: 2.125rem; line-height: 1.147059; }
  .product-utility-section { padding: 72px 0; }
  .product-utility-grid > div:first-child { grid-column: 1 / -1; }
  .product-utility-links { grid-column: 1 / -1; justify-content: flex-start; margin-top: 28px; }
  .product-legal-main { padding: 64px 0 96px; }
  .product-legal-aside { grid-column: 1 / -1; }
  .product-legal-aside img { max-width: 200px; }
  .product-legal-content { grid-column: 1 / -1; margin-top: 36px; }
  .product-legal-content h1 { font-size: 2.625rem; line-height: 1.095238; }
}

@media (max-width: 399px) {
  .product-header-nav { display: none; }
}

@media (max-width: 360px) {
  .product-hero-logo { max-width: 100%; }
}

.studio-principle {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 24px;
  border-top: 1px solid var(--nf-border);
  margin-top: 44px;
  padding-top: 24px;
  align-items: baseline;
}
.studio-principle .studio-world-code { grid-column: 1 / span 3; margin: 0; }
.studio-principle > p:last-child {
  grid-column: 4 / span 8;
  margin: 0;
  font-size: clamp(24px, 2.5vw, 38px);
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: -0.025em;
}
@media (max-width: 1100px) {
  .studio-principle { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .studio-principle .studio-world-code { grid-column: 1 / span 2; }
  .studio-principle > p:last-child { grid-column: 3 / span 4; }
}
@media (max-width: 720px) {
  .studio-principle { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 30px; }
  .studio-principle .studio-world-code, .studio-principle > p:last-child { grid-column: 1 / -1; }
}

/* ========================================================================== 
   NEEDFORM Homepage REV11 — conversion clarity, DACH selling language,
   international brand codes. Product/legal pages retain the canonical system.
   ========================================================================== */
.home-rev11 .site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: color-mix(in srgb, var(--nf-paper) 94%, transparent);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.home-rev11 section[id] { scroll-margin-top: 96px; }
.home-rev11 .hero-rev11 { min-height: clamp(660px, 82vh, 820px); }
.home-rev11 .hero-copy { grid-column: 1 / span 8; }
.home-rev11 .hero-lead strong { color: var(--nf-ink); font-weight: 600; }
.home-rev11 .hero-principle {
  margin: 20px 0 0;
  max-width: 700px;
  color: var(--nf-graphite);
  font-family: var(--font-mono);
  font-size: 0.75rem;
  line-height: 1.666667;
  letter-spacing: .025em;
}
.home-rev11 .hero-signal { grid-column: 10 / span 3; }
.home-rev11 .hero-lanes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 14px;
  color: var(--nf-graphite);
  font-family: var(--font-mono);
  font-size: 0.625rem;
  line-height: 1.6;
  font-weight: 600;
  letter-spacing: .08em;
}
.home-rev11 .section-title, .home-rev11 .hero h1 { text-wrap: balance; }
.home-rev11 .section-intro, .home-rev11 .hero-lead { text-wrap: pretty; }
.home-rev11 .service-major-list-rev11 .service-index { color: var(--nf-graphite); }
.home-rev11 .service-copy strong { color: var(--nf-ink); font-weight: 600; }
.home-rev11 .service-entry { color: var(--nf-graphite); }
.home-rev11 .service-link { text-decoration-thickness: 1px; }
.home-rev11 .service-link::after, .home-rev11 .product-row-link::after { content: " ↘"; font-family: var(--font-mono); text-decoration: none; }
.home-rev11 .decision-rule {
  display: grid;
  grid-template-columns: repeat(12,1fr);
  gap: 24px;
  align-items: baseline;
  margin-top: 64px;
  padding-top: 24px;
  border-top: 1px solid var(--nf-border);
}
.home-rev11 .decision-rule-label, .home-rev11 .fit-code, .home-rev11 .creative-direction-label {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  line-height: 1.545455;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.home-rev11 .decision-rule-label { grid-column: 1 / span 3; color: var(--nf-graphite); }
.home-rev11 .decision-rule > p:last-child { grid-column: 4 / span 8; margin: 0; font-size: clamp(30px, 3vw, 46px); line-height: 1.08; letter-spacing: -.03em; }
.home-rev11 .decision-rule strong { font-weight: 600; }

.home-rev11 .fit-grid {
  display: grid;
  grid-template-columns: repeat(12,1fr);
  border-top: 1px solid var(--nf-ink);
  border-bottom: 1px solid var(--nf-border);
}
.home-rev11 .fit-card { grid-column: span 6; padding: 42px 48px 46px 0; }
.home-rev11 .fit-card + .fit-card { padding-left: 48px; border-left: 1px solid var(--nf-border); }
.home-rev11 .fit-code { color: var(--nf-graphite); }
.home-rev11 .fit-card h3 { margin: 24px 0 0; max-width: 520px; font-size: 1.875rem; line-height: 1.2; letter-spacing: -.02em; font-weight: 600; }
.home-rev11 .fit-card > p:not(.fit-code) { margin: 20px 0 0; max-width: 560px; color: var(--nf-graphite); }
.home-rev11 .fit-card dl { margin: 34px 0 0; }
.home-rev11 .fit-card dl > div { display: grid; grid-template-columns: 142px 1fr; gap: 18px; padding: 14px 0; border-top: 1px solid var(--nf-border); }
.home-rev11 .fit-card dt { color: var(--nf-graphite); font-size: 0.75rem; font-weight: 600; }
.home-rev11 .fit-card dd { margin: 0; font-size: 0.875rem; font-weight: 600; }
.home-rev11 .boundary-line, .home-rev11 .proof-note {
  display: grid;
  grid-template-columns: repeat(12,1fr);
  gap: 24px;
  align-items: start;
  margin-top: 32px;
}
.home-rev11 .boundary-line .fit-code, .home-rev11 .proof-note .fit-code { grid-column: 1 / span 3; }
.home-rev11 .boundary-line > p:last-child, .home-rev11 .proof-note > p:last-child { grid-column: 4 / span 8; margin: 0; color: var(--nf-graphite); max-width: 760px; }

.home-rev11 .creative-section { background: var(--nf-ink); color: var(--nf-paper); }
.home-rev11 .creative-section .section-label, .home-rev11 .creative-section .section-intro { color: var(--nf-muted); }
.home-rev11 .creative-capability-grid {
  display: grid;
  grid-template-columns: repeat(12,1fr);
  border-top: 1px solid var(--nf-border-dark);
  border-bottom: 1px solid var(--nf-border-dark);
}
.home-rev11 .creative-capability-grid article { grid-column: span 6; padding: 36px 42px 40px 0; border-bottom: 1px solid var(--nf-border-dark); }
.home-rev11 .creative-capability-grid article:nth-child(even) { padding-left: 42px; border-left: 1px solid var(--nf-border-dark); }
.home-rev11 .creative-capability-grid article:nth-last-child(-n+2) { border-bottom: 0; }
.home-rev11 .creative-capability-grid .service-index { color: var(--nf-muted); }
.home-rev11 .creative-capability-grid h3 { margin: 22px 0 0; font-size: 1.625rem; line-height: 1.230769; letter-spacing: -.015em; }
.home-rev11 .creative-capability-grid article > p:last-child { margin: 16px 0 0; max-width: 540px; color: var(--nf-muted); }
.home-rev11 .creative-direction {
  display: grid;
  grid-template-columns: repeat(12,1fr);
  gap: 24px;
  margin-top: 42px;
}
.home-rev11 .creative-direction > div { grid-column: span 6; }
.home-rev11 .creative-direction-label { color: var(--nf-muted); }
.home-rev11 .creative-direction > div > p:last-child { margin: 12px 0 0; color: var(--nf-paper); font-family: var(--font-mono); font-size: 0.8125rem; line-height: 1.692308; }

.home-rev11 .process-grid {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(12,1fr);
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--nf-ink);
  border-bottom: 1px solid var(--nf-border);
}
.home-rev11 .process-grid li { grid-column: span 4; min-height: 230px; padding: 30px 36px 34px 0; border-bottom: 1px solid var(--nf-border); }
.home-rev11 .process-grid li:not(:nth-child(3n+1)) { padding-left: 36px; border-left: 1px solid var(--nf-border); }
.home-rev11 .process-grid li:nth-last-child(-n+3) { border-bottom: 0; }
.home-rev11 .process-grid span { color: var(--nf-graphite); font-family: var(--font-mono); font-size: 0.6875rem; font-weight: 600; letter-spacing: .08em; }
.home-rev11 .process-grid h3 { margin: 22px 0 0; font-size: 1.5rem; line-height: 1.25; }
.home-rev11 .process-grid p { margin: 12px 0 0; color: var(--nf-graphite); max-width: 320px; }
.home-rev11 .process-principle {
  display: grid;
  grid-template-columns: repeat(12,1fr);
  gap: 24px;
  margin-top: 44px;
  align-items: start;
}
.home-rev11 .process-principle > p:first-child { grid-column: 1 / span 3; color: var(--nf-graphite); }
.home-rev11 .process-principle > p:last-child { grid-column: 4 / span 8; margin: 0; font-size: 1.5rem; line-height: 1.416667; }
.home-rev11 .process-principle span { color: var(--nf-graphite); font-size: 1rem; }
.home-rev11 .proof-note { padding-top: 4px; }

.home-rev11 .field select {
  width: 100%;
  min-height: 48px;
  padding: 12px 40px 12px 13px;
  color: var(--nf-paper);
  background-color: var(--nf-dark);
  border: 1px solid var(--nf-border-dark);
  border-radius: 8px;
  outline: none;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--nf-muted) 50%), linear-gradient(135deg, var(--nf-muted) 50%, transparent 50%);
  background-position: calc(100% - 17px) 21px, calc(100% - 12px) 21px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.home-rev11 .field select:hover { border-color: #4A4F56; }
.home-rev11 .field select:focus-visible { border-color: var(--nf-signal); box-shadow: 0 0 0 2px var(--nf-signal); }
.home-rev11 .contact-promise { display: flex; align-items: center; gap: 12px; margin-top: 38px; }
.home-rev11 .contact-promise span { width: 34px; height: 5px; background: var(--nf-signal); flex: 0 0 auto; }
.home-rev11 .contact-promise p { margin: 0; color: var(--nf-paper); font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: .06em; text-transform: uppercase; }

@media (hover:hover) {
  .home-rev11 .service-major, .home-rev11 .product-row { transition: transform 180ms cubic-bezier(.2,.8,.2,1); }
  .home-rev11 .service-major:hover, .home-rev11 .product-row:hover { transform: translateX(4px); }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .home-rev11 .hero-copy { grid-column: 1 / span 4; }
  .home-rev11 .hero-signal { grid-column: 5 / span 2; }
  .home-rev11 .decision-rule, .home-rev11 .fit-grid, .home-rev11 .boundary-line, .home-rev11 .creative-capability-grid, .home-rev11 .creative-direction, .home-rev11 .process-grid, .home-rev11 .process-principle, .home-rev11 .proof-note { grid-template-columns: repeat(6,1fr); }
  .home-rev11 .decision-rule-label, .home-rev11 .boundary-line .fit-code, .home-rev11 .proof-note .fit-code, .home-rev11 .process-principle > p:first-child { grid-column: 1 / span 2; }
  .home-rev11 .decision-rule > p:last-child, .home-rev11 .boundary-line > p:last-child, .home-rev11 .proof-note > p:last-child, .home-rev11 .process-principle > p:last-child { grid-column: 3 / span 4; }
  .home-rev11 .fit-card, .home-rev11 .creative-direction > div { grid-column: span 3; }
  .home-rev11 .creative-capability-grid article { grid-column: span 3; }
  .home-rev11 .process-grid li { grid-column: span 2; }
  .home-rev11 .process-grid li:not(:nth-child(3n+1)) { padding-left: 24px; }
  .home-rev11 .process-grid li { padding-right: 24px; }
}

@media (max-width: 767px) {
  .home-rev11 .site-header { background: var(--nf-paper); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .home-rev11 section[id] { scroll-margin-top: 84px; }
  .home-rev11 .hero-rev11 { min-height: auto; }
  .home-rev11 .hero-principle { font-size: 0.6875rem; line-height: 1.727273; }
  .home-rev11 .hero-signal { grid-column: 2 / span 3; }
  .home-rev11 .decision-rule, .home-rev11 .fit-grid, .home-rev11 .boundary-line, .home-rev11 .creative-capability-grid, .home-rev11 .creative-direction, .home-rev11 .process-grid, .home-rev11 .process-principle, .home-rev11 .proof-note { grid-template-columns: repeat(4,1fr); gap: 16px; }
  .home-rev11 .decision-rule { margin-top: 46px; }
  .home-rev11 .decision-rule-label, .home-rev11 .decision-rule > p:last-child, .home-rev11 .boundary-line .fit-code, .home-rev11 .boundary-line > p:last-child, .home-rev11 .proof-note .fit-code, .home-rev11 .proof-note > p:last-child, .home-rev11 .process-principle > p:first-child, .home-rev11 .process-principle > p:last-child { grid-column: 1 / -1; }
  .home-rev11 .decision-rule > p:last-child { font-size: 2rem; }
  .home-rev11 .fit-card { grid-column: 1 / -1; padding: 34px 0 38px; }
  .home-rev11 .fit-card + .fit-card { padding-left: 0; border-left: 0; border-top: 1px solid var(--nf-border); }
  .home-rev11 .fit-card h3 { font-size: 1.625rem; line-height: 1.230769; }
  .home-rev11 .fit-card dl > div { grid-template-columns: 1fr; gap: 4px; }
  .home-rev11 .creative-capability-grid article { grid-column: 1 / -1; padding: 30px 0 34px; }
  .home-rev11 .creative-capability-grid article:nth-child(even) { padding-left: 0; border-left: 0; }
  .home-rev11 .creative-capability-grid article + article { border-top: 1px solid var(--nf-border-dark); }
  .home-rev11 .creative-capability-grid article:nth-last-child(-n+2) { border-bottom: 0; }
  .home-rev11 .creative-direction > div { grid-column: 1 / -1; padding-top: 18px; }
  .home-rev11 .creative-direction > div + div { border-top: 1px solid var(--nf-border-dark); }
  .home-rev11 .process-grid li { grid-column: 1 / -1; min-height: auto; padding: 28px 0 30px; border-bottom: 1px solid var(--nf-border); }
  .home-rev11 .process-grid li:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
  .home-rev11 .process-grid li + li { border-top: 0; }
  .home-rev11 .process-grid li:last-child { border-bottom: 0; }
  .home-rev11 .process-principle > p:last-child { font-size: 1.25rem; line-height: 1.45; }
}

/* Local REV11 convergence: existing identity, editorial density, native fallback. */
@font-face { font-family: "Manrope Variable"; src: url("fonts/Manrope.woff") format("woff"), url("fonts/Manrope.ttf") format("truetype"); font-style: normal; font-weight: 200 800; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("fonts/IBMPlexMono-Regular.woff") format("woff"), url("fonts/IBMPlexMono-Regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("fonts/IBMPlexMono-SemiBold.woff") format("woff"), url("fonts/IBMPlexMono-SemiBold.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
:root { --motion-fast: 160ms; --motion-standard: 240ms; --motion-complex: 400ms; --motion-ease: cubic-bezier(.2,.8,.2,1); }
.field input::placeholder, .field textarea::placeholder, .field label span { color: var(--nf-muted); opacity: 1; }
select { font: inherit; }
.home-rev11 .site-shell { overflow: visible; }
.home-rev11 .site-header { position: relative; }
.nav-enhanced .home-rev11 .site-header { position: sticky; }
.home-rev11 :is(.hero-copy,.hero-signal,.section-title-wrap,.contact-copy,.contact-form) { min-width: 0; }
.home-rev11 #fit { scroll-margin-top: 112px; }
.home-rev11 .section { padding: 88px 0; }
.home-rev11 .section-head { margin-bottom: 40px; }
.home-rev11 .section-intro { margin-top: 24px; }
.home-rev11 .section-title { font-size: 3.25rem; line-height: 1.08; }
.home-rev11 .fit-inline { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin: 0 0 40px; padding: 24px 0; border-top: 1px solid var(--nf-border); }
.home-rev11 .fit-inline p { margin: 0; }
.home-rev11 .fit-inline strong { display: block; font-size: 1.125rem; font-weight: 600; line-height: 1.5; margin-bottom: 8px; }
.home-rev11 .fit-inline span { display: block; max-width: 520px; color: var(--nf-graphite); }
.home-rev11 .service-major { grid-template-columns: repeat(12,minmax(0,1fr)); padding: 32px 0; gap: 16px 24px; }
.home-rev11 .service-index { padding-top: 8px; }
.home-rev11 .service-name-wrap { grid-column: 2 / span 3; }
.home-rev11 .service-copy { grid-column: 6 / span 7; }
.home-rev11 .service-link { grid-column: 6 / span 7; justify-self: start; }
.home-rev11 .service-major, .home-rev11 .product-row, .home-rev11 .service-major:hover, .home-rev11 .product-row:hover { transform: none; transition: none; }
.home-rev11 :is(.service-link,.product-row-link,.text-link) { gap: 8px; transition: text-decoration-color var(--motion-fast) var(--motion-ease); }
.home-rev11 :is(.service-link,.product-row-link,.text-link)::after { display: inline-block; transition: transform var(--motion-fast) var(--motion-ease); }
.home-rev11 :is(.service-link,.product-row-link,.text-link):is(:hover,:focus-visible)::after { transform: translate(2px,2px); }
.home-rev11 .creative-section { padding: 96px 0; }
.home-rev11 .creative-section .section-title { font-size: 4rem; max-width: 950px; }
.home-rev11 .creative-capability-grid { gap: 0; }
.home-rev11 .creative-capability-grid article { padding-block: 28px; }
.home-rev11 .creative-capability-grid .service-index { padding-top: 0; }
.home-rev11 .creative-capability-grid h3 { margin-top: 12px; }
.home-rev11 .creative-capability-grid article > p:last-child { margin-top: 12px; }
.home-rev11 .creative-direction { margin-top: 32px; gap: 32px; }
.home-rev11 .creative-direction-label { font-size: 0.75rem; }
.home-rev11 .creative-direction > div > p:last-child { font-size: 0.875rem; line-height: 1.714286; }
.home-rev11 .process-grid { grid-template-columns: repeat(6,minmax(0,1fr)); }
.home-rev11 .process-grid li, .home-rev11 .process-grid li:not(:nth-child(3n+1)) { grid-column: auto; min-height: 0; padding: 24px 20px; border: 0; border-left: 1px solid var(--nf-border); }
.home-rev11 .process-grid li:first-child { border-left: 0; padding-left: 0; }
.home-rev11 .process-grid li:last-child { padding-right: 0; }
.home-rev11 .process-grid h3 { margin-top: 16px; }
.home-rev11 .process-grid p { margin-top: 8px; }
.home-rev11 .process-principle { margin-top: 24px; }
.home-rev11 .product-row { padding: 28px 0; grid-template-columns: repeat(12,minmax(0,1fr)); }
.home-rev11 .product-row-kicker { font-size: 0.875rem; line-height: 1.571429; letter-spacing: .04em; }
.home-rev11 .product-row-brand img { max-width: 100%; }
.home-rev11 .contact-form { padding-top: 24px; }
.home-rev11 .field label { font-size: 0.875rem; }
.home-rev11 .form-options { border-block: 1px solid var(--nf-border-dark); margin-top: 24px; }
.home-rev11 .form-options summary { min-height: 52px; display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; font-size: 0.875rem; font-weight: 600; }
.home-rev11 .form-options summary::-webkit-details-marker { display: none; }
.home-rev11 .form-options summary span { color: var(--nf-muted); font-weight: 400; }
.home-rev11 .form-options summary::after { content: '+'; margin-left: auto; font-size: 1.5rem; transition: transform var(--motion-standard) var(--motion-ease); }
.home-rev11 .form-options[open] summary::after { transform: rotate(45deg); }
.home-rev11 .form-options .form-grid { padding: 12px 0 24px; }
.home-rev11 .mobile-nav summary::after { content: '+'; display: inline-block; margin-left: 10px; transition: transform var(--motion-standard) var(--motion-ease); }
.home-rev11 .mobile-nav[open] summary::after { transform: rotate(45deg); }
.home-rev11 .mobile-nav[open] nav { max-height: calc(100dvh - 104px); overflow-y: auto; }
.home-rev11 .mobile-nav nav a:is(:hover,:focus-visible) { text-decoration: underline; text-underline-offset: 5px; }
.home-rev11 .form-submit-row a { display: inline-flex; min-height: 44px; align-items: center; }
@media (min-width: 768px) and (max-width: 1199px) {
 .home-rev11 .section-title { font-size: 2.75rem; }
 .home-rev11 .creative-section .section-title { font-size: 3.25rem; }
 .home-rev11 .service-name-wrap { grid-column: 2 / span 4; }
 .home-rev11 .service-copy, .home-rev11 .service-link { grid-column: 7 / span 6; }
 .home-rev11 .process-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .home-rev11 .process-grid li:nth-child(4) { border-left: 0; padding-left: 0; }
 .home-rev11 .process-grid li:nth-child(-n+3) { border-bottom: 1px solid var(--nf-border); }
 .home-rev11 .product-row-brand { grid-column: 2 / span 3; }
 .home-rev11 .product-row-copy { grid-column: 6 / span 7; }
 .home-rev11 .product-row-link { grid-column: 6 / span 7; justify-self: start; }
 .home-rev11 .creative-capability-grid article { padding-right: 24px; }
 .home-rev11 .creative-capability-grid article:nth-child(even) { padding-left: 24px; }
}
@media (max-width: 767px) {
 .home-rev11 .hero-copy { grid-column: 1 / -1; }
 .home-rev11 .section { padding: 64px 0; }
 .home-rev11 .section-head { margin-bottom: 32px; gap: 16px; }
 .home-rev11 .section-title { font-size: 2.25rem; line-height: 1.12; }
 .home-rev11 .section-intro { font-size: 1.125rem; line-height: 1.555556; margin-top: 20px; }
 .home-rev11 .fit-inline { grid-template-columns: 1fr; gap: 24px; margin-bottom: 24px; }
 .home-rev11 .service-major { grid-template-columns: 28px minmax(0,1fr); gap: 16px; padding: 28px 0; }
 .home-rev11 .service-index { grid-column: 1; }
 .home-rev11 .service-name-wrap { grid-column: 2; }
 .home-rev11 .service-copy, .home-rev11 .service-link { grid-column: 1 / -1; margin: 0; }
 .home-rev11 .service-name-wrap p { margin-top: 6px; }
 .home-rev11 .creative-section { padding: 72px 0; }
 .home-rev11 .creative-section .section-title { font-size: 2.5rem; line-height: 1.12; overflow-wrap: break-word; }
 .home-rev11 .creative-capability-grid article { padding: 24px 0; border: 0; }
 .home-rev11 .creative-capability-grid article + article { border-top: 1px solid var(--nf-border-dark); }
 .home-rev11 .creative-capability-grid h3 { font-size: 1.625rem; line-height: 1.230769; }
 .home-rev11 .creative-direction { gap: 24px; }
 .home-rev11 .creative-direction > div { padding-top: 0; }
 .home-rev11 .creative-direction > div + div { padding-top: 24px; }
 .home-rev11 .process-grid { display: block; }
 .home-rev11 .process-grid li, .home-rev11 .process-grid li:not(:nth-child(3n+1)) { display: grid; grid-template-columns: 24px 100px minmax(0,1fr); gap: 12px; padding: 20px 0; border: 0; }
 .home-rev11 .process-grid li + li { border-top: 1px solid var(--nf-border); }
 .home-rev11 .process-grid h3 { font-size: 1.5rem; line-height: 1.25; margin: 0; }
 .home-rev11 .process-grid span { padding-top: 5px; }
 .home-rev11 .process-grid p { margin: 0; }
 .home-rev11 .process-principle { gap: 12px; }
 .home-rev11 .product-row { grid-template-columns: 64px minmax(0,1fr); gap: 20px 16px; }
 .home-rev11 .product-row-icon { grid-column: 1; }
 .home-rev11 .product-row-brand { grid-column: 2; }
 .home-rev11 .product-row-copy, .home-rev11 .product-row-link { grid-column: 1 / -1; margin: 0; }
 .home-rev11 .contact-grid { gap: 32px; }
 .home-rev11 .contact-form { margin-top: 0; }
 .home-rev11 .form-options .form-grid { grid-template-columns: 1fr; }
}
@media (max-width: 359px) {
 .home-rev11 .header-inner { gap: 8px; }
 .home-rev11 .brand-lockup { width: 160px; }
 .home-rev11 .mobile-nav summary { padding-inline: 10px; }
 .home-rev11 .process-grid li, .home-rev11 .process-grid li:not(:nth-child(3n+1)) { grid-template-columns: 24px minmax(0,1fr); }
 .home-rev11 .process-grid p { grid-column: 2; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 .home-rev11 *, .home-rev11 *::before, .home-rev11 *::after { animation: none !important; transition: none !important; }
 .home-rev11 :is(.service-link,.product-row-link,.text-link)::after { transform: none !important; }
}

/* Reflow keeps enlarged text in-flow, including native menu and method rows. */
.home-rev11 { overflow-wrap: anywhere; }
.home-rev11 .header-inner { flex-wrap: wrap; padding-block: 12px; }
.home-rev11 .service-copy { max-width: 68ch; }
.home-rev11 .section-intro { max-width: 52ch; }
.home-rev11 :is(.hero-principle,.creative-direction p) { overflow-wrap: anywhere; }
@media (max-width: 767px) {
 .home-rev11 .process-grid li, .home-rev11 .process-grid li:not(:nth-child(3n+1)) { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 12px; }
 .home-rev11 .process-grid span { flex: 0 0 1.5rem; padding: 0; }
 .home-rev11 .process-grid h3 { flex: 0 0 6.25rem; }
 .home-rev11 .process-grid p { flex: 1 1 9rem; }
 .home-rev11 .process-grid li + li, .home-rev11 .process-grid li:not(:nth-child(3n+1)) { border-top: 1px solid var(--nf-border); }
 .home-rev11 .form-options summary { flex-wrap: wrap; }
}
/* Long German legal headings must wrap instead of disappearing behind the shell. */
.legal-content, .product-legal-content { min-width: 0; }
.legal-content h1, .product-legal-content h1 { overflow-wrap: anywhere; hyphens: auto; }
.home-rev11 .service-index { white-space: nowrap; }

/* Visual convergence: homepage only; original hero and shared routes keep their rules. */
.visual-convergence #studio .section-head { align-items: start; }
.visual-convergence #studio .fit-inline { margin-bottom: 16px; }
@media (min-width:1200px) {
 .visual-convergence .service-major-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; }
 .visual-convergence .service-major { display:flex; flex-direction:column; align-items:stretch; gap:16px; padding:28px 0 0; border-bottom:0; }
 .visual-convergence .service-name-wrap h3 { font-size:2rem; }
 .visual-convergence .service-name-wrap { min-height:90px; }
 .visual-convergence .service-copy { flex:1; }
 .visual-convergence .service-link { align-self:flex-start; margin-top:0; }
}
.visual-convergence .creative-section .section-head { display:block; margin-bottom:40px; }
.visual-convergence .creative-section .section-label { margin-bottom:24px; }
.visual-convergence .creative-section .section-title { max-width:1100px; }
.visual-convergence .creative-section .section-intro { max-width:65ch; }
.visual-convergence .creative-composition { border-top:1px solid var(--nf-border-dark); padding-top:28px; margin-top:36px; }
.visual-convergence .creative-offers { display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.visual-convergence .creative-offers article { min-width:0; }
.visual-convergence .creative-offers h3 { margin:12px 0; font-size:1.625rem; line-height:1.230769; letter-spacing:-.015em; }
.visual-convergence .creative-offers article > p:last-child { color:var(--nf-muted); margin:0; }
.visual-convergence .creative-offers .service-index { color:var(--nf-muted); }
.visual-convergence .creative-composition:has(.creative-visual) { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:40px; border-top:0; padding-top:0; }
.visual-convergence .creative-composition:has(.creative-visual) .creative-offers { display:flex; flex-direction:column; justify-content:center; gap:32px; }
.visual-convergence .creative-composition:has(.creative-visual) .creative-offers article { padding-top:20px; border-top:1px solid var(--nf-border-dark); }
.visual-convergence .creative-composition-b:has(.creative-visual) { grid-template-columns:minmax(0,1fr) minmax(0,2fr); margin-top:48px; }
.visual-convergence .creative-composition-b .creative-visual { grid-column:2; grid-row:1; }
.visual-convergence .creative-composition-b:has(.creative-visual) .creative-offers { grid-column:1; grid-row:1; }
.visual-convergence .creative-visual { min-width:0; margin:0; }
.visual-convergence .visual-frame { position:relative; overflow:hidden; background:var(--nf-dark); aspect-ratio:8/5; }
.visual-convergence .visual-frame > img { width:100%; height:100%; object-fit:cover; object-position:50% 50%; }
.visual-convergence .visual-frame .material-detail { position:absolute; right:0; bottom:0; width:26%; height:42%; object-fit:cover; object-position:84% 85%; border:8px solid var(--nf-ink); border-right:0; border-bottom:0; }
.visual-convergence .visual-frame-textile { display:grid; grid-template-columns:3fr 2fr; gap:12px; }
.visual-convergence .visual-frame-textile > img { min-height:0; object-position:38% 50%; }
.visual-convergence .visual-variants { display:grid; gap:12px; min-height:0; grid-template-rows:1fr 1fr; overflow:hidden; }
.visual-convergence .visual-variants img { width:100%; height:100%; min-height:0; object-fit:cover; object-position:84% 35%; }
.visual-convergence .visual-variants img:last-child { object-position:35% 65%; }
.visual-convergence .reference-caption { color:var(--nf-muted); margin:12px 0 0; font-size:.875rem; line-height:1.5; }
.visual-convergence .reference-caption a { display:inline-flex; align-items:center; min-height:44px; text-underline-offset:4px; }
.visual-convergence .creative-direction { margin-top:40px; }
.visual-convergence .method-path { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; }
.visual-convergence .method-path li { position:relative; border-top:1px solid var(--nf-border); padding:24px 20px 0 0; min-width:0; }
.visual-convergence .method-path li::before { content:''; position:absolute; width:7px; height:7px; background:var(--nf-ink); top:-4px; left:0; }
.visual-convergence .method-path li:nth-child(odd)::before { background:var(--nf-signal); }
.visual-convergence .method-path li:nth-child(2n) { padding-right:32px; }
.visual-convergence .method-path span { font-family:var(--font-mono); color:var(--nf-graphite); font-size:.75rem; }
.visual-convergence .method-path h3 { font-size:1.5rem; line-height:1.25; margin:12px 0 8px; }
.visual-convergence .method-path p { color:var(--nf-graphite); margin:0; }
.visual-convergence .owned-products { display:grid; grid-template-columns:7fr 5fr; gap:56px; }
.visual-convergence .owned-product { display:grid; grid-template-columns:64px minmax(0,1fr); align-content:start; align-items:center; gap:20px 16px; border-top:1px solid var(--nf-ink); padding-top:24px; min-width:0; }
.visual-convergence .owned-product .product-row-icon { grid-column:1; }
.visual-convergence .owned-product .product-row-brand { grid-column:2; }
.visual-convergence .owned-product .product-row-brand img { width:100%; max-width:230px; }
.visual-convergence .owned-product .product-row-copy, .visual-convergence .owned-product .product-row-link { grid-column:1/-1; }
.visual-convergence .owned-product .product-row-link { justify-self:start; margin:0; }
.visual-convergence .owned-product .product-row-kicker { margin:0 0 12px; }
.visual-convergence .product-model { grid-column:1/-1; grid-row:2; display:flex; flex-direction:column; justify-content:center; align-items:center; min-height:250px; background:var(--nf-paper); border:1px solid var(--nf-border); padding:32px; text-align:center; }
.visual-convergence .product-model img { width:64px; height:64px; margin-bottom:20px; }
.visual-convergence .product-model p { max-width:26ch; margin:0; color:var(--nf-graphite); font-size:.875rem; }
.visual-convergence .owned-product-versiq .product-model { min-height:320px; }
.visual-convergence .contact-heading { grid-column:1/-1; margin-bottom:16px; }
.visual-convergence .contact-heading .section-label { margin-bottom:24px; }
.visual-convergence .contact-heading h2 { font-size:4rem; line-height:1.08; font-weight:600; letter-spacing:-.03em; max-width:1000px; margin:0; }
.visual-convergence .contact-copy { grid-column:1/span 4; }
.visual-convergence .contact-copy > p:not(.section-label) { color:var(--nf-graphite); margin-top:0; }
.visual-convergence .contact-email { color:var(--nf-ink); }
.visual-convergence .contact-form { grid-column:6/span 7; padding-top:0; border:0; }
.visual-convergence .contact-section :is(input,textarea,select) { color:var(--nf-ink); background:var(--nf-white); border-color:var(--nf-graphite); border-radius:0; }
.visual-convergence .contact-section :is(label,label span,input::placeholder,textarea::placeholder,.form-options summary span,.form-submit-row p) { color:var(--nf-graphite); }
.visual-convergence .contact-section .form-options { border-color:var(--nf-border); }
.visual-convergence .contact-section .button-primary { background:var(--nf-signal); border-color:var(--nf-signal); color:var(--nf-ink); }
.visual-convergence .contact-section .button-primary:is(:hover,:focus-visible) { background:var(--nf-ink); color:var(--nf-paper); border-color:var(--nf-ink); }
@media (max-width:1199px) {
 .visual-convergence .creative-composition:has(.creative-visual), .visual-convergence .creative-composition-b:has(.creative-visual) { gap:24px; grid-template-columns:1fr 1fr; }
 .visual-convergence .visual-frame { aspect-ratio:4/5; }
 .visual-convergence .visual-frame-textile { grid-template-columns:1fr; }
 .visual-convergence .visual-variants { display:none; }
 .visual-convergence .method-path { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 0; }
 .visual-convergence .owned-products { gap:32px; }
 .visual-convergence .contact-heading h2 { font-size:3.25rem; }
}
@media (max-width:767px) {
 .visual-convergence .creative-section .section-label { margin-bottom:20px; }
 .visual-convergence .creative-composition:has(.creative-visual), .visual-convergence .creative-composition-b:has(.creative-visual) { display:flex; flex-direction:column; gap:20px; margin-top:32px; }
 .visual-convergence .creative-offers { grid-template-columns:1fr; gap:24px; }
 .visual-convergence .creative-composition:has(.creative-visual) .creative-offers { gap:24px; }
 .visual-convergence .visual-frame { aspect-ratio:4/3; }
 .visual-convergence .visual-frame > img { object-position:48% 50%; }
 .visual-convergence .visual-frame .material-detail { display:none; }
 .visual-convergence .visual-frame-textile { grid-template-columns:3fr 2fr; gap:8px; }
 .visual-convergence .visual-variants { display:block; }
 .visual-convergence .visual-variants img:last-child { display:none; }
 .visual-convergence .method-path { display:block; padding-left:4px; }
 .visual-convergence .method-path li, .visual-convergence .method-path li:nth-child(2n) { display:grid; grid-template-columns:28px minmax(0,1fr); gap:0 12px; border-top:0; border-left:1px solid var(--nf-border); padding:0 0 24px 20px; }
 .visual-convergence .method-path li::before { left:-4px; top:9px; }
 .visual-convergence .method-path h3 { margin:0 0 8px; }
 .visual-convergence .method-path span { padding-top:4px; }
 .visual-convergence .method-path p { grid-column:2; }
 .visual-convergence .method-path li:last-child { padding-bottom:0; }
 .visual-convergence .owned-products { grid-template-columns:1fr; gap:40px; }
 .visual-convergence .product-model, .visual-convergence .owned-product-versiq .product-model { min-height:220px; }
 .visual-convergence .contact-heading { margin-bottom:0; }
 .visual-convergence .contact-heading h2 { font-size:2.375rem; line-height:1.105263; }
 .visual-convergence .contact-copy, .visual-convergence .contact-form { grid-column:1/-1; }
}
@media (prefers-reduced-motion:reduce) {
 .visual-convergence .visual-frame::after { display:none; }
}
.visual-convergence .contact-section .form-submit-row a { color:var(--nf-ink); }
.visual-convergence .contact-section input::placeholder,
.visual-convergence .contact-section textarea::placeholder { color:var(--nf-graphite); opacity:1; }
.visual-convergence .contact-section :is(input,textarea,select):focus-visible { outline:2px solid var(--nf-ink); outline-offset:3px; box-shadow:none; }
@media (min-width:1200px) {
 .visual-convergence .creative-section { padding-block:72px; }
 .visual-convergence .visual-frame { aspect-ratio:8/4.5; }
 .visual-convergence .visual-frame-textile { grid-template-columns:1fr 1fr; }
 .visual-convergence .product-model, .visual-convergence .owned-product-versiq .product-model { min-height:220px; }
}
/* Final rhythm: reclaim section padding and duplicate model space, not type size. */
@media (min-width:768px) {
 .visual-convergence :is(#studio,#creative,#process,#products,#contact) { padding-block:72px; }
 .visual-convergence .product-model, .visual-convergence .owned-product-versiq .product-model { min-height:220px; }
}
@media (min-width:768px) and (max-width:1199px) {
 .visual-convergence .contact-grid { grid-template-columns:repeat(12,minmax(0,1fr)); }
 .visual-convergence .visual-frame { aspect-ratio:4/3; }
 .visual-convergence .visual-frame .material-detail { display:none; }
}
@media (max-width:767px) {
 .visual-convergence :is(#studio,#process,#products,#contact) { padding-block:56px; }
 .visual-convergence .creative-section { padding-block:64px; }
 .visual-convergence .product-model, .visual-convergence .owned-product-versiq .product-model { min-height:144px; padding:20px; }
 .visual-convergence .product-model img { display:none; }
 .visual-convergence .owned-products { gap:32px; }
 .visual-convergence .creative-composition:has(.creative-visual), .visual-convergence .creative-composition-b:has(.creative-visual) { margin-top:24px; }
 .visual-convergence .method-path li, .visual-convergence .method-path li:nth-child(2n) { padding-bottom:20px; }
.visual-convergence .method-path li:last-child { padding-bottom:0; }
}

/* Final convergence. Editorial frames are stable containers; only their crops move. */
.visual-convergence .creative-section .section-title { font-size:clamp(2.75rem,5vw,4.5rem); line-height:1.04; letter-spacing:-.035em; }
.visual-convergence .creative-section .section-title-wrap { display:grid; grid-template-columns:3fr 2fr; gap:48px; align-items:end; }
.visual-convergence .creative-section .section-intro { margin:0 0 4px; }
.visual-convergence .creative-composition:has(.creative-visual),
.visual-convergence .creative-composition-b:has(.creative-visual) { display:block; margin-top:32px; }
.visual-convergence .creative-composition:has(.creative-visual) .creative-offers { display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-top:20px; }
.visual-convergence .creative-composition:has(.creative-visual) .creative-offers article { padding:0 0 0 40px; border:0; position:relative; }
.visual-convergence .creative-offers .service-index { position:absolute; left:0; top:4px; }
.visual-convergence .creative-offers h3 { margin:0 0 12px; }
.visual-convergence .creative-composition-b:has(.creative-visual) { margin-top:48px; }
.visual-convergence .creative-visual .visual-frame { display:block; height:clamp(340px,33vw,460px); aspect-ratio:auto; background:var(--nf-paper); isolation:isolate; }
.visual-convergence .visual-surface { position:absolute; inset:0; overflow:hidden; }
.visual-convergence .visual-frame :is(.visual-primary,.visual-secondary,.visual-tertiary) { position:absolute; inset:0; overflow:hidden; transition:clip-path 640ms var(--motion-ease),transform 640ms var(--motion-ease); }
.visual-convergence .visual-frame :is(.visual-primary,.visual-secondary,.visual-tertiary) img { width:100%; height:100%; object-fit:cover; transition:transform 640ms var(--motion-ease); }
.visual-convergence .visual-primary { clip-path:inset(0 28% 0 0); }
.visual-convergence .visual-primary img { object-position:50% 50%; }
.visual-convergence [data-composition='object'] .visual-primary img { object-fit:contain; object-position:30% 50%; background:var(--nf-paper); }
.visual-convergence .visual-secondary { clip-path:inset(0 0 0 74%); }
.visual-convergence .visual-secondary img { transform:scale(2.5); transform-origin:20% 40%; }
.visual-convergence .visual-frame-textile .visual-primary { clip-path:inset(0 42% 0 0); }
.visual-convergence .visual-frame-textile .visual-primary img { transform:scale(1.12); object-position:40% 50%; }
.visual-convergence .visual-frame-textile .visual-secondary { clip-path:inset(0 22% 0 60%); }
.visual-convergence .visual-frame-textile .visual-secondary img { transform:scale(1.9); transform-origin:66% 35%; }
.visual-convergence .visual-frame-textile .visual-tertiary { clip-path:inset(0 0 0 80%); }
.visual-convergence .visual-frame-textile .visual-tertiary img { transform:scale(2.8); transform-origin:75% 65%; }
.visual-convergence [data-detail='true'] .visual-primary { clip-path:inset(0); }
.visual-convergence [data-detail='true'][data-composition='object'] .visual-primary img { transform:scale(1.75); transform-origin:50% 45%; }
.visual-convergence [data-detail='true'] :is(.visual-secondary,.visual-tertiary) { clip-path:inset(0 0 0 100%); }
.visual-convergence [data-detail='true'][data-composition='textile'] .visual-primary img { transform:scale(1); }
.visual-convergence .frame-index { position:absolute; top:20px; left:20px; padding:8px 10px; color:var(--nf-ink); background:var(--nf-paper); font: .75rem/1.5 var(--font-mono); letter-spacing:.04em; }
.visual-convergence .frame-control { position:absolute; right:20px; bottom:20px; border:1px solid var(--nf-paper); background:var(--nf-ink); color:var(--nf-paper); min-height:48px; padding:12px 18px; font:inherit; cursor:pointer; z-index:2; }
.visual-convergence .frame-control span { display:inline-block; margin-left:16px; transition:transform 400ms var(--motion-ease); }
.visual-convergence .frame-control[aria-pressed='true'] span { transform:rotate(180deg); }
.visual-convergence .frame-control:is(:hover,:focus-visible) { background:var(--nf-paper); color:var(--nf-ink); border-color:var(--nf-ink); }
.visual-convergence .reference-caption { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-top:4px; }
.visual-convergence .reference-caption > span { font: .6875rem/1.5 var(--font-mono); letter-spacing:.02em; }
.visual-convergence .reference-caption a { flex-shrink:0; }
.visual-convergence .creative-direction { padding-top:28px; margin-top:32px; border-top:1px solid var(--nf-border-dark); }
.visual-convergence .service-major { position:relative; }
.visual-convergence .service-major::before { content:''; position:absolute; left:0; top:-1px; height:3px; width:100%; background:var(--nf-signal); transform:scaleX(0); transform-origin:left; transition:transform 400ms var(--motion-ease); }
.visual-convergence .service-major:focus-within::before { transform:scaleX(1); }

/* A single diagram explains ordering; the complete six-step text remains below. */
.visual-convergence .method-transform { display:grid; grid-template-columns:1fr 2fr; gap:48px; align-items:center; margin:0 0 32px; padding:12px 0; border-top:1px solid var(--nf-ink); }
.visual-convergence #process .section-head { margin-bottom:24px; }
.visual-convergence :is(#process,#products) { padding-block:56px; }
.visual-convergence .method-current { font:.75rem/1.5 var(--font-mono); }
.visual-convergence .method-readout p { font-size:1.5rem; line-height:1.25; margin:12px 0; color:var(--nf-ink); }
.visual-convergence .method-play { padding:8px 0; min-height:44px; border:0; border-bottom:1px solid var(--nf-ink); background:none; color:var(--nf-ink); font:inherit; cursor:pointer; }
.visual-convergence .method-play span { margin-left:20px; }
.visual-convergence .method-diagram { height:150px; position:relative; overflow:hidden; border-bottom:1px solid var(--nf-ink); }
.visual-convergence .method-diagram::before { content:''; position:absolute; inset:24px 0; border-block:1px solid var(--nf-border); }
.visual-convergence .method-diagram i { --i:0; --y:-30px; --angle:-16deg; position:absolute; width:calc(16.666% - 12px); left:calc(16.666% * var(--i) + 6px); height:64px; bottom:25px; background:var(--nf-ink); transition:transform 400ms var(--motion-ease),height 400ms var(--motion-ease),background 400ms var(--motion-ease); }
.visual-convergence .method-diagram i:nth-child(2) { --i:1; --y:18px; --angle:9deg; }
.visual-convergence .method-diagram i:nth-child(3) { --i:2; --y:-12px; --angle:-9deg; }
.visual-convergence .method-diagram i:nth-child(4) { --i:3; --y:25px; --angle:17deg; }
.visual-convergence .method-diagram i:nth-child(5) { --i:4; --y:-28px; --angle:-6deg; }
.visual-convergence .method-diagram i:nth-child(6) { --i:5; --y:12px; --angle:12deg; }
.visual-convergence [data-step='0'] .method-diagram i { transform:translateY(var(--y)) rotate(var(--angle)); height:24px; }
.visual-convergence [data-step='1'] .method-diagram i { transform:translateY(var(--y)); height:24px; }
.visual-convergence [data-step='2'] .method-diagram i { height:24px; transform:translateY(-20px); }
.visual-convergence [data-step='3'] .method-diagram i { height:calc(24px + var(--i) * 8px); }
.visual-convergence [data-step='4'] .method-diagram i { background:var(--nf-ink); }
.visual-convergence [data-step='5'] .method-diagram i { background:var(--nf-signal); }
.visual-convergence .method-path h3 button { color:inherit; font:inherit; letter-spacing:inherit; padding:0 0 8px; border:0; border-bottom:2px solid transparent; min-height:44px; background:none; cursor:pointer; }
.visual-convergence .method-path h3 button[aria-pressed='true'] { border-color:var(--nf-signal); }
.visual-convergence .method-path h3 button:is(:hover,:focus-visible) { border-color:var(--nf-ink); }

/* Product truth lives in real screenshots, outside the future public webroot. */
.visual-convergence .owned-products { grid-template-columns:8fr 4fr; gap:48px; }
.visual-convergence .product-screen, .visual-convergence .product-development { grid-column:1/-1; grid-row:2; margin:0; min-width:0; }
.visual-convergence .screen-stage { height:310px; background:#060809; overflow:hidden; position:relative; perspective:1200px; }
.visual-convergence .screen-landscape { position:absolute; width:94%; max-width:none; left:3%; top:24px; border:1px solid var(--nf-border-dark); transform:translate(-5%,10%) rotateY(8deg); transform-origin:center; transition:transform 600ms var(--motion-ease); }
.visual-convergence .screen-portrait { position:absolute; width:23%; max-width:none; right:5%; top:12px; border:1px solid var(--nf-border-dark); transform:translate(0,10%); transition:transform 600ms var(--motion-ease); }
.visual-convergence .product-screen:focus-within .screen-landscape { transform:none; }
.visual-convergence .product-screen:focus-within .screen-portrait { transform:translate(120%,0); }
.visual-convergence .product-screen figcaption { color:var(--nf-graphite); font-size:.8125rem; line-height:1.5; margin:12px 0 4px; }
.visual-convergence .screen-open { display:inline-flex; align-items:center; gap:24px; min-height:44px; color:var(--nf-ink); text-underline-offset:5px; }
.visual-convergence .product-development { min-height:310px; padding:24px; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; background:var(--nf-paper); border:1px solid var(--nf-border); }
.visual-convergence .product-development img { width:96px; height:96px; }
.visual-convergence .product-development figcaption { font: .75rem/1.5 var(--font-mono); color:var(--nf-graphite); margin:24px 0 0; }
.visual-convergence .product-development figcaption span { display:block; font:1.75rem/1.15 var(--font-primary); letter-spacing:-.02em; color:var(--nf-ink); margin-top:8px; }
.visual-convergence .development-note { color:var(--nf-graphite); font-size:.6875rem; line-height:1.5; margin:20px 0 0; }
.visual-convergence .screen-dialog { width:min(1100px,calc(100% - 32px)); max-width:none; max-height:calc(100dvh - 40px); padding:24px; border:1px solid var(--nf-border); background:var(--nf-paper); color:var(--nf-ink); }
.visual-convergence .screen-dialog::backdrop { background:rgb(14 15 17 / .88); }
.visual-convergence .screen-dialog-head { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.visual-convergence .screen-dialog h2 { font-size:1.5rem; margin:0; }
.visual-convergence .screen-dialog p { color:var(--nf-graphite); font-size:.875rem; }
.visual-convergence .screen-close { font:inherit; min-height:44px; padding:8px 12px; background:var(--nf-ink); color:var(--nf-paper); border:1px solid var(--nf-ink); cursor:pointer; }
.visual-convergence .screen-pan { overflow:auto; max-height:65dvh; background:var(--nf-ink); }
.visual-convergence .screen-pan img { width:max(100%,900px); max-width:none; height:auto; }
.visual-convergence .screen-dialog[open] { animation:nf-screen-open 400ms var(--motion-ease); }
@keyframes nf-screen-open { from {clip-path:inset(12% 18%)} to {clip-path:inset(0)} }
.visual-convergence .contact-heading { position:relative; padding-top:32px; border-top:1px solid var(--nf-ink); }
.visual-convergence .contact-heading::before { content:''; position:absolute; top:-2px; left:0; width:56px; height:4px; background:var(--nf-signal); }
.visual-convergence .contact-heading h2 { max-width:100%; }
.visual-convergence [hidden] { display:none !important; }

@media (hover:hover) and (pointer:fine) {
 .visual-convergence .product-screen:hover .screen-landscape { transform:none; }
 .visual-convergence .product-screen:hover .screen-portrait { transform:translate(120%,0); }
}
/* Scroll timelines affect only visible image crops. Unsupported browsers keep the composed still. */
@supports (animation-timeline:view()) {
 @media (prefers-reduced-motion:no-preference) {
  .motion-ready .visual-convergence .creative-visual { view-timeline:--creative-frame block; }
  .motion-ready .visual-convergence .visual-surface { animation:nf-editorial-open linear both; animation-timeline:--creative-frame; animation-range:entry 0% entry 85%; }
  .motion-ready .visual-convergence .contact-heading::before { animation:nf-contact-resolve linear both; animation-timeline:view(); animation-range:entry 0% cover 45%; }
 }
}
@keyframes nf-editorial-open { from {clip-path:inset(0 17% 0 17%)} to {clip-path:inset(0)} }
@keyframes nf-contact-resolve { from {transform:scaleX(1); transform-origin:left} to {transform:scaleX(8); transform-origin:left} }
@media (min-width:768px) and (max-width:1199px) {
 .visual-convergence .creative-section .section-title-wrap { grid-template-columns:1fr; gap:20px; }
 .visual-convergence .creative-section .section-intro { max-width:65ch; }
 .visual-convergence .creative-visual .visual-frame { height:380px; }
 .visual-convergence .owned-products { grid-template-columns:7fr 5fr; gap:32px; }
 .visual-convergence .screen-stage,.visual-convergence .product-development { height:300px; min-height:300px; }
 .visual-convergence .screen-landscape { width:125%; top:45px; }
 .visual-convergence .screen-portrait { width:29%; }
}
@media (max-width:767px) {
 .visual-convergence .creative-section .section-title-wrap { display:block; }
 .visual-convergence .creative-section .section-title { font-size:2.75rem; margin-bottom:24px; }
 .visual-convergence .creative-composition:has(.creative-visual) .creative-offers { display:grid; grid-template-columns:1fr; gap:24px; margin-top:24px; }
 .visual-convergence .creative-composition:has(.creative-visual) .creative-offers article { padding-left:0; }
 .visual-convergence .creative-offers .service-index { position:static; margin-bottom:12px; }
 .visual-convergence .creative-visual .visual-frame { height:340px; }
 .visual-convergence .visual-primary { clip-path:inset(0); }
 .visual-convergence .visual-primary img { object-fit:cover; object-position:50% 50%; }
 .visual-convergence [data-composition='object'] .visual-primary img { object-fit:cover; object-position:50% 50%; }
 .visual-convergence [data-composition='object'] .visual-secondary { display:none; }
 .visual-convergence .visual-frame-textile .visual-primary { clip-path:inset(0 30% 0 0); }
 .visual-convergence .visual-frame-textile .visual-secondary { clip-path:inset(0 0 0 73%); }
 .visual-convergence .visual-tertiary { display:none; }
 .visual-convergence .frame-index { top:12px; left:12px; font-size:.6875rem; }
 .visual-convergence .frame-control { bottom:12px; right:12px; font-size:.875rem; }
 .visual-convergence .reference-caption { display:block; margin-top:12px; }
 .visual-convergence .reference-caption > span { display:block; }
 .visual-convergence .reference-caption a { font-size:.8125rem; }
 .visual-convergence .method-transform { grid-template-columns:1fr; gap:8px; padding:20px 0; margin-bottom:24px; }
 .visual-convergence .method-readout { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; }
 .visual-convergence .method-readout p { order:-1; flex-basis:100%; margin:0; }
 .visual-convergence .method-readout br { display:none; }
 .visual-convergence .method-diagram { height:120px; }
 .visual-convergence .method-path li,.visual-convergence .method-path li:nth-child(2n) { padding-bottom:16px; }
 .visual-convergence .method-path h3 { margin-bottom:0; }
 .visual-convergence .method-path h3 button { min-height:44px; }
 .visual-convergence .owned-products { grid-template-columns:1fr; }
 .visual-convergence .screen-stage { height:250px; }
 .visual-convergence .screen-landscape { width:135%; top:24px; left:3%; }
 .visual-convergence .screen-portrait { width:32%; right:5%; top:20px; }
 .visual-convergence .product-development { min-height:220px; padding:20px; }
 .visual-convergence .product-development img { width:72px; height:72px; }
 .visual-convergence .product-development figcaption { margin:16px 0 0; }
 .visual-convergence .product-development figcaption span { font-size:1.5rem; }
 .visual-convergence .screen-dialog { padding:16px; }
 .visual-convergence .screen-dialog-head { align-items:flex-start; }
 .visual-convergence .screen-dialog h2 { font-size:1.125rem; }
 .visual-convergence .screen-close { font-size:.875rem; flex-shrink:0; }
}
@media (prefers-reduced-motion:reduce) {
 .visual-convergence .creative-visual { clip-path:none; }
 .visual-convergence .screen-landscape { transform:none; }
 .visual-convergence .screen-portrait { transform:none; }
 .visual-convergence .contact-heading::before { transform:none; }
}

/* Capability convergence: contained entirely within #studio. */
.visual-convergence #studio .section-head { display:block; margin-bottom:32px; }
.visual-convergence #studio .section-label { margin-bottom:24px; }
.visual-convergence #studio .section-title-wrap { display:grid; grid-template-columns:1.1fr 1fr; gap:64px; align-items:end; }
.visual-convergence #studio .section-title { font-size:clamp(2.375rem,4.1vw,3.75rem); line-height:1.06; margin:0; }
.visual-convergence #studio .section-intro { margin:0; max-width:47ch; }
.visual-convergence #studio .fit-inline { margin:0 0 40px; padding:24px 0; gap:64px; grid-template-columns:1.1fr 1fr; border-bottom:1px solid var(--nf-border); }
.visual-convergence #studio .fit-inline p { padding-left:20px; border-left:3px solid var(--nf-signal); }
.visual-convergence #studio .fit-inline strong { margin-bottom:6px; }
.visual-convergence #studio .capability-track { display:grid; grid-template-columns:1fr 1.1fr; gap:64px; align-items:start; }
.visual-convergence #studio .capability-stage { position:sticky; top:120px; min-width:0; background:var(--nf-ink); color:var(--nf-paper); }
.visual-convergence #studio .capability-stage-head { display:flex; justify-content:space-between; padding:20px 24px; font:.75rem/1.5 var(--font-mono); border-bottom:1px solid var(--nf-border-dark); }
.visual-convergence #studio .capability-scenes { position:relative; }
.visual-convergence #studio .capability-track:not(.capability-enhanced) .capability-scene:not(:first-child) { display:none; }
.visual-convergence #studio .capability-scene { position:relative; height:340px; overflow:hidden; }
.visual-convergence #studio .capability-scene + .capability-scene { border-top:1px solid var(--nf-border-dark); }
.visual-convergence #studio .capability-enhanced .capability-scenes { height:340px; }
.visual-convergence #studio .capability-enhanced .capability-scene { position:absolute; inset:0; border:0; visibility:hidden; background:var(--nf-ink); transition:visibility 640ms; }
.visual-convergence #studio [data-lane='presence'] .scene-presence,
.visual-convergence #studio [data-lane='creative'] .scene-creative,
.visual-convergence #studio [data-lane='automate'] .scene-automate { visibility:visible; z-index:1; }
.visual-convergence #studio .capability-caption { position:absolute; inset:auto 24px 20px; font:.75rem/1.5 var(--font-mono); color:var(--nf-paper); margin:0; }
.visual-convergence #studio .presence-type { position:absolute; inset:32px 24px 66px; border-left:1px solid var(--nf-signal); padding:12px 16px; }
.visual-convergence #studio .presence-type>span { display:block; font-size:clamp(2rem,3.5vw,3.25rem); font-weight:600; line-height:1.05; letter-spacing:-.035em; transform:translateX(28%); transition:transform 720ms var(--motion-ease); }
.visual-convergence #studio .presence-type>span:nth-child(2) { transform:translateX(12%); transition-delay:80ms; }
.visual-convergence #studio [data-lane='presence'] .presence-type>span { transform:translateX(0); }
.visual-convergence #studio .presence-type i { display:block; width:30%; height:8px; margin:24px 0; background:var(--nf-signal); transform-origin:left; transition:width 720ms var(--motion-ease); }
.visual-convergence #studio [data-lane='presence'] .presence-type i { width:72%; }
.visual-convergence #studio .presence-type small { font:.75rem/1.5 var(--font-mono); }
.visual-convergence #studio .capability-art { position:absolute; inset:0 0 54px; background:var(--nf-signal); color:var(--nf-ink); overflow:hidden; }
.visual-convergence #studio .capability-art>span { position:absolute; top:24px; left:24px; font-size:3.25rem; line-height:1; font-weight:600; }
.visual-convergence #studio .capability-reference { position:absolute; inset:0; margin:0; }
.visual-convergence #studio .capability-reference img { width:100%; height:100%; object-fit:cover; object-position:38% 50%; transform:scale(1.35); clip-path:inset(0 0 100%); transition:transform 900ms var(--motion-ease),clip-path 640ms var(--motion-ease); }
.visual-convergence #studio [data-lane='creative'] .capability-reference img { transform:scale(1); clip-path:inset(0); }
.visual-convergence #studio .capability-reference figcaption { position:absolute; bottom:0; left:0; right:0; padding:8px 12px; background:var(--nf-paper); color:var(--nf-ink); font:.75rem/1.5 var(--font-mono); }
.visual-convergence #studio .handoff-diagram { position:absolute; inset:32px 24px 66px; display:grid; grid-template-columns:1fr 20px 1fr 20px 1fr; align-content:start; align-items:center; }
.visual-convergence #studio .handoff-diagram>span { font:.75rem/1.5 var(--font-mono); padding:14px 0; text-align:center; border:1px solid var(--nf-border-dark); transform:translateY(24px); transition:transform 720ms var(--motion-ease),border-color 720ms; }
.visual-convergence #studio .handoff-diagram>span:nth-of-type(2) { transition-delay:100ms; }
.visual-convergence #studio .handoff-diagram>span:nth-of-type(3) { transition-delay:200ms; }
.visual-convergence #studio .handoff-diagram>i { height:2px; background:var(--nf-signal); transform:scaleX(0); transform-origin:left; transition:transform 640ms 180ms var(--motion-ease); }
.visual-convergence #studio [data-lane='automate'] .handoff-diagram>span { transform:none; border-color:var(--nf-signal); }
.visual-convergence #studio [data-lane='automate'] .handoff-diagram>i { transform:scaleX(1); }
.visual-convergence #studio .handoff-diagram>b { grid-column:1/-1; font-size:clamp(2rem,3.5vw,3.25rem); line-height:1.05; letter-spacing:-.035em; font-weight:600; margin-top:32px; }
.visual-convergence #studio .capability-progress { display:flex; gap:4px; padding:0 24px 20px; }
.visual-convergence #studio .capability-progress i { height:3px; flex:1; background:var(--nf-border-dark); transition:background 400ms,flex 640ms var(--motion-ease); }
.visual-convergence #studio [data-lane='presence'] .capability-progress i:nth-child(1),
.visual-convergence #studio [data-lane='creative'] .capability-progress i:nth-child(2),
.visual-convergence #studio [data-lane='automate'] .capability-progress i:nth-child(3) { background:var(--nf-signal); flex:2; }
.visual-convergence #studio .service-major-list { display:block; }
.visual-convergence #studio .service-major { display:grid; grid-template-columns:32px 1fr; gap:12px 16px; padding:24px 0 32px; border-top:1px solid var(--nf-ink); border-bottom:0; min-height:238px; }
.visual-convergence #studio .service-index { grid-column:1; grid-row:1; margin:12px 0 0; }
.visual-convergence #studio .service-name-wrap { grid-column:2; grid-row:1; min-height:0; }
.visual-convergence #studio .service-name-wrap h3 { font-size:clamp(1.875rem,2.6vw,2.5rem); line-height:1.1; }
.visual-convergence #studio .service-name-wrap p { margin-top:4px; }
.visual-convergence #studio .service-copy { grid-column:2; max-width:46ch; }
.visual-convergence #studio .service-link { grid-column:2; justify-self:start; margin:0; }
.visual-convergence #studio .capability-select { font:inherit; letter-spacing:inherit; color:inherit; background:none; padding:4px 24px 4px 0; text-align:left; border:0; cursor:pointer; position:relative; }
.visual-convergence #studio .capability-select::after { content:'↗'; position:absolute; right:0; top:8px; font-size:1rem; transform:rotate(45deg); transition:transform 640ms var(--motion-ease); }
.visual-convergence #studio .capability-select[aria-pressed='true']::after { transform:rotate(0); }
.visual-convergence #studio .service-major[data-active='true']::before { transform:scaleX(1); }
@media (max-width:1199px) {
 .visual-convergence #studio .section-title-wrap,.visual-convergence #studio .fit-inline,.visual-convergence #studio .capability-track { gap:32px; }
 .visual-convergence #studio .capability-track { grid-template-columns:1fr 1.15fr; }
 .visual-convergence #studio .handoff-diagram { inset-inline:16px; grid-template-columns:1fr 12px 1fr 12px 1fr; }
 .visual-convergence #studio .service-major { min-height:270px; }
}
@media (max-width:767px) {
 .visual-convergence #studio .section-title-wrap { display:block; }
 .visual-convergence #studio .section-title { margin-bottom:24px; }
 .visual-convergence #studio .fit-inline { grid-template-columns:1fr; gap:20px; margin-bottom:24px; }
 .visual-convergence #studio .capability-track { display:block; }
 .visual-convergence #studio .capability-stage { top:84px; z-index:3; margin-bottom:24px; }
 .visual-convergence #studio .capability-stage-head { padding:10px 16px; }
 .visual-convergence #studio .capability-scene,.visual-convergence #studio .capability-enhanced .capability-scenes { height:190px; }
 .visual-convergence #studio .presence-type { inset:16px 16px 44px; padding:0 12px; }
 .visual-convergence #studio .presence-type>span { font-size:2rem; }
 .visual-convergence #studio .presence-type i { margin:12px 0; height:5px; }
 .visual-convergence #studio .presence-type small { display:none; }
 .visual-convergence #studio .capability-caption { inset:auto 16px 12px; }
 .visual-convergence #studio .capability-progress { padding:0 16px 12px; }
 .visual-convergence #studio .capability-art { bottom:38px; }
 .visual-convergence #studio .capability-art>span { font-size:2.5rem; top:16px; left:16px; }
 .visual-convergence #studio .capability-reference figcaption { font-size:.75rem; padding:4px 8px; }
 .visual-convergence #studio .handoff-diagram { inset:16px 16px 44px; }
 .visual-convergence #studio .handoff-diagram>span { padding:6px 0; }
 .visual-convergence #studio .handoff-diagram>b { font-size:1.75rem; margin-top:12px; }
 .visual-convergence #studio .handoff-diagram>b br { display:none; }
 .visual-convergence #studio .service-major { min-height:0; padding:20px 0 28px; scroll-margin-top:356px; }
 .visual-convergence #studio .service-copy,.visual-convergence #studio .service-link { grid-column:1/-1; }
 .visual-convergence #studio .service-name-wrap h3 { font-size:1.875rem; }
 .visual-convergence #studio .capability-select { scroll-margin-top:356px; }
}
@media (max-height:650px) {
 .visual-convergence #studio .capability-stage { position:relative; top:auto; }
}
@media (prefers-reduced-motion:reduce) {
 .visual-convergence #studio .capability-stage *, .visual-convergence #studio .service-major::before,
 .visual-convergence #studio .capability-select::after { transition:none !important; animation:none !important; }
}

/* Hero: one camera, three independently resolving planes. No runtime script.
   Material belongs to the carriers; the original signet is rendered intact. */
.visual-convergence .hero-spatial { display:block; min-height:0; padding:0; position:relative; border-bottom:1px solid var(--nf-border); }
.visual-convergence .hero-spatial .hero-grid { display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:24px; padding-block:56px; min-height:min(800px,calc(100svh - 96px)); position:relative; }
.visual-convergence .hero-spatial .hero-copy { grid-column:1; position:relative; z-index:2; }
.visual-convergence .hero-spatial h1 { font-size:clamp(3.5rem,6.5vw,5.875rem); line-height:1.02; letter-spacing:-.045em; max-width:none; text-wrap:initial; }
.visual-convergence .hero-spatial h1 span { display:block; }
.visual-convergence .hero-spatial h1 span:last-child { position:relative; width:fit-content; }
.visual-convergence .hero-spatial h1 span:last-child::after { content:''; position:absolute; left:0; right:0; bottom:-10px; height:4px; background:var(--nf-signal); transform-origin:left; }
.visual-convergence .hero-spatial .hero-lead { font-size:1.25rem; line-height:1.5; margin-top:36px; max-width:42ch; }
.visual-convergence .hero-spatial .hero-principle { margin-top:20px; font-size:.75rem; }
.visual-convergence .hero-spatial .hero-actions { margin-top:28px; gap:20px; }
.visual-convergence .hero-spatial .hero-signal { grid-column:2; align-self:center; margin:0; padding:0; background:transparent; color:var(--nf-ink); min-width:0; position:relative; }
.visual-convergence .hero-spatial .constraint-label { color:var(--nf-graphite); margin:0 0 24px; font:.75rem/1.5 var(--font-mono); display:flex; align-items:center; gap:16px; }
.visual-convergence .hero-spatial .constraint-label::before { content:''; height:1px; background:var(--nf-signal); flex:1; transform-origin:left; }
.visual-convergence .hero-spatial .hero-lanes { justify-content:space-between; margin:0; padding-top:16px; border-top:1px solid var(--nf-border); color:var(--nf-ink); font-size:.75rem; letter-spacing:0; }
.visual-convergence .hero-depth-field { height:480px; position:relative; perspective:1100px; perspective-origin:48% 42%; }
.visual-convergence .hero-object { --camera-x:20deg; --camera-y:-26deg; --camera-z:-8deg; --back-x:-34px; --back-y:12px; --back-z:-72px; --front-x:34px; --front-y:-12px; --front-z:88px; position:absolute; width:48%; aspect-ratio:1; left:50%; top:49%; translate:-50% -50%; transform-style:preserve-3d; transform:rotateX(8deg) rotateY(-10deg); }
.visual-convergence .hero-plane { position:absolute; width:100%; aspect-ratio:1; inset:0; transform-origin:50% 50%; backface-visibility:hidden; }
.visual-convergence .hero-plane-back { background:var(--nf-signal); border:1px solid var(--nf-signal); box-shadow:1px 1px 0 var(--nf-ink),2px 2px 0 var(--nf-ink); transform:translate3d(-10px,12px,-16px); }
.visual-convergence .hero-plane-subject { background:linear-gradient(135deg,var(--nf-elevated),var(--nf-ink) 72%); border:1px solid var(--nf-border-dark); box-shadow:1px 1px 0 var(--nf-border-dark),2px 2px 0 var(--nf-ink),3px 3px 0 var(--nf-ink),18px 26px 32px rgb(14 15 17 / .17); display:grid; place-items:center; transform:translateZ(0); }
.visual-convergence .hero-plane-subject::before { content:''; position:absolute; inset:5px; border:1px solid rgb(245 243 237 / .1); pointer-events:none; }
.visual-convergence .hero-plane-subject img { width:62%; height:auto; display:block; }
.visual-convergence .hero-plane-front { width:110%; inset:-5%; border:1px solid var(--nf-graphite); background:transparent; transform:translateZ(22px); }
.visual-convergence .hero-plane-front::before,.visual-convergence .hero-plane-front::after { content:''; position:absolute; width:16px; height:16px; border-color:var(--nf-signal); border-style:solid; }
.visual-convergence .hero-plane-front::before { left:-1px; top:-1px; border-width:2px 0 0 2px; }
.visual-convergence .hero-plane-front::after { right:-1px; bottom:-1px; border-width:0 2px 2px 0; }
/* Same opening and resolution. Distinct weights, never time-delayed state:
   frame 78%, face 82%, camera 88%, rear 94%. Reverse scroll retraces exactly. */
.visual-convergence .hero-object { --card-tilt:1.2deg; --card-roll:.6deg; --card-depth:2px; --frame-drift:2px; --frame-counter:1deg; }
@keyframes nf-hero-camera {
 0% { transform:rotateX(var(--camera-x)) rotateY(var(--camera-y)) rotateZ(var(--camera-z)); }
 88%,100% { transform:rotateX(8deg) rotateY(-10deg) rotateZ(0deg); }
}
@keyframes nf-hero-back {
 0%,8% { transform:translate3d(var(--back-x),var(--back-y),var(--back-z)) rotateZ(-10deg); }
 94%,100% { transform:translate3d(-10px,12px,-16px) rotateZ(0deg); }
}
@keyframes nf-hero-subject {
 0% { transform:translate3d(2px,-4px,0) rotateY(0deg) rotateZ(0deg); }
 42% { transform:translate3d(1px,-3px,var(--card-depth)) rotateY(var(--card-tilt)) rotateZ(var(--card-roll)); }
 82%,100% { transform:translate3d(0,0,0) rotateY(0deg) rotateZ(0deg); }
}
@keyframes nf-hero-front {
 0% { transform:translate3d(var(--front-x),var(--front-y),var(--front-z)) rotateZ(5deg); }
 28% { transform:translate3d(calc(var(--front-x) + var(--frame-drift)),var(--front-y),calc(var(--front-z) - 8px)) rotateZ(calc(5deg + var(--frame-counter))); }
 78%,100% { transform:translate3d(0,0,22px) rotateZ(0deg); }
}
@keyframes nf-hero-edge-light { from {opacity:.68} 82%,to {opacity:1} }
@keyframes nf-hero-underline { from {transform:scaleX(.28)} 86%,to {transform:scaleX(1)} }
@keyframes nf-hero-rule { from {transform:scaleX(.3)} 86%,to {transform:scaleX(1)} }
@supports (animation-timeline:scroll()) and (animation-range:0px 280px) {
 @media (prefers-reduced-motion:no-preference) {
  .visual-convergence .hero-spatial :is(.hero-object,.hero-plane) { animation-duration:1s; animation-timing-function:var(--motion-ease); animation-fill-mode:both; animation-timeline:scroll(root block); animation-range:0px 280px; }
  .visual-convergence .hero-spatial .hero-object { animation-name:nf-hero-camera; animation-timing-function:cubic-bezier(.32,.05,.3,1); }
  .visual-convergence .hero-spatial .hero-plane-back { animation-name:nf-hero-back; animation-timing-function:cubic-bezier(.42,0,.3,1); }
  .visual-convergence .hero-spatial .hero-plane-subject { animation-name:nf-hero-subject; animation-timing-function:cubic-bezier(.32,.05,.3,1); }
  .visual-convergence .hero-spatial .hero-plane-front { animation-name:nf-hero-front; animation-timing-function:cubic-bezier(.25,.1,.3,1); }
  .visual-convergence .hero-spatial .hero-plane-subject::before { animation:nf-hero-edge-light linear both; animation-timeline:scroll(root block); animation-range:0px 280px; }
  .visual-convergence .hero-spatial h1 span:last-child::after { animation:nf-hero-underline linear both; animation-timeline:scroll(root block); animation-range:0px 280px; }
  .visual-convergence .hero-spatial .constraint-label::before { animation:nf-hero-rule linear both; animation-timeline:scroll(root block); animation-range:0px 280px; }
 }
 @media (min-width:768px) and (min-height:760px) and (prefers-reduced-motion:no-preference) {
  .visual-convergence .hero-spatial { min-height:calc(100svh + 160px); }
  .visual-convergence .hero-spatial .hero-grid { position:sticky; top:96px; }
 }
 @media (max-width:767px) and (prefers-reduced-motion:no-preference) {
  .visual-convergence .hero-spatial :is(.hero-object,.hero-plane),.visual-convergence .hero-spatial h1 span:last-child::after,.visual-convergence .hero-spatial .constraint-label::before,.visual-convergence .hero-spatial .hero-plane-subject::before { animation-range:0px 160px; }
 }
}
@media (min-width:768px) and (max-width:1199px) {
 .visual-convergence .hero-spatial .hero-grid { gap:24px; grid-template-columns:1.08fr 1fr; }
 .visual-convergence .hero-spatial h1 { font-size:clamp(3rem,5.4vw,4rem); }
 .visual-convergence .hero-depth-field { height:380px; }
 .visual-convergence .hero-spatial .hero-lead { font-size:1.125rem; }
 .visual-convergence .hero-object { width:48%; }
}
@media (max-width:767px) {
 .visual-convergence .hero-spatial .hero-grid { display:flex; flex-direction:column; align-items:stretch; gap:20px; padding-block:28px; min-height:0; }
 .visual-convergence .hero-spatial .hero-copy { display:contents; }
 .visual-convergence .hero-spatial .eyebrow { order:0; margin:0; font-size:.6875rem; }
 .visual-convergence .hero-spatial h1 { order:1; font-size:clamp(2.5rem,12vw,3.375rem); line-height:1.03; }
 .visual-convergence .hero-spatial .hero-signal { order:2; padding:0; align-self:stretch; width:100%; margin-top:8px; }
 .visual-convergence .hero-spatial .hero-lead { order:3; font-size:1.125rem; line-height:1.5; margin:0; }
 .visual-convergence .hero-spatial .hero-actions { order:4; margin:0; gap:12px; }
 .visual-convergence .hero-spatial .hero-principle { order:5; margin:0; }
 .visual-convergence .hero-depth-field { height:208px; perspective:850px; perspective-origin:50% 42%; }
 .visual-convergence .hero-spatial .constraint-label { font-size:.6875rem; gap:16px; margin-bottom:0; }
 .visual-convergence .hero-object { --camera-x:14deg; --camera-y:-18deg; --camera-z:-5deg; --back-x:-16px; --back-y:8px; --back-z:-24px; --front-x:12px; --front-y:-4px; --front-z:28px; width:132px; top:50%; }
 .visual-convergence .hero-object { --card-tilt:.6deg; --card-roll:.3deg; --card-depth:1px; --frame-drift:1px; --frame-counter:.5deg; }
 .visual-convergence .hero-spatial .hero-lanes { padding-top:10px; font-size:.6875rem; }
 .visual-convergence .hero-plane-subject { box-shadow:1px 1px 0 var(--nf-border-dark),2px 2px 0 var(--nf-ink),10px 14px 20px rgb(14 15 17 / .14); }
 .visual-convergence .hero-plane-front::before,.visual-convergence .hero-plane-front::after { width:10px; height:10px; }
}
@media (max-width:767px) and (max-height:700px) {
 .visual-convergence .hero-spatial .hero-grid { gap:16px; padding-block:24px; }
 .visual-convergence .hero-spatial .hero-actions { order:2; }
 .visual-convergence .hero-spatial .hero-signal { order:3; margin:0; }
 .visual-convergence .hero-spatial .hero-lead { order:4; }
 .visual-convergence .hero-depth-field { height:184px; }
 .visual-convergence .hero-object { width:112px; }
}
@media (prefers-reduced-motion:reduce) {
 .visual-convergence .hero-spatial :is(.hero-object,.hero-plane),.visual-convergence .hero-spatial h1 span:last-child::after,.visual-convergence .hero-spatial .constraint-label::before,.visual-convergence .hero-spatial .hero-plane-subject::before { animation:none !important; }
}

/* Original Creative studies: registered image planes, native state selection.
   Only the mask moves; the subject remains anchored through the transformation. */
.visual-convergence .transformation-module { position:relative; }
.visual-convergence .transformation-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px 28px; padding-block:0 18px; }
.visual-convergence .transformation-heading > span { font:.75rem/1.5 var(--font-mono); letter-spacing:.04em; color:var(--nf-signal); }
.visual-convergence .transformation-heading strong { font-size:1.25rem; font-weight:500; line-height:1.3; color:var(--nf-paper); }
.visual-convergence .transformation-controls { display:flex; gap:0; margin:0; padding:0; border:0; border-block:1px solid var(--nf-border-dark); }
.visual-convergence .transformation-controls legend { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.visual-convergence .transformation-controls label { flex:1; position:relative; cursor:pointer; }
.visual-convergence .transformation-controls input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.visual-convergence .transformation-controls label > span { display:block; min-height:48px; padding:14px 16px; font:.8125rem/1.5 var(--font-mono); text-align:center; color:var(--nf-paper); border-bottom:2px solid transparent; }
.visual-convergence .transformation-controls input:checked + span { color:var(--nf-ink); background:var(--nf-paper); border-bottom-color:var(--nf-signal); }
.visual-convergence .transformation-controls label:hover span { border-bottom-color:var(--nf-signal); }
.visual-convergence .transformation-controls input:focus-visible + span { outline:2px solid var(--nf-signal); outline-offset:-5px; }
.visual-convergence .transformation-stage { position:relative; height:clamp(380px,39vw,540px); overflow:hidden; isolation:isolate; background:var(--nf-ink); }
.visual-convergence .transformation-stage :is(.transformation-raw,.transformation-finish) { position:absolute; inset:0; }
.visual-convergence .transformation-stage img { width:100%; height:100%; object-fit:cover; object-position:50% 50%; }
.visual-convergence .transformation-finish { clip-path:inset(0 0 0 50%); transition:clip-path 900ms var(--motion-ease); }
.visual-convergence .transformation-seam { position:absolute; inset:0; pointer-events:none; transform:translateX(50%); transition:transform 900ms var(--motion-ease),opacity 300ms linear; }
.visual-convergence .transformation-seam::before { content:''; position:absolute; inset:0 auto 0 0; width:1px; background:var(--nf-signal); }
.visual-convergence .transformation-hybrid .transformation-finish { clip-path:inset(50% 0 0 0); }
.visual-convergence .transformation-hybrid .transformation-seam { transform:translateY(50%); }
.visual-convergence .transformation-hybrid .transformation-seam::before { inset:0 0 auto; width:auto; height:1px; }
.visual-convergence .transformation-state { position:absolute; inset:16px 16px auto; display:flex; justify-content:space-between; pointer-events:none; }
.visual-convergence .transformation-state span { padding:5px 9px; background:var(--nf-ink); color:var(--nf-paper); font:.6875rem/1.5 var(--font-mono); text-transform:uppercase; letter-spacing:.05em; }
.visual-convergence .transformation-hybrid .transformation-state { inset:16px; flex-direction:column; align-items:flex-start; }
.visual-convergence .transformation-module:has(input[value='before']:checked) .transformation-finish { animation:none; clip-path:inset(0 0 0 100%); }
.visual-convergence .transformation-module:has(input[value='final']:checked) .transformation-finish { animation:none; clip-path:inset(0); }
.visual-convergence .transformation-module:has(input[value='before']:checked) .transformation-seam { animation:none; transform:translateX(100%); opacity:0; }
.visual-convergence .transformation-module:has(input[value='final']:checked) .transformation-seam { animation:none; transform:translateX(0); opacity:0; }
.visual-convergence .transformation-hybrid:has(input[value='before']:checked) .transformation-finish { clip-path:inset(100% 0 0 0); }
.visual-convergence .transformation-hybrid:has(input[value='before']:checked) .transformation-seam { transform:translateY(100%); }
.visual-convergence .transformation-hybrid:has(input[value='final']:checked) .transformation-seam { transform:translateY(0); }
.visual-convergence .transformation-module:has(input[value='before']:checked) .transformation-state span:last-child,
.visual-convergence .transformation-module:has(input[value='final']:checked) .transformation-state span:first-child { visibility:hidden; }
.visual-convergence .transformation-credit { margin:10px 0 0; font:.6875rem/1.6 var(--font-mono); color:var(--nf-paper); opacity:.72; }
/* Existing image-error enhancement removes a missing second image. Never show
   an incomplete comparison or label the remaining raw study as the finish. */
.visual-convergence .transformation-module:not(:has(.transformation-finish img)) { display:none; }
@supports (animation-timeline:view()) {
 @media (prefers-reduced-motion:no-preference) {
  .visual-convergence .creative-visual.transformation-module { view-timeline:--nf-study block; }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-finish { animation:nf-study-material linear both; animation-timeline:--nf-study; animation-range:cover 20% cover 65%; }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-seam { animation:nf-study-seam linear both; animation-timeline:--nf-study; animation-range:cover 20% cover 65%; }
  .visual-convergence .transformation-hybrid:has(input[value='compare']:checked) .transformation-finish { animation-name:nf-study-clay; }
  .visual-convergence .transformation-hybrid:has(input[value='compare']:checked) .transformation-seam { animation-name:nf-study-clay-seam; }
 }
}
@keyframes nf-study-material { from {clip-path:inset(0 0 0 95%)} to {clip-path:inset(0 0 0 5%)} }
@keyframes nf-study-seam { from {transform:translateX(95%)} to {transform:translateX(5%)} }
@keyframes nf-study-clay { from {clip-path:inset(95% 0 0 0)} to {clip-path:inset(5% 0 0 0)} }
@keyframes nf-study-clay-seam { from {transform:translateY(95%)} to {transform:translateY(5%)} }
@media (min-width:768px) and (max-width:1199px) {
 .visual-convergence .transformation-stage { height:420px; }
}
@media (max-width:767px) {
 .visual-convergence .transformation-heading { align-items:flex-start; flex-direction:column; gap:8px; padding-bottom:14px; }
 .visual-convergence .transformation-heading strong { font-size:1.125rem; }
 .visual-convergence .transformation-stage { height:340px; }
 .visual-convergence .transformation-controls label > span { padding-inline:4px; }
 .visual-convergence .transformation-finish,.visual-convergence .transformation-seam { transition-duration:600ms; }
 .visual-convergence .transformation-state { inset:12px 12px auto; }
 .visual-convergence .transformation-hybrid .transformation-state { inset:12px; }
}
@media (prefers-reduced-motion:reduce) {
 .visual-convergence .transformation-finish,.visual-convergence .transformation-seam { animation:none!important; transition:none; }
}

/* One owned product: preserve the established screen interaction, with a
   complete product story beside it instead of an empty second column. */
.visual-convergence .owned-products:has(> .owned-product:only-child) { grid-template-columns:1fr; }
.visual-convergence .owned-products:has(> .owned-product:only-child) .owned-product { grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr); gap:20px 48px; align-items:start; }
.visual-convergence .owned-products:has(> .owned-product:only-child) .product-screen { grid-column:1; grid-row:1 / span 3; }
.visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-icon { display:none; }
.visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-brand { grid-column:2; grid-row:1; align-self:end; }
.visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-copy { grid-column:2; grid-row:2; }
.visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-link { grid-column:2; grid-row:3; }
.visual-convergence .owned-products:has(> .owned-product:only-child) .screen-stage { height:340px; }
@media (min-width:768px) and (max-width:1199px) {
 .visual-convergence .owned-products:has(> .owned-product:only-child) .owned-product { grid-template-columns:minmax(0,1.3fr) minmax(260px,1fr); column-gap:32px; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .screen-stage { height:300px; }
}
@media (max-width:767px) {
 .visual-convergence .owned-products:has(> .owned-product:only-child) .owned-product { display:flex; flex-direction:column; gap:20px; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-brand { order:0; align-self:flex-start; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-copy { order:1; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .product-screen { order:2; width:100%; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-link { order:3; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .screen-stage { height:250px; }
}

/* Launch polish: shorter orientation, deliberate method and real product UI. */
.visual-convergence #studio .section-head { margin-bottom:24px; }
.visual-convergence #studio .fit-inline { padding-block:20px; margin-bottom:28px; }
.visual-convergence #studio .service-major { min-height:0; padding:20px 0 24px; gap:10px 16px; }
.visual-convergence #studio .service-copy strong { display:block; margin-bottom:6px; }
/* Resolve alignment on the compositor, without animating width or flex. */
.visual-convergence #studio .presence-type i { width:72%; transform:scaleX(.416667); transition:transform 720ms var(--motion-ease); }
.visual-convergence #studio [data-lane='presence'] .presence-type i { transform:scaleX(1); }
.visual-convergence #studio .capability-progress i { flex:1; transform:scaleY(.5); transition:background 240ms,transform 640ms var(--motion-ease); }
.visual-convergence #studio [data-lane] .capability-progress i { flex:1; }
.visual-convergence #studio [data-lane='presence'] .capability-progress i:nth-child(1),
.visual-convergence #studio [data-lane='creative'] .capability-progress i:nth-child(2),
.visual-convergence #studio [data-lane='automate'] .capability-progress i:nth-child(3) { transform:scaleY(1); }
.visual-convergence .method-description { min-block-size:2.5em; }
.visual-convergence .method-path li::before { transition:background 200ms; }
.visual-convergence .method-path li[data-active]::before { background:var(--nf-ink); }
.visual-convergence .method-path li[data-active='true']::before { background:var(--nf-signal); }
.visual-convergence .method-play { min-width:154px; text-align:left; }
.visual-convergence .method-play::after { content:'↗'; float:right; margin-left:12px; }
.visual-convergence .method-play[aria-pressed='true']::after { content:'Ⅱ'; }
.visual-convergence .method-diagram i { transform-origin:50% 100%; transition:transform 620ms var(--motion-ease),background 400ms var(--motion-ease); }
.visual-convergence [data-step] .method-diagram i { height:64px; }
.visual-convergence [data-step='0'] .method-diagram i { transform:translateY(var(--y)) rotate(var(--angle)) scaleY(.375); }
.visual-convergence [data-step='1'] .method-diagram i { transform:translateY(var(--y)) scaleY(.375); }
.visual-convergence [data-step='2'] .method-diagram i { transform:translateY(-20px) scaleY(.375); }
.visual-convergence [data-step='3'] .method-diagram i { transform:scaleY(calc(.375 + var(--i) * .125)); }
.visual-convergence [data-step='4'] .method-diagram i,
.visual-convergence [data-step='5'] .method-diagram i { transform:none; }

/* Actual VERSIQ runtime pixels take the place previously occupied by the icon. */
.versiq-theme .product-hero { padding-block:72px; }
.versiq-theme .product-hero-grid { grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:24px 56px; align-items:start; }
.versiq-theme .product-hero-heading { grid-column:1; grid-row:1; min-width:0; }
.versiq-theme .product-hero-copy { grid-column:1; grid-row:2; min-width:0; }
.versiq-theme .product-hero-logo { max-width:300px; margin:24px 0 28px; }
.versiq-theme .product-hero h1 { font-size:clamp(3rem,5vw,4.5rem); max-width:9ch; text-wrap:balance; }
.versiq-theme .product-lead { margin:0; max-width:36ch; }
.versiq-theme .product-actions { margin-top:24px; }
.versiq-hero-screen { grid-column:2; grid-row:1 / span 2; margin:0; min-width:0; align-self:center; }
.versiq-hero-screen a { display:block; padding:36px 0; border-block:1px solid #2B3039; background:#111318; text-underline-offset:4px; }
.versiq-hero-screen picture { display:block; }
.versiq-hero-screen img { display:block; width:100%; height:auto; }
.versiq-hero-screen a:focus-visible { outline:2px solid #28D7C5; outline-offset:5px; }
.versiq-hero-screen figcaption { display:flex; justify-content:space-between; gap:12px; color:#A7ADB6; font:.8125rem/1.5 var(--font-mono); margin-top:12px; }
.versiq-theme :is(.product-detail-section,.product-trust-section) { padding-block:72px; }
.versiq-theme .product-utility-section { padding-block:56px; }
@media (min-width:768px) and (max-width:1199px) {
 .versiq-theme .product-hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:24px 32px; }
}
@media (max-width:767px) {
 .visual-convergence #studio .section-title { margin-bottom:16px; }
 .visual-convergence #studio .section-label { margin-bottom:20px; }
 .visual-convergence #studio .fit-inline { gap:16px; padding-block:16px; margin-bottom:24px; }
 .visual-convergence #studio .capability-stage { margin-bottom:16px; }
 .visual-convergence #studio .capability-scene,
 .visual-convergence #studio .capability-enhanced .capability-scenes { height:166px; }
 .visual-convergence #studio .service-major { padding:16px 0 20px; gap:8px 12px; scroll-margin-top:320px; }
 .visual-convergence #studio .capability-select { scroll-margin-top:320px; }
 .visual-convergence #studio .service-copy strong { margin-bottom:4px; }
 .visual-convergence #studio .presence-type { inset-block:12px 42px; }
 .visual-convergence #studio .handoff-diagram { inset-block:12px 40px; }
 .visual-convergence #studio .handoff-diagram>b { margin-top:8px; }
 .visual-convergence .method-transform { padding-block:16px; margin-bottom:16px; }
 .visual-convergence .method-readout { gap:8px 12px; }
 .visual-convergence .method-description { min-block-size:2.5em; }
 .visual-convergence .method-diagram { height:104px; }
 .visual-convergence .method-path { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; padding:0; }
 .visual-convergence .method-path li,
 .visual-convergence .method-path li:nth-child(2n) { display:grid; grid-template-columns:20px minmax(0,1fr); align-content:start; gap:4px 8px; border-left:0; border-top:1px solid var(--nf-border); padding:12px 12px 20px 0; }
 .visual-convergence .method-path li::before { top:-4px; left:0; }
 .visual-convergence .method-path span { padding-top:12px; }
 .visual-convergence .method-path h3 { margin:0; }
 .visual-convergence .method-path p { grid-column:1/-1; }
 .visual-convergence .method-path li:last-child { padding-bottom:20px; }
 .visual-convergence .process-principle { margin-top:20px; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .product-screen { order:1; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-copy { order:2; }
 .visual-convergence .owned-products:has(> .owned-product:only-child) .screen-stage { height:230px; }
 .versiq-theme .product-hero { padding-block:32px 48px; }
 .versiq-theme .product-hero-grid { display:flex; flex-direction:column; gap:20px; }
 .versiq-theme .product-hero-heading,.versiq-theme .product-hero-copy,.versiq-hero-screen { width:100%; }
 .versiq-theme .product-hero-logo { max-width:240px; margin:16px 0 20px; }
 .versiq-theme .product-hero h1 { max-width:10ch; font-size:3rem; }
 .versiq-hero-screen a { padding:0; }
 .versiq-hero-screen img { height:300px; object-fit:cover; object-position:50% 12%; }
 .versiq-theme .product-lead { max-width:none; }
 .versiq-theme :is(.product-detail-section,.product-trust-section) { padding-block:48px; }
 .versiq-theme .product-utility-section { padding-block:40px; }
}
@media (max-width:359px) {
 .visual-convergence .method-path li,.visual-convergence .method-path li:nth-child(2n) { grid-template-columns:minmax(0,1fr); padding-right:16px; }
 .visual-convergence .method-path span { padding-top:0; }
}
@media (prefers-reduced-motion:reduce) {
 .visual-convergence #studio .presence-type i,
 .visual-convergence #studio .capability-progress i,
 .visual-convergence .method-diagram i { transition:none; }
 .visual-convergence .method-play { display:none; }
}
/* The existing eightfold contact-rule expansion must stay within its container. */
.visual-convergence .contact-heading::before { width:min(56px,12.5%); }

/* Studio finish: a calm, readable account of working together after Creative. */
.visual-convergence #process .section-head { display:block; }
.visual-convergence #process .section-label { margin-bottom:24px; }
.visual-convergence #process .section-title-wrap { display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:end; }
.visual-convergence #process .section-intro { margin:0; max-width:42ch; }
.visual-convergence .collaboration-path { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; margin:0; padding:0; }
.visual-convergence .collaboration-path li { position:relative; padding:28px 36px 0 0; border-top:1px solid var(--nf-border); min-width:0; }
.visual-convergence .collaboration-path li::before { content:''; position:absolute; left:0; top:-2px; width:40px; height:3px; background:var(--nf-signal); }
.visual-convergence .collaboration-path .collaboration-phases { margin:0 0 22px; font:.75rem/1.5 var(--font-mono); color:var(--nf-graphite); }
.visual-convergence .collaboration-path h3 { margin:0 0 18px; font-size:1.875rem; line-height:1.2; letter-spacing:-.025em; font-weight:600; }
.visual-convergence .collaboration-path li > p:last-child { margin:0; max-width:34ch; color:var(--nf-graphite); }
.visual-convergence .collaboration-note { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:12px 32px; margin-top:40px; padding-top:24px; border-top:1px solid var(--nf-border); }
.visual-convergence .collaboration-note p { margin:0; font-weight:600; }
.visual-convergence .collaboration-note a { min-height:44px; }
.visual-convergence .contact-copy > p.contact-person:not(.section-label) { margin:28px 0 0; padding-left:16px; border-left:3px solid var(--nf-signal); }
.visual-convergence .contact-person strong { display:block; color:var(--nf-ink); font-weight:600; }
.visual-convergence .contact-person span { display:block; font-size:.875rem; margin-top:4px; }
.visual-convergence .contact-copy .contact-email { margin-top:20px; }
.visual-convergence .field-help { margin:10px 0 0; color:var(--nf-graphite); font-size:.875rem; line-height:1.5; }
@media (min-width:768px) and (max-width:1199px) {
 .visual-convergence #process .section-title-wrap { gap:32px; }
 .visual-convergence .collaboration-path li { padding-right:24px; }
 .visual-convergence .collaboration-path h3 { font-size:1.625rem; }
}
@media (max-width:767px) {
 .visual-convergence #process .section-title-wrap { display:block; }
 .visual-convergence #process .section-intro { margin-top:24px; }
 .visual-convergence .collaboration-path { display:block; padding-left:2px; }
 .visual-convergence .collaboration-path li { display:grid; grid-template-columns:1fr; border-top:0; border-left:1px solid var(--nf-border); padding:0 0 28px 22px; }
 .visual-convergence .collaboration-path li::before { top:5px; left:-3px; width:5px; height:14px; }
 .visual-convergence .collaboration-path li:last-child { padding-bottom:0; }
 .visual-convergence .collaboration-path .collaboration-phases { margin-bottom:10px; }
 .visual-convergence .collaboration-path h3 { font-size:1.5rem; margin-bottom:12px; }
 .visual-convergence .collaboration-path h3 br { display:none; }
 .visual-convergence .collaboration-note { margin-top:28px; padding-top:20px; gap:8px; }
 .visual-convergence .contact-copy > p.contact-person:not(.section-label) { margin-top:24px; }
}
@media (max-width:767px) {
 .visual-convergence #studio :is(.capability-select,.service-link) { scroll-margin-bottom:24px; }
}

/* Motion 120: expose → compare → resolve. Camera and material are separate
   coordinates, so the two studies remain registered throughout the move. */
.visual-convergence .transformation-aperture,
.visual-convergence .transformation-camera { position:absolute; inset:0; }
.visual-convergence .transformation-aperture { clip-path:inset(0); overflow:hidden; transition:clip-path 520ms var(--motion-ease); }
.visual-convergence .transformation-camera { transform:none; transform-origin:50% 58%; transition:transform 520ms var(--motion-ease); }
.visual-convergence .transformation-finish,
.visual-convergence .transformation-seam { transition-duration:520ms; }
.visual-convergence .transformation-module { --exposure-side:21%; --exposure-top:7%; --exposure-scale:1.12; --exposure-drift:2%; }
.visual-convergence .transformation-hybrid { --exposure-side:4%; --exposure-top:25%; --exposure-scale:1.09; --exposure-drift:-2%; }

@keyframes nf-exposure-aperture {
 0%,20% { clip-path:inset(var(--exposure-top) var(--exposure-side)); animation-timing-function:cubic-bezier(.45,0,.2,1); }
 60%,100% { clip-path:inset(0); }
}
@keyframes nf-exposure-camera {
 0% { transform:translateY(var(--exposure-drift)) scale(var(--exposure-scale)); animation-timing-function:cubic-bezier(.2,.65,.3,1); }
 70%,100% { transform:translateY(0) scale(1); }
}
@keyframes nf-exposure-material {
 0%,18% { clip-path:inset(0 0 0 100%); animation-timing-function:cubic-bezier(.32,.1,.25,1); }
 46%,54% { clip-path:inset(0 0 0 50%); animation-timing-function:cubic-bezier(.32,.05,.25,1); }
 70%,100% { clip-path:inset(0 0 0 0%); }
}
@keyframes nf-exposure-seam {
 0%,18% { transform:translateX(100%); animation-timing-function:cubic-bezier(.32,.1,.25,1); }
 46%,54% { transform:translateX(50%); animation-timing-function:cubic-bezier(.32,.05,.25,1); }
 70%,100% { transform:translateX(0%); }
}
@keyframes nf-exposure-clay {
 0%,18% { clip-path:inset(100% 0 0 0); animation-timing-function:cubic-bezier(.32,.1,.25,1); }
 46%,54% { clip-path:inset(50% 0 0 0); animation-timing-function:cubic-bezier(.32,.05,.25,1); }
 70%,100% { clip-path:inset(0% 0 0 0); }
}
@keyframes nf-exposure-clay-seam {
 0%,18% { transform:translateY(100%); animation-timing-function:cubic-bezier(.32,.1,.25,1); }
 46%,54% { transform:translateY(50%); animation-timing-function:cubic-bezier(.32,.05,.25,1); }
 70%,100% { transform:translateY(0%); }
}
@keyframes nf-exposure-raw-label { 0%,54% {opacity:1} 70%,100% {opacity:0} }
@keyframes nf-exposure-final-label { 0%,20% {opacity:0} 40%,100% {opacity:1} }
@keyframes nf-exposure-seam-light { 0%,18%,72%,100% {opacity:0} 28%,60% {opacity:1} }

/* A second, quieter depth family: actual UI planes settle at different rates. */
.visual-convergence .product-screen { --ui-x:-5%; --ui-y:14%; --ui-yaw:13deg; --ui-pitch:4deg; --ui-scale:.94; --ui-portrait-x:-22%; --ui-portrait-y:38%; --ui-portrait-roll:-5deg; }
@keyframes nf-ui-landscape {
 0% { transform:translate(var(--ui-x),var(--ui-y)) rotateY(var(--ui-yaw)) rotateX(var(--ui-pitch)) scale(var(--ui-scale)); animation-timing-function:cubic-bezier(.2,.7,.3,1); }
 70%,100% { transform:translate(0,0) rotateY(0deg) rotateX(0deg) scale(1); }
}
@keyframes nf-ui-portrait {
 0%,8% { transform:translate(var(--ui-portrait-x),var(--ui-portrait-y)) rotate(var(--ui-portrait-roll)) scale(.94); animation-timing-function:cubic-bezier(.24,.62,.24,1); }
 88%,100% { transform:translate(0,10%) rotate(0deg) scale(1); }
}
@supports (animation-timeline:view()) {
 @media (prefers-reduced-motion:no-preference) {
  .visual-convergence .transformation-module:has(input[value='compare']:checked) :is(.transformation-aperture,.transformation-camera,.transformation-finish,.transformation-seam,.transformation-state span) {
   animation-duration:1s; animation-timing-function:linear; animation-fill-mode:both; animation-timeline:--nf-study; animation-range:cover 12% cover 76%; transition:none;
  }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-aperture { animation-name:nf-exposure-aperture; }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-camera { animation-name:nf-exposure-camera; }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-finish { animation-name:nf-exposure-material; }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-seam { animation-name:nf-exposure-seam,nf-exposure-seam-light; }
  .visual-convergence .transformation-hybrid:has(input[value='compare']:checked) .transformation-finish { animation-name:nf-exposure-clay; }
  .visual-convergence .transformation-hybrid:has(input[value='compare']:checked) .transformation-seam { animation-name:nf-exposure-clay-seam,nf-exposure-seam-light; }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-state span:first-child { animation-name:nf-exposure-raw-label; }
  .visual-convergence .transformation-module:has(input[value='compare']:checked) .transformation-state span:last-child { animation-name:nf-exposure-final-label; }
  .visual-convergence .product-screen { view-timeline:--nf-product block; }
  .visual-convergence .product-screen .screen-plane { animation:nf-ui-landscape linear both; animation-timeline:--nf-product; animation-range:cover 5% cover 66%; transition:none; }
  .visual-convergence .product-screen .screen-plane-portrait { animation-name:nf-ui-portrait; }
 }
}
/* Scroll depth belongs to the plane; pointer/focus movement belongs to its
   image. Neither input cancels the other, so release is equally continuous. */
.visual-convergence .screen-plane { position:absolute; transform-origin:center; }
.visual-convergence .screen-plane-landscape { width:94%; left:3%; top:24px; }
.visual-convergence .screen-plane-portrait { width:23%; right:5%; top:12px; }
.visual-convergence .screen-plane :is(.screen-landscape,.screen-portrait) { position:relative; display:block; width:100%; left:auto; right:auto; top:auto; transform:none; transition:transform 280ms var(--motion-ease); }
.visual-convergence .product-screen:focus-within .screen-portrait { transform:translateX(120%); }
@media (hover:hover) and (pointer:fine) {
 .visual-convergence .product-screen:hover .screen-portrait { transform:translateX(120%); }
}
@media (min-width:768px) and (max-width:1199px) {
 .visual-convergence .screen-plane-landscape { width:125%; top:45px; }
 .visual-convergence .screen-plane-portrait { width:29%; }
}
@media (max-width:767px) {
 .visual-convergence .transformation-module { --exposure-side:12%; --exposure-top:4%; --exposure-scale:1.045; --exposure-drift:1%; }
 .visual-convergence .transformation-hybrid { --exposure-side:2%; --exposure-top:16%; --exposure-scale:1.035; --exposure-drift:-1%; }
 .visual-convergence .transformation-aperture,.visual-convergence .transformation-camera,.visual-convergence .transformation-finish,.visual-convergence .transformation-seam { transition-duration:360ms; }
 .visual-convergence .screen-plane-landscape { width:135%; top:24px; }
 .visual-convergence .screen-plane-portrait { width:32%; top:20px; }
 .visual-convergence .product-screen { --ui-x:-2%; --ui-y:8%; --ui-yaw:3deg; --ui-pitch:0deg; --ui-scale:.98; --ui-portrait-x:8%; --ui-portrait-y:20%; --ui-portrait-roll:2deg; }
}
@media (prefers-reduced-motion:reduce) {
 .visual-convergence .transformation-aperture { clip-path:inset(0); }
 .visual-convergence .transformation-camera { transform:none; }
 .visual-convergence :is(.transformation-aperture,.transformation-camera,.transformation-state span,.screen-plane,.screen-landscape,.screen-portrait) { animation:none !important; transition:none !important; }
}

/* Hero signature: one frameless spatial typographic sculpture.
   Eight adjacent vertical vanes each clip exactly one eighth of the same word.
   Front faces are NF Signal with Ink NEED, backs are NF Ink with Paper FORM.
   Everything is driven by one number: --p (0 = NEED opening, 1 = resolved FORM).
   No panel, no frame, no media. */
/* The base .hero is a centering grid; with a runway that would push the
   composition half a runway down. The signature hero is a plain block, so the
   grid starts exactly where it always did. */
.visual-convergence .hero-signature { --runway:560px; --sticky-top:96px; min-height:0; padding:0; display:block; align-content:start; }
/* Native sticky runway: script adds the mode class only when motion is allowed,
   so reduced motion and no-JS keep a plain, unpinned hero. The composition is
   stationary for the runway, the transformation resolves before the release and
   then the page travels on. No wheel handling, no body lock. */
.visual-convergence .hero-signature.signature-pin-full { min-height:calc(var(--grid-h,640px) + var(--runway)); }
.visual-convergence .hero-signature.signature-pin-full .hero-grid { position:sticky; top:var(--sticky-top); }
/* The sticky track needs room BELOW it inside its containing block; a real
   spacer row gives the runway, padding alone did not extend the sticky range. */
.visual-convergence .hero-signature.signature-pin-visual .hero-grid { align-content:start; }
.visual-convergence .hero-signature.signature-pin-visual .hero-grid::after { content:""; display:block; height:var(--runway); order:3; }
.visual-convergence .hero-signature.signature-pin-visual .hero-motion-track { position:sticky; top:var(--sticky-top); }
.visual-convergence .hero-signature .hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1.06fr); gap:24px 56px; align-items:center; padding-block:44px; min-height:min(716px,calc(100svh - 96px)); position:relative; top:auto; }
.visual-convergence .hero-signature .hero-copy { grid-column:1; align-self:center; min-width:0; }
.visual-convergence .hero-signature h1 { margin:0; max-width:none; font-size:clamp(3.25rem,5.6vw,5.25rem); line-height:1.02; letter-spacing:-.045em; font-weight:600; text-wrap:initial; }
.visual-convergence .hero-signature h1 span { display:block; }
.visual-convergence .hero-signature h1 span:last-child { position:relative; width:fit-content; }
.visual-convergence .hero-signature h1 span:last-child::after { content:''; position:absolute; left:0; right:0; bottom:-10px; height:4px; background:var(--nf-signal); }
.visual-convergence .hero-signature .hero-lead { margin:34px 0 0; max-width:46ch; font-size:1.25rem; line-height:1.5; color:var(--nf-graphite); }
.visual-convergence .hero-signature .hero-lead strong { color:var(--nf-ink); font-weight:600; }
.visual-convergence .hero-signature .hero-actions { margin-top:30px; gap:18px; }
.visual-convergence .hero-signature .hero-signal { display:block; grid-column:2; width:100%; margin:0; padding:0; background:transparent; color:var(--nf-ink); min-width:0; position:relative; align-self:center; }

/* The sculpture. --p is the only value script writes. */
.visual-convergence .hero-signature .signature-stage {
  --stage-h:360px;
  --thick:7px;
  --word-need:clamp(3.5rem,37.8cqw,14.5rem);
  --word-form:clamp(3.5rem,34.2cqw,13rem);
  --p:0;
  --ps:calc(var(--p) * var(--p) * (3 - 2 * var(--p)));
  position:relative;
  width:100%;
  height:var(--stage-h);
  container-type:inline-size;
  perspective:1500px;
  perspective-origin:50% 44%;
}
.visual-convergence .hero-signature .signature-sculpture { position:absolute; inset:0; z-index:1; transform-style:preserve-3d; transform:rotateX(calc((6 - 4 * var(--ps)) * 1deg)) rotateY(calc((-13 + 10 * var(--ps)) * 1deg)); }
/* Grounded shadow sits under the sculpture base, behind the faces: it must not
   read as a horizontal bar through the open slats. */
.visual-convergence .hero-signature .signature-ground { position:absolute; left:10%; right:10%; bottom:-24px; height:36px; z-index:0; background:radial-gradient(50% 50% at 50% 62%,rgb(14 15 17 / .10),rgb(14 15 17 / 0) 76%); pointer-events:none; }

.visual-convergence .hero-signature .signature-vane {
  position:absolute; top:0; left:calc(var(--i) * 12.5%); width:12.5%; height:100%;
  transform-style:preserve-3d;
  --l:clamp(0,calc((var(--p) - var(--delay)) / var(--window)),1);
  --e:calc(var(--l) * var(--l) * (3 - 2 * var(--l)));
  --sway:calc(4 * var(--l) * (1 - var(--l)));
  --angle:calc(180deg * var(--e) + var(--fan) * (1 - var(--e)));
  transform:translate3d(calc(5px * var(--sway)),calc(-7px * var(--sway)),calc(26px * var(--sway))) rotateY(var(--angle));
}
.visual-convergence .hero-signature .signature-vane:nth-child(1) { --i:0; --delay:.00; --fan:0deg; --window:.65; }
.visual-convergence .hero-signature .signature-vane:nth-child(2) { --i:1; --delay:.05; --fan:0deg; --window:.65; }
.visual-convergence .hero-signature .signature-vane:nth-child(3) { --i:2; --delay:.10; --fan:0deg; --window:.65; }
.visual-convergence .hero-signature .signature-vane:nth-child(4) { --i:3; --delay:.15; --fan:0deg; --window:.65; }
.visual-convergence .hero-signature .signature-vane:nth-child(5) { --i:4; --delay:.20; --fan:0deg; --window:.65; }
.visual-convergence .hero-signature .signature-vane:nth-child(6) { --i:5; --delay:.25; --fan:0deg; --window:.65; }
.visual-convergence .hero-signature .signature-vane:nth-child(7) { --i:6; --delay:.30; --fan:0deg; --window:.65; }
.visual-convergence .hero-signature .signature-vane:nth-child(8) { --i:7; --delay:.35; --fan:0deg; --window:.65; }

.visual-convergence .hero-signature .signature-face {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  overflow:hidden; backface-visibility:hidden; -webkit-backface-visibility:hidden;
}
.visual-convergence .hero-signature .signature-face-need { transform:translateZ(calc(var(--thick) / 2)); background:var(--nf-signal); color:var(--nf-ink); }
.visual-convergence .hero-signature .signature-face-form { transform:translateZ(calc(var(--thick) / -2)) rotateY(180deg); background:var(--nf-ink); color:var(--nf-paper); }
.visual-convergence .hero-signature .signature-word {
  position:absolute; top:50%; width:800%;
  font-family:var(--font-primary); font-weight:800; line-height:1; letter-spacing:-.02em;
  white-space:nowrap; text-align:center;
}
.visual-convergence .hero-signature .signature-face-need .signature-word { left:calc(var(--i) * -100%); font-size:var(--word-need); transform:translateY(-50%); }
/* The half turn of the vane and the 180 degree back face cancel out, so the
   FORM slice uses the very same full-word origin as the NEED slice. No mirror. */
.visual-convergence .hero-signature .signature-face-form .signature-word { left:calc(var(--i) * -100%); font-size:var(--word-form); transform:translateY(-50%); }

/* Slender, honest thickness: one real edge plane per vane, a hairline of paper
   along the leading edge. No gradient sheen, no glow. */
/* The edge plane is anchored at the vane's outer edge (left:100%), so no part
   of it can sit inside the letter face and scratch the surface. */
.visual-convergence .hero-signature .signature-spine {
  position:absolute; top:0; left:100%; right:auto; width:var(--thick); height:100%;
  transform-origin:0 50%; transform:translateZ(calc(var(--thick) / 2)) rotateY(90deg);
  background:linear-gradient(90deg,var(--nf-ink),var(--nf-dark));
}
.visual-convergence .hero-signature .signature-spine::before { content:''; position:absolute; inset:0 auto 0 0; width:1px; background:var(--nf-paper); opacity:.16; }

.visual-convergence .hero-signature .signature-play {
  display:none; align-items:center; gap:8px; min-height:44px; margin-top:28px; padding:10px 0;
  border:0; background:transparent; color:var(--nf-ink); font-family:var(--font-primary);
  font-size:1rem; font-weight:600; letter-spacing:0; text-transform:none; cursor:pointer;
  text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px;
}
.visual-convergence .hero-signature .signature-play:hover { text-decoration-color:var(--nf-signal); }
.visual-convergence .hero-signature .signature-play:focus-visible { outline:2px solid var(--nf-signal); outline-offset:3px; }
.visual-convergence .hero-signature:is(.signature-live,.signature-reduced) .signature-play { display:inline-flex; }
.visual-convergence .hero-signature .signature-play-mark { font-size:1.0625rem; line-height:1; }

@media (min-width:900px) and (max-width:1199px) {
 .visual-convergence .hero-signature { --runway:480px; }
 .visual-convergence .hero-signature .hero-grid { gap:24px 40px; padding-block:40px; min-height:min(688px,calc(100svh - 96px)); }
 .visual-convergence .hero-signature .signature-stage { --stage-h:320px; }
 .visual-convergence .hero-signature h1 { font-size:clamp(3rem,5.2vw,4rem); }
 .visual-convergence .hero-signature .hero-lead { font-size:1.125rem; margin-top:28px; }
}
@media (min-width:768px) and (max-width:899px) {
 .visual-convergence .hero-signature { --runway:420px; }
 .visual-convergence .hero-signature .hero-grid { gap:24px 32px; padding-block:36px; min-height:min(660px,calc(100svh - 96px)); }
 .visual-convergence .hero-signature .signature-stage { --stage-h:290px; --thick:6px; }
 .visual-convergence .hero-signature h1 { font-size:clamp(2.75rem,5vw,3.5rem); }
 .visual-convergence .hero-signature .hero-lead { font-size:1.0625rem; margin-top:24px; }
}

@media (max-width:767px) {
 .visual-convergence .hero-signature { --runway:320px; }
 .visual-convergence .hero-signature .hero-grid { display:flex; flex-direction:column; align-items:stretch; gap:28px; padding-block:32px; min-height:0; }
 .visual-convergence .hero-signature .hero-copy { display:block; }
 .visual-convergence .hero-signature .hero-motion-track { order:2; }
 .visual-convergence .hero-signature .eyebrow { margin:0 0 15px; }
 .visual-convergence .hero-signature h1 { margin:0 0 26px; font-size:clamp(2.5rem,12vw,3.375rem); line-height:1.03; }
 .visual-convergence .hero-signature .hero-lead { margin:0; font-size:1.125rem; line-height:1.5; }
 .visual-convergence .hero-signature .hero-actions { margin:22px 0 0; gap:12px; }
 .visual-convergence .hero-signature .signature-stage { --stage-h:260px; --thick:5px; }
 .visual-convergence .hero-signature .signature-play { margin-top:28px; }
}

/* Reduced motion: the resolved FORM plate is the static composition; the button
   switches state without any motion. */
@media (prefers-reduced-motion:reduce) {
 .visual-convergence .hero-signature .signature-stage { --p:1; }
 .visual-convergence .hero-signature.signature-static-need .signature-stage { --p:0; }
}

/* ==========================================================================
   Product-first homepage evolution (2026-09-19).
   Authority: CURRENT_DIRECTION_2026-09-19/01_HOMEPAGE_CURRENT_DIRECTION_2026-09-19.md
   Everything here is scoped to .product-first, which only the homepage body
   carries, so product, legal, support, thank-you and 404 routes keep their
   canonical rules. Tokens, fonts, palette, logos and the NEED to FORM signature
   sculpture stay untouched; this block changes hierarchy, rhythm and the
   composition of the homepage chapters.
   ========================================================================== */

/* Shorter runway: the same scroll-driven half-turn resolves sooner, holds
   briefly, then releases into the first chapter. One number changes. */
.product-first .hero-signature { --runway:360px; }
@media (min-width:900px) and (max-width:1199px) { .product-first .hero-signature { --runway:300px; } }
@media (min-width:768px) and (max-width:899px) { .product-first .hero-signature { --runway:300px; } }
@media (max-width:767px) { .product-first .hero-signature { --runway:220px; } }

/* Hero: descriptor line, place line, product-first actions. */
.product-first .hero-signature .eyebrow { margin-bottom:10px; }

/* Shared small codes and links for the new chapters. */
.product-first .pf-code {
  margin:0;
  font-family:var(--font-mono);
  font-size:.6875rem;
  line-height:1.545455;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--nf-graphite);
}
.product-first .pf-link {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.9375rem;
  line-height:1.4;
  font-weight:600;
  text-decoration-thickness:1px;
  text-underline-offset:5px;
}
.product-first :is(.pf-link,.pf-row-link)::after {
  content:"↘";
  font-family:var(--font-mono);
  display:inline-block;
  transition:transform var(--motion-fast) var(--motion-ease);
}
.product-first :is(.pf-link,.pf-row-link):is(:hover,:focus-visible)::after { transform:translate(2px,2px); }

/* 01 Products: one honest, prominent product chapter. */
.product-first .product-craft {
  margin:22px 0 0;
  font-family:var(--font-mono);
  font-size:.75rem;
  line-height:1.7;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--nf-ink);
}
.product-first .product-craft span { padding-inline:6px; color:var(--nf-signal); }
.product-first .product-status {
  margin:14px 0 0;
  padding-left:13px;
  border-left:3px solid var(--nf-signal);
  color:var(--nf-ink);
  font-family:var(--font-mono);
  font-size:.8125rem;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.04em;
}
.product-first .product-row-kicker { margin-top:0; }
@media (min-width:768px) { .product-first #products { padding-block:88px 72px; } }

/* Mobile product order: brand (with status) -> copy -> screen -> link. The
   status therefore sits before the imagery on small viewports, while desktop
   keeps it in the right-hand column next to the screen. */
@media (max-width:767px) {
  .product-first .owned-products:has(> .owned-product:only-child) .owned-product { display:flex; flex-direction:column; gap:20px; }
  .product-first .owned-products:has(> .owned-product:only-child) .product-row-brand { order:0; align-self:flex-start; }
  .product-first .owned-products:has(> .owned-product:only-child) .product-row-copy { order:1; }
  .product-first .owned-products:has(> .owned-product:only-child) .product-screen { order:2; width:100%; }
  .product-first .owned-products:has(> .owned-product:only-child) .product-row-link { order:3; }
}

/* 02 Studio: one editorial product row, three compact supporting capabilities.
   Replaces the earlier capability stage and the three equal service cards. */
.product-first .pf-fit {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:24px;
  margin:0 0 40px;
  padding:22px 0 26px;
  border-top:1px solid var(--nf-ink);
  border-bottom:1px solid var(--nf-border);
}
.product-first .pf-fit > .pf-code { grid-column:1 / span 3; }
.product-first .pf-fit > p:last-child {
  grid-column:4 / span 8;
  margin:0;
  max-width:70ch;
  font-size:1.0625rem;
  line-height:1.6;
  color:var(--nf-graphite);
}
.product-first .pf-fit strong { color:var(--nf-ink); font-weight:600; }

.product-first .pf-offer { border-top:1px solid var(--nf-border); padding-top:26px; }
.product-first .pf-offer-head { display:flex; align-items:baseline; justify-content:space-between; gap:14px 32px; flex-wrap:wrap; }
.product-first .pf-offer-head .pf-code { color:var(--nf-ink); }
.product-first .pf-phases {
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:30px 0 0;
  padding:0;
}
.product-first .pf-phases li { min-width:0; padding:0 32px 0 0; }
.product-first .pf-phases li + li { padding-left:32px; border-left:1px solid var(--nf-border); }
.product-first .pf-phases h3 { margin:12px 0 0; font-size:1.5rem; line-height:1.25; letter-spacing:-.02em; font-weight:600; }
.product-first .pf-phases li > p:last-child { margin:10px 0 0; max-width:34ch; color:var(--nf-graphite); }

.product-first .pf-support { margin-top:56px; padding-top:22px; border-top:1px solid var(--nf-border); }
.product-first .pf-support-label {
  margin:0 0 18px;
  font-family:var(--font-mono);
  font-size:.6875rem;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--nf-graphite);
}
.product-first .pf-support-rows { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--nf-border); }
.product-first .pf-support-row { min-width:0; padding:20px 28px 22px 0; border-bottom:1px solid var(--nf-border); }
.product-first .pf-support-row + .pf-support-row { padding-left:28px; border-left:1px solid var(--nf-border); }
.product-first .pf-support-row h3 {
  margin:0;
  font-family:var(--font-mono);
  font-size:.75rem;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--nf-ink);
}
.product-first .pf-support-row p { margin:10px 0 0; max-width:36ch; color:var(--nf-graphite); font-size:.9375rem; line-height:1.6; }
.product-first .pf-row-link { margin-top:10px; min-height:44px; display:inline-flex; align-items:center; gap:8px; font-size:.875rem; font-weight:600; text-underline-offset:5px; }
.product-first .pf-studio .signal-rule { margin-top:48px; }

/* 03 Creative keeps both studies and stays reachable for external work. */
.product-first .pf-cta-row { margin:24px 0 0; }
.product-first .pf-cta-row-end { margin:36px 0 0; padding-top:24px; border-top:1px solid var(--nf-border-dark); }

@media (min-width:768px) and (max-width:1199px) {
  .product-first .pf-fit { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .product-first .pf-fit > .pf-code { grid-column:1 / span 2; }
  .product-first .pf-fit > p:last-child { grid-column:3 / span 4; }
  .product-first .pf-phases li { padding-right:20px; }
  .product-first .pf-phases li + li { padding-left:20px; }
  .product-first .pf-support-row { padding-right:20px; }
  .product-first .pf-support-row + .pf-support-row { padding-left:20px; }
}

@media (max-width:767px) {
  .product-first .pf-fit { display:block; margin-bottom:28px; padding:18px 0 22px; }
  .product-first .pf-fit > p:last-child { margin-top:10px; font-size:1rem; line-height:1.625; }
  .product-first .pf-offer { padding-top:20px; }
  .product-first .pf-phases { display:block; margin-top:22px; }
  .product-first .pf-phases li { padding:18px 0 20px; }
  .product-first .pf-phases li + li { padding-left:0; border-left:0; border-top:1px solid var(--nf-border); }
  .product-first .pf-phases h3 { margin-top:10px; font-size:1.375rem; }
  .product-first .pf-support { margin-top:40px; }
  .product-first .pf-support-rows { display:block; }
  .product-first .pf-support-row { padding:18px 0 20px; }
  .product-first .pf-support-row + .pf-support-row { padding-left:0; border-left:0; border-top:1px solid var(--nf-border); }
  .product-first .pf-support-row p { max-width:none; }
  .product-first .pf-cta-row { margin-top:20px; }
  .product-first .pf-cta-row-end { margin-top:28px; padding-top:20px; }
}

@media (prefers-reduced-motion:reduce) {
  .product-first :is(.pf-link,.pf-row-link)::after { transition:none !important; transform:none !important; }
}

/* ==========================================================================
   120/100 convergence pass (2026-09-19).
   Authority: CURRENT_DIRECTION_2026-09-19 + QA_VISUAL/convergence-120-2026-09-19/BRIEF.md
   Still scoped to .product-first so shared and legal routes are untouched.
   ========================================================================== */

/* 01 Products: one deliberate product feature.
   The earlier tilted two-plane collage is replaced by an honest stage that
   shows the real UI whole. The stage keeps one reserved height for both
   formats, so the view control never reflows the page. */
.product-first .owned-products,
.product-first .owned-products:has(> .owned-product:only-child) { display:block; }
.product-first .owned-product,
.product-first .owned-products:has(> .owned-product:only-child) .owned-product {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,26rem);
  align-items:start;
  gap:20px 56px;
  border-top:1px solid var(--nf-ink);
  padding-top:24px;
}
.product-first .owned-product .product-row-icon {
  grid-column:2;
  grid-row:1;
  align-self:end;
  justify-self:end;
}
.product-first .owned-product .product-row-icon img { width:56px; height:auto; }
.product-first .owned-product .product-row-brand {
  display:flex;
  align-items:center;
  gap:16px;
  grid-column:1;
  grid-row:1;
}
.product-first .owned-product .product-row-brand img { width:min(100%,230px); height:auto; }
.product-first .owned-product .product-row-brand .product-status { margin:0; }
.product-first .owned-product .product-row-copy { grid-column:1; grid-row:2; margin:0; }
.product-first .owned-product .product-row-copy p:last-child { margin:0; max-width:62ch; }
.product-first .owned-product .product-row-link {
  grid-column:2;
  grid-row:2;
  justify-self:end;
  align-self:end;
  margin:0;
}

/* The view control: two native radios, one honest current state. */
.product-first .screen-views {
  display:inline-flex;
  align-items:stretch;
  margin:0 0 14px;
  padding:0;
  border:1px solid var(--nf-border);
}
.product-first .screen-views legend {
  position:absolute;
  width:1px; height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.product-first .screen-views label { position:relative; cursor:pointer; }
.product-first .screen-views input {
  position:absolute; inset:0; width:100%; height:100%;
  margin:0; opacity:0; cursor:pointer;
}
.product-first .screen-views label > span {
  display:block;
  min-height:44px;
  padding:11px 18px;
  font-family:var(--font-mono);
  font-size:.75rem;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--nf-graphite);
  border-bottom:2px solid transparent;
}
.product-first .screen-views label + label > span { border-left:1px solid var(--nf-border); }
.product-first .screen-views input:checked + span { color:var(--nf-ink); border-bottom-color:var(--nf-signal); }
.product-first .screen-views input:focus-visible + span { outline:2px solid var(--nf-signal); outline-offset:-5px; }

/* Warm, dark brand stage. Height is reserved for both formats, so switching
   view never moves the rest of the chapter.
   The earlier scroll-driven tilted two-plane collage (view-timeline
   --nf-product plus its plane keyframes) is fully retired here: it contradicted
   the product-first direction by cropping the only real product UI. The
   explicit .visual-convergence selectors keep the same weight as the rules
   they replace, so no cascade gamble is involved. */
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .product-screen,
.product-first.visual-convergence .product-screen {
  grid-column:1 / -1;
  grid-row:auto;
  order:1;
  width:100%;
  margin:0;
  min-width:0;
}
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .product-screen { grid-column:1 / -1; }
.product-first.visual-convergence .product-screen,
.product-first.visual-convergence .product-screen .screen-plane,
.product-first.visual-convergence .product-screen .screen-plane-portrait {
  animation:none !important;
  transform:none;
}
.product-first.visual-convergence .screen-plane-landscape,
.product-first.visual-convergence .screen-plane-portrait {
  position:absolute;
  inset:0;
  width:auto;
  left:auto;
  right:auto;
  top:auto;
  transform:none;
}
.product-first.visual-convergence .screen-stage,
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .screen-stage {
  position:relative;
  height:520px;
  background:var(--nf-ink);
  overflow:hidden;
  perspective:none;
}
.product-first.visual-convergence .screen-plane :is(.screen-landscape,.screen-portrait) {
  position:relative;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:contain;
  object-position:50% 50%;
  border:0;
  transform:none;
  transition:none;
}
.product-first .screen-plane-portrait { visibility:hidden; }
.product-first .product-screen:has(input[value='portrait']:checked) .screen-plane-landscape { visibility:hidden; }
.product-first .product-screen:has(input[value='portrait']:checked) .screen-plane-portrait { visibility:visible; }
.product-first .product-screen figcaption {
  color:var(--nf-graphite);
  font-size:.8125rem;
  line-height:1.5;
  margin:12px 0 0;
}
.product-first .screen-open { margin-top:2px; }

/* The enlarged view follows the selected format. */
.product-first .screen-dialog-portrait { width:max(100%,420px); height:auto; max-height:72dvh; object-fit:contain; margin-inline:auto; }
.product-first .screen-dialog .screen-pan img { width:max(100%,900px); }
.product-first .screen-dialog-portrait[hidden] { display:none !important; }
.product-first .screen-dialog.is-portrait .screen-pan img.screen-dialog-landscape { display:none; }
.product-first .screen-dialog.is-portrait .screen-pan img.screen-dialog-portrait { width:auto; height:72dvh; max-width:none; }

/* 02 Studio: three facts as one editorial scope list, no repeated prose. */
.product-first .pf-phases h3 { margin:0; }
.product-first .pf-phases li > .pf-scope-note {
  margin:8px 0 0;
  max-width:34ch;
  color:var(--nf-graphite);
  font-size:.875rem;
  line-height:1.5;
}

/* 03 Creative: the claim is the headline, the discipline is the category. */
.product-first .section-category {
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:.75rem;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--nf-signal);
}
.product-first .creative-section .section-title { max-width:14ch; }

@media (min-width:768px) and (max-width:1023px) {
  .product-first .owned-product,
  .product-first .owned-products:has(> .owned-product:only-child) .owned-product {
    grid-template-columns:minmax(0,1fr) minmax(240px,20rem);
    gap:20px 32px;
  }
  .product-first.visual-convergence .screen-stage,
  .product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .screen-stage { height:460px; }
}

@media (max-width:767px) {
  .product-first .owned-product,
  .product-first .owned-products:has(> .owned-product:only-child) .owned-product {
    display:flex;
    flex-direction:column;
    gap:18px;
    padding-top:20px;
  }
  .product-first .owned-product .product-row-icon { display:none; }
  .product-first .owned-product .product-row-brand { order:0; flex-wrap:wrap; gap:10px 14px; }
  .product-first .owned-product .product-row-brand .product-status { padding-left:11px; }
  .product-first .owned-product .product-row-copy { order:1; }
  .product-first .owned-product .product-row-link { order:2; align-self:flex-start; justify-self:start; min-height:44px; display:inline-flex; align-items:center; }
  .product-first .owned-product .product-screen { order:3; width:100%; }
  .product-first.visual-convergence .screen-stage,
  .product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .screen-stage { height:430px; }
  .product-first .screen-views { margin-bottom:12px; width:100%; }
  .product-first .screen-views label { flex:1; }
  .product-first .screen-views label > span { padding-inline:10px; text-align:center; }
  .product-first .creative-section .section-title { max-width:none; }
}

/* Final integration: explicit precedence over the archived single-product grid. */
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-brand { grid-column:1; grid-row:1 / span 2; align-self:start; flex-direction:column; align-items:flex-start; gap:16px; }
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-copy { grid-column:2; grid-row:1; }
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .product-row-link { grid-column:2; grid-row:2; justify-self:start; }
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .product-screen { grid-row:3; }
.product-first.visual-convergence .product-screen .screen-plane { inset:24px; width:calc(100% - 48px); height:calc(100% - 48px); transform:none !important; }
.product-first.visual-convergence .product-screen .screen-plane img { display:block; width:100%; height:100%; object-fit:contain; transform:none !important; }
.product-first .screen-open-portrait { display:none; }
.product-first .product-screen:has(input[value='portrait']:checked) .screen-open-landscape { display:none; }
.product-first .product-screen:has(input[value='portrait']:checked) .screen-open-portrait { display:inline-flex; }
.product-first .pf-phases { display:flex; flex-wrap:wrap; gap:12px 32px; margin-top:24px; padding:0; }
.product-first .pf-phases li, .product-first .pf-phases li + li { flex:1 1 220px; padding:0; border:0; }
.product-first .pf-phases h3 { font-size:clamp(1.125rem,1.7vw,1.5rem); line-height:1.35; }
.product-first .section-category { color:var(--nf-paper); }
@media (max-width:767px) {
 .product-first.visual-convergence .product-screen .screen-plane { inset:16px; width:calc(100% - 32px); height:calc(100% - 32px); }
 .product-first .pf-phases { gap:0; }
 .product-first .pf-phases li, .product-first .pf-phases li + li { flex-basis:100%; padding:14px 0; border-bottom:1px solid var(--nf-border); }
 .product-first .pf-phases h3 { margin:0; }
}
/* The visual itself pins inside a track that owns its entire runway. */
.visual-convergence .hero-signature.signature-pin-visual .hero-grid::after { display:none; }
.visual-convergence .hero-signature.signature-pin-visual .hero-motion-track { position:relative; top:auto; padding-bottom:var(--runway); align-self:start; }
.visual-convergence .hero-signature.signature-pin-visual .hero-signal { position:sticky; top:var(--sticky-top); }
/* Category is a heading companion, never a competing grid column. */
.product-first .creative-section .section-title-wrap .section-category { grid-column:1 / -1; grid-row:1; margin:0; }
.product-first .creative-section .section-title-wrap .section-title { grid-column:1; grid-row:2; margin:0; }
.product-first .creative-section .section-title-wrap .section-intro { grid-column:2; grid-row:2; align-self:end; margin:0; }
@media (max-width:767px) {
 .product-first .creative-section .section-title-wrap { display:block; }
 .product-first .creative-section .section-title-wrap .section-category { margin-bottom:12px; }
 .product-first .creative-section .section-title-wrap .section-intro { margin-top:24px; }
}
.visual-convergence .hero-signature.signature-pin-visual .hero-motion-track { width:100%; padding-bottom:0; }
.visual-convergence .hero-signature.signature-pin-visual .hero-motion-track::after { content:""; display:block; height:var(--runway); }
@media (min-width:768px) {
 .product-first .creative-section .section-title-wrap { grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); column-gap:clamp(24px,4vw,56px); row-gap:12px; }
 .product-first .creative-section .section-title { max-width:none; }
}

/* ==========================================================================
   Section motion (2026-09-19), scoped to .product-first.
   Driver: assets/section-motion.js. It writes three custom properties
   (--product-p, --row-p, --studio-p) and adds .product-motion-live only after
   measuring the geometry. Every rule below is inert without that class, so
   reduced motion, a missing script and viewports that cannot fit the whole
   VERSIQ figure keep the flat, fully visible default and no added spacer.
   ========================================================================== */

/* 01 Products: the VERSIQ figure pins inside a track that owns its runway. */
.product-first .product-motion-track {
  --product-runway:300px;
  --product-sticky-top:0px;
  position:relative;
  width:100%;
  min-width:0;
}
.product-first.visual-convergence .owned-products:has(> .owned-product:only-child) .product-motion-track,
.product-first.visual-convergence .product-motion-track {
  grid-column:1 / -1;
  grid-row:3;
  margin:0;
}
/* The spacer is a real block child, not padding, so it genuinely extends the
   containing block the sticky figure is allowed to travel through. */
.product-first .product-motion-track::after { content:""; display:none; }
.product-first .product-motion-track.product-motion-live::after { display:block; height:var(--product-runway); }
.product-first .product-motion-track.product-motion-live .product-screen {
  position:sticky;
  top:var(--product-sticky-top);
  margin:0;
  /* Perspective lives on the figure, so the stage transform stays a plain
     rotate/tilt/scale that resolves to the identity matrix. */
  perspective:1200px;
  perspective-origin:50% 0%;
}

/* Deployment mark above the stage. It reuses the margin the view control
   already reserved, so switching it on never shifts the figure. */
.product-first .product-motion-rule { display:none; }
.product-first .product-motion-track.product-motion-live .product-motion-rule {
  display:block;
  height:2px;
  margin:0 0 10px;
  background:var(--nf-signal);
  transform:scaleX(var(--product-p,1));
  transform-origin:0 50%;
}
.product-first .product-motion-track.product-motion-live .screen-views { margin-bottom:2px; }

/* One unit: the real stage deploys out of perspective, tilt and scale, and is
   completely resolved, flat and readable for the rest of the runway. Only the
   stage moves, so the view control, the caption and the links never shift. */
.product-first .product-motion-track.product-motion-live .screen-stage {
  transform-origin:50% 0%;
  will-change:transform;
  transform:
    rotateX(calc(9deg * (1 - var(--product-p,1))))
    translateY(calc(48px * (1 - var(--product-p,1))))
    scale(calc(.88 + .12 * var(--product-p,1)));
}

/* 02 Studio: three scope rows that resolve into one aligned editorial column. */
.product-first .pf-offer { position:relative; }
.product-first .pf-offer-line {
  position:absolute;
  left:0;
  right:0;
  top:-1px;
  height:2px;
  background:var(--nf-signal);
  transform-origin:0 50%;
  pointer-events:none;
}
.product-first .pf-offer.pf-motion-live .pf-offer-line { transform:scaleX(var(--studio-p,1)); }
.product-first .pf-phases {
  display:block;
  margin:30px 0 0;
  padding:0;
}
/* The archived scope list still carries `li + li` rules at (0,2,2) that would
   strip the padding and add a left border on the second and third row, so the
   new rows are declared for both shapes at one higher specificity. */
.product-first .pf-offer .pf-phases > li,
.product-first .pf-offer .pf-phases > li + li {
  --row-shift:48px;
  position:relative;
  display:grid;
  grid-template-columns:clamp(44px,5vw,88px) minmax(0,1fr);
  align-items:baseline;
  gap:0 16px;
  overflow:hidden;
  padding:22px 0 24px;
  border:0;
  border-top:1px solid var(--nf-border);
}
.product-first .pf-offer .pf-phases > li:nth-child(2) { --row-shift:80px; }
.product-first .pf-offer .pf-phases > li:nth-child(3) { --row-shift:112px; }
.product-first .pf-offer .pf-phases > li:last-child { border-bottom:1px solid var(--nf-border); }
.product-first .pf-phase-index {
  grid-column:1;
  font-family:var(--font-mono);
  font-size:.75rem;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.08em;
  color:var(--nf-graphite);
}
.product-first .pf-phase-rule {
  position:absolute;
  left:0;
  /* The row clips its own overflow, so the mark sits inside the padding box. */
  top:0;
  width:56px;
  height:2px;
  background:var(--nf-signal);
  transform-origin:0 50%;
  pointer-events:none;
}
.product-first .pf-offer.pf-motion-live .pf-phase-rule { transform:scaleX(var(--row-p,1)); }
.product-first .pf-offer .pf-phases > li > h3,
.product-first .pf-offer .pf-phases > li + li > h3 {
  grid-column:2;
  margin:0;
  font-family:var(--font-primary);
  font-size:clamp(1.5rem,3.1vw,2.5rem);
  line-height:1.1;
  letter-spacing:-.03em;
  font-weight:600;
  color:var(--nf-ink);
}
.product-first .pf-offer.pf-motion-live .pf-phases > li > h3,
.product-first .pf-offer.pf-motion-live .pf-phases > li + li > h3 {
  transform:translateX(calc(var(--row-shift) * (1 - var(--row-p,1))));
}

/* 03 Creative: the lower study is full width again, and its camera is anchored
   on the frame centre. Radios, clip and exposure keyframes are untouched. */
.product-first .creative-composition-b:has(.creative-visual) { width:100%; margin-left:0; margin-right:0; }
.product-first .creative-composition-b .transformation-camera { transform-origin:50% 50%; }

@media (max-width:767px) {
  .product-first .product-motion-track { --product-runway:160px; }
  /* The figure already follows the link in document order, so the shared order
     value keeps the established mobile sequence: brand, copy, link, screen. */
  .product-first .owned-product .product-motion-track { order:2; }
  .product-first .pf-offer .pf-phases > li,
  .product-first .pf-offer .pf-phases > li + li {
    --row-shift:12px;
    grid-template-columns:36px minmax(0,1fr);
    padding:18px 0 20px;
  }
  .product-first .pf-offer .pf-phases > li:nth-child(2) { --row-shift:18px; }
  .product-first .pf-offer .pf-phases > li:nth-child(3) { --row-shift:24px; }
  .product-first .pf-offer .pf-phases > li > h3 { font-size:clamp(1.375rem,6.6vw,1.875rem); }
}

@media (prefers-reduced-motion:reduce) {
  .product-first .product-motion-track::after { display:none !important; }
  .product-first .product-motion-track .product-screen { position:static !important; }
  .product-first .product-motion-track .screen-stage { transform:none !important; }
  .product-first .product-motion-rule { display:none !important; }
  .product-first .pf-phases > li > h3,
  .product-first .pf-phase-rule,
  .product-first .pf-offer-line { transform:none !important; }
}