/* /vps/ 支柱页样式 · 第二版（2026-10-08 站主选 A 版，04 候选商家用 C 版两列卡片）
   数值出处：设计库/数值/刻度.md（字号/行高/间距）、现代UI实测.md（圆角/细边框）、radix slate/red/green/amber；品牌色用 style.css 的 --brand 系列。
   作用域：只在 .pv 里生效；文章列表在 .pv 外面，不受影响。
   部署位置：wp-content/themes/wpdx-liezhe/assets/css/pillar.css */

 .pv{--s1:#fcfcfd;--s2:#f9f9fb;--s3:#f0f0f3;--s4:#e8e8ec;--s5:#e0e1e6;--s6:#d9d9e0;--s7:#cdced6;--s9:#8b8d98;--s11:#60646c;--s12:#1c2024;
--r3:#feebec;--r6:#fdbdbe;--r9:#e5484d;--r11:#ce2c31;--g3:#e6f6eb;--g9:#30a46c;--g11:#218358;--a3:#fff7c2;--a9:#ffc53d;--a11:#ab6400;
--pvl:rgba(0,0,0,.08)}
.pv *,.pv *::before,.pv *::after{box-sizing:border-box}
.pv{font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--s12);font-size:18px;line-height:32px}
.pv h1,.pv h2,.pv h3,.pv h4,.pv p,.pv ul,.pv ol,.pv dl,.pv dd,.pv figure{margin:0;padding:0}
.pv ul,.pv ol{list-style:none}
.pv a{color:var(--brand);text-decoration:none}
.pv a:hover{color:var(--brand-dark)}
.pv h1,.pv h2,.pv h3,.pv h4{color:var(--s12)}
.pv p,.pv li,.pv dd,.pv dt{line-height:inherit;font-size:inherit}
.pv .breadcrumb{font-size:14px;line-height:20px;color:var(--s11);padding:16px 0}
.pv .breadcrumb a{color:var(--s11)}
.pv .breadcrumb .sep{margin:0 8px;color:var(--s9)}
.pv h1{font-size:48px;line-height:48px;font-weight:800;letter-spacing:-.5px}
.pv h2{font-size:30px;line-height:40px;font-weight:700}
.pv h3{font-size:24px;line-height:36px;font-weight:600}
.pv .eyebrow{font-size:14px;line-height:20px;font-weight:600;color:var(--brand);letter-spacing:.5px}
.pv .muted{color:var(--s11)}
.pv .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:8px;background:var(--brand);color:#fff;font-size:16px;font-weight:600;line-height:24px}
.pv .btn:hover{background:var(--brand-dark);color:#fff}
.pv .btn.is-off{background:var(--s5);color:var(--s11)}
.pv .lnk{display:inline-flex;align-items:center;min-height:48px;font-size:16px;font-weight:500}
.pv .band-dot{display:inline-flex;align-items:center;gap:8px}
.pv .band-dot::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--s9)}
.pv .band-dot.lo::before{background:var(--g9)}.pv .band-dot.mid::before{background:var(--a9)}.pv .band-dot.midhi::before{background:var(--a9);box-shadow:12px 0 0 var(--r9);margin-right:12px}.pv .band-dot.hi::before{background:var(--r9)}
.pv details summary{list-style:none;cursor:pointer}
.pv details summary::-webkit-details-marker{display:none}
@media (max-width:640px){
 .pv{font-size:16px;line-height:28px}
 .pv h1{font-size:36px;line-height:40px}
 .pv h2{font-size:24px;line-height:32px}
 .pv h3{font-size:20px;line-height:32px}
}

