/* ==========================================================================
   常德市哆克士广告有限公司 · 官网样式
   主色调：深红 #C8102E / 黑 #0B0B0D
   移动端优先，PC 端自适应
   ========================================================================== */

/* ---------- 变量 ---------- */
:root{
  --red:        #C8102E;
  --red-bright: #E11D38;
  --red-deep:   #8C0A1F;
  --red-soft:   rgba(200,16,46,.14);

  --black:      #0B0B0D;
  --panel:      #141418;
  --panel-2:    #1A1A20;
  --line:       #2A2A32;
  --line-soft:  rgba(255,255,255,.08);

  --text:       #EDEDF0;
  --text-2:     #B4B4BE;
  --text-3:     #82828E;

  --radius:     14px;
  --radius-lg:  20px;
  --shadow:     0 18px 48px rgba(0,0,0,.55);
  --container:  1200px;

  /* ---- 图片尺寸：LOGO 与 微信二维码 各自独立控制，改一项不影响另一项 ---- */
  --logo-h:          46px;   /* 头部 LOGO 高度（宽度按比例自动） */
  --logo-h-scrolled: 38px;   /* 头部滚动吸顶后的 LOGO 高度 */
  --logo-h-footer:   50px;   /* 页脚 LOGO 高度 */
  --qr-size:         86px;   /* 微信二维码边长（正方形，宽高同时生效） */

  --ease:       cubic-bezier(.22,.61,.36,1);
}

/* ---------- 基础重置 ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--black);
  color:var(--text);
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC",
              system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.nav-open{ overflow:hidden; }

h1,h2,h3,h4{margin:0; line-height:1.3; font-weight:800; letter-spacing:.2px;}
p{margin:0;}
ul,ol{margin:0; padding:0; list-style:none;}
dl,dd,dt{margin:0;}
a{color:inherit; text-decoration:none;}
img,svg{display:block; max-width:100%;}
button,input,select,textarea{font:inherit; color:inherit;}
button{background:none; border:0; cursor:pointer;}

::selection{ background:var(--red); color:#fff; }

/* 滚动条 */
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:#0F0F13;}
::-webkit-scrollbar-thumb{background:#33333D; border-radius:10px;}
::-webkit-scrollbar-thumb:hover{background:var(--red-deep);}

/* ---------- 通用工具 ---------- */
.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 20px; }
.hl{ color:var(--red-bright); }
.br-pc{ display:none; }

.section{ padding:72px 0; position:relative; }
.section-dark{
  background:
    radial-gradient(900px 420px at 12% 0%, rgba(200,16,46,.12), transparent 62%),
    linear-gradient(180deg,#0E0E12 0%, #0B0B0D 100%);
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}

.section-head{ max-width:820px; margin:0 auto 44px; text-align:center; }
.section-tag{
  display:inline-block; font-size:12px; font-weight:700; letter-spacing:2.4px;
  color:var(--red-bright); text-transform:uppercase; margin-bottom:14px;
  padding:6px 14px; border:1px solid rgba(200,16,46,.35); border-radius:999px;
  background:var(--red-soft);
}
.section-head h2{ font-size:clamp(23px,4.4vw,40px); margin-bottom:16px; }
.section-desc{ color:var(--text-2); font-size:15px; line-height:1.9; }

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 26px; border-radius:999px; font-size:15px; font-weight:700;
  transition:all .28s var(--ease); white-space:nowrap; border:1px solid transparent;
}
.btn-primary{
  background:linear-gradient(135deg,var(--red) 0%, var(--red-deep) 100%);
  color:#fff; box-shadow:0 10px 28px rgba(200,16,46,.34);
}
.btn-primary:hover{ background:linear-gradient(135deg,var(--red-bright),var(--red)); transform:translateY(-2px); box-shadow:0 14px 34px rgba(200,16,46,.46); }
.btn-ghost{ border-color:rgba(255,255,255,.22); color:var(--text); background:rgba(255,255,255,.04); }
.btn-ghost:hover{ border-color:var(--red-bright); color:#fff; background:var(--red-soft); transform:translateY(-2px); }
.btn-sm{ padding:9px 20px; font-size:14px; }
.btn-block{ width:100%; }

/* 更多链接 */
.link-more{ display:inline-flex; align-items:center; gap:6px; color:var(--red-bright); font-weight:700; font-size:14px; }
.link-more span{ transition:transform .25s var(--ease); }
.link-more:hover span{ transform:translateX(5px); }

/* ==========================================================================
   顶部导航
   ========================================================================== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:900;
  padding:14px 0;
  background:transparent;
  transition:background .3s var(--ease), padding .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
  border-bottom:1px solid transparent;
}
.site-header.scrolled{
  background:rgba(11,11,13,.9);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--line);
  box-shadow:0 8px 30px rgba(0,0,0,.5);
  padding:9px 0;
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; }

.logo{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo-mark{ display:flex; filter:drop-shadow(0 4px 12px rgba(200,16,46,.4)); }
.logo-text{ display:flex; flex-direction:column; line-height:1.1; }
.logo-text strong{ font-size:17px; letter-spacing:2px; }
.logo-text em{ font-style:normal; font-size:8.5px; letter-spacing:1.6px; color:var(--text-3); margin-top:3px; }

.main-nav{ display:flex; align-items:center; gap:32px; }
.main-nav > ul{ display:flex; align-items:center; gap:28px; }
.nav-link{
  position:relative; font-size:15px; font-weight:600; color:var(--text-2);
  padding:6px 0; transition:color .25s var(--ease);
}
.nav-link::after{
  content:""; position:absolute; left:0; bottom:0; height:2px; width:0;
  background:linear-gradient(90deg,var(--red),var(--red-bright));
  border-radius:2px; transition:width .3s var(--ease);
}
.nav-link:hover,.nav-link.active{ color:#fff; }
.nav-link:hover::after,.nav-link.active::after{ width:100%; }

.nav-cta{
  display:inline-flex; align-items:center; gap:7px;
  padding:9px 18px; border-radius:999px; font-size:14px; font-weight:700;
  color:#fff; background:var(--red-soft); border:1px solid rgba(200,16,46,.42);
  transition:all .25s var(--ease);
}
.nav-cta:hover{ background:var(--red); border-color:var(--red); }

/* 汉堡按钮 */
.nav-toggle{
  display:none; width:42px; height:42px; border-radius:11px;
  border:1px solid var(--line); background:rgba(255,255,255,.05);
  flex-direction:column; align-items:center; justify-content:center; gap:5px;
  transition:all .25s var(--ease);
}
.nav-toggle span{
  display:block; width:19px; height:2px; border-radius:2px; background:var(--text);
  transition:transform .3s var(--ease), opacity .25s;
}
.nav-toggle.active{ border-color:var(--red); background:var(--red-soft); }
.nav-toggle.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.active span:nth-child(2){ opacity:0; }
.nav-toggle.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.nav-mask{
  position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:880;
  opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s;
}
.nav-mask.show{ opacity:1; visibility:visible; }

/* ==========================================================================
   Hero 首屏
   ========================================================================== */
.hero{
  position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:center;
  padding:120px 0 90px; overflow:hidden;
  background:radial-gradient(1200px 700px at 78% 8%, rgba(200,16,46,.20), transparent 60%), var(--black);
}
.hero-bg{ position:absolute; inset:0; pointer-events:none; }
.glow{ position:absolute; border-radius:50%; filter:blur(90px); }
.glow-1{ width:520px; height:520px; top:-160px; right:-120px; background:rgba(200,16,46,.42); animation:float1 14s ease-in-out infinite; }
.glow-2{ width:420px; height:420px; bottom:-180px; left:-140px; background:rgba(140,10,31,.5); animation:float2 18s ease-in-out infinite; }
@keyframes float1{ 0%,100%{transform:translate(0,0);} 50%{transform:translate(-40px,40px);} }
@keyframes float2{ 0%,100%{transform:translate(0,0);} 50%{transform:translate(50px,-30px);} }

.grid-lines{
  position:absolute; inset:0; opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(circle at 50% 40%, #000 0%, transparent 78%);
  -webkit-mask-image:radial-gradient(circle at 50% 40%, #000 0%, transparent 78%);
}
.hero-frames{ position:absolute; inset:0; }
.frame{
  position:absolute; border:1px solid rgba(200,16,46,.28); border-radius:8px;
  background:linear-gradient(140deg, rgba(200,16,46,.10), rgba(255,255,255,.02));
  backdrop-filter:blur(2px);
}
.f1{ width:118px; height:150px; top:16%; right:6%; animation:float1 12s ease-in-out infinite; }
.f2{ width:88px; height:112px; top:56%; right:20%; border-color:rgba(255,255,255,.13); animation:float2 15s ease-in-out infinite; }
.f3{ width:70px; height:90px; top:24%; left:4%; border-color:rgba(255,255,255,.1); animation:float1 17s ease-in-out infinite reverse; }

.hero-inner{ position:relative; z-index:2; }
.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-size:13px; letter-spacing:1.6px; color:var(--text-2);
  padding:7px 16px; border-radius:999px; border:1px solid var(--line);
  background:rgba(255,255,255,.04); margin-bottom:22px;
}
.eyebrow::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--red-bright); box-shadow:0 0 10px var(--red-bright); }
.hero h1{
  font-size:clamp(30px,6.6vw,64px); line-height:1.2; letter-spacing:-.5px;
  margin-bottom:20px; max-width:14em;
}
.hero h1 .hl{ position:relative; display:inline-block; }
.hero h1 .hl::after{
  content:""; position:absolute; left:0; right:0; bottom:6%; height:9px;
  background:var(--red-soft); border-radius:3px; z-index:-1;
}
.hero-sub{ font-size:clamp(14px,2.6vw,17px); color:var(--text-2); max-width:60ch; line-height:1.95; margin-bottom:32px; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:52px; }

