/* E3-TOKENS:BEGIN */
/* ==========================================================================
   E3 BRAND TOKENS v3 — 唯一权威源 (2026-07-13)
   源文件: e3energy-workspace/brand/e3.tokens.css · 规范: brand/BRAND.md
   值全部取自线上真实设置（Blocksy palette / hero 实测 / h1-h6 字体设置）
   ⚠️ 页面里禁止裸 hex、禁止裸 font-family —— 只引 var(--e3-*)

   部署: python3 brand/deploy_css.py   （只替换 BEGIN/END 之间，不动其它 CSS）
   ⚠️ BEGIN/END 哨兵是部署脚本的边界标记，删掉会导致部署拒绝执行。
   ========================================================================== */
:root{
  --e3-ink:#080C0E;
  --e3-ink-soft:#515455;
  --e3-surface:#FFFFFF;
  --e3-canvas:#FAFBFC;
  --e3-muted:#F2F5F7;
  --e3-border:#E1E8ED;
  --e3-accent:#FCE838;
  --e3-accent-hover:#EDD20E;

  /* 字体 v3 (2026-07-12, Jeffrey 定): 换回 Poppins —— 站改造前 hero 用的就是它，更大气。
     Funnel Display/Sans 已弃用。单一家族，标题 700 / 正文 400。 */
  --e3-font-display:'Poppins',-apple-system,BlinkMacSystemFont,sans-serif;
  --e3-font-sans:'Poppins',-apple-system,BlinkMacSystemFont,sans-serif;

  --e3-r-pill:100px;
  --e3-r-card:16px;
  --e3-r-sm:10px;

  /* 阴影（2026-07-13 补：此前只在各处写死 rgba，没有 token） */
  --e3-shadow-card:0 6px 18px -12px rgba(8,12,14,.25);
  --e3-shadow-elevated:0 20px 38px -18px rgba(8,12,14,.45);

  /* 覆盖 Blocksy 的默认字体栈 —— Blocksy 不认识 Funnel Sans（不在它字体库里），
     会静默 fallback 回 system stack。直接接管它的变量，全站正文一次到位。 */
  --theme-font-stack-default:var(--e3-font-sans);
}

/* 直接接管 Blocksy 的字体变量。
   原因：Blocksy 把 h1-h6/正文的字体写进 --theme-font-family，且它的动态 CSS 有缓存，
   用 update_option 改 theme_mods 不触发它的重建 hook。接管变量 = 不依赖它重建，一次到位。 */
:root{ --theme-font-family:var(--e3-font-sans); }
h1,h2,h3,h4,h5,h6{ --theme-font-family:var(--e3-font-display); }

body,p,li,td,th,label,input,textarea,select,button,a{ font-family:var(--e3-font-sans); }
h1,h2,h3,h4,h5,h6{ font-family:var(--e3-font-display); }

/* header CTA — 主色已改黑，黄底配黑字（对比度 15.6:1） */
.ct-header-cta .ct-button{ color:var(--e3-ink) !important; border-color:var(--e3-accent) !important; }
.ct-header-cta .ct-button:hover,
.ct-header-cta .ct-button:focus{ color:var(--e3-ink) !important; }

/* ============ HEADER 响应式（2026-07-12 v2：导航字号放大）============
   Jeffrey：导航字体太小，要放大、要清楚。
   原本菜单被压到 11–13.5px，是为了给超长 CTA（"Book Your Free Energy
   Assessment" = 269px）腾地方。解法：所有断点统一用短 CTA 文案，腾出 ~130px，
   菜单字号直接提到 16px。

   注意（踩过的坑）：
   a) Blocksy 容器用 width:90%，只改 max-width 无效 —— width 必须一起改；
   b) Blocksy 菜单字号特异性更高，不加 !important 压不过；
   c) 汉堡按钮在桌面断点不渲染进 HTML，绝不能靠 CSS「隐藏菜单+显示汉堡」。
   =========================================================================== */

/* CTA：全断点短文案。原文字仍在 DOM（a11y / SEO 不受影响），只是视觉收短。 */
@media (min-width:1000px){
  .ct-header .ct-container{
    width:calc(100% - 48px) !important;
    max-width:min(1560px, calc(100vw - 48px)) !important;
  }
  .ct-header-cta .ct-button{
    font-size:0 !important;
    padding-inline:20px !important;
    white-space:nowrap;
  }
  .ct-header-cta .ct-button::after{
    content:"Free Assessment";
    font-size:14px;
    font-weight:700;
    font-family:var(--e3-font-sans);
    color:var(--e3-ink);
  }
}

