/**
 * 物图科技官网 - 公共样式
 */

/* 阅读进度条 */
#reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0%;
  background: linear-gradient(90deg, #10b981, #06b6d4);
  z-index: 9999;
  transition: width 0.1s linear;
  pointer-events: none;
}

/* 全局基础 */
html {
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none; /* Chrome, Safari, Opera */
}

body {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}

body::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none; /* Chrome, Safari, Opera */
}
/* 顶部导航栏渐变背景 */
header.site-header {
  background: linear-gradient(180deg, rgba(6, 78, 59, 0.92) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
}

/* 导航链接悬停轻微上浮 */
.header-nav a {
  transition: color 0.2s ease, transform 0.2s ease;
}
.header-nav a:hover {
  transform: translateY(-1px);
}
/* 主按钮悬停放大 */
.btn-primary {
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
.btn-primary:hover {
  transform: scale(1.05);
}
.btn-primary:active {
  transform: scale(0.98);
}
/* 卡片悬停上浮与阴影 */
.card-hover {
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.2s ease;
}
.card-hover:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}
/* 图片容器内图片悬停放大 */
.img-zoom-hover img {
  transition: transform 0.5s ease;
}
.img-zoom-hover:hover img {
  transform: scale(1.08);
}

/* 案例图片顶部马赛克遮罩（1–8.png） */
.case-img-mosaic-top {
  position: relative;
}
.case-img-mosaic-top::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 16%;
  min-height: 32px;
  background: rgba(240, 240, 240, 0.35);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  pointer-events: none;
  border-radius: 1rem 1rem 0 0;
}

/* 首页 Hero 能力标签（8 个卡片按钮）动效与样式 */
.hero-cap-tag {
  transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, color 0.2s ease;
}
.hero-cap-tag:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.08);
  background-color: rgba(30, 41, 59, 0.75);
  border-color: rgba(255, 255, 255, 0.2);
}
.hero-cap-tag:hover span {
  color: rgb(255, 255, 255);
}
.hero-cap-tag:active {
  transform: translateY(-1px) scale(0.99);
}

/* 文字渐变 */
.text-gradient {
  background: linear-gradient(135deg, #34d399, #22d3ee);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 毛玻璃卡片 */
.glass-card {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

/* section 标题装饰线 */
.section-title-line {
  position: relative;
  display: inline-block;
}
.section-title-line::after {
  content: '';
  position: absolute;
  bottom: -12px;
  left: 0;
  width: 48px;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, #10b981, #06b6d4);
}
.section-title-line--center::after {
  left: 50%;
  transform: translateX(-50%);
}

/* 装饰性浮动圆 */
.deco-circle {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0.08;
  background: linear-gradient(135deg, #10b981, #06b6d4);
}

/* 研发流程步骤连线 */
.step-connector {
  position: relative;
}
.step-connector::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -1rem;
  width: calc(2rem);
  height: 2px;
  background: linear-gradient(90deg, #d1d5db, #10b981);
  transform: translateY(-50%);
}
@media (max-width: 767px) {
  .step-connector::after {
    display: none;
  }
}

/* 理念卡片顶部装饰条 */
.accent-bar-emerald { border-top: 3px solid #10b981; }
.accent-bar-cyan { border-top: 3px solid #06b6d4; }
.accent-bar-violet { border-top: 3px solid #8b5cf6; }

/* 淡入上浮动画 */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in-up {
  animation: fadeInUp 0.6s ease both;
}

/* 数字计数渐变 */
.stat-number {
  background: linear-gradient(135deg, #10b981, #06b6d4);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 联系方式图标容器 */
.contact-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: linear-gradient(135deg, #ecfdf5, #e0f2fe);
  color: #10b981;
  flex-shrink: 0;
}
