/* Extracted from vvip-business.php style block 1 */
:root {
  --g:         #B8962E;
  --g-l:       #D4AF55;
  --g-p:       #F0E2B6;
  --dark:      #131316;
  --navy:      #0E1525;
  --ink:       #1C1C24;
  --ivory:     #FAF8F4;
  --cream:     #F5F1E8;
  --td:        #1A1A22;
  --tm:        #4A4A5A;
  --tmu:       #7A7A8A;
  --bg:        rgba(184,150,46,0.18);
  --shadow-g:  0 8px 40px rgba(184,150,46,0.15);
  --shadow-d:  0 20px 60px rgba(0,0,0,0.18);
  --shadow-c:  0 4px 20px rgba(0,0,0,0.07);
  --ff-d: 'Cormorant Garamond', Georgia, serif;
  --ff-b: 'DM Sans', system-ui, sans-serif;
  --ease: all 0.35s cubic-bezier(0.25,0.46,0.45,0.94);
}

.vp { font-family: var(--ff-b); }
.vp h1, .vp h2, .vp h3 { font-family: var(--ff-d); }

/* ── LABEL ── */
.vl {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--ff-b); font-size: 10px; font-weight: 600;
  letter-spacing: 3px; text-transform: uppercase; color: var(--g);
  margin-bottom: 20px;
}
.vl::before, .vl::after { content:''; display:block; width:24px; height:1px; background:var(--g); opacity:0.5; }

/* ── BUTTONS ── */
.vbtn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 13px 30px;
  font-family: var(--ff-b); font-size: 11px; font-weight: 700;
  letter-spacing: 1.8px; text-transform: uppercase;
  border-radius: 2px; text-decoration: none !important;
  transition: var(--ease); white-space: nowrap;
}
.vbtn-gold {
  background: linear-gradient(135deg, var(--g) 0%, var(--g-l) 100%);
  color: var(--dark) !important;
  border: none;
  box-shadow: 0 4px 20px rgba(184,150,46,0.3);
}
.vbtn-gold:hover { transform: translateY(-2px); box-shadow: 0 8px 32px rgba(184,150,46,0.45); color: var(--dark) !important; }
.vbtn-ghost {
  background: transparent;
  color: rgba(255,255,255,0.7) !important;
  border: 1px solid rgba(255,255,255,0.15);
}
.vbtn-ghost:hover { border-color: var(--g); color: var(--g-l) !important; }
.vbtn i { font-size: 10px; transition: transform 0.3s; }
.vbtn:hover i { transform: translateX(3px); }

/* ── SECTIONS ── */
.vs        { padding: 96px 0; }
.vs-dark   { background: var(--dark); }
.vs-ink    { background: var(--ink); }
.vs-ivory  { background: var(--ivory); }
.vs-cream  { background: var(--cream); }
.vs-navy   { background: var(--navy); }

/* ── HEADINGS ── */
.vh2      { font-family:var(--ff-d); font-size:clamp(32px,4.2vw,50px); font-weight:300; line-height:1.12; letter-spacing:-0.3px; }
.vh2-l    { color:#fff; }
.vh2-d    { color:var(--td); }
.vh2 em   { font-style:italic; color:var(--g); }
.vbody    { font-size:15px; font-weight:300; line-height:1.8; }
.vbody-l  { color:rgba(255,255,255,0.52); }
.vbody-d  { color:var(--tm); }

/* ═══════════════════════════════════════════
   HERO
═══════════════════════════════════════════ */
.vh {
  position: relative;
  background: #0E1525;
  overflow: hidden;
}
.vh::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 55% 70% at 75% 50%, rgba(184,150,46,0.08) 0%, transparent 60%),
    linear-gradient(135deg, #0a1020 0%, #131316 50%, #1a1a24 100%);
  pointer-events: none;
}
.vh::after {
  content: '';
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px;
  opacity: 0.022;
  pointer-events: none;
}
.vh__gold-bar {
  position: absolute; left:0; right:0; bottom:0; height:1px;
  background: linear-gradient(90deg, transparent 0%, var(--g) 25%, var(--g-l) 50%, var(--g) 75%, transparent 100%);
  opacity: 0.35;
}

.vh__wrap {
  position: relative; z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  padding: 100px 40px 90px;
  max-width: 1200px;
  margin: 0 auto;
}
.vh__copy {
  flex: 0 0 58%;
  max-width: 58%;
  padding-right: 48px;
}
.vh__panel {
  flex: 0 0 42%;
  max-width: 42%;
}

.vh__badge {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 16px 6px 12px;
  border: 1px solid rgba(184,150,46,0.22);
  border-radius: 2px;
  background: rgba(184,150,46,0.06);
  margin-bottom: 28px;
}
.vh__badge-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--g); box-shadow: 0 0 7px var(--g);
  animation: vDot 2.5s ease-in-out infinite;
}
@keyframes vDot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.5;transform:scale(0.75)} }
.vh__badge span { font-size:10px; font-weight:600; letter-spacing:3px; text-transform:uppercase; color:var(--g-l); }

.vh__h1 {
  font-family: var(--ff-d);
  font-size: clamp(40px, 5.5vw, 76px);
  font-weight: 300; line-height: 1.07; letter-spacing: -0.5px;
  color: #fff; margin: 0 0 12px;
}
.vh__h1 em { font-style:italic; color:var(--g-l); }
.vh__h1 strong { font-weight:600; }
.vh__sub {
  font-family: var(--ff-d); font-size: clamp(16px,2vw,22px);
  font-weight:300; font-style:italic; color:rgba(255,255,255,0.4);
  margin: 0 0 22px;
}
.vh__desc {
  font-size:15px; font-weight:300; line-height:1.8;
  color:rgba(255,255,255,0.5); margin-bottom:36px; max-width:460px;
}
.vh__ctas { display:flex; flex-wrap:wrap; gap:12px; }

.vh__stats {
  border: 1px solid rgba(184,150,46,0.18);
  border-radius: 3px;
  overflow: hidden;
  background: rgba(255,255,255,0.03);
  backdrop-filter: blur(16px);
}
.vh__stat {
  padding: 22px 28px;
  border-bottom: 1px solid rgba(184,150,46,0.08);
}
.vh__stat:last-child { border-bottom: none; }
.vh__stat-val {
  display:block; font-family:var(--ff-d); font-size:38px; font-weight:300;
  color:var(--g-l); line-height:1;
}
.vh__stat-lbl {
  display:block; font-size:10px; font-weight:600; letter-spacing:1.8px;
  text-transform:uppercase; color:rgba(255,255,255,0.35); margin-top:4px;
}

