/* PDF Diff keeps its own compact product layout, drawn from the shared tokens. */
.product-container { width: min(1080px, 100% - 2 * var(--gutter)); margin-inline: auto; }
.pdf-product p { color: var(--ink-2); }
.pdf-product h2 + p, .pdf-product h3 + p { margin-top: var(--space-3); }

.product-header { position: sticky; top: 0; z-index: 50; background: var(--paper); border-bottom: 1px solid var(--rule); }
.product-nav { display: flex; align-items: center; gap: var(--space-6); min-height: var(--header-height); }
.product-brand { display: flex; align-items: center; gap: var(--space-3); color: var(--ink); font: 600 20px / 24px var(--font-sans); text-decoration: none; white-space: nowrap; }
.product-brand:hover { color: var(--ink); }
.product-brand img { width: 32px; height: 32px; }
.product-nav nav { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin-left: auto; }
.product-nav nav a, .product-company { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); font: var(--control-weight) var(--control-size) / var(--control-line) var(--control-font); text-decoration: none; }
.product-nav nav a:hover, .product-company:hover { color: var(--forest-hover); text-decoration: underline; }
.product-company { gap: var(--space-2); border-left: 1px solid var(--rule); padding-left: var(--space-5); white-space: nowrap; }
.product-company img { width: auto; height: 20px; }

