/* YYO Digital 手写自定义样式层 —— 不属于 Tailwind 编译产物，随需求迭代直接维护本文件 */
.baygo-clip{display:block;width:100%;height:auto}.baygo-clip-fallback[hidden]{display:none}@media (min-width:900px){.baygo-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(40px,6vw,96px);text-align:left}.baygo-phones{grid-column:2;grid-row:1;margin:0 auto;max-width:min(560px,100%)}.baygo-intro{grid-column:1;grid-row:1;max-width:100%;margin:0}.baygo-intro .lede{margin-left:0;margin-right:0}.baygo-intro .baygo-stats{justify-content:flex-start}}
.baygo-stat{flex:1 1 0;min-width:0;text-align:center;padding:clamp(22px,2.4vw,34px) 14px clamp(26px,2.8vw,40px);border-radius:20px;background:rgba(203,255,241,.1);box-shadow:inset 0 0 60px rgba(0,242,176,.07)}.baygo-stat b{font-size:clamp(28px,3.1vw,44px);line-height:1;color:var(--teal)}.baygo-stat span{display:block;margin-top:clamp(14px,1.4vw,22px);font-size:clamp(12px,1.05vw,15px)}.baygo-intro .baygo-stats{margin-top:clamp(44px,5.8vw,104px)}.baygo-intro .lede{color:#737a8a}
/* ===== earth: GBA globe (background = design asset assets/earth/earth-bg.svg) ===== */
.earth{position:relative;overflow:hidden;isolation:isolate;padding-top:clamp(90px,16.8vw,322px);padding-bottom:clamp(70px,10.7vw,116px);background:#010D19 url(../assets/earth/earth-bg.svg) center/cover fixed no-repeat}
/* design 1920x1080 layer, slice-covered like baygo-bg; content sits above it in DOM order */
@media (min-width:900px){
}
/* mobile: asset would slice across text — clean gradient stand-in */
@media (max-width:899px){
.earth h2{font-size:clamp(20px,5.2vw,26px);background-size:100% 100%}
}
/* heading + lede (610px gradient text white->#668ADF @50%, lede #737A8A 16/32 w986) */
.earth h2{font-size:clamp(26px,1.9vw,36px);line-height:1.39;margin-top:32px;background-image:linear-gradient(90deg,#FFFFFF 50%,#668ADF 100%);background-size:min(650px,94%) 100%;background-position:50% 50%;background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.earth h2 em{color:transparent;-webkit-text-fill-color:transparent}
.earth .lede{max-width:min(986px,94%);margin:34px auto 0;font-size:16px;line-height:32px;color:#737A8A}
/* tag pill: border white/20, 16px ls1.2, star icon 24 #678BDF */
.earth .section-tag{font-size:16px;letter-spacing:.075em;border-color:rgba(255,255,255,.2)}
.earth .section-tag svg{width:24px;height:24px;color:#678BDF}
/* feature cards: 3x400 gap36 total 1272, 2px rgba(172,205,246,.6) border, r24, bg rgba(6,7,10,.4), centered */
.earth .feature-cards{max-width:min(1272px,100%);gap:36px;margin-top:48px}
.earth .feature-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;min-height:220px;padding:24px 28px 20px;border:2px solid rgba(172,205,246,.6);border-radius:24px;background:rgba(6,7,10,.4)}
.earth .feature-card:hover{border-color:rgba(172,205,246,.85)}
.earth .feature-card .ico{border-color:transparent;margin:0 0 16px}
.earth .feature-card .ico svg{width:26px;height:26px}
.earth .feature-card h3{font-family:Arial,Helvetica,sans-serif;font-weight:400;font-size:20px;line-height:28px;letter-spacing:.075em;color:#fff;text-shadow:0 4px 8px rgba(0,0,0,.6);margin:0 0 16px}
.earth .feature-card p{max-width:344px;font-size:14px;line-height:24px;color:rgba(255,255,255,.5)}
/* CTA: 270x56, r32, vertical gradient white->#85A5EC, shadow 0 6 12 rgba(0,0,0,.3) */
.earth .btn-light{margin-top:48px;height:56px;padding:16px 24px;border:1px solid rgba(78,83,97,.3);border-radius:32px;background-image:linear-gradient(180deg,#FFFFFF 0%,#85A5EC 100%);box-shadow:0 6px 12px rgba(0,0,0,.3);font-size:18px;color:#06070A}
@media (max-width:1200px){.earth .feature-cards{gap:24px}.earth .feature-card{min-height:0}}
@media (max-width:768px){.earth .feature-cards{gap:20px}.earth .feature-card{padding:22px 20px 18px;min-height:0}.earth .btn-light{font-size:16px}}
/* ===== client-wall: design Group 1597880616 (5x3 tiles, rows ~208px, logo lum ~0.7) ===== */
.client-wall.standalone{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;margin-top:56px}
.client-wall .cw-cell{display:grid;place-items:center;min-height:184px;border-radius:24px}
.client-wall .cw-cell img{width:var(--w,120px);height:auto;max-width:none;max-height:none;-o-object-fit:contain;object-fit:contain;filter:none;opacity:var(--o,.7);transition:opacity var(--dur-hover) var(--ease-out),transform var(--dur-hover) var(--ease-out)}
.client-wall .cw-cell:hover img{opacity:1;transform:scale(1.04)}
.client-wall .cw-text{font-family:var(--font-head);font-size:clamp(22px,1.5vw,29px);line-height:1;color:#8f979f;letter-spacing:.02em}
@media (max-width:1200px){.client-wall.standalone{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:768px){.client-wall.standalone{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.client-wall .cw-cell{min-height:120px}.client-wall .cw-cell img{width:auto;max-width:64%;max-height:64%}}
/* ===== clients-band: 去除白色背景 —— 面板并入深色页底，黑卡加描边保证暗底可见 ===== */
.clients-band{background:transparent;box-shadow:none;border-radius:0;padding-top:clamp(64px,8vw,120px);padding-bottom:clamp(64px,8vw,120px);margin-bottom:0}
.clients-band .fade-down{display:none}
.clients-band .marquee-tile{background:#0B0D12;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 32px rgba(0,0,0,.85)}
#services .section-head h2{font-size:clamp(30px,3.35vw,64px);max-width:843px}
@media (max-width:899px){.clients-band{padding-top:56px;padding-bottom:56px}}

/* ---------- BAYGO stats: one-by-one entrance (JS-gated like info-row; count-up T2 fires 1500ms/1800ms/2100ms) ---------- */
body.hero-pending .baygo-stats .baygo-stat{opacity:0;transform:translateY(22px) scale(.96);transition:opacity 550ms var(--ease-gentle),transform 550ms var(--ease-gentle)}
body.hero-pending .baygo-stats.in .baygo-stat{opacity:1;transform:none}
body.hero-pending .baygo-stats.in .baygo-stat:nth-child(1){transition-delay:.35s}
body.hero-pending .baygo-stats.in .baygo-stat:nth-child(2){transition-delay:.5s}
body.hero-pending .baygo-stats.in .baygo-stat:nth-child(3){transition-delay:.65s}
@media (prefers-reduced-motion:reduce){html:not(.force-motion) .baygo-stats .baygo-stat{opacity:1;transform:none;transition:none}}

/* ===== hero-stage: ONE shared .hero-blobs layer spanning hero + clients-band =====
   光晕层挂在 .hero-stage（包裹两段的容器）里，hero 需透明背景才能透出来；
   底部 mask 渐隐防 stage 下缘硬裁（seam blob 会延伸到 band 底）。 */
.hero{background:transparent}
.hero-stage .hero-blobs{-webkit-mask-image:linear-gradient(180deg,#000 0,#000 74%,transparent 97%);mask-image:linear-gradient(180deg,#000 0,#000 74%,transparent 97%)}

/* band 交界阴影优化：亮线来自旧 .fade-up 顶栏渐变（面板转透明后多余），停用；
   band blob 容器 mask 顶/底双渐隐，让光晕从 hero 自然延续、无亮线无硬边 */
.clients-band .fade-up{display:none}
.clients-band .marquee-tile{box-shadow:0 18px 48px rgba(0,0,0,.55)}

/* pillars 进度轨间距：tw 的 margin-top:22px 会被卡片阴影吃掉（实测卡底-轨顶仅 ~18px），加大到呼吸感 */
.pillars-progress{margin-top:clamp(54px,4.5vw,64px)}
/* 轨道只有 5px 高，手指点不中：透明伪元素把命中区上下各扩 16px，视觉不变 */
.pillars-progress:after{content:"";position:absolute;left:0;right:0;top:-16px;bottom:-16px}

/* case studies 顶部投影：仿 .baygo-light:after 手法，顶缘从 earth 底色渐隐入页面底色，柔化区块切换硬边 */
#cases::before{content:"";position:absolute;left:0;right:0;top:0;height:420px;background:linear-gradient(#010D19,rgba(6,7,10,0));pointer-events:none;z-index:0}
#cases>.container{position:relative;z-index:1}

/* ============================================================
   mobile (<=899px) — 2026-10-14 UX audit remediation
   移动端问题全部集中在这一层：iOS 聚焦缩放、卡片留白、触达区、
   筛选条可点性、小字号。桌面断点完全不受影响。
   ============================================================ */

/* P1: 动态地址栏 —— 用可视视口高度，地址栏收起/展开都不再吃掉 hero 底部 */
.hero{min-height:100vh;min-height:100svh}

/* P2: 刘海/圆角安全区（配合 <meta name="viewport" viewport-fit=cover>） */
.header,.site-header{padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right))}
.hero-foot{padding-bottom:max(0px,env(safe-area-inset-bottom))}

/* P2: 反爬蜜罐字段——离屏但不离 DOM（api/lead.php 靠它挡机器人） */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;pointer-events:none}
.hp input{width:1px;height:1px;padding:0;border:0;margin:0}

@media (max-width:899px){
  /* P0: 输入框 <16px 时 iOS 聚焦会自动整页放大且回不去 */
  .field input,.field textarea{font-size:16px}

  /* P1: pillar 卡不再套桌面 420px 高度（卡内约 230px 空白，滑起来像没加载完） */
  .pillar-slide{height:auto}
  .pillar-card{min-height:236px}
  .pillar-card .go{padding-block:13px}   /* 触达区 18px -> 44px */

  /* P1: 触达区撑到 44px —— 手机上点 tel/mailto 不再点空 */
  .info-row{min-height:44px}
  .brand-logo{display:inline-flex;min-height:44px;align-items:center}
  .btn-ghost{min-height:44px;padding-block:12px}
  .info-row a{display:inline-flex;min-height:44px;align-items:center}

  /* P1: 案例筛选条改单行横滑，未选中态有底色（原来纯文字，看不出可点） */
  .filter-bar{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:6px}
  .filter-bar::-webkit-scrollbar{display:none}
  .filter-bar button{flex:none;white-space:nowrap;padding:12px 18px;min-height:44px}
  .filter-bar button[aria-pressed=false]{background:rgba(255,255,255,.06)}
  .filter-bar button:active{background:rgba(0,242,176,.18)}

  /* P1: 11px / 10px 小字抬到可读下限 */
  .case-face .meta{font-size:12px}
  .pillar-card .sub{font-size:12px;letter-spacing:.1em}
  .case-back .tag{padding:8px 14px}     /* 触达区（可点区域）也顺手放大 */

  /* P2: 触屏没有 hover —— 把只靠 hover 的微交互补成 active/focus 等价 */
  .client-wall .cw-cell:active img,.client-wall .cw-cell:focus-within img{opacity:1;transform:scale(1.04)}
  .case-card:active .case-thumb .phones,.case-card:focus-within .case-thumb .phones{transform:scale(var(--zoom-card))}
  .pillar-card:active .go,.pillar-card:focus-within .go{color:var(--teal)}
}

/* P2: 无 hover 能力的设备（触屏）统一给 active 反馈，避免"点了没反应" */
@media (hover:none){
  .filter-bar button:active{background:rgba(0,242,176,.18)}
  .earth .btn-light:active,.btn-teal:active{transform:translateY(1px);filter:brightness(.94)}
}
