/* ============================================================
   Dream Power 首页 v5 —— 深色科技风 (custom-tweaks.css)
   ------------------------------------------------------------
   矿机/加密行业主流审美：近黑蓝底 + 玻璃面板 + 霓虹橙 + 青色点缀。
   仅首页加载；删首页那行 <link> 即可完全还原。
   顶部导航由 dp-header.css 单独负责（全站生效）。
   ============================================================ */
:root{
  --dp-orange:#ff5628; --dp-orange-2:#f2491b; --dp-red:#e52a2a;
  --dp-cyan:#22d3ee;
  --dp-bg:#070b16; --dp-bg-2:#0a1020; --dp-bg-3:#0d1732;
  --dp-panel:rgba(255,255,255,.045);
  --dp-panel-2:rgba(255,255,255,.07);
  --dp-border:rgba(255,255,255,.09);
  --dp-text:#e9edf7; --dp-text-2:#96a3bd; --dp-text-3:#6d7b95;
  --dp-grad:linear-gradient(135deg,var(--dp-orange),var(--dp-orange-2));
  --dp-grad-h:linear-gradient(90deg,var(--dp-orange),var(--dp-red));
  --dp-glow:0 0 24px rgba(255,86,40,.45);
  --dp-shadow:0 30px 60px -30px rgba(0,0,0,.9);
}
html{ scroll-behavior:smooth; }

/* ============================================================
   全局：深色基调
   ============================================================ */
body{
  background:var(--dp-bg) !important;
  color:var(--dp-text);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

a,.button,.get-price-btn,.category_99703_104 .item,.dac-item,
.team-box .list-box .item,.image-all img,.product-title a{
  transition:all .3s cubic-bezier(.2,.7,.2,1);
}

/* ---------- 顶部滚动进度条 ---------- */
@supports (animation-timeline: scroll()){
  body::before{
    content:""; position:fixed; top:0; left:0; z-index:99999;
    width:100%; height:3px; transform-origin:0 50%; transform:scaleX(0);
    background:linear-gradient(90deg,var(--dp-orange),var(--dp-red),var(--dp-cyan));
    box-shadow:0 0 14px rgba(255,86,40,.7); pointer-events:none;
    animation:dpProgress linear both; animation-timeline:scroll(root);
  }
  @keyframes dpProgress{ to{ transform:scaleX(1); } }
}

/* ---------- 进场动效（纯CSS滚动驱动） ---------- */
@supports (animation-timeline: view()){
  @keyframes dpRise{ from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:none; } }
  .dav_99703_103 .dac-item,.category_99703_104 .item,
  .pro-box .pro-b,.map-box .map-b,.team-box .list-box .item,
  .aboutus_99703_105,.customer_99703_106,.contactus_99703_109{
    animation:dpRise both linear; animation-timeline:view();
    animation-range:entry 0% cover 26%;
  }
}

/* ============================================================
   区块标题：大字重 + 渐变高亮 + 霓虹短条
   ============================================================ */
.title .first-title{
  color:var(--dp-text) !important; font-weight:800 !important;
  letter-spacing:-.02em; line-height:1.25 !important; text-wrap:balance;
  font-size:34px !important;
}
.title .second-title{ color:var(--dp-text-2) !important; margin-top:14px !important; }
.map-box .title .first-title::after,
.pro-box .title .first-title::after,
.category_99703_104 .title .first-title::after,
.best_sellers_99703_107 .title .first-title::after{
  content:""; display:block; width:70px; height:4px; border-radius:3px;
  margin:18px auto 0; background:var(--dp-grad-h); box-shadow:var(--dp-glow);
}
.aboutus_99703_105 .title .first-title::after{
  content:""; display:block; width:70px; height:4px; border-radius:3px;
  margin:18px 0 0; background:var(--dp-grad-h); box-shadow:var(--dp-glow);
}

/* ============================================================
   Hero Banner：慢缩放 + 暗角 + 霓虹分隔
   ============================================================ */
.banner_99703_102{ border-bottom:none; }
.banner_99703_102::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(to bottom,rgba(7,11,22,.5),transparent 26%),
    radial-gradient(125% 92% at 50% 45%,transparent 48%,rgba(7,11,22,.55));
}
.banner_99703_102::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:180px;
  z-index:1; pointer-events:none;
  background:linear-gradient(to top,var(--dp-bg) 2%,rgba(7,11,22,.75) 40%,transparent);
}
@media (prefers-reduced-motion: no-preference){
  .banner_99703_102 .pic-list li img{
    animation:dpKen 22s ease-in-out infinite alternate; will-change:transform;
  }
  @keyframes dpKen{
    from{ transform:translateX(-50%) scale(1); }
    to{ transform:translateX(-50%) scale(1.08); }
  }
}
.banner_99703_102 .nav-list{ z-index:3; }
.banner_99703_102 .nav-list li{ background-color:rgba(255,255,255,.28) !important; }
.banner_99703_102 .nav-list li i{ background:var(--dp-grad-h) !important; box-shadow:var(--dp-glow); }
.banner_99703_102 .prev,.banner_99703_102 .next{
  z-index:3; background-color:rgba(10,15,30,.5) !important;
  border:1px solid rgba(255,255,255,.12); border-radius:14px !important;
  width:52px !important; height:52px !important; line-height:52px !important;
  margin-top:-26px !important; font-size:20px !important;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  transition:all .28s ease;
}
.banner_99703_102 .prev{ left:24px !important; }
.banner_99703_102 .next{ right:24px !important; }
.banner_99703_102 .prev:hover,.banner_99703_102 .next:hover{
  background:var(--dp-grad) !important; border-color:transparent;
  box-shadow:0 0 26px rgba(255,86,40,.75); transform:scale(1.06);
}

/* ============================================================
   资讯滚动条：深色玻璃 + 霓虹左条
   ============================================================ */
.ad-box{
  background:var(--dp-panel) !important;
  border:1px solid var(--dp-border); border-left:3px solid var(--dp-orange);
  border-radius:14px !important; box-shadow:none !important;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  color:var(--dp-text-2);
}
.ad-box .scrollDiv li a{ color:var(--dp-text-2) !important; transition:color .25s ease; }
.ad-box .scrollDiv li a:hover{ color:var(--dp-orange) !important; }
.ad-box .scrollDiv li .but{
  background:var(--dp-grad) !important; color:#fff !important;
  border-radius:20px !important; box-shadow:0 6px 16px -8px rgba(255,86,40,.8);
}

/* ============================================================
   ★ Our advantage：深色科技带 + 玻璃卡 + 霓虹图标环
   ============================================================ */
