/* About — firm intro + team bio. */
function About({ go }) {
  const DS = window.OcaInteriorsDesignSystem_2c041d;
  const { NavBar } = DS;
  const pStyle = window.ocaPStyle;
  return (
    <div style={{ background: "var(--surface-page)", minHeight: "100%" }}>
      <NavBar active="About" items={window.ocaNavItems(go)} />

      <div
        style={{
          maxWidth: "var(--max-content)",
          margin: "0 auto",
          padding: "56px 40px 96px",
        }}
      >
        <div style={{ display: "grid", gridTemplateColumns: "160px 1fr", gap: 40, marginBottom: 72 }}>
          <h2 data-edit="about.heading" style={{ margin: 0, fontFamily: "var(--font-display)", fontWeight: 400, fontSize: 28, color: "var(--text-heading)" }}>
            About
          </h2>
          <div>
            <p data-edit="about.firm1" style={pStyle}>
              Oca is a full-service design firm dedicated to transforming your house into unique and functional spaces.
            </p>
            <p data-edit="about.firm2" style={{ ...pStyle, marginTop: 18 }}>
              From new builds to full-scale remodels to room restyling, we help you curate architectural details and
              selections, furnishing, fabrics and accessories to enhance your living experience.
            </p>
            <p data-edit="about.firm3" style={{ ...pStyle, marginTop: 18 }}>
              Schedule a consultation to take the first step towards building the home of your dreams!
            </p>
          </div>
        </div>

        <div style={{ display: "grid", gridTemplateColumns: "160px 1fr 340px", gap: 40, alignItems: "start" }}>
          <h2 data-edit="about.teamHeading" style={{ margin: 0, fontFamily: "var(--font-display)", fontWeight: 400, fontSize: 28, color: "var(--text-heading)" }}>
            Team
          </h2>
          <div>
            <p data-edit="about.bio1" style={pStyle}>
              Elena's roots are in São Paulo, Brazil, where she grew up between the homes of her boho-chic mother and
              truly minimalist architect father. Her upbringing in the dynamic cityscape, weekends at the beach and
              vacations at the ranch, complemented by years living in Italy and the USA (Austin included!), added
              layers to her sense of aesthetics, developing an appreciation for a sophisticated yet relaxed approach
              to living.
            </p>
            <p data-edit="about.bio2" style={{ ...pStyle, marginTop: 18 }}>
              With a background in product and graphic design and a brief foray into the agribusiness realm, Elena
              returned to Austin in 2016 where she completed her Master's Degree in Interior Design at UT Austin's
              School of Architecture.
            </p>
            <p data-edit="about.bio3" style={{ ...pStyle, marginTop: 18 }}>
              As an interior designer, Elena goes beyond aesthetics, focusing on creating functional and inviting
              spaces. For her, it's not just about designing rooms; it's about elevating your daily experience by
              crafting unique and personalized designs tailored to meet your needs.
            </p>
            <p data-edit="about.bio4" data-edit-html="true" style={{ ...pStyle, marginTop: 32 }}>
              <strong style={{ color: "var(--text-heading)" }}>Fun fact:</strong> Elena grew up in a spherical house,
              and that unique experience might be the reason she always thinks outside the box!
            </p>
          </div>
          <div
            style={{
              height: 700,
              borderRadius: "var(--radius-card)",
              backgroundImage: 'url("assets/teamElena.jpg")',
              backgroundSize: "cover",
              backgroundPosition: "center",
              boxShadow: "var(--shadow-md)",
            }}
            role="img"
            aria-label="Elena, Oca Interiors & Design"
          />
        </div>
      </div>

      <window.Footer />
    </div>
  );
}

window.About = About;