/**
 * Top page: alternating section backgrounds (white ↔ gray).
 * Loaded after pc.css / sp.css / faq.css on the top page only.
 */
.renewal-section.mainSection {
  --top-band-white: #fff;
  --top-band-gray: var(--strap_background, #f5f5f5);
}

/* —— White bands —— */
.renewal-section.mainSection > .visualWrap,
.renewal-section.mainSection > .clientLogoWrap,
.renewal-section.mainSection > .partnerWrap.partnerWrap--whyLas,
.renewal-section.mainSection > .flowAllInOne.contentsWrap,
.renewal-section.mainSection > article#use_scene.use_scene {
  background: var(--top-band-white);
}

/* —— Gray bands —— */
.renewal-section.mainSection > .founderWrap,
.renewal-section.mainSection > .customer_reviews_section,
.renewal-section.mainSection > .partnerWrap:not(.partnerWrap--whyLas),
.renewal-section.mainSection > .faqTeaserWrap {
  background: var(--top-band-gray);
}

/* Articles: gray when FAQ block is absent; white when FAQ precedes */
.renewal-section.mainSection > article#use_scene + .paymentWrap.check-wrap {
  background: var(--top-band-gray);
}
.renewal-section.mainSection > .faqTeaserWrap + .paymentWrap.check-wrap {
  background: var(--top-band-white);
}

/* Contact form: opposite of the articles band above */
.renewal-section.mainSection > article#use_scene + .paymentWrap.check-wrap + .systemWrap.flow-guide {
  background: var(--top-band-white);
}
.renewal-section.mainSection > .faqTeaserWrap + .paymentWrap.check-wrap + .systemWrap.flow-guide {
  background: var(--top-band-gray);
}