/* Catalog and use-case additions; loaded after the shared public shell. */
:root {
  --catalog-row-padding: 20px;
  --catalog-number-size: 13px;
  --catalog-header-size: 11px;
  --catalog-detail-padding: 28px;
  --catalog-table-width: 900px;
}

.pricing-page { padding-block: 16px 88px; }
.pricing-intro { max-width: 1000px; margin-bottom: 16px; }
.pricing-intro .eyebrow { display: none; }
.pricing-intro h1 { margin: 0 0 10px; font-size: clamp(30px, 2.85vw, 38px); }
.pricing-intro > p:last-child { margin-bottom: 0; font-size: 14px; line-height: 1.75; }
.filter-panel { padding: 14px; }
.pricing-page .category-row { margin-top: 12px; }
.pricing-page .catalog-section { margin-top: 8px; }
.pricing-page .pricing-status { min-height: 38px; padding-block: 6px; }
.pricing-page .pricing-note { padding: 10px 12px; margin: 0 0 8px; }
.pricing-page .result-heading { padding-block: 6px 10px; }
.search-row { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, 1.3fr); }
.catalog-section, .catalog-list, .catalog-block { min-width: 0; max-width: 100%; }
.catalog-list { display: block; }
.catalog-list > .price-skeleton { min-height: 90px; margin-bottom: 12px; }
.catalog-list > .price-skeleton i { margin-bottom: 12px; }
.catalog-list > .price-skeleton i:nth-child(n+3) { display: none; }
.catalog-block + .catalog-block { margin-top: 44px; }
.catalog-block-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 0 10px; }
.catalog-block-heading h3 { display: flex; align-items: center; gap: 12px; margin: 0 0 4px; font-size: 20px; letter-spacing: -.02em; }
.catalog-block-count { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; padding: 2px 8px; border: 1px solid var(--color-border); border-radius: var(--radius-full); color: var(--color-text-muted); font: 11px/1.6 var(--font-mono); }
.catalog-block-heading p { margin: 0; color: var(--color-text-muted); font-size: 12px; }
.catalog-unit { flex-shrink: 0; padding: 7px 11px; border: 1px solid var(--color-border-subtle); border-radius: var(--radius-sm); color: var(--color-primary-light); background: var(--color-bg-secondary); font: 11px/1.5 var(--font-mono); }
.catalog-scroll-hint { display: none; }
.catalog-table-scroll { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-bg-card); }
.catalog-table-scroll:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 4px; }
.catalog-table { width: 100%; min-width: var(--catalog-table-width); border-collapse: separate; border-spacing: 0; table-layout: fixed; text-align: left; }
.catalog-table > thead { background: var(--color-bg-secondary); }
.catalog-table > thead th { padding: 16px var(--catalog-row-padding); border-bottom: 1px solid var(--color-border); color: var(--color-text-muted); font-size: var(--catalog-header-size); font-weight: 500; }
.catalog-row > th, .catalog-row > td { padding: 22px var(--catalog-row-padding); border-bottom: 1px solid var(--color-border-subtle); vertical-align: middle; font-weight: 400; }
.catalog-row:last-of-type > th, .catalog-row:last-of-type > td { border-bottom: 0; }
.catalog-row:hover > th, .catalog-row:hover > td, .catalog-row.is-expanded > th, .catalog-row.is-expanded > td { background: var(--color-bg-hover); }
.catalog-token .catalog-col-0 { width: 29%; }
.catalog-token .catalog-col-1 { width: 21%; }
.catalog-token .catalog-col-2, .catalog-token .catalog-col-3, .catalog-token .catalog-col-4 { width: 12%; }
.catalog-token .catalog-col-5 { width: 14%; }
.catalog-image .catalog-col-0, .catalog-video .catalog-col-0, .catalog-request .catalog-col-0 { width: 29%; }
.catalog-image .catalog-col-1, .catalog-video .catalog-col-1, .catalog-request .catalog-col-1 { width: 23%; }
.catalog-image .catalog-col-2, .catalog-video .catalog-col-2, .catalog-request .catalog-col-2 { width: 19%; }
.catalog-image .catalog-col-3, .catalog-video .catalog-col-3, .catalog-request .catalog-col-3 { width: 15%; }
.catalog-image .catalog-col-4, .catalog-video .catalog-col-4, .catalog-request .catalog-col-4 { width: 14%; }
.catalog-model-name { display: block; color: var(--color-text-primary); font: 13px/1.65 var(--font-mono); font-weight: 650; overflow-wrap: anywhere; }
.catalog-model-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.catalog-model-meta .platform-label { font-size: 9px; letter-spacing: .04em; }
.catalog-model-meta .category-badge { padding: 1px 6px; font-size: 9px; }
.catalog-tier-badge { color: var(--color-text-muted); font-size: 10px; }
.catalog-group-name { display: block; font-size: 12px; color: var(--color-text-secondary); overflow-wrap: anywhere; }
.catalog-group-meta { display: block; margin-top: 7px; color: var(--color-text-muted); font: 10px/1.7 var(--font-mono); }
.catalog-group-meta > span { margin-inline: 3px; }
.catalog-value { color: var(--color-primary-light); font: var(--catalog-number-size)/1.7 var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.catalog-specification { color: var(--color-text-secondary); font: 11px/1.7 var(--font-mono); }
.catalog-tier-list { list-style: none; padding: 0; margin: 0; }
.catalog-tier-list li { min-height: 30px; display: flex; align-items: center; }
.catalog-tier-list li + li { border-top: 1px solid var(--color-border-subtle); }
.catalog-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-width: 80px; min-height: 44px; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: transparent; color: var(--color-text-secondary); font-size: 11px; }
.catalog-toggle:hover { border-color: var(--color-primary-dark); color: var(--color-primary-light); background: var(--color-bg-secondary); }
.catalog-toggle-icon { display: inline-block; font-size: 18px; line-height: 1; transition: transform var(--duration-fast) var(--ease-default); }
.catalog-toggle[aria-expanded="true"] .catalog-toggle-icon { transform: rotate(45deg); }
.catalog-detail[hidden] { display: none; }
.catalog-detail > td { padding: 0; background: var(--color-bg-secondary); }
.catalog-detail-content { padding: var(--catalog-detail-padding); border-bottom: 1px solid var(--color-border); box-shadow: inset 3px 0 0 var(--color-primary-dark); white-space: normal; }
.catalog-detail-heading { padding-bottom: 18px; }
.catalog-detail-heading h3 { margin: 0 0 6px; color: var(--color-text-primary); font: 15px/1.6 var(--font-mono); overflow-wrap: anywhere; }
.catalog-detail-heading > p { margin: 0; }
.catalog-detail-heading .group-description { margin-top: 12px; }
.catalog-detail-grid { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(220px, 1fr); gap: 32px; }
.catalog-detail-grid > section { min-width: 0; }
.catalog-detail-content .price-table-scroll { border: 1px solid var(--color-border-subtle); border-radius: var(--radius-sm); padding: 14px 16px; background: var(--color-bg-card); }
.catalog-detail-content .price-table { min-width: 620px; }
.catalog-detail-rules h4 { margin-top: 0; }
.catalog-detail-content .rule-block { padding-top: 12px; }
.catalog-detail-content .rule-warning { color: var(--color-warning); }
.catalog-detail-content .price-table caption { font-size: 11px; }
.catalog-detail-content .price-table th, .catalog-detail-content .price-table td { padding-block: 12px; }

