/* ==================== 自定义样式：背景图、渐变等 Tailwind 不便表达的样式 ==================== */

@font-face {
  font-family: 'DigitalSubset';
  src: url(data:font/ttf;base64,AAEAAAAPAIAAAwBwRkZUTYZty7cAAAVgAAAAHEdERUYAHQAGAAAFfAAAACZHUE9TABUACgAABaQAAAAMR1NVQgAVAAoAAAWwAAAADE9TLzJaa3bUAAABeAAAAGBjbWFwAAwAjAAAAgQAAAA0Z2FzcP//AAMAAAVYAAAACGdseWbRemlEAAACUAAAAt5oZWFkHq/VQgAAAPwAAAA2aGhlYQm3BRoAAAE0AAAAJGhtdHgZsAE4AAAB2AAAACxsb2NhA1oEAQAAAjgAAAAYbWF4cABUAGwAAAFYAAAAIG5hbWUABgAAAAAFMAAAAAZwb3N0/0AAUAAABTgAAAAgAAEAAAACAAAyoqmlXw889QALA+gAAAAA3RhIegAAAADdGEh6/zP/AAYrBGkAAQAIAAIAAAAAAAAAAQAAA/L/EABkBsv/M/8zBisAAQAAAAAAAAAAAAAAAAAAAAsAAQAAAAsAaQAHAAAAAAACAAAAAQABAAAAQAAAAAAAAAAEAloDhAAFAAACigJYAAAASwKKAlgAAAFeADIBLAAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAABJVEZPAKAAMAA5A/L/EABkA/IA8CAAAJMAAAAAAfQC5AAAACAADAH0ADICzgAkAbUAIgJdAB4COgAIApEAFAJjACECdgAeAi8ABQKTACQCdgAeAAAAAgAAAAMAAAAUAAMAAQAAABQABAAgAAAABAAEAAEAAAA5//8AAAAw////0QABAAAAAAAAAAAAIwAyAFgAhgChAM8A+AELAUYBbwACACT/8wKqAvIACQATAAATNDYgFhUUBiAmNxQWMjY1NCYiBiSyASKyrP7SrKBVnFVVnFUBcKzW1qyuz8+udnl5dnl7ewAAAQAiAAABZQLkAAUAABMjNSERI8qoAUObAlOR/RwAAQAeAAACPwLyABcAACUFNTc+ATU0JiMiBhUjNDYzMhYVFA8BIQI//fD0PTM1MjQ5oZN6f4+ZbwEOAgJ4yzJNLTg7RD59lYN2hIBdAAEACP/zAiUC5AAdAAABIzU+AT8BITUhFQceARUUBiMiJjUzFBYzMjY1NCYBBmwBBAGh/ukB4pxQZaB0cZigOzIvOzsBXGgBAwGNjoGJGHpacomHeDY6PDEwPQAAAgAUAAACeALkAAoADQAAJSMVIzUhNQEzETMhMxECeFuZ/pABP8pb/kjEg4ODjgHT/i0BIAAAAQAh//QCSgLkAB0AAAUiJjUzFBYzMjY1NCYjIgYHJxMhFSEHNjMyFhUUBgEqd5KgOjM3Pzw3JT4OlF0Bkv7iHTFFbYegDIxzNDxDOjlAIxscAY2WbB2FcHyaAAACAB7/8wJYAuQADwAZAAATNzMHNjMyFhUUBiImNTQ2FhQWMzI2NCYjIpmRuakPD3KOn/ijNnBDNjVCQjU3Ah3H4wOPcnmXnHVDd4NyR0dyRgAAAQAFAAACKgLkAAYAABMhFQMjASEFAiX/qAEE/n4C5Jb9sgJOAAADACT/9AJvAvIAEwAdACUAADc0NjcmNTQ2MhYVFAceARUUBiAmExQWMjY1NCYiBgIUFjI2NCYiJEA2W5Xukl44QZ/+8p6tQG5AQG5ADkd+R0h81kBkFi1pW3FxXWsqFWNAaHt6AaglLCwlJi0t/tJaMjJaMwAAAgAeAAACWALxAA8AGQAAJQcjNwYjIiY1NDYyFhUUBiY0JiMiBhQWMzIB3ZG5qQ8Pco6f+KM2cEM2NUJCNTfHx+MDj3J5l5x1Q3eDckdHckYAAAAAAAAAAAYAAAADAAAAAAAA/z0AUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAf//AAIAAAABAAAAAMw9os8AAAAA3RfhewAAAADdGEdsAAEAAAAMAAAAAAAAAAEAAQAKAAEAAQABAAEAAQABAAEAAQABAAEAAAABAAAACgAKAAoAAAABAAAACgAKAAoAAA==)
    format('truetype');
}

.font-satoshi {
  font-family: 'DigitalSubset', Arial;
}

/* 渐变色分割条 */
.divider-gradient {
  background: linear-gradient(
    90deg,
    #0651b2 0%,
    #1e8bd6 34.31%,
    #e8943a 70.29%,
    #1b5faa 100%
  );
}

/* Hero 渐变覆盖层 */
.hero-overlay {
  background: linear-gradient(
    178.97deg,
    rgba(56, 127, 194, 0.75) 2.17%,
    rgba(61, 146, 227, 0.16) 19.25%,
    rgba(61, 146, 227, 0) 43.1%
  );
}

/* 统计区渐变背景 */
.stats-bg {
  background: linear-gradient(180deg, #edf3fa 0%, #ffffff 100%);
}

/* 业务卡片覆盖层渐变 */
.business-overlay {
  background: linear-gradient(180deg, rgba(9, 64, 137, 0) 0%, #094089 100%);
}

.business-inner-gradient {
  background: linear-gradient(180deg, #034397 0%, #2275c2 100%);
}

/* ==================== 业务卡片展开交互 ==================== */
.business-card-outer {
  transition: flex 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: flex;
  position: relative;
}

/* 组级别宽度控制 */
.business-card-group {
  transition: flex 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.business-card-group.business-group-active {
  flex: 1.33 !important;
}

.business-card-group.business-group-inactive {
  flex: 1;
}

/* 标签宽度同步 */
.business-label {
  transition: flex 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.business-label.business-label-active {
  flex: 1.33 !important;
}

.business-label.business-label-inactive {
  flex: 1;
}

/* 卡片级别：active 展开，inactive 缩小 */
.business-card-outer.business-active {
  flex: 1.5 !important;
}

.business-card-outer.business-active .business-card-inner {
  transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  position: absolute;
  bottom: 0;
  right: 0;
  align-items: flex-start !important;
  padding-left: 46px !important;
  padding-right: 54px !important;
  padding-top: 38px !important;
  padding-bottom: 63px !important;
  width: 95% !important;
  border-top-left-radius: 1.5rem;
  background: linear-gradient(180deg, #034397 0%, #2275c2 100%) !important;
}

.business-card-outer.business-active .business-card-desc {
  display: block !important;
  animation: fadeInDesc 0.4s ease 0.2s both;
}

.business-card-outer.business-active .business-card-inner p {
  text-align: left !important;
}

.business-card-outer.business-inactive {
  flex: 0.7;
}

.business-card-outer.business-inactive .business-card-inner {
  transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.business-card-outer.business-inactive .business-card-desc {
  display: none !important;
}

.about_us_bg {
  background: url('/s/index/images/2026063001.png') no-repeat center center;
}

@keyframes fadeInDesc {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 导航下划线指示器 */
.nav-indicator {
  left: 0;
}

/* 导航链接底部滑动条 */
.nav-item {
  position: relative;
}

.nav-item.active {
  opacity: 1;
}

/* 导航栏滚动效果 */
.nav-bar.scrolled {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.nav-bar.scrolled .nav-item {
  color: #1a1a1a !important;
}

.nav-bar.scrolled .nav-item:first-child a {
  color: #0651b2 !important;
  border-color: #0651b2 !important;
}

.nav-bar.scrolled .nav-item a:hover {
  color: #0651b2 !important;
}

.nav-bar.scrolled .nav-indicator {
  background-color: #1a1a1a !important;
}

/* 语言切换器滚动变色 */
.nav-bar.scrolled .lang-border {
  border-color: #9ca3af !important;
  opacity: 0.6 !important;
}

.nav-bar.scrolled .lang-divider {
  background-color: #9ca3af !important;
}

.nav-bar.scrolled .lang-en {
  color: #9ca3af !important;
  opacity: 0.7 !important;
}

/* 语言分割线旋转 */
.lang-divider-rotate {
  transform: rotate(90deg);
}

/* ==================== 关键帧动画 ==================== */

/* 淡入上滑入场 */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 淡入缩放入场 */
@keyframes fadeInScale {
  from {
    opacity: 0;
    transform: scale(0.92);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* 从左滑入 */
@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-60px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 从右滑入 */
@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(60px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 滚动图标浮动 */
@keyframes float {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(12px);
  }
}

/* 金色光晕闪烁（Hero 标题） */
@keyframes shimmer {
  0%,
  100% {
    text-shadow: 0 4px 4px rgba(8, 30, 58, 0.66);
  }

  50% {
    text-shadow:
      0 4px 20px rgba(205, 179, 110, 0.5),
      0 4px 4px rgba(8, 30, 58, 0.66);
  }
}

/* 渐变色条流动 */
@keyframes gradientFlow {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

/* ==================== 动画应用类 ==================== */

/* 滚动触发：默认隐藏，进入视口后播放 */
.reveal {
  opacity: 0;
}

.reveal.visible {
  animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.reveal-left {
  opacity: 0;
}

.reveal-left.visible {
  animation: slideInLeft 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.reveal-right {
  opacity: 0;
}

.reveal-right.visible {
  animation: slideInRight 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.reveal-scale {
  opacity: 0;
}

.reveal-scale.visible {
  animation: fadeInScale 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* 滚动图标浮动动画 */
.icon-scroll-float {
  animation: float 2s ease-in-out infinite;
}

/* Hero 标题光晕 */
.hero-shimmer {
  animation: shimmer 3s ease-in-out infinite;
}

/* 分割条流动 */
.divider-gradient {
  background: linear-gradient(
    90deg,
    #0651b2 0%,
    #1e8bd6 34.31%,
    #e8943a 70.29%,
    #1b5faa 100%
  );
  background-size: 200% 100%;
  animation: gradientFlow 4s ease infinite;
}

/* 卡片悬浮（配合 Tailwind transition） */
.card-hover {
  transition:
    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.card-hover:hover {
  transform: translateY(-8px) scale(1.03) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.15);
}

/* 新闻卡片图片 zoom - 父卡片 hover 时触发 */
.news-img-zoom {
  overflow: hidden;
}

.news-img-zoom img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.card-hover:hover .news-img-zoom img {
  transform: scale(1.08);
}

/* 新闻卡片箭头 hover 变色 */
.card-hover:hover .arrow-circle {
  background-color: #0651b2 !important;
  border-color: #0651b2 !important;
}

.card-hover:hover .arrow-circle svg path {
  stroke: #ffffff !important;
}

@media not all and (min-width: 1536px) {
  /* ==================== 紧凑布局：PC 宽度 < 1500px，以 1200px 为基准 ==================== */
  .compact-mode .w-\[1440px\] {
    width: 1200px !important;
  }

  /* 产品卡片：464px → 386px */
  .compact-mode .w-\[464px\] {
    width: 386px !important;
  }

  /* 新闻卡片相关 */
  .compact-mode .w-\[448px\] {
    width: 373px !important;
  }

  .compact-mode .h-\[298px\] {
    height: 248px !important;
  }

  /* Hero 区域
  .compact-mode #hero-location,
  .compact-mode #hero-location span {
    width: 255px !important;
  } */

  .compact-mode #hero-title {
    min-width: 766px !important;
  }

  .compact-mode #hero-subtitle {
    min-width: 446px !important;
  }

  /* 统计区 */
  .compact-mode .stats-bg .ml-\[185px\] {
    margin-left: 154px !important;
  }

  .compact-mode .stats-bg .ml-\[211px\] {
    margin-left: 176px !important;
  }

  .compact-mode .stats-bg .w-\[508px\] {
    width: 423px !important;
  }

  .compact-mode .stats-bg .w-\[458px\] {
    width: 382px !important;
  }

  .compact-mode .stats-bg .min-w-\[900px\] {
    min-width: 750px !important;
  }

  .page-content-item-news .line-clamp-3 {
    -webkit-line-clamp: 2 !important;
  }
  .page-content-item-news #home-news-cards .h-\[547px\] {
    height: 420px !important;
  }
  .page-content-item-news #home-news-cards .mt-8 {
    margin-top: 16px !important;
  }

  .page-content-item-news #home-news-cards .mt-\[19px\] {
    margin-top: 6px !important;
  }
  .page-content-item-news .bottom-\[32px\] {
    bottom: 22px !important;
  }
  .page-content-item-news .pb-\[40px\] {
    padding-bottom: 28px !important;
  }

  .page-content-item-news #home-news-cards .h-\[200px\] {
    height: 170px !important;
  }

  .page-content-item-product .h-\[288px\] {
    height: 236px !important;
  }
  .page-content-item-product .mt-\[57px\] {
    margin-top: 30px !important;
  }

  .page-content-item-business .h-\[512px\] {
    height: 420px !important;
  }
  .page-content-item-business .mt-\[67px\] {
    margin-top: 30px !important;
  }

  .page-content-item-business .business-label {
    font-size: 28px !important;
  }

  .page-content-item-research .mt-\[30px\] {
    margin-top: 10px !important;
  }
  .page-content-item-research .w-\[260px\] {
    width: 248px !important;
  }

  .page-content-item-research .pt-\[30px\] {
    padding-top: 10px !important;
  }
  .page-content-item-research .pb-\[30px\] {
    padding-bottom: 10px !important;
  }

  .page-content-item-research .mt-\[36px\] {
    margin-top: 20px !important;
  }

  .page-content-item-research .h-\[610px\] {
    height: 500px !important;
  }

  .page-content-item-research.h-\[900px\] {
    height: 740px !important;
  }
  .page-content-item-research .bottom-\[135px\] {
    bottom: 50px !important;
  }
  .page-content-item-research .bottom-\[62px\] {
    bottom: 36px !important;
  }
  .page-content-item-research .w-\[46\.9\%\] {
    width: 40% !important;
  }
}

@media screen and (max-width: 1000px) {
  body {
    min-width: 1500px !important;
  }

  #hero-subtitle {
    padding: 0 100px !important;
    line-height: 1.2 !important;
  }
  #hero-location > p {
    white-space: nowrap !important;
  }

  .business-labels-container .business-label > span {
    font-size: 20px !important;
  }
}
