/* Managed VPS plan cards */
.vps-flag { width:22px; height:15px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.1); vertical-align:-2px; margin-right:6px; }
.vps-specs .vps-flag { margin:0; }
.vps-controls { display:flex; justify-content:center; align-items:center; gap:16px 28px; flex-wrap:wrap; margin-bottom:44px; }
.vps-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; align-items:stretch; }
.vps-card {
  position:relative; display:flex; flex-direction:column; background:#fff;
  border:1px solid var(--paper-line); border-radius:14px; padding:28px 20px 24px;
  transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s cubic-bezier(.16,1,.3,1);
}
.vps-card:hover { transform:translateY(-6px); box-shadow:0 18px 34px -16px rgba(15,23,42,.25); }
.vps-card.popular { border:2px solid var(--signal); box-shadow:0 20px 40px -18px rgba(227,36,43,.35); transform:translateY(-10px); }
.vps-card.popular:hover { transform:translateY(-16px); }
.vps-badge {
  position:absolute; top:-13px; left:50%; transform:translateX(-50%); white-space:nowrap;
  background:var(--signal); color:#fff; font-family:var(--font-mono); font-size:11.5px; font-weight:500;
  padding:5px 12px; border-radius:999px; letter-spacing:.03em;
}
.vps-name { font-family:var(--font-mono); font-size:13px; font-weight:600; letter-spacing:.08em; color:var(--slate); text-align:center; }
.vps-term { font-size:12.5px; color:var(--slate); text-align:center; margin-top:14px; }
.vps-price { font-size:27px; font-weight:700; color:var(--ink); text-align:center; line-height:1.15; margin:2px 0 18px; }
.vps-price small { font-size:13px; font-weight:500; color:var(--slate); }
.vps-card .btn { margin-bottom:22px; }
.vps-specs { list-style:none; margin:0; padding:18px 0 0; border-top:1px solid var(--paper-line); display:flex; flex-direction:column; gap:12px; }
.vps-specs li { display:flex; align-items:center; gap:10px; font-size:14px; color:var(--ink); }
.vps-specs svg, .vps-ico svg { width:18px; height:18px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.vps-specs svg { color:var(--signal); }
.vps-specs .lbl { color:var(--slate); margin-left:auto; font-size:12.5px; }
.vps-managed-tag {
  margin-top:auto; align-self:center; display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:11.5px; font-weight:500; letter-spacing:.03em;
  color:var(--signal); background:var(--signal-tint); padding:5px 12px; border-radius:999px;
}
.vps-specs + .vps-managed-tag { margin-top:20px; }
.vps-managed-tag svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.vps-footnote { text-align:center; margin-top:28px; }

.vps-features { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.vps-feature { background:#fff; border:1px solid var(--paper-line); border-radius:12px; padding:26px 24px; }
.vps-ico { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:10px; background:var(--signal-tint); color:var(--signal); margin-bottom:14px; }
.vps-ico svg { width:22px; height:22px; }
.vps-feature h4 { font-size:16px; margin:0 0 6px; }
.vps-feature p { margin:0; font-size:14px; color:var(--slate); }

.compare-table thead th small { font-family:var(--font-body); text-transform:none; letter-spacing:0; font-weight:500; font-size:12.5px; color:var(--slate); }

.vps-banner-inner { display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap; }
.vps-banner h2 { font-size:clamp(22px,2.6vw,30px); max-width:720px; margin:0 0 10px; }
.vps-banner p { margin:0; color:var(--slate); font-size:16px; }

@media (max-width:1100px) { .vps-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .vps-card.popular { transform:none; } .vps-card.popular:hover { transform:translateY(-6px); } }
@media (max-width:900px) { .vps-features { grid-template-columns:1fr 1fr; } }
@media (max-width:640px) { .vps-grid, .vps-features { grid-template-columns:1fr; } }

/* One background colour (#fffdf9) for every section */
section, .vps-banner { background:#fffdf9; }
.feature-band { background:var(--paper-dim); }
.vps-banner { border-top:1px solid var(--paper-line); }

.vps-hero-art { display:flex; justify-content:center; }
.vps-hero-art svg { width:100%; max-width:520px; height:auto; }
@media (max-width:900px) { .vps-hero-art { display:none; } }

/* Content sections */
.vps-hero-price { margin:18px 0 0; font-size:16px; color:var(--slate); }
.vps-hero-price strong { color:var(--ink); font-size:20px; }
.vps-start-price { text-align:center; margin:28px 0 0; font-size:16px; color:var(--slate); }
.vps-start-price strong { color:var(--ink); font-size:20px; }
.vps-locations { text-align:center; margin:10px 0 0; font-size:13.5px; color:var(--slate); }
.vps-split { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; }
.vps-split.center-y { align-items:center; }
.vps-split .section-head p { margin-top:14px; max-width:none; }
.vps-h3 { font-size:19px; margin:0 0 8px; color:var(--ink); }
.vps-h3.center, .vps-sub.center { text-align:center; }
.vps-sub { font-size:14.5px; color:var(--slate); margin:0 auto 22px; max-width:720px; }
.vps-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.vps-list li { position:relative; padding:14px 16px 14px 44px; background:#fff; border:1px solid var(--paper-line); border-radius:10px; font-size:14.5px; color:var(--ink); }
.vps-list li::before { content:"✓"; position:absolute; left:16px; top:14px; color:var(--signal); font-family:var(--font-mono); }
.vps-list li strong { font-weight:600; }
.vps-note { font-size:14px; border-left:3px solid var(--signal); padding-left:14px; color:var(--ink); }
.vps-features.cols-4 { grid-template-columns:repeat(4,1fr); }
.vps-features.cols-5 { grid-template-columns:repeat(5,1fr); }
.vps-features.cols-5 .vps-feature { padding:22px 18px; }
.vps-two { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:24px; }
.vps-link { color:var(--signal); font-weight:600; white-space:nowrap; }
.vps-cta-box { display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; background:#fff; border:1px solid var(--paper-line); border-radius:16px; padding:40px; }
.vps-cta-box > div { max-width:760px; }
.vps-cta-box h2 { font-size:clamp(24px,2.8vw,32px); margin:0 0 14px; }
.vps-cta-box p { font-size:15px; color:var(--slate); margin:0 0 12px; }
.vps-banner-price { margin-top:14px !important; color:var(--slate) !important; }
.vps-banner-price strong { font-size:20px; color:var(--ink); }
@media (min-width:901px) { .vps-split.reverse > .vps-figure { order:-1; } }
.vps-figure { margin:0; background:#fff; border:1px solid var(--paper-line); border-radius:16px; padding:20px; }
.vps-figure svg { display:block; width:100%; height:auto; }
.vps-figure figcaption { font-size:13px; color:var(--slate); margin-top:12px; text-align:center; }
.vps-panels { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.vps-panels .vps-feature { position:relative; border-top:3px solid var(--signal); padding:26px 24px 28px; transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s cubic-bezier(.16,1,.3,1); }
.vps-panels .vps-feature:hover { transform:translateY(-5px); box-shadow:0 18px 34px -18px rgba(15,23,42,.28); }
.vps-panel-head { display:flex; align-items:center; gap:14px; margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid var(--paper-line); }
.vps-panel-head .vps-ico { margin:0; width:48px; height:48px; border-radius:12px; flex-shrink:0; }
.vps-panel-head .vps-ico svg { width:26px; height:26px; }
.vps-panel-head .vps-panel-name { margin:0; font-size:16px; letter-spacing:.08em; text-transform:uppercase; }
.vps-panel-name { font-family:var(--font-mono); font-size:13px; font-weight:600; letter-spacing:.06em; color:var(--signal); margin:0 0 8px; }
@media (max-width:1100px) { .vps-features.cols-4 { grid-template-columns:repeat(2,1fr); } .vps-features.cols-5 { grid-template-columns:repeat(3,1fr); } }
@media (max-width:900px) { .vps-split { grid-template-columns:1fr; gap:32px; } .vps-panels { grid-template-columns:1fr; } }
@media (max-width:640px) { .vps-two, .vps-features.cols-4, .vps-features.cols-5 { grid-template-columns:1fr; } .vps-cta-box { padding:28px 22px; } }

/* layout fixes: stacked sections, 3-col lists, negative list, highlighted card */
.vps-stack .section-head { max-width:820px; }
.vps-stack .vps-below { margin-top:36px; }
.vps-list.no-tick li { padding-left:16px; }
.vps-list.no-tick li::before { content:none; }
.vps-list.cols-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.vps-list.cols-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.vps-list.neg li::before { content:"✕"; color:var(--slate); }
.vps-feature.hl { border:2px solid var(--signal); background:#fff; }
.vps-feature.hl .vps-list li { background:var(--signal-tint); border-color:transparent; }
@media (max-width:900px) { .vps-list.cols-3 { grid-template-columns:1fr 1fr; } }
@media (max-width:640px) { .vps-list.cols-3, .vps-list.cols-2 { grid-template-columns:1fr; } }

/* visual polish */
.vps-pill { display:inline-block; font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:6px 12px; border-radius:999px; margin-bottom:14px; }
.vps-pill.bad { background:#eef0f3; color:#5b5f68; }
.vps-pill.good { background:var(--signal); color:#fff; }
#server-management .vps-two { align-items:stretch; gap:28px; margin-top:36px; }
#server-management .vps-feature { padding:30px 28px; }
#server-management .vps-feature:not(.hl) { background:#f6f7f9; border-style:dashed; }
#server-management .vps-feature h4 { font-size:20px; margin-bottom:8px; }
#server-management .vps-feature.hl { box-shadow:0 22px 44px -22px rgba(227,36,43,.4); }
#server-management .vps-list li { padding:12px 14px 12px 46px; font-size:14px; }
#server-management .vps-list.neg li { background:#fff; }
#server-management .vps-list li::before { left:12px; top:50%; transform:translateY(-50%); width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; }
#server-management .vps-list.neg li::before { background:#fdecec; color:#bf1a20; }
#server-management .vps-list:not(.neg) li::before { background:var(--signal); color:#fff; }
#team .vps-feature, #security .vps-feature, #who .vps-feature, #why-hostigrow .vps-feature, #get-started .vps-feature {
  position:relative; border-top:3px solid var(--signal); transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s cubic-bezier(.16,1,.3,1);
}
#team .vps-feature:hover, #security .vps-feature:hover, #who .vps-feature:hover, #why-hostigrow .vps-feature:hover, #get-started .vps-feature:hover { transform:translateY(-5px); box-shadow:0 18px 34px -18px rgba(15,23,42,.28); }
#security .vps-feature { text-align:center; }
#security .vps-feature p { max-width:34ch; margin-left:auto; margin-right:auto; }
#get-started .vps-features { counter-reset:step; }
#get-started .vps-feature { counter-increment:step; }
#get-started .vps-feature h4::before { content:counter(step); display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:var(--signal); color:#fff; font-family:var(--font-mono); font-size:15px; margin-bottom:12px; }
.vps-list.cols-3 li { transition:border-color .2s, transform .2s; }
.vps-list.cols-3 li:hover { border-color:var(--signal); transform:translateY(-2px); }