.use-cases-section { border-top: 1px solid var(--color-border-subtle); }
.use-case-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.use-case { display: flex; flex-direction: column; min-width: 0; padding: 30px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-bg-secondary); }
.use-case-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.use-case-number { color: var(--color-text-muted); font: 11px var(--font-mono); }
.use-case-icon { color: var(--color-primary); }
.use-case-icon svg { display: block; width: 24px; height: 24px; }
.use-case h3 { margin: 0 0 14px; font-size: 21px; }
.use-case > p { max-width: 460px; margin: 0 0 24px; color: var(--color-text-secondary); font-size: 14px; line-height: 1.85; }
.use-case-flow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: auto; padding-block: 17px; border-block: 1px solid var(--color-border-subtle); color: var(--color-text-muted); font-size: 11px; }
.use-case-flow svg { width: 16px; height: 16px; color: var(--color-primary); flex: 0 0 auto; }
.use-case .inline-link { margin-top: 12px; align-self: flex-start; }

@media (max-width: 1100px) {
  :root { --catalog-row-padding: 16px; --catalog-number-size: 12px; }
  .catalog-detail-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
}
@media (max-width: 760px) {
  .pricing-page { padding-top: 32px; }
  .pricing-intro .eyebrow { display: flex; }
  .pricing-intro h1 { font-size: 33px; }
  .filter-panel { padding: 18px; }
  .search-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .search-field { grid-column: 1 / -1; }
  .catalog-block + .catalog-block { margin-top: 32px; }
  .catalog-block-heading { align-items: flex-start; flex-direction: column; gap: 12px; padding-bottom: 10px; }
  .catalog-block-heading h3 { font-size: 18px; }
  .catalog-block-heading p { font-size: 11px; }
  .catalog-unit { font-size: 10px; padding: 5px 9px; }
  .catalog-scroll-hint { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin: 0 0 10px; color: var(--color-text-muted); font-size: 10px; }
  .catalog-scroll-hint svg { width: 16px; height: 16px; }
  .catalog-detail-content { position: sticky; left: 0; width: calc(100vw - 42px); padding: 20px 16px; }
  .catalog-detail-content .price-table-scroll { padding: 10px 12px; }
  .catalog-detail-heading h3 { font-size: 13px; }
  .use-case-grid { grid-template-columns: 1fr; gap: 14px; }
  .use-case { padding: 24px; }
  .use-case-top { margin-bottom: 20px; }
  .use-case h3 { font-size: 19px; }
  .use-case > p { max-width: none; font-size: 13px; margin-bottom: 20px; }
}
@media (max-width: 480px) {
  .search-row { grid-template-columns: minmax(0, 1fr); }
  .search-field { grid-column: auto; }
  .catalog-row > th, .catalog-row > td { padding-block: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .catalog-toggle-icon { transition: none; }
}