/* Layout around the approved artwork; exact artwork and motion remain unchanged. */
.ergo-integrated {
  --ergo-ink: #17211c;
  --ergo-secondary: #3e4a43;
  --ergo-paper: #f6f5ef;
  --ergo-link: #105537;
  width: 100%;
  color: var(--ergo-ink);
}
.ergo-integrated-hero {
  padding: clamp(34px, 4.8vw, 70px) 0 clamp(36px, 4vw, 58px);
  background: var(--ergo-paper);
  border-bottom: 1px solid #dce1d8;
}
#main .ergo-integrated .ergo-integrated-stage {
  width: 100%;
  max-width: none;
  min-height: 0;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
  overflow: visible;
}
#main .ergo-integrated .ergo-stage.ergo-integrated-stage {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
#main .ergo-integrated .ergo-integrated-stage h1 {
  margin: 0;
  font-size: clamp(34px, 4.55vw, 62px);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: 1.055;
  max-width: 970px;
  color: var(--ergo-ink);
  -webkit-text-fill-color: currentColor;
  text-wrap: balance;
  overflow-wrap: normal;
}
#main .ergo-integrated .ergo-integrated-stage :is(.eyebrow, .ergo-kicker) {
  margin: 0 0 20px;
  font-size: 12px;
  line-height: 1.45;
  letter-spacing: .06em;
  font-weight: 600;
}
#main .ergo-integrated .ergo-integrated-stage :is(.lead, .ergo-lead) {
  color: var(--ergo-secondary);
  -webkit-text-fill-color: currentColor;
  font-size: clamp(16px, 1.6vw, 19px);
  line-height: 1.65;
  letter-spacing: -.012em;
  margin: 24px 0 0;
  max-width: 780px;
}
#main .ergo-integrated .ergo-integrated-stage .line-audience {
  color: var(--ergo-secondary);
  font-size: 14px;
  line-height: 1.55;
  margin: 15px 0 0;
}
#main .ergo-integrated .ergo-integrated-support { max-width: 850px; }
#main .ergo-integrated .ergo-integrated-stage .actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin: 26px 0 4px;
}
#main .ergo-integrated .actions .button {
  min-height: 47px;
  padding: 12px 20px;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0;
  -webkit-text-fill-color: currentColor;
}
#main .ergo-integrated .actions .button.primary,
#main .ergo-integrated .actions .button.dark {
  color: #ffffff;
  background: #176649;
  border-color: #176649;
}
#main .ergo-integrated .actions .button.secondary {
  color: #17211c;
  background: #ffffff;
  border-color: #a9b5a8;
}
#main .ergo-integrated .actions .text-link { color: var(--ergo-link); }
#main .ergo-integrated .ergo-integrated-picture,
#main .ergo-integrated .ergo-motion-media > picture {
  display: block;
  width: 100%;
  height: auto;
  line-height: 0;
}
#main .ergo-integrated .ergo-integrated-picture img,
#main .ergo-integrated .ergo-motion-media img {
  position: static;
  inset: auto;
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  max-width: 100%;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: 50% 50%;
  transform: none;
  opacity: 1;
}
#main .ergo-integrated .ergo-integrated-stage figure {
  position: relative;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
}
#main .ergo-integrated .ergo-motion-media {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: hidden;
}
#main .ergo-integrated .ergo-integrated-simple { display: block; }
.ergo-integrated-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  align-items: center;
  gap: clamp(28px, 5vw, 76px);
}
.ergo-integrated-copy, .ergo-integrated-art { min-width: 0; }
#main .ergo-integrated .ergo-integrated-copy {
  padding-block: var(--ergo-dark-copy-block, 0px);
  padding-inline: var(--ergo-dark-copy-inline, 0px);
}
#main .ergo-integrated .ergo-integrated-copy-only > .ergo-integrated-copy {
  width: 100%;
  max-width: 900px;
  margin-inline: auto;
  text-align: left;
}
.ergo-integrated-art { width: 100%; max-width: 580px; justify-self: end; }
#main .ergo-integrated .ergo-integrated-art figure { margin: 0; }
.ergo-integrated-wide .ergo-integrated-layout { grid-template-columns: 1fr; gap: 38px; }
.ergo-integrated-wide .ergo-integrated-art { max-width: none; }
.ergo-integrated-wide .ergo-integrated-copy {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  column-gap: clamp(28px, 5vw, 70px);
  align-items: start;
}
.ergo-integrated-wide .ergo-integrated-copy > .eyebrow { grid-column: 1 / -1; }
.ergo-integrated-wide .ergo-integrated-copy > h1 { grid-column: 1; grid-row: 2 / span 3; }
#main .ergo-integrated .ergo-integrated-wide .ergo-integrated-copy > .lead {
  grid-column: 2;
  grid-row: 2;
  margin-top: 0;
}
.ergo-integrated-wide .ergo-integrated-copy > .actions { grid-column: 2; grid-row: 3; }
.ergo-integrated-proof-section { background: var(--ergo-paper); }
#main .ergo-integrated .ergo-integrated-proof {
  --ergo-ink: #17211c;
  --ergo-secondary: #3e4a43;
  --ergo-link: #105537;
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  height: auto;
  margin: 28px auto;
  padding: 28px;
  box-sizing: border-box;
  background: #f6f5ef;
  color: #17211c;
  border: 1px solid #d4dccf;
  box-shadow: none;
}
/* Surface-local text tokens preserve the nine accepted dark opening layouts. */
#main .ergo-accepted-b03 .ergo-integrated-stage.solutions-page,
#main .ergo-accepted-b04 .ergo-integrated-stage.backup-page,
#main .ergo-accepted-b05 .ergo-integrated-stage.managed-page,
#main .ergo-accepted-b06 .ergo-integrated-stage.infra-page,
#main .ergo-accepted-b07 .ergo-integrated-stage.backstage-page,
#main .ergo-accepted-b08 .ergo-integrated-stage.protection-page,
#main .ergo-accepted-b09 .ergo-integrated-stage.board-page,
#main .ergo-accepted-b10 .ergo-integrated-stage.research-page,
#main .ergo-accepted-b11 .ergo-integrated-stage.detection-page {
  --ergo-ink: #ffffff;
  --ergo-secondary: #eff3ee;
  --ergo-link: #d9eddb;
  --ergo-dark-copy-block: clamp(32px, 4vw, 56px);
  --ergo-dark-copy-inline: clamp(28px, 5vw, 76px);
  color: var(--ergo-ink);
}
@media (min-width: 851px) {
  /* In side-by-side layouts the existing grid gap is the matching right inset. */
  #main .ergo-integrated .ergo-integrated-stage:not(.ergo-integrated-wide) > .ergo-integrated-layout > .ergo-integrated-copy {
    padding-inline-end: 0;
  }
}
/* Small navigation and supporting copy retain readable contrast on light surfaces. */
.breadcrumb { color: #58666f; }
.breadcrumb span.separator,
.breadcrumb li:not(:last-child)::after { color: #657168; }
#main .section-number { color: #58666f; }
.footer-bottom { color: #58666f; }
#main .download-box p { color: #536181; }
#main .career-band .eyebrow { color: #105537; }
#main .ai-diagram-label,
#main .ai-connector,
#main .ai-foot { color: #536181; }
#main .contact-address { color: #58666f; }
.search-result span,
.search-caption,
.search-empty { color: #58666f; }
#main .ergo-integrated .ergo-integrated-proof-section .ergo-integrated-proof {
  margin: 0 auto;
  padding: 28px 0 38px;
  border: 0;
}
#main .ergo-integrated .ergo-integrated-proof > * {
  margin-top: 0;
  max-width: 100%;
}
#main .ergo-integrated .ergo-integrated-proof :is(p, strong, span) {
  -webkit-text-fill-color: currentColor;
}
@media (max-width: 850px) {
  /* Stacked copy regains equal insets without making small screens too narrow. */
  #main .ergo-integrated .ergo-integrated-copy {
    padding-inline: min(32px, var(--ergo-dark-copy-inline, 0px));
  }
  .ergo-integrated-layout,
  .ergo-integrated-wide .ergo-integrated-copy {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .ergo-integrated-wide .ergo-integrated-copy { gap: 0; }
  .ergo-integrated-wide .ergo-integrated-copy > h1,
  .ergo-integrated-wide .ergo-integrated-copy > .eyebrow,
  .ergo-integrated-wide .ergo-integrated-copy > .actions,
  #main .ergo-integrated .ergo-integrated-wide .ergo-integrated-copy > .lead {
    grid-column: auto;
    grid-row: auto;
  }
  #main .ergo-integrated .ergo-integrated-wide .ergo-integrated-copy > .lead { margin-top: 22px; }
  .ergo-integrated-art { max-width: 680px; justify-self: center; }
  #main .ergo-integrated .ergo-two-col,
  #main .ergo-integrated .ergo-protection { grid-template-columns: 1fr; }
  #main .ergo-integrated .ergo-kpi-row-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #main .ergo-integrated .ergo-integrated-stage h1 { font-size: clamp(33px, 6.5vw, 49px); }
  #main .ergo-integrated .ergo-integrated-stage .ergo-art { margin-top: 28px; }
  #main .ergo-integrated .ergo-integrated-art .ergo-art { margin-top: 0; }
}
@media (max-width: 520px) {
  .ergo-integrated-hero { padding-top: 32px; }
  #main .ergo-integrated .ergo-integrated-stage h1 { font-size: 34px; letter-spacing: -.045em; }
  #main .ergo-integrated .ergo-integrated-stage :is(.lead, .ergo-lead) { font-size: 16px; }
  #main .ergo-integrated .ergo-integrated-proof { padding: 22px 18px; }
  #main .ergo-integrated .ergo-integrated-stage .ergo-kpi-row { gap: 20px 14px; }
  #main .ergo-integrated .ergo-integrated-stage .ergo-kpi-row .ergo-number { font-size: 30px; }
  #main .ergo-integrated .ergo-integrated-stage .ergo-label { overflow-wrap: break-word; }
}
