/* ==========================================
   Figma Content Styles - Guide Article Page
   PC base: 1920x12715 (.figma/3401_2928/)
   Mobile base: 414x18751 (.figma/3438_2362/)
   ========================================== */

/* Fix anchor positioning under sticky banner */
html {
  scroll-padding-top: 200px;
  scroll-behavior: smooth;
}

:root {
  /* Colors - 严格按 Figma SCSS */
  --fc-green: #34c040;
  --fc-green-2: #02ce80;
  --fc-green-3: #7bd706;
  --fc-grad-green: linear-gradient(180deg, #02ce80 0%, #7bd706 100%);
  --fc-grad-card: linear-gradient(225deg, #d1f8f7 0%, #e5ffda 100%);
  --fc-grad-header: linear-gradient(180deg, #ffffff00 0%, #90ee9026 50%, #00960026 100%);
  --fc-text-dark: #141d38;
  --fc-text-body: #484e60;
  --fc-text-mute: #737887;
  --fc-text-mute-2: #66749e;
  --fc-bg-blue-grey: #eff1f9;
  --fc-btn-black: #16181d;
  --fc-tag-blue: #0781fc;
  --fc-border: #e0e0e0;
  --fc-border-2: #d7d7d7;
  --fc-overlay-white: #ffffff33;

  /* Fonts */
  --fc-font: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
             SimHei, Arial, Helvetica, sans-serif;
  --fc-font-header: Roboto, "PingFang SC", "Hiragino Sans GB",
                    "Microsoft YaHei", SimHei, sans-serif;
  --fc-font-figtree: Figtree, var(--fc-font);
  --fc-font-nunito: "Nunito Sans", var(--fc-font);
}

/* Reset for content area only */
#figma-content,
#figma-content * {
  box-sizing: border-box;
}
#figma-content h1, #figma-content h2, #figma-content h3,
#figma-content h4, #figma-content h5, #figma-content h6,
#figma-content p, #figma-content ul, #figma-content ol,
#figma-content li, #figma-content figure, #figma-content figcaption,
#figma-content blockquote, #figma-content dl, #figma-content dd {
  margin: 0;
  padding: 0;
}
#figma-content {
  font-family: var(--fc-font);
  color: var(--fc-text-dark);
  background: #fff;
  /* Font smoothing for better rendering */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
#figma-content img { display: block; max-width: 100%; height: auto; }
#figma-content ul, #figma-content ol { list-style: none; }
#figma-content a { color: inherit; text-decoration: none; }
#figma-content p {
  font-family: var(--fc-font);
  color: var(--fc-text-body);
  line-height: 22px;
  font-size: 16px;
  letter-spacing: 0.01px; 
  font-weight: 400;
}

/* Layout containers — fluid, no canvas scaling */
.fc-pc-canvas {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}
.fc-pc-wrap {
  width: 100%;
}

