/* global React, ReactDOM, Nav, Hero, TrustStrip, Problem, Platform,
          UnifiedAsset, Capabilities, UseCases, ROI, CaseStudy, Technology, Security,
          About, FinalCTA, Footer,
          TweaksPanel, TweakSection, TweakRadio, TweakSelect, useTweaks */

const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "headlineVariant": "primary"
}/*EDITMODE-END*/;

const HEADLINES = {
  "primary":   "AI Infrastructure Intelligence for Critical Assets",
  "decisions": "Turn Infrastructure Data Into Risk-Ranked Engineering Decisions",
  "inspector": "The AI Digital Inspector for Tunnels, Bridges, and Critical Infrastructure",
  "network":   "Detect, Measure, and Prioritise Infrastructure Risks at Network Scale",
};

function App() {
  const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
  const headline = HEADLINES[t.headlineVariant] || HEADLINES.primary;

  return (
    <>
      <Nav />
      <Hero headline={headline} />
      <TrustStrip />
      <Problem />
      <Platform />
      <UnifiedAsset />
      <Capabilities />
      <UseCases />
      <ROI />
      <CaseStudy />
      <Technology />
      <Security />
      <About />
      <FinalCTA />
      <Footer />

      <TweaksPanel title="Tweaks">
        <TweakSection label="Headline">
          <TweakSelect
            label="Hero headline variant"
            value={t.headlineVariant}
            onChange={(v) => setTweak("headlineVariant", v)}
            options={[
              { value: "primary",   label: "AI Infrastructure Intelligence for Critical Assets" },
              { value: "decisions", label: "Turn Infrastructure Data Into Risk-Ranked Decisions" },
              { value: "inspector", label: "The AI Digital Inspector for Tunnels & Bridges" },
              { value: "network",   label: "Detect, Measure, and Prioritise at Network Scale" },
            ]}
          />
        </TweakSection>

      </TweaksPanel>
    </>
  );
}

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