DESIGN.md — Taiho Ventures, LLC

Per-style brand authority for src/styles/31-clay-corporate-taiho-toi/. Produced by columbus-design-md-builder. Read by columbus-design-author at scaffold time and by columbus-design-iterator on every refinement. Treat sections 1–7 as canonical truth.

This style is a faithful recreation of the April 2026 Taiho Oncology corporate-website redesign brief (research/toi-may-2026/), pivoted to apply to Taiho Ventures, LLC — Taiho Pharmaceutical's $400M corporate venture arm investing in early-stage biotech. The visual system, typography, and palette are fixed by the brand book; the narrative pivots from patient-facing oncology subsidiary to founder-facing strategic-pharma backer.

1. Aesthetic Anchor

Primary family: Warm Editorial — pharmaceutical-corporate variant. Lora serif × Clay-brown bands × authentic humans-in-labs photography. The page reads like the print-version of a corporate annual report, not a SaaS product tour. Secondary remix: Clinical / Journal layout — ribbon-style data tables with a warm-brown header row and alternating Pebble rows (lifted directly from the redesign brief's pipeline pages, repurposed here for investment-criteria and portfolio data). Reference brands: Genentech (warm-but-clinical photography of real scientists) × Bristol Myers Squibb corporate (institutional Clay/Earth gravitas) × IBM (Plex Sans clarity, geometric counterweight to the serif) × JAMA / Lancet (ribboned tables, eyebrow-then-headline page bands). Visual atmosphere: Warm but institutional. Clay-brown header bands tinted over photography of people in labs, in patient rooms, around boardroom tables. Ocean-teal headlines float on Sky-mint section cards. Yellow shows up as a single vertical editorial bar to the left of pull quotes; red shows up only as the rule under "MORE RESOURCES." The page reads earnest, scientific, slightly grandfatherly — a brand that has spent sixty years in oncology and is telling you about it without the vocabulary of a Series A pitch deck.

2. Brand Voice

Adjectives: warm, plain, peer-level, generous with detail, lightly literary. Voice anchor: Ann Handley — the partner voice (full fingerprint in anti-slop-copy/references/voices.md). Voice sample (from anti-slop-copy's voices.md — Handley's applied-to-brief example, kept here as the canonical exemplar for downstream agents):

Running a small agency is mostly about remembering. Remembering to reply, to send the deck, to chase the approval. The work itself is the easy part. We made a tool that remembers for you. It's not very exciting. It just works.

Brand-voiced exemplar paragraph (critique-passed against the anti-slop checklist — apply this register to every paragraph of body copy on this site):

Taiho has been working on cancer, immunology, and urology for sixty years. The companies in this portfolio are working on what comes next — first-in-class small molecules, biologics, gene and cell therapy, mostly research to pre-IND. The check is the start of the conversation, not the end. Founders sit across from people who have actually taken a compound to approval, and the board seats we said we'd fill, we fill.

Says (3 in-voice phrases the brand actually writes)

"You're working on the science Taiho has been working on."
"The check is the start of the conversation, not the end."
"The board seats we said we'd fill, we fill."

Avoids (brand-specific — the general AI ban list lives in anti-slop-copy and applies automatically)

VC-LinkedIn register: premier, ecosystem, thesis-driven, high-conviction, value-add, founder-friendly, platform-native, capital partner, strategic moat.
Pharma-corporate register: purpose-driven solutions, innovative pipeline of life-changing medicines, transformative therapeutics, our commitment to advancing.
The contrast pivot template "Most VCs do X. We do Y." — earns its place at most once on the site.
Three-adjective flex stacks like "strategic, scientific, and stage-appropriate".
Founder-talk dressed up: "we partner with bold founders re-imagining oncology" — every word here is wrong.

Sample sentences (in-voice one-liners through the critique pass — patterns for downstream agents to imitate)

"Most of our portfolio came in at research to pre-IND; a few we picked up at IND or proof-of-concept when the science was right."
"You don't get a check and a Slack channel. You get a partner who knows the regulatory path because they walked it."

One Handley-specific note for downstream agents. Handley's signature is generous detail and second-person address. When a sentence feels too plain, it's not — reach for a real noun, name, or number, not an adjective. Specifics this brand has earned the right to use: sixty years (Taiho founded 1963), $400M AUM, ~25 portfolio companies, Anavo / Arcus / Cullinan / Halda / NextCure / ORIC / Orna / Werewolf as named portfolio examples, Sakae Asanuma (President & CEO, founded 2016), oncology + immunology + urology as therapeutic areas, research-to-pre-IND as the typical entry stage.

3. Color Palette & Roles

Mode: light. Dominant: #A36234 (--clay-corporate-clay) — Taiho's renamed primary brown. Used for footer, hero overlay, page-header bands, and ribbon-table header rows. Accent: #0F7280 (--clay-corporate-ocean) — desaturated teal. Used for headlines (always Lora), CTA pill buttons, circular arrow buttons on news cards, and underline rules below H2s. Surfaces:

#D8F1ED (--clay-corporate-sky) — very pale mint. Used as section-band backgrounds for the "explore" / icon-list / programs cards.
#E8DDD3 (--clay-corporate-pebble) — warm beige neutral. Used for "Why partner with us?" cards, quote-block side panels, and alternating ribbon-table rows.
#3D2316 (--clay-corporate-earth) — deep anchor brown. Used for body text on white, and as the deeper end of the hero-image overlay gradient.
#FAF8F5 (--clay-corporate-paper) — off-white page background. Slightly warm; never pure #FFFFFF.

Hard accents (use sparingly — never as a backing color):

#F0BC2A (--clay-corporate-energy) — Taiho yellow. Appears only as a 3–4px vertical bar to the left of the lead-paragraph pull quote and as the quote glyph (❝) on testimonial cards. Demoted from co-primary to single-purpose accent by the redesign brief.
#D63027 (--clay-corporate-focus) — Taiho red. Appears only as the small-caps "MORE RESOURCES" eyebrow color and the red hairline rules separating resource items at the bottom of every page.

Notes:

Color is set in flat blocks. No gradients except: (a) the Clay→transparent overlay on full-bleed hero photography, (b) the Clay-bottom→transparent overlay on featured-news photo cards (so white text reads against the photo bottom).
Yellow and red are never used as backing colors or buttons. The redesign brief is explicit: "yellow and red have shifted to be accent colors that now provide moments of Energy and Focus."
Sky and Pebble alternate to give the page a beat: Clay (header) → white → Sky (cards) → white → Pebble (icon list / programs) → Clay (footer).

4. Typography Rules

Headline font: Lora — https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap — weights 400, 500, 600, 700 (italic 400 for the body-paragraph emphasis on "People-First Purpose: Programs / Initiatives"). Body font: IBM Plex Sans — https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&display=swap — weights 400, 500, 600, 700. Pairing principle: High-contrast — warm humanist serif against geometric sans. Lora's open curves give clinical credibility a human face; Plex's geometric clarity keeps the data-dense pages (criteria tables, portfolio grids) from feeling antique. Weight extremes: Lora 400 (italic accents only) ↔ 600 (display). Plex 400 (body) ↔ 500 (button labels) ↔ 700 (eyebrows + table headers). Size scale (desktop): H1 3.5rem (Lora 600), H2 2.25rem (Lora 600), H3 1.25rem (Plex 600 — note: H3 switches to sans), body 1.0625rem (Plex 400, 1.6 line-height), eyebrow 0.75rem (Plex 700, all-caps, 0.08em letter-spacing), caption 0.875rem. Max font sizes per page: 3 — typically H1 + body + eyebrow, with H2 and H3 shared with H1 + body slots. Switching rule: display copy (H1, H2, page-header bands) is always Lora. Subheadings on cards (H3), eyebrows, table headers, and all body / UI / nav are always Plex Sans. The serif/sans switch is the brand's typographic signature; never blur the boundary. Banned (do not use): Inter, Roboto, Open Sans, Lato, system stacks, Space Grotesk, Montserrat, Poppins, Source Sans, Nunito, Work Sans. Any other serif than Lora for display. Any other sans than IBM Plex Sans for body.

5. Layout & Density

Grid: 12-column with editorial breaks. Two-column 8/4 splits used for the "Areas of strategic alliance" pattern (label left, icon-list right). Full-bleed bands used for hero, featured-news cards, and footer. Container max-width: 1200px (the redesign brief reads as ~1180–1240px content width). Section rhythm: Varied — dense-then-airy. Hero is photographically dense with overlay; the lead-paragraph pull quote is narrow and breathing; "Explore" Sky-mint cards are airy with generous padding; ribbon tables are dense data; footer band is dense again. The page's beat is photograph → margin → cards → margin → table → cards → footer. Min container padding: 24px (mobile), 64px (desktop), 96px on the largest screens. Asymmetry / overlap commitments:

Yellow editorial bar sits to the left of the lead pull-quote on every page, 3–4px wide, full-height of the paragraph block. This is the brand's most distinctive layout signature.
Eyebrow + H1 page-header band — every subpage opens with an all-caps Plex eyebrow ("ABOUT TAIHO" / "PARTNERSHIPS" / "PIPELINE") above a Lora display H1, both left-aligned on a Clay band that runs full-bleed and is ~280–340px tall.
Circular Ocean arrow button sits at the bottom-right corner of every photo-card with a label (featured news cards, patient-story cards, employee-profile cards) — 64px circle, white arrow, soft shadow, becomes the touch target for the whole card.
MORE RESOURCES rule at the bottom of every page — red eyebrow text, then 3 stacked links separated by 1px red rules, each with a circular Ocean arrow on the right.
Vertical timeline on the About page — left-aligned dots on a Clay rule, year labels in Plex bold, event titles in Lora 600, descriptions in Plex 400.

6. Atmosphere & Media

Hero treatment: Full-bleed photographic hero with Clay overlay. Photo subjects are real people in real settings (founders, scientists, patient-and-caregiver pairs in domestic spaces). Overlay is a Clay-to-transparent gradient flowing left-to-right, so the left third of the frame is dark enough for white Lora display copy and the right two-thirds remain photographically legible. Hero is ~520–620px tall on desktop. Atmospheric layers:

Yellow 3–4px vertical bar to the left of pull-quote paragraphs (the editorial signature).
1px Ocean rule under H2 headlines (a 64–96px-wide accent stub, not a full rule).
Red 1px hairlines separating "MORE RESOURCES" items.
Clay band at the page header on all subpages (not landing).
Subtle Pebble drop shadow under photo cards (4px blur, 8% opacity) — never on Clay or Ocean surfaces. Shadow style: Subtle. Pebble-toned soft shadows on photo-cards and Sky-mint cards; pill buttons have a 1–2px soft shadow on hover only; never dramatic elevation. Media stance: editorial-photography. Stance reasoning: The redesign brief is unambiguous: pillar #1 is "Heartfelt Connection" and explicitly calls for "new, authentic photography of our people and labs to guide users toward meaningful action." The brand cannot be rendered without photography; type-only would forfeit the central pillar. Adapted for Ventures: hero photography is founders working in their own labs (not stock pharma facilities), team portraits are real headshots on warm Clay backgrounds, portfolio cards are company-supplied imagery. Avoid stock VC photography (glass towers, handshakes, cityscapes) — every image must show real people doing real science.

7. Do's and Don'ts

Do:

Open every subpage with a Clay header band: small all-caps Plex eyebrow ("ABOUT" / "INVESTMENT" / "PORTFOLIO") above a Lora 600 display H1 ("A purpose-driven scientific organization" / "Dedication to scientific collaboration"). Pattern is non-negotiable; it's the brand's strongest visual signature.
Render the lead paragraph as a yellow-bar pull quote: 3–4px Energy bar on the left, Earth body text, Plex 400, indented ~16px from the bar.
Use Lora 600 for every H1 and H2 in Ocean color; switch to Plex 600 for H3 in Earth color. The serif/sans handoff is the type signature.
Treat photography as humans-and-labs: real founders, real scientists, real patient/caregiver pairs in domestic settings. Apply Clay overlay where text needs to read against the photo.
Use ribbon tables for any structured data (investment criteria, pipeline, portfolio details): Clay header row in white Plex 700, alternating Pebble + lighter rows, rounded outer corners on the whole table, Ocean "See the trial" / "See the company" link in the rightmost column.
Use Sky-mint card backgrounds for "explore" / icon-list / programs sections. Use Pebble card backgrounds for "Why partner with us?" / quote-block panels. Never reverse them.
Place a circular Ocean arrow button at the bottom-right of every photo-card with a label.
Close every page with a "MORE RESOURCES" block: red eyebrow, 3 stacked links separated by 1px red rules, each with a circular Ocean arrow.
Footer is full Clay, white text, Plex 400 small caps for nav, white LinkedIn icon top-right (no other social — Taiho Ventures is LinkedIn-only).

Don't:

Use Inter, Roboto, Open Sans, Lato, system stacks, Space Grotesk, Montserrat, Poppins, Nunito, or any sans other than IBM Plex Sans. Use any serif other than Lora for display.
Use yellow or red as a backing color, button color, or section background. Yellow is the editorial vertical bar only; red is the "MORE RESOURCES" rule and eyebrow only.
Use purple gradients, glassmorphism, or any other AI-center hero treatment.
Use a three-up icon-card grid as the dominant section pattern. The brief uses two-up paired cards and four-up vertical icon-rows; never three identical cards.
Use a hamburger nav at desktop. The brief uses a generous double-row navbar (utility links + search top, primary nav with dropdowns below).
Write CTAs as "Get started" / "Learn more" / "Sign up". Rephrase every CTA in Handley register: "Read the criteria", "See the portfolio", "Submit a proposal", "View openings", "Explore our R&D". Rephrasing only — never deletion.
Open any page with the contrast pivot ("Most VCs do X. We do Y."). It earns its place at most once on the entire site, and not on the home page.
Use stock VC photography (glass office towers, gleaming handshakes-over-table shots, cityscapes at golden hour). Photography must show real science being done by real people.
Mix the serif/sans assignment. H1/H2 are always Lora; H3/eyebrow/body are always Plex. The boundary is the brand's typographic signature.

8. Agent Prompt Guide

For any agent reading this file:

Read this DESIGN.md in full before writing any code, copy, or styling for 31-clay-corporate-taiho-toi.
Treat sections 1–7 as canonical truth. Don't override them inline.
Reject any change that violates the Don'ts in section 7. Surface the conflict to the user rather than silently picking one side.
The most violated rules in early scaffolds will be: (a) the serif/sans assignment getting blurred (H1 in Plex, eyebrow in Lora), (b) yellow or red used as a button or backing color, (c) the yellow-bar pull-quote signature dropped, (d) "Get started" / "Learn more" CTAs slipping in, (e) stock VC photography. Audit those five before declaring a screen done.
If the user is asking for something this DESIGN.md doesn't cover, propose an addition to this file rather than introducing the decision in component code.
If the user is asking to change something in this file, route the request to columbus-design-md-builder rather than editing the file inline.
When sections conflict: section 7 (Don'ts) wins over everything; section 1 (Anchor) wins over sections 3–6; section 2 (Voice) is independent.

9. Notes & References

Created: 2026-05-08 Last updated: 2026-05-08 Source URL: n/a (recreation of an internal redesign brief, not a live site) External references:

Lora specimen: https://fonts.google.com/specimen/Lora
IBM Plex Sans specimen: https://fonts.google.com/specimen/IBM+Plex+Sans
Taiho Oncology corporate redesign brief (April 2026): research/toi-may-2026/Taiho-TOI-website-mock-may-2026-compressed.pdf
Taiho Oncology branding deck (April 2026, palette + type rationale): research/toi-may-2026/Taiho-TOI-branding-may-2026-compressed.pdf
Taiho Pharmaceutical / Taiho Ventures basic brand book (logo, original color specs): research/Taiho-ventures-basic-branding-v0.pdf
Taiho Ventures legacy site copy (team bios, investment criteria, portfolio company list): research/legacy-web-copy/

Additions log:

2026-05-08: Initial DESIGN.md captured by columbus-design-md-builder. Source: April 2026 Taiho Oncology corporate redesign brief, pivoted to apply to Taiho Ventures, LLC. Voice locked to Handley via anti-slop-copy.