珍稀画廊

构建一个单页奢侈品牌落地页（仅包含 navbar + 全视口 hero）。技术栈：React 18 + TypeScript + Vite + Tailwind CSS 3。不使用额外 UI 工具包。仅将 lucide-react 用于 Flower2 图标。页面标题：Aurevon。根包装容器：bg-black。html, body { overflow-x: hidden }。全局重置：margin: 0; padding: 0; box-sizing: border-box。

字体
严格加载以下 Google Fonts：

https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&display=swap

工具类：.font-instrument { font-family: 'Instrument Serif', serif; }

Instrument Serif 仅用于 hero H1 和 overlay nav links。Logo、nav pill、正文和 CTA 使用 Tailwind 默认 sans（ui-sans-serif, system-ui, …）。

缓动（所有位置复用）

进入：cubic-bezier(0.16, 1, 0.3, 1)
Menu overlay / hamburger morph：cubic-bezier(0.76, 0, 0.24, 1)
NAVBAR（固定）
Fixed top-0 left-0 w-full z-50。window.scrollY > 40 之前保持透明，之后使用 bg-black/80 backdrop-blur-md。过渡：duration-500。

内栏：max-w-[1440px] mx-auto px-6 md:px-10 flex items-center justify-between h-16 md:h-20。

左侧 — logo
文本链接“Aurevon”，text-white text-xl md:text-2xl font-semibold tracking-tight z-50。

中间 — 仅桌面端（hidden md:flex）
Pill button：px-5 py-2 rounded-full border border-white/20 text-white/90 text-sm hover:bg-white/10、items-center gap-2。overlay 关闭时标签为“导航”，打开时为“关闭”。用于切换 overlay。

右侧 — 仅桌面端（hidden md:flex）
lucide-react 的 Flower2：w-7 h-7 text-white/90。

右侧 — 移动端（md:hidden）
Hamburger，w-8 h-8、flex-col items-center justify-center gap-1.5、aria-label="Toggle menu"。两条横线：w-6 h-[2px] bg-white。打开时：上方横线 rotate-45 translate-y-[4px]，下方横线 -rotate-45 -translate-y-[4px]。morph 持续时间为 duration-500，并使用 overlay 缓动。

Navbar 进入动画（加载时）
100ms 后设置 mounted。元素初始为 opacity-0 -translate-y-4，结束为 opacity-100 translate-y-0。duration-700 + 进入缓动。mounted 后的延迟：logo 0ms、Navigate/hamburger 200ms、flower 400ms。

overlay 打开时，将 document.body.style.overflow 设置为 'hidden'；关闭时恢复。

全屏 OVERLAY MENU
fixed inset-0 z-40 bg-black（位于 navbar z-50 下方）。关闭：opacity-0 invisible。打开：opacity-100 visible。过渡 duration-700 + overlay 缓动。内容居中：flex flex-col items-center justify-center。

链接垂直堆叠，gap-8，居中：

首页
品牌故事
系列
垂询
每项：href="#"、text-white font-instrument text-4xl md:text-6xl hover:opacity-60。关闭时：opacity-0 translate-y-6。打开时：opacity-100 translate-y-0。持续 600ms，使用 overlay 缓动。打开时依次错开：150 + index * 80 ms（首页 150、品牌故事 230、系列 310、垂询 390）。关闭时 delay 0。点击链接会关闭 overlay。

HERO（全视口）
<section class="relative w-full h-screen overflow-hidden flex items-end justify-center">

背景 video（必须使用以下确切 URL）

https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260819_212700_3bb9329b-5c50-4257-a09b-ca85cf3654a3.mp4
包装容器：absolute inset-0。初始为 scale-105 opacity-0，300ms 后 mounted 变为 scale-100 opacity-100。过渡 duration-[1400ms] + 进入缓动。

<video>：使用该 src、autoPlay muted loop playsInline，class="w-full h-full object-cover"。无 overlay gradient。Video 是唯一背景。

前景（底部居中）
relative z-10 text-center px-6 pb-16 md:pb-24 max-w-4xl mx-auto

H1（Instrument Serif）：
font-instrument text-white text-[2.5rem] leading-[0.95] sm:text-5xl md:text-6xl lg:text-7xl mb-5 md:mb-6

确切文案，仅从 sm 起换行：

精心甄选的<br class="hidden sm:block" /> 无与伦比的珍藏
在移动端为自然换行的一行；从 sm 起为两行：“精心甄选的”，然后是“无与伦比的珍藏”。

副文案
text-white/70 text-base md:text-lg mb-8 md:mb-10 max-w-md mx-auto
文案：在我们的私人画廊中预留您的席位。

CTA
<a href="#"> “加入候补名单”
inline-block px-8 py-3.5 bg-white text-black text-sm md:text-base font-medium rounded-full hover:bg-white/90

Hero 文本/CTA 进入动画
三者均从 opacity-0 translate-y-8 开始，以 opacity-100 translate-y-0 结束。duration-900 + 进入缓动。300ms 后 mounted，随后延迟：H1 400ms、副文案 600ms、CTA 800ms。mounted 前 delay 0。

响应式检查清单（必须匹配）
断点	行为
默认 / 移动端
Nav 高度 64px，padding-x 24px。仅显示 Hamburger（无 Navigate pill、无 flower）。Hero padding-bottom 64px。H1 2.5rem / line-height 0.95，不强制 H1 换行。副文案 text-base，CTA text-sm。Overlay links text-4xl。
sm (640px)
H1 text-5xl；出现 H1 换行。
md (768px)
Nav 高度 80px，padding-x 40px。桌面端：logo | Navigate pill | flower。Overlay links text-6xl。Hero pb-24。H1 text-6xl、mb-6。副文案 text-lg、mb-10。CTA text-base。
lg (1024px)
H1 text-7xl。
不添加其他版块、footer 或额外 chrome。不添加 video controls、poster 或额外色彩 overlay。按照以上类、时间、文案及 CloudFront URL，以像素级精度重现 navbar + hero。