Loam — Warm Earthy Organic Agency Website

Summary

A warm, earthy, organic agency / studio website. Cozy sand-and-terracotta palette with olive and clay accents, a large Fraunces serif display headline (with one italic terracotta phrase underlined by a hand-drawn squiggle), Inter body text, and soft 'leaf-blob' organic border-radius shapes used for the hero photo, background washes, and cards. Sticky blurred nav, dark ink stats band, a 4-up project-card grid, a numbered services list, an about/values section with a photo + 3 value cards, a terracotta contact block with a mock form, and a dark footer. Subtle paper-grain texture over everything.

Style

Warm earthy organic editorial. Grounded, handcrafted, slow-and-soft mood: sand/cream base (#efe7d8), terracotta primary action color (#c4633f), muted olive (#6b7048) and clay (#cf9a6f) accents, near-black warm ink for text (#2b251d). Fraunces serif for all headings (optical sizing, weights 600-700, with italics for emphasis), Inter for UI/body. Organic blobby radii (border-radius:'organic' = 2.5rem plus custom leaf-blob shapes), generous whitespace, soft layered shadows tinted by ink/terra, a faint radial-dot paper grain, and large blurred organic background washes behind sections.

Layout & Structure

Single-column long-form landing page, max-width 7xl (80rem) container with px-6 / lg:px-10 gutters. Top-down order: sticky blurred header nav, hero (12-col grid: 6 copy / 6 organic photo), dark ink stats band (4 stats), Selected Work (4-up card grid), Services (4 intro col + 8 list col, numbered rows), About/Values (5 photo / 7 values with 3 cards), terracotta Contact block (6 copy / 6 form card), dark footer (4 columns + bottom bar). Sections alternate sand / sandhi / ink / terra backgrounds for rhythm. Responsive: grids collapse to 1-2 cols on mobile, nav links hide behind lg, blob washes clip via overflow-hidden.

Sticky nav

Hero

Stats band

Selected work grid

Services list

About / values

Contact block

Footer

Special Notes

Fonts loaded from Google Fonts: Fraunces (opsz 9..144, weights 400-800, serif display, optical sizing on) and Inter (400-700, sans UI/body). Styled with Tailwind via CDN using a custom theme palette (sand/sandlo/sandhi, terra/terradk, olive/olivedk, clay/claylo, ink/inksoft) and a custom 'organic' border radius. Photos are Unsplash earthy nature shots (soil, fields, foliage) with gradient overlays. html has scroll-behavior:smooth and overflow-x:hidden so the large blurred blobs never cause horizontal scroll. The mood must stay warm, grounded and handcrafted, never cold, neon or corporate.