/* Product pages (/products/<slug>/), on top of service.css. Both themes via site.css tokens. */

.price-card { display: grid; gap: 10px; min-width: 260px; padding: 26px; background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--r) * 2); box-shadow: var(--shadow); }
.price-card .tile-icon { margin-bottom: 10px; }
.price-card p { margin: 0; }
.price-value { font: 800 clamp(1.4rem, 2.4vw, 1.9rem)/1.15 var(--font-display); letter-spacing: -.01em; }

.pb-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: calc(var(--r) * 2); background: var(--surface); }
.pb { width: 100%; border-collapse: collapse; font-size: .95rem; }
.pb th { font: 500 .75rem var(--font-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--fg); }
.pb td { padding: 14px 18px; border-bottom: 1px solid var(--border); vertical-align: top; }
.pb tbody tr:last-child td { border-bottom: 0; }
.pb tfoot td { border-top: 1px solid var(--fg); border-bottom: 0; font-weight: 600; }
.pb .num { text-align: right; white-space: nowrap; }
.pb .nowrap { white-space: nowrap; }
.pb-name { font-weight: 600; min-width: 180px; }
.pb .muted { color: var(--muted); }

.pb-extras-title { margin: 32px 0 12px; }
.pb-extras { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.pb-extras li { display: grid; grid-template-columns: minmax(180px, 1fr) 2fr auto; gap: 16px; align-items: baseline; padding: 14px 18px; background: var(--surface); border: 1px dashed var(--border); border-radius: var(--r); }
.pb-note { margin-top: 18px; }

@media (max-width: 860px) {
  .price-card { min-width: 0; }
  .price-card .tile-icon { display: none; }
  .pb-extras li { grid-template-columns: 1fr; gap: 4px; }
}
@media (max-width: 560px) {
  .pb { font-size: .9rem; }
  .pb th, .pb td { padding: 12px; }
  .pb th:nth-child(2), .pb td:nth-child(2) { display: none; }
}