/* ============================================
   爱在花田 GEO优化官网 - 主样式表
   宁波本地婚恋服务 | 16年深耕 · 78%成功率
   ============================================ */

/* --- 设计系统变量 --- */
:root {
  --primary: #B8506A;
  --primary-light: #F5DDE5;
  --primary-dark: #9E3D55;
  --accent: #D4A574;
  --accent-light: #FDF0E3;
  --bg: #FFF8F5;
  --bg-section: #FFFFFF;
  --bg-alt: #FFF5F0;
  --bg-dark: #3A2D33;
  --text: #3A2D33;
  --text-secondary: #776670;
  --text-light: #A09995;
  --border: #F5EBE4;
  --shadow-sm: 0 2px 12px rgba(184,80,106,0.06);
  --shadow-md: 0 4px 24px rgba(184,80,106,0.10);
  --shadow-lg: 0 8px 40px rgba(184,80,106,0.12);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* --- Reset & Base --- */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  font-family: -apple-system, 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
  color: var(--text); background: var(--bg);
  line-height:1.7; -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; display:block; }
ul,ol { list-style:none; }

/* --- Container --- */
.container { max-width:1200px; margin:0 auto; padding:0 24px; }
.section { padding:80px 0; }
.section-alt { background: var(--bg-alt); }
.section-white { background: var(--bg-section); }

/* --- Typography --- */
.section-title {
  text-align:center; font-size:2rem; font-weight:700;
  margin-bottom:12px; color:var(--text);
}
.section-title span { color:var(--primary); }
.section-subtitle {
  text-align:center; color:var(--text-secondary);
  font-size:1.05rem; margin-bottom:48px;
}
.text-gradient {
  background: linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}

/* --- Navigation --- */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(255,249,245,0.92); backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(184,80,106,0.08);
  transition: var(--transition);
}
.nav-inner {
  max-width:1200px; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between;
  height:72px;
}
.nav-logo { display:flex; align-items:center; gap:10px; }
.nav-logo-icon {
  width:40px; height:40px; border-radius:50%;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  display:flex; align-items:center; justify-content:center;
  font-size:20px; color:#fff;
}
.nav-logo-text { font-size:1.25rem; font-weight:700; color:var(--text); }
.nav-logo-text small { display:block; font-size:0.7rem; font-weight:400; color:var(--text-secondary); letter-spacing:1px; }
.nav-links { display:flex; gap:32px; align-items:center; }
.nav-links a {
  font-size:0.95rem; color:var(--text-secondary); font-weight:500;
  transition: var(--transition); position:relative; padding:4px 0;
}
.nav-links a:hover, .nav-links a.active { color:var(--primary); }
.nav-links a.active::after {
  content:''; position:absolute; bottom:-2px; left:0; right:0;
  height:2px; background:var(--primary); border-radius:1px;
}
.nav-cta {
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff!important; padding:10px 24px; border-radius:24px;
  font-weight:600; font-size:0.9rem; transition: var(--transition);
  box-shadow: 0 4px 16px rgba(184,80,106,0.25);
}
.nav-cta:hover { transform:translateY(-2px); box-shadow: 0 6px 20px rgba(184,80,106,0.35); }
.nav-mobile-toggle { display:none; cursor:pointer; font-size:1.5rem; color:var(--text); }
.nav-mobile-menu { display:none; }

