.reference-content .breadcrumb{display: none;}.reference-content{
        --gb-blue: #0759cf;
        --gb-deep: #063b84;
        --gb-cyan: #14a2e6;
        --gb-ink: #172d48;
        --gb-muted: #66778c;
        --gb-line: #dce7f1;
        --gb-soft: #f3f8fe;
        --gb-shadow: 0 12px 34px rgba(12, 62, 119, 0.09);
      }.reference-content *{
        box-sizing: border-box;
      }.reference-content{
        scroll-behavior: smooth;
      }.reference-content{
        margin: 0;
        background: #fff;
        color: var(--gb-ink);
        font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
      }.reference-content .glovebox-topic{
        overflow: hidden;
        font-size: 15px;
        line-height: 1.7;
      }.reference-content .glovebox-topic img{
        display: block;
        max-width: 100%;
      }.reference-content .gb-container{
        width: min(1450px, calc(100% - 48px));
        margin: 0 auto;
      }.reference-content .gb-section{
        padding: 70px 0;
      }.reference-content .gb-soft{
        background: var(--gb-soft);
      }.reference-content .gb-card{
        background: #fff;
        border: 1px solid var(--gb-line);
        border-radius: 9px;
        box-shadow: 0 5px 20px rgba(22, 67, 116, 0.045);
      }.reference-content .gb-heading{
        margin-bottom: 29px;
      }.reference-content .gb-kicker{
        margin: 0 0 7px;
        color: var(--gb-blue);
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.14em;
      }.reference-content .gb-heading h2{
        margin: 0;
        color: var(--gb-deep);
        font-size: clamp(20px, 2.7vw, 34px);
        line-height: 1.28;
        font-weight: 850;
      }.reference-content .gb-heading h2:before{
        content: "";
        display: inline-block;
        width: 5px;
        height: 27px;
        margin-right: 12px;
        border-radius: 4px;
        background: linear-gradient(var(--gb-cyan), var(--gb-blue));
        vertical-align: -4px;
      }.reference-content .gb-heading p{
        max-width: 920px;
        margin: 9px 0 0;
        color: var(--gb-muted);
        font-size: 14px;
      }.reference-content .gb-btn{
        display: inline-flex;
        min-height: 46px;
        padding: 0 25px;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--gb-blue);
        border-radius: 5px;
        background: linear-gradient(90deg, #087fe1, #0754c2);
        color: #fff !important;
        font: inherit;
        font-weight: 700;
        text-decoration: none;
        cursor: pointer;
        transition: 0.2s;
      }.reference-content .gb-btn:hover{
        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(7, 89, 207, 0.25);
      }.reference-content .gb-hero{
        position: relative;
        min-height: 500px;
        overflow: hidden;
        background:
          linear-gradient(90deg, rgba(3, 34, 92, 0.32) 0, rgba(5, 76, 171, 0.12) 100%),
          url("https://img0.tencanballmills.com/202610/reference/202607/selection-guide/glovebox/img/bg.webp") center / cover no-repeat;
      }.reference-content .gb-hero:after{
        content: "";
        position: absolute;
        z-index: 2;
        inset: 0 0 0 44%;
        clip-path: polygon(16% 0, 19% 0, 3% 100%, 0 100%);
        background: linear-gradient(90deg, rgba(7, 86, 184, 0.52) 0, rgba(11, 96, 192, 0.5) 52%, rgba(5, 71, 157, 0.48) 100%);
        pointer-events: none;
      }.reference-content .gb-hero-inner{
        display: block;
        min-height: 500px;
      }.reference-content .gb-hero-copy{
        position: relative;
        z-index: 3;
        width: min(44%, 520px);
        padding: 86px 0;
        color: #fff;
      }.reference-content .gb-year{
        display: inline-block;
        padding: 5px 13px;
        border-radius: 20px;
        background: #fff;
        color: var(--gb-blue);
        font-size: 12px;
        font-weight: 800;
      }.reference-content .gb-hero h1{
        margin: 14px 0 6px;
        font-size: clamp(32px, 5vw, 54px);
        line-height: 1.05;
        font-weight: 900;
      }.reference-content .gb-hero-sub{
        margin: 0 0 22px;
        color: #d9edff;
        font-size: 18px;
      }.reference-content .gb-hero-actions{
        display: flex;
        gap: 11px;
      }.reference-content .gb-hero-visual{
        position: absolute;
        z-index: 1;
        inset: 0 0 0 44%;
        padding: 0;
        overflow: hidden;
        clip-path: polygon(16% 0, 100% 0, 100% 100%, 0 100%);
      }.reference-content .gb-hero-visual img{
        position: absolute;
        inset: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        max-height: none;
        object-fit: cover;
        object-position: center;
        filter: none;
      }.reference-content .gb-metrics{
        margin-top: -34px;
        position: relative;
        z-index: 2;
      }.reference-content .gb-metric-grid{
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        overflow: hidden;
      }.reference-content .gb-metric{
        padding: 21px 17px;
        text-align: center;
        border-right: 1px solid var(--gb-line);
      }.reference-content .gb-metric:last-child{
        border: 0;
      }.reference-content .gb-metric svg{
        width: 64px;
        height: 64px;
        color: var(--gb-blue);
      }.reference-content .gb-metric strong{
        display: block;
        margin-top: 4px;
        color: var(--gb-deep);
        font-size: 14px;
      }.reference-content .gb-metric b{
        display: block;
        color: var(--gb-blue);
        font-size: 13px;
      }.reference-content .gb-metric span{
        color: var(--gb-muted);
        font-size: 11px;
      }.reference-content .gb-product-grid{
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 17px;
      }.reference-content .gb-product{
        overflow: hidden;
        transition: 0.2s;
      }.reference-content .gb-product:hover{
        transform: translateY(-5px);
        box-shadow: var(--gb-shadow);
      }.reference-content .gb-product figure{
        margin: 0;
        padding: 13px;
      }.reference-content .gb-product img{
        height: 100%;
        object-fit: cover;
        object-position: center;
        margin: auto;
      }.reference-content .gb-product-body{
        padding: 18px;
      }.reference-content .gb-tag{
        display: inline-block;
        padding: 2px 8px;
        background: #e8f4ff;
        color: var(--gb-blue);
        font-size: 10px;
        font-weight: 700;
      }.reference-content .gb-product h3{
        margin: 7px 0 5px;
        color: var(--gb-deep);
        font-size: 18px;
      }.reference-content .gb-product ul{
        min-height: 75px;
        margin: 0;
        padding: 0;
        list-style: none;
        color: var(--gb-muted);
        font-size: 12px;
      }.reference-content .gb-product li{
        padding: 2px 0;
      }.reference-content .gb-product li:before{
        content: "✓";
        margin-right: 7px;
        color: var(--gb-blue);
        font-weight: 800;
      }.reference-content .gb-product a{
        display: inline-block;
        margin-top: 10px;
        color: var(--gb-blue);
        font-size: 12px;
        font-weight: 700;
        text-decoration: none;
      }.reference-content .gb-app-grid{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 17px;
      }.reference-content .gb-app{
        position: relative;
        overflow: hidden;
        min-height: 230px;
      }.reference-content .gb-app figure{
        height: 230px;
        margin: 0;
      }.reference-content .gb-app img{
        width: 100%;
        height: 100%;
        object-fit: cover;
      }.reference-content .gb-app:after{
        content: "";
        position: absolute;
        inset: 45% 0 0;
        background: linear-gradient(transparent, rgba(3, 25, 55, 0.86));
      }.reference-content .gb-app h3{
        position: absolute;
        z-index: 2;
        left: 20px;
        right: 20px;
        bottom: 15px;
        margin: 0;
        color: #fff;
        font-size: 18px;
      }.reference-content .gb-app h3 span{
        display: block;
        color: #bfe5ff;
        font-size: 11px;
        font-weight: 400;
      }.reference-content .gb-feature-table{
        display: grid;
        gap: 14px;
      }.reference-content .gb-feature-row{
        display: grid;
        grid-template-columns: 170px 1fr 0.9fr;
        gap: 20px;
        align-items: center;
        padding: 18px;
      }.reference-content .gb-feature-product{
        display: flex;
        align-items: center;
        gap: 12px;
      }.reference-content .gb-feature-icon{
        display: grid;
        width: 64px;
        height: 64px;
        flex: 0 0 64px;
        place-items: center;
        border-radius: 12px;
        background: #f2f7fb;
        color: var(--gb-blue);
      }.reference-content .gb-feature-icon svg{
        width: 36px;
        height: 36px;
      }.reference-content .gb-feature-product h3{
        margin: 0;
        color: var(--gb-deep);
        font-size: 16px;
      }.reference-content .gb-feature-list{
        margin: 0;
        padding: 0;
        list-style: none;
        color: var(--gb-muted);
        font-size: 12px;
      }.reference-content .gb-feature-list li{
        padding: 3px 0;
      }.reference-content .gb-feature-list li:before{
        content: "•";
        margin-right: 8px;
        color: var(--gb-blue);
      }.reference-content .gb-feature-tags{
        display: flex;
        justify-content: flex-end;
        gap: 9px;
        flex-wrap: wrap;
      }.reference-content .gb-feature-tags span{
        padding: 8px 12px;
        border-radius: 20px;
        background: #eff6ff;
        color: #416482;
        font-size: 11px;
      }.reference-content .gb-guide-grid{
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 14px;
      }.reference-content .gb-guide{
        padding: 23px 17px;
        text-align: center;
        border-top: 3px solid var(--gb-blue);
      }.reference-content .gb-guide-icon{
        display: grid;
        width: 58px;
        height: 58px;
        margin: 0 auto 11px;
        place-items: center;
        border-radius: 50%;
        background: #e9f4ff;
        color: var(--gb-blue);
      }.reference-content .gb-guide-icon svg{
        width: 31px;
        height: 31px;
      }.reference-content .gb-guide b{
        color: var(--gb-blue);
        font-size: 11px;
      }.reference-content .gb-guide h3{
        margin: 3px 0;
        color: var(--gb-deep);
        font-size: 16px;
      }.reference-content .gb-guide p{
        margin: 5px 0 0;
        color: var(--gb-muted);
        font-size: 11px;
      }.reference-content .clients-marquee-group{
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      align-items: stretch;
      gap: 0;
      margin-top: 38px;
      padding: 0;
      overflow: hidden;
      border: 1px solid var(--pm-line);
      border-radius: 8px;
      background: #fff;
    }.reference-content .clients-marquee-group img{
      display: block;
      flex: none;
      width: 100%;
      height: 74px;
      padding: 10px;
      border-right: 1px solid var(--pm-line);
      border-bottom: 1px solid var(--pm-line);
      background: #fff;
      object-fit: contain;
      filter: none;
      opacity: 1;
      transition: none;
    }.reference-content .gb-cta{
        padding: 46px 0;
        background: radial-gradient(
            circle at 82% 20%,
            rgba(19, 164, 230, 0.6),
            transparent 42%
          ),
          linear-gradient(105deg, #063174, #075cb1);
        color: #fff;
      }.reference-content .gb-cta-inner{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 34px;
      }.reference-content .gb-cta h2{
        margin: 0;
        font-size: clamp(28px, 3vw, 40px);
      }.reference-content .gb-cta p{
        margin: 7px 0 0;
        color: #d7eafb;
      }.reference-content .gb-cta .gb-btn{
        white-space: nowrap;
        background: #fff;
        color: var(--gb-blue) !important;
      }
      @media (max-width: 1100px) {.reference-content .gb-hero-visual,.reference-content .gb-hero:after{
          inset: 0 0 0 60%;
        }.reference-content .gb-product-grid{
          grid-template-columns: 1fr 1fr;
        }.reference-content .gb-guide-grid{
          grid-template-columns: repeat(3, 1fr);
        }.reference-content .clients-marquee-group{
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }.reference-content .gb-hero-copy{width: min(60%, 520px);}
      }
      @media (max-width: 768px) {.reference-content .gb-container{
          width: 96%;
        }.reference-content .gb-section{
          padding: 50px 0;
        }.reference-content .gb-hero{
          min-height: 0;
          background:
            linear-gradient(180deg, rgba(3, 46, 119, 0.44) 0, rgba(6, 77, 171, 0.16) 100%),
            url("https://img0.tencanballmills.com/202610/reference/202607/selection-guide/glovebox/img/bg.webp") center / cover no-repeat;
        }.reference-content .gb-hero:after{
          display: none;
        }.reference-content .gb-hero-inner{
          min-height: 0;
        }.reference-content .gb-hero-copy{
          width: auto;
          padding: 48px 0 38px;
          text-align: center;
        }.reference-content .gb-hero h1{
          font-size: 46px;
        }.reference-content .gb-hero-actions{
          justify-content: center;
        }.reference-content .gb-hero-visual{
          position: relative;
          inset: auto;
          height: 320px;
          width: 80%;
          min-height: 0;
          clip-path: none;
          margin-bottom: 40px;
          border-radius: 16px;
          margin-left: auto; margin-right: auto;
        }.reference-content .gb-hero-visual img{
          max-height: none;
          width: 100%;
        }.reference-content .gb-metrics{
          margin-top: 30px;
        }.reference-content .gb-metric-grid{
          grid-template-columns: 1fr 1fr;
        }.reference-content .gb-metric:nth-child(2){
          border-right: 0;
        }.reference-content .gb-metric:nth-child(-n + 2){
          border-bottom: 1px solid var(--gb-line);
        }.reference-content .gb-app-grid{
          grid-template-columns: 1fr 1fr;
        }.reference-content .gb-feature-row{
          grid-template-columns: 150px 1fr;
        }.reference-content .gb-feature-tags{
          grid-column: 1/-1;
          justify-content: flex-start;
        }.reference-content .gb-guide-grid{
          grid-template-columns: 1fr 1fr;
        }.reference-content .gb-cta-inner{
          display: grid;
          text-align: center;
        }.reference-content .gb-cta .gb-btn{
          justify-self: center;
        }.reference-content .gb-heading p{font-size: 13px; font-weight: normal;}
      }
      @media (max-width: 480px) {.reference-content .gb-hero h1{
          font-size: 38px;
        }.reference-content .gb-hero-actions{
          display: grid;
        }.reference-content .gb-btn{
          width: 100%;
        }.reference-content .gb-product-grid,.reference-content .gb-app-grid,.reference-content .gb-guide-grid{
          grid-template-columns: 1fr;
        }.reference-content .gb-feature-row{
          grid-template-columns: 1fr;
        }.reference-content .clients-marquee-group{
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }.reference-content .gb-hero-visual{height: 240px;}
      }