/* Claude Design: extend the selected clean industrial site, October 2026.
   Existing Helvetica/Arial/PingFang stack; white and pale paper backgrounds;
   1280px shell, 16px body, 44/32/22px headings, 72px section rhythm.
   Full photographs remain separate from copy; no crop or image overlays. */
.product-catalog { color: var(--ink); }
.product-catalog :is(h1, h2, h3, p, dl, article, figure) { min-width: 0; }
.product-catalog p { max-width: 76ch; }
.catalog-hero { padding-block: 40px 64px; }
.page-bearing-detail .catalog-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 56px; }
.page-bearing-detail .catalog-hero--text { grid-template-columns: minmax(0, 1fr); max-width: 840px; }
.catalog-hero h1 { font-size: 44px; line-height: 1.25; }
.catalog-hero h1 + p { margin-top: 24px; }
.catalog-tag { color: var(--cyan-deep); font-size: 14px; margin-bottom: 16px; }
.catalog-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 28px; }
.catalog-actions .text-link { min-height: 44px; display: inline-flex; align-items: center; }
.catalog-hero__photo a, .catalog-photos a { display: block; }
.catalog-hero__photo img, .catalog-photos img { display: block; width: 100%; height: auto; object-fit: contain; }
.product-catalog figcaption { padding-top: 12px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.catalog-section { padding-block: 56px; border-top: 1px solid var(--line); }
.catalog-section > h2 + p, .catalog-section .section-heading > p { margin-top: 16px; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 32px; margin-top: 28px; }
.catalog-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; margin-top: 0; }
.catalog-grid :is(h2, h3) + p { margin-top: 16px; }
.catalog-grid article { padding-top: 24px; border-top: 1px solid var(--line); }
.catalog-grid article .text-link { margin-top: 20px; }
.catalog-rfq { margin-bottom: var(--section-space); }
.material-note { margin-block: 20px 28px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.material-table { width: 100%; min-width: 740px; border-collapse: collapse; }
.material-table :is(th, td) { padding: 20px 24px; vertical-align: top; text-align: left; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 1.7; }
.material-table thead th { background: var(--paper); color: var(--ink); font-size: 14px; font-weight: 600; }
.material-table th:first-child { width: 23%; }
.material-table th strong { display: block; font-size: 22px; }
.material-table th span { display: block; margin-top: 6px; font-size: 14px; font-weight: 400; }
.material-table td p { margin: 0; }
.material-table td a { display: inline-block; padding-top: 8px; font-size: 13px; }
.material-review { margin-block: 28px 40px; }
.material-review > div { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(0, 3fr); gap: 32px; padding-block: 22px; border-top: 1px solid var(--line); }
.material-review dt { font-weight: 600; }
.material-review dd { margin: 0; }
.material-sources ul { margin-top: 20px; padding-left: 24px; }
.material-sources li + li { margin-top: 10px; }
.series-material .shell > p { max-width: 76ch; margin-top: 20px; }
.bearing-catalog { margin-top: 40px; }
.bearing-catalog__group + .bearing-catalog__group { margin-top: 56px; }
.bearing-catalog__group > h3 { padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.bearing-catalog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 36px 24px; margin-top: 24px; }
.bearing-catalog__item { min-width: 0; scroll-margin-top: calc(var(--header-height) + 24px); }
.bearing-catalog__image { display: block; background: var(--paper); }
.bearing-catalog__image img { width: 100%; height: auto; object-fit: contain; }
.bearing-catalog__copy { padding-top: 20px; }
.bearing-catalog h4 { font-family: var(--body); font-size: 20px; line-height: 1.4; font-weight: 600; }
.bearing-catalog h4 a { color: inherit; text-decoration: none; }
.bearing-catalog .text-link { margin-top: 12px; font-size: 14px; }
.bearing-catalog__series { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.bearing-catalog__series a { display: flex; align-items: center; min-height: 44px; padding: 8px 14px; border: 1px solid var(--line); font-size: 14px; }
.catalog-directory-note { margin-block: 16px 24px; font-size: 16px; }
@media (max-width: 900px) {
  .page-bearing-detail .catalog-hero { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .catalog-hero__photo { order: -1; }
  .catalog-hero h1 { font-size: 36px; }
  .catalog-grid, .catalog-grid--two { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .bearing-catalog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-section { padding-block: 40px; }
}
@media (max-width: 600px) {
  .catalog-hero { padding-block: 28px 40px; }
  .catalog-hero h1 { font-size: 32px; }
  .catalog-hero__photo { order: 0; }
  .catalog-actions { gap: 12px 20px; }
  .material-review > div { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .material-table :is(th, td) { padding: 16px; }
  .bearing-catalog__grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .bearing-catalog__copy { padding-top: 16px; }
}

/* Compact product detail refinement: preserve 16px text and complete imagery.
   Group spacing 32px; content spacing 12–20px; materials are readable inline. */
.page-product-compact :is(h2, h3) { font-size: 24px; line-height: 1.35; }
.page-product-compact :is(p, dd) { font-size: 16px; line-height: 1.7; }
.page-product-compact .section { padding-block: 32px; }
.page-product-compact .eyebrow { margin-bottom: 8px; }
.product-detail-overview { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); column-gap: 32px; padding-block: 24px 32px; }
.product-detail-heading { grid-column: 2; margin-bottom: 20px; }
.product-detail-heading h1 { font-size: 38px; line-height: 1.3; }
.product-detail-heading > p { margin-top: 12px; }
.product-detail-summary { display: contents; }
.product-detail-summary > .product-detail-photo { grid-column: 1; grid-row: 1 / span 2; }
.product-detail-summary__copy { grid-column: 2; }
.product-detail-summary--text { grid-template-columns: minmax(0, 1fr); }
.product-detail-summary__copy > p { margin-top: 12px; }
.page-product-compact .scope-note { margin-top: 16px; padding-top: 12px; font-size: 14px; }
.page-product-compact .catalog-actions { gap: 12px 20px; margin-top: 16px; }
.product-detail-photo a, .product-detail-photo img { display: block; width: 100%; }
.product-detail-photo img { height: auto; object-fit: contain; }
.product-detail-photo figcaption { padding-top: 8px; font-size: 13px; line-height: 1.5; color: var(--muted); }
.product-gallery { min-width: 0; align-self: start; }
.product-gallery__main { aspect-ratio: 3 / 2; background: var(--paper); }
.product-detail-photo .product-gallery__main img { width: 100%; height: 100%; object-fit: contain; }
.product-gallery__thumbnails { display: flex; gap: 8px; overflow-x: auto; padding: 3px; margin: 9px -3px 0; }
.product-gallery__thumbnail { display: grid; place-items: center; flex: 0 0 72px; height: 54px; min-height: 44px; padding: 4px; border: 2px solid var(--line); background: var(--white); cursor: pointer; }
.product-gallery__thumbnail[aria-pressed="true"] { border-color: var(--cyan); }
.product-gallery__thumbnail:hover:not([aria-pressed="true"]) { border-color: var(--ink); }
.product-gallery__thumbnail:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.product-detail-photo .product-gallery__thumbnail img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.product-series-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.product-series-links a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--line); text-decoration: none; }
.product-series-links span { font-size: 14px; }
.product-series-comparison { padding-block: 32px; border-top: 1px solid var(--line); }
.product-series-comparison__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; margin-top: 20px; }
.product-series-comparison h2 { scroll-margin-top: 16px; }
.product-series-item { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 20px; padding-top: 16px; border-top: 1px solid var(--line); scroll-margin-top: 16px; }
.product-series-item__photo { margin: 0; }
.product-series-item__photo a { display: grid; width: 100%; aspect-ratio: 1; place-items: center; }
/* Reuse the measured product offsets. Shrink only enough to keep all four
   edges of each source photograph inside its square while centering the cage. */
.product-series-item__photo img { display: block; width: var(--series-photo-size, 100%); height: auto; object-fit: contain; transform: translate(var(--product-x, 0), var(--product-y, 0)); }
.product-series-item__photo .product-frame--hf { --series-photo-size: 76%; }
.product-series-item__photo .product-frame--hfl { --series-photo-size: 84%; }
.product-series-item__photo .product-frame--k { --series-photo-size: 89%; }
.product-series-item__photo .product-frame--hk { --series-photo-size: 67%; }
.product-series-item__photo .product-frame--axk { --series-photo-size: 75%; }
.product-series-item__photo .product-frame--k812 { --series-photo-size: 86%; }
.product-series-item__photo .product-frame--axs { --series-photo-size: 99%; }
.product-series-item__photo figcaption { margin-top: 8px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.product-series-item h3 { font-size: 24px; }
.product-series-item p { margin-top: 10px; }
.product-series-item .product-series-item__label { margin-top: 6px; font-weight: 600; }
.product-series-item .text-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 8px; }
.product-detail-content { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 32px; padding-block: 32px; border-top: 1px solid var(--line); }
.product-design-list { margin-top: 16px; }
.product-design-list > div { padding-block: 12px; border-bottom: 1px solid var(--line); }
.product-design-list dt { font-size: 16px; font-weight: 600; }
.product-design-list dd { margin: 6px 0 0; color: var(--muted); }
.product-materials { min-width: 0; }
.product-materials__context { margin-top: 12px; }
.page-product-compact p.product-materials__note { margin-top: 8px; font-size: 14px; color: var(--muted); }
.product-materials__table { width: 100%; border-collapse: collapse; margin-top: 16px; table-layout: fixed; }
.product-materials__table caption { text-align: left; padding-bottom: 10px; color: var(--muted); font-size: 14px; }
.product-materials__table :is(th, td) { padding: 12px 16px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; line-height: 1.6; overflow-wrap: anywhere; }
.product-materials__table thead th { color: var(--ink); background: var(--paper); font-size: 14px; font-weight: 600; }
.product-materials__table tbody th { color: var(--ink); background: var(--white); }
.product-materials__table th:first-child { width: 30%; }
.product-materials__table tbody th strong { font-size: 16px; }
.product-materials__name { display: inline; margin-left: 8px; font-size: 13px; font-weight: 400; color: var(--muted); }
.product-materials__table td { font-size: 16px; }
.product-materials__guide { margin-top: 8px; }
.product-materials__guide .text-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }
.nylon-reference { margin-top: 24px; }
.nylon-reference h3 { font-size: 20px; }
.nylon-reference__table { width: 100%; table-layout: fixed; border-collapse: collapse; margin-top: 12px; }
.nylon-reference__table caption { text-align: left; padding-bottom: 8px; color: var(--muted); font-size: 14px; }
.nylon-reference__table :is(th, td) { padding: 10px 8px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.nylon-reference__table th:first-child { width: 42%; }
.nylon-reference__table thead th { background: var(--paper); font-size: 14px; }
.nylon-reference__table tbody th { background: var(--white); font-weight: 500; text-transform: none; letter-spacing: 0; }
.nylon-reference__unit { display: block; font-size: 13px; color: var(--muted); }
.page-product-compact p.nylon-reference__note, .nylon-reference__note { margin-top: 10px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.nylon-reference__sources { margin-top: 8px; font-size: 14px; }
.nylon-reference__sources summary { cursor: pointer; min-height: 44px; padding-block: 10px; }
.nylon-reference__sources a { display: inline-block; padding-block: 10px; }
.product-detail-enquiry { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 32px; padding-block: 32px; border-top: 1px solid var(--line); }
.product-detail-enquiry > div > p { margin-top: 12px; }
.product-detail-enquiry .catalog-actions { flex-direction: column; align-items: flex-start; margin-top: 0; }
.page-product-compact p.product-detail-attachment { font-size: 14px; color: var(--muted); }
.page-product-compact .product-hero { gap: 32px; padding-block: 24px 32px; }
.page-product-compact .product-hero__visual { display: block; max-width: 360px; padding: 16px; aspect-ratio: auto; }
.page-product-compact .product-hero__visual img { height: auto; transform: none; }
.page-product-compact .product-hero__visual figcaption { position: static; margin-top: 8px; padding: 0; border: 0; background: none; font-size: 13px; letter-spacing: 0; }
.page-product-compact .product-hero__copy h1 { font-size: 36px; }
.page-product-compact .product-hero__copy > p:not(.eyebrow, .scope-note) { margin-top: 12px; }
.page-product-compact .product-hero__copy .button { margin-top: 16px; }
.page-product-compact .two-column-heading { gap: 32px; }
.page-product-compact .two-column-heading h2 { font-size: 24px; }
.page-product-compact .spec-list > div { gap: 16px; padding-block: 12px; }
.product-series-information { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: start; gap: 32px; }
.product-series-introduction { grid-column: 1 / -1; padding-top: 24px; border-top: 1px solid var(--line); }
.product-series-introduction .prose { margin-top: 12px; }
.page-product-compact .prose p + p { margin-top: 12px; }
.page-product-compact .custom-project__grid { gap: 32px; align-items: start; }
.page-product-compact .custom-project__grid > figure { max-width: 360px; }
.page-product-compact .custom-project h2 { font-size: 24px; }
.page-product-compact .needle-cage-guidance__questions { gap: 16px; }
.page-product-compact .needle-cage-guidance__item { padding-bottom: 16px; }
.page-product-compact .needle-cage-guidance__item h3 { font-size: 20px; }
@media (max-width: 900px) {
  .product-series-comparison__list { grid-template-columns: minmax(0, 1fr); }
  .product-detail-overview { display: block; }
  .product-series-information { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .product-detail-summary, .product-detail-content { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .product-detail-summary > .product-detail-photo, .product-detail-summary__copy { grid-column: auto; grid-row: auto; }
  .product-detail-summary > .product-detail-photo { max-width: 520px; }
  .product-detail-enquiry { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .product-detail-enquiry .catalog-actions { flex-direction: row; align-items: center; }
}
@media (max-width: 600px) {
  .product-series-comparison { padding-block: 24px; }
  .product-series-item { grid-template-columns: 112px minmax(0, 1fr); gap: 12px 16px; }
  .product-series-item__photo { grid-column: 1; grid-row: 1; }
  .product-series-item__copy { display: contents; }
  .product-series-item__heading { grid-column: 2; grid-row: 1; align-self: start; }
  .product-series-item__copy > p:not(.product-series-item__label) { grid-column: 1 / -1; margin: 0; }
  .product-series-item .text-link { grid-column: 1 / -1; justify-self: start; margin-top: 0; }
  .product-gallery__thumbnail { flex-basis: 60px; height: 48px; }
  .product-detail-heading h1 { font-size: 32px; }
  .product-detail-overview, .product-detail-content, .product-detail-enquiry { padding-block: 24px; }
  .product-detail-heading { margin-bottom: 16px; }
  .product-materials__table :is(th, td) { padding: 10px 12px; }
  .product-materials__table th:first-child { width: 140px; }
  .product-materials__name { display: block; margin: 3px 0 0; font-size: 13px; }
}