Heading 1—Site Style Guide
When crafting the main heading of an article, aim for clarity and conciseness, ensuring it captures the essence of the content in 5-10 words. Capitalize key words, including the first and last words, and avoid unnecessary articles and conjunctions. Make the heading engaging and informative, using strong, descriptive language to pique the reader's interest. Avoid ending with punctuation, except when necessary for clarity, such as a question mark. Incorporate relevant keywords naturally for SEO purposes without compromising readability.
Heading 2
For main level 2 headings in an article, ensure they are clear and informative, providing a concise summary of the section's content. Capitalize the first letter of each major word, avoiding unnecessary articles, conjunctions, and prepositions unless they begin the heading. Use descriptive and engaging language to maintain reader interest, and avoid ending with punctuation unless needed for clarity. Maintain a consistent style throughout the article, using the same font, size, and formatting for all level 2 headings to create a cohesive and professional appearance.
Heading 3
For main level 3 headings in an article, ensure they are specific and precise, offering clear subtopics or detailed points within a section. Capitalize the first letter of each major word and avoid unnecessary articles and conjunctions unless they start the heading. Use level 3 headings to break down complex information, organize detailed content, or introduce specific examples within a broader topic. Maintain a consistent style with the same font, size, and formatting as other level 3 headings to ensure a unified and structured appearance. These headings should enhance readability by logically dividing the content into manageable, easily digestible segments
Colour Palette
Light Theme
Primary Background--bg
#fdfaf5
Secondary Background--panel
#e6dfc9
Primary Text--text
#2e2b23
Accent / Highlight--accent
#a84300
Headings--heading
#7b5e2d
Dark Theme
Primary Background--bg
#0d0c0a
Secondary Background--panel
#1c1f26
Primary Text--text
#d8d2c4
Accent / Highlight--accent
#e5c07b
Headings--heading
#b8860b
Typography on Kurtz Vintage Vibes adapts to your device
Samsung readers see SamsungOne, Mac readers see New York, Windows readers see Skeena, Linux readers see FreeSerif. This reflects the spirit of a cabinet of curiosities: each visitor discovers a slightly different typographic edition of the same work.
Core Styled Elements
These are the primary HTML elements/classes styled by site.css. Use them to keep pages consistent.
<h1>,<h2>,<h3>— serif, brass/bronze headings with subtle vertical elongation.<p>— body copy (serif, 18px base, 1.58 line-height).<hr>— 3px, rounded, semi-transparent rule for section breaks.<a>— theme link colours (accent/visited), underline on hover.<body>— applies global typography, colours, and OpenType features.<article>— centered content column with responsive max-widths..container— utility wrapper with horizontal padding and max width..banner— site title bar (serif, bold, panel background, shadow)..site-header .bar— sticky navigation bar (theme-aware, blurred)..bar .bar-item— nav link pill (hover invert,aria-current="page"shows accent outline)..prow— responsive grid: 1 → 2 → 3 → 4 columns by breakpoint..pcard— card container (panel bg, radius, shadow, accent hover)..pcard-thumbnail— responsive image inside a card..pcard-description— small sans-serif caption/summary text.<figure>— inline-block media group..k-image— image with silver border and Deco corner radius.<figcaption>— sans-serif caption under figures.<footer>— site footer (panel background, small sans-serif)..skip-link— keyboard “skip to content” (visible on focus).:focus-visible— global gold outline for interactive elements..visually-hidden— screen-reader-only text helper.<code>,<pre>,<kbd>,<samp>— monospace stack for snippets and UI keys.
