/* 用途：三个开发服务详情的专属内容版式；公共阅读与控件由readable-ui.css维护。 */
.service-page h1 { max-width: 20em; font-size: clamp(42px, 4.4vw, 60px); line-height: 1.45; letter-spacing: -.02em; }
.service-page h2 { font-size: clamp(34px, 3vw, 42px); line-height: 1.45; letter-spacing: 0; }
.service-page h3 { font-size: 28px; line-height: 1.6; letter-spacing: 0; }

/* 页面开场留出完整句子的阅读宽度，说明适合的场景后再进入范围与交付。 */
.service-page .detail-hero { padding-block: 24px var(--ui-section-space); }
.service-page .detail-hero .eyebrow { margin-block: 28px 18px; }
.service-page .detail-lead { max-width: 38em; margin-top: 28px; color: var(--fg-2); }
.service-page .detail-fit { max-width: 38em; margin-top: 20px; padding-left: 22px; border-left: 4px solid var(--border); color: var(--fg-2); }
.service-page .btn { margin-top: 28px; }

.service-page .detail-services { background: var(--surface); }
.service-page .detail-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 7%; }
.service-page .detail-grid > *, .service-page .contact-layout > * { min-width: 0; }
.service-page .detail-section-heading .eyebrow { margin-bottom: 18px; }
.service-page .detail-copy { min-width: 0; }
.service-page .detail-copy > p, .service-page .detail-list p, .service-page .detail-maintenance p { color: var(--fg-2); }
.service-page .detail-list { list-style: none; margin: 0; padding: 0; }
.service-page .detail-list li { border-top: 1px solid var(--border); padding-block: 24px; }
.service-page .detail-list li:first-child { border-top: 2px solid var(--fg); padding-top: 22px; }
.service-page .detail-list p { margin-top: 10px; }
.service-page .detail-process { margin-top: 48px; }
.service-page .detail-process h2 { margin-block: 14px 26px; }
.service-page .detail-maintenance { padding-top: 28px; border-top: 1px solid var(--border); }
.service-page .detail-maintenance p { margin-top: 12px; }

/* 项目资料只作为真实业务例子或演示，相关服务用原生链接形成清楚的后续入口。 */
.service-page .text-link { display: flex; width: fit-content; margin-top: 22px; }
.service-page .detail-note { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }

.service-page .detail-related { margin-top: 60px; padding-top: 32px; border-top: 2px solid var(--fg); }
.service-page .detail-related h2 { margin-bottom: 18px; }
.service-page .detail-related a { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; border-bottom: 1px solid var(--border); }
.service-page .detail-related a:hover { text-decoration: underline; }
.service-page .detail-related a span { flex: 0 0 auto; }

/* 保留本页联系导语的行宽与上间距。 */

.service-page .contact-description { max-width: 32em; margin-top: 24px; }

/* 中屏提前单列，正文仍保持大字，避免长句挤入窄栏。 */
@media (max-width: 1100px) {
.service-page .detail-grid { grid-template-columns: 1fr; gap: 32px; }
.service-page .detail-section-heading { max-width: 34em; }
.service-page .detail-copy { max-width: 38em; }
}

/* 手机正文22px、辅助文字20px，导航和相关服务自然换行而不裁切。 */
@media (max-width: 639px) {
.service-page h1, .service-page h2, .service-page .contact h2 { font-size: 34px; line-height: 1.5; }
.service-page h3 { font-size: 26px; }
.service-page .detail-hero { padding-block: 18px var(--ui-section-space); }
.service-page .detail-hero .eyebrow { margin-top: 22px; }
.service-page .detail-fit { padding-left: 16px; }

.service-page .detail-process { margin-top: 32px; }
.service-page .detail-related { margin-top: 36px; }

}