.dav_99703_103{
  position:relative; padding:80px 0 !important; overflow:hidden;
  background:
    radial-gradient(1000px 380px at 12% -10%, rgba(255,86,40,.13), transparent 62%),
    radial-gradient(1000px 400px at 100% 115%, rgba(34,211,238,.10), transparent 62%),
    linear-gradient(180deg,var(--dp-bg),var(--dp-bg-2)) !important;
}
.dav_99703_103::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(ellipse at center,#000 35%,transparent 82%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 35%,transparent 82%);
}
.dav_99703_103 .wrap-rule{ position:relative; z-index:1; }
.dav_99703_103 .title{
  font-size:34px !important; font-weight:800 !important;
  color:var(--dp-text) !important; letter-spacing:-.02em;
  text-align:center; padding-bottom:10px;
}
.dav_99703_103 .title::after{
  content:""; display:block; width:70px; height:4px; border-radius:3px;
  margin:18px auto 0; background:var(--dp-grad-h); box-shadow:var(--dp-glow);
}
.dav_99703_103 .dav-box{ gap:28px; margin-top:44px; }
.dav_99703_103 .dav-box .dac-item{
  width:33% !important; padding:44px 26px 36px;
  background:var(--dp-panel); border:1px solid var(--dp-border);
  border-radius:20px; position:relative; overflow:hidden;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.dav_99703_103 .dav-box .dac-item::after{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:var(--dp-grad-h); transform:scaleX(0); transform-origin:left;
  transition:transform .35s ease; box-shadow:var(--dp-glow);
}
/* 大号水印序号 01/02/03 —— 编辑感的设计细节 */
.dav_99703_103 .dav-box .dac-item::before{
  content:"01"; position:absolute; right:22px; top:14px;
  font-size:52px; font-weight:900; line-height:1; letter-spacing:-.05em;
  color:rgba(255,255,255,.055); pointer-events:none;
  transition:color .35s ease;
}
.dav_99703_103 .dav-box .dac-item:nth-child(2)::before{ content:"02"; }
.dav_99703_103 .dav-box .dac-item:nth-child(3)::before{ content:"03"; }
.dav_99703_103 .dav-box .dac-item:hover::before{ color:rgba(255,86,40,.16); }
.dav_99703_103 .dav-box .dac-item:hover{
  transform:translateY(-10px); background:var(--dp-panel-2);
  border-color:rgba(255,86,40,.4);
  box-shadow:0 30px 60px -28px rgba(0,0,0,.95), 0 0 40px -18px rgba(255,86,40,.5);
}
.dav_99703_103 .dav-box .dac-item:hover::after{ transform:scaleX(1); }
.dav_99703_103 .dav-box .dac-item img{
  width:58px !important; height:58px !important;
  box-sizing:content-box; padding:20px !important; margin-bottom:14px;
  border-radius:50%;
  background:linear-gradient(135deg,rgba(255,86,40,.22),rgba(34,211,238,.14));
  box-shadow:inset 0 0 0 1px rgba(255,86,40,.35), 0 0 30px -8px rgba(255,86,40,.5);
  /* 这三个 icon 是给白底设计的深黑/深蓝线条图（透明底），在深色卡片上几乎隐形。
     brightness(0) 先把所有非透明像素压成黑色，invert(1) 再翻成纯白，
     透明通道不受影响 —— 等于把 PNG 当成单色模板重新上色。 */
  filter:brightness(0) invert(1) drop-shadow(0 0 9px rgba(255,150,110,.5));
  transition:transform .35s ease, box-shadow .35s ease, filter .35s ease;
}
.dav_99703_103 .dav-box .dac-item:hover img{
  transform:scale(1.08) rotate(-4deg);
  box-shadow:inset 0 0 0 1px rgba(255,86,40,.6), 0 0 46px -6px rgba(255,86,40,.8);
  filter:brightness(0) invert(1) drop-shadow(0 0 16px rgba(255,140,90,.95));
}
.dav_99703_103 .dav-box .dac-item p{
  font-size:18px; font-weight:700; color:var(--dp-text); line-height:1.55; margin:0;
}

/* ============================================================
   ★ 产品网格：深色玻璃卡 + 白色产品展台
   ============================================================ */
.bg-color{
  background:linear-gradient(180deg,var(--dp-bg-2),var(--dp-bg)) !important;
  padding:70px 0 !important;
}
.category_99703_104 .item{
  background:var(--dp-panel) !important;
  border:1px solid var(--dp-border) !important; border-radius:18px !important;
  overflow:hidden; position:relative;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  box-shadow:none !important;
}
.category_99703_104 .item::after{
  content:""; position:absolute; left:0; right:0; top:0; height:3px; z-index:3;
  background:var(--dp-grad-h); transform:scaleX(0); transform-origin:left;
  transition:transform .35s ease; box-shadow:var(--dp-glow);
}
.category_99703_104 .item:hover{
  transform:translateY(-10px); background:var(--dp-panel-2) !important;
  border-color:rgba(255,86,40,.38) !important;
  box-shadow:0 34px 64px -30px rgba(0,0,0,.95), 0 0 44px -20px rgba(255,86,40,.45) !important;
}
.category_99703_104 .item:hover::after{ transform:scaleX(1); }
/* 白色产品展台：产品图是白底，这里保留白色底板并加圆角 */
.category_99703_104 .image-all{
  background:#fff !important; border-radius:14px; overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);
}
.category_99703_104 .image-all img{ transition:transform .45s cubic-bezier(.2,.7,.2,1); }
.category_99703_104 .item:hover .image-all img{ transform:scale(1.08); }
.category_99703_104 .product-title a{ color:var(--dp-text) !important; font-weight:700; }
.category_99703_104 .product-title a:hover{ color:var(--dp-orange) !important; }
/* 参数 → 科技规格面板 */
.category_99703_104 .attributes{ color:var(--dp-text-3) !important; }
.category_99703_104 .attributes th{ color:var(--dp-text-3) !important; font-weight:600; }
.category_99703_104 .attributes td{
  color:var(--dp-text) !important; font-weight:700;
  font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1;
}
.category_99703_104 .attributes tr:not(:last-child) th,
.category_99703_104 .attributes tr:not(:last-child) td{
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.07);
}

