/* Цзы Вэй: цветной лендинг в один шаг */
:root {
  --zw-ink: #1a1228;
  --zw-muted: #6b5a80;
  --zw-paper: #faf7ff;
  --zw-life: #7c3aed;
  --zw-career: #c026d3;
  --zw-wealth: #d97706;
  --zw-bond: #db2777;
}

body.zw-landing {
  background:
    radial-gradient(42% 36% at 0% 0%, rgba(124, 58, 237, 0.18), transparent 58%),
    radial-gradient(38% 32% at 100% 0%, rgba(192, 38, 211, 0.14), transparent 55%),
    radial-gradient(46% 34% at 80% 100%, rgba(217, 119, 6, 0.16), transparent 52%),
    #f4eefb;
}

.zw-landing .mv-hero--mini {
  background:
    radial-gradient(70% 80% at 8% 0%, rgba(124, 58, 237, 0.55), transparent 48%),
    radial-gradient(55% 70% at 92% 8%, rgba(192, 38, 211, 0.38), transparent 46%),
    radial-gradient(50% 50% at 50% 110%, rgba(217, 119, 6, 0.32), transparent 50%),
    linear-gradient(145deg, #14081f 0%, #3b1466 42%, #1a0a2e 100%);
  border-radius: 28px;
  overflow: hidden;
}

.zw-landing .mv-hero--mini .mv-hero-inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
}

.zw-landing .mv-mini-steps,
.zw-landing .mv-service-hook,
.zw-landing .mv-accuracy-disclaimer,
.zw-landing .mv-funnel-steps,
.zw-landing .mv-free-guide-banner,
.zw-landing .mv-demo,
.zw-landing .mv-demo-ziwei,
.zw-landing .mv-ziwei {
  display: none;
}

.zw-art--hero {
  margin: 0;
  padding: 16px 16px 18px;
  border-radius: 22px;
  background: var(--zw-paper);
  color: var(--zw-ink);
  border: 1px solid rgba(124, 58, 237, 0.16);
}

.zw-art__kicker {
  margin: 0 0 4px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7c3aed;
}

.zw-art__lead,
.zw-art__note {
  margin: 0 0 14px;
  font-size: 0.92rem;
  line-height: 1.45;
  color: var(--zw-muted);
}

.zw-art__lead { color: var(--zw-ink); }

