发布前审查这段生成的响应式落地页代码。
构建一个不横向溢出、保留 DOM 与焦点顺序、始终提供主操作，并让浏览器选择尺寸合适主图的页面。
HTML
<main class="page">
<img
src="hero-1600.jpg"
srcset="hero-640.jpg 640w, hero-1600.jpg 1600w"
alt="Team reviewing a release">
<section class="content">
<article><h1>Ship with confidence</h1></article>
<div class="actions">
<a class="primary" href="/start">Start now</a>
<a href="/docs">Read docs</a>
</div>
</section>
</main>
<style>
.page { width: 100vw; padding-inline: 24px; }
.content {
display: grid;
grid-template-columns: minmax(0, 1fr) 18rem;
}
.actions { order: -1; }
@media (max-width: 48rem) {
.content { grid-template-columns: 1fr; }
.primary { display: none; }
}
</style>
生成代码仅作示例，不代表任何特定模型