/* 珈程旅行社 - 单页模式全局样式 */
:root {
  --ink-green:    #4a7c59;
  --ink-dark:     #2d5016;
  --ink-light:    #7aa87e;
  --ink-pale:     #dce8db;
  --rice-paper:   #faf6f0;
  --rice-dark:    #f0ebe0;
  --text-main:    #3a3a3a;
  --text-light:   #7a7a7a;
  --gold:         #b8914d;
  --gold-light:   #d4b872;
  --white:        #ffffff;
  --shadow-sm:    0 2px 8px rgba(0,0,0,0.06);
  --shadow-md:    0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg:    0 8px 32px rgba(0,0,0,0.12);
  --radius:       10px;
  --font-heading: 'Noto Serif SC', 'SimSun', serif;
  --font-body:    'Noto Sans SC', 'Microsoft YaHei', sans-serif;
  --transition:   all 0.3s ease;
  --nav-height:   72px;
}
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: var(--font-body); color: var(--text-main); background: var(--rice-paper); line-height: 1.7; padding-top: var(--nav-height); }
a { color: var(--ink-green); text-decoration: none; transition: var(--transition); }
a:hover { color: var(--ink-dark); }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }
.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* 导航栏（毛玻璃） */
.navbar { position: fixed; top:0; left:0; right:0; height:var(--nav-height); z-index:1000; background:rgba(250,246,240,0.85); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid rgba(74,124,89,0.15); }
.navbar .container { display:flex; align-items:center; justify-content:space-between; height:100%; }
.nav-logo { display:flex; align-items:center; gap:8px; font-family:var(--font-heading); font-size:1.3rem; font-weight:700; color:var(--ink-dark); white-space:nowrap; }
.nav-logo i { color:var(--ink-green); font-size:1.4rem; }
.nav-logo span { font-size:0.8rem; color:var(--text-light); font-weight:400; }
.nav-links { display:flex; align-items:center; gap:4px; }
.nav-links a { padding:8px 12px; color:var(--text-main); font-size:0.88rem; border-radius:6px; transition:var(--transition); white-space:nowrap; }
.nav-links a:hover, .nav-links a.active { color:var(--ink-green); background:rgba(74,124,89,0.08); }
.nav-phone { display:flex; align-items:center; gap:6px; color:var(--gold); font-weight:600; font-size:0.9rem; padding:6px 14px; border:1px solid var(--gold-light); border-radius:8px; transition:var(--transition); }
.nav-phone:hover { background:var(--gold); color:var(--white); border-color:var(--gold); }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; background:none; border:none; }
.hamburger span { width:26px; height:2.5px; background:var(--text-main); border-radius:3px; transition:var(--transition); }

/* 通用标题 */
.section-title { text-align:center; margin-bottom:40px; }
.section-title h2 { font-family:var(--font-heading); font-size:1.8rem; color:var(--ink-dark); margin-bottom:8px; }
.section-title p { color:var(--text-light); font-size:0.98rem; }
.section-title .title-deco { width:60px; height:3px; background:linear-gradient(90deg,var(--ink-green),var(--gold)); margin:12px auto 0; border-radius:3px; }

/* 卡片 */
.card { background:var(--white); border-radius:var(--radius); box-shadow:var(--shadow-sm); overflow:hidden; transition:var(--transition); }
.card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.card-img { width:100%; height:200px; object-fit:cover; }
.card-body { padding:20px; }
.card-body h3 { font-family:var(--font-heading); font-size:1.1rem; color:var(--ink-dark); margin-bottom:8px; }
.card-body p { color:var(--text-light); font-size:0.9rem; line-height:1.6; }

