/* Share the existing palette across two or three complete scenes per surface.
   Also applies in normal flow and reduced motion, without JavaScript. */
#main > [data-component-name="landing-scroll-panel"] {
  --landing-panel-inset: clamp(4rem, 6.667vw, 6rem);
  --landing-scene-gap: clamp(4rem, 6.667vw, 6rem);
  --landing-heading-gap: clamp(2rem, 3.334vw, 3rem);
  background: var(--landing-panel-background);
  padding-block: var(--landing-panel-inset);
}
#main > [data-scroll-panel="base"] {
  --landing-panel-background: #02090a;
  /* The curved lip already occupies part of the visible gap above this card. */
  padding-block-start: max(0px, calc((var(--landing-panel-inset) - var(--space-3xl)) / 2));
}
#main > [data-scroll-panel="planning"] {
  --landing-panel-background: linear-gradient(180deg, #2c007f 42.49%, #000a1e 100%);
}
#main > [data-scroll-panel="operations"] {
  --landing-panel-background: #041e18;
}
#main > [data-scroll-panel="closing"] {
  --landing-panel-background: #000a1e;
}
#main > [data-component-name="landing-scroll-panel"]:not([data-scroll-panel="base"]) {
  border-radius: 2rem 2rem 0 0;
}
@media (min-width: 48rem) {
  #main > [data-component-name="landing-scroll-panel"]:not([data-scroll-panel="base"]) {
    border-radius: 3rem 3rem 0 0;
  }
}
/* Only source main children and their optional one-level section wrappers.
   Backgrounds inside illustrations, previews, cards and players stay intact. */
#main > [data-component-name="landing-scroll-panel"] > :is(section, div),
#main > [data-component-name="landing-scroll-panel"] > div > section {
  background: transparent;
  padding-block: 0;
}
/* Reordered scenes no longer inherit both their old exit and entry padding.
   One shared gap separates scenes; the pricing headline stays with its body. */
#main > [data-component-name="landing-scroll-panel"] > :is(section, div) + :is(section, div) {
  margin-block-start: var(--landing-scene-gap);
}
#main > [data-scroll-panel="operations"] > [data-component-name="home-stats-section"] {
  margin-block-start: var(--landing-heading-gap);
}
/* Desktop product tiles extend above the pricing art. Reserve that space
   between the intro and pricing so the moving products never cross the title. */
@media (min-width: 40rem) {
  #main > [data-scroll-panel="operations"] {
    --landing-heading-gap: clamp(5rem, 8.889vw, 8rem);
  }
}
/* The source's optical negative margin clipped the top of the moved tab title. */
#main [data-component-name="home-ab-section"] [role="tablist"] {
  margin-block: 0;
}
