.growth-dashboard.diagnostic-dashboard {
  --dx-bg: #09090b;
  --dx-panel: #0e0d10;
  --dx-panel-raised: #131116;
  --dx-line: #29262e;
  --dx-line-bright: #403949;
  --dx-text: #f6f3f8;
  --dx-muted: #aaa3ae;
  --dx-dim: #77717c;
  --dx-accent: #c9a6e4;
  --dx-accent-strong: #a978cb;
  --dx-alert: #f06b9a;
  overflow: visible;
  border: 1px solid #35313a;
  border-radius: 18px 18px 9px 9px;
  color: var(--dx-text);
  background: var(--dx-bg);
  box-shadow: 0 34px 100px rgba(0, 0, 0, .78), inset 0 1px rgba(255, 255, 255, .055);
  font-variant-numeric: tabular-nums;
}

.diagnostic-dashboard::before {
  background: linear-gradient(112deg, transparent 35%, rgba(255, 255, 255, .026) 50%, transparent 65%);
  pointer-events: none;
}

.diagnostic-dashboard button,
.diagnostic-dashboard a { font: inherit; }

.diagnostic-topbar {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 21px;
  border-bottom: 1px solid #242128;
  border-radius: 17px 17px 0 0;
  background: #0b0b0d;
}

.diagnostic-brand,
.diagnostic-save-state,
.diagnostic-step-line,
.diagnostic-actions,
.diagnostic-livebar,
.diagnostic-livebar > span,
.diagnostic-result-actions,
.diagnostic-xray-foot {
  display: flex;
  align-items: center;
}

.diagnostic-brand { gap: 10px; }

.diagnostic-brand-mark {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border: 1px solid #4d3e58;
  border-radius: 8px;
  color: #eadcf3;
  background: #17131b;
  font-size: 11px;
  font-weight: 700;
}

.diagnostic-brand span:last-child {
  color: #e6e1e9;
  font-size: 11px;
  font-weight: 680;
  letter-spacing: .01em;
}

.diagnostic-save-state {
  gap: 7px;
  color: #77717d;
  font-size: 8px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.diagnostic-save-state i,
.diagnostic-livebar i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--dx-accent);
  box-shadow: 0 0 11px rgba(201, 166, 228, .72);
}

.diagnostic-shell {
  display: grid;
  min-height: 520px;
  grid-template-columns: minmax(0, 1.45fr) minmax(270px, .78fr);
  background: var(--dx-bg);
}

.diagnostic-main,
.diagnostic-result {
  min-width: 0;
  padding: 28px 30px 24px;
  border-right: 1px solid #252229;
  background:
    radial-gradient(circle at 92% 8%, rgba(157, 111, 186, .07), transparent 26%),
    #0b0b0d;
}

.diagnostic-main {
  display: flex;
  flex-direction: column;
}

