/* ============================================================
   taste.css — 一维一教育官网视觉覆盖层 v1
   依据 Taste Skill (anti-slop) + Redesign Skill 审计规则生成
   设计判读: trust-first 本地服务平台 · redesign-preserve
   旋钮: DESIGN_VARIANCE 3 / MOTION_INTENSITY 2 / VISUAL_DENSITY 4
   单一 accent = 品牌红 #BC1A25（与 LOGO 同源 RGB 188,26,37）
   铁律: 不动内容 / Schema / 标题层级 / 内链结构
   回滚: 删除页内 <link ... "/css/taste.css"> 一行即恢复原样
   ============================================================ */

/* ---------- 1. 设计令牌 ---------- */
:root {
  --yw-red: #BC1A25;        /* 品牌红：唯一 accent */
  --yw-red-dark: #8F1220;
  --yw-red-bright: #EF4B5D; /* 深底上的红（对比达标） */
  --yw-red-tint: #FDF1F2;   /* 红色 5% 淡底 */
  --yw-ink: #0F172A;        /* 墨蓝黑 slate-900 */
  --yw-ink-2: #1B2740;      /* 墨蓝 slate 同系深 tint */
  --yw-text: #1E293B;
  --yw-muted: #5B6B7E;
  --yw-line: #E5EAF0;
  --yw-card-shadow: 0 2px 12px rgba(15, 23, 42, .07);
  --yw-card-shadow-hover: 0 10px 28px rgba(15, 23, 42, .13);
  --yw-radius: 16px;
}

/* 重定义首页既有变量体系（蓝→红，橙→红，阴影去纯黑） */
:root {
  --primary: var(--yw-red);
  --primary-dark: var(--yw-red-dark);
  --accent: var(--yw-red);
  --bg: #F7F8FA;
  --text: var(--yw-text);
  --text-light: var(--yw-muted);
  --border: var(--yw-line);
  --shadow: rgba(15, 23, 42, .08);
}

/* ---------- 2. 全局基础 ---------- */
html { scroll-behavior: smooth; }
body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1, h2, h3 { text-wrap: balance; }
.stat-num, .phone, .cta-phone, .step-num { font-variant-numeric: tabular-nums; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--yw-red);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ---------- 3. 首页组件（杀蓝紫渐变 → 墨蓝纯色系） ---------- */
.header {
  background: linear-gradient(180deg, var(--yw-ink-2) 0%, var(--yw-ink) 100%);
}
.header::before { opacity: .5; }
.brand-tag {
  background: var(--yw-red);
  color: #fff;
  font-weight: 600;
  letter-spacing: .06em;
}
.top-nav a:hover { border-bottom-color: var(--yw-red); }
.std-answer {
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(255, 255, 255, .14);
}

.service-card {
  border: 1px solid var(--yw-line);
  box-shadow: var(--yw-card-shadow);
  border-radius: var(--yw-radius);
}
.service-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--yw-card-shadow-hover);
}
/* 卡片顶条：蓝渐变 → 品牌红实色 */
.service-card::before { height: 3px; background: var(--yw-red); }
.card-tutoring::before { background: var(--yw-red); }
[class*="card-"]::before { height: 3px; }
.icon-blue { background: var(--yw-red-tint); color: var(--yw-red); }
.feature-list li { color: var(--yw-muted); }
.feature-list li::before { content: '✓'; color: var(--yw-red); }

.faq-item { border: 1px solid var(--yw-line); box-shadow: none; }
.faq-q:hover { background: var(--yw-red-tint); }
.faq-q .arrow { transition: transform .25s ease; }

.contact-section {
  background: linear-gradient(180deg, var(--yw-ink-2) 0%, var(--yw-ink) 100%);
}
/* 电话 = 白底红字胶囊（深底上高对比 6.6:1，点击感强）
   注意：页内 tel: 链接带行内 style="color:#fff"，必须 !important 才能压过 */
.contact-section .phone {
  background: #fff;
  color: var(--yw-red) !important;
  display: block;
  width: fit-content;
  margin: 0 auto 16px;
  padding: 10px 32px;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .28);
}
.contact-section .phone a {
  color: var(--yw-red) !important;
  text-decoration: none;
}