/* ============================================================
   按钮：霓虹橙渐变 + 扫光
   ============================================================ */
.button,.get-price-btn{
  background:var(--dp-grad) !important; border:none !important; color:#fff !important;
  border-radius:12px !important; font-weight:700 !important; letter-spacing:.02em;
  box-shadow:0 10px 26px -10px rgba(255,86,40,.85);
  position:relative; overflow:hidden;
}
.button::before,.get-price-btn::before{
  content:""; position:absolute; top:0; left:-120%; width:58%; height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);
  transform:skewX(-18deg); transition:left .6s ease;
}
.button:hover,.get-price-btn:hover{
  transform:translateY(-3px); filter:brightness(1.08);
  box-shadow:0 18px 40px -12px rgba(255,86,40,1);
}
.button:hover::before,.get-price-btn:hover::before{ left:130%; }

/* ============================================================
   pro-box / map-box：透明PNG插画浮在深色科技面板上
   ============================================================ */
.pro-box{ background:var(--dp-bg) !important; padding:70px 0 !important; }
.map-box{ background:linear-gradient(180deg,var(--dp-bg),var(--dp-bg-2)) !important; padding:70px 0 !important; }
.pro-box .pro-b,.map-box .map-b{
  border-radius:22px; border:1px solid var(--dp-border);
  background-color:rgba(255,255,255,.03) !important;
  background-blend-mode:normal !important;
  position:relative; overflow:hidden;
  box-shadow:var(--dp-shadow);
}
/* 面板内科技网格 */
.pro-box .pro-b::before,.map-box .map-b::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(120,150,255,.09) 1px,transparent 1px),
    linear-gradient(90deg,rgba(120,150,255,.09) 1px,transparent 1px);
  background-size:40px 40px;
  mask-image:radial-gradient(ellipse at center,#000 28%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 28%,transparent 78%);
}
/* 地图发光 */
.map-box .map-b{
  filter:drop-shadow(0 0 30px rgba(120,170,255,.28));
}
/* 全球节点脉冲光点（美洲/欧洲/亚洲位置） */
.map-box .map-b::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:
    radial-gradient(circle 5px at 22% 40%, rgba(255,86,40,.95), transparent 62%),
    radial-gradient(circle 4px at 49% 30%, rgba(34,211,238,.9), transparent 62%),
    radial-gradient(circle 5px at 76% 43%, rgba(255,86,40,.95), transparent 62%),
    radial-gradient(circle 4px at 84% 62%, rgba(34,211,238,.85), transparent 62%);
  animation:dpNodePulse 2.8s ease-in-out infinite;
}
@keyframes dpNodePulse{ 0%,100%{ opacity:.5; } 50%{ opacity:1; } }
.pro-box .conten{
  color:var(--dp-text) !important; font-weight:700; z-index:2;
}
.pro-box .conten p{ color:var(--dp-text) !important; }

/* ============================================================
   关于我们 / 客户：深色 + 霓虹年份
   ============================================================ */
