/* ---------- Page-local styles for value-of-a-whale ---------- */

    /* Push --rust toward a more saturated red on this page only.
       Cofounder wanted the red dialed back in for the cost-of-not-signing framing. */
    body {
      --rust: #C8221A;
    }

    /* Six-up dimension grid */
    .dim-grid {
      margin-top: clamp(2rem, 4vw, 3rem);
      display: grid;
      grid-template-columns: 1fr;
      gap: clamp(0.75rem, 1.4vw, 1rem);
    }

    @media (min-width: 720px) {
      .dim-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (min-width: 1100px) {
      .dim-grid {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    .dim-card {
      display: flex;
      flex-direction: column;
      gap: var(--space-3);
      padding: clamp(1.5rem, 2.4vw, 2rem);
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-md);
      height: 100%;
      transition: transform 220ms var(--ease-out), border 220ms var(--ease-out), box-shadow 220ms var(--ease-out);
    }

    .dim-card:hover {
      transform: translateY(-3px);
      border-color: var(--emerald);
      box-shadow: var(--shadow-soft);
    }

    .dim-num {
      font-size: 18px;
      font-weight: 500;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--gold);
    }

    .dim-title {
      font-size: clamp(1.125rem, 1.6vw, 1.375rem);
      font-weight: 700;
      color: var(--ink);
      line-height: 1.2;
      letter-spacing: -0.02em;
    }

    .dim-body {
      font-size: 18px;
      line-height: 1.55;
      color: var(--ink-80);
    }

    /* Big two-column comparison (volume vs up-market / signing vs not signing) */
    .compare-two {
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      max-width: 1040px;
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-6);
    }

    @media (min-width: 860px) {
      .compare-two {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-7);
      }
    }

    .compare-col {
      display: flex;
      flex-direction: column;
      padding: clamp(1.5rem, 2.4vw, 2rem);
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-lg);
    }

    .compare-col--bad {
      border-color: rgba(154, 46, 26, 0.32);
      background: linear-gradient(180deg, rgba(154, 46, 26, 0.025), rgba(154, 46, 26, 0) 60%);
    }

    .compare-col--good {
      border-color: rgba(11, 110, 61, 0.35);
      background: linear-gradient(180deg, rgba(11, 110, 61, 0.025), rgba(11, 110, 61, 0) 60%);
    }

    .compare-tag {
      font-size: 18px;
      font-weight: 500;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--ink-40);
      margin-bottom: var(--space-3);
    }

    .compare-col--bad .compare-tag {
      color: var(--rust);
    }

    .compare-col--good .compare-tag {
      color: var(--emerald);
    }

    .compare-head {
      font-size: clamp(1.125rem, 1.6vw, 1.375rem);
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--ink);
      margin-bottom: var(--space-5);
    }

    .compare-list {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
      gap: var(--space-3);
    }

    .compare-list li {
      font-size: 18px;
      line-height: 1.55;
      color: var(--ink-80);
      padding-left: 22px;
      position: relative;
    }

    .compare-list li::before {
      content: "";
      position: absolute;
      left: 0;
      top: 9px;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--ink-40);
    }

    .compare-col--bad .compare-list li::before {
      background: var(--rust);
    }

    .compare-col--good .compare-list li::before {
      background: var(--emerald);
    }

    /* Time math: small/mid/whale */
    .time-math {
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      max-width: 1040px;
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-5);
    }

    @media (min-width: 860px) {
      .time-math {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    .time-card {
      padding: clamp(1.5rem, 2.4vw, 2rem);
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-lg);
      display: flex;
      flex-direction: column;
      gap: var(--space-3);
    }

    .time-card--whale {
      border-color: rgba(11, 110, 61, 0.35);
      background: linear-gradient(180deg, rgba(11, 110, 61, 0.04), rgba(11, 110, 61, 0) 70%);
    }

    .time-tag {
      font-size: 18px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--ink-40);
      font-weight: 500;
    }

    .time-card--whale .time-tag {
      color: var(--emerald);
    }

    .time-headline {
      font-size: clamp(1.5rem, 2.2vw, 1.875rem);
      font-weight: 700;
      letter-spacing: -0.025em;
      line-height: 1.05;
      color: var(--ink);
    }

    .time-card--whale .time-headline {
      color: var(--emerald);
    }

    .time-rows {
      display: grid;
      grid-template-columns: 1fr 84px;
      gap: var(--space-3) var(--space-4);
      font-size: 18px;
      color: var(--ink-80);
      margin-top: var(--space-2);
    }

    .time-rows .label {
      color: var(--ink-60);
      line-height: 1.3;
    }

    .time-rows .val {
      font-weight: 600;
      color: var(--ink);
      text-align: right;
      white-space: nowrap;
      align-self: center;
    }

    .time-rev {
      margin-top: var(--space-4);
      padding-top: var(--space-4);
      border-top: 1px solid var(--ink-15);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 6px;
    }

    .time-rev .num {
      font-size: clamp(1.25rem, 1.8vw, 1.5rem);
      font-weight: 700;
      letter-spacing: -0.025em;
      color: var(--ink);
    }

    .time-card--whale .time-rev .num {
      color: var(--emerald);
    }

    .time-rev .label {
      font-size: 18px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--ink-60);
    }

    /* Quantified value table */
    .value-table {
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      max-width: 920px;
      width: 100%;
      border-collapse: collapse;
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-lg);
      overflow: hidden;
    }

    .value-table th,
    .value-table td {
      padding: clamp(0.75rem, 1.4vw, 1.05rem) clamp(0.875rem, 1.6vw, 1.25rem);
      text-align: left;
      border-bottom: 1px solid var(--ink-15);
      vertical-align: top;
    }

    .value-table thead th {
      font-size: 18px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--ink-60);
      font-weight: 500;
      background: var(--mist);
    }

    .value-table tbody td:first-child {
      font-weight: 600;
      color: var(--ink);
      font-size: 18px;
    }

    .value-table tbody td:nth-child(2) {
      font-weight: 700;
      color: var(--emerald);
      font-size: 18px;
      letter-spacing: -0.01em;
      white-space: nowrap;
    }

    .value-table tbody td:nth-child(3) {
      font-size: 18px;
      color: var(--ink-60);
    }

    .value-table tfoot td {
      background: rgba(11, 110, 61, 0.05);
      font-weight: 700;
      color: var(--ink);
      font-size: 18px;
      border-bottom: 0;
    }

    .value-table tfoot td:nth-child(2) {
      font-size: clamp(1.125rem, 1.8vw, 1.5rem);
      color: var(--emerald);
      letter-spacing: -0.025em;
    }

    @media (max-width: 640px) {

      .value-table thead th:nth-child(3),
      .value-table tbody td:nth-child(3),
      .value-table tfoot td:nth-child(3) {
        display: none;
      }
    }

    /* Inverse table for "what NOT signing whales costs" */
    .value-table--inverse tbody td:nth-child(2) {
      color: var(--rust);
      font-weight: 600;
      white-space: normal;
      font-size: 18px;
    }

    /* Sales velocity blocks */
    .velocity-pair {
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      max-width: 860px;
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-4);
    }

    @media (min-width: 720px) {
      .velocity-pair {
        grid-template-columns: 1fr auto 1fr;
        align-items: center;
      }
    }

    .velocity-card {
      padding: clamp(1.75rem, 3vw, 2.5rem);
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-lg);
      text-align: center;
    }

    .velocity-card--after {
      border-color: rgba(11, 110, 61, 0.35);
      background: linear-gradient(180deg, rgba(11, 110, 61, 0.04), rgba(11, 110, 61, 0) 70%);
    }

    .velocity-tag {
      font-size: 18px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--ink-40);
      font-weight: 500;
      margin-bottom: var(--space-3);
    }

    .velocity-card--after .velocity-tag {
      color: var(--emerald);
    }

    .velocity-num {
      font-size: clamp(2.25rem, 4vw, 3.25rem);
      font-weight: 700;
      letter-spacing: -0.035em;
      line-height: 1;
      color: var(--ink);
    }

    .velocity-card--after .velocity-num {
      color: var(--emerald);
    }

    .velocity-sub {
      font-size: 18px;
      color: var(--ink-60);
      margin-top: var(--space-3);
      letter-spacing: 0.02em;
    }

    .velocity-arrow {
      font-size: 28px;
      font-weight: 700;
      color: var(--gold);
      text-align: center;
      line-height: 1;
    }

    @media (min-width: 720px) {
      .velocity-arrow {
        font-size: 36px;
      }
    }

    /* Highlight quote (used for the 15% line) */
    .highlight-quote {
      max-width: var(--max-w-narrow);
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      padding: clamp(1.5rem, 3vw, 2.25rem) clamp(1.5rem, 3vw, 2.5rem);
      border-left: 3px solid var(--gold);
      background: var(--mist);
      border-radius: var(--r-md);
    }

    .highlight-quote p {
      font-size: clamp(1.125rem, 1.7vw, 1.375rem);
      line-height: 1.45;
      letter-spacing: -0.015em;
      color: var(--ink);
      margin: 0;
      font-weight: 500;
    }

    .highlight-quote em {
      color: var(--gold);
      font-weight: 700;
      font-style: normal;
    }

    /* Case-study mini stat row (for "16 case studies" section) */
    .csv-row {
      margin-top: clamp(2rem, 4vw, 3rem);
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-4);
    }

    @media (min-width: 720px) {
      .csv-row {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    .csv-card {
      padding: clamp(1.5rem, 2.4vw, 2rem);
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-md);
    }

    .csv-tag {
      font-size: 18px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--gold);
      font-weight: 500;
    }

    .csv-title {
      margin-top: var(--space-3);
      font-size: clamp(1.125rem, 1.6vw, 1.375rem);
      font-weight: 700;
      letter-spacing: -0.015em;
      color: var(--ink);
      line-height: 1.25;
    }

    .csv-body {
      margin-top: var(--space-3);
      font-size: 18px;
      line-height: 1.55;
      color: var(--ink-80);
    }

    /* Wide stat card (76% close rate) */
    .stat-banner {
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      max-width: var(--max-w-narrow);
      padding: clamp(2rem, 4vw, 3rem);
      background: var(--paper);
      border: 2px solid var(--emerald);
      border-radius: var(--r-lg);
      text-align: center;
    }

    .stat-banner .num {
      font-size: clamp(3rem, 6vw, 4.5rem);
      font-weight: 700;
      letter-spacing: -0.04em;
      line-height: 1;
      color: var(--emerald);
    }

    .stat-banner .label {
      margin-top: var(--space-3);
      font-size: clamp(1.125rem, 1.5vw, 1.125rem);
      color: var(--ink);
      font-weight: 500;
    }

    .stat-banner .sub {
      margin-top: var(--space-2);
      font-size: 18px;
      color: var(--ink-60);
    }

    /* Cole Gordon pull-quote */
    .pull-card {
      max-width: var(--max-w-narrow);
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      padding: clamp(1.5rem, 3vw, 2.25rem);
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-md);
    }

    .pull-card .pull-eyebrow {
      font-size: 18px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--ink-40);
      font-weight: 500;
      margin-bottom: var(--space-3);
    }

    .pull-card p {
      font-size: 18px;
      line-height: 1.6;
      color: var(--ink-80);
      margin: 0 0 var(--space-3);
    }

    .pull-card p:last-child {
      margin-bottom: 0;
    }

    /* 3-up testimonial video grid (used in case-study-value section) */
    .testimonial-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-5);
      max-width: 1200px;
      margin: clamp(2rem, 4vw, 3rem) auto 0;
    }

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

    .testimonial-card {
      display: flex;
      flex-direction: column;
      gap: var(--space-3);
      padding: var(--space-4);
      background: var(--paper);
      border: 1px solid var(--ink-15);
      border-radius: var(--r-lg);
    }

    .testimonial-card .t-label {
      font-size: 18px;
      font-weight: 500;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--emerald);
    }

    .testimonial-card h4 {
      font-size: clamp(1.125rem, 1.6vw, 1.375rem);
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--ink);
      margin: 0;
      line-height: 1.25;
    }

    .testimonial-card .t-media {
      border-radius: var(--r-md);
      overflow: hidden;
      background: var(--graphite);
    }

    .testimonial-card .t-media>wistia-player {
      display: block;
      width: 100%;
    }

    .testimonial-card p {
      font-size: 18px;
      line-height: 1.55;
      color: var(--ink-60);
      margin: 0;
    }

    /* YouTube BTS embed wrapper */
    .yt-embed {
      position: relative;
      max-width: 860px;
      margin: clamp(2rem, 4vw, 3rem) auto 0;
      padding-top: 56.25%;
      border-radius: var(--r-lg);
      overflow: hidden;
      box-shadow: var(--shadow-soft);
      background: var(--graphite);
    }

    .yt-embed iframe {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      border: 0;
    }
            wistia-player[media-id='jlpx3qnayk']:not(:defined) {
              background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/jlpx3qnayk/swatch');
              display: block;
              filter: blur(5px);
              padding-top: 56.25%;
            }
          wistia-player[media-id='uzt3ifokph']:not(:defined) {
            background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/uzt3ifokph/swatch');
            display: block;
            filter: blur(5px);
            padding-top: 56.25%;
          }
          wistia-player[media-id='i8w65p44xl']:not(:defined) {
            background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/i8w65p44xl/swatch');
            display: block;
            filter: blur(5px);
            padding-top: 56.25%;
          }
              wistia-player[media-id='wu3dmaneo4']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/wu3dmaneo4/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='dvr7xl1b43']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/dvr7xl1b43/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='rga6z4brh8']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/rga6z4brh8/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='kzskn4gh5i']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/kzskn4gh5i/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='keidrcnv0o']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/keidrcnv0o/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='rs6j8umrlv']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/rs6j8umrlv/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='jximgubsei']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/jximgubsei/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='vghitp1bsk']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/vghitp1bsk/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='k4e0q306un']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/k4e0q306un/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='dypale2onf']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/dypale2onf/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='nrwlkcujd6']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/nrwlkcujd6/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }
              wistia-player[media-id='hqbgq5e2zn']:not(:defined) {
                background: center / contain no-repeat url('https://fast.wistia.com/embed/medias/hqbgq5e2zn/swatch');
                display: block;
                filter: blur(5px);
                padding-top: 56.25%;
              }