/* ===== VaultComps Neon Dark (SCOPED) ===== */
.vtb-home {
  --bg: #0b1120;
  --panel: #0f172a;
  --ink: #e5e7eb;
  --muted: #94a3b8;
  --accent: #8b5cf6;
  --accent2: #22d3ee;
  --border: #1f2937;
  --ring: rgba(139, 92, 246, 0.35);
  background: radial-gradient(1200px 600px at 50% -200px, rgba(139, 92, 246, 0.2), transparent), var(--bg);
  color: var(--ink);
  padding: 12px 0 24px;
}

.vtb-home * {
  box-sizing: border-box;
}

.vtb-home a {
  color: inherit;
}

.vtb-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.vtb-home__hero {
  padding: 12px 14px 2px;
}

@media (min-width: 768px) {
  .vtb-home__hero {
    padding: 24px 16px 8px;
  }
}

.vtb-home__hero-inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 960px;
  margin: 0 auto;
  background: rgba(15, 23, 42, 0.86);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
  text-align: left;
}

@media (min-width: 768px) {
  .vtb-home__hero-inner {
    padding: 20px;
  }
}

.vtb-home__logo {
  height: 42px;
  margin-bottom: 10px;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.5));
}

.vtb-home__h1 {
  font-size: 26px;
  line-height: 1.2;
  margin: 6px 0 0;
}

@media (min-width: 768px) {
  .vtb-home__h1 {
    font-size: 36px;
  }
}

.vtb-home__accent {
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.vtb-home__sub {
  color: var(--muted);
  margin: 0;
  max-width: 640px;
}

@media (min-width: 1024px) {
  .vtb-home__sub {
    white-space: nowrap;
    max-width: none;
  }
}

.vtb-home__cta-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: stretch;
}

@media (min-width: 640px) {
  .vtb-home__cta-group {
    flex-direction: row;
    align-items: center;
    gap: 16px;
  }
}

.vtb-btn {
  display: inline-block;
  padding: 10px 16px;
  border-radius: 12px;
  text-decoration: none;
  border: 1px solid var(--border);
  color: var(--ink);
  font-weight: 600;
}

.vtb-btn--primary {
  background: linear-gradient(135deg, var(--accent), #6366f1);
  border: 0;
  box-shadow: 0 8px 28px rgba(99, 102, 241, 0.35);
}

.vtb-btn--ghost {
  background: transparent;
}

.vtb-home__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-start;
  padding: 0;
  margin: 0;
  color: var(--muted);
}

.vtb-home__trust span {
  background: #0f172a;
  border: 1px solid var(--border);
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
}

/* === Hero premium styles (scoped) === */
.hero-content {
  position: relative;
  background: rgba(15, 23, 42, 0.92);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(14, 20, 37, 0.6);
  overflow: visible;
}

.hero-content::before {
  content: "";
  position: absolute;
  inset: -20% -18%;
  background: radial-gradient(70% 70% at 15% 25%, rgba(139, 92, 246, 0.38), transparent 70%),
    radial-gradient(65% 65% at 80% 15%, rgba(34, 211, 238, 0.32), transparent 72%);
  opacity: 0.6;
  pointer-events: none;
  filter: blur(0.5px);
  border-radius: inherit;
}

.hero-content > * {
  position: relative;
  z-index: 1;
}

.hero-chips {
  gap: 10px;
}

.hero-chips .chip,
.vtb-hero__chips .chip {
  background:
      linear-gradient(135deg, rgba(148, 163, 184, 0.18), rgba(59, 130, 246, 0.1))
        padding-box,
      linear-gradient(135deg, rgba(99, 102, 241, 0.4), rgba(14, 165, 233, 0.28)) border-box;
  border: 1px solid transparent;
  color: rgba(226, 232, 240, 0.92);
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: 0.02em;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.45);
}

.hero-chips .chip strong,
.vtb-hero__chips .chip strong {
  color: #f8fafc;
}

@media (max-width: 480px) {
  .hero-chips {
    gap: 8px;
  }

  .hero-chips .chip,
  .vtb-hero__chips .chip {
    padding: 6px 12px;
  }
}