.pvA{background:transparent;padding:0 0 32px}
/* 宽度跟原主题一致：外层 #main-content 已经是 90%、最宽 1300，这里不再限宽；手机两边留白同主题 .lz-main .wrap（≤768 为 16，≤480 为 12），跟下面的文章列表对齐 */
.pvA .wrap{width:auto;max-width:none;margin:0;padding:0}
@media (max-width:768px){.pvA .wrap{padding:0 16px}}
@media (max-width:480px){.pvA .wrap{padding:0 12px}}
.pvA .card{background:#fff;border-radius:16px;box-shadow:0 1px 2px rgba(28,34,48,.04),0 8px 24px rgba(28,34,48,.06);padding:48px 40px;margin-top:32px}
.pvA .hero{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:start}
.pvA .hero-top{display:flex;gap:24px;align-items:center;margin-bottom:24px}
.pvA .hico{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;flex:0 0 64px}
.pvA .hsub{font-size:16px;line-height:24px;color:var(--s11);margin-top:8px}
.pvA .lead{font-size:18px;line-height:32px;color:var(--s12)}
.pvA .upd{font-size:14px;line-height:20px;color:var(--s11);margin-top:16px}
.pvA .toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.pvA .toc a{min-height:40px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;background:var(--s3);color:var(--s12);font-size:14px;font-weight:500}
.pvA .toc a:hover{background:var(--brand-soft);color:var(--brand)}
.pvA .quick{background:var(--brand-soft);border-radius:12px;padding:24px}
.pvA .quick h2{font-size:18px;line-height:28px;margin-bottom:16px}
.pvA .quick li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-top:1px solid rgba(48,86,211,.12)}
.pvA .quick li:first-child{border-top:0;padding-top:0}
.pvA .quick .t{font-size:14px;line-height:20px;color:var(--brand);font-weight:600;flex:0 0 72px}
.pvA .quick b{display:block;font-size:16px;line-height:24px}
.pvA .quick span.d{display:block;font-size:14px;line-height:20px;color:var(--s11)}
.pvA .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.pvA .stat{background:var(--s2);border:1px solid var(--pvl);border-radius:12px;padding:24px;text-align:center}
.pvA .stat b{display:block;font-size:30px;line-height:40px;font-weight:800;color:var(--brand)}
.pvA .stat span{font-size:14px;line-height:20px;color:var(--s11)}
.pvA .sh{margin-bottom:32px}
.pvA .sh .eyebrow{display:block;margin-bottom:8px}
.pvA .sh p{font-size:16px;line-height:24px;color:var(--s11);margin-top:8px}
.pvA .disc{font-size:14px;line-height:20px;color:var(--s11);background:var(--s2);border-radius:8px;padding:12px 16px;margin-bottom:24px}
.pvA .picks{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pvA .pick{border:1px solid var(--pvl);border-top:4px solid var(--brand);border-radius:12px;padding:24px;display:flex;flex-direction:column}
.pvA .av{width:48px;height:48px;border-radius:12px;background:var(--brand-soft);color:var(--brand);font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.pvA .tag{display:inline-block;font-size:14px;line-height:20px;font-weight:600;color:var(--brand);margin-bottom:4px}
.pvA .pick h3{font-size:20px;line-height:28px}
.pvA .pick p{font-size:16px;line-height:24px;color:var(--s11);margin:8px 0 24px}
.pvA .acts{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
.pvA .grp+.grp{margin-top:32px}
.pvA .grp h3{font-size:18px;line-height:28px;margin-bottom:16px}
.pvA .chips{display:flex;flex-wrap:wrap;gap:12px}
.pvA .chips a{min-height:48px;display:inline-flex;align-items:center;padding:0 20px;border:1px solid var(--s6);border-radius:12px;background:#fff;color:var(--s12);font-size:16px}
.pvA .chips a:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.pvA .checks{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pvA .chk{border:1px solid var(--pvl);border-radius:12px;padding:32px 24px}
.pvA .num{width:40px;height:40px;border-radius:50%;background:var(--brand);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:16px}
.pvA .chk h3{font-size:20px;line-height:28px;margin-bottom:8px}
.pvA .chk p{font-size:16px;line-height:28px;color:var(--s12)}
.pvA .do{margin:16px 0 8px;background:var(--brand-soft);border-radius:8px;padding:12px 16px;font-size:16px;line-height:24px}
.pvA .do b{color:var(--brand)}
.pvA .merch{display:flex;flex-direction:column;gap:16px}
.pvA .m{display:grid;grid-template-columns:260px 1fr 200px;gap:24px;border:1px solid var(--pvl);border-radius:12px;padding:24px;align-items:start}
.pvA .m .who{display:flex;gap:16px}
.pvA .m h3{font-size:20px;line-height:28px}
.pvA .m .pos{font-size:14px;line-height:20px;color:var(--s11);margin-top:4px}
.pvA .m dl{display:grid;grid-template-columns:72px 1fr;gap:8px 16px;font-size:16px;line-height:24px}
.pvA .m dt{color:var(--s11)}
.pvA .m .acts{flex-direction:column;align-items:stretch}
.pvA .cap{font-size:14px;line-height:20px;color:var(--s11);margin-top:16px}
.pvA .traps{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.pvA .trap{background:#fff7f7;border:1px solid var(--r6);border-radius:12px;padding:24px}
.pvA .trap b{display:block;color:var(--r11);font-size:18px;line-height:28px;margin-bottom:8px}
.pvA .trap p{font-size:16px;line-height:28px}
.pvA-jump{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:24px}
.pvA-jump a{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:var(--s3);color:var(--s12);font-weight:600;font-size:14px}
.pvA-jump a:hover{background:var(--brand);color:#fff}
.pvA-az .g{display:flex;gap:16px;padding:16px 0;border-top:1px solid var(--pvl)}
.pvA-az .l{flex:0 0 40px;height:40px;border-radius:50%;background:var(--brand-soft);color:var(--brand);font-weight:700;display:flex;align-items:center;justify-content:center}
.pvA-az .items{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.pvA-az .it{display:inline-flex;align-items:center;gap:8px}
.pvA-az .chip{min-height:40px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;border:1px solid var(--s6);color:var(--s12);font-size:16px}
.pvA-az .chip.is-main{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.pvA-az .chip em{font-style:normal;font-size:12px;margin-left:8px;opacity:.9}
.pvA-az .more{font-size:14px;color:var(--s11)}
.pvA .faq details{border:1px solid var(--pvl);border-radius:12px;padding:0 24px;margin-bottom:12px}
.pvA .faq summary{min-height:64px;display:flex;align-items:center;justify-content:space-between;font-size:18px;font-weight:600}
.pvA .faq summary::after{content:"+";font-size:24px;color:var(--brand)}
.pvA .faq details[open] summary::after{content:"−"}
.pvA .faq details p{font-size:16px;line-height:28px;padding-bottom:24px}
.pvA .basis{border-left:4px solid var(--brand);padding:8px 0 8px 24px}
.pvA .basis p{font-size:16px;line-height:28px}.pvA .basis p+p{margin-top:12px}
@media (max-width:960px){.pvA .hero{grid-template-columns:1fr}.pvA .picks{grid-template-columns:1fr 1fr}.pvA .checks{grid-template-columns:1fr}.pvA .m{grid-template-columns:1fr}.pvA .m .acts{flex-direction:row}}
@media (max-width:640px){.pvA .card{padding:32px 20px;margin-top:20px;border-radius:12px}.pvA .picks{grid-template-columns:1fr}.pvA .traps{grid-template-columns:1fr}.pvA .stats{gap:8px}.pvA .stat{padding:16px 8px}.pvA .stat b{font-size:24px;line-height:32px}.pvA .hero-top{gap:16px}.pvA .hico{width:48px;height:48px;flex-basis:48px;font-size:22px}.pvA .m dl{grid-template-columns:64px 1fr}}

/* 04 候选商家：C 版两列卡片 */
.pvA .mgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pvA .mc{background:#fff;border:1px solid var(--pvl);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.pvA .mch{padding:24px;border-bottom:1px solid var(--pvl);display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.pvA .mch h3{font-size:22px;line-height:32px}
.pvA .mch .pos{font-size:14px;line-height:20px;color:var(--s11);margin-top:4px}
.pvA .bd{flex:0 0 auto;font-size:14px;line-height:20px;padding:4px 12px;border-radius:999px;background:var(--s3)}
.pvA .mc dl{padding:24px;display:grid;grid-template-columns:64px 1fr;gap:8px 16px;font-size:16px;line-height:24px}
.pvA .mc dt{color:var(--s11)}
.pvA .mc .acts{padding:0 24px 24px}
@media (max-width:760px){.pvA .mgrid{grid-template-columns:1fr}}

/* 先说结论四张卡：按钮占满一行、「看测评」固定在下面，名字长短不同也一致（站主 10-08 指出 Vultr 那张跟另外三张不一样） */
.pvA .pick .acts{flex-direction:column;align-items:stretch;gap:4px}
.pvA .pick .acts .lnk{justify-content:center}
/* 04 商家卡：窄屏下按钮名字长的会把「看测评」挤到下一行，统一成按钮占满一行、「看测评」在下 */
@media (max-width:1023px){.pvA .mc .acts{flex-direction:column;align-items:stretch;gap:4px}.pvA .mc .acts .lnk{justify-content:center}}

/* 主题 style.css 里 .wrap p{word-break:break-all}，会把 WordPress、VPN 这类英文词拆成两行；支柱页（VPS、教程类都套 .pv .wrap）改回按词换行。2026-10-08 */
.pv .wrap p,.pv .wrap li,.pv .wrap td,.pv .wrap th{word-break:normal;overflow-wrap:break-word}