/* Trust strip */
.vts {
  display:flex; align-items:center; justify-content:center;
  gap:40px; flex-wrap:wrap; padding:28px 0;
}
.vts-item { display:flex; align-items:center; gap:10px; }
.vts-item i { color:var(--g); font-size:16px; }
.vts-item span { font-size:13px; font-weight:500; color:rgba(255,255,255,0.58); }

/* Ornament */
.vorn { display:flex; align-items:center; gap:18px; margin:52px 0; }
.vorn-l { flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(184,150,46,0.2),transparent); }
.vorn-d { width:7px; height:7px; background:var(--g); transform:rotate(45deg); opacity:0.5; flex-shrink:0; }

/* Pain */
.vpain { padding:28px 30px; border-left:1px solid rgba(184,150,46,0.16); position:relative; }
.vpain::before { content:''; position:absolute; left:-1px; top:0; bottom:0; width:2px; background:var(--g); transform:scaleY(0); transition:transform 0.4s ease; transform-origin:bottom; }
.vpain:hover::before { transform:scaleY(1); }
.vpain-n { display:block; font-family:var(--ff-d); font-size:11px; color:var(--g); letter-spacing:2px; margin-bottom:8px; }
.vpain-t { font-family:var(--ff-d); font-size:19px; font-weight:500; color:#fff; margin:0 0 7px; }
.vpain-p { font-size:13px; font-weight:300; color:rgba(255,255,255,0.45); line-height:1.7; margin:0; }

/* Cards */
.vcard { padding:32px 28px; border:1px solid rgba(26,26,34,0.08); border-radius:2px; background:#fff; height:100%; position:relative; overflow:hidden; transition:var(--ease); }
.vcard::after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:linear-gradient(90deg,var(--g),var(--g-l)); transform:scaleX(0); transition:transform 0.4s ease; transform-origin:left; }
.vcard:hover { box-shadow:var(--shadow-c); transform:translateY(-4px); }
.vcard:hover::after { transform:scaleX(1); }
.vcard-ic { width:42px; height:42px; background:rgba(184,150,46,0.06); border:1px solid var(--bg); border-radius:2px; display:flex; align-items:center; justify-content:center; margin-bottom:14px; transition:var(--ease); }
.vcard-ic i { color:var(--g); font-size:16px; }
.vcard:hover .vcard-ic { background:var(--g); }
.vcard:hover .vcard-ic i { color:#fff; }
.vcard-t { font-family:var(--ff-d); font-size:20px; font-weight:500; color:var(--td); margin:0 0 7px; }
.vcard-p { font-size:13px; font-weight:300; color:var(--tm); line-height:1.7; margin:0; }

/* Diff */
.vdiff { display:flex; gap:18px; padding:22px 0; border-bottom:1px solid rgba(184,150,46,0.07); }
.vdiff:last-child { border-bottom:none; }
.vdiff-ic { flex-shrink:0; width:38px; height:38px; background:rgba(184,150,46,0.07); border:1px solid var(--bg); border-radius:2px; display:flex; align-items:center; justify-content:center; }
.vdiff-ic i { color:var(--g); font-size:13px; }
.vdiff-t { font-size:14px; font-weight:600; color:#fff; margin:0 0 3px; }
.vdiff-p { font-size:13px; font-weight:300; color:rgba(255,255,255,0.44); line-height:1.6; margin:0; }

/* Concierge */
.vci { display:flex; gap:16px; padding:18px; border:1px solid rgba(255,255,255,0.05); border-radius:2px; background:rgba(255,255,255,0.02); margin-bottom:9px; transition:var(--ease); }
.vci:hover { border-color:rgba(184,150,46,0.2); background:rgba(184,150,46,0.03); }
.vci-n { font-family:var(--ff-d); font-size:23px; font-weight:300; color:rgba(184,150,46,0.28); line-height:1; min-width:30px; flex-shrink:0; }
.vci-t { font-size:13px; font-weight:600; color:rgba(255,255,255,0.85); margin:0 0 3px; }
.vci-p { font-size:12px; font-weight:300; color:rgba(255,255,255,0.4); line-height:1.6; margin:0; }

/* Plan cards */
.vplan-wrap {
  display: flex;
  gap: 20px;
  align-items: stretch;
}
.vplan-wrap > * { flex: 1 1 0; min-width: 0; }

.vplan {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 3px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: var(--ease);
  position: relative;
}
.vplan:hover { box-shadow: var(--shadow-d); transform: translateY(-5px); }

.vplan--feat { border-color: var(--g); box-shadow: var(--shadow-g); }

.vplan__ribbon {
  position: absolute; top:14px; right:14px;
  background: var(--g); color: #131316;
  font-family: var(--ff-b); font-size:9px; font-weight:700;
  letter-spacing:2px; text-transform:uppercase;
  padding:3px 9px; border-radius:1px;
}

.vplan__head {
  padding: 28px 28px 20px;
  background: #1A1A22;
  border-bottom: 1px solid rgba(184,150,46,0.1);
}
.vplan__tag {
  display:block; font-size:9px; font-weight:700;
  letter-spacing:2.5px; text-transform:uppercase;
  color: var(--g); margin-bottom:5px;
}
.vplan__name {
  font-family: var(--ff-d); font-size:30px; font-weight:400;
  color: #fff;
  line-height:1; margin:0 0 6px;
}
.vplan__pos {
  font-size:13px; font-weight:300; line-height:1.5;
  color: rgba(255,255,255,0.46);
  margin:0;
}

.vplan__pricing {
  padding: 20px 28px 16px;
  background: #13131a;
  border-bottom: 2px solid var(--g);
}
.vplan__from {
  display:block; font-size:9px; font-weight:600;
  letter-spacing:2.5px; text-transform:uppercase;
  color: rgba(255,255,255,0.3); margin-bottom:6px;
}
.vplan__price-row {
  display:flex; align-items:flex-end; gap:2px; line-height:1;
}
.vplan__cur {
  font-family:var(--ff-b); font-size:16px; font-weight:600;
  color: var(--g-l);
  padding-bottom:5px;
}
.vplan__amt {
  font-family:var(--ff-d); font-size:46px; font-weight:300;
  color: #ffffff;
  line-height:1;
}
.vplan__per {
  font-family:var(--ff-b); font-size:13px; font-weight:400;
  color: rgba(255,255,255,0.35);
  padding-bottom:6px; padding-left:3px;
}
.vplan__note {
  display:block; font-size:11px;
  color: rgba(255,255,255,0.3); margin-top:5px;
}
.vplan__note strong { color: var(--g-l); font-weight:600; }

.vplan__specs { padding: 0 28px; background: #fff; }
.vplan__spec {
  display:flex; justify-content:space-between; align-items:center;
  padding:10px 0; border-bottom:1px solid rgba(0,0,0,0.05);
  font-size:13px;
}
.vplan__spec:last-child { border-bottom:none; }
.vplan__spec-l { color: var(--tmu); font-weight:400; }
.vplan__spec-r { color: var(--td); font-weight:600; text-align:right; }

.vplan__feats { padding:16px 28px; flex:1; background:#fff; }
.vplan__feat {
  display:flex; align-items:flex-start; gap:10px;
  padding:6px 0; border-bottom:1px solid rgba(0,0,0,0.04);
  font-size:13px; color: var(--tm); line-height:1.5;
}
.vplan__feat:last-child { border-bottom:none; }
.vplan__feat i { color:var(--g); font-size:10px; margin-top:3px; flex-shrink:0; }

.vplan__foot { padding:0 28px 28px; background:#fff; margin-top:auto; }

/* Included */
.vinc { display:flex; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid rgba(26,26,34,0.055); }
.vinc:last-child { border-bottom:none; }
.vinc-c { width:28px; height:28px; background:rgba(184,150,46,0.06); border:1px solid var(--bg); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.vinc-c i { color:var(--g); font-size:10px; }
.vinc p { font-size:14px; font-weight:400; color:var(--tm); margin:0; }

/* Outcome */
.vout { padding:28px 24px; border:1px solid rgba(255,255,255,0.055); border-radius:2px; height:100%; transition:var(--ease); }
.vout:hover { border-color:rgba(184,150,46,0.2); background:rgba(184,150,46,0.03); }
.vout i  { font-size:22px; color:var(--g); opacity:0.8; display:block; margin-bottom:11px; }
.vout h3 { font-family:var(--ff-d); font-size:20px; font-weight:500; color:rgba(255,255,255,0.9); margin:0 0 8px; }
.vout p  { font-size:13px; font-weight:300; color:rgba(255,255,255,0.42); line-height:1.7; margin:0; }

/* Testimonials */
.vtesti { padding:32px; border:1px solid rgba(26,26,34,0.08); border-radius:2px; background:#fff; height:100%; transition:var(--ease); }
.vtesti:hover { box-shadow:var(--shadow-c); }
.vtesti-m  { display:block; font-family:var(--ff-d); font-size:42px; font-weight:300; color:var(--g); line-height:0.6; margin-bottom:12px; opacity:0.4; }
.vtesti-q  { font-family:var(--ff-d); font-size:16px; font-weight:300; font-style:italic; color:var(--td); line-height:1.7; margin:0 0 20px; }
.vtesti-r  { width:22px; height:1px; background:var(--g); margin-bottom:10px; }
.vtesti-n  { font-size:13px; font-weight:600; color:var(--td); margin:0 0 2px; }
.vtesti-ro { font-size:12px; font-weight:400; color:var(--tmu); margin:0; }

/* FAQ */
.vfaq { border-bottom:1px solid rgba(184,150,46,0.1); padding:22px 0; }
.vfaq:first-child { border-top:1px solid rgba(184,150,46,0.1); }
.vfaq-q { font-size:15px; font-weight:600; color:rgba(255,255,255,0.85); margin:0 0 7px; display:flex; align-items:flex-start; gap:11px; }
.vfaq-q::before { content:'Q'; font-family:var(--ff-d); font-size:15px; font-weight:500; color:var(--g); flex-shrink:0; line-height:1.4; }
.vfaq-a { font-size:14px; font-weight:300; color:rgba(255,255,255,0.55); line-height:1.8; margin:0; padding-left:26px; }
.vs-dark .vinc p { color: rgba(255,255,255,0.72); }

/* Final CTA */
.vcta {
  position:relative; padding:110px 0;
  background:linear-gradient(155deg,#0E1525 0%,#131316 50%,#0E1525 100%);
  overflow:hidden;
}
.vcta::before,.vcta::after { content:''; position:absolute; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,var(--g),var(--g-l),var(--g),transparent); opacity:0.25; }
.vcta::before { top:0; }
.vcta::after  { bottom:0; }
.vcta-bg { position:absolute; font-family:var(--ff-d); font-size:clamp(100px,18vw,200px); font-weight:300; color:rgba(184,150,46,0.04); letter-spacing:-5px; pointer-events:none; user-select:none; left:-10px; top:50%; transform:translateY(-50%); white-space:nowrap; }
.vcta-glow { position:absolute; right:-5%; top:50%; transform:translateY(-50%); width:500px; height:500px; border-radius:50%; background:radial-gradient(circle,rgba(184,150,46,0.08) 0%,transparent 65%); pointer-events:none; }

/* ── RESPONSIVE ── */
@media (max-width: 991px) {
  .vs { padding: 68px 0; }
  .vh__wrap { padding: 80px 24px 70px; }
  .vh__copy { flex: 0 0 100%; max-width: 100%; padding-right: 0; margin-bottom: 40px; }
  .vh__panel { flex: 0 0 100%; max-width: 100%; }
  .vh__stats { display: flex; flex-wrap: wrap; }
  .vh__stat { flex: 1 1 45%; }
  .vplan-wrap { flex-wrap: wrap; }
  .vplan-wrap > * { flex: 1 1 280px; }
}
@media (max-width: 767px) {
  .vs { padding: 52px 0; }
  .vh__wrap { padding: 64px 16px 60px; }
  .vh__ctas { flex-direction: column; }
  .vbtn { width: 100%; justify-content: center; }
  .vh__stat { flex: 1 1 100%; }
  .vcta { padding: 72px 0; }
  .vplan__amt { font-size: 38px; }
}

/* Extracted from vvip-business.php style block 2 */
/* ── LOCAL VARS ─────────────────────────────────────── */
:root {
  --vp-gold:      #C49A6C;
  --vp-gold-l:    #D4AF55;
  --vp-gold-dim:  rgba(196,154,108,0.18);
  --vp-dark:      #0E1525;
  --vp-dark2:     #131316;
  --vp-dark3:     #1a1a22;
  --vp-ivory:     rgba(255,255,255,0.92);
  --vp-muted:     rgba(255,255,255,0.42);
  --vp-border:    rgba(196,154,108,0.14);
  --vp-ff-d:      'Cormorant Garamond', Georgia, serif;
  --vp-ff-b:      'DM Sans', system-ui, sans-serif;
}

/* ── SECTION SHELL ──────────────────────────────────── */
#plans {
  background: linear-gradient(170deg, #0a1020 0%, #0E1525 35%, #131316 70%, #0a0a10 100%);
  padding: 100px 0 80px;
  position: relative;
  overflow: hidden;
}
#plans::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(ellipse 900px 600px at 50% 0%, rgba(196,154,108,0.04) 0%, transparent 65%);
  pointer-events: none;
}

/* ── SECTION HEADER ─────────────────────────────────── */
.vp-header {
  text-align: center;
  margin-bottom: 64px;
  position: relative;
  z-index: 2;
}
.vp-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 22px;
}
.vp-eyebrow-line {
  width: 32px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--vp-gold));
}
.vp-eyebrow-line.r {
  background: linear-gradient(90deg, var(--vp-gold), transparent);
}
.vp-eyebrow-text {
  font-family: var(--vp-ff-b);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--vp-gold);
}
.vp-h2 {
  font-family: var(--vp-ff-d);
  font-size: clamp(34px, 4vw, 54px);
  font-weight: 300;
  color: #fff;
  line-height: 1.15;
  margin: 0 0 18px;
  letter-spacing: -0.3px;
}
.vp-h2 em {
  font-style: italic;
  color: var(--vp-gold);
}
.vp-intro {
  font-family: var(--vp-ff-b);
  font-size: 15px;
  font-weight: 300;
  color: var(--vp-muted);
  max-width: 620px;
  margin: 0 auto;
  line-height: 1.8;
}

/* ── PLAN GRID ──────────────────────────────────────── */
.vp-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  position: relative;
  z-index: 2;
  margin-bottom: 2px;
}

/* ── PLAN CARD ──────────────────────────────────────── */
.vp-card {
  background: #0f111a;
  border: 1px solid var(--vp-border);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transition: border-color 0.4s ease;
}
.vp-card:hover {
  border-color: rgba(196,154,108,0.32);
}
.vp-card--center {
  background: #111219;
  border-color: rgba(196,154,108,0.28);
  z-index: 1;
  transform: translateY(-6px);
  box-shadow: 0 32px 80px rgba(0,0,0,0.5), 0 0 0 1px rgba(196,154,108,0.22);
}

/* Top accent line */
.vp-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--vp-gold), transparent);
  opacity: 0.35;
  transition: opacity 0.4s ease;
}
.vp-card--center::after { opacity: 0.8; }
.vp-card:hover::after { opacity: 0.6; }