/* 按钮 */
.btn { display:inline-flex; align-items:center; gap:6px; padding:12px 28px; border-radius:8px; font-family:var(--font-body); font-size:0.95rem; font-weight:500; cursor:pointer; border:none; transition:var(--transition); }
.btn-primary { background:var(--ink-green); color:var(--white); }
.btn-primary:hover { background:var(--ink-dark); color:var(--white); }
.btn-gold { background:var(--gold); color:var(--white); }
.btn-gold:hover { background:#a37e3f; color:var(--white); }
.btn-outline { background:transparent; color:var(--ink-green); border:1.5px solid var(--ink-green); }
.btn-outline:hover { background:var(--ink-green); color:var(--white); }
.btn-sm { padding:8px 18px; font-size:0.85rem; }

/* 标签 */
.tag { display:inline-block; padding:3px 10px; border-radius:20px; font-size:0.75rem; font-weight:500; }
.tag-hot, .tag-热销 { background:#ffe4e4; color:#d63031; }
.tag-quality, .tag-经典 { background:#e3f2fd; color:#1565c0; }
.tag-family { background:#fce4ec; color:#c2185b; }
.tag-summer, .tag-避暑 { background:#e8f5e9; color:#2e7d32; }
.tag-photo { background:#f3e5f5; color:#7b1fa2; }
.tag-weekend, .tag-周末 { background:#fff3e0; color:#e65100; }
.tag-luxury, .tag-臻享 { background:#fff8e1; color:#f57f17; }
.tag-名校 { background:#e3f2fd; color:#1565c0; }
.tag-文化 { background:#f3e5f5; color:#7b1fa2; }
.tag-科技 { background:#e8f5e9; color:#2e7d32; }
.tag-草原 { background:#e8f5e9; color:#2e7d32; }
.tag-冰雪 { background:#e3f2fd; color:#1565c0; }
.tag-休闲 { background:#e0f7fa; color:#00838f; }

/* 产品网格 */
.product-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:24px; }
.product-card .card-img { height:220px; }
.product-meta { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; font-size:0.82rem; color:var(--text-light); }
.product-meta i { margin-right:4px; }
.product-price { display:flex; align-items:center; justify-content:space-between; margin-top:12px; padding-top:12px; border-top:1px solid var(--rice-dark); }
.price { font-size:1.3rem; font-weight:700; color:var(--ink-dark); }
.price small { font-size:0.78rem; font-weight:400; color:var(--text-light); }
.product-tag { position:absolute; top:10px; left:10px; z-index:2; }

/* 目的地Tab */
.dest-tabs { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:30px; }
.dest-tab { padding:10px 24px; border-radius:8px; font-size:0.92rem; font-family:var(--font-body); font-weight:500; cursor:pointer; border:1.5px solid var(--rice-dark); background:var(--white); color:var(--text-light); transition:var(--transition); }
.dest-tab:hover { border-color:var(--ink-green); color:var(--ink-green); }
.dest-tab.active { background:var(--ink-green); color:var(--white); border-color:var(--ink-green); }

/* 筛选chip */
.filter-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 14px; border-radius:20px; font-size:0.82rem; cursor:pointer; border:1.5px solid var(--rice-dark); background:var(--white); color:var(--text-light); transition:var(--transition); font-family:var(--font-body); }
.filter-chip:hover, .filter-chip.active { border-color:var(--ink-green); background:rgba(74,124,89,0.08); color:var(--ink-green); }

/* 轮播 */
.carousel { position:relative; overflow:hidden; width:100%; border-radius:var(--radius); }
.carousel-inner { display:flex; transition:transform 0.5s ease; }
.carousel-slide { min-width:100%; position:relative; }
.carousel-slide img { width:100%; height:480px; object-fit:cover; }
.carousel-slide .carousel-caption { position:absolute; bottom:0; left:0; right:0; padding:60px 40px 40px; background:linear-gradient(transparent,rgba(0,0,0,0.7)); color:var(--white); }
.carousel-slide .carousel-caption h2 { font-family:var(--font-heading); font-size:1.8rem; margin-bottom:6px; }
.carousel-slide .carousel-caption p { font-size:1rem; opacity:0.9; }
.carousel-dots { display:flex; justify-content:center; gap:8px; margin-top:14px; }
.carousel-dot { width:10px; height:10px; border-radius:50%; background:var(--rice-dark); cursor:pointer; transition:var(--transition); }
.carousel-dot.active { background:var(--ink-green); width:28px; border-radius:5px; }

/* FAQ */
.faq-item { background:var(--white); border-radius:var(--radius); margin-bottom:12px; box-shadow:var(--shadow-sm); overflow:hidden; }
.faq-question { display:flex; justify-content:space-between; align-items:center; padding:18px 20px; cursor:pointer; font-weight:500; font-size:0.95rem; transition:var(--transition); }
.faq-question:hover { background:rgba(74,124,89,0.03); }
.faq-question i { transition:var(--transition); color:var(--ink-green); }
.faq-item.open .faq-question i { transform:rotate(180deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height 0.35s ease, padding 0.35s ease; padding:0 20px; color:var(--text-light); font-size:0.9rem; line-height:1.7; }
.faq-item.open .faq-answer { max-height:400px; padding:0 20px 18px; }

/* 弹窗 */
.modal-overlay { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5); z-index:2000; justify-content:center; align-items:center; padding:20px; }
.modal-overlay.show { display:flex; }
.modal-box { background:var(--white); border-radius:14px; max-width:520px; width:100%; padding:35px; box-shadow:var(--shadow-lg); position:relative; animation:modalIn 0.3s ease; }
@keyframes modalIn { from{transform:scale(0.92) translateY(20px);opacity:0} to{transform:scale(1) translateY(0);opacity:1} }
.modal-close { position:absolute; top:16px; right:16px; width:32px; height:32px; border-radius:50%; border:none; background:var(--rice-dark); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:1rem; color:var(--text-light); }
.agent-card { display:flex; align-items:center; gap:18px; padding:20px; background:var(--rice-paper); border-radius:var(--radius); margin-top:16px; }
.agent-avatar { width:60px; height:60px; border-radius:50%; background:linear-gradient(135deg,var(--ink-green),var(--ink-light)); display:flex; align-items:center; justify-content:center; color:var(--white); font-size:1.5rem; flex-shrink:0; }
.agent-info h4 { font-family:var(--font-heading); font-size:1rem; color:var(--ink-dark); margin-bottom:4px; }
.agent-info p { font-size:0.82rem; color:var(--text-light); }
.robot-animation { display:flex; justify-content:center; align-items:center; gap:6px; padding:20px 0; }
.robot-dot { width:10px; height:10px; border-radius:50%; background:var(--ink-green); animation:breathe 1.4s ease-in-out infinite; }
.robot-dot:nth-child(2) { animation-delay:0.2s; }
.robot-dot:nth-child(3) { animation-delay:0.4s; }
@keyframes breathe { 0%,60%,100%{transform:scale(0.6);opacity:0.3} 30%{transform:scale(1);opacity:1} }

/* 时间轴 */
.timeline { position:relative; padding-left:30px; }
.timeline::before { content:''; position:absolute; left:10px; top:0; bottom:0; width:2px; background:var(--ink-pale); }
.timeline-item { position:relative; padding-bottom:30px; }
.timeline-item::before { content:''; position:absolute; left:-22px; top:6px; width:14px; height:14px; border-radius:50%; background:var(--ink-green); border:3px solid var(--rice-paper); }
.timeline-item .year { font-family:var(--font-heading); font-size:1.2rem; font-weight:700; color:var(--ink-dark); }
.timeline-item .desc { font-size:0.9rem; color:var(--text-light); }

/* 空状态 */
.empty-state { text-align:center; padding:60px 20px; color:var(--text-light); }
.empty-state i { font-size:3rem; margin-bottom:16px; color:var(--ink-pale); }

/* 底部 */
.footer { background:var(--ink-dark); color:rgba(255,255,255,0.8); padding:50px 0 30px; margin-top:0; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:30px; margin-bottom:30px; }
.footer h3 { font-family:var(--font-heading); font-size:1.1rem; color:var(--white); margin-bottom:16px; }
.footer p, .footer a { font-size:0.88rem; line-height:2; color:rgba(255,255,255,0.7); }
.footer a:hover { color:var(--gold-light); }
.footer-contact i { margin-right:8px; color:var(--gold-light); width:16px; }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.1); padding-top:20px; text-align:center; font-size:0.82rem; color:rgba(255,255,255,0.5); }
.footer-bottom a { color:rgba(255,255,255,0.6); }
.footer-bottom a:hover { color:var(--gold-light); }

/* 响应式 */
@media(max-width:1024px) { .footer-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:768px) {
  :root { --nav-height:64px; }
  .nav-links { display:none; position:absolute; top:var(--nav-height); left:0; right:0; background:rgba(250,246,240,0.97); backdrop-filter:blur(16px); flex-direction:column; padding:10px 20px 20px; border-bottom:1px solid rgba(74,124,89,0.15); box-shadow:var(--shadow-md); }
  .nav-links.open { display:flex; }
  .nav-links a { padding:12px 14px; width:100%; }
  .nav-phone { display:none; }
  .nav-links .nav-phone { display:flex; margin-top:6px; }
  .hamburger { display:flex; }
  .hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
  .hamburger.active span:nth-child(2) { opacity:0; }
  .hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
  .carousel-slide img { height:280px; }
  .carousel-slide .carousel-caption { padding:30px 20px 20px; }
  .carousel-slide .carousel-caption h2 { font-size:1.3rem; }
  .section-title h2 { font-size:1.4rem; }
  .product-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .dest-tab { padding:8px 16px; font-size:0.85rem; }
}
