## ADDED Requirements

### Requirement: Hugo Project Structure
The system SHALL initialize a Hugo static site with the standard directory structure including layouts, content, static, and data directories.

#### Scenario: Hugo site initialized
- **WHEN** Hugo site is created
- **THEN** the following directories exist: layouts/, content/, static/, data/
- **AND** a hugo.toml configuration file is present at the root

#### Scenario: Hugo builds successfully
- **WHEN** running `hugo` command
- **THEN** the site builds without errors
- **AND** generates static HTML files in the public/ directory

### Requirement: Base Layout Template
The system SHALL provide a baseof.html template that defines the common HTML structure for all pages, including Bootstrap 5.x integration.

#### Scenario: Base layout includes Bootstrap
- **WHEN** any page is rendered
- **THEN** the HTML output includes Bootstrap 5.x CSS from CDN
- **AND** the page has proper HTML5 doctype and meta tags
- **AND** the page is responsive with Bootstrap's viewport meta tag

#### Scenario: Base layout includes header and footer
- **WHEN** any page is rendered
- **THEN** the page includes the header partial
- **AND** the page includes the footer partial
- **AND** the main content block is properly positioned between them

### Requirement: Reusable Partials
The system SHALL provide reusable partial templates for header, footer, and navigation components.

#### Scenario: Header partial exists
- **WHEN** baseof.html calls the header partial
- **THEN** the header is rendered with consistent styling across all pages

#### Scenario: Footer partial exists
- **WHEN** baseof.html calls the footer partial
- **THEN** the footer is rendered with consistent styling across all pages

#### Scenario: Navigation partial exists
- **WHEN** header includes navigation
- **THEN** the navigation menu renders with links to main pages
- **AND** uses Bootstrap navigation components

### Requirement: Homepage Template
The system SHALL provide an index.html template for the homepage that extends baseof.html and displays the main landing content.

#### Scenario: Homepage renders correctly
- **WHEN** accessing the root URL
- **THEN** the homepage template is used
- **AND** displays content from content/_index.md
- **AND** matches the structure of the existing markusgraf.ch homepage

### Requirement: Single Page Template
The system SHALL provide a default single.html template for individual content pages.

#### Scenario: Single page renders correctly
- **WHEN** accessing any content page
- **THEN** the single page template is used
- **AND** displays the page title
- **AND** renders the markdown content as HTML

### Requirement: Static Assets
The system SHALL serve static assets (images, fonts, CSS files) from the static/ directory.

#### Scenario: Static files are accessible
- **WHEN** a static file is placed in static/
- **THEN** it is accessible at the site root in the built site
- **AND** preserves the directory structure from static/

### Requirement: Content Management
The system SHALL support markdown files in the content/ directory that are rendered into HTML pages.

#### Scenario: Markdown content is rendered
- **WHEN** a markdown file exists in content/
- **THEN** Hugo processes it into an HTML page
- **AND** front matter variables are accessible in templates

#### Scenario: Page metadata
- **WHEN** a content file has front matter
- **THEN** title, date, and other metadata are available in templates
- **AND** can be used for page titles and navigation

### Requirement: Configuration
The system SHALL use hugo.toml for site configuration including baseURL, title, and language settings.

#### Scenario: Site configuration is applied
- **WHEN** hugo.toml contains site settings
- **THEN** those settings are used during site generation
- **AND** site title appears in page titles
- **AND** baseURL is used for absolute URLs

### Requirement: Responsive Design
The system SHALL render pages that are responsive and mobile-friendly using Bootstrap's grid system and responsive utilities.

#### Scenario: Mobile viewport
- **WHEN** viewing the site on mobile devices
- **THEN** the layout adapts to small screens
- **AND** navigation is accessible
- **AND** content is readable without horizontal scrolling

#### Scenario: Tablet and desktop viewports
- **WHEN** viewing the site on larger screens
- **THEN** the layout utilizes available space appropriately
- **AND** maintains readability and visual hierarchy

### Requirement: HTML Validity
The system SHALL generate valid HTML5 markup that passes standard validation.

#### Scenario: Valid HTML output
- **WHEN** pages are generated
- **THEN** HTML is well-formed
- **AND** includes required DOCTYPE and meta tags
- **AND** uses semantic HTML5 elements where appropriate

### Requirement: Accessibility Basics
The system SHALL implement basic accessibility features including semantic HTML and proper heading hierarchy.

#### Scenario: Semantic HTML structure
- **WHEN** pages are rendered
- **THEN** content uses appropriate semantic elements (header, nav, main, footer, article)
- **AND** maintains logical heading hierarchy (h1, h2, h3)

#### Scenario: Navigation accessibility
- **WHEN** keyboard navigation is used
- **THEN** all interactive elements are focusable
- **AND** focus order is logical