/* Ribbon */
.vp-ribbon {
  position: absolute;
  top: 16px; right: -1px;
  background: var(--vp-gold);
  color: #0a0a10;
  font-family: var(--vp-ff-b);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 5px 14px 5px 12px;
  clip-path: polygon(8px 0%, 100% 0%, 100% 100%, 0% 100%);
}
.vp-ribbon--elite {
  background: linear-gradient(135deg, #C49A6C, #D4AF55);
}

/* ── CARD HEAD ──────────────────────────────────────── */
.vp-card__head {
  padding: 36px 32px 28px;
  border-bottom: 1px solid var(--vp-border);
}
.vp-tag {
  font-family: var(--vp-ff-b);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--vp-gold);
  opacity: 0.7;
  margin-bottom: 10px;
  display: block;
}
.vp-name {
  font-family: var(--vp-ff-d);
  font-size: 32px;
  font-weight: 400;
  color: #fff;
  margin: 0 0 6px;
  letter-spacing: -0.3px;
  line-height: 1.1;
}
.vp-ideal {
  font-family: var(--vp-ff-b);
  font-size: 11px;
  font-weight: 500;
  color: rgba(196,154,108,0.6);
  letter-spacing: 0.5px;
  margin-bottom: 14px;
  display: block;
}
.vp-desc {
  font-family: var(--vp-ff-b);
  font-size: 13px;
  font-weight: 300;
  color: var(--vp-muted);
  line-height: 1.75;
  margin: 0;
}

