/* ==========================================================================
   visa-premium.css — the 8-tab public visa guide (TPL-Visa Page Design)
   --------------------------------------------------------------------------
   One design system, driven by data, reused across every country × visa-type
   page. Palette locked to the Tripgation logo: navy #23246b, red #ff2045
   (both already in chrome.css :root). Scoped under .vguide so it never leaks
   into the rest of the site.
   ========================================================================== */

.vguide{
  --vg-navy:      #14206b;   /* hero + heading navy (a touch deeper than brand) */
  --vg-navy-2:    #0b1650;
  --vg-blue:      #1f52d9;   /* royal-blue icon fill                            */
  --vg-blue-ink:  #17307e;   /* heading blue in cards                           */
  --vg-red:       #ff2045;   /* logo red — primary CTA                          */
  --vg-red-dark:  #d10f34;
  --vg-red-soft:  #fff1f3;   /* red tint card background                        */
  --vg-tint:      #eef3fd;   /* blue tint card background                       */
  --vg-tint-2:    #f6f9ff;
  --vg-line:      #e2e7f4;   /* hairline border                                 */
  --vg-ink:       #1a2340;   /* body text                                       */
  --vg-muted:     #5c6488;   /* secondary text                                  */
  --vg-green:     #16a34a;   /* eligibility ticks                               */
  --vg-card-sh:   0 1px 2px rgba(20,32,107,.04), 0 8px 26px rgba(20,32,107,.06);
  --vg-radius:    16px;
  color:var(--vg-ink);
  background:#fbfcff;
}
.vguide *{ box-sizing:border-box; }
.vguide .vg-wrap{ max-width:1200px; margin:0 auto; padding:0 20px; }

