> ## Documentation Index
> Fetch the complete documentation index at: https://docs.layerfi.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Landing Page

> Landing page showcasing Layer accounting and bookkeeping services.

The LandingPage component provides a page-level component that surfaces the Layer accounting
and bookkeeping services. It acts as a landing page allowing platforms to showcase the core value proposition
and offers/pricing for the platform's end users. It supports Calendly integration for booking calls.

```tsx theme={null}
import { LandingPage } from '@layerfi/components'

<LandingPage
  platform={{
    platformName: 'Acme',
    industry: 'e-commerce',
  }}
  availableOffers={['accounting', 'bookkeeping']}
  heroOverrides={{
    stringOverrides: {
      title: 'Acme Accounting',
      subtitle: 'Manage your books with ease',
    },
    cta: {
      primary: { label: 'Get Started', url: 'https://calendly.com/your-link' },
      secondary: { label: 'Learn More', url: 'https://example.com/learn' },
    },
  }}
  offeringOverrides={{
    accounting: {
      stringOverrides: {
        title: 'Self-Service Accounting',
        priceAmount: '$29',
        priceUnit: '/month',
      },
    },
    bookkeeping: {
      stringOverrides: {
        title: 'Full-Service Bookkeeping',
        priceAmount: '$299',
        priceUnit: '/month',
      },
    },
  }}
/>
```

### Properties

<ParamField body="platform" required="true" type="LandingPagePlatformConfig">
  Platform configuration with branding details.

  <Expandable title="LandingPagePlatformConfig properties">
    <ParamField body="platformName" required="true" type="string">
      The platform/brand name displayed throughout the component (e.g., "Acme, Inc."). Used in titles, descriptions, and feature text.
    </ParamField>

    <ParamField body="industry" required="true" type="string">
      The target industry for customization (e.g., "e-commerce", "SaaS", "retail"). Used to tailor feature descriptions and messaging. If industry name substitution does not work well, overwrite the value propositions directly.
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="availableOffers" required="true" type="('accounting' | 'bookkeeping')[]">
  Array specifying which service offerings to display. Can include `'accounting'`, `'bookkeeping'`, or both.
</ParamField>

<ParamField body="heroOverrides" required="true" type="DeepPartial<HeroContentConfig>">
  Partial overrides for the hero/main content section. All fields are optional and will fall back to defaults.

  <Expandable title="HeroContentConfig properties">
    <ParamField body="stringOverrides" type="HeroStringOverrides">
      Text overrides for the hero section.

      <Expandable title="HeroStringOverrides properties">
        <ParamField body="title" type="string">
          Main hero title. Supports `{{platformName}}` and `{{industry}}` template variables.
        </ParamField>

        <ParamField body="subtitle" type="string">
          Subtitle text below the title. Supports template variables.
        </ParamField>

        <ParamField body="heading1" type="string">
          First feature heading. Supports template variables.
        </ParamField>

        <ParamField body="heading1Desc" type="string">
          Description for the first feature heading.
        </ParamField>

        <ParamField body="heading2" type="string">
          Second feature heading. Supports template variables.
        </ParamField>

        <ParamField body="heading2Desc" type="string">
          Description for the second feature heading.
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body="mediaUrls" type="HeroMediaUrls">
      <Expandable title="HeroMediaUrls properties">
        <ParamField body="topOfFoldImage" type="string">
          URL of the hero image displayed next to the main content.
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body="cta" type="HeroCtaConfig">
      Call-to-action button configuration.

      <Expandable title="HeroCtaConfig properties">
        <ParamField body="primary" type="LandingPageLink">
          Primary CTA button. If the URL is a Calendly link, opens a Calendly modal. Otherwise, opens a new tab.

          <Expandable title="LandingPageLink properties">
            <ParamField body="label" type="string">Button text label.</ParamField>
            <ParamField body="url" type="string">Destination URL.</ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="secondary" type="LandingPageLink">
          Secondary "Learn More" button. If not provided, the learn more button is not rendered.
        </ParamField>
      </Expandable>
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="offeringOverrides" required="true" type="OfferingOverrides">
  Partial overrides for the service offering cards.

  <Expandable title="OfferingOverrides properties">
    <ParamField body="stringOverrides" type="OfferingSectionStringOverrides">
      <Expandable title="OfferingSectionStringOverrides properties">
        <ParamField body="sectionTitle" type="string">
          Title text for the offerings section.
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body="accounting" type="DeepPartial<LandingPageCardConfig>">
      Overrides for the accounting service card.

      <Expandable title="LandingPageCardConfig properties">
        <ParamField body="stringOverrides" type="LandingPageCardStringOverrides">
          <Expandable title="LandingPageCardStringOverrides properties">
            <ParamField body="badge" type="string">Small label/tag on the card (e.g., "Most Popular").</ParamField>
            <ParamField body="title" type="string">Card heading (e.g., "Self-Service Accounting").</ParamField>
            <ParamField body="subtitle" type="string">Card description text.</ParamField>
            <ParamField body="priceAmount" type="string">Price display (e.g., "\$29").</ParamField>
            <ParamField body="priceUnit" type="string">Billing frequency (e.g., "/month").</ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="mediaUrls" type="LandingPageCardMediaUrls">
          <Expandable title="LandingPageCardMediaUrls properties">
            <ParamField body="offerImage" type="string">URL of the card image.</ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="cta" type="LandingPageCardCtaConfig">
          <Expandable title="LandingPageCardCtaConfig properties">
            <ParamField body="primary" type="LandingPageLink">CTA button with label and URL. Calendly URLs open a modal.</ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="showStartingAtLabel" type="boolean">Whether to show "Starting at" label above the price.</ParamField>
      </Expandable>
    </ParamField>

    <ParamField body="bookkeeping" type="DeepPartial<LandingPageCardConfig>">
      Overrides for the bookkeeping service card. Same shape as `accounting`.
    </ParamField>
  </Expandable>
</ParamField>