/* ── PRICING ────────────────────────────────────────── */
.vp-price-block {
  padding: 24px 32px;
  border-bottom: 1px solid var(--vp-border);
  background: rgba(0,0,0,0.2);
}
.vp-from {
  font-family: var(--vp-ff-b);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.25);
  display: block;
  margin-bottom: 6px;
}
.vp-price-row {
  display: flex;
  align-items: baseline;
  gap: 3px;
  margin-bottom: 6px;
}
.vp-cur {
  font-family: var(--vp-ff-b);
  font-size: 18px;
  font-weight: 300;
  color: var(--vp-gold);
  line-height: 1;
}
.vp-amt {
  font-family: var(--vp-ff-d);
  font-size: 42px;
  font-weight: 300;
  color: #fff;
  line-height: 1;
  letter-spacing: -1px;
}
.vp-per {
  font-family: var(--vp-ff-b);
  font-size: 13px;
  font-weight: 300;
  color: rgba(255,255,255,0.35);
}
.vp-annual {
  font-family: var(--vp-ff-b);
  font-size: 11px;
  font-weight: 400;
  color: rgba(196,154,108,0.5);
}
.vp-annual strong { color: rgba(196,154,108,0.8); }

/* ── ARCHITECTURE DIAGRAM ───────────────────────────── */
.vp-arch {
  padding: 24px 32px;
  border-bottom: 1px solid var(--vp-border);
}
.vp-arch-title {
  font-family: var(--vp-ff-b);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  margin-bottom: 16px;
  display: block;
}

