<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test Page - Basic</title>
<style>
body { font-family: "Helvetica Neue", sans-serif; color: #333; margin: 20px; }
h1 { color: navy; font-size: 24px; }
.highlight { background: yellow; padding: 4px; }
.hidden { display: none; }
nav a { margin-right: 10px; color: blue; }
</style>
</head>
<body>
<nav>
<a href="/page1">Page 1</a>
<a href="/page2">Page 2</a>
<a href="https://external.com/link">External</a>
</nav>
<h1 id="title">Hello World</h1>
<p class="highlight">This is a highlighted paragraph.</p>
<p class="hidden">This should be hidden.</p>
<div id="content" data-testid="main-content" data-version="1.0">
<p>Some body text here.</p>
<ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
</div>
<footer>Footer text</footer>
</body>
</html>