
body {
    padding-top: 76px; /* 导航栏高度 + 额外间距 */
    background-color: var(--neutral-50);
    color: var(--neutral-900);
    font-family: var(--font-family-sans);
    line-height: var(--leading-normal);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.hero {
    min-height: 320px; /* 降低高度，更紧凑 */
    background: linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-primary-light) 100%);
    color: var(--surface-primary);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-brand-lg);
    padding: var(--spacing-xxl) var(--spacing-xl);
    position: relative;
    margin-bottom: var(--spacing-xxl);
}

.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top left, rgba(255, 255, 255, 0.1), transparent 60%);
    pointer-events: none;
}

.hero > .row {
    position: relative;
    z-index: 1;
}

.hero .btn-primary {
    background-color: var(--brand-accent);
    border-color: var(--brand-accent);
    color: var(--brand-primary);
    font-weight: var(--font-weight-bold);
}

.hero .btn-primary:hover {
    background-color: var(--brand-accent-light);
    border-color: var(--brand-accent-light);
}

/* 向后兼容的卡片样式 - 建议迁移到 .card-brand */
.card {
    border: 1px solid var(--neutral-200);
    border-radius: var(--radius-lg);
    background: var(--surface-primary);
    transition: all var(--transition-base);
    box-shadow: var(--shadow-sm);
}

.card.shadow-sm {
    box-shadow: var(--shadow-sm);
}

.card:hover {
    border-color: var(--brand-primary);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

/* 向后兼容的按钮样式 - 建议迁移到 .btn-brand */
.btn-primary {
    border-radius: var(--radius-md);
    font-weight: var(--font-weight-semibold);
    padding: var(--spacing-md) var(--spacing-xl);
    transition: all var(--transition-base);
    border: 2px solid transparent;
}

.btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.product-index-header,
.market-index-header {
    padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-lg);
    border-radius: var(--radius-lg);
    background: var(--surface-primary);
    box-shadow: var(--shadow-sm);
    margin-bottom: var(--spacing-lg);
}

.section-card {
    min-height: 180px; /* 更紧凑 */
    border-radius: var(--radius-lg);
    background: var(--surface-primary);
    border: 1px solid var(--neutral-200);
    padding: var(--spacing-xl);
}


footer {
    margin-top: var(--spacing-xxl);
    padding-top: var(--spacing-xl);
    border-top: 1px solid var(--neutral-200);
    background-color: var(--surface-secondary);
    color: var(--neutral-700);
}
