/* Each story owns the visible screen below the fixed navigation.
   Minimum heights keep longer copy and enlarged text in the normal document flow. */
:root {
  --header-height: 84px;
  --story-height: calc(100vh - var(--header-height));
  --story-padding: clamp(64px, 8vh, 112px);
  scroll-padding-top: var(--header-height);
}
/* Browser chrome must not resize every preceding section while someone scrolls. */
@supports (height: 100svh) {
  :root {
    --story-height: calc(100svh - var(--header-height));
    --story-padding: clamp(64px, 8svh, 112px);
  }
}
main > .story {
  min-height: var(--story-height);
  scroll-margin-top: 0;
}
.story.section-wrap {
  width: 100%;
  max-width: none;
  padding-inline: max(clamp(24px, 6.5vw, 100px), calc((100% - 1200px) / 2));
}
main > .story:not(.savings-scenes):not(.closing) {
  padding-block: var(--story-padding);
}
.intro.story,
.everyday.story,
.trust.story {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.intro-index {
  width: 100%;
}
.editorial.story,
.assistant-section.story,
.faq.story {
  align-content: center;
}
.faq.story {
  align-items: center;
}
@media (max-width: 800px) {
  :root {
    --header-height: 72px;
  }
}
@media (max-width: 700px) {
  :root {
    --story-padding: 64px;
  }
  .story.section-wrap {
    padding-inline: 24px;
  }
  /* The final invitation is shorter on phones; long or enlarged text can still grow. */
  main > .closing.story {
    min-height: min(640px, var(--story-height));
  }
}