.diagnostic-step-line {
  justify-content: space-between;
  gap: 20px;
  color: #89828d;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.diagnostic-step-line strong { color: #e2d9e8; font-weight: 700; }

.diagnostic-progress {
  height: 2px;
  margin: 11px 0 25px;
  overflow: hidden;
  background: #242129;
}

.diagnostic-progress span {
  display: block;
  width: 14.285%;
  height: 100%;
  background: linear-gradient(90deg, #76518f, #e2c8f2);
  transform-origin: left;
  transition: width .46s cubic-bezier(.16, 1, .3, 1);
}

.diagnostic-question {
  animation: diagnostic-question-in .4s cubic-bezier(.16, 1, .3, 1) both;
}

.diagnostic-question h3 {
  max-width: 650px;
  margin: 0;
  color: #f7f4f8;
  font-size: clamp(32px, 3vw, 43px);
  font-weight: 570;
  line-height: 1.06;
  letter-spacing: -.03em;
  text-wrap: balance;
}

.diagnostic-question p {
  max-width: 68ch;
  min-height: 20px;
  margin: 11px 0 0;
  color: #a29ba7;
  font-size: 14px;
  line-height: 1.45;
}

.diagnostic-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 20px;
}

.diagnostic-option {
  position: relative;
  display: grid;
  min-height: 68px;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 0;
  padding: 12px 15px;
  border: 0;
  border-radius: 12px;
  color: #c0bac4;
  background: rgba(255, 255, 255, .025);
  text-align: left;
  cursor: pointer;
  overflow: hidden;
  transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.diagnostic-option::before {
  content: '';
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 2px;
  opacity: 0;
  background: linear-gradient(180deg, #8e62a9, #e0c5ee);
  box-shadow: 0 0 12px rgba(199, 155, 224, .7);
  transition: opacity .2s ease;
}

.diagnostic-option:hover {
  color: #f5f0f7;
  background: rgba(191, 145, 218, .075);
  transform: translateY(-1px);
}

.diagnostic-option:focus-visible,
.diagnostic-back:focus-visible,
.diagnostic-next:focus-visible,
.diagnostic-whatsapp:focus-visible {
  outline: 2px solid #d8bce9;
  outline-offset: 2px;
}

.diagnostic-option[aria-pressed='true'] {
  color: #fff;
  background: linear-gradient(100deg, rgba(113, 75, 137, .25), rgba(42, 31, 48, .62));
  box-shadow: 0 8px 26px rgba(0, 0, 0, .18);
}

.diagnostic-option[aria-pressed='true']::before { opacity: 1; }

.diagnostic-option-copy strong,
.diagnostic-option-copy small { display: block; }
.diagnostic-option-copy strong { color: inherit; font-size: 13px; font-weight: 650; line-height: 1.3; }
.diagnostic-option-copy small { margin-top: 5px; color: #9d96a2; font-size: 10.5px; line-height: 1.38; }

.diagnostic-actions {
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 18px;
}

.diagnostic-back,
.diagnostic-next,
.diagnostic-whatsapp {
  min-height: 39px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 680;
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, color .2s ease, opacity .2s ease;
}

.diagnostic-back {
  padding: 0 13px;
  border: 0;
  color: #99929d;
  background: transparent;
}

.diagnostic-back:disabled { opacity: .3; cursor: default; }

.diagnostic-next {
  min-width: 136px;
  padding: 0 17px;
  border: 1px solid #e6e1e8;
  color: #121013;
  background: #f2eff4;
}

.diagnostic-next:hover:not(:disabled),
.diagnostic-whatsapp:hover { transform: translateY(-1px); background: #fff; }
.diagnostic-next:disabled { border-color: #302c34; color: #68616d; background: #171519; cursor: default; }

.diagnostic-xray {
  position: relative;
  display: flex;
  min-width: 0;
  padding: 22px 20px 20px;
  flex-direction: column;
  overflow: visible;
  border-radius: 0 0 8px 0;
  background:
    radial-gradient(circle at 50% 35%, rgba(143, 90, 177, .11), transparent 42%),
    linear-gradient(180deg, #0e0d10 0%, #09090b 100%);
}

.diagnostic-xray::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .025) 50%, transparent 70%);
}

.diagnostic-livebar {
  position: relative;
  z-index: 2;
  justify-content: space-between;
  gap: 10px;
  color: #928a97;
  font-size: 7px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.diagnostic-livebar > span { gap: 7px; }
.diagnostic-livebar b { color: #c8c0cc; font-size: inherit; font-weight: 650; }
.diagnostic-livebar strong { color: #827989; font-size: 7px; font-weight: 550; }

.diagnostic-analysis-state {
  position: relative;
  z-index: 2;
  min-height: 52px;
  margin-top: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid #252229;
}

.diagnostic-analysis-state span,
.diagnostic-analysis-state small { display: block; }
.diagnostic-analysis-state span { color: #f0eaf3; font-size: 12px; font-weight: 620; line-height: 1.3; }
.diagnostic-analysis-state small { margin-top: 5px; color: #827a88; font-size: 8px; line-height: 1.4; }

.xray-funnel {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 318px;
  padding: 18px 0 11px;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.holo-funnel {
  isolation: isolate;
  perspective: 780px;
  transform-style: preserve-3d;
}

.holo-aura {
  position: absolute;
  z-index: -2;
  top: 3%;
  right: 2%;
  bottom: 5%;
  left: 2%;
  opacity: .78;
  background:
    radial-gradient(ellipse 54% 48% at 50% 41%, rgba(117, 78, 255, .22), transparent 72%),
    radial-gradient(ellipse 24% 48% at 50% 62%, rgba(232, 75, 171, .13), transparent 74%);
  filter: blur(13px);
  animation: holo-aura-breathe 3.8s ease-in-out infinite;
}

.holo-funnel .xray-stage {
  transform-style: preserve-3d;
  filter: drop-shadow(0 8px 12px rgba(74, 40, 184, .13));
}

.holo-funnel .xray-stage-shape {
  min-height: 64px;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  justify-items: center;
  padding: 10px 22px;
  overflow: visible;
  clip-path: polygon(3% 0, 97% 0, 88% 100%, 12% 100%);
  color: #d8d2e2;
  text-align: center;
  background:
    linear-gradient(90deg, rgba(104, 72, 255, .72), rgba(170, 125, 255, .9) 28%, rgba(90, 222, 255, .82) 50%, rgba(170, 125, 255, .9) 72%, rgba(104, 72, 255, .72));
  transform: rotateX(7deg) scaleX(var(--pinch));
  transform-origin: 50% 50%;
  filter: drop-shadow(0 0 7px rgba(135, 102, 255, .48));
}

.holo-funnel .xray-stage-shape::before {
  inset: 1px;
  background:
    linear-gradient(90deg, rgba(7, 6, 18, .9), rgba(33, 18, 71, .6) 45%, rgba(9, 8, 23, .88)),
    repeating-linear-gradient(90deg, transparent 0 16px, rgba(197, 178, 255, .13) 17px 18px),
    repeating-linear-gradient(0deg, transparent 0 10px, rgba(119, 203, 255, .1) 11px 12px);
}

.holo-funnel .xray-stage-shape::after {
  inset: -5px 4% auto;
  height: 12px;
  opacity: .72;
  clip-path: none;
  border: 1px solid rgba(167, 146, 255, .8);
  border-radius: 50%;
  background: transparent;
  box-shadow:
    0 0 8px rgba(116, 91, 255, .8),
    inset 0 0 8px rgba(131, 219, 255, .32);
  transform: none;
  animation: holo-ring-pulse 2.8s ease-in-out infinite;
}

.holo-funnel .xray-stage:nth-of-type(even) .xray-stage-shape {
  transform: rotateX(7deg) translateX(2px) scaleX(var(--pinch));
}

.holo-funnel .xray-stage span {
  position: absolute;
  top: 50%;
  left: 13%;
  grid-row: auto;
  color: #a99bc9;
  font-size: 8px;
  text-shadow: 0 0 6px rgba(151, 123, 255, .65);
  transform: translateY(-50%);
}

.holo-funnel .xray-stage strong {
  align-self: end;
  font-size: 15px;
  line-height: 1.1;
  text-shadow: 0 0 9px rgba(174, 150, 255, .48);
}

.holo-funnel .xray-stage small {
  align-self: start;
  margin-top: 4px;
  color: #b1a9ba;
  font-size: 10.5px;
  line-height: 1.2;
}

.holo-funnel .xray-stage::before,
.holo-funnel .xray-stage::after {
  content: '';
  position: absolute;
  z-index: 5;
  top: 8px;
  bottom: 5px;
  width: 1px;
  opacity: .5;
  background: linear-gradient(180deg, rgba(191, 172, 255, .94), rgba(90, 208, 255, .13));
  box-shadow: 0 0 5px rgba(129, 100, 255, .72);
  pointer-events: none;
}

.holo-funnel .xray-stage::before { left: 13%; transform: rotate(-8deg); }
.holo-funnel .xray-stage::after { right: 13%; transform: rotate(8deg); }

.holo-funnel .xray-stage.is-attention .xray-stage-shape {
  color: #f2eaff;
  background: linear-gradient(90deg, rgba(120, 74, 255, .96), rgba(209, 151, 255, .95) 45%, rgba(95, 220, 255, .9));
  filter: drop-shadow(0 0 11px rgba(168, 108, 255, .74));
}

.holo-funnel .xray-stage.is-bottleneck .xray-stage-shape {
  --pinch: .72;
  color: #fff3fa;
  background: linear-gradient(90deg, rgba(255, 65, 157, .96), rgba(255, 138, 210, .98) 45%, rgba(139, 100, 255, .92));
  filter: drop-shadow(0 0 12px rgba(255, 62, 157, .78));
}

.holo-funnel .xray-stage.is-bottleneck .xray-stage-shape::before {
  background:
    linear-gradient(90deg, rgba(27, 5, 23, .94), rgba(86, 16, 65, .7) 48%, rgba(27, 5, 23, .94)),
    repeating-linear-gradient(90deg, transparent 0 14px, rgba(255, 182, 223, .16) 15px 16px);
}

.holo-funnel .xray-stage.is-bottleneck .xray-stage-shape::after {
  border-color: rgba(255, 119, 189, .95);
  box-shadow: 0 0 11px rgba(255, 63, 157, .9), inset 0 0 8px rgba(255, 177, 218, .42);
}

.holo-funnel .xray-stage.is-bottleneck em {
  display: none;
}

/* Experimento de funil: exoesqueleto branco com malha de constelação. */
.holo-funnel .holo-aura {
  opacity: .62;
  background:
    radial-gradient(ellipse 52% 52% at 50% 42%, rgba(219, 204, 255, .15), transparent 68%),
    radial-gradient(ellipse 26% 60% at 50% 58%, rgba(126, 89, 255, .12), transparent 76%);
  filter: blur(16px);
}

.holo-funnel .xray-stage {
  filter:
    drop-shadow(0 0 3px rgba(255, 255, 255, .34))
    drop-shadow(0 0 10px rgba(146, 105, 255, .2));
}

.holo-funnel .xray-stage-shape {
  min-height: 66px;
  clip-path: url(#xray-rounded-trapezoid);
  border-radius: 14px 14px 18px 18px;
  color: #f9f7ff;
  background:
    linear-gradient(90deg,
      rgba(255, 255, 255, .98),
      rgba(204, 181, 255, .92) 18%,
      rgba(255, 255, 255, .98) 50%,
      rgba(196, 168, 255, .92) 82%,
      rgba(255, 255, 255, .98));
  filter:
    drop-shadow(0 0 3px rgba(255, 255, 255, .82))
    drop-shadow(0 0 9px rgba(168, 124, 255, .46));
}

.holo-funnel .xray-stage-shape::before {
  inset: 1.5px;
  opacity: 1;
  background:
    repeating-linear-gradient(90deg, transparent 0 19%, rgba(230, 219, 255, .1) 19.5% 19.8%, transparent 20%),
    radial-gradient(ellipse 74% 65% at 50% -24%, transparent 73%, rgba(241, 234, 255, .13) 74%, transparent 75.2%),
    radial-gradient(ellipse 76% 68% at 50% 126%, transparent 72%, rgba(218, 201, 255, .11) 73%, transparent 74.2%),
    linear-gradient(100deg, rgba(5, 6, 13, .96), rgba(18, 15, 28, .88) 48%, rgba(5, 6, 13, .96));
  box-shadow:
    inset 0 0 14px rgba(229, 215, 255, .07),
    inset 0 1px 0 rgba(255, 255, 255, .12);
}

.holo-funnel .xray-stage-shape::after {
  inset: 6px 9% 7px;
  width: auto;
  height: auto;
  opacity: .58;
  border: 0;
  border-radius: 0;
  background:
    radial-gradient(ellipse 92% 84% at 50% -52%, transparent 75%, rgba(255, 255, 255, .19) 76%, transparent 77.1%),
    radial-gradient(ellipse 92% 86% at 50% 150%, transparent 74%, rgba(207, 183, 255, .16) 75%, transparent 76.1%),
    linear-gradient(83deg, transparent 0 31%, rgba(225, 212, 255, .1) 31.4% 31.7%, transparent 32.1%),
    linear-gradient(97deg, transparent 0 68%, rgba(225, 212, 255, .09) 68.3% 68.6%, transparent 69%);
  box-shadow: none;
  animation: exoskeleton-constellation 3.2s ease-in-out infinite;
}

.holo-funnel .xray-stage span {
  display: none;
}

.holo-funnel .xray-stage strong {
  color: #fff;
  font-size: 15.5px;
  text-shadow: 0 0 8px rgba(255, 255, 255, .34), 0 0 12px rgba(168, 125, 255, .3);
}

.holo-funnel .xray-stage small {
  color: #d0cbd6;
}

.holo-funnel .xray-stage::before,
.holo-funnel .xray-stage::after {
  opacity: .72;
  background: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(193, 164, 255, .2));
  box-shadow: 0 0 6px rgba(233, 221, 255, .72);
  transition: opacity .22s ease;
}

.holo-funnel .xray-stage.is-bottleneck::before,
.holo-funnel .xray-stage.is-bottleneck::after {
  opacity: 0;
}

.holo-funnel .xray-stage.is-attention .xray-stage-shape {
  color: #fff;
  background: linear-gradient(90deg, #fff, #cdb1ff 24%, #fff 52%, #b997ff 78%, #fff);
  filter: drop-shadow(0 0 5px rgba(255, 255, 255, .82)) drop-shadow(0 0 12px rgba(166, 112, 255, .58));
}

.holo-funnel .xray-stage.is-bottleneck .xray-stage-shape {
  color: #fff;
  background: linear-gradient(90deg, #fff, #ff62a8 18%, #fff 48%, #ff4d9c 78%, #fff);
  filter: drop-shadow(0 0 5px rgba(255, 255, 255, .74)) drop-shadow(0 0 13px rgba(255, 54, 145, .82));
}

.holo-funnel .xray-stage.is-bottleneck .xray-stage-shape::before {
  background:
    repeating-linear-gradient(90deg, transparent 0 24%, rgba(255, 204, 228, .1) 24.5% 24.8%, transparent 25%),
    radial-gradient(ellipse 76% 68% at 50% -25%, transparent 72%, rgba(255, 226, 240, .14) 73%, transparent 74.2%),
    radial-gradient(ellipse 78% 70% at 50% 127%, transparent 72%, rgba(255, 176, 213, .13) 73%, transparent 74.2%),
    linear-gradient(100deg, rgba(22, 5, 17, .98), rgba(64, 10, 42, .88) 50%, rgba(20, 5, 16, .98));
}

.holo-funnel .xray-stage.is-bottleneck span {
  color: #ff8abd;
}

@keyframes exoskeleton-constellation {
  0%, 100% { opacity: .42; filter: brightness(.9); }
  50% { opacity: .76; filter: brightness(1.35); }
}

.xray-clip-defs {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}

.bottleneck-alert {
  --alert-y: 18%;
  --connector-length: 118px;
  --connector-tail: 49px;
  position: absolute;
  z-index: 12;
  top: calc(var(--alert-y) + 22px);
  left: auto;
  right: -280px;
  width: 210px;
  min-height: 100px;
  opacity: 0;
  pointer-events: none;
  transform: translate(10px, -50%) scale(.94);
  transform-origin: 0 50%;
  transition: opacity .35s ease, transform .55s cubic-bezier(.16, 1, .3, 1), top .5s cubic-bezier(.16, 1, .3, 1);
}

.bottleneck-connector {
  position: absolute;
  top: calc(50% - 22px);
  right: 100%;
  width: var(--connector-length);
  height: 24px;
  overflow: visible;
}

.bottleneck-connector path {
  fill: none;
  stroke: #ff5c9f;
  stroke-width: 1;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: none;
  stroke-dashoffset: 0;
  vector-effect: non-scaling-stroke;
  transform-box: fill-box;
  filter: drop-shadow(0 0 4px rgba(255, 73, 149, .9));
}

.bottleneck-connector-path {
  clip-path: inset(0 100% 0 0);
}

.bottleneck-connector-node,
.bottleneck-connector-pulse {
  vector-effect: non-scaling-stroke;
  transform-box: fill-box;
  transform-origin: center;
}

.bottleneck-connector-node {
  opacity: 0;
  fill: #ff4e99;
  stroke: #ffafd1;
  stroke-width: 1;
  filter: drop-shadow(0 0 6px #ff3f8f);
}

.bottleneck-connector-pulse {
  opacity: 0;
  fill: none;
  stroke: rgba(255, 104, 170, .8);
  stroke-width: 1;
}

.bottleneck-alert-panel {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 100px;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 12px;
  padding: 15px 17px;
  overflow: hidden;
  opacity: 0;
  border: 1px solid rgba(255, 80, 153, .72);
  border-radius: 8px;
  color: #fff;
  background:
    linear-gradient(115deg, rgba(50, 8, 31, .96), rgba(20, 8, 22, .95)),
    rgba(12, 7, 14, .97);
  box-shadow:
    0 0 0 1px rgba(255, 127, 181, .08) inset,
    0 0 18px rgba(255, 47, 134, .22),
    0 12px 28px rgba(0, 0, 0, .46);
  clip-path: inset(0 100% 0 0);
  filter: blur(4px) brightness(1.8);
  transform: translateX(12px) scale(.97);
}

.bottleneck-alert-panel::before {
  content: '';
  position: absolute;
  z-index: 3;
  top: 0;
  bottom: 0;
  left: -42%;
  width: 34%;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 179, 218, .32), rgba(255, 255, 255, .72), transparent);
  transform: skewX(-12deg);
}

.bottleneck-alert-panel::after {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .12;
  pointer-events: none;
  background:
    repeating-linear-gradient(0deg, transparent 0 7px, rgba(255, 147, 197, .2) 8px),
    linear-gradient(90deg, transparent 48%, rgba(255, 255, 255, .16) 50%, transparent 52%);
  mix-blend-mode: screen;
}

.holo-funnel.has-bottleneck-alert .bottleneck-alert {
  opacity: 1;
  transform: translate(0, -50%) scale(1);
}

.holo-funnel.has-bottleneck-alert .bottleneck-connector-path {
  animation: bottleneck-connector-reveal .56s .04s cubic-bezier(.4, 0, .2, 1) forwards;
}

.holo-funnel.has-bottleneck-alert .bottleneck-connector-node {
  animation: bottleneck-node-ignite .14s .01s ease-out forwards;
}

.holo-funnel.has-bottleneck-alert .bottleneck-connector-pulse {
  animation: bottleneck-node-pulse .4s .02s ease-out forwards;
}

.holo-funnel.has-bottleneck-alert .bottleneck-alert-panel {
  animation:
    bottleneck-panel-boot .29s .64s cubic-bezier(.16, 1, .3, 1) forwards,
    bottleneck-alert-pulse 2.6s .98s ease-in-out infinite;
}

.holo-funnel.has-bottleneck-alert .bottleneck-alert-panel::before {
  animation: bottleneck-panel-scan .36s .65s ease-out forwards;
}

.bottleneck-alert[data-stage='attract'] { --alert-y: 18%; --connector-length: 118px; --connector-tail: 49px; }
.bottleneck-alert[data-stage='interest'] { --alert-y: 37%; --connector-length: 140px; --connector-tail: 57px; }
.bottleneck-alert[data-stage='opportunity'] { --alert-y: 56%; --connector-length: 158px; --connector-tail: 64px; }
.bottleneck-alert[data-stage='sell'] { --alert-y: 75%; --connector-length: 180px; --connector-tail: 73px; }

.bottleneck-alert-icon {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid rgba(255, 123, 179, .9);
  border-radius: 50%;
  color: #ff9bc5;
  font-size: 17px;
  font-weight: 750;
  box-shadow: 0 0 10px rgba(255, 61, 145, .28);
}

.bottleneck-alert-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

.bottleneck-alert-copy small,
.bottleneck-alert-copy strong,
.bottleneck-alert-copy em { display: block; }

.bottleneck-alert-copy small {
  color: #ff70ae;
  font-size: 8.5px;
  font-weight: 750;
  letter-spacing: .11em;
  line-height: 1;
  text-transform: uppercase;
}

.bottleneck-alert-copy strong {
  margin-top: 5px;
  font-size: 16px;
  font-weight: 720;
  line-height: 1;
}

.bottleneck-alert-copy em {
  margin-top: 6px;
  color: #cdb8c4;
  font-size: 10.5px;
  font-style: normal;
  line-height: 1.25;
}

.holo-neck {
  display: none;
}

.holo-neck i {
  position: absolute;
  top: 0;
  left: 50%;
  width: 3px;
  height: 100%;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #fff, #cdb7ff 55%, #ff73b9);
  box-shadow: 0 0 9px rgba(216, 193, 255, .9);
  animation: emitter-column 1.25s ease-in-out infinite;
}

.holo-base {
  position: relative;
  z-index: 3;
  width: 124px;
  height: 30px;
  margin-top: 1px;
  filter: drop-shadow(0 0 8px rgba(143, 96, 255, .32));
}

.holo-base::before,
.holo-base::after {
  content: '';
  position: absolute;
  left: 50%;
  border-radius: 50%;
  pointer-events: none;
}

.holo-base::before {
  bottom: 4px;
  width: 114px;
  height: 20px;
  border: 1px solid rgba(228, 217, 255, .64);
  background: radial-gradient(ellipse at center, rgba(141, 93, 255, .16), rgba(12, 9, 19, .12) 54%, transparent 70%);
  box-shadow: inset 0 0 8px rgba(193, 170, 255, .2), 0 0 7px rgba(157, 109, 255, .35);
  transform: translateX(-50%);
}

.holo-base::after {
  bottom: 10px;
  width: 30px;
  height: 7px;
  background: radial-gradient(ellipse at center, #fff 0 9%, #d8c4ff 24%, rgba(174, 123, 255, .52) 48%, transparent 74%);
  box-shadow: 0 0 10px rgba(214, 190, 255, .72);
  transform: translateX(-50%);
}

.holo-base i {
  position: absolute;
  left: 50%;
  border: 1px solid rgba(203, 181, 255, .7);
  border-radius: 50%;
  box-shadow: 0 0 7px rgba(146, 98, 255, .38), inset 0 0 5px rgba(218, 199, 255, .12);
  transform: translateX(-50%);
  animation: emitter-ring-pulse 1.8s ease-in-out infinite;
}

.holo-base i:nth-child(1) { bottom: 7px; width: 92px; height: 16px; }
.holo-base i:nth-child(2) { bottom: 9px; width: 66px; height: 12px; animation-delay: -.6s; }
.holo-base i:nth-child(3) { bottom: 11px; width: 42px; height: 8px; border-color: rgba(255, 125, 189, .7); animation-delay: -1.2s; }

.holo-particles {
  display: none;
}

.xray-flow {
  display: none;
}

.holo-particles i {
  position: absolute;
  left: var(--particle-x);
  bottom: 0;
  width: var(--particle-size);
  height: var(--particle-size);
  border-radius: 50%;
  opacity: 0;
  background: #c8b3ff;
  box-shadow: 0 0 7px rgba(163, 135, 255, .9);
  animation: holo-particle 3.8s var(--particle-delay) ease-in infinite;
}

.holo-particles i:nth-child(1) { --particle-x: 16%; --particle-size: 2px; --particle-delay: -.4s; }
.holo-particles i:nth-child(2) { --particle-x: 29%; --particle-size: 3px; --particle-delay: -1.7s; }
.holo-particles i:nth-child(3) { --particle-x: 42%; --particle-size: 2px; --particle-delay: -2.6s; }
.holo-particles i:nth-child(4) { --particle-x: 55%; --particle-size: 3px; --particle-delay: -.9s; }
.holo-particles i:nth-child(5) { --particle-x: 68%; --particle-size: 2px; --particle-delay: -3.1s; }
.holo-particles i:nth-child(6) { --particle-x: 81%; --particle-size: 2px; --particle-delay: -2.1s; }
.holo-particles i:nth-child(7) { --particle-x: 37%; --particle-size: 2px; --particle-delay: -3.5s; }
.holo-particles i:nth-child(8) { --particle-x: 62%; --particle-size: 3px; --particle-delay: -1.2s; }

.xray-funnel::before,
.xray-funnel::after {
  content: '';
  position: absolute;
  left: 50%;
  pointer-events: none;
  transform: translateX(-50%);
}

.xray-funnel::before {
  top: 23px;
  bottom: 18px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(220, 194, 235, .46) 14%, rgba(176, 119, 211, .42) 84%, transparent);
}

.xray-funnel::after {
  bottom: 13px;
  width: 16px;
  height: 16px;
  border-right: 1px solid rgba(215, 183, 234, .5);
  border-bottom: 1px solid rgba(215, 183, 234, .5);
  transform: translateX(-50%) rotate(45deg);
}

.holo-funnel::after { display: none; }

.xray-stage {
  position: relative;
  z-index: 2;
  display: flex;
  width: var(--stage-width);
  justify-content: center;
}

.xray-stage[data-funnel-stage='attract'] { --stage-width: 100%; }
.xray-stage[data-funnel-stage='interest'] { --stage-width: 84%; }
.xray-stage[data-funnel-stage='opportunity'] { --stage-width: 68%; }
.xray-stage[data-funnel-stage='sell'] { --stage-width: 52%; }

.xray-stage-shape {
  --pinch: 1;
  position: relative;
  display: grid;
  width: 100%;
  min-height: 57px;
  grid-template-columns: 28px 1fr;
  grid-template-rows: auto auto;
  align-content: center;
  column-gap: 8px;
  padding: 8px 13px 8px 16px;
  isolation: isolate;
  clip-path: polygon(5% 0, 95% 0, 88% 100%, 12% 100%);
  color: #bcb4c2;
  background: linear-gradient(90deg, rgba(109, 79, 128, .32), rgba(31, 26, 35, .83) 48%, rgba(109, 79, 128, .26));
  transform: scaleX(var(--pinch));
  transition: transform .7s cubic-bezier(.16, 1, .3, 1), color .45s ease, filter .45s ease, background .45s ease;
}

.xray-stage-shape::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 1px;
  clip-path: inherit;
  background: linear-gradient(90deg, rgba(12, 11, 14, .94), rgba(22, 18, 25, .84), rgba(12, 11, 14, .94));
}

.xray-stage-shape::after {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 1px;
  opacity: .34;
  clip-path: inherit;
  background: linear-gradient(100deg, transparent 18%, rgba(218, 183, 238, .16) 48%, transparent 77%);
  transform: translateX(-100%);
  animation: xray-stage-breathe 4.2s ease-in-out infinite;
}

.xray-stage span {
  grid-row: 1 / 3;
  align-self: center;
  color: #746b79;
  font-size: 7px;
  letter-spacing: .08em;
}

.xray-stage strong {
  align-self: end;
  color: inherit;
  font-size: 10px;
  font-weight: 680;
  line-height: 1.15;
}

.xray-stage small {
  align-self: start;
  margin-top: 3px;
  color: #766e7b;
  font-size: 7px;
  line-height: 1.2;
}

.xray-stage em {
  position: absolute;
  top: 50%;
  right: 10%;
  opacity: 0;
  color: #ffd8e5;
  font-size: 6px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  transform: translateY(-50%) translateX(5px);
  transition: opacity .35s ease, transform .35s ease;
}

.xray-stage.is-attention .xray-stage-shape {
  color: #eee1f4;
  filter: drop-shadow(0 5px 12px rgba(128, 82, 157, .18));
  background: linear-gradient(90deg, rgba(147, 97, 178, .58), rgba(48, 36, 56, .86), rgba(147, 97, 178, .46));
}

.xray-stage.is-attention .xray-stage-shape::after { animation-duration: 1.9s; }

.xray-stage.is-bottleneck .xray-stage-shape {
  --pinch: .76;
  color: #fff0f5;
  filter: drop-shadow(0 7px 16px rgba(216, 74, 126, .25));
  background: linear-gradient(90deg, rgba(236, 98, 150, .86), rgba(92, 36, 61, .9), rgba(236, 98, 150, .72));
}

.xray-stage.is-bottleneck .xray-stage-shape::before {
  background: linear-gradient(90deg, rgba(31, 12, 20, .96), rgba(62, 24, 41, .88), rgba(31, 12, 20, .96));
}

.xray-stage.is-bottleneck em { opacity: 1; transform: translateY(-50%); }
.xray-stage.is-bottleneck small { color: #b994a2; }

.xray-flow {
  position: absolute;
  z-index: 4;
  top: 18px;
  bottom: 14px;
  left: 50%;
  width: 10px;
  pointer-events: none;
  transform: translateX(-50%);
}

.xray-flow i {
  position: absolute;
  top: 0;
  left: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f1ddfb;
  box-shadow: 0 0 12px rgba(214, 174, 237, .95);
  transform: translateX(-50%);
  animation: xray-flow 3.2s linear infinite;
}

.xray-flow i:nth-child(2) { animation-delay: -1.05s; }
.xray-flow i:nth-child(3) { animation-delay: -2.1s; }

.xray-scanline {
  position: absolute;
  z-index: 5;
  left: 7%;
  right: 7%;
  top: 15px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(243, 222, 255, .9), transparent);
  box-shadow: 0 0 13px rgba(199, 153, 224, .6);
}

.diagnostic-dashboard.is-scanning .xray-scanline {
  opacity: 1;
  animation: xray-scan .72s cubic-bezier(.22, 1, .36, 1) both;
}

.diagnostic-dashboard.is-scanning .diagnostic-livebar i {
  animation: xray-live-pulse .7s ease-in-out infinite;
}

.diagnostic-dashboard.is-measurement-gap .xray-flow i { opacity: .28; animation-duration: 4.8s; }
.diagnostic-dashboard.is-measurement-gap .xray-funnel::before { background: linear-gradient(180deg, transparent, rgba(240, 107, 154, .32), transparent 42%, rgba(240, 107, 154, .25), transparent); }

.diagnostic-xray-foot {
  position: relative;
  z-index: 2;
  justify-content: space-between;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid #252229;
  color: #716a76;
  font-size: 7px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.diagnostic-xray-foot strong {
  color: #aaa1ae;
  font-size: 7px;
  font-weight: 650;
  text-align: right;
}

.diagnostic-result {
  display: none;
  flex-direction: column;
  justify-content: center;
}

.diagnostic-dashboard.is-complete .diagnostic-main { display: none; }
.diagnostic-dashboard.is-complete .diagnostic-result { display: flex; animation: diagnostic-question-in .5s cubic-bezier(.16, 1, .3, 1) both; }

.diagnostic-result-kicker,
.diagnostic-result-label,
.diagnostic-result-reading span {
  color: #a88fba;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.diagnostic-result-label { margin: 21px 0 7px; color: #817986; }

.diagnostic-result h3 {
  max-width: 620px;
  margin: 0;
  color: #f8f4fa;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: clamp(31px, 3.4vw, 46px);
  font-weight: 570;
  line-height: 1;
  letter-spacing: -.035em;
}

.diagnostic-result-summary {
  max-width: 64ch;
  margin: 14px 0 0;
  color: #b3acb7;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 13px;
  line-height: 1.58;
}

.diagnostic-result-summary::before {
  content: '> ';
  color: #c79be0;
}

.diagnostic-result-reading {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 23px;
  padding: 18px 0;
  border-top: 1px solid #29252d;
  border-bottom: 1px solid #29252d;
}

.diagnostic-result-reading > div + div { padding-left: 18px; border-left: 1px solid #29252d; }
.diagnostic-result-reading p {
  margin: 8px 0 0;
  color: #d0c9d3;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  line-height: 1.55;
}

.diagnostic-result-actions {
  gap: 10px;
  margin-top: 22px;
  opacity: 0;
  transform: translateY(7px);
  pointer-events: none;
  transition: opacity .35s ease, transform .45s cubic-bezier(.16, 1, .3, 1);
}

.diagnostic-result.is-typed .diagnostic-result-actions {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

.diagnostic-result .is-typing-target::after {
  content: '_';
  display: inline-block;
  margin-left: .14em;
  color: #dab8ed;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-weight: 500;
  animation: diagnostic-caret .62s steps(1, end) infinite;
}

.diagnostic-whatsapp {
  display: inline-flex;
  min-width: 230px;
  min-height: 44px;
  padding: 0 20px;
  align-items: center;
  justify-content: center;
  border: 1px solid #ece7ef;
  color: #111012;
  background: #f5f1f6;
  text-decoration: none;
  font-size: 11px;
}

@keyframes diagnostic-caret {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}

@keyframes diagnostic-question-in {
  from { opacity: .3; transform: translateY(7px); filter: blur(2px); }
  to { opacity: 1; transform: none; filter: none; }
}

@keyframes xray-flow {
  0% { top: 0; opacity: 0; }
  8% { opacity: .95; }
  88% { opacity: .8; }
  100% { top: calc(100% - 5px); opacity: 0; }
}

@keyframes xray-stage-breathe {
  0%, 38% { transform: translateX(-110%); opacity: 0; }
  55% { opacity: .5; }
  74%, 100% { transform: translateX(110%); opacity: 0; }
}

@keyframes bottleneck-connector-reveal {
  from { clip-path: inset(0 100% 0 0); }
  to { clip-path: inset(0); }
}

@keyframes bottleneck-node-ignite {
  0% { opacity: 0; transform: scale(.2); }
  58% { opacity: 1; transform: scale(1.65); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes bottleneck-node-pulse {
  0% { opacity: .9; transform: scale(.35); }
  100% { opacity: 0; transform: scale(2.6); }
}

@keyframes bottleneck-panel-boot {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
    filter: blur(4px) brightness(2.2);
    transform: translateX(12px) scale(.97);
  }
  32% {
    opacity: 1;
    clip-path: inset(0 58% 0 0);
    filter: blur(1px) brightness(1.8);
    transform: translateX(-3px) scale(1.015) skewX(-1.5deg);
  }
  62% {
    clip-path: inset(0 14% 0 0);
    filter: none;
    transform: translateX(2px) scale(1);
  }
  78% { clip-path: inset(0); transform: translateX(-1px); }
  100% { opacity: 1; clip-path: inset(0); filter: none; transform: none; }
}

@keyframes bottleneck-panel-scan {
  0% { opacity: 0; transform: translateX(0) skewX(-12deg); }
  18% { opacity: .95; }
  74% { opacity: .72; }
  100% { opacity: 0; transform: translateX(850%) skewX(-12deg); }
}

@keyframes bottleneck-alert-pulse {
  0%, 100% {
    border-color: rgba(255, 80, 153, .62);
    box-shadow: 0 0 0 1px rgba(255, 127, 181, .07) inset, 0 0 15px rgba(255, 47, 134, .18), 0 12px 28px rgba(0, 0, 0, .46);
  }
  50% {
    border-color: rgba(255, 124, 181, .94);
    box-shadow: 0 0 0 1px rgba(255, 177, 210, .13) inset, 0 0 25px rgba(255, 47, 134, .34), 0 12px 28px rgba(0, 0, 0, .5);
  }
}

@keyframes xray-scan {
  from { top: 15px; opacity: 0; }
  12% { opacity: 1; }
  88% { opacity: 1; }
  to { top: calc(100% - 18px); opacity: 0; }
}

@keyframes xray-live-pulse {
  0%, 100% { opacity: .55; transform: scale(.85); }
  50% { opacity: 1; transform: scale(1.2); }
}

@keyframes holo-aura-breathe {
  0%, 100% { opacity: .55; transform: scale(.94); }
  50% { opacity: .9; transform: scale(1.03); }
}

@keyframes holo-ring-pulse {
  0%, 100% { opacity: .46; filter: brightness(.85); }
  50% { opacity: .95; filter: brightness(1.25); }
}

@keyframes holo-base-spin {
  from { transform: translate(-50%, -50%) rotateX(68deg) rotateZ(0); }
  to { transform: translate(-50%, -50%) rotateX(68deg) rotateZ(360deg); }
}

@keyframes emitter-column {
  0%, 100% { opacity: .58; filter: brightness(.9); }
  50% { opacity: 1; filter: brightness(1.28); }
}

@keyframes emitter-ring-pulse {
  0%, 100% { opacity: .42; transform: translateX(-50%) scale(.96); }
  50% { opacity: .92; transform: translateX(-50%) scale(1.02); }
}

@keyframes holo-particle {
  0% { opacity: 0; transform: translate3d(0, 0, 0) scale(.5); }
  14% { opacity: .9; }
  72% { opacity: .45; }
  100% { opacity: 0; transform: translate3d(8px, -245px, 0) scale(1.15); }
}

@media (max-width: 900px) {
  .diagnostic-shell { grid-template-columns: minmax(0, 1.25fr) minmax(245px, .75fr); }
  .diagnostic-main, .diagnostic-result { padding-inline: 22px; }
  .diagnostic-xray { padding-inline: 15px; }
  .diagnostic-option { min-height: 64px; }
}

@media (max-width: 700px) {
  .diagnostic-topbar { min-height: 48px; padding: 0 13px; }
  .diagnostic-brand span:last-child { font-size: 9px; }
  .diagnostic-save-state { font-size: 7px; }
  .diagnostic-shell { min-height: 0; grid-template-columns: 1fr; }
  .diagnostic-main, .diagnostic-result { min-height: 500px; padding: 17px 14px 15px; border-right: 0; }
  .diagnostic-question h3 { font-size: 30px; }
  .diagnostic-question p { font-size: 13px; }
  .diagnostic-progress { margin: 9px 0 18px; }
  .diagnostic-options { grid-template-columns: 1fr; gap: 7px; margin-top: 14px; }
  .diagnostic-option { min-height: 62px; padding: 11px 12px; }
  .diagnostic-option-copy strong { font-size: 12px; }
  .diagnostic-option-copy small { font-size: 9.5px; }
  .diagnostic-actions { padding-top: 13px; }
  .diagnostic-next { display: none; }
  .diagnostic-question, .diagnostic-result { scroll-margin-top: 88px; }
  .diagnostic-question h3:focus, .diagnostic-result:focus { outline: none; }
  .diagnostic-back, .diagnostic-next { min-height: 36px; font-size: 9px; }
  .diagnostic-xray { min-height: 470px; padding: 18px 14px 16px; border-top: 1px solid #252229; }
  .xray-funnel { min-height: 325px; }
  .diagnostic-result h3 { font-size: 30px; }
  .diagnostic-result-summary { font-size: 11px; }
  .diagnostic-result-reading { grid-template-columns: 1fr; gap: 14px; }
  .diagnostic-result-reading > div + div { padding: 14px 0 0; border-top: 1px solid #29252d; border-left: 0; }
  .diagnostic-result-actions { align-items: stretch; flex-direction: column; }
  .diagnostic-whatsapp { min-width: 0; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .diagnostic-question,
  .diagnostic-dashboard.is-complete .diagnostic-result,
  .xray-flow i,
  .xray-stage-shape::after,
  .holo-aura,
  .holo-base i,
  .holo-particles i,
  .holo-funnel.has-bottleneck-alert .bottleneck-alert,
  .holo-funnel.has-bottleneck-alert .bottleneck-connector path,
  .holo-funnel.has-bottleneck-alert .bottleneck-connector-node,
  .holo-funnel.has-bottleneck-alert .bottleneck-connector-pulse,
  .holo-funnel.has-bottleneck-alert .bottleneck-alert-panel,
  .holo-funnel.has-bottleneck-alert .bottleneck-alert-panel::before,
  .diagnostic-dashboard.is-scanning .xray-scanline,
  .diagnostic-dashboard.is-scanning .diagnostic-livebar i {
    animation: none !important;
  }

  .xray-stage-shape,
  .diagnostic-progress span { transition-duration: .01ms; }

  .holo-funnel.has-bottleneck-alert .bottleneck-connector path {
    stroke-dashoffset: 0;
    clip-path: inset(0);
  }
  .holo-funnel.has-bottleneck-alert .bottleneck-connector-node { opacity: 1; }
  .holo-funnel.has-bottleneck-alert .bottleneck-alert-panel {
    opacity: 1;
    clip-path: inset(0);
    filter: none;
    transform: none;
  }
}