/* global React, ReactDOM, Nav, Hero, Dashboard, Journey, Results, Calculator, Comparison, MeetMoi, FAQ, FinalCTA, Footer */
const { useEffect } = React;

const DEFAULTS = {
  "brand": "Ad Scaling",
  "tagline": "We fill your calendar, follow up with every lead, and only get paid when you win. Built for clinics, home services, and coaches.",
  "accent": "#9b6bff"
};

function App() {
  const tweaks = DEFAULTS;

  useEffect(() => {
    document.documentElement.style.setProperty("--violet", tweaks.accent);
    document.documentElement.style.setProperty("--v-400", tweaks.accent);
  }, [tweaks.accent]);

  return (
    <>
      <div className="world-bg" />
      <div className="world-grid" />
      <Nav brand={tweaks.brand} />
      <Hero tagline={tweaks.tagline} />
      <Dashboard />
      <Journey />
      <Results />
      <Calculator />
      <Comparison />
      <MeetMoi />
      <FAQ />
      <FinalCTA />
      <Footer brand={tweaks.brand} />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(<App />);