/* Cenas com scroll (story.js): a cena cabe na altura da tela enquanto está fixa. */
:root{--story-top:94px;--story-avail:calc(100vh - var(--story-top) - 16px)}
@supports (height:100dvh){:root{--story-avail:calc(100dvh - var(--story-top) - 16px)}}
@media(max-width:600px){:root{--story-top:84px}}
.story-host{position:relative;overflow-anchor:none}
.story-marker{display:flow-root;height:0}
.story-stage{display:flow-root}
.story-host.is-on>.story-stage{position:sticky;top:var(--story-top)}
.hero>.story-host{margin-top:60px}
.hero .story-stage>.hero-product{margin-top:0}
.selfservice-section>.story-host{grid-column:1/-1}
@media(max-width:900px){.hero>.story-host{margin-top:46px}}
@media(max-width:600px){.hero>.story-host{margin-top:35px}}
.story-host.is-on .hero-product{max-width:calc((var(--story-avail) - 132px) * 1.6863)}
@media(min-width:901px){
  .story-host.is-on .workflow-visual img{width:min(900px,calc((var(--story-avail) - 163px) * 1.6863))}
  .story-host.is-on .workflow-panel{min-height:min(602px,calc(var(--story-avail) - 98px))}
  .story-host.is-on .tool-visual{width:min(calc(100% - 8px),calc((var(--story-avail) - 218px) * 1.6863));justify-self:end}
}
.story-host.is-on .portal-preview{width:min(100%,calc((var(--story-avail) - 176px) * 1.58));margin-inline:auto}
.story-host.is-on .portal-stage{aspect-ratio:1477/935!important}
.story-host.is-on .portal-stage img{object-fit:contain;object-position:center}