.hero-stats{
  display:grid; grid-template-columns:repeat(2,1fr); gap:20px 16px;
  padding-top:30px; border-top:1px solid var(--line-soft); max-width:820px;
}
.hero-stats li{ display:flex; flex-direction:column; gap:2px; }
.hero-stats b{
  font-size:clamp(24px,4.6vw,38px); line-height:1.1; font-weight:800;
  background:linear-gradient(120deg,#fff 10%, var(--red-bright) 130%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-stats span{ font-size:12.5px; color:var(--text-3); letter-spacing:.4px; }

.scroll-hint{
  position:absolute; left:50%; bottom:22px; transform:translateX(-50%);
  width:24px; height:40px; border:1.5px solid rgba(255,255,255,.25); border-radius:14px;
  display:flex; justify-content:center; padding-top:7px; z-index:3;
}
.scroll-hint span{ width:3px; height:8px; border-radius:2px; background:var(--red-bright); animation:scrollDot 1.7s ease-in-out infinite; }
@keyframes scrollDot{ 0%{transform:translateY(0); opacity:1;} 60%{transform:translateY(15px); opacity:0;} 100%{transform:translateY(0); opacity:0;} }

/* ==========================================================================
   关于公司
   ========================================================================== */
.about-grid{ display:grid; gap:28px; }
.about-main h3{ font-size:22px; margin-bottom:16px; }
.about-main > p{ color:var(--text-2); font-size:15px; line-height:1.95; margin-bottom:14px; }

.about-points{ display:grid; gap:18px; margin-top:28px; }
.about-points li{ display:flex; gap:14px; align-items:flex-start; }
.pt-ico{
  flex-shrink:0; width:40px; height:40px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  color:var(--red-bright); background:var(--red-soft); border:1px solid rgba(200,16,46,.28);
}
.about-points b{ display:block; font-size:15.5px; margin-bottom:3px; }
.about-points p{ color:var(--text-3); font-size:13.5px; line-height:1.75; }

.side-card{
  background:linear-gradient(160deg,var(--panel-2),var(--panel));
  border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:26px 22px; box-shadow:var(--shadow);
}
.side-card h4{ font-size:16px; margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid var(--line); }
.side-card dl > div{ display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px dashed rgba(255,255,255,.07); }
.side-card dt{ font-size:13px; color:var(--text-3); flex-shrink:0; }
.side-card dd{ font-size:13.5px; text-align:right; color:var(--text); }
.side-card .btn{ margin-top:20px; }

.side-badge{ display:flex; flex-wrap:wrap; gap:9px; margin-top:16px; }
.side-badge span{
  font-size:12.5px; padding:6px 13px; border-radius:999px;
  color:var(--text-2); border:1px solid var(--line); background:rgba(255,255,255,.03);
}

/* ==========================================================================
   服务项目
   ========================================================================== */
.services-grid{ display:grid; gap:22px; }

.service-card{
  position:relative; overflow:hidden;
  background:linear-gradient(165deg,var(--panel-2) 0%, #101014 100%);
  border:1px solid var(--line); border-radius:var(--radius-lg);
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
}
.service-card::before{
  content:""; position:absolute; inset:0; opacity:0; pointer-events:none;
  background:radial-gradient(420px 220px at 50% 0%, rgba(200,16,46,.16), transparent 70%);
  transition:opacity .35s;
}
.service-card:hover{ transform:translateY(-6px); border-color:rgba(200,16,46,.5); box-shadow:0 22px 50px rgba(0,0,0,.6); }
.service-card:hover::before{ opacity:1; }

/* 视觉小图 */
.sv-visual{
  position:relative; height:150px; overflow:hidden;
  background:linear-gradient(150deg,#16161B,#0D0D11);
  border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
}
.sv-visual::after{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:26px 26px;
}

/* 电梯 */
.lift-doors{ display:flex; gap:6px; z-index:1; }
.lift-doors span{
  width:52px; height:92px; border:1.5px solid #3A3A46; border-radius:5px;
  background:linear-gradient(180deg,#1E1E25,#131318);
}
.lift-screen{
  position:absolute; top:26px; left:50%; transform:translateX(-50%);
  width:58px; height:34px; border-radius:5px; z-index:2;
  background:linear-gradient(135deg,var(--red),var(--red-deep));
  color:#fff; font-size:11px; font-weight:700; letter-spacing:1px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 22px rgba(200,16,46,.5);
}
/* 道闸 */
.sv-gate{ position:relative; }
.gate-bar{
  position:absolute; left:18%; top:52px; width:58%; height:9px; border-radius:5px; z-index:2;
  background:linear-gradient(90deg,var(--red) 0%, var(--red) 32%, #F2F2F4 32%, #F2F2F4 50%, var(--red) 50%, var(--red) 82%, #F2F2F4 82%);
  transform:rotate(-4deg); box-shadow:0 6px 18px rgba(200,16,46,.35);
}
.gate-post{ position:absolute; left:12%; bottom:22px; width:20px; height:56px; border-radius:4px; background:#2E2E38; border:1.5px solid #414150; z-index:1; }
.car-shape{
  position:absolute; right:16%; bottom:20px; width:74px; height:26px; z-index:3;
  border-radius:9px 12px 4px 4px; background:linear-gradient(180deg,#33333F,#1C1C23);
  border:1px solid #45454F;
}
.car-shape::before{ content:""; position:absolute; left:16px; top:-12px; width:38px; height:14px; border-radius:7px 9px 0 0; background:#3A3A46; border:1px solid #45454F; border-bottom:0; }
.car-shape::after{ content:""; position:absolute; bottom:-6px; left:10px; width:13px; height:13px; border-radius:50%; background:#0C0C10; border:1px solid #4A4A56; box-shadow:44px 0 0 -1px #0C0C10, 44px 0 0 0 #4A4A56; }
/* 公告栏 */
.board-frame{
  width:170px; height:104px; border-radius:8px; padding:9px; z-index:1;
  background:linear-gradient(150deg,#2B2B34,#1A1A20); border:1.5px solid #45454F;
  display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:7px;
}
.board-paper{ background:linear-gradient(160deg,#E9E9EE,#C9C9D2); border-radius:3px; }
.board-paper.p1{ grid-row:span 2; background:linear-gradient(160deg,var(--red),var(--red-deep)); }
.board-paper.p2{ background:linear-gradient(160deg,#E9E9EE,#BEBEC8); }
/* 新媒体 */
.phone{
  width:78px; height:124px; border-radius:13px; z-index:1;
  background:linear-gradient(170deg,#22222A,#101015);
  border:1.5px solid #46464F; padding:7px; display:flex; flex-direction:column; gap:6px;
}
.phone-top{ height:5px; width:30px; border-radius:3px; background:#3E3E49; margin:0 auto; }
.phone-feed{ flex:1; display:flex; flex-direction:column; gap:5px; }
.phone-feed span{ height:24px; border-radius:5px; background:linear-gradient(135deg,rgba(200,16,46,.55),rgba(255,255,255,.08)); }
.phone-feed span:nth-child(2){ background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.05)); }
.phone-icons{ display:flex; justify-content:space-around; }
.phone-icons i{ width:11px; height:11px; border-radius:3px; background:#3A3A45; }

.sv-body{ padding:24px 22px 26px; position:relative; }
.sv-index{
  position:absolute; top:-14px; right:20px; font-size:38px; font-weight:900;
  color:rgba(255,255,255,.055); letter-spacing:-2px; line-height:1;
}
.sv-body h3{ font-size:19px; margin-bottom:12px; }
.sv-body > p{ color:var(--text-2); font-size:14px; line-height:1.9; margin-bottom:16px; }
.sv-features{ display:grid; gap:9px; margin-bottom:18px; }
.sv-features li{ position:relative; padding-left:19px; font-size:13.5px; color:var(--text-3); line-height:1.7; }
.sv-features li::before{ content:""; position:absolute; left:2px; top:9px; width:7px; height:7px; border-radius:2px; background:var(--red); }
.sv-meta{ display:flex; align-items:center; justify-content:space-between; padding-top:15px; border-top:1px dashed rgba(255,255,255,.09); font-size:13px; }
.sv-meta b{ color:var(--text-3); font-weight:600; }
.sv-meta span{ color:var(--red-bright); font-weight:700; }

/* 组合推荐 */
.combo{
  margin-top:26px; padding:28px 24px; border-radius:var(--radius-lg);
  background:linear-gradient(120deg, rgba(200,16,46,.18), rgba(20,20,24,.9) 60%);
  border:1px solid rgba(200,16,46,.3);
  display:flex; flex-direction:column; gap:20px;
}
.combo h3{ font-size:19px; margin-bottom:10px; }
.combo p{ color:var(--text-2); font-size:14px; line-height:1.9; }

/* ==========================================================================
   公司案例
   ========================================================================== */
.filters{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom:32px; }
.filter-btn{
  padding:9px 20px; border-radius:999px; font-size:14px; font-weight:600;
  color:var(--text-2); border:1px solid var(--line); background:rgba(255,255,255,.03);
  transition:all .25s var(--ease);
}
.filter-btn:hover{ color:#fff; border-color:rgba(200,16,46,.5); }
.filter-btn.active{ background:linear-gradient(135deg,var(--red),var(--red-deep)); color:#fff; border-color:transparent; box-shadow:0 8px 22px rgba(200,16,46,.36); }

.cases-grid{ display:grid; gap:22px; }
.case-card{
  background:linear-gradient(165deg,var(--panel-2),#101014);
  border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden;
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
}
.case-card:hover{ transform:translateY(-6px); border-color:rgba(200,16,46,.5); box-shadow:0 22px 50px rgba(0,0,0,.6); }
.case-card.hide{ display:none; }

.case-thumb{
  position:relative; height:158px; overflow:hidden;
  display:flex; align-items:flex-start; padding:16px;
}
.case-thumb::after{
  content:""; position:absolute; inset:0;
  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:30px 30px;
}
.thumb-1{ background:linear-gradient(135deg,#8C0A1F,#2A0509); }
.thumb-2{ background:linear-gradient(135deg,#1E1E26,#0D0D11); }
.thumb-3{ background:linear-gradient(135deg,#B01226,#3A0A12); }
.thumb-4{ background:linear-gradient(135deg,#15151B,#2A0A11); }
.thumb-5{ background:linear-gradient(135deg,#6E0818,#141418); }
.thumb-6{ background:linear-gradient(135deg,#26262E,#5A0A16); }

.case-cat{
  position:relative; z-index:2; font-size:12px; font-weight:700; letter-spacing:1px;
  padding:5px 12px; border-radius:999px; color:#fff;
  background:rgba(0,0,0,.42); border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(6px);
}
.case-num{
  position:absolute; right:14px; bottom:-8px; z-index:2;
  font-size:56px; font-weight:900; line-height:1; letter-spacing:-3px;
  color:rgba(255,255,255,.13);
}
.case-body{ padding:22px; }
.case-body h3{ font-size:17px; margin-bottom:11px; line-height:1.5; }
.case-body > p{ color:var(--text-2); font-size:13.5px; line-height:1.85; margin-bottom:16px; }
.case-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.case-tags li{
  font-size:12px; color:var(--text-3); padding:4px 11px;
  border-radius:999px; border:1px solid var(--line); background:rgba(255,255,255,.03);
}

/* ==========================================================================
   公司新闻
   ========================================================================== */
.news-layout{ display:grid; gap:24px; }

.news-feature{
  background:linear-gradient(165deg,var(--panel-2),#101014);
  border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden;
  transition:border-color .35s, transform .35s var(--ease);
}
.news-feature:hover{ border-color:rgba(200,16,46,.5); transform:translateY(-4px); }
.news-feature-thumb{
  position:relative; height:172px;
  background:linear-gradient(140deg,#8C0A1F 0%, #2A0509 70%);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.news-feature-thumb::after{
  content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(45deg, rgba(255,255,255,.05) 0 2px, transparent 2px 14px);
}
.news-feature-thumb span{
  position:relative; z-index:1; font-size:13px; font-weight:800; letter-spacing:6px;
  padding:9px 22px; border-radius:999px; color:#fff;
  background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.3);
}
.news-feature-body{ padding:24px 22px 26px; }
.news-meta{ display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--text-3); margin-bottom:12px; }
.news-meta .dot{ width:4px; height:4px; border-radius:50%; background:var(--red); }
.news-cat{ color:var(--red-bright); font-weight:700; }
.news-feature-body h3{ font-size:20px; line-height:1.5; margin-bottom:12px; }
.news-feature-body > p{ color:var(--text-2); font-size:14px; line-height:1.9; margin-bottom:16px; }

.news-list{ display:grid; gap:14px; }
.news-item{
  display:flex; gap:16px; padding:18px;
  border:1px solid var(--line); border-radius:var(--radius);
  background:rgba(255,255,255,.025);
  transition:all .3s var(--ease);
}
.news-item:hover{ border-color:rgba(200,16,46,.5); background:rgba(200,16,46,.06); transform:translateX(4px); }
.news-item time{
  flex-shrink:0; width:62px; height:62px; border-radius:12px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:var(--black); border:1px solid var(--line); line-height:1.1;
}
.news-item time b{ font-size:21px; font-weight:800; color:var(--red-bright); }
.news-item time span{ font-size:10.5px; color:var(--text-3); margin-top:2px; }
.news-item-body h4{ font-size:15.5px; line-height:1.55; margin:5px 0 6px; }
.news-item-body p{ color:var(--text-3); font-size:13px; line-height:1.7; }

/* ==========================================================================
   联系我们
   ========================================================================== */
.contact-layout{ display:grid; gap:24px; }

.contact-info h3{ font-size:20px; margin-bottom:12px; }
.contact-note{ color:var(--text-2); font-size:14px; line-height:1.9; margin-bottom:24px; }

.info-list{ display:grid; gap:16px; }
.info-list li{ display:flex; gap:14px; align-items:flex-start; }
.info-ico{
  flex-shrink:0; width:40px; height:40px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  color:var(--red-bright); background:var(--red-soft); border:1px solid rgba(200,16,46,.28);
}
.info-list em{ display:block; font-style:normal; font-size:12.5px; color:var(--text-3); margin-bottom:3px; }
.info-list p{ font-size:14.5px; line-height:1.7; }
.info-list a{ transition:color .2s; }
.info-list a:hover{ color:var(--red-bright); }

.contact-qr{
  display:flex; align-items:center; gap:16px; margin-top:26px; padding:18px;
  border:1px solid var(--line); border-radius:var(--radius); background:rgba(255,255,255,.025);
}
/* ---------- 微信二维码尺寸（只控制二维码，与头部 LOGO 无关） ----------
   调大小：改 :root 里的 --qr-size 一处即可（宽高等比例）。
   换图：替换 skin/images/wechat-qr.png。 */
.qr-box{
  width:var(--qr-size); height:var(--qr-size); flex-shrink:0; border-radius:10px; padding:6px;
  background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.qr-img{ width:100%; height:100%; object-fit:contain; display:block; }
.contact-qr b{ display:block; font-size:14.5px; margin-bottom:4px; }
.contact-qr p{ font-size:12.5px; color:var(--text-3); line-height:1.7; }

/* 表单 */
.contact-form{
  padding:28px 22px; border-radius:var(--radius-lg);
  background:linear-gradient(165deg,var(--panel-2),#101014);
  border:1px solid var(--line); box-shadow:var(--shadow);
}
.contact-form h3{ font-size:19px; margin-bottom:22px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.form-row{ display:grid; gap:16px; margin-bottom:16px; }
.contact-form label{ display:block; }
.contact-form label > span{ display:block; font-size:13px; color:var(--text-2); margin-bottom:7px; font-weight:600; }
.contact-form label i{ font-style:normal; color:var(--red-bright); }
.contact-form input,.contact-form select,.contact-form textarea{
  width:100%; padding:12px 14px; border-radius:10px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  font-size:14.5px; transition:border-color .25s, background .25s, box-shadow .25s;
  -webkit-appearance:none; appearance:none;
}
.contact-form textarea{ resize:vertical; min-height:96px; line-height:1.7; }
.contact-form select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5z' fill='%23B4B4BE'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center; background-size:20px; padding-right:36px;
}
.contact-form select option{ background:#14141A; color:var(--text); }
.contact-form input::placeholder,.contact-form textarea::placeholder{ color:#5E5E6A; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{
  outline:none; border-color:var(--red); background-color:rgba(200,16,46,.07);
  box-shadow:0 0 0 3px rgba(200,16,46,.16);
}
.contact-form input.error,.contact-form select.error,.contact-form textarea.error{ border-color:#E11D38; }
.form-block{ margin-bottom:20px; }
/* 留言模块图形验证码行（仅在后台开启留言验证码时输出） */
.form-verify{ display:block; }
.form-verify .verify-row{ display:grid; grid-template-columns:1fr 108px; gap:10px; align-items:center; }
.form-verify .verify-row input{ min-width:0; }
.form-verify .verify-row img{ width:108px; height:42px; border-radius:8px; border:1px solid var(--line); display:block; }
.verify-refresh{ display:inline-block; margin-top:8px; font-size:12px; color:var(--text-3); }
.verify-refresh:hover{ color:var(--red-bright); }
.form-tip{ font-size:12px; color:var(--text-3); line-height:1.7; margin-top:12px; text-align:center; }
.form-toast{
  margin-top:14px; padding:12px 14px; border-radius:10px; font-size:13.5px;
  display:none; line-height:1.7; text-align:center;
}
.form-toast.show{ display:block; }
.form-toast.ok{ background:rgba(34,150,90,.14); border:1px solid rgba(34,150,90,.4); color:#7BE0A8; }
.form-toast.err{ background:rgba(200,16,46,.14); border:1px solid rgba(200,16,46,.45); color:#FF9AAC; }

/* ==========================================================================
   页脚
   ========================================================================== */
.site-footer{ background:#08080A; border-top:1px solid var(--line); padding-top:56px; }
.footer-inner{ display:grid; gap:34px; padding-bottom:44px; }
.footer-brand p{ color:var(--text-3); font-size:13.5px; line-height:1.9; margin-top:16px; max-width:34ch; }
.footer-col h4{ font-size:14.5px; margin-bottom:16px; color:#fff; }
.footer-col ul{ display:grid; gap:10px; }
.footer-col li{ font-size:13.5px; color:var(--text-3); }
.footer-col a{ color:var(--text-2); transition:color .22s, padding-left .22s; }
.footer-col a:hover{ color:var(--red-bright); padding-left:4px; }
.footer-contact li{ line-height:1.8; }

.footer-bottom{ border-top:1px solid var(--line); padding:20px 0; }
.footer-bottom-inner{ display:grid; gap:8px; text-align:center; }
.footer-bottom p{ font-size:12.5px; color:var(--text-3); }

/* 返回顶部 */
.to-top{
  position:fixed; right:18px; bottom:22px; z-index:800;
  width:46px; height:46px; border-radius:13px;
  display:flex; align-items:center; justify-content:center;
  color:#fff; background:linear-gradient(135deg,var(--red),var(--red-deep));
  box-shadow:0 10px 26px rgba(200,16,46,.42);
  opacity:0; visibility:hidden; transform:translateY(14px);
  transition:all .32s var(--ease);
}
.to-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.to-top:hover{ background:var(--red-bright); }

/* ==========================================================================
   滚动入场动画
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .75s var(--ease), transform .75s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition-duration:.01ms !important; }
  .reveal{ opacity:1; transform:none; }
  html{ scroll-behavior:auto; }
}

/* ==========================================================================
   响应式 · 平板及以上
   ========================================================================== */
@media (min-width:600px){
  .container{ padding:0 28px; }
  .hero-stats{ grid-template-columns:repeat(4,1fr); gap:18px; }
  .form-row{ grid-template-columns:1fr 1fr; }
  .services-grid{ grid-template-columns:repeat(2,1fr); }
  .cases-grid{ grid-template-columns:repeat(2,1fr); }
  .footer-inner{ grid-template-columns:1.4fr 1fr 1fr; }
  .footer-bottom-inner{ grid-template-columns:1fr auto; text-align:left; }
  .combo{ flex-direction:row; align-items:center; justify-content:space-between; gap:32px; }
  .combo-text{ max-width:62%; }
  .about-points{ grid-template-columns:1fr 1fr; gap:20px 24px; }
  .to-top{ right:26px; bottom:28px; }
}

@media (min-width:900px){
  .section{ padding:96px 0; }
  .section-head{ margin-bottom:56px; }
  .br-pc{ display:block; }
  .about-grid{ grid-template-columns:1.55fr 1fr; gap:44px; align-items:start; }
  .contact-layout{ grid-template-columns:1fr 1.15fr; gap:44px; }
  .news-layout{ grid-template-columns:1fr 1.15fr; gap:28px; align-items:start; }
  .hero{ padding:150px 0 110px; }
  .hero-actions{ margin-bottom:64px; }
  .news-feature-thumb{ height:230px; }
  .nav-mask{ display:none; }
}

@media (min-width:1100px){
  .services-grid{ grid-template-columns:repeat(4,1fr); }
  .cases-grid{ grid-template-columns:repeat(3,1fr); }
  .sv-visual{ height:160px; }
}

/* ==========================================================================
   移动端导航（<900px）
   ========================================================================== */
@media (max-width:899px){
  .nav-toggle{ display:flex; }

  .main-nav{
    position:fixed; top:0; right:0; z-index:890;
    width:min(82vw,340px); height:100%;
    padding:96px 26px 40px;
    flex-direction:column; align-items:stretch; gap:0;
    background:linear-gradient(180deg,#14141A 0%, #0B0B0D 100%);
    border-left:1px solid var(--line);
    box-shadow:-24px 0 60px rgba(0,0,0,.6);
    transform:translateX(102%); transition:transform .38s var(--ease);
    overflow-y:auto;
  }
  .main-nav.open{ transform:translateX(0); }

  .main-nav > ul{ flex-direction:column; align-items:stretch; gap:0; }
  .main-nav > ul li{ border-bottom:1px solid rgba(255,255,255,.07); }
  .nav-link{
    display:block; padding:16px 4px; font-size:16.5px; color:var(--text);
  }
  .nav-link::after{ display:none; }
  .nav-link.active{ color:var(--red-bright); }
  .nav-link.active::before{
    content:""; position:absolute; left:-14px; top:50%; transform:translateY(-50%);
    width:4px; height:18px; border-radius:2px; background:var(--red);
  }
  .nav-cta{
    margin-top:26px; justify-content:center; padding:14px; font-size:15px;
    background:linear-gradient(135deg,var(--red),var(--red-deep)); border-color:transparent;
  }
}

/* 小屏微调 */
@media (max-width:400px){
  .logo-text strong{ font-size:15.5px; }
  .logo-text em{ font-size:7.5px; letter-spacing:1.2px; }
  .hero h1{ letter-spacing:-.8px; }
  .btn{ padding:12px 20px; font-size:14.5px; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ width:100%; }
  .filters{ gap:8px; }
  .filter-btn{ padding:8px 15px; font-size:13px; }
  .case-num{ font-size:46px; }
}

/* ==========================================================================
   以下为 v2 新增：图片 Logo / 首页轮播 / 内页 / 列表页 / 内容页
   ========================================================================== */

/* ---------- 图片 Logo 尺寸（只控制 LOGO，与二维码无关） ----------
   调大小：改 :root 里的 --logo-h / --logo-h-scrolled / --logo-h-footer
   换图：后台【设置 - 基本信息】上传站点 LOGO 即可。 */
.logo-img{ height:var(--logo-h); width:auto; display:block; }
.site-header.scrolled .logo-img{ height:var(--logo-h-scrolled); }
.footer-brand .logo-img{ height:var(--logo-h-footer); }

/* ---------- 页脚：4 列布局（联系方式与快速导航同行对齐） ---------- */
@media (min-width:600px){
  .footer-inner{ grid-template-columns:1fr 1fr; }
}
@media (min-width:900px){
  .footer-inner{ grid-template-columns:1.35fr .85fr .95fr 1.25fr; gap:30px; }
}

/* ==========================================================================
   首页幻灯片轮播
   ========================================================================== */
.slider{
  position:relative; height:min(92vh,860px); min-height:600px;
  overflow:hidden; background:var(--black);
}
.slides{ display:flex; height:100%; transition:transform .7s var(--ease); will-change:transform; }
.slide{
  position:relative; flex:0 0 100%; height:100%;
  display:flex; align-items:center; overflow:hidden;
  touch-action:pan-y;
}
.slide-bg{ position:absolute; inset:0; }
.slide-bg .glow{ z-index:0; }
.slide-bg .grid-lines{ opacity:.4; }

/* 四张幻灯片各自配色与装饰 */
.slide-bg.sb-1{ background:radial-gradient(1100px 640px at 76% 12%, rgba(200,16,46,.34), transparent 62%), var(--black); }
.slide-bg.sb-2{ background:radial-gradient(1000px 600px at 20% 90%, rgba(140,10,31,.55), transparent 60%), linear-gradient(135deg,#101014,#0B0B0D); }
.slide-bg.sb-3{ background:radial-gradient(1100px 620px at 80% 80%, rgba(200,16,46,.28), transparent 60%), var(--black); }
.slide-bg.sb-4{ background:radial-gradient(1000px 600px at 15% 15%, rgba(200,16,46,.22), transparent 58%), linear-gradient(160deg,#121216,#0B0B0D); }

/* 幻灯片右侧大装饰图形（PC 端显示） */
.slide-art{ position:absolute; right:6%; top:50%; transform:translateY(-50%); z-index:1; opacity:.92; }
.art-elevator{ width:190px; height:270px; border-radius:14px; border:1.5px solid #3A3A46; background:linear-gradient(180deg,#1B1B22,#101014); display:flex; gap:8px; padding:20px; box-shadow:0 30px 70px rgba(0,0,0,.6); }
.art-elevator span{ flex:1; border-radius:8px; border:1.5px solid #34343E; background:linear-gradient(180deg,#232330,#15151B); position:relative; }
.art-elevator span::after{ content:"广告位"; position:absolute; top:38%; left:50%; transform:translate(-50%,-50%); font-size:13px; letter-spacing:2px; color:rgba(255,255,255,.75); padding:5px 9px; border-radius:5px; background:linear-gradient(135deg,var(--red),var(--red-deep)); white-space:nowrap; }
.art-gate{ width:330px; height:230px; position:relative; }
.art-gate .bar{ position:absolute; left:0; top:64px; width:100%; height:13px; border-radius:7px; transform:rotate(-5deg); background:linear-gradient(90deg,var(--red) 0 30%, #F2F2F4 30% 48%, var(--red) 48% 78%, #F2F2F4 78%); box-shadow:0 12px 30px rgba(200,16,46,.4); }
.art-gate .post{ position:absolute; left:4px; top:72px; width:26px; height:150px; border-radius:6px; background:#2E2E38; border:1.5px solid #45454F; }
.art-gate .car{ position:absolute; right:8px; bottom:0; width:130px; height:44px; border-radius:14px 18px 6px 6px; background:linear-gradient(180deg,#33333F,#1C1C23); border:1.5px solid #45454F; }
.art-gate .car::before{ content:""; position:absolute; left:26px; top:-20px; width:66px; height:24px; border-radius:12px 15px 0 0; background:#3A3A46; border:1.5px solid #45454F; border-bottom:0; }
.art-gate .car::after{ content:""; position:absolute; bottom:-10px; left:18px; width:22px; height:22px; border-radius:50%; background:#0C0C10; border:2px solid #4A4A56; box-shadow:76px 0 0 -2px #0C0C10, 76px 0 0 0 #4A4A56; }
.art-board{ width:300px; height:190px; border-radius:14px; padding:16px; background:linear-gradient(150deg,#2B2B34,#1A1A20); border:1.5px solid #45454F; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:12px; box-shadow:0 30px 70px rgba(0,0,0,.6); }
.art-board i{ border-radius:6px; }
.art-board i:nth-child(1){ grid-row:span 2; background:linear-gradient(160deg,var(--red),var(--red-deep)); }
.art-board i:nth-child(2){ background:linear-gradient(160deg,#E9E9EE,#BEBEC8); }
.art-board i:nth-child(4){ background:linear-gradient(160deg,#C9C9D2,#9A9AA6); }
.art-phone{ width:150px; height:250px; border-radius:24px; background:linear-gradient(170deg,#22222A,#101015); border:1.5px solid #46464F; padding:12px; display:flex; flex-direction:column; gap:9px; box-shadow:0 30px 70px rgba(0,0,0,.6); }
.art-phone .notch{ height:6px; width:52px; border-radius:3px; background:#3E3E49; margin:0 auto; }
.art-phone .feed{ flex:1; display:flex; flex-direction:column; gap:8px; }
.art-phone .feed i{ flex:1; border-radius:8px; }
.art-phone .feed i:nth-child(1){ background:linear-gradient(135deg,rgba(200,16,46,.65),rgba(255,255,255,.08)); }
.art-phone .feed i:nth-child(2){ background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.05)); }
.art-phone .feed i:nth-child(3){ background:linear-gradient(135deg,rgba(200,16,46,.4),rgba(255,255,255,.06)); }
.art-phone .dock{ display:flex; justify-content:space-around; padding-top:2px; }
.art-phone .dock b{ width:16px; height:16px; border-radius:5px; background:#3A3A45; }

/* 幻灯片文案 */
.slide-inner{ position:relative; z-index:2; width:100%; padding-top:120px; padding-bottom:90px; }
.slide-inner > *{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.slide.active .slide-inner > *{ opacity:1; transform:none; }
.slide.active .slide-inner > :nth-child(1){ transition-delay:.15s; }
.slide.active .slide-inner > :nth-child(2){ transition-delay:.26s; }
.slide.active .slide-inner > :nth-child(3){ transition-delay:.37s; }
.slide.active .slide-inner > :nth-child(4){ transition-delay:.48s; }
.slide h1{ font-size:clamp(28px,6vw,58px); line-height:1.22; max-width:15em; margin-bottom:18px; letter-spacing:-.5px; }
.slide h1 .hl{ position:relative; display:inline-block; }
.slide h1 .hl::after{ content:""; position:absolute; left:0; right:0; bottom:5%; height:9px; background:var(--red-soft); border-radius:3px; z-index:-1; }
.slide .hero-sub{ font-size:clamp(14px,2.4vw,16.5px); color:var(--text-2); max-width:56ch; line-height:1.95; margin-bottom:30px; }
.slide .eyebrow{ margin-bottom:20px; }

/* 轮播控件 */
.slider-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:6;
  width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff; border:1px solid rgba(255,255,255,.22);
  background:rgba(10,10,12,.45); backdrop-filter:blur(8px);
  opacity:0; transition:all .3s var(--ease);
}
.slider:hover .slider-arrow, .slider:focus-within .slider-arrow{ opacity:1; }
.slider-arrow:hover{ background:var(--red); border-color:var(--red); }
.slider-arrow.prev{ left:22px; }
.slider-arrow.next{ right:22px; }
.slider-arrow svg{ width:20px; height:20px; }

.slider-dots{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  display:flex; gap:9px; z-index:6;
}
.slider-dot{
  width:26px; height:4px; border-radius:3px; border:0; padding:0;
  background:rgba(255,255,255,.24); cursor:pointer;
  transition:width .3s var(--ease), background .3s;
}
.slider-dot.active{ width:42px; background:var(--red-bright); }

.slider-progress{
  position:absolute; left:0; bottom:0; height:3px; width:0; z-index:6;
  background:linear-gradient(90deg,var(--red),var(--red-bright));
}
.slider-progress.run{ animation:slideProg 6s linear forwards; }
@keyframes slideProg{ from{width:0;} to{width:100%;} }

/* 幻灯片下方数据条 */
.stats-strip{
  border-top:1px solid var(--line-soft);
  background:
    radial-gradient(700px 260px at 50% 0%, rgba(200,16,46,.13), transparent 70%),
    linear-gradient(180deg,#0E0E12,#0B0B0D);
  padding:40px 0;
}
.stats-strip .hero-stats{ border-top:0; padding-top:0; max-width:none; }

/* ==========================================================================
   内页通用
   ========================================================================== */
.page-hero{
  position:relative; padding:138px 0 56px; overflow:hidden; text-align:center;
  background:
    radial-gradient(900px 420px at 80% 0%, rgba(200,16,46,.24), transparent 62%),
    var(--black);
  border-bottom:1px solid var(--line-soft);
}
.page-hero::before{
  content:""; position:absolute; inset:0; opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(circle at 30% 0%, #000 0%, transparent 75%);
  -webkit-mask-image:radial-gradient(circle at 30% 0%, #000 0%, transparent 75%);
}
.page-hero .container{ position:relative; z-index:2; }
.breadcrumb{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:9px;
  font-size:13px; color:var(--text-3); margin-bottom:18px;
}
.breadcrumb a{ color:var(--text-3); transition:color .2s; }
.breadcrumb a:hover{ color:var(--red-bright); }
.breadcrumb .sep{ opacity:.55; }
.breadcrumb .cur{ color:var(--text-2); }
/* 栏目名称 / 栏目简介：全站内页 hero 居中（共用 .page-hero 的 text-align:center） */
.page-hero h1{ font-size:clamp(27px,4.8vw,44px); margin-bottom:14px; }
.page-hero .lead{
  color:var(--text-2); font-size:15px; line-height:1.9;
  max-width:64ch; margin-left:auto; margin-right:auto;
}

/* 内页两栏：主内容 + 侧边栏 */
.inner-layout{ display:grid; gap:30px; }
@media (min-width:900px){
  .inner-layout{ grid-template-columns:minmax(0,1fr) 316px; gap:40px; align-items:start; }
  .sidebar{ position:sticky; top:96px; }
}

/* 侧边栏组件 */
.sidebar{ display:grid; gap:20px; }
.widget{
  background:linear-gradient(165deg,var(--panel-2),#101014);
  border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px;
}
.widget + .widget{ margin-top:0; }
.widget h4{
  font-size:15px; margin-bottom:16px; padding-bottom:12px;
  border-bottom:1px solid var(--line); display:flex; align-items:center; gap:8px;
}
.widget h4::before{ content:""; width:4px; height:14px; border-radius:2px; background:var(--red); }
.widget-list li{ border-bottom:1px dashed rgba(255,255,255,.07); }
.widget-list li:last-child{ border-bottom:0; }
.widget-list a{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:11px 0; font-size:14px; color:var(--text-2); transition:color .22s, padding-left .22s;
}
.widget-list a:hover{ color:var(--red-bright); padding-left:5px; }
.widget-list em{ font-style:normal; font-size:12px; color:var(--text-3); flex-shrink:0; }
.widget-contact p{ font-size:13.5px; color:var(--text-2); line-height:1.8; margin-bottom:9px; }
.widget-contact b{ color:var(--text); }
.widget .btn{ margin-top:8px; }

/* 文章/内容页 */
.article{ background:transparent; }
.article-head{ margin-bottom:26px; }
.article-head h1{ font-size:clamp(23px,4vw,34px); line-height:1.45; margin-bottom:14px; }
.article-meta{
  display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center;
  font-size:13px; color:var(--text-3); padding-bottom:20px; border-bottom:1px solid var(--line);
}
.article-meta .news-cat{ color:var(--red-bright); font-weight:700; }
.article-cover{
  position:relative; height:260px; border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid var(--line); margin-bottom:28px;
  display:flex; align-items:center; justify-content:center;
}
.article-cover::after{
  content:""; position:absolute; inset:0;
  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:34px 34px;
}
.article-cover span{
  position:relative; z-index:2; font-size:14px; letter-spacing:5px; font-weight:800;
  color:#fff; padding:10px 26px; border-radius:999px;
  background:rgba(0,0,0,.34); border:1px solid rgba(255,255,255,.3);
}
.cover-red{ background:linear-gradient(135deg,#8C0A1F,#2A0509); }
.cover-dark{ background:linear-gradient(135deg,#1E1E26,#0D0D11); }
.cover-mid{ background:linear-gradient(135deg,#B01226,#3A0A12); }

.article-body h2{ font-size:21px; margin:34px 0 14px; padding-left:14px; border-left:4px solid var(--red); line-height:1.4; }
.article-body h3{ font-size:17px; margin:26px 0 10px; }
.article-body p{ color:var(--text-2); font-size:15px; line-height:2; margin-bottom:14px; }
.article-body ul{ margin-bottom:16px; }
.article-body ul li{
  position:relative; padding-left:22px; margin-bottom:9px;
  color:var(--text-2); font-size:14.5px; line-height:1.9;
}
.article-body ul li::before{
  content:""; position:absolute; left:3px; top:11px;
  width:7px; height:7px; border-radius:2px; background:var(--red);
}
.article-body b, .article-body strong{ color:var(--text); }
.article-quote{
  margin:24px 0; padding:18px 20px; border-radius:0 14px 14px 0;
  border-left:4px solid var(--red); background:var(--red-soft);
  color:var(--text-2); font-size:14.5px; line-height:1.95;
}
.article-tags{ display:flex; flex-wrap:wrap; gap:9px; margin:30px 0; padding-top:22px; border-top:1px solid var(--line); }
.article-tags a{
  font-size:12.5px; color:var(--text-3); padding:5px 13px; border-radius:999px;
  border:1px solid var(--line); transition:all .22s;
}
.article-tags a:hover{ color:#fff; border-color:var(--red); background:var(--red-soft); }

.prev-next{ display:grid; gap:12px; margin-top:34px; }
@media (min-width:600px){ .prev-next{ grid-template-columns:1fr 1fr; } }
.prev-next a{
  padding:15px 18px; border-radius:var(--radius);
  border:1px solid var(--line); background:rgba(255,255,255,.025);
  transition:all .28s var(--ease);
}
.prev-next a:hover{ border-color:rgba(200,16,46,.55); background:var(--red-soft); transform:translateY(-2px); }
.prev-next em{ display:block; font-style:normal; font-size:12px; color:var(--text-3); margin-bottom:5px; }
.prev-next b{ font-size:14px; font-weight:600; color:var(--text-2); line-height:1.55; display:block; }
.prev-next a:hover b{ color:#fff; }
.prev-next .next-item{ text-align:right; }

/* 数据卡片（案例页用） */
.data-cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:24px 0; }
@media (min-width:600px){ .data-cards{ grid-template-columns:repeat(4,1fr); } }
.data-card{
  padding:20px 14px; text-align:center; border-radius:var(--radius);
  background:linear-gradient(165deg,var(--panel-2),#101014);
  border:1px solid var(--line);
}
.data-card b{
  display:block; font-size:clamp(22px,3vw,30px); font-weight:800; line-height:1.2;
  background:linear-gradient(120deg,#fff 20%, var(--red-bright) 120%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.data-card span{ font-size:12.5px; color:var(--text-3); margin-top:5px; display:block; }

/* 案例详情信息条 */
.case-info-bar{
  display:grid; gap:12px; padding:20px; margin-bottom:26px;
  border-radius:var(--radius-lg); border:1px solid var(--line);
  background:linear-gradient(165deg,var(--panel-2),#101014);
}
@media (min-width:600px){ .case-info-bar{ grid-template-columns:repeat(4,1fr); } }
.case-info-bar div em{ display:block; font-style:normal; font-size:12px; color:var(--text-3); margin-bottom:4px; }
.case-info-bar div b{ font-size:14.5px; color:var(--text); }

/* 时间轴（关于我们） */
.timeline{ position:relative; padding-left:30px; margin-top:10px; }
.timeline::before{
  content:""; position:absolute; left:8px; top:8px; bottom:8px; width:2px;
  background:linear-gradient(180deg,var(--red) 0%, rgba(200,16,46,.08) 100%);
}
.tl-item{ position:relative; padding:0 0 28px 16px; }
.tl-item:last-child{ padding-bottom:4px; }
.tl-item::before{
  content:""; position:absolute; left:-29px; top:7px; width:12px; height:12px;
  border-radius:50%; background:var(--black); border:3px solid var(--red);
  box-shadow:0 0 0 4px rgba(200,16,46,.16);
}
.tl-year{ color:var(--red-bright); font-weight:800; font-size:15px; margin-bottom:5px; }
.tl-item h4{ font-size:15.5px; margin-bottom:5px; }
.tl-item p{ color:var(--text-3); font-size:13.5px; line-height:1.8; }

/* 投放流程步骤 */
.steps{ display:grid; gap:16px; counter-reset:step; }
@media (min-width:600px){ .steps{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .steps{ grid-template-columns:repeat(5,1fr); } }
.step{
  position:relative; padding:22px 18px; border-radius:var(--radius-lg);
  background:linear-gradient(165deg,var(--panel-2),#101014);
  border:1px solid var(--line); transition:all .3s var(--ease);
}
.step:hover{ border-color:rgba(200,16,46,.5); transform:translateY(-4px); }
.step-num{
  width:42px; height:42px; border-radius:12px; margin-bottom:14px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--red),var(--red-deep));
  color:#fff; font-weight:800; font-size:17px;
  box-shadow:0 8px 20px rgba(200,16,46,.32);
}
.step h4{ font-size:15.5px; margin-bottom:7px; }
.step p{ color:var(--text-3); font-size:13px; line-height:1.8; }

/* FAQ 折叠 */
.faq-item{
  border:1px solid var(--line); border-radius:12px; margin-bottom:12px;
  background:rgba(255,255,255,.025); overflow:hidden;
  transition:border-color .3s;
}
.faq-item.open{ border-color:rgba(200,16,46,.5); }
.faq-q{
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:14px;
  padding:16px 18px; text-align:left; font-size:15px; font-weight:700; color:var(--text);
}
.faq-q .ico{
  flex-shrink:0; width:24px; height:24px; border-radius:7px; position:relative;
  background:var(--red-soft); border:1px solid rgba(200,16,46,.3); transition:transform .3s var(--ease);
}
.faq-q .ico::before, .faq-q .ico::after{
  content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  background:var(--red-bright); border-radius:2px;
}
.faq-q .ico::before{ width:11px; height:2px; }
.faq-q .ico::after{ width:2px; height:11px; transition:opacity .25s; }
.faq-item.open .faq-q .ico{ transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .45s var(--ease); }
.faq-item.open .faq-a{ max-height:320px; }
.faq-a-inner{ padding:0 18px 18px; color:var(--text-2); font-size:14px; line-height:1.95; }

/* 地图占位 */
.map-box{
  position:relative; height:360px; border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid var(--line);
  background:
    radial-gradient(600px 300px at 60% 40%, rgba(200,16,46,.14), transparent 65%),
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px),
    #0E0E12;
  background-size:auto, 44px 44px, 44px 44px, auto;
  display:flex; align-items:center; justify-content:center;
}
.map-pin{ text-align:center; position:relative; z-index:2; }
.map-pin .pin{
  width:46px; height:46px; margin:0 auto 12px; border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
  background:linear-gradient(135deg,var(--red),var(--red-deep));
  border:2px solid rgba(255,255,255,.85);
  box-shadow:0 14px 30px rgba(200,16,46,.5);
  animation:pinBounce 2.2s ease-in-out infinite;
}
.map-pin .pin::after{
  content:""; position:absolute; inset:0; margin:auto; width:12px; height:12px;
  border-radius:50%; background:#fff; top:5px; left:50%; transform:translateX(-50%);
}
@keyframes pinBounce{ 0%,100%{transform:rotate(-45deg) translate(0,0);} 50%{transform:rotate(-45deg) translate(-7px,7px);} }
.map-pin b{ display:block; font-size:15px; margin-bottom:5px; }
.map-pin p{ font-size:13px; color:var(--text-3); }
.map-note{
  position:absolute; left:14px; bottom:14px; z-index:3;
  font-size:12px; color:var(--text-3); padding:7px 13px; border-radius:999px;
  background:rgba(0,0,0,.55); border:1px solid var(--line); backdrop-filter:blur(6px);
}

/* 列表分页 */
.pager{ display:flex; flex-wrap:wrap; gap:9px; justify-content:center; margin-top:40px; }
.pager a, .pager span{
  min-width:42px; height:42px; padding:0 14px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:11px; border:1px solid var(--line);
  font-size:14px; color:var(--text-2); background:rgba(255,255,255,.03);
  transition:all .25s var(--ease);
}
.pager a:hover{ color:#fff; border-color:var(--red); background:var(--red-soft); }
.pager .current{
  background:linear-gradient(135deg,var(--red),var(--red-deep));
  color:#fff; border-color:transparent; font-weight:700;
  box-shadow:0 8px 20px rgba(200,16,46,.32);
}
.pager .dots{ border:0; background:none; }

/* 新闻列表条目（复用 news-item，加强封面） */
.news-item .thumb{
  flex-shrink:0; width:96px; height:72px; border-radius:10px;
  border:1px solid var(--line); position:relative; overflow:hidden;
}
.news-item .thumb::after{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:18px 18px;
}
@media (min-width:600px){
  .news-item .thumb{ width:150px; height:104px; }
}

/* 内页 CTA 横条 */
.cta-strip{
  padding:52px 0;
  background:
    radial-gradient(700px 300px at 85% 50%, rgba(200,16,46,.25), transparent 65%),
    linear-gradient(120deg, rgba(200,16,46,.16), rgba(20,20,24,.9) 55%);
  border-top:1px solid rgba(200,16,46,.28);
}
.cta-strip .container{
  display:flex; flex-direction:column; gap:22px; text-align:center; align-items:center;
}
.cta-strip h3{ font-size:clamp(19px,3.4vw,27px); }
.cta-strip p{ color:var(--text-2); font-size:14.5px; line-height:1.9; max-width:60ch; }
@media (min-width:900px){
  .cta-strip .container{
    flex-direction:row; justify-content:space-between; text-align:left; align-items:center;
  }
  .cta-strip .cta-text{ max-width:66%; }
}

/* 联系页信息卡（电话 / 手机分列） */
.contact-cards{ display:grid; gap:16px; margin-bottom:26px; }
@media (min-width:600px){ .contact-cards{ grid-template-columns:repeat(2,1fr); } }
.contact-cards li{
  display:flex; gap:14px; align-items:flex-start; padding:20px 18px;
  border:1px solid var(--line); border-radius:var(--radius-lg);
  background:linear-gradient(165deg,var(--panel-2),#101014);
  transition:all .3s var(--ease);
}
.contact-cards li:hover{ border-color:rgba(200,16,46,.55); transform:translateY(-3px); }
.contact-cards .info-ico{ width:44px; height:44px; border-radius:12px; }
.contact-cards em{ display:block; font-style:normal; font-size:12.5px; color:var(--text-3); margin-bottom:4px; }
.contact-cards b{ font-size:17px; letter-spacing:.5px; display:block; line-height:1.5; }
.contact-cards p{ font-size:12.5px; color:var(--text-3); margin-top:3px; }
.contact-cards a{ transition:color .2s; }
.contact-cards a:hover{ color:var(--red-bright); }

/* 值班提示条 */
.notice-bar{
  display:flex; gap:10px; align-items:flex-start; padding:14px 16px;
  border-radius:12px; border:1px dashed rgba(200,16,46,.45); background:var(--red-soft);
  font-size:13px; color:var(--text-2); line-height:1.8; margin-bottom:22px;
}
.notice-bar b{ color:var(--red-bright); flex-shrink:0; }

/* 联系区左侧信息栏：电话 / 手机 双卡（自动适配栏宽，宽则并排、窄则堆叠） */
.phone-cards{ display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:24px; }
@media (min-width:480px){ .phone-cards{ grid-template-columns:repeat(auto-fit,minmax(208px,1fr)); } }
.phone-card{
  display:flex; align-items:center; gap:13px; padding:15px 16px;
  border-radius:12px; border:1px solid var(--line);
  background:rgba(255,255,255,.035); transition:all .28s var(--ease);
}
.phone-card:hover{
  border-color:var(--red); background:var(--red-soft);
  transform:translateY(-2px); box-shadow:0 10px 24px rgba(200,16,46,.22);
}
.pc-ico{
  flex-shrink:0; width:40px; height:40px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  color:var(--red-bright); background:var(--red-soft); border:1px solid rgba(200,16,46,.3);
}
.phone-card:hover .pc-ico{ color:#fff; background:var(--red); border-color:var(--red); }
.pc-txt{ display:flex; flex-direction:column; line-height:1.35; min-width:0; }
.pc-txt em{ font-style:normal; font-size:11.5px; color:var(--text-3); margin-bottom:4px; }
.pc-txt b{ font-size:16.5px; letter-spacing:.4px; white-space:nowrap; }
.phone-card:hover .pc-txt b{ color:#fff; }

/* 服务项目内页：详情块 */
.service-detail{
  position:relative; display:grid; gap:24px; margin-bottom:26px;
  padding:26px 22px; border-radius:var(--radius-lg);
  background:linear-gradient(165deg,var(--panel-2),#101014);
  border:1px solid var(--line);
  transition:border-color .35s;
}
.service-detail:hover{ border-color:rgba(200,16,46,.45); }
.service-detail .sd-visual .sv-visual{ height:220px; border-radius:14px; border:1px solid var(--line); }
.service-detail .sd-body{ position:relative; }
.service-detail .sd-body h2{ font-size:22px; margin-bottom:14px; }
.service-detail .sd-body > p{ color:var(--text-2); font-size:14.5px; line-height:1.95; margin-bottom:16px; }
.service-detail .sv-index{ top:-6px; right:6px; font-size:44px; }
@media (min-width:900px){
  .service-detail{ grid-template-columns:380px minmax(0,1fr); gap:36px; align-items:center; padding:34px 30px; }
  .service-detail.rev .sd-visual{ order:2; }
}

/* 内页轮播控件移动端常显 */
@media (hover:none){
  .slider-arrow{ opacity:.85; width:38px; height:38px; }
  .slider-arrow.prev{ left:10px; }
  .slider-arrow.next{ right:10px; }
}
@media (max-width:600px){
  .slider{ min-height:540px; height:88vh; }
  .slide-art{ display:none; }
  .slide-inner{ padding-top:110px; padding-bottom:96px; }
  .slider-dots{ bottom:20px; }
}

/* 减少动态偏好 */
@media (prefers-reduced-motion:reduce){
  .slider-progress.run{ animation:none; width:100%; }
  .map-pin .pin{ animation:none; }
}


/* ==========================================================================
   页面级工具类
   说明：原先直接写在 HTML 标签上的内联 style 已统一收归到本文件，
        页面模板中不再出现内联样式，便于统一维护与主题换色。
   ========================================================================== */
.section--tight{ padding-top:56px; }        /* 内页 hero 下方首块的减距 */
.section--tight-lg{ padding-top:64px; }
.center-more{ text-align:center; margin-top:36px; }
.sub-h2{ font-size:23px; margin-bottom:16px; }        /* 单页正文小标题 */
.sub-h2--section{ margin:38px 0 6px; }
.sub-h2--wide{ margin-bottom:22px; }
.article-body--flush{ margin-top:0; }
.link-inherit{ color:inherit; }
.btn--mt{ margin-top:8px; }
.sv-visual--short{ height:230px; }
.map-box--short{ height:220px; margin-bottom:16px; }
.contact-qr--mt{ margin-top:14px; }

/* 分页：适配官方 pagelist 标签输出的 ul/li 结构（静态预览版的 span/a 结构同样适用） */
.pager ul{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:9px; list-style:none; margin:0; padding:0; }
.pager li{ margin:0; }
.pager li a,
.pager li span{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:44px; height:44px; padding:0 15px; border-radius:11px;
  border:1px solid var(--line); background:rgba(255,255,255,.03);
  color:var(--text-2); font-size:14px; transition:all .26s var(--ease);
}
.pager li a:hover{ color:#fff; border-color:var(--red); background:var(--red-soft); }
.pager li.active span,
.pager li.active a,
.pager li.current span{ background:var(--red); border-color:var(--red); color:#fff; }