/* 企业品牌色调样式 - 基于勤加软件Logo */

/* 定义品牌颜色变量 */
:root {
  --brand-blue: #1D5AB8; /* Logo中的蓝色 */
  --brand-orange: #ff7700; /* Logo中的橙色 */
  --brand-dark: #1a1a1a;  /* 深色文本 */
  --brand-light: #f5f5f5; /* 浅色背景 */
}

/* 主按钮使用品牌蓝色与橙色的渐变效果 */
.btn-primary {
  background: linear-gradient(135deg, var(--brand-blue) 0%, var(--brand-orange) 100%);
  background-size: 200% auto;
  transition: all 0.3s ease;
}

.btn-primary:hover {
  background-position: right center;
  transform: translateY(-2px);
}

/* 导航栏中的活动链接和悬停效果添加橙色强调 */
.nav-link:hover,
.nav-link.active {
  color: var(--brand-orange);
  position: relative;
}

.nav-link:hover::after,
.nav-link.active::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 3px;
  background-color: var(--brand-orange);
  border-radius: 3px;
}

/* 下拉菜单活动项使用橙色强调 */
.dropdown-item:hover,
.dropdown-item.active {
  color: var(--brand-orange);
  background-color: rgba(255, 119, 0, 0.05);
}

.sub-dropdown-item:hover,
.sub-dropdown-item.active {
  color: var(--brand-orange);
  background-color: rgba(255, 119, 0, 0.05);
}

/* 页面标题使用橙色强调 */
.page-title {
  background: linear-gradient(135deg, var(--brand-blue) 0%, #1565c0 100%);
  position: relative;
}

.page-title::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  background-color: var(--brand-orange);
}

/* 服务卡片图标使用橙色背景 */
.service-icon,
.contact-icon {
  background-color: var(--brand-orange);
}

.service-card:hover .service-icon,
.contact-info-item:hover .contact-icon {
  background-color: var(--brand-blue);
  transform: rotate(360deg);
  transition: all 0.5s ease;
}

/* 核心功能卡片图标使用蓝色和橙色的组合 */
.feature-icon {
  background: linear-gradient(135deg, var(--brand-blue) 0%, var(--brand-orange) 100%);
}

.feature-card:hover .feature-icon {
  transform: scale(1.1);
  transition: all 0.3s ease;
}

/* 开发流程步骤数字使用橙色背景 */
.step-number {
  background-color: var(--brand-orange);
}

.process-step:hover .step-number {
  background-color: var(--brand-blue);
  transform: rotate(360deg);
  transition: all 0.5s ease;
}

/* FAQ项目标题强调 */
.faq-question i {
  color: var(--brand-orange);
}

.faq-item.active .faq-question h3 {
  color: var(--brand-orange);
}

/* 联系咨询区域样式 */
.contact-section {
  background: linear-gradient(135deg, var(--brand-blue) 0%, var(--brand-orange) 100%);
}

.contact-content .btn-primary {
  background-color: #fff;
  color: var(--brand-orange);
  border: 2px solid #fff;
}

.contact-content .btn-primary:hover {
  background-color: transparent;
  color: #fff;
}

/* 表单焦点样式 */
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: var(--brand-orange);
  box-shadow: 0 0 0 3px rgba(255, 119, 0, 0.1);
}

/* 返回顶部按钮样式 */
.back-to-top {
  background-color: var(--brand-orange);
}

.back-to-top:hover {
  background-color: var(--brand-blue);
}

/* 页脚链接悬停效果 */
.footer-links a:hover {
  color: var(--brand-orange);
}

.footer-contact li i {
  color: var(--brand-orange);
}

/* 案例列表标记样式 */
.case-content li:before {
  color: var(--brand-orange);
}

/* 卡片悬停效果增强 */
.feature-card:hover,
.service-card:hover,
.platform-item:hover,
.database-item:hover,
.middleware-item:hover,
.case-card:hover {
  box-shadow: 0 8px 24px rgba(255, 119, 0, 0.15);
  transition: all 0.3s ease;
}

/* 确保CSS动画性能 */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}