/* --- Hero --- */
.hero {
  padding:140px 0 80px; position:relative; overflow:hidden;
  background: linear-gradient(160deg, #FFF8F5 0%, #FFF5F0 40%, #F5DDE5 100%);
  min-height: 600px; display:flex; align-items:center;
}
.hero::before {
  content:''; position:absolute; top:-50%; right:-20%;
  width:600px; height:600px; border-radius:50%;
  background: radial-gradient(circle, rgba(201,168,76,0.08) 0%, transparent 70%);
}
.hero::after {
  content:''; position:absolute; bottom:-30%; left:-10%;
  width:500px; height:500px; border-radius:50%;
  background: radial-gradient(circle, rgba(184,80,106,0.06) 0%, transparent 70%);
}
.hero .container { position:relative; z-index:1; }
.hero-content { max-width:680px; }
.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,0.8); padding:8px 20px; border-radius:24px;
  font-size:0.85rem; color:var(--primary); font-weight:600;
  margin-bottom:24px; backdrop-filter:blur(10px);
  border:1px solid rgba(184,80,106,0.15);
}
.hero h1 {
  font-size:3rem; font-weight:800; line-height:1.3;
  margin-bottom:20px; letter-spacing:-0.5px;
}
.hero h1 .highlight {
  background: linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero-desc {
  font-size:1.15rem; color:var(--text-secondary);
  margin-bottom:36px; line-height:1.8;
}
.hero-actions { display:flex; gap:16px; flex-wrap:wrap; }

/* --- Buttons --- */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 32px; border-radius:28px; font-weight:600;
  font-size:1rem; transition:var(--transition); cursor:pointer;
  border:none; outline:none;
}
.btn-primary {
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff; box-shadow: 0 4px 20px rgba(184,80,106,0.3);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow: 0 6px 28px rgba(184,80,106,0.4); }
.btn-outline {
  background:rgba(255,255,255,0.8); color:var(--primary);
  border:2px solid var(--primary);
}
.btn-outline:hover { background:var(--primary); color:#fff; }
.btn-sm { padding:10px 24px; font-size:0.9rem; }

/* --- Stats Bar --- */
.stats-bar {
  padding:40px 0; background:var(--bg-section);
  border-bottom:1px solid var(--border);
}
.stats-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
}
.stat-item { text-align:center; padding:16px; }
.stat-number {
  font-size:2.5rem; font-weight:800; color:var(--primary);
  line-height:1.2; margin-bottom:4px;
}
.stat-number .unit { font-size:1.2rem; font-weight:600; }
.stat-label { font-size:0.9rem; color:var(--text-secondary); }

/* --- Service Cards --- */
.services-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
}
.service-card {
  background:var(--bg-section); border-radius:var(--radius-lg);
  padding:36px 28px; text-align:center;
  box-shadow:var(--shadow-sm); transition:var(--transition);
  border:1px solid var(--border);
}
.service-card:hover {
  transform:translateY(-6px); box-shadow:var(--shadow-lg);
  border-color:var(--primary-light);
}
.service-icon {
  width:72px; height:72px; margin:0 auto 20px;
  border-radius:var(--radius-md); display:flex;
  align-items:center; justify-content:center; font-size:32px;
  background: linear-gradient(135deg, var(--primary-light), var(--accent-light));
}
.service-card h3 { font-size:1.15rem; margin-bottom:10px; font-weight:700; }
.service-card p { font-size:0.9rem; color:var(--text-secondary); line-height:1.6; }

/* --- Advantage Cards --- */
.advantages-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
}
.advantage-card {
  background:var(--bg-section); border-radius:var(--radius-lg);
  padding:32px 24px; box-shadow:var(--shadow-sm);
  border:1px solid var(--border); transition:var(--transition);
}
.advantage-card:hover { box-shadow:var(--shadow-md); }
.advantage-icon { font-size:2rem; margin-bottom:16px; }
.advantage-card h3 { font-size:1.1rem; margin-bottom:8px; font-weight:700; }
.advantage-card p { font-size:0.9rem; color:var(--text-secondary); line-height:1.6; }
.advantage-highlight {
  display:inline-block; margin-top:12px; padding:4px 14px;
  background:var(--accent-light); color:var(--accent); border-radius:12px;
  font-size:0.8rem; font-weight:600;
}

