/* ==========================================
   qingdaolocal.com v9.2 — 专业感提升层
   目标：从「模板站」到「正规公司网站」
   核心手段：
   1. 字体层级强化（大标题更重、辅助更淡）
   2. 统一间距节奏（56px 垂直律动）
   3. 精细分层阴影（暖调，配合红瓦）
   4. 统一圆角系统（6/12/16 三档）
   5. 导航 active 态 + 精致 hover
   6. 全局焦点态（键盘可达性）
   7. Emoji → SVG 图标系统
   ========================================== */

:root {
  /* 精细阴影（暖调，三层） */
  --shadow-sm: 0 1px 2px rgba(41,37,36,0.04), 0 1px 3px rgba(41,37,36,0.05);
  --shadow-md: 0 2px 4px rgba(41,37,36,0.04), 0 4px 12px rgba(41,37,36,0.06);
  --shadow-lg: 0 4px 8px rgba(41,37,36,0.05), 0 12px 28px rgba(41,37,36,0.09);
  --shadow-brand: 0 2px 6px rgba(194,65,12,0.18), 0 8px 20px rgba(194,65,12,0.12);
  /* 过渡统一 */
  --t-fast: 0.15s cubic-bezier(0.16, 1, 0.3, 1);
  --t-med: 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  /* 字体层级 */
  --fs-hero: clamp(1.75rem, 3.4vw, 2.4rem);
  --fs-section: clamp(1.35rem, 2.2vw, 1.65rem);
  --fs-card-title: 1rem;
  --fs-body: 0.9375rem;
  --fs-meta: 0.75rem;
}

/* ==========================================
   1. 字体层级强化
   ========================================== */
body {
  font-size: var(--fs-body);
  line-height: 1.7;
  letter-spacing: 0.01em;
  text-rendering: optimizeLegibility;
}

/* 区块标题：更大更重 */
.section-header.ed-style .section-title {
  font-size: var(--fs-section);
  font-weight: 800;
  letter-spacing: -0.015em;
}

/* 侧栏标题 */
.sidebar-title.ed-side-title {
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* 卡片标题 */
.news-card.ed-news-card .news-card-title {
  font-size: var(--fs-card-title);
  font-weight: 600;
  letter-spacing: 0.005em;
  line-height: 1.55;
}

/* 辅助信息更淡、更小、字距微调 */
.news-card-footer,
.news-grid-meta,
.hot-reads,
.section-item-meta,
.hero-banner-meta.ed-meta {
  font-size: var(--fs-meta);
  color: var(--text-light);
  letter-spacing: 0.02em;
}

/* 数字对齐（tabular-nums） */
.stat-num.ed-num,
.hot-reads,
.news-card-footer span:first-child {
  font-variant-numeric: tabular-nums;
}

/* ==========================================
   2. 间距节奏（56px 垂直律动）
   ========================================== */
.section-block {
  margin-bottom: 3.5rem;
}
.hero-section.ed-hero {
  padding: 3rem 0 2.5rem;
}
.main-content {
  padding-bottom: 3.5rem;
  gap: 2.5rem;
}
.hero-section.ed-hero {
  gap: 1.75rem;
}
.news-grid.ed-headlines {
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}
.news-list {
  gap: 0.375rem;
}
.news-card.ed-news-card {
  padding: 0.875rem 0;
}
.category-grid.ed-cats {
  gap: 1.25rem;
}
.sidebar-card.ed-side {
  padding: 1.5rem;
}
.container[style*="margin-bottom"] {
  margin-bottom: 3.5rem !important;
}

/* ==========================================
   3. 卡片精细化
   ========================================== */
/* 统一样式：去生硬阴影，用精细分层 */
.news-grid-card.ed-card,
.news-card.ed-news-card,
.sidebar-card.ed-side,
.stat-card.ed-stat,
.category-card.ed-cat-card {
  transition: transform var(--t-med), box-shadow var(--t-med), border-color var(--t-med);
}

/* 带阴影的元素（原来用 --card-shadow 的地方） */
.hero-grid-item.ed-item {
  box-shadow: none;
  border-bottom: 1px solid var(--border);
}

/* 卡片hover统一 */
.news-grid-card.ed-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.news-card.ed-news-card:hover {
  box-shadow: none;
  background: var(--primary-light);
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  transform: none;
}
.category-card.ed-cat-card:hover {
  transform: translateX(6px);
  box-shadow: var(--shadow-sm);
}
.stat-card.ed-stat:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

/* 圆角统一：卡片12px（--radius-lg）*/
.news-grid-card.ed-card,
.sidebar-card.ed-side,
.stat-card.ed-stat,
.category-card.ed-cat-card {
  border-radius: var(--radius-lg);
}

/* ==========================================
   4. 导航精细化
   ========================================== */
.top-nav {
  height: 72px;
  border-bottom: 1px solid rgba(41,37,36,0.06);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.top-nav.scrolled {
  box-shadow: 0 1px 12px rgba(41,37,36,0.06);
}
.hero-section.ed-hero {
  margin-top: 72px;
}
@media (max-width: 1024px) {
  .nav-links.show { top: 72px; }
}

/* 导航链接：更精致 */
.nav-link {
  font-size: 0.875rem;
  font-weight: 500;
  padding: 9px 16px;
  border-radius: var(--radius-sm);
  transition: color var(--t-fast), background var(--t-fast);
}
.nav-link:hover {
  color: var(--primary);
  background: var(--primary-light);
}
.nav-link::after {
  display: none; /* 移除下划线，用背景代替 */
}
/* 当前页 active 态（JS 标记） */
.nav-link.active {
  color: var(--primary);
  background: var(--primary-light);
  font-weight: 600;
}

/* Logo 微调 */
.nav-logo-text {
  font-size: 1.25rem;
  letter-spacing: -0.01em;
}

/* ==========================================
   5. 按钮/标签统一
   ========================================== */
/* 主按钮：品牌阴影 + 更精致的hover */
.welfare-btn {
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-brand);
  transition: transform var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);
  letter-spacing: 0.03em;
  font-weight: 600;
}
.welfare-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(194,65,12,0.25), 0 12px 28px rgba(194,65,12,0.15);
}