/* ---------- 4. 城市页组件 ---------- */
header {
  background: linear-gradient(180deg, var(--yw-ink-2) 0%, var(--yw-ink) 100%);
}
.card {
  border-radius: var(--yw-radius);
  border: 1px solid var(--yw-line);
  box-shadow: var(--yw-card-shadow);
}
.card h2 { color: var(--yw-ink); border-left-color: var(--yw-red); }
.process-step { border-radius: 12px; }
.step-num { background: var(--yw-red); }
.contact-box {
  background: linear-gradient(180deg, var(--yw-ink-2) 0%, var(--yw-ink) 100%);
  border-radius: var(--yw-radius);
}
.contact-box .phone {
  background: #fff;
  color: var(--yw-red) !important;
  display: block;
  width: fit-content;
  margin: 16px auto;
  padding: 8px 28px;
  border-radius: 999px;
}
.contact-box .phone a {
  color: var(--yw-red) !important;
  text-decoration: none;
}

/* ---------- 5. 博客/文章页组件 ---------- */
.header { /* blog 页 class="header"，后加载覆盖蓝渐变 */
  background: linear-gradient(180deg, var(--yw-ink-2) 0%, var(--yw-ink) 100%);
}
.logo span { color: var(--yw-red-bright); }
.post-header, .post-body {
  box-shadow: var(--yw-card-shadow);
  border: 1px solid var(--yw-line);
}
.post-title { line-height: 1.45; }
.post-body h2 {
  color: var(--yw-ink);
  border-bottom: 2px solid var(--yw-red-tint);
}
.cta-box {
  background: linear-gradient(180deg, var(--yw-ink-2) 0%, var(--yw-ink) 100%);
  border-radius: var(--yw-radius);
}
.cta-phone {
  color: #fff;
  background: var(--yw-red);
  display: inline-block;
  padding: 8px 26px;
  border-radius: 999px;
  margin: 12px auto;
}

/* ---------- 6. 相关阅读内链区块 ---------- */
.rel-read { border-top: 1px solid var(--yw-line); }
.rel-read a { color: var(--yw-red); }
.rel-read a:hover { text-decoration: underline; }

/* ---------- 7. 裸 FAQ 答案页（无类名页面，:has 降级安全） ---------- */
body:not(:has([class])) {
  max-width: 720px;
  margin: 0 auto;
  padding: 40px 20px 56px;
  font-size: 16.5px;
  line-height: 1.9;
  color: var(--yw-text);
}
body:not(:has([class])) h1 {
  font-size: clamp(22px, 4vw, 28px);
  line-height: 1.45;
  padding-bottom: 14px;
  margin-bottom: 22px;
  border-bottom: 3px solid var(--yw-red);
}
body:not(:has([class])) p { margin-bottom: 14px; }
body:not(:has([class])) strong { color: var(--yw-ink); }

/* ---------- 8. 首页内链枢纽（2026-09-11 P0 新增） ---------- */
.city-hub { padding: 60px 0; background: #fff; border-top: 1px solid var(--yw-line); }
.city-hub .section-title { margin-top: 8px; }
.city-hub .section-title + .section-subtitle { margin-bottom: 22px; }
.yw-hub-cities {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  justify-content: center;
  margin-bottom: 40px;
}
.yw-hub-cities a {
  display: inline-block;
  padding: 7px 16px;
  border: 1px solid var(--yw-line);
  border-radius: 999px;
  font-size: 14px;
  color: var(--yw-text);
  text-decoration: none;
  transition: all .2s;
  background: #fff;
}
.yw-hub-cities a:hover {
  border-color: var(--yw-red);
  color: var(--yw-red);
  transform: translateY(-1px);
}
.yw-hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 22px 28px;
  margin-bottom: 44px;
}
.yw-hub-col h3 {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 2px solid var(--yw-red-tint);
}
.yw-hub-col h3 a { color: var(--yw-ink); text-decoration: none; }
.yw-hub-col h3 a:hover { color: var(--yw-red); }
.yw-hub-col ul { list-style: none; padding: 0; margin: 0; }
.yw-hub-col li { margin-bottom: 5px; font-size: 13.5px; line-height: 1.7; }
.yw-hub-col li a { color: var(--yw-muted); text-decoration: none; }
.yw-hub-col li a:hover { color: var(--yw-red); text-decoration: underline; }
@media (max-width: 600px) {
  .city-hub { padding: 40px 0; }
  .yw-hub-grid { grid-template-columns: 1fr 1fr; gap: 18px; }
  .yw-hub-col li { font-size: 13px; }
}