.vtb-grid {
  max-width: 1100px;
  margin: 16px auto 0;
  padding: 0 14px;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

@media (min-width: 1024px) {
  .vtb-grid {
    gap: 20px;
  }
}

.vtb-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 40px 20px;
  color: var(--muted);
  background: rgba(15, 23, 42, 0.6);
  border-radius: 16px;
  border: 1px dashed var(--border);
}

.vtb-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
}

.vtb-card__img-wrap {
  position: relative;
  display: block;
}

.vtb-card__img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

@media (min-width: 768px) {
  .vtb-card__img {
    height: 220px;
  }
}

.vtb-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #f59e0b;
  color: #111;
  padding: 4px 8px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 12px;
}

.vtb-card__body {
  padding: 14px;
}

.vtb-card__title { 
  margin: 0 0 6px 0;
  font-size: 18px;
}

.vtb-card__heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.vtb-card__heading .vtb-card__title {
  margin-bottom: 0;
}

.vtb-card__heading .vtb-price-pill {
  margin-top: 4px;
}

.vtb-price-pill {
  display: inline-block;
  padding: .2rem .6rem;
  border-radius: 9999px;
  font-weight: 600;
  font-size: .9rem;
  background: rgba(108, 92, 231, 0.12);
  color: #c7c3ff;
  margin-bottom: .3rem;
}

.vtb-strip {
  display: block;
  margin: .35rem 0 .25rem;
  color: #bfc4d6;
  font-size: .95rem;
}

.vtb-card__title a {
  color: var(--ink);
  text-decoration: none;
}

.vtb-card__tag {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 14px;
}

.vtb-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  font-size: 14px;
}

.vtb-price {
  font-weight: 700;
}

.vtb-left {
  color: var(--muted);
}

.vtb-progress {
  height: 2px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 2px;
  overflow: hidden;
  margin: .2rem 0;
}

.vtb-progress__bar {
  height: 100%;
  width: var(--progress-pct, 0%);
  background: #6c5ce7;
  opacity: .9;
  transition: width .35s ease;
}

.vtb-progress-chip {
  display: inline-block;
  font-size: .8rem;
  opacity: .8;
  margin-top: .3rem;
  color: #bfc4d6;
}

.vtb-card .muted,
.vtb-card .vtb-legal,
.vtb-card .vtb-steps {
  display: none !important;
}

.vtb-trustline {
  margin-top: .35rem;
  color: #98a1b3;
  font-size: .9rem;
}

.vtb-hero-trust {
  margin-top: -4px;
}

.vtb-board-trust .vtb-home__trust {
  justify-content: flex-start;
}

.vtb-board-trust {
  max-width: 960px;
  margin: 8px auto 0;
  padding: 0 14px;
}

/* --- Game card layout polish --- */
.vtb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 24px;
  align-items: stretch;
}

.vtb-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: 18px;
  background: var(--card-bg, rgba(255,255,255,0.03));
  overflow: hidden;
}

.vtb-card__img-wrap {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  display: block;
}

.vtb-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.vtb-card__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  flex: 1;
}

.vtb-card__title-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.vtb-card__title {
  font-size: 1.15rem;
  line-height: 1.25;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.vtb-price-pill {
  margin-left: auto;
  white-space: nowrap;
  font-weight: 600;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(108,92,231,.18);
  border: 1px solid rgba(108,92,231,.45);
}

.vtb-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  color: #aeb4c3;
  font-size: .95rem;
}

.vtb-meta > span::after {
  content: "•";
  margin: 0 6px;
  opacity: .5;
}

.vtb-meta > span:last-child::after {
  content: "";
}

.vtb-card__spacer {
  flex: 1;
}

.vtb-card__mini-grid {
  margin-top: 12px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid var(--border, rgba(148, 163, 184, 0.25));
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.65), rgba(15, 23, 42, 0.35));
  transition: opacity 0.3s ease;
}

.vtb-card__mini-grid[hidden] {
  display: none;
}

.vtb-card__mini-grid .mini-grid {
  gap: 6px;
}