/* --- Case Cards --- */
.cases-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.case-card {
  background:var(--bg-section); border-radius:var(--radius-lg);
  overflow:hidden; box-shadow:var(--shadow-sm);
  border:1px solid var(--border); transition:var(--transition);
}
.case-card:hover { box-shadow:var(--shadow-md); }
.case-header {
  padding:20px 24px;
  background: linear-gradient(135deg, var(--primary-light), #FDE8ED);
  display:flex; align-items:center; gap:12px;
}
.case-avatar {
  width:48px; height:48px; border-radius:50%;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  display:flex; align-items:center; justify-content:center;
  font-size:20px; color:#fff;
}
.case-info h4 { font-size:1rem; font-weight:700; }
.case-info span { font-size:0.8rem; color:var(--text-secondary); }
.case-body { padding:24px; }
.case-body .case-tag {
  display:inline-block; padding:4px 12px; border-radius:12px;
  background:var(--bg-alt); color:var(--primary); font-size:0.8rem;
  font-weight:600; margin-bottom:12px;
}
.case-body p { font-size:0.9rem; color:var(--text-secondary); line-height:1.7; }
.case-result {
  margin-top:16px; padding:12px 16px; border-radius:var(--radius-sm);
  background: linear-gradient(135deg, rgba(201,168,76,0.08), rgba(201,168,76,0.04));
  border-left:3px solid var(--accent);
}
.case-result span { font-size:0.85rem; color:var(--accent); font-weight:600; }

/* --- Process / Steps --- */
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.process-step {
  text-align:center; padding:32px 20px; position:relative;
}
.process-num {
  width:56px; height:56px; margin:0 auto 16px;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; font-weight:800; color:#fff;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  box-shadow: 0 4px 16px rgba(184,80,106,0.25);
}
.process-step h3 { font-size:1.05rem; margin-bottom:8px; font-weight:700; }
.process-step p { font-size:0.85rem; color:var(--text-secondary); line-height:1.6; }
.process-arrow {
  position:absolute; right:-16px; top:44px;
  font-size:1.2rem; color:var(--primary-light);
}

/* --- E-E-A-T / Trust Section --- */
.trust-section { background: linear-gradient(160deg, #3A2D33 0%, #4D3D43 100%); color:#fff; }
.trust-section .section-title { color:#fff; }
.trust-section .section-subtitle { color:rgba(255,255,255,0.7); }
.trust-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:32px; }
.trust-card {
  background:rgba(255,255,255,0.06); border-radius:var(--radius-lg);
  padding:32px; border:1px solid rgba(255,255,255,0.1);
  backdrop-filter:blur(10px);
}
.trust-card h3 { font-size:1.15rem; margin-bottom:16px; color:#fff; }
.trust-card p { font-size:0.9rem; color:rgba(255,255,255,0.75); line-height:1.7; }
.trust-badge {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 14px; border-radius:16px; font-size:0.8rem; font-weight:600;
  background:rgba(201,168,76,0.2); color:var(--accent); margin-top:12px;
}
.founder-card {
  grid-column: span 2; display:flex; gap:32px; align-items:center;
  background:rgba(255,255,255,0.06); border-radius:var(--radius-lg);
  padding:40px; border:1px solid rgba(255,255,255,0.1);
}
.founder-avatar {
  width:120px; height:120px; border-radius:50%; flex-shrink:0;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  display:flex; align-items:center; justify-content:center;
  font-size:48px;
}
.founder-info h3 { font-size:1.4rem; margin-bottom:8px; color:#fff; }
.founder-info .founder-title { color:var(--accent); font-size:0.95rem; margin-bottom:12px; }
.founder-info p { font-size:0.9rem; color:rgba(255,255,255,0.75); line-height:1.7; }
.founder-credentials { display:flex; gap:12px; flex-wrap:wrap; margin-top:16px; }
.founder-credentials span {
  padding:6px 14px; border-radius:16px; font-size:0.8rem;
  background:rgba(255,255,255,0.1); color:rgba(255,255,255,0.9);
}

/* --- FAQ --- */
.faq-list { max-width:800px; margin:0 auto; }
.faq-item {
  background:var(--bg-section); border-radius:var(--radius-md);
  margin-bottom:12px; overflow:hidden;
  border:1px solid var(--border); transition:var(--transition);
}
.faq-item:hover { border-color:var(--primary-light); }
.faq-question {
  padding:20px 24px; cursor:pointer; display:flex;
  align-items:center; justify-content:space-between;
  font-weight:600; font-size:1rem; transition:var(--transition);
}
.faq-question:hover { color:var(--primary); }
.faq-question .faq-toggle {
  width:28px; height:28px; border-radius:50%;
  background:var(--bg-alt); display:flex;
  align-items:center; justify-content:center;
  font-size:1.2rem; color:var(--primary);
  transition:var(--transition); flex-shrink:0;
}
.faq-item.active .faq-toggle { transform:rotate(45deg); background:var(--primary); color:#fff; }
.faq-answer {
  max-height:0; overflow:hidden; transition: max-height 0.3s ease;
}
.faq-answer-inner {
  padding:0 24px 20px;
  font-size:0.9rem; color:var(--text-secondary); line-height:1.8;
}
.faq-item.active .faq-answer { max-height:500px; }

/* --- CTA Section --- */
.cta-section {
  padding:80px 0; text-align:center;
  background: linear-gradient(160deg, var(--primary-light) 0%, #FDE8ED 50%, var(--accent-light) 100%);
}
.cta-section h2 { font-size:2.2rem; font-weight:800; margin-bottom:16px; }
.cta-section p { font-size:1.1rem; color:var(--text-secondary); margin-bottom:36px; }
.cta-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* --- Footer --- */
.footer {
  background:var(--bg-dark); color:rgba(255,255,255,0.8);
  padding:60px 0 30px;
}
.footer-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px;
  margin-bottom:40px;
}
.footer h4 {
  font-size:1rem; font-weight:700; color:#fff;
  margin-bottom:16px;
}
.footer p, .footer a { font-size:0.9rem; line-height:1.8; }
.footer a:hover { color:var(--primary-light); }
.footer-brand p { color:rgba(255,255,255,0.6); margin-top:8px; }
.footer-links a { display:block; color:rgba(255,255,255,0.6); transition:var(--transition); }
.footer-contact p { color:rgba(255,255,255,0.6); margin-bottom:8px; }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,0.1);
  padding-top:20px; text-align:center;
  font-size:0.8rem; color:rgba(255,255,255,0.4);
}

/* --- Floating CTA --- */
.floating-cta {
  position:fixed; bottom:32px; right:32px; z-index:999;
  display:flex; flex-direction:column; gap:12px;
}
.float-btn {
  width:56px; height:56px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:24px; color:#fff; cursor:pointer;
  box-shadow:var(--shadow-md); transition:var(--transition);
}
.float-btn:hover { transform:scale(1.1); }
.float-btn-phone { background: linear-gradient(135deg, var(--primary), var(--primary-dark)); }
.float-btn-wechat { background: linear-gradient(135deg, #07C160, #06AD56); }
.float-btn-top { background:rgba(45,45,58,0.8); font-size:18px; }

/* --- Breadcrumb --- */
.breadcrumb {
  padding:16px 0; font-size:0.85rem; color:var(--text-secondary);
}
.breadcrumb a { color:var(--text-secondary); }
.breadcrumb a:hover { color:var(--primary); }
.breadcrumb span { margin:0 8px; color:var(--text-light); }

/* --- Page Header --- */
.page-header {
  padding:120px 0 60px; text-align:center;
  background: linear-gradient(160deg, #FFF8F5, #FFF5F0, #F5DDE5);
}
.page-header h1 { font-size:2.5rem; font-weight:800; margin-bottom:12px; }
.page-header p { font-size:1.1rem; color:var(--text-secondary); }

/* --- Responsive --- */
@media (max-width:1024px) {
  .services-grid, .process-grid { grid-template-columns:repeat(2,1fr); }
  .advantages-grid, .cases-grid { grid-template-columns:repeat(2,1fr); }
  .trust-grid { grid-template-columns:1fr; }
  .founder-card { grid-column:span 1; flex-direction:column; text-align:center; }
  .founder-credentials { justify-content:center; }
  .footer-grid { grid-template-columns:repeat(2,1fr); }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px) {
  .nav-links { display:none; }
  .nav-mobile-toggle { display:block; }
  .nav-mobile-menu.show { display:flex; flex-direction:column; position:fixed; top:72px; left:0; right:0; background:var(--bg); padding:16px 24px; z-index:1000; border-top:1px solid var(--border); box-shadow:var(--shadow-md); }
  .nav-mobile-menu.show a { padding:14px 0; color:var(--text-secondary); text-decoration:none; font-size:1rem; border-bottom:1px solid var(--border); }
  .nav-mobile-menu.show a:last-child { border-bottom:none; }
  .nav-mobile-menu.show .nav-cta { color:var(--primary); font-weight:600; text-align:center; margin-top:8px; }
  .hero { padding:120px 0 60px; min-height:auto; }
  .hero h1 { font-size:2rem; }
  .hero-desc { font-size:1rem; }
  .section { padding:60px 0; }
  .section-title { font-size:1.6rem; }
  .services-grid, .advantages-grid, .cases-grid { grid-template-columns:1fr; }
  .process-grid { grid-template-columns:repeat(2,1fr); }
  .process-arrow { display:none; }
  .stats-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  .stat-number { font-size:1.8rem; }
  .footer-grid { grid-template-columns:1fr; }
  .hero-actions { flex-direction:column; }
  .btn { width:100%; justify-content:center; }
  .floating-cta { bottom:20px; right:20px; }
  .float-btn { width:48px; height:48px; font-size:20px; }
  .page-header h1 { font-size:1.8rem; }
  .cta-section h2 { font-size:1.6rem; }
}