.ml-5 {
  margin-left: 5px;
}

.mt-25 {
  margin-top: 25px;
}

.page {
  background-color: transparent !important;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
}

.section {
  padding: 29px 40px 29px 40px;
  background-color: transparent;
  overflow: hidden;
}

.pos {
  position: absolute;
  left: 40px;
  top: 9px;
}

.image {
  width: 41px;
  height: 48px;
}

.image_2 {
  margin-left: -11px;
  margin-bottom: 2.5px;
  width: 73.5px;
  height: 29px;
}

.font {
  font-size: 16px;
  font-family: PingFang SC;
  line-height: 15px;
}

.text {
  color: #00a382;
}

.image_3 {
  width: 64px;
  height: 22px;
}

.image_4 {
  margin-left: 39px;
}

.image_5 {
  margin-left: 40px;
  width: 32px;
  height: 22px;
}

.image_6 {
  margin-left: 40px;
  width: 33px;
  height: 22px;
}

.image_7 {
  margin-left: 40px;
  width: 96px;
  height: 22px;
}

.text_2 {
  margin-left: 46px;
  color: #000000;
  line-height: 15px;
}

.image_8 {
  margin-left: 39px;
}

.pos_2 {
  position: absolute;
  right: 40px;
  top: 50%;
  transform: translateY(-50%);
}

.image_9 {
  width: 20px;
  height: 20px;
}

.text_3 {
  color: #000000;
  font-size: 14px;
  font-family: PingFang SC;
  line-height: 10px;
}

.image_10 {
  width: 100vw;
  height: 52.0833vw;
}

.image_11 {
  width: 100vw;
  height: 43.75vw;
}

.image_12 {
  width: 100vw;
  height: 48.3333vw;
}

.image_13 {
  width: 100vw;
  height: 18.75vw;
}

.section_2 {
  padding: 0 319px 17.5px 319px;
  background-color: transparent;
  overflow: hidden;
}

.group {
  padding: 29px 0;
  border-bottom: solid 1px #d3d5d5;
}

.group_3 {
  margin-top: 19px;
}

.group_5 {
  margin-top: 22px;
}

.image_17 {
  width: 56px;
  height: 18px;
}

.section_3 {
  background-color: #d3d5d5;
  width: 1px;
  height: 16px;
}

.image_18 {
  width: 84px;
  height: 18px;
}

.group_2 {
  margin-right: 3px;
}

.image_16 {
  width: 16px;
  height: 16px;
}

.image_20 {
  border-radius: 1px;
  width: 14px;
  height: 11px;
}

.group_4 {
  margin-left: 4px;
}

.image_15 {
  width: 107px;
  height: 24px;
}

.image_19 {
  width: 105px;
  height: 24px;
}

.image-wrapper {
  margin-left: 30px;
  padding: 4px 0;
  background-color: transparent;
  border-radius: 8px;
  overflow: hidden;
  width: 100px;
  height: 100px;
}

.image_14 {
  border-radius: 4px;
  width: 92px;
  height: 92px;
}

.text_4 {
  margin-left: 3.5px;
  color: #949494;
  font-size: 12px;
  font-family: PingFang SC;
  line-height: 12.5px;
}

/* ===================================================
   标杆场景 Benchmark Section
   =================================================== */

.benchmark-section {
  background: #0a0a0f;
  padding: 80px 60px 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ── Header ── */
.benchmark-header {
  text-align: center;
  max-width: 780px;
  margin-bottom: 64px;
}

.benchmark-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.25em;
  color: #5eead4;
  text-transform: uppercase;
  margin: 0 0 18px;
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, sans-serif;
}

