关于这个模板
Vectrus Energy 留住了自己的决策链：生成这个落地页的需求简报有 8,300 个字符。“Advancing resources for a cleaner future” 就是整套版式要承载的那一行。整套配色是灰色 #C7CED7 打底、深蓝色 #1D3045 给文字，页面字体是 Helvetica, Arial。这份参考用 React 和 Tailwind CSS 构建，但版式上的决定都独立于它写清楚了。动效归结起来就是200ms 的过渡、cubic-bezier(0.16,1,0.3,1)、一段循环视频打底。当工业的落地页必须扛住一次文案改动、又不能重做设计时，它最有用。
适合谁
- 正在写构建需求、想拿 1468x1080 画幅作为讨论依据的工作室团队。
- 在这版落地页上继续加块的内部小组，需要把 500vh 高的板块、40px 间距原样带进新块里。
- 产品市场的人需要落地页在背后有5.6s 的循环视频时依然好读。
包含哪些内容
- 导航条落在页面栅格上. 导航只有一行，下面没有二级。到了平板断点以下，改由移动端浮层接管。导航条悬在 1468x1080 的构图上，自己没有底色，素材因此从它下面通到两边。加第六条链接之前，先把收起状态设计好。
- 没有一样是继承来的. 版式是对着一组固定值（500vh 高的板块、40px 间距、200ms 的过渡、cubic-bezier(0.16,1,0.3,1) 缓动曲线）解出来的，首屏在任何宽度下因此都保持成构图。数值是从收录的提示词里抄下来的，不是反推的，重渲染也不会丢。
- 用带序号的文字行承担. 功能用 Helvetica, Arial 排成清单，而不是卡片栅格，页面因此密度高，在窄屏上也能很快扫完。只要文案放得下，每一行就保持一行。
- 一条会主动让开的导航. 导航只有一行，下面没有二级。到了平板断点以下，改由移动端浮层接管。导航条悬在 1468x1080 的构图上，自己没有底色，素材因此从它下面通到两边。把这一行控制在单行。
动效与交互
是循环，不是时间轴
环境动感来自 1468x1080 的 5.6s 循环，而不是滚动特效，页面因此保持平静，文字也更好读。因为是静音的，循环可以在文案下面跑，不抢声音，也不抢注意力。拍摄或导出按 1468x1080 或更宽的尺寸。
时长以需求简报为准
控件在 200ms 内完成变化，快到手指刚碰上去页面就回应，而不是等一下才动。时长够短，页面才像是被设计过的；换成一个慢的默认值，整套构图就散了。要改缓动就全局统一改。
把这个落地页变成你自己的
要把这个落地页变成自己的，不必重建。换掉标题和素材，保住字阶（500vh 高的板块、40px 间距），版式读起来还是原来设计的样子。画幅和字阶都保留，该换的是题材。
这个落地页背后的顺序
这类页面通常把行动按钮埋在一整片功能栅格下面。这一版把导航、标题、数据行、功能列表、背景片段放成固定序列，行动点留在首屏里，而不是滚过三屏之后才出现。工业读者先看到主张，再看到选项。这份参考在 1468x1080 下收录。
这个落地页怎么重排
窄屏版式是设计出来的，不是继承来的。每个宽度下字阶是流体的，而不是阶梯式的、板块高度锁在 500vh、导航收进移动端菜单，层级因此扛得住重排。重排之后，任何宽度下行动点都够得着。
常见问题
Vectrus Energy 背后的提示词到底有多长？
简报是从页面上收录下来的，共 8,300 个字符，覆盖画幅、字阶、色板和过渡。复制拿到的就是这段文本，发给 Studio 则会用同一份描述把请求预先填好。
Vectrus Energy 有多少地方依赖 React 和 Tailwind CSS？
Vectrus Energy 是用 React 和 Tailwind CSS 构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
Vectrus Energy 的动效是由什么驱动的？
入场和状态切换都落在 200ms 这个区间内使用 cubic-bezier(0.16,1,0.3,1)，由状态变化触发而不是滚动库，也从不会拖住文案。需求简报里带了减少动态效果的分支。
