标记
<main class="f-landing">
<section class="f-hero">
<div>
<p class="f-hero__kicker">Mascot · Red dots</p>
<h1 class="f-hero__title">Duna Feline</h1>
<p class="f-hero__lead">I chase red dots for a living…</p>
<p class="f-hero__body">I map every wall the dot has touched…</p>
<div class="f-hero__actions">
<a class="f-btn f-btn--primary" href="#">About me ↗</a>
<a href="#">View resume</a>
</div>
</div>
<figure class="f-hero__media"><img src="…" alt="" /><figcaption>…</figcaption></figure>
</section>
<section class="f-landing__recent" aria-labelledby="recent">
<div class="f-landing__head">
<h2 id="recent">Notes and essays</h2>
<a href="#">All writing ↗</a>
</div>
<ul class="f-landing__list">
<li>
<a class="f-landing__item" href="#">
<span class="f-landing__meta">October 11, 2026 · On this site</span>
<h3>Why the red dot always vanishes in the corner</h3>
</a>
</li>
</ul>
</section>
</main>
