/*
 * 服务页 / 行业页 / 地区页 / 指南的公共样式（页面由 07_服务页/build.py 生成）
 * 视觉沿用案例页：细体大标题、字距拉开的小标签、1px 细线分区
 */
.lgx-svc {
	--s-white: #fafaf9;
	--s-g0: #f3f2f0;
	--s-g1: #e8e6e2;
	--s-g2: #b8b5b0;
	--s-g3: #787570;
	--s-ink: #1c1b19;
	--s-ease: cubic-bezier(.16, 1, .3, 1);
	background: var(--s-white);
	color: var(--s-ink);
	font-family: "Noto Sans SC", sans-serif;
	font-weight: 300;
	-webkit-font-smoothing: antialiased;
}
.lgx-svc *, .lgx-svc *::before, .lgx-svc *::after { box-sizing: border-box; }
.lgx-svc h1, .lgx-svc h2, .lgx-svc h3, .lgx-svc p, .lgx-svc ul, .lgx-svc ol, .lgx-svc dl, .lgx-svc dd, .lgx-svc figure { margin: 0; }
.lgx-svc ul, .lgx-svc ol { padding: 0; list-style: none; }
.lgx-svc a { color: inherit; }
.lgx-svc img { display: block; max-width: 100%; height: auto; }

.lgx-svc .s-in { max-width: 1440px; margin: 0 auto; padding: 0 50px; }
.lgx-svc .s-sec { border-bottom: 1px solid var(--s-g1); }
.lgx-svc .s-pad { padding-top: 96px; padding-bottom: 96px; }

/* 小标签 */
.lgx-svc .s-label {
	display: flex; align-items: center; gap: 12px;
	font-size: 10px; letter-spacing: .44em; text-transform: uppercase;
	color: var(--s-g3); margin-bottom: 28px;
}
.lgx-svc .s-label::before { content: ""; width: 14px; height: 1px; background: var(--s-g2); }

.lgx-svc .s-h2 {
	font-size: clamp(28px, 3.2vw, 46px); font-weight: 300;
	line-height: 1.2; letter-spacing: -.01em;
}
.lgx-svc .s-lead { font-size: 15px; line-height: 1.9; color: var(--s-g3); max-width: 640px; }
.lgx-svc .s-body p { font-size: 15px; line-height: 1.95; color: #4a4844; }
.lgx-svc .s-body p + p { margin-top: 1.1em; }
.lgx-svc .s-body a, .lgx-svc .s-faq a, .lgx-svc .s-lead a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--s-g2); }
.lgx-svc .s-body a:hover, .lgx-svc .s-faq a:hover { text-decoration-color: currentColor; }

/* 面包屑 */
.lgx-svc .s-crumbs { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 120px; font-size: 11px; letter-spacing: .08em; color: var(--s-g2); }
.lgx-svc .s-crumbs a { text-decoration: none; color: var(--s-g3); }
.lgx-svc .s-crumbs a:hover { color: var(--s-ink); }
.lgx-svc .s-crumbs span[aria-hidden] { color: var(--s-g1); }

/* 头部 */
.lgx-svc .s-hero { display: grid; grid-template-columns: 1.15fr 1px 1fr; gap: 0; padding-top: 40px; }
.lgx-svc .s-hero__l { padding: 0 80px 72px 0; display: flex; flex-direction: column; gap: 28px; }
.lgx-svc .s-hero__line { background: var(--s-g1); margin-bottom: 72px; }
.lgx-svc .s-hero__r { padding: 8px 0 72px 80px; display: flex; flex-direction: column; justify-content: flex-end; gap: 40px; }
.lgx-svc .s-h1 { font-size: clamp(38px, 5.2vw, 80px); font-weight: 300; line-height: 1.1; letter-spacing: -.02em; }
.lgx-svc .s-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 24px; }
.lgx-svc .s-facts dt { font-size: 9px; letter-spacing: .4em; text-transform: uppercase; color: var(--s-g3); margin-bottom: 8px; }
.lgx-svc .s-facts dd { font-size: 13px; line-height: 1.7; }