/* Node diagram */
.vp-nodes {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.vp-node-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.vp-node-row-label {
  font-family: var(--vp-ff-b);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  width: 52px;
  flex-shrink: 0;
  text-align: right;
}
.vp-node-pills {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  flex: 1;
}
.vp-node {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 2px;
  font-family: var(--vp-ff-b);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.5px;
  white-space: nowrap;
}
.vp-node--web {
  background: rgba(196,154,108,0.1);
  border: 1px solid rgba(196,154,108,0.25);
  color: var(--vp-gold);
}
.vp-node--sql {
  background: rgba(96,165,250,0.08);
  border: 1px solid rgba(96,165,250,0.2);
  color: #93C5FD;
}
.vp-node--backup {
  background: rgba(255,255,255,0.04);
  border: 1px dashed rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.38);
}
.vp-node i {
  font-size: 8px;
  opacity: 0.8;
}

/* Connector line between rows */
.vp-arch-connector {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 0 0 60px;
}
.vp-arch-connector-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(196,154,108,0.15), rgba(196,154,108,0.05));
}
.vp-arch-connector-text {
  font-family: var(--vp-ff-b);
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(196,154,108,0.3);
  white-space: nowrap;
}

/* Specs grid (Pro Cloud only) */
.vp-specs-mini {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.vp-spec-mini {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.vp-spec-mini-l {
  font-family: var(--vp-ff-b);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
}
.vp-spec-mini-r {
  font-family: var(--vp-ff-b);
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,0.6);
}

/* Bandwidth badge */
.vp-bw-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  padding: 6px 12px;
  background: rgba(196,154,108,0.07);
  border: 1px solid rgba(196,154,108,0.15);
  border-radius: 2px;
  font-family: var(--vp-ff-b);
  font-size: 10px;
  font-weight: 600;
  color: rgba(196,154,108,0.7);
  letter-spacing: 0.5px;
}
.vp-bw-badge i { font-size: 9px; }

/* ── FEATURES ───────────────────────────────────────── */
.vp-feats {
  padding: 22px 32px;
  flex: 1;
  border-bottom: 1px solid var(--vp-border);
}
.vp-feat {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 6px 0;
  font-family: var(--vp-ff-b);
  font-size: 12.5px;
  font-weight: 400;
  color: rgba(255,255,255,0.55);
  line-height: 1.55;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.vp-feat:last-child { border-bottom: none; }
.vp-feat i {
  color: var(--vp-gold);
  font-size: 8px;
  margin-top: 4px;
  flex-shrink: 0;
  opacity: 0.7;
}
.vp-feat strong { color: rgba(255,255,255,0.8); font-weight: 600; }

/* ── FOOTER / CTA ───────────────────────────────────── */
.vp-card__foot {
  padding: 24px 32px;
}
.vp-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 14px 24px;
  background: transparent;
  border: 1px solid rgba(196,154,108,0.35);
  color: var(--vp-gold);
  font-family: var(--vp-ff-b);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 1px;
  transition: all 0.35s ease;
  position: relative;
  overflow: hidden;
}
.vp-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(196,154,108,0.12), rgba(196,154,108,0.06));
  opacity: 0;
  transition: opacity 0.35s ease;
}
.vp-cta:hover {
  border-color: var(--vp-gold);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 8px 32px rgba(196,154,108,0.2);
}
.vp-cta:hover::before { opacity: 1; }
.vp-cta span { position: relative; z-index: 1; }
.vp-cta i { position: relative; z-index: 1; font-size: 10px; }

.vp-cta--solid {
  background: linear-gradient(135deg, var(--vp-gold), #B3804D);
  border-color: transparent;
  color: #0a0a10;
}
.vp-cta--solid::before { display: none; }
.vp-cta--solid:hover {
  background: linear-gradient(135deg, #D4AF55, var(--vp-gold));
  color: #0a0a10;
  border-color: transparent;
  box-shadow: 0 8px 32px rgba(196,154,108,0.4);
}

/* ── UNIVERSAL BENEFITS BAND ────────────────────────── */
.vp-benefits {
  position: relative;
  z-index: 2;
  margin-top: 48px;
  border: 1px solid var(--vp-border);
  background: rgba(196,154,108,0.03);
  padding: 36px 40px;
}
.vp-benefits::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--vp-gold), transparent);
  opacity: 0.25;
}
.vp-benefits-header {
  text-align: center;
  margin-bottom: 28px;
}
.vp-benefits-label {
  font-family: var(--vp-ff-b);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--vp-gold);
  opacity: 0.6;
  display: block;
  margin-bottom: 6px;
}
.vp-benefits-title {
  font-family: var(--vp-ff-d);
  font-size: 20px;
  font-weight: 300;
  color: rgba(255,255,255,0.7);
  margin: 0;
  font-style: italic;
}
.vp-benefits-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1px;
  background: var(--vp-border);
}
.vp-benefit {
  background: rgba(10,10,16,0.8);
  padding: 20px 18px;
  text-align: center;
}
.vp-benefit-icon {
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(196,154,108,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px;
}
.vp-benefit-icon i {
  font-size: 13px;
  color: var(--vp-gold);
  opacity: 0.7;
}
.vp-benefit h4 {
  font-family: var(--vp-ff-b);
  font-size: 11px;
  font-weight: 700;
  color: rgba(255,255,255,0.7);
  margin: 0 0 4px;
  line-height: 1.4;
}
.vp-benefit p {
  font-family: var(--vp-ff-b);
  font-size: 10px;
  font-weight: 300;
  color: rgba(255,255,255,0.28);
  margin: 0;
  line-height: 1.5;
}

/* ── FOOTNOTE ───────────────────────────────────────── */
.vp-footnote {
  text-align: center;
  margin-top: 32px;
  font-family: var(--vp-ff-b);
  font-size: 12px;
  font-weight: 300;
  color: rgba(255,255,255,0.25);
  line-height: 1.8;
  position: relative;
  z-index: 2;
}
.vp-footnote strong { color: rgba(255,255,255,0.45); font-weight: 600; }
.vp-footnote a {
  color: var(--vp-gold);
  opacity: 0.7;
  text-decoration: none;
  transition: opacity 0.2s;
}
.vp-footnote a:hover { opacity: 1; }

/* ── PLAN SELECTOR GUIDE ────────────────────────────── */
.vp-guide {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--vp-border);
  margin-bottom: 2px;
}
.vp-guide-item {
  background: rgba(8,10,18,0.9);
  padding: 18px 24px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.vp-guide-icon {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: rgba(196,154,108,0.08);
  border: 1px solid rgba(196,154,108,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}
.vp-guide-icon i { font-size: 10px; color: var(--vp-gold); opacity: 0.7; }
.vp-guide-text {}
.vp-guide-who {
  font-family: var(--vp-ff-d);
  font-size: 14px;
  font-weight: 400;
  font-style: italic;
  color: rgba(255,255,255,0.55);
  display: block;
  margin-bottom: 2px;
}
.vp-guide-desc {
  font-family: var(--vp-ff-b);
  font-size: 11px;
  font-weight: 300;
  color: rgba(255,255,255,0.25);
  line-height: 1.55;
}

/* ── RESPONSIVE ─────────────────────────────────────── */
@media (max-width: 991px) {
  .vp-grid { grid-template-columns: 1fr; gap: 16px; }
  .vp-card--center { transform: none; box-shadow: none; }
  .vp-guide { grid-template-columns: 1fr; }
  .vp-benefits-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .vp-benefits { padding: 24px 20px; }
  .vp-card__head, .vp-price-block, .vp-arch, .vp-feats, .vp-card__foot { padding-left: 22px; padding-right: 22px; }
  .vp-benefits-grid { grid-template-columns: 1fr 1fr; }
  .vp-amt { font-size: 34px; }
}

/* Extracted from vvip-business.php style block 3 */
/* ═══════════════════════════════════════════════════════
   PLANS SECTION v3
═══════════════════════════════════════════════════════ */

#plans {
  background: linear-gradient(170deg, #090e1a 0%, #0E1525 40%, #131316 100%);
  padding: 100px 0 90px;
  position: relative;
  overflow: hidden;
}
#plans::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 1000px 500px at 50% 0%, rgba(184,150,46,0.05) 0%, transparent 60%);
  pointer-events: none;
}

/* ── Section header ── */
.vps-header {
  text-align: center;
  margin-bottom: 72px;
  position: relative; z-index: 2;
}
.vps-intro {
  font-size: 15px; font-weight: 300; line-height: 1.8;
  color: rgba(255,255,255,0.55);   /* was 0.42 */
  max-width: 580px; margin: 0 auto;
  font-family: var(--ff-b);
}

/* ── Tier rows ── */
.vpt-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative; z-index: 2;
}

