关于这个模板
把 Intelligent Operations 当作落地页规格书来读：这些数值在页面动手之前就先写下来了。配色控制在灰色 #BCCCD4 打底、黑色 #0A0A0A 给文字之内，字体用 Inter。交付形式是 React 和 Tailwind CSS，收录于 1476x1080，所以画幅在任何一行代码写下去之前就已经定好。这个页面的动效控制在700ms 的过渡、一段循环视频打底。写作时让它开着：能迁移到你页面上的，是那份 10,447 字符的简报。收录的提示词记录于 1476x1080，所以这一页引用的每个数值都能追回到它。下面引用的每一项都是那份简报里的数值，从 1476x1080 的画幅一直到最小的间距档。
适合谁
- 正在做AI 或 SaaS 产品落地页的团队，想要的是量出来的细节（100vh 高的板块、10px 间距），而不是一张可以照抄的截图。
- 这一版落地页服务的是需要一屏证据、证明SaaS的文案能扛住 7.9s 的循环视频的创始人。
- 给要改写一版落地页、标题长度又得和Intelligent Operations一样的内容负责人用。
包含哪些内容
- 顶栏：字标、链接、一个操作. 一条细导航压在落地页上，字标在左，链接用 Inter 排，整套构图因此先读成内容、再读成界面。导航条悬在 1476x1080 的构图上，自己没有底色，素材因此从它下面通到两边。这条导航只有几个元素，不用组件库也能重建。
- 要片段，不要插画. 一个 7.9s 的素材撑起整个首屏，页面上没有第二个素材元素要对齐。循环短到 7.9s，眼睛会把它读成肌理，而不是一条时间轴。
- 导航条落在页面栅格上. 一条细导航压在落地页上，字标在左，链接用 Inter 排，整套构图因此先读成内容、再读成界面。导航条悬在 1476x1080 的构图上，自己没有底色，素材因此从它下面通到两边。链接控制在四到五个，这一行的尺寸就是照这个定的。
- 字和画幅共用一套档位. 这些值就是规格本身：100vh 高的板块、10px 间距、700ms 的过渡，是在 1476x1080 下收录的，而不是从截图里反推的。需求简报给的是数值，不是比例，所以文案长度变了，构图里的关系也不会散。数值才是设计，其余只是摆放。
动效与交互
以毫秒计的时长
状态变化的时长写明为 700ms，所以控件上的反馈是一个设计过的值，不是浏览器默认值。聚焦态和悬停态用同一个时长，键盘和指针的反馈因此一致。
文字分片到达
入场动效花在页面自己的信息上，而不是花在包围它的框架上：各个板块进入视口时依次揭示。每个元素只跑一次，页面开着的时候不会反复重播。这份参考在 1476x1080 下收录。
这个落地页背后的数字
复刻通常从一张截图加一个猜测开始。这里从 10,447 个字符的规格开始：画幅、间距和动效都在第一行代码之前就写下来了。这个落地页里没有任何一处依赖默认值。
Intelligent Operations 里什么在动
把这里的动效和一个滚动驱动的页面比：两者都在动，这一版只在需求简报说的位置动（700ms 的过渡、7.9s 的循环视频、滚动揭示），所以文案始终在前面。这个落地页里没有为动而动的动画。
这个落地页怎么重排
这里的响应式指的是尺度变、顺序不变。板块高度锁在 100vh，阅读顺序还留在需求简报放的位置上。窄屏下没有丢掉任何重要的东西。
常见问题
Intelligent Operations 背后的提示词到底有多长？
它是构建简报，不是感觉描述：写明 1476x1080 的构图、间距和动效数值。全文没有一处把渲染画面当作事实依据。
重建 Intelligent Operations 必须用 React 和 Tailwind CSS 吗？
Intelligent Operations 是用 React 和 Tailwind CSS 构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
Intelligent Operations 能用在客户项目里吗？
简报是描述，不是转授权别人素材的许可。结构和数值可以留下，素材和品牌标识要换成你自己的；客户问起版式出处时，说明来源即可。这份参考在 1476x1080 下收录。
