/* Medical-gas collection and static product details. Scoped to preserve site chrome. */
.accessories-section, .accessory-detail { --accessory-green: #087536; --accessory-forest: #084a29; color: #17251e; font-family: Roboto, Arial, sans-serif; }
.accessory-width { width: min(89.2%, 1260px); margin-inline: auto; }
.accessories-section { padding-block: 88px 76px; background: #f4f6f3; scroll-margin-top: 100px; }
.kinmel-home .accessory-eyebrow { margin: 0 0 18px; font: 700 13px/1.5 Roboto, Arial, sans-serif; letter-spacing: 2px; text-transform: uppercase; color: var(--accessory-green); }
.accessories-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 56px; margin-bottom: 36px; }
.kinmel-home #accessories-heading { margin: 0; padding: 0; font: 600 clamp(32px, 3.8vw, 52px)/1.16 Poppins, Arial, sans-serif; letter-spacing: -1.7px; color: var(--accessory-forest); }
.kinmel-home .accessories-heading > p { max-width: 390px; margin: 0 0 4px; color: #59665e; font: 400 17px/1.7 Roboto, Arial, sans-serif; }
.accessory-filters { display: flex; flex-wrap: wrap; gap: 10px; padding-block: 0 28px; }
.accessory-filters button { border: 1px solid #cad8cd; border-radius: 24px; padding: 10px 18px; min-height: 44px; cursor: pointer; background: transparent; color: #405347; font: 500 14px/1.5 Roboto, Arial, sans-serif; transition: color .2s, background .2s, border-color .2s; }
.accessory-filters button:hover { background: #e5ede6; }
.accessory-filters button[aria-pressed="true"] { background: var(--accessory-forest); color: white; border-color: var(--accessory-forest); }
.accessory-filters button span { padding: 2px 6px; margin-left: 8px; border-radius: 10px; background: #ffffff25; font-size: 12px; }
.accessory-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.kinmel-home .accessory-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid #dce5dd; border-radius: 12px; overflow: hidden; background: #fff; color: #17251e; text-decoration: none; transition: transform .25s, box-shadow .25s, border-color .25s; }
.kinmel-home .accessory-card[hidden] { display: none; }
.kinmel-home .accessory-card:hover { border-color: #8bad95; transform: translateY(-5px); box-shadow: 0 16px 36px #123c2012; }
.accessory-card-image { background: #f4f6f3; overflow: hidden; padding: 0 8%; border-bottom: 1px solid #eef1ec; }
.accessory-art { position: relative; display: block; overflow: hidden; width: 100%; aspect-ratio: 1; background: #f4f6f3; }
.kinmel-home .accessory-art img { display: block; position: absolute; width: 303%; height: 303%; max-width: none; top: calc(var(--row) * -101% - .5%); left: calc(var(--column) * -101% - .5%); object-fit: fill; }
.accessory-card-copy { padding: 25px 26px 20px; display: flex; flex-direction: column; flex: 1; }
.kinmel-home .accessory-category { font: 700 11px/1.5 Roboto, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1.4px; margin: 0 0 10px; color: var(--accessory-green); }
.kinmel-home .accessory-card h3 { padding: 0; margin: 0 0 12px; color: #163d26; font: 600 clamp(20px,1.65vw,24px)/1.3 Poppins, Arial, sans-serif; letter-spacing: -.6px; }
.kinmel-home .accessory-summary { margin: 0 0 24px; font: 400 16px/1.6 Roboto, Arial, sans-serif; color: #647168; }
.accessory-card-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 17px; border-top: 1px solid #e7ece7; color: var(--accessory-forest); font: 700 14px/1.5 Roboto, Arial, sans-serif; }
.accessory-card-link > span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #d4e1d7; border-radius: 50%; font-size: 21px; transition: background .2s,color .2s; }
.accessory-card:hover .accessory-card-link > span { background: var(--accessory-green); color: white; border-color: var(--accessory-green); }
.accessory-section-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: 30px; }
.kinmel-home .accessory-section-footer p { max-width: 580px; margin: 0; font: 400 13px/1.6 Roboto, Arial, sans-serif; color: #647168; }
.accessory-section-footer a { font-size: 14px; font-weight: 700; color: var(--accessory-green); }
.accessory-section-footer a:hover { text-decoration: underline; }
.accessory-detail { background: #fff; padding-bottom: 70px; }
.accessory-breadcrumb { display: flex; flex-wrap: wrap; gap: 9px; padding-block: 26px 32px; font-size: 13px; color: #66766b; }
.accessory-breadcrumb a { color: #306742; }
.accessory-breadcrumb a:hover { text-decoration: underline; }
.accessory-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px,5vw,76px); align-items: start; }
.accessory-detail-photo { margin: 0; min-width: 0; }
.accessory-detail-frame { padding: 6%; background: #f4f6f3; border: 1px solid #dde7df; border-radius: 14px; overflow: hidden; }
.accessory-detail-photo figcaption { color: #718076; font: 400 12px/1.6 Roboto, Arial, sans-serif; margin-top: 12px; }
.accessory-detail-copy { padding-top: 12px; }
.kinmel-home .accessory-detail h1 { margin: 0 0 22px; padding: 0; font: 600 clamp(34px,3.5vw,50px)/1.12 Poppins, Arial, sans-serif; letter-spacing: -1.7px; color: #084a29; }
.kinmel-home .accessory-detail-copy .accessory-detail-lead { font-size: 22px; line-height: 1.4; color: #2b4535; margin: 0 0 20px; }
.kinmel-home .accessory-detail-copy > p:not(.accessory-eyebrow):not(.accessory-detail-lead) { margin: 0 0 26px; font: 400 16px/1.75 Roboto, Arial, sans-serif; color: #617168; }
.accessory-key-details { margin: 28px 0; padding: 18px 0; border-block: 1px solid #dfe7df; }
.accessory-key-details > div { display: grid; grid-template-columns: 145px 1fr; gap: 18px; padding: 7px 0; font-size: 14px; line-height: 1.5; }
.accessory-key-details dt { font-weight: 500; color: #67796c; }
.accessory-key-details dd { margin: 0; font-weight: 500; color: #243f2e; }
.accessory-primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 28px; padding: 17px 24px; border-radius: 5px; background: var(--accessory-green); color: #fff; font: 700 16px/1.5 Roboto, Arial, sans-serif; transition: background .2s; }
.accessory-primary-button:hover { color: #fff; background: var(--accessory-forest); }
.accessory-call { display: block; width: fit-content; margin-top: 16px; color: #336d47; font-size: 14px; }
.accessory-enquiry-guide { margin-top: 32px; padding: 24px; background: #f3f7f2; border-radius: 7px; }
.kinmel-home .accessory-enquiry-guide h2 { margin: 0 0 12px; padding: 0; font: 600 18px/1.45 Poppins,Arial,sans-serif; color: #214c32; }
.kinmel-home .accessory-enquiry-guide p { margin: 0 0 10px; font-size: 14px; color: #5a6b5f; }
.accessory-enquiry-guide ul { margin: 0; padding-left: 19px; color: #4a6152; font-size: 14px; line-height: 1.7; }
.accessory-enquiry-guide li + li { margin-top: 6px; }
.accessory-reference { margin-top: 24px; border: 1px solid #dfe7df; border-radius: 5px; padding: 14px; font-size: 14px; }
.accessory-reference summary { cursor: pointer; color: #23633a; font-weight: 500; }
.accessory-reference img { display: block; width: auto; max-width: 100%; max-height: 540px; object-fit: contain; margin: 18px auto 0; }
.accessory-related { margin-top: 76px; padding-top: 40px; border-top: 1px solid #dfe7df; }
.accessory-related-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 28px; }
.kinmel-home .accessory-related h2 { padding: 0; margin: 0; font: 600 30px/1.3 Poppins,Arial,sans-serif; letter-spacing: -1px; color: #084a29; }
.accessory-related-heading a { color: var(--accessory-green); font-weight: 700; font-size: 14px; }
@media (max-width: 1000px) {
  .accessories-heading { gap: 30px; align-items: start; }
  .accessories-heading > div { flex: 1; }
  .kinmel-home .accessories-heading > p { max-width: 310px; }
  .accessory-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
  .accessory-detail-grid { gap: 30px; }
  .accessory-key-details > div { grid-template-columns: 1fr; gap: 3px; }
  .accessory-primary-button { gap: 14px; padding-inline: 18px; }
}
@media (max-width: 700px) {
  .accessories-section { padding-block: 52px; }
  .accessories-heading { display: block; }
  .kinmel-home .accessories-heading > p { max-width: none; margin-top: 22px; }
  .kinmel-home #accessories-heading { font-size: 36px; }
  .accessory-filters { gap: 8px; }
  .accessory-filters button { font-size: 13px; padding-inline: 14px; }
  .accessory-detail-grid { grid-template-columns: 1fr; }
  .accessory-detail-photo { max-width: 520px; width: 100%; }
  .accessory-detail-copy { padding-top: 0; }
  .accessory-detail-frame { padding: 3%; }
  .accessory-key-details > div { grid-template-columns: 135px 1fr; gap: 12px; }
  .accessory-related-heading { align-items: start; flex-direction: column; gap: 15px; }
}
@media (max-width: 520px) {
  .accessory-grid { grid-template-columns: 1fr; }
  .accessory-card-image { padding: 0 12%; }
  .accessory-card-copy { padding: 22px; }
  .kinmel-home .accessory-card h3 { font-size: 24px; }
  .accessory-breadcrumb { font-size: 12px; padding-block: 20px; }
  .accessory-key-details > div { grid-template-columns: 1fr; gap: 3px; }
  .accessory-primary-button { font-size: 15px; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .accessories-section *, .accessory-detail * { transition: none !important; } }
