/* global React, ReactDOM, useTweaks, TweaksPanel, TweakSection, TweakRadio, TweakColor, TweakSelect */ const { useState, useEffect, useRef } = React; const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{ "surface": "paper", "accent": "#ff4800", "hero": "pipeline" }/*EDITMODE-END*/; function App() { const [tweaks, setTweak] = useTweaks(TWEAK_DEFAULTS); const [bookingOpen, setBookingOpen] = useState(false); // Apply surface + accent to useEffect(() => { document.body.dataset.surface = tweaks.surface; document.body.dataset.accent = "1"; document.body.style.setProperty("--accent-override", tweaks.accent); }, [tweaks.surface, tweaks.accent]); // Scroll reveals useEffect(() => { const els = document.querySelectorAll('.reveal'); const io = new IntersectionObserver((entries) => { entries.forEach(e => { if (e.isIntersecting) { e.target.classList.add('is-visible'); io.unobserve(e.target); } }); }, { threshold: 0.12 }); els.forEach(el => io.observe(el)); return () => io.disconnect(); }, []); const openBooking = () => setBookingOpen(true); return ( <>
{/* HERO */}
{tweaks.hero === 'editorial' ? (
Sales agent · scoped, not self-serve

The sales agent you hire before your next rep.

Portant.ai runs every deal from meeting booked to signed contract. Drafts the follow-ups. Builds the proposals, quotes, and contracts. Schedules the calls your reps need to make. Closes the loop.

See how it works
) : (
Sales agent · scoped, not self-serve

The sales agent you hire before your next rep.

Portant.ai runs every deal from meeting booked to signed contract. Drafts the follow-ups. Builds the proposals, quotes, and contracts. Schedules the calls your reps need to make. Closes the loop.

See how it works
Built by the Portant team HubSpot Leading Tier Partner 4.9 on G2 · 3,000+ installs
{tweaks.hero === 'pipeline' && } {tweaks.hero === 'product' && } {tweaks.hero === 'layered' && }
)}
{/* Trust strip below hero in non-editorial */} {tweaks.hero === 'editorial' && (
)}