/* ==========================================================
   华中天地环保 · 品牌视觉 v3（明亮版）
   浅色底 + 深色字 + 品牌蓝绿点缀
   替代原深色 Hero：阳光、亮丽、大气
   ========================================================== */

:root {
  --brand: #0B4C8C;
  --brand-d: #073A6B;
  --brand-l: #E8F0F9;
  --brand-2: #0E8A5F;
  --brand-2d: #0A6B4A;
  --brand-2l: #E8F6F0;
  --cyan: #1FA8C4;
  --ink-deep: #0A3559;     /* 主标题深蓝 */
  --ink-mid: #3D4B46;
  --ink-soft: #6B7A75;
  --sun-1: #FBFDFE;        /* 近白 */
  --sun-2: #EEF6FB;        /* 淡蓝 */
  --sun-3: #E9F5EF;        /* 淡绿 */
}

/* ==========================================================
   首页 Hero · 明亮浅色
   ========================================================== */
.hero-tech {
  background:
    radial-gradient(920px 470px at 84% -8%, rgba(31,168,196,.18), transparent 62%),
    radial-gradient(740px 400px at 6% 106%, rgba(14,138,95,.16), transparent 60%),
    linear-gradient(160deg, var(--sun-1) 0%, var(--sun-2) 46%, var(--sun-3) 100%);
  color: var(--ink-mid);
  border-bottom: 1px solid #E1EBF2;
}
.hero-tech::before {
  background:
    radial-gradient(680px 360px at 78% 10%, rgba(31,168,196,.13), transparent 68%),
    radial-gradient(520px 300px at 14% 88%, rgba(14,138,95,.10), transparent 66%);
}
.hero-tech::after {
  background-image:
    linear-gradient(rgba(11,76,140,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,76,140,.055) 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: radial-gradient(circle at 50% 32%, #000 0%, transparent 76%);
  -webkit-mask-image: radial-gradient(circle at 50% 32%, #000 0%, transparent 76%);
}

.hero-tech .eyebrow {
  background: #FFFFFF;
  border: 1px solid #C7E3D8;
  color: var(--brand-2d);
  box-shadow: 0 2px 10px rgba(14,138,95,.10);
}
.hero-tech .eyebrow .dot { background: var(--brand-2); box-shadow: 0 0 0 3px rgba(14,138,95,.16); }

.hero-tech h1 {
  color: var(--ink-deep);
  text-shadow: none;
}
.hero-tech h1 em {
  background: linear-gradient(100deg, #0E8A5F 0%, #0C7C8A 52%, #146FA8 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.hero-tech p.lead { color: var(--ink-mid); }

.hero-tech .hero-num { border-top-color: #DCE8F1; }
.hero-tech .hero-num strong { color: var(--ink-deep); }
.hero-tech .hero-num strong i { color: var(--brand-2); }
.hero-tech .hero-num span { color: var(--ink-soft); }

.hero-tech .btn-primary {
  background: var(--brand-2);
  color: #fff;
  box-shadow: 0 8px 24px rgba(14,138,95,.26);
}
.hero-tech .btn-primary:hover { background: var(--brand-2d); box-shadow: 0 10px 30px rgba(14,138,95,.34); }
.hero-tech .btn-ghost {
  background: #FFFFFF;
  border-color: #CFE0EC;
  color: var(--brand-d);
  box-shadow: 0 2px 10px rgba(11,76,140,.07);
}
.hero-tech .btn-ghost:hover { border-color: var(--brand-2); color: var(--brand-2d); background: #F6FCF9; }

/* Hero 实景底图：极淡，仅作质感 */
.hero-photo .hero-bg {
  opacity: .055;
  filter: saturate(.5) contrast(1.02);
  mix-blend-mode: multiply;
}

/* 剖面卡 · 白卡 */
.spec-card {
  background: #FFFFFF;
  border: 1px solid #DBE8F2;
  box-shadow: 0 20px 54px rgba(11,76,140,.13), 0 2px 8px rgba(11,76,140,.05);
}
.spec-card .cap { color: var(--ink-soft); }

/* 走马灯 · 白底 */
.ticker {
  background: #FFFFFF;
  border-top: 1px solid #E4EEF5;
  border-bottom: 1px solid #E4EEF5;
}
.ticker-in span { color: var(--ink-soft); }
.ticker-in span::before { background: var(--brand-2); opacity: .85; }

/* ==========================================================
   轮播 · 白卡片
   ========================================================== */
.carousel {
  border: 1px solid #DBE8F2;
  background: #FFFFFF;
  box-shadow: 0 18px 48px rgba(11,76,140,.12);
}
.slide-txt .k { color: var(--brand-2); }
.slide-txt h3 { color: var(--ink-deep); }
.slide-txt p { color: var(--ink-mid); }
.slide-txt .kv div strong { color: var(--brand); }
.slide-txt .kv div span { color: var(--ink-soft); }
.car-dot { background: #D3E2EC; }
.car-dot.on { background: var(--brand-2); }
.car-arrow {
  background: rgba(255,255,255,.92);
  border-color: #D3E2EC;
  color: var(--brand-d);
  box-shadow: 0 2px 10px rgba(11,76,140,.10);
}
.car-arrow:hover { background: var(--brand-2l); border-color: var(--brand-2); color: var(--brand-2d); }

/* ==========================================================
   栏目页顶部 Banner · 明亮版
   左侧浅底文字，右侧实景图淡入
   ========================================================== */
.page-hero {
  position: relative;
  overflow: hidden;
  min-height: 320px;
  display: flex;
  align-items: flex-end;
  padding: 0 0 36px;
  background: linear-gradient(160deg, #FBFDFE 0%, #EEF6FB 48%, #E9F5EF 100%);
  border-bottom: 1px solid #E1EBF2;
  isolation: isolate;
}
.page-hero .bg {
  position: absolute;
  inset: 0 0 0 34%;
  background-size: cover;
  background-position: center;
  opacity: .92;
  filter: saturate(.82) contrast(1.03) brightness(1.06);
  transform: scale(1.03);
  animation: ph-zoom 24s ease-in-out infinite alternate;
  z-index: -2;
  mask-image: linear-gradient(96deg, transparent 0%, rgba(0,0,0,.55) 26%, #000 52%);
  -webkit-mask-image: linear-gradient(96deg, transparent 0%, rgba(0,0,0,.55) 26%, #000 52%);
}
@keyframes ph-zoom { from { transform: scale(1.02) } to { transform: scale(1.09) } }
.page-hero .veil {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(100deg,
      rgba(251,253,254,.99) 0%,
      rgba(248,252,254,.96) 26%,
      rgba(238,246,251,.82) 46%,
      rgba(233,245,239,.42) 68%,
      rgba(255,255,255,.16) 100%);
}
.page-hero .glow {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(rgba(11,76,140,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,76,140,.05) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.55), transparent 72%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.55), transparent 72%);
}
.page-hero .wrap { position: relative; z-index: 2; }
.page-hero .crumb { color: var(--ink-soft); margin-bottom: 12px; }
.page-hero .crumb a:hover { color: var(--brand-2d); }
.page-hero h1 {
  font-size: 42px; color: var(--ink-deep); letter-spacing: -.9px; margin-bottom: 12px;
  text-shadow: none;
}
.page-hero .sub {
  color: var(--ink-mid); font-size: 16.5px; max-width: 660px; line-height: 1.74;
}
.page-hero .kpi {
  display: flex; gap: 34px; flex-wrap: wrap; margin-top: 22px;
  padding-top: 18px; border-top: 1px solid #DCE8F1;
}
.page-hero .kpi div strong {
  display: block; color: var(--brand-2d); font-size: 22px; font-weight: 750; letter-spacing: -.4px;
}
.page-hero .kpi div span { font-size: 12px; color: var(--ink-soft); }

@media (max-width: 980px) {
  .page-hero { min-height: 260px; padding-bottom: 26px; }
  .page-hero h1 { font-size: 30px; }
  .page-hero .sub { font-size: 15px; }
  .page-hero .kpi { gap: 22px; margin-top: 16px; padding-top: 14px; }
  .page-hero .kpi div strong { font-size: 18px; }
  .page-hero .bg { inset: 0 0 0 18%; opacity: .5; }
}
@media (max-width: 640px) {
  .page-hero { min-height: 200px; }
  .page-hero h1 { font-size: 24px; }
  .page-hero .kpi { display: none; }
  .page-hero .bg { display: none; }
  .page-hero .veil { background: linear-gradient(160deg, #FBFDFE, #EEF6FB 60%, #E9F5EF); }
}

/* ==========================================================
   通用小节 · 品牌色统一
   ========================================================== */
.sec-tag { color: var(--brand-2d); }
.card-tech::after { background: linear-gradient(90deg, transparent, var(--brand-2), transparent); }
.dash-cell .val i { color: var(--brand-2); }
.flowmap { border-color: #DCE7F1; }

.intro-grid .kv-row b { color: var(--brand); }
.kv-card {
  background: linear-gradient(170deg, #F6FBFD, #FFFFFF);
  border-color: #DCE8F1;
}

.org-node.root { background: linear-gradient(135deg, var(--brand-d), var(--brand) 58%, var(--brand-2d)); }
.org-node { background: var(--brand-l); border-color: #C6DBEF; }
.org-branches::before, .org-branches .org-node::before,
.org-node.root::after { background: #C6DBEF; }
.org-sub span { background: var(--brand-2l); color: var(--brand-2d); border-color: #D3E9DF; }

.reg-row:nth-child(odd) { background: #F7FAFD; }
.reg-table { border-color: #DCE7F1; }

/* CTA · 明亮渐变 */
.cta {
  background: linear-gradient(118deg, #0E8A5F 0%, #12A08C 48%, #1FA8C4 100%);
  box-shadow: 0 16px 44px rgba(14,138,95,.22);
}
.cta .btn-primary {
  background: #FFFFFF; color: var(--brand-2d);
  box-shadow: 0 6px 18px rgba(0,0,0,.10);
}
.cta .btn-primary:hover { background: #F4FBF7; }

/* 页面底色更透亮 */
body { background: #FDFEFE; }
.bg-2 { background: #F6FAFC; }
.site-foot { background: #F6FAFC; border-top-color: #E4EEF5; }

/* 卡片阴影提亮 */
.card { box-shadow: 0 1px 2px rgba(11,76,140,.03); }
.card:hover { box-shadow: 0 10px 28px rgba(11,76,140,.10); border-color: #C7DCEA; }
.dash { border-color: #DCE8F1; }
.dash-cell { background: #FFFFFF; }
.stats { border-color: #DCE8F1; }

/* ==========================================================
   图形块 · 彩色科技卡（SVG 原生为深色底设计，此处给彩色依托）
   页面整体浅色，图形块作视觉焦点，不用纯黑
   ========================================================== */

/* 首页剖面卡：品牌蓝绿渐变 */
.spec-card {
  background: linear-gradient(150deg, #1A78B8 0%, #15879A 52%, #12A06E 100%);
  border: 1px solid rgba(255,255,255,.26);
  box-shadow: 0 22px 50px rgba(20,120,170,.26), 0 3px 10px rgba(11,76,140,.10);
}
.spec-card .cap {
  color: rgba(236,247,252,.78);
  letter-spacing: .9px;
}
.spec-card::after {
  content: '';
  position: absolute; inset: 0;
  border-radius: inherit;
  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: radial-gradient(circle at 60% 40%, #000, transparent 78%);
  -webkit-mask-image: radial-gradient(circle at 60% 40%, #000, transparent 78%);
  pointer-events: none;
}
.spec-card { position: relative; overflow: hidden; }
.spec-card svg { position: relative; z-index: 1; }

/* 轮播图形区：浅蓝渐变圆角托底 */
.slide-art {
  background: linear-gradient(155deg, #F7FBFE 0%, #EDF5FB 52%, #E9F6F0 100%);
  border: 1px solid #E1ECF4;
  border-radius: 14px;
  padding: 10px 14px;
  box-shadow: inset 0 1px 0 #FFFFFF;
}
.slide-art svg { max-width: 300px; }

/* 首页 Hero 深色部件在白底上的可读性微调（不改 SVG，靠托底解决） */
.hero-tech .spec-card h4,
.hero-tech .spec-card .cap { color: rgba(236,247,252,.8); }

@media (max-width: 980px) {
  .slide-art { padding: 8px 10px; }
  .slide-art svg { max-width: 220px; }
}

/* 首页主视觉第三个按钮：ERP 入口，弱化但与功能按钮同排 */
.hero-actions .hero-desk {
  border-style: dashed;
  border-color: #9CC5DE;
  color: #0E5C8C;
}
.hero-actions .hero-desk:hover {
  border-style: solid;
  border-color: #0E7FC1;
  background: #EAF5FC;
  color: #0A3559;
}
@media (max-width: 640px) {
  .hero-actions { flex-wrap: wrap; }
  .hero-actions .hero-desk { width: 100%; text-align: center; }
}