/* „Нивата" (§10, екран 4): трите нива разгърнато, механиката на
   приспадането и информативният банер за годишната програма. Стъпва на
   tiers-бутонните класове и ab-* решетката; собствените стилове са lv-*. */

.lv-hero {
  position: relative;
  padding: 4.5rem 0 3rem;
}

.lv-hero-glow {
  position: absolute;
  inset-inline: 0;
  top: -12rem;
  height: 22rem;
  background: radial-gradient(42rem 16rem at 50% 0%,
    color-mix(in srgb, var(--color-gold) 14%, transparent), transparent 70%);
  pointer-events: none;
}

.lv-title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.125rem, 4.2vw, 3.25rem);
  color: var(--color-white);
  margin: 1.25rem 0 1rem;
  max-width: 46rem;
  text-wrap: balance;
}

.lv-lead {
  color: color-mix(in srgb, var(--color-white) 70%, transparent);
  max-width: 40rem;
  line-height: 1.7;
}

.lv-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  align-items: stretch;
}

.lv-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.75rem 1.625rem;
  border: 1px solid color-mix(in srgb, var(--color-white) 12%, transparent);
  border-radius: var(--radius-panel);
  background: color-mix(in srgb, var(--surface-panel) 55%, transparent);
}

.lv-card-primary {
  border-color: color-mix(in srgb, var(--color-gold) 55%, transparent);
  background:
    radial-gradient(24rem 14rem at 50% -4rem,
      color-mix(in srgb, var(--color-gold) 12%, transparent), transparent 70%),
    color-mix(in srgb, var(--surface-panel) 65%, transparent);
}

.lv-badge {
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-gold);
}

.lv-card-head h2 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.625rem;
  color: var(--color-white);
  margin: 0.375rem 0 0.75rem;
}

.lv-price {
  display: flex;
  align-items: baseline;
  gap: 0.625rem;
}

.lv-price b {
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 400;
  color: var(--color-white);
  white-space: nowrap;
}

.lv-price span {
  font-size: 0.875rem;
  color: color-mix(in srgb, var(--color-white) 55%, transparent);
}

.lv-desc {
  color: color-mix(in srgb, var(--color-white) 72%, transparent);
  line-height: 1.65;
}

.lv-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  flex: 1;  /* бутоните застават на едно дъно */
}

.lv-list li {
  position: relative;
  padding-left: 1.375rem;
  font-size: 0.9375rem;
  color: color-mix(in srgb, var(--color-white) 80%, transparent);
  line-height: 1.55;
}

.lv-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--color-gold) 75%, transparent);
}

.lv-cta {
  align-self: stretch;
  text-align: center;
}

/* --- механиката на приспадането --------------------------------------- */
.lv-mechanic {
  margin-top: 3.5rem;
}

.lv-mechanic-inner {
  display: flex;
  align-items: center;
  gap: 1.75rem;
  padding: 1.75rem 2rem;
  border: 1px solid color-mix(in srgb, var(--color-gold) 40%, transparent);
  border-radius: var(--radius-panel);
  background: color-mix(in srgb, var(--color-gold) 7%, transparent);
}

.lv-mechanic-icon {
  font-family: var(--font-display);
  font-size: 1.75rem;
  color: var(--color-gold);
  white-space: nowrap;
}

.lv-mechanic h2 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.375rem;
  color: var(--color-white);
  margin: 0 0 0.375rem;
}

.lv-mechanic p {
  color: color-mix(in srgb, var(--color-white) 75%, transparent);
  margin: 0;
}

/* --- годишната програма (информативен банер, без бутон — §10) ---------- */
.lv-annual {
  margin-top: 3.5rem;
}

.lv-annual-inner {
  text-align: center;
  padding: 3rem 2rem;
  border-block: 1px solid color-mix(in srgb, var(--color-white) 10%, transparent);
}

.lv-annual .ab-eyebrow {
  justify-content: center;
}

.lv-annual h2 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.75rem;
  color: var(--color-white);
  margin: 1rem 0 0.75rem;
}

.lv-annual p {
  max-width: 44rem;
  margin: 0 auto;
  color: color-mix(in srgb, var(--color-white) 68%, transparent);
  line-height: 1.7;
}