.benchmark-title {
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 700;
  color: #f5f5f7;
  margin: 0 0 22px;
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.benchmark-desc {
  font-size: 16px;
  line-height: 1.75;
  color: #8a8a99;
  margin: 0;
  font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ── Grid ── */
.benchmark-grid {
  width: 100%;
  max-width: 1280px;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 280px 280px 280px 340px;
  grid-template-areas:
    "card1 card1 card1 card1 card1 card2 card2 card2 card3 card3 card3 card3"
    "card4 card4 card4 card4 card5 card5 card5 card5 card3 card3 card3 card3"
    "card6 card6 card6 card6 card6 card6 card7 card7 card7 card7 card7 card7"
    "card8 card8 card8 card8 card8 card8 card8 card8 card8 card8 card8 card8";
  gap: 14px;
}

/* Base card */
.bm-card {
  border-radius: 20px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  animation: bm-fadein 0.7s both;
  animation-delay: var(--delay, 0s);
}

/* Assign each card to its named area */
.bm-card:nth-child(1) { grid-area: card1; }
.bm-card:nth-child(2) { grid-area: card2; }
.bm-card:nth-child(3) { grid-area: card3; }
.bm-card:nth-child(4) { grid-area: card4; }
.bm-card:nth-child(5) { grid-area: card5; }
.bm-card:nth-child(6) { grid-area: card6; }
.bm-card:nth-child(7) { grid-area: card7; }
.bm-card:nth-child(8) { grid-area: card8; }

/* Modifier classes kept for semantic HTML, layout via areas above */
.bm-card--wide {}
.bm-card--tall {}
.bm-card--wide-large {}

/* ── Image ── */
.bm-card-img-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.bm-card-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: transform;
}

/* ── Overlay ── */
.bm-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.82) 0%,
    rgba(0, 0, 0, 0.3) 45%,
    transparent 100%
  );
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 22px 22px 20px;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.bm-location-tag {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #5eead4;
  background: rgba(94, 234, 212, 0.12);
  border: 1px solid rgba(94, 234, 212, 0.25);
  border-radius: 20px;
  padding: 4px 12px;
  display: inline-block;
  width: fit-content;
  margin-bottom: 8px;
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, sans-serif;
  text-transform: uppercase;
}

.bm-card-name {
  font-size: 18px;
  font-weight: 600;
  color: #f5f5f7;
  margin: 0;
  line-height: 1.3;
  font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, sans-serif;
  text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}

/* ── Interactions ── */
.bm-card:hover .bm-card-img-wrap img {
  transform: scale(1.07);
}

.bm-card:hover .bm-card-overlay {
  opacity: 1;
}

/* subtle always-visible bottom gradient even without hover */
.bm-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50%;
  background: linear-gradient(to top, rgba(0,0,0,0.45), transparent);
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.bm-card:hover::after {
  opacity: 0;
}

/* ── Home CTA + Footer ── */
.home-cta-section {
  width: 100%;
  min-height: 240px;
  padding: 64px 24px 74px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 22px;
  background:
    radial-gradient(circle at 18% 58%, rgba(48, 235, 190, 0.55), transparent 34%),
    radial-gradient(circle at 86% 24%, rgba(22, 96, 206, 0.72), transparent 42%),
    linear-gradient(115deg, #0b231c 0%, #101315 48%, #0b3266 100%);
  color: #f7fbff;
  overflow: hidden;
}

.home-cta-section h2 {
  margin: 0;
  color: #27f6df;
  font-family: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: clamp(26px, 2.5vw, 38px);
  line-height: 1.2;
  font-weight: 760;
  letter-spacing: 0;
  text-align: center;
}

.home-cta-section button {
  min-width: 112px;
  height: 34px;
  padding: 0 28px;
  border: 0;
  border-radius: 999px;
  background: #31f5cd;
  color: #001a16;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 14px 30px rgba(49, 245, 205, 0.22);
  transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
}

.home-cta-section button:hover {
  transform: translateY(-2px);
  background: #66ffe1;
  box-shadow: 0 18px 36px rgba(49, 245, 205, 0.32);
}

.site-footer-cn .site-footer-contact span {
  color: #202124;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
}

.site-footer-cn .site-footer-contact span::before {
  content: "☎ ";
  color: #8a9194;
  font-weight: 500;
}

.site-footer-cn .site-footer-contact a::before {
  content: "✉ ";
  color: #8a9194;
}

/* ── Entrance animation ── */
@keyframes bm-fadein {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .benchmark-section {
    padding: 60px 30px 80px;
  }

  .benchmark-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(4, 220px);
    grid-template-areas:
      "card1 card2"
      "card3 card4"
      "card5 card6"
      "card7 card8";
  }

  .bm-card:nth-child(1) { grid-area: card1; }
  .bm-card:nth-child(2) { grid-area: card2; }
  .bm-card:nth-child(3) { grid-area: card3; }
  .bm-card:nth-child(4) { grid-area: card4; }
  .bm-card:nth-child(5) { grid-area: card5; }
  .bm-card:nth-child(6) { grid-area: card6; }
  .bm-card:nth-child(7) { grid-area: card7; }
  .bm-card:nth-child(8) { grid-area: card8; }
}

@media (max-width: 640px) {
  .benchmark-section {
    padding: 50px 16px 70px;
  }

  .benchmark-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-rows: 220px;
    grid-template-areas: none;
    gap: 12px;
  }

  .bm-card:nth-child(1),
  .bm-card:nth-child(2),
  .bm-card:nth-child(3),
  .bm-card:nth-child(4),
  .bm-card:nth-child(5),
  .bm-card:nth-child(6),
  .bm-card:nth-child(7),
  .bm-card:nth-child(8) {
    grid-area: unset;
    grid-column: span 1;
    grid-row: span 1;
  }
}