/* 全局样式定义 - 辅助 Tailwind CSS 实现特定视觉需求 */

:root {
  --bg-gradient-start: #ffffff;
  --bg-gradient-end: #F5F7FA;
  --text-primary: #1a202c;
  --text-secondary: #4a5568;
  --accent-blue: #3182ce;
}

body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background: linear-gradient(180deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
  color: var(--text-primary);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}

/* 科技感线条装饰 - 背景点缀 */
.tech-lines {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  opacity: 0.03;
  background-image: 
    linear-gradient(rgba(49, 130, 206, 0.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(49, 130, 206, 0.5) 1px, transparent 1px);
  background-size: 40px 40px;
}

/* 导航栏玻璃拟态效果 */
.nav-glass {
  backdrop-filter: blur(12px);
  background-color: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(226, 232, 240, 0.6);
}

/* 卡片悬浮效果 */
.card-hover {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-hover:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
}

/* 按钮渐变与光效 */
.btn-primary {
  background: linear-gradient(135deg, #3182ce 0%, #2b6cb0 100%);
  position: relative;
  overflow: hidden;
}

.btn-primary::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition: 0.5s;
}

.btn-primary:hover::after {
  left: 100%;
}

/* 图片容器适配 */
.img-container {
  overflow: hidden;
  border-radius: 0.5rem;
}

.img-container img {
  transition: transform 0.5s ease;
}

.img-container:hover img {
  transform: scale(1.05);
}

/* 布局辅助类 */
.section-container {
  @apply max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16 relative z-10;
}

/* 页脚样式 */
footer {
  margin-top: auto;
  border-top: 1px solid rgba(226, 232, 240, 0.6);
}

/* 响应式文本调整 */
@media (max-width: 640px) {
  h1 {
    font-size: 1.75rem !important;
  }
  h2 {
    font-size: 1.5rem !important;
  }
}