.lv-disclaimer {
  display: block;
  margin-top: 2.25rem;
  font-size: 0.8125rem;
  color: color-mix(in srgb, var(--color-white) 45%, transparent);
}

@media (max-width: 980px) {
  .lv-grid { grid-template-columns: 1fr; }
  .lv-mechanic-inner { flex-direction: column; text-align: center; gap: 0.75rem; }
}

/* --- „Вътре в Growth Report": витрината с мострите ---------------------- */
.lv-inside { margin-top: 4.5rem; }

.lv-inside-head h2,
.lv-compare h2,
.lv-process h2 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.75rem, 3vw, 2.375rem);
  color: var(--color-white);
  margin: 1rem 0 0.75rem;
  text-wrap: balance;
}

.lv-inside-lead {
  color: color-mix(in srgb, var(--color-white) 65%, transparent);
  max-width: 40rem;
  margin-bottom: 2.5rem;
}

.lv-show { display: flex; flex-direction: column; gap: 1.25rem; }

.lv-show-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 2rem;
  align-items: center;
  padding: 1.5rem 1.75rem;
  border: 1px solid color-mix(in srgb, var(--color-white) 10%, transparent);
  border-radius: var(--radius-panel);
  background: color-mix(in srgb, var(--surface-panel) 45%, transparent);
}

.lv-show-row:nth-child(even) { grid-template-columns: 1fr 1.4fr; }
.lv-show-row:nth-child(even) .lv-show-text { order: 2; }

.lv-show-text h3 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.375rem;
  color: var(--color-white);
  margin: 0 0 0.5rem;
}

.lv-show-text p {
  color: color-mix(in srgb, var(--color-white) 72%, transparent);
  line-height: 1.65;
  margin: 0;
}

/* мострите: умалени ехо-компоненти на реалния доклад */
.lv-mock {
  border: 1px solid color-mix(in srgb, var(--color-gold) 25%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--color-ink) 70%, transparent);
  padding: 1.125rem 1.25rem;
  min-height: 8rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.625rem;
}

.lv-mock-gauge { align-items: center; text-align: center; gap: 0.125rem; }
.lv-mock-gauge svg { width: 9.5rem; }
.lvg-track, .lvg-pot, .lvg-fill { fill: none; stroke-width: 10; stroke-linecap: round; }
.lvg-track { stroke: color-mix(in srgb, var(--color-white) 10%, transparent); }
.lvg-pot { stroke: color-mix(in srgb, var(--color-gold) 30%, transparent); stroke-dasharray: 57 100; }
.lvg-fill { stroke: var(--color-gold); stroke-dasharray: 51 100; }
.lvg-num { font-family: var(--font-display); font-size: 1.75rem; color: var(--color-white); margin: -1.5rem 0 0; }
.lvg-cap { font-size: 0.8125rem; color: color-mix(in srgb, var(--color-white) 55%, transparent); margin: 0; }

.lv-mock-bars div {
  display: grid;
  grid-template-columns: 9.5rem 1fr 2.5rem;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.8125rem;
  color: color-mix(in srgb, var(--color-white) 70%, transparent);
}
.lv-mock-bars i {
  display: block; height: 6px; border-radius: 999px;
  background: color-mix(in srgb, var(--color-white) 10%, transparent);
  position: relative; overflow: hidden;
}
.lv-mock-bars i::after {
  content: ""; position: absolute; inset: 0; width: var(--w, 50%);
  background: var(--color-gold); border-radius: inherit;
}
.lv-mock-bars b { font-weight: 500; color: var(--color-white); text-align: right; font-variant-numeric: tabular-nums; }

.lv-mock-tension p {
  display: flex; align-items: baseline; gap: 0.75rem; margin: 0;
  font-family: var(--font-display); font-size: 1.0625rem; color: var(--color-white);
}
.lv-mock-tension b { color: var(--color-gold); font-size: 0.875rem; letter-spacing: 0.1em; }

