/* ============================================================
   香港六家公司网站 · 公共样式
   设计稿的配色/排版都写在各页面的行内 style 里（跟设计稿一致），
   这里只放三件事：中文字体、手机适配、设计稿里没有的交互件。
   ============================================================ */

:root {
  /* 中文字体：优先用站点自带的 Noto TC，没加载出来就退回系统繁体字 */
  --cjk: "Noto Sans TC", "PingFang HK", "PingFang TC", "Microsoft JhengHei",
         "Noto Sans CJK TC", "Hiragino Sans CNS", "PingFang SC",
         "Microsoft YaHei", sans-serif;
  --cjk-serif: "Noto Serif TC", "PingFang HK", "PingFang TC", "Songti TC",
               "Microsoft JhengHei", "Noto Serif CJK TC", serif;

  --gut: 40px;  /* 左右留白 */
  --vs: 1;      /* 上下留白倍数 */
  --fs: 1;      /* 大字号倍数 */
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; overflow-x: hidden; }
img { max-width: 100%; }

/* 不跳转的装饰性链接（设计稿里 href="#" 的那些） */
a.dc-noop { cursor: default; }

/* ---------------------------------------------- 图片位 */
.dc-slot {
  display: block; position: relative; width: 100%; height: 100%;
  aspect-ratio: 3 / 2; overflow: hidden;
  background-color: rgba(127, 127, 127, .10);
  background-image:
    linear-gradient(135deg, rgba(127,127,127,.10) 0%, rgba(127,127,127,0) 55%),
    repeating-linear-gradient(45deg,
      rgba(127,127,127,.055) 0 12px, rgba(127,127,127,0) 12px 24px);
  display: flex; align-items: center; justify-content: center; text-align: center;
}
.dc-slot > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dc-slot-on { background: none; }
.dc-slot-t {
  font-family: var(--cjk); font-size: 12.5px; line-height: 1.7; letter-spacing: .04em;
  opacity: .42; padding: 14px 18px; max-width: 26em;
}
.dc-slot.is-loaded { background-image: none; }
.dc-slot.is-loaded .dc-slot-t { display: none; }

/* 地图位：右下角版权署名 + 左下角「打开地图」 */
.dc-map { text-decoration: none; }
.dc-attr, .dc-maplink {
  position: absolute; bottom: 0; z-index: 2;
  font-family: var(--cjk); font-size: 10.5px; letter-spacing: .02em; line-height: 1;
  padding: 5px 8px; background: rgba(255, 255, 255, .82); color: #4a5058;
}
.dc-attr { right: 0; }
.dc-maplink { left: 0; font-size: 11.5px; padding: 7px 11px; color: #10151c; }
.dc-map:hover .dc-maplink { background: #10151c; color: #fff; }

/* ---------------------------------------------- 手机菜单按钮 */
.dc-menu-btn {
  display: none; align-items: center; gap: 9px;
  padding: 9px 14px; border: 1px solid currentColor; background: transparent;
  color: inherit; font: inherit; font-size: 12.5px; letter-spacing: .12em;
  text-transform: uppercase; cursor: pointer; border-radius: 2px;
}
.dc-menu-btn .bars { display: inline-flex; flex-direction: column; gap: 3px; }
.dc-menu-btn .bars i { display: block; width: 15px; height: 1.5px; background: currentColor; }

/* ---------------------------------------------- 新闻筛选 */
.dc-newscat { cursor: pointer; }
[data-dc-news].is-hidden { display: none !important; }

/* ---------------------------------------------- 询盘表单提示 */
.dc-formnote {
  margin-top: 16px; font-family: var(--cjk); font-size: 13.5px; line-height: 1.8;
  padding: 14px 16px; border-left: 2px solid currentColor; opacity: .85;
}
.dc-formnote a { text-decoration: underline; }

/* ---------------------------------------------- 平板 */
@media (max-width: 1024px) {
  :root { --gut: 30px; --vs: .82; --fs: .92; }
}

/* ---------------------------------------------- 手机 */
@media (max-width: 760px) {
  :root { --gut: 20px; --vs: .58; --fs: .78; }

  /* 顶部导航收成一个按钮 */
  .dc-menu-btn { display: inline-flex; }
  nav.dc-nav { display: none !important; }
  nav.dc-nav.is-open {
    display: flex !important; flex-direction: column; align-items: stretch;
    width: 100%; gap: 0 !important; padding-top: 8px;
  }
  nav.dc-nav.is-open > a {
    padding: 13px 2px !important; border-bottom: 1px solid rgba(127,127,127,.22) !important;
    margin-left: 0 !important; text-align: left;
  }

  /* 放不下的多列栅格塌成一列 */
  .dc-collapse { grid-template-columns: 1fr !important; }

  /* 左侧固定边栏版式（領達）：手机上摊平成普通顶栏 */
  .dc-sidepad { padding-left: 0 !important; }
  .dc-side {
    position: static !important;
    width: 100% !important;
    inset: auto !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px 14px !important;
    padding: 14px var(--gut) !important;
    border-right: none !important;
    border-bottom: 2px solid rgba(127, 127, 127, .45);
    overflow: visible !important;
  }
  .dc-side > a:first-child { flex-direction: row !important; align-items: center; gap: 12px !important; }
  /* 边栏底部那个 CTA 在手机上不占整行 */
  .dc-side > a:last-child { margin-left: auto; }

  /* 右下角悬浮按钮缩小，别挡住内容 */
  .dc-fab {
    right: 12px !important;
    bottom: 12px !important;
    padding: 12px 18px !important;
    font-size: 12px !important;
  }

  /* 公司切换条横向滑动，不折成好几行 */
  .dc-switch {
    flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .dc-switch::-webkit-scrollbar { display: none; }
  .dc-switch > * { flex: 0 0 auto; white-space: nowrap; }
}

@media (max-width: 420px) {
  :root { --gut: 16px; --fs: .72; }
}

/* 打印：去掉深色底，省墨 */
@media print {
  .dc-menu-btn, .dc-newscat { display: none !important; }
  .dc-slot { display: none !important; }
}