/* =====================================================
   杭州飞闲科技有限公司 - 官网样式
   科技蓝主题，支持背景图
   ===================================================== */

/* ---------- 全局变量 ---------- */
:root {
  --primary: #2563eb;        /* 科技蓝 */
  --primary-dark: #1d4ed8;
  --primary-light: #3b82f6;
  --accent: #06b6d4;         /* 点缀亮青色 */
  --text: #1f2937;
  --text-light: #6b7280;
  --bg: #ffffff;
  --bg-light: #f8fafc;
  --bg-dark: #0f172a;
  --border: #e5e7eb;
  --radius: 10px;
  --shadow: 0 4px 24px rgba(0,0,0,.08);
  --shadow-lg: 0 8px 40px rgba(0,0,0,.12);
}

/* ---------- Reset ---------- */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.7;
}
a { color: var(--primary); text-decoration:none; transition:.2s; }
a:hover { color: var(--primary-dark); }
img { max-width:100%; height:auto; }
ul { list-style:none; }

/* ---------- Layout ---------- */
.container { max-width:1100px; margin:0 auto; padding:0 20px; }
.section { padding:90px 0; }
.bg-light { background:var(--bg-light); }

/* ---------- 按钮 ---------- */
.btn {
  display:inline-block;
  padding:13px 34px;
  border-radius:50px;
  font-size:16px;
  font-weight:600;
  transition:.3s;
  cursor:pointer;
  border:2px solid transparent;
  letter-spacing:.5px;
}
.btn-primary {
  background:linear-gradient(135deg, var(--primary), var(--accent));
  color:#fff !important;
  box-shadow:0 4px 15px rgba(37,99,235,.35);
}
.btn-primary:hover {
  transform:translateY(-3px);
  box-shadow:0 8px 25px rgba(37,99,235,.45);
}
.btn-outline {
  border-color:var(--primary);
  color:var(--primary) !important;
  background:transparent;
}
.btn-outline:hover { background:var(--primary); color:#fff !important; transform:translateY(-2px); }

/* ---------- 标题 ---------- */
.section-title {
  text-align:center;
  font-size:34px;
  font-weight:700;
  margin-bottom:50px;
  position:relative;
  color:var(--text);
}
.section-title::after {
  content:"";
  display:block;
  width:70px;
  height:4px;
  background:linear-gradient(90deg, var(--primary), var(--accent));
  margin:14px auto 0;
  border-radius:2px;
}
.highlight { color:var(--accent); }

/* ---------- 三栏网格 ---------- */
.grid-3 {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:30px;
}
@media (max-width:768px) {
  .grid-3 { grid-template-columns:1fr; }
}

/* ---------- 卡片 ---------- */
.card {
  background:#fff;
  border-radius:var(--radius);
  padding:40px 28px;
  box-shadow:var(--shadow);
  text-align:center;
  transition:.35s;
  border:1px solid transparent;
}
.card:hover {
  transform:translateY(-8px);
  box-shadow:var(--shadow-lg);
  border-color:var(--primary);
}
.card-icon { font-size:52px; margin-bottom:15px; display:block; }
.card h3 { font-size:20px; margin-bottom:12px; color:var(--text); }
.card p { color:var(--text-light); font-size:15px; line-height:1.8; }

/* ---------- Header ---------- */
.header {
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:100;
}
.header-inner {
  display:flex;
  justify-content:space-between;
  align-items:center;
  height:68px;
}
.logo {
  font-size:22px;
  font-weight:800;
  background:linear-gradient(135deg, var(--primary), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.nav a {
  margin-left:30px;
  font-size:15px;
  color:var(--text) !important;
  font-weight:500;
  transition:.2s;
  position:relative;
}
.nav a::after {
  content:"";
  position:absolute;
  bottom:-4px; left:0;
  width:0; height:2px;
  background:var(--primary);
  transition:.3s;
}
.nav a:hover::after,
.nav a.active::after { width:100%; }
.nav a:hover, .nav a.active { color:var(--primary) !important; }

/* ---------- Hero ---------- */
.hero {
  position:relative;
  background-size:cover;
  background-position:center;
  background-color:var(--bg-dark);
  color:#fff;
  padding:140px 0;
  text-align:center;
  overflow:hidden;
}
.hero-overlay {
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,
    rgba(15,23,42,.85) 0%,
    rgba(37,99,235,.7) 50%,
    rgba(6,182,212,.6) 100%);
}
.hero-content { position:relative; z-index:2; }
.hero h1 { font-size:48px; margin-bottom:12px; font-weight:800; letter-spacing:1px; }
.hero-sub { font-size:17px; opacity:.85; margin-bottom:20px; letter-spacing:3px; }
.hero-desc {
  font-size:17px;
  max-width:620px;
  margin:0 auto 35px;
  opacity:.9;
  line-height:1.8;
}

/* ---------- 数字统计 ---------- */
.stats {
  background:linear-gradient(135deg, var(--bg-dark) 0%, #1e293b 100%);
  color:#fff;
  padding:60px 0;
}
.stat-item { text-align:center; }
.stat-number {
  display:block;
  font-size:42px;
  font-weight:800;
  background:linear-gradient(135deg, var(--primary-light), var(--accent));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  margin-bottom:6px;
}
.stat-label { font-size:16px; opacity:.7; letter-spacing:2px; }

/* ---------- About Preview ---------- */
.about-text {
  max-width:800px;
  margin:0 auto;
  text-align:center;
  font-size:17px;
  color:var(--text-light);
  line-height:2;
}

/* ---------- Page Banner ---------- */
.page-banner {
  position:relative;
  background-size:cover;
  background-position:center;
  background-color:var(--bg-dark);
  color:#fff;
  padding:80px 0;
  text-align:center;
  overflow:hidden;
}
.page-banner .hero-overlay {
  background:linear-gradient(135deg,
    rgba(15,23,42,.8) 0%,
    rgba(37,99,235,.65) 100%);
}
.page-banner .container { position:relative; z-index:2; }
.page-banner h1 { font-size:38px; margin-bottom:6px; font-weight:700; }
.page-banner p { opacity:.7; font-size:14px; letter-spacing:3px; }

/* ---------- 内容页面 ---------- */
.content-page h2 {
  font-size:24px;
  font-weight:700;
  margin:40px 0 18px;
  border-left:4px solid var(--primary);
  padding-left:18px;
  color:var(--text);
}
.content-page p { margin-bottom:16px; color:var(--text-light); line-height:1.9; }
.content-page ul { margin-bottom:25px; }
.content-page li {
  padding:12px 0 12px 10px;
  border-bottom:1px solid var(--border);
  color:var(--text-light);
  line-height:1.6;
}

/* ---------- Section Intro ---------- */
.section-intro {
  text-align:center;
  color:var(--text-light);
  font-size:17px;
  max-width:700px;
  margin:0 auto 45px;
  line-height:1.8;
}

/* ---------- 新闻列表 ---------- */
.news-list { max-width:800px; margin:0 auto; }
.news-item {
  display:flex;
  gap:25px;
  padding:28px 0;
  border-bottom:1px solid var(--border);
  transition:.2s;
}
.news-item:hover { padding-left:10px; }
.news-date { text-align:center; min-width:75px; }
.news-day { display:block; font-size:30px; font-weight:800; color:var(--primary); line-height:1.1; }
.news-month { font-size:13px; color:var(--text-light); margin-top:2px; }
.news-content h3 { margin-bottom:8px; }
.news-content h3 a { color:var(--text) !important; font-size:18px; font-weight:600; }
.news-content h3 a:hover { color:var(--primary) !important; }
.news-content p { color:var(--text-light); font-size:15px; line-height:1.7; }

/* ---------- 联系页面 ---------- */
.contact-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
}
@media (max-width:768px) {
  .contact-grid { grid-template-columns:1fr; }
}
.contact-info h2, .contact-form h2 {
  font-size:24px;
  font-weight:700;
  margin-bottom:25px;
}
.info-item {
  margin-bottom:22px;
  padding:16px 20px;
  background:var(--bg-light);
  border-radius:var(--radius);
  border-left:3px solid var(--primary);
}
.info-label { font-weight:700; display:block; margin-bottom:6px; font-size:14px; color:var(--primary); }
.form-group { margin-bottom:22px; }
.form-group label { display:block; font-weight:600; margin-bottom:8px; font-size:14px; color:var(--text); }
.form-group input,
.form-group textarea {
  width:100%;
  padding:13px 16px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  font-size:15px;
  transition:.25s;
  font-family:inherit;
  background:var(--bg-light);
}
.form-group input:focus,
.form-group textarea:focus {
  outline:none;
  border-color:var(--primary);
  background:#fff;
  box-shadow:0 0 0 4px rgba(37,99,235,.12);
}
.form-note { margin-top:15px; font-size:13px; color:#ef4444; line-height:1.6; }

/* ---------- 页脚 ---------- */
.footer {
  background:var(--bg-dark);
  color:#94a3b8;
  text-align:center;
  padding:35px 0;
  font-size:14px;
}
.footer a { color:#94a3b8 !important; }
.footer a:hover { color:#fff !important; }
.footer-inner p { margin:6px 0; line-height:1.6; }

/* ---------- 渐入动画 ---------- */
.card, .news-item, .stat-item {
  opacity:0;
  transform:translateY(30px);
  animation:fadeInUp .6s forwards;
}
.card:nth-child(2) { animation-delay:.15s; }
.card:nth-child(3) { animation-delay:.3s; }
.stat-item:nth-child(2) { animation-delay:.15s; }
.stat-item:nth-child(3) { animation-delay:.3s; }
@keyframes fadeInUp {
  to { opacity:1; transform:translateY(0); }
}