.product-hero { padding-block: var(--space-8) var(--space-7); }
.pdf-product .product-intro { max-width: var(--measure); font: var(--lead-weight) var(--lead-size) / var(--lead-line) var(--lead-font); margin-top: var(--space-5); }
.product-hero .product-status { margin-top: var(--space-4); }
.product-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-6); }
.product-button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: 48px; padding: 0 20px;
  border: 1px solid var(--forest); border-radius: var(--radius-control);
  background: var(--forest); color: #fff;
  font: var(--control-weight) var(--control-size) / var(--control-line) var(--control-font);
  text-align: center; text-decoration: none;
  transition: background-color var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast);
}
.product-button:hover { background: var(--forest-hover); border-color: var(--forest-hover); color: #fff; }
.product-button-secondary { background: var(--paper); color: var(--forest); flex-direction: column; gap: 0; padding-block: var(--space-2); }
.product-button-secondary:hover { background: var(--moss); color: var(--forest-hover); }
.product-button-secondary span { font: var(--small-weight) var(--small-size) / var(--small-line) var(--small-font); color: var(--ink-2); }
.product-sample-link { display: inline-flex; align-items: center; gap: var(--space-2); margin-top: var(--space-5); min-height: 44px; font-weight: 500; }
.product-hero .facts { margin-top: var(--space-6); }

.product-section { padding-block: var(--space-7); border-top: 1px solid var(--rule); }
.product-section-heading { margin-bottom: var(--space-5); }
.product-section-heading p { max-width: var(--measure); }
.product-proof { margin: 0; border: 1px solid var(--rule); border-radius: var(--radius-container); overflow: hidden; background: var(--surface); }
.sample-table { border-collapse: collapse; width: 100%; table-layout: fixed; font-variant-numeric: tabular-nums lining-nums; }
.sample-table caption { padding: var(--space-4) var(--space-5) var(--space-3); text-align: left; font: var(--small-weight) var(--small-size) / var(--small-line) var(--small-font); color: var(--ink-2); }
.sample-table th, .sample-table td { padding: var(--space-1) var(--space-5); text-align: left; border-bottom: 1px solid var(--rule); }
.sample-table thead th { padding-block: var(--space-3); vertical-align: bottom; font: var(--label-weight) var(--label-size) / var(--label-line) var(--label-font); color: var(--ink-2); background: var(--paper); }
.sample-table thead th:first-child { width: 54%; }
.sample-table thead th:not(:first-child) { text-align: center; }
.sample-table thead span { display: block; font-weight: 400; margin-top: 2px; }
.sample-table tbody th { font-weight: 400; }
.sample-table td img { width: 90px; height: 36px; max-width: none; margin-inline: auto; }
.product-proof figcaption { padding: var(--space-4) var(--space-5); background: var(--paper); border-top: 1px solid var(--rule); font: var(--small-weight) var(--small-size) / var(--small-line) var(--small-font); color: var(--ink-2); }
.product-proof figcaption strong { display: block; color: var(--ink); margin-bottom: var(--space-1); }
.product-sample-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4) var(--space-5); margin-top: var(--space-5); }
.product-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6) var(--space-5); margin-top: var(--space-6); }
.product-benefits article { padding-top: var(--space-4); border-top: 1px solid var(--rule); }
.product-benefits h3 { font: var(--h4-weight) var(--h4-size) / var(--h4-line) var(--h4-font); }
.product-privacy-note { margin-top: var(--space-6); padding: var(--space-4) var(--space-5); background: var(--moss); border-left: 2px solid var(--forest); max-width: var(--measure); }
.product-privacy-note h3 { font: var(--h4-weight) var(--h4-size) / var(--h4-line) var(--h4-font); }
.product-privacy-note p { color: var(--ink); margin-top: var(--space-2); }
.product-workflow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6) var(--space-5); list-style: none; counter-reset: step; margin-top: var(--space-6); }
.product-workflow li { counter-increment: step; padding-top: var(--space-4); border-top: 1px solid var(--rule); }
.product-workflow li::before { content: counter(step, decimal-leading-zero); display: block; margin-bottom: var(--space-2); font: var(--numeral-weight) var(--numeral-size) / var(--numeral-line) var(--numeral-font); letter-spacing: var(--numeral-tracking); font-variant-numeric: oldstyle-nums; color: var(--bronze); }
.product-workflow h3 { font: var(--h4-weight) var(--h4-size) / var(--h4-line) var(--h4-font); }
.product-disclosure { margin-top: var(--space-6); border-block: 1px solid var(--rule); }
.product-disclosure summary, .product-faq summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); cursor: pointer; min-height: 44px; padding: var(--space-3) 0; font-weight: 500; list-style: none; }
.product-disclosure summary::-webkit-details-marker, .product-faq summary::-webkit-details-marker { display: none; }
.product-disclosure summary::after, .product-faq summary::after {
  content: ""; flex: none; width: 1em; height: 1em; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform var(--motion-fast);
}
.product-disclosure[open] > summary::after, .product-faq details[open] > summary::after { transform: rotate(180deg); }
.product-disclosure p { margin: 0 0 var(--space-5); max-width: var(--measure); }
.product-app-preview figure { margin: 0 0 var(--space-5); }
.product-app-preview img { width: 100%; height: auto; border: 1px solid var(--rule); border-radius: var(--radius-container); }
.product-app-preview figcaption { margin-top: var(--space-3); }
.product-demo { margin: var(--space-6) 0 0; }
.product-demo video { width: 100%; display: block; border: 1px solid var(--rule); border-radius: var(--radius-container); }
.product-demo figcaption { margin-top: var(--space-3); }
.product-downloads { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8); margin-top: var(--space-6); }
.product-downloads article { display: flex; flex-direction: column; min-width: 0; }
.product-downloads article + article { border-left: 1px solid var(--rule); padding-left: var(--space-8); }
.product-downloads h3 { font: var(--h3-weight) var(--h3-size) / var(--h3-line) var(--h3-font); }
.product-downloads dl { margin-block: var(--space-5); border-top: 1px solid var(--rule); }
.product-downloads dl div { display: flex; gap: var(--space-5); justify-content: space-between; padding-block: var(--space-2); border-bottom: 1px solid var(--rule); font-size: var(--small-size); line-height: var(--small-line); }
.product-downloads dt { color: var(--ink-2); font-weight: 500; }
.product-downloads dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums lining-nums; }
.product-store-badge { display: inline-flex; align-self: flex-start; padding: var(--space-2); margin: auto 0 0 calc(-1 * var(--space-2)); border-radius: var(--radius-control); }
.product-store-badge img { height: 40px; width: auto; max-width: 100%; }
.pdf-product .product-fine { font: var(--small-weight) var(--small-size) / var(--small-line) var(--small-font); color: var(--ink-2); margin-top: var(--space-5); max-width: var(--measure); }
.product-faq { margin-top: var(--space-5); }
.product-faq details { border-bottom: 1px solid var(--rule); }
.product-faq details:first-child { border-top: 1px solid var(--rule); }
.product-faq p { margin: 0 0 var(--space-5); max-width: var(--measure); }
.product-table-scroll { overflow-x: auto; }
.product-alternatives { width: 100%; border-collapse: collapse; }
.product-alternatives th, .product-alternatives td { text-align: left; vertical-align: top; padding: var(--space-4) var(--space-5) var(--space-4) 0; border-bottom: 1px solid var(--rule); }
.product-alternatives thead th { font: var(--label-weight) var(--label-size) / var(--label-line) var(--label-font); color: var(--ink-2); border-bottom-color: var(--control); }
.product-alternatives tbody th { min-width: 170px; font-weight: 500; }
.product-alternatives td { color: var(--ink-2); }
.product-closing { padding-block: var(--space-7) var(--space-9); }
.product-footer { border-top: 1px solid var(--bronze); background: var(--forest-deep); color: var(--footer-muted); padding-block: var(--space-6); font-size: var(--small-size); line-height: var(--small-line); }
.product-footer p { color: var(--footer-muted); margin: 0; }
.product-footer strong { color: var(--paper); }
.product-footer nav { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin-top: var(--space-4); }
.product-footer a { color: var(--paper); text-decoration: none; }
.product-footer a:hover { color: var(--paper); text-decoration: underline; }
.product-footer :focus-visible { outline-color: var(--paper); box-shadow: 0 0 0 4px var(--forest-deep); }
.product-footer .product-fine { margin-top: var(--space-4); }
.product-prose { max-width: var(--prose); padding-block: var(--space-8) var(--space-9); }
.product-prose h2 { margin-top: var(--space-7); font: var(--h3-weight) var(--h3-size) / var(--h3-line) var(--h3-font); letter-spacing: var(--h3-tracking); }
.product-prose ul { padding-left: var(--space-5); margin-top: var(--space-4); color: var(--ink-2); }
.product-prose li + li { margin-top: var(--space-2); }