/* ---------- HERO --------------------------------------------------------- */
.vg-hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(1200px 400px at 85% -10%, rgba(80,120,255,.55), transparent 60%),
    linear-gradient(120deg, var(--vg-navy-2) 0%, var(--vg-navy) 46%, #1c37a0 100%);
  color:#fff;
}
.vg-hero::after{ /* faint city-skyline silhouette on the right */
  content:""; position:absolute; right:0; bottom:0; top:0; width:52%;
  background:
    linear-gradient(90deg, var(--vg-navy) 0%, rgba(20,32,107,0) 34%),
    url("/assets/visa-hero-skyline.svg") right bottom / cover no-repeat;
  opacity:.5; pointer-events:none;
}
.vg-hero-inner{ position:relative; z-index:2; padding:34px 0 30px; }
.vg-crumb{ font-size:13px; color:#c7d2ff; margin:0 0 18px; }
.vg-crumb a{ color:#c7d2ff; text-decoration:none; }
.vg-crumb a:hover{ color:#fff; text-decoration:underline; }
.vg-crumb .sep{ opacity:.5; margin:0 7px; }
.vg-hero-head{ display:flex; align-items:flex-start; gap:20px; }
.vg-flag{
  flex:0 0 auto; width:66px; height:66px; border-radius:50%;
  display:grid; place-items:center; font-size:38px; line-height:1;
  background:#fff; box-shadow:0 6px 18px rgba(0,0,0,.25); overflow:hidden;
}
.vg-flag img{ width:100%; height:100%; object-fit:cover; }
.vg-hero-titles{ min-width:0; }
.vg-hero h1{ margin:0; font-size:40px; line-height:1.06; font-weight:800; letter-spacing:-.5px; }
.vg-hero-sub{ margin:8px 0 0; font-size:19px; font-weight:600; color:#dbe4ff; }
.vg-hero-intro{ margin:12px 0 0; max-width:620px; font-size:15px; line-height:1.55; color:#c3cdf3; }
.vg-swoosh{
  position:absolute; right:22%; top:26px; z-index:3; text-align:right;
  font-family:"Brush Script MT","Segoe Script",cursive; font-style:italic;
  font-size:30px; line-height:1.15; color:#eaf0ff; text-shadow:0 2px 10px rgba(0,0,0,.3);
}
.vg-swoosh::after{ content:""; display:block; width:150px; height:6px; margin:6px 0 0 auto;
  border-radius:6px; background:linear-gradient(90deg,var(--vg-red),#ff789a); }
.vg-pill{
  position:absolute; right:28px; bottom:26px; z-index:3;
  display:inline-flex; align-items:center; gap:9px;
  background:#fff; color:var(--vg-navy); border-radius:40px;
  padding:9px 16px; font-size:12.5px; font-weight:700; line-height:1.15;
  box-shadow:0 8px 22px rgba(0,0,0,.25);
}
.vg-pill svg{ width:18px; height:18px; color:var(--vg-blue); }

/* visa-type selector strip */
.vg-types{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:20px 0 2px; position:relative; z-index:3; }
.vg-types-label{ font-size:12px; text-transform:uppercase; letter-spacing:.5px; color:#a8b6ee; margin-right:2px; }
.vg-type-pill{ display:inline-block; padding:6px 13px; border-radius:30px; font-size:12.5px; font-weight:600;
  color:#dbe4ff; text-decoration:none; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.16); transition:.15s; }
.vg-type-pill:hover{ background:rgba(255,255,255,.2); color:#fff; }
.vg-type-pill.is-active{ background:var(--vg-red); border-color:var(--vg-red); color:#fff; }

/* metadata chips */
.vg-chips{ display:flex; flex-wrap:wrap; gap:26px; margin:24px 0 4px; }
.vg-chip{ display:flex; align-items:center; gap:11px; min-height:38px; }
.vg-chip-ic{
  flex:0 0 auto; width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.12); display:grid; place-items:center;
}
.vg-chip-ic svg{ width:19px; height:19px; color:#fff; }
.vg-chip>span:last-child{ display:flex; flex-direction:column; gap:2px; line-height:1.2; }
.vg-chip-t{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.4px; color:#a8b6ee; }
.vg-chip-v{ display:block; font-size:13.5px; font-weight:700; color:#fff; }
.vg-chip-v small{ display:block; font-weight:500; font-size:11px; color:#a8b6ee; }

/* ---------- TAB NAV ------------------------------------------------------ */
.vg-tabnav{ position:sticky; top:0; z-index:40; background:#fff; border-bottom:1px solid var(--vg-line);
  box-shadow:0 2px 10px rgba(20,32,107,.04); }
.vg-tabnav-inner{ display:flex; align-items:center; gap:6px; overflow-x:auto; scrollbar-width:none; }
.vg-tabnav-inner::-webkit-scrollbar{ display:none; }
.vg-tab{
  flex:0 0 auto; position:relative; padding:17px 14px; font-size:14.5px; font-weight:600;
  color:var(--vg-muted); text-decoration:none; white-space:nowrap; border-bottom:3px solid transparent;
}
.vg-tab:hover{ color:var(--vg-navy); }
.vg-tab.is-active{ color:var(--vg-red); border-bottom-color:var(--vg-red); font-weight:700; }
.vg-tab--track{
  margin-left:auto; border:1.5px solid #f2b8c2; border-radius:10px; color:var(--vg-navy);
  padding:10px 16px; display:inline-flex; align-items:center; gap:8px; font-weight:700;
}
.vg-tab--track svg{ width:16px; height:16px; }
.vg-tab--track.is-active{ border-color:var(--vg-red); color:var(--vg-red); border-bottom-width:1.5px; }

/* ---------- SECTION SHELL ------------------------------------------------ */
.vg-section{ padding:40px 0 54px; }
.vg-eyebrow{ font-size:12.5px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:var(--vg-red); margin:0 0 6px; }
.vg-title{ font-size:34px; font-weight:800; color:var(--vg-navy); margin:0 0 10px; letter-spacing:-.4px; }
.vg-lead{ font-size:15.5px; line-height:1.6; color:var(--vg-muted); max-width:640px; margin:0; }

.vg-grid{ display:grid; grid-template-columns:1fr 340px; gap:24px; align-items:start; margin-top:26px; }
.vg-col{ min-width:0; display:flex; flex-direction:column; gap:22px; }
.vg-side{ display:flex; flex-direction:column; gap:18px; position:sticky; top:78px; }

/* ---------- CARDS -------------------------------------------------------- */
.vg-card{ background:#fff; border:1px solid var(--vg-line); border-radius:var(--vg-radius); box-shadow:var(--vg-card-sh); padding:22px 24px; }
.vg-card--tint{ background:var(--vg-tint); border-color:#dae4fb; box-shadow:none; }
.vg-card--red{ background:var(--vg-red-soft); border-color:#ffd4dc; box-shadow:none; }
.vg-card--pad{ padding:26px; }
.vg-card-h{ display:flex; align-items:center; gap:12px; margin:0 0 14px; }
.vg-ic{ flex:0 0 auto; width:44px; height:44px; border-radius:50%; background:var(--vg-blue); display:grid; place-items:center; }
.vg-ic svg{ width:22px; height:22px; color:#fff; }
.vg-ic--red{ background:var(--vg-red); }
.vg-ic--green{ background:var(--vg-green); }
.vg-ic--ghostred{ background:#ffe1e7; } .vg-ic--ghostred svg{ color:var(--vg-red); }
.vg-card-h h2,.vg-card-h h3{ margin:0; font-size:20px; font-weight:700; color:var(--vg-blue-ink); }
.vg-card p{ margin:0 0 10px; font-size:14.5px; line-height:1.6; color:var(--vg-ink); }
.vg-card p:last-child{ margin-bottom:0; }

/* about / feature chips */
.vg-about{ display:grid; grid-template-columns:300px 1fr; gap:22px; align-items:stretch; }
.vg-about-img{ border-radius:14px; overflow:hidden; min-height:230px; background:
    linear-gradient(160deg,#1c37a0,#0b1650); position:relative; }
.vg-about-img img{ width:100%; height:100%; object-fit:cover; }
.vg-about-script{ position:absolute; left:16px; top:16px; color:#fff; font-family:"Brush Script MT","Segoe Script",cursive;
  font-style:italic; font-size:24px; line-height:1.1; text-shadow:0 2px 8px rgba(0,0,0,.4); }
.vg-feats{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:16px; }
.vg-feat{ background:var(--vg-tint); border-radius:12px; padding:14px 10px; text-align:center; }
.vg-feat svg{ width:24px; height:24px; color:var(--vg-blue); }
.vg-feat span{ display:block; margin-top:8px; font-size:12px; font-weight:600; color:var(--vg-navy); line-height:1.3; }

/* key/value table */
.vg-kv{ width:100%; border-collapse:collapse; }
.vg-kv tr{ border-bottom:1px solid var(--vg-line); }
.vg-kv tr:last-child{ border-bottom:0; }
.vg-kv td{ padding:12px 6px; vertical-align:top; font-size:14px; }
.vg-kv .k{ width:44%; color:var(--vg-ink); font-weight:600; display:flex; align-items:center; gap:10px; }
.vg-kv .k svg{ width:18px; height:18px; color:var(--vg-blue); flex:0 0 auto; }
.vg-kv .v{ color:var(--vg-muted); }

/* two-up cards row */
.vg-two{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.vg-three{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }

/* check lists */
.vg-checks{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:11px; }
.vg-checks li{ position:relative; padding-left:30px; font-size:14px; line-height:1.5; color:var(--vg-ink); }
.vg-checks li::before{ content:""; position:absolute; left:0; top:1px; width:20px; height:20px; border-radius:50%;
  background:var(--vg-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat; }
.vg-checks--x li::before{ background:var(--vg-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E") center/12px no-repeat; }
.vg-checks--dot li::before{ background:var(--vg-blue); width:9px; height:9px; top:6px; left:4px; }
.vg-checks--dot li{ padding-left:22px; }

/* ---------- SIDE CTA CARDS ---------------------------------------------- */
.vg-cta{ background:var(--vg-tint); border:1px solid #dae4fb; border-radius:var(--vg-radius); padding:22px; }
.vg-cta h3{ margin:0 0 6px; font-size:17px; font-weight:700; color:var(--vg-blue-ink); }
.vg-cta p{ margin:0 0 14px; font-size:13.5px; line-height:1.55; color:var(--vg-muted); }
.vg-cta--red{ background:var(--vg-red-soft); border-color:#ffd4dc; text-align:center; }
.vg-cta--red h3{ color:var(--vg-red-dark); }

/* buttons */
.vg-btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; font-size:14.5px; font-weight:700;
  border-radius:11px; padding:13px 20px; text-decoration:none; cursor:pointer; border:1.5px solid transparent; transition:.16s; }
.vg-btn svg{ width:17px; height:17px; }
.vg-btn--red{ background:var(--vg-red); color:#fff; }
.vg-btn--red:hover{ background:var(--vg-red-dark); }
.vg-btn--navy{ background:var(--vg-navy); color:#fff; }
.vg-btn--ghost{ background:#fff; color:var(--vg-navy); border-color:var(--vg-line); }
.vg-btn--ghost:hover{ border-color:var(--vg-navy); }
.vg-btn--block{ width:100%; }

/* ---------- QUICK LINKS / RELATED --------------------------------------- */
.vg-panel{ background:var(--vg-tint-2); border:1px solid var(--vg-line); border-radius:var(--vg-radius); padding:24px 26px; }
.vg-panel-h{ display:flex; align-items:center; gap:12px; margin:0 0 4px; }
.vg-panel-h h2{ margin:0; font-size:20px; font-weight:700; color:var(--vg-blue-ink); }
.vg-panel-sub{ margin:0 0 18px 56px; font-size:13.5px; color:var(--vg-muted); }
.vg-qlinks{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.vg-qlink{ background:#fff; border:1px solid var(--vg-line); border-radius:12px; padding:16px 14px; text-decoration:none; display:block; transition:.16s; }
.vg-qlink:hover{ border-color:var(--vg-blue); box-shadow:var(--vg-card-sh); transform:translateY(-1px); }
.vg-qlink svg{ width:26px; height:26px; color:var(--vg-blue); }
.vg-qlink b{ display:block; margin-top:10px; font-size:14px; color:var(--vg-blue-ink); }
.vg-qlink span{ font-size:12.5px; color:var(--vg-muted); }
.vg-qlink span::after{ content:" →"; color:var(--vg-blue); }
.vg-related .vg-qlinks{ grid-template-columns:repeat(5,1fr); }

/* need-help strip */
.vg-help{ background:var(--vg-red-soft); border:1px solid #ffd4dc; border-radius:var(--vg-radius);
  display:flex; align-items:center; gap:18px; padding:20px 24px; flex-wrap:wrap; }
.vg-help .vg-ic{ background:#ffe1e7; } .vg-help .vg-ic svg{ color:var(--vg-red); }
.vg-help-t{ flex:1 1 320px; }
.vg-help-t b{ display:block; font-size:16px; color:var(--vg-red-dark); }
.vg-help-t span{ font-size:13.5px; color:var(--vg-muted); }
.vg-help-a{ display:flex; gap:12px; flex-wrap:wrap; }

/* ---------- PROFILE CARDS (doc checklist) ------------------------------- */
.vg-profiles{ display:grid; grid-template-columns:repeat(4,1fr) 1.3fr; gap:12px; }
.vg-profile{ background:#fff; border:1px solid var(--vg-line); border-radius:12px; padding:14px 16px;
  display:flex; align-items:center; gap:12px; cursor:pointer; text-align:left; transition:.16s; }
.vg-profile:hover{ border-color:var(--vg-blue); }
.vg-profile.is-active{ background:var(--vg-red); border-color:var(--vg-red); color:#fff; }
.vg-profile.is-active .vg-profile-ic{ background:rgba(255,255,255,.2); } .vg-profile.is-active .vg-profile-ic svg{ color:#fff; }
.vg-profile.is-active small{ color:rgba(255,255,255,.85); }
.vg-profile-ic{ flex:0 0 auto; width:38px; height:38px; border-radius:9px; background:var(--vg-tint); display:grid; place-items:center; }
.vg-profile-ic svg{ width:20px; height:20px; color:var(--vg-blue); }
.vg-profile b{ display:block; font-size:13.5px; line-height:1.2; }
.vg-profile small{ font-size:11.5px; color:var(--vg-muted); }
.vg-profile--link{ background:var(--vg-red-soft); border-color:#ffd4dc; }
.vg-profile--link .vg-profile-ic{ background:#ffe1e7; } .vg-profile--link .vg-profile-ic svg{ color:var(--vg-red); }
.vg-profile--link b{ color:var(--vg-ink); } .vg-profile--link a{ color:var(--vg-red); font-weight:700; font-size:12.5px; text-decoration:none; }

/* doc table */
.vg-doctable{ width:100%; border-collapse:collapse; }
.vg-doctable th{ text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.4px; color:var(--vg-muted);
  padding:10px 12px; border-bottom:2px solid var(--vg-line); }
.vg-doctable td{ padding:14px 12px; border-bottom:1px solid var(--vg-line); font-size:13.5px; vertical-align:top; }
.vg-doctable tr:last-child td{ border-bottom:0; }
.vg-doctable .num{ width:34px; color:var(--vg-muted); }
.vg-doc-name{ display:flex; align-items:center; gap:10px; font-weight:600; color:var(--vg-ink); }
.vg-doc-name svg{ width:18px; height:18px; color:var(--vg-blue); flex:0 0 auto; }
.vg-doc-guide{ color:var(--vg-muted); line-height:1.5; }
.vg-tag{ display:inline-block; font-size:12px; font-weight:600; padding:4px 12px; border-radius:20px; background:var(--vg-tint); color:var(--vg-blue-ink); }
.vg-tag--copy{ background:#eef3fd; color:#5c6488; }

/* unlock gate */
.vg-unlock{ background:var(--vg-tint); border:1px dashed #b9c8ee; border-radius:var(--vg-radius); padding:24px; }
.vg-unlock-feats{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px 20px; margin:14px 0 18px; }
.vg-unlock-feats span{ position:relative; padding-left:26px; font-size:13px; color:var(--vg-ink); }
.vg-unlock-feats span::before{ content:""; position:absolute; left:0; top:0; width:18px; height:18px; border-radius:50%;
  background:var(--vg-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat; }
.vg-unlock .ln{ text-align:center; margin:12px 0 0; font-size:13.5px; color:var(--vg-muted); }
.vg-unlock .ln a{ color:var(--vg-red); font-weight:700; text-decoration:none; }

/* version + notes side cards share .vg-card; small kv */
.vg-mini{ display:flex; flex-direction:column; gap:12px; }
.vg-mini-row{ display:flex; justify-content:space-between; gap:12px; font-size:13.5px; padding-bottom:10px; border-bottom:1px solid var(--vg-line); }
.vg-mini-row:last-child{ border-bottom:0; padding-bottom:0; }
.vg-mini-row .k{ color:var(--vg-muted); } .vg-mini-row .v{ color:var(--vg-ink); font-weight:600; text-align:right; }

/* ---------- APPLICATION PROCESS ----------------------------------------- */
.vg-flow{ display:flex; align-items:flex-start; gap:6px; }
.vg-flow-step{ flex:1 1 0; text-align:center; position:relative; }
.vg-flow-step .n{ width:44px; height:44px; margin:0 auto 12px; border-radius:50%; background:var(--vg-blue); color:#fff;
  display:grid; place-items:center; font-weight:800; font-size:16px; position:relative; z-index:2; }
.vg-flow-step:first-child .n,.vg-flow-step:last-child .n{ background:var(--vg-red); }
.vg-flow-step .ic{ width:52px; height:52px; margin:0 auto 8px; border-radius:14px; background:var(--vg-tint); display:grid; place-items:center; }
.vg-flow-step .ic svg{ width:24px; height:24px; color:var(--vg-blue); }
.vg-flow-step b{ display:block; font-size:13.5px; color:var(--vg-navy); }
.vg-flow-step span{ font-size:11.5px; color:var(--vg-muted); }
.vg-flow-step::before{ content:""; position:absolute; top:22px; left:-50%; width:100%; height:2px; background:var(--vg-line); z-index:1; }
.vg-flow-step:first-child::before{ display:none; }
.vg-steps-list{ display:flex; flex-direction:column; gap:16px; counter-reset:vgs; }
.vg-stepcard{ display:grid; grid-template-columns:auto 1fr; gap:16px; background:#fff; border:1px solid var(--vg-line);
  border-radius:var(--vg-radius); box-shadow:var(--vg-card-sh); padding:20px 22px; }
.vg-stepcard .sn{ width:34px; height:34px; border-radius:50%; background:var(--vg-blue); color:#fff; font-weight:800; display:grid; place-items:center; }
.vg-stepcard:first-child .sn,.vg-stepcard:last-child .sn{ background:var(--vg-red); }
.vg-stepcard h3{ margin:0 0 6px; font-size:16.5px; color:var(--vg-navy); }
.vg-stepcard p{ margin:0 0 10px; font-size:13.5px; color:var(--vg-ink); line-height:1.55; }
.vg-todo{ background:var(--vg-tint); border-radius:10px; padding:10px 14px; }
.vg-todo b{ font-size:12px; text-transform:uppercase; letter-spacing:.3px; color:var(--vg-muted); }

/* ---------- FEES -------------------------------------------------------- */
.vg-feetable{ width:100%; border-collapse:collapse; }
.vg-feetable th{ text-align:left; font-size:13px; color:var(--vg-navy); background:var(--vg-tint); padding:12px 14px; }
.vg-feetable td{ padding:12px 14px; border-bottom:1px solid var(--vg-line); font-size:14px; }
.vg-feetable .total td{ font-weight:800; color:var(--vg-red-dark); background:var(--vg-red-soft); border-bottom:0; }
.vg-pay{ display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.vg-pay div{ background:var(--vg-tint); border-radius:12px; padding:14px 8px; text-align:center; font-size:12px; font-weight:600; color:var(--vg-navy); }
.vg-pay svg{ width:24px; height:24px; color:var(--vg-blue); }

/* ---------- TRACK APPLICATION ------------------------------------------- */
.vg-track-tabs{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:0 0 22px; }
.vg-track-tab{ padding:13px; text-align:center; border-radius:11px; border:1px solid var(--vg-line); background:#f7f9ff;
  font-weight:600; font-size:14px; color:var(--vg-muted); cursor:pointer; }
.vg-track-tab.is-active{ background:var(--vg-red); color:#fff; border-color:var(--vg-red); }
.vg-field label{ display:block; font-size:13.5px; font-weight:700; color:var(--vg-navy); margin:0 0 8px; }
.vg-field input{ width:100%; padding:14px 16px; border:1px solid var(--vg-line); border-radius:11px; font-size:15px; }
.vg-field .hint{ font-size:12.5px; color:var(--vg-muted); margin:8px 0 0; }
.vg-status-line{ display:flex; align-items:flex-start; justify-content:space-between; margin:10px 0 18px; }
.vg-status-node{ flex:1 1 0; text-align:center; position:relative; }
.vg-status-node .d{ width:40px; height:40px; margin:0 auto 8px; border-radius:50%; display:grid; place-items:center;
  background:var(--vg-line); color:#fff; position:relative; z-index:2; }
.vg-status-node.done .d{ background:var(--vg-green); }
.vg-status-node.current .d{ background:var(--vg-blue); }
.vg-status-node b{ display:block; font-size:12px; color:var(--vg-navy); line-height:1.2; }
.vg-status-node span{ font-size:11px; color:var(--vg-muted); }
.vg-status-node::before{ content:""; position:absolute; top:20px; left:-50%; width:100%; height:3px; background:var(--vg-line); z-index:1; }
.vg-status-node.done::before,.vg-status-node.current::before{ background:var(--vg-green); }
.vg-status-node:first-child::before{ display:none; }
.vg-badge{ display:inline-block; font-size:12px; font-weight:700; padding:5px 12px; border-radius:20px; background:#e9f9ef; color:var(--vg-green); }

/* ---------- FOOTER BAND ------------------------------------------------- */
.vg-footband{ background:linear-gradient(120deg,var(--vg-navy-2),var(--vg-navy)); color:#fff; }
.vg-footband-inner{ display:flex; align-items:center; gap:24px; padding:20px 0; flex-wrap:wrap; }
.vg-footband-brand{ font-family:"Brush Script MT","Segoe Script",cursive; font-style:italic; font-size:26px; }
.vg-footband-items{ display:flex; gap:26px; flex-wrap:wrap; flex:1; }
.vg-footband-item{ display:flex; align-items:center; gap:8px; font-size:13px; color:#c7d2ff; }
.vg-footband-item svg{ width:18px; height:18px; }
.vg-footband .vg-btn--red{ margin-left:auto; }

/* ---------- RESPONSIVE -------------------------------------------------- */
@media (max-width:980px){
  .vg-grid{ grid-template-columns:1fr; }
  .vg-side{ position:static; }
  .vg-about{ grid-template-columns:1fr; }
  .vg-feats,.vg-qlinks,.vg-related .vg-qlinks,.vg-pay{ grid-template-columns:repeat(3,1fr); }
  .vg-two,.vg-three,.vg-unlock-feats{ grid-template-columns:1fr; }
  .vg-profiles{ grid-template-columns:1fr 1fr; }
  .vg-flow{ flex-wrap:wrap; gap:16px; } .vg-flow-step{ flex:1 1 40%; } .vg-flow-step::before{ display:none; }
  .vg-swoosh,.vg-pill{ display:none; } .vg-hero::after{ width:100%; opacity:.25; }
  .vg-track-tabs,.vg-status-line{ grid-template-columns:1fr; }
  .vg-status-line{ display:flex; flex-direction:column; gap:14px; } .vg-status-node::before{ display:none; }
}
@media (max-width:560px){
  .vg-hero h1{ font-size:29px; } .vg-title{ font-size:26px; }
  .vg-chips{ gap:16px; } .vg-feats,.vg-qlinks,.vg-related .vg-qlinks,.vg-pay{ grid-template-columns:1fr 1fr; }
  .vg-profiles{ grid-template-columns:1fr; }
}