关于这个模板
Cross-Border 是一个只靠一份书面简报搭出来的工业落地页，这一页记录的就是那份简报。标题是“Complete the form and our team will contact you soon”，落地页其余部分都围着它排。整套配色是亮黄色 #FFDA00 打底、黑色 #1A1A1A 给文字、深青绿色 #002A35 承担强调色，页面字体是 Helvetica, Arial。交付就是 React 和 Tailwind CSS：一个页面，没有插件，你和设计之间不隔任何构建工具链。动效预算就是0.6s 的过渡、一段循环视频打底。如果你要给别人提一版工业落地页的需求，就从这个构图起步，把题材换掉。
适合谁
- 需要这版落地页在慢网络下也撑得住的工程师，会把 1440x1080 和字阶当作重量预算。
- 正在做工业企业落地页的团队，想要的是量出来的细节（12vh 高的板块、20px 间距），而不是一张可以照抄的截图。
- 产品市场的人需要落地页在背后有5.8s 的循环视频时依然好读。
包含哪些内容
- 链接只在一个断点收起. 这一行的对比只花在一个地方：#002A35 操作；字标和链接都退回正文色。到了平板断点以下，改由移动端浮层接管。链接比字标小一档，#002A35 操作是导航条上唯一有分量的元素。
- 对着视口量出来的. 需求简报里的每个尺寸都是能反测量回去的数值：12vh 高的板块、20px 间距、0.6s 的过渡。清单里最小和最大的两个值，划定了这套构图的取值范围。
- 通栏视频垫在文字后面. 构图是压在 1440x1080 的片段之上搭起来的，不是摆在旁边，所以素材永远不会被塞进面板或加上边框。按 1440x1080 或更宽的尺寸导出，cover 裁切就继续成立。
- 靠展示字号说话. 字体定在 Helvetica, Arial 上，需求简报给这套字分配了明确的职责，而不是为了花样去混搭。字重、字距和字号档位全部写明，换字体也不会丢掉层级。字体和固定字号配对使用，展示行和界面文字因此始终是一家人。
动效与交互
环境动效交给循环
环境动感是一段 1440x1080 下的 5.8s 片段，在文案后面安静循环，不响应指针。片段静音且行内播放，所以第一帧不需要任何交互就能看到。
短而互相匹配的时长
控件里的动效短且可重复：每次状态变化都是 0.6s。缓动和时长写在一起（0.6s），复刻时没法悄悄换成另一种手感。
这份工业需求简报为什么站得住
它对工业企业有效，是因为它从不要求读者自己去拼信息。“Complete the form and our team will contact you soon”从第一帧起就在做这件事。版式、字体和颜色都已经定好（亮黄色 #FFDA00 和深青绿色 #002A35，用 Helvetica, Arial），所以第一屏读起来是一个完整的论点，而不是一堆零件。它给工业读者的是一条通向主张的最短诚实路径。
这个落地页背后的数字
大多数参考只给你结果、把数字留下。这一份反过来：12vh 高的板块、20px 间距、0.6s 的过渡和页面一起公开，所以结果能被复现，而不是被大致模仿。这个落地页里没有任何一处依赖默认值。
这个落地页背后的时序
抄的是模式，不是数值：保住0.6s 的过渡、5.8s 的循环视频、悬停态与按下态，时长交给你自己的品牌定。这个落地页里没有为动而动的动画。
常见问题
Cross-Border 背后那份需求简报里到底有什么？
简报是从页面上收录下来的，共 6,698 个字符，覆盖画幅、字阶、色板和过渡。复制拿到的就是这段文本，发给 Studio 则会用同一份描述把请求预先填好。
Cross-Border 的简报和我自己写的提示词是一回事吗？
页面上引用的内容全部出自收录的 6,698 字符简报，而不是事后补写的说明。数字和文字能对得上，原因就在这里。
为什么这条条目还要标注 React 和 Tailwind CSS？
Cross-Border 是用 React 和 Tailwind CSS 构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
