/* 商标知识站 - 全站样式 */
:root {
  --primary: #1a365d;
  --secondary: #2c5282;
  --accent: #c05621;
  --bg: #ffffff;
  --bg-alt: #f7fafc;
  --text: #1a202c;
  --text-secondary: #4a5568;
  --border: #a0aec0;
  --radius: 4px;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 16px; line-height: 1.8; color: var(--text); background: var(--bg);
}
a { color: var(--secondary); text-decoration: none; }
a:hover { color: var(--accent); }

/* Header */
.site-header {
  background: var(--primary); color: #fff; padding: 0 20px;
  position: sticky; top: 0; z-index: 100;
}
.header-inner {
  max-width: 1100px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  height: 56px;
}
.site-logo { font-size: 20px; font-weight: 700; color: #fff; }
.site-logo:hover { color: #fff; }
.nav-links { display: flex; gap: 24px; }
.nav-links a { color: rgba(255,255,255,.85); font-size: 15px; }
.nav-links a:hover { color: #fff; }
.header-phone { color: rgba(255,255,255,.9); font-size: 14px; white-space: nowrap; }

/* Breadcrumb */
.breadcrumb {
  max-width: 1100px; margin: 0 auto; padding: 16px 20px;
  font-size: 14px; color: var(--text-secondary);
}
.breadcrumb a { color: var(--secondary); }

/* Main content */
.container { max-width: 800px; margin: 0 auto; padding: 0 20px 60px; }

/* Hero (homepage only) */
.hero {
  background: var(--bg-alt); padding: 48px 20px; text-align: center;
}
.hero h1 { font-size: 28px; font-weight: 700; color: var(--primary); margin-bottom: 12px; }
.hero p { color: var(--text-secondary); max-width: 600px; margin: 0 auto; }

/* Category cards */
.category-grid {
  max-width: 1100px; margin: -24px auto 0; padding: 0 20px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px;
}
.category-card {
  background: #fff; border: 1px solid #e2e8f0; border-radius: var(--radius);
  padding: 24px; transition: box-shadow .2s;
}
.category-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,.08); }
.category-card h3 { font-size: 18px; color: var(--primary); margin-bottom: 8px; }
.category-card p { font-size: 14px; color: var(--text-secondary); }
.category-card .card-link {
  display: inline-block; margin-top: 12px; font-size: 14px; color: var(--accent); font-weight: 600;
}

/* Section */
.section { max-width: 1100px; margin: 40px auto 0; padding: 0 20px; }
.section-title {
  font-size: 22px; font-weight: 700; color: var(--primary);
  padding-bottom: 12px; border-bottom: 2px solid var(--primary); margin-bottom: 20px;
}

/* Article list */
.article-list { list-style: none; }
.article-list li {
  padding: 12px 0; border-bottom: 1px solid #e2e8f0;
  display: flex; justify-content: space-between; align-items: center;
}
.article-list li:last-child { border-bottom: none; }
.article-list a { font-size: 16px; }
.article-list .date { font-size: 13px; color: var(--border); white-space: nowrap; margin-left: 16px; }

/* Article page */
.article-header { margin-bottom: 28px; }
.article-header h1 { font-size: 28px; font-weight: 700; line-height: 1.3; color: var(--primary); }
.article-meta { margin-top: 10px; font-size: 14px; color: var(--text-secondary); }
.article-meta span + span { margin-left: 16px; }
.article-content h2 { font-size: 20px; font-weight: 600; color: var(--primary); margin: 32px 0 12px; }
.article-content h3 { font-size: 18px; font-weight: 600; color: var(--text); margin: 24px 0 10px; }
.article-content p { margin-bottom: 16px; }
.article-content ul, .article-content ol { margin: 0 0 16px 24px; }
.article-content li { margin-bottom: 6px; }
.article-content strong { color: var(--primary); }

/* Related articles */
.related { margin-top: 48px; padding-top: 24px; border-top: 1px solid #e2e8f0; }
.related h3 { font-size: 18px; color: var(--primary); margin-bottom: 12px; }
.related ul { list-style: none; }
.related li { padding: 6px 0; }
.related a { font-size: 15px; }

/* Friend links (homepage only) */
.friend-links {
  max-width: 1100px; margin: 40px auto 0; padding: 0 20px 20px;
}
.friend-links h3 { font-size: 16px; color: var(--text-secondary); margin-bottom: 10px; }
.friend-links .links { display: flex; flex-wrap: wrap; gap: 16px; }
.friend-links a { font-size: 14px; color: var(--text-secondary); }

/* Footer */
.site-footer {
  background: var(--primary); color: rgba(255,255,255,.7); text-align: center;
  padding: 24px 20px; font-size: 14px; margin-top: 40px;
}
.site-footer a { color: rgba(255,255,255,.85); }

/* Category page */
.category-header { margin-bottom: 24px; }
.category-header h1 { font-size: 28px; font-weight: 700; color: var(--primary); }
.category-header p { color: var(--text-secondary); margin-top: 8px; }

/* Responsive */
@media (max-width: 768px) {
  .header-inner { flex-wrap: wrap; height: auto; padding: 12px 0; gap: 8px; }
  .nav-links { gap: 14px; flex-wrap: wrap; }
  .hero h1 { font-size: 22px; }
  .article-header h1, .category-header h1 { font-size: 22px; }
  .category-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .category-grid { grid-template-columns: 1fr; }
}