---
version: alpha
name: Naomi Actor Profile
description: Editorial casting profile LP for an actor whose presence is shown through silence, portrait, and 出演メモ.
colors:
  primary: "#1C1B18"
  secondary: "#7A7065"
  tertiary: "#9B2F22"
  neutral: "#F7F4EE"
  paper: "#F7F4EE"
  paperWarm: "#EBE4D8"
  blackPanel: "#0D0C0A"
  ink: "#1C1B18"
  muted: "#7A7065"
  line: "#D8CFC2"
  onDark: "#F7F4EE"
  onLight: "#1C1B18"
typography:
  displayName:
    fontFamily: "Inter, Helvetica Neue, Arial, Hiragino Sans, Yu Gothic, sans-serif"
    fontSize: 8rem
    fontWeight: 900
    lineHeight: 0.86
    letterSpacing: "-0.08em"
  displayCatch:
    fontFamily: "Hiragino Sans, Yu Gothic, Noto Sans JP, sans-serif"
    fontSize: 3rem
    fontWeight: 700
    lineHeight: 1.18
    letterSpacing: "-0.05em"
  bodyMd:
    fontFamily: "Hiragino Sans, Yu Gothic, Noto Sans JP, sans-serif"
    fontSize: 1rem
    fontWeight: 500
    lineHeight: 1.9
  labelMono:
    fontFamily: "SFMono-Regular, Menlo, Consolas, monospace"
    fontSize: 0.75rem
    fontWeight: 700
    lineHeight: 1.4
    letterSpacing: "0.14em"
rounded:
  none: 0px
  sm: 4px
  md: 14px
  lg: 26px
  pill: 9999px
spacing:
  sm: 8px
  md: 16px
  lg: 24px
  xl: 48px
  sectionPc: 104px
  sectionMobile: 68px
components:
  profileCover:
    backgroundColor: "{colors.paper}"
    textColor: "{colors.ink}"
    rounded: "{rounded.none}"
    padding: 48px
  blackPortraitPanel:
    backgroundColor: "{colors.blackPanel}"
    textColor: "{colors.onDark}"
    rounded: "{rounded.none}"
    padding: 32px
  noteRow:
    backgroundColor: "{colors.paper}"
    textColor: "{colors.ink}"
    rounded: "{rounded.none}"
    padding: 24px
  profileSheet:
    backgroundColor: "{colors.paperWarm}"
    textColor: "{colors.ink}"
    rounded: "{rounded.md}"
    padding: 32px
  quietButton:
    backgroundColor: "{colors.ink}"
    textColor: "{colors.onDark}"
    rounded: "{rounded.pill}"
    padding: 12px
  castingContact:
    backgroundColor: "{colors.paper}"
    textColor: "{colors.ink}"
    rounded: "{rounded.none}"
    padding: 42px
  inquiryForm:
    backgroundColor: "{colors.paper}"
    textColor: "{colors.ink}"
    rounded: "{rounded.none}"
    padding: 42px
---

## Overview

This is the handoff design spec for `lps/actor-naomi.html`.

The page should not feel like a normal LP with a big headline and repeated cards. It should feel like a casting/editorial profile: portrait first, silence, 出演メモ, profile facts, and a document-like rhythm. The goal is to help a casting or creative director understand Naomi’s presence quickly.

## Colors

- **Paper / Paper Warm:** Main editorial surfaces. They should feel like a printed portfolio sheet, not a generic beige website.
- **Black Panel:** Used for the split hero and portrait areas. It gives the monochrome image presence without becoming a movie poster.
- **Ink / Muted / Line:** Document typography and rule lines. Use thin borders and quiet contrast.
- **Tertiary:** Small stamp, marker, or callout only. Do not turn the actor site into a red-accent marketing LP.

## Typography

- The `NAOMI` wordmark may be huge, but it functions as a background/document artifact, not body copy.
- Japanese catch copy should be editorial scale: roughly 36–52px desktop, 28–36px mobile.
- The 出演メモ rows use smaller typography, strong rhythm, and thin rules.
- Mono labels are useful for profile codes, scene numbers, and metadata.

## Layout

Use a split cover: paper side for statement, black side for monochrome portrait. Follow with 出演メモ rows and a profile sheet rather than generic cards. This is the biggest difference from the restaurant and forest LPs: the information architecture itself changes.

Conversion path is not “buy now.” The practical next step should be casting inquiry, profile download, or contact details if this becomes production work.

The current conversion improvement layer makes that next step explicit: hero/header CTAs point to casting contact, the profile sheet includes height/area/materials, and the contact form collects project timing, request type, and contact details. A casting director should never have to infer how to proceed.

## Elevation & Depth

Keep depth minimal. Use paper texture, monochrome portrait contrast, hairline rules, and generous negative space. Avoid glossy drop shadows.

## Shapes

Mostly square/document edges. Rounded shapes are allowed only for functional controls or compact profile tags.

## Components

- `profileCover`: split hero surface with statement and metadata.
- `blackPortraitPanel`: portrait field; image should be monochrome or near-monochrome.
- `noteRow`: 出演メモ item. It should read like a casting note, not a blog card.
- `profileSheet`: profile facts, availability, and tone summary.
- `quietButton`: functional action only; should not compete with portrait/name.
- `castingContact`: inquiry section that explains what materials can be shared before a booking decision.
- `inquiryForm`: simple casting request form with name/company, request type, timing, contact, and project memo.

## Do's and Don'ts

- **Do** make the page feel like a document someone would send before casting.
- **Do** let portrait, name, and silence carry the mood.
- **Do** treat supplied real photos as editorial stills: muted color/monochrome, generous negative space, and no generic stock-photo treatment.
- **Do** use 出演メモ to show range without overexplaining.
- **Do** keep Japanese display type restrained.
- **Do** make “出演依頼 / PROFILE PDF / SHOWREEL / contact” visible without scrolling too far.
- **Don't** reuse the restaurant/adventure story-card rhythm.
- **Don't** make the catch copy billboard-sized.
- **Don't** use cheerful gradients, large rounded SaaS cards, or decorative icons.