:root {
  --screen-pad-y: clamp(190px, 24vh, 250px);
  --screen-gap-sm: 28px;
  --screen-gap-md: 40px;
  --screen-gap-lg: 64px;
  --screen-gap-xl: 88px;
}

/* Canonical section rhythm: every screen is content-driven and uses the same top/bottom spacing. */
.section,
.section-inner,
.hero,
.problems,
.sprints,
.outcomes,
.team,
.problems-inner,
.sprints-inner,
.outcomes-inner,
.team-inner {
  min-height: 0 !important;
  height: auto !important;
}

.section-inner {
  position: relative !important;
  padding: var(--screen-pad-y) var(--page-x) !important;
}

.hero .eyebrow,
.hero-title,
.hero-copy,
.hero .primary-cta,
.problems-eyebrow,
.problem-copy,
.problem-conclusion,
.sprints-heading,
.sprint-list,
.sprints-terms,
.outcomes .eyebrow,
.outcome-list,
.handoff-grid,
.handoff-cta,
.team-trust {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
}

/* Hero content flow. Background is defined only in hero-bg.css. */
.hero-heading { margin: 0 !important; }
.hero .eyebrow { margin: 0 0 var(--screen-gap-md) !important; }
.hero-title {
  display: block;
  width: min(760px, 58vw) !important;
  margin: 0 !important;
}
.hero-lead {
  margin-top: var(--screen-gap-md) !important;
}
.hero-copy {
  width: min(780px, 60vw) !important;
  margin-top: var(--screen-gap-sm) !important;
}
.hero-marquee {
  position: relative !important;
  left: calc(-1 * var(--page-x)) !important;
  right: auto !important;
  top: auto !important;
  width: 100vw;
  margin-top: var(--screen-gap-lg) !important;
}
.hero .primary-cta { margin-top: var(--screen-gap-md) !important; }
.hero-helper { margin-top: var(--screen-gap-sm) !important; }

/* Problems. */
.problems-eyebrow { margin: 0 !important; }
.problem-copy {
  margin-top: var(--screen-gap-md) !important;
  display: grid !important;
  gap: var(--screen-gap-sm) !important;
}
.problem-line { white-space: normal !important; }
.problem-conclusion { margin-top: var(--screen-gap-lg) !important; }

/* Sprints. */
.sprints-heading { margin: 0 !important; }
.sprints-heading .eyebrow { margin: 0 0 var(--screen-gap-sm) !important; }
.sprint-list { margin-top: var(--screen-gap-lg) !important; }
.sprints-terms { margin: var(--screen-gap-lg) 0 0 !important; }

/* Outcomes. */
.outcomes .eyebrow { margin: 0 !important; }
.outcome-list {
  width: var(--copy-wide) !important;
  max-width: 100% !important;
  margin: var(--screen-gap-md) 0 0 !important;
  gap: var(--screen-gap-sm) !important;
}

/* Handoff. */
.handoff-grid {
  width: var(--copy-wide) !important;
  max-width: 100% !important;
}
.handoff-cta { margin: 0 !important; }
.handoff-cta-title { margin-top: 0 !important; }

@media (max-width: 820px) {
  :root {
    --screen-pad-y: clamp(112px, 16vh, 160px);
    --screen-gap-sm: 22px;
    --screen-gap-md: 32px;
    --screen-gap-lg: 48px;
    --screen-gap-xl: 64px;
  }

  .section-inner {
    padding: var(--screen-pad-y) var(--page-x) !important;
  }

  .hero-title,
  .hero-lead,
  .hero-copy,
  .hero-helper,
  .outcome-list,
  .handoff-grid {
    width: 100% !important;
    max-width: 100% !important;
  }

  .hero-marquee {
    margin-top: var(--screen-gap-lg) !important;
  }

  .problem-copy {
    margin-top: var(--screen-gap-md) !important;
  }

  .sprint-list {
    margin-top: var(--screen-gap-lg) !important;
  }

  .sprints-terms {
    margin-top: var(--screen-gap-lg) !important;
  }

  .sprint-line {
    display: none !important;
  }
}
