.site-header,
.hero,
.company-story,
.team-chapter,
.bird-product-reveal,
.statement,
.feature-story,
.modules,
.workflow-section,
.capabilities-section,
.teams-section,
.proof-section,
.faq-section,
.quote-band,
.final-cta,
footer {
  padding-left: max(24px, calc((100vw - 1380px) / 2));
  padding-right: max(24px, calc((100vw - 1380px) / 2));
}

.company-story-grid,
.depth-shell,
.team-heading,
.team-grid,
.product-reveal-heading,
.product-reveal-frame,
.capabilities-head,
.capability-tabs,
.capability-stage {
  width: 100%;
  max-width: 1380px;
  margin-left: auto;
  margin-right: auto;
}

.quote-band > p,
.final-cta > .eyebrow,
.final-cta > h2,
.final-cta > p {
  max-width: 1380px;
  margin-left: auto;
  margin-right: auto;
}

.depth-shell {
  width: min(calc(100% - 48px), 1380px);
}

.workflow-intro {
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: clamp(60px, 8vw, 130px);
  max-width: 1380px;
  margin-left: auto;
  margin-right: auto;
}

.workflow-title .eyebrow {
  margin-bottom: 34px;
}

.workflow-intro > p {
  max-width: 440px;
  margin-top: 64px;
}

.workflow-steps {
  max-width: 1380px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 980px) {
  .workflow-intro {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .workflow-intro > p {
    margin-top: 0;
  }
}

@media (max-width: 650px) {
  .site-header,
  .hero,
  .company-story,
  .team-chapter,
  .bird-product-reveal,
  .statement,
  .feature-story,
  .modules,
  .workflow-section,
  .capabilities-section,
  .teams-section,
  .proof-section,
  .faq-section,
  .quote-band,
  .final-cta,
  footer {
    padding-left: 24px;
    padding-right: 24px;
  }
}