/* Hero 标签：锐角小标签统一 */
.hero-banner-tag.ed-tag {
  border-radius: 4px;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 4px 12px;
  text-transform: uppercase;
}

/* ==========================================
   6. 全局焦点态（键盘可达性）
   ========================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ==========================================
   7. SVG 图标系统（替换 emoji）
   ========================================== */
.icon-inline {
  width: 1.1em;
  height: 1.1em;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: -0.2em;
  flex-shrink: 0;
}
.section-title .icon-inline,
.sidebar-title .icon-inline {
  width: 1.25em;
  height: 1.25em;
  color: var(--primary);
}

/* ==========================================
   8. 热榜条目精致化
   ========================================== */
.hot-item.ed-hot {
  padding: 10px 6px;
  border-radius: var(--radius-sm);
  transition: background var(--t-fast), padding-left var(--t-med);
}
.hot-item.ed-hot:hover {
  background: var(--primary-light);
  padding-left: 10px;
}
.hot-rank.ed-rank {
  width: 24px;
  height: 24px;
  font-size: 0.75rem;
  font-weight: 700;
  border-radius: var(--radius-sm);
}
.hot-title {
  font-size: 0.8125rem;
  font-weight: 500;
}

/* ==========================================
   9. 工具入口精致化
   ========================================== */
.tools-entry-item.ed-tool {
  border-radius: var(--radius-md);
  padding: 11px 12px;
  font-size: 0.8125rem;
  transition: all var(--t-fast);
}
.tools-entry-item.ed-tool:hover {
  transform: translateX(2px);
}

/* ==========================================
   10. 页脚微调
   ========================================== */
.site-footer {
  border-top: 4px solid var(--primary);
  padding-top: 3.5rem;
}
.footer-grid {
  gap: 3rem;
}
.footer-col a {
  padding: 5px 0;
  font-size: 0.8125rem;
  transition: color var(--t-fast), padding-left var(--t-med);
}

/* ==========================================
   11. 统计区
   ========================================== */
.stat-card.ed-stat {
  border-top: 3px solid var(--primary);
  transition: transform var(--t-med), box-shadow var(--t-med);
}
.stat-num.ed-num {
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.stat-label {
  font-size: 0.8125rem;
  color: var(--text-muted);
  letter-spacing: 0.04em;
}

/* ==========================================
   12. 响应式微调
   ========================================== */
@media (max-width: 768px) {
  .hero-section.ed-hero { padding: 1.5rem 0 1.25rem; }
  .section-block { margin-bottom: 2.5rem; }
  .news-card.ed-news-card .news-card-title { font-size: 0.9375rem; }
  .section-header.ed-style .section-title { font-size: 1.25rem; }
}

/* ==========================================
   13. 板块页顶部偏移（fixed 导航遮挡修复）
   ========================================== */
/* jobs 页 */
.jobs-hero {
  margin-top: 96px !important;
}
/* housing 页 */
.page-wrap {
  padding-top: 96px !important;
}
/* market 页（main 已内联 padding-top，这里兜底） */
main.container {
  padding-top: 96px !important;
}
.search-bar {
  margin-top: 72px;
}
/* 通用：任何直接跟在导航后的内容 */
main:not(.container) {
  padding-top: 96px;
}

/* ==========================================
   14. nav-pills 隐藏（market 冗余二级导航）
   ========================================== */
.nav-pills {
  display: none !important;
}
