.product-icon {
      width: 80px;
      height: 80px;
      object-fit: contain;
      margin-bottom: 1rem
    }

      /* Sticky in-page navigation */
    .page-subnav {
      position: sticky;
      top: 76px;
      background: #fff;
      border-bottom: 2px solid #e5e7eb;
      z-index: 100;
      box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
    }

    .page-subnav .nav-link {
      padding: .75rem 1rem;
      color: #6b7280;
      font-weight: 500;
      border-bottom: 3px solid transparent;
      transition: all .2s ease;
    }

    .page-subnav .nav-link:hover {
      color: var(--qh-blue);
      background: #f8f9fa;
    }

    .page-subnav .nav-link.active {
      color: var(--qh-blue);
      border-bottom-color: var(--qh-blue);
      font-weight: 600;
    }

    /* Product sections */
    .product-section {
      scroll-margin-top: 140px;
      padding: 4rem 0;
    }

    .product-section:nth-child(even) {
      background: #f8f9fb;
    }

    .product-badge {
      width: 80px;
      height: 80px;
      background: var(--qh-blue);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.5rem;
    }

    .product-badge img {
      width: 60px;
      height: 60px;
      object-fit: contain;
    }

    .product-badge.orange {
      background: var(--qh-orange);
    }

    .product-badge.green {
      background: var(--qh-green);
    }

    .feature-list li {
      margin-bottom: .75rem;
      padding-left: 1.5rem;
      position: relative;
    }

    .feature-list li::before {
      content: "✓";
      position: absolute;
      left: 0;
      color: var(--qh-blue);
      font-weight: 700;
    }

    .cta-box {
      background: linear-gradient(135deg, var(--qh-blue), #2b5f8b);
      color: #fff;
      padding: 2rem;
      border-radius: 12px;
    }




    .placeholder-media {
  background: #f1f3f5;
  border: 2px dashed #ced4da;
  border-radius: 1rem;
  aspect-ratio: 4 / 3;
}
.placeholder-media--lg { aspect-ratio: 3 / 2; }
.placeholder-media--video { aspect-ratio: 16 / 9; }

.feature-icon {
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(56,111,168,.1);
  color: var(--qh-blue);
  border-radius: .6rem;
}
.feature-icon svg { width: 22px; height: 22px; }




/* Hero banner logo (replaces the old icon + h1) */
.product-hero-logo {
  max-width: 460px;
  width: 100%;
  height: auto;
  display: block;
}

/* Placeholder boxes for images/video (delete once real media is in) */
.placeholder-media {
  background: #f1f3f5;
  border: 2px dashed #ced4da;
  border-radius: 1rem;
  aspect-ratio: 4 / 3;
}
.placeholder-media--lg    { aspect-ratio: 3 / 2; }
.placeholder-media--video { aspect-ratio: 16 / 9; }

/* Feature card icon chips */
.feature-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(56, 111, 168, .1);
  color: var(--qh-blue);
  border-radius: .6rem;
}
.feature-icon svg { width: 22px; height: 22px; }


.product-hero-shot {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 1rem;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .12);
}

.gallery-shot {
  width: 100%;
  height: auto;
  display: block;
  border-radius: .75rem;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
}