/* clients-refine.css — 客户名单页版式整理 (2026-10-23). Remove the <link id="qm-clients-refine-css"> to revert. */
html body #page #content #main #clients-page{--cr-line:#E8E8E9}

/* ---------- Hero: larger, calmer title ---------- */
html body #page #content #main #clients-page .cl-hero h1{font-size:clamp(40px,5vw,72px)!important;line-height:1.12!important;font-weight:500!important;letter-spacing:-.01em}
html body #page #content #main #clients-page .cl-hero .cl-intro{font-size:clamp(16px,1.3vw,19px)!important;margin-top:16px!important;opacity:.9}

/* ---------- Featured: rounded media, readable captions ---------- */
html body #page #content #main #clients-page .cl-feature-grid{gap:24px!important}
html body #page #content #main #clients-page .cl-feature-media,html body #page #content #main #clients-page .cl-feature{border-radius:12px;overflow:hidden}

/* ---------- Directory: compact cards instead of a sparse 13,000px list ---------- */
html body #page #content #main #clients-page .cl-list{padding:8px 0 64px!important}
html body #page #content #main #clients-page .cl-group{grid-template-columns:72px minmax(0,1fr)!important;padding:32px 0!important;gap:24px!important;border-bottom:1px solid var(--cr-line)!important}
html body #page #content #main #clients-page .cl-group h2{font-size:40px!important;font-weight:500!important;line-height:1!important;color:#171a20!important;padding-top:10px}
html body #page #content #main #clients-page .cl-group ul{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:8px!important}
html body #page #content #main #clients-page .cl-group li{position:relative;padding:12px 14px 14px!important;border-radius:8px;background:#F7F7F7;transition:background .2s;min-height:72px;box-sizing:border-box}
html body #page #content #main #clients-page .cl-group li:hover{background:#EEEEEF}
html body #page #content #main #clients-page .cl-client-link,html body #page #content #main #clients-page .cl-client-projects summary{min-height:0!important;padding:0!important;font-size:15px!important;font-weight:500!important;line-height:1.4!important;gap:8px}
html body #page #content #main #clients-page .cl-client-link > span:last-child{font-weight:400;color:#8E8E93!important}
html body #page #content #main #clients-page .cl-project-count{font-size:12px!important;font-weight:400;padding-top:1px!important;white-space:nowrap}
html body #page #content #main #clients-page .cl-client-industries{margin-top:6px!important;line-height:1.5}
html body #page #content #main #clients-page .cl-client-industries a{font-size:12px!important;color:#6E6E73!important}
html body #page #content #main #clients-page .cl-project-links{margin:8px 0 2px!important}

@media(max-width:1280px){html body #page #content #main #clients-page .cl-group ul{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:1100px){html body #page #content #main #clients-page .cl-group ul{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:760px){
  html body #page #content #main #clients-page .cl-group{grid-template-columns:1fr!important;gap:12px!important;padding:24px 0!important}
  html body #page #content #main #clients-page .cl-group h2{font-size:28px!important;position:static!important;padding-top:0}
  html body #page #content #main #clients-page .cl-group ul{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  html body #page #content #main #clients-page .cl-group li{padding:10px 12px 12px!important;min-height:64px}
  html body #page #content #main #clients-page .cl-client-link,html body #page #content #main #clients-page .cl-client-projects summary{font-size:14px!important}
}