.about-customer{ background:var(--dp-bg-2) !important; }
.aboutus_99703_105 .title .first-title{ font-size:30px !important; }
.aboutus_99703_105 .title .three-title,
.aboutus_99703_105 .title .three-title p{ color:var(--dp-text-2) !important; }
/* 时间线面板：原本是 #31457E 蓝块，与深色主题不搭且压低了橙字对比度 */
.aboutus_99703_105 .texts{
  background:rgba(255,255,255,.05) !important;
  border:1px solid var(--dp-border); border-radius:18px;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.aboutus_99703_105 .company-name{
  color:#ff7043 !important; font-weight:800 !important;
  letter-spacing:-.01em; text-shadow:0 0 26px rgba(255,86,40,.55);
}
.aboutus_99703_105 .company-desc{ color:var(--dp-text-2) !important; }
/* 装饰线也是深色 PNG，同样翻白后压低透明度当细节用 */
.aboutus_99703_105 .line{ filter:brightness(0) invert(1); opacity:.22; }

/* 右侧浮动客服栏的关闭图标：深色 PNG 且父链全透明，直接压在深色 body 上。
   只在首页翻白（内页 body 是白色，翻白反而会消失）。 */
.f-close img{ filter:brightness(0) invert(1); opacity:.7; transition:opacity .2s ease; }
.f-close:hover img{ opacity:1; }
.aboutus_99703_105 .learn-more{
  display:inline-block; margin-top:16px; padding:11px 24px; border-radius:999px;
  background:var(--dp-grad); color:#fff !important; font-weight:700;
  box-shadow:0 10px 26px -10px rgba(255,86,40,.9);
}
.aboutus_99703_105 .learn-more:hover{ transform:translateY(-2px); filter:brightness(1.07); }
.pic-list img,.customer_99703_106 img{ border-radius:16px; }
.customer_99703_106 .nav-list li{ background-color:rgba(255,255,255,.3) !important; }
/* 轮播格子自带 540x360 白底，而图片只有 532x334 —— 深色页面上会露出一圈白边 */
.customer_99703_106 .item{ background:transparent !important; }

/* ============================================================
   Meet Our Team：深色 + 悬浮辉光
   ============================================================ */
.team-box{
  background:linear-gradient(180deg,var(--dp-bg-2),var(--dp-bg)) !important;
  padding:70px 0 !important; margin-top:0 !important;
}
.team-box .title{ color:var(--dp-text) !important; font-size:34px !important; letter-spacing:-.02em; }
.team-box .title span{ color:var(--dp-orange) !important; text-shadow:var(--dp-glow); }
.team-box .text1{ color:var(--dp-text-2) !important; }
.team-box .list-box .item{
  border-radius:18px; outline:1px solid var(--dp-border); outline-offset:-1px;
  box-shadow:0 20px 44px -26px rgba(0,0,0,.9);
}
.team-box .list-box .item:hover{
  transform:translateY(-10px); outline-color:rgba(255,86,40,.45);
  box-shadow:0 34px 64px -28px rgba(0,0,0,1), 0 0 44px -20px rgba(255,86,40,.45);
}

/* ============================================================
   ★ 联系 CTA：霓虹深色带
   ============================================================ */
.contactus_99703_109{
  background:
    radial-gradient(820px 320px at 10% 0%, rgba(255,86,40,.22), transparent 60%),
    radial-gradient(820px 340px at 100% 100%, rgba(34,211,238,.18), transparent 60%),
    linear-gradient(135deg,#0c1430,#111c3f 55%,#152449) !important;
  background-color:#0d1732 !important;
  border:1px solid var(--dp-border); border-radius:26px;
  max-width:1200px; margin:60px auto !important;
  height:auto !important; padding:64px 24px !important; overflow:hidden;
  box-shadow:var(--dp-shadow);
}
.contactus_99703_109::after{
  content:""; position:absolute; inset:0; z-index:0; opacity:1 !important; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:radial-gradient(ellipse at center,#000 28%,transparent 84%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 28%,transparent 84%);
}
.contactus_99703_109 .contactus-content{ position:relative; z-index:1; width:auto !important; }
.contactus_99703_109 .contactus-title{
  font-size:30px !important; font-weight:800 !important; letter-spacing:-.02em;
}
.contactus_99703_109 .contactus-desc{
  font-size:16px !important; line-height:1.65 !important;
  color:rgba(233,237,247,.78) !important; max-width:780px; margin:18px auto 0 !important;
}
.contactus_99703_109 .contactus-btn{
  background:var(--dp-grad) !important; border:none !important;
  border-radius:999px !important;
  box-shadow:0 16px 36px -12px rgba(255,86,40,1) !important;
  transition:transform .28s ease, filter .28s ease;
}
.contactus_99703_109 .contactus-btn:hover{ transform:translateY(-3px); filter:brightness(1.07); }

/* ============================================================
   表单 focus
   ============================================================ */
.form input[type=text],.form input[type=email],.form textarea,.textarea{
  border-radius:12px !important; transition:border-color .2s ease, box-shadow .2s ease;
}
.form input[type=text]:focus,.form input[type=email]:focus,.form textarea:focus{
  border-color:var(--dp-orange) !important;
  box-shadow:0 0 0 3px rgba(255,86,40,.2) !important; outline:none;
}

/* ============================================================
   减少动效
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ transition:none !important; animation:none !important; }
  .button:hover,.get-price-btn:hover,.category_99703_104 .item:hover,
  .dav_99703_103 .dac-item:hover,.team-box .list-box .item:hover{ transform:none !important; }
  .button::before,.get-price-btn::before{ display:none; }
}