.vpt {
  display: grid;
  grid-template-columns: 380px 1fr;
  border: 1px solid rgba(184,150,46,0.18);
  border-radius: 3px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.4s ease;
  background: #0d0f1a;
}
.vpt:hover { border-color: rgba(184,150,46,0.35); }

/* Left accent bar */
.vpt::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0; width: 2px;
  background: linear-gradient(180deg, transparent, var(--g), transparent);
  opacity: 0.3; transition: opacity 0.4s ease;
}
.vpt:hover::before { opacity: 0.7; }
.vpt--featured::before { opacity: 0.9; }

/* Featured tier */
.vpt--featured {
  border-color: rgba(184,150,46,0.32);
  background: #0f1120;
  box-shadow: 0 0 0 1px rgba(184,150,46,0.14), 0 24px 64px rgba(0,0,0,0.4);
}
.vpt--featured::after {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--g), var(--g-l), var(--g), transparent);
  opacity: 0.55;
}

/* ── LEFT PANEL ── */
.vpt__left {
  padding: 36px 32px 32px;
  border-right: 1px solid rgba(184,150,46,0.1);
  display: flex;
  flex-direction: column;
  position: relative;
}

/* Tier badge */
.vpt__tier {
  display: inline-flex; align-items: center; gap: 8px;
  margin-bottom: 16px;
}
.vpt__tier-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--g); flex-shrink: 0;
  box-shadow: 0 0 8px var(--g);
}
.vpt__tier-label {
  font-family: var(--ff-b); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; color: var(--g);
}

/* Plan name */
.vpt__name {
  font-family: var(--ff-d); font-size: clamp(28px, 3vw, 40px);
  font-weight: 300; color: #fff; line-height: 1.05;
  letter-spacing: -0.5px; margin: 0 0 5px;
}
.vpt__ideal {
  font-family: var(--ff-b); font-size: 11px; font-weight: 500;
  color: rgba(184,150,46,0.72);   /* was 0.55 */
  letter-spacing: 0.3px;
  margin-bottom: 12px; display: block;
}
.vpt__desc {
  font-family: var(--ff-b); font-size: 12.5px; font-weight: 300;
  color: rgba(255,255,255,0.62);   /* was 0.38 */
  line-height: 1.75;
  margin: 0 0 20px;
}

/* ── What's included checklist (fills left panel) ── */
.vpt__checklist {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: 20px;
}
.vpt__check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.vpt__check:last-child { border-bottom: none; }
.vpt__check-ic {
  width: 16px; height: 16px;
  border-radius: 50%;
  background: rgba(184,150,46,0.12);
  border: 1px solid rgba(184,150,46,0.25);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 1px;
}
.vpt__check-ic i { font-size: 7px; color: var(--g); }
.vpt__check-text {
  font-family: var(--ff-b); font-size: 12px; font-weight: 400;
  color: rgba(255,255,255,0.65);
  line-height: 1.5;
}
.vpt__check-text strong {
  color: rgba(255,255,255,0.88);
  font-weight: 600;
}

/* Price block */
.vpt__price {
  border-top: 1px solid rgba(184,150,46,0.12);
  padding-top: 18px;
  margin-top: auto;
}
.vpt__from {
  font-family: var(--ff-b); font-size: 9px; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase;
  color: rgba(255,255,255,0.45);   /* was 0.22 */
  display: block; margin-bottom: 4px;
}
.vpt__price-row {
  display: flex; align-items: baseline; gap: 3px; margin-bottom: 4px;
}
.vpt__cur {
  font-family: var(--ff-b); font-size: 16px; font-weight: 300;
  color: var(--g); line-height: 1;
}
.vpt__amt {
  font-family: var(--ff-d); font-size: 44px; font-weight: 300;
  color: #fff; line-height: 1; letter-spacing: -1.5px;
}
.vpt__per {
  font-family: var(--ff-b); font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,0.45);   /* was 0.3 */
}
.vpt__annual {
  font-family: var(--ff-b); font-size: 11px; font-weight: 300;
  color: rgba(184,150,46,0.6);   /* was 0.45 */
  margin-bottom: 14px; display: block;
}
.vpt__annual strong { color: rgba(184,150,46,0.85); }

