.vz-wallet {
  --wallet-card-w: min(460px, 34vw);
  --wallet-center: 59%;
  --wallet-cut-angle: -20.72deg;
  position: relative;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--f-display);
  isolation: isolate;
}

.vz-wallet *,
.vz-wallet *::before,
.vz-wallet *::after {
  box-sizing: border-box;
}

.vz-wallet__stage {
  position: relative;
  height: 100vh;
  height: 100svh;
  min-height: 620px;
  overflow: hidden;
}

.vz-wallet__bg {
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(180deg, #000 78%, transparent);
  mask-image: linear-gradient(180deg, #000 78%, transparent);
  background:
    radial-gradient(34% 40% at 50% var(--wallet-center), rgba(77, 141, 255, 0.16), rgba(77, 141, 255, 0) 70%),
    radial-gradient(70% 60% at 50% 100%, rgba(61, 90, 128, 0.18), rgba(61, 90, 128, 0) 70%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-1) 55%, var(--bg) 100%);
  pointer-events: none;
}

.vz-wallet__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 96px 96px;
  background-position: center center;
  opacity: 0.28;
  -webkit-mask-image: radial-gradient(50% 55% at 50% var(--wallet-center), #000 0%, transparent 80%);
  mask-image: radial-gradient(50% 55% at 50% var(--wallet-center), #000 0%, transparent 80%);
}

.vz-wallet__flash {
  position: absolute;
  inset: 0;
  z-index: 4;
  background:
    radial-gradient(38% 34% at 50% var(--wallet-center), rgba(238, 244, 250, 0.3), rgba(77, 141, 255, 0.26) 45%, rgba(77, 141, 255, 0) 75%);
  mix-blend-mode: screen;
  opacity: 0;
  pointer-events: none;
}

.vz-wallet__shake {
  position: absolute;
  inset: 0;
  z-index: 2;
}

.vz-wallet__head {
  position: absolute;
  top: clamp(64px, 10.5vh, 120px);
  left: var(--gutter);
  right: var(--gutter);
  text-align: center;
  z-index: 3;
}

.vz-wallet__title {
  margin: 0;
  font-size: clamp(44px, 7.2vw, 124px);
  font-weight: 700;
  letter-spacing: -0.055em;
  line-height: 0.9;
  color: var(--ink);
}

.vz-wallet__line {
  display: inline-block;
  overflow: clip;
  padding: 0.04em 0.08em 0.12em;
  margin: 0 -0.04em;
  vertical-align: top;
}

.vz-wallet__word {
  display: inline-block;
  will-change: transform;
}

.vz-wallet__word--serif {
  font-family: var(--f-serif);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.02em;
  padding-right: 0.06em;
  color: var(--ice);
}

.vz-wallet__scene {
  position: absolute;
  left: 50%;
  top: var(--wallet-center);
  width: var(--wallet-card-w);
  aspect-ratio: 1.586;
  transform: translate(-50%, -50%);
  perspective: 1500px;
  z-index: 2;
  display: none;
  pointer-events: none;
}

.vz-wallet.is-live .vz-wallet__scene,
.vz-wallet.is-static .vz-wallet__scene {
  display: block;
}

.vz-wallet__shadow {
  position: absolute;
  left: 4%;
  right: 4%;
  top: 92%;
  height: 34%;
  background:
    radial-gradient(closest-side, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0)),
    radial-gradient(closest-side, var(--glow-a), rgba(77, 141, 255, 0));
  pointer-events: none;
}

.vz-wallet__lift,
.vz-wallet__rig {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
}

.vz-wallet__rig {
  font-size: calc(var(--wallet-card-w) / 100);
  will-change: transform;
}

.vz-wallet__card,
.vz-wallet__half {
  position: absolute;
  inset: 0;
  border-radius: 4.4em;
}

.vz-wallet__half {
  visibility: hidden;
  will-change: transform, opacity;
}

.vz-wallet__half--a {
  -webkit-clip-path: polygon(-1% -1%, 101% -1%, 101% 17.8%, -1% 78.2%);
  clip-path: polygon(-1% -1%, 101% -1%, 101% 17.8%, -1% 78.2%);
  transform-origin: 40% 32%;
}

.vz-wallet__half--b {
  -webkit-clip-path: polygon(-1% 77.8%, 101% 17.4%, 101% 101%, -1% 101%);
  clip-path: polygon(-1% 77.8%, 101% 17.4%, 101% 101%, -1% 101%);
  transform-origin: 60% 70%;
}

.vz-wallet__face {
  position: absolute;
  inset: 0;
  border-radius: 4.4em;
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(168, 212, 240, 0.12), rgba(168, 212, 240, 0) 55%),
    radial-gradient(90% 80% at 100% 100%, rgba(77, 141, 255, 0.10), rgba(77, 141, 255, 0) 60%),
    linear-gradient(152deg, #2a2e35 0%, #15171b 34%, #08090b 60%, #1c1f25 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.22),
    inset 0 -1px 0 rgba(0, 0, 0, 0.7),
    0 3em 9em rgba(0, 0, 0, 0.55);
}

.vz-wallet__brush {
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.035) 0 1px, rgba(0, 0, 0, 0.07) 1px 2px, rgba(255, 255, 255, 0) 2px 3px),
    repeating-linear-gradient(90.6deg, rgba(255, 255, 255, 0.02) 0 1px, rgba(255, 255, 255, 0) 1px 5px);
  mix-blend-mode: overlay;
  opacity: 0.9;
}

