/* Scorecard form CSS without legacy WordPress overrides. */
:root {
      --cream: #f3efe4;
      --cream-2: #e8dfcc;
      --brown: #4b211b;
      --rust: #b05a3c;
      --ink: #28130f;
      --muted: #7c665e;
      --line: rgba(75, 33, 27, .18);
      --soft: rgba(75, 33, 27, .06);
      --good: #3f7d58;
      --warn: #ba7a2a;
      --bad: #a43f32;
    }

    * { box-sizing: border-box; }

    html {
      scroll-behavior: smooth;
      max-width: 100%;
      overflow-x: hidden;
    }

    body {
      margin: 0;
      color: var(--brown);
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      line-height: 1.42;
      background: var(--cream);
      max-width: 100%;
      overflow-x: hidden;
    }

    body::before {
      content: none;
    }

    a { color: inherit; }

    .page {
      width: 100%;
      max-width: 1180px;
      margin: 0 auto;
      padding: 18px 28px 88px;
      position: relative;
      overflow-x: clip;
    }

    .nav {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 20px;
      padding: 8px 0 34px;
      font-weight: 900;
    }

    .brand {
      font-size: 22px;
      letter-spacing: -.04em;
      color: var(--ink);
    }

    .nav span:last-child {
      color: var(--rust);
      font-size: 13px;
      letter-spacing: .06em;
      text-transform: uppercase;
    }

    .hero {
      min-height: calc(100vh - 90px);
      display: grid;
      grid-template-columns: minmax(0, 1.06fr) minmax(0, .78fr);
      gap: 44px;
      align-items: center;
      padding: 20px 0 56px;
      border-bottom: 1px solid var(--line);
    }

    .eyebrow {
      text-transform: uppercase;
      letter-spacing: .08em;
      font-size: 12px;
      font-weight: 900;
      color: var(--rust);
      margin-bottom: 24px;
    }

    h1 {
      font-size: 82px;
      line-height: .86;
      letter-spacing: -0.055em;
      margin: 0 0 28px;
      max-width: 870px;
      color: var(--ink);
      font-weight: 900;
    }

    h2 {
      font-size: 42px;
      line-height: .95;
      letter-spacing: -0.04em;
      margin: 0 0 18px;
      color: var(--ink);
      font-weight: 900;
    }

    h3 {
      font-size: 23px;
      line-height: 1.03;
      letter-spacing: -0.02em;
      margin: 0;
      color: var(--ink);
      font-weight: 900;
    }

    p {
      font-size: 18px;
      margin: 0;
      max-width: 790px;
    }

    .lead {
      font-size: 24px;
      line-height: 1.16;
      color: var(--ink);
      margin-bottom: 34px;
      max-width: 810px;
    }

    .actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      align-items: center;
      max-width: 100%;
      min-width: 0;
    }

    .button,
    button.button {
      border: 0;
      appearance: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 52px;
      padding: 15px 20px;
      background: var(--brown);
      color: var(--cream);
      text-decoration: none;
      font-weight: 900;
      font-size: 15px;
      cursor: pointer;
      border-radius: 0;
      font-family: inherit;
      max-width: 100%;
      white-space: normal;
      text-align: center;
    }

    .button.secondary {
      background: transparent;
      color: var(--brown);
      border: 1px solid var(--line);
    }

    .button:disabled {
      opacity: .35;
      cursor: not-allowed;
    }

    .hero-panel {
      background: var(--brown);
      color: var(--cream);
      min-height: 520px;
      padding: 28px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      box-shadow: 18px 18px 0 rgba(75,33,27,.08);
    }

    .panel-label {
      color: var(--cream-2);
      font-size: 13px;
      text-transform: uppercase;
      letter-spacing: .08em;
      font-weight: 900;
    }

    .panel-score {
      font-size: 104px;
      line-height: .82;
      letter-spacing: -0.07em;
      font-weight: 900;
      margin: 16px 0 12px;
    }

    .panel-copy {
      color: var(--cream-2);
      font-size: 17px;
      line-height: 1.32;
    }

    .leak-lines {
      display: grid;
      gap: 12px;
      margin-top: 26px;
    }

    .leak-line {
      display: grid;
      grid-template-columns: 128px 1fr;
      gap: 12px;
      align-items: center;
      font-size: 14px;
      font-weight: 800;
      color: var(--cream-2);
    }

    .bar {
      height: 9px;
      background: rgba(255,255,255,.16);
      overflow: hidden;
    }

    .bar span {
      display: block;
      height: 100%;
      background: var(--rust);
    }

    .quote {
      font-size: 30px;
      line-height: 1.05;
      letter-spacing: -0.035em;
      font-weight: 900;
      color: var(--cream);
      max-width: 420px;
    }

    .section {
      padding: 72px 0;
      border-bottom: 1px solid var(--line);
    }

    .section-head {
      display: grid;
      grid-template-columns: 330px 1fr;
      gap: 36px;
      align-items: start;
      margin-bottom: 32px;
    }

    .section-kicker {
      color: var(--rust);
      text-transform: uppercase;
      font-size: clamp(15px, 1.6vw, 19px);
      line-height: 1.2;
      letter-spacing: .08em;
      font-weight: 900;
    }

    .pain-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin-top: 28px;
    }

    .pain {
      background: var(--soft);
      border-top: 3px solid var(--rust);
      padding: 20px;
      min-height: 176px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .pain strong {
      display: block;
      font-size: 24px;
      line-height: 1;
      letter-spacing: -0.03em;
      color: var(--ink);
      margin-bottom: 14px;
    }

    .pain span {
      color: var(--muted);
      font-size: 16px;
      font-weight: 700;
    }

    .impact-grid,
    .authority-grid,
    .offer-grid {
      display: grid;
      gap: 14px;
      margin-top: 28px;
    }

    .impact-grid {
      grid-template-columns: repeat(4, 1fr);
    }

    .impact-card,
    .authority-card,
    .offer-card {
      background: var(--soft);
      border-top: 3px solid var(--rust);
      padding: 20px;
    }

    .impact-card {
      min-height: 214px;
    }

    .impact-card strong {
      display: block;
      color: var(--ink);
      font-size: 36px;
      line-height: .9;
      letter-spacing: -0.045em;
      margin-bottom: 12px;
      font-weight: 900;
    }

    .impact-card span {
      display: block;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.28;
      font-weight: 750;
    }

    .impact-card em {
      display: block;
      color: var(--rust);
      font-size: 13px;
      line-height: 1.25;
      font-style: normal;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .05em;
      margin-bottom: 9px;
    }

    .market-note {
      background: var(--brown);
      color: var(--cream);
      padding: 30px;
      margin-top: 18px;
      display: grid;
      grid-template-columns: 1fr 1.2fr;
      gap: 26px;
      align-items: end;
    }

    .market-note strong {
      display: block;
      font-size: 56px;
      line-height: .9;
      letter-spacing: -0.055em;
      color: var(--cream);
    }

    .market-note p {
      color: var(--cream-2);
      max-width: none;
      font-size: 18px;
    }

    .source-note {
      color: var(--muted);
      font-size: 13px;
      max-width: 960px;
      margin-top: 16px;
      font-weight: 700;
    }

    .calculator {
      display: grid;
      grid-template-columns: minmax(0, .95fr) minmax(0, .8fr);
      gap: 16px;
      margin-top: 30px;
      align-items: stretch;
    }

    .calc-controls,
    .calc-output {
      border: 1px solid var(--line);
      background: rgba(255,255,255,.18);
      padding: 24px;
    }

    .calc-controls {
      display: grid;
      gap: 20px;
    }

    .calc-field {
      display: grid;
      gap: 10px;
    }

    .calc-label {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      align-items: baseline;
      font-weight: 900;
      color: var(--ink);
      font-size: 18px;
      line-height: 1.05;
    }

    .calc-label strong {
      color: var(--rust);
      font-size: 22px;
      letter-spacing: -.035em;
      white-space: nowrap;
    }

    .calc-field input[type="range"] {
      width: 100%;
      accent-color: var(--brown);
      cursor: pointer;
    }

    .calc-output {
      background: var(--brown);
      color: var(--cream);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 20px;
    }

    .calc-hero span,
    .calc-secondary span,
    .calc-row span {
      color: var(--cream-2);
      display: block;
      font-size: 13px;
      line-height: 1.25;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .08em;
      margin-bottom: 8px;
    }

    .calc-hero strong {
      display: block;
      color: var(--cream);
      font-size: clamp(48px, 4.8vw, 68px);
      line-height: .86;
      letter-spacing: -.065em;
      font-weight: 900;
    }

    .calc-secondary {
      border: 1px solid rgba(255,255,255,.16);
      background: rgba(255,255,255,.08);
      padding: 14px;
    }

    .calc-secondary strong {
      display: block;
      color: var(--cream);
      font-size: 34px;
      line-height: .9;
      letter-spacing: -.05em;
      font-weight: 900;
    }

    .calc-rows {
      display: grid;
      gap: 10px;
    }

    .calc-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 14px;
      align-items: end;
      border-top: 1px solid rgba(255,255,255,.18);
      padding-top: 10px;
    }

    .calc-row strong {
      color: var(--cream);
      font-size: 25px;
      line-height: .95;
      letter-spacing: -.04em;
      white-space: nowrap;
    }

    .calc-row.calc-total {
      border-top: 2px solid var(--cream);
      margin-top: 4px;
    }

    .pain-grid.four,
    .authority-grid {
      grid-template-columns: repeat(4, 1fr);
    }

    .authority-card {
      min-height: 180px;
    }

    .authority-card strong,
    .offer-card strong {
      display: block;
      color: var(--ink);
      font-size: 25px;
      line-height: 1;
      letter-spacing: -0.03em;
      margin-bottom: 12px;
      font-weight: 900;
    }

    .authority-card span,
    .offer-card span {
      color: var(--muted);
      font-size: 16px;
      line-height: 1.34;
      font-weight: 700;
    }

    .offer-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .offer-card {
      min-height: 320px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .offer-card ul {
      color: var(--muted);
      font-size: 16px;
      font-weight: 700;
      padding-left: 20px;
      margin: 18px 0 0;
    }

    .offer-card li { margin-bottom: 8px; }

    .offer-upside {
      margin-top: 18px;
      margin-bottom: 22px;
      background: var(--brown);
      color: var(--cream);
      padding: 16px;
      border-radius: 8px;
    }

    .offer-upside span {
      display: block;
      color: var(--cream-2);
      font-size: 12px;
      line-height: 1.1;
      text-transform: uppercase;
      letter-spacing: .08em;
      font-weight: 900;
      margin-bottom: 8px;
    }

    .offer-upside strong {
      color: var(--cream);
      font-size: 34px;
      line-height: .9;
      letter-spacing: -.05em;
      margin: 0;
    }

    .offer-card .button {
      margin-top: 8px;
    }

    .topbar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 20px;
      padding: 4px 0 18px;
      font-weight: 900;
    }

    .nav-links {
      display: flex;
      gap: 18px;
      align-items: center;
      color: var(--muted);
      font-size: 14px;
      font-weight: 850;
    }

    .nav-links a {
      text-decoration: none;
    }

    .hero-v2 {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 500px);
      gap: clamp(20px, 3vw, 42px);
      align-items: center;
      padding: clamp(4px, 1.5vw, 18px) 0 clamp(46px, 6vw, 72px);
      border-bottom: 1px solid var(--line);
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
    }

    .hero-copy,
    .hero-visual,
    .hero-v2 > * {
      min-width: 0;
      max-width: 100%;
    }

    .hero-copy {
      text-align: left;
    }

    .hero-copy .eyebrow {
      margin-bottom: 12px;
      text-align: left;
    }

    .hero-copy h1 {
      max-width: 860px;
      margin-bottom: 22px;
      font-size: clamp(46px, 7vw, 82px);
      text-align: left;
    }

    .hero-copy .lead,
    .hero-copy .actions {
      text-align: left;
    }

    .strike {
      display: inline-block;
      color: var(--rust);
    }

    .belief-ticker {
      max-width: 800px;
      overflow: hidden;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      margin: 28px 0 34px;
      padding: 12px 0;
    }

    .belief-track {
      display: flex;
      gap: 28px;
      width: max-content;
      animation: tickerMove 24s linear infinite;
    }

    .belief-track span {
      white-space: nowrap;
      font-size: 14px;
      line-height: 1.18;
      font-weight: 900;
      color: var(--brown);
      text-transform: uppercase;
      letter-spacing: .04em;
    }

    @keyframes tickerMove {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    .hero-visual {
      position: relative;
      min-height: clamp(540px, 45vw, 590px);
      aspect-ratio: 1 / 1.04;
      background: var(--cream-2);
      color: var(--brown);
      overflow: hidden;
      padding: clamp(14px, 2vw, 24px);
      border: 1px solid var(--line);
      box-shadow: 18px 18px 0 rgba(75,33,27,.08);
      display: grid;
      place-items: center;
      width: 100%;
      max-width: 100%;
    }

    .notification-cloud {
      width: 100%;
      max-width: 500px;
      height: 100%;
      min-height: 0;
      position: relative;
      padding-top: 52px;
      overflow: hidden;
    }

    .hero-tabs {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      z-index: 20;
    }

    .hero-tab {
      appearance: none;
      border: 1px solid var(--line);
      background: rgba(255,255,255,.58);
      color: var(--muted);
      border-radius: 999px;
      padding: 10px 12px;
      font-family: inherit;
      font-size: 12px;
      line-height: 1;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .06em;
      cursor: pointer;
    }

    .hero-tab.active {
      background: var(--brown);
      color: var(--cream);
      border-color: var(--brown);
    }

    .hero-tab-panel {
      position: absolute;
      inset: 52px 0 0;
      opacity: 0;
      transform: translateY(8px);
      pointer-events: none;
      transition: opacity .22s ease, transform .22s ease;
    }

    .hero-tab-panel.active {
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
    }

    .shopify-note,
    .revenue-panel,
    .mini-kpi {
      position: absolute;
      background: rgba(255,255,255,.86);
      border: 1px solid rgba(75,33,27,.14);
      box-shadow: 0 18px 48px rgba(75,33,27,.16);
      border-radius: 8px;
    }

    .shopify-note {
      width: min(72%, 318px);
      min-height: 74px;
      padding: 10px 11px;
      display: grid;
      grid-template-columns: 40px minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      animation: floatNote 6s ease-in-out infinite;
      max-width: 100%;
      min-width: 0;
    }

    .shopify-note.loss {
      background: rgba(243,239,228,.92);
      border-color: rgba(176,90,60,.28);
    }

    .note-icon {
      width: 40px;
      height: 40px;
      display: grid;
      place-items: center;
      background: var(--brown);
      color: var(--cream);
      border-radius: 8px;
      font-size: 20px;
      font-weight: 900;
      letter-spacing: -.04em;
    }

    .shopify-note.loss .note-icon {
      background: var(--rust);
    }

    .note-copy strong {
      display: block;
      color: var(--ink);
      font-size: 14px;
      line-height: 1;
      letter-spacing: -.025em;
      margin-bottom: 6px;
    }

    .note-copy span {
      display: block;
      color: var(--muted);
      font-size: 11px;
      line-height: 1.2;
      font-weight: 850;
    }

    .note-amount {
      color: var(--rust);
      font-size: 18px;
      font-weight: 900;
      letter-spacing: -.045em;
      white-space: nowrap;
    }

    .note-copy {
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .note-time {
      color: var(--muted);
      font-size: 11px;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .05em;
      margin-top: 5px;
    }

    .note-a { left: 2%; top: 5%; transform: rotate(-2deg); z-index: 3; }
    .note-b { right: 1%; top: 22%; transform: rotate(1.5deg); z-index: 4; animation-delay: .8s; }
    .note-c { left: 1%; top: 39%; transform: rotate(1.5deg); z-index: 5; animation-delay: 1.5s; }
    .note-d { right: 4%; top: 56%; transform: rotate(-1.5deg); z-index: 4; animation-delay: 2.1s; }

    .revenue-panel {
      left: 5%;
      right: 5%;
      bottom: 0;
      background: var(--brown);
      color: var(--cream);
      padding: 14px;
      z-index: 6;
    }

    .revenue-panel.loss {
      background: var(--cream);
      color: var(--brown);
      border: 1px solid rgba(176,90,60,.32);
    }

    .revenue-panel.loss span,
    .revenue-panel.loss p {
      color: var(--muted);
    }

    .revenue-panel.loss strong {
      color: var(--rust);
    }

    .revenue-panel span {
      display: block;
      color: var(--cream-2);
      font-size: 12px;
      line-height: 1.1;
      letter-spacing: .08em;
      text-transform: uppercase;
      font-weight: 900;
      margin-bottom: 8px;
    }

    .revenue-panel strong {
      display: block;
      color: var(--cream);
      font-size: clamp(32px, 3.8vw, 50px);
      line-height: .86;
      letter-spacing: -.065em;
      margin-bottom: 8px;
    }

    .revenue-panel p {
      color: var(--cream-2);
      font-size: 13px;
      line-height: 1.25;
      max-width: none;
    }

    .mini-kpi {
      width: 128px;
      padding: 12px;
      color: var(--brown);
      z-index: 2;
    }

    .mini-kpi strong {
      display: block;
      color: var(--ink);
      font-size: 26px;
      line-height: .9;
      letter-spacing: -.05em;
      margin-bottom: 7px;
    }

    .mini-kpi span {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.1;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .05em;
    }

    .kpi-a { left: 6%; bottom: 21%; transform: rotate(-4deg); }
    .kpi-b { right: 5%; top: 5%; transform: rotate(4deg); }

    @keyframes floatNote {
      0%, 100% { translate: 0 0; }
      50% { translate: 0 -8px; }
    }

    .store-comparison {
      display: grid;
      gap: 16px;
      height: 100%;
    }

    .store-panel {
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.16);
      padding: 18px;
      min-height: 230px;
      position: relative;
      overflow: hidden;
    }

    .store-panel.sad {
      background: rgba(232,223,204,.12);
    }

    .store-panel.happy {
      background: rgba(243,239,228,.13);
    }

    .store-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      margin-bottom: 16px;
    }

    .store-face {
      width: 46px;
      height: 46px;
      border: 2px solid rgba(255,255,255,.45);
      border-radius: 50%;
      position: relative;
      flex: 0 0 auto;
    }

    .store-face::before,
    .store-face::after {
      content: "";
      position: absolute;
      top: 15px;
      width: 5px;
      height: 5px;
      background: var(--cream);
      border-radius: 50%;
    }

    .store-face::before { left: 12px; }
    .store-face::after { right: 12px; }

    .store-face span {
      position: absolute;
      left: 12px;
      right: 12px;
      bottom: 11px;
      height: 8px;
      border-bottom: 2px solid var(--cream);
      border-radius: 0 0 20px 20px;
    }

    .store-panel.sad .store-face span {
      bottom: 7px;
      border-bottom: 0;
      border-top: 2px solid var(--cream);
      border-radius: 20px 20px 0 0;
    }

    .store-title strong {
      display: block;
      color: var(--cream);
      font-size: 25px;
      line-height: 1;
      letter-spacing: -.035em;
    }

    .store-title small {
      display: block;
      color: var(--cream-2);
      text-transform: uppercase;
      letter-spacing: .08em;
      font-size: 12px;
      font-weight: 900;
      margin-top: 8px;
    }

    .store-feed {
      display: grid;
      gap: 8px;
    }

    .store-summary {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      margin-top: 12px;
    }

    .store-summary strong,
    .store-summary span {
      display: block;
    }

    .store-summary strong {
      color: var(--cream);
      font-size: 28px;
      line-height: .92;
      letter-spacing: -.05em;
    }

    .store-summary span {
      color: var(--cream-2);
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .07em;
      font-weight: 900;
      margin-top: 6px;
    }

    .store-summary div {
      border: 1px solid rgba(255,255,255,.16);
      background: rgba(0,0,0,.12);
      padding: 10px;
    }

    .order-card {
      background: var(--cream);
      color: var(--brown);
      padding: 11px;
      min-height: 70px;
      display: grid;
      grid-template-columns: 52px 1fr auto;
      gap: 11px;
      align-items: center;
      box-shadow: 0 12px 30px rgba(0,0,0,.16);
      animation: orderPulse 4.8s ease-in-out infinite;
    }

    .order-items {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 4px;
      width: 48px;
    }

    .order-items i {
      height: 22px;
      background: var(--rust);
      display: block;
      opacity: .9;
    }

    .order-items i:nth-child(2) { background: var(--brown); opacity: .85; }
    .order-items i:nth-child(3) { background: var(--cream-2); border: 1px solid var(--line); }
    .order-items i:nth-child(4) { background: var(--ink); opacity: .85; }

    .store-panel .order-card:nth-child(2) { animation-delay: .45s; }
    .store-panel .order-card:nth-child(3) { animation-delay: .9s; }
    .store-panel .order-card:nth-child(4) { animation-delay: 1.35s; }

    .order-card strong {
      display: block;
      font-size: 16px;
      line-height: 1;
      color: var(--ink);
      margin-bottom: 6px;
    }

    .order-card span {
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
    }

    .order-card b {
      color: var(--rust);
      font-size: 20px;
      letter-spacing: -.04em;
    }

    .order-card.leak {
      background: var(--cream-2);
      border-left: 8px solid var(--rust);
    }

    .order-card.leak .order-items i {
      background: rgba(75,33,27,.25);
      border: 1px solid rgba(75,33,27,.24);
      opacity: 1;
    }

    @keyframes orderPulse {
      0%, 100% { transform: translateY(0); opacity: .72; }
      35% { transform: translateY(-4px); opacity: 1; }
      65% { transform: translateY(2px); opacity: .88; }
    }

    .hero-metric {
      background: rgba(75,33,27,.7);
      border: 1px solid rgba(255,255,255,.18);
      padding: 20px;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 20px;
      align-items: end;
    }

    .hero-metric strong {
      color: var(--cream);
      font-size: 33px;
      line-height: .92;
      letter-spacing: -.05em;
      display: block;
      margin-bottom: 14px;
    }

    .hero-metric span {
      color: var(--cream-2);
      font-size: 14px;
      font-weight: 800;
      display: block;
      max-width: 360px;
    }

    .hero-metric .button {
      background: var(--cream);
      color: var(--brown);
    }

    .hero-metric .hero-total {
      display: block;
      color: var(--cream);
      font-size: 64px;
      line-height: .82;
      letter-spacing: -.065em;
      font-weight: 900;
      margin-bottom: 10px;
      max-width: none;
      text-transform: none;
    }

    .hero-metric .hero-total-label {
      color: var(--cream-2);
      display: block;
      font-size: 12px;
      line-height: 1.1;
      letter-spacing: .08em;
      font-weight: 900;
      text-transform: uppercase;
      margin-bottom: 12px;
      max-width: none;
    }

    .proof-strip {
      display: grid;
      grid-template-columns: 1.2fr repeat(3, 1fr);
      gap: 14px;
      margin-top: 28px;
    }

    .proof-card,
    .problem-card,
    .solution-card,
    .method-card,
    .faq-card {
      background: var(--soft);
      border: 1px solid var(--line);
      padding: 20px;
    }

    .proof-card.dark {
      background: var(--brown);
      color: var(--cream);
    }

    .proof-card strong,
    .problem-card strong,
    .solution-card strong,
    .method-card strong,
    .faq-card strong {
      display: block;
      color: var(--ink);
      font-size: 25px;
      line-height: 1;
      letter-spacing: -.035em;
      margin-bottom: 12px;
      font-weight: 900;
    }

    .proof-card.dark strong { color: var(--cream); }

    .proof-card span,
    .problem-card span,
    .solution-card span,
    .method-card span,
    .faq-card span {
      color: var(--muted);
      font-size: 16px;
      line-height: 1.34;
      font-weight: 730;
    }

    .proof-card.dark span { color: var(--cream-2); }

    .proof-number {
      display: block;
      font-size: 52px;
      line-height: .86;
      letter-spacing: -.06em;
      font-weight: 900;
      margin-bottom: 12px;
    }

    .problem-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin-top: 28px;
    }

    .problem-card {
      min-height: 318px;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      gap: 12px;
    }

    .problem-card em {
      color: var(--rust);
      font-style: normal;
      text-transform: uppercase;
      letter-spacing: .08em;
      font-size: 12px;
      font-weight: 900;
      margin-bottom: 4px;
    }

    .problem-card strong {
      margin-bottom: 0;
    }

    .problem-card span {
      margin-top: 0;
    }

    .problem-card .problem-visual {
      margin: 0;
    }

    .problem-visual,
    .solution-visual {
      height: 82px;
      margin: 16px 0;
      background: var(--cream-2);
      border: 1px solid var(--line);
      position: relative;
      overflow: hidden;
    }

    .problem-visual::before,
    .problem-visual::after,
    .solution-visual::before,
    .solution-visual::after {
      content: "";
      position: absolute;
      background: var(--rust);
      animation: visualPulse 4.6s ease-in-out infinite;
    }

    .problem-visual::after,
    .solution-visual::after {
      animation-delay: .8s;
    }

    @keyframes visualPulse {
      0%, 100% { opacity: .74; }
      50% { opacity: 1; }
    }

    .visual-ads::before {
      left: 18px;
      bottom: 18px;
      width: 42px;
      height: 38px;
    }

    .visual-ads::after {
      left: 76px;
      bottom: 18px;
      width: 96px;
      height: 8px;
      transform: rotate(-14deg);
      transform-origin: left center;
    }

    .visual-data::before {
      left: 20px;
      top: 22px;
      width: 170px;
      height: 2px;
      box-shadow: 0 18px 0 var(--rust), 0 36px 0 var(--rust);
    }

    .visual-data::after {
      right: 22px;
      top: 20px;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: transparent;
      border: 7px solid var(--rust);
    }

    .visual-content::before {
      left: 20px;
      top: 18px;
      width: 54px;
      height: 46px;
      border-radius: 50%;
    }

    .visual-content::after {
      left: 92px;
      top: 30px;
      width: 126px;
      height: 20px;
      background: var(--brown);
    }

    .visual-web::before {
      left: 22px;
      top: 18px;
      width: 164px;
      height: 46px;
      background: transparent;
      border: 4px solid var(--rust);
    }

    .visual-web::after {
      right: 28px;
      top: 30px;
      width: 44px;
      height: 22px;
      background: var(--brown);
    }

    .visual-chaos::before {
      left: 20px;
      top: 18px;
      width: 190px;
      height: 3px;
      transform: rotate(14deg);
      box-shadow: 0 18px 0 var(--rust), 0 36px 0 var(--rust);
    }

    .visual-chaos::after {
      right: 22px;
      bottom: 18px;
      width: 28px;
      height: 28px;
      transform: rotate(45deg);
      background: var(--brown);
    }

    .visual-aov::before {
      left: 22px;
      bottom: 16px;
      width: 42px;
      height: 26px;
      box-shadow: 54px -12px 0 var(--rust), 108px -24px 0 var(--rust);
    }

    .visual-aov::after {
      right: 22px;
      top: 18px;
      width: 58px;
      height: 58px;
      border-radius: 50%;
      background: transparent;
      border: 5px solid var(--brown);
    }

    .solution-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin-top: 28px;
    }

    .solution-card {
      background: var(--brown);
      min-height: 286px;
      color: var(--cream);
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      gap: 13px;
    }

    .solution-card strong { color: var(--cream); }
    .solution-card span { color: var(--cream-2); }

    .solution-card > strong {
      min-height: 78px;
      margin-bottom: 0;
    }

    .solution-card > span {
      min-height: 116px;
    }

    .solution-visual {
      border-color: rgba(255,255,255,.2);
      background: rgba(255,255,255,.1);
      margin: 0;
    }

    .solution-visual::before,
    .solution-visual::after {
      background: var(--cream);
    }

    .solution-traffic::before {
      left: 20px;
      top: 34px;
      width: 185px;
      height: 5px;
    }

    .solution-traffic::after {
      right: 24px;
      top: 22px;
      width: 38px;
      height: 30px;
      border: 5px solid var(--cream);
      background: transparent;
    }

    .solution-aov::before {
      left: 24px;
      bottom: 18px;
      width: 38px;
      height: 24px;
      box-shadow: 52px -12px 0 var(--cream), 104px -26px 0 var(--cream);
    }

    .solution-aov::after {
      right: 26px;
      top: 22px;
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: transparent;
      border: 5px solid var(--cream);
    }

    .solution-repeat::before {
      left: 28px;
      top: 24px;
      width: 52px;
      height: 34px;
      border-radius: 50%;
      background: transparent;
      border: 5px solid var(--cream);
    }

    .solution-repeat::after {
      right: 28px;
      top: 34px;
      width: 128px;
      height: 4px;
      box-shadow: 0 16px 0 var(--cream);
    }

    .problem-visual::before,
    .problem-visual::after,
    .solution-visual::before,
    .solution-visual::after {
      content: none;
    }

    .problem-visual,
    .solution-visual {
      height: auto;
      min-height: 124px;
      padding: 10px;
      display: grid;
      gap: 8px;
      align-content: stretch;
    }

    .visual-ui {
      color: var(--brown);
    }

    .ui-row,
    .ui-header,
    .ui-footer,
    .ui-flow,
    .ui-cart-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .ui-chip,
    .ui-tile,
    .ui-phone,
    .ui-post,
    .ui-product,
    .ui-metric,
    .ui-step,
    .ui-mail,
    .ui-bundle,
    .ui-cart-row {
      background: rgba(255,255,255,.42);
      border: 1px solid rgba(75,33,27,.14);
      padding: 7px;
      min-width: 0;
    }

    .ui-chip,
    .ui-footer {
      font-size: 11px;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .06em;
      color: var(--rust);
    }

    .ui-tile strong,
    .ui-phone strong,
    .ui-post strong,
    .ui-product strong,
    .ui-metric strong,
    .ui-step strong,
    .ui-mail strong,
    .ui-bundle strong,
    .ui-cart-row strong {
      display: block;
      color: var(--ink);
      font-size: 14px;
      line-height: 1;
      letter-spacing: -.02em;
      margin: 0 0 5px;
    }

    .ui-tile span,
    .ui-phone span,
    .ui-post span,
    .ui-product span,
    .ui-metric span,
    .ui-step span,
    .ui-mail span,
    .ui-bundle span,
    .ui-cart-row span {
      color: var(--muted);
      display: block;
      font-size: 11px;
      line-height: 1.15;
      font-weight: 850;
      margin: 0;
    }

    .ui-bar {
      height: 7px;
      background: rgba(75,33,27,.15);
      margin-top: 6px;
      overflow: hidden;
    }

    .ui-bar i {
      display: block;
      height: 100%;
      background: var(--rust);
    }

    .visual-ads {
      grid-template-columns: 1fr 1fr;
    }

    .visual-ads .ui-footer {
      grid-column: 1 / -1;
      background: rgba(176,90,60,.12);
      padding: 7px;
    }

    .visual-data {
      grid-template-columns: repeat(3, 1fr);
    }

    .visual-data .ui-footer {
      grid-column: 1 / -1;
      justify-content: flex-start;
      color: var(--brown);
    }

    .visual-content {
      grid-template-columns: 1fr 1fr 1fr;
    }

    .ui-post {
      display: grid;
      align-content: space-between;
      min-height: 78px;
    }

    .ui-post::before {
      content: "";
      display: block;
      height: 34px;
      background: linear-gradient(135deg, var(--rust), var(--brown));
      margin-bottom: 7px;
    }

    .visual-web {
      grid-template-columns: 1fr 1.1fr;
    }

    .ui-phone {
      min-height: 102px;
      display: grid;
      align-content: space-between;
      background: rgba(255,255,255,.56);
    }

    .ui-product {
      min-height: 102px;
      display: grid;
      align-content: space-between;
    }

    .ui-product::before,
    .ui-bundle::before {
      content: "";
      display: block;
      height: 34px;
      background: var(--rust);
      margin-bottom: 7px;
    }

    .visual-chaos {
      grid-template-columns: 1fr;
    }

    .visual-chaos .ui-row {
      background: rgba(255,255,255,.42);
      border: 1px solid rgba(75,33,27,.14);
      padding: 7px;
    }

    .visual-aov {
      grid-template-columns: 1fr 1fr;
    }

    .visual-aov .ui-cart-row {
      grid-column: 1 / -1;
    }

    .solution-visual {
      min-height: 132px;
      color: var(--cream);
      padding: 10px;
    }

    .visual-aov .ui-bundle::before,
    .solution-aov .ui-bundle::before {
      height: 24px;
    }

    .solution-visual .ui-chip,
    .solution-visual .ui-step,
    .solution-visual .ui-mail,
    .solution-visual .ui-bundle,
    .solution-visual .ui-metric {
      background: rgba(255,255,255,.12);
      border-color: rgba(255,255,255,.18);
      color: var(--cream-2);
    }

    .solution-visual strong,
    .solution-visual .ui-step strong,
    .solution-visual .ui-mail strong,
    .solution-visual .ui-bundle strong,
    .solution-visual .ui-metric strong {
      color: var(--cream);
    }

    .solution-visual span,
    .solution-visual .ui-step span,
    .solution-visual .ui-mail span,
    .solution-visual .ui-bundle span,
    .solution-visual .ui-metric span {
      color: var(--cream-2);
    }

    .solution-traffic {
      grid-template-columns: repeat(3, 1fr);
    }

    .solution-aov {
      grid-template-columns: 1fr 1fr;
    }

    .solution-aov .ui-metric {
      grid-column: 1 / -1;
    }

    .solution-repeat {
      grid-template-columns: repeat(3, 1fr);
    }

    .problem-visual.ref-graphic,
    .solution-visual.ref-graphic {
      height: 190px;
      min-height: 190px;
      background: #f8f3e8;
      border: 1px solid rgba(75,33,27,.16);
      border-radius: 8px;
      padding: 12px;
      display: grid;
      gap: 8px;
      overflow: hidden;
      color: var(--brown);
    }

    .problem-visual.ref-graphic::before,
    .problem-visual.ref-graphic::after,
    .solution-visual.ref-graphic::before,
    .solution-visual.ref-graphic::after {
      content: none;
    }

    .solution-visual.ref-graphic {
      background: rgba(255,255,255,.1);
      border-color: rgba(255,255,255,.18);
      color: var(--cream);
    }

    .ref-top,
    .ref-line,
    .ref-order,
    .ref-flow {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .ref-top {
      color: var(--muted);
      font-size: 11px;
      line-height: 1;
      text-transform: uppercase;
      letter-spacing: .08em;
      font-weight: 900;
    }

    .solution-visual .ref-top {
      color: var(--cream-2);
    }

    .ref-dot {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      background: var(--rust);
      display: inline-block;
      box-shadow: -15px 0 0 rgba(176,90,60,.42), -30px 0 0 rgba(176,90,60,.22);
    }

    .ref-metric {
      background: rgba(255,255,255,.55);
      border: 1px solid rgba(75,33,27,.12);
      border-radius: 8px;
      padding: 12px;
      display: grid;
      align-content: center;
      min-height: 86px;
    }

    .solution-visual .ref-metric,
    .solution-visual .ref-order,
    .solution-visual .ref-flow > div,
    .solution-visual .ref-browser {
      background: rgba(255,255,255,.12);
      border-color: rgba(255,255,255,.16);
    }

    .ref-metric strong {
      color: var(--ink);
      display: block;
      font-size: clamp(30px, 3.6vw, 44px);
      line-height: .82;
      letter-spacing: -.06em;
      margin: 0 0 8px;
      overflow-wrap: anywhere;
    }

    .solution-visual .ref-metric strong {
      color: var(--cream);
    }

    .ref-metric span,
    .ref-order span,
    .ref-browser span,
    .ref-flow span {
      color: var(--muted);
      display: block;
      font-size: 12px;
      line-height: 1.2;
      font-weight: 850;
      margin: 0;
    }

    .solution-visual .ref-metric span,
    .solution-visual .ref-order span,
    .solution-visual .ref-browser span,
    .solution-visual .ref-flow span {
      color: var(--cream-2);
    }

    .ref-line {
      background: rgba(255,255,255,.44);
      border: 1px solid rgba(75,33,27,.1);
      border-radius: 8px;
      padding: 8px;
      color: var(--brown);
      font-size: 12px;
      font-weight: 900;
    }

    .ref-browser {
      min-height: 126px;
      background: rgba(255,255,255,.56);
      border: 1px solid rgba(75,33,27,.12);
      border-radius: 8px;
      overflow: hidden;
      display: grid;
      grid-template-rows: auto 1fr;
    }

    .ref-browser-head {
      background: rgba(75,33,27,.09);
      padding: 7px 9px;
      display: flex;
      justify-content: space-between;
      color: var(--muted);
      font-size: 10px;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .08em;
    }

    .solution-visual .ref-browser-head {
      background: rgba(255,255,255,.12);
      color: var(--cream-2);
    }

    .ref-browser-body {
      padding: 10px;
      display: grid;
      gap: 8px;
      align-content: stretch;
    }

    .ref-product-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 6px;
    }

    .ref-product {
      min-height: 46px;
      background: rgba(176,90,60,.2);
      border-radius: 6px;
      border: 1px solid rgba(75,33,27,.1);
    }

    .ref-product:nth-child(2) { background: rgba(75,33,27,.18); }
    .ref-product:nth-child(3) { background: rgba(176,90,60,.32); }

    .ref-cta {
      background: var(--brown);
      color: var(--cream);
      border-radius: 6px;
      padding: 8px 10px;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .06em;
      font-weight: 900;
      text-align: center;
    }

    .ref-order {
      background: rgba(255,255,255,.52);
      border: 1px solid rgba(75,33,27,.11);
      border-radius: 8px;
      padding: 9px;
    }

    .ref-order strong,
    .ref-flow strong,
    .ref-browser strong {
      color: var(--ink);
      display: block;
      font-size: 14px;
      line-height: 1;
      margin: 0 0 4px;
    }

    .solution-visual .ref-order strong,
    .solution-visual .ref-flow strong,
    .solution-visual .ref-browser strong {
      color: var(--cream);
    }

    .ref-order b {
      color: var(--rust);
      font-size: 20px;
      letter-spacing: -.04em;
      white-space: nowrap;
    }

    .solution-visual .ref-order b {
      color: var(--cream);
    }

    .ref-flow {
      min-height: 110px;
    }

    .ref-flow > div {
      flex: 1;
      background: rgba(255,255,255,.52);
      border: 1px solid rgba(75,33,27,.11);
      border-radius: 8px;
      padding: 10px 8px;
      min-height: 88px;
      display: grid;
      align-content: center;
      text-align: center;
      position: relative;
    }

    .ref-flow > div:not(:last-child)::after {
      content: "";
      position: absolute;
      right: -13px;
      top: 50%;
      width: 18px;
      height: 2px;
      background: var(--rust);
      z-index: 2;
    }

    .solution-flow .ref-flow > div:not(:last-child)::after {
      content: "→";
      right: -15px;
      top: 50%;
      width: auto;
      height: auto;
      background: transparent;
      color: var(--cream);
      display: block;
      font-size: 24px;
      font-weight: 900;
      transform: translateY(-50%);
      animation: none;
    }

    .solution-flow .ref-flow {
      gap: 14px;
    }

    .solution-flow .ref-flow > div {
      min-width: 0;
      padding: 8px 6px;
    }

    .solution-flow .ref-flow strong {
      font-size: 15px;
    }

    .solution-flow .ref-flow span {
      font-size: 11px;
    }

    .ref-cac,
    .ref-aov-big {
      grid-template-rows: auto 1fr auto;
    }

    .ref-dashboard {
      grid-template-columns: repeat(3, 1fr);
      align-items: stretch;
    }

    .ref-dashboard .ref-top,
    .ref-dashboard .ref-line {
      grid-column: 1 / -1;
    }

    .ref-dashboard .ref-metric {
      min-height: 72px;
      padding: 10px;
    }

    .ref-dashboard .ref-metric strong {
      font-size: 25px;
      letter-spacing: -.04em;
    }

    .ref-template {
      grid-template-columns: 1fr;
    }

    .ref-split {
      grid-template-columns: 1fr 1fr;
    }

    .ref-orders {
      grid-template-rows: auto repeat(3, 1fr);
    }

    .metric-board {
      grid-template-columns: 1fr;
      grid-template-rows: repeat(3, 1fr);
      align-content: stretch;
      gap: 6px;
    }

    .metric-row {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
      gap: 4px;
      background: rgba(255,255,255,.52);
      border: 1px solid rgba(75,33,27,.12);
      border-radius: 8px;
      padding: 8px 72px 8px 14px;
      min-width: 0;
      min-height: 0;
    }

    .metric-row > div:first-child {
      display: contents;
    }

    .metric-row .trend-box {
      display: none;
    }

    .metric-row span,
    .metric-row small {
      display: block;
      color: var(--muted);
      font-size: 9px;
      line-height: 1;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .06em;
      margin: 0;
    }

    .metric-row strong {
      color: var(--ink);
      display: block;
      font-size: 20px;
      line-height: 1;
      letter-spacing: -.045em;
      margin: 0;
    }

    .problem-card em.metric-percent,
    .metric-percent {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      color: var(--rust);
      padding: 0;
      font-size: 20px;
      line-height: 1;
      letter-spacing: -.045em;
      font-weight: 900;
      font-style: normal;
      text-transform: none;
      white-space: nowrap;
      border: 0;
      background: transparent;
      border-radius: 0;
      margin: 0;
    }

    .metric-row small {
      color: var(--rust);
    }

    .trend-box {
      min-width: 0;
      position: relative;
      height: 34px;
      overflow: hidden;
    }

    .trend {
      width: 100%;
      min-width: 0;
      height: 34px;
      align-self: center;
      overflow: visible;
    }

    .trend path {
      fill: none;
    }

    .trend > path {
      stroke: var(--rust);
      stroke-width: 8;
      stroke-linecap: butt;
      stroke-linejoin: miter;
      stroke-dasharray: 180;
      stroke-dashoffset: 180;
      animation: trendDraw 1.35s ease-out forwards;
    }

    .trend marker path {
      fill: none;
      stroke: none;
    }

    .trend marker .marker-fill {
      fill: var(--rust);
      stroke: none;
    }

    .trend polyline {
      display: none;
    }

    @keyframes trendDraw {
      to { stroke-dashoffset: 0; }
    }

    .confusion-flow {
      min-height: 190px;
      position: relative;
      display: block;
    }

    .confusion-flow svg,
    .loop-graphic svg {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
    }

    .confusion-flow path,
    .loop-graphic path {
      fill: none;
    }

    .confusion-flow svg > path {
      stroke: var(--rust);
      stroke-width: 3;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-dasharray: 7 8;
      animation: dashMove 6s linear infinite;
    }

    .loop-graphic svg > path {
      stroke: var(--rust);
      stroke-width: 3;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-dasharray: none;
      animation: none;
    }

    .confusion-flow marker .marker-fill,
    .loop-graphic marker .marker-fill {
      fill: var(--rust);
      stroke: none;
    }

    @keyframes dashMove {
      to { stroke-dashoffset: -90; }
    }

    .flow-node,
    .loop-node {
      position: absolute;
      background: rgba(255,255,255,.72);
      border: 1px solid rgba(75,33,27,.14);
      color: var(--ink);
      border-radius: 8px;
      padding: 9px 10px;
      font-size: 12px;
      line-height: 1.05;
      font-weight: 900;
      width: 118px;
      min-height: 42px;
      display: grid;
      place-items: center;
      text-align: center;
      box-shadow: 0 10px 24px rgba(75,33,27,.08);
    }

    .flow-a { left: 4%; top: 8%; }
    .flow-b { right: 7%; top: 16%; }
    .flow-c { left: 12%; bottom: 10%; }
    .flow-d { right: 4%; bottom: 18%; }

    .instagram-graphic {
      min-height: 190px;
      grid-template-rows: auto 1fr;
    }

    .ig-head {
      display: block;
      text-align: center;
      color: var(--muted);
      font-size: 11px;
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .08em;
    }

    .ig-head span {
      display: block;
      width: 100%;
    }

    .ig-grid {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: repeat(3, minmax(0, 1fr));
      gap: 6px;
      align-content: stretch;
      min-height: 0;
    }

    .reel-card {
      background: linear-gradient(135deg, rgba(176,90,60,.34), rgba(75,33,27,.18));
      border: 1px solid rgba(75,33,27,.12);
      border-radius: 8px;
      width: 100%;
      min-height: 0;
      padding: 6px 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      text-align: center;
    }

    .reel-card::before {
      content: none;
    }

    .reel-card strong {
      color: var(--ink);
      font-size: 13px;
      line-height: 1.05;
      letter-spacing: -.02em;
      margin: 0;
      padding: 0;
      position: relative;
      z-index: 1;
    }

    .loop-graphic {
      min-height: 190px;
      position: relative;
      display: block;
    }

    .loop-node {
      text-align: center;
      width: 108px;
      min-height: 42px;
    }

    .loop-top { left: 50%; top: 4%; transform: translateX(-50%); }
    .loop-right { right: 2%; top: 42%; transform: translateY(-50%); }
    .loop-bottom { left: 50%; bottom: 4%; transform: translateX(-50%); }
    .loop-left { left: 2%; top: 42%; transform: translateY(-50%); }

    .shopify-list {
      min-height: 190px;
      grid-template-rows: auto repeat(3, minmax(0, 1fr));
      gap: 6px;
      align-content: center;
    }

    .shop-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
      align-items: center;
      background: rgba(255,255,255,.58);
      border: 1px solid rgba(75,33,27,.12);
      border-radius: 8px;
      padding: 7px 10px;
      min-height: 0;
    }

    .shop-row > div {
      display: flex;
      flex-direction: column;
      gap: 2px;
      min-width: 0;
    }

    .shop-row strong {
      color: var(--ink);
      font-size: 13px;
      line-height: 1;
      margin: 0;
      display: block;
    }

    .shop-row span {
      color: var(--muted);
      font-size: 11px;
      line-height: 1;
      font-weight: 850;
      margin: 0;
      display: block;
    }

    .shop-row b {
      color: var(--rust);
      font-size: 14px;
      letter-spacing: -.04em;
      white-space: nowrap;
    }

    .shop-row.refund b {
      color: var(--bad);
    }

    .cta-band {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 24px;
      align-items: center;
      background: var(--brown);
      color: var(--cream);
      padding: 34px;
      margin-top: 34px;
    }

    .cta-band h2 {
      color: var(--cream);
      margin-bottom: 10px;
    }

    .cta-band p {
      color: var(--cream-2);
      max-width: 780px;
    }

    .cta-band .button {
      background: var(--cream);
      color: var(--brown);
    }

    .method-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
      margin-top: 28px;
    }

    .method-card {
      min-height: 210px;
      position: relative;
    }

    .method-card em {
      display: inline-block;
      color: var(--cream);
      background: var(--rust);
      padding: 8px 10px;
      font-style: normal;
      font-size: 13px;
      font-weight: 900;
      letter-spacing: .06em;
      text-transform: uppercase;
      margin-bottom: 12px;
    }

    .guarantee-band {
      display: grid;
      grid-template-columns: .8fr 1.2fr;
      gap: 24px;
      background: var(--cream-2);
      border: 1px solid var(--line);
      padding: 28px;
      margin-top: 18px;
      align-items: center;
    }

    .guarantee-band > strong {
      color: var(--ink);
      font-size: 34px;
      line-height: .95;
      letter-spacing: -.045em;
      display: block;
    }

    .guarantee-band p strong {
      color: var(--ink);
      font-size: inherit;
      line-height: inherit;
      letter-spacing: 0;
      display: inline;
      font-weight: 900;
    }

    .faq-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
      margin-top: 28px;
    }

    .faq-card {
      min-height: 158px;
    }

    .quiz-wrap {
      display: grid;
      grid-template-columns: 1fr 320px;
      gap: 24px;
      align-items: start;
    }

    .quiz {
      background: rgba(255,255,255,.25);
      border: 1px solid var(--line);
      padding: 26px;
      min-height: 560px;
    }

    .quiz-top {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      align-items: center;
      margin-bottom: 22px;
    }

    .progress-text {
      font-size: 13px;
      color: var(--muted);
      text-transform: uppercase;
      letter-spacing: .08em;
      font-weight: 900;
    }

    .progress {
      height: 10px;
      background: rgba(75,33,27,.1);
      margin-bottom: 30px;
      overflow: hidden;
    }

    .progress span {
      display: block;
      height: 100%;
      background: var(--rust);
      width: 0%;
      transition: width .25s ease;
    }

    .question-block {
      min-height: 332px;
    }

    .question-block h2 {
      margin-bottom: 12px;
      max-width: 760px;
    }

    .hint {
      color: var(--muted);
      font-size: 16px;
      font-weight: 700;
      margin-bottom: 24px;
    }

    .options {
      display: grid;
      gap: 10px;
      max-width: 820px;
    }

    .option {
      border: 1px solid var(--line);
      background: rgba(255,255,255,.24);
      color: var(--brown);
      padding: 15px 16px;
      min-height: 54px;
      text-align: left;
      font-family: inherit;
      font-size: 16px;
      line-height: 1.18;
      font-weight: 800;
      cursor: pointer;
    }

    .option:hover,
    .option.active {
      border-color: var(--brown);
      background: var(--brown);
      color: var(--cream);
    }

    .text-input,
    textarea {
      width: 100%;
      border: 1px solid var(--line);
      background: rgba(255,255,255,.35);
      color: var(--ink);
      font-family: inherit;
      font-size: 17px;
      padding: 15px 16px;
      outline: 0;
      border-radius: 0;
    }

    textarea {
      min-height: 128px;
      resize: vertical;
    }

    .other-field {
      margin-top: 12px;
      max-width: 640px;
      display: none;
    }

    .other-field.visible { display: block; }

    .quiz-actions {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      margin-top: 28px;
    }

    .side {
      background: var(--brown);
      color: var(--cream);
      padding: 22px;
      position: sticky;
      top: 18px;
    }

    .side h3 {
      color: var(--cream);
      margin-bottom: 16px;
    }

    .side p,
    .side li {
      color: var(--cream-2);
      font-size: 15px;
      line-height: 1.35;
    }

    .side ul {
      padding-left: 18px;
      margin: 14px 0 0;
    }

    .side li { margin-bottom: 8px; }

    .capture {
      display: none;
    }

    .capture.visible {
      display: block;
    }

    .capture-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
      margin-top: 24px;
      max-width: 860px;
    }

    .field label {
      display: block;
      color: var(--muted);
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: .08em;
      font-weight: 900;
      margin-bottom: 7px;
    }

    .result {
      display: none;
      background: var(--brown);
      color: var(--cream);
      padding: 30px;
      margin-top: 24px;
    }

    .result.visible {
      display: block;
    }

    .processing {
      display: none;
      background: var(--brown);
      color: var(--cream);
      padding: 40px 30px;
      margin-top: 24px;
      text-align: center;
    }

    .processing.visible { display: block; }

    .processing h2 {
      color: var(--cream);
      font-size: 28px;
      margin: 0 0 12px;
    }

    .processing p {
      color: var(--cream-2);
      max-width: 520px;
      margin: 0 auto;
      font-size: 16px;
    }

    .spinner {
      width: 56px;
      height: 56px;
      border: 4px solid rgba(255,255,255,.18);
      border-top-color: var(--cream);
      border-radius: 50%;
      animation: spinnerSpin .9s linear infinite;
      margin: 0 auto 24px;
    }

    @keyframes spinnerSpin {
      to { transform: rotate(360deg); }
    }

    .processing-steps {
      display: flex;
      flex-direction: column;
      gap: 6px;
      max-width: 360px;
      margin: 24px auto 0;
      text-align: left;
    }

    .processing-step {
      display: flex;
      align-items: center;
      gap: 10px;
      color: var(--cream-2);
      font-size: 14px;
      opacity: .55;
      transition: opacity .3s;
    }

    .processing-step.active { opacity: 1; color: var(--cream); }
    .processing-step.done { opacity: .85; }

    .processing-step::before {
      content: "○";
      display: inline-block;
      width: 14px;
      text-align: center;
      color: var(--cream-2);
    }

    .processing-step.active::before {
      content: "●";
      color: var(--rust);
    }

    .processing-step.done::before {
      content: "✓";
      color: var(--cream);
    }

    .success {
      display: none;
      background: var(--brown);
      color: var(--cream);
      padding: 40px 30px;
      margin-top: 24px;
      text-align: center;
    }

    .success.visible { display: block; }

    .success h2 {
      color: var(--cream);
      font-size: 32px;
      margin: 0 0 12px;
    }

    .success p {
      color: var(--cream-2);
      max-width: 560px;
      margin: 0 auto 16px;
      font-size: 16px;
    }

    .success .check-icon {
      width: 64px;
      height: 64px;
      border: 3px solid var(--cream);
      border-radius: 50%;
      margin: 0 auto 24px;
      display: grid;
      place-items: center;
      font-size: 32px;
      color: var(--cream);
      line-height: 1;
    }

    .error-state {
      display: none;
      background: var(--brown);
      color: var(--cream);
      padding: 30px;
      margin-top: 24px;
    }

    .error-state.visible { display: block; }

    .error-state h2 {
      color: var(--cream);
      font-size: 24px;
      margin: 0 0 12px;
    }

    .error-state p {
      color: var(--cream-2);
      margin-bottom: 16px;
    }

    .error-state .actions {
      margin-top: 12px;
    }

    .result-grid {
      display: grid;
      grid-template-columns: 180px 1fr;
      gap: 24px;
      margin-top: 20px;
    }

    .result-score {
      font-size: 70px;
      line-height: .85;
      letter-spacing: -0.06em;
      font-weight: 900;
      color: var(--cream);
    }

    .result p {
      color: var(--cream-2);
      max-width: 760px;
    }

    .result strong { color: var(--cream); }

    .mini-table {
      display: grid;
      gap: 8px;
      margin-top: 18px;
    }

    .mini-row {
      display: grid;
      grid-template-columns: 140px 1fr;
      gap: 12px;
      padding-top: 8px;
      border-top: 1px solid rgba(255,255,255,.18);
      color: var(--cream-2);
      font-size: 15px;
    }

    .mini-row strong { color: var(--cream); }

    .next {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      margin-top: 24px;
    }

    .next div {
      background: var(--soft);
      border-top: 3px solid var(--rust);
      padding: 20px;
    }

    .next strong {
      display: block;
      color: var(--ink);
      font-size: 24px;
      line-height: 1;
      letter-spacing: -0.03em;
      margin-bottom: 10px;
    }

    .next p {
      color: var(--muted);
      font-size: 16px;
    }

    .footer-cta {
      background: var(--brown);
      color: var(--cream);
      padding: 40px;
      margin-top: 72px;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 24px;
      align-items: center;
    }

    .footer-cta h2 {
      color: var(--cream);
      margin-bottom: 12px;
    }

    .footer-cta p {
      color: var(--cream-2);
      max-width: 840px;
    }

    .footer-cta .button {
      background: var(--cream);
      color: var(--brown);
    }

    @media (prefers-reduced-motion: reduce) {
      .belief-track,
      .shopify-note,
      .order-card,
      .problem-visual::before,
      .problem-visual::after,
      .solution-visual::before,
      .solution-visual::after {
        animation: none;
      }
    }

    @media (max-width: 940px) {
      .page { padding: 22px 18px 60px; }
      .hero,
      .hero-v2,
      .section-head,
      .quiz-wrap,
      .footer-cta,
      .cta-band,
      .guarantee-band,
      .calculator {
        grid-template-columns: 1fr;
      }
      .hero-v2 {
        grid-template-columns: minmax(0, 1fr);
      }
      .hero { min-height: auto; }
      h1 { font-size: 56px; }
      h2 { font-size: 34px; }
      .lead { font-size: 21px; }
      .pain-grid,
      .pain-grid.four,
      .impact-grid,
      .authority-grid,
      .offer-grid,
      .proof-strip,
      .problem-grid,
      .solution-grid,
      .method-grid,
      .faq-grid,
      .next,
      .capture-grid {
        grid-template-columns: 1fr;
      }
      .market-note { grid-template-columns: 1fr; }
      .hero-visual {
        aspect-ratio: auto;
        min-height: 0;
      }
      .notification-cloud {
        width: min(100%, 560px);
        height: 520px;
        min-height: 0;
      }
      .calc-output { min-height: 420px; }
      .calc-row { grid-template-columns: 1fr; }
      .nav-links { display: none; }
      .hero-panel { min-height: 420px; }
      .side { position: static; }
      .result-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 620px) {
      .hero-v2 {
        display: flex;
        flex-direction: column;
        gap: 0;
      }
      .hero-copy {
        display: contents;
      }
      .hero-copy .eyebrow { order: 1; }
      .hero-copy h1 {
        order: 2;
        font-size: clamp(50px, 13.2vw, 56px);
        margin-bottom: 14px;
      }
      .hero-copy .lead {
        order: 3;
        margin-bottom: 18px;
      }
      .hero-visual {
        order: 4;
        margin-bottom: 30px;
      }
      .belief-ticker {
        order: 5;
        width: 100%;
        margin: 0 0 22px;
      }
      .actions {
        order: 6;
      }
      .hero-visual {
        min-height: 0;
        padding: 12px;
      }
      .notification-cloud {
        height: 520px;
        padding-top: 46px;
      }
      .hero-tabs {
        gap: 6px;
      }
      .hero-tab {
        padding: 9px 8px;
        font-size: 10px;
        letter-spacing: .04em;
      }
      .hero-tab-panel {
        inset: 46px 0 0;
      }
      .shopify-note {
        width: min(86%, 300px);
        grid-template-columns: 34px 1fr auto;
        min-height: 62px;
        padding: 8px;
        gap: 8px;
        box-shadow: 0 12px 28px rgba(75,33,27,.12);
      }
      .note-icon {
        width: 34px;
        height: 34px;
        font-size: 16px;
      }
      .note-copy strong {
        font-size: 13px;
        margin-bottom: 4px;
      }
      .note-copy span {
        font-size: 10px;
      }
      .note-time {
        font-size: 9px;
        margin-top: 3px;
      }
      .note-amount {
        grid-column: auto;
        justify-self: end;
        font-size: 15px;
      }
      .note-a { left: 0; right: auto; top: 0; transform: rotate(-1.5deg); }
      .note-b { left: auto; right: 0; top: 70px; transform: rotate(1.5deg); }
      .note-c { left: 0; right: auto; top: 140px; transform: rotate(1.2deg); }
      .note-d { left: auto; right: 0; top: 210px; bottom: auto; transform: rotate(-1.2deg); }
      .mini-kpi {
        display: none;
      }
      .revenue-panel {
        left: 0;
        right: 0;
        bottom: 0;
        padding: 16px;
      }
      .revenue-panel strong {
        font-size: 42px;
      }
      .revenue-panel p {
        font-size: 12px;
      }
      .section-kicker {
        font-size: 15px;
      }
      .problem-visual.ref-graphic,
      .solution-visual.ref-graphic {
        min-height: 190px;
      }
      .ref-dashboard,
      .ref-split {
        grid-template-columns: 1fr;
      }
      .ref-dashboard .ref-top,
      .ref-dashboard .ref-line {
        grid-column: auto;
      }
      .metric-row {
        grid-template-columns: minmax(128px, .84fr) minmax(0, 1fr);
        padding: 8px;
      }
      .metric-row strong {
        font-size: 17px;
      }
      .metric-percent {
        font-size: 19px;
        padding: 0;
      }
      .trend {
        height: 40px;
      }
      .ig-grid {
        gap: 6px;
      }
      .reel-card {
        min-height: 126px;
        padding: 7px;
      }
      .reel-card strong {
        font-size: 13px;
      }
      .ref-flow {
        gap: 8px;
      }
      .ref-flow > div {
        min-height: 76px;
        padding: 8px 6px;
      }
      .solution-card > strong,
      .solution-card > span {
        min-height: 0;
      }
    }

    /* ─── OVERRIDE FINAL: textos cream en cajas processing/success/error ─── */
    /* Estas reglas van al final del archivo para garantizar prioridad sobre
       cualquier override anterior de color que pueda haber pisado las cajas oscuras. */
    body .processing, body .processing h2, body .processing p, body .processing div, body .processing span,
    body .success, body .success h2, body .success p, body .success div, body .success span,
    body .error-state, body .error-state h2, body .error-state p, body .error-state div, body .error-state span,
    body .processing-step,
    body .processing-step.active,
    body .processing-step.done {
      color: #f3efe4 !important;
    }
    body .processing-step { color: rgba(243,239,228,.6) !important; }
    body .processing-step.active { color: #f3efe4 !important; }
    body .processing-step.done { color: rgba(243,239,228,.85) !important; }

/* Exact inline CSS extracted from revenue-leak-scoreboard-v2.html. */
:root {
      --v2-cream: #f3efe4;
      --v2-cream-2: #eee7dc;
      --v2-paper: #fffdfa;
      --v2-brown: #4b211b;
      --v2-rust: #b05a3c;
      --v2-rust-soft: #c97a5e;
      --v2-ink: #28130f;
      --v2-muted: #7c665e;
      --v2-line: rgba(75, 33, 27, 0.10);
      --v2-line-strong: rgba(75, 33, 27, 0.22);
      --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
      --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
      --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
      --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    /* Base */
    .v2 {
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      color: var(--v2-brown);
      background: var(--v2-cream);
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      position: relative;
      overflow-x: hidden;
    }
    .v2 h1, .v2 h2, .v2 h3, .v2 .display {
      font-family: "Geist", "Helvetica Neue", Helvetica, Arial, sans-serif;
      letter-spacing: -0.035em;
      font-weight: 800;
      color: var(--v2-ink);
      text-wrap: balance;
    }
    .v2 h1 { font-weight: 900; letter-spacing: -0.05em; }
    .v2 p { text-wrap: pretty; }
    .v2 .nums { font-variant-numeric: tabular-nums; }

    /* ═══════════════════════════════════════════════
       AMBIENT · ghost cards + grain noise overlay
       (relieve para liquid glass)
       ═══════════════════════════════════════════════ */
    .v2 .ambient {
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 0;
      overflow: hidden;
    }
    /* Grain noise overlay sutil */
    .v2 .ambient::after {
      content: "";
      position: absolute;
      inset: 0;
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.29 0 0 0 0 0.13 0 0 0 0 0.10 0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
      opacity: 0.05;
      mix-blend-mode: multiply;
    }
    /* Halos radiales para profundidad */
    .v2 .ambient::before {
      content: "";
      position: absolute;
      top: -240px; left: 50%;
      width: 1100px; height: 900px;
      transform: translateX(-50%);
      background: radial-gradient(circle, rgba(176, 90, 60, 0.16), transparent 65%);
      filter: blur(60px);
      pointer-events: none;
    }

    .v2 .ghost-card {
      position: absolute;
      background: rgba(255, 255, 255, 0.98);
      border: 1.5px solid rgba(75, 33, 27, 0.22);
      border-radius: 14px;
      padding: 14px 18px;
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 280px;
      filter: blur(8px);
      opacity: 0.72;
      will-change: transform;
      box-shadow: 0 2px 4px rgba(75, 33, 27, 0.12), 0 16px 32px rgba(75, 33, 27, 0.16);
    }
    .v2 .ghost-card strong {
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 700;
      color: var(--v2-ink);
    }
    .v2 .ghost-card span { font-size: 11px; color: var(--v2-muted); }
    .v2 .ghost-card b {
      font-family: "Geist", sans-serif;
      font-size: 15px;
      font-weight: 700;
      color: var(--v2-rust);
      font-variant-numeric: tabular-nums;
    }
    .v2 .ghost-card.gA { top:  8vh;   left:  3vw;  transform: rotate(-7deg); animation: gfA 22s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gB { top:  18vh;  right: 5vw;  transform: rotate(8deg);  animation: gfB 26s 2s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gC { top:  38vh;  left:  10vw; transform: rotate(-4deg); animation: gfA 24s 4s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gD { top:  52vh;  right: 12vw; transform: rotate(10deg); animation: gfB 28s 1s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gE { top:  72vh;  left:  4vw;  transform: rotate(-9deg); animation: gfA 30s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gF { top:  90vh;  right: 3vw;  transform: rotate(5deg);  animation: gfB 26s 3s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gG { top: 108vh;  left:  16vw; transform: rotate(-3deg); animation: gfA 27s 2s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gH { top: 126vh;  right: 8vw;  transform: rotate(11deg); animation: gfB 30s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gI { top: 148vh;  left:  6vw;  transform: rotate(-5deg); animation: gfA 28s 1s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gJ { top: 168vh;  right: 14vw; transform: rotate(7deg);  animation: gfB 25s 3s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gK { top: 192vh;  left:  10vw; transform: rotate(-8deg); animation: gfA 29s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gL { top: 218vh;  right: 5vw;  transform: rotate(9deg);  animation: gfB 27s 2s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gM { top: 248vh;  left:  4vw;  transform: rotate(-4deg); animation: gfA 31s var(--ease-in-out) infinite; }
    .v2 .ghost-card.gN { top: 278vh;  right: 12vw; transform: rotate(6deg);  animation: gfB 26s 4s var(--ease-in-out) infinite; }

    @keyframes gfA {
      0%   { transform: translateY(0)     rotate(-7deg); }
      50%  { transform: translateY(-32px) rotate(-9deg); }
      100% { transform: translateY(0)     rotate(-7deg); }
    }
    @keyframes gfB {
      0%   { transform: translateY(0)     rotate(8deg); }
      50%  { transform: translateY(28px)  rotate(10deg); }
      100% { transform: translateY(0)     rotate(8deg); }
    }

    /* ═══════════════════════════════════════════════
       NAV · pill liquid glass + burger en mobile
       ═══════════════════════════════════════════════ */
    .v2 .topbar {
      position: fixed;
      top: 16px;
      left: 50%;
      transform: translateX(-50%) translateY(-80px);
      display: flex;
      align-items: center;
      gap: 32px;
      padding: 10px 10px 10px 22px;
      width: min(960px, calc(100vw - 32px));
      max-width: 960px;
      z-index: 100;
      border-radius: 999px;
      background: rgba(255, 253, 250, 0.6);
      -webkit-backdrop-filter: blur(24px) saturate(180%);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.10);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.55),
        inset 0 -1px 0 rgba(75, 33, 27, 0.04),
        0 1px 2px rgba(75, 33, 27, 0.06),
        0 12px 32px rgba(75, 33, 27, 0.10);
      animation: nav-drop 600ms 200ms var(--ease-out) forwards;
    }
    @keyframes nav-drop {
      from { transform: translateX(-50%) translateY(-80px); opacity: 0; }
      to   { transform: translateX(-50%) translateY(0);     opacity: 1; }
    }
    .v2 .topbar.scrolled {
      background: rgba(255, 253, 250, 0.82);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.7),
        0 2px 4px rgba(75, 33, 27, 0.06),
        0 16px 40px rgba(75, 33, 27, 0.14);
    }
    .v2 .topbar .brand {
      font-family: "Geist", sans-serif;
      font-weight: 700;
      font-size: 14px;
      letter-spacing: -0.01em;
      color: var(--v2-ink);
      transition: color 200ms ease;
      white-space: nowrap;
    }
    .v2 .topbar .nav-links {
      display: flex;
      gap: 26px;
      margin-left: auto;
      margin-right: 8px;
    }
    .v2 .topbar .nav-links a {
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 500;
      color: var(--v2-brown);
      text-decoration: none;
      letter-spacing: -0.005em;
      transition: color 160ms ease;
      opacity: 0;
      animation: nav-link-in 500ms calc(400ms + var(--i, 0) * 60ms) var(--ease-out) forwards;
    }
    .v2 .topbar .nav-links a:nth-child(1) { --i: 0; }
    .v2 .topbar .nav-links a:nth-child(2) { --i: 1; }
    .v2 .topbar .nav-links a:nth-child(3) { --i: 2; }
    .v2 .topbar .nav-links a:nth-child(4) { --i: 3; }
    .v2 .topbar .nav-links a:nth-child(5) { --i: 4; }
    @keyframes nav-link-in {
      from { opacity: 0; transform: translateY(-4px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 .topbar .nav-links a:hover { color: var(--v2-rust); }
      .v2 .topbar .brand:hover { color: var(--v2-rust); }
    }

    /* Burger button */
    .v2 .burger {
      display: none;
      width: 40px; height: 40px;
      border: 0;
      background: transparent;
      cursor: pointer;
      padding: 0;
      border-radius: 999px;
      margin-left: auto;
      transition: background 160ms ease, transform 160ms var(--ease-out);
      align-items: center;
      justify-content: center;
    }
    .v2 .burger:active { transform: scale(0.94); }
    .v2 .burger span,
    .v2 .burger span::before,
    .v2 .burger span::after {
      content: "";
      display: block;
      width: 18px;
      height: 1.6px;
      background: var(--v2-ink);
      border-radius: 999px;
      transition: transform 200ms var(--ease-out), opacity 200ms ease;
    }
    .v2 .burger span { position: relative; }
    .v2 .burger span::before { position: absolute; left: 0; top: -6px; }
    .v2 .burger span::after  { position: absolute; left: 0; top:  6px; }
    .v2 .burger.open span                { background: transparent; }
    .v2 .burger.open span::before        { transform: translateY(6px) rotate(45deg); top: 0; }
    .v2 .burger.open span::after         { transform: translateY(-6px) rotate(-45deg); top: 0; }

    /* Mobile menu drawer */
    .v2 .mobile-menu {
      position: fixed;
      top: 78px;
      left: 50%;
      transform: translateX(-50%) translateY(-10px);
      width: min(420px, calc(100vw - 32px));
      z-index: 99;
      padding: 14px;
      border-radius: 22px;
      background: rgba(255, 253, 250, 0.86);
      -webkit-backdrop-filter: blur(24px) saturate(180%);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.12);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.7),
        0 1px 2px rgba(75, 33, 27, 0.06),
        0 16px 40px rgba(75, 33, 27, 0.16);
      opacity: 0;
      pointer-events: none;
      transition: opacity 240ms var(--ease-out), transform 240ms var(--ease-out);
      display: none;
    }
    .v2 .mobile-menu.open { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }
    .v2 .mobile-menu a {
      display: block;
      padding: 14px 16px;
      font-family: "Geist", sans-serif;
      font-size: 15px;
      font-weight: 600;
      color: var(--v2-ink);
      text-decoration: none;
      border-radius: 12px;
      transition: background 160ms ease;
    }
    .v2 .mobile-menu a:active { background: rgba(75, 33, 27, 0.06); }
    .v2 .mobile-menu .mm-cta {
      margin-top: 6px;
      background: var(--v2-ink);
      color: var(--v2-cream);
      text-align: center;
      padding: 16px;
      border-radius: 999px;
    }

    @media (max-width: 760px) {
      .v2 .topbar > a.button.glass { display: none; }
      .v2 .topbar .nav-links { display: none; }
      .v2 .burger { display: inline-flex; }
      .v2 .mobile-menu { display: block; }
    }

    /* ═══════════════════════════════════════════════
       BUTTONS · pill total
       ═══════════════════════════════════════════════ */
    .v2 .button,
    .v2 a.button,
    .v2 button.button {
      font-family: "Geist", "Helvetica Neue", sans-serif;
      font-weight: 600;
      letter-spacing: -0.005em;
      transition: transform 160ms var(--ease-out), background 200ms ease, box-shadow 200ms ease, color 200ms ease;
      will-change: transform;
      border-radius: 999px !important;
      padding: 14px 26px;
      font-size: 14px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      text-decoration: none;
      white-space: nowrap;
      border: 0;
      cursor: pointer;
    }
    .v2 .button:active { transform: scale(0.97); }
    .v2 .button:not(.secondary):not(.glass) {
      background: var(--v2-ink);
      color: var(--v2-cream);
      box-shadow: 0 1px 2px rgba(40, 19, 15, 0.10), 0 4px 14px rgba(40, 19, 15, 0.18);
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 .button:not(.secondary):not(.glass):hover {
        background: var(--v2-brown);
        box-shadow: 0 2px 4px rgba(40, 19, 15, 0.16), 0 10px 28px rgba(40, 19, 15, 0.22);
      }
    }
    .v2 .button.glass,
    .v2 .button.secondary {
      background: rgba(255, 253, 250, 0.62);
      -webkit-backdrop-filter: blur(16px) saturate(170%);
      backdrop-filter: blur(16px) saturate(170%);
      border: 1px solid rgba(75, 33, 27, 0.14);
      color: var(--v2-ink);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        0 1px 2px rgba(75, 33, 27, 0.04),
        0 4px 14px rgba(75, 33, 27, 0.08);
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 .button.glass:hover,
      .v2 .button.secondary:hover {
        background: rgba(255, 253, 250, 0.88);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.8),
          0 2px 4px rgba(75, 33, 27, 0.06),
          0 8px 24px rgba(75, 33, 27, 0.12);
      }
    }
    .v2 .button.lg { padding: 18px 32px; font-size: 15px; }

    /* ═══════════════════════════════════════════════
       PAGE / SECTIONS
       ═══════════════════════════════════════════════ */
    .v2 main.page {
      padding-top: 0;
      background: transparent;
      overflow-x: hidden;
      position: relative;
      z-index: 1;
    }
    .v2 .section {
      max-width: 1280px;
      margin: 0 auto;
      padding: clamp(40px, 6vw, 90px) clamp(20px, 5vw, 56px);
      position: relative;
    }
    .v2 .section-head {
      display: grid;
      grid-template-columns: minmax(180px, 220px) minmax(0, 1fr);
      gap: clamp(20px, 5vw, 56px);
      margin-bottom: clamp(36px, 4.5vw, 56px);
      align-items: start;
    }
    .v2 .section-head .section-kicker,
    .v2 .section-head .eyebrow {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--v2-rust);
      padding-top: 16px;
    }
    .v2 .section-head > div:not(.section-kicker):not(.eyebrow) {
      min-width: 0;
      width: 100%;
    }
    .v2 .section-head h2 {
      font-size: clamp(28px, 3.8vw, 48px);
      line-height: 1.02;
      margin: 0 0 18px;
      max-width: none;
      width: 100%;
    }
    .v2 .section-head p {
      font-size: 18px;
      line-height: 1.55;
      color: var(--v2-brown);
      max-width: 80ch;
      font-weight: 500;
    }
    @media (max-width: 760px) {
      .v2 .section-head { grid-template-columns: 1fr; gap: 12px; }
      .v2 .section-head .section-kicker { padding-top: 0; }
      .v2 .section-head h2 { font-size: clamp(32px, 7vw, 44px); }
    }

    /* ═══════════════════════════════════════════════
       HERO
       ═══════════════════════════════════════════════ */
    .v2 .hero {
      min-height: 100dvh;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 88px clamp(20px, 5vw, 56px) 28px;
      text-align: center;
      position: relative;
      isolation: isolate;
    }
    @media (max-width: 760px) {
      .v2 .hero { min-height: 82dvh; padding: 100px 20px 24px; }
    }
    .v2 .hero .hero-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 8px 18px;
      border-radius: 999px;
      background: rgba(255, 253, 250, 0.7);
      -webkit-backdrop-filter: blur(16px) saturate(180%);
      backdrop-filter: blur(16px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.10);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 2px 8px rgba(75, 33, 27, 0.06);
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.04em;
      color: var(--v2-rust);
      margin-bottom: 22px;
      opacity: 0;
      animation: hero-fade-up 700ms 100ms var(--ease-out) forwards;
    }
    .v2 .hero .hero-eyebrow::before {
      content: "";
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--v2-rust);
    }
    .v2 .hero h1 {
      font-size: clamp(40px, 5.8vw, 80px);
      line-height: 0.94;
      margin: 0 0 18px;
      max-width: 22ch;
      letter-spacing: -0.04em;
      opacity: 0;
      animation: hero-fade-up 900ms 200ms var(--ease-out) forwards;
    }
    @media (max-width: 760px) {
      .v2 .hero .hero-eyebrow { margin-bottom: 16px; }
      .v2 .hero h1 { margin-bottom: 18px; font-size: clamp(36px, 9vw, 52px); }
    }
    .v2 .hero h1 .h1-line1 {
      display: block;
      transition: transform 600ms 800ms var(--ease-out);
    }
    .v2 .hero h1.strike-done .h1-line1 { transform: translateY(-6px); }
    .v2 .hero h1 .strike {
      position: relative;
      display: inline-block;
      font-style: normal;
      text-decoration: none;
      transition: opacity 600ms 800ms var(--ease-out);
    }
    .v2 .hero h1.strike-done .strike { opacity: 0.42; }
    .v2 .hero h1 .strike::after {
      content: "";
      position: absolute;
      left: -1.5%;
      top: 50%;
      width: 0;
      height: 7px;
      background: var(--v2-rust);
      border-radius: 6px;
      transform: translateY(-50%);
      transition: width 700ms 800ms var(--ease-out);
    }
    .v2 .hero h1.strike-done .strike::after { width: 103%; }
    .v2 .hero .lead {
      font-size: clamp(16px, 1.4vw, 20px);
      line-height: 1.5;
      color: var(--v2-brown);
      max-width: 56ch;
      margin: 0 0 26px;
      font-weight: 500;
      opacity: 0;
      animation: hero-fade-up 800ms 350ms var(--ease-out) forwards;
    }
    @media (max-width: 760px) {
      .v2 .hero .lead { margin: 0 0 22px; font-size: 15px; max-width: 36ch; }
    }
    .v2 .hero .hero-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      justify-content: center;
      opacity: 0;
      animation: hero-fade-up 800ms 500ms var(--ease-out) forwards;
    }
    @media (max-width: 760px) {
      .v2 .hero .hero-actions { gap: 10px; }
      .v2 .hero .hero-actions .button { padding: 14px 22px; font-size: 14px; }
    }
    @keyframes hero-fade-up {
      from { opacity: 0; transform: translateY(20px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    /* Belief ticker centrado */
    .v2 .belief-ticker {
      max-width: 1000px;
      margin: 0 auto;
      padding: 28px 0 28px;
      overflow: hidden;
      mask-image: linear-gradient(to right, transparent, black 12%, black 88%, transparent);
      -webkit-mask-image: linear-gradient(to right, transparent, black 12%, black 88%, transparent);
      opacity: 0;
      animation: hero-fade-up 800ms 700ms var(--ease-out) forwards;
    }
    .v2 .belief-ticker .belief-track {
      display: flex;
      gap: 40px;
      animation: ticker 32s linear infinite;
      width: max-content;
    }
    .v2 .belief-ticker .belief-track span {
      font-family: "Geist Mono", "SF Mono", monospace;
      font-size: 12px;
      font-weight: 500;
      color: var(--v2-muted);
      white-space: nowrap;
      letter-spacing: -0.005em;
    }
    .v2 .belief-ticker .belief-track span::before {
      content: "·  ";
      color: var(--v2-rust);
      font-weight: 700;
      margin-right: 4px;
    }
    @keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }

    /* ═══════════════════════════════════════════════
       VISUAL SECTION · comparativa
       ═══════════════════════════════════════════════ */
    .v2 .visual-section {
      max-width: 1280px;
      margin: 0 auto;
      padding: clamp(20px, 3vw, 40px) clamp(20px, 5vw, 56px) clamp(40px, 5vw, 60px);
    }
    .v2 .visual-section .visual-head {
      text-align: center;
      margin-bottom: 36px;
    }
    .v2 .visual-section .visual-head .section-kicker {
      display: inline-block;
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--v2-rust);
      margin-bottom: 14px;
    }
    .v2 .visual-section .visual-head h2 {
      font-size: clamp(28px, 3.6vw, 44px);
      line-height: 1.05;
      max-width: 28ch;
      margin: 0 auto 18px;
    }
    @media (max-width: 760px) {
      .v2 .visual-section .visual-head h2 { font-size: clamp(28px, 6.5vw, 38px); }
    }
    .v2 .visual-section .visual-head p {
      font-size: 16px;
      color: var(--v2-brown);
      max-width: 56ch;
      margin: 0 auto;
      line-height: 1.55;
    }

    .v2 .vcloud-v2 {
      position: relative;
      padding: 28px 28px 32px;
      border-radius: 28px;
      background: rgba(255, 253, 250, 0.66);
      -webkit-backdrop-filter: blur(24px) saturate(180%);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.10);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.7),
        0 1px 2px rgba(75, 33, 27, 0.06),
        0 24px 64px rgba(75, 33, 27, 0.12),
        0 48px 128px rgba(75, 33, 27, 0.08);
    }
    .v2 .vcloud-v2 .vtabs-v2 {
      display: flex;
      gap: 4px;
      padding: 4px;
      border-radius: 999px;
      background: rgba(75, 33, 27, 0.06);
      margin: 4px auto 24px;
      width: fit-content;
    }
    .v2 .vcloud-v2 .vtab-v2 {
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: -0.005em;
      padding: 9px 18px;
      border-radius: 999px;
      border: 0;
      background: transparent;
      color: var(--v2-muted);
      cursor: pointer;
      transition: background 200ms var(--ease-out), color 200ms ease, transform 160ms var(--ease-out);
    }
    .v2 .vcloud-v2 .vtab-v2:active { transform: scale(0.97); }
    .v2 .vcloud-v2 .vtab-v2.active {
      background: var(--v2-ink);
      color: var(--v2-cream);
      box-shadow: 0 2px 6px rgba(40, 19, 15, 0.18);
    }
    .v2 .vcloud-v2 .vpanel-v2 { display: none; }
    .v2 .vcloud-v2 .vpanel-v2.active {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      width: 100%;
      animation: panel-in 420ms var(--ease-out);
    }
    @media (max-width: 980px) {
      .v2 .vcloud-v2 .vpanel-v2.active { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (max-width: 640px) {
      .v2 .vcloud-v2 .vpanel-v2.active { grid-template-columns: 1fr; }
    }

    /* Card notificación */
    .v2 .snote-v2 {
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      padding: 14px 16px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 14px;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
      min-width: 0;
      box-sizing: border-box;
      transition: transform 200ms var(--ease-out), box-shadow 200ms ease;
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 .snote-v2:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 14px rgba(75, 33, 27, 0.10);
      }
    }
    .v2 .snote-v2-icon {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      background: linear-gradient(135deg, var(--v2-rust), var(--v2-brown));
      color: var(--v2-cream);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: "Geist", sans-serif;
      font-weight: 800;
      font-size: 14px;
    }
    .v2 .snote-v2-copy {
      min-width: 0;
      display: block;
    }
    .v2 .snote-v2-copy strong {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 700;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      line-height: 1.2;
    }
    .v2 .snote-v2-copy span {
      display: block;
      font-size: 11px;
      color: var(--v2-muted);
      line-height: 1.35;
      margin-top: 2px;
    }
    .v2 .snote-v2-time {
      display: block;
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      color: var(--v2-muted);
      margin-top: 4px;
      letter-spacing: 0.04em;
    }
    .v2 .snote-v2-amount {
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 800;
      color: var(--v2-rust);
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }

    /* Mini KPI */
    .v2 .kpi-v2 {
      padding: 18px 20px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 14px;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
      min-width: 0;
      box-sizing: border-box;
    }
    .v2 .kpi-v2 strong {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: 32px;
      font-weight: 900;
      letter-spacing: -0.035em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      line-height: 1;
    }
    .v2 .kpi-v2 span {
      display: block;
      font-size: 11px;
      color: var(--v2-muted);
      margin-top: 6px;
      font-weight: 500;
    }

    /* Revenue panel */
    .v2 .revpanel-v2 {
      grid-column: 1 / -1;
      padding: 24px 28px;
      background: linear-gradient(135deg, rgba(176, 90, 60, 0.14), rgba(176, 90, 60, 0.04));
      border: 1px solid rgba(176, 90, 60, 0.26);
      border-radius: 18px;
      min-width: 0;
      box-sizing: border-box;
    }
    .v2 .revpanel-v2 span {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--v2-rust);
      margin-bottom: 6px;
    }
    .v2 .revpanel-v2 strong {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: clamp(32px, 4vw, 44px);
      font-weight: 900;
      letter-spacing: -0.04em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      line-height: 1;
      margin-bottom: 8px;
    }
    .v2 .revpanel-v2 p {
      margin: 0;
      font-size: 13px;
      color: var(--v2-brown);
      line-height: 1.45;
      max-width: 60ch;
    }

    /* ─── Variante SIN OPTIMIZAR · rojo peligro ─── */
    .v2 .snote-v2.is-loss {
      background: linear-gradient(135deg, rgba(255, 244, 242, 1), rgba(255, 250, 248, 1));
      border-color: rgba(183, 76, 63, 0.32);
      border-left: 3px solid #b74c3f;
    }
    .v2 .snote-v2.is-loss .snote-v2-icon {
      background: linear-gradient(135deg, #d05848, #7a2b22);
      box-shadow: 0 2px 6px rgba(183, 76, 63, 0.35);
    }
    .v2 .snote-v2.is-loss .snote-v2-copy strong { color: #6b1f17; }
    .v2 .snote-v2.is-loss .snote-v2-amount { color: #b74c3f; }
    .v2 .revpanel-v2.is-loss {
      background: linear-gradient(135deg, rgba(183, 76, 63, 0.18), rgba(183, 76, 63, 0.06));
      border-color: rgba(183, 76, 63, 0.36);
      border-left: 4px solid #b74c3f;
    }
    .v2 .revpanel-v2.is-loss span { color: #8c2e26; }
    .v2 .revpanel-v2.is-loss strong { color: #6b1f17; }
    @keyframes panel-in {
      from { opacity: 0; transform: scale(0.97) translateY(8px); filter: blur(2px); }
      to   { opacity: 1; transform: scale(1) translateY(0); filter: blur(0); }
    }
    /* ═══════════════════════════════════════════════
       BENTO PROBLEMAS · Layout C
       ═══════════════════════════════════════════════ */
    .v2 #problemas .problem-grid {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: 14px;
      margin-top: 8px;
    }
    .v2 #problemas .problem-card:nth-child(1),
    .v2 #problemas .problem-card:nth-child(2) {
      grid-column: span 6;
      min-height: 380px;
    }
    .v2 #problemas .problem-card:nth-child(3),
    .v2 #problemas .problem-card:nth-child(4),
    .v2 #problemas .problem-card:nth-child(5),
    .v2 #problemas .problem-card:nth-child(6) {
      grid-column: span 3;
      min-height: 320px;
    }

    .v2 #problemas .problem-card {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 22px;
      padding: 28px;
      display: flex;
      flex-direction: column;
      gap: 14px;
      position: relative;
      overflow: hidden;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
      transition: transform 280ms var(--ease-out), box-shadow 280ms ease, border-color 280ms ease;
      opacity: 0;
      transform: translateY(20px);
    }
    .v2 #problemas .problem-card.in-view {
      opacity: 1;
      transform: translateY(0);
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 #problemas .problem-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 1px 2px rgba(75, 33, 27, 0.06), 0 16px 40px rgba(75, 33, 27, 0.12);
        border-color: rgba(176, 90, 60, 0.30);
      }
      .v2 #problemas .problem-card:hover em { color: var(--v2-rust); }
    }
    .v2 #problemas .problem-card em {
      font-style: normal;
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--v2-muted);
      transition: color 200ms ease;
    }
    .v2 #problemas .problem-card strong {
      display: block;
      font-family: "Geist", sans-serif;
      font-weight: 700;
      letter-spacing: -0.025em;
      line-height: 1.15;
      color: var(--v2-ink);
    }
    .v2 #problemas .problem-card:nth-child(-n+2) strong {
      font-size: clamp(22px, 1.8vw, 28px);
      max-width: 24ch;
    }
    .v2 #problemas .problem-card:nth-child(n+3) strong {
      font-size: clamp(16px, 1.2vw, 18px);
      max-width: 24ch;
    }
    .v2 #problemas .problem-card span {
      font-size: 13px;
      color: var(--v2-brown);
      line-height: 1.55;
      margin-top: auto;
      max-width: none;
    }

    /* Card hero 1 · Ads · Kokonut level (sample) */
    .v2 #problemas .ads-visual {
      position: relative;
      flex: 1;
      min-height: 180px;
      padding: 20px;
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 60%);
      border-radius: 16px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }
    .v2 #problemas .ads-visual .kpi-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 8px;
    }
    .v2 #problemas .ads-visual .kpi { display: flex; flex-direction: column; gap: 2px; }
    .v2 #problemas .ads-visual .kpi-label {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--v2-muted);
    }
    .v2 #problemas .ads-visual .kpi-value {
      font-family: "Geist", sans-serif;
      font-size: clamp(20px, 1.8vw, 26px);
      font-weight: 800;
      letter-spacing: -0.03em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      line-height: 1;
    }
    .v2 #problemas .ads-visual .kpi-delta {
      font-family: "Geist Mono", monospace;
      font-size: 10px;
      font-weight: 600;
      color: #b04040;
      display: inline-block;
      padding: 2px 6px;
      background: rgba(176, 64, 64, 0.10);
      border-radius: 4px;
      margin-top: 2px;
      width: fit-content;
    }
    .v2 #problemas .ads-visual .chart {
      flex: 1;
      position: relative;
      width: 100%;
      min-height: 90px;
    }
    .v2 #problemas .ads-visual .chart svg { width: 100%; height: 100%; overflow: visible; }
    .v2 #problemas .ads-visual .chart .grid { stroke: rgba(75, 33, 27, 0.08); stroke-width: 1; stroke-dasharray: 2 4; }
    .v2 #problemas .ads-visual .chart .area-fill { fill: url(#adsGradient); opacity: 0.5; }
    .v2 #problemas .ads-visual .chart .line-stroke {
      fill: none;
      stroke: var(--v2-rust);
      stroke-width: 2.5;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-dasharray: 1000;
      stroke-dashoffset: 1000;
      transition: stroke-dashoffset 1800ms 200ms var(--ease-out);
    }
    .v2 #problemas .problem-card.in-view .ads-visual .chart .line-stroke { stroke-dashoffset: 0; }
    .v2 #problemas .ads-visual .chart .node {
      fill: var(--v2-rust);
      stroke: var(--v2-paper);
      stroke-width: 2;
      opacity: 0;
      transition: opacity 200ms var(--ease-out);
    }
    .v2 #problemas .problem-card.in-view .ads-visual .chart .node { opacity: 1; transition-delay: 1600ms; }
    .v2 #problemas .ads-visual .chart .node.peak { fill: var(--v2-ink); r: 5; }
    .v2 #problemas .ads-visual .chart .peak-label {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      font-weight: 600;
      fill: var(--v2-ink);
      opacity: 0;
      transition: opacity 300ms 1900ms var(--ease-out);
    }
    .v2 #problemas .problem-card.in-view .ads-visual .chart .peak-label { opacity: 1; }
    .v2 #problemas .ads-visual .x-axis {
      display: flex;
      justify-content: space-between;
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      color: var(--v2-muted);
      letter-spacing: 0.04em;
      padding: 0 2px;
    }

    /* Resto de cards de problemas (mantengo el sistema visual previo) */
    .v2 #problemas .problem-visual {
      flex: 1;
      min-height: 140px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 18px;
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 60%);
      border-radius: 14px;
      position: relative;
      overflow: hidden;
    }
    .v2 #problemas .problem-visual.metric-board { gap: 10px; flex-direction: column; padding: 18px; }
    .v2 #problemas .metric-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: center;
      width: 100%;
    }
    .v2 #problemas .metric-row > div:first-child { display: flex; flex-direction: column; gap: 2px; }
    .v2 #problemas .metric-row > div:first-child > span {
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--v2-muted);
    }
    .v2 #problemas .metric-row > div:first-child > strong {
      font-family: "Geist", sans-serif;
      font-size: 18px;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      max-width: none;
    }
    .v2 #problemas .metric-percent {
      font-family: "Geist Mono", monospace;
      font-size: 10px;
      font-style: normal;
      font-weight: 600;
      color: var(--v2-muted);
      margin-left: 6px;
    }
    .v2 #problemas .trend-box {
      width: 100px;
      height: 36px;
      border-radius: 8px;
      background: rgba(176, 90, 60, 0.06);
      padding: 4px;
      overflow: hidden;
    }
    .v2 #problemas .trend-box.down { background: rgba(183, 76, 63, 0.08); }
    .v2 #problemas .trend {
      width: 100%;
      height: 100%;
      stroke: var(--v2-rust);
      stroke-width: 1.5;
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .v2 #problemas .trend-box.down .trend { stroke: #b74c3f; }
    .v2 #problemas .marker-fill { fill: currentColor; }

    .v2 #problemas .confusion-flow,
    .v2 #problemas .loop-graphic {
      position: relative;
      min-height: 140px;
    }
    .v2 #problemas .confusion-flow svg,
    .v2 #problemas .loop-graphic svg {
      width: 100%;
      height: 100%;
      stroke: var(--v2-rust);
      stroke-width: 1.5;
      fill: none;
      opacity: 0.45;
    }
    .v2 #problemas .flow-node,
    .v2 #problemas .loop-node {
      position: absolute;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line-strong);
      border-radius: 999px;
      padding: 6px 12px;
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.06);
    }
    .v2 #problemas .flow-a { top: 8%; left: 8%; }
    .v2 #problemas .flow-b { top: 38%; right: 4%; }
    .v2 #problemas .flow-c { bottom: 14%; left: 4%; }
    .v2 #problemas .flow-d { bottom: 4%; right: 14%; }
    .v2 #problemas .loop-top { top: 0; left: 50%; transform: translateX(-50%); }
    .v2 #problemas .loop-right { top: 38%; right: 4%; }
    .v2 #problemas .loop-bottom { bottom: 6%; left: 50%; transform: translateX(-50%); }
    .v2 #problemas .loop-left { top: 38%; left: 4%; }

    .v2 #problemas .instagram-graphic { padding: 12px; flex-direction: column; gap: 8px; }
    .v2 #problemas .ig-head {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      color: var(--v2-muted);
      letter-spacing: 0.04em;
    }
    .v2 #problemas .ig-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; width: 100%; }
    .v2 #problemas .reel-card {
      aspect-ratio: 1;
      border-radius: 10px;
      background: linear-gradient(135deg, rgba(176, 90, 60, 0.12), rgba(75, 33, 27, 0.06));
      border: 1px solid var(--v2-line);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 8px;
      text-align: center;
    }
    .v2 #problemas .reel-card strong {
      font-family: "Geist", sans-serif;
      font-size: 9px;
      font-weight: 600;
      color: var(--v2-ink);
      line-height: 1.2;
      letter-spacing: -0.01em;
      max-width: none;
    }

    .v2 #problemas .shopify-list { flex-direction: column; padding: 12px; gap: 6px; }
    .v2 #problemas .ref-top {
      display: flex;
      justify-content: space-between;
      width: 100%;
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      color: var(--v2-muted);
      letter-spacing: 0.04em;
      margin-bottom: 4px;
    }
    .v2 #problemas .shop-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      padding: 8px 10px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 10px;
      align-items: center;
      width: 100%;
    }
    .v2 #problemas .shop-row > div { display: flex; flex-direction: column; gap: 1px; }
    .v2 #problemas .shop-row strong {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      color: var(--v2-ink);
      max-width: none;
    }
    .v2 #problemas .shop-row span { font-size: 10px; color: var(--v2-muted); margin: 0; }
    .v2 #problemas .shop-row b {
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 700;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
    }
    .v2 #problemas .shop-row.refund b { color: #b04040; }

    /* ───── CARD WEB · stacked metric rows con barras de fondo ───── */
    .v2 #problemas .web-visual {
      position: relative;
      flex: 1;
      min-height: 200px;
      padding: 20px;
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 60%);
      border-radius: 16px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 14px;
    }
    .v2 #problemas .web-visual .web-row {
      position: relative;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: end;
      padding: 10px 14px 12px;
      background: rgba(255, 253, 250, 0.7);
      border: 1px solid var(--v2-line);
      border-radius: 10px;
      overflow: hidden;
    }
    .v2 #problemas .web-visual .web-row::before {
      content: "";
      position: absolute;
      left: 0; bottom: 0;
      height: 3px;
      width: 0;
      background: linear-gradient(90deg, var(--v2-rust), var(--v2-brown));
      transition: width 1200ms 200ms var(--ease-out);
    }
    .v2 #problemas .problem-card.in-view .web-visual .web-row::before { width: var(--bar, 60%); }
    .v2 #problemas .web-visual .web-row.r1 { --bar: 32%; }
    .v2 #problemas .web-visual .web-row.r2 { --bar: 78%; }
    .v2 #problemas .web-visual .web-row.r3 { --bar: 24%; }
    .v2 #problemas .web-visual .web-row .web-label {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--v2-muted);
      display: block;
      margin-bottom: 4px;
    }
    .v2 #problemas .web-visual .web-row .web-num {
      font-family: "Geist", sans-serif;
      font-size: 24px;
      font-weight: 900;
      letter-spacing: -0.03em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      line-height: 1;
    }
    .v2 #problemas .web-visual .web-row .web-delta {
      font-family: "Geist Mono", monospace;
      font-size: 11px;
      font-weight: 600;
      padding: 4px 8px;
      border-radius: 6px;
      align-self: end;
    }
    .v2 #problemas .web-visual .web-row .web-delta.down { color: #b04040; background: rgba(176, 64, 64, 0.10); }
    .v2 #problemas .web-visual .web-row .web-delta.up { color: var(--v2-rust); background: rgba(176, 90, 60, 0.10); }

    /* ───── CARD DECISIÓN · stack de "alertas" urgentes apiladas ───── */
    .v2 #problemas .dec-visual {
      position: relative;
      flex: 1;
      min-height: 180px;
      padding: 16px;
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 60%);
      border-radius: 16px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      gap: 8px;
      justify-content: center;
    }
    .v2 #problemas .dec-alert {
      display: grid;
      grid-template-columns: 28px 1fr auto;
      gap: 12px;
      align-items: center;
      padding: 12px 14px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-left: 3px solid var(--v2-rust);
      border-radius: 10px;
      box-shadow: 0 2px 6px rgba(75, 33, 27, 0.08);
      opacity: 0;
      transform: translateX(-10px);
      transition: opacity 500ms var(--ease-out), transform 500ms var(--ease-out);
    }
    .v2 #problemas .problem-card.in-view .dec-alert { opacity: 1; transform: translateX(0); }
    .v2 #problemas .problem-card.in-view .dec-alert.d2 { transition-delay: 150ms; }
    .v2 #problemas .problem-card.in-view .dec-alert.d3 { transition-delay: 300ms; }
    .v2 #problemas .problem-card.in-view .dec-alert.d4 { transition-delay: 450ms; }
    .v2 #problemas .dec-alert .dec-icon {
      width: 28px; height: 28px;
      border-radius: 50%;
      background: rgba(176, 90, 60, 0.14);
      color: var(--v2-rust);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: "Geist", sans-serif;
      font-weight: 800;
      font-size: 14px;
      line-height: 1;
    }
    .v2 #problemas .dec-alert .dec-text {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      line-height: 1.3;
    }
    .v2 #problemas .dec-alert .dec-time {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      font-weight: 600;
      color: var(--v2-muted);
      letter-spacing: 0;
      white-space: nowrap;
    }

    /* ───── CARD CONTENIDO · phone con reels apilados ───── */
    .v2 #problemas .cont-visual {
      flex: 1;
      min-height: 160px;
      padding: 16px;
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 60%);
      border-radius: 16px;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }
    .v2 #problemas .cont-phone {
      position: relative;
      width: 90px;
      aspect-ratio: 9 / 18;
      background: var(--v2-ink);
      border-radius: 14px;
      padding: 6px;
      box-shadow: 0 12px 28px rgba(40, 19, 15, 0.20);
    }
    .v2 #problemas .cont-phone::before {
      content: "";
      position: absolute;
      top: 8px; left: 50%;
      transform: translateX(-50%);
      width: 30px; height: 4px;
      background: rgba(255, 253, 250, 0.18);
      border-radius: 999px;
    }
    .v2 #problemas .cont-phone .cont-screen {
      width: 100%; height: 100%;
      border-radius: 8px;
      background: var(--v2-paper);
      padding: 16px 4px 4px;
      display: flex;
      flex-direction: column;
      gap: 3px;
    }
    .v2 #problemas .cont-phone .cont-reel {
      flex: 1;
      border-radius: 4px;
      background: linear-gradient(135deg, rgba(176, 90, 60, 0.18), rgba(75, 33, 27, 0.08));
      border: 1px solid var(--v2-line);
    }
    .v2 #problemas .cont-stack {
      display: flex;
      flex-direction: column;
      gap: 6px;
      flex: 1;
      max-width: 140px;
      padding-left: 14px;
    }
    .v2 #problemas .cont-card {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 8px;
      padding: 8px 10px;
      display: flex;
      align-items: center;
      gap: 8px;
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      color: var(--v2-ink);
      transform: rotate(var(--rot, 0deg)) translateX(var(--tx, 0));
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.06);
    }
    .v2 #problemas .cont-card::before {
      content: "";
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--v2-rust);
      flex: 0 0 6px;
    }
    .v2 #problemas .cont-card.c1 { --rot: -2deg; --tx: 2px; }
    .v2 #problemas .cont-card.c2 { --rot: 1deg; --tx: -4px; }
    .v2 #problemas .cont-card.c3 { --rot: -1deg; --tx: 4px; }

    /* ───── CARD CAMBIOS · timeline cíclico horizontal ───── */
    .v2 #problemas .cam-visual {
      flex: 1;
      min-height: 180px;
      padding: 24px 16px;
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 60%);
      border-radius: 16px;
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      gap: 18px;
      justify-content: center;
    }
    .v2 #problemas .cam-flow {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 6px;
      align-items: center;
      position: relative;
    }
    .v2 #problemas .cam-step {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
    }
    .v2 #problemas .cam-step-circle {
      width: 28px; height: 28px;
      border-radius: 50%;
      background: var(--v2-paper);
      border: 1.5px solid var(--v2-rust);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: "Geist Mono", monospace;
      font-size: 10px;
      font-weight: 700;
      color: var(--v2-rust);
      box-shadow: 0 2px 6px rgba(176, 90, 60, 0.18);
      z-index: 2;
    }
    .v2 #problemas .cam-step-label {
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      text-align: center;
      max-width: 70px;
      line-height: 1.2;
    }
    .v2 #problemas .cam-step:not(:last-child)::after {
      content: "";
      position: absolute;
      top: 14px;
      left: calc(50% + 18px);
      right: calc(-50% + 18px);
      height: 1px;
      background: linear-gradient(90deg, rgba(176, 90, 60, 0.40), rgba(176, 90, 60, 0.15));
      z-index: 1;
    }
    .v2 #problemas .cam-loop-back {
      position: relative;
      height: 36px;
      margin-top: 4px;
    }
    .v2 #problemas .cam-loop-back svg {
      width: 100%; height: 100%;
      stroke: var(--v2-rust);
      stroke-width: 1.4;
      stroke-dasharray: 4 3;
      fill: none;
      opacity: 0.55;
    }
    .v2 #problemas .cam-loop-label {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: var(--v2-cream-2);
      padding: 2px 10px;
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      font-weight: 600;
      color: var(--v2-rust);
      letter-spacing: 0.06em;
      text-transform: uppercase;
      border-radius: 999px;
      white-space: nowrap;
    }

    /* ───── CARD AOV · Apple Wallet style card ───── */
    .v2 #problemas .aov-visual {
      flex: 1;
      min-height: 160px;
      padding: 16px;
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 60%);
      border-radius: 16px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      align-items: stretch;
      justify-content: center;
    }
    .v2 #problemas .aov-card {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 12px;
      padding: 12px 14px;
      display: grid;
      grid-template-columns: 32px 1fr auto;
      gap: 10px;
      align-items: center;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
      transform: translateY(8px) rotate(var(--r, 0deg));
      opacity: 0;
      transition: opacity 500ms var(--ease-out), transform 500ms var(--ease-out);
    }
    .v2 #problemas .problem-card.in-view .aov-card { opacity: 1; transform: translateY(0) rotate(var(--r, 0deg)); }
    .v2 #problemas .problem-card.in-view .aov-card.a2 { transition-delay: 120ms; }
    .v2 #problemas .problem-card.in-view .aov-card.a3 { transition-delay: 240ms; }
    .v2 #problemas .aov-card.a1 { --r: -0.6deg; margin-left: -4px; }
    .v2 #problemas .aov-card.a2 { --r: 0.6deg; margin-right: -4px; }
    .v2 #problemas .aov-card.a3 { --r: -0.4deg; margin-left: -2px; }
    .v2 #problemas .aov-card .aov-icon {
      width: 32px; height: 32px;
      border-radius: 8px;
      background: linear-gradient(135deg, var(--v2-rust), var(--v2-brown));
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--v2-cream);
      font-family: "Geist", sans-serif;
      font-weight: 800;
      font-size: 11px;
    }
    .v2 #problemas .aov-card.refund .aov-icon { background: linear-gradient(135deg, #c25247, #7a2b22); }
    .v2 #problemas .aov-card .aov-info { min-width: 0; }
    .v2 #problemas .aov-card .aov-title {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 700;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      display: block;
    }
    .v2 #problemas .aov-card .aov-meta {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      color: var(--v2-muted);
      letter-spacing: 0;
    }
    .v2 #problemas .aov-card .aov-amount {
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 700;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }
    .v2 #problemas .aov-card.refund .aov-amount { color: #b04040; }

    .v2 .cta-band {
      margin-top: clamp(32px, 5vw, 56px);
      padding: clamp(28px, 4vw, 40px) clamp(28px, 5vw, 56px);
      border-radius: 22px;
      background: rgba(255, 253, 250, 0.65);
      -webkit-backdrop-filter: blur(20px) saturate(180%);
      backdrop-filter: blur(20px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.12);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 1px 2px rgba(75, 33, 27, 0.04), 0 16px 48px rgba(75, 33, 27, 0.06);
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 28px;
      align-items: center;
    }
    .v2 .cta-band h2 { font-size: clamp(22px, 2.4vw, 32px); line-height: 1.1; margin: 0 0 8px; max-width: 36ch; }
    .v2 .cta-band p { margin: 0; font-size: 15px; color: var(--v2-brown); max-width: 56ch; }

    @media (max-width: 980px) {
      .v2 #problemas .problem-grid { grid-template-columns: repeat(6, 1fr); }
      .v2 #problemas .problem-card:nth-child(1),
      .v2 #problemas .problem-card:nth-child(2) { grid-column: span 6; }
      .v2 #problemas .problem-card:nth-child(3),
      .v2 #problemas .problem-card:nth-child(4),
      .v2 #problemas .problem-card:nth-child(5),
      .v2 #problemas .problem-card:nth-child(6) { grid-column: span 3; }
    }
    @media (max-width: 760px) {
      .v2 .cta-band { grid-template-columns: 1fr; }
      .v2 #problemas .problem-grid { grid-template-columns: 1fr; }
      .v2 #problemas .problem-card,
      .v2 #problemas .problem-card:nth-child(1),
      .v2 #problemas .problem-card:nth-child(2),
      .v2 #problemas .problem-card:nth-child(3),
      .v2 #problemas .problem-card:nth-child(4),
      .v2 #problemas .problem-card:nth-child(5),
      .v2 #problemas .problem-card:nth-child(6) { grid-column: span 1; min-height: 280px; }
    }

    /* ═══════════════════════════════════════════════
       CALCULADORA · sliders alto completo + fixes
       ═══════════════════════════════════════════════ */
    .v2 #money .calculator {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
      gap: clamp(20px, 3vw, 40px);
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 24px;
      padding: clamp(24px, 3.5vw, 44px);
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04), 0 16px 48px rgba(75, 33, 27, 0.06);
    }
    .v2 #money .calc-controls {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 26px;
    }
    .v2 #money .calc-field { display: flex; flex-direction: column; gap: 12px; }
    .v2 #money .calc-field .calc-label {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 500;
      color: var(--v2-brown);
      letter-spacing: -0.005em;
    }
    .v2 #money .calc-field .calc-label strong {
      font-family: "Geist", sans-serif;
      font-size: 16px;
      font-weight: 700;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
    }
    .v2 #money .calc-field input[type="range"] {
      appearance: none;
      -webkit-appearance: none;
      width: 100%;
      height: 6px;
      border-radius: 999px;
      background: linear-gradient(
        to right,
        var(--v2-brown) 0%,
        var(--v2-brown) var(--fill-pct, 50%),
        rgba(75, 33, 27, 0.10) var(--fill-pct, 50%),
        rgba(75, 33, 27, 0.10) 100%
      );
      outline: none;
      transition: background 100ms linear;
    }
    .v2 #money .calc-field input[type="range"]::-webkit-slider-thumb {
      -webkit-appearance: none;
      width: 22px; height: 22px;
      border-radius: 50%;
      background: var(--v2-ink);
      cursor: pointer;
      border: 3px solid var(--v2-paper);
      box-shadow: 0 1px 2px rgba(0,0,0,0.10), 0 4px 14px rgba(40, 19, 15, 0.22);
      transition: transform 160ms var(--ease-out);
    }
    .v2 #money .calc-field input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.15); }
    .v2 #money .calc-field input[type="range"]::-moz-range-thumb {
      width: 22px; height: 22px;
      border-radius: 50%;
      background: var(--v2-ink);
      cursor: pointer;
      border: 3px solid var(--v2-paper);
      box-shadow: 0 4px 14px rgba(40, 19, 15, 0.22);
    }
    .v2 #money .calc-output {
      background: linear-gradient(135deg, rgba(176, 90, 60, 0.10), rgba(75, 33, 27, 0.04));
      border-radius: 18px;
      padding: clamp(20px, 3vw, 32px);
      border: 1px solid rgba(176, 90, 60, 0.16);
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 10px;
    }
    .v2 #money .calc-output::before {
      content: "";
      position: absolute;
      top: -50%; right: -30%;
      width: 80%; height: 200%;
      background: radial-gradient(circle, rgba(176, 90, 60, 0.12), transparent 60%);
      filter: blur(40px);
      pointer-events: none;
    }
    .v2 #money .calc-hero { position: relative; }
    .v2 #money .calc-hero span {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--v2-rust);
      margin-bottom: 8px;
    }
    .v2 #money .calc-hero strong {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: clamp(36px, 5.5vw, 56px);
      font-weight: 900;
      letter-spacing: -0.045em;
      color: var(--v2-ink);
      line-height: 1;
      font-variant-numeric: tabular-nums;
    }
    .v2 #money .calc-secondary {
      margin-top: 12px;
      padding-top: 12px;
      border-top: 1px solid rgba(75, 33, 27, 0.10);
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      position: relative;
      flex-wrap: nowrap;
    }
    .v2 #money .calc-secondary span {
      font-family: "Geist", sans-serif;
      font-size: 13px;
      color: var(--v2-muted);
      font-weight: 500;
      line-height: 1.3;
      flex: 1;
      min-width: 0;
    }
    .v2 #money .calc-secondary strong {
      font-family: "Geist", sans-serif;
      font-size: 18px;
      font-weight: 800;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      letter-spacing: -0.02em;
      white-space: nowrap;
      flex: 0 0 auto;
    }
    .v2 #money .calc-rows { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; position: relative; }
    .v2 #money .calc-row {
      display: grid !important;
      grid-template-columns: 1fr auto !important;
      gap: 16px !important;
      align-items: center !important;
      padding: 14px 16px !important;
      background: rgba(255, 253, 250, 0.7) !important;
      border-radius: 12px !important;
      border: 1px solid rgba(75, 33, 27, 0.06) !important;
      transition: transform 200ms var(--ease-out);
    }
    .v2 #money .calc-row:hover { transform: translateX(2px); }
    .v2 #money .calc-row > span,
    .v2 #money .calc-row > strong {
      font-family: "Geist", "Helvetica Neue", sans-serif !important;
      font-size: 14px !important;
      line-height: 1.3 !important;
      letter-spacing: -0.005em !important;
      margin: 0 !important;
      display: inline-flex !important;
      align-items: center !important;
    }
    .v2 #money .calc-row > span {
      color: var(--v2-brown) !important;
      font-weight: 500 !important;
      min-width: 0;
      text-align: left;
    }
    .v2 #money .calc-row > strong {
      color: var(--v2-ink) !important;
      font-weight: 700 !important;
      font-variant-numeric: tabular-nums !important;
      white-space: nowrap !important;
      text-align: right;
      justify-content: flex-end;
    }

    .v2 .source-note {
      margin-top: 20px;
      font-size: 12px;
      color: var(--v2-muted);
      line-height: 1.55;
      max-width: none;
    }
    .v2 .source-note a { color: var(--v2-rust); text-decoration: underline; text-underline-offset: 2px; }

    @media (max-width: 860px) {
      .v2 #money .calculator { grid-template-columns: 1fr; }
    }

    /* ═══════════════════════════════════════════════
       PROMESA · 4 cards con mini-gráficos
       ═══════════════════════════════════════════════ */
    .v2 #promesa .promesa-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
      margin-top: 8px;
    }
    .v2 #promesa .pr-card {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 18px;
      padding: 26px;
      transition: transform 240ms var(--ease-out), box-shadow 240ms ease, border-color 240ms ease;
      display: flex;
      flex-direction: column;
      gap: 18px;
      opacity: 0;
      transform: translateY(16px);
    }
    .v2 #promesa .pr-card.in-view { opacity: 1; transform: translateY(0); }
    @media (hover: hover) and (pointer: fine) {
      .v2 #promesa .pr-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 32px rgba(75, 33, 27, 0.08);
        border-color: rgba(176, 90, 60, 0.24);
      }
    }
    .v2 #promesa .pr-mini {
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 70%);
      border-radius: 12px;
      padding: 16px;
      min-height: 110px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      justify-content: center;
    }
    .v2 #promesa .pr-card strong {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--v2-ink);
      margin: 0;
    }
    .v2 #promesa .pr-card .pr-body {
      font-size: 14px;
      line-height: 1.55;
      color: var(--v2-brown);
      display: block;
    }
    /* Mini-graficos: gauge, bars, big-number, checklist */
    .v2 #promesa .gauge {
      display: flex;
      align-items: center;
      gap: 16px;
    }
    .v2 #promesa .gauge-svg { width: 76px; height: 76px; }
    .v2 #promesa .gauge-svg circle.bg {
      fill: none; stroke: rgba(75, 33, 27, 0.10); stroke-width: 6;
    }
    .v2 #promesa .gauge-svg circle.fg {
      fill: none; stroke: var(--v2-rust); stroke-width: 6; stroke-linecap: round;
      stroke-dasharray: 220;
      stroke-dashoffset: 220;
      transition: stroke-dashoffset 1400ms 200ms var(--ease-out);
      transform: rotate(-90deg);
      transform-origin: center;
    }
    .v2 #promesa .pr-card.in-view .gauge-svg circle.fg { stroke-dashoffset: 66; /* ~70% */ }
    .v2 #promesa .gauge-value {
      font-family: "Geist", sans-serif;
      font-size: 32px;
      font-weight: 900;
      letter-spacing: -0.03em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      line-height: 1;
    }
    .v2 #promesa .gauge-label {
      font-family: "Geist Mono", monospace;
      font-size: 10px;
      color: var(--v2-muted);
      letter-spacing: 0.06em;
      text-transform: uppercase;
      margin-top: 4px;
    }
    .v2 #promesa .pr-bars { display: flex; flex-direction: column; gap: 8px; }
    .v2 #promesa .pr-bar {
      display: grid;
      grid-template-columns: 70px 1fr 30px;
      gap: 8px;
      align-items: center;
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 500;
      color: var(--v2-brown);
    }
    .v2 #promesa .pr-bar .pr-track {
      height: 6px;
      background: rgba(75, 33, 27, 0.08);
      border-radius: 999px;
      overflow: hidden;
      position: relative;
    }
    .v2 #promesa .pr-bar .pr-fill {
      height: 100%;
      background: linear-gradient(90deg, var(--v2-rust), var(--v2-brown));
      border-radius: 999px;
      width: 0;
      transition: width 1200ms 300ms var(--ease-out);
    }
    .v2 #promesa .pr-card.in-view .pr-bar .pr-fill { width: var(--w); }
    .v2 #promesa .pr-bar .pr-val {
      font-family: "Geist Mono", monospace;
      font-size: 11px;
      font-weight: 600;
      color: var(--v2-ink);
      text-align: right;
      font-variant-numeric: tabular-nums;
    }
    .v2 #promesa .pr-big {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    .v2 #promesa .pr-big-amount {
      font-family: "Geist", sans-serif;
      font-size: 40px;
      font-weight: 900;
      letter-spacing: -0.04em;
      color: var(--v2-ink);
      line-height: 1;
      font-variant-numeric: tabular-nums;
    }
    .v2 #promesa .pr-big-label {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      color: var(--v2-rust);
    }
    .v2 #promesa .pr-big-spark {
      width: 100%; height: 28px;
      stroke: var(--v2-rust);
      stroke-width: 1.5;
      fill: none;
      margin-top: 8px;
    }
    .v2 #promesa .pr-checklist {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .v2 #promesa .pr-check {
      display: grid;
      grid-template-columns: 18px 1fr;
      gap: 10px;
      align-items: center;
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: var(--v2-brown);
    }
    .v2 #promesa .pr-check::before {
      content: "";
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--v2-rust);
      margin-left: 6px;
    }
    .v2 #promesa .promesa-quote {
      margin: 36px 0 0;
      padding: 32px 36px;
      background: linear-gradient(135deg, rgba(255, 253, 250, 0.85), rgba(238, 231, 220, 0.65));
      border-left: 4px solid var(--v2-rust);
      border-radius: 0 18px 18px 0;
      font-family: "Geist", sans-serif;
      font-style: normal;
      font-size: clamp(20px, 2.2vw, 26px);
      line-height: 1.32;
      font-weight: 600;
      letter-spacing: -0.025em;
      color: var(--v2-ink);
      max-width: 60ch;
    }
    @media (max-width: 700px) {
      .v2 #promesa .promesa-grid { grid-template-columns: 1fr; }
    }

    /* ═══════════════════════════════════════════════
       SCORECARD · side puntos rust
       ═══════════════════════════════════════════════ */
    .v2 #scorecard .quiz-wrap {
      display: grid;
      grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
      gap: clamp(16px, 2vw, 28px);
      margin-top: 12px;
    }
    .v2 #scorecard .quiz {
      background: rgba(255, 253, 250, 0.72);
      -webkit-backdrop-filter: blur(24px) saturate(180%);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.12);
      border-radius: 28px;
      padding: clamp(24px, 3vw, 36px);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        0 1px 2px rgba(75, 33, 27, 0.04),
        0 16px 48px rgba(75, 33, 27, 0.10),
        0 32px 96px rgba(75, 33, 27, 0.06);
    }
    .v2 #scorecard .quiz h2 {
      font-family: "Geist", sans-serif;
      font-size: clamp(22px, 2.4vw, 30px);
      letter-spacing: -0.025em;
      line-height: 1.15;
      margin-bottom: 12px;
    }
    .v2 #scorecard .quiz-top { font-family: "Geist Mono", monospace; }
    .v2 #scorecard .side {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 24px;
      padding: clamp(24px, 3vw, 32px);
      align-self: start;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
    }
    .v2 #scorecard .side h3 {
      font-family: "Geist", sans-serif;
      font-size: 20px;
      letter-spacing: -0.02em;
      margin-bottom: 12px;
    }
    .v2 #scorecard .side p { font-size: 14px; color: var(--v2-brown); line-height: 1.55; }
    .v2 #scorecard .side ul { margin-top: 16px; padding-left: 0; list-style: none; }
    /* Override del CSS canónico: ticks fuera, puntos rust dentro */
    .v2 #scorecard .side li {
      padding: 12px 0 12px 22px !important;
      position: relative;
      font-family: "Geist", sans-serif;
      font-size: 14px;
      font-weight: 500;
      color: var(--v2-brown);
      border-top: 1px solid var(--v2-line);
      background: transparent !important;
    }
    .v2 #scorecard .side li:first-child { border-top: 0; }
    .v2 #scorecard .side li::before {
      content: "" !important;
      position: absolute;
      left: 4px;
      top: 50%;
      width: 6px !important;
      height: 6px !important;
      transform: translateY(-50%) !important;
      background: var(--v2-rust) !important;
      border-radius: 999px !important;
      border: 0 !important;
    }
    .v2 #scorecard .side li::after { content: none !important; display: none !important; }

    /* Opciones del quiz · radio armonizado con el resto */
    .v2 #scorecard #options > *,
    .v2 #scorecard .options > * {
      border-radius: 14px !important;
    }
    .v2 #scorecard .text-input,
    .v2 #scorecard textarea {
      border-radius: 12px !important;
    }
    .v2 #scorecard .progress {
      border-radius: 999px !important;
      overflow: hidden;
    }
    .v2 #scorecard .progress > span {
      border-radius: 999px !important;
    }

    @media (max-width: 860px) { .v2 #scorecard .quiz-wrap { grid-template-columns: 1fr; } }

    /* ═══════════════════════════════════════════════
       SOLUCIÓN · 3 cards upgrade Kokonut
       ═══════════════════════════════════════════════ */
    .v2 #solucion .solution-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }
    .v2 #solucion .solution-card {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 22px;
      padding: 26px;
      display: flex;
      flex-direction: column;
      gap: 16px;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
      transition: transform 280ms var(--ease-out), box-shadow 280ms ease;
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 #solucion .solution-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(75, 33, 27, 0.10); }
    }
    .v2 #solucion .solution-card strong {
      font-family: "Geist", sans-serif;
      font-size: 19px;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.2;
      color: var(--v2-ink);
    }
    .v2 #solucion .solution-card .sol-desc { font-size: 14px; line-height: 1.55; color: var(--v2-brown); margin-top: auto; }
    .v2 #solucion .solution-visual {
      background: linear-gradient(180deg, var(--v2-cream-2), transparent 70%);
      border-radius: 14px;
      padding: 20px;
      min-height: 180px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      position: relative;
      overflow: hidden;
    }

    /* Sol 1 · Flow Ad→PDP→Checkout con pasos animados */
    .v2 #solucion .sol-flow {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 100%;
      flex: 1;
      justify-content: center;
    }
    .v2 #solucion .sol-flow-step {
      display: grid;
      grid-template-columns: 28px 1fr auto;
      gap: 10px;
      align-items: center;
      padding: 10px 14px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 10px;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
      opacity: 0;
      transform: translateY(8px);
      transition: opacity 500ms var(--ease-out), transform 500ms var(--ease-out);
    }
    .v2 #solucion .solution-card.in-view .sol-flow-step { opacity: 1; transform: translateY(0); }
    .v2 #solucion .solution-card.in-view .sol-flow-step:nth-child(2) { transition-delay: 120ms; }
    .v2 #solucion .solution-card.in-view .sol-flow-step:nth-child(3) { transition-delay: 240ms; }
    .v2 #solucion .sol-flow-num {
      width: 28px; height: 28px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--v2-rust), var(--v2-brown));
      color: var(--v2-cream);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: "Geist", sans-serif;
      font-weight: 800;
      font-size: 11px;
    }
    .v2 #solucion .sol-flow-label {
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 700;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      display: block;
    }
    .v2 #solucion .sol-flow-meta {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      color: var(--v2-muted);
      letter-spacing: 0.02em;
      display: block;
      margin-top: 1px;
    }
    .v2 #solucion .sol-flow-check {
      color: var(--v2-rust);
      font-weight: 900;
      font-size: 14px;
    }

    /* Sol 2 · AOV big number + sparkline up + AOV badge */
    .v2 #solucion .sol-aov {
      display: flex;
      flex-direction: column;
      gap: 8px;
      flex: 1;
      justify-content: center;
    }
    .v2 #solucion .sol-aov-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 800;
      color: var(--v2-ink);
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .v2 #solucion .sol-aov-head .pulse {
      width: 8px; height: 8px;
      border-radius: 50%;
      background: var(--v2-rust);
      box-shadow: 0 0 0 0 rgba(176, 90, 60, 0.45);
      animation: sol-pulse 2s infinite;
    }
    @keyframes sol-pulse {
      0% { box-shadow: 0 0 0 0 rgba(176, 90, 60, 0.45); }
      70% { box-shadow: 0 0 0 8px rgba(176, 90, 60, 0); }
      100% { box-shadow: 0 0 0 0 rgba(176, 90, 60, 0); }
    }
    .v2 #solucion .sol-aov-big {
      display: flex;
      align-items: baseline;
      gap: 8px;
      margin: 6px 0;
    }
    .v2 #solucion .sol-aov-num {
      font-family: "Geist", sans-serif;
      font-size: 42px;
      font-weight: 900;
      letter-spacing: -0.04em;
      color: var(--v2-rust);
      font-variant-numeric: tabular-nums;
      line-height: 1;
    }
    .v2 #solucion .sol-aov-delta {
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 700;
      color: var(--v2-rust);
      padding: 5px 10px;
      background: rgba(176, 90, 60, 0.16);
      border-radius: 8px;
      letter-spacing: -0.005em;
    }
    .v2 #solucion .sol-aov-spark {
      width: 100%; height: 40px;
      stroke: var(--v2-rust);
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      fill: none;
      stroke-dasharray: 300;
      stroke-dashoffset: 300;
      transition: stroke-dashoffset 1600ms 300ms var(--ease-out);
    }
    .v2 #solucion .solution-card.in-view .sol-aov-spark { stroke-dashoffset: 0; }
    .v2 #solucion .sol-aov-spark-area {
      fill: url(#solAovGrad);
      opacity: 0.4;
    }
    .v2 #solucion .sol-aov-foot {
      display: flex;
      justify-content: space-between;
      padding-top: 12px;
      border-top: 1.5px solid var(--v2-line-strong);
      font-family: "Geist", sans-serif;
      font-size: 13px;
      color: var(--v2-ink);
      font-weight: 700;
      letter-spacing: -0.005em;
    }
    .v2 #solucion .sol-aov-foot b {
      color: var(--v2-ink);
      font-weight: 900;
      margin-left: 6px;
      font-variant-numeric: tabular-nums;
      letter-spacing: -0.015em;
    }
    /* Override del CSS canónico que pinta los span en cream claro */
    .v2 #solucion .sol-aov .sol-lbl {
      color: var(--v2-ink) !important;
      font-family: "Geist", sans-serif !important;
      font-size: 12px !important;
      font-weight: 800 !important;
      letter-spacing: 0.06em !important;
      text-transform: uppercase !important;
    }
    .v2 #solucion .sol-aov .sol-foot-item {
      color: var(--v2-ink) !important;
      font-family: "Geist", sans-serif !important;
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: -0.005em !important;
    }

    /* Sol 3 · Apple Wallet style 3 orders apilados */
    .v2 #solucion .sol-orders {
      display: flex;
      flex-direction: column;
      gap: 8px;
      flex: 1;
      justify-content: center;
    }
    .v2 #solucion .sol-order-card {
      display: grid;
      grid-template-columns: 32px 1fr auto;
      gap: 12px;
      align-items: center;
      padding: 12px 14px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 10px;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04);
      transform: translateX(-10px);
      opacity: 0;
      transition: opacity 500ms var(--ease-out), transform 500ms var(--ease-out);
    }
    .v2 #solucion .solution-card.in-view .sol-order-card { opacity: 1; transform: translateX(0); }
    .v2 #solucion .solution-card.in-view .sol-order-card:nth-child(2) { transition-delay: 140ms; }
    .v2 #solucion .solution-card.in-view .sol-order-card:nth-child(3) { transition-delay: 280ms; }
    .v2 #solucion .sol-order-icon {
      width: 32px; height: 32px;
      border-radius: 8px;
      background: linear-gradient(135deg, var(--v2-rust), var(--v2-brown));
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--v2-cream);
      font-family: "Geist", sans-serif;
      font-weight: 800;
      font-size: 12px;
    }
    .v2 #solucion .sol-order-info { min-width: 0; }
    .v2 #solucion .sol-order-title {
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 700;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      display: block;
    }
    .v2 #solucion .sol-order-meta {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      color: var(--v2-muted);
      letter-spacing: 0;
    }
    .v2 #solucion .sol-order-amount {
      font-family: "Geist", sans-serif;
      font-size: 14px;
      font-weight: 800;
      color: var(--v2-rust);
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }

    @media (max-width: 860px) { .v2 #solucion .solution-grid { grid-template-columns: 1fr; } }

    /* ═══════════════════════════════════════════════
       EXPERTISE · TIMELINE STICKY-SCROLL
       ═══════════════════════════════════════════════ */
    .v2 #expertise .exp-wrapper {
      position: relative;
      max-width: 1200px;
      margin: 0 auto;
      padding-top: 40px;
    }
    .v2 #expertise .exp-rail {
      position: absolute;
      top: 0; bottom: 0;
      left: clamp(20px, 4vw, 56px);
      width: 2px;
      background: var(--v2-line-strong);
      border-radius: 999px;
      overflow: visible;
    }
    .v2 #expertise .exp-rail-progress {
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 0;
      background: linear-gradient(180deg, var(--v2-rust), var(--v2-brown));
      border-radius: 999px;
      transition: height 220ms var(--ease-out);
      box-shadow: 0 0 16px rgba(176, 90, 60, 0.40);
    }
    .v2 #expertise .exp-stops {
      display: flex;
      flex-direction: column;
      gap: clamp(40px, 6vw, 80px);
      padding-left: calc(clamp(20px, 4vw, 56px) + 40px);
    }
    .v2 #expertise .exp-stop {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
      gap: clamp(24px, 4vw, 56px);
      align-items: center;
      opacity: 0.32;
      transition: opacity 600ms var(--ease-out);
    }
    .v2 #expertise .exp-stop.active { opacity: 1; }
    .v2 #expertise .exp-stop::before {
      content: "";
      position: absolute;
      top: 50%;
      left: calc(-1 * (clamp(20px, 4vw, 56px) + 40px) + clamp(20px, 4vw, 56px) - 6px);
      transform: translateY(-50%);
      width: 14px; height: 14px;
      border-radius: 50%;
      background: var(--v2-cream);
      border: 2px solid var(--v2-line-strong);
      box-shadow: 0 0 0 6px var(--v2-cream);
      transition: background 300ms var(--ease-out), border-color 300ms var(--ease-out), transform 300ms var(--ease-out);
    }
    .v2 #expertise .exp-stop.active::before {
      background: var(--v2-rust);
      border-color: var(--v2-rust);
      transform: translateY(-50%) scale(1.2);
      box-shadow: 0 0 0 6px var(--v2-cream), 0 0 24px rgba(176, 90, 60, 0.50);
    }
    .v2 #expertise .exp-stop .exp-num {
      font-family: "Geist Mono", monospace;
      font-size: 12px;
      font-weight: 600;
      color: var(--v2-rust);
      letter-spacing: 0.08em;
      margin-bottom: 8px;
      display: block;
    }
    .v2 #expertise .exp-stop .eyebrow {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--v2-rust);
      margin-bottom: 10px;
      display: block;
    }
    .v2 #expertise .exp-stop h3 {
      font-family: "Geist", sans-serif;
      font-size: clamp(28px, 3.4vw, 42px);
      letter-spacing: -0.035em;
      line-height: 1.05;
      margin: 0 0 18px;
    }
    .v2 #expertise .exp-stop p {
      font-size: 16px;
      line-height: 1.6;
      color: var(--v2-brown);
      max-width: 56ch;
      margin: 0;
    }
    .v2 #expertise .exp-stop .exp-visual {
      background: rgba(255, 253, 250, 0.72);
      -webkit-backdrop-filter: blur(20px) saturate(180%);
      backdrop-filter: blur(20px) saturate(180%);
      border: 1px solid var(--v2-line);
      border-radius: 22px;
      padding: 28px;
      min-height: 220px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 1px 2px rgba(75, 33, 27, 0.04), 0 16px 48px rgba(75, 33, 27, 0.08);
      position: relative;
      overflow: hidden;
    }
    /* Visual 1: laboratorio real - métricas vivas */
    .v2 #expertise .vlab .vlab-row {
      display: grid;
      grid-template-columns: 60px 1fr auto;
      gap: 12px;
      padding: 10px 12px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 10px;
      align-items: center;
    }
    .v2 #expertise .vlab .vlab-row .vlab-day {
      font-family: "Geist Mono", monospace;
      font-size: 10px;
      color: var(--v2-muted);
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .v2 #expertise .vlab .vlab-row .vlab-act {
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 600;
      color: var(--v2-ink);
    }
    .v2 #expertise .vlab .vlab-row .vlab-val {
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 700;
      color: var(--v2-rust);
      font-variant-numeric: tabular-nums;
    }
    /* Visual 2: sistema ya construido - ÓRBITA estilo referencia */
    .v2 #expertise .vsys {
      position: relative;
      align-items: center;
      justify-content: center;
      min-height: 280px;
      padding: 20px;
    }
    .v2 #expertise .vsys-stage {
      position: relative;
      width: 100%;
      max-width: 380px;
      aspect-ratio: 1.4 / 1;
      margin: 0 auto;
    }
    .v2 #expertise .vsys-orbit {
      position: absolute;
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 78%;
      aspect-ratio: 1;
      border: 1px dashed rgba(75, 33, 27, 0.22);
      border-radius: 50%;
      animation: vsys-rotate 60s linear infinite;
    }
    /* Rayos desde el centro a cada nodo */
    .v2 #expertise .vsys-line {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 115px;
      height: 1px;
      background: linear-gradient(90deg, rgba(75, 33, 27, 0.36) 0%, rgba(75, 33, 27, 0.18) 100%);
      transform-origin: 0 50%;
      z-index: 1;
      pointer-events: none;
    }
    .v2 #expertise .vsys-line.l1 { transform: rotate(270deg); }
    .v2 #expertise .vsys-line.l2 { transform: rotate(330deg); }
    .v2 #expertise .vsys-line.l3 { transform: rotate(30deg); }
    .v2 #expertise .vsys-line.l4 { transform: rotate(90deg); }
    .v2 #expertise .vsys-line.l5 { transform: rotate(150deg); }
    .v2 #expertise .vsys-line.l6 { transform: rotate(210deg); }
    @media (max-width: 760px) {
      .v2 #expertise .vsys-line { width: 90px; }
    }
    @keyframes vsys-rotate {
      from { transform: translate(-50%, -50%) rotate(0deg); }
      to   { transform: translate(-50%, -50%) rotate(360deg); }
    }
    .v2 #expertise .vsys-core {
      position: absolute;
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 56px; height: 56px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #6b3026, var(--v2-ink) 70%);
      box-shadow:
        0 0 0 8px rgba(40, 19, 15, 0.06),
        0 0 24px rgba(176, 90, 60, 0.40),
        0 8px 24px rgba(40, 19, 15, 0.30);
      z-index: 3;
    }
    .v2 #expertise .vsys-core::after {
      content: "";
      position: absolute;
      inset: -14px;
      border: 1px solid rgba(75, 33, 27, 0.16);
      border-radius: 50%;
      animation: vsys-pulse 3s var(--ease-in-out) infinite;
    }
    @keyframes vsys-pulse {
      0%, 100% { transform: scale(1); opacity: 0.5; }
      50%      { transform: scale(1.15); opacity: 0.20; }
    }
    .v2 #expertise .vsys-node {
      position: absolute;
      top: 50%; left: 50%;
      width: 44px; height: 44px;
      margin-left: -22px;
      margin-top: -22px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      z-index: 2;
    }
    .v2 #expertise .vsys-node-circle {
      width: 30px; height: 30px;
      border-radius: 50%;
      background: var(--v2-paper);
      border: 1.5px solid var(--v2-rust);
      box-shadow: 0 2px 6px rgba(75, 33, 27, 0.10);
      flex: 0 0 30px;
    }
    .v2 #expertise .vsys-node-label {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      color: var(--v2-ink);
      letter-spacing: -0.005em;
      white-space: nowrap;
      margin-top: 2px;
    }
    /* Posiciones de los 6 nodos en órbita */
    .v2 #expertise .vsys-node.n1 { transform: rotate(0deg) translateY(-115px) rotate(0deg); }
    .v2 #expertise .vsys-node.n2 { transform: rotate(60deg) translateY(-115px) rotate(-60deg); }
    .v2 #expertise .vsys-node.n3 { transform: rotate(120deg) translateY(-115px) rotate(-120deg); }
    .v2 #expertise .vsys-node.n4 { transform: rotate(180deg) translateY(-115px) rotate(-180deg); }
    .v2 #expertise .vsys-node.n5 { transform: rotate(240deg) translateY(-115px) rotate(-240deg); }
    .v2 #expertise .vsys-node.n6 { transform: rotate(300deg) translateY(-115px) rotate(-300deg); }
    @media (max-width: 760px) {
      .v2 #expertise .vsys-node.n1 { transform: rotate(0deg) translateY(-90px) rotate(0deg); }
      .v2 #expertise .vsys-node.n2 { transform: rotate(60deg) translateY(-90px) rotate(-60deg); }
      .v2 #expertise .vsys-node.n3 { transform: rotate(120deg) translateY(-90px) rotate(-120deg); }
      .v2 #expertise .vsys-node.n4 { transform: rotate(180deg) translateY(-90px) rotate(-180deg); }
      .v2 #expertise .vsys-node.n5 { transform: rotate(240deg) translateY(-90px) rotate(-240deg); }
      .v2 #expertise .vsys-node.n6 { transform: rotate(300deg) translateY(-90px) rotate(-300deg); }
    }
    /* Visual 3: experiencia operativa - tags */
    .v2 #expertise .vexp { gap: 8px; }
    .v2 #expertise .vexp .vexp-tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 10px 14px;
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 999px;
      font-family: "Geist", sans-serif;
      font-size: 12px;
      font-weight: 600;
      color: var(--v2-ink);
    }
    .v2 #expertise .vexp .vexp-tag::before {
      content: "";
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--v2-rust);
    }
    .v2 #expertise .vexp .vexp-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }
    /* Visual 4: honestidad - sello manuscrito */
    .v2 #expertise .vhonest {
      align-items: center;
      justify-content: center;
      text-align: center;
    }
    .v2 #expertise .vhonest .seal {
      width: 140px; height: 140px;
      border: 2px dashed var(--v2-rust);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      transform: rotate(-8deg);
      padding: 12px;
    }
    .v2 #expertise .vhonest .seal-eyebrow {
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      font-weight: 600;
      color: var(--v2-rust);
      letter-spacing: 0.16em;
      text-transform: uppercase;
      margin-bottom: 4px;
    }
    .v2 #expertise .vhonest .seal-text {
      font-family: "Geist", sans-serif;
      font-size: 16px;
      font-weight: 800;
      color: var(--v2-ink);
      letter-spacing: -0.02em;
      line-height: 1;
    }
    .v2 #expertise .vhonest .seal-foot {
      font-family: "Geist", sans-serif;
      font-size: 9px;
      font-weight: 500;
      color: var(--v2-muted);
      letter-spacing: 0.06em;
      text-transform: uppercase;
      margin-top: 6px;
    }

    @media (max-width: 860px) {
      .v2 #expertise .exp-stop { grid-template-columns: 1fr; }
      .v2 #expertise .exp-stop .exp-visual { order: 2; }
      .v2 #expertise .exp-stop > div:first-child { order: 1; }
      .v2 #expertise .exp-stops { padding-left: calc(clamp(20px, 4vw, 56px) + 32px); }
    }

    /* ═══════════════════════════════════════════════
       METODO · Bento V2
       ═══════════════════════════════════════════════ */
    .v2 #metodo .method-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
      margin-top: 8px;
      counter-reset: method-counter;
    }
    .v2 #metodo .method-card {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 20px;
      padding: 26px;
      display: flex;
      flex-direction: column;
      gap: 14px;
      position: relative;
      overflow: hidden;
      transition: transform 260ms var(--ease-out), box-shadow 260ms ease;
      opacity: 0;
      transform: translateY(16px);
    }
    .v2 #metodo .method-card.in-view { opacity: 1; transform: translateY(0); }
    @media (hover: hover) and (pointer: fine) {
      .v2 #metodo .method-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 32px rgba(75, 33, 27, 0.10);
      }
    }
    .v2 #metodo .method-card::before {
      content: "0" counter(method-counter);
      counter-increment: method-counter;
      position: absolute;
      top: 22px;
      right: 22px;
      font-family: "Geist Mono", monospace;
      font-size: 11px;
      font-weight: 600;
      color: var(--v2-muted);
    }
    .v2 #metodo .method-card em {
      font-style: normal;
      font-family: "Geist Mono", monospace;
      font-size: 11px;
      font-weight: 500;
      color: var(--v2-rust);
      padding: 4px 10px;
      background: rgba(176, 90, 60, 0.10);
      border-radius: 6px;
      width: fit-content;
    }
    .v2 #metodo .method-card strong {
      font-family: "Geist", sans-serif;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.2;
      color: var(--v2-ink);
    }
    .v2 #metodo .method-card span {
      font-size: 13px;
      line-height: 1.55;
      color: var(--v2-brown);
      margin-top: auto;
    }
    .v2 #metodo .guarantee-band {
      margin-top: clamp(24px, 4vw, 40px);
      padding: clamp(20px, 3vw, 32px) clamp(24px, 4vw, 40px);
      background: linear-gradient(135deg, rgba(85, 125, 101, 0.12), rgba(85, 125, 101, 0.04));
      border: 1px solid rgba(85, 125, 101, 0.22);
      border-radius: 18px;
      display: grid;
      grid-template-columns: minmax(180px, auto) minmax(0, 1fr);
      gap: 24px;
      align-items: center;
    }
    .v2 #metodo .guarantee-band strong {
      font-family: "Geist", sans-serif;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: #406151;
    }
    .v2 #metodo .guarantee-band p {
      margin: 0;
      font-size: 14px;
      line-height: 1.55;
      color: var(--v2-brown);
    }
    .v2 #metodo .guarantee-band p strong {
      display: inline;
      font-size: 14px;
      font-weight: 700;
      color: var(--v2-ink);
    }
    @media (max-width: 980px) { .v2 #metodo .method-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 640px) {
      .v2 #metodo .method-grid { grid-template-columns: 1fr; }
      .v2 #metodo .guarantee-band { grid-template-columns: 1fr; gap: 8px; }
    }

    /* ═══════════════════════════════════════════════
       SERVICIOS · pricing arc + iconos + destacado
       ═══════════════════════════════════════════════ */
    .v2 #servicios { position: relative; isolation: isolate; }
    .v2 #servicios::before {
      content: "";
      position: absolute;
      width: 1400px;
      height: 700px;
      top: 40%;
      left: 50%;
      transform: translateX(-50%);
      background: conic-gradient(
        from 200deg at 50% 100%,
        transparent 0deg,
        rgba(176, 90, 60, 0.20) 50deg,
        rgba(255, 253, 250, 0.5) 110deg,
        rgba(75, 33, 27, 0.14) 170deg,
        transparent 240deg
      );
      filter: blur(80px);
      pointer-events: none;
      z-index: -1;
      opacity: 0.85;
    }
    .v2 #servicios .offer-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
      margin-top: 8px;
    }
    .v2 #servicios .offer-card {
      background: rgba(255, 253, 250, 0.74);
      -webkit-backdrop-filter: blur(24px) saturate(180%);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.14);
      border-radius: 24px;
      padding: clamp(28px, 3.5vw, 40px);
      display: flex;
      flex-direction: column;
      gap: 22px;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        0 1px 2px rgba(75, 33, 27, 0.04),
        0 16px 48px rgba(75, 33, 27, 0.12);
      transition: transform 320ms var(--ease-out), box-shadow 320ms ease;
      position: relative;
    }
    /* Tarjeta destacada (90-Day) con badge */
    .v2 #servicios .offer-card.featured {
      border: 2px solid var(--v2-rust);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.75),
        0 2px 4px rgba(176, 90, 60, 0.12),
        0 24px 64px rgba(176, 90, 60, 0.20);
    }
    .v2 #servicios .offer-card .featured-badge {
      position: absolute;
      top: -14px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--v2-ink);
      color: var(--v2-cream);
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      padding: 7px 16px;
      border-radius: 999px;
      box-shadow: 0 4px 14px rgba(40, 19, 15, 0.30);
      white-space: nowrap;
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 #servicios .offer-card:hover { transform: translateY(-4px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 2px 4px rgba(75, 33, 27, 0.06), 0 24px 64px rgba(75, 33, 27, 0.16); }
    }
    .v2 #servicios .offer-card > div { display: flex; flex-direction: column; gap: 18px; }
    .v2 #servicios .offer-title {
      font-family: "Geist", sans-serif;
      font-size: clamp(26px, 2.6vw, 32px);
      font-weight: 800;
      letter-spacing: -0.03em;
      line-height: 1.05;
      color: var(--v2-ink);
    }
    .v2 #servicios .offer-desc {
      font-size: 16px;
      line-height: 1.6;
      color: var(--v2-brown);
    }
    /* Iconos por línea (sustituye ticks) */
    .v2 #servicios .offer-points {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }
    .v2 #servicios .offer-points li {
      display: grid;
      grid-template-columns: 36px 1fr;
      gap: 14px;
      align-items: start;
      padding: 12px 0;
      border-top: 1px solid var(--v2-line);
    }
    .v2 #servicios .offer-points li:first-child { border-top: 0; padding-top: 4px; }
    .v2 #servicios .offer-points .pt-icon {
      width: 36px; height: 36px;
      border-radius: 10px;
      background: linear-gradient(135deg, rgba(176, 90, 60, 0.12), rgba(176, 90, 60, 0.04));
      border: 1px solid rgba(176, 90, 60, 0.18);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--v2-rust);
    }
    .v2 #servicios .offer-points .pt-icon svg { width: 18px; height: 18px; }
    .v2 #servicios .offer-points .pt-body { display: flex; flex-direction: column; gap: 2px; }
    .v2 #servicios .offer-points .pt-label {
      font-family: "Geist Mono", monospace;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--v2-rust);
    }
    .v2 #servicios .offer-points .pt-text {
      font-family: "Geist", sans-serif;
      font-size: 14px;
      font-weight: 500;
      line-height: 1.45;
      color: var(--v2-brown);
    }
    .v2 #servicios .offer-upside {
      padding: 18px 22px;
      background: linear-gradient(135deg, rgba(176, 90, 60, 0.16), rgba(176, 90, 60, 0.06));
      border: 1px solid rgba(176, 90, 60, 0.26);
      border-radius: 14px;
      display: flex;
      flex-direction: column;
      gap: 6px;
      text-align: center;
    }
    .v2 #servicios .offer-upside span {
      font-family: "Geist", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--v2-rust);
    }
    .v2 #servicios .offer-upside strong {
      font-family: "Geist", sans-serif;
      font-size: 24px;
      font-weight: 900;
      letter-spacing: -0.03em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
    }
    .v2 #servicios .offer-card .offer-cta-wrap {
      display: flex;
      justify-content: center;
      margin-top: 4px;
    }
    @media (max-width: 860px) { .v2 #servicios .offer-grid { grid-template-columns: 1fr; } }

    /* ═══════════════════════════════════════════════
       FAQ
       ═══════════════════════════════════════════════ */
    .v2 #faq .faq-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      margin-top: 8px;
    }
    .v2 #faq .faq-card {
      background: var(--v2-paper);
      border: 1px solid var(--v2-line);
      border-radius: 16px;
      padding: 20px 22px;
      transition: border-color 200ms ease, background 200ms ease;
    }
    @media (hover: hover) and (pointer: fine) {
      .v2 #faq .faq-card:hover { border-color: rgba(176, 90, 60, 0.30); }
    }
    .v2 #faq .faq-card strong {
      display: block;
      font-family: "Geist", sans-serif;
      font-size: 16px;
      font-weight: 700;
      letter-spacing: -0.015em;
      line-height: 1.2;
      color: var(--v2-ink);
      margin-bottom: 8px;
    }
    .v2 #faq .faq-card span { font-size: 13px; line-height: 1.55; color: var(--v2-brown); }
    @media (max-width: 960px) { .v2 #faq .faq-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 560px) { .v2 #faq .faq-grid { grid-template-columns: 1fr; } }

    /* ═══════════════════════════════════════════════
       HITOS · cifras gordas con >
       ═══════════════════════════════════════════════ */
    .v2 .milestones {
      max-width: 1280px;
      margin: 0 auto;
      padding: clamp(50px, 7vw, 90px) clamp(20px, 5vw, 56px);
      text-align: center;
    }
    .v2 .milestones .ms-kicker {
      font-family: "Geist", sans-serif;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--v2-rust);
      margin-bottom: 16px;
    }
    .v2 .milestones h2 {
      font-size: clamp(32px, 4.5vw, 52px);
      line-height: 1.02;
      max-width: 28ch;
      margin: 0 auto 14px;
    }
    .v2 .milestones .ms-sub {
      font-size: 16px;
      color: var(--v2-brown);
      max-width: 56ch;
      margin: 0 auto 40px;
      line-height: 1.55;
    }
    .v2 .ms-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
    }
    .v2 .ms-card {
      padding: 36px 24px;
      background: rgba(255, 253, 250, 0.74);
      -webkit-backdrop-filter: blur(24px) saturate(180%);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.12);
      border-radius: 20px;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.7),
        0 1px 2px rgba(75, 33, 27, 0.06),
        0 16px 40px rgba(75, 33, 27, 0.08);
      text-align: left;
      display: flex;
      flex-direction: column;
      gap: 4px;
      position: relative;
      overflow: hidden;
    }
    .v2 .ms-card .ms-figure {
      display: flex;
      align-items: baseline;
      gap: 4px;
      min-width: 0;
      width: 100%;
    }
    .v2 .ms-card .ms-prefix {
      font-family: "Geist", sans-serif;
      font-size: clamp(20px, 2.4vw, 30px);
      font-weight: 800;
      color: var(--v2-rust);
      letter-spacing: -0.02em;
      line-height: 1;
      flex: 0 0 auto;
    }
    .v2 .ms-card .ms-number {
      font-family: "Geist", sans-serif;
      font-size: clamp(36px, 4.5vw, 58px);
      font-weight: 900;
      letter-spacing: -0.04em;
      color: var(--v2-ink);
      font-variant-numeric: tabular-nums;
      line-height: 0.95;
      flex: 1 1 auto;
      min-width: 0;
      white-space: nowrap;
      overflow: hidden;
    }
    .v2 .ms-card .ms-suffix {
      font-family: "Geist", sans-serif;
      font-size: clamp(18px, 2vw, 24px);
      font-weight: 800;
      color: var(--v2-ink);
      letter-spacing: -0.02em;
      line-height: 1;
      flex: 0 0 auto;
    }
    .v2 .ms-card .ms-label {
      font-family: "Geist", sans-serif;
      font-size: 13px;
      font-weight: 500;
      letter-spacing: -0.005em;
      color: var(--v2-brown);
      line-height: 1.4;
      margin-top: 14px;
    }
    .v2 .ms-tag {
      display: inline-block;
      font-family: "Geist Mono", monospace;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--v2-muted);
      padding: 4px 8px;
      background: rgba(75, 33, 27, 0.06);
      border-radius: 4px;
      margin-bottom: 18px;
      width: fit-content;
    }
    @media (max-width: 760px) { .v2 .ms-grid { grid-template-columns: repeat(2, 1fr); } }

    /* ═══════════════════════════════════════════════
       FOOTER
       ═══════════════════════════════════════════════ */
    .v2 .footer-cta {
      max-width: 1280px;
      margin: clamp(40px, 6vw, 64px) auto 0;
      padding: clamp(40px, 5vw, 64px) clamp(28px, 5vw, 56px);
      background: rgba(255, 253, 250, 0.74);
      -webkit-backdrop-filter: blur(24px) saturate(180%);
      backdrop-filter: blur(24px) saturate(180%);
      border: 1px solid rgba(75, 33, 27, 0.12);
      border-radius: 28px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 32px;
      align-items: center;
      box-shadow: 0 1px 2px rgba(75, 33, 27, 0.04), 0 16px 48px rgba(75, 33, 27, 0.10);
    }
    .v2 .footer-cta h2 { font-size: clamp(28px, 3.6vw, 40px); line-height: 1.05; margin: 0 0 8px; max-width: 22ch; }
    .v2 .footer-cta p { margin: 0; font-size: 15px; color: var(--v2-brown); }
    @media (max-width: 760px) { .v2 .footer-cta { grid-template-columns: 1fr; } }

    .v2 .bp-footer {
      max-width: 1280px;
      margin: 32px auto 0;
      padding: 28px clamp(20px, 5vw, 56px);
      border-top: 1px solid var(--v2-line);
    }
    .v2 .bp-footer-inner {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
      font-family: "Geist", sans-serif;
      font-size: 12px;
      color: var(--v2-muted);
    }
    .v2 .bp-footer a { color: var(--v2-brown); text-decoration: none; }
    @media (hover: hover) and (pointer: fine) { .v2 .bp-footer a:hover { color: var(--v2-rust); } }

    /* ═══════════════════════════════════════════════
       REVEALS
       ═══════════════════════════════════════════════ */
    .v2 .reveal {
      opacity: 0;
      transform: translateY(24px);
      transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out);
      will-change: transform, opacity;
    }
    .v2 .reveal.in-view { opacity: 1; transform: translateY(0); }
    .v2 .reveal-1 { transition-delay: 0ms; }
    .v2 .reveal-2 { transition-delay: 80ms; }
    .v2 .reveal-3 { transition-delay: 160ms; }
    .v2 .reveal-4 { transition-delay: 240ms; }
    .v2 .reveal-5 { transition-delay: 320ms; }
    .v2 .reveal-6 { transition-delay: 400ms; }

    @media (prefers-reduced-motion: reduce) {
      .v2 *, .v2 *::before, .v2 *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
      }
      .v2 .reveal, .v2 .ghost-card { opacity: 1; transform: none; }
    }