/* CTA */
.vpt__cta {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 12px 22px;
  font-family: var(--ff-b); font-size: 10px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  text-decoration: none !important;
  border-radius: 1px;
  transition: all 0.35s cubic-bezier(0.25,0.46,0.45,0.94);
  white-space: nowrap;
}
.vpt__cta--ghost {
  border: 1px solid rgba(184,150,46,0.35);
  color: var(--g-l) !important;
  background: transparent;
}
.vpt__cta--ghost:hover {
  border-color: var(--g-l);
  color: #fff !important;
  background: rgba(184,150,46,0.08);
  box-shadow: 0 6px 24px rgba(184,150,46,0.18);
}
.vpt__cta--solid {
  background: linear-gradient(135deg, var(--g) 0%, var(--g-l) 100%);
  color: #0a0a0f !important;
  border: none;
  box-shadow: 0 4px 20px rgba(184,150,46,0.3);
}
.vpt__cta--solid:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(184,150,46,0.48);
  color: #0a0a0f !important;
}
.vpt__cta i { font-size: 9px; transition: transform 0.3s; }
.vpt__cta:hover i { transform: translateX(3px); }

/* ── RIGHT PANEL ── */
.vpt__right {
  padding: 32px 36px 0 40px;
  display: flex;
  flex-direction: column;
}

.vpt__arch-label {
  font-family: var(--ff-b); font-size: 9px; font-weight: 700;
  letter-spacing: 2.5px; text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  margin-bottom: 20px; display: block;
}

/* Architecture diagram */
.vpt__diagram {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0;
  flex: 1;
}

/* Layer row */
.vptd-layer {
  display: flex;
  align-items: stretch;
  min-height: 42px;
}
.vptd-layer__label {
  width: 84px; flex-shrink: 0;
  display: flex; align-items: center;
  padding-right: 12px;
}
.vptd-layer__label span {
  font-family: var(--ff-b); font-size: 9px; font-weight: 700;
  letter-spacing: 1.5px; text-transform: uppercase;
  color: rgba(255,255,255,0.3);   /* was 0.18 */
  text-align: right; width: 100%;
  line-height: 1.3;
}

/* Connector rows */
.vptd-connector {
  display: flex; align-items: stretch; min-height: 20px;
}
.vptd-connector__label {
  width: 84px; flex-shrink: 0;
}
.vptd-connector__line-wrap {
  flex: 1; display: flex; align-items: center;
  padding-left: 16px; gap: 10px;
}
.vptd-connector__line {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, rgba(184,150,46,0.22), rgba(184,150,46,0.06), transparent);
}
.vptd-connector__text {
  font-family: var(--ff-b); font-size: 9px; font-weight: 500;
  letter-spacing: 1px; text-transform: uppercase;
  color: rgba(184,150,46,0.65);
  white-space: nowrap;
}

/* Nodes container */
.vptd-layer__nodes {
  flex: 1; display: flex; align-items: center;
  gap: 6px; flex-wrap: wrap; padding: 6px 0;
  border-left: 1px solid rgba(184,150,46,0.1);
  padding-left: 16px;
}

/* Node annotation text */
.vptd-annotation {
  font-family: var(--ff-b); font-size: 10px;
  color: rgba(184,150,46,0.6);   /* was 0.4 */
  align-self: center; padding-left: 4px;
}
.vptd-annotation--dim {
  color: rgba(255,255,255,0.35);   /* was 0.2 */
}

/* Node pills */
.vptd-node {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border-radius: 2px;
  font-family: var(--ff-b); font-size: 10.5px; font-weight: 600;
  letter-spacing: 0.3px; white-space: nowrap;
  transition: all 0.25s ease;
}
.vptd-node i { font-size: 9px; opacity: 0.9; }

.vptd-node--web {
  background: rgba(184,150,46,0.1);
  border: 1px solid rgba(184,150,46,0.28);
  color: var(--g-l);
}
.vptd-node--web:hover {
  background: rgba(184,150,46,0.18);
  border-color: rgba(184,150,46,0.5);
}
.vptd-node--sql {
  background: rgba(99,179,237,0.08);
  border: 1px solid rgba(99,179,237,0.22);
  color: #A0D8F1;   /* slightly brighter */
}
.vptd-node--sql:hover {
  background: rgba(99,179,237,0.14);
  border-color: rgba(99,179,237,0.38);
}
.vptd-node--failover {
  background: rgba(255,255,255,0.05);
  border: 1px dashed rgba(255,255,255,0.2);   /* was 0.12 */
  color: rgba(255,255,255,0.55);   /* was 0.35 */
}
.vptd-node--failover:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.35);
}

/* Bandwidth / specs strip */
.vpt__strip {
  margin-top: 16px;
  display: flex; flex-wrap: wrap; gap: 6px;
  padding-top: 16px;
  border-top: 1px solid rgba(184,150,46,0.09);
}
.vpt__badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 11px;
  background: rgba(184,150,46,0.07);
  border: 1px solid rgba(184,150,46,0.18);
  border-radius: 2px;
  font-family: var(--ff-b); font-size: 10px; font-weight: 600;
  color: rgba(184,150,46,0.75);   /* was 0.6 */
  letter-spacing: 0.3px;
}
.vpt__badge i { font-size: 9px; }

/* Per-server spec mini-grid (Pro Cloud) */
.vpt__specs {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: rgba(184,150,46,0.08);
  margin-top: 16px;
  border-top: 1px solid rgba(184,150,46,0.08);
}
.vpt__spec {
  background: rgba(9,11,20,0.95);
  padding: 11px 13px;
}
.vpt__spec-l {
  display: block; font-family: var(--ff-b); font-size: 9px; font-weight: 600;
  letter-spacing: 1.2px; text-transform: uppercase;
  color: rgba(255,255,255,0.35);   /* was 0.2 */
  margin-bottom: 4px;
}
.vpt__spec-r {
  display: block; font-family: var(--ff-b); font-size: 12px; font-weight: 500;
  color: rgba(255,255,255,0.75);   /* was 0.65 */
}