.vz-wallet__holo {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 17em;
  width: 7.5em;
  overflow: hidden;
  opacity: 0.62;
  mix-blend-mode: screen;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
}

.vz-wallet__holo-film {
  position: absolute;
  top: -80%;
  bottom: -80%;
  left: -300%;
  right: -300%;
  background:
    repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.35) 0 1px, rgba(0, 0, 0, 0) 1px 3px),
    linear-gradient(105deg, var(--blue) 0%, var(--ice) 16%, var(--ink) 30%, var(--navy) 46%, var(--ice-2) 62%, var(--ink) 78%, var(--blue) 100%);
  will-change: transform;
}

.vz-wallet__brand {
  position: absolute;
  left: 7em;
  top: 6.8em;
  display: flex;
  flex-direction: column;
  gap: 0.6em;
}

.vz-wallet__brand-top {
  font-family: var(--f-mono);
  font-size: 2.3em;
  font-weight: 500;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: #8f98a3;
}

.vz-wallet__brand-tier {
  font-family: var(--f-serif);
  font-style: italic;
  font-size: 6.2em;
  line-height: 0.8;
  letter-spacing: -0.01em;
  background: linear-gradient(180deg, #f4f6f8 0%, #aab2bc 55%, #6d7580 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.vz-wallet__wave {
  position: absolute;
  right: 7em;
  top: 7em;
  width: 5.6em;
  height: 5.6em;
  color: rgba(230, 236, 242, 0.5);
}

.vz-wallet__chip {
  position: absolute;
  left: 7em;
  top: 34%;
  width: 12.6em;
  height: 9.6em;
  border-radius: 1.8em;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 38%),
    linear-gradient(150deg, #e4eaf0 0%, #9ea9b5 34%, #d3dbe3 58%, #7d8894 100%);
  box-shadow:
    inset 0 0 0 1px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 0.4em 1em rgba(0, 0, 0, 0.5);
  overflow: hidden;
}

.vz-wallet__chip-grid {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent calc(33% - 0.5px), rgba(30, 40, 52, 0.55) calc(33% - 0.5px) calc(33% + 0.5px), transparent calc(33% + 0.5px) calc(67% - 0.5px), rgba(30, 40, 52, 0.55) calc(67% - 0.5px) calc(67% + 0.5px), transparent calc(67% + 0.5px)),
    linear-gradient(0deg, transparent calc(50% - 0.5px), rgba(30, 40, 52, 0.55) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px));
}

.vz-wallet__chip-grid::after {
  content: "";
  position: absolute;
  left: 33%;
  right: 33%;
  top: 26%;
  bottom: 26%;
  border: 1px solid rgba(30, 40, 52, 0.55);
  border-radius: 0.8em;
  background: linear-gradient(150deg, #dfe6ed, #9aa5b1);
}

.vz-wallet__number {
  position: absolute;
  top: 59%;
  display: flex;
  justify-content: space-between;
  font-family: var(--f-mono);
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #d9dee5;
  text-shadow:
    -1px -1px 0 rgba(255, 255, 255, 0.35),
    1px 1px 0 rgba(0, 0, 0, 0.9),
    0 0.12em 0.3em rgba(0, 0, 0, 0.6);
  font-size: 5.9em;
  left: calc(7em / 5.9);
  right: calc(7em / 5.9);
}

.vz-wallet__meta {
  position: absolute;
  bottom: 7em;
  display: flex;
  flex-direction: column;
  gap: 0.9em;
}

.vz-wallet__meta--holder {
  left: 7em;
}

.vz-wallet__meta--renew {
  left: 45em;
}

.vz-wallet__meta-key {
  font-family: var(--f-mono);
  font-size: 1.9em;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: #6c7580;
}

.vz-wallet__meta-val {
  font-size: 3.4em;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #cfd5dc;
  text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.2), 1px 1px 0 rgba(0, 0, 0, 0.85);
}

