/* ============================================================
   青瓷底 — 全部由 CSS 渐变生成，不使用任何位图素材
   叠加在 tailwind-site.css 之后，只负责「背景层次」，不改内容

   设计原则（2026-09-23 重做）：
   ① 一整块底，不是一块块拼的 —— 渐变铺满整个 body，区块带用半透明让它透出来
   ② 一个光源 —— 只有左上角一片青瓷；⛔ 不要再放第二个色源（暖金/白斑都会打架）
   ③ ⛔ 不要网格 —— 用户说过"有点花"，压到极淡又等于没有，干脆去掉
   ============================================================ */

body {
    /* 暖米纸底，比纯白柔和，也贴近品牌包装的米宣纸调 */
    background-color: #F8F6F1;
    /* 铺满整页：一次渐变贯穿全站，所以不会出现区块之间的断口 */
    background-image:
        /* 唯一光源：左上青瓷，向下自然消隐 */
        radial-gradient(1500px 880px at 16% -14%, rgba(63, 107, 94, .13), rgba(63, 107, 94, 0) 66%),
        /* 右下极淡的暖调收尾，避免页面下半部发灰 */
        radial-gradient(1300px 760px at 86% 112%, rgba(201, 164, 107, .07), rgba(201, 164, 107, 0) 72%);
    background-size: 100% 100%, 100% 100%;
    background-repeat: no-repeat, no-repeat;
}

/* 首屏：只在顶部加一层青瓷，向下干干净净地消隐到透明
   ⛔ 不要在产品图/商标后面放白色光斑 —— 会把右半边洗成纯白，
      跟左边断成两块（2026-09-23 用户点名过） */
.hero-wash {
    background-image: linear-gradient(to bottom,
        rgba(63, 107, 94, .10) 0%,
        rgba(63, 107, 94, .04) 52%,
        rgba(63, 107, 94, 0) 100%);
}

/* 浅色内容带：半透明薄雾，让全页底纹透出来，保持连续 */
.band-wash {
    background-image: linear-gradient(to bottom,
        rgba(237, 242, 239, .78) 0%,
        rgba(237, 242, 239, .42) 100%);
}

/* 深色带 / 页脚：底色照旧由 bg-brand-deep 给，这里只加一层极淡的顶部青光 */
.deep-wash {
    background-image: linear-gradient(to bottom,
        rgba(123, 163, 148, .10) 0%,
        rgba(123, 163, 148, 0) 46%);
}

@media (prefers-reduced-motion: reduce) {
    body, .hero-wash, .band-wash, .deep-wash { animation: none; }
}
