// PSM Expert — Página de Contato (somente canais diretos)
function Channel({ href, target, iconBg, iconColor, icon, title, value, hint, primary }) {
const inner = (
{title}
{value}
{hint ? {hint} : null}
{href ? : null}
);
const style = { ...ct.card, ...(primary ? ct.cardPrimary : {}) };
const hoverIn = (e) => { e.currentTarget.style.transform = "translateY(-3px)"; e.currentTarget.style.boxShadow = "0 18px 40px rgba(7,28,54,.12)"; e.currentTarget.style.borderColor = "#F5A623"; };
const hoverOut = (e) => { e.currentTarget.style.transform = "none"; e.currentTarget.style.boxShadow = "0 1px 0 rgba(7,28,54,.04)"; e.currentTarget.style.borderColor = primary ? "#CFE9D8" : "#E8ECF1"; };
if (!href) return
{inner}
;
return (
{inner}
);
}
function ContatoPage() {
return (
Canais diretos
Escolha como prefere falar com a nossa equipe técnica. Atendemos
empresas de todo o Brasil, presencial ou remotamente.
Atendimento rápido e personalizado. Sem compromisso · proposta técnica detalhada · resposta em até 48 horas.
);
}
const ct = {
wrap: { background: "#F4F6F8" },
inner: { maxWidth: 920, margin: "0 auto", padding: "64px 32px 84px" },
head: { textAlign: "center", maxWidth: 620, margin: "0 auto 40px" },
h2: { fontFamily: "'Barlow Condensed', sans-serif", fontWeight: 700, fontSize: 36, color: "#071C36", margin: "0 0 14px", textTransform: "uppercase", letterSpacing: ".01em" },
rule: { width: 56, height: 3, background: "#F5A623", borderRadius: 2, margin: "0 auto 20px" },
lead: { fontFamily: "'IBM Plex Sans', sans-serif", fontSize: 16, lineHeight: 1.65, color: "#6B7785", margin: 0 },
grid: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 18 },
card: { display: "flex", alignItems: "center", gap: 16, padding: "22px 22px", background: "#fff", border: "1px solid #E8ECF1", borderRadius: 14, boxShadow: "0 1px 0 rgba(7,28,54,.04)", textDecoration: "none", transition: "transform .16s, box-shadow .16s, border-color .16s" },
cardPrimary: { borderColor: "#CFE9D8", background: "linear-gradient(180deg,#FaFefb 0%,#fff 60%)" },
chIcon: { flex: "none", width: 52, height: 52, borderRadius: 12, display: "flex", alignItems: "center", justifyContent: "center" },
chBody: { flex: 1, minWidth: 0 },
chT: { display: "block", fontFamily: "'Barlow Condensed', sans-serif", fontWeight: 700, fontSize: 21, color: "#071C36", textTransform: "uppercase", letterSpacing: ".01em", lineHeight: 1.1 },
chD: { display: "block", fontFamily: "'IBM Plex Mono', monospace", fontSize: 14, color: "#17304D", marginTop: 3 },
chHint: { display: "block", fontFamily: "'IBM Plex Sans', sans-serif", fontSize: 12.5, color: "#6B7785", marginTop: 6, lineHeight: 1.4 },
assure: { display: "flex", alignItems: "center", justifyContent: "center", gap: 11, marginTop: 28, padding: "16px 22px", background: "#E6F2EC", borderRadius: 12, fontFamily: "'IBM Plex Sans', sans-serif", fontSize: 14, color: "#1A7A4A", textAlign: "center", lineHeight: 1.5 },
};
ReactDOM.createRoot(document.getElementById("root")).render();