/* theme-invest.css */
.section-vivid-invest.is-staged {
  background: #222222 !important;
  padding-bottom: 0 !important;
}

.is-staged .invest-original-cards-list,
.is-staged .mobile-carousel-indicator-bar,
.is-staged .soccer-kids-holder {
  display: none !important;
}

.is-staged .invest-header-flex {
  justify-content: flex-start !important;
  text-align: left !important;
}

.is-staged .vivid-section-title-invest {
  color: #ffffff !important;
}

.is-staged .invest-stage {
  position: relative !important;
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  height: calc(var(--chapters, 3) * 75vh + 25vh) !important;
}

.invest-stage-sticky {
  position: sticky !important;
  top: 0 !important;
  height: 100vh !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) !important;
  gap: clamp(2rem, 5vw, 5rem) !important;
  align-items: center !important;
  box-sizing: border-box !important;
  padding: 5rem clamp(1.25rem, 4vw, 3rem) 3rem !important;
}

.invest-tabs {
  list-style: none !important;
  margin: 0 0 2rem !important;
  padding: 0 !important;
}

.invest-tab {
  display: flex !important;
  align-items: baseline !important;
  gap: 1rem !important;
  width: 100% !important;
  text-align: left !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.14) !important;
  padding: 1rem 0 !important;
  color: rgba(255,255,255,0.5) !important;
  cursor: pointer !important;
  transition: color 0.3s ease !important;
}

.invest-tab.is-active {
  color: #ffffff !important;
}

.invest-tab-num {
  font-size: 0.95rem !important;
  letter-spacing: 0.1em !important;
}

.invest-tab-label {
  font-family: var(--font-serif) !important;
  font-size: clamp(1.6rem, 2.6vw, 2.4rem) !important;
  line-height: 1.1 !important;
}

.invest-panels {
  display: grid !important;
}

.invest-panel {
  grid-area: 1 / 1 !important;
  opacity: 0 !important;
  transform: translateY(14px) !important;
  transition: opacity 0.5s ease, transform 0.5s ease !important;
  pointer-events: none !important;
}

.invest-panel.is-active {
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}

.invest-panel-text {
  color: #c9c9bb !important;
  font-size: 1.0625rem !important;
  line-height: 1.7 !important;
  margin: 0 !important;
  max-width: 34rem !important;
}

.invest-panel-text strong {
  color: #ffffff !important;
}

.invest-stage-frames {
  position: relative !important;
  height: min(70vh, 640px) !important;
  border-radius: 32px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,0.08) !important;
}

.invest-frame {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  transition: opacity 0.8s ease !important;
}

.invest-frame.is-active {
  opacity: 1 !important;
}

.invest-frame img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: scale(1.06) !important;
  transition: transform 6s ease-out !important;
}

.invest-frame.is-active img {
  transform: scale(1) !important;
}

@media (prefers-reduced-motion: reduce) {
  .invest-panel,
  .invest-frame,
  .invest-frame img,
  .invest-tab {
    transition: none !important;
  }
}
.site-wrap {
  overflow-x: clip !important;
  overflow-y: visible !important;
}
