/* 仪器维修网 · 共享样式（频道页） */
:root{
  --blue:#1565C0; --blue-d:#0D47A1; --blue-l:#E3F0FB;
  --orange:#FF7A00; --orange-d:#E66900;
  --ink:#1f2733; --gray:#5b6675; --line:#e6ebf2; --bg:#f5f8fc;
  /* 统一设计变量：圆角 / 阴影 / 间距（全站同源，消除散落硬编码） */
  --r-xs:10px; --r-sm:8px; --r-md:12px; --r-lg:14px; --r-xl:16px; --r-pill:22px;
  --sh-sm:0 2px 8px rgba(16,40,70,.06);
  --sh-md:0 8px 22px rgba(21,101,192,.12);
  --sh-btn-o:0 3px 10px rgba(255,122,0,.28);
  --sh-btn-b:0 3px 10px rgba(21,101,192,.28);
  --sp-1:8px; --sp-2:14px; --sp-3:20px; --sp-4:28px; --sp-5:42px;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"PingFang SC","Microsoft YaHei","Source Han Sans CN",sans-serif;color:var(--ink);background:#fff;line-height:1.65}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.section-pad{padding:var(--sp-5) 0}

/* 顶部通栏 */
.topbar{background:var(--blue-d);color:#cfe3fa;font-size:13px}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:34px}
.topbar strong{color:#fff;font-weight:700}
.topbar .hot{color:#ffb066;font-weight:700}
.topbar a{margin-left:16px;color:#cfe3fa}
.topbar a:hover{color:#fff}

/* 头部 */
.header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:100;transition:box-shadow .28s ease}
.header .wrap{display:flex;align-items:center;gap:24px;height:auto;padding:12px 0;transition:padding .28s ease,gap .28s ease}
.logo{flex-shrink:0;display:block}
.logo img{height:64px;width:auto;max-width:none;object-fit:contain;transition:height .28s ease}
.nav{display:flex;gap:10px 18px;font-size:16px;font-weight:700;flex-wrap:wrap;align-items:center;transition:font-size .28s ease,gap .28s ease}
.nav a{padding:6px 2px;border-bottom:2px solid transparent;line-height:1.25;white-space:nowrap}
.nav a:hover,.nav a.on{color:var(--blue);border-color:var(--blue)}
.call-btn{margin-left:auto;background:var(--orange);color:#fff;font-weight:700;border-radius:24px;padding:11px 22px;font-size:17px;white-space:nowrap;transition:padding .28s ease,font-size .28s ease}
.call-btn:hover{background:var(--orange-d)}
/* 滚动后的紧凑吸顶头部（site.js 加 .compact） */
.header.compact{box-shadow:0 6px 22px rgba(16,40,70,.10)}
.header.compact .wrap{padding:6px 0;gap:22px}
.header.compact .logo img{height:44px}
.header.compact .nav{font-size:15.5px;gap:19px}
.header.compact .call-btn{padding:8px 18px;font-size:15px}

/* 页头横幅 */
.page-hero{background:linear-gradient(135deg,var(--blue-d),var(--blue) 65%,#2f8ae5);color:#fff;padding:34px 0;position:relative;overflow:hidden}
.page-hero.cover{background-image:linear-gradient(135deg,rgba(13,71,161,.82),rgba(21,101,192,.76)),var(--bg-img);background-size:cover;background-position:center}
.page-hero h1{font-size:28px;font-weight:800;position:relative}
.page-hero p{margin-top:8px;color:#e3eefb;font-size:15px;max-width:760px;position:relative}
.page-hero .hot{color:#ffd9a8;font-weight:700}

/* 面包屑 */
.breadcrumb{font-size:13px;color:var(--gray);padding:14px 0}
.breadcrumb a:hover{color:var(--blue)}
.breadcrumb span{margin:0 6px;color:#c2cbd6}

/* 区块标题 */
.sec-head{margin-bottom:24px}
.sec-head h2{font-size:23px;font-weight:800}
.sec-head h2 em{font-style:normal;color:var(--blue)}
.sec-head p{color:var(--gray);margin-top:6px;font-size:14px}

/* 筛选栏 */
.filter{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:18px;margin-bottom:24px}
.filter-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 0;border-bottom:1px dashed var(--line)}
.filter-row:last-child{border-bottom:0}
.filter-row .fl{font-size:13.5px;color:var(--gray);width:64px;flex-shrink:0}
.chip{font-size:13px;background:var(--bg);border:1px solid var(--line);border-radius:20px;padding:5px 14px;color:var(--ink);cursor:pointer}
.chip:hover{border-color:var(--blue);color:var(--blue)}
.chip.on{background:var(--blue);color:#fff;border-color:var(--blue)}
select.fsel{height:38px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:14px;background:#fff;color:var(--ink)}
.btn-o{display:inline-block;background:var(--orange);color:#fff;font-weight:700;padding:10px 24px;border-radius:var(--r-pill);font-size:14px;border:none;cursor:pointer;box-shadow:var(--sh-btn-o);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.btn-o:hover{background:var(--orange-d);box-shadow:0 6px 16px rgba(255,122,0,.36);transform:translateY(-1px)}
.btn-b{display:inline-block;background:var(--blue);color:#fff;font-weight:700;padding:10px 24px;border-radius:var(--r-pill);font-size:14px;border:none;cursor:pointer;box-shadow:var(--sh-btn-b);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.btn-b:hover{background:var(--blue-d);box-shadow:0 6px 16px rgba(21,101,192,.36);transform:translateY(-1px)}
.btn-line{display:inline-block;border:1px solid var(--blue);color:var(--blue);border-radius:var(--r-pill);padding:9px 20px;font-weight:600;font-size:14px;cursor:pointer;background:#fff;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease}
.btn-line:hover{background:var(--blue);color:#fff;box-shadow:0 4px 12px rgba(21,101,192,.22);transform:translateY(-1px)}

/* 两栏布局 */
.layout{display:grid;grid-template-columns:1fr 280px;gap:26px;align-items:start}

/* 卡片网格 */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-3);transition:box-shadow .2s ease,border-color .2s ease}
.card:hover{box-shadow:var(--sh-md);border-color:#cfe0f3}
.card .top{display:flex;align-items:center;gap:12px}
.avatar{width:50px;height:50px;border-radius:10px;background:linear-gradient(135deg,var(--blue),#4d9bef);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;flex-shrink:0}
.card h3{font-size:16px}
/* 服务商卡：上行简写名 + 徽标，下行企业全称小字（老板 2026-10-04 口径） */
.p-full{margin-top:2px;font-size:12.5px;line-height:1.5;color:var(--gray);word-break:break-all}
.badge{display:inline-block;font-size:11px;color:#1d9e57;background:#e8f7ee;border-radius:4px;padding:1px 6px;margin-left:4px;vertical-align:middle}
.badge.orange{color:var(--orange-d);background:#fff3e5}
.badge.blue{color:var(--blue);background:var(--blue-l)}
.labels{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}
.lab{font-size:12px;background:var(--blue-l);color:var(--blue);border-radius:4px;padding:2px 8px}
.meta{margin-top:12px;font-size:13px;color:var(--gray);display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px}
.meta b{color:var(--orange-d)}
.cta{margin-top:14px;display:block;text-align:center;border:1px solid var(--blue);color:var(--blue);border-radius:8px;padding:8px 0;font-weight:600;font-size:14px}
.cta:hover{background:var(--blue);color:#fff}
.cta.o{border-color:var(--orange);color:var(--orange-d)}
.cta.o:hover{background:var(--orange);color:#fff}

/* 商品卡 */
.part-card .ph{height:140px;background:linear-gradient(135deg,#eef4fb,#dce9f8);display:flex;align-items:center;justify-content:center;font-size:44px}
.part-card{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:#fff}
.part-card .bd{padding:16px}
.part-card h3{font-size:14.5px;line-height:1.4;min-height:40px}
.fit{font-size:12px;color:var(--gray);margin-top:6px}
.row{margin-top:12px;display:flex;justify-content:space-between;align-items:center}
.price{color:var(--orange-d);font-weight:800;font-size:17px}
.price span{font-size:12px;color:var(--gray);font-weight:400}

/* 需求卡片 */
.req{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:16px 18px;margin-bottom:14px}
.req .rtag{flex-shrink:0;font-size:12px;padding:3px 10px;border-radius:20px;font-weight:600}
.rtag.wait{background:#fff3e5;color:var(--orange-d)}
.rtag.offer{background:var(--blue-l);color:var(--blue)}
.rtag.done{background:#e8f7ee;color:#1d9e57}
.rtag.doing{background:#fde7f0;color:#c2185b}
.req .rbody{flex:1}
.req .rbody h3{font-size:15px}
.req .rbody p{font-size:12.5px;color:var(--gray);margin-top:3px}
.req .rside{text-align:right;font-size:12.5px;color:var(--gray);flex-shrink:0}
.req .rside b{color:var(--orange-d);font-size:14px}

/* 流程四步 */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-3);position:relative}
.step .num{width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;margin-bottom:10px}
.step h3{font-size:16px}
.step p{font-size:13px;color:var(--gray);margin-top:6px}

/* 详情页 */
.detail-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:26px;align-items:start}
.detail-hero{display:flex;gap:18px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px}
.detail-logo{width:96px;height:96px;border-radius:14px;background:linear-gradient(135deg,var(--blue),#4d9bef);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:34px;flex-shrink:0}
.detail-hero h1,.detail-hero h2{font-size:24px;margin:0}
.detail-hero .sub{color:var(--gray);font-size:14px;margin-top:6px}
.detail-hero .acts{margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;margin-bottom:22px}
.panel h2{font-size:19px;margin-bottom:14px}
.panel h2 em{font-style:normal;color:var(--blue)}
.spec{width:100%;border-collapse:collapse;font-size:14px}
.spec th,.spec td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.spec th{width:140px;color:var(--gray);font-weight:500;background:var(--bg)}
.case-item{border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-bottom:12px}
.case-item h3{font-size:15px}
.case-item p{font-size:13px;color:var(--gray);margin-top:5px}
.review{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.review .ra{width:40px;height:40px;border-radius:50%;background:var(--blue-l);color:var(--blue);display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}
.review .rt{font-size:13px;color:var(--gray)}
.review .rs{color:var(--orange-d);font-weight:700}
.sidebar-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-3);margin-bottom:20px}
.sidebar-card h3{font-size:16px;margin-bottom:12px}
.sidebar-card .line{display:flex;justify-content:space-between;font-size:13.5px;padding:6px 0;border-bottom:1px dashed var(--line)}
.sidebar-card .line:last-child{border-bottom:0}

/* 知识库 */
.kb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:10px}
.kb-cat{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-3)}
.kb-cat h3{font-size:16px}
.kb-cat p{font-size:13px;color:var(--gray);margin-top:6px}
.faq{border:1px solid var(--line);border-radius:var(--r-md);padding:16px 20px;margin-bottom:12px;background:#fff}
.faq .q{font-size:15.5px;font-weight:700}
.faq .a{font-size:14px;color:#36404d;margin-top:8px}
.faq .a b{color:var(--orange-d)}
.ai-box{background:linear-gradient(135deg,var(--blue-d),var(--blue));border-radius:14px;color:#fff;padding:26px}
.ai-box h3{font-size:19px}
.ai-box p{font-size:13.5px;color:#d6e8fb;margin:8px 0 14px}
.ai-box .fi{background:rgba(255,255,255,.95);color:var(--ink);border-radius:8px;padding:12px 16px;font-size:14px;display:flex;justify-content:space-between;align-items:center}
.ai-box .fi b{color:var(--orange)}
.ai-box .fine{font-size:11.5px;color:#a9c9ee;margin-top:12px}
.ai-box .fine b{color:#ffd9a8}

/* 信任条 */
.trust-line{font-size:13.5px;color:#cfe3fa;margin-top:14px}
.trust-line b{color:#ffd9a8}

/* 页脚 */
.footer{background:#12253c;color:#9db4cd;padding:46px 0 0;font-size:13.5px;margin-top:30px}
.footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;padding-bottom:32px;border-bottom:1px solid #24405f}
.footer h4{color:#fff;font-size:15px;margin-bottom:12px}
/* 页脚 logo：去掉右侧「仪器维修网」文字（2026-10-03 老板定）。
   尺寸口径（2026-10-05 老板再定）：页脚 logo 要「尽可能大」。
   曾一度收敛到 96px（理由是 1069x1278 竖版图占屏高、与页脚文字失衡），
   老板明确要求放大回去，故取 240px。
   2026-10-08 再定：在 240px 基础上再放大 1.5 倍 → 360px，窄屏 170px → 255px。
   已用 trim_logo_whitespace.py 裁掉四周白边（实测仅剩约 3%），放大不会出现空白边。 */
.footer .flogo{display:flex;align-items:center;margin-bottom:14px}
.footer .flogo img{height:360px;width:auto;max-width:100%;display:block}
.footer .fhot{color:#ffd9a8;font-size:17px;font-weight:800}
.footer a{display:block;padding:3px 0}
.footer a:hover{color:#fff}
.footer .bottom{padding:16px 0;text-align:center;font-size:12.5px;color:#8aa3bd}
.footer .bottom b{color:#ffd9a8}
/* ICP 备案号链接：页脚版权行、关于我们正文/侧栏、配件商城 .copy 复用同一支。
   字号与颜色继承所在容器（深色页脚自动取 #8aa3bd，浅色正文取正文色），
   只额外加下划线做可点击提示；并覆盖 .footer a{display:block}，避免独占一行。 */
.icp-link,.footer a.icp-link,.footer .bottom a.icp-link,.copy .icp-link{
  display:inline;padding:0;font:inherit;font-size:inherit;color:inherit;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;
  word-break:keep-all;white-space:nowrap;transition:opacity .15s,text-decoration-thickness .15s}
.icp-link:hover,.icp-link:focus-visible{opacity:.82;text-decoration-thickness:1.5px}
@media(max-width:520px){
  /* 窄屏页脚版权行会折行，备案号整串不被拆断（"号-5"不能掉到下一行） */
  .icp-link{white-space:nowrap}
}

/* 悬浮窗 + 移动底栏 */
/* 站内搜索框（浅色版：404 页与各入口复用） */
.sbox{display:flex;gap:10px;max-width:640px;margin-top:6px}
.sbox input{flex:1;border:1px solid var(--line);border-radius:10px;padding:0 16px;height:50px;font-size:15px;outline:0;background:#fff;color:var(--ink)}
.sbox input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,101,192,.12)}
.sbox button{border:0;background:var(--blue);color:#fff;font-weight:700;font-size:15px;padding:0 26px;border-radius:10px;cursor:pointer;white-space:nowrap}
.sbox button:hover{background:var(--blue-d)}
.sbox-hint{font-size:12.5px;color:var(--gray);margin-top:10px}
.sbox-hint a{color:var(--blue);margin-right:12px}

/* 404 页 */
.err-code{font-size:72px;font-weight:800;color:var(--blue);line-height:1;letter-spacing:2px}
.err-list{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:6px}
.err-list a{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;font-size:14px;font-weight:600;transition:.2s;display:block}
.err-list a:hover{border-color:#cfe0f3;box-shadow:0 8px 20px rgba(21,101,192,.10);color:var(--blue);transform:translateY(-2px)}
.err-list a span{display:block;font-size:12px;font-weight:400;color:var(--gray);margin-top:4px}

/* 悬浮客服组件（右下角） */
.float{position:fixed;right:20px;bottom:104px;z-index:250;display:flex;flex-direction:column;gap:10px}
.float .fb{display:flex;align-items:center;gap:11px;padding:9px 16px 9px 9px;border-radius:18px;background:#fff;
  border:1px solid rgba(16,40,70,.07);box-shadow:0 4px 10px rgba(16,40,70,.07),0 16px 34px rgba(16,40,70,.11);
  transition:transform .28s cubic-bezier(.34,1.3,.5,1),box-shadow .28s ease,border-color .28s ease;
  animation:fbIn .55s cubic-bezier(.22,1,.36,1) backwards}
.float .fb:nth-child(1){animation-delay:.06s}
.float .fb:nth-child(2){animation-delay:.15s}
.float .fb:nth-child(3){animation-delay:.24s}
.float .fb:hover{transform:translateX(-5px);border-color:rgba(21,101,192,.2);
  box-shadow:0 8px 16px rgba(16,40,70,.10),0 22px 44px rgba(16,40,70,.16)}
.float .fb .ic{width:40px;height:40px;flex:0 0 auto;border-radius:13px;display:flex;align-items:center;justify-content:center;
  color:#fff;transition:transform .3s cubic-bezier(.34,1.3,.5,1)}
.float .fb:hover .ic{transform:scale(1.07)}
.float .fb .ic svg{width:21px;height:21px;display:block}
.float .fb b{display:block;font-size:13.5px;font-weight:700;color:var(--ink);letter-spacing:.3px;line-height:1.35}
.float .fb em{display:block;font-style:normal;font-size:11.5px;color:var(--gray);letter-spacing:.2px;line-height:1.35;margin-top:1px}
.float .fb-hot{background:linear-gradient(135deg,#FF9330,var(--orange) 52%,#E06300);border-color:transparent;
  box-shadow:0 6px 14px rgba(255,122,0,.28),0 18px 38px rgba(255,122,0,.22)}
.float .fb-hot:hover{box-shadow:0 10px 20px rgba(255,122,0,.32),0 24px 48px rgba(255,122,0,.26)}
.float .fb-hot b{color:#fff}
.float .fb-hot em{color:rgba(255,255,255,.88)}
.float .fb-hot .ic{background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);animation:fbPulse 2.8s infinite}
.float .fb-ai .ic{background:linear-gradient(135deg,#3B86E6,var(--blue-d));box-shadow:0 4px 10px rgba(21,101,192,.28)}
.float .fb-rep .ic{background:linear-gradient(135deg,#2EBB77,#128A52);box-shadow:0 4px 10px rgba(18,138,82,.26)}
@keyframes fbIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}
@keyframes fbPulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55),inset 0 0 0 1px rgba(255,255,255,.28)}
  70%{box-shadow:0 0 0 14px rgba(255,255,255,0),inset 0 0 0 1px rgba(255,255,255,.28)}
  100%{box-shadow:0 0 0 0 rgba(255,255,255,0),inset 0 0 0 1px rgba(255,255,255,.28)}}
.mnav{display:none}

@media (max-width:900px){
  .nav,.topbar .links{display:none}
  .logo img{height:52px}
  .grid-3,.grid-4,.kb-grid{grid-template-columns:repeat(2,1fr)}
  .layout,.detail-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .footer .cols{grid-template-columns:1fr 1fr}
  .page-hero h1{font-size:23px}
  .call-btn{padding:8px 14px;font-size:14px}
  .mnav{display:flex;position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);z-index:300;padding:6px 0 calc(6px + env(safe-area-inset-bottom))}
  .mnav a{flex:1;text-align:center;font-size:12px;font-weight:600;color:var(--gray)}
  .mnav a .ic{font-size:20px;display:block}
  .mnav a.center{color:#fff}
  .mnav a.center .dial{width:48px;height:48px;border-radius:50%;background:var(--orange);margin:-24px auto 2px;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 4px 12px rgba(255,122,0,.4)}
  body{padding-bottom:64px}
  /* 移动端：悬浮组收起为单一圆形拨号键，AI/报修入口交给底部导航，避免遮挡 */
  .float{right:12px;bottom:76px;gap:0}
  .float .fb-ai,.float .fb-rep{display:none}
  .float .fb{padding:0;width:50px;height:50px;border-radius:50%;justify-content:center;animation:none}
  .float .fb:hover{transform:none}
  .float .fb .tx{display:none}
  .float .fb .ic{width:50px;height:50px;border-radius:50%}
  .float .fb-hot .ic{background:transparent;box-shadow:none;animation:none}
  .float .fb-hot .ic svg{width:24px;height:24px}
  .header.compact .logo img{height:40px}
  .header.compact .wrap{padding:8px 0}
  .err-list{grid-template-columns:repeat(2,1fr)}
}

/* 底部导航当前页高亮 */
.mnav a.on{color:var(--blue)}

/* ==================== 实景图版式（全站图文并茂） ==================== */
/* 正文配图：统一比例占位，避免加载时布局抖动 */
.fig{margin:18px 0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#eef4fb}
.fig picture{display:block;aspect-ratio:var(--ar,16/10);overflow:hidden}
.fig img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.fig:hover img{transform:scale(1.04)}
.fig figcaption{font-size:12.5px;color:var(--gray);line-height:1.65;padding:10px 14px;
  background:#fff;border-top:1px solid var(--line)}
.fig figcaption::before{content:"";display:inline-block;width:3px;height:12px;border-radius:2px;
  background:var(--blue);margin-right:7px;vertical-align:-1px}
.fig.flat{margin:0;border-radius:12px}
.fig.flat figcaption{display:none}
/* 双图/多图并排 */
.fig-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0}
.fig-row .fig{margin:0}
.fig-row .fig picture{aspect-ratio:4/3}
/* 图文两栏（文左图右） */
.media{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:center;margin:18px 0}
.media .fig{margin:0}
.media.rev .fig{order:-1}

/* 卡片缩略图（配件/文章/资讯） */
.part-card .ph{height:158px;background:linear-gradient(135deg,#eef4fb,#dce9f8);overflow:hidden;position:relative}
.part-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.part-card:hover .ph img{transform:scale(1.06)}
.part-card{transition:box-shadow .22s,border-color .22s,transform .22s}
.part-card:hover{box-shadow:0 10px 26px rgba(21,101,192,.14);border-color:#cfe0f3;transform:translateY(-2px)}

.card-thumb{border-radius:10px;overflow:hidden;background:#eef4fb;margin:-4px 0 12px}
.card-thumb picture{display:block;aspect-ratio:16/9;overflow:hidden}
.card-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.card:hover .card-thumb img{transform:scale(1.05)}
/* 资讯卡片缩略图（小尺寸） */
.news-thumb{border-radius:9px;overflow:hidden;background:#eef4fb;margin-bottom:10px}
.news-thumb picture{display:block;aspect-ratio:16/9;overflow:hidden}
.news-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
a:hover .news-thumb img{transform:scale(1.05)}

/* 全宽实景横幅（首页/频道页用） */
.photo-band{position:relative;display:block;border-radius:16px;overflow:hidden;background:#0d2b57}
.photo-band picture{display:block;aspect-ratio:21/9;overflow:hidden}
.photo-band img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.photo-band::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(8,40,95,.90) 0%,rgba(13,71,161,.62) 46%,rgba(21,101,192,.18) 100%)}
.photo-band .pb-tx{position:absolute;left:0;right:0;bottom:0;padding:30px 34px;z-index:2;color:#fff}
.photo-band .pb-tx h3{font-size:22px;font-weight:800;letter-spacing:.3px}
.photo-band .pb-tx p{font-size:14px;color:#d8e9fb;margin-top:7px;max-width:660px;line-height:1.75}
.photo-band .pb-tx .pb-cta{display:inline-block;margin-top:14px;background:var(--orange);color:#fff;
  font-size:14px;font-weight:700;border-radius:22px;padding:9px 20px}
.photo-band:hover img{transform:scale(1.035)}
/* 三图/四图实景画廊 */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gallery .fig{margin:0}
.gallery .fig picture{aspect-ratio:4/3}
.gallery.g4{grid-template-columns:repeat(4,1fr)}

/* 详情页主图 */
.hero-fig{margin:0 0 20px;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#eef4fb}
.hero-fig picture{display:block;aspect-ratio:16/9;overflow:hidden}
.hero-fig img{width:100%;height:100%;object-fit:cover}
/* 配件详情页主图（竖图可完整显示） */
.hero-fig.fit-contain picture{aspect-ratio:4/3;background:#f2f7fd}
.hero-fig.fit-contain img{object-fit:contain}

/* 页头实景横幅：遮罩减轻，让真实场景透出来，左侧加深保证标题可读 */
.page-hero.cover{background-image:
  linear-gradient(105deg,rgba(9,45,105,.90) 0%,rgba(13,71,161,.76) 45%,rgba(21,101,192,.58) 100%),
  var(--bg-img);
  background-size:cover;background-position:center;box-shadow:inset 0 -34px 46px -30px rgba(0,0,0,.42)}
.page-hero{padding:38px 0}

@media (max-width:760px){
  .fig-row{grid-template-columns:1fr;gap:12px}
  .media{grid-template-columns:1fr;gap:14px}
  .media.rev .fig{order:0}
  .fig{margin:14px 0;border-radius:12px}
  .part-card .ph{height:132px}
  .gallery,.gallery.g4{grid-template-columns:1fr 1fr;gap:10px}
  .gallery .fig picture,.gallery.g4 .fig picture{aspect-ratio:1/1}
  .gallery .fig figcaption{font-size:11.5px;padding:7px 10px}
  .photo-band picture{aspect-ratio:16/11}
  .photo-band .pb-tx{padding:18px 20px}
  .photo-band .pb-tx h3{font-size:16.5px}
  .photo-band .pb-tx p{font-size:12.5px;margin-top:5px}
  .photo-band .pb-tx .pb-cta{font-size:12.5px;padding:7px 15px;margin-top:10px}
  .hero-fig picture{aspect-ratio:4/3}
  .footer .flogo img{height:255px}
}

/* 尊重系统「减弱动态效果」设置 */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important}
  .fig:hover img,.part-card:hover .ph img,.card:hover .card-thumb img{transform:none}
}

/* 窄桌面：logo 等比缩小防溢出（不影响 ≤900px 移动端规则） */
@media (min-width:901px) and (max-width:1280px){
  .logo img{height:54px}
  .header.compact .logo img{height:40px}
  .nav{font-size:15px;gap:8px 14px}
}
@media (min-width:901px) and (max-width:1080px){
  .logo img{height:50px}
  .nav{font-size:14.5px;gap:6px 12px}
}

/* 服务商 logo 展示：白底托底 + 等比缩放，任何比例的官方标识都不变形 */
/* 服务商 logo 盒（2026-10-05 重构）：原为 50x50 方框 + 3px 内边距，
   而服务商 logo 裁除白边后中位宽高比 3.0:1（28 张落在 2.5~5:1），
   横版长条塞进方框后实际只渲染约 44x15px，又小又空。
   改为**固定高度、宽度自适应**的横版盒，横竖版都能获得一致的视觉高度。 */
.avatar.av-logo{width:112px;height:50px;border-radius:10px;background:#fff;border:1px solid var(--line);padding:5px}
.avatar.av-logo img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;display:block}
.detail-logo.av-logo{width:168px;height:106px;background:#fff;border:1px solid var(--line);padding:8px}
.detail-logo img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;display:block}
/* 品牌标识图：白底托底 + 等比缩放，表格/卡片/详情页通用 */
.brand-logo{height:34px;width:auto;max-width:190px;object-fit:contain;object-position:left center;vertical-align:middle;background:#fff;border:1px solid var(--line);border-radius:6px;padding:3px 8px;margin-right:7px}
.card .brand-logo{display:block;margin:0 auto 10px;height:40px;width:auto;max-width:200px}
/* 中性标识（无官方 logo 素材时的设计降级，由 gen_brand_marks.py 产出）：
   图形自带渐变底色与圆角，因此**不再叠白底和边框**——
   否则会出现「彩色方块套白框」的突兀感，且与同列表的官方横版 logo 不搭。
   尺寸与官方标识保持同一视觉高度（34px / 50px / 106px），并列时不跳行。 */
.brand-logo.mark{height:34px;width:34px;background:none;border:none;padding:0;border-radius:var(--r-sm);object-fit:contain}
.card .brand-logo.mark{height:44px;width:44px;margin:0 auto 10px}
.avatar.av-mark{width:50px;height:50px;background:none;border:none;padding:0}
.avatar.av-mark img{width:100%;height:100%;border-radius:var(--r-sm);display:block}
.detail-logo.av-mark{width:106px;height:106px;background:none;border:none;padding:0}
.detail-logo.av-mark img{width:100%;height:100%;border-radius:var(--r-lg);display:block}

/* ===== 表单 / 分步向导（入驻申请、报修工单共用）===== */
.wizard{max-width:860px;margin:24px auto}
.wsteps{display:flex;gap:8px;margin-bottom:22px}
.wstep{flex:1;text-align:center;font-size:13px;color:var(--gray);position:relative;padding-top:34px}
.wstep .dot{position:absolute;top:0;left:50%;transform:translateX(-50%);width:26px;height:26px;border-radius:50%;background:var(--bg);border:2px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px}
.wstep.on{color:var(--blue);font-weight:700}
.wstep.on .dot{background:var(--blue);border-color:var(--blue);color:#fff}
.wstep.done .dot{background:#1d9e57;border-color:#1d9e57;color:#fff}
.wpanel{display:none;background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px}
.wpanel.on{display:block}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fi{display:flex;flex-direction:column;gap:6px}
.fi.full{grid-column:1/-1}
.fi label{font-size:13.5px;font-weight:600}
.fi label em{color:#e53935;font-style:normal}
.fi input,.fi select,.fi textarea{height:42px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:14px;font-family:inherit;background:#fff;color:var(--ink)}
.fi textarea{height:88px;padding:10px 12px;line-height:1.6;resize:vertical}
.fi input:focus,.fi select:focus,.fi textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,101,192,.10)}
.fi .hint{font-size:12px;color:var(--gray)}
.upbox{border:2px dashed var(--line);border-radius:10px;padding:22px;text-align:center;color:var(--gray);font-size:13.5px;cursor:pointer}
.upbox:hover{border-color:var(--blue);color:var(--blue)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips .chip.on{background:var(--blue);color:#fff}
.wnav{display:flex;justify-content:space-between;margin-top:20px;gap:10px}
.agree{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--gray)}
.okbox{display:none;text-align:center;padding:40px 20px}
.okbox .tick{width:64px;height:64px;border-radius:50%;background:#e8f7ee;color:#1d9e57;font-size:30px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
@media(max-width:700px){.fgrid{grid-template-columns:1fr}.wstep span.t{display:none}}

/* ===== 报修工单（xuqiu / contact 共用）===== */
.fwrap{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;margin-top:18px}
.fwrap h2{font-size:18px;margin-bottom:6px}
.fwrap .sub{font-size:13px;color:var(--gray);line-height:1.8;margin-bottom:16px}
.ticket{display:none;margin-top:16px;border:1px solid var(--blue);background:#f2f7fd;border-radius:12px;padding:18px}
.ticket.on{display:block}
.ticket .tno{font-size:13px;color:var(--gray)}
.ticket .tno b{font-size:17px;color:var(--blue);letter-spacing:.5px}
.ticket textarea{width:100%;min-height:190px;border:1px solid var(--line);border-radius:8px;padding:12px;font-size:13.5px;line-height:1.8;font-family:inherit;background:#fff;color:var(--ink)}
.tacts{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.tacts .btn-b,.tacts .btn-o,.tacts .btn-line{flex:1;min-width:150px;text-align:center}
.tips{font-size:12.5px;color:var(--gray);line-height:1.9;margin-top:12px;border-top:1px dashed var(--line);padding-top:12px}
.myreq{margin-top:14px;font-size:13px;color:var(--gray)}
.myreq b{color:var(--ink)}
.err{color:#e53935;font-size:12.5px;min-height:18px;margin-top:8px}


/* ===== 账号体系（页头账号区 + 登录/注册/账号页）===== */
.authslot{display:inline-flex;gap:8px;align-items:center;white-space:nowrap}
.header .authslot{margin-left:auto}
.abtn{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  padding:8px 18px;border-radius:22px;font-size:13.5px;font-weight:600;
  border:1px solid var(--line);color:var(--blue-d);background:#fff;
  text-decoration:none;line-height:1.4;cursor:pointer;white-space:nowrap;
  box-shadow:0 1px 3px rgba(16,40,70,.07);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease,border-color .2s ease;
}
.abtn .ic{width:15px;height:15px;flex-shrink:0;display:block}
.abtn:hover{border-color:var(--blue);color:var(--blue);box-shadow:0 4px 12px rgba(21,101,192,.20);transform:translateY(-1px)}
.abtn.primary{background:linear-gradient(135deg,#1f78d1,var(--blue-d));border-color:transparent;color:#fff;box-shadow:0 3px 10px rgba(21,101,192,.30)}
.abtn.primary:hover{background:linear-gradient(135deg,var(--blue),var(--blue-d));box-shadow:0 6px 16px rgba(21,101,192,.40);transform:translateY(-1px);color:#fff}
.abtn.muted{color:var(--gray);border-color:var(--line);background:#fff;box-shadow:none}
/* 积分徽标：琥珀色系，与普通账号按钮区分，一眼看出是「资产」 */
.abtn.pts{
  border-color:#f0c98a;color:#8a5a00;background:linear-gradient(135deg,#fff8ec,#ffefd6);
  font-weight:700;box-shadow:0 2px 8px rgba(200,140,20,.18)
}
.abtn.pts:hover{border-color:var(--orange);color:var(--orange-d);background:linear-gradient(135deg,#fff3e0,#ffe6c6);box-shadow:0 5px 14px rgba(200,140,20,.26)}
.abtn.pts .ic{color:var(--orange-d)}

/* 联系方式展示分流：已入驻直显（绿）/ 未入驻走门户（橙）+ 积分解锁 */
.contact-direct{border-left:4px solid #1d9e57}
.contact-locked{border-left:4px solid var(--orange)}
.contact-locked h2 em{color:var(--orange-d)}
.unlock-box .tacts{margin-top:10px}
.unlock-box button{margin-right:10px}
.panel .badge.blue{background:var(--blue-l);color:var(--blue-d);border-color:#bcd9f4}
details summary::-webkit-details-marker{display:inline-block;margin-right:6px}
.abtn.me{max-width:180px;overflow:hidden;text-overflow:ellipsis}
/* 账号区在移动端保留入口。
   原来这里是 display:none —— 1080px 以下整块隐藏，等于手机用户看不到任何注册/登录入口，
   而全站的收藏、询价单、工单查看又都要求先登录。改为压缩尺寸继续显示。 */
@media(max-width:1080px){
  .header .authslot{gap:5px}
  .header .authslot .abtn{padding:6px 14px;font-size:12.5px}
  .header .authslot .abtn.me{max-width:96px}
}
@media(max-width:520px){
  .header .authslot{gap:4px}
  .header .authslot .abtn{padding:5px 11px;font-size:12px}
  .header .authslot .abtn.me{max-width:74px}
}
/* 收藏已选中的按钮态 */
.abtn[data-on="1"]{border-color:var(--orange);color:var(--orange-d);background:#fff7ee;box-shadow:none}
/* 轻提示（收藏 / 加入询价单） */
.yqwx-toast{position:fixed;left:50%;bottom:88px;transform:translate(-50%,12px);
  background:#1f2937;color:#fff;font-size:13.5px;line-height:1.6;padding:10px 16px;border-radius:10px;
  box-shadow:0 8px 24px rgba(16,40,70,.24);opacity:0;pointer-events:none;transition:opacity .24s,transform .24s;z-index:400;max-width:88vw}
.yqwx-toast.on{opacity:1;transform:translate(-50%,0)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:16px}
.tab{appearance:none;background:none;border:0;padding:10px 14px;font-size:14.5px;cursor:pointer;
  color:var(--gray);font-family:inherit;border-bottom:2px solid transparent;margin-bottom:-1px}
.tab.on{color:var(--blue);font-weight:700;border-bottom-color:var(--blue)}
.authpane{display:none}
.authpane.on{display:block}
.err.ok{color:#1d9e57}
.err.bad{color:#e53935}
/* 机型库（yiqi）样式块 */
.dot-list{padding-left:20px;margin:8px 0}
.dot-list li{margin:6px 0;line-height:1.85}
.sec-h{margin:26px 0 14px;font-size:20px;font-weight:700}
.sec-h .tag,.tag{display:inline-block;margin-left:10px;padding:2px 10px;border-radius:20px;
  background:#eef4fb;color:var(--blue);font-size:12.5px;font-weight:600;vertical-align:middle}
.fault-row{padding:12px 0;border-top:1px solid var(--line)}
.fault-row:first-of-type{border-top:none;padding-top:4px}
.fault-row .badge.blue{display:inline-block;min-width:44px;text-align:center}

/* ===== 窄屏 logo 适配（2026-10-05）=====
   服务商 logo 由 50x50 方框改为横版盒（宽 112px）后，
   ≤900px 时 grid-3 仍为 2 列、卡片内容区仅约 160px，
   横排会把「企业全称」挤成每行一字的竖排。
   故窄屏把带官方 logo 的卡片改为纵向堆叠：logo 在上、文字整行。
   注意：本块必须位于文件末尾 —— 与主规则 .avatar.av-logo 同特异性，
   靠「后出现者胜出」生效。:has() 不支持的老浏览器仅保持原横向布局，不会破版。 */
@media (max-width:900px){
  .card .top:has(.avatar.av-logo){flex-direction:column;align-items:flex-start;gap:10px}
  .avatar.av-logo{width:100%;max-width:170px;height:48px}
  .detail-logo.av-logo{width:126px;height:82px}
  .card .brand-logo{height:34px;max-width:150px}
  .brand-logo{height:30px;max-width:150px}
}

/* ===== 营业执照 OCR 核验（2026-10-05）=====
   企业入驻第 1 步：上传执照影像 → 识别带出税号 → 第 2 步才填开票资料。
   标识约定：
     .ocr-box     上传区（继承 .upbox 的虚线框，hover/拖拽态在此加粗）
     .ocr-filled  由引擎识别自动填充的字段（左侧蓝条 + 浅蓝底）
     .ocr-manual  人工校对模式下允许编辑的字段
     .ocr-status  上传/识别状态文案，三态：ok / warn / bad
   注意：本块须位于文件末尾 —— .wizard/.upbox 与新块部分同特异性，
   靠「后出现者胜出」生效。 */
.ocr-box{position:relative;padding:22px 18px;background:#fbfdff}
.ocr-box:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ocr-box.dragging{border-color:var(--blue);background:#eef4fb;color:var(--blue)}
.ocr-file{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.ocr-box-title{font-size:14.5px;font-weight:600;color:var(--ink)}
.ocr-box-sub{font-size:12.5px;color:var(--gray);margin-top:5px;line-height:1.7}
.ocr-status{font-size:13px;margin-top:10px;line-height:1.6;color:var(--gray)}
.ocr-status.is-ok{color:#1d9e57}
.ocr-status.is-warn{color:#b26a00}
.ocr-status.is-bad{color:#e53935}
.ocr-status.is-busy{color:var(--blue)}
.ocr-preview{margin-top:14px;text-align:center}
.ocr-preview img{max-width:100%;max-height:320px;border:1px solid var(--line);border-radius:10px;background:#fff}
.ocr-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.ocr-btn{height:38px;font-size:13.5px}
.ocr-hint{margin-top:14px;background:#f6f9fc;border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.ocr-manual-title{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:6px}
.ocr-manual-desc{font-size:12.5px;color:#4a5568;line-height:1.85}
.ocr-manual-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.ocr-manual-list li{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.ocr-manual-list li b{font-size:12.5px;color:var(--ink)}
.ocr-manual-list li span{font-size:11.5px;color:var(--gray)}
.ocr-lead{background:#eef4fb;border-left:4px solid var(--blue);border-radius:8px;padding:14px 16px;margin-bottom:16px}
.ocr-lead p{font-size:13.5px;color:#2c3e50;line-height:1.9}
.ocr-sec-title{font-size:15px;font-weight:700;color:var(--ink);margin:24px 0 14px;padding-bottom:9px;border-bottom:1px solid var(--line);display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.ocr-sec-title span{font-size:12.5px;font-weight:400;color:var(--gray)}
/* 识别/人工来源标记：识别自动填的字段左侧留蓝条，避免"凭空出现"的值被忽略 */
.fi input.ocr-filled{border-left:3px solid var(--blue);background:#f7fbff}
.fi input.ocr-manual{border-left:3px solid #c8d3e0;background:#fff}
/* 统一社会信用代码校验提示 */
.ocr-code-tip{font-size:12px;color:var(--gray);line-height:1.6;min-height:0}
.ocr-code-tip.is-ok{color:#1d9e57}
.ocr-code-tip.is-bad{color:#e53935}
.fi input.is-bad{border-color:#e53935;box-shadow:0 0 0 3px rgba(229,57,53,.10)}
@media (max-width:900px){
  .ocr-manual-list{grid-template-columns:1fr}
  .ocr-preview img{max-height:220px}
  .ocr-actions{gap:8px}
  .ocr-btn{height:34px;font-size:12.5px;padding:0 12px}
}

/* ===== 真实文件上传控件（2026-10-05）=====
   .upbox 原本是纯装饰性虚线框，点不出文件；现在改为 label 包 input[type=file]，
   保留原视觉样式，用 :focus-within / :hover 表达可交互态。
   ⚠️ 本块必须在文件末尾 —— 与既有 .upbox 同特异性，靠后出现者胜出。 */
.upbox-file{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;cursor:pointer;position:relative;min-height:96px;padding:18px}
.upbox-file input[type=file]{position:absolute;inset:0;width:100%;height:100%;
  opacity:0;cursor:pointer;font-size:0}
.upbox-file:hover,.upbox-file:focus-within{border-color:var(--blue);background:#f2f7fc}
.upbox-file:focus-within{box-shadow:0 0 0 3px rgba(31,111,235,.12)}
.upbox-hint{font-size:13px;color:var(--gray);line-height:1.7;text-align:center}
.upbox-file:hover .upbox-hint{color:var(--blue)}
.upbox-files{font-size:12.5px;color:var(--gray);line-height:1.7;margin-top:8px;
  word-break:break-all;min-height:0}
.upbox-files:empty{display:none}
/* 附件类型徽标：让用户知道这份文件在后台会被归到哪一类 */
.upbox-file::after{content:attr(data-doc-label);position:absolute;top:8px;right:10px;
  font-size:11px;color:var(--gray);background:#eef2f7;border-radius:4px;padding:2px 7px}
@media (max-width:900px){
  .upbox-file{min-height:80px;padding:14px}
  .upbox-hint{font-size:12.5px}
}

/* =====================================================================
   图片统一规范 img-kit（2026-10-06）
   ---------------------------------------------------------------------
   目标：全站图片「同一套视觉语言 + 同一套加载体验」，消除以下粗糙现象：
     ① 纯色块 / emoji / 文字首字母代替真实图片
     ② 拉伸变形、模糊、裁切失控
     ③ 加载瞬间白屏跳动（CLS）
     ④ 加载失败后出现的破图或空洞
   组成：
     1. 容器规范   —— 圆角 / 阴影 / 边框 / 间距 / 背景
     2. 裁切规范   —— object-fit + object-position + aspect-ratio 容器
     3. 加载体验   —— 骨架屏 shimmer → 渐显 → 失败降级（换真实同品类图）
     4. 交互细节   —— 悬停缩放 + 放大角标 + 点击灯箱（画廊可左右切换）
     5. 响应式     —— 窄屏比例、触控设备不做 hover 缩放、尊重 reduced-motion
   ⚠️ 必须置于文件末尾：与 .fig / .card-thumb / .part-card 等主规则同特异性，
      靠「后出现者胜出」生效。
   ===================================================================== */
:root{
  --ik-bg:#eaeff7;          /* 骨架屏底色，与 --blue-l 同族，避免灰色占位感 */
  --ik-bg-hi:#f5f9fd;       /* 骨架屏高光 */
  --ik-radius:var(--r-lg);
  --ik-shadow:var(--sh-sm);
  --ik-line:var(--line);
  --ik-zoom-bg:rgba(13,71,161,.86);
}

/* ---------- 1. 容器规范：圆角 / 阴影 / 边框 ---------- */
.fig,.card-thumb,.news-thumb,.photo-band,.hero-fig,.part-card .ph,.gallery .fig{
  border-radius:var(--ik-radius);
  box-shadow:var(--ik-shadow);
  border:1px solid var(--ik-line);
  background:#fff;
}
.part-card .ph{background:var(--ik-bg)}
.card-thumb,.news-thumb{background:var(--ik-bg)}
.photo-band{border-color:rgba(13,71,161,.25);box-shadow:0 10px 28px rgba(21,101,192,.16)}
/* 图片承载层统一底色 —— 未加载时显示骨架，不出现灰洞 */
.fig picture,.card-thumb picture,.news-thumb picture,.photo-band picture,
.hero-fig picture,.part-card .ph,.gallery .fig picture{
  position:relative;overflow:hidden;background:var(--ik-bg);
}
/* 图注统一排版（间距 / 字号 / 左侧蓝条已在主规则，这里补齐行高与留白） */
.fig figcaption{padding:10px 14px 12px}

/* ---------- 2. 裁切规范：不变形、不模糊 ---------- */
.fig img,.card-thumb img,.news-thumb img,.photo-band img,.hero-fig img,
.part-card .ph img,.gallery .fig img{
  object-fit:cover;
  object-position:center;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform:translateZ(0);      /* 开启合成层，缩放时不糊 */
  image-rendering:auto;
}
/* 透明底的官方 logo / 中性标识不能裁切，只能等比包含 */
.avatar.av-logo img,.avatar.av-mark img,.detail-logo img,.brand-logo,
.logo img,.footer .flogo img{
  object-fit:contain;object-position:center;
}
/* 遮罩：内容图底部渐隐，压住明暗反差大的照片边缘，让图注更清晰 */
.fig picture::before,.gallery .fig picture::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:38%;
  background:linear-gradient(to top,rgba(9,26,48,.30),rgba(9,26,48,0));
  opacity:0;transition:opacity .35s ease;pointer-events:none;z-index:1;
}
.fig:hover picture::before,.gallery .fig:hover picture::before{opacity:1}

/* ---------- 3. 加载体验：骨架屏 → 渐显 ---------- */
img[data-ik]{
  background-color:var(--ik-bg);
  background-image:linear-gradient(100deg,var(--ik-bg) 18%,var(--ik-bg-hi) 38%,var(--ik-bg) 58%);
  background-size:220% 100%;background-repeat:no-repeat;
  animation:ik-shimmer 1.6s linear infinite;
}
img[data-ik].ik-in{
  animation:ik-fade .55s cubic-bezier(.2,.7,.3,1) both;
  background-image:none;background-color:transparent;
}
@keyframes ik-shimmer{
  from{background-position:120% 0}
  to{background-position:-120% 0}
}
@keyframes ik-fade{
  from{opacity:.28;filter:blur(3px)}
  to{opacity:1;filter:blur(0)}
}
/* 失败后换图仍失败：安静隐藏，不留破图图标与灰洞 */
img.ik-hidden{opacity:0;visibility:hidden}

/* ---------- 4. 交互：悬停缩放 + 放大角标 + 灯箱 ---------- */
.ik-zoom{position:relative;display:block;cursor:zoom-in}
.ik-zoom::after{
  content:"";position:absolute;right:12px;bottom:12px;width:34px;height:34px;
  border-radius:50%;border:1px solid rgba(255,255,255,.35);
  background-color:var(--ik-zoom-bg);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M16.5 16.5L21 21'/%3E%3Cpath d='M11 8.5v5M8.5 11h5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:18px 18px;
  box-shadow:0 4px 14px rgba(9,26,48,.35);
  opacity:0;transform:translateY(8px) scale(.86);
  transition:opacity .28s ease,transform .28s cubic-bezier(.2,.7,.3,1);
  pointer-events:none;z-index:2;
}
.ik-zoom:hover::after,.ik-zoom:focus-within::after{opacity:1;transform:none}

/* 灯箱（覆盖层） */
.ik-lb{
  position:fixed;inset:0;z-index:9998;display:none;
  align-items:center;justify-content:center;flex-direction:column;
  padding:26px 20px;background:rgba(8,17,30,.92);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  opacity:0;transition:opacity .26s ease;
}
.ik-lb.is-on{display:flex;opacity:1}
.ik-lb .ik-stage{
  position:relative;display:flex;align-items:center;justify-content:center;
  width:100%;max-width:1180px;
}
.ik-lb img{
  max-width:100%;max-height:80vh;width:auto;height:auto;
  object-fit:contain;border-radius:var(--r-lg);
  box-shadow:0 26px 64px rgba(0,0,0,.55);
  background:#0d1626;
  animation:ik-pop .32s cubic-bezier(.2,.7,.3,1) both;
}
@keyframes ik-pop{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
.ik-lb .ik-cap{
  margin-top:16px;max-width:920px;text-align:center;
  color:#dbe6f4;font-size:13.5px;line-height:1.75;
}
.ik-lb .ik-cap b{color:#fff;font-weight:600}
.ik-lb .ik-src{margin-top:6px;color:#93a6c0;font-size:12px}
.ik-lb .ik-close,.ik-lb .ik-nav{
  position:absolute;display:flex;align-items:center;justify-content:center;
  border-radius:50%;cursor:pointer;color:#fff;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.30);
  transition:background .2s,transform .2s;
}
.ik-lb .ik-close{top:20px;right:22px;width:44px;height:44px;font-size:24px;line-height:1}
.ik-lb .ik-nav{top:50%;width:48px;height:48px;margin-top:-24px;font-size:22px}
.ik-lb .ik-prev{left:16px}
.ik-lb .ik-next{right:16px}
.ik-lb .ik-close:hover,.ik-lb .ik-nav:hover{background:rgba(255,255,255,.24);transform:scale(1.06)}
.ik-lb .ik-count{
  position:absolute;left:22px;top:24px;color:#c3d3e6;font-size:13px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);
  border-radius:var(--r-pill);padding:5px 14px;
}
.ik-lb .ik-nav[hidden]{display:none}

/* ---------- 5. 响应式与可访问性 ---------- */
@media (max-width:900px){
  .fig,.card-thumb,.news-thumb,.photo-band,.hero-fig,.part-card .ph,.gallery .fig{
    border-radius:var(--r-md)
  }
  .ik-lb{padding:16px 12px}
  .ik-lb img{max-height:70vh}
  .ik-lb .ik-nav{width:40px;height:40px;margin-top:-20px;font-size:19px}
  .ik-lb .ik-prev{left:6px}
  .ik-lb .ik-next{right:6px}
  .ik-lb .ik-close{top:12px;right:12px;width:38px;height:38px;font-size:20px}
  .ik-zoom::after{width:30px;height:30px;right:8px;bottom:8px;background-size:16px 16px}
}
/* 触屏设备不做悬停缩放（无 hover 态，避免"粘住"的放大效果） */
@media (hover:none){
  .fig:hover img,.card:hover .card-thumb img,a:hover .news-thumb img,
  .photo-band:hover img,.part-card:hover .ph img{transform:none}
  .fig:hover picture::before{opacity:0}
}
/* 尊重系统减弱动效设置 */
@media (prefers-reduced-motion:reduce){
  img[data-ik],img[data-ik].ik-in{animation:none;transition:none}
  .fig img,.card-thumb img,.news-thumb img,.photo-band img,.part-card .ph img{transition:none}
  .ik-lb img{animation:none}
  .ik-zoom::after{transition:none}
}

/* 身份卡头像：用真实场景照替代单字色块（客/商/配/工）。
   50x50 方盒内等比裁切，保留统一圆角与描边，不出现拉伸变形。 */
.avatar.av-photo{overflow:hidden;padding:0;background:var(--ik-bg);
  border:1px solid var(--ik-line)}
.avatar.av-photo picture{display:block;width:100%;height:100%}
.avatar.av-photo img{width:100%;height:100%;object-fit:cover;object-position:center;
  border-radius:9px;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.card:hover .avatar.av-photo img{transform:scale(1.08)}

/* ---------------------------------------------------------------------
   小尺寸实拍图：禁止放大（2026-10-07）
   容器最宽出现在 601~760px 视口（单栏约 728px），桌面两栏仅 327px。
   自然宽 <450 的图在宽容器里被 cover 拉伸会发糊；改用 scale-down ——
   永不放大（保持原始像素清晰度）、不裁切仪器主体、居中呈现，
   四周留出与图片承载层同色的衬底，读起来是"照片衬纸"而非灰色占位。
   特异性 (0,2,0) 高于 .fig img (0,1,1)，故无需 !important。
   --------------------------------------------------------------------- */
.fig .ik-noscale,.card-thumb .ik-noscale,.news-thumb .ik-noscale,
.part-card .ph .ik-noscale,.photo-band .ik-noscale,.hero-fig .ik-noscale,
.gallery .fig .ik-noscale{
  object-fit:scale-down;
  padding:12px;
}
@media (max-width:760px){
  .fig .ik-noscale,.gallery .fig .ik-noscale{padding:8px}
}
