关于这个模板
把 GlobalBank 当作首屏规格书来读：这些数值在页面动手之前就先写下来了。标题是“Think Ahead. Move Fast. Exceed Expectations”，首屏其余部分都围着它排。配色控制在白色 #FFFFFF 打底、深绿色 #1A2E24 给文字、绿色 #22C55E 承担强调色之内，字体用 Inter。交付形式是一个自包含的 HTML 文件，收录于 1468x1080，所以画幅在任何一行代码写下去之前就已经定好。动效归结起来就是4.1s 的过渡、一段循环视频打底。写作时让它开着：能迁移到你页面上的，是那份 31,093 字符的简报。
适合谁
- 给做SaaS项目提案、需要在第一次回复客户时就带上一个自包含的 HTML 文件的代理公司用。
- 如果构建从一个自包含的 HTML 文件起步，先拾起字号从 14px 到 46px、14px 间距，栅格定下来之前别碰配色。
- 这个页面服务的是正用一个自包含的 HTML 文件重建AI 或 SaaS 产品首屏、想找外观背后那组数字的前端开发者。
包含哪些内容
- 导航不带底色. 链接在同一行、同一个字号上排开，#22C55E 操作收在行尾右侧，视线正好在导航结束的地方停下。链接比字标小一档，#22C55E 操作是导航条上唯一有分量的元素。你自己的页面板块更多时，把它们归组，而不是把导航条拉宽。
- 间距档位是写明的. 需求简报里的每个尺寸都是能反测量回去的数值：字号从 14px 到 46px、14px 间距、4.1s 的过渡。落回这些数值的重建不用再调就长得像参考。
- 素材上不加色罩. 氛围交给一段 1468x1080 的 4.9s 片段；需求简报定死了它的裁切方式，文字则原样叠在上面。按 1468x1080 或更宽的尺寸导出，cover 裁切就继续成立。
- 越大收得越紧. 字体定在 Inter 上，需求简报给这套字分配了明确的职责，而不是为了花样去混搭。字重、字距和字号档位全部写明，换字体也不会丢掉层级。字号越大字距收得越紧，标题行在 14–46px 范围内才能保持完整。
动效与交互
时长以需求简报为准
规格里每一次状态变化都带着时长：4.1s没有一处留给浏览器默认值，所以页面读起来是被设计过的，而不是被加了动画。缓动和时长写在一起（4.1s），复刻时没法悄悄换成另一种手感。
是循环，不是时间轴
整个环境层就是一段 4.9s 的片段：它在文案后面播放，循环看不出接缝，也从不响应指针。片段静音且行内播放，所以第一帧不需要任何交互就能看到。
这个首屏背后的时序
最后再移植动效。需求简报把它定成4.1s 的过渡、4.9s 的循环视频、逐词出现的标题，等版式就位之后再对齐会容易得多。这个首屏里没有为动而动的动画。
这个首屏背后的顺序
你把这些板块打乱，页面照样能打开，但它不再读起来像一个论点：导航、标题、背景片段是一条序列，字号从 14px 到 46px、14px 间距也只在这个顺序里成立。 SaaS读者先看到主张，再看到选项。
这个首屏背后的数字
需求简报是规格书，不是情绪板。它钉住了字号从 14px 到 46px、14px 间距、4.1s 的过渡，也写明了素材的规格：1468x1080循环 4.9s这类细节让设计经得起复刻：换掉文案，各种关系依然成立。这个首屏里没有任何一处依赖默认值。
常见问题
重建 GlobalBank 必须用一个自包含的 HTML 文件吗？
GlobalBank 是用一个自包含的 HTML 文件构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
复制 GlobalBank 的需求简报，我能拿到什么？
简报是从页面上收录下来的，共 31,093 个字符，覆盖画幅、字阶、色板和过渡。复制拿到的就是这段文本，发给 Studio 则会用同一份描述把请求预先填好。
能保留 GlobalBank 的过渡、只改时长吗？
入场和状态切换都落在 4.1s 这个区间内，由状态变化触发而不是滚动库，也从不会拖住文案。
