/* ============================================================================
   EGO · Calm Focus v3 —— 首页视觉丰富化层（第 2 层样式）
   引入方式：必须放在 templates/index.html 最后一个内联 </style> 之后
             （与 ego-ui-v3-index.css 相邻的那一行），否则同优先级会被内联样式压掉。
   约束：纯离线零外链；所有配色/圆角/字号取设计令牌；不改动任何用户文案。
   ========================================================================== */

/* ---------- 1. 统一线性图标集：24×24 viewBox / 1.75 描边 / 圆头圆角 / currentColor ---------- */
.ego-icon-sprite{position:absolute;width:0;height:0;overflow:hidden;}
.ic,.icg{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
.ic{width:20px;height:20px;vertical-align:-4px;}
h4>.ic,strong>.ic{margin-right:8px;}
.ic-blue{color:var(--ego-primary);}
.ic-teal{color:var(--ego-teal);}
.ic-purple{color:var(--ego-purple);}
.ic-amber{color:var(--ego-amber);}
.ic-ink{color:var(--ego-text-2);}

/* ---------- 2. 图片槽位：固定宽高比 + 缺图时回落同比例品牌色装饰块 ---------- */
.ego-figure{
  position:relative;margin:0;overflow:hidden;border-radius:var(--ego-radius);
  border:1px solid var(--ego-line);
  background:linear-gradient(140deg,var(--ego-primary-soft),var(--ego-teal-soft) 58%,#fff);
}
.ego-figure-img{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;object-fit:cover;}
.ego-figure-fallback{
  position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;
  color:rgba(19,184,166,.5);
}
.ego-figure-deco{width:82%;height:82%;}
.ego-figure-deco circle{fill:none;stroke:currentColor;stroke-width:1.25;opacity:.55;}
.ego-figure-deco .deco-spark{
  fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;opacity:.85;
}
/* 图片缺失/加载失败：隐藏 img（避免破图图标），下面的装饰块自然成为占位 */
.ego-figure.ego-noimg .ego-figure-img{display:none;}
.ego-r-1x1{aspect-ratio:1 / 1;}
.ego-r-4x3{aspect-ratio:4 / 3;}
.ego-r-16x9{aspect-ratio:16 / 9;}

/* ---------- 3. 首屏：左文案 + 右 1:1 主视觉 ---------- */
.hero-grid{
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:54px;align-items:center;
}
.hero-media{align-self:center;width:100%;}
.ego-figure-hero{
  background:linear-gradient(140deg,rgba(255,255,255,.20),rgba(19,184,166,.26) 52%,rgba(124,92,252,.34)),#12305E;
  border-color:rgba(255,255,255,.26);
  color:rgba(255,255,255,.66);
  box-shadow:0 26px 60px rgba(8,22,48,.38);
}

/* ---------- 4. 三端链路 / 数据流图（内联 SVG） ---------- */
.ego-diagram{
  background:var(--ego-card);border:1px solid var(--ego-line);border-radius:var(--ego-radius);
  box-shadow:var(--ego-shadow);padding:26px;
}
.ego-flow-wrap{width:100%;}
.ego-flow{display:block;width:100%;height:auto;font-family:inherit;}
.ego-flow .fnode{stroke-width:1.75;}
.ego-flow .fn-a{fill:var(--ego-primary-soft);stroke:var(--ego-primary);}
.ego-flow .fn-b{fill:var(--ego-teal-soft);stroke:var(--ego-teal);}
.ego-flow .fn-c{fill:var(--ego-purple-soft);stroke:var(--ego-purple);}
.ego-flow .ftitle{font-size:17px;font-weight:700;fill:var(--ego-text);}
.ego-flow .fdesc{font-size:12.5px;fill:var(--ego-text-2);}
.ego-flow .fedge{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;}
.ego-flow .fzone{fill:#FBFCFE;stroke:var(--ego-line);stroke-width:1.5;stroke-dasharray:7 7;}
.ego-flow .fzonetext{font-size:12px;font-weight:700;fill:var(--ego-text-3);letter-spacing:1.2px;}
.ego-flow marker path{fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
.ego-flow .mhead-a{stroke:var(--ego-primary);}
.ego-flow .mhead-b{stroke:var(--ego-teal);}

/* ---------- 5. 恢复曲线概念示意（无任何数值刻度） ---------- */
.ego-chart-wrap{width:100%;}
.ego-chart{display:block;width:100%;height:auto;font-family:inherit;}
.ego-chart .curve{fill:none;stroke:var(--ego-primary);stroke-width:2.25;stroke-linecap:round;}
.ego-chart .base{fill:none;stroke:var(--ego-text-3);stroke-width:1.5;stroke-dasharray:7 7;opacity:.6;}
.ego-chart .dot{fill:#fff;stroke:var(--ego-primary);stroke-width:2.25;}
.ego-chart .lbl{font-size:14px;font-weight:700;fill:var(--ego-text-2);}

/* ---------- 6. 项目文化区：图文交替版式 ---------- */
.ego-band{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:26px;align-items:start;
}
.ego-band .ego-figure{align-self:start;}
.ego-band .value{align-self:stretch;display:flex;flex-direction:column;justify-content:center;}
.ego-figure-privacy{background:linear-gradient(140deg,var(--ego-primary-soft),var(--ego-teal-soft) 58%,#fff);color:rgba(19,184,166,.5);}
.ego-figure-referral{background:linear-gradient(140deg,var(--ego-purple-soft),var(--ego-primary-soft) 58%,#fff);color:rgba(124,92,252,.45);}

/* ---------- 7. 响应式：1280×720 投影与窄屏都不破版 ---------- */
@media (max-width:1280px){
  .hero-grid{gap:44px;}
}
@media (max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:34px;}
  .hero-media{max-width:440px;margin:0 auto;}
}
@media (max-width:860px){
  .ego-band{grid-template-columns:1fr;}
  .ego-diagram{padding:18px;}
}
@media (max-width:900px){
  /* 窄屏下示意图保底不缩成糊字，改为容器内横向滚动（不会造成页面横向溢出） */
  .ego-flow-wrap,.ego-chart-wrap{overflow-x:auto;}
  .ego-flow{min-width:780px;}
  .ego-chart{min-width:620px;}
}
@media print{
  .ego-figure{box-shadow:none;}
}