.vtb-card__mini-grid .vc-cell {
  font-size: 0.75rem;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.18);
  color: #e2e8f0;
}

.vtb-card__mini-grid .vc-cell.is-sold {
  opacity: 0.35;
}

.vtb-card__mini-grid .vc-cell.is-res {
  border-color: var(--brand, #6c5ce7);
  box-shadow: 0 0 0 1px var(--brand, #6c5ce7);
}

.vtb-progress {
  height: 6px;
  background: rgba(255,255,255,.08);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 10px;
}

.vtb-progress__bar {
  height: 100%;
  width: var(--progress-pct, 0%);
  background: linear-gradient(90deg, #6c5ce7, #6ce7b8);
  transition: width .25s ease;
}

.vtb-card__cta {
  display: grid;
}

.vtb-card__cta .vtb-btn {
  width: 100%;
  justify-content: center;
  padding: 12px 16px;
  font-weight: 700;
}

@media (max-width: 480px) {
  .vtb-card__body {
    padding: 14px;
  }

  .vtb-card__title {
    font-size: 1.05rem;
  }
}

.vtb-board-strip {
  max-width: 960px;
  margin: 16px auto 0;
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(15, 23, 42, 0.8);
  border: 1px solid rgba(148, 163, 184, 0.24);
  color: var(--ink);
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 14px;
}

.vtb-steps {
  max-width: 960px;
  margin: 12px auto;
  padding: 0;
  list-style: none;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 14px;
}

.vtb-steps li {
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 999px;
  padding: 6px 12px;
}

.vtb-steps__index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-right: 8px;
  border-radius: 999px;
  background: rgba(99, 102, 241, 0.24);
  color: var(--ink);
  font-weight: 700;
  font-size: 12px;
}

.vtb-legal {
  margin: 12px 0 0;
  font-size: 13px;
  color: var(--muted);
}

.vtb-legal a {
  color: inherit;
  text-decoration: underline;
}

.vtb-sticky-checkout {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom));
  background: rgba(15, 23, 42, 0.95);
  border: 1px solid rgba(148, 163, 184, 0.25);
  border-radius: 14px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4);
  z-index: 40;
}

.vtb-sticky-checkout[hidden] {
  display: none;
}

.vtb-sticky-checkout__summary {
  font-weight: 600;
  color: var(--ink);
}

.vtb-sticky-checkout__button {
  flex-shrink: 0;
  min-width: 140px;
}

body.vtb-sticky-active {
  padding-bottom: 96px;
}

@media (min-width: 768px) {
  .vtb-sticky-checkout {
    max-width: 440px;
    margin: 0 auto;
    left: 0;
    right: 0;
  }

  body.vtb-sticky-active {
    padding-bottom: 48px;
  }
}

.vtb-faq {
  margin: 24px 0 0;
  padding: 16px;
  background: rgba(15, 23, 42, 0.75);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 16px;
  color: var(--ink);
}

.vtb-faq__title {
  margin: 0 0 12px;
  font-size: 18px;
}

.vtb-faq__item + .vtb-faq__item {
  border-top: 1px solid rgba(148, 163, 184, 0.16);
}

.vtb-faq__toggle {
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  padding: 12px 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
}

.vtb-faq__content {
  padding: 0 0 12px;
  color: var(--muted);
  font-size: 14px;
}

.vtb-faq__content a {
  color: inherit;
  text-decoration: underline;
}

.vtb-home__winner {
  max-width: 960px;
  margin: 16px auto 0;
  padding: 0 14px;
}

.vtb-winner-card {
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 16px;
  padding: 16px;
  color: var(--ink);
  display: grid;
  gap: 8px;
}

.vtb-winner-card__title {
  margin: 0;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}

.vtb-winner-card__name {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
}

.vtb-winner-card__prize,
.vtb-winner-card__date,
.vtb-winner-card__ref,
.vtb-winner-card__placeholder {
  margin: 0;
  font-size: 14px;
  color: var(--muted);
}

.vtb-winner-card__link {
  justify-self: start;
  color: var(--ink);
  font-weight: 600;
  text-decoration: underline;
}

