/* ============================================================
   marketing.css - entry stylesheet
   Imports base + all 8 scene partials
   ============================================================ */

@import url("base.css");

@import url("scenes/hero.css");
@import url("scenes/table.css");
@import url("scenes/calculator.css");
@import url("scenes/advisor.css");
@import url("scenes/academy.css");
@import url("scenes/play.css");
@import url("scenes/tools.css");
@import url("scenes/showcase.css");
@import url("scenes/cta.css");

/* Global scene/section sizing defaults.
   Desktop: scenes are tall so they can be pinned and scrubbed.
   Mobile: each scene collapses to 100vh flow (no pin). */
.scene {
  min-height: 100vh;
}

@media (min-width: 900px) {
  .scene--pinned {
    height: 180vh;
  }
  .scene--pinned-sm {
    height: 120vh;
  }
  .scene--pinned-lg {
    height: 220vh;
  }
}

/* Generic scene inner container used across partials */
.scene__stage {
  position: relative;
  width: 100%;
  min-height: 100vh;
  display: grid;
  place-items: center;
  overflow: hidden;
}

@media (min-width: 900px) {
  .scene--pinned .scene__stage,
  .scene--pinned-sm .scene__stage,
  .scene--pinned-lg .scene__stage {
    height: 100vh;
    min-height: unset;
  }
}

/* Headline/body block used across scenes (composed end state) */
.scene__copy {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 56ch;
  text-align: center;
  padding: 0 var(--gutter);
}

.scene__copy h2 {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(2rem, 5vw, 3.6rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--text-hi);
}

.scene__copy p {
  color: var(--text-mid);
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.6;
  max-width: 52ch;
  margin-inline: auto;
}

/* When a reduced-motion user arrives, every scene shows its "end state"
   through this class added by marketing.js. */
.rm-static .scene__stage * {
  animation: none !important;
  transition: none !important;
}