.vz-wallet__network {
  position: absolute;
  right: 7em;
  bottom: 6.6em;
  display: flex;
}

.vz-wallet__network i {
  display: block;
  width: 7.6em;
  height: 7.6em;
  border-radius: 28%;
  transform: rotate(45deg) scale(0.72);
  background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.1));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
}

.vz-wallet__network i + i {
  margin-left: -2.6em;
  background: radial-gradient(circle at 35% 30%, rgba(168, 212, 240, 0.3), rgba(61, 90, 128, 0.18));
}

.vz-wallet__spec {
  position: absolute;
  top: -40%;
  bottom: -40%;
  left: -60%;
  width: 220%;
  background:
    radial-gradient(22% 40% at 50% 50%, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0) 70%),
    linear-gradient(112deg, rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, 0.07) 45%, rgba(255, 255, 255, 0.2) 49.5%, rgba(255, 255, 255, 0.06) 54%, rgba(255, 255, 255, 0) 62%);
  mix-blend-mode: screen;
  pointer-events: none;
  will-change: transform;
}

.vz-wallet__slash,
.vz-wallet__edge {
  position: absolute;
  left: -45%;
  width: 190%;
  top: 48%;
  height: 0;
  transform: rotate(var(--wallet-cut-angle));
  pointer-events: none;
}

.vz-wallet__slash {
  transform: translateZ(3px) rotate(var(--wallet-cut-angle));
}

.vz-wallet__slash-line {
  position: absolute;
  left: 0;
  right: 0;
  top: -2px;
  height: 4px;
  border-radius: 4px;
  transform-origin: 0 50%;
  transform: scaleX(0);
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(216, 236, 250, 0.9) 10%, #fff 30%, #fff 92%, rgba(255, 255, 255, 0) 100%);
  box-shadow:
    0 0 4px 1px rgba(255, 255, 255, 0.95),
    0 0 16px 3px rgba(77, 141, 255, 0.95),
    0 0 48px 10px rgba(77, 141, 255, 0.5);
  will-change: transform, opacity;
}

