/* global React,
   BSPNav, BSPHero, BSPTrust, BSPFooter,
   ServicesSection, AboutSection, WhyUsSection, ReviewsSection,
   BlogSection, ContactSection */

/* =========================================================
   BSpoke — Single-page composer.

   Renders the entire site as one long scroll. Top nav uses
   anchor links (#home / #services / #about / #why-us /
   #reviews / #blog / #contact) and highlights whichever
   section is in view.
   ========================================================= */

function SinglePageSite() {
  return (
    <div className="bspoke-site dir-atmospheric">
      <BSPNav style="editorial" variant="light" logoBacking="cream" />

      {/* #home — atmospheric hero. The hero <section> renders its own
          id="top"; we wrap it so the scroll anchor "home" lands here. */}
      <div id="home" className="sp-section">
        <BSPHero variant="atmospheric" />
      </div>

      {/* Trust strip immediately follows the hero — light reinforcement
          before we get into the meatier sections. */}
      <BSPTrust accent="teal" />

      {/* Each Section component already wraps its content in a top-level
          <SinglePageIntro> with the right anchor id. */}
      <ServicesSection />
      <AboutSection />
      <WhyUsSection />
      <ReviewsSection />
      <BlogSection />
      <ContactSection />

      <BSPFooter />
    </div>
  );
}

window.SinglePageSite = SinglePageSite;