/* 按钮 */
.lgx-svc .s-btns { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.lgx-svc .s-btn {
	display: inline-flex; align-items: center; gap: 14px;
	padding: 16px 28px; border-radius: 100px;
	background: var(--s-ink); color: var(--s-white) !important;
	font-size: 11px; letter-spacing: .26em; text-transform: uppercase; text-decoration: none;
	transition: gap .35s var(--s-ease), background .3s;
}
.lgx-svc .s-btn:hover { gap: 20px; background: #000; }
.lgx-svc .s-btn--ghost { background: transparent; color: var(--s-ink) !important; border: 1px solid var(--s-g1); }
.lgx-svc .s-btn--ghost:hover { background: transparent; border-color: var(--s-ink); }

/* 通栏大图 */
.lgx-svc .s-cover { aspect-ratio: 16 / 7; background: var(--s-g0); overflow: hidden; }
.lgx-svc .s-cover img { width: 100%; height: 100%; object-fit: cover; }

/* 左标题 + 右正文 */
.lgx-svc .s-split { display: grid; grid-template-columns: 1fr 1.25fr; gap: 80px; }

/* 编号网格（服务内容 / 灵感清单） */
.lgx-svc .s-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--s-g1); margin-top: 56px; }
.lgx-svc .s-grid--2 { grid-template-columns: repeat(2, 1fr); }
.lgx-svc .s-grid > li { padding: 40px 40px 44px 0; border-bottom: 1px solid var(--s-g1); }
.lgx-svc .s-grid > li + li { padding-left: 40px; border-left: 1px solid var(--s-g1); }
.lgx-svc .s-grid:not(.s-grid--2) > li:nth-child(3n+1) { padding-left: 0; border-left: 0; }
.lgx-svc .s-grid--2 > li:nth-child(2n+1) { padding-left: 0; border-left: 0; }
.lgx-svc .s-num { display: block; font-size: 11px; letter-spacing: .3em; color: var(--s-g2); margin-bottom: 20px; }
.lgx-svc .s-grid h3 { font-size: 19px; font-weight: 400; line-height: 1.45; margin-bottom: 14px; }
.lgx-svc .s-grid p { font-size: 14px; line-height: 1.9; color: var(--s-g3); }

/* 流程 */
.lgx-svc .s-steps { margin-top: 56px; border-top: 1px solid var(--s-g1); }
.lgx-svc .s-steps > li { display: grid; grid-template-columns: 120px 1fr 1.4fr; gap: 40px; padding: 36px 0; border-bottom: 1px solid var(--s-g1); align-items: baseline; }
.lgx-svc .s-steps h3 { font-size: 19px; font-weight: 400; }
.lgx-svc .s-steps p { font-size: 14px; line-height: 1.9; color: var(--s-g3); }

/* 案例卡片 */
.lgx-svc .s-cases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 56px; }
.lgx-svc .s-case { text-decoration: none; display: flex; flex-direction: column; gap: 18px; }
.lgx-svc .s-case figure { aspect-ratio: 4 / 3; overflow: hidden; background: var(--s-g0); }
.lgx-svc .s-case img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--s-ease); }
.lgx-svc .s-case:hover img { transform: scale(1.04); }
.lgx-svc .s-case__tag { font-size: 9px; letter-spacing: .3em; text-transform: uppercase; color: var(--s-g3); }
.lgx-svc .s-case h3 { font-size: 18px; font-weight: 400; line-height: 1.45; }
.lgx-svc .s-case p { font-size: 13px; line-height: 1.8; color: var(--s-g3); }

