/* Services — three service cards. */
function Services({ go }) {
  const DS = window.OcaInteriorsDesignSystem_2c041d;
  const P = window.OcaPlaceholders;
  const { NavBar, SectionHeading, ServiceCard } = DS;
  return (
    <div style={{ background: "var(--surface-page)", minHeight: "100%" }}>
      <NavBar active="Services" items={window.ocaNavItems(go)} />
      <div style={{ maxWidth: "var(--max-content)", margin: "0 auto", padding: "40px 40px 80px" }}>
        <SectionHeading title="Services" size="lg" style={{ marginBottom: 48 }} />
        <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 48 }}>
          <ServiceCard
            title="Full-Service Design"
            image={P.kitchen}
            body="From initial concept to crafting your dream home, we're here to provide guidance, coordination, and seamless project management while ensuring that every detail reflects your distinct preferences and personality."
          />
          <ServiceCard
            title="Furnishing and Styling"
            image={P.patio}
            body="Whether indoors or outdoors, we love to curate and style unique pieces tailored to fit seamlessly into your spaces."
          />
          <ServiceCard
            title="Planning"
            image={P.plan}
            body="We're also here to assist you with the initial planning stages of your project, recognizing that embarking on such a significant commitment requires thoughtful consideration and guidance."
          />
        </div>
      </div>
      <window.Footer />
    </div>
  );
}
window.Services = Services;