.lv-mock-risk div { display: flex; align-items: center; gap: 0.625rem; font-size: 0.9375rem; color: color-mix(in srgb, var(--color-white) 78%, transparent); }
.lv-mock-risk i { width: 0.5rem; height: 0.5rem; border-radius: 50%; flex-shrink: 0; }
.lvr-high { background: #d4644f; }
.lvr-mid { background: var(--color-gold); }

.lv-mock-horizons { flex-direction: row; gap: 1rem; }
.lv-mock-horizons > div { flex: 1; display: flex; flex-direction: column; gap: 0.5rem; }
.lv-mock-horizons b { font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-gold); font-weight: 500; }
.lv-mock-horizons span { display: block; height: 5px; border-radius: 999px; background: color-mix(in srgb, var(--color-white) 14%, transparent); }

.lv-inside-more {
  margin: 2rem 0 0;
  max-width: 46rem;
  color: color-mix(in srgb, var(--color-white) 60%, transparent);
  font-size: 0.9375rem;
  line-height: 1.7;
}
.lv-inside-more a { color: var(--color-gold-light); }

.lv-proof {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.75rem 2rem;
  border: 1px solid color-mix(in srgb, var(--color-gold) 45%, transparent);
  border-radius: var(--radius-panel);
  background: color-mix(in srgb, var(--color-gold) 8%, transparent);
}
.lv-proof h3 { font-family: var(--font-display); font-weight: 400; font-size: 1.375rem; color: var(--color-white); margin: 0 0 0.375rem; }
.lv-proof p { color: color-mix(in srgb, var(--color-white) 72%, transparent); margin: 0; max-width: 34rem; }
.lv-proof .tier-cta { flex-shrink: 0; }

/* --- сравнителната матрица --------------------------------------------- */
.lv-compare { margin-top: 4.5rem; }
.lv-table-wrap { overflow-x: auto; margin-top: 1.5rem; border: 1px solid color-mix(in srgb, var(--color-white) 12%, transparent); border-radius: var(--radius-panel); }
.lv-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; min-width: 38rem; }
.lv-table th {
  text-align: left; padding: 0.875rem 1.25rem; font-weight: 500;
  color: var(--color-gold); border-bottom: 1px solid color-mix(in srgb, var(--color-white) 14%, transparent);
  background: color-mix(in srgb, var(--surface-panel) 70%, transparent);
}
.lv-table th + th, .lv-table td + td { text-align: center; }
.lv-table td {
  padding: 0.75rem 1.25rem; color: color-mix(in srgb, var(--color-white) 78%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--color-white) 7%, transparent);
}
.lv-table tr:last-child td { border-bottom: 0; }
.lv-table td:nth-child(3) { background: color-mix(in srgb, var(--color-gold) 6%, transparent); }
.lv-table td + td { color: var(--color-gold); }
.lv-q { font-family: var(--font-display); font-style: italic; color: var(--color-white) !important; font-size: 0.875rem; }

/* --- процесът ----------------------------------------------------------- */
.lv-process { margin-top: 4.5rem; }
.lv-steps {
  list-style: none; counter-reset: lvstep;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem;
  margin: 1.75rem 0 0; padding: 0;
}
.lv-steps li {
  counter-increment: lvstep; position: relative;
  padding: 2.5rem 1.25rem 1.25rem;
  border: 1px solid color-mix(in srgb, var(--color-white) 10%, transparent);
  border-radius: var(--radius-panel);
  background: color-mix(in srgb, var(--surface-panel) 45%, transparent);
}
.lv-steps li::before {
  content: "0" counter(lvstep);
  position: absolute; top: 1rem; left: 1.25rem;
  font-size: 0.8125rem; letter-spacing: 0.14em; color: var(--color-gold);
}
.lv-steps b { display: block; color: var(--color-white); font-weight: 500; margin-bottom: 0.375rem; }
.lv-steps span { font-size: 0.875rem; color: color-mix(in srgb, var(--color-white) 60%, transparent); line-height: 1.55; }

@media (max-width: 980px) {
  .lv-show-row, .lv-show-row:nth-child(even) { grid-template-columns: 1fr; }
  .lv-show-row:nth-child(even) .lv-show-text { order: 0; }
  .lv-proof { flex-direction: column; align-items: flex-start; }
  .lv-steps { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .lv-steps { grid-template-columns: 1fr; }
}