/* 导航字号：逐档实测定档（iframe 按真实宽度加载后量出来的，不是拍脑袋）
   ≥1400 → 16px（清晰）；1300–1399 → 15px；1200–1299 → 14px；
   1100–1199 → 13px；1000–1099 → 12px（iPad 横屏，最挤的一档）
   实测：1200 用 15px 会重叠 -20px，1024 用 13px 会重叠 -14px，故如下细分。 */
@media (min-width:1400px){
  .ct-header [data-id="menu"] .ct-menu-link{ font-size:16px !important; letter-spacing:0 !important; }
}
@media (min-width:1300px) and (max-width:1399px){
  .ct-header [data-id="menu"] .ct-menu-link{ font-size:15px !important; letter-spacing:0 !important; }
}
@media (min-width:1200px) and (max-width:1299px){
  .ct-header [data-id="menu"] .ct-menu-link{ font-size:14px !important; letter-spacing:-.005em !important; }
  /* 1200px 实测差 7px —— 从间距挤，不缩字号 */
  .ct-header [data-id="menu"] .menu{ column-gap:4px !important; }
  .ct-header-cta .ct-button{ padding-inline:14px !important; }
}
@media (min-width:1100px) and (max-width:1199px){
  .ct-header [data-id="menu"] .ct-menu-link{ font-size:13px !important; letter-spacing:-.01em !important; }
  .ct-header [data-id="menu"] .menu{ column-gap:6px !important; }
  .ct-header-cta .ct-button{ padding-inline:12px !important; }
  .ct-header-cta .ct-button::after{ font-size:12.5px; }
}
@media (min-width:1000px) and (max-width:1099px){
  .ct-header [data-id="menu"] .ct-menu-link{ font-size:12px !important; letter-spacing:-.015em !important; }
  /* 1000px 一度卡在 0px 余量 —— 不再动字号（要保清晰），改从间距/logo/内距里挤 */
  .ct-header [data-id="menu"] .menu{ column-gap:2px !important; }
  .ct-header [data-id="menu"] .menu > li{ margin-inline:0 !important; }
  .ct-header-cta .ct-button{ padding-inline:8px !important; }
  .ct-header-cta .ct-button::after{ font-size:12px; }
  .ct-header .site-logo-container img{ max-height:20px !important; width:auto !important; }
  .ct-header .ct-container{ width:calc(100% - 24px) !important; max-width:calc(100vw - 24px) !important; }
}

/* 3) 兜底：菜单永远压不到 CTA 上 */
.ct-header-cta{ position:relative; z-index:2; }

/* ==========================================================================
   大块黄底 → 黑底反白 (2026-07-12)
   BRAND.md 规则：黄只做 CTA 按钮。但站上有三块大面积黄底（不是按钮）：
     9b4860d  1600×331  footer 上方 "It's Time To Reduce Energy Bills" banner
     a0d0df5   615×450  "Monitoring from your phone" 卡
     446c0a8   217×214  hero 里那张（已被图片盖住，看不见）
   Jeffrey 2026-07-12：「几个大块黄色，感觉有些不好看」→ 全部改黑底反白，
   黄回归按钮。黑底也和站上 "What are you looking for?" 的黑 section 成一套。
   ========================================================================== */

