/* OPC 档案系统前台样式：无框架、无构建链。 */
:root {
  --bg: #f5f7fb;
  --card: #fff;
  --border: #dfe5ee;
  --text: #172033;
  --muted: #657086;
  --accent: #1769e0;
  --accent-dark: #0b3f94;
  --teal: #16a7a0;
  --danger: #b42318;
  --ok: #15803d;
  --navy: #081b3a;
  --shadow-sm: 0 8px 24px rgba(19, 45, 88, .07);
  --shadow-md: 0 18px 50px rgba(14, 43, 91, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 15px/1.65 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif; }
a { color: var(--accent); }
button, input, select, textarea { font: inherit; }

/* 登录、入驻和自助管理页的通用基础样式。 */
body:not(.home) > header { background: var(--card); border-bottom: 1px solid var(--border); padding: 14px 20px; }
body:not(.home) > header h1 { font-size: 18px; margin: 0 0 6px; }
body:not(.home) nav a { color: var(--accent); margin-right: 14px; text-decoration: none; }
body:not(.home) nav a:hover { text-decoration: underline; }
body:not(.home) main { max-width: 900px; margin: 0 auto; padding: 20px; }
body:not(.home) section { margin-bottom: 28px; }
body:not(.home) h2 { font-size: 16px; border-bottom: 1px solid var(--border); padding-bottom: 6px; }
.card { background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 14px; margin-bottom: 12px; }
.card h3 { margin: 0 0 6px; font-size: 15px; }
.muted { color: var(--muted); font-size: 13px; }
.badge { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 12px; border: 1px solid var(--border); background: var(--bg); }
.badge.approved { color: var(--ok); border-color: var(--ok); }
.badge.pending { color: var(--muted); }
.badge.rejected { color: var(--danger); border-color: var(--danger); }
label { display: block; margin: 10px 0 4px; font-size: 13px; color: var(--muted); }
input, select, textarea { width: 100%; padding: 9px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--card); color: var(--text); }
input:focus, select:focus, textarea:focus { border-color: var(--accent); outline: 3px solid rgba(23, 105, 224, .12); }
textarea { min-height: 72px; resize: vertical; }
button { margin-top: 12px; padding: 8px 16px; border: 0; border-radius: 6px; background: var(--accent); color: #fff; cursor: pointer; }
button.secondary { background: var(--muted); }
button.danger { background: var(--danger); }
button:disabled { opacity: .6; cursor: not-allowed; }
.row { display: flex; gap: 12px; flex-wrap: wrap; }
.row > * { flex: 1 1 200px; }
.status { margin-top: 10px; font-size: 13px; min-height: 20px; }
.status.error { color: var(--danger); }
.status.ok { color: var(--ok); }
.hidden { display: none !important; }
ul.plain { list-style: none; padding: 0; margin: 0; }

/* 门户首页。 */
.home { background: #fff; color: #14213a; }
.home-shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.home-main { overflow: hidden; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 200; left: 16px; top: -60px; padding: 10px 16px; color: #fff; background: var(--navy); border-radius: 8px; transition: top .2s; }
.skip-link:focus { top: 12px; }

.home-header { position: sticky; z-index: 100; top: 0; height: 76px; background: rgba(255, 255, 255, .94); border-bottom: 1px solid rgba(218, 226, 239, .9); backdrop-filter: blur(16px); }
.home-nav { width: min(1220px, calc(100% - 48px)); height: 100%; margin: 0 auto; display: flex; align-items: center; gap: 36px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: #10203c; text-decoration: none; white-space: nowrap; }
.brand > span:last-child { display: flex; flex-direction: column; line-height: 1.15; }
.brand strong { font-size: 18px; letter-spacing: .08em; }
.brand small { margin-top: 5px; color: #7a8598; font-size: 9px; letter-spacing: .12em; }
.brand-mark { position: relative; width: 39px; height: 39px; display: grid; place-items: center; overflow: hidden; border-radius: 11px; background: linear-gradient(145deg, #0e5bd5, #1c89e5); box-shadow: 0 8px 18px rgba(23, 105, 224, .25); transform: rotate(-3deg); }
.brand-mark span { position: absolute; width: 7px; border-radius: 5px; background: #fff; transform: rotate(32deg); }
.brand-mark span:nth-child(1) { height: 17px; left: 9px; bottom: 8px; opacity: .72; }
.brand-mark span:nth-child(2) { height: 25px; left: 17px; bottom: 7px; }
.brand-mark span:nth-child(3) { height: 14px; left: 25px; bottom: 11px; opacity: .88; }
.site-nav { display: flex; align-items: center; gap: 29px; margin-left: auto; }
.site-nav a { position: relative; color: #3d4a60; font-size: 14px; font-weight: 600; text-decoration: none; }
.site-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -10px; height: 2px; background: var(--accent); transition: right .2s; }
.site-nav a:hover { color: var(--accent); }
.site-nav a:hover::after { right: 0; }
.nav-actions { display: flex; align-items: center; gap: 18px; }
.nav-login { color: #334158; font-weight: 600; text-decoration: none; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 24px; border: 1px solid transparent; border-radius: 8px; background: linear-gradient(135deg, #1769e0, #0e7ce4); color: #fff; font-weight: 700; text-decoration: none; box-shadow: 0 10px 25px rgba(23, 105, 224, .2); transition: transform .2s, box-shadow .2s; }
.button:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(23, 105, 224, .28); }
.button-small { min-height: 39px; padding: 0 18px; border-radius: 7px; font-size: 13px; }
.nav-toggle { display: none; width: 42px; height: 40px; margin: 0 0 0 auto; padding: 10px; background: transparent; }
.nav-toggle span { display: block; height: 2px; margin: 4px 0; background: #23334f; border-radius: 2px; }

.hero { position: relative; min-height: 610px; padding: 78px 0 68px; overflow: hidden; background: linear-gradient(118deg, #f8fbff 0%, #edf5ff 48%, #f6fbff 100%); }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .5; background-image: linear-gradient(rgba(35, 103, 190, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(35, 103, 190, .045) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to right, #000, transparent 72%); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(2px); }
.hero-glow-one { width: 420px; height: 420px; top: -220px; right: 15%; background: radial-gradient(circle, rgba(54, 151, 255, .16), transparent 67%); }
.hero-glow-two { width: 300px; height: 300px; bottom: -170px; left: 4%; background: radial-gradient(circle, rgba(28, 188, 178, .12), transparent 70%); }
.hero-layout { position: relative; z-index: 1; display: grid; grid-template-columns: 1.12fr .88fr; gap: 70px; align-items: center; }
.hero-copy { padding-top: 2px; }
.eyebrow, .section-kicker { margin: 0 0 16px; color: #1769e0; font-size: 12px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 24px; height: 2px; background: #1769e0; }
.hero h1 { margin: 0; color: #0b1d3d; font-size: clamp(42px, 5vw, 66px); line-height: 1.16; letter-spacing: -.05em; font-weight: 800; }
.hero h1 em { color: #1769e0; font-style: normal; }
.hero-lead { max-width: 620px; margin: 25px 0 30px; color: #53627b; font-size: 17px; line-height: 1.9; }
.hero-search { position: relative; width: min(590px, 100%); height: 58px; display: flex; align-items: center; padding: 5px 5px 5px 49px; border: 1px solid #dae4f1; border-radius: 10px; background: #fff; box-shadow: 0 12px 35px rgba(18, 55, 105, .1); }
.hero-search svg, .directory-search svg { position: absolute; width: 20px; fill: none; stroke: #7c8ba2; stroke-width: 1.8; }
.hero-search svg { left: 18px; }
.hero-search input { min-width: 0; height: 46px; padding: 0 10px 0 0; border: 0; outline: 0; background: transparent; font-size: 14px; }
.hero-search input:focus { border: 0; outline: 0; }
.hero-search button { height: 46px; flex: 0 0 auto; margin: 0; padding: 0 24px; border-radius: 7px; background: #1769e0; font-weight: 700; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 22px; color: #69768a; font-size: 12px; }
.hero-trust span { display: flex; align-items: center; gap: 6px; }
.hero-trust i { width: 17px; height: 17px; display: inline-grid; place-items: center; border-radius: 50%; background: #dff5ef; color: #16866b; font-size: 10px; font-style: normal; font-weight: 900; }

.hero-visual { position: relative; height: 430px; display: grid; place-items: center; }
.hero-visual::before { content: ""; position: absolute; width: 360px; height: 360px; border-radius: 50%; background: linear-gradient(145deg, rgba(23, 105, 224, .13), rgba(34, 189, 180, .05)); }
.visual-orbit { position: absolute; border: 1px dashed rgba(23, 105, 224, .19); border-radius: 50%; }
.orbit-one { width: 410px; height: 410px; }
.orbit-two { width: 310px; height: 310px; }
.visual-card { border: 1px solid rgba(211, 224, 241, .95); background: rgba(255, 255, 255, .93); box-shadow: 0 25px 70px rgba(17, 64, 124, .16); backdrop-filter: blur(12px); }
.visual-main { position: relative; z-index: 2; width: 330px; padding: 25px; border-radius: 18px; transform: rotate(-1.5deg); }
.visual-card-head { display: flex; align-items: center; gap: 12px; }
.visual-card-head > div { display: flex; flex: 1; flex-direction: column; }
.visual-card-head strong { font-size: 14px; }
.visual-card-head small { color: #8290a4; font-size: 10px; }
.visual-icon { width: 47px; height: 47px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(145deg, #1c77ea, #16aaa2); font-size: 11px; font-weight: 900; }
.verified-dot { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #1aa177; font-size: 12px; }
.visual-chart { height: 135px; display: flex; align-items: end; gap: 12px; margin: 28px 0 12px; padding: 18px 18px 0; border-radius: 11px; background: linear-gradient(180deg, #f4f9ff, #eef6ff); }
.visual-chart span { width: 27px; height: var(--h); border-radius: 5px 5px 2px 2px; background: linear-gradient(180deg, #39a8eb, #1769e0); opacity: .86; }
.visual-labels { display: flex; align-items: center; justify-content: space-between; color: #8793a4; font-size: 10px; }
.visual-labels strong { color: #16866b; }
.visual-float { position: absolute; z-index: 3; display: flex; align-items: center; gap: 11px; padding: 13px 16px; border-radius: 12px; }
.visual-float span:last-child { display: flex; flex-direction: column; }
.visual-float small { color: #8592a5; font-size: 9px; }
.visual-float strong { color: #102346; font-size: 13px; }
.visual-float-top { top: 36px; right: 0; animation: portal-float 4s ease-in-out infinite; }
.visual-float-bottom { bottom: 34px; left: -8px; animation: portal-float 4.6s ease-in-out infinite reverse; }
.float-symbol { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: linear-gradient(145deg, #7f65ed, #4d89ed); }
.avatar-stack { display: flex; }
.avatar-stack b { width: 29px; height: 29px; display: grid; place-items: center; margin-right: -8px; border: 2px solid #fff; border-radius: 50%; color: #fff; background: #1769e0; font-size: 10px; }
.avatar-stack b:nth-child(2) { background: #18a89f; }
.avatar-stack b:nth-child(3) { background: #735bd4; }
@keyframes portal-float { 50% { transform: translateY(-8px); } }

.stats-band { position: relative; z-index: 5; border-top: 1px solid #e2e9f3; border-bottom: 1px solid #e2e9f3; background: #fff; box-shadow: 0 8px 25px rgba(18, 55, 105, .04); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.stat-item { position: relative; min-height: 116px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: 1fr 1fr; align-content: center; column-gap: 14px; padding: 27px 38px; }
.stat-item:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 27px; bottom: 27px; width: 1px; background: #e5eaf2; }
.stat-item strong { grid-row: 1 / 3; align-self: center; color: #1769e0; font-size: 33px; line-height: 1; letter-spacing: -.04em; }
.stat-item span { align-self: end; color: #24324b; font-size: 14px; font-weight: 700; }
.stat-item small { align-self: start; color: #919bab; font-size: 10px; }

.value-section, .directory-section, .showcase-section, .process-section { padding: 92px 0; }
.section-heading { margin-bottom: 40px; }
.section-heading h2 { margin: 0 0 14px; color: #10203e; font-size: clamp(28px, 3vw, 38px); line-height: 1.3; letter-spacing: -.035em; }
.section-heading > p:last-child, .section-heading > div > p:last-child { max-width: 660px; margin: 0; color: #718096; font-size: 14px; }
.section-heading.centered { text-align: center; }
.section-heading.centered > p:last-child { margin-inline: auto; }
.heading-row { display: flex; justify-content: space-between; align-items: end; gap: 30px; }
.text-link { padding-bottom: 5px; color: #1769e0; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.text-link span { display: inline-block; margin-left: 7px; transition: transform .2s; }
.text-link:hover span { transform: translateX(4px); }
.value-section { background: #fff; }
.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.value-card { position: relative; min-height: 265px; padding: 34px 30px 28px; overflow: hidden; border: 1px solid #e2e8f1; border-radius: 13px; background: #fff; box-shadow: var(--shadow-sm); transition: transform .25s, box-shadow .25s, border-color .25s; }
.value-card:hover { transform: translateY(-6px); border-color: #cbdcf3; box-shadow: var(--shadow-md); }
.value-card.featured { background: linear-gradient(145deg, #f5faff, #fff); border-top: 3px solid #1769e0; }
.value-number { position: absolute; top: 19px; right: 25px; color: #eff3f8; font-size: 45px; font-weight: 900; line-height: 1; }
.value-icon { width: 47px; height: 47px; display: grid; place-items: center; margin-bottom: 22px; border-radius: 12px; font-size: 22px; font-weight: 900; }
.icon-blue { color: #1769e0; background: #eaf3ff; }.icon-teal { color: #159c94; background: #e6f8f6; }.icon-violet { color: #7358d8; background: #f0edff; }
.value-card h3 { margin: 0 0 10px; font-size: 18px; }
.value-card p { min-height: 53px; margin: 0 0 19px; color: #6d798d; font-size: 13px; }
.value-card a { color: #1769e0; font-size: 12px; font-weight: 700; text-decoration: none; }
.value-card a b { margin-left: 5px; }

.directory-section { background: #f5f8fc; }
.directory-toolbar { min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 28px; padding: 10px 12px; border: 1px solid #e0e7f0; border-radius: 11px; background: #fff; box-shadow: 0 7px 24px rgba(20, 49, 88, .05); }
.filter-tabs { display: flex; gap: 6px; }
.filter-tabs button { margin: 0; padding: 10px 17px; border-radius: 7px; background: transparent; color: #59667b; font-size: 13px; font-weight: 700; }
.filter-tabs button span { display: inline-grid; min-width: 20px; height: 20px; place-items: center; margin-left: 6px; border-radius: 10px; background: #edf1f6; color: #778398; font-size: 10px; }
.filter-tabs button.active { background: #1769e0; color: #fff; }
.filter-tabs button.active span { background: rgba(255, 255, 255, .2); color: #fff; }
.directory-search { position: relative; width: 260px; margin: 0; }
.directory-search svg { left: 13px; top: 10px; width: 18px; }
.directory-search input { height: 40px; padding: 0 12px 0 40px; border-color: #e1e7ef; background: #f8fafc; font-size: 12px; }
.subject-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.subject-card { position: relative; min-width: 0; padding: 26px 25px 22px; overflow: hidden; border: 1px solid #dfe6ef; border-radius: 13px; background: #fff; box-shadow: var(--shadow-sm); transition: transform .25s, box-shadow .25s; }
.subject-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #1769e0, #35aee6); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
.subject-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.subject-card:hover::before { transform: scaleX(1); }
.subject-card-top { display: flex; justify-content: space-between; align-items: start; }
.subject-avatar, .dialog-avatar { width: 55px; height: 55px; display: grid; place-items: center; border-radius: 15px; color: #fff; background: linear-gradient(145deg, #1769e0, #39a5e6); font-size: 16px; font-weight: 800; box-shadow: 0 9px 20px rgba(23, 105, 224, .2); }
.subject-avatar.org-avatar { background: linear-gradient(145deg, #118d88, #29bbb1); box-shadow: 0 9px 20px rgba(18, 147, 139, .2); }
.verified-label { display: inline-flex; align-items: center; padding: 4px 9px; border-radius: 10px; color: #148262; background: #e9f8f2; font-size: 9px; font-weight: 800; }
.subject-kind { display: block; margin: 20px 0 3px; color: #8290a4; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.subject-card h3 { min-height: 29px; margin: 0 0 9px; overflow: hidden; color: #172742; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.subject-description { height: 44px; margin: 0 0 14px; overflow: hidden; color: #69768a; font-size: 12px; line-height: 1.75; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.mini-tags { height: 25px; display: flex; gap: 6px; overflow: hidden; }
.mini-tags span, .dialog-tags span { flex: 0 0 auto; padding: 3px 8px; border-radius: 4px; color: #55708f; background: #eff5fb; font-size: 9px; }
.subject-metrics { display: grid; grid-template-columns: repeat(3, 1fr); margin: 19px -6px 0; padding: 15px 0; border-top: 1px solid #edf0f4; border-bottom: 1px solid #edf0f4; }
.subject-metrics span { display: flex; align-items: baseline; justify-content: center; gap: 4px; }
.subject-metrics span:not(:last-child) { border-right: 1px solid #edf0f4; }
.subject-metrics strong { color: #1c3153; font-size: 16px; }
.subject-metrics small { color: #8a96a7; font-size: 9px; }
.subject-more { width: 100%; margin: 15px 0 0; padding: 8px; border-radius: 6px; color: #1769e0; background: #eef5ff; font-size: 11px; font-weight: 700; transition: background .2s; }
.subject-more:hover { background: #dfeeff; }
.portal-status { min-height: 24px; margin-top: 22px; color: #7a8799; font-size: 12px; text-align: center; }
.portal-status.error { color: var(--danger); }
.portal-skeleton { height: 350px; border-radius: 13px; background: linear-gradient(100deg, #edf1f6 25%, #f8fafc 40%, #edf1f6 55%); background-size: 300% 100%; animation: skeleton 1.5s infinite; }
@keyframes skeleton { to { background-position-x: -150%; } }

.capability-section { position: relative; background: #0a2044; color: #fff; }
.capability-section::before { content: ""; position: absolute; inset: 0; opacity: .2; background-image: radial-gradient(circle at 20% 20%, #1c6ed5 0, transparent 27%), radial-gradient(circle at 80% 85%, #16a7a0 0, transparent 25%); }
.capability-section .home-shell { position: relative; }
.light-heading h2 { color: #fff; }
.light-heading > div > p:last-child { color: #aebbd0; }
.capability-section .section-kicker { color: #52c5ef; }
.review-note { display: flex; align-items: center; gap: 8px; padding: 8px 13px; border: 1px solid rgba(113, 202, 225, .25); border-radius: 20px; color: #a8dae7; font-size: 10px; white-space: nowrap; }
.review-note i { width: 17px; height: 17px; display: grid; place-items: center; border-radius: 50%; background: #159a86; color: #fff; font-style: normal; }
.capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.capability-card { position: relative; min-height: 260px; display: flex; flex-direction: column; padding: 25px; border: 1px solid rgba(160, 190, 226, .19); border-radius: 12px; background: rgba(255, 255, 255, .065); backdrop-filter: blur(8px); transition: transform .25s, background .25s; }
.capability-card:hover { transform: translateY(-5px); background: rgba(255, 255, 255, .1); }
.capability-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.capability-category { color: #64c8eb; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.level { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 10px; font-size: 9px; font-weight: 800; }
.level-expert { color: #ffe2a1; background: rgba(217, 152, 32, .17); }.level-senior { color: #9de2da; background: rgba(35, 179, 162, .16); }.level-intermediate { color: #add5ff; background: rgba(48, 130, 222, .18); }.level-junior { color: #d0d6e3; background: rgba(185, 194, 211, .13); }
.capability-card h3 { margin: 21px 0 11px; color: #fff; font-size: 18px; }
.capability-card > p { height: 64px; margin: 0; overflow: hidden; color: #aab8cd; font-size: 12px; line-height: 1.8; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.delivery-note { display: block; margin-top: 12px; color: #6fc8dc; font-size: 9px; }
.capability-owner { margin: auto 0 0; padding: 13px 0 0; border-top: 1px solid rgba(187, 208, 232, .13); border-radius: 0; background: transparent; color: #c4d0e2; font-size: 10px; text-align: left; }
.light-status { color: #aebbd0; }

.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.product-card { overflow: hidden; border: 1px solid #e0e6ef; border-radius: 13px; background: #fff; box-shadow: var(--shadow-sm); transition: transform .25s, box-shadow .25s; }
.product-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.product-cover { position: relative; height: 132px; display: flex; align-items: center; justify-content: center; overflow: hidden; color: #fff; background: linear-gradient(135deg, #1769e0, #4aa8ea); }
.product-cover::before, .product-cover::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; }
.product-cover::before { width: 150px; height: 150px; right: -55px; top: -70px; }.product-cover::after { width: 95px; height: 95px; left: -35px; bottom: -50px; }
.product-cover.product-tool { background: linear-gradient(135deg, #128e88, #38bbb0); }.product-cover.product-solution { background: linear-gradient(135deg, #5c4ac2, #8974e6); }
.product-cover span { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 14px; background: rgba(255,255,255,.16); font-size: 21px; font-weight: 800; backdrop-filter: blur(5px); }
.product-cover small { position: absolute; right: 15px; bottom: 12px; padding: 3px 9px; border-radius: 10px; background: rgba(5, 26, 61, .25); font-size: 9px; }
.product-body { min-height: 214px; display: flex; flex-direction: column; padding: 20px 21px; }
.product-owner { color: #77869b; font-size: 9px; }
.product-body h3 { margin: 7px 0 8px; font-size: 16px; }
.product-body > p { height: 42px; margin: 0; overflow: hidden; color: #6b788c; font-size: 11px; line-height: 1.8; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.product-foot { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 16px; border-top: 1px solid #eef1f5; }
.product-foot strong { color: #1769e0; font-size: 13px; }
.product-foot button { margin: 0; padding: 0; background: transparent; color: #65758b; font-size: 10px; }
.card-link { display: inline-block; margin-top: 8px; font-size: 10px; }

.achievement-section { background: #f5f8fc; }
.achievement-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.achievement-card { position: relative; min-height: 260px; padding: 27px 24px 23px; overflow: hidden; border: 1px solid #e0e6ef; border-radius: 12px; background: #fff; box-shadow: var(--shadow-sm); }
.achievement-index { position: absolute; right: 17px; top: 13px; color: #edf1f6; font-size: 44px; font-weight: 900; line-height: 1; }
.achievement-owner { position: relative; color: #1769e0; font-size: 9px; font-weight: 800; }
.achievement-card h3 { position: relative; min-height: 48px; margin: 13px 0 10px; font-size: 16px; line-height: 1.5; }
.achievement-card > p { height: 61px; margin: 0 0 15px; overflow: hidden; color: #6f7c90; font-size: 11px; line-height: 1.85; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.achievement-result { display: block; padding: 9px 11px; border-radius: 6px; color: #167b6b; background: #eaf8f5; font-size: 10px; }
.achievement-card time { display: block; margin-top: 13px; color: #9aa4b3; font-size: 9px; }

.community-section { padding: 105px 0; background: #fff; }
.community-layout { display: grid; grid-template-columns: 1.05fr .95fr; gap: 90px; align-items: center; }
.community-copy h2 { margin: 0 0 23px; color: #10203e; font-size: clamp(30px, 3.2vw, 43px); line-height: 1.35; letter-spacing: -.04em; }
.community-copy > p:not(.section-kicker) { max-width: 600px; margin: 0; color: #68778e; font-size: 14px; line-height: 1.95; }
.community-points { margin: 30px 0; }
.community-points > div { display: flex; align-items: center; gap: 16px; margin: 15px 0; }
.community-points > div > span { width: 34px; height: 34px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 9px; color: #1769e0; background: #eaf3ff; font-size: 10px; font-weight: 900; }
.community-points p { display: flex; flex-direction: column; margin: 0; }
.community-points strong { font-size: 13px; }.community-points small { color: #8a96a8; font-size: 10px; }
.community-visual { position: relative; height: 430px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle, #eef7ff 0, #f8fbff 54%, transparent 55%); }
.network-ring { position: absolute; border: 1px dashed #bcd1eb; border-radius: 50%; }
.ring-outer { width: 370px; height: 370px; animation: orbit-spin 35s linear infinite; }.ring-inner { width: 235px; height: 235px; animation: orbit-spin 25s linear infinite reverse; }
@keyframes orbit-spin { to { transform: rotate(360deg); } }
.network-core { position: relative; z-index: 3; width: 116px; height: 116px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 8px solid #dcecff; border-radius: 50%; color: #fff; background: linear-gradient(145deg, #1769e0, #138eae); box-shadow: 0 20px 50px rgba(23, 105, 224, .25); }
.network-core strong { font-size: 25px; letter-spacing: .08em; }.network-core small { opacity: .8; font-size: 9px; }
.network-node { position: absolute; z-index: 2; width: 65px; height: 65px; display: grid; place-items: center; border: 1px solid #dbe5f1; border-radius: 50%; background: #fff; color: #47617f; font-size: 11px; font-weight: 800; box-shadow: 0 10px 30px rgba(19, 57, 105, .13); }
.node-one { top: 27px; left: 110px; }.node-two { right: 23px; top: 165px; }.node-three { bottom: 22px; left: 166px; }.node-four { left: 25px; top: 216px; }
.network-node::after { content: ""; position: absolute; inset: 5px; border: 1px solid #e9eff6; border-radius: 50%; }

.process-section { background: #f6f9fd; border-top: 1px solid #e9edf3; }
.process-grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; }
.process-grid::before { content: ""; position: absolute; top: 28px; left: 16%; right: 16%; border-top: 1px dashed #afc6e3; }
.process-grid article { position: relative; display: flex; gap: 17px; padding: 12px; }
.process-grid article > span { position: relative; z-index: 2; width: 56px; height: 56px; display: grid; flex: 0 0 auto; place-items: center; border: 6px solid #e9f2ff; border-radius: 50%; color: #fff; background: #1769e0; font-size: 15px; font-weight: 900; }
.process-grid small { color: #1769e0; font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.process-grid h3 { margin: 4px 0 7px; font-size: 15px; }.process-grid p { margin: 0; color: #788497; font-size: 11px; }

.final-cta { padding: 70px 0; overflow: hidden; background: linear-gradient(120deg, #0d55bf, #126fcf 55%, #0d8f9f); }
.cta-inner { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 45px; }
.cta-inner::after { content: "OPC"; position: absolute; right: -20px; top: -95px; color: rgba(255,255,255,.055); font-size: 190px; font-weight: 900; line-height: 1; }
.cta-inner > div { position: relative; z-index: 1; }
.final-cta .section-kicker { color: #9ae5eb; }.final-cta h2 { max-width: 680px; margin: 0 0 12px; color: #fff; font-size: 31px; }.final-cta p:last-child { margin: 0; color: #c8dff4; font-size: 13px; }
.cta-actions { display: flex; gap: 12px; flex: 0 0 auto; }
.button-white { background: #fff; color: #1769e0; box-shadow: none; }.button-outline { border-color: rgba(255,255,255,.5); background: transparent; box-shadow: none; }

.home-footer { padding: 57px 0 20px; color: #9ca9bc; background: #07172f; }
.footer-main { display: flex; justify-content: space-between; gap: 50px; padding-bottom: 42px; }
.brand-light { color: #fff; }.brand-light small { color: #7e8da3; }
.footer-brand > p { max-width: 360px; margin: 20px 0 0; color: #7e8ca2; font-size: 12px; }
.footer-links { display: flex; gap: 90px; }
.footer-links > div { display: flex; min-width: 100px; flex-direction: column; gap: 9px; }
.footer-links strong { margin-bottom: 8px; color: #fff; font-size: 12px; }.footer-links a { color: #8290a5; font-size: 11px; text-decoration: none; }.footer-links a:hover { color: #fff; }
.footer-bottom { display: flex; justify-content: space-between; padding-top: 19px; border-top: 1px solid #1b2a42; color: #68778e; font-size: 10px; }

.subject-dialog { width: min(850px, calc(100% - 32px)); max-height: min(780px, calc(100vh - 32px)); padding: 0; overflow-x: hidden; overflow-y: auto; border: 0; border-radius: 17px; color: #17243a; box-shadow: 0 35px 100px rgba(4, 19, 45, .35); }
.subject-dialog::backdrop { background: rgba(5, 17, 37, .72); backdrop-filter: blur(4px); }
.dialog-close { position: sticky; z-index: 4; top: 15px; float: right; width: 36px; height: 36px; display: grid; place-items: center; margin: 15px 15px -52px 0; padding: 0; border-radius: 50%; color: #526178; background: #eef2f7; font-size: 22px; }
.dialog-hero { min-height: 190px; display: flex; align-items: center; gap: 24px; padding: 47px 48px 35px; background: linear-gradient(135deg, #edf5ff, #f7fbff); }
.dialog-avatar { width: 72px; height: 72px; flex: 0 0 auto; font-size: 19px; }
.dialog-hero h2 { margin: 7px 0 7px; font-size: 25px; }.dialog-hero p { margin: 0; color: #63728a; font-size: 12px; }
.kind-pill { padding: 3px 8px; border-radius: 10px; color: #1769e0; background: #deecff; font-size: 9px; font-weight: 800; }
.dialog-tags { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 48px 26px; background: linear-gradient(135deg, #edf5ff, #f7fbff); }
.dialog-content { padding: 32px 48px 45px; }
.dialog-section { margin-bottom: 30px; }.dialog-section > h3 { margin: 0 0 15px; padding-bottom: 9px; border-bottom: 1px solid #e5eaf1; font-size: 15px; }
.dialog-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dialog-list article { min-width: 0; padding: 16px; border: 1px solid #e2e8f0; border-radius: 9px; background: #fbfcfe; }
.dialog-list article > div { display: flex; justify-content: space-between; gap: 10px; }.dialog-list strong { font-size: 12px; }.dialog-list p { margin: 7px 0; color: #69778b; font-size: 10px; }.dialog-list small { color: #178477; font-size: 9px; }
.dialog-empty { color: #929cac; font-size: 11px; }

@media (max-width: 1024px) {
  .site-nav { gap: 17px; }.home-nav { gap: 20px; }
  .hero-layout { gap: 30px; }.hero-visual { transform: scale(.9); }
  .stat-item { padding-inline: 22px; }
  .community-layout { gap: 35px; }
}

@media (max-width: 820px) {
  .home-shell, .home-nav { width: min(100% - 32px, 680px); }
  .home-header { height: 68px; }.nav-toggle { display: block; }
  .site-nav { position: absolute; top: 67px; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 12px 20px 20px; border-bottom: 1px solid #e0e7f0; background: #fff; box-shadow: 0 14px 28px rgba(13, 40, 78, .12); }
  .site-nav.open { display: flex; }.site-nav a { padding: 11px 0; }.site-nav a::after { display: none; }
  .nav-actions { display: none; }
  .hero { padding: 60px 0; }.hero-layout { grid-template-columns: 1fr; }.hero-copy { text-align: center; }.eyebrow { justify-content: center; }.hero-lead { margin-inline: auto; }.hero-search { margin-inline: auto; }.hero-trust { justify-content: center; }
  .hero-visual { height: 390px; transform: none; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }.stat-item:nth-child(2)::after { display: none; }.stat-item:nth-child(-n+2) { border-bottom: 1px solid #e5eaf2; }
  .value-section, .directory-section, .showcase-section, .process-section { padding: 70px 0; }
  .value-grid, .subject-grid, .capability-grid, .product-grid, .achievement-grid { grid-template-columns: repeat(2, 1fr); }
  .heading-row { align-items: start; flex-direction: column; }
  .community-layout { grid-template-columns: 1fr; }.community-visual { order: -1; }
  .process-grid { grid-template-columns: 1fr; gap: 8px; }.process-grid::before { display: none; }
  .cta-inner { align-items: start; flex-direction: column; }.footer-main { align-items: start; flex-direction: column; }
}

@media (max-width: 560px) {
  .home-shell, .home-nav { width: calc(100% - 28px); }
  .brand strong { font-size: 16px; }.brand small { font-size: 8px; }.brand-mark { width: 35px; height: 35px; }
  .hero { min-height: auto; padding: 48px 0 40px; }.hero h1 { font-size: 39px; }.hero-lead { margin-block: 19px 24px; font-size: 14px; }.hero-search { height: auto; padding: 7px 7px 7px 42px; }.hero-search button { padding-inline: 15px; font-size: 12px; }.hero-search svg { left: 14px; }.hero-trust { align-items: center; flex-direction: column; gap: 8px; }
  .hero-visual { height: 340px; transform: scale(.84); margin: -20px -30px; }.visual-float-top { right: -5px; }.visual-float-bottom { left: -5px; }
  .stat-item { min-height: 95px; padding: 20px 15px; }.stat-item strong { font-size: 27px; }.stat-item span { font-size: 12px; }
  .section-heading { margin-bottom: 30px; }.section-heading h2 { font-size: 28px; }.value-section, .directory-section, .showcase-section, .process-section, .community-section { padding: 60px 0; }
  .value-grid, .subject-grid, .capability-grid, .product-grid, .achievement-grid { grid-template-columns: 1fr; }
  .directory-toolbar { align-items: stretch; flex-direction: column; }.filter-tabs { overflow-x: auto; }.filter-tabs button { flex: 0 0 auto; padding-inline: 12px; }.directory-search { width: 100%; }
  .capability-card { min-height: 235px; }.review-note { white-space: normal; }
  .community-visual { height: 340px; transform: scale(.86); margin: -25px; }.ring-outer { width: 330px; height: 330px; }.node-two { right: 0; }.node-four { left: 0; }
  .community-copy h2 { font-size: 30px; }
  .final-cta { padding: 55px 0; }.final-cta h2 { font-size: 27px; }.cta-actions { width: 100%; flex-direction: column; }.cta-actions .button { width: 100%; }
  .footer-links { width: 100%; gap: 45px; }.footer-bottom { align-items: start; flex-direction: column; gap: 5px; }
  .dialog-hero { align-items: start; padding: 45px 25px 28px; flex-direction: column; }.dialog-tags { padding: 0 25px 22px; }.dialog-content { padding: 27px 25px 35px; }.dialog-list { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ── GAIA 橙色地域生态品牌覆盖 ───────────────────────────────────── */
:root {
  --accent: #f47a1f;
  --accent-dark: #c6530b;
  --teal: #e76717;
  --navy: #2b170c;
  --bg: #fffaf5;
  --border: #eadfd5;
  --shadow-sm: 0 8px 24px rgba(109, 55, 16, .07);
  --shadow-md: 0 18px 50px rgba(109, 55, 16, .14);
}

input:focus, select:focus, textarea:focus { border-color: var(--accent); outline-color: rgba(244, 122, 31, .14); }
.home { color: #2d2119; background: #fff; }
.home-header { border-color: #f0e3d7; }
.brand { color: #392116; }
.brand-mark { background: linear-gradient(145deg, #f89a36, #ed6814); box-shadow: 0 8px 18px rgba(228, 99, 18, .26); }
.site-nav a:hover, .nav-login:hover { color: #e96613; }
.site-nav a::after { background: #f47a1f; }
.button { background: linear-gradient(135deg, #f58a2b, #ed6814); box-shadow: 0 10px 25px rgba(230, 103, 20, .22); }
.button:hover { box-shadow: 0 14px 32px rgba(230, 103, 20, .3); }

.hero { background: linear-gradient(118deg, #fffaf4 0%, #fff1df 52%, #fff9f1 100%); }
.hero::before { background-image: linear-gradient(rgba(224, 104, 26, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(224, 104, 26, .055) 1px, transparent 1px); }
.hero-glow-one { background: radial-gradient(circle, rgba(244, 122, 31, .2), transparent 68%); }
.hero-glow-two { background: radial-gradient(circle, rgba(255, 184, 83, .18), transparent 70%); }
.eyebrow, .section-kicker { color: #e86715; }
.eyebrow span { background: #f47a1f; }
.hero h1 { color: #2d1a10; }
.hero h1 em { color: #eb6715; }
.hero-lead { color: #705c4d; }
.hero-search { border-color: #ead5c4; box-shadow: 0 12px 35px rgba(132, 67, 22, .11); }
.hero-search button { background: #f0781e; }
.hero-search svg, .directory-search svg { stroke: #9a7760; }
.hero-trust { color: #7e6859; }
.hero-trust i { color: #d95f12; background: #fff0df; }
.hero-visual::before { background: linear-gradient(145deg, rgba(244, 122, 31, .15), rgba(255, 187, 83, .08)); }
.visual-orbit { border-color: rgba(226, 103, 22, .23); }
.visual-card { border-color: rgba(235, 210, 188, .95); box-shadow: 0 25px 70px rgba(118, 55, 15, .16); }
.visual-icon { background: linear-gradient(145deg, #f68b29, #e65f12); font-size: 9px; }
.verified-dot { background: #f47a1f; }
.float-symbol { background: linear-gradient(145deg, #ff9b35, #e66112); }
.avatar-stack b { background: #e96816; }
.avatar-stack b:nth-child(2) { background: #f6972f; }
.avatar-stack b:nth-child(3) { background: #bc4c0d; }
.visual-labels strong { color: #dc6114; }

.library-preview { width: 350px; }
.preview-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 25px 0 18px; }
.preview-grid span { min-height: 72px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #f0ddca; border-radius: 10px; background: #fff8ef; }
.preview-grid b { color: #e76615; font-size: 15px; }
.preview-grid small { margin-top: 2px; color: #8d725e; font-size: 9px; }

.stats-band { border-color: #f0e4d9; box-shadow: 0 8px 25px rgba(109, 55, 16, .04); }
.stat-item:not(:last-child)::after { background: #eee1d6; }
.stat-item strong { color: #ed6b18; font-size: 29px; }
.stat-item:first-child strong { font-size: 21px; }
.stat-item span { color: #432b1d; }

/* 地域四库 */
.library-section { padding: 96px 0; background: #fff; }
.library-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.library-card { position: relative; min-height: 345px; display: flex; flex-direction: column; padding: 29px 24px 25px; overflow: hidden; border: 1px solid #eee1d5; border-radius: 15px; background: #fff; box-shadow: var(--shadow-sm); transition: transform .25s, box-shadow .25s; }
.library-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, #f6a03e, #ed6814); }
.library-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.library-index { position: absolute; top: 18px; right: 20px; color: #f2e7dd; font-size: 37px; font-weight: 900; line-height: 1; }
.library-icon { width: 51px; height: 51px; display: grid; place-items: center; margin-bottom: 23px; border-radius: 13px; color: #fff; background: linear-gradient(145deg, #f79331, #e86414); font-size: 13px; font-weight: 900; box-shadow: 0 9px 19px rgba(230, 102, 18, .19); }
.library-card h3 { margin: 0 0 11px; color: #382317; font-size: 19px; }
.library-card > p { min-height: 90px; margin: 0; color: #756355; font-size: 12px; line-height: 1.9; }
.library-tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 18px 0; }
.library-tags span { padding: 3px 7px; border-radius: 4px; color: #a24a13; background: #fff1e3; font-size: 9px; }
.library-card > strong { margin-top: auto; padding-top: 15px; border-top: 1px solid #f1e8df; color: #df6314; font-size: 11px; }
.library-card > strong b { margin-right: 3px; font-size: 19px; }
.culture-library .library-icon { background: linear-gradient(145deg, #f06d3c, #d94925); }
.product-library .library-icon { background: linear-gradient(145deg, #f6aa30, #eb7b12); }
.outcome-library .library-icon { background: linear-gradient(145deg, #d86a28, #a84210); }

/* OPC 全周期服务 */
.support-section { padding: 95px 0; background: #fff7ed; border-top: 1px solid #f4e1cf; border-bottom: 1px solid #f4e1cf; }
.support-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.support-grid article { position: relative; min-height: 205px; padding: 24px 21px; overflow: hidden; border: 1px solid #edddcf; border-radius: 12px; background: rgba(255, 255, 255, .88); transition: transform .2s, border-color .2s; }
.support-grid article:hover { transform: translateY(-4px); border-color: #f0a16b; }
.support-grid article > span { position: absolute; right: 15px; top: 10px; color: #f3e6da; font-size: 34px; font-weight: 900; }
.support-symbol { width: 41px; height: 41px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 10px; color: #e96514; background: #fff0e1; font-size: 13px; font-weight: 900; }
.support-grid h3 { margin: 0 0 8px; color: #41291b; font-size: 15px; }
.support-grid p { margin: 0; color: #7e695a; font-size: 11px; line-height: 1.8; }
.support-grid .support-featured { border-color: #ed7a2c; background: linear-gradient(145deg, #f98628, #dc5910); }
.support-featured .support-symbol { color: #fff; background: rgba(255,255,255,.18); }
.support-featured h3, .support-featured p { color: #fff; }
.support-featured > span { color: rgba(255,255,255,.16) !important; }

/* 既有动态区域橙色化 */
.section-heading h2, .community-copy h2 { color: #352116; }
.text-link, .value-card a { color: #e76615; }
.directory-section, .achievement-section { background: #fffaf5; }
.directory-toolbar { border-color: #eaded3; box-shadow: 0 7px 24px rgba(100, 49, 14, .05); }
.filter-tabs button.active { background: #ef741b; }
.subject-card { border-color: #eadfd5; }
.subject-card::before { background: linear-gradient(90deg, #f18327, #f5aa45); }
.subject-avatar, .dialog-avatar { background: linear-gradient(145deg, #f38a2c, #de5e12); box-shadow: 0 9px 20px rgba(221, 91, 15, .21); }
.subject-avatar.org-avatar { background: linear-gradient(145deg, #d9621c, #a84211); box-shadow: 0 9px 20px rgba(153, 66, 14, .2); }
.verified-label { color: #c95710; background: #fff0df; }
.mini-tags span, .dialog-tags span { color: #975021; background: #fff0e3; }
.subject-more { color: #dd6215; background: #fff0e1; }
.subject-more:hover { background: #ffe2c5; }

.capability-section { background: #2b180d; }
.capability-section::before { background-image: radial-gradient(circle at 20% 20%, #d75d12 0, transparent 28%), radial-gradient(circle at 80% 85%, #a53d0a 0, transparent 26%); }
.capability-section .section-kicker, .capability-category { color: #ffae67; }
.review-note { border-color: rgba(255, 169, 95, .3); color: #ffd1a9; }
.review-note i { background: #ed6f19; }
.capability-card { border-color: rgba(255, 188, 129, .17); background: rgba(255, 244, 233, .065); }
.delivery-note { color: #ffb477; }
.level-expert { color: #ffe1a3; background: rgba(232, 145, 32, .2); }
.level-senior { color: #ffc99c; background: rgba(232, 105, 25, .2); }
.level-intermediate { color: #ffd8b7; background: rgba(197, 79, 11, .2); }
.capability-owner { color: #dcc5b4; border-color: rgba(255, 215, 183, .14); }
.promotion-chip { display: inline-flex; align-items: center; padding: 8px 14px; border: 1px solid #f0b482; border-radius: 20px; color: #d95e10; background: #fff4e8; font-size: 10px; font-weight: 800; white-space: nowrap; }
.product-cover { background: linear-gradient(135deg, #f28a29, #de5d12); }
.product-cover.product-tool { background: linear-gradient(135deg, #f3a039, #e47615); }
.product-cover.product-solution { background: linear-gradient(135deg, #d76420, #a93e0c); }
.product-foot strong, .achievement-owner { color: #e76715; }
.achievement-result { color: #c55a14; background: #fff0e2; }

/* 统一宣发 */
.promotion-section { padding: 100px 0; color: #fff; background: #2c180d; }
.promotion-layout { display: grid; grid-template-columns: 1.08fr .92fr; gap: 75px; align-items: center; }
.promotion-copy .section-kicker { color: #ff9a45; }
.promotion-copy h2 { margin: 0 0 19px; color: #fff; font-size: clamp(31px, 3.5vw, 45px); line-height: 1.35; letter-spacing: -.04em; }
.promotion-copy > p:not(.section-kicker) { max-width: 610px; margin: 0; color: #ccb8a8; font-size: 13px; line-height: 1.95; }
.promotion-flow { display: flex; align-items: center; gap: 8px; margin: 29px 0; }
.promotion-flow span { min-width: 75px; display: flex; flex-direction: column; color: #f6e5d7; font-size: 10px; }
.promotion-flow b { color: #f47a1f; font-size: 9px; }
.promotion-flow i { color: #8b6650; font-style: normal; }
.promotion-board { position: relative; min-height: 380px; padding: 42px 38px 34px; overflow: hidden; border: 1px solid rgba(255, 169, 94, .22); border-radius: 18px; background: linear-gradient(145deg, rgba(244, 122, 31, .18), rgba(255, 255, 255, .04)); }
.promotion-board::after { content: "GAIA"; position: absolute; right: -16px; bottom: -38px; color: rgba(255,255,255,.04); font-size: 100px; font-weight: 900; }
.board-label { color: #f89a48; font-size: 9px; font-weight: 900; letter-spacing: .2em; }
.promotion-board h3 { margin: 14px 0 25px; color: #fff; font-size: 27px; line-height: 1.4; }
.channel-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }
.channel-grid span { padding: 11px 12px; border: 1px solid rgba(255, 193, 138, .15); border-radius: 7px; color: #ecd8c8; background: rgba(255,255,255,.045); font-size: 10px; }
.channel-grid span::before { content: "✓"; margin-right: 7px; color: #f48630; font-weight: 900; }
.promotion-board > small { position: relative; z-index: 1; display: block; margin-top: 22px; color: #a88d7a; font-size: 9px; }

.community-points > div > span { color: #df6212; background: #fff0e2; }
.community-visual { background: radial-gradient(circle, #fff1e3 0, #fffaf5 54%, transparent 55%); }
.network-ring { border-color: #edb98e; }
.network-core { border-color: #ffe1c4; background: linear-gradient(145deg, #f18225, #cc4e0b); box-shadow: 0 20px 50px rgba(213, 82, 12, .26); }
.process-section { background: #fff7ef; border-color: #f0e2d6; }
.process-grid::before { border-color: #e4ae83; }
.process-grid article > span { border-color: #ffe8d3; background: #ef731a; }
.process-grid small { color: #e46614; }
.final-cta { background: linear-gradient(120deg, #e86212, #f18424 57%, #cf4b0a); }
.final-cta .section-kicker { color: #ffe0c3; }
.final-cta p:last-child { color: #fff0e2; }
.button-white { color: #dd5d0d; }
.home-footer { background: #24140b; }
.kind-pill { color: #d95e10; background: #ffe7cf; }
.dialog-hero, .dialog-tags { background: linear-gradient(135deg, #fff0e2, #fffaf5); }

@media (max-width: 1024px) {
  .library-grid { grid-template-columns: repeat(2, 1fr); }
  .support-grid { grid-template-columns: repeat(4, 1fr); }
  .promotion-layout { gap: 35px; }
}

@media (max-width: 820px) {
  .library-section, .support-section, .promotion-section { padding: 72px 0; }
  .support-grid { grid-template-columns: repeat(2, 1fr); }
  .promotion-layout { grid-template-columns: 1fr; }
  .promotion-board { min-height: 340px; }
}

@media (max-width: 560px) {
  .library-section, .support-section, .promotion-section { padding: 60px 0; }
  .library-grid, .support-grid { grid-template-columns: 1fr; }
  .library-card { min-height: 305px; }
  .promotion-flow { align-items: stretch; flex-direction: column; gap: 5px; }
  .promotion-flow span { min-width: 0; padding: 8px 11px; border-radius: 6px; background: rgba(255,255,255,.05); }
  .promotion-flow i { display: none; }
  .promotion-board { min-height: 0; padding: 31px 23px; }
  .channel-grid { grid-template-columns: 1fr; }
  .promotion-chip { white-space: normal; }
  .preview-grid { gap: 7px; }
}

/* 三类伙伴赋能 */
.audience-section { padding: 95px 0; background: #fff; }
.audience-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 21px; }
.audience-grid article { position: relative; min-height: 380px; padding: 31px 28px 27px; overflow: hidden; border: 1px solid #ecdfd4; border-radius: 15px; background: #fffdfb; box-shadow: var(--shadow-sm); transition: transform .25s, box-shadow .25s; }
.audience-grid article:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.audience-grid .audience-featured { border-color: #f28b42; background: linear-gradient(145deg, #fff8ef, #fff); }
.audience-grid .audience-featured::before { content: "重点服务"; position: absolute; top: 20px; right: -34px; width: 120px; padding: 4px 0; color: #fff; background: #ee7119; font-size: 8px; font-weight: 800; text-align: center; transform: rotate(42deg); }
.audience-label { color: #dc6316; font-size: 8px; font-weight: 900; letter-spacing: .16em; }
.audience-icon { width: 52px; height: 52px; display: grid; place-items: center; margin: 22px 0; border-radius: 14px; color: #e76514; background: #fff0e1; font-size: 17px; font-weight: 900; }
.audience-grid h3 { margin: 0 0 12px; color: #3e281c; font-size: 19px; }
.audience-grid p { min-height: 93px; margin: 0; color: #766456; font-size: 12px; line-height: 1.9; }
.audience-grid ul { display: grid; gap: 8px; margin: 21px 0 0; padding: 17px 0 0; border-top: 1px solid #efe5dc; list-style: none; }
.audience-grid li { color: #705b4b; font-size: 10px; }
.audience-grid li::before { content: "✓"; margin-right: 8px; color: #eb7019; font-weight: 900; }

@media (max-width: 820px) {
  .audience-section { padding: 72px 0; }
  .audience-grid { grid-template-columns: 1fr; }
  .audience-grid article { min-height: 0; }
  .audience-grid p { min-height: 0; }
}

@media (max-width: 560px) {
  .audience-section { padding: 60px 0; }
}

/* ── 摄影图片接入与深色区块可读性修复 ────────────────────────────── */
.home img { display: block; max-width: 100%; }

/* 截图中 OPC 人才库标题被全局深色覆盖：使用区块作用域和更高优先级修复。 */
.capability-section .section-heading h2,
.capability-section .light-heading h2 { color: #fff !important; text-shadow: 0 2px 18px rgba(0, 0, 0, .22); }
.capability-section .section-heading > div > p:last-child,
.capability-section .light-heading > div > p:last-child { color: #f1d9c7 !important; font-size: 14px; }
.capability-section .capability-card { border-color: rgba(255, 187, 126, .3); background: rgba(255, 255, 255, .09); }
.capability-section .capability-card h3 { color: #fff !important; }
.capability-section .capability-card > p { color: #ead7c8 !important; }
.capability-section .capability-category { color: #ffb875 !important; }
.capability-section .capability-owner { color: #f1ddce !important; }
.capability-section .review-note { color: #ffe4cc; background: rgba(255, 255, 255, .04); }
.capability-section .portal-status { color: #f1ddce; }

/* Hero 真实摄影主视觉。 */
.hero-photo { position: relative; height: 445px; margin: 0; overflow: visible; border: 8px solid rgba(255, 255, 255, .82); border-radius: 28px 10px 28px 10px; background: #e9d2bf; box-shadow: 0 30px 75px rgba(110, 53, 16, .22); transform: rotate(1.2deg); }
.hero-photo::after { content: ""; position: absolute; inset: 0; border-radius: 20px 4px 20px 4px; background: linear-gradient(180deg, transparent 44%, rgba(39, 18, 7, .72)); pointer-events: none; }
.hero-photo > img { width: 100%; height: 100%; border-radius: 20px 4px 20px 4px; object-fit: cover; object-position: center; filter: saturate(.88) contrast(1.04); }
.hero-photo > figcaption { position: absolute; z-index: 2; left: 29px; right: 29px; bottom: 25px; display: flex; flex-direction: column; color: #fff; }
.hero-photo > figcaption span { margin-bottom: 5px; color: #ffc68f; font-size: 8px; font-weight: 900; letter-spacing: .18em; }
.hero-photo > figcaption strong { font-size: 17px; letter-spacing: .03em; }
.photo-badge { position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px; padding: 12px 15px; border: 1px solid rgba(255, 255, 255, .78); border-radius: 12px; background: rgba(255, 255, 255, .94); box-shadow: 0 15px 35px rgba(78, 34, 8, .18); backdrop-filter: blur(10px); transform: rotate(-1.2deg); }
.photo-badge > b { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: #ed6b18; font-size: 12px; }
.photo-badge > span { display: flex; flex-direction: column; }
.photo-badge small { color: #98745d; font-size: 8px; }
.photo-badge strong { color: #3a2215; font-size: 12px; }
.photo-badge-top { top: 31px; right: -27px; }
.photo-badge-bottom { left: -35px; bottom: 86px; }
.photo-badge-bottom .avatar-stack { margin-right: 5px; }

/* 培训交流实景横幅。 */
.audience-photo { position: relative; height: 280px; margin: -4px 0 27px; overflow: hidden; border-radius: 17px; box-shadow: 0 18px 48px rgba(96, 45, 12, .15); }
.audience-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(43, 22, 10, .82) 0, rgba(43, 22, 10, .36) 56%, transparent); }
.audience-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
.audience-photo figcaption { position: absolute; z-index: 2; left: 40px; top: 50%; width: min(430px, 70%); display: flex; flex-direction: column; color: #fff; transform: translateY(-50%); }
.audience-photo figcaption span { color: #ffae68; font-size: 9px; font-weight: 900; letter-spacing: .16em; }
.audience-photo figcaption strong { margin: 8px 0; font-size: 27px; }
.audience-photo figcaption small { color: #f1dccb; font-size: 11px; }

/* AI 产品库实景图片。 */
.product-library-photo { position: relative; height: 235px; margin: -5px 0 29px; overflow: hidden; border-radius: 16px; background: #3b1f10; }
.product-library-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(47, 23, 9, .84), rgba(47, 23, 9, .12)); }
.product-library-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.product-library-photo figcaption { position: absolute; z-index: 2; left: 35px; top: 50%; display: flex; flex-direction: column; color: #fff; transform: translateY(-50%); }
.product-library-photo figcaption span { color: #ffb471; font-size: 8px; font-weight: 900; letter-spacing: .17em; }
.product-library-photo figcaption strong { margin: 7px 0; font-size: 24px; }
.product-library-photo figcaption small { max-width: 470px; color: #f1ddcd; font-size: 10px; }

/* 线下宣发活动实景。 */
.promotion-photo { position: relative; min-height: 440px; margin: 0; overflow: hidden; border: 1px solid rgba(255, 174, 104, .3); border-radius: 19px; box-shadow: 0 28px 70px rgba(0, 0, 0, .3); }
.promotion-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(34, 15, 6, .08), rgba(34, 15, 6, .9)); }
.promotion-photo img { width: 100%; height: 440px; object-fit: cover; object-position: center; }
.promotion-photo figcaption { position: absolute; z-index: 2; left: 31px; right: 31px; bottom: 30px; }
.promotion-photo h3 { margin: 11px 0 19px; color: #fff; font-size: 27px; line-height: 1.35; }
.promotion-photo .channel-grid span { color: #fff1e5; background: rgba(36, 15, 5, .48); backdrop-filter: blur(7px); }

/* 地域社群实景。 */
.community-photo { position: relative; height: 435px; margin: 0; overflow: hidden; border: 10px solid #fff6ed; border-radius: 46% 46% 12px 12px; box-shadow: 0 25px 65px rgba(107, 51, 14, .18); }
.community-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 48%, rgba(42, 19, 7, .84)); }
.community-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.community-photo figcaption { position: absolute; z-index: 2; left: 29px; right: 29px; bottom: 27px; display: flex; flex-direction: column; color: #fff; }
.community-photo figcaption strong { font-size: 22px; }
.community-photo figcaption span { margin: 3px 0; color: #ffc58d; font-size: 11px; font-weight: 700; }
.community-photo figcaption small { color: #efded1; font-size: 9px; }

@media (max-width: 1024px) {
  .hero-photo { height: 410px; }
  .photo-badge-top { right: -10px; }
  .photo-badge-bottom { left: -12px; }
}

@media (max-width: 820px) {
  .hero-photo { width: min(570px, 100%); height: 410px; margin: 15px auto 0; transform: none; }
  .photo-badge { transform: none; }
  .promotion-photo { min-height: 410px; }
  .community-photo { order: -1; width: min(560px, 100%); margin-inline: auto; }
}

@media (max-width: 560px) {
  .hero h1 { font-size: 35px; }
  .hero-photo { height: 340px; border-width: 5px; border-radius: 22px 8px 22px 8px; }
  .hero-photo > img, .hero-photo::after { border-radius: 17px 4px 17px 4px; }
  .hero-photo > figcaption { left: 20px; right: 20px; bottom: 18px; }
  .photo-badge-top { top: 18px; right: -5px; }
  .photo-badge-bottom { left: -5px; bottom: 76px; }
  .audience-photo { height: 300px; }
  .audience-photo::after { background: linear-gradient(90deg, rgba(43, 22, 10, .82), rgba(43, 22, 10, .35)); }
  .audience-photo figcaption { left: 23px; width: calc(100% - 46px); }
  .audience-photo figcaption strong { font-size: 22px; }
  .product-library-photo { height: 285px; }
  .product-library-photo figcaption { left: 23px; right: 23px; }
  .promotion-photo, .promotion-photo img { min-height: 440px; height: 440px; }
  .promotion-photo figcaption { left: 21px; right: 21px; bottom: 22px; }
  .community-photo { height: 350px; border-radius: 40% 40% 10px 10px; }
}
