Folio editorial header · 1.0.0

A large editorial masthead with a warm paper palette, compact utility row and responsive section navigation.

The oversized serif wordmark is balanced by small utility type and a ruled navigation row. Its hierarchy takes cues from editorial property and culture sites without reproducing a reference brand.

HTML: open index.html to preview. Copy snippet.html into your page, load snippet.css after existing styles, and load snippet.js once with defer. Copy fonts/ and any images/ beside that CSS/HTML, or update paths. demo.css and demo page content are not the component.

Astro: copy Snippet.astro into src/components. Copy fonts/ and any images/ to public/snippet-assets/folio-editorial-header/ so its fonts and images paths resolve. Import the component into your page or shared layout. One instance per page; use unique prefixes/IDs before duplicating it. This is a component, not a full Astro project.

Replace all sample names, destinations, prices and business claims. Form previews never send messages; configure a backend action, remove data-demo-form and disabled from the fieldset, remove the demo submit interception, then implement server validation, spam controls and delivery before collecting data. Pricing is demonstration content; specify your actual billing terms and tax treatment. No checkout backend is included.

Code: MIT. Fonts: SIL OFL, see fonts/. Photos retain separate licenses, see ASSETS.md. Retain included notices when redistributing. Test keyboard focus, zoom, mobile layouts, paths and content in your integrated website.