/* VPS catalogue and checkout only; do not alter shared navigation. */
.vps-page, .vps-page-wrap { --store-ink:#193d30; --store-muted:#64756d; --store-border:#e0e9e4; }
.vps-page .vps-page-head, .vps-page-wrap .vps-topbar {
    background:#fff; border:1px solid var(--store-border);
    border-radius:14px; padding:20px 24px; box-shadow:0 2px 12px rgba(25,61,48,.025); align-items:center;
}
.vps-page .vps-title, .vps-page-wrap .vps-topbar-left h1 { color:var(--store-ink); font-size:26px; font-weight:750; letter-spacing:-.6px; }
.vps-page .vps-subtitle, .vps-page-wrap .vps-topbar-left p { color:var(--store-muted); font-size:13px; line-height:1.7; max-width:600px; }
.vps-page .vps-heading-label { font-weight:600; font-size:10px; background:#eaf5ee; border-color:#d3e7da; }
.vps-page .vps-switcher-wrap { margin:18px 0 22px; }
.vps-page .vps-switcher { padding:6px; gap:6px; background:#eef3f0; border-color:var(--store-border); }
.vps-page .vps-switcher .site-item { min-height:46px; font-size:13px; font-weight:600; }
.vps-page .vps-switcher .site-item.active { background:#1f6d53; border-color:#1f6d53; }
.vps-page .vps-grid { gap:18px; }
.vps-page .vps-card { border-radius:16px; border-color:var(--store-border); box-shadow:0 3px 16px rgba(25,61,48,.035); }
.vps-page .vps-card:hover { transform:translateY(-3px); border-color:#8fbaa1; box-shadow:0 10px 28px rgba(25,61,48,.09); }
.vps-page .vps-card-top { padding:22px; background:linear-gradient(160deg,#f7fbf8,#fff 65%); border-top:3px solid #c8dfd2; }
.vps-page .vps-provider-badge { background:#fff; border:1px solid var(--store-border); color:#426650; font-size:10px; font-weight:600; box-shadow:none; }
.vps-page .vps-name { color:var(--store-ink); font-size:17px; line-height:1.5; font-weight:650; min-height:0; margin-bottom:14px; }
.vps-page .vps-price { font-size:29px; letter-spacing:-1px; font-weight:750; font-variant-numeric:tabular-nums; }
.vps-page .vps-spec-list { padding:4px 22px; }
.vps-page .vps-spec-list li { padding:13px 0; border-color:#edf1ee; font-size:13px; }
.vps-page .vps-spec-value { color:var(--store-ink); font-weight:600; overflow-wrap:anywhere; }
.vps-page .vps-card-footer { padding:18px 22px 22px; margin-top:auto; }
.vps-page .vps-buy-btn { min-height:46px; background:#1f6d53; border:1px solid #1f6d53; font-size:13px; font-weight:600; }
.vps-page .vps-buy-btn:hover { background:#18553f; }
.vps-page-wrap .vps-layout { gap:22px; align-items:start; }
.vps-page-wrap .vps-main { min-width:0; }
.vps-page-wrap .vps-card { border:1px solid var(--store-border); border-radius:16px; box-shadow:0 4px 20px rgba(25,61,48,.035); overflow:hidden; }
.vps-page-wrap .vps-card-header { padding:16px 22px; background:#fff; border-bottom:1px solid #edf1ee; }
.vps-page-wrap .vps-card-title { display:flex; align-items:center; gap:10px; font-size:15px; font-weight:700; color:var(--store-ink); }
.vps-page-wrap .store-step { display:inline-grid; place-items:center; width:28px; height:28px; border-radius:8px; background:#eef5f1; border:1px solid #e0ebe4; color:#43765a; font-size:11px; font-weight:700; }
.vps-page-wrap .vps-card-subtitle { font-size:12px; line-height:1.6; color:var(--store-muted); }
.vps-page-wrap .vps-card-body { padding:22px; }
.vps-page-wrap .plan-hero-name { font-size:23px; font-weight:700; letter-spacing:-.4px; color:var(--store-ink); }
.vps-page-wrap .plan-hero-icon { background:#edf7f1; color:#1f6d53; border:1px solid #dcebe1; box-shadow:none; border-radius:16px; }
.vps-page-wrap .plan-meta-badge { background:#f5f8f6; border:1px solid #e4ece7; color:#52685b; font-size:12px; font-weight:500; }
.vps-page-wrap .billing-grid { gap:12px; }
.vps-page-wrap .billing-option { border-radius:10px; min-height:82px; box-shadow:none; padding:16px 8px; }
.vps-page-wrap .billing-option:hover { transform:none; box-shadow:none; border-color:#6c9e80; }
.vps-page-wrap .billing-option.active { background:#edf7f1; color:#1f6d53; border-color:#1f6d53; box-shadow:inset 0 0 0 1px #1f6d53; }
.vps-page-wrap .billing-option.active::after { width:16px; height:16px; top:5px; right:5px; background-color:#1f6d53; border-width:0; background-size:10px; }
.vps-page-wrap .billing-label { font-size:13px; font-weight:700; }
.vps-page-wrap .billing-price { font-size:12px; font-weight:500; }
.vps-page-wrap .resource-box { border:1px solid #e3ebe6; border-radius:12px; background:#fafcfb; padding:16px; box-shadow:none; }
.vps-page-wrap .resource-box-title { font-size:12px; font-weight:600; color:var(--store-muted); }
.vps-page-wrap .resource-value { font-size:22px; font-weight:700; color:var(--store-ink); }
.vps-page-wrap .slider-control { border-radius:9px; box-shadow:none; }
.vps-page-wrap .os-option { border-radius:12px; border-color:var(--store-border); min-height:108px; }
.vps-page-wrap .os-option label { min-height:108px; gap:8px; padding:14px 10px; }
.vps-page-wrap .os-thumb { width:40px; height:40px; border-radius:10px; background:#f6f8f7; border-color:#e4ebe6; }
.vps-page-wrap .os-thumb img { max-width:28px; max-height:28px; }
.vps-page-wrap .os-option:hover { transform:none; box-shadow:none; }
.vps-page-wrap .os-option.active { background:#f4faf6; border-color:#1f6d53; box-shadow:inset 0 0 0 1px #1f6d53; }
.vps-page-wrap .os-option input[type=radio] { display:block; position:absolute; opacity:0; width:1px; height:1px; }
.vps-page-wrap .os-option:focus-within { outline:3px solid #8ac9a3; outline-offset:2px; }
.vps-page-wrap .os-name { font-size:12px; font-weight:600; }
.vps-page-wrap .summary-top { background:linear-gradient(120deg,#edf7f1,#f9fcfa); padding:22px; border-top:3px solid #1f6d53; }
.vps-page-wrap .store-summary-label { display:block; color:#5b7867; text-transform:uppercase; letter-spacing:1px; font-size:10px; font-weight:700; margin-bottom:8px; }
.vps-page-wrap .summary-plan { font-size:19px; font-weight:700; overflow-wrap:anywhere; }
.vps-page-wrap .summary-body { padding:22px; }
.vps-page-wrap .summary-row { gap:16px; font-size:13px; }
.vps-page-wrap .summary-row strong { text-align:right; overflow-wrap:anywhere; min-width:0; font-weight:600; }
.vps-page-wrap .summary-total { background:#f1f8f4; border:1px solid #dcebe1; border-radius:12px; padding:16px; gap:12px; flex-wrap:wrap; }
.vps-page-wrap .summary-total strong { font-size:25px; letter-spacing:-.6px; font-variant-numeric:tabular-nums; }
.vps-page-wrap .summary-pay-btn { background:#1f6d53; box-shadow:none; border-radius:10px; min-height:48px; font-size:14px; font-weight:600; }
.vps-page-wrap .summary-pay-btn:hover { background:#18553f; transform:none; }
.vps-page-wrap .vps-coupon-row { flex-wrap:wrap; }
.vps-page-wrap .vps-coupon-input { min-width:100px; }
.vps-page a:focus-visible, .vps-page-wrap a:focus-visible, .vps-page-wrap button:focus-visible, .vps-page-wrap input:focus-visible { outline:3px solid #8ac9a3; outline-offset:3px; }
.vps-page-wrap .vps-back-btn { background:#fff; border:1px solid #dce6df; border-radius:9px; box-shadow:none; color:#486452; min-height:40px; font-size:12px; }
.vps-page-wrap .summary-group-title { font-size:11px; font-weight:650; letter-spacing:.04em; color:#5c7265; }
.vps-page-wrap .summary-row { padding:8px 0; }
.vps-page-wrap .summary-safe { font-size:11px; font-weight:500; color:#708176; }
.vps-page .vps-head-status { background:#f6faf7; border:1px solid #e2ebe5; box-shadow:none; color:#54715e; font-size:11px; font-weight:500; }
@media(min-width:900px) and (max-width:1279px) { .vps-page .vps-grid-item { grid-column:span 4; } }
@media(max-width:1200px) { .vps-page-wrap .vps-summary { position:static; } }
@media(max-width:640px) {
    .vps-page .vps-page-head, .vps-page-wrap .vps-topbar { padding:18px; border-radius:14px; }
    .vps-page .vps-title, .vps-page-wrap .vps-topbar-left h1 { font-size:22px; }
    .vps-page-wrap .vps-card-header, .vps-page-wrap .vps-card-body, .vps-page-wrap .summary-body { padding:18px; }
    .vps-page-wrap .billing-grid, .vps-page-wrap .os-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .vps-page-wrap .summary-total strong { font-size:23px; }
}
@media(prefers-reduced-motion:reduce) {
    .vps-page .vps-card, .vps-page .vps-buy-btn, .vps-page-wrap .billing-option, .vps-page-wrap .os-option { transition:none; transform:none; }
}