/*
 * 页面专属样式：home
 *
 * 由交付包样板的 <style> 提取，共用部分已经上移到 components.css。
 */

html, body {
	margin:0;
	padding:0;
	scroll-behavior:smooth;
}
h1, h2, h3 {
	font-family:'Fraunces',serif;
	font-weight:600;
	margin:0;
	letter-spacing:-.01em;
}
p { margin:0; }
.wrap {
	max-width:1120px;
	margin:0 auto;
	padding:0 28px;
}
.btn {
	padding:9px 18px;
	border-radius:10px;
	font-size:13.8px;
	font-weight:600;
	cursor:pointer;
	display:inline-flex;
	align-items:center;
	gap:6px;
}
.btn-ghost {
	color:var(--ink);
	border:1px solid var(--border);
}
.btn-ghost:hover { background:var(--bg-soft); }
.btn-dark {
	background:var(--ink);
	color:#fff;
}
.btn-dark:hover { background:#000; }
.btn-lg {
	padding:13px 26px;
	font-size:15px;
	border-radius:12px;
}
.hero {
	padding:88px 0 60px;
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:56px;
	align-items:center;
}
.eyebrow {
	display:inline-flex;
	align-items:center;
	gap:7px;
	font-size:12.5px;
	color:var(--accent);
	background:var(--accent-soft);
	padding:6px 12px;
	border-radius:999px;
	font-weight:600;
	margin-bottom:20px;
}
.eyebrow span.dot {
	width:6px;
	height:6px;
	border-radius:50%;
	background:var(--accent);
}
.hero h1 {
	font-size:44px;
	line-height:1.12;
	margin-bottom:20px;
}
.hero h1 em {
	font-style:normal;
	color:var(--accent);
}
.hero p.lead {
	font-size:16.5px;
	color:#4B4B52;
	line-height:1.65;
	max-width:460px;
	margin-bottom:32px;
}
.hero-ctas {
	display:flex;
	gap:12px;
	align-items:center;
}
.hero-note {
	font-size:12.5px;
	color:var(--ink-soft);
	margin-top:14px;
}
.hero-visual {
	border:1px solid var(--border);
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-lg);
	padding:16px;
	background:#fff;
}
.hv-canvas {
	width:100%;
	aspect-ratio:4/3;
	border-radius:12px;
	background:linear-gradient(160deg,#F0E9D8,#E3D9C2 45%,#D2C4A2);
	position:relative;
	overflow:hidden;
}
.hv-canvas .tag {
	position:absolute;
	top:10px;
	left:10px;
	background:rgba(255,255,255,.85);
	font-size:10.5px;
	padding:4px 9px;
	border-radius:999px;
	color:var(--ink-soft);
	border:1px solid var(--border);
}
.hv-thread {
	display:flex;
	gap:8px;
	margin-top:12px;
}
.hv-thumb {
	width:44px;
	height:44px;
	border-radius:8px;
	border:1px solid var(--border);
	flex-shrink:0;
}
.hv-thumb.active { border:2px solid var(--accent); }
.hv-composer {
	margin-top:12px;
	border:1px solid var(--border);
	border-radius:999px;
	display:flex;
	align-items:center;
	gap:8px;
	padding:9px 10px 9px 16px;
}
.hv-composer span {
	font-size:13px;
	color:var(--ink-soft);
	flex:1;
}
.hv-composer .go {
	width:28px;
	height:28px;
	border-radius:50%;
	background:var(--ink);
	flex-shrink:0;
	display:flex;
	align-items:center;
	justify-content:center;
}
.hv-composer .go svg {
	width:13px;
	height:13px;
}
.audience {
	padding:36px 0;
	border-top:1px solid var(--border);
	border-bottom:1px solid var(--border);
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	gap:20px;
}
.aud-item {
	display:flex;
	align-items:center;
	gap:10px;
	font-size:14px;
	color:#3F3F45;
	font-weight:500;
}
.aud-item .ic {
	width:34px;
	height:34px;
	border-radius:9px;
	background:var(--bg-soft);
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--ink);
}
.aud-item .ic svg {
	width:17px;
	height:17px;
}
.section { padding:88px 0; }
.section-head {
	max-width:560px;
	margin-bottom:48px;
}
.section-head .kicker {
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.08em;
	color:var(--accent);
	font-weight:700;
	margin-bottom:12px;
}
.section-head h2 {
	font-size:30px;
	margin-bottom:12px;
}
.section-head p {
	font-size:15px;
	color:var(--ink-soft);
	line-height:1.6;
}
.feat-grid {
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:16px;
}
.feat-card {
	border:1px solid var(--border);
	border-radius:var(--radius);
	padding:26px;
	background:#fff;
}
.feat-card .fi {
	width:38px;
	height:38px;
	border-radius:10px;
	background:var(--accent-soft);
	color:var(--accent);
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:18px;
}
.feat-card .fi svg {
	width:19px;
	height:19px;
}
.feat-card h3 {
	font-size:16.5px;
	font-family:'Inter',sans-serif;
	font-weight:600;
	margin-bottom:8px;
}
.feat-card p {
	font-size:13.5px;
	color:#4B4B52;
	line-height:1.6;
}
.steps {
	background:var(--bg-soft);
	border-radius:var(--radius-lg);
	padding:52px 48px;
}
.steps-grid {
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:36px;
	margin-top:8px;
}
.step .num {
	font-family:'Fraunces',serif;
	font-size:34px;
	color:var(--accent);
	font-weight:600;
	margin-bottom:14px;
}
.step h3 {
	font-size:16px;
	font-family:'Inter',sans-serif;
	font-weight:600;
	margin-bottom:8px;
}
.step p {
	font-size:13.5px;
	color:#4B4B52;
	line-height:1.6;
}
.price-preview {
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:14px;
}
.pp-card {
	border:1px solid var(--border);
	border-radius:var(--radius);
	padding:22px 20px;
	background:#fff;
}
.pp-card.hi {
	border-color:var(--accent);
	box-shadow:0 0 0 3px var(--accent-soft);
}
.pp-card h3 {
	font-size:14.5px;
	font-family:'Inter',sans-serif;
	font-weight:600;
	margin-bottom:10px;
}
.pp-card .price {
	font-size:22px;
	font-family:'Fraunces',serif;
	font-weight:600;
	margin-bottom:4px;
}
.pp-card .price small {
	font-size:11.5px;
	color:var(--ink-soft);
	font-family:'Inter',sans-serif;
	font-weight:400;
}
.pp-card .q {
	font-size:11.5px;
	color:var(--ink-soft);
}
.price-more {
	text-align:center;
	margin-top:28px;
}
.price-more a {
	font-size:13.5px;
	color:var(--ink);
	font-weight:600;
	border-bottom:1.5px solid var(--ink);
	padding-bottom:2px;
}
.final-cta {
	border-radius:var(--radius-lg);
	background:var(--ink);
	color:#fff;
	padding:64px 56px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:40px;
}
.final-cta h2 {
	color:#fff;
	font-size:28px;
	margin-bottom:10px;
}
.final-cta p {
	color:#B9B9C0;
	font-size:14.5px;
	max-width:380px;
	line-height:1.6;
}
.final-cta .btn-dark {
	background:#fff;
	color:var(--ink);
}
.final-cta .btn-dark:hover { background:#EDEDED; }
@media (max-width:960px) {
  .hero {
  	grid-template-columns:1fr;
  	padding-top:60px;
  }
  .hero h1 { font-size:32px; }
  .feat-grid { grid-template-columns:1fr; }
  .steps-grid {
  	grid-template-columns:1fr;
  	gap:26px;
  }
  .steps { padding:36px 26px; }
  .price-preview { grid-template-columns:repeat(2,1fr); }
  .final-cta {
  	flex-direction:column;
  	text-align:center;
  	padding:44px 30px;
  }
  .pub-nav { display:none; }
  .audience { justify-content:flex-start; }
}

/* 另有 11 条顶栏 / 页脚 / 语言切换器规则已摘除 —— 
   站点外壳由 header.php + footer.php + theme.css 统一负责，
   页面各留一份会覆盖掉规范版本。 */
