/* Why entrepreneurs page */

.why-page .section {
  width: min(100%, var(--page-max));
  margin-inline: auto;
}

.why-band {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.why-band--sand { background: var(--color-sand); }
.why-band--forest { background: var(--color-forest); }

#why-opening {
  padding: 96px var(--gutter);
  gap: 28px;
}

#why-opening .display--xl { max-width: 960px; }
#why-opening .lead { max-width: 660px; }

#why-history {
  padding: 80px var(--gutter);
  gap: 18px;
}

#why-history .display {
  font-size: 50px;
  line-height: 1.06;
  letter-spacing: -1px;
  max-width: 860px;
  color: #000;
}

#why-history .body { max-width: 680px; }

#why-recognition {
  padding: 104px var(--gutter);
  gap: 20px;
}

#why-recognition .display {
  font-size: 52px;
  line-height: 1.04;
  letter-spacing: -1px;
  max-width: 820px;
}

#why-recognition .body { max-width: 700px; }

#why-experience,
#why-role {
  padding: 112px var(--gutter) 76px;
  gap: 20px;
}

#why-experience .display--sm,
#why-role .display--sm,
#why-essence .display--sm,
#why-closing .display--sm {
  max-width: 820px;
}

#why-experience .body,
#why-role .body,
#why-essence .body,
#why-fit .body,
#why-closing .body {
  max-width: 700px;
}

#why-essence {
  padding: 104px var(--gutter);
  gap: 20px;
}

#why-fit {
  padding: 104px var(--gutter);
  gap: 20px;
}

#why-fit .display {
  font-size: 50px;
  line-height: 1.06;
  letter-spacing: -1px;
  max-width: 820px;
}

#why-closing {
  padding: 112px var(--gutter) 88px;
  gap: 24px;
}

.why-closing__ctas {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  margin-top: 8px;
}

@media (max-width: 1199px) {
  #why-history .display,
  #why-recognition .display,
  #why-fit .display {
    font-size: 40px;
  }
}

@media (max-width: 809px) {
  #why-opening { padding: 48px var(--gutter) 40px; gap: 18px; }
  #why-history { padding: 48px var(--gutter); }
  #why-recognition,
  #why-essence,
  #why-fit { padding: 64px var(--gutter); }
  #why-experience,
  #why-role { padding: 64px var(--gutter) 48px; }
  #why-closing { padding: 64px var(--gutter) 48px; }
  #why-history .display,
  #why-recognition .display,
  #why-fit .display { font-size: 32px; }
}