/* Ribbon */
.vpt__ribbon {
  position: absolute; top: 18px; right: 0;
  background: var(--g);
  color: #0a0a10;
  font-family: var(--ff-b); font-size: 9px; font-weight: 800;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 5px 16px 5px 12px;
  clip-path: polygon(8px 0%, 100% 0%, 100% 100%, 0% 100%);
  z-index: 3;
}
.vpt__ribbon--gradient {
  background: linear-gradient(135deg, var(--g), var(--g-l));
}

/* ── WHO IS THIS FOR guide strip ── */
.vps-guide {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(184,150,46,0.1);
  margin-bottom: 20px;
}
.vps-guide-item {
  background: rgba(7,9,17,0.95);
  padding: 18px 22px;
  display: flex;
  align-items: flex-start;
  gap: 13px;
  transition: background 0.3s ease;
}
.vps-guide-item:hover { background: rgba(12,14,24,1); }
.vps-guide-icon {
  width: 30px; height: 30px; flex-shrink: 0;
  border-radius: 50%;
  background: rgba(184,150,46,0.08);
  border: 1px solid rgba(184,150,46,0.18);
  display: flex; align-items: center; justify-content: center;
  margin-top: 2px;
  transition: all 0.3s ease;
}
.vps-guide-item:hover .vps-guide-icon {
  background: rgba(184,150,46,0.14);
  border-color: rgba(184,150,46,0.35);
}
.vps-guide-icon i { font-size: 10px; color: var(--g); opacity: 0.85; }
.vps-guide-label {
  font-family: var(--ff-b); font-size: 8px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: rgba(184,150,46,0.5);
  display: block; margin-bottom: 4px;
}
.vps-guide-who {
  font-family: var(--ff-d); font-size: 15px; font-weight: 400;
  font-style: italic; color: rgba(255,255,255,0.78);
  display: block; margin-bottom: 5px; line-height: 1.2;
}
.vps-guide-desc {
  font-family: var(--ff-b); font-size: 11px; font-weight: 300;
  color: rgba(255,255,255,0.42); line-height: 1.6;
}

/* ── BENEFITS BAND ── */
.vps-benefits {
  position: relative; z-index: 2;
  margin-top: 52px;
}
.vps-benefits-head {
  display: flex; align-items: center; gap: 20px;
  margin-bottom: 2px;
}
.vps-benefits-head-line { flex: 1; height: 1px; background: rgba(184,150,46,0.14); }
.vps-benefits-head-text {
  font-family: var(--ff-b); font-size: 9px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
  color: rgba(184,150,46,0.55);
  white-space: nowrap;
}
.vps-benefits-grid {
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 1px; background: rgba(184,150,46,0.1);
}
.vps-benefit {
  background: rgba(8,10,18,0.95);
  padding: 22px 18px; text-align: center;
  transition: background 0.3s ease;
}
.vps-benefit:hover { background: rgba(13,15,26,1); }
.vps-benefit-ic {
  width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid rgba(184,150,46,0.2);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 12px; transition: all 0.3s ease;
}
.vps-benefit:hover .vps-benefit-ic {
  background: rgba(184,150,46,0.1);
  border-color: rgba(184,150,46,0.4);
}
.vps-benefit-ic i { font-size: 12px; color: var(--g); opacity: 0.8; }
.vps-benefit h4 {
  font-family: var(--ff-b); font-size: 11px; font-weight: 700;
  color: rgba(255,255,255,0.78);   /* was 0.65 */
  margin: 0 0 5px; line-height: 1.4;
}
.vps-benefit p {
  font-family: var(--ff-b); font-size: 10px; font-weight: 300;
  color: rgba(255,255,255,0.4);   /* was 0.25 */
  margin: 0; line-height: 1.55;
}

/* Footnote */
.vps-footnote {
  text-align: center; margin-top: 28px;
  font-family: var(--ff-b); font-size: 12px; font-weight: 300;
  color: rgba(255,255,255,0.35);   /* was 0.22 */
  line-height: 1.8;
  position: relative; z-index: 2;
}
.vps-footnote strong { color: rgba(255,255,255,0.55); font-weight: 600; }
.vps-footnote a { color: var(--g-l); opacity: 0.8; text-decoration: none; }
.vps-footnote a:hover { opacity: 1; }

/* ── Architecture explainer grid - fills empty space below diagram ── */
.vpt__explainer {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(184,150,46,0.07);
  margin-top: 20px;
  border-top: 1px solid rgba(184,150,46,0.1);
}
.vpt__explain-item {
  background: rgba(6,8,16,0.95);
  padding: 16px 18px;
  display: flex;
  align-items: flex-start;
  gap: 11px;
}
.vpt__explain-ic {
  width: 28px; height: 28px;
  border-radius: 2px;
  background: rgba(184,150,46,0.08);
  border: 1px solid rgba(184,150,46,0.18);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 1px;
}
.vpt__explain-ic i { font-size: 10px; color: var(--g); opacity: 0.85; }
.vpt__explain-title {
  font-family: var(--ff-b); font-size: 11px; font-weight: 700;
  color: rgba(255,255,255,0.72);
  display: block; margin-bottom: 4px;
}
.vpt__explain-desc {
  font-family: var(--ff-b); font-size: 11px; font-weight: 300;
  color: rgba(255,255,255,0.55);
  line-height: 1.55; margin: 0;
}

/* ── RESPONSIVE ── */
@media (max-width: 1100px) {
  .vpt { grid-template-columns: 320px 1fr; }
  .vpt__explainer { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .vpt { grid-template-columns: 1fr; }
  .vpt__left { border-right: none; border-bottom: 1px solid rgba(184,150,46,0.1); padding-bottom: 24px; }
  .vpt__right { padding: 24px 22px 0; }
  .vps-benefits-grid { grid-template-columns: repeat(2, 1fr); }
  .vpt__specs { grid-template-columns: repeat(2, 1fr); }
  .vpt__checklist { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
  .vpt__explainer { grid-template-columns: 1fr; }
  .vps-guide { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  #plans { padding: 68px 0 60px; }
  .vpt__checklist { grid-template-columns: 1fr; }
  .vps-benefits-grid { grid-template-columns: 1fr 1fr; }
  .vptd-layer__label { width: 60px; }
  .vptd-connector__label { width: 60px; }
}