.services-shell { max-width:1240px; margin:0 auto; padding:0 34px; }.services-header { border-bottom:1px solid #e7e7e7; }.services-header nav a.active { color:#242e3d; }.services-home-link { padding:15px 25px; color:#fff; border-radius:999px; background:#1a222e; box-shadow:0 10px 24px rgba(26, 34, 46, 0.16); }.services-main { padding:78px 0 100px; }.services-heading { max-width:690px; margin:0 0 42px; }.services-heading h1 { margin:0; white-space:pre-line; font-size:clamp(44px,6vw,70px); line-height:1.08; letter-spacing:-.06em; }.services-heading > p:not(.eyebrow) { margin:22px 0 0; color:var(--muted); font-size:17px; line-height:1.8; }.services-directory { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.directory-card { display:flex; min-height:286px; flex-direction:column; padding:28px; border:1px solid var(--line); border-radius:24px; background:#fff; box-shadow:0 16px 36px rgba(26, 34, 46, 0.06); transition:transform .2s, box-shadow .2s; }.directory-card:hover { transform:translateY(-5px); box-shadow:0 24px 46px rgba(26, 34, 46, 0.12); }.directory-card-icon { display:grid; width:66px; height:66px; place-items:center; margin-bottom:25px; border-radius:20px; color:#1a222e; background:#e9edff; font-size:32px; }.directory-card-icon svg { width:40px; height:40px; }.directory-card:nth-child(3n + 2) .directory-card-icon { color:#f07854; background:#ffe6ed; }.directory-card:nth-child(3n + 3) .directory-card-icon { color:#d09b31; background:#fff0cf; }.directory-card h2 { margin:0; font-size:23px; }.directory-card p { min-height:51px; margin:13px 0 24px; color:var(--muted); font-size:14px; line-height:1.8; }.directory-card .text-link { margin-top:auto; color:var(--lavender); font-size:14px; font-weight:800; }.services-footer-link { color:var(--lavender); font-weight:800; }
@media (max-width:920px) { .services-directory { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px) { .services-shell { padding:0 18px; }.services-home-link { padding:11px 15px; font-size:12px; }.services-main { padding:52px 0 70px; }.services-heading h1 { font-size:45px; }.services-heading > p:not(.eyebrow) { font-size:15px; }.services-directory { grid-template-columns:1fr; }.directory-card { min-height:250px; padding:24px; } }
 .directory-card-icon img { width:44px; height:44px; object-fit:contain; border-radius:10px; }

@media (max-width: 620px) {
    .services-shell { padding-right: 12px; padding-left: 12px; }
    .services-main { padding: 30px 0 44px; }
    .services-heading { margin-bottom: 24px; }
    .services-heading h1 { font-size: 34px; line-height: 1.1; }
    .services-heading > p:not(.eyebrow) { margin-top: 12px; font-size: 13px; line-height: 1.55; }
    .services-directory { gap: 10px; }
    .directory-card { min-height: 180px; padding: 16px; border-radius: 17px; }
    .directory-card-icon { width: 46px; height: 46px; margin-bottom: 14px; border-radius: 14px; font-size: 23px; }
    .directory-card-icon svg { width: 28px; height: 28px; }
    .directory-card-icon img { width: 32px; height: 32px; }
    .directory-card h2 { font-size: 18px; }
    .directory-card p { min-height: 36px; margin: 8px 0 12px; font-size: 12px; line-height: 1.55; }
    .directory-card .text-link { font-size: 12px; }
}

/* Desktop service density v1: fit five compact service cards without changing
   the mobile composition below. */
@media (min-width: 1181px) {
    .services-directory { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
    .directory-card { min-height: 218px; padding: 18px; border-radius: 18px; }
    .directory-card-icon { width: 50px; height: 50px; margin-bottom: 16px; border-radius: 15px; font-size: 25px; }
    .directory-card-icon svg { width: 30px; height: 30px; }
    .directory-card-icon img { width: 34px; height: 34px; border-radius: 8px; }
    .directory-card h2 { font-size: 19px; }
    .directory-card p { min-height: 42px; margin: 9px 0 15px; font-size: 12px; line-height: 1.6; }
    .directory-card .text-link { font-size: 12px; }
}

/* Two-column service collection for phones. The card keeps its hierarchy but
   avoids wasting a full screen on one service. */
@media (max-width: 620px) {
    .services-shell { padding-right: 12px; padding-left: 12px; }
    .services-main { padding: 28px 0 46px; }
    .services-heading { margin-bottom: 20px; }
    .services-heading h1 { font-size: 31px; line-height: 1.12; letter-spacing: -.045em; }
    .services-heading > p:not(.eyebrow) { margin-top: 9px; font-size: 12px; line-height: 1.55; }
    .services-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .directory-card { min-height: 154px; padding: 13px; border-radius: 16px; box-shadow: 0 9px 20px rgba(26, 34, 46, 0.055); }
    .directory-card-icon { width: 38px; height: 38px; margin-bottom: 10px; border-radius: 11px; font-size: 20px; }
    .directory-card-icon svg { width: 24px; height: 24px; }
    .directory-card-icon img { width: 28px; height: 28px; border-radius: 7px; }
    .directory-card h2 { overflow: hidden; font-size: 16px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
    .directory-card p { display: -webkit-box; min-height: 30px; margin: 6px 0 0; font-size: 10px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
}

/* ===== 墨色主题统一（2026-10-11） ===== */
.eyebrow { color: #8a8a8a !important; letter-spacing: .24em; }
a { }

/* 服务列表：与首页一致的 6 格小瓦片（logo + 名字） */
#services-list { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 761px) { #services-list { width: min(1060px, calc(100vw - 80px)); position: relative; left: 50%; transform: translateX(-50%); } }
.directory-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 0 !important; padding: 18px 12px 16px !important; border-radius: 16px !important; text-align: center; background: #fff; border: 1px solid #ebebeb; transition: transform .2s, box-shadow .2s, border-color .2s; }
.directory-card:hover { transform: translateY(-3px); border-color: #cad4f3; box-shadow: 0 14px 30px rgba(57, 72, 118, .12); }
.directory-card-icon { display: none !important; }
.directory-card-logo { width: 32px; height: 32px; object-fit: contain; }
.directory-card h2 { margin: 0 !important; font-size: 15px !important; text-align: center; }
.directory-card > p { display: none; }
@media (max-width: 1080px) { #services-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 620px) { #services-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }