/* Page-level behavior and real consultation form. */
html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--site-header-height, 84px);
}
/* Keep the existing hero fragment at the section edge without changing layout. */
#w2w-site .n-section-anchor {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
}
body {
  margin: 0;
  background: light-dark(#ffffff, #101b30);
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 3px solid light-dark(#3157d5, #aec5ff);
  outline-offset: 4px;
}
.skip-link {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 10;
  padding: 10px 16px;
  color: #fff;
  background: #17284a;
  transform: translateY(-150%);
}
.skip-link:focus {
  transform: translateY(0);
}
#w2w-site .n-wrap {
  padding-left: max(6%, calc((100% - 1240px) / 2));
  padding-right: max(6%, calc((100% - 1240px) / 2));
}
#w2w-site .n-nav {
  position: sticky;
  top: 0;
  z-index: 30;
  padding-block: 18px;
  box-shadow: 0 1px 0 var(--n-line);
}
@media (max-width: 680px) {
  html {
    --site-header-height: 76px;
  }
}
/* Preserve the supplied symbol and wordmark geometry in both color schemes. */
#w2w-site .n-brand-logo {
  position: relative;
  display: block;
  flex-shrink: 0;
  line-height: 0;
}
#w2w-site .n-brand img {
  display: block;
  width: 116px;
  height: 48px;
  padding: 0;
  border-radius: 0;
  background: transparent;
}
@media (prefers-color-scheme: dark) {
  #w2w-site .n-brand-logo img {
    clip-path: inset(0 45% 0 0);
  }
  #w2w-site .n-brand-logo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: #fff;
    -webkit-mask: url('/images/logo-transparent.png') center / contain no-repeat;
    mask: url('/images/logo-transparent.png') center / contain no-repeat;
    /* The empty gap at 55% separates the blue symbol from both text lines. */
    clip-path: inset(0 0 0 55%);
    pointer-events: none;
  }
}
@container (max-width: 680px) {
  #w2w-site .n-nav {
    padding-block: 16px;
  }
  #w2w-site .n-brand img {
    width: 96px;
    height: 40px;
  }
}
#w2w-site .n-field {
  margin-bottom: 46px;
}
#w2w-site .n-field-caption {
  top: 104%;
  bottom: auto;
  line-height: 1.6;
}
#w2w-site .n-navlinks {
  gap: 22px;
}
#w2w-site .n-navlinks a.n-cta:hover {
  color: var(--n-onblue);
}
#w2w-site .language-link {
  min-width: 30px;
  text-align: center;
  padding: 10px 0;
}
#w2w-site .product-consult {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 8px;
  color: var(--n-blue);
  font-size: 12px;
}
#w2w-site .n-contact {
  align-self: start;
  scroll-margin-top: 0;
}
#w2w-site .contact-form {
  display: grid;
  gap: 16px;
  margin-top: 24px;
}
#w2w-site .contact-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
#w2w-site .contact-form label {
  display: grid;
  gap: 7px;
  min-width: 0;
  font-size: 12px;
}
#w2w-site .contact-form input,
#w2w-site .contact-form textarea,
#w2w-site .contact-form select {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  font: inherit;
  font-size: 16px;
  line-height: 1.5;
  color: var(--n-ink);
  border: 1px solid var(--n-line);
  border-radius: 6px;
  background: var(--n-bg);
}
#w2w-site .contact-form textarea {
  resize: vertical;
  min-height: 110px;
}
#w2w-site .contact-form .contact-note {
  margin: -4px 0 0;
  font-size: 11px;
  color: var(--n-muted);
  line-height: 1.7;
}
#w2w-site .contact-form .contact-status {
  margin: 0;
  min-height: 22px;
  font-size: 12px;
  line-height: 1.8;
}
#w2w-site .contact-status[data-state='error'] {
  color: light-dark(#a32a32, #ffb2b7);
}
#w2w-site .contact-status[data-state='success'] {
  color: light-dark(#16624d, #97dfc0);
}
#w2w-site button:disabled {
  cursor: wait;
  opacity: 0.65;
}
#w2w-site [data-soc-stage] {
  touch-action: manipulation;
}
#w2w-site .n-footer a {
  text-underline-offset: 4px;
}
#w2w-site .n-footer a:hover {
  text-decoration: underline;
}
.no-js #w2w-site .n-menu {
  display: none;
}
.no-js #w2w-site .n-navlinks {
  display: flex;
}
.no-js #w2w-site .n-mission-tabs,
.no-js #w2w-site .soc-controls {
  display: none;
}
html[lang='en'] #w2w-site .n-field {
  margin-bottom: 64px;
}
html[lang='en'] #w2w-site .n-field-caption {
  font-size: 11px;
}
html[lang='en'] #w2w-site .n-field-core strong {
  font-size: 14px;
}
html[lang='en'] #w2w-site .n-field-core small {
  font-size: 10px;
}
html[lang='en'] #w2w-site .n-navlinks {
  gap: 18px;
}
html[lang='en'] #w2w-site .n-hero-copy h2 {
  font-size: 25px;
}
html[lang='en'] #w2w-site .n-governance {
  flex-wrap: wrap;
}
html[lang='en'] #w2w-site .soc-core strong {
  font-size: 15px;
}
html[lang='en'] #w2w-site .soc-core small {
  font-size: 10px;
}
html[lang='en'] #w2w-site .soc-core {
  width: 128px;
  height: 128px;
  padding: 8px;
  gap: 6px;
  text-align: center;
}
html[lang='en'] #w2w-site .soc-core strong {
  line-height: 1.4;
}
html[lang='en'] #w2w-site .soc-core small {
  max-width: 100%;
  line-height: 1.4;
}
@container (max-width: 850px) {
  #w2w-site .n-navlinks {
    gap: 12px;
  }
  html[lang='en'] #w2w-site .n-brand {
    font-size: 15px;
    gap: 7px;
  }
  html[lang='en'] #w2w-site .n-navlinks {
    gap: 10px;
  }
  html[lang='en'] #w2w-site .n-navlinks .n-cta {
    padding-inline: 12px;
  }
  html[lang='en'] #w2w-site .n-field-core strong {
    font-size: 12px;
  }
  html[lang='en'] #w2w-site .n-field-core {
    left: 36%;
    top: 36%;
    width: 28%;
    height: 28%;
  }
  html[lang='en'] #w2w-site .n-field-label.l3 {
    top: 33%;
  }
  html[lang='en'] #w2w-site .n-agent-node {
    font-size: 11px;
  }
}
@container (max-width: 680px) {
  #w2w-site .soc-scene {
    grid-template-columns: minmax(0, 1fr);
  }
  #w2w-site .soc-source,
  #w2w-site .soc-brain,
  #w2w-site .soc-results {
    min-width: 0;
  }
  #w2w-site .soc-source ul {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #w2w-site .soc-source li {
    min-width: 0;
  }
  #w2w-site .soc-source li::before {
    flex-shrink: 0;
  }
  #w2w-site .n-navlinks {
    gap: 0;
  }
  #w2w-site .n-navlinks .language-link {
    text-align: left;
  }
  #w2w-site .contact-pair {
    grid-template-columns: 1fr;
  }
  #w2w-site .n-field {
    margin-bottom: 46px;
  }
  html[lang='en'] #w2w-site .n-field {
    margin-bottom: 68px;
  }
  html[lang='en'] #w2w-site .n-field-core strong {
    font-size: 12px;
  }
  html[lang='en'] #w2w-site .soc-tools > div {
    grid-template-columns: 1fr;
  }
  html[lang='en'] #w2w-site .soc-results {
    column-gap: 7px;
  }
  html[lang='en'] #w2w-site .soc-results strong {
    font-size: 12px;
  }
  html[lang='en'] #w2w-site .n-mission-tabs button {
    padding: 9px 6px;
    font-size: 11px;
  }
}
/* Keep each side of the architecture balanced around the agent. */
#w2w-site .n-architecture {
  max-width: 1040px;
  margin-inline: auto;
  grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr) 32px minmax(0, 1fr);
  gap: 20px;
}
#w2w-site .n-env,
#w2w-site .n-architecture-tools {
  text-align: center;
}
#w2w-site .n-environment-items {
  justify-content: center;
}
#w2w-site .n-architecture-tools ul {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  text-align: left;
  gap: 12px;
}
#w2w-site .n-architecture-tools li {
  min-width: 0;
}
/* Let the three result rows occupy the right edge of the diagram. */
#w2w-site .soc-scene {
  max-width: none;
  margin-inline: auto;
  grid-template-columns: 22% 50% 28%;
}
#w2w-site .soc-results {
  padding-left: 24px;
}
#w2w-site .soc-results h3 {
  font-size: 16px;
  margin-bottom: 16px;
}
#w2w-site .soc-results > div {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  align-items: baseline;
  gap: 14px;
  margin: 0;
  padding-block: 18px;
  border-top: 1px solid var(--n-line);
}
#w2w-site .soc-results strong {
  font-size: 14px;
}
#w2w-site .soc-results span {
  margin: 0;
  font-size: 12px;
  line-height: 1.8;
}
@container (max-width: 850px) and (min-width: 681px) {
  #w2w-site .soc-scene {
    grid-template-columns: 20% 46% 34%;
  }
  #w2w-site .soc-results {
    padding-left: 18px;
  }
  #w2w-site .soc-results > div {
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 10px;
  }
  #w2w-site .n-architecture {
    gap: 10px;
    grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr);
  }
  #w2w-site .n-architecture-tools {
    padding-inline: 6px;
  }
}
@container (max-width: 680px) {
  #w2w-site .n-architecture {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
  #w2w-site .n-architecture-core,
  #w2w-site .n-architecture-tools {
    width: 100%;
    max-width: 360px;
    justify-self: center;
  }
  #w2w-site .n-architecture-tools {
    padding: 16px 12px;
  }
  #w2w-site .soc-scene {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto 340px auto;
    row-gap: 24px;
  }
  #w2w-site .soc-source ul {
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
    gap: 12px 28px;
    text-align: left;
  }
  #w2w-site .soc-source li {
    align-items: baseline;
  }
  #w2w-site .soc-results {
    padding: 0;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    width: fit-content;
    max-width: 320px;
    justify-self: center;
  }
  #w2w-site .soc-results h3 {
    margin-bottom: 6px;
  }
  #w2w-site .soc-results > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    padding: 0 12px 0 30px;
    border: 0;
    text-align: left;
  }
  #w2w-site .soc-results span {
    margin: 0;
    font-size: 12px;
    line-height: 1.7;
  }
  html[lang='en'] #w2w-site .soc-results > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }
  html[lang='en'] #w2w-site .soc-results strong {
    font-size: 14px;
  }
  #w2w-site .soc-core,
  html[lang='en'] #w2w-site .soc-core {
    width: 136px;
    height: 136px;
    padding: 12px;
    gap: 6px;
    text-align: center;
  }
  #w2w-site .soc-core small {
    max-width: 100%;
    font-size: 10px;
    line-height: 1.4;
  }
}
@container (min-width: 380px) and (max-width: 680px) {
  html[lang='zh-CN'] #w2w-site .n-architecture-tools ul {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}