/* 2026 B2B compliance homepage: product-led clarity with human delivery proof. */
:root {
  --cf-navy: #071b39;
  --cf-ink: #0c2345;
  --cf-indigo: #4e5bea;
  --cf-blue: #2387f3;
  --cf-mint: #47d8bb;
  --cf-cloud: #f5f7fc;
  --cf-line: #dce4f0;
}

body {
  background: var(--cf-cloud);
  color: #263952;
}

.site-header {
  background: rgba(250, 252, 255, 0.88) !important;
  border-bottom-color: rgba(33, 52, 88, 0.09) !important;
  box-shadow: none !important;
}

.site-nav .links a {
  font-weight: 650;
}

.site-nav .links a.active,
.site-nav .links a:hover {
  color: var(--cf-indigo) !important;
}

.site-nav .links a::after {
  background: var(--cf-indigo) !important;
}

.site-nav .phone {
  border-color: #dce3f5;
  background: #fff;
}

#top.hero {
  min-height: 748px;
  background:
    radial-gradient(circle at 72% 45%, rgba(57, 103, 255, 0.34), transparent 25%),
    radial-gradient(circle at 54% 76%, rgba(71, 216, 187, 0.13), transparent 23%),
    linear-gradient(120deg, #07152f 0%, #0a1e44 49%, #172b63 100%);
}

#top.hero::before {
  background:
    linear-gradient(90deg, rgba(7, 21, 47, 0.99) 0%, rgba(7, 21, 47, 0.94) 38%, rgba(9, 29, 68, 0.67) 66%, rgba(10, 26, 65, 0.27) 100%),
    linear-gradient(90deg, rgba(149, 168, 255, 0.075) 1px, transparent 1px),
    linear-gradient(rgba(149, 168, 255, 0.06) 1px, transparent 1px),
    url('assets/images/banner/首页@2x.png') 80% center / cover no-repeat;
  background-size: auto, 52px 52px, 52px 52px, cover;
}

#top .hero-inner {
  padding-top: 80px;
}

#top .eyebrow {
  color: #9baeff !important;
}

#top .eyebrow i {
  background: var(--cf-mint) !important;
  box-shadow: 0 0 0 5px rgba(71, 216, 187, 0.15) !important;
}

#top .hero-badge {
  border-color: rgba(110, 230, 207, 0.36);
  background: rgba(42, 112, 133, 0.22);
  color: #91f0d8 !important;
}

#top .hero h1 {
  max-width: 645px;
  font-size: clamp(48px, 5.2vw, 72px);
  letter-spacing: -0.07em;
}

#top .hero h1 em {
  color: #80a5ff !important;
}

#top .hero-copy {
  max-width: 570px;
  color: #cad9ef;
  font-size: 18px;
}

#top .hero .button-primary {
  background: linear-gradient(135deg, #6672ff, #268df2);
  color: #fff;
  box-shadow: 0 17px 34px rgba(20, 83, 218, 0.28);
}

#top .button-ghost {
  border-color: rgba(190, 210, 255, 0.35);
  background: rgba(255, 255, 255, 0.045);
}

#top .hero-proof {
  gap: 0;
  border-top-color: rgba(179, 199, 255, 0.21);
}

#top .hero-proof>div {
  min-width: 145px;
  padding-right: 23px;
}

#top .hero-proof>div+div {
  padding-left: 23px;
  border-left: 1px solid rgba(179, 199, 255, 0.2);
}

#top .hero-proof b {
  font-size: 27px;
}

#top .ai-console {
  top: 80px;
  right: max(22px, calc((100% - 1180px) / 2));
  width: 500px;
  border-color: rgba(153, 171, 255, 0.36);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(36, 56, 123, 0.82), rgba(8, 20, 55, 0.94));
  box-shadow: 0 30px 90px rgba(0, 4, 26, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

#top .console-head {
  color: #ecf3ff;
}

#top .console-metric,
#top .console-chart,
#top .console-status>div {
  border-color: rgba(176, 194, 255, 0.17);
  background: rgba(3, 13, 42, 0.32);
}

#top .console-metric:last-child b,
#top .console-live,
#top .chart-percent {
  color: #70e5c7 !important;
}

.proof-strip {
  border-bottom-color: #e2e7f0 !important;
}

.proof-strip__facts b {
  color: #243d5b !important;
}

.proof-strip__shield {
  color: #4e5bea !important;
  background: #edf0ff !important;
}

.home-overview {
  padding-top: 96px;
  background: radial-gradient(circle at 86% 2%, rgba(78, 91, 234, 0.13), transparent 26%), var(--cf-cloud);
}

.home-overview__head {
  align-items: center;
}

.home-overview__head .intro {
  color: #6a7f9a;
}

.overview-card {
  min-height: 324px;
  border-radius: 22px;
  border-color: #dfe6f1;
  box-shadow: 0 16px 42px rgba(33, 47, 83, 0.055);
}

.overview-card::before {
  position: absolute;
  top: 0;
  right: 27px;
  width: 52px;
  height: 3px;
  border-radius: 0 0 6px 6px;
  background: var(--cf-indigo);
  content: "";
}