.vz-wallet__slash-line::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 11em;
  transform: translateY(-50%);
  background: linear-gradient(90deg, rgba(77, 141, 255, 0) 0%, var(--glow-a) 50%, rgba(77, 141, 255, 0) 100%);
  -webkit-mask-image: radial-gradient(50% 50% at 50% 50%, #000 0%, transparent 100%);
  mask-image: radial-gradient(50% 50% at 50% 50%, #000 0%, transparent 100%);
}

.vz-wallet__score {
  position: absolute;
  inset: 0;
  border-radius: 4.4em;
  overflow: hidden;
  pointer-events: none;
}

.vz-wallet__score-track {
  position: absolute;
  left: -10%;
  width: 120%;
  top: 48%;
  height: 0;
  transform: rotate(var(--wallet-cut-angle));
}

.vz-wallet__score-trail {
  position: absolute;
  left: 0;
  right: 0;
  top: -1px;
  height: 2px;
  background: repeating-linear-gradient(90deg, rgba(216, 236, 250, 0.9) 0 0.9em, rgba(216, 236, 250, 0) 0.9em 1.6em);
  filter: drop-shadow(0 0 3px rgba(77, 141, 255, 0.9));
  -webkit-clip-path: inset(0 100% 0 0);
  clip-path: inset(0 100% 0 0);
  opacity: 0.4;
}

.vz-wallet__score-head {
  position: absolute;
  left: 0;
  top: 0;
  width: 2.6em;
  height: 2.6em;
  margin: -1.3em 0 0 -1.3em;
  border-radius: 50%;
  background: radial-gradient(circle, #fff 0 22%, rgba(168, 212, 240, 0.85) 34%, rgba(77, 141, 255, 0) 70%);
  box-shadow: 0 0 1.6em 0.5em rgba(77, 141, 255, 0.55);
  opacity: 0;
}

.vz-wallet__edge {
  left: -10%;
  width: 120%;
  opacity: 1;
}

.vz-wallet__edge::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -1.5px;
  height: 3px;
  background: linear-gradient(90deg, var(--ice), var(--ink) 50%, var(--ice));
  box-shadow: 0 0 8px 2px rgba(120, 170, 255, 0.95), 0 0 24px 6px rgba(77, 141, 255, 0.55);
}

.vz-wallet__sparks {
  position: absolute;
  inset: 0;
  transform: translateZ(4px);
  pointer-events: none;
}

.vz-wallet__spark {
  position: absolute;
  width: 0;
  height: 0;
}

.vz-wallet__spark b {
  position: absolute;
  left: 0;
  top: -1px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(77, 141, 255, 0) 0%, var(--ice) 40%, #fff 100%);
  box-shadow: 0 0 6px rgba(120, 170, 255, 0.95);
  transform-origin: 100% 50%;
  opacity: 0;
  will-change: transform, opacity;
}

.vz-wallet__offer {
  position: absolute;
  left: 50%;
  top: var(--wallet-center);
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: clamp(32px, 4.4vw, 72px);
  width: max-content;
  max-width: calc(100vw - 2 * var(--gutter));
  z-index: 1;
}

.vz-wallet__zero {
  position: relative;
  margin: 0;
  display: flex;
  align-items: flex-start;
  font-size: clamp(180px, 36vh, 380px);
  font-weight: 700;
  letter-spacing: -0.07em;
  line-height: 0.78;
  will-change: transform, opacity;
}

.vz-wallet__zero-cur {
  font-family: var(--f-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 0.34em;
  line-height: 1;
  letter-spacing: 0;
  margin: 0.02em 0.06em 0 0;
  color: var(--ice);
}

.vz-wallet__zero-num {
  display: block;
  padding-right: 0.04em;
  background: linear-gradient(180deg, #ffffff 0%, #d9ecfa 38%, var(--ice) 62%, #4f7899 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 48px rgba(77, 141, 255, 0.35));
}

.vz-wallet__terms {
  position: relative;
  padding-left: clamp(32px, 4.4vw, 72px);
}

.vz-wallet__divider {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(180deg, rgba(168, 212, 240, 0), var(--line-strong) 20%, var(--line-strong) 80%, rgba(168, 212, 240, 0));
  transform-origin: 50% 50%;
}

.vz-wallet__nos {
  list-style: none;
  margin: 0;
  padding: 0;
}

.vz-wallet__nos li,
.vz-wallet__free {
  display: block;
  overflow: clip;
  padding-bottom: 0.08em;
}

.vz-wallet__no {
  display: block;
  font-size: clamp(34px, 3.6vw, 60px);
  font-weight: 700;
  letter-spacing: -0.05em;
  line-height: 1;
  color: var(--ink);
  will-change: transform;
}

.vz-wallet__free {
  margin: clamp(18px, 2.6vh, 28px) 0 0;
  font-size: clamp(17px, 1.35vw, 21px);
  line-height: 1.35;
  color: var(--ink-2);
}

.vz-wallet__free span {
  display: block;
}

.vz-wallet__free em {
  font-family: var(--f-serif);
  font-style: italic;
  font-size: 1.28em;
  letter-spacing: -0.01em;
  color: var(--ice);
}

@media (max-width: 820px) {
  .vz-wallet {
    --wallet-card-w: min(88vw, 540px);
    --wallet-center: 53%;
  }

  .vz-wallet__head {
    top: clamp(56px, 9vh, 84px);
  }

  .vz-wallet__title {
    font-size: clamp(38px, 12.6vw, 64px);
  }

  .vz-wallet__word--serif {
    font-size: 1.22em;
  }

  .vz-wallet__line {
    display: block;
  }

  .vz-wallet__offer {
    top: 60%;
    flex-direction: column;
    gap: 22px;
    width: calc(100vw - 2 * var(--gutter));
    text-align: center;
  }

  .vz-wallet__zero {
    font-size: min(42vw, 26vh);
  }

  .vz-wallet__terms {
    padding: 22px 0 0;
    width: 100%;
  }

  .vz-wallet__divider {
    top: 0;
    bottom: auto;
    left: 0;
    right: 0;
    width: auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(168, 212, 240, 0), var(--line-strong) 20%, var(--line-strong) 80%, rgba(168, 212, 240, 0));
  }

  .vz-wallet__no {
    font-size: clamp(32px, 9.6vw, 44px);
  }

  .vz-wallet__free {
    font-size: 16px;
  }
}

@media (max-width: 820px) and (max-height: 720px) {
  .vz-wallet__head {
    top: 48px;
  }

  .vz-wallet__zero {
    font-size: min(42vw, 17vh);
  }

  .vz-wallet__offer {
    top: 64%;
    gap: 14px;
  }

  .vz-wallet__no {
    font-size: clamp(28px, 8.4vw, 36px);
  }

  .vz-wallet__terms {
    padding-top: 16px;
  }

  .vz-wallet__cta {
    margin-top: 18px;
  }
}

.vz-wallet.is-static .vz-wallet__scene {
  z-index: 0;
}

.vz-wallet__cta {
  margin-top: 26px;
}