/* ============================================================
   VCardData — 数据面板风 (Data Terminal Dashboard)
   气质：深绿底色，数据密集，终端监控感，数字突出
   class 前缀：vd-
   ============================================================ */

/* ── 设计 Token ─────────────────────────────────────────── */
:root {
  --vd-bg:          #f0fdf4;
  --vd-bg-soft:     #ecfdf5;
  --vd-card:        #ffffff;
  --vd-forest:      #0d3320;
  --vd-forest-light:#1a4d2e;
  --vd-cyan:        #0ea5e9;
  --vd-cyan-dark:   #0284c7;
  --vd-cyan-soft:   #e0f2fe;
  --vd-teal:        #14b8a6;
  --vd-teal-soft:   #ccfbf1;
  --vd-lime:        #65a30d;
  --vd-amber:       #f59e0b;
  --vd-red:         #ef4444;
  --vd-text:        #0f172a;
  --vd-muted:       #475569;
  --vd-border:      #d1d5db;
  --vd-white:       #ffffff;

  --vd-shadow:       0 1px 3px rgba(13,51,32,0.08);
  --vd-shadow-card:  0 2px 8px rgba(13,51,32,0.06), 0 1px 3px rgba(13,51,32,0.04);
  --vd-shadow-hover: 0 8px 20px rgba(13,51,32,0.10), 0 4px 8px rgba(13,51,32,0.06);

  --vd-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --vd-font-mono: 'JetBrains Mono', 'SF Mono', 'Consolas', monospace;

  --vd-wrap: 1180px;
  --vd-radius:    8px;
  --vd-radius-lg: 12px;
  --vd-radius-xl: 16px;
  --vd-gap: 16px;
  --vd-transition: 0.15s ease;

  --ed-serif: var(--vd-font);
  --ed-sans:  var(--vd-font);
  --t-fast:   var(--vd-transition);
  --easing:   ease;

  --fs-hero: clamp(1.875rem, 3.5vw, 2.75rem);
  --fs-h1:   clamp(1.625rem, 3vw, 2.25rem);
  --fs-h2:   clamp(1.375rem, 2.5vw, 1.75rem);
  --fs-h3:   1.125rem;
}

