/* marketing.css — 官网营销页共享样式 */
:root { --container-max: 1280px; }
body { background: var(--color-bg-secondary); color: var(--color-text-primary); font-family: var(--font-body); -webkit-font-smoothing: antialiased; }
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--sp-lg); }

/* Top nav */
.topnav { position: sticky; top: 0; z-index: var(--z-sticky); background: rgba(255,255,255,0.92); backdrop-filter: blur(12px); border-bottom: 1px solid var(--color-border-light); }
.topnav-inner { display: flex; align-items: center; gap: var(--sp-xl); height: 64px; max-width: var(--container-max); margin: 0 auto; padding: 0 var(--sp-lg); }
.brand { display: flex; align-items: center; gap: var(--sp-sm); text-decoration: none; color: var(--color-text-primary); font-weight: var(--fw-bold); font-size: var(--fs-body-lg); flex-shrink: 0; }
.brand-logo { display: inline-flex; align-items: center; }
.brand-logo img { width: 32px; height: 32px; display: block; }
.nav-links { display: flex; gap: var(--sp-lg); flex: 1; }
.nav-link { color: var(--color-text-secondary); text-decoration: none; font-size: var(--fs-small); font-weight: var(--fw-medium); padding: var(--sp-xs) 0; border-bottom: 2px solid transparent; transition: color 0.15s ease-out, border-color 0.15s ease-out; }
.nav-link:hover, .nav-link.active { color: var(--color-primary-700); border-bottom-color: var(--color-primary-600); }
.nav-cta { padding: var(--sp-sm) var(--sp-lg); background: var(--color-primary-600); color: white; border-radius: var(--radius-md); font-size: var(--fs-small); font-weight: var(--fw-semibold); text-decoration: none; transition: background 0.15s ease-out; }
.nav-cta:hover { background: var(--color-primary-700); }
button.nav-cta-btn { border: none; cursor: pointer; font-family: inherit; min-height: 44px; }

/* 小程序码模态框 */
.minicode-dialog { border: none; border-radius: var(--radius-lg); padding: 0; max-width: 320px; width: calc(100% - 32px); }
.minicode-dialog::backdrop { background: rgba(0,0,0,0.5); }
.minicode-dialog-inner { padding: var(--sp-2xl) var(--sp-xl) var(--sp-xl); text-align: center; }
.minicode-dialog-title { font-size: var(--fs-h3); font-weight: var(--fw-bold); color: var(--color-text-primary); margin: 0 0 var(--sp-lg); }
.minicode-dialog-img { width: 200px; height: 200px; border-radius: var(--radius-md); display: block; margin: 0 auto var(--sp-md); }
.minicode-dialog-desc { font-size: var(--fs-body); color: var(--color-text-secondary); margin: 0 0 var(--sp-lg); }
.minicode-dialog-close { padding: var(--sp-sm) var(--sp-xl); background: var(--color-primary-600); color: white; border: none; border-radius: var(--radius-md); font-size: var(--fs-small); font-weight: var(--fw-semibold); cursor: pointer; font-family: inherit; min-height: 44px; }
.minicode-dialog-close:hover { background: var(--color-primary-700); }

/* Hero / Sections */
.section { padding: var(--sp-2xl) 0; }
.section-head { text-align: center; margin-bottom: var(--sp-xl); }
.section-eyebrow { font-size: var(--fs-caption); color: var(--color-accent-600); font-weight: var(--fw-semibold); letter-spacing: 0.05em; text-transform: uppercase; margin-bottom: var(--sp-sm); }
.section-h2 { font-size: clamp(1.5rem, 2.5vw, 2.25rem); font-weight: var(--fw-bold); color: var(--color-text-primary); margin: 0 0 var(--sp-sm); letter-spacing: -0.01em; }
.section-sub { font-size: var(--fs-body); color: var(--color-text-secondary); max-width: 600px; margin: 0 auto; line-height: 1.6; }

/* Footer */
.site-footer { padding: var(--sp-2xl) 0 var(--sp-xl); background: var(--color-primary-900); color: rgba(255,255,255,0.85); }
.site-footer .container { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--sp-xl); }
.footer-brand { display: flex; align-items: center; gap: var(--sp-sm); color: white; font-weight: var(--fw-bold); font-size: var(--fs-body-lg); margin-bottom: var(--sp-sm); }
.footer-tag { font-size: var(--fs-caption); color: rgba(255,255,255,0.6); }
.footer-col h4 { font-size: var(--fs-small); color: white; margin: 0 0 var(--sp-sm); }
.footer-col a { display: block; color: rgba(255,255,255,0.7); text-decoration: none; font-size: var(--fs-caption); padding: var(--sp-xs) 0; }
.footer-col a:hover { color: white; }
.footer-bottom { text-align: center; padding-top: var(--sp-lg); margin-top: var(--sp-lg); border-top: 1px solid rgba(255,255,255,0.1); font-size: var(--fs-caption); color: rgba(255,255,255,0.5); }