/* --- Monitoring from your phone --- */
.elementor-element-a0d0df5{ background-color:var(--e3-ink) !important; }
.elementor-element-a0d0df5 h1,.elementor-element-a0d0df5 h2,
.elementor-element-a0d0df5 h3,.elementor-element-a0d0df5 h4,
.elementor-element-a0d0df5 h5,.elementor-element-a0d0df5 h6{ color:#fff !important; }
.elementor-element-a0d0df5 p,
.elementor-element-a0d0df5 .elementor-widget-text-editor,
.elementor-element-a0d0df5 .elementor-widget-text-editor *{ color:rgba(255,255,255,.75) !important; }
/* 图标块原本是黑圆（黄底上）→ 黑底上要反过来：白底黑图标 */
.elementor-element-a0d0df5 a.elementor-icon{ background-color:#fff !important; color:var(--e3-ink) !important; }
.elementor-element-a0d0df5 a.elementor-icon svg,
.elementor-element-a0d0df5 a.elementor-icon svg *{ fill:var(--e3-ink) !important; stroke:var(--e3-ink) !important; color:var(--e3-ink) !important; }
/* Learn More 原本黑底白字（黄底上）→ 黑底上改黄底黑字 = 黄回归 CTA */
.elementor-element-a0d0df5 a.elementor-button,
.elementor-element-a0d0df5 .elementor-button{
  background-color:var(--e3-accent) !important;
  color:var(--e3-ink) !important;
}
.elementor-element-a0d0df5 a.elementor-button svg,
.elementor-element-a0d0df5 a.elementor-button svg *{ fill:var(--e3-ink) !important; stroke:var(--e3-ink) !important; }

/* --- footer 上方 CTA banner ---
   先试过改黑底：结果它和紧邻的黑色 footer 连成一整片，失去分界，
   而且黑底上的黑色 Subscribe 按钮直接消失了。
   改用浅灰底 + 黑字：既不是大块黄，又和黑 footer 有清晰分界，黄回归 Subscribe 按钮。 */
.elementor-element-9b4860d{ background-color:var(--e3-muted) !important; }
.elementor-element-9b4860d h1,.elementor-element-9b4860d h2,
.elementor-element-9b4860d h3,.elementor-element-9b4860d h4,
.elementor-element-9b4860d h5,.elementor-element-9b4860d h6{ color:var(--e3-ink) !important; }
.elementor-element-9b4860d p,
.elementor-element-9b4860d li,
.elementor-element-9b4860d label,
.elementor-element-9b4860d .elementor-widget-text-editor *,
.elementor-element-9b4860d .elementor-icon-list-text{ color:var(--e3-ink-soft) !important; }
.elementor-element-9b4860d .elementor-icon-list-icon svg,
.elementor-element-9b4860d .elementor-icon-list-icon svg *{ fill:var(--e3-ink) !important; }
/* Subscribe：原本黑底白字（黄底上）→ 浅灰底上改黄底黑字 = 黄回归 CTA */
.elementor-element-9b4860d button.wp-element-button,
.elementor-element-9b4860d button[type="submit"],
.elementor-element-9b4860d input[type="submit"]{
  background-color:var(--e3-accent) !important;
  color:var(--e3-ink) !important;
  border-color:var(--e3-accent) !important;
  font-weight:700 !important;
}
.elementor-element-9b4860d button.wp-element-button:hover,
.elementor-element-9b4860d button[type="submit"]:hover{
  background-color:var(--e3-accent-hover) !important;
}
/* Privacy Policy 链接原本是黄字（黄底上不可读）→ 浅灰底上改黑字下划线 */
.elementor-element-9b4860d a{ color:var(--e3-ink) !important; text-decoration:underline; }
.elementor-element-9b4860d input[type="email"]{
  background:#fff !important;
  border:1px solid var(--e3-border) !important;
  color:var(--e3-ink) !important;
}

/* --- hero 里那张被图片盖住的黄卡：改中性色，避免万一露出来是一块黄 --- */
.elementor-element-446c0a8{ background-color:var(--e3-surface) !important; }

/* ==========================================================================
   HERO 叠字修复 (2026-07-12)
   问题：hero 图片卡片里的 "BILL ANALYSIS" / "Up To" 直接压在照片上，
        底下那张黄卡被图片完全盖住 → 文字无承载、糊在图上不可读。
   修法：沿用站上已有的语言（"70%" 那个 pill、.ct-home-button-backdrop 的 blur），
        给文字加半透明白底 + 毛玻璃，不动 Elementor 结构。
   ========================================================================== */
.elementor-element-e1136c0 .elementor-widget-container > *,
.elementor-element-5e60ce8 .elementor-heading-title{
  display:inline-block;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  color:var(--e3-ink) !important;
  border-radius:var(--e3-r-pill);
  padding:4px 14px;
  box-shadow:0 2px 10px rgba(8,12,14,.10);
}
.elementor-element-5e60ce8 .elementor-heading-title{
  padding:2px 16px;
  border-radius:14px;
  font-weight:700;
}
/* hero 右侧视频卡上的 "How it works" —— 同样压在图上，给同一套 pill */
.elementor-element-52567f8 .elementor-heading-title,
.elementor-element-52567f8 .elementor-widget-container > *{
  display:inline-block;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  color:var(--e3-ink) !important;
  border-radius:var(--e3-r-pill);
  padding:4px 16px;
  box-shadow:0 2px 10px rgba(8,12,14,.10);
}

/* --- "BACKUP POWER / KEEPS YOUR ESSENTIALS RUNNING"（实测对比度仅 1.4:1）---
   它的容器 .ct-home-button-backdrop 站上本来就设了 backdrop-filter:blur(35px)，
   ——设计意图就是毛玻璃卡片——但背景色是 rgba(245,245,245,.09) 近乎全透明，
   所以 blur 完全看不出来，文字等于直接压在照片上。把底色补够即可，不用另造样式。 */
.ct-home-button-backdrop{
  background-color:rgba(255,255,255,.82) !important;
  box-shadow:0 4px 18px rgba(8,12,14,.10);
}
.ct-home-button-backdrop, .ct-home-button-backdrop *{ color:var(--e3-ink) !important; }

/* --- 产品照片卡上的白字（"Residential Energy Storage" / "Commercial Battery
   Systems"，实测 1.0:1，等于看不见）---
   照片是浅色的，白字压上去没有任何承载。加一层从底部起的深色渐变遮罩
   （标准做法，不遮挡产品主体），文字提到遮罩之上。 */
.elementor-element-f79aa33::after,
.elementor-element-cdf6817::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:58%;
  background:linear-gradient(to top, rgba(8,12,14,.78), rgba(8,12,14,.35) 45%, transparent);
  pointer-events:none;
  z-index:0;
  border-radius:0 0 var(--e3-r-card) var(--e3-r-card);
}
.elementor-element-f79aa33 > *,
.elementor-element-cdf6817 > *{ position:relative; z-index:1; }


/* --- "Get A System Sized To Your Bills" 块的按钮（widget 46056931）---
   原本是黑底白字 "Get Free Quote"，与页面其他主 CTA 不一致。
   文案已在 DB 里改成 "Book Your Free Energy Assessment"，这里把样式也统一成
   黄色 CTA 胶囊 + 右侧圆形 ↗（和 .e3-btn--cta 一套）。 */
.elementor-element-46056931 a.elementor-button{
  background-color:var(--e3-accent) !important;
  color:var(--e3-ink) !important;
  border-radius:var(--e3-r-pill) !important;
  font-weight:700 !important;
  box-shadow:0 6px 16px rgba(252,232,56,.32);
  display:inline-flex !important;
  align-items:center;
  gap:14px;
  padding:6px 8px 6px 26px !important;
  min-height:52px;
}
.elementor-element-46056931 a.elementor-button:hover{
  background-color:var(--e3-accent-hover) !important;
  color:var(--e3-ink) !important;
}
/* 右侧圆形 ↗（用伪元素画，不改 HTML） */
.elementor-element-46056931 a.elementor-button::after{
  content:"";
  width:38px;height:38px;flex:none;
  border-radius:50%;
  background:rgba(8,12,14,.1) no-repeat center /15px 15px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23080C0E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7'/%3E%3Cpath d='M8 7h9v9'/%3E%3C/svg%3E");
}

/* ==========================================================================
   E3 首页区块组件 (e3-* )
   给 Elementor HTML widget 用。widget 里只放结构，样式全在这里。
   ========================================================================== */
/* 垂直节奏：原本上下各 80px，两块相邻时叠成 160px 空档 → 收到 56px。
   块与块的分界改由背景色带承担，不再靠大片空白硬撑。 */
.e3-blk{max-width:1180px;margin:0 auto;padding:56px 24px;font-family:var(--e3-font-sans);color:var(--e3-ink)}
.e3-blk *{box-sizing:border-box}

/* 全宽浅灰色带（不改 HTML 结构，用 box-shadow 向两侧铺满 + clip-path 裁掉纵向溢出）。
   规律：有卡片的块 → 浅灰底，卡片白色自然浮起；纯文字的块 → 白底。 */
.e3-blk--muted{
  background:var(--e3-muted);
  box-shadow:0 0 0 100vmax var(--e3-muted);
  clip-path:inset(0 -100vmax);
}
.e3-blk--plain{
  background:var(--e3-surface);
  box-shadow:0 0 0 100vmax var(--e3-surface);
  clip-path:inset(0 -100vmax);
}
/* 浅灰底上的卡片：去掉阴影，靠底色对比浮起，更干净 */
.e3-blk--muted .e3-card{box-shadow:none}

/* ⚠️ 色带必须延伸到外层 Elementor 容器上。
   否则外层 e-con 是透明的、且上下各留了 20–80px 的间距，那段会露出页面底色
   (--e3-canvas #FAFBFC)，在色带和相邻块之间形成一条多余的浅白带
   （Jeffrey 2026-07-12：「两个区块之间有多余的区块行」）。 */
.elementor .e-con:has(.e3-blk--muted){ background-color:var(--e3-muted) !important; }
.elementor .e-con:has(.e3-blk--plain){ background-color:var(--e3-surface) !important; }
/* 兜底：不支持 :has() 的浏览器走这些已知 class */
.e3-sam-pillars, .e3-sam-how, .e3-insights-entry{ background-color:var(--e3-muted); }
.e3-sam-savings, .e3-sam-team{ background-color:var(--e3-surface); }

/* 顶层区块之间 Elementor 留了 margin，会露出 body 底色 (--e3-canvas)，
   在色带块和相邻块之间夹一条第三色窄带（Jeffrey 看到的「多余的区块行」）。

   踩过的两个坑：
   a) 一刀切 `.elementor > .e-con { margin:0 }` → 全站原生块挤成一团，
      因为它们 padding 全是 0、完全靠 margin 撑间距。已撤销。
   b) 改用固定的 `margin-top:-30px` 去抵消 → 也错，因为**相邻块的 margin 根本不统一**
      （实测 Indicative 是 margin-top:80px、Why E3 是 margin-bottom:60px）。

   正解（不依赖任何具体数值）：把色带块自身、以及紧邻它的上下两块的 margin 归零。
   垂直呼吸全部由 .e3-blk 自己的 56px padding 提供 —— 那部分在块内，会被染成色带色，
   所以既有间距、又不会露出 canvas。其余块的 margin 一概不动。 */
.elementor > .e-con:has(.e3-blk){
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
/* 紧邻色带块的【下一块】：去掉 margin-top（这个选择器合法） */
.elementor > .e-con:has(.e3-blk) + .e-con{ margin-top:0 !important; }

/* 紧邻色带块的【上一块】：CSS 没有「前兄弟」选择器，
   而 `:has(+ .e-con:has(.e3-blk))` 是**无效选择器**（相对选择器里不能再嵌 :has），
   浏览器会整条丢弃 —— 我一开始就是栽在这，规则从没生效过。
   只能点名。实测全站只有这两块真有 margin-bottom（其余本来就是 0）：
     cd235bf  hero        margin-bottom:30px  → 下接四支柱
     68343cd  Why E3      margin-bottom:60px  → 下接 after-install
   ⚠️ 首页区块顺序若变动，这两个 id 要跟着复查。 */
.elementor > .elementor-element-cd235bf,
.elementor > .elementor-element-68343cd{ margin-bottom:0 !important; }

/* ===== 四支柱（首页 hero 下方第一块）=====
   刻意不用卡片：下面的 "From first call to switch-on" 已经是 4 列白卡 + 标题 + 描述，
   四支柱再用同一套就是同一块重复两遍（Jeffrey 2026-07-12 指出）。
   改成 2×2 大格：黑色实心图标块在左、文字在右，每格空间翻倍，分量更足。 */
.e3-pillars{display:grid;grid-template-columns:1fr 1fr;gap:0}
.e3-pillar{display:flex;gap:22px;padding:36px 40px;border-top:1px solid var(--e3-border)}
.e3-pillar:nth-child(-n+2){border-top:0}
.e3-pillar:nth-child(odd){border-right:1px solid var(--e3-border);padding-left:0}
.e3-pillar:nth-child(even){padding-right:0}
.e3-pillar-ic{flex:none;width:52px;height:52px;border-radius:14px;background:var(--e3-ink);
  display:flex;align-items:center;justify-content:center}
.e3-pillar-ic svg{width:24px;height:24px;stroke:#fff;stroke-width:1.4;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.e3-pillar h4{font-family:var(--e3-font-display);font-size:1.2rem;font-weight:600;
  margin:0 0 10px;letter-spacing:-.01em;color:var(--e3-ink)}
.e3-pillar p{font-size:.97rem;line-height:1.7;color:var(--e3-ink-soft);margin:0;max-width:420px}
@media(max-width:900px){
  .e3-pillars{grid-template-columns:1fr}
  .e3-pillar{padding:24px 0 !important;border-right:0 !important}
  .e3-pillar:nth-child(2){border-top:1px solid var(--e3-border)}
}


/* ⚠️ 2026-07-12 事故恢复：下面这几段组件样式曾被一次 `s[:a]+new+s[b:]` 的切片替换
   整段切掉（.e3-eyebrow / .e3-btn / .e3-arw / .e3-ic），导致首页按钮箭头的 SVG
   失去 `fill:none`，直接渲染成 1132×1132 的黑色三角，页面看起来像崩了。
   教训：改 CSS 用「精确 replace(old,new)」，绝不用按 index 切片的方式删中间内容。 */

.e3-eyebrow{display:inline-block;background:var(--e3-muted);color:var(--e3-ink);
  font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:9px 18px;border-radius:var(--e3-r-pill);margin-bottom:26px}

.e3-btn{display:inline-flex;align-items:center;gap:14px;min-height:52px;
  padding:6px 8px 6px 26px;border-radius:var(--e3-r-pill);font-family:var(--e3-font-sans);
  font-size:.95rem;font-weight:600;text-decoration:none;border:1px solid transparent;
  transition:.2s cubic-bezier(.2,0,0,1)}
.e3-btn .e3-arw{width:38px;height:38px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;flex:none}
.e3-btn .e3-arw svg{width:15px;height:15px;stroke-width:2;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.e3-btn--cta{background:var(--e3-accent);color:var(--e3-ink)}
.e3-btn--cta .e3-arw{background:rgba(8,12,14,.1);stroke:var(--e3-ink)}
.e3-btn--cta:hover{background:var(--e3-accent-hover);color:var(--e3-ink)}
.e3-btn--ghost{background:transparent;color:var(--e3-ink);border-color:var(--e3-ink)}
.e3-btn--ghost .e3-arw{background:var(--e3-muted);stroke:var(--e3-ink)}
.e3-btn--ghost:hover{background:var(--e3-ink);color:#fff}
.e3-btn--ghost:hover .e3-arw{background:rgba(255,255,255,.14);stroke:#fff}

.e3-ic{width:46px;height:46px;border-radius:var(--e3-r-sm);background:var(--e3-muted);
  display:flex;align-items:center;justify-content:center;color:var(--e3-ink);margin-bottom:22px}
.e3-ic svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.4;fill:none;
  stroke-linecap:round;stroke-linejoin:round}

/* 兜底：任何 e3 块里的内联 SVG 都不许有实心填充（黑三角事故的第二道保险） */
.e3-blk svg{fill:none}

.e3-g4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.e3-g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.e3-step{font-family:var(--e3-font-display);font-size:1.5rem;font-weight:700;
  color:var(--e3-ink);opacity:.22;margin-bottom:16px;letter-spacing:-.02em}

.e3-sv{background:var(--e3-ink);border-radius:24px;padding:52px 48px;color:#fff}
.e3-sv-row{display:grid;grid-template-columns:1fr auto 1fr auto 1.1fr;gap:32px;align-items:center}
.e3-sv-lab{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-bottom:12px;font-weight:600}
.e3-sv-amt{font-family:var(--e3-font-display);font-size:2.9rem;font-weight:600;
  line-height:1;letter-spacing:-.03em;color:#fff}
.e3-sv-amt .e3-u{font-family:var(--e3-font-sans);font-size:.95rem;font-weight:400;
  color:rgba(255,255,255,.45);letter-spacing:0}
.e3-sv-arrow{color:rgba(255,255,255,.3)}
.e3-sv-arrow svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.5;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.e3-sv-div{width:1px;height:64px;background:rgba(255,255,255,.12)}
.e3-note{font-size:.85rem;color:var(--e3-ink-soft);line-height:1.7;margin:28px 0 0;max-width:920px}
.e3-note strong{color:var(--e3-ink);font-weight:600}

.e3-list{list-style:none;display:grid;gap:22px;max-width:720px;margin:0;padding:0}
.e3-list li{display:flex;gap:16px;align-items:flex-start;font-size:1rem;
  color:var(--e3-ink-soft);line-height:1.6}
.e3-list svg{flex:none;width:22px;height:22px;margin-top:2px;stroke:var(--e3-ink);
  stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.e3-list strong{color:var(--e3-ink);font-weight:600}

.e3-post{display:block;text-decoration:none;color:inherit;transition:border-color .2s}
.e3-post:hover{border-color:var(--e3-ink)}
.e3-post .e3-meta{font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--e3-ink-soft);margin-bottom:16px}

.e3-faq details{border-bottom:1px solid var(--e3-border);padding:26px 0}
.e3-faq details:first-child{border-top:1px solid var(--e3-border)}
.e3-faq summary{font-family:var(--e3-font-display);font-weight:600;font-size:1.15rem;
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;color:var(--e3-ink)}
.e3-faq summary::-webkit-details-marker{display:none}
.e3-faq summary::after{content:"+";color:var(--e3-ink-soft);font-weight:400;font-size:1.4rem;line-height:1}
.e3-faq details[open] summary::after{content:"−"}
.e3-faq p{margin:14px 0 0;color:var(--e3-ink-soft);font-size:.98rem;line-height:1.7;max-width:760px}

@media(max-width:900px){
  .e3-g4,.e3-g3{grid-template-columns:1fr}
  .e3-sv-row{grid-template-columns:1fr;gap:24px;text-align:center}
  .e3-sv-div,.e3-sv-arrow{display:none}
  .e3-blk h2.e3-h{font-size:1.9rem}
  .e3-blk{padding:56px 20px}
  .e3-sv{padding:36px 26px}
}

/* 装饰性大引号（testimonial widget c2137ba）——它的 custom CSS 写死了 Georgia serif。
   Georgia 在作废名单上（BRAND.md §字体：单一家族 Poppins）。不去改 _elementor_data，
   直接从这里覆盖字体，字形保留原样（引号 glyph 在 Poppins 里同样存在）。
   2026-07-13 线上实测发现：它是全站最后 2 处作废字体之一。 */
.elementor-element-c2137ba .elementor-widget-container::before{
  font-family:var(--e3-font-display) !important;
  font-weight:800;
}
/* Blocksy 主题自带的 pullquote 默认字体也是作废字体（每页都发，用到该区块时才生效）。
   一并接管，保证「单一字体家族」在任何区块类型下都成立。 */
.wp-block-pullquote{ --theme-font-family:var(--e3-font-display); }
/* 文章 hero：主题把标题 + 摘要压在特色图上，但摘要用的是正文灰(--e3-ink-soft)，
   压在航拍图这种浅色图上完全读不清。加一层从下往上的暗色 scrim + 摘要反白。
   全站博文都受益，不是只修某一篇。（2026-07-14 线上实测发现） */
.page-title-wrap,.entry-header,.ct-featured-image{position:relative}
.page-title-wrap::before,.entry-header::before{
  content:"";position:absolute;top:0;bottom:0;
  /* 通栏：容器只有内容宽，inset:0 会在图上留下两条竖边。拉到 100vw 才盖满 */
  left:50%;transform:translateX(-50%);width:100vw;
  background:linear-gradient(180deg,rgba(8,12,14,.30) 0%,rgba(8,12,14,.72) 100%);
  pointer-events:none;
}
.page-title-wrap>*,.entry-header>*{position:relative;z-index:1}
h1.page-title{color:var(--e3-surface)}
.page-title-wrap .entry-excerpt,
.page-title-wrap p,
.entry-header .entry-excerpt,
.entry-header p{color:rgba(255,255,255,.88) !important}
.page-title-wrap .entry-meta,.page-title-wrap .entry-meta a,
.entry-header .entry-meta,.entry-header .entry-meta a{color:rgba(255,255,255,.75) !important}

/* ==========================================================================
   首页「Recent project」品牌视频区块 (2026-07-14)
   取代原来的「Indicative scenarios」——那块只有三个标着 (indicative) 的假设场景，
   标题下方还空了 500px、统计数字显示 0%。它占的是「证明」的位置，
   现在换成第一个真实、可具名、有政府背书的案例。
   ========================================================================== */
.e3-vid{background:var(--e3-ink);padding:76px 24px}
.e3-vid-in{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.35fr 1fr;gap:52px;align-items:center}
.e3-vid-player{position:relative;border-radius:var(--e3-r-card);overflow:hidden;aspect-ratio:16/9;background:#000;cursor:pointer}
.e3-vid-player video,.e3-vid-player img{width:100%;height:100%;object-fit:cover;display:block}
.e3-vid-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(8,12,14,.28);transition:background .2s}
.e3-vid-player:hover .e3-vid-play{background:rgba(8,12,14,.12)}
.e3-vid-play span{width:76px;height:76px;border-radius:50%;background:var(--e3-accent);display:flex;align-items:center;justify-content:center}
.e3-vid-play svg{width:26px;height:26px;margin-left:4px;fill:var(--e3-ink)}
.e3-vid-eyebrow{display:inline-block;background:#1b2124;color:var(--e3-surface);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border-radius:var(--e3-r-pill);padding:.45em 1.05em;margin-bottom:18px}
.e3-vid h2{color:var(--e3-surface);font-size:2.1rem;line-height:1.18;letter-spacing:-.02em;margin:0 0 16px;font-weight:700}
.e3-vid p{color:rgba(255,255,255,.7);font-size:1.02rem;line-height:1.6;margin:0 0 26px}
.e3-vid-stats{display:flex;gap:34px;margin:0 0 30px;flex-wrap:wrap}
.e3-vid-stat b{display:block;color:var(--e3-accent);font-size:1.75rem;font-weight:700;line-height:1.1}
.e3-vid-stat span{color:rgba(255,255,255,.55);font-size:.8rem;letter-spacing:.05em;text-transform:uppercase}
.e3-vid a.e3-vid-cta{background:var(--e3-accent);color:var(--e3-ink) !important;font-weight:700;text-decoration:none !important;padding:.9em 1.7em;border-radius:var(--e3-r-pill);display:inline-block}
.e3-vid a.e3-vid-cta:hover{background:var(--e3-accent-hover)}
@media(max-width:900px){
  .e3-vid{padding:56px 20px}
  .e3-vid-in{grid-template-columns:1fr;gap:32px}
  .e3-vid h2{font-size:1.7rem}
}

/* ==========================================================================
   /project/ 页 · 真实案例卡 (2026-07-14)
   该页此前一个真实案例都没有，只有三个标着 (indicative) 的假设场景。
   ========================================================================== */
.e3-case{display:grid;grid-template-columns:1.15fr 1fr;border:1px solid var(--e3-border);border-radius:var(--e3-r-card);overflow:hidden;background:var(--e3-surface);max-width:1180px;margin:0 auto}
.e3-case-img{position:relative;min-height:420px}
.e3-case-img img{width:100%;height:100%;object-fit:cover;display:block}
.e3-case-tag{position:absolute;top:18px;left:18px;background:var(--e3-accent);color:var(--e3-ink);font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.45em 1em;border-radius:var(--e3-r-pill)}
.e3-case-body{padding:44px;display:flex;flex-direction:column;justify-content:center}
.e3-case-body h3{font-size:1.55rem;color:var(--e3-ink);margin:0 0 6px;font-weight:700;line-height:1.25}
.e3-case-loc{color:var(--e3-ink-soft);font-size:.9rem;margin:0 0 20px}
.e3-case-body>p{margin:0 0 24px;line-height:1.65;color:var(--e3-ink-soft)}
.e3-case-specs{display:flex;border-top:1px solid var(--e3-border);border-bottom:1px solid var(--e3-border);margin-bottom:26px}
.e3-case-spec{flex:1;padding:18px 0}
.e3-case-spec+.e3-case-spec{border-left:1px solid var(--e3-border);padding-left:20px}
.e3-case-spec b{display:block;font-size:1.3rem;color:var(--e3-ink);font-weight:700}
.e3-case-spec span{font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--e3-ink-soft)}
.e3-case-body a.e3-case-cta{align-self:flex-start;background:var(--e3-ink);color:var(--e3-surface) !important;text-decoration:none !important;font-weight:600;padding:.85em 1.6em;border-radius:var(--e3-r-pill);font-size:.95rem}
@media(max-width:900px){
  .e3-case{grid-template-columns:1fr}
  .e3-case-img{min-height:280px}
  .e3-case-body{padding:32px 26px}
}

/* ==========================================================================
   首页「Why E3 Energy」三栏特性卡 (2026-07-14)
   取代原来的三个 Elementor counter 组件。它们显示 70% / 24/7 / 5 ——
   70% 和 5 没有任何说明（无来源的对外数字宣称），而且每张卡右边还挂着
   「May 13, 2026」这类模板残留的垃圾日期，计数器还和区块标题重叠。
   Jeffrey 2026-07-14 定：删掉数字，保留真实文案，做成干净的三栏。
   ========================================================================== */
/* 上内距 44px：标题容器的 padding-bottom 是 0，卡片会直接贴上去（实测间隙 0px）。
   而且「View All」按钮(75px 高)比它所在的容器(65px)还高，会溢出压到卡片上。
   （2026-07-14 Jeffrey 指出，iframe 实测确认） */
.e3-why{max-width:1180px;margin:0 auto;padding:44px 24px 76px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.e3-why-card{
  background:var(--e3-surface);
  border:1px solid var(--e3-border);
  border-radius:var(--e3-r-card);
  padding:36px 32px;
  display:flex;
  flex-direction:column;
}
.e3-why-ic{
  width:46px;height:46px;
  border-radius:var(--e3-r-sm);
  background:var(--e3-ink);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:22px;
}
.e3-why-ic svg{width:22px;height:22px;fill:none;stroke:var(--e3-surface);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.e3-why-card h3{font-size:1.22rem;font-weight:700;color:var(--e3-ink);margin:0 0 10px;line-height:1.3}
.e3-why-card p{margin:0;color:var(--e3-ink-soft);line-height:1.65;font-size:.98rem}
@media(max-width:900px){
  .e3-why{grid-template-columns:1fr;gap:20px;padding-bottom:56px}
  .e3-why-card{padding:30px 26px}
}

/* E3-TOKENS:END */