.overview-card--case {
  background: linear-gradient(135deg, #111c3c, #1d3574);
}

.overview-card--case::before {
  background: var(--cf-mint);
}

.overview-card h3 {
  font-size: 26px;
}

.overview-card a {
  color: var(--cf-indigo);
}

.section {
  background: #fff;
}

.section .title,
.home-cases .title {
  color: var(--cf-ink);
}

.kicker,
.text-link {
  color: var(--cf-indigo) !important;
}

.service-grid {
  gap: 18px;
}

.service-card {
  min-height: 350px;
  border-radius: 20px;
  border-color: #e0e7f0;
  background: linear-gradient(150deg, #fff, #f9fbff);
}

.service-card:hover {
  border-color: #aeb8ff;
  box-shadow: 0 22px 46px rgba(48, 65, 145, 0.14);
}

.service-card::after {
  border-color: #d8defe;
  box-shadow: 0 0 0 25px #f3f5ff;
}

.service-card .icon {
  color: var(--cf-indigo);
  background: #edf0ff;
}

.service-card a {
  color: var(--cf-indigo);
}

.trust {
  padding: 98px 0;
  background: linear-gradient(125deg, #07152f, #10285c 68%, #123f73);
}

.trust .title {
  font-size: clamp(31px, 3vw, 47px);
}

.trust .trust-list {
  gap: 19px;
}

.trust-list div {
  border-top-color: rgba(184, 202, 255, 0.2);
}

.data-panel {
  padding: 39px;
  border-radius: 22px;
  border-color: rgba(161, 184, 255, 0.32);
  background: linear-gradient(145deg, rgba(86, 102, 234, 0.35), rgba(49, 178, 201, 0.13));
}

.section-soft {
  background: #eef3fb !important;
}

.process {
  border: 0;
  border-radius: 22px;
  background: linear-gradient(135deg, #0a1733, #132e68) !important;
}

.step {
  min-height: 240px;
  border-right-color: rgba(199, 212, 255, 0.15);
  background: transparent;
}

.step-no {
  color: #78e4c9;
}

.step h3 {
  color: #fff !important;
}

.step p {
  color: #c5d3e8;
}

.step::after {
  background: #203b78;
  color: #8ef0d6;
}

.home-cases {
  background: #fff;
}

.home-case {
  min-height: 264px;
  border-radius: 22px;
  border-color: #dee6ef;
  background: linear-gradient(145deg, #fff, #f6f9ff);
}

.home-case::after {
  position: absolute;
  right: -54px;
  top: -60px;
  width: 166px;
  height: 166px;
  border: 1px solid #dce5ff;
  border-radius: 50%;
  content: "";
}

.home-case>* {
  position: relative;
  z-index: 1;
}

.home-case__result a {
  color: var(--cf-indigo);
}

.insights {
  gap: 18px;
}

.feature-news {
  min-height: 330px;
  border-radius: 22px;
  border-color: #dce5fb;
  background: radial-gradient(circle at 87% 12%, rgba(87, 100, 246, 0.22), transparent 24%), linear-gradient(130deg, #eef1ff, #fafcff);
}

.feature-news h3 {
  font-size: 29px;
}

.mini-news {
  border-radius: 22px;
  border-color: #e0e6ef;
}

.mini-news a,
.feature-news a {
  color: var(--cf-indigo);
}

.home-summary {
  background: radial-gradient(circle at 88% 22%, rgba(76, 96, 255, 0.34), transparent 27%), linear-gradient(128deg, #07152f, #122b63 67%, #144d77);
}

.home-summary__grid {
  border-color: rgba(190, 209, 255, 0.23);
}

.home-summary__lead,
.home-summary__metric {
  background: rgba(4, 13, 38, 0.34);
}

.home-about {
  background: linear-gradient(135deg, #f7f9ff, #edf4fb);
}

.home-about__panel {
  border-color: rgba(122, 145, 255, 0.33);
  background: linear-gradient(145deg, #101d45, #294d91);
}

.home-follow {
  background: #f7f9fc;
}

.home-follow__box {
  border-color: #dfe6f0;
  background: #fff;
}

.contact {
  background: linear-gradient(135deg, #ecf1ff, #e8fbf6) !important;
}

.contact-box {
  border: 1px solid rgba(198, 211, 247, 0.62);
  border-radius: 22px;
}

@media (max-width: 1120px) {
  #top .ai-console {
    right: -70px;
    width: 470px;
  }

  #top .hero h1 {
    max-width: 535px;
    font-size: 59px;
  }
}

@media (max-width: 850px) {
  #top.hero {
    min-height: 650px;
  }

  #top .hero-inner {
    padding-top: 94px;
  }

  #top .ai-console {
    display: none;
  }

  #top .hero h1 {
    max-width: 650px;
    font-size: clamp(42px, 9vw, 62px);
  }

  #top .hero-proof>div {
    min-width: 0;
    padding-right: 10px;
  }

  #top .hero-proof>div+div {
    padding-left: 10px;
  }
}

@media (max-width: 620px) {
  #top.hero {
    min-height: 626px;
  }

  #top .hero-inner {
    padding-top: 80px;
  }

  #top .hero h1 {
    font-size: 43px;
  }

  #top .hero-proof b {
    font-size: 21px;
  }

  #top .hero-proof span {
    font-size: 11px;
  }

  .home-overview {
    padding-top: 68px;
  }

  .service-card,
  .home-case {
    border-radius: 18px;
  }

  .feature-news h3 {
    font-size: 24px;
  }

  .data-panel {
    padding: 28px;
  }
}