/* vipkei.com PC 普通内容页专用样式
 * source: templets/default/index_article.htm
 * version: 20260612-p1s5-content-page
 */

body.pc-single-page-template *,
    body.pc-single-page-template *::before,
    body.pc-single-page-template *::after {
      box-sizing: border-box;
    }

    body.pc-single-page-template #content,
    body.pc-single-page-template #content input,
    body.pc-single-page-template #content textarea,
    body.pc-single-page-template #content select,
    body.pc-single-page-template #content button {
      font-family: "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
    }



    /*
     * PC 普通单页统一主体：仅修复左侧公共栏与右侧内容分离问题。
     * 尺寸与文章列表页保持一致，不改变现有颜色、字体、卡片和正文样式。
     */
    body.pc-single-page-template .pc-single-shell {
      display: grid !important;
      grid-template-columns: 300px minmax(0, 830px) !important;
      column-gap: 70px !important;
      align-items: start !important;
      width: 1200px !important;
      max-width: calc(100% - 32px) !important;
      min-width: 0 !important;
      height: auto !important;
      margin: 0 auto 40px !important;
      padding: 0 !important;
      float: none !important;
      clear: both !important;
      overflow: visible !important;
    }

    body.pc-single-page-template .pc-single-shell > .vk-pc-sidebar {
      float: none !important;
      width: 300px !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin: 0 !important;
      align-self: start;
    }

    body.pc-single-page-template .pc-single-content-column {
      float: none !important;
      width: 830px !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin: 0 !important;
    }

    body.pc-single-page-template .pc-single-content-column > .sidebar,
    body.pc-single-page-template .pc-single-content-column > .column {
      float: none !important;
      width: 100% !important;
      min-width: 0 !important;
      margin: 0 !important;
    }

    body.pc-single-page-template .pc-single-content-column > .sidebar .title_r {
      width: 100%;
      min-height: 58px;
      margin: 0;
      border-bottom: 1px solid #DBE2E6;
      line-height: 58px;
    }

    @media (max-width: 1240px) {
      body.pc-single-page-template .pc-single-shell {
        grid-template-columns: 300px minmax(0, 1fr) !important;
        column-gap: 40px !important;
        width: calc(100% - 32px) !important;
      }

      body.pc-single-page-template .pc-single-content-column {
        width: 100% !important;
      }
    }

    @media (max-width: 980px) {
      body.pc-single-page-template .pc-single-shell {
        grid-template-columns: minmax(0, 1fr) !important;
        row-gap: 20px !important;
        width: calc(100% - 24px) !important;
      }

      body.pc-single-page-template .pc-single-shell > .vk-pc-sidebar,
      body.pc-single-page-template .pc-single-content-column {
        width: 100% !important;
      }
    }

    @media (max-width: 680px) {
      body.pc-single-page-template .pc-single-shell {
        width: calc(100% - 12px) !important;
      }
    }

    body.pc-single-page-template .pc-single-breadcrumb {
      margin: 0;
      padding: 0;
      color: #777777;
      font-size: 14px;
      line-height: 1.65;
    }

    body.pc-single-page-template .pc-single-breadcrumb a {
      color: #555555;
      text-decoration: none;
    }

    body.pc-single-page-template .pc-single-breadcrumb a:hover,
    body.pc-single-page-template .pc-single-breadcrumb a:focus {
      color: #168FBD;
    }

    body.pc-single-page-template .pc-single-breadcrumb__separator {
      margin: 0 6px;
      color: #999999;
    }

    body.pc-single-page-template .column,
    body.pc-single-page-template .pc-single-main,
    body.pc-single-page-template .pc-single-entry {
      min-width: 0;
    }

    body.pc-single-page-template .pc-single-main,
    body.pc-single-page-template .pc-single-entry {
      width: 100%;
    }

    body.pc-single-page-template .pc-single-page-head {
      margin: 0 0 14px;
      padding: 22px 26px 20px;
      border: 1px solid #E1E8EC;
      border-radius: 3px;
      background: #FFFFFF;
      box-shadow: 0 4px 14px rgba(20, 48, 74, .05);
    }

    body.pc-single-page-template .pc-single-eyebrow {
      margin: 0 0 7px;
      color: #168FBD;
      font-size: 13px;
      line-height: 1.5;
      font-weight: 700;
      letter-spacing: .08em;
    }

    body.pc-single-page-template .pc-single-title {
      position: relative;
      margin: 0;
      padding-left: 13px;
      color: #2B2B2B;
      font-size: 25px;
      line-height: 1.4;
      font-weight: 700;
    }

    body.pc-single-page-template .pc-single-title::before,
    body.pc-single-page-template .hy-about-section > h2::before {
      position: absolute;
      top: .16em;
      bottom: .16em;
      left: 0;
      width: 4px;
      border-radius: 1px;
      background: #30B7EF;
      content: "";
    }

    body.pc-single-page-template .pc-single-page-intro {
      max-width: 820px;
      margin: 10px 0 0;
      color: #555555;
      font-size: 16px;
      line-height: 1.78;
    }

    body.pc-single-page-template .pc-single-entry {
      margin: 0;
      padding: 0;
      color: #555555;
      font-size: 16px;
      line-height: 1.78;
      overflow-wrap: anywhere;
    }

    body.pc-single-page-template .pc-single-entry > :first-child {
      margin-top: 0;
    }

    body.pc-single-page-template .pc-single-entry > :last-child {
      margin-bottom: 0;
    }

    body.pc-single-page-template .pc-single-entry p {
      margin: 0 0 12px;
      color: #555555;
      font-size: 16px;
      line-height: 1.78;
    }

    body.pc-single-page-template .pc-single-entry ul,
    body.pc-single-page-template .pc-single-entry ol {
      margin: 0 0 14px;
      padding-left: 1.6em;
    }

    body.pc-single-page-template .pc-single-entry li {
      margin: 0 0 6px;
    }

    body.pc-single-page-template .pc-single-entry a:not(.hy-about-btn) {
      color: #168FBD;
      text-decoration: none;
      overflow-wrap: anywhere;
    }

    body.pc-single-page-template .pc-single-entry a:not(.hy-about-btn):hover,
    body.pc-single-page-template .pc-single-entry a:not(.hy-about-btn):focus {
      color: #30B7EF;
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    body.pc-single-page-template .pc-single-entry img {
      display: block;
      width: auto;
      max-width: 100%;
      height: auto;
      margin: 0 auto;
      border-radius: 2px;
    }

    body.pc-single-page-template .pc-single-entry figure {
      max-width: 100%;
      margin: 18px 0;
    }

    body.pc-single-page-template .pc-single-entry figcaption {
      margin: 8px 0 0;
      color: #777777;
      font-size: 13px;
      line-height: 1.65;
      text-align: center;
    }

    body.pc-single-page-template .pc-table-scroll {
      width: 100%;
      max-width: 100%;
      margin: 14px 0;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }

    body.pc-single-page-template .pc-single-entry table {
      width: 100%;
      min-width: 620px;
      margin: 0;
      border-collapse: collapse;
      background: #FFFFFF;
      color: #555555;
      font-size: 14px;
    }

    body.pc-single-page-template .pc-single-entry th,
    body.pc-single-page-template .pc-single-entry td {
      padding: 10px 12px;
      border: 1px solid #DDE5E9;
      text-align: left;
      vertical-align: top;
    }

    body.pc-single-page-template .pc-single-entry th {
      background: #F5FAFC;
      color: #2B2B2B;
      font-weight: 700;
    }

    body.pc-single-page-template .pc-media-frame {
      position: relative;
      width: 100%;
      max-width: 100%;
      margin: 16px 0;
      overflow: hidden;
      aspect-ratio: 16 / 9;
      border-radius: 3px;
      background: #000000;
    }

    body.pc-single-page-template .pc-media-frame iframe,
    body.pc-single-page-template .pc-media-frame video {
      position: absolute;
      inset: 0;
      display: block;
      width: 100%;
      height: 100%;
      border: 0;
    }

    body.pc-single-page-template .pc-single-entry pre {
      max-width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }

    body.pc-single-page-template .hy-about {
      display: grid;
      gap: 14px;
      width: 100%;
      margin: 0;
      padding: 0;
    }

    body.pc-single-page-template .hy-about-section {
      min-width: 0;
      margin: 0;
      padding: 22px 24px;
      border: 1px solid #E1E8EC;
      border-radius: 3px;
      background: #FFFFFF;
      box-shadow: 0 3px 12px rgba(20, 48, 74, .045);
    }

    body.pc-single-page-template .hy-about-section > h2 {
      position: relative;
      margin: 0 0 13px;
      padding-left: 13px;
      color: #2B2B2B;
      font-size: 21px;
      line-height: 1.45;
      font-weight: 700;
    }

    body.pc-single-page-template .hy-about-section h3 {
      position: relative;
      margin: 0 0 8px;
      padding-left: 11px;
      color: #2B2B2B;
      font-size: 18px;
      line-height: 1.5;
      font-weight: 700;
    }

    body.pc-single-page-template .hy-about-section h3::before {
      position: absolute;
      top: .2em;
      bottom: .2em;
      left: 0;
      width: 3px;
      border-radius: 1px;
      background: #F6B927;
      content: "";
    }

    body.pc-single-page-template .hy-about-overview {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
      gap: 18px;
      align-items: stretch;
      min-width: 0;
    }

    body.pc-single-page-template .hy-about-facts {
      display: grid;
      align-content: start;
      gap: 9px;
      min-width: 0;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    body.pc-single-page-template .hy-about-facts li {
      min-width: 0;
      margin: 0;
      padding: 10px 12px;
      border-left: 3px solid #30B7EF;
      background: #F5FAFC;
      color: #555555;
      font-size: 14px;
      line-height: 1.7;
    }

    body.pc-single-page-template .hy-about-company-figure {
      width: 100%;
      margin: 18px 0 0;
      padding: 10px;
      border: 1px solid #E2E8EC;
      border-radius: 3px;
      background: #FAFCFD;
      text-align: center;
    }

    body.pc-single-page-template .hy-about-company-figure figcaption {
      margin: 9px 0 0;
    }

    body.pc-single-page-template .hy-about-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
    }

    body.pc-single-page-template .hy-about-capabilities {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    body.pc-single-page-template .hy-about-card,
    body.pc-single-page-template .hy-about-capability {
      min-width: 0;
      padding: 16px;
      border: 1px solid #E2E8EC;
      border-radius: 3px;
      background: #FFFFFF;
    }

    body.pc-single-page-template .hy-about-capability {
      background: #FAFCFD;
    }

    body.pc-single-page-template .hy-about-card p,
    body.pc-single-page-template .hy-about-capability p {
      margin: 0;
      color: #666666;
      font-size: 14px;
      line-height: 1.72;
    }

    body.pc-single-page-template .hy-about-process {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 9px;
      margin: 0;
      padding: 0;
      list-style: none;
      counter-reset: about-process;
    }

    body.pc-single-page-template .hy-about-process li {
      position: relative;
      min-width: 0;
      margin: 0;
      padding: 44px 12px 13px;
      border: 1px solid #E1E8EC;
      border-radius: 3px;
      background: #FFFFFF;
      color: #555555;
      font-size: 14px;
      line-height: 1.65;
      text-align: center;
      counter-increment: about-process;
    }

    body.pc-single-page-template .hy-about-process li::before {
      position: absolute;
      top: 11px;
      left: 50%;
      display: inline-flex;
      width: 25px;
      height: 25px;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      background: #30B7EF;
      color: #FFFFFF;
      font-size: 13px;
      font-weight: 700;
      content: counter(about-process);
      transform: translateX(-50%);
    }

    body.pc-single-page-template .hy-about-process strong {
      display: block;
      margin-bottom: 4px;
      color: #2B2B2B;
    }

    /* 个别后台单页已包含咨询区，改为浅色信息卡，避免再次出现突兀的深色大 CTA。 */
    body.pc-single-page-template .hy-about-cta {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 18px;
      align-items: center;
      padding: 22px 24px;
      border: 1px solid #D7E8F0;
      border-radius: 3px;
      background: #F5FAFC;
      color: #2B2B2B;
    }

    body.pc-single-page-template .hy-about-cta h2 {
      margin: 0 0 8px;
      padding: 0;
      color: #2B2B2B;
      font-size: 21px;
      line-height: 1.45;
    }

    body.pc-single-page-template .hy-about-cta p {
      max-width: 690px;
      margin: 0;
      color: #5F6870;
      font-size: 14px;
      line-height: 1.75;
    }

    body.pc-single-page-template .hy-about-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      justify-content: flex-end;
    }

    body.pc-single-page-template .pc-single-entry .hy-about-btn {
      display: inline-flex;
      min-height: 42px;
      align-items: center;
      justify-content: center;
      padding: 9px 18px;
      border: 1px solid #30B7EF;
      border-radius: 3px;
      background: #FFFFFF;
      color: #168FBD;
      font-size: 14px;
      font-weight: 700;
      text-decoration: none;
    }

    body.pc-single-page-template .pc-single-entry .hy-about-btn-primary {
      border-color: #30B7EF;
      background: #30B7EF;
      color: #FFFFFF;
    }

    body.pc-single-page-template .pc-single-entry .hy-about-btn:hover,
    body.pc-single-page-template .pc-single-entry .hy-about-btn:focus {
      border-color: #168FBD;
      background: #168FBD;
      color: #FFFFFF;
      text-decoration: none;
    }

    body.pc-single-page-template .pc-single-empty {
      margin: 0;
      padding: 24px;
      border: 1px solid #E1E8EC;
      border-radius: 3px;
      background: #FFFFFF;
      color: #666666;
      font-size: 15px;
      line-height: 1.75;
      text-align: center;
    }

    body.pc-single-page-template .pc-clear {
      clear: both;
      width: 100%;
      height: 0;
      overflow: hidden;
    }

    @media (max-width: 1050px) {
      body.pc-single-page-template .hy-about-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      body.pc-single-page-template .hy-about-process {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }

    @media (max-width: 820px) {
      body.pc-single-page-template .hy-about-overview,
      body.pc-single-page-template .hy-about-capabilities,
      body.pc-single-page-template .hy-about-cta {
        grid-template-columns: 1fr;
      }

      body.pc-single-page-template .hy-about-actions {
        justify-content: flex-start;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      body.pc-single-page-template *,
      body.pc-single-page-template *::before,
      body.pc-single-page-template *::after {
        scroll-behavior: auto;
        transition-duration: .01ms;
        animation-duration: .01ms;
        animation-iteration-count: 1;
      }
    }
