/* Scene 7 — 기능을 UI 카드가 아니라 하나의 편집된 목록으로 보여 준다. */
.s7o__inner {
  position: absolute;
  left: var(--ns-stage-inset);
  right: var(--ns-stage-inset);
  top: var(--ns-dimension-x30);
  bottom: var(--ns-dimension-x30);
  display: grid;
  grid-template-columns: 610px 1fr;
  column-gap: var(--ns-dimension-x24);
  align-items: start;
}

.s7o__head {
  padding-top: var(--ns-dimension-x4_5);
  opacity: 0;
  transform: translateY(var(--ns-dimension-x9));
  transition: opacity 620ms var(--ns-timing-function-enter),
              transform 620ms var(--ns-timing-function-enter);
}
.s7o[data-step="1"] .s7o__head,
.s7o[data-step="2"] .s7o__head,
.s7o[data-step="3"] .s7o__head { opacity: 1; transform: none; }

.s7o__title {
  font-size: var(--ns-font-size-section-title);
  line-height: var(--ns-line-height-section-title);
  letter-spacing: var(--ns-letter-spacing-section-title);
  font-weight: var(--ns-font-weight-heavy);
}

.s7o__list {
  align-self: center;
}
.s7o .ns-feature-list__item {
  position: relative;
  opacity: 0;
  transform: translateX(var(--ns-dimension-x10));
  transition: opacity 520ms var(--ns-timing-function-enter),
              transform 620ms var(--ns-timing-function-enter);
  transition-delay: calc(var(--item-index) * 210ms);
}
.s7o[data-step="2"] .ns-feature-list__item,
.s7o[data-step="3"] .ns-feature-list__item { opacity: 1; transform: none; }