.zw-plate {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: center;
  margin: 0 0 14px;
  padding: 16px 18px;
  border-radius: 22px;
  background:
    radial-gradient(80% 120% at 0% 0%, rgba(250, 204, 21, 0.28), transparent 55%),
    linear-gradient(135deg, #4c1d95, #6d28d9 55%, #9d174d);
  color: #fff;
}

.zw-sun {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.7rem;
  font-weight: 800;
  background: radial-gradient(circle at 35% 30%, #fde68a, #f59e0b 55%, #7c3aed);
  color: #3b0764;
  box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.16);
}

.zw-plate__kicker {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.78;
}

.zw-plate__num {
  margin: 2px 0 0;
  font-size: 1.55rem;
  font-weight: 800;
  line-height: 1.15;
}

.zw-plate__name {
  margin: 4px 0 0;
  font-weight: 700;
}

.zw-plate__hint {
  margin: 6px 0 0;
  font-size: 0.86rem;
  line-height: 1.4;
  opacity: 0.88;
}

.zw-palaces {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0 0 14px;
}

@media (min-width: 720px) {
  .zw-palaces { grid-template-columns: 1fr 1fr 1fr 1fr; }
}

.zw-palace {
  padding: 12px 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(124, 58, 237, 0.12);
}

.zw-palace__side {
  margin: 0 0 2px;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.zw-palace h3 {
  margin: 0 0 4px;
  font-size: 1rem;
}

.zw-palace p {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.4;
  color: var(--zw-muted);
}

.zw-palace.is-life { border-color: rgba(124, 58, 237, 0.35); }
.zw-palace.is-life .zw-palace__side { color: var(--zw-life); }
.zw-palace.is-career { border-color: rgba(192, 38, 211, 0.35); }
.zw-palace.is-career .zw-palace__side { color: var(--zw-career); }
.zw-palace.is-wealth { border-color: rgba(217, 119, 6, 0.4); }
.zw-palace.is-wealth .zw-palace__side { color: var(--zw-wealth); }
.zw-palace.is-bond { border-color: rgba(219, 39, 119, 0.35); }
.zw-palace.is-bond .zw-palace__side { color: var(--zw-bond); }

.zw-keys {
  display: grid;
  gap: 10px;
  margin: 0 0 14px;
}

@media (min-width: 720px) {
  .zw-keys { grid-template-columns: 1fr 1fr 1fr; }
}

.zw-keys article {
  padding: 12px 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(124, 58, 237, 0.12);
}

.zw-keys b { display: block; margin-bottom: 4px; }
.zw-keys p { margin: 0; color: var(--zw-muted); font-size: 0.86rem; line-height: 1.4; }

.zw-art__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 4px 0 10px;
}

.zw-art__pm {
  display: grid;
  gap: 10px;
  margin: 0 0 16px;
}

@media (min-width: 720px) {
  .zw-art__pm { grid-template-columns: 1fr 1fr; }
}

.zw-art__pm article {
  padding: 14px 16px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(124, 58, 237, 0.14);
}

.zw-art__pm article.is-plus {
  background: #ecfdf3;
  border-color: #bbf7d0;
}

.zw-art__pm b { display: block; margin-bottom: 4px; }
.zw-art__pm p { margin: 0; color: var(--zw-muted); font-size: 0.9rem; line-height: 1.45; }

.zw-read {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

@media (min-width: 720px) {
  .zw-read { grid-template-columns: 1fr 1fr; }
}

.zw-read li {
  display: flex;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(124, 58, 237, 0.14);
}

.zw-read span {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border-radius: 99px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 0.82rem;
  color: #fff;
}

.zw-read li.is-life span { background: var(--zw-life); }
.zw-read li.is-star span { background: var(--zw-career); }
.zw-read li.is-cycle span { background: var(--zw-wealth); }
.zw-read li.is-ring span { background: #0f766e; }

.zw-read b { display: block; margin-bottom: 4px; }
.zw-read p { margin: 0; color: var(--zw-muted); font-size: 0.88rem; line-height: 1.45; }

.zw-station-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 8px 0 0;
}

.zw-primer {
  margin: 8px 0 28px;
  padding: 18px 16px 16px;
  border-radius: 22px;
  background: var(--zw-paper);
  border: 1px solid rgba(124, 58, 237, 0.16);
}

.zw-primer h2 {
  margin: 0 0 8px;
  font-size: 1.2rem;
  color: var(--zw-ink);
}

.zw-primer__lead {
  margin: 0 0 14px;
  font-size: 0.94rem;
  line-height: 1.5;
  color: var(--zw-ink);
}

.zw-cycle {
  position: relative;
  width: min(340px, 92vw);
  aspect-ratio: 1;
  margin: 18px auto 10px;
}

.zw-cycle__core {
  position: absolute;
  inset: 32%;
  border-radius: 50%;
  display: grid;
  place-content: center;
  text-align: center;
  background: linear-gradient(145deg, #4c1d95, #7c3aed);
  color: #fff;
  box-shadow: 0 10px 24px rgba(76, 29, 149, 0.28);
}

.zw-cycle__core b { font-size: 1rem; }
.zw-cycle__core span {
  display: block;
  margin-top: 2px;
  font-size: 0.72rem;
  opacity: 0.86;
  padding: 0 8px;
  line-height: 1.3;
}

.zw-cycle__item {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 74px;
  margin: -12px 0 0 -37px;
  text-align: center;
  font-size: 0.72rem;
  font-weight: 800;
  color: #4c1d95;
  transform: rotate(calc(var(--i) * 30deg)) translateY(-142px) rotate(calc(var(--i) * -30deg));
}

.zw-cycle__hint {
  margin: 0 auto;
  max-width: 52ch;
  text-align: center;
  font-size: 0.86rem;
  line-height: 1.45;
  color: var(--zw-muted);
}

@media (max-width: 560px) {
  .zw-cycle {
    aspect-ratio: auto;
    height: auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
  }
  .zw-cycle__core {
    position: static;
    grid-column: 1 / -1;
    inset: auto;
    min-height: 72px;
    border-radius: 16px;
    margin-bottom: 4px;
  }
  .zw-cycle__item {
    position: static;
    width: auto;
    margin: 0;
    padding: 8px 6px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid rgba(124, 58, 237, 0.14);
    transform: none;
  }
}