.vtb-footer {
  max-width: 1100px;
  margin: 24px auto 0;
  padding: 24px 14px 32px;
  text-align: center;
  color: var(--muted);
  font-size: 13px;
}

.vtb-footer__links {
  display: flex;
  gap: 6px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.vtb-footer__links a {
  color: var(--ink);
  text-decoration: none;
}

.vtb-footer__legal {
  display: flex;
  gap: 6px;
  justify-content: center;
  flex-wrap: wrap;
}

.vtb-footer__legal-item {
  display: inline-flex;
  align-items: center;
}

body .vtb-home {
  min-height: calc(100vh - 120px);
}

/* How it works layout */
.hcw {
  background: #f8fafc;
  padding: clamp(48px, 6vw, 80px) 16px 96px;
}

.hcw__inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 5vw, 56px);
}

.hcw__intro {
  max-width: 760px;
}

.hcw__eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.75rem;
  font-weight: 600;
  color: #475569;
  margin: 0 0 0.5rem;
}

.hcw__cta-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 1.5rem;
}

.hcw__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.75rem 1.4rem;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--brand, #1d4ed8);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 12px 30px rgba(29, 78, 216, 0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.hcw__cta:hover,
.hcw__cta:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(29, 78, 216, 0.35);
}

.hcw__cta:focus-visible {
  outline: 3px solid rgba(29, 78, 216, 0.3);
  outline-offset: 3px;
}

.hcw__cta--outline {
  background: transparent;
  color: var(--brand, #1d4ed8);
  border-color: rgba(15, 23, 42, 0.15);
  box-shadow: none;
}

.hcw__cta--outline:hover,
.hcw__cta--outline:focus-visible {
  background: rgba(29, 78, 216, 0.08);
  box-shadow: none;
}

.hcw__content {
  display: grid;
  gap: clamp(24px, 4vw, 36px);
}

.hcw__panel,
.hcw__aside {
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.3);
  border-radius: 28px;
  padding: clamp(24px, 4vw, 40px);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.08);
}

.hcw__steps {
  padding-left: 1.25rem;
  margin: 0 0 2rem;
  display: grid;
  gap: 1.5rem;
}

.hcw__list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  display: grid;
  gap: 0.85rem;
}

.hcw__footer {
  text-align: center;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 24px;
  padding: clamp(24px, 4vw, 36px);
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.06);
}

.hcw__footer p {
  margin-bottom: 0.75rem;
}

.hcw__footer p:last-child {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .hcw {
    padding: clamp(64px, 7vw, 96px) 32px 120px;
  }

  .hcw__cta-group {
    gap: 16px;
  }
}

@media (min-width: 1024px) {
  .hcw__content {
    grid-template-columns: minmax(0, 2.1fr) minmax(0, 1fr);
    align-items: start;
  }

  .hcw__intro {
    max-width: 760px;
  }
}

@media (max-width: 599px) {
  .hcw__cta-group {
    width: 100%;
  }

  .hcw__cta,
  .hcw__cta--outline {
    flex: 1 1 auto;
    text-align: center;
  }
}

/* Prose typography */
.prose {
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #0f172a;
  line-height: 1.65;
  font-size: 1rem;
}

.prose h1,
.prose h2,
.prose h3,
.prose h4,
.prose h5,
.prose h6 {
  font-weight: 700;
  color: #0f172a;
}

.prose h1 {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.15;
}

.prose h2 {
  margin-top: 2.5rem;
  margin-bottom: 1rem;
  font-size: clamp(1.5rem, 2.7vw, 2rem);
  line-height: 1.25;
}

.prose h3 {
  margin-top: 1.75rem;
  margin-bottom: 0.75rem;
  font-size: clamp(1.15rem, 2.1vw, 1.35rem);
  line-height: 1.35;
  font-weight: 600;
}

.prose p {
  margin: 0 0 1.2rem;
}

.prose ul,
.prose ol {
  margin: 0 0 1.4rem;
  padding-left: 1.25rem;
}

.prose li {
  margin-bottom: 0.75rem;
}

.prose li:last-child {
  margin-bottom: 0;
}