/* Product Banner - sticky under header */
.fc-product-banner {
  display: none;
  align-items: center;
  justify-content: center;
  background: #eff1f9;
  /* padding: 16px 100px; */
  width: 100%;
  height: 100px;
  position: sticky;
  top: 95px;
  z-index: 99;
  overflow: hidden;
}
.fc-product-banner-inner {
  width: 1376px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
}
.fc-product-banner.is-banner-visible {
  display: flex;
}
.fc-pb-left {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  column-gap: 10px;
}
.fc-pb-logo {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  overflow: hidden;
}
.fc-pb-title {
  flex-shrink: 0;
  line-height: 19px;
  letter-spacing: 0;
  font-size: 16px;
  font-weight: 700;
  color: #141d38;
  font-family: Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif;
}
.fc-pb-right {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  column-gap: 20px;
}
.fc-pb-btn {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  column-gap: 4px;
  border-radius: 999px;
  padding-right: 30px;
  padding-left: 30px;
  height: 50px;
  text-decoration: none;
}
.fc-pb-btn-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  overflow: hidden;
}
.fc-pb-btn-green {
  background: linear-gradient(180deg, #02ce80 0%, #7bd706 100%);
  color: #ffffff !important;
  line-height: 19px;
  letter-spacing: 0;
  font-size: 16px;
  font-weight: 700;
  font-family: Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif;
}
.fc-pb-btn-black {
  background: #16181d;
  color: #ffffff !important;
  line-height: 19px;
  letter-spacing: 0;
  font-size: 16px;
  font-weight: 700;
  font-family: Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif;
}

/* Container visibility */
.fc-pc-wrap { display: block; }

/* Responsive padding for PC layout */
@media (max-width: 1440px) {
  .fc-pc-canvas .fc-prod-recs { padding: 100px 40px !important; }
  .fc-pc-canvas .fc-prod-recs .fc-prod-recs-inner { width:100% !important; }
  .fc-product-banner-inner { width: 100% !important; padding: 40px; }
  .fc-breadcrumb { width: 100% !important; padding-left: 20px !important; }
  .fc-pc-canvas .fc-pc-metabar { width: 100% !important; flex-direction: column !important; align-items: center !important; row-gap: 16px !important; }
  .fc-pc-canvas .fc-lang { position: static !important; margin-top: 0 !important; }
}
@media (max-width: 1199px) {
  .fc-pc-canvas .fc-breadcrumb { padding: 0 40px !important; }
  .fc-pc-canvas .fc-pc-titleblock { padding: 20px 40px 0; }
  .fc-pc-canvas .fc-pc-twocol { padding-left: 40px; padding-right: 40px; }
  .fc-pc-canvas .fc-bottom { padding: 100px 40px; }
  .fc-pc-canvas .fc-prod-recs-grid { flex-wrap: wrap; justify-content: center; }
  .fc-pc-canvas .fc-prod-card { flex-shrink: 1; min-width: 0; }
}
/* Mobile & Tablet Styles (max-width: 1023px) */
@media (max-width: 1023px) {
  .fc-pc-canvas .fc-breadcrumb { padding: 0 40px !important; }
  .fc-pc-canvas .fc-pc-titleblock { padding: 20px 40px 0 !important; }
  .fc-pc-canvas .fc-pc-twocol { flex-direction: column !important; padding-left: 40px !important; padding-right: 40px !important; gap: 0 !important; }
  .fc-pc-canvas .fc-bottom { padding: 100px 40px !important; }
  .fc-pc-canvas .fc-pc-metabar { flex-direction: column; align-items: center; row-gap: 16px; }
  .fc-pc-canvas .fc-lang { position: static; margin-top: 0; }

  .catalog-box {
    display: block;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
  }
  .fc-pc-canvas .fc-breadcrumb {
    height: 44px;
    padding: 0 16px !important;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0.1px; /* 移动端字间距优化 */
  }

  /* Task 6: Title block mobile styles */
  .fc-pc-canvas .fc-pc-titleblock {
    padding: 20px 16px 12px !important; /* 增加顶部padding */
    row-gap: 16px !important; /* 标题间距优化 */
  }
  .fc-pc-canvas .fc-h1 {
    font-size: 28px !important;
    line-height: 36px !important;
    letter-spacing: -0.3px; /* 移动端H1字间距优化 */
  }
  .fc-pc-canvas .fc-subtitle {
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0.15px; /* 移动端副标题字间距优化 */
  }

  /* Task 7: Metadata bar mobile styles */
  .fc-pc-canvas .fc-pc-metabar {
    padding: 16px !important;
    margin-top: 10px !important; /* 增加顶部间距 */
    flex-direction: column !important;
    align-items: center !important;
    row-gap: 12px !important; /* 元数据区域间距优化 */
  }
  .fc-pc-canvas .fc-meta-center {
    width: 100% !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    row-gap: 10px !important; /* 优化中心区域间距 */
  }
  .fc-pc-canvas .fc-author {
    width: 100% !important;
    justify-content: center !important;
  }
  .fc-pc-canvas .fc-author-avatar {
    width: 32px !important;
    height: 32px !important;
  }
  .fc-pc-canvas .fc-author-name,
  .fc-pc-canvas .fc-update,
  .fc-pc-canvas .fc-category {
    font-size: 12px !important;
    line-height: 16px !important;
    letter-spacing: 0.1px; /* 移动端元数据字间距优化 */
  }
  .fc-pc-canvas .fc-meta-details {
    width: 100% !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    row-gap: 4px !important;
    justify-content: center !important;
  }

  /* Language selector mobile styles */
  .fc-pc-canvas .fc-lang {
    position: static !important;
    width: 120px !important;
    height: 36px !important;
    font-size: 14px !important;
    padding: 8px 24px 8px 10px !important;
    margin: 18px 0 36px 0 !important;
  }

  /* Task 8: Main content mobile styles */
  .fc-pc-canvas .fc-pc-main {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 20px !important;
    row-gap: 24px !important; /* 移动端主内容区间距优化 */
  }
  .fc-pc-canvas .fc-pc-twocol {
    flex-direction: column !important;
    padding: 0 !important;
    margin-top: 20px !important; /* 增加顶部间距 */
    gap: 0 !important;
  }
  /* Hide sidebar on mobile */
  .fc-pc-canvas .fc-sidebar-sticky {
    display: none !important;
  }
  .fc-pc-canvas .fc-pc-main {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Spec table - horizontal scroll on mobile */
  .fc-pc-canvas .fc-spec {
    overflow-x: auto !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-spec-row {
    height: auto !important;
    min-height: 80px !important;
    min-width: 600px !important;
  }

  .fc-pc-canvas .fc-spec-value {
    padding: 6px 8px !important;
  }

  /* TOC mobile styles */
  .fc-pc-canvas .fc-toc {
    width: 100% !important;
  }
  .fc-pc-canvas .fc-toc-banner {
    font-size: 18px !important;
    padding: 10px 16px !important;
    height: auto !important;
  }
  .fc-pc-canvas .fc-toc-list {
    padding: 0 16px !important;
    row-gap: 8px !important;
    max-height: 50vh !important;
  }
  .fc-pc-canvas .fc-toc-row {
    min-height: 36px !important;
  }
  .fc-pc-canvas .fc-toc-row img,
  .fc-pc-canvas .fc-toc-row .cur-icon {
    width: 18px !important;
    height: 18px !important;
  }
  .fc-pc-canvas .fc-toc-row p,
  .fc-pc-canvas .fc-toc-row a {
    font-size: 14px !important;
    line-height: 20px !important;
  }
  .fc-pc-canvas .fc-toc-row.child {
    padding-left: 24px !important;
  }
  .fc-pc-canvas .fc-toc-row.show-active {
    margin-left: -16px !important;
    padding-left: 12px !important;
    width: calc(100% + 16px) !important;
  }
  .fc-pc-canvas .fc-toc-row.child.show-active {
    margin-left: -16px !important;
    padding-left: 40px !important;
    width: calc(100% + 16px) !important;
  }

  /* Video card mobile */
  .fc-pc-canvas .fc-vidcard {
    width: 100% !important;
    height: auto !important;
    padding: 16px !important;
    row-gap: 16px !important;
  }
  .fc-pc-canvas .fc-vid-thumb {
    min-width: 0 !important;
    width: 100% !important;
    height: 200px !important;
    background-size: cover !important;
    background-position: center !important;
  }
  .fc-pc-canvas .fc-vid-play {
    top: 70px !important;
    left: calc(50% - 30px) !important;
  }
  .fc-pc-canvas .fc-vid-desc {
    min-width: 0 !important;
    width: 100% !important;
    font-size: 14px !important;
    line-height: 20px !important;
  }
  .fc-pc-canvas .fc-vid-btn {
    font-size: 14px !important;
    height: 36px !important;
  }

  /* Recommendations mobile */
  .fc-pc-canvas .fc-recs { row-gap: 24px !important; padding: 0 20px !important; }
  .fc-pc-canvas .fc-recs-title {
    font-size: 18px !important;
    line-height: 25px !important;
  }
  .fc-pc-canvas .fc-recs-list { row-gap: 24px !important; }
  .fc-pc-canvas .fc-rec-card {
    padding: 24px 0 16px !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-rec-avatar {
    width: 60px !important;
    height: 60px !important;
  }
  .fc-pc-canvas .fc-rec-text { padding: 0 16px !important; }
  .fc-pc-canvas .fc-rec-name {
    font-size: 16px !important;
    line-height: 22px !important;
  }
  .fc-pc-canvas .fc-rec-desc {
    width: auto !important;
    font-size: 14px !important;
    line-height: 20px !important;
  }
  .fc-pc-canvas .fc-rec-btn {
    margin-top: 24px !important;
    min-width: 0 !important;
    width: calc(100% - 32px) !important;
    height: 32px !important;
    font-size: 14px !important;
  }

  /* Categories mobile */
  .fc-pc-canvas .fc-cats { row-gap: 16px !important; }
  .fc-pc-canvas .fc-cat {
    padding: 8px 8px 16px !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-cat-head img { width: 20px !important; height: 20px !important; }
  .fc-pc-canvas .fc-cat-head h3 {
    font-size: 16px !important;
    line-height: 22px !important;
  }
  .fc-pc-canvas .fc-cat-list { row-gap: 8px !important; }
  .fc-pc-canvas .fc-cat-list p {
    font-size: 14px !important;
    line-height: 20px !important;
    padding-left: 12px !important;
  }
}
@media (max-width: 768px) {
  /* PC layout adjustments (only visible above 1024px) */
  #main-content {margin-bottom: 48px;}
  .fc-pc-canvas .fc-prod-recs-grid { flex-wrap: wrap; justify-content: center; }
  .fc-pc-canvas .fc-prod-card { flex-shrink: 1; min-width: 0; }
  .fc-pc-canvas .fc-prod-card-info h3,
  .fc-pc-canvas .fc-prod-card-info p { width: auto; max-width: 100%; }
  .fc-pc-canvas .fc-prod-card-shot img { width: 100%; max-width: 456px; }

  /* ===== Mobile Content Styles (max-width: 768px) ===== */

  /* Main section spacing */
  .fc-pc-canvas .fc-mainsec { row-gap: 28px !important; /* 增加主section间距 */ }
  .fc-pc-canvas .fc-bigp {
    letter-spacing: 0.05px; /* 移动端正文字间距优化 */
  }

  /* Part sections */
  .fc-pc-canvas .fc-part1,
  .fc-pc-canvas .fc-part2,
  .fc-pc-canvas .fc-part3,
  .fc-pc-canvas .fc-part4 { row-gap: 28px !important; /* 增加part内部间距 */ }
  .fc-pc-canvas .fc-part2 { margin-top: 0 !important; }
  .fc-pc-canvas .fc-part3 { margin-top: 0 !important; }

  /* Headings */
  .fc-pc-canvas .fc-h2 {
    letter-spacing: -0.2px; /* 移动端H2字间距优化 */
  }
  .fc-pc-canvas .fc-h3 {
    letter-spacing: -0.1px; /* 移动端H3字间距优化 */
  }
  .fc-pc-canvas .fc-p {
    letter-spacing: 0.05px; /* 移动端正文字间距优化 */
  }

  /* SEO Card - stack vertically on mobile */
  .fc-pc-canvas .fc-seo {
    flex-direction: column !important;
    align-items: center !important;
    padding: 20px !important;
    height: auto !important;
    row-gap: 16px !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-seo-thumb {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;
    /* max-height: 240px; */
  }
  .fc-pc-canvas .fc-seo-text {
    width: 100% !important;
    row-gap: 40px !important;
  }
  .fc-pc-canvas .fc-seo-body { row-gap: 12px !important; }
  .fc-pc-canvas .fc-seo-head { row-gap: 8px !important; }

  .fc-pc-canvas .fc-seo-btn {
    height: 40px !important;
    padding: 0 16px !important;
  }

  /* Tips box */
  .fc-pc-canvas .fc-tips {
    padding: 20px !important; /* 增加内边距 */
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-tips-head img { width: 16px !important; height: 16px !important; }
  .fc-pc-canvas .fc-tips-head strong {
    letter-spacing: 0.1px; /* 移动端提示标题字间距 */
  }
  .fc-pc-canvas .fc-tips p {
    letter-spacing: 0.05px; /* 移动端提示正文字间距 */
  }

  /* Features list */
  .fc-pc-canvas .fc-features-head img { width: 18px !important; height: 18px !important; }
  .fc-pc-canvas .fc-features-head strong {
    letter-spacing: 0.1px; /* 特性列表标题字间距 */
  }
  .fc-pc-canvas .fc-features-list p {
    padding-left: 14px !important;
    letter-spacing: 0.05px; /* 特性列表正文字间距 */
  }
  .fc-pc-canvas .fc-features-list li {
    letter-spacing: 0.05px; /* 特性列表项目字间距 */
  }
  .fc-pc-canvas .fc-features-list li img { width: 16px !important; height: 16px !important; }

  /* Pros/Cons - stack vertically on mobile */
  .fc-pc-canvas .fc-pros-cons {
    flex-direction: column !important;
    row-gap: 20px !important; /* 增加优缺点间距 */
  }
  .fc-pc-canvas .fc-col-pros,
  .fc-pc-canvas .fc-col-cons {
    padding: 20px !important; /* 增加内边距 */
    row-gap: 16px !important; /* 增加项目间距 */
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-pros-cons-title {
    letter-spacing: 0.1px; /* 移动端优缺点标题字间距 */
  }
  .fc-pc-canvas .fc-pros-cons-item {
    letter-spacing: 0.05px; /* 移动端优缺点项目字间距 */
  }
  .fc-pc-canvas .fc-pros-cons-item img { width: 16px !important; height: 16px !important; }

  /* Buttons - stack vertically */
  .fc-pc-canvas .fc-btns {
    flex-direction: column !important;
    width: 100% !important;
    row-gap: 12px !important;
  }
  .fc-pc-canvas .fc-btn-green,
  .fc-pc-canvas .fc-btn-orange {
    width: 100% !important;
    justify-content: center !important;
    height: 44px !important;
    font-size: 14px !important;
  }

  /* Steps */
  .fc-pc-canvas .fc-steps { row-gap: 28px !important; /* 增加步骤间距 */ }
  .fc-pc-canvas .fc-step { row-gap: 20px !important; /* 增加单步间距 */ }
  .fc-pc-canvas .fc-step-text { row-gap: 12px !important; /* 增加步骤文本间距 */ }
  .fc-pc-canvas .fc-step-header { column-gap: 10px !important; /* 增加步骤头部间距 */ }
  .fc-pc-canvas .fc-step-badge { min-width: 60px !important; height: 28px !important; padding: 0 8px !important; }
  .fc-pc-canvas .fc-step-badge span {
    font-size: 13px !important;
    letter-spacing: 0.1px; /* 移动端步骤徽章字间距 */
  }
  .fc-pc-canvas .fc-step-title {
    letter-spacing: 0.05px; /* 移动端步骤标题字间距 */
  }
  .fc-pc-canvas .fc-step-desc {
    letter-spacing: 0.05px; /* 移动端步骤描述字间距 */
  }

  /* Download card */
  .fc-pc-canvas .fc-dlcard {
    padding: 24px !important; /* 增加内边距 */
    row-gap: 24px !important; /* 增加下载卡间距 */
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-dlcard-header { column-gap: 16px !important; /* 增加头部间距 */ }
  .fc-pc-canvas .fc-dlcard-header img { width: 40px !important; height: 40px !important; }
  .fc-pc-canvas .fc-dlcard-title {
    letter-spacing: 0.1px; /* 移动端下载卡标题字间距 */
  }
  .fc-pc-canvas .fc-dlcard-desc {
    letter-spacing: 0.05px; /* 移动端下载卡描述字间距 */
  }
  .fc-pc-canvas .fc-dlcard-btns {
    flex-direction: column !important;
    width: 100% !important;
    row-gap: 8px !important;
  }
  .fc-pc-canvas .fc-dlcard-btns .fc-btn-black,
  .fc-pc-canvas .fc-dlcard-btns .fc-btn-white {
    width: 100% !important;
    justify-content: center !important;
    height: 44px !important;
  }
  /* Spec table - horizontal scroll on mobile */
  .fc-pc-canvas .fc-spec {
    overflow-x: auto !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-spec-row {
    height: auto !important;
    min-height: 80px !important;
    min-width: 600px !important;
  }

  .fc-pc-canvas .fc-spec-value {
    padding: 6px 8px !important;
  }

  /* Compare table - horizontal scroll on mobile */
  .fc-pc-canvas .fc-compare {
    overflow-x: auto !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-compare-row {
    height: auto !important;
    min-height: 80px !important;
    min-width: 600px !important;
    overflow: visible !important;
  }
  .fc-pc-canvas .fc-compare-head { min-width: 600px !important; height: 44px !important; }
  .fc-pc-canvas .fc-compare-cell { padding: 6px 8px !important; overflow: visible !important; align-items: center !important; word-break: break-word !important; }
  .fc-pc-canvas .fc-compare-first { padding: 6px 12px !important; word-break: break-word !important; }
  .fc-pc-canvas .fc-compare-head .fc-compare-cell { height: 100% !important; }

  /* Part 2/3/4 text */
  

  /* Pricing - stack vertically */
  .fc-pc-canvas .fc-pricing {
    flex-direction: column !important;
    padding: 8px !important;
    row-gap: 12px !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-price-card {
    padding: 20px !important;
    height: auto !important;
    row-gap: 16px !important;
    border-radius: 12px !important;
  }

  .fc-pc-canvas .fc-price-features li img { width: 16px !important; height: 16px !important; }
  .fc-pc-canvas .fc-price-btn {
    height: 44px !important;
    margin-top: 16px !important;
  }

  .fc-pc-canvas .fc-price-btn img { width: 16px !important; height: 16px !important; }

  .fc-pc-canvas .fc-price-badge {
    position: absolute !important;
    top: 54px !important;
    left: 91px !important;
    display: flex !important;
    align-items: flex-start !important;
    padding-bottom: 4px !important;
    width: 108px !important;
    height: 54px !important;
  }
  .fc-pc-canvas .fc-price-badge-inner {
    display: flex !important;
    flex-grow: 1 !important;
    align-items: flex-start !important;
    padding: 8px 15px 20px 18px !important;
    background-image: url(/assets/img/figma-content/mol5lbhg-cj48278.svg) !important;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    filter: drop-shadow(0px 2px 8px #00000040) !important;
    width: 108px !important;
  }
  .fc-pc-canvas .fc-price-badge-inner span {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #9a4815 !important;
    line-height: 22px !important;
    font-family: var(--fc-font) !important;
    text-shadow: 0px 2px 6px #00000033 !important;
  }
  .fc-pc-canvas .fc-pricing-section { margin-top: 0 !important; }

  /* CTA2 */
  .fc-pc-canvas .fc-cta2 {
    padding: 20px !important;
    row-gap: 20px !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-cta2-header { column-gap: 12px !important; }
  .fc-pc-canvas .fc-cta2-header img { width: 40px !important; height: 40px !important; }

  .fc-pc-canvas .fc-cta2-btns .fc-btn-green {
    width: 100% !important;
    justify-content: center !important;
    height: 44px !important;
  }
  

  /* FAQ */
  .fc-pc-canvas .fc-faq { row-gap: 24px !important; }

  .fc-pc-canvas .fc-faq-list { row-gap: 12px !important; }
  .fc-pc-canvas .fc-faq-item { border-radius: 8px !important; }

  .fc-pc-canvas .fc-faq-item summary {
    height: auto !important;
    min-height: 56px !important;
    padding: 16px !important;
    align-items: flex-start !important;
  }

  .fc-pc-canvas .fc-faq-item summary span {
    flex-grow: 1 !important;
    padding-right: 12px !important;
  }

  .fc-pc-canvas .fc-faq-answer {
    padding: 16px !important;
  }
  

  /* Related articles */
  .fc-pc-canvas .fc-related {
    padding: 20px !important;
    row-gap: 16px !important;
    border-radius: 12px !important;
  }

  

  /* Author bio */
  .fc-pc-canvas .fc-bio {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 20px !important;
    row-gap: 16px !important;
    border-radius: 12px !important;
  }
  .fc-pc-canvas .fc-bio img { width: 80px !important; height: 80px !important; }
  .fc-pc-canvas .fc-bio-text { align-items: center !important; }

  

  /* Post FAQ section */
  .fc-pc-canvas .fc-pc-post-faq {
    flex-direction: column !important;
  }

  /* Product Recommendations */
  .fc-pc-canvas .fc-prod-recs {
    display: none !important;
  }
  .fc-pc-canvas .fc-prod-recs-head h2 {
    font-size: 24px !important;
    line-height: 34px !important;
  }
  .fc-pc-canvas .fc-prod-recs-arrows { display: none !important; }
  .fc-pc-canvas .fc-prod-recs-grid {
    height: 380px !important;
  }
  .fc-pc-canvas .fc-prod-card {
    width: 280px !important;
    height: 380px !important;
  }
  .fc-pc-canvas .fc-prod-recs-grid .swiper-slide {
    width: 280px !important;
  }
  .fc-pc-canvas .fc-prod-card-top {
    padding: 20px 16px 0 !important;
    column-gap: 10px !important;
  }
  .fc-pc-canvas .fc-prod-card-top img { width: 40px !important; height: 40px !important; }
  .fc-pc-canvas .fc-prod-card-info h3 {
    font-size: 16px !important;
    line-height: 20px !important;
    height: auto !important;
    padding: 8px 0 !important;
  }
  .fc-pc-canvas .fc-prod-card-info p {
    font-size: 12px !important;
    line-height: 18px !important;
  }
  .fc-pc-canvas .fc-prod-card-shot {
    padding: 16px !important;
  }
  .fc-pc-canvas .fc-prod-card-shot img { max-width: 100% !important; }
  .fc-pc-canvas .fc-prod-recs-prev,
  .fc-pc-canvas .fc-prod-recs-next { display: none !important; }

  /* Video element */
  .fc-pc-canvas .fc-video video {
    width: 100% !important;
    height: auto !important;
  }

  /* Product Banner - hide on mobile */
  .fc-product-banner { display: none !important; }
}

/* ===== Tablet Styles (769px - 1023px) ===== */
@media (min-width: 769px) and (max-width: 1023px) {
  .fc-pc-canvas .fc-sidebar-sticky {
    display: none !important;
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    order: 2;
    margin-top: 40px !important;
  }
  .fc-pc-canvas .fc-pc-main { max-width: 100% !important; order: 1; }

  /* Main section spacing */
  .fc-pc-canvas .fc-mainsec { row-gap: 28px !important; }

  /* Part sections */
  .fc-pc-canvas .fc-part1,
  .fc-pc-canvas .fc-part2,
  .fc-pc-canvas .fc-part3,
  .fc-pc-canvas .fc-part4 { row-gap: 28px !important; }
  .fc-pc-canvas .fc-part2 { margin-top: 0 !important; }
  .fc-pc-canvas .fc-part3 { margin-top: 0 !important; }

  /* Headings */
  .fc-pc-canvas .fc-h2 {
    font-size: 26px !important;
    line-height: 36px !important;
  }
  .fc-pc-canvas .fc-h3 {
    font-size: 20px !important;
    line-height: 28px !important;
  }

  /* SEO Card */
  .fc-pc-canvas .fc-seo {
    padding: 24px !important;
    height: auto !important;
    column-gap: 16px !important;
  }

  /* Pros/Cons - stack on tablet too */
  .fc-pc-canvas .fc-pros-cons {
    flex-direction: column !important;
    row-gap: 16px !important;
  }

  /* Compare table scrollable */
  .fc-pc-canvas .fc-compare {
    overflow-x: auto !important;
  }

  /* Pricing stack */
  .fc-pc-canvas .fc-pricing {
    flex-direction: column !important;
    padding: 10px !important;
    row-gap: 16px !important;
  }
  .fc-pc-canvas .fc-price-card { height: auto !important; }
  .fc-pc-canvas .fc-price-btn { margin-top: 48px !important; }

  

  /* Product Recommendations */
  /* .fc-pc-canvas .fc-prod-recs {
    margin-top: 60px !important;
    padding: 60px 40px !important;
  } */

  /* Product Banner */
  .fc-product-banner { display: none !important; }
}

/* PC Header Block - breadcrumb + gradient bg */
.fc-pc-canvas .fc-pc-headerblock {
  width: 100%;
  background-image: var(--fc-grad-header);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.fc-pc-canvas .fc-breadcrumb {
  max-width: 1376px;
  width: 1376px;
  height: 52px;
  /* padding: 18px 20px !important; */
  display: flex;
  align-items: center;
  font-size: 14px !important;
  line-height: 17px !important;
  letter-spacing: 0 !important;
  color: #141d38 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-breadcrumb .muted { 
  font-weight: 400 !important; 
  color: #141d38 !important;
}
.fc-pc-canvas .fc-breadcrumb .strong { 
  font-weight: 500 !important; 
  color: #6c757d !important;
}

.fc-pc-canvas .fc-pc-titleblock {
  max-width: 862px;
  padding: 24px 40px 8px; /* 微调标题块间距 */
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 16px; /* 微调标题与副标题间距 */
}
.fc-pc-canvas .fc-h1 {
  width: 100% !important;
  text-align: center !important;
  font-size: 40px !important;
  font-weight: 700 !important;
  line-height: 48px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-subtitle {
  width: 100% !important;
  font-size: 18px !important;
  line-height: 22px !important;
  color: #737887 !important;
  text-align: center !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-pc-metabar {
  position: relative;
  width: 1376px;
  padding: 0 40px 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 28px;
}
.fc-pc-canvas .fc-meta-center {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  column-gap: 8px;
}
.fc-pc-canvas .fc-meta-details {
  display: inline-flex;
  align-items: center;
  column-gap: 10px;
}
.fc-pc-canvas .fc-author {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
}
.fc-pc-canvas .fc-author-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}
.fc-pc-canvas .fc-author-name,
.fc-pc-canvas .fc-update,
.fc-pc-canvas .fc-category {
  font-size: 14px !important;
  line-height: 17px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-author-name .strong {
  font-weight: 500 !important;
  color: #141d38 !important;
}
.fc-pc-canvas .fc-category .blue { color: #0781fc !important; }
/* Language selector - positioned to right, doesn't take width */
.fc-pc-canvas .fc-lang {
  position: absolute;
  top: 0;
  right: 0;
  width: 140px;
  height: 40px;
  border: 1px solid var(--fc-border-2);
  border-radius: 4px;
  padding: 9px 28px 9px 11px;
  font-family: var(--fc-font-nunito);
  font-size: 16px;
  color: #000000e5;
  line-height: 22px;
  background: transparent;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
}
.fc-pc-canvas .fc-lang option {
  background: #fff;
  color: #000000e5;
}
.fc-pc-canvas .fc-pc-twocol {
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  justify-content: center;
  gap: 36px; /* 微调双栏间距 */
  margin-top: 28px; /* 微调顶部margin */
  padding-left: 40px;
  padding-right: 40px;
}
.fc-pc-canvas .fc-sidebar-sticky {
  width: 376px;
  max-width: 376px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  row-gap: 60px;
  align-self: flex-start;
}
.fc-pc-canvas .fc-sidebar-sticky.is-sticky-active {
  position: sticky;
  top: 223px;
}
.fc-pc-canvas .fc-pc-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  row-gap: 56px; /* 微调主内容区间距 */
  min-width: 0;
  width: 964px;
  max-width: 964px;
}
.fc-pc-canvas .fc-pc-post-faq {
  display: flex;
  justify-content: space-between;
}
.fc-pc-canvas .fc-pc-post-faq-main {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 48px; /* 微调FAQ区域间距 */
}
.fc-pc-canvas .fc-toc {
  width: 376px;
  box-sizing: border-box;
  border: 1px solid var(--fc-border);
  border-radius: 16px;
  overflow: hidden;
  background-image: var(--fc-grad-green);
}
.fc-pc-canvas .fc-toc-banner {
  padding: 13px 24px;
  height: 60px;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  line-height: 34px;
  text-transform: uppercase;
}
.fc-pc-canvas .fc-toc-list {
  box-sizing: border-box;
  background: #fff;
  border-radius: 16px 16px 0 0;
  padding: 0px 16px;
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  max-height: calc(100vh - 180px);
  overflow-y: auto;
  scrollbar-width: thin;
}
.fc-pc-canvas .fc-toc-list::-webkit-scrollbar {
  width: 4px;
}
.fc-pc-canvas .fc-toc-list::-webkit-scrollbar-thumb {
  background: #d7d7d7;
  border-radius: 2px;
}
.fc-pc-canvas .fc-toc-row {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  column-gap: 8px;
  min-height: 48px;
}
.fc-pc-canvas .fc-toc-row img,
.fc-pc-canvas .fc-toc-row .cur-icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  display: block;
}
.fc-pc-canvas .fc-toc-row .cur-icon img {
  width: 22px;
  height: 22px;
  transform: rotate(90deg);
}
.fc-pc-canvas .fc-toc-row p {
  font-size: 16px;
  line-height: 22px;
  color: var(--fc-green);
}
.fc-pc-canvas .fc-toc-row.child {
  padding-left: 30px;
}
.fc-pc-canvas .fc-toc-sub {
  display: flex;
  flex-direction: column;
}
.fc-pc-canvas .fc-toc-row.child p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fc-pc-canvas .fc-toc-row a {
  font-size: 16px;
  line-height: 22px;
  color: var(--fc-green);
  text-decoration: none;
}
.fc-pc-canvas .fc-toc-row.child a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fc-pc-canvas .fc-toc-row.show-active {
  box-sizing: border-box;
  background: rgba(52, 192, 64, 0.08);
  border-left: 3px solid var(--fc-green);
  margin-left: -24px;
  padding-left: 18px;
  width: calc(100% + 24px);
  border-radius: 0 6px 6px 0;
}
.fc-pc-canvas .fc-toc-row.child.show-active {
  margin-left: -24px;
  padding-left: 48px;
  width: calc(100% + 24px);
}
.fc-pc-canvas .fc-toc-row.show-active a {
  font-weight: 400;
  color: #02a050 !important;
  text-decoration: none;
}
.fc-pc-canvas .fc-toc-row.child.show-active a {
  font-weight: 400;
  color: #02a050 !important;
  text-decoration: none;
}
.fc-pc-canvas .fc-vidcard {
  width: 376px;
  height: 412px;
  background: var(--fc-bg-blue-grey);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.fc-pc-canvas .fc-vid-thumb {
  position: relative;
  min-width: 328px;
  height: 219px;
  border-radius: 8px;
  background-color: #00000033;
  background-image: url(/assets/img/figma-content/mol5lbi3-nvabgjr.png);
  background-position: -13px -4px;
  background-size: 125.79% 103.65%;
  background-repeat: no-repeat;
}
.fc-pc-canvas .fc-vid-play {
  position: absolute;
  top: 80px;
  left: 134px;
  width: 60px;
  height: 60px;
  border-radius: 999px;
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
}
.fc-pc-canvas .fc-vid-play img { width: 60px; height: 60px; }
.fc-pc-canvas .fc-vid-desc {
  margin-top: 12px;
  min-width: 328px;
  font-size: 16px;
  line-height: 22px;
  color: var(--fc-text-body);
}
.fc-pc-canvas .fc-vid-btn {
  border: 0;
  cursor: pointer;
  width: 100%;
  height: 40px;
  border-radius: 999px;
  background: #fff;
  box-shadow: inset 0 0 4px 0 #fff;
  backdrop-filter: blur(4px);
  font-size: 16px;
  font-weight: 500;
  color: var(--fc-text-dark);
}
.fc-pc-canvas .fc-recs {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}
.fc-pc-canvas .fc-recs-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 34px;
  color: var(--fc-text-dark);
}
.fc-pc-canvas .fc-recs-list {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}
.fc-pc-canvas .fc-rec-card {
  border-radius: 16px;
  padding: 48px 0 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-image: var(--fc-grad-card);
  overflow: hidden;
}
.fc-pc-canvas .fc-rec-avatar {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    filter: drop-shadow(0 0 8px #0000001a);
    overflow: hidden;
    flex-shrink: 0;
}

.fc-pc-canvas .fc-rec-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ??? */
@media (max-width: 768px) {
    .fc-pc-canvas .fc-rec-avatar {
        width: 60px !important;
        height: 60px !important;
    }
}
.fc-pc-canvas .fc-rec-text {
  margin-top: 16px;
  padding: 0 24px;
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  width: 100%;
}
.fc-pc-canvas .fc-rec-name {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
  color: var(--fc-text-dark);
}
.fc-pc-canvas .fc-rec-desc {
  width: 328px;
  text-align: center;
  font-size: 16px;
  line-height: 22px;
  color: var(--fc-text-mute-2);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fc-pc-canvas .fc-rec-btn {
  margin-top: 50px;
  min-width: 328px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  box-shadow: inset 0 0 4px 0 #fff;
  backdrop-filter: blur(4px);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
}
.fc-pc-canvas .fc-cats {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}
.fc-pc-canvas .fc-cat {
  border: 1px solid var(--fc-border);
  border-radius: 16px;
  padding: 11px 11px 23px;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  overflow: hidden;
}
.fc-pc-canvas .fc-cat-head {
  display: flex;
  align-items: center;
  column-gap: 4px;
  height: 40px;
}
.fc-pc-canvas .fc-cat-head img {
  width: 24px;
  height: 24px;
}
.fc-pc-canvas .fc-cat-head h3 {
  font-size: 24px;
  font-weight: 700;
  line-height: 34px;
  text-transform: uppercase;
  color: var(--fc-text-dark);
}
.fc-pc-canvas .fc-cat-list {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
.fc-pc-canvas .fc-cat-list p {
  font-size: 16px;
  line-height: 22px;
  color: var(--fc-text-body);
  position: relative;
  padding-left: 16px !important;
}
.fc-pc-canvas .fc-cat-list p::before {
  content: '\2022';
  position: absolute;
  left: 0;
  color: var(--fc-text-body);
}
.fc-pc-canvas .fc-cat-list p.hot {
  color: var(--fc-green);
}
.fc-pc-canvas .fc-mainsec {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  width: 100%;
}
.fc-pc-canvas .fc-bigp {
  font-size: 18px !important;
  line-height: 25px !important;
  color: #484e60 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-bigimg {
  width: 100%;
  height: auto;
  object-fit: cover;
}
.fc-pc-canvas .fc-part1 {
  display: flex;
  flex-direction: column;
  row-gap: 28px; /* 微调区间距 */
  width: 100%;
}
.fc-pc-canvas .fc-part-intro {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
.fc-pc-canvas .fc-h2 {
  width: 100% !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 45px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-p {
  font-size: 20px !important;
  line-height: 28px !important;
  color: #484e60 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-seo {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 24px;
  border-radius: 20px;
  padding: 40px;
  width: 100%;
  height: 320px;
  overflow: hidden;
  background: linear-gradient(135deg, #02ce80 0%, #6c8efd 100%);
}
.fc-pc-canvas .fc-seo-thumb {
  width: 240px;
  height: 240px;
  border-radius: 8px;
  object-fit: cover;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-seo-text {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  align-items: flex-start;
  align-self: stretch;
  justify-content: space-between;
  row-gap: 20px !important;
}
.fc-pc-canvas .fc-seo-body {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  align-items: flex-start;
  align-self: stretch;
  row-gap: 16px;
}
.fc-pc-canvas .fc-seo-head {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  align-items: flex-start;
  align-self: stretch;
  row-gap: 12px;
}
.fc-pc-canvas .fc-seo-text .fc-seo-title {
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  color: #ffffff !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-seo-text .fc-seo-subtitle {
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 25px !important;
  color: #ffffff !important;
  letter-spacing: 0 !important;
  text-decoration: underline !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-seo-text p {
  font-size: 18px !important;
  line-height: 25px !important;
  color: #ffffff !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-seo-body p {
  font-size: 18px !important;
  line-height: 25px !important;
  color: #ffffff !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-seo-btn {
  align-self: flex-start;
  border: 0;
  cursor: pointer;
  height: 52px;
  padding: 0 24px;
  border-radius: 999px;
  background: #fff;
  font-size: 16px;
  font-weight: 700;
  color: var(--fc-text-dark);
}
.fc-pc-canvas .fc-h3 {
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-tips {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  padding: 24px;
  background: #ebffeb;
  border-radius: 16px;
}
.fc-pc-canvas .fc-tips-head {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
}
.fc-pc-canvas .fc-tips-head img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-tips-head strong {
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-tips p {
  font-size: 18px !important;
  line-height: 25px !important;
  color: #484e60 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-features {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
.fc-pc-canvas .fc-features-head {
  display: flex;
  align-items: center;
  column-gap: 12px;
}
.fc-pc-canvas .fc-features-head img {
  width: 21px;
  height: 22px;
  margin-top: -2px;
  margin-left: -1px;
  transform: rotate(-180deg);
}
.fc-pc-canvas .fc-features-head strong {
  font-size: 20px;
  font-weight: 500;
  color: #141d38;
  line-height: 28px;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif;
}
.fc-pc-canvas .fc-features-list {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}
.fc-pc-canvas .fc-features-list p {
  font-size: 20px !important;
  line-height: 28px !important;
  color: #484e60 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
  position: relative !important;
  padding-left: 18px !important;
  margin: 0 !important;
}
.fc-pc-canvas .fc-features-list p::before {
  content: '\2022' !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  font-size: 16px !important;
  line-height: 28px !important;
  color: #141d38 !important;
  display: inline !important;
}
.fc-pc-canvas .fc-features-list li {
  display: flex;
  align-items: flex-start;
  column-gap: 8px;
  font-size: 20px;
  line-height: 28px;
  color: #484e60;
}
.fc-pc-canvas .fc-features-list li img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-top: 2px;
}

/* ---------- Part 2: Pros / Cons ---------- */
.fc-pc-canvas .fc-part2 {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  margin-top: -31px;
}
.fc-pc-canvas .fc-part2 .fc-h2 {
  font-size: 32px;
  font-weight: 700;
  color: #141d38;
  line-height: 45px;
  margin-bottom: 0;
}
.fc-pc-canvas .fc-part2 .fc-p {
  font-size: 20px !important;
  color: #484e60 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
  margin-bottom: 0 !important;
}
.fc-pc-canvas .fc-pros-cons {
  display: flex;
  align-items: center;
  column-gap: 24px;
}
.fc-pc-canvas .fc-col-pros,
.fc-pc-canvas .fc-col-cons {
  flex: 1;
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  border-radius: 16px;
  background: #eff1f9;
}
.fc-pc-canvas .fc-col-pros {
  border: 1px solid var(--fc-tag-blue);
  padding: 23px;
}
.fc-pc-canvas .fc-col-cons {
  padding: 24px;
}
.fc-pc-canvas .fc-pros-cons-title {
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 28px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
  margin: 0;
}
.fc-pc-canvas .fc-pros-cons-list {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}
.fc-pc-canvas .fc-pros-cons-item {
  display: flex;
  column-gap: 4px !important;
  align-items: flex-start;
  font-size: 18px !important;
  line-height: 25px !important;
  color: #484e60 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-pros-cons-item img {
  width: 25px !important;
  height: 25px !important;
  flex-shrink: 0;
}

/* ---------- Part 3: Buttons ---------- */
.fc-pc-canvas .fc-part3 {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  margin-top: -43px;
}
.fc-pc-canvas .fc-part3 .fc-h2 {
  font-size: 32px;
  font-weight: 700;
  color: #141d38;
  line-height: 45px;
  margin-bottom: 0;
}
.fc-pc-canvas .fc-part3 .fc-p {
  font-size: 20px !important;
  color: #484e60 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
  margin-bottom: 0 !important;
}
.fc-pc-canvas .fc-btns {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
}
.fc-pc-canvas .fc-btn-green,
.fc-pc-canvas .fc-btn-orange {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
  border-radius: 999px;
  height: 52px;
  padding: 0 20px 0 24px;
  border: 0;
  cursor: pointer;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-btn-green {
  background: linear-gradient(180deg, #02ce80 0%, #7bd706 100%);
}
.fc-pc-canvas .fc-btn-orange {
  background: linear-gradient(180deg, #feb033 0%, #feba3f 100%);
  width: 201px;
  justify-content: center;
}
.fc-pc-canvas .fc-btn-green span,
.fc-pc-canvas .fc-btn-orange span {
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  line-height: 22px;
  text-transform: uppercase;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-btn-green img,
.fc-pc-canvas .fc-btn-orange img {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

/* ---------- Part 3: 3 Steps ---------- */
.fc-pc-canvas .fc-steps {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
}
.fc-pc-canvas .fc-step {
  display: flex;
  flex-direction: column;
  row-gap: 28px;
}
.fc-pc-canvas .fc-step-text {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
.fc-pc-canvas .fc-step-header {
  display: inline-flex;
  align-items: center;
  column-gap: 14px;
}
.fc-pc-canvas .fc-step-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: var(--fc-green) !important;
  min-width: 72px !important;
  height: 32px !important;
  padding: 0 12px !important;
}
.fc-pc-canvas .fc-step-badge span {
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  color: #ffffff !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-step-title {
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 28px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-step-desc {
  font-size: 20px !important;
  line-height: 28px !important;
  color: #484e60 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-step-img {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 10px;
}
.fc-pc-canvas .fc-step-img img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* ---------- Part 3: Download Card ---------- */
.fc-pc-canvas .fc-dlcard {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 20px;
  background: #eff1f9;
  padding: 40px;
  row-gap: 40px;
}
.fc-pc-canvas .fc-dlcard-text {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
.fc-pc-canvas .fc-dlcard-header {
  display: inline-flex;
  align-items: center;
  column-gap: 16px;
}
.fc-pc-canvas .fc-dlcard-header img {
  width: 52px;
  height: 52px;
  border-radius: 8px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-dlcard-title {
  font-size: 24px;
  font-weight: 700;
  color: #141d38;
  line-height: 34px;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-dlcard-desc {
  font-size: 18px;
  color: #484e60;
  line-height: 25px;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-dlcard-btns-wrap {
  display: inline-flex;
  flex-direction: column;
  row-gap: 12px;
}
.fc-pc-canvas .fc-dlcard-btns {
  display: inline-flex;
  align-items: center;
  column-gap: 12px;
}
.fc-pc-canvas .fc-btn-black {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
  border-radius: 999px;
  background: #16181d;
  padding: 0 20px 0 24px;
  height: 52px;
  border: 0;
  cursor: pointer;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-btn-white {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
  border-radius: 999px;
  background: #ffffff;
  padding: 0 20px 0 24px;
  height: 52px;
  border: 0;
  cursor: pointer;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-btn-black span {
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  line-height: 22px;
  text-transform: uppercase;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-btn-white span {
  font-size: 16px;
  font-weight: 700;
  color: #16181d;
  line-height: 22px;
  text-transform: uppercase;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-btn-black img,
.fc-pc-canvas .fc-btn-white img {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-dlcard-secure {
  display: inline-flex;
  align-items: center;
  column-gap: 4px;
  padding-left: 8px;
}
.fc-pc-canvas .fc-dlcard-secure img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-dlcard-secure span {
  font-size: 16px;
  color: #484e60;
  line-height: 22px;
  font-family: var(--fc-font);
}

/* ---------- Part 4: Spec Table ---------- */
.fc-pc-canvas .fc-part4 {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
}
.fc-pc-canvas .fc-part4 .fc-h2 {
  font-size: 32px;
  font-weight: 700;
  color: #141d38;
  line-height: 45px;
  margin-bottom: 0;
}
.fc-pc-canvas .fc-part4 .fc-p {
  font-size: 20px !important;
  color: #484e60 !important;
  line-height: 28px !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
  margin-bottom: 0 !important;
}
.fc-pc-canvas .fc-spec {
  display: flex;
  flex-direction: column;
  border: 1px solid #e3e7f0;
  border-radius: 16px;
  overflow: hidden;
}
.fc-pc-canvas .fc-spec-row {
  display: flex;
  align-items: center;
  column-gap: 12px;
  border-bottom: 1px solid #e3e7f0;
  height: 76px;
  overflow: hidden;
}
.fc-pc-canvas .fc-spec-row:last-child {
  border-bottom: none;
}
.fc-pc-canvas .fc-spec-label {
  display: flex;
  align-items: center;
  align-self: stretch;
  column-gap: 10px;
  border-right: 1px solid #e3e7f0;
  background: #f9f9f9;
  padding-left: 24px;
  width: 181px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-spec-label span {
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 25px !important;
  color: #141d38 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}
.fc-pc-canvas .fc-spec-value {
  flex-grow: 1;
  font-size: 18px !important;
  line-height: 25px !important;
  color: #484e60 !important;
  letter-spacing: 0 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
}

/* ---------- Part 4: Compare Table ---------- */
/* 表格基础样式 */
.fc-compare {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #e3e7f0;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    display: table;
}

/* 表头行 */
.fc-compare thead tr {
    background: #f9f9f9;
    border-bottom: 1px solid #e3e7f0;
    display: table-row;
}

/* 表头单元格 */
.fc-compare th {
    padding: 16px 12px;
    font-size: 16px;
    font-weight: 600;
    color: #141d38;
    text-align: left;
    border-right: 1px solid #e3e7f0;
    display: table-cell;
}

.fc-compare th:last-child {
    border-right: none;
}

/* 数据行 */
.fc-compare tbody tr {
    border-bottom: 1px solid #e3e7f0;
    display: table-row;
}

.fc-compare tbody tr:last-child {
    border-bottom: none;
}

/* 数据单元格 */
.fc-compare td {
    padding: 16px 12px;
    font-size: 16px;
    color: #484e60;
    text-align: left;
    vertical-align: middle;
    border-right: 1px solid #e3e7f0;
    display: table-cell;
}

.fc-compare td:last-child {
    border-right: none;
}

/* 第一列样式 */
.fc-compare td:first-child,
.fc-compare th:first-child {
    background: #f9f9f9;
    font-weight: 600;
    color: #141d38;
    width: 200px;
}

/* 圆点样式 */
.fc-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 8px;
}

.fc-dot-green {
    background: #34c040;
}

.fc-dot-red {
    background: #e53935;
}

/* Not Recommended 样式 */
.fc-not-rec {
    color: #e53935;
    font-weight: 500;
}

/* 移动端：横向滚动 */
@media (max-width: 768px) {
    .fc-compare {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .fc-compare tbody {
        display: table;
        min-width: 500px;
    }
    
    .fc-compare th,
    .fc-compare td {
        padding: 10px 8px;
        font-size: 12px;
    }
    
    .fc-compare td:first-child,
    .fc-compare th:first-child {
        font-size: 12px;
        min-width: 140px;
        width: auto;
    }
}

/* ---------- Pricing Section ---------- */
.fc-pc-canvas .fc-pricing-section {
  margin-top: -19px;
}
.fc-pc-canvas .fc-pricing {
  display: flex;
  column-gap: 20px;
  border: 1px solid #00960026;
  border-radius: 20px;
  padding: 11px;
  overflow: hidden;
  background: linear-gradient(180deg, #00960026 0%, #90ee9026 50%, #8fc78f1a 100%);
}
.fc-pc-canvas .fc-price-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 24px 32px;
  height: auto;
  min-height: 608px;
  row-gap: 24px;
  border-radius: 16px;
}
.fc-pc-canvas .fc-price-card.featured {
  position: relative;
  background: linear-gradient(180deg, #02ce80 0%, #7bd706 100%);
}
.fc-pc-canvas .fc-price-card:not(.featured) {
  background: transparent;
}
.fc-pc-canvas .fc-price-plan {
  font-size: 16px !important;
  line-height: 22px !important;
  color: #6c757d !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-plan {
  font-size: 16px !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.fc-pc-canvas .fc-price-top {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}
.fc-pc-canvas .fc-price-header {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
.fc-pc-canvas .fc-price-name {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #141d38 !important;
  line-height: 34px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-name {
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-amount {
  display: flex;
  align-items: flex-end;
  column-gap: 4px;
}
.fc-pc-canvas .fc-price-num {
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #f59919 !important;
  line-height: 34px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-num {
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 34px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-unit {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #6c757d !important;
  line-height: 24px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-unit {
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-bill {
  font-size: 20px !important;
  color: #6c757d !important;
  line-height: 24px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-bill {
  font-size: 20px !important;
  line-height: 24px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-year {
  font-size: 16px !important;
  color: #6c757d !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-year {
  font-size: 16px !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-desc {
  font-size: 16px !important;
  color: #141d38 !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-desc {
  font-size: 16px !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-features {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.fc-pc-canvas .fc-price-features li {
  display: flex;
  align-items: center;
  column-gap: 8px;
  font-size: 16px !important;
  color: #141d38 !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-features li {
  font-size: 16px !important;
  color: #ffffff !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-features li img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-price-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 24px;
}
.fc-pc-canvas .fc-price-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 12px;
  width: 100%;
}
.fc-pc-canvas .fc-price-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 10px;
  border-radius: 999px;
  background: #34c040;
  padding: 0 30px;
  height: 56px;
  border: 0;
  cursor: pointer;
  font-family: var(--fc-font);
  width: 100%;
  margin-top: 16px;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-btn {
  background: #ffffff;
}
.fc-pc-canvas .fc-price-btn span {
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  line-height: 22px;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-price-card.featured .fc-price-btn span {
  color: #34c040 !important;
}
.fc-pc-canvas .fc-price-btn img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-price-note {
  font-size: 16px !important;
  color: #141d38 !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-note {
  font-size: 16px !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
  font-weight: 500 !important;
}
.fc-pc-canvas .fc-price-cancel {
  font-size: 16px !important;
  color: #6c757d !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
}
.fc-pc-canvas .fc-price-card.featured .fc-price-cancel {
  font-size: 16px !important;
  line-height: 22px !important;
  font-family: var(--fc-font) !important;
  color: #ffffff !important;
}
.fc-pc-canvas .fc-price-badge {
  position: absolute;
  top: 67px;
  left: 91px;
  display: flex;
  align-items: flex-start;
  padding-bottom: 4px;
  width: 108px;
  height: 54px;
}
.fc-pc-canvas .fc-price-badge-inner {
  display: flex;
  flex-grow: 1;
  align-items: flex-start;
  padding: 8px 15px 20px 18px;
  background-image: url(/assets/img/figma-content/mol5lbhg-cj48278.svg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  filter: drop-shadow(0px 2px 8px #00000040);
}
.fc-pc-canvas .fc-price-badge-inner span {
  font-size: 16px;
  font-weight: 700;
  color: #9a4815;
  line-height: 22px;
  font-family: var(--fc-font);
  text-shadow: 0px 2px 6px #00000033;
}

/* ---------- KeepMusic Download Card ---------- */
.fc-pc-canvas .fc-sd-card {
  display: flex;
  flex-flow: row !important;
  gap: 24px;
  border-radius: 20px;
  background: #eff1f9;
  padding: 40px;
  overflow: hidden;
}
.fc-pc-canvas .fc-sd-thumb {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  align-self: center;
  /* background: #ffffff; */
  /* padding: 123px 94px 143px; */
  overflow: hidden;
  width: 240px;
  max-width: 100%;
  aspect-ratio: 240 / 318;
}
.fc-pc-canvas .fc-sd-thumb img {
  margin-left: -15%;
  width: 130%;
  height: 100%;
  object-fit: cover;
}
.fc-pc-canvas .fc-sd-body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  align-items: flex-start;
  align-self: stretch;
  row-gap: 40px;
  min-width: 0;
}
.fc-pc-canvas .fc-sd-text {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
.fc-pc-canvas .fc-sd-title {
  font-size: 24px;
  font-weight: 700;
  color: #141d38;
  line-height: 34px;
  margin: 0;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-sd-features {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  list-style: disc;
  padding-left: 20px;
  margin: 0;
}
.fc-pc-canvas .fc-sd-features li {
  font-size: 16px;
  color: #484e60;
  line-height: 22px;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-sd-btns-wrap {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  width: 100%;
}
.fc-pc-canvas .fc-sd-btns {
  display: inline-flex;
  align-items: center;
  column-gap: 12px;
}
.fc-pc-canvas .fc-sd-secure {
  display: inline-flex;
  align-items: center;
  column-gap: 4px;
  padding-left: 8px;
}
.fc-pc-canvas .fc-sd-secure img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-sd-secure span {
  font-size: 16px;
  color: #484e60;
  line-height: 22px;
  font-family: var(--fc-font);
}

/* ---------- Secondary CTA ---------- */
.fc-pc-canvas .fc-cta2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid #e0e0e0;
  border-radius: 20px;
  padding: 39px;
  row-gap: 40px;
}
.fc-pc-canvas .fc-cta2-text {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
.fc-pc-canvas .fc-cta2-header {
  display: inline-flex;
  align-items: center;
  column-gap: 16px;
}
.fc-pc-canvas .fc-cta2-header img {
  width: 52px;
  height: 52px;
  border-radius: 8px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-cta2-title {
  font-size: 24px;
  font-weight: 700;
  color: #141d38;
  line-height: 34px;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-cta2-desc {
  font-size: 16px;
  color: #484e60;
  line-height: 22px;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-cta2-btns {
  display: inline-flex;
  flex-direction: column;
  row-gap: 12px;
}
.fc-pc-canvas .fc-cta2-btns .fc-btn-green {
  padding: 0 24px;
}
.fc-pc-canvas .fc-cta2-secure {
  display: inline-flex;
  align-items: center;
  column-gap: 4px;
  padding-left: 8px;
}
.fc-pc-canvas .fc-cta2-secure img {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-cta2-secure span {
  font-size: 14px;
  color: #484e60;
  line-height: 20px;
  font-family: var(--fc-font);
}

/* ---------- FAQ ---------- */
.fc-pc-canvas .fc-faq {
  display: flex;
  flex-direction: column;
  row-gap: 40px;
}
.fc-pc-canvas .fc-faq-title {
  font-size: 40px;
  font-weight: 700;
  color: #141d38;
  line-height: 58px;
  margin: 0;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-faq-list {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}
.fc-pc-canvas .fc-faq-item {
  align-self: stretch;
  border: 1px solid #141d3826;
  border-radius: 10px;
  background: #ffffff;
  overflow: hidden;
}
.fc-pc-canvas .fc-faq-item[open] {
  border: 1px solid #141d3826;
}
.fc-pc-canvas .fc-faq-item summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  padding: 0 30px 0 40px;
  height: 56px;
  font-size: 18px;
  font-weight: 600;
  color: #141d38;
  line-height: 25px;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-faq-item summary span {
  flex-grow: 1;
}
.fc-pc-canvas .fc-faq-item summary::-webkit-details-marker {
  display: none;
}
.fc-pc-canvas .fc-faq-item[open] summary {
  background: #34c040;
  color: #ffffff;
  margin-right: -2px;
}
.fc-pc-canvas .fc-faq-icon {
  position: relative;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
}
.fc-pc-canvas .fc-faq-plus-h,
.fc-pc-canvas .fc-faq-plus-v {
  position: absolute;
  top: 11px;
  left: 4px;
  display: block;
  width: 16px;
  height: 2px;
  background: #02ce80;
}
.fc-pc-canvas .fc-faq-plus-v {
  transform: rotate(90deg);
}
.fc-pc-canvas .fc-faq-minus {
  position: absolute;
  top: 11px;
  left: 4px;
  display: none;
  width: 16px;
  height: 2px;
  background: #ffffff;
}
.fc-pc-canvas .fc-faq-item[open] .fc-faq-plus-h,
.fc-pc-canvas .fc-faq-item[open] .fc-faq-plus-v {
  display: none;
}
.fc-pc-canvas .fc-faq-item[open] .fc-faq-minus {
  display: block;
}
.fc-pc-canvas .fc-faq-answer {
  padding: 28px 30px 24px 40px;
}
.fc-pc-canvas .fc-faq-answer p {
  font-size: 16px;
  color: #484e60;
  line-height: 30px;
  font-family: var(--fc-font-header);
  margin: 0;
}

/* ---------- Related Articles ---------- */
.fc-pc-canvas .fc-related {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 20px;
  background: #eff1f9;
  padding: 24px;
  row-gap: 24px;
}
.fc-pc-canvas .fc-related-title {
  font-size: 24px;
  font-weight: 700;
  color: #141d38;
  line-height: 34px;
  margin: 0;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-related-list {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  align-items: flex-start;
  align-self: stretch;
  row-gap: 12px;
}
.fc-pc-canvas .fc-related-list p {
  font-size: 16px !important;
  line-height: 22px !important;
  color: #484e60 !important;
  font-family: Barlow, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimHei, Arial, Helvetica, sans-serif !important;
  position: relative !important;
  padding-left: 18px !important;
  margin: 0 !important;
  flex-shrink: 0;
  align-self: stretch;
}
.fc-pc-canvas .fc-related-list p::before {
  content: '\2022' !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  font-size: 16px !important;
  line-height: 22px !important;
  color: #141d38 !important;
  display: inline !important;
}
.fc-pc-canvas .fc-related-green {
  color: #34c040 !important;
}
.fc-pc-canvas .fc-related-green::before {
  color: #34c040 !important;
}

/* ---------- Author Bio ---------- */
.fc-pc-canvas .fc-bio {
  display: flex;
  column-gap: 24px;
  border: 1px solid #e0e0e0;
  border-radius: 20px;
  padding: 31px 39px;
}
.fc-pc-canvas .fc-bio img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
}
.fc-pc-canvas .fc-bio-text {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  row-gap: 16px;
}
.fc-pc-canvas .fc-bio-text h3 {
  font-size: 20px;
  line-height: 28px;
  color: #141d38;
  margin: 0;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-bio-text h3 span {
  font-weight: 400;
  color: #141d38;
}
.fc-pc-canvas .fc-bio-desc {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}
.fc-pc-canvas .fc-bio-desc p {
  font-size: 16px;
  color: #484e60;
  line-height: 22px;
  margin: 0;
  font-family: var(--fc-font);
}

/* ---------- Product Recommendations ---------- */
.fc-pc-canvas .fc-prod-recs {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 120px;
  background: #eff1f9;
  padding: 100px 270px;
}
.fc-pc-canvas .fc-prod-recs .fc-prod-recs-inner {
  width: 1376px;
  /* padding: 0 40px; */
}
.fc-pc-canvas .fc-prod-recs-head {
  display: flex;
  align-items: center;
  align-self: stretch;
  justify-content: space-between;
}
.fc-pc-canvas .fc-prod-recs-head h2 {
  font-size: 40px;
  font-weight: 700;
  color: #141d38;
  line-height: 50px;
  margin: 0;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-prod-recs-arrows {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 132px;
  height: 58px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-prod-recs-arrows img {
  width: 58px;
  height: 58px;
  flex-shrink: 0;
}
.fc-pc-canvas .fc-prod-recs-grid {
  margin-top: 40px;
  position: relative;
  width: 100%;
  max-width: 1380px;
  height: 486px;
  overflow: hidden;
}
.fc-pc-canvas .fc-prod-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 16px;
  background: #ffffff;
  width: 520px;
  height: 486px;
  flex-shrink: 0;
}
/* Swiper slide width */
.fc-pc-canvas .fc-prod-recs-grid .swiper-slide {
  width: 520px !important;
  flex-shrink: 0 !important;
}
.fc-pc-canvas .fc-prod-card-top {
  display: flex;
  align-items: flex-start;
  align-self: stretch;
  column-gap: 16px;
  padding: 32px 32px 0px;
}
.fc-pc-canvas .fc-prod-card-top img {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
}
.fc-pc-canvas .fc-prod-card-info {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  align-items: flex-start;
  justify-content: center;
  row-gap: 12px;
}
.fc-pc-canvas .fc-prod-card-info h3 {
  font-size: 24px;
  font-weight: 600;
  color: #141d38;
  line-height: 29px;
  margin: 0;
  font-family: var(--fc-font);
  padding: 12px 0;
  height: 52px;
}
.fc-pc-canvas .fc-prod-card-info p {
  font-size: 16px;
  color: #737887;
  line-height: 22px;
  margin: 0;
  font-family: var(--fc-font);
}
.fc-pc-canvas .fc-prod-card-shot {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  padding: 32px;
  row-gap: 10px;
}
.fc-pc-canvas .fc-prod-card-shot img {
  max-width: 456px;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Product Recommendations Navigation */
.fc-pc-canvas .fc-prod-recs-nav {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 10;
}
.fc-pc-canvas .fc-prod-recs-prev,
.fc-pc-canvas .fc-prod-recs-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 58px;
  height: 58px;
  cursor: pointer;
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}
.fc-pc-canvas .fc-prod-recs-prev img,
.fc-pc-canvas .fc-prod-recs-next img {
  width: 58px;
  height: 58px;
  display: block;
}
.fc-pc-canvas .fc-prod-recs-prev:hover,
.fc-pc-canvas .fc-prod-recs-next:hover {
  transform: translateY(-50%) scale(1.05);
}
.fc-pc-canvas .fc-prod-recs-prev {
  left: 20px;
}
.fc-pc-canvas .fc-prod-recs-next {
  right: 20px;
}
.fc-pc-canvas .fc-prod-recs-prev.swiper-button-disabled,
.fc-pc-canvas .fc-prod-recs-next.swiper-button-disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

/* ==========================================
   Mobile Catalog Sidebar
   ========================================== */

.catalog-box {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  left: 5px;
  width: 240px;
  border-radius: 10px;
  overflow: hidden;
  transition: all 1s;
  z-index: 1001;
  display: none;
}

/* Show catalog-box when PC TOC is hidden (<1024px) */
.fc-pc-wrap[style*="display: none"] ~ .catalog-box,
.fc-pc-wrap[hidden] ~ .catalog-box {
  display: none;
}

/* Alternative: use media query based on fc-pc-wrap visibility */
@media screen and (min-width: 769px) and (max-width: 1023px) {
  .catalog-box {
    display: block;
  }
}

.catalog-box .shrink {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  margin-bottom: 0;
  background: var(--fc-green);
  /* border-radius: 10px 10px 0 0; */
  transition: width 0.4s ease-in-out, border-radius 0.4s ease-in-out, padding 0.4s ease-in-out;
}

.catalog-box .shrink .sidify-logo {
  width: 30px;
  height: 30px;
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
}

.catalog-box .shrink .sidify-logo img {
  width: 100%;
  height: auto;
}

.catalog-box .shrink .shrink-node {
  font-size: 24px;
  font-weight: lighter;
  color: #FFFFFF;
  cursor: pointer;
  transition: transform 0.4s ease-in-out;
}

.catalog-box .shrink-hide {
  width: 80px;
  border-radius: 40px;
  /* border: 1px solid transparent; */
  padding: 0 12px 0 5px;
}

.catalog-box .shrink-hide .sidify-logo {
  opacity: 1;
}

.catalog-box .shrink-hide .shrink-node {
  transform: rotate(180deg);
}

.catalog-box .catelog-panel {
  width: 100%;
  margin-top: 0 !important;
  display: none;
  background: var(--fc-green);
}

.catalog-box .catelog-panel .downloads {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 12px;
  width: 100%;
  padding-bottom: 20px;
  margin-top: -1px;
  background: var(--fc-green);
}

.catalog-box .catelog-panel .downloads > .title {
  font-weight: lighter;
  font-size: 16px;
  line-height: 140.18%;
  color: #FFFFFF;
}

.catalog-box .catelog-panel .downloads .number {
  font-weight: bolder;
  font-size: 24px;
  line-height: 140.18%;
  color: #FFFFFF;
  margin: 5px 0 15px;
}

.catalog-box .catelog-panel .downloads .fc-m-btn-green-small {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 8px;
  border-radius: 999px;
  padding: 0 24px;
  height: 52px;
  line-height: 22px;
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  background: #16181d;
  text-decoration: none;
  transition: all 0.3s;
}

.catalog-box .catelog-panel .downloads .fc-m-btn-green-small img {
  width: 24px;
  height: 24px;
}

.catalog-box .catelog-panel .downloads .fc-m-btn-green-small:hover {
  transform: scale(1.05);
}

.catalog-box .catelog-panel .downloads .fc-m-btn-black-small {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 8px;
  border-radius: 999px;
  padding: 0 24px;
  height: 52px;
  line-height: 22px;
  font-size: 16px;
  font-weight: 700;
  color: #16181d;
  background: #ffffff;
  text-decoration: none;
  transition: all 0.3s;
}

.catalog-box .catelog-panel .downloads .fc-m-btn-black-small img {
  width: 24px;
  height: 24px;
}

.catalog-box .catelog-panel .downloads .fc-m-btn-black-small:hover {
  transform: scale(1.05);
}

.catalog-box .catelog-panel .downloads .mac-btn {
  display: none;
}

/* Show Mac button on Mac platform */
.catalog-box .catelog-panel .downloads.is-mac .mac-btn {
  display: flex;
}

.catalog-box .catelog-panel .downloads.is-mac .win-btn {
  display: none;
}

.catalog-box .catelog-panel .page-content {
  box-sizing: border-box;
  padding: 10px 0 0;
  border: none;
  border-radius: 0 0 10px 10px;
  background: #FFFFFF;
}

.catalog-box .catelog-panel .page-content .title {
  padding: 10px 20px;
  font-weight: bolder;
  font-size: 18px;
  line-height: 146.68%;
  color: #000000;
}

.catalog-box .catelog-panel .page-content .catalog-list-box {
  width: 100%;
  height: auto;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .activity-line {
  width: 5px;
  height: 15px;
  background: #4690E5;
  transition: all 0.5s;
  transform: translateY(20px);
  display: none;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list {
  box-sizing: border-box;
  margin-left: 20px;
  padding-right: 5px;
  display: flex;
  flex-flow: column nowrap;
  max-height: 50vh;
  overflow-y: scroll;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list::-webkit-scrollbar {
  width: 0;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list::-webkit-scrollbar-track {
  background: rgba(179, 177, 177, .3);
  border-radius: 10px;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list::-webkit-scrollbar-thumb {
  background: rgba(136, 136, 136, .4);
  border-radius: 10px;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list::-webkit-scrollbar-thumb:hover {
  background: rgba(100, 100, 100, .6);
  border-radius: 10px;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a {
  font-weight: lighter;
  font-size: 14px;
  line-height: 146.68%;
  color: #484E60;
  margin-bottom: 10px;
  padding-left: 20px;
  position: relative;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 3px;
  background: transparent;
  border-radius: 2px;
  transition: background 0.2s ease;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a:hover {
  color: #6b6e7a;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a.a-highlight:hover {
  color: #02a050;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list .catalog-sub-item {
  margin-left: 20px;
  font-size: 14px;
  color: #484E60;
  padding-left: 20px;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a.a-highlight {
  background: rgba(52, 192, 64, 0.08);
  border-radius: 0 6px 6px 0;
  color: #02a050;
  padding-left: 20px;
  margin-left: 0;
  width: auto;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a.catalog-sub-item.a-highlight {
  margin-left: 20px;
}

.catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a.a-highlight::before {
  background: var(--fc-green);
}

.catalog-box-scroll {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
}

main.container {
  display: flex;
  box-sizing: border-box;
}

main.container .inner-container {
  margin-top: 30px;
}

@media screen and (max-width: 768px) {
  .catalog-box {
    display: block !important;
    top: 20%;
    left: 0;
    transform: translateZ(0);
    will-change: top, transform;
  }

  .catalog-box-scroll {
    top: 50% !important;
    transform: translateZ(0) translateY(-50%);
    will-change: top, transform;
  }

  .catalog-box .catelog-panel .page-content .catalog-list-box .catalog-list a {
    font-size: 14px;
  }
}

#fc-prod-recs-prev-btn, #fc-prod-recs-next-btn {
  cursor: pointer;
}

#toc-bio img {
  width: 100px;
  height: 100px;
}

/* KeepMusic card - stack vertically for <768px */
@media (max-width: 767px) {
  .fc-pc-canvas .fc-sd-card {
    flex-direction: column !important;
    padding: 40px !important;
    row-gap: 24px !important;
    border-radius: 12px !important;
    align-items: center !important;
  }
  .fc-pc-canvas .fc-sd-thumb {
    width: 100% !important;
    max-width: 240px !important;
    height: auto !important;
    align-self: center !important;
    justify-content: center !important;
    aspect-ratio: 240 / 318 !important;
  }
  .fc-pc-canvas .fc-sd-thumb img {
    margin-left: -15% !important;
    width: 130% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  .fc-pc-canvas .fc-sd-body { row-gap: 20px !important; align-items: center !important; }
  .fc-pc-canvas .fc-sd-text { row-gap: 12px !important; }
  .fc-pc-canvas .fc-sd-btns {
    flex-direction: column !important;
    width: 100% !important;
    row-gap: 8px !important;
  }
  .fc-pc-canvas .fc-sd-btns .fc-btn-black,
  .fc-pc-canvas .fc-sd-btns .fc-btn-white {
    width: 100% !important;
    justify-content: center !important;
    height: 44px !important;
  }
}

/* KeepMusic buttons - vertical layout for 1024px - 1399px */
@media (min-width: 1024px) and (max-width: 1399px) {
  .fc-pc-canvas .fc-sd-thumb {
    width: 180px !important;
    max-width: 180px !important;
  }
  .fc-pc-canvas .fc-sd-btns {
    flex-direction: column !important;
    row-gap: 8px !important;
  }
  .fc-pc-canvas .fc-sd-btns .fc-btn-black,
  .fc-pc-canvas .fc-sd-btns .fc-btn-white {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ==========================================
   Breadcrumb Navigation - Enhanced
   ========================================== */

/* 面包屑样式 */
.fc-breadcrumb {
  width: 100%;
}

.fc-breadcrumb-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px;
  margin: 0;
  padding: 8px 0;
  list-style: none;
}

.fc-breadcrumb-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.fc-breadcrumb-link {
  color: #6c757d;
  text-decoration: none;
}

/* 最后一项 — 浅灰色，不要太黑 */
.fc-breadcrumb-current {
  font-weight: 500;
  color: #535761;  /* 柔和的灰色 */
}

.fc-breadcrumb-separator {
  color: #adb5bd;
}

/* 移动端：字体稍小 */
@media (max-width: 768px) {
  .fc-breadcrumb-link,
  .fc-breadcrumb-current,
  .fc-breadcrumb-separator {
    font-size: 12px;
  }
}

.fc-pc-canvas .fc-features-list li {
    font-size: 20px !important;
    line-height: 28px !important;
    color: #484e60 !important;
    position: relative !important;
    padding-left: 18px !important;
    list-style: none;
    margin-bottom: 8px;
}

.fc-pc-canvas .fc-features-list li::before {
    content: '\2022' !important;
    position: absolute !important;
    left: 0 !important;
    color: #141d38 !important;
}
/* ==========================================
   Steps - SEO & Mobile Friendly
   ========================================== */

/* 重置列表样式 */
.fc-steps {
    list-style: none;
    padding: 0;
    margin: 0;
}

.fc-steps li {
    list-style: none;
}

/* 步骤间距 */
.fc-step {
    margin-bottom: 48px;
}

.fc-step:last-child {
    margin-bottom: 0;
}

/* 步骤标题 */
.fc-step-title {
    font-weight: 600;
    color: #141d38;
}

/* 步骤描述 */
.fc-step-desc {
    font-size: 16px;
    line-height: 1.5;
    color: #484e60;
    margin-top: 8px;
}

/* 图片自适应 */
.fc-step-img {
    margin-top: 20px;
}

.fc-step-img img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    display: block;
}

/* 移动端优化 */
@media (max-width: 768px) {
    .fc-step {
        margin-bottom: 32px;
    }
    
    .fc-step-title {
        font-size: 18px;
        line-height: 26px;
    }
    
    .fc-step-desc {
        font-size: 14px;
        line-height: 22px;
    }
    
    .fc-step-img {
        margin-top: 16px;
    }
    
    .fc-step-img img {
        border-radius: 8px;
    }
}

/* 桌面端微调 */
@media (min-width: 769px) {
    .fc-step-title {
        font-size: 20px;
        line-height: 28px;
    }
    
    .fc-step-desc {
        font-size: 16px;
        line-height: 24px;
    }
}
/* ==========================================
   Spec Table - Table标签优化版
   保持原样式 + 移动端友好
   ========================================== */

/* 强制覆盖 - 表格样式 */
.fc-spec {
    display: table !important;
    width: 100% !important;
    border-collapse: collapse !important;
    border: 1px solid #e3e7f0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: #fff !important;
}

.fc-spec tbody {
    display: table-row-group !important;
}

.fc-spec tr {
    display: table-row !important;
    border-bottom: 1px solid #e3e7f0 !important;
}

.fc-spec tr:last-child {
    border-bottom: none !important;
}

.fc-spec .fc-spec-label {
    display: table-cell !important;
    width: 30% !important;
    background: #f9f9f9 !important;
    text-align: left !important;
    padding: 16px 24px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #141d38 !important;
    border-right: 1px solid #e3e7f0 !important;
    vertical-align: middle !important;
}

.fc-spec .fc-spec-value {
    display: table-cell !important;
    padding: 16px 24px !important;
    font-size: 16px !important;
    color: #484e60 !important;
    background: #fff !important;
    vertical-align: middle !important;
}

/* 移动端 */
@media (max-width: 768px) {
    .fc-spec {
        display: block !important;
        overflow-x: auto !important;
    }
    
    .fc-spec tbody {
        display: table !important;
        width: 100% !important;
        min-width: 500px !important;
    }
    
    .fc-spec .fc-spec-label {
        width: 140px !important;
        padding: 12px 16px !important;
        font-size: 14px !important;
    }
    
    .fc-spec .fc-spec-value {
        padding: 12px 16px !important;
        font-size: 14px !important;
    }
}
/* ==========================================
   对比表格 - 参照图片效果
   ========================================== */

/* 表格基础样式 */
.fc-compare {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #e3e7f0;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
}

/* 表头行 */
.fc-compare thead tr {
    background: #f9f9f9;
    border-bottom: 1px solid #e3e7f0;
}

/* 表头单元格 */
.fc-compare th {
    padding: 16px 12px;
    font-size: 16px;
    font-weight: 600;
    color: #141d38;
    text-align: left;
    border-right: 1px solid #e3e7f0;
}

.fc-compare th:last-child {
    border-right: none;
}

/* 数据行 */
.fc-compare tbody tr {
    border-bottom: 1px solid #e3e7f0;
}

.fc-compare tbody tr:last-child {
    border-bottom: none;
}

/* 数据单元格 */
.fc-compare td {
    padding: 16px 12px;
    font-size: 16px;
    color: #484e60;
    text-align: left;
    vertical-align: middle;
    border-right: 1px solid #e3e7f0;
}

.fc-compare td:last-child {
    border-right: none;
}

/* 第一列样式 */
.fc-compare td:first-child,
.fc-compare th:first-child {
    background: #f9f9f9;
    font-weight: 600;
    color: #141d38;
}

/* 圆点样式 */
.fc-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 8px;
}

.fc-dot-green {
    background: #34c040;
}

.fc-dot-red {
    background: #e53935;
}

/* Not Recommended 样式 */
.fc-not-rec {
    color: #e53935;
    font-weight: 500;
}

/* 星级图片 */
.fc-compare td img {
    display: inline-block;
    vertical-align: middle;
}

/* 移动端：横向滚动 */
@media (max-width: 768px) {
    .fc-compare {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .fc-compare tbody {
        display: table;
        min-width: 700px;
    }
    
    .fc-compare th,
    .fc-compare td {
        padding: 10px 8px;
        font-size: 12px;
    }
    
    .fc-compare td:first-child,
    .fc-compare th:first-child {
        font-size: 12px;
        min-width: 140px;
    }
}
/* 桌面端 */
.fc-sd-text .fc-features-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.fc-sd-text .fc-features-list li {
    font-size: 16px;
    line-height: 22px;
    color: #484e60;
    position: relative;
    padding-left: 18px;
    margin-bottom: 8px;
}

.fc-sd-text .fc-features-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #141d38;
}

/* 移动端 */
@media (max-width: 768px) {
    .fc-sd-text .fc-features-list li {
        font-size: 14px;
        line-height: 20px;
        padding-left: 16px;
        margin-bottom: 6px;
    }
}
.fc-related-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.fc-related-list li {
    margin-bottom: 12px;
}

.fc-related-list li a {
    font-size: 16px;
    line-height: 22px;
    color: #484e60;
    text-decoration: none;
    display: block;
    position: relative;
    padding-left: 18px;
}

.fc-related-list li a::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #141d38;
}

.fc-related-list li a:hover {
    color: #02ce80;
    text-decoration: underline;
}

/* 移动端 */
@media (max-width: 768px) {
    .fc-related-list li a {
        font-size: 14px;
        line-height: 20px;
        padding-left: 16px;
    }
}
/* 让 li 继承原来 p 的样式 */
.fc-pc-canvas .fc-cat-list li {
    font-size: 16px;
    line-height: 22px;
    color: var(--fc-text-body);
    position: relative;
    padding-left: 16px !important;
    margin-bottom: 0;
    list-style: none;
}

.fc-pc-canvas .fc-cat-list li::before {
    content: '\2022';
    position: absolute;
    left: 0;
    color: var(--fc-text-body);
}

.fc-pc-canvas .fc-cat-list li.hot {
    color: var(--fc-green);
}

.fc-pc-canvas .fc-cat-list li.hot::before {
    color: var(--fc-green);
}
/* 侧边栏标题样式 - 替代原来的 h3 */
.fc-pc-canvas .fc-cat-head .fc-cat-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    color: #141d38;
    margin: 0;
}

@media (max-width: 768px) {
    .fc-pc-canvas .fc-cat-head .fc-cat-title {
        font-size: 18px;
        line-height: 25px;
    }
}
/* 让这个特定的模块与下方模块（.fc-cats）保持跟其他大模块一样的大间距 */
.fc-single-promo-box {
  margin-bottom: 30px !important; /* 如果觉得跟下面挨得太近或太远，可微调此数值 */
}

/* 针对纯图片卡片的内部布局微调（缩进、居中、露底色和边框） */
.fc-single-image-card {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 20px !important;         /* 💡 核心：往内缩进，把四周的卡片底色和边框露出来 */
  box-sizing: border-box !important;
  width: 100%;
}

/* 图片内容容器 */
.fc-single-image-card .fc-promo-body {
  width: 100%;
  display: flex;
  justify-content: center;          /* 确保图片水平绝对居中 */
  align-items: center;
}

/* 链接与图片宽度限制 */
.fc-single-image-card .fc-promo-link {
  display: block;
  max-width: 260px;                 /* 💡 限制图片最大宽度，防止它顶满卡片从而遮挡底色 */
  width: 100%;
  text-decoration: none;
}

.fc-single-image-card .fc-promo-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;               /* 图片自身的微圆角 */
  transition: transform 0.2s ease;
}

/* 鼠标悬停时的微动效 */
.fc-single-image-card .fc-promo-link:hover .fc-promo-img {
  transform: scale(1.02);
}
.fc-img-wrapper {
    width: 100%;
    max-width: 600px;  /* 限制图片最大宽度 */
    margin: 0 auto;
}

.fc-img-wrapper .fc-bigimg {
    width: 100%;
    height: auto;
    display: block;
}
.fc-step-img {
    max-width: 800px;
    margin: 0 auto;
}

.fc-step-img img {
    width: auto;           /* 改为 auto，而不是 100% */
    max-width: 100%;       /* 限制不超过父容器 */
    height: auto;
    display: block;
    border-radius: 12px;
}