/* ================================================================
   SCOREBOARD V3 · ADAPTADOR WORDPRESS / ASTRA
   Solo neutraliza la carcasa del tema. No modifica el diseño V2.
   ================================================================ */
html.bp-scoreboard-v3-active,
html.bp-scoreboard-v3-active body {
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--v2-cream) !important;
  overflow-x: hidden !important;
}

/* WordPress añade la clase .page al body y colisiona con .page del scorecard. */
html.bp-scoreboard-v3-active body.page {
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  font-size: 16px !important;
  line-height: 1.42 !important;
  overflow-x: hidden !important;
}

/* La landing ya contiene navegación y footer propios. */
html.bp-scoreboard-v3-active #masthead,
html.bp-scoreboard-v3-active .entry-header,
html.bp-scoreboard-v3-active #colophon,
html.bp-scoreboard-v3-active #ast-scroll-top {
  display: none !important;
}

/* Retira exclusivamente la carcasa de contenido de Astra. */
html.bp-scoreboard-v3-active #page,
html.bp-scoreboard-v3-active #content.site-content,
html.bp-scoreboard-v3-active #content > .ast-container,
html.bp-scoreboard-v3-active #primary.content-area,
html.bp-scoreboard-v3-active #main.site-main,
html.bp-scoreboard-v3-active article.ast-article-single,
html.bp-scoreboard-v3-active .entry-content {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html.bp-scoreboard-v3-active .entry-content > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

/* La raíz replica el body.v2 del HTML canónico dentro de WordPress. */
.bp-scoreboard-v3-shell.v2 {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  font-size: 16px;
  line-height: 1.42;
}

/* En el standalone, el reset canónico gana a .page sobre el elemento main. */
.bp-scoreboard-v3-shell.v2 main.page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Al iniciar sesión, la barra de administración de WordPress tapa elementos
   fixed. Desplaza solo la navegación propia; la vista pública no cambia. */
html.bp-scoreboard-v3-active body.admin-bar .bp-scoreboard-v3-shell.v2 .topbar {
  top: 48px;
}

html.bp-scoreboard-v3-active body.admin-bar .bp-scoreboard-v3-shell.v2 .mobile-menu {
  top: 110px;
}

@media screen and (max-width: 782px) {
  html.bp-scoreboard-v3-active body.admin-bar .bp-scoreboard-v3-shell.v2 .topbar {
    top: 62px;
  }

  html.bp-scoreboard-v3-active body.admin-bar .bp-scoreboard-v3-shell.v2 .mobile-menu {
    top: 124px;
  }
}

/* Astra añade margen inferior a párrafos y line-height propio a enlaces botón. */
.bp-scoreboard-v3-shell.v2 p {
  margin: 0;
}

.bp-scoreboard-v3-shell.v2 a.button {
  line-height: 1.42;
}

.bp-scoreboard-v3-shell.v2 button.button,
.bp-scoreboard-v3-shell.v2 button.vtab-v2 {
  line-height: normal;
}

.bp-scoreboard-v3-shell.v2 .hint {
  margin: 0 0 24px;
}

.bp-scoreboard-v3-shell.v2 .source-note {
  margin: 20px 0 0;
}

.bp-scoreboard-v3-shell.v2 .processing p {
  margin: 0 auto;
}

.bp-scoreboard-v3-shell.v2 .success p {
  margin: 0 auto 16px;
}

.bp-scoreboard-v3-shell.v2 .error-state p {
  margin: 0 0 16px;
}

/* Astra fuerza estilos de formulario que no existen en el standalone. */
.bp-scoreboard-v3-shell.v2 .text-input,
.bp-scoreboard-v3-shell.v2 textarea {
  height: auto;
  padding: 15px 16px;
  background: rgba(255, 255, 255, 0.35);
  color: var(--ink);
  font-size: 17px;
  line-height: normal;
  box-shadow: none;
}

.bp-scoreboard-v3-shell.v2 .field label {
  line-height: 1.42;
}

.bp-scoreboard-v3-shell.v2 #scorecard .side h3 {
  line-height: 1.03;
}

.bp-scoreboard-v3-shell.v2 #money .calc-field {
  color: var(--v2-brown);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.42;
}

.bp-scoreboard-v3-shell.v2 #money .calc-field input[type="range"] {
  margin: 2px;
  color: initial;
  font: 13.3333px Arial;
  line-height: normal;
}

/* Evita el salto de línea que Astra introduce solo en la tarjeta devolución. */
.bp-scoreboard-v3-shell.v2 #problemas .aov-card.a3 .aov-title {
  white-space: nowrap;
}