.prose a {
  color: var(--brand, #1d4ed8);
  text-decoration: underline;
}

.prose strong {
  font-weight: 600;
}

.prose em {
  font-style: italic;
}

.mini-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
}

.mini-grid .vc-cell {
  font: inherit;
  padding: 0.35rem 0.25rem;
  text-align: center;
  border-radius: 6px;
}

.mini-grid .vc-cell.is-sold {
  opacity: 0.45;
}

.mini-grid .vc-cell.is-res {
  outline: 1px solid var(--brand, #6c5ce7);
}
 
/* Layout helpers */
.grid {
  display: grid;
  gap: var(--grid-gap, .5rem);
}

.grid--cols-5 {
  grid-template-columns: repeat(5, 1fr);
}

.grid--cols-10 {
  grid-template-columns: repeat(10, 1fr);
}

.grid--cols-11 {
  grid-template-columns: repeat(11, 1fr);
}
.grid--cols {
  grid-template-columns: repeat(var(--cols, 5), 1fr);
}

.cols-1 { --cols: 1; }
.cols-2 { --cols: 2; }
.cols-3 { --cols: 3; }
.cols-4 { --cols: 4; }
.cols-5 { --cols: 5; }
.cols-6 { --cols: 6; }
.cols-7 { --cols: 7; }
.cols-8 { --cols: 8; }
.cols-9 { --cols: 9; }
.cols-10 { --cols: 10; }
.cols-11 { --cols: 11; }
.cols-12 { --cols: 12; }
.cols-13 { --cols: 13; }
.cols-14 { --cols: 14; }
.cols-15 { --cols: 15; }
.cols-16 { --cols: 16; }
.cols-17 { --cols: 17; }
.cols-18 { --cols: 18; }
.cols-19 { --cols: 19; }
.cols-20 { --cols: 20; }
.cols-21 { --cols: 21; }
.cols-22 { --cols: 22; }
.cols-23 { --cols: 23; }
.cols-24 { --cols: 24; }
.cols-25 { --cols: 25; }

/* Utility: progress width */
.progress--pct-0 { --progress-pct: 0%; }
.progress--pct-1 { --progress-pct: 1%; }
.progress--pct-2 { --progress-pct: 2%; }
.progress--pct-3 { --progress-pct: 3%; }
.progress--pct-4 { --progress-pct: 4%; }
.progress--pct-5 { --progress-pct: 5%; }
.progress--pct-6 { --progress-pct: 6%; }
.progress--pct-7 { --progress-pct: 7%; }
.progress--pct-8 { --progress-pct: 8%; }
.progress--pct-9 { --progress-pct: 9%; }
.progress--pct-10 { --progress-pct: 10%; }
.progress--pct-11 { --progress-pct: 11%; }
.progress--pct-12 { --progress-pct: 12%; }
.progress--pct-13 { --progress-pct: 13%; }
.progress--pct-14 { --progress-pct: 14%; }
.progress--pct-15 { --progress-pct: 15%; }
.progress--pct-16 { --progress-pct: 16%; }
.progress--pct-17 { --progress-pct: 17%; }
.progress--pct-18 { --progress-pct: 18%; }
.progress--pct-19 { --progress-pct: 19%; }
.progress--pct-20 { --progress-pct: 20%; }
.progress--pct-21 { --progress-pct: 21%; }
.progress--pct-22 { --progress-pct: 22%; }
.progress--pct-23 { --progress-pct: 23%; }
.progress--pct-24 { --progress-pct: 24%; }
.progress--pct-25 { --progress-pct: 25%; }
.progress--pct-26 { --progress-pct: 26%; }
.progress--pct-27 { --progress-pct: 27%; }
.progress--pct-28 { --progress-pct: 28%; }
.progress--pct-29 { --progress-pct: 29%; }
.progress--pct-30 { --progress-pct: 30%; }
.progress--pct-31 { --progress-pct: 31%; }
.progress--pct-32 { --progress-pct: 32%; }
.progress--pct-33 { --progress-pct: 33%; }
.progress--pct-34 { --progress-pct: 34%; }
.progress--pct-35 { --progress-pct: 35%; }
.progress--pct-36 { --progress-pct: 36%; }
.progress--pct-37 { --progress-pct: 37%; }
.progress--pct-38 { --progress-pct: 38%; }
.progress--pct-39 { --progress-pct: 39%; }
.progress--pct-40 { --progress-pct: 40%; }
.progress--pct-41 { --progress-pct: 41%; }
.progress--pct-42 { --progress-pct: 42%; }
.progress--pct-43 { --progress-pct: 43%; }
.progress--pct-44 { --progress-pct: 44%; }
.progress--pct-45 { --progress-pct: 45%; }
.progress--pct-46 { --progress-pct: 46%; }
.progress--pct-47 { --progress-pct: 47%; }
.progress--pct-48 { --progress-pct: 48%; }
.progress--pct-49 { --progress-pct: 49%; }
.progress--pct-50 { --progress-pct: 50%; }
.progress--pct-51 { --progress-pct: 51%; }
.progress--pct-52 { --progress-pct: 52%; }
.progress--pct-53 { --progress-pct: 53%; }
.progress--pct-54 { --progress-pct: 54%; }
.progress--pct-55 { --progress-pct: 55%; }
.progress--pct-56 { --progress-pct: 56%; }
.progress--pct-57 { --progress-pct: 57%; }
.progress--pct-58 { --progress-pct: 58%; }
.progress--pct-59 { --progress-pct: 59%; }
.progress--pct-60 { --progress-pct: 60%; }
.progress--pct-61 { --progress-pct: 61%; }
.progress--pct-62 { --progress-pct: 62%; }
.progress--pct-63 { --progress-pct: 63%; }
.progress--pct-64 { --progress-pct: 64%; }
.progress--pct-65 { --progress-pct: 65%; }
.progress--pct-66 { --progress-pct: 66%; }
.progress--pct-67 { --progress-pct: 67%; }
.progress--pct-68 { --progress-pct: 68%; }
.progress--pct-69 { --progress-pct: 69%; }
.progress--pct-70 { --progress-pct: 70%; }
.progress--pct-71 { --progress-pct: 71%; }
.progress--pct-72 { --progress-pct: 72%; }
.progress--pct-73 { --progress-pct: 73%; }
.progress--pct-74 { --progress-pct: 74%; }
.progress--pct-75 { --progress-pct: 75%; }
.progress--pct-76 { --progress-pct: 76%; }
.progress--pct-77 { --progress-pct: 77%; }
.progress--pct-78 { --progress-pct: 78%; }
.progress--pct-79 { --progress-pct: 79%; }
.progress--pct-80 { --progress-pct: 80%; }
.progress--pct-81 { --progress-pct: 81%; }
.progress--pct-82 { --progress-pct: 82%; }
.progress--pct-83 { --progress-pct: 83%; }
.progress--pct-84 { --progress-pct: 84%; }
.progress--pct-85 { --progress-pct: 85%; }
.progress--pct-86 { --progress-pct: 86%; }
.progress--pct-87 { --progress-pct: 87%; }
.progress--pct-88 { --progress-pct: 88%; }
.progress--pct-89 { --progress-pct: 89%; }
.progress--pct-90 { --progress-pct: 90%; }
.progress--pct-91 { --progress-pct: 91%; }
.progress--pct-92 { --progress-pct: 92%; }
.progress--pct-93 { --progress-pct: 93%; }
.progress--pct-94 { --progress-pct: 94%; }
.progress--pct-95 { --progress-pct: 95%; }
.progress--pct-96 { --progress-pct: 96%; }
.progress--pct-97 { --progress-pct: 97%; }
.progress--pct-98 { --progress-pct: 98%; }
.progress--pct-99 { --progress-pct: 99%; }
.progress--pct-100 { --progress-pct: 100%; }

/* CSP-safe brand var */
.theme-brand { --vtb-header-primary: #6c5ce7; }

/* Laser intensity helpers */
.laser-0 { --laser: 0; }
.laser-1 { --laser: 1; }
.laser-2 { --laser: 2; }

/* Payments toolbar layout */
.payments-toolbar {
  display: flex;
  gap: .5rem;
  align-items: center;
}

/* Card layout */
.vtb-card{display:flex;flex-direction:column;border-radius:20px;background:#0f1725}
.vtb-card__img-wrap{display:block;border-top-left-radius:20px;border-top-right-radius:20px;overflow:hidden}
.vtb-card__img{width:100%;display:block;object-fit:cover}

.vtb-card__body{display:flex;flex-direction:column;gap:12px;padding:18px;flex:1}
.vtb-card__head{display:flex;align-items:flex-start;gap:10px}
.vtb-card__title{flex:1;margin:0;font-weight:800;line-height:1.15;font-size:clamp(18px,2.1vw,24px)}
.vtb-card__title a{color:#fff;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

.vtb-price-pill{white-space:nowrap;padding:8px 12px;border-radius:999px;background:#2a245b;color:#cfd3ff;font-weight:700;border:1px solid rgba(255,255,255,.08)}

.vtb-card__meta{display:flex;align-items:center;gap:10px;color:#a9b2c7;font-weight:600}
.vtb-card__note{margin:0;color:#a9b2c7}
.vtb-card__rule{margin:0;color:#a9b2c7;font-size:14px}

.vtb-notice{padding:.9rem 1rem;border-radius:14px;background:rgba(108,92,231,.08);border:1px solid rgba(108,92,231,.22);margin:1rem 0}
.vtb-notice--info p{margin:.35rem 0}
.vtb-notice .muted{color:#9aa4bd}

.vtb-draw-note{
  margin:.25rem 0 .5rem;
  font-size:.95rem;
  opacity:.85;
}
.vtb-draw-note a{text-decoration:underline}

details.board-info{
  margin:1rem 0 0;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:.75rem;
  padding:.75rem 1rem;
}
details.board-info > summary{
  cursor:pointer;
  font-weight:600;
  list-style:none;
}
details.board-info[open] > summary{margin-bottom:.5rem}
details.board-info .legal{
  opacity:.8;
  margin-top:.5rem;
  font-size:.95rem;
}

.vtb-progress{height:8px;background:#192233;border-radius:999px;overflow:hidden}
.vtb-progress__bar{height:100%;width:var(--progress-pct,0%);background:linear-gradient(90deg,#6c5ce7,#00c2ff)}

.vtb-card__spacer{flex:1}

/* CTA styling (works even if legacy .btn styles are missing) */
.vtb-card__cta .btn,
.vtb-card__cta .vtb-btn{width:100%;display:inline-flex;justify-content:center;align-items:center;
  padding:14px 18px;border-radius:14px;font-weight:800;
  background:linear-gradient(90deg,#6c5ce7,#4ea1ff);color:#fff;border:none;text-decoration:none}
.vtb-card__cta .btn:hover,
.vtb-card__cta .vtb-btn:hover{filter:brightness(1.05)}

/* Mobile nicety: keep CTA visible near bottom on long cards */
@media (max-width:480px){
  .vtb-card__cta{position:sticky;bottom:12px;z-index:2}
}

/* --- Revised hero --- */
.vtb-hero{position:relative;padding:2.25rem 1.25rem 1.5rem;border-radius:22px;background:radial-gradient(1200px 400px at 20% -10%, rgba(108,92,231,.25), transparent), rgba(10,14,28,.6);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.vtb-hero__inner{max-width:980px;margin:0 auto}
.vtb-hero__h1{margin:0 0 .45rem;font-size:2.1rem;line-height:1.1}
.vtb-hero__sub{margin:0 0 1rem;color:#aab3d6}
.vtb-hero__chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:.25rem 0 1.1rem}
.vtb-hero__ctas{display:flex;flex-wrap:wrap;gap:.6rem}
.vtb-hero__cta-primary{min-width:220px}
.vtb-hero__cta-secondary{min-width:200px}

/* Mobile adjustments */
@media (max-width: 640px){
  .vtb-hero{padding:1.6rem 1rem}
  .vtb-hero__h1{font-size:1.8rem}
  .vtb-hero__ctas{flex-direction:column}
  .vtb-hero__cta-primary,.vtb-hero__cta-secondary{width:100%}
}