// Cortile marketing site — sections part 2: Managers, Residents, Compliance, Trust, FAQ, CTA, Footer + App. const DS2 = window.CortileDesignSystem_c3fab1; const { Button: Btn, Badge: Bdg } = DS2; // reuse helpers from sections-1 (already on window): LIcon, Container, Eyebrow, SectionHead const SANS2 = "var(--font-sans)"; const SERIF2 = "var(--font-serif)"; // ─────────────────────── For Property Managers ─────────────────────── function ForManagers({ t }) { return (
{t.managers.points.map((p) => (
{p.title}
{p.body}
))}
); } // small admin-console preview (browser frame) function AdminMock() { return (
{["#E29E6E", "#DDD3BE", "#B8AE9A"].map((c) => )} admin.cortile.app
{[["layout-dashboard", "總覽", true], ["users", "住戶", false], ["wrench", "工單", false], ["receipt-text", "帳務", false], ["megaphone", "公告", false]].map(([ic, lb, on]) => (
{lb}
))}
嘉庭軒 · 總覽
{[["待繳帳單", "12"], ["處理中工單", "5"], ["本月繳費率", "96%"]].map(([lb, v]) => (
{lb}
{v}
))}
{[["1802 室 · 管理費", "待繳", "warning"], ["走廊燈故障", "已派工", "success"], ["地下水管滲漏", "處理中", "info"]].map(([title, st, c]) => (
{title} {st}
))}
); } // ─────────────────────── For Residents ─────────────────────── function ForResidents({ t }) { return (
{t.residents.points.map((p) => (

{p.title}

{p.body}

))}
); } // ─────────────────────── Pricing ─────────────────────── function Pricing({ t }) { if (!t.pricing) return null; const mailto = (plan) => { const subject = encodeURIComponent(`Cortile ${plan.name}`); const body = encodeURIComponent(`你好，我想了解 Cortile ${plan.name}。\n\n物業 / 機構名稱：\n地區：HK / TW / MO\n大廈名稱：\n聯絡人：\n電話：`); return `mailto:${t.pricing.email}?subject=${subject}&body=${body}`; }; const card = (plan, featured) => (
{featured &&
}
{plan.badge}

{plan.name}

{plan.audience}

{plan.price} {plan.period && {plan.period}}
{plan.promo}
    {plan.features.map((feature) => (
  • {feature}
    • ))}
{plan.cta}

{plan.note}

); return (
{card(t.pricing.standard, false)} {card(t.pricing.flagship, true)}
); } // ─────────────────────── Compliance ─────────────────────── function Compliance({ t }) { return (
{t.compliance.points.map((p) => (
{p}
))}
{t.compliance.regions.map((r) => (
{r.code}
{r.name}
{r.law}
))}
資料中心 · 台灣
); } // ─────────────────────── Trust & Security ─────────────────────── function Trust({ t }) { return (
{t.trust.eyebrow}

{t.trust.title}

{t.trust.items.map((it) => (
{it.title}
{it.body}
))}
{t.trust.links.privacy} {t.trust.links.terms}
); } // ─────────────────────── FAQ ─────────────────────── function FAQ({ t }) { const [open, setOpen] = React.useState(0); return (
{t.faq.items.map((it, i) => { const isOpen = open === i; return (
{isOpen && (
{it.a}
)}
); })}
); } // ─────────────────────── Final CTA ─────────────────────── function FinalCTA({ t }) { return (
); } // ─────────────────────── Footer ─────────────────────── function Footer({ t }) { return ( ); } function FootCol({ title, items, hrefs }) { return (
{title}
{items.map((it, i) => ( {it} ))}
); } // ─────────────────────── App ─────────────────────── function MarketingApp() { const [lang, setLang] = React.useState(() => localStorage.getItem("cortile_lang") || "zh"); const t = window.CORTILE_COPY[lang]; React.useEffect(() => { localStorage.setItem("cortile_lang", lang); document.documentElement.lang = lang === "zh" ? "zh-Hant" : "en"; const id = requestAnimationFrame(() => window.lucide && window.lucide.createIcons()); return () => cancelAnimationFrame(id); }, [lang]); return (
); } Object.assign(window, { ForManagers, ForResidents, Pricing, Compliance, Trust, FAQ, FinalCTA, Footer, MarketingApp });