@media (max-width: 759px) {
  .product-nav { gap: var(--space-3) var(--space-5); flex-wrap: wrap; padding-block: var(--space-3); min-height: 0; }
  .product-nav nav { order: 3; flex-basis: 100%; margin: 0; gap: var(--space-5); }
  .product-nav nav a { min-height: 32px; }
  .product-company { margin-left: auto; padding: 0; border: 0; }
  .product-benefits, .product-workflow { grid-template-columns: 1fr; gap: var(--space-5); }
  .product-downloads { gap: var(--space-5); }
  .product-downloads article + article { padding-left: var(--space-5); }
  .sample-table thead th:first-child { width: 48%; }
  .sample-table th, .sample-table td { padding-inline: var(--space-3); }
}
@media (max-width: 519px) {
  .product-section { padding-block: var(--space-6); }
  .product-actions { display: grid; grid-template-columns: 1fr; }
  .product-downloads { grid-template-columns: 1fr; gap: var(--space-6); }
  .product-downloads article + article { border-left: 0; border-top: 1px solid var(--rule); padding: var(--space-6) 0 0; }
  .sample-table caption { padding: var(--space-3); }
  .sample-table thead th:first-child { width: 46%; }
  .sample-table th, .sample-table td { padding: var(--space-1) var(--space-2); }
  .sample-table tbody th { font-size: var(--label-size); padding-left: var(--space-3); }
  .sample-table thead th { font-size: 13px; }
  .sample-table thead span { font-size: 12px; }
  .sample-table td img { width: 64px; height: 25.6px; }
  .product-proof figcaption { padding: var(--space-3); }
  .product-sample-actions { align-items: stretch; flex-direction: column; }
  .product-alternatives tbody th { min-width: 110px; }
  .product-alternatives th, .product-alternatives td { padding-right: var(--space-3); }
}
@media print {
  .product-header, .product-footer, .product-actions, .product-sample-actions { display: none !important; }
  .product-section { border-top-color: #000; }
}