/* ── Reset ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--vd-font);
  background: var(--vd-bg);
  color: var(--vd-text);
  line-height: 1.6;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--vd-cyan-dark); text-decoration: none; transition: color var(--vd-transition); }
a:hover { color: var(--vd-forest); text-decoration: underline; }

img { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4 { font-family: var(--vd-font); font-weight: 700; line-height: 1.25; color: var(--vd-forest); letter-spacing: -0.01em; }

.vd-skiplink-d4f5 { position: absolute; left: -9999px; top: 0; z-index: 9999; background: var(--vd-forest); color: #fff; padding: 8px 16px; font-weight: 600; border-radius: var(--vd-radius); font-size: 13px; }
.vd-skiplink-d4f5:focus { left: 8px; top: 8px; }

.vd-cont-m181 { max-width: var(--vd-wrap); margin: 0 auto; padding: 0 16px; }

/* ── Header ─────────────────────────────────────────────── */
.vd-sitehead-m649 {
  background: var(--vd-forest);
  border-bottom: 3px solid var(--vd-teal);
  position: sticky; top: 0; z-index: 100;
}
.vd-sitehead-m649 .vd-cont-m181 { display: flex; align-items: center; justify-content: space-between; padding-top: 12px; padding-bottom: 12px; }
.vd-sitelogo-r332 { display: flex; align-items: center; gap: 8px; }
.vd-sitelogo-r332 a { color: #fff; font-size: 18px; font-weight: 800; letter-spacing: -0.02em; text-decoration: none; font-family: var(--vd-font-mono); }
.vd-sitelogo-r332 a:hover { color: var(--vd-teal-soft); text-decoration: none; }
.vd-sitenav-m724 { display: flex; gap: 24px; }
.vd-sitenav-m724 a { color: #a7f3d0; font-size: 13px; font-weight: 500; text-decoration: none; transition: color var(--vd-transition); }
.vd-sitenav-m724 a:hover { color: #fff; text-decoration: none; }

@media (max-width: 768px) { .vd-sitenav-m724 { display: none; } }

/* ── Hero ───────────────────────────────────────────────── */
.vd-hero-pdcf { background: var(--vd-forest); color: #d1fae5; padding: 48px 0 40px; position: relative; overflow: hidden; }
.vd-hero-pdcf::after { content: ""; position: absolute; top: 0; right: 0; width: 300px; height: 100%; background: radial-gradient(circle at 70% 30%, rgba(20,184,166,0.12) 0%, transparent 70%); }
.vd-herotitl-x48e { font-size: var(--fs-hero); font-weight: 800; color: #fff; margin-bottom: 12px; letter-spacing: -0.02em; position: relative; z-index: 1; }
.vd-herotagl-t394 { font-size: 1rem; color: #6ee7b7; max-width: 600px; margin-bottom: 20px; position: relative; z-index: 1; }
.vd-herointr-r7f0 { font-size: 0.9375rem; color: #a7f3d0; max-width: 680px; line-height: 1.65; position: relative; z-index: 1; }
.vd-heroacti-n5df { display: flex; gap: 10px; margin-top: 24px; flex-wrap: wrap; position: relative; z-index: 1; }

/* ── Buttons ────────────────────────────────────────────── */
.vd-btn-r79c { display: inline-flex; align-items: center; gap: 6px; padding: 8px 20px; border-radius: var(--vd-radius); font-size: 13px; font-weight: 600; text-decoration: none; transition: all var(--vd-transition); cursor: pointer; border: none; }
.vd-btnprim-v79a { background: var(--vd-teal); color: #fff; }
.vd-btnprim-v79a:hover { background: var(--vd-forest-light); color: #fff; text-decoration: none; }
.vd-btnghos-pbfd { background: transparent; color: #6ee7b7; border: 1px solid rgba(110,231,183,0.3); }
.vd-btnghos-pbfd:hover { background: rgba(20,184,166,0.1); color: #fff; text-decoration: none; }

/* ── Home Sections ──────────────────────────────────────── */
.vd-sitemain-k0ff { padding: 40px 0; }
.vd-homesect-p725 { margin-bottom: 48px; }
.vd-homesecthead-n06c { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; border-bottom: 2px solid var(--vd-border); padding-bottom: 10px; }
.vd-homesecttitl-vc15 { font-size: var(--fs-h2); font-weight: 700; color: var(--vd-forest); }
.vd-homesectmore-mf50 { font-size: 13px; font-weight: 600; color: var(--vd-cyan-dark); }

.vd-homegrid-r6c9 { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--vd-gap); }
.vd-homegridguid-l7f5 { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--vd-gap); }

.vd-homecard-xc6b { background: var(--vd-card); border-radius: var(--vd-radius); overflow: hidden; box-shadow: var(--vd-shadow-card); transition: all var(--vd-transition); border: 1px solid var(--vd-border); display: flex; flex-direction: column; border-top: 3px solid var(--vd-teal); }
.vd-homecard-xc6b:hover { box-shadow: var(--vd-shadow-hover); transform: translateY(-2px); border-top-color: var(--vd-cyan); }
.vd-homecardimg-d537 { width: 100%; height: 160px; object-fit: cover; background: var(--vd-bg-soft); }
.vd-homecardimg-d537 img { width: 100%; height: 100%; object-fit: cover; }
.home-card-body { padding: 14px; flex: 1; display: flex; flex-direction: column; }
.vd-homecardtitl-kc5e { font-size: 1rem; font-weight: 700; color: var(--vd-forest); margin-bottom: 6px; line-height: 1.3; }
.vd-homecardtitl-kc5e a { color: inherit; text-decoration: none; }
.vd-homecardtitl-kc5e a:hover { color: var(--vd-cyan-dark); }
.vd-homecardexce-lb7f { font-size: 0.8125rem; color: var(--vd-muted); line-height: 1.45; flex: 1; }

/* ── List ───────────────────────────────────────────────── */
.vd-homelist-l46b { display: flex; flex-direction: column; gap: 0; }
.vd-homelistitem-x4d9 { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--vd-border); }
.vd-homelistitem-x4d9:last-child { border-bottom: none; }
.vd-homelistitem-x4d9::before { content: "▸"; color: var(--vd-teal); font-size: 12px; flex-shrink: 0; margin-top: 2px; }
.vd-homelistitem-x4d9 a { font-weight: 600; color: var(--vd-forest); font-size: 0.875rem; }
.vd-homelistitem-x4d9 a:hover { color: var(--vd-cyan-dark); }

/* ── Breadcrumb ─────────────────────────────────────────── */
.vd-brea-tfbb { padding: 12px 0; font-size: 12px; color: var(--vd-muted); font-family: var(--vd-font-mono); }
.vd-brea-tfbb a { color: var(--vd-cyan-dark); }
.vd-brea-tfbb span { margin: 0 4px; }

/* ── Hub Page ───────────────────────────────────────────── */
.vd-hubintr-vfc3 { padding: 32px 0 24px; }
.vd-hubgrid-nbd2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--vd-gap); padding-bottom: 40px; }
.vd-hubcard-n0bd { background: var(--vd-card); border-radius: var(--vd-radius); overflow: hidden; box-shadow: var(--vd-shadow-card); transition: all var(--vd-transition); border: 1px solid var(--vd-border); }
.vd-hubcard-n0bd:hover { box-shadow: var(--vd-shadow-hover); transform: translateY(-2px); }
.vd-hubcardimg-wc75 { width: 100%; height: 180px; background: var(--vd-bg-soft); overflow: hidden; }
.vd-hubcardimg-wc75 img { width: 100%; height: 100%; object-fit: cover; }
.vd-hubcardbody-xcea { padding: 16px; }
.vd-hubcardtitl-q83c { font-size: 1.0625rem; font-weight: 700; margin-bottom: 6px; }
.vd-hubcardtitl-q83c a { color: var(--vd-forest); text-decoration: none; }
.vd-hubcardtitl-q83c a:hover { color: var(--vd-cyan-dark); }
.vd-hubcardexce-me25 { font-size: 0.8125rem; color: var(--vd-muted); line-height: 1.5; margin-bottom: 8px; }
.vd-hubcarddate-kbfe { font-size: 11px; color: var(--vd-muted); font-family: var(--vd-font-mono); }

/* ── Pagination ─────────────────────────────────────────── */
.vd-pagi-l5f1 { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 28px 0; }
.vd-pagi-l5f1 a, .vd-pagi-l5f1 span { padding: 6px 12px; border-radius: var(--vd-radius); font-size: 13px; font-weight: 600; font-family: var(--vd-font-mono); }
.vd-pagi-l5f1 a { background: var(--vd-card); color: var(--vd-forest); border: 1px solid var(--vd-border); text-decoration: none; }
.vd-pagi-l5f1 a:hover { background: var(--vd-teal); color: #fff; border-color: var(--vd-teal); }
.vd-prev-w0b9, .vd-next-mf04 { font-weight: 600; }
.vd-pageinfo-d1cf { color: var(--vd-muted); font-size: 13px; }

/* ── Article / Post ─────────────────────────────────────── */
.vd-post-scc7 { max-width: 800px; margin: 0 auto; padding: 28px 0; }
.vd-posthead-ne4b { margin-bottom: 24px; border-bottom: 2px solid var(--vd-border); padding-bottom: 16px; }
.vd-posttitl-m9d5 { font-size: var(--fs-h1); font-weight: 800; color: var(--vd-forest); margin-bottom: 10px; line-height: 1.2; }
.vd-postmeta-qe74 { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--vd-muted); font-family: var(--vd-font-mono); }
.vd-postauth-xee1 { font-weight: 600; color: var(--vd-forest); }
.vd-postdate-xa21, .vd-postupda-p6e9 { font-size: 12px; }

.vd-postfact-r8f5 { background: var(--vd-bg-soft); border-radius: var(--vd-radius); padding: 16px 20px; margin: 20px 0; border-left: 3px solid var(--vd-teal); }
.vd-postfact-r8f5 table { width: 100%; border-collapse: collapse; }
.vd-postfact-r8f5 td { padding: 5px 10px; font-size: 13px; border-bottom: 1px solid var(--vd-border); }
.vd-postfact-r8f5 td:first-child { font-weight: 600; color: var(--vd-muted); white-space: nowrap; width: 40%; text-transform: uppercase; font-size: 11px; letter-spacing: 0.05em; }
.vd-postfact-r8f5 td:last-child { color: var(--vd-text); font-family: var(--vd-font-mono); font-size: 13px; font-weight: 600; }
.vd-postfact-r8f5 tr:last-child td { border-bottom: none; }

.vd-postcont-kb74 { font-size: 15px; line-height: 1.7; color: var(--vd-text); }
.vd-postcont-kb74 h2 { font-size: var(--fs-h2); margin: 32px 0 14px; color: var(--vd-forest); font-weight: 700; border-bottom: 1px solid var(--vd-border); padding-bottom: 8px; }
.vd-postcont-kb74 h3 { font-size: var(--fs-h3); margin: 24px 0 10px; }
.vd-postcont-kb74 p { margin-bottom: 16px; }
.vd-postcont-kb74 ul, .vd-postcont-kb74 ol { margin: 0 0 16px 18px; }
.vd-postcont-kb74 li { margin-bottom: 6px; }
.vd-postcont-kb74 strong { color: var(--vd-forest); font-weight: 700; }
.vd-postcont-kb74 img { border-radius: var(--vd-radius); margin: 20px 0; box-shadow: var(--vd-shadow-card); }

/* ── CTA ────────────────────────────────────────────────── */
.vd-ctaregi-k15c { background: var(--vd-forest); border-radius: var(--vd-radius); padding: 24px 28px; margin: 28px 0; text-align: center; }
.vd-ctabtn-q097 { display: inline-flex; align-items: center; gap: 6px; padding: 10px 28px; border-radius: var(--vd-radius); font-size: 14px; font-weight: 700; text-decoration: none; margin: 0 5px; }
.vd-ctabtnprim-qf36 { background: var(--vd-teal); color: #fff; }
.vd-ctabtnprim-qf36:hover { background: var(--vd-cyan); color: #fff; text-decoration: none; }
.vd-ctabtnseco-l921 { background: transparent; color: #6ee7b7; border: 1px solid rgba(110,231,183,0.4); }
.vd-ctabtnseco-l921:hover { background: rgba(20,184,166,0.1); color: #fff; text-decoration: none; }
.vd-ctadisc-kcc0 { font-size: 11px; color: #6ee7b7; margin-top: 10px; opacity: 0.7; }
.vd-ctaregibott-kb01 { background: var(--vd-bg-soft); border-radius: var(--vd-radius); padding: 20px 28px; margin: 28px 0; text-align: center; border: 1px solid var(--vd-border); }

/* ── Related / Linked ───────────────────────────────────── */
.vd-relapost-v6dd, .vd-linkarti-pa93 { margin: 36px 0; }
.vd-relapost-v6dd h2, .vd-linkarti-pa93 h2 { font-size: var(--fs-h2); margin-bottom: 16px; color: var(--vd-forest); }
.vd-relalist-mb60 { display: flex; flex-direction: column; gap: 0; }
.vd-relalist-mb60 a { display: block; padding: 10px 0; border-bottom: 1px solid var(--vd-border); font-weight: 600; color: var(--vd-forest); font-size: 0.875rem; }
.vd-relalist-mb60 a:hover { color: var(--vd-cyan-dark); }

.vd-artigrid-q7ee { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--vd-gap); }
.vd-artigriditem-m205 { background: var(--vd-card); border-radius: var(--vd-radius); padding: 14px; border: 1px solid var(--vd-border); transition: all var(--vd-transition); }
.vd-artigriditem-m205:hover { box-shadow: var(--vd-shadow-card); border-color: var(--vd-teal); }
.vd-artigriditem-m205 a { font-weight: 600; color: var(--vd-forest); font-size: 0.875rem; }
.vd-artigridexce-v861 { font-size: 0.75rem; color: var(--vd-muted); margin-top: 4px; line-height: 1.4; }

/* ── Author ─────────────────────────────────────────────── */
.vd-authprof-nb7c { display: flex; gap: 20px; align-items: flex-start; padding: 28px 0; border-bottom: 2px solid var(--vd-border); margin-bottom: 28px; }
.vd-authbio-s0cb { flex: 1; }
.vd-authbio-s0cb h1 { font-size: var(--fs-h1); margin-bottom: 6px; }
.vd-authbio-s0cb p { color: var(--vd-muted); font-size: 14px; }
.vd-authpost-t1c3 { list-style: none; }
.vd-authpost-t1c3 li { padding: 10px 0; border-bottom: 1px solid var(--vd-border); }
.vd-authpost-t1c3 a { font-weight: 600; color: var(--vd-forest); }

/* ── Banner Ad ──────────────────────────────────────────── */
.vd-sitebannad-v09b { max-width: var(--vd-wrap); margin: 16px auto; padding: 0 16px; }
.vd-sitebannad-v09b img { width: 100%; border-radius: var(--vd-radius); }

/* ── Footer ─────────────────────────────────────────────── */
footer { background: var(--vd-forest); color: #6ee7b7; padding: 40px 0 20px; margin-top: 56px; }
.vd-footlink-v262 { max-width: var(--vd-wrap); margin: 0 auto; padding: 0 16px; display: flex; flex-wrap: wrap; gap: 28px; justify-content: space-between; }
.vd-footlink-v262 a { color: #6ee7b7; font-size: 13px; }
.vd-footlink-v262 a:hover { color: #fff; }
.vd-affidisc-x7cd { max-width: var(--vd-wrap); margin: 0 auto; padding: 14px 16px; font-size: 11px; color: #475569; line-height: 1.5; border-top: 1px solid rgba(255,255,255,0.1); margin-top: 20px; }
.vd-copy-l2b8 { text-align: center; padding: 14px; font-size: 12px; color: #475569; font-family: var(--vd-font-mono); }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 768px) {
  .vd-homegrid-r6c9, .vd-homegridguid-l7f5, .vd-hubgrid-nbd2, .vd-artigrid-q7ee { grid-template-columns: 1fr; }
  .vd-hero-pdcf { padding: 32px 0 28px; }
  .vd-post-scc7 { padding: 16px 0; }
  .vd-postfact-r8f5 { padding: 12px; }
}