:root {
  --deep: #0a1f2e;
  --teal: #0d9488;
  --teal-bright: #14b8a6;
  --teal-dark: #0f766e;
  --teal-pale: #e6f7f5;
  --teal-light: #ccfbf1;
  --bg: #faf9f6;
  --bg-alt: #f2f0ec;
  --white: #fff;
  --t1: #0a1f2e;
  --t2: #475569;
  --t3: #94a3b8;
  --border: rgba(10,31,46,0.08);
  --shadow-md: 0 4px 12px rgba(10,31,46,0.06);
  --radius: 12px;
  --radius-lg: 16px;
  --font-en: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --font-cn: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --nav-h: 72px;
  --max-w: 1200px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-cn);color:var(--t1);background:var(--bg);line-height:1.75;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
.container{max-width:var(--max-w);margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem)}
section{padding:clamp(3.5rem,7vw,6rem) 0}
.section-label{font-family:var(--font-en);font-size:.9375rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:.5rem;display:inline-block}
h1{font-size:clamp(2rem,4.5vw,3rem);font-weight:700;line-height:1.5;color:var(--t1)}
h2{font-size:clamp(1.75rem,3.5vw,2.375rem);font-weight:700;line-height:1.5;margin-bottom:1rem;color:var(--t1)}
h3{font-size:clamp(1.125rem,2vw,1.375rem);font-weight:600;line-height:1.5;color:var(--t1)}
h4{font-size:1.125rem;font-weight:600;line-height:1.5;color:var(--t1)}
.section-intro{max-width:720px;margin-bottom:3rem;color:var(--t2);font-size:1.125rem;line-height:1.75}
.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);background:rgba(250,249,246,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.nav-inner{max-width:var(--max-w);margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem);height:100%;display:flex;align-items:center;justify-content:space-between}
.nav-logo{display:flex;align-items:center;gap:.5rem}.nav-logo .logo-mark{width:32px;height:32px;object-fit:contain}
.nav-logo .logo-text{font-weight:700;font-size:1.125rem;color:var(--deep)}
.nav-logo .logo-sub{font-family:var(--font-en);font-weight:300;font-size:.8125rem;color:var(--t3);text-transform:uppercase;letter-spacing:.06em}
.nav-links{display:flex;align-items:center;gap:.125rem}
.nav-links a{padding:.5rem 1rem;font-size:1rem;font-weight:500;color:var(--t2);border-radius:8px;transition:color .2s,background .2s}
.nav-links a:hover,.nav-links a.active{color:var(--teal);background:var(--teal-pale)}
.nav-mobile-toggle{display:none;background:none;border:1px solid var(--border);border-radius:8px;cursor:pointer;padding:.5rem;flex-direction:column;gap:5px;align-items:center;justify-content:center;min-width:40px;min-height:40px;position:relative;z-index:101}
.nav-mobile-toggle span{display:block;width:24px;height:3px;background:var(--deep);border-radius:2px;transition:transform .3s,opacity .3s}
.footer{background:var(--deep);color:#cbd5e1;padding:clamp(2.5rem,5vw,4rem) 0 2rem;font-size:.9375rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem}
.footer-brand h4{color:var(--white);font-size:1.125rem;margin-bottom:.75rem}
.footer-brand p{color:#94a3b8;line-height:1.75;max-width:320px}
.footer-col h5{color:var(--white);font-size:.9375rem;font-weight:600;margin-bottom:1rem;letter-spacing:.04em}
.footer-col a{display:block;padding:.25rem 0;color:#94a3b8;transition:color .2s;font-size:.9375rem}
.footer-col a:hover{color:var(--teal-bright)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:1.5rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;font-size:.9375rem;color:#64748b}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.75rem;font-size:1rem;font-weight:600;border-radius:8px;border:none;cursor:pointer;transition:all .25s;font-family:var(--font-cn)}
.btn-primary{background:var(--teal);color:var(--white)}
.btn-primary:hover{background:var(--teal-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-outline{background:transparent;color:var(--teal);border:2px solid var(--teal)}
.btn-outline:hover{background:var(--teal);color:var(--white)}
.btn-outline-white{background:transparent;color:var(--white);border:2px solid rgba(255,255,255,.3)}
.btn-outline-white:hover{background:rgba(255,255,255,.1);border-color:var(--white)}
.card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;transition:box-shadow .3s,transform .2s}
.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.card-icon{width:48px;height:48px;background:var(--teal-pale);border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem;font-size:1.25rem}
.card-icon svg{width:24px;height:24px;stroke:var(--teal)}
.icon-line{width:1.5em;height:1.5em;display:block;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon-line.icon-inline{width:1.1em;height:1.1em;display:inline-block;vertical-align:-.18em}
.entry-card .entry-icon,.biz-card .biz-icon,.product-card .prod-icon,.cta-card .cta-icon,.contact-card .c-icon,.pos-card .pos-icon,.dim-card .dim-icon,.feature-item .fi-icon{color:var(--teal)}
.entry-card .entry-icon svg,.biz-card .biz-icon svg,.product-card .prod-icon svg,.cta-card .cta-icon svg,.contact-card .c-icon svg,.pos-card .pos-icon svg,.dim-card .dim-icon svg{width:1.5em;height:1.5em}
.entry-card .entry-icon,.cta-card .cta-icon{font-size:1.5rem}
.biz-card .biz-icon{font-size:2rem}.product-card .prod-icon{font-size:1.75rem}.contact-card .c-icon{font-size:2.25rem}.pos-card .pos-icon{font-size:2rem}.dim-card .dim-icon{font-size:1.75rem}
.feature-item .fi-icon svg{width:1.75rem;height:1.75rem}
.hero{padding:calc(var(--nav-h) + 4rem) 0 4rem;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-alt) 100%)}
.hero-inner{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;min-width:0}.hero-text,.hero-visual{min-width:0}
.hero-text h1{margin-bottom:1.25rem}
.hero-text .hero-sub{font-size:1.125rem;color:var(--t2);line-height:1.75;margin-bottom:2rem}
.hero-diagram{width:min(510px,100%);padding:1.25rem;background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}
.hero-diagram-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.hero-diagram-head strong{font-size:.95rem}.hero-diagram-head span{font-size:.72rem;color:var(--teal);letter-spacing:.08em;text-transform:uppercase}
.hero-diagram-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:.45rem}.hero-diagram-node{padding:.85rem .55rem;background:var(--bg-alt);border:1px solid var(--border);border-radius:9px;text-align:center;min-width:0}.hero-diagram-node strong{display:block;font-size:.82rem;line-height:1.45}.hero-diagram-node span{display:block;font-size:.68rem;color:var(--t3);margin-top:.25rem}.hero-diagram-arrow{color:var(--teal);font-weight:700}.hero-diagram-note{font-size:.72rem;color:var(--t3);margin-top:.85rem}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap}
.hero-visual{display:flex;align-items:center;justify-content:center}
.entry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.entry-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:2rem 1.5rem;text-align:center;transition:all .3s;cursor:pointer;min-width:0}
.entry-card:hover{border-color:var(--teal);box-shadow:var(--shadow-md);transform:translateY(-3px)}
.entry-card .entry-icon{width:56px;height:56px;background:var(--teal-pale);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;font-size:1.5rem}
.entry-card h4{margin-bottom:.5rem;font-size:1rem}
.entry-card p{font-size:.9375rem;color:var(--t3);line-height:1.5}
.process-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1.5rem}
.process-step{padding:1.5rem;background:var(--white);border:1px solid var(--border);border-radius:var(--radius);text-align:center;min-width:0}
.process-step .step-num{width:32px;height:32px;background:var(--teal);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto .75rem;font-weight:700;font-size:.875rem}
.process-step h4{font-size:1rem;margin-bottom:.25rem}
.process-step p{font-size:.9375rem;color:var(--t3)}
.section-alt{background:var(--bg-alt)}
.section-teal-bg{background:var(--deep);color:var(--white)}
.section-teal-bg h2,.section-teal-bg h3,.section-teal-bg h4{color:var(--white)}
.section-teal-bg .section-label{color:var(--teal-bright)}
.section-teal-bg .section-intro{color:#cbd5e1}
.breadcrumb{padding:calc(var(--nav-h) + 1.5rem) 0 1rem;font-size:.9375rem;color:var(--t3)}
.breadcrumb a{color:var(--teal)}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb span{margin:0 .5rem}
.page-hero{padding:calc(var(--nav-h) + 3rem) 0 3rem;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-alt) 100%);text-align:center}
.page-hero h1{margin-bottom:1rem}
.page-hero p{font-size:1.125rem;color:var(--t2);max-width:680px;margin:0 auto;line-height:1.75}
.tag{display:inline-block;padding:.25rem .75rem;font-size:.8125rem;font-weight:600;border-radius:20px;letter-spacing:.04em}
.tag-active{background:#ecfdf5;color:#059669}
.tag-signed{background:#eff6ff;color:#2563eb}
.tag-rd{background:#fef3c7;color:#d97706}
.tag-milestone{background:#fdf2f8;color:#be185d}
.tag-building{background:#f3f4f6;color:#6b7280}
.tag-explore{background:#faf5ff;color:#9333ea}
.case-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2rem;margin-bottom:2rem}
.case-card .case-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;flex-wrap:wrap;gap:.75rem}
.case-card h3{margin-bottom:0}
.case-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:.75rem;align-items:center;margin-top:1.5rem;padding:1.5rem;background:var(--bg);border-radius:var(--radius)}
.case-flow .flow-step h4{font-size:.9375rem;color:var(--t3);margin-bottom:.25rem}
.case-flow .flow-step p{font-size:.9375rem;font-weight:500}
.case-flow .flow-arrow{color:var(--teal);font-weight:700;font-size:1.25rem}
.timeline{position:relative;padding:1rem 0}
.timeline::before{content:'';position:absolute;left:24px;top:0;bottom:0;width:2px;background:var(--border)}
.timeline-item{position:relative;padding-left:64px;padding-bottom:2.5rem}
.timeline-item:last-child{padding-bottom:0}
.timeline-item::before{content:'';position:absolute;left:16px;top:4px;width:18px;height:18px;background:var(--teal);border:3px solid var(--teal-pale);border-radius:50%}
.timeline-item h4{margin-bottom:.25rem}
.timeline-item p{color:var(--t2);font-size:.9375rem;line-height:1.65}
@media(max-width:1024px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
  .hero-inner{grid-template-columns:1fr;gap:2rem}
  .entry-grid{grid-template-columns:repeat(2,1fr)}
  .case-flow{grid-template-columns:1fr;gap:.5rem}
  .case-flow .flow-arrow{display:none}
}
@media(max-width:768px){
  .nav-links{display:none}
  .nav-mobile-toggle{display:flex}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:var(--nav-h);left:0;right:0;background:rgba(250,249,246,.98);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);padding:1rem 0;gap:0}
  .nav-links.open a{padding:.75rem 2rem;border-radius:0}
  .footer-grid{grid-template-columns:1fr;gap:2rem}
  .footer-bottom{flex-direction:column;text-align:center}
  .entry-grid{grid-template-columns:1fr}
  .process-steps{grid-template-columns:1fr 1fr}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
  .hero-diagram-flow{grid-template-columns:1fr 1fr}.hero-diagram-arrow{display:none}.hero-diagram-node{padding:.75rem .5rem}
}
@media(max-width:480px){
  .process-steps{grid-template-columns:1fr}
}

/* 桌面端保持完整句子的视觉连续性，窄屏仍按自然宽度换行 */
@media(min-width:1200px){
  .section-intro{max-width:none;white-space:nowrap}
}


/* 解决方案交付物模块 */
.deliverables{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem}
.deliverable-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;min-width:0}
.deliverable-card strong{display:block;font-size:1rem;color:var(--deep);margin-bottom:.4rem}.deliverable-card p{font-size:.9rem;color:var(--t2);line-height:1.65}
@media(max-width:768px){.deliverables{grid-template-columns:1fr}.detail-compare-grid,.detail-feature-grid{grid-template-columns:1fr!important}}

/* ===== 轻量动效 ===== */
.nav{transition:background .25s ease}
.nav-scrolled{background:rgba(250,249,246,.97);box-shadow:0 1px 0 rgba(0,0,0,.04)}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.reveal.reveal-in{opacity:1;transform:none}
@keyframes heroUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero-text h1{animation:heroUp .5s ease-out both}
.hero-sub{animation:heroUp .5s .1s ease-out both}
.hero-actions{animation:heroUp .5s .2s ease-out both}
.hero-diagram{animation:heroUp .5s .25s ease-out both}
@keyframes flowPulse{0%,100%{opacity:.4}50%{opacity:1}}
.arch-connector svg,.hero-diagram-arrow{animation:flowPulse 2.2s ease-in-out infinite}
.panel-step:not(:last-child)::after{animation:flowPulse 2.2s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero-text h1,.hero-sub,.hero-actions,.hero-diagram{animation:none}
  .arch-connector svg,.hero-diagram-arrow,.panel-step:not(:last-child)::after{animation:none}
}