
      @media (max-width: 768px) {
        .media-marquee-section { margin-bottom: 12px !important; padding-bottom: 0 !important; }
        .media-quote-box { margin-bottom: 0 !important; }
        .media-logo-marquee { padding-top: 6px !important; }
        .video-showcase-section { padding-top: 12px !important; }
        #interactive-features .features-tabs,
        #interactive-features .cap-features-tabs.hp-video-carousel .features-tabs {
          display: none !important;
        }
        #interactive-features-docs .features-tabs {
          margin-bottom: 16px !important;
        }
      }

      /* ── PRICING COLOR SWAP OVERRIDES ── */
      /* Style remains the same (rightmost column has borders, 2nd from right doesn't), but colors swap */

      /* Column 4 (Elite, rightmost): Transparent bg (consistent with other columns) */
      .plan-table th:nth-child(4),
      .plan-table td:nth-child(4),
      .plan-table tr:not(.group-row):not(.unified-highlight-row):not(.progressive-highlight-row) td:nth-child(4) {
          background-color: transparent !important;
          border-left: none !important;
          border-right: none !important;
      }
      .plan-table th:nth-child(4) {
          border-top: none !important;
      }
      .plan-table tr:last-child td:nth-child(4) {
          border-bottom: none !important;
      }
      
      /* Column 4 Recommended badge: Gold -> Purple */
      .best-value-badge {
          background: #7c3aed !important;
          color: #ffffff !important;
          box-shadow: 0 4px 10px rgba(124, 58, 237, 0.3) !important;
      }

      /* Column 4 checkmarks: Gold bg with dark check -> Purple bg with white check */
      .plan-table td:nth-child(4) .check-icon {
          background-color: #7c3aed !important;
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") !important;
          box-shadow: 0 2px 6px rgba(124, 58, 237, 0.2) !important;
      }

      /* Column 3 (Premium, 2nd from right): Teal/Green -> Gold checkmarks */
      .plan-table td:nth-child(3) .check-icon {
          background-color: #FAE7CF !important;
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23191c1d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") !important;
          box-shadow: 0 2px 6px rgba(250, 231, 207, 0.4) !important;
      }

      /* Column 3 pricing text (price, billed annually, small text) -> gold */
      .plan-table td:nth-child(3) .price-val,
      .plan-table td:nth-child(3) span,
      .plan-table td:nth-child(3) small {
          color: #a37a28 !important;
      }

      /* Column 4 small text: gold -> purple */
      .plan-table td:nth-child(4) small {
          color: #7c3aed !important;
      }

      /* Highlight backgrounds and borders: */
      /* Column 3 (Premium): Teal -> Gold */
      .plan-table tr.unified-highlight-row td:nth-child(3),
      .plan-table tr.progressive-highlight-row td:nth-child(3) {
          background: rgba(250, 231, 207, 0.2) !important;
      }

      /* Column 4 (Elite): Gold -> Purple with Purple borders */
      .plan-table tr.unified-highlight-row td:nth-child(4),
      .plan-table tr.progressive-highlight-row td:nth-child(4) {
          background-color: rgba(124, 58, 237, 0.2) !important;
          border-left: none !important;
          border-right: none !important;
      }

      /* Column 4 Group row borders and bg: Transparent borders, gray bg to match rest of row */
      @media (min-width: 769px) {
          .plan-table tr.group-row td.elite-col-group {
              background-color: #f8fafc !important;
              border-left: none !important;
              border-right: none !important;
          }
      }

      /* Overrides for bg-teal and text-teal in HTML (so they render purple) */
      .bg-teal {
          background-color: #7c3aed !important;
          box-shadow: 0 4px 10px rgba(124, 58, 237, 0.2) !important;
      }
      .text-teal, .text-teal strong {
          color: #7c3aed !important;
      }
      .text-teal-dark {
          color: #7c3aed !important;
      }

      .plan-header-flex {
          justify-content: center !important;
      }

      /* ── STICKY BOTTOM BAR STYLING ── */
      .sticky-bottom-bar {
          position: fixed;
          bottom: 0;
          left: 0;
          right: 0;
          height: 80px;
          background: #ffffff;
          border-top: 1px solid #e2e8f0;
          box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.05);
          z-index: 1000;
          display: flex;
          align-items: center;
          justify-content: center;
          font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
      }
      .sticky-bar-container {
          width: 100%;
          max-width: 1128px;
          padding: 0 24px;
          display: flex;
          align-items: center;
          justify-content: space-between;
      }
      .sticky-bar-left {
          display: flex;
          flex-direction: column;
          gap: 2px;
      }
      .sticky-bar-title {
          font-size: 18px;
          font-weight: 700;
          color: #191c1d;
      }
      .sticky-bar-subtitle {
          font-size: 13px;
          color: #64748b;
          font-weight: 400;
      }
      .sticky-bar-right {
          display: flex;
          align-items: center;
          gap: 24px;
      }
      .sticky-bar-price-wrap {
          display: flex;
          align-items: center;
          gap: 8px;
      }
      .sticky-price-now {
          font-size: 22px;
          font-weight: 800;
          color: #191c1d;
      }
      .sticky-price-was {
          font-size: 13px;
          color: #94a3b8;
          text-decoration: line-through;
      }
      .sticky-save-badge {
          font-size: 11px;
          font-weight: 700;
          color: #ffffff;
          background-color: #ef4444;
          padding: 2.5px 10px;
          border-radius: 9999px;
          letter-spacing: 0.02em;
      }
      .sticky-bar-buttons {
          display: flex;
          align-items: center;
          gap: 12px;
          flex-shrink: 0;
      }
      .sticky-btn {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          height: 44px;
          padding: 0 24px;
          font-size: 14px;
          font-weight: 600;
          border-radius: 100px;
          cursor: pointer;
          text-decoration: none;
          transition: all 0.2s ease;
          box-sizing: border-box;
          white-space: nowrap;
          flex-shrink: 0;
      }
      .sticky-btn-outline {
          border: 1.5px solid #191c1d;
          color: #191c1d;
          background: transparent;
      }
      .sticky-btn-outline:hover {
          background: rgba(25, 28, 29, 0.05);
      }
      .sticky-btn-solid {
          background: #191c1d;
          color: #ffffff;
          border: none;
      }
      .sticky-btn-solid:hover {
          background: #000000;
      }

      /* Add body padding so page content isn't blocked by the sticky bar */
      body {
          padding-bottom: 80px !important;
      }

      /* Responsive Styling */
      @media (max-width: 768px) {
          body {
              padding-bottom: 70px !important;
          }
          .sticky-bottom-bar {
              height: 70px;
          }
          .sticky-bar-left {
              display: none;
          }
          .sticky-bar-container {
              padding: 0 16px;
          }
          .sticky-bar-right {
              width: 100%;
              justify-content: space-between;
              gap: 12px;
          }
          .sticky-bar-price-wrap {
              flex-direction: column;
              align-items: flex-start;
              gap: 2px;
          }
          .sticky-price-now {
              font-size: 18px;
              line-height: 1;
          }
          .sticky-price-was {
              font-size: 11px;
          }
          .sticky-save-badge {
              font-size: 9px;
              padding: 1.5px 5px;
          }
          .sticky-btn {
              height: 38px;
              padding: 0 16px;
              font-size: 13px;
          }
      }

      @media (max-width: 480px) {
          .sticky-bar-right {
              gap: 8px;
          }
          .sticky-bar-buttons {
              gap: 8px;
          }
          .sticky-btn {
              padding: 0 12px;
              font-size: 12px;
          }
      }
    