/* 清单 */
.lgx-svc .s-check > li { position: relative; padding: 22px 0 22px 36px; border-bottom: 1px solid var(--s-g1); font-size: 15px; line-height: 1.85; color: #4a4844; }
.lgx-svc .s-check > li:first-child { border-top: 1px solid var(--s-g1); }
.lgx-svc .s-check > li::before { content: ""; position: absolute; left: 4px; top: 34px; width: 14px; height: 1px; background: var(--s-ink); }
.lgx-svc .s-check strong { font-weight: 400; color: var(--s-ink); }

/* 报价 */
.lgx-svc .s-quote { background: var(--s-ink); color: var(--s-white); }
.lgx-svc .s-quote .s-label { color: var(--s-g2); }
.lgx-svc .s-quote .s-label::before { background: var(--s-g3); }
.lgx-svc .s-quote .s-lead, .lgx-svc .s-quote .s-check > li { color: #cfccc6; }
.lgx-svc .s-quote .s-check > li { border-color: #3a3835; }
.lgx-svc .s-quote .s-check > li::before { background: var(--s-white); }
.lgx-svc .s-quote .s-check strong { color: var(--s-white); }
.lgx-svc .s-quote .s-btn { background: var(--s-white); color: var(--s-ink) !important; }
.lgx-svc .s-quote .s-btn--ghost { background: transparent; color: var(--s-white) !important; border-color: #4a4844; }
.lgx-svc .s-price { font-size: clamp(30px, 3.6vw, 52px); font-weight: 300; line-height: 1.15; margin: 8px 0 24px; }

/* FAQ */
.lgx-svc .s-faq { border-top: 1px solid var(--s-g1); }
.lgx-svc .s-faq details { border-bottom: 1px solid var(--s-g1); }
.lgx-svc .s-faq summary {
	list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px;
	padding: 26px 0; font-size: 17px; font-weight: 400; line-height: 1.5;
}
.lgx-svc .s-faq summary::-webkit-details-marker { display: none; }
.lgx-svc .s-faq summary::after { content: "+"; font-size: 22px; font-weight: 200; line-height: 1; color: var(--s-g3); transition: transform .4s var(--s-ease); }
.lgx-svc .s-faq details[open] summary::after { transform: rotate(45deg); }
.lgx-svc .s-faq details > div { padding: 0 64px 28px 0; font-size: 15px; line-height: 1.95; color: #4a4844; }
.lgx-svc .s-faq details > div p + p { margin-top: .9em; }

/* 相关页面 */
.lgx-svc .s-related { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--s-g1); margin-top: 48px; }
.lgx-svc .s-related a { display: flex; flex-direction: column; gap: 10px; padding: 28px 28px 32px 0; text-decoration: none; border-bottom: 1px solid var(--s-g1); }
.lgx-svc .s-related a + a { padding-left: 28px; border-left: 1px solid var(--s-g1); }
.lgx-svc .s-related a:nth-child(4n+1) { padding-left: 0; border-left: 0; }
.lgx-svc .s-related span { font-size: 9px; letter-spacing: .3em; text-transform: uppercase; color: var(--s-g3); }
.lgx-svc .s-related strong { font-size: 16px; font-weight: 400; line-height: 1.5; }
.lgx-svc .s-related a:hover strong { text-decoration: underline; text-underline-offset: 4px; }

/* 指南正文 */
.lgx-svc .s-article { max-width: 760px; }
.lgx-svc .s-article h2 { font-size: clamp(24px, 2.4vw, 32px); font-weight: 300; line-height: 1.3; margin: 64px 0 20px; }
.lgx-svc .s-article h2:first-child { margin-top: 0; }
.lgx-svc .s-article figure { margin: 36px 0; }
.lgx-svc .s-article figure img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: var(--s-g0); }
.lgx-svc .s-article figcaption { font-size: 12px; color: var(--s-g3); margin-top: 10px; letter-spacing: .04em; }
.lgx-svc .s-toc { counter-reset: toc; border-top: 1px solid var(--s-g1); }
.lgx-svc .s-toc li { counter-increment: toc; border-bottom: 1px solid var(--s-g1); }
.lgx-svc .s-toc a { display: flex; gap: 20px; padding: 14px 0; font-size: 14px; text-decoration: none; color: #4a4844; }
.lgx-svc .s-toc a::before { content: counter(toc, decimal-leading-zero); font-size: 11px; letter-spacing: .2em; color: var(--s-g2); padding-top: 3px; }
.lgx-svc .s-toc a:hover { color: var(--s-ink); }
.lgx-svc .s-guide { display: grid; grid-template-columns: 260px 1fr; gap: 80px; align-items: start; }
.lgx-svc .s-guide aside { position: sticky; top: 110px; }

@media (max-width: 1024px) {
	.lgx-svc .s-hero { grid-template-columns: 1fr; }
	.lgx-svc .s-hero__line { display: none; }
	.lgx-svc .s-hero__l { padding: 0 0 40px; }
	.lgx-svc .s-hero__r { padding: 0 0 64px; }
	.lgx-svc .s-split, .lgx-svc .s-guide { grid-template-columns: 1fr; gap: 40px; }
	.lgx-svc .s-guide aside { position: static; }
	.lgx-svc .s-cases { grid-template-columns: repeat(2, 1fr); }
	.lgx-svc .s-related { grid-template-columns: repeat(2, 1fr); }
	.lgx-svc .s-related a:nth-child(n) { padding-left: 28px; border-left: 1px solid var(--s-g1); }
	.lgx-svc .s-related a:nth-child(2n+1) { padding-left: 0; border-left: 0; }
	.lgx-svc .s-grid:not(.s-grid--2) { grid-template-columns: repeat(2, 1fr); }
	.lgx-svc .s-grid:not(.s-grid--2) > li:nth-child(n) { padding-left: 40px; border-left: 1px solid var(--s-g1); }
	.lgx-svc .s-grid:not(.s-grid--2) > li:nth-child(2n+1) { padding-left: 0; border-left: 0; }
	.lgx-svc .s-steps > li { grid-template-columns: 64px 1fr; }
	.lgx-svc .s-steps > li p { grid-column: 2; }
}
@media (max-width: 768px) {
	.lgx-svc .s-in { padding: 0 20px; }
	.lgx-svc .s-pad { padding-top: 64px; padding-bottom: 64px; }
	.lgx-svc .s-crumbs { padding-top: 96px; }
	.lgx-svc .s-cover { aspect-ratio: 4 / 3; }
	.lgx-svc .s-facts { grid-template-columns: 1fr 1fr; }
	.lgx-svc .s-grid, .lgx-svc .s-grid--2, .lgx-svc .s-grid:not(.s-grid--2) { grid-template-columns: 1fr; margin-top: 36px; }
	.lgx-svc .s-grid > li:nth-child(n), .lgx-svc .s-grid:not(.s-grid--2) > li:nth-child(n) { padding: 32px 0; border-left: 0; }
	.lgx-svc .s-cases { grid-template-columns: 1fr; gap: 40px; margin-top: 36px; }
	.lgx-svc .s-related { grid-template-columns: 1fr; }
	.lgx-svc .s-related a:nth-child(n) { padding: 22px 0; border-left: 0; }
	.lgx-svc .s-steps > li { grid-template-columns: 1fr; gap: 10px; padding: 28px 0; }
	.lgx-svc .s-steps > li p { grid-column: auto; }
	.lgx-svc .s-faq summary { font-size: 16px; }
	.lgx-svc .s-faq details > div { padding-right: 0; }
	.lgx-svc .s-btn { padding: 15px 24px; }
}
