/* Product pages share the header, footer, cards, palette and page width. */
.pdp { padding-top: calc(var(--site-chrome-height) + 28px); padding-bottom: 80px; }
.pdp-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 30px; color: var(--muted); font-size: 14px; }
.pdp-breadcrumb a { display: inline-flex; align-items: center; min-height: 32px; }
.pdp-breadcrumb a:hover { text-decoration: underline; text-underline-offset: 4px; }
.pdp-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); align-items: start; gap: clamp(36px, 5vw, 110px); }
.pdp-gallery { --pdp-thumb-width: 76px; display: grid; grid-template-columns: var(--pdp-thumb-width) minmax(0, 1fr); gap: 12px 16px; align-items: start; min-width: 0; }
.pdp-stage-button { grid-column: 2; grid-row: 1; position: relative; display: grid; place-items: center; width: 100%; height: clamp(420px, 60svh, 760px); padding: 38px 48px 64px; border: 1px solid #e3d7c6; border-radius: 34px; background: var(--sand); }
.pdp-stage-button > img { width: 100%; height: 100%; min-height: 0; object-fit: contain; mix-blend-mode: multiply; }
.pdp-stage-button.is-label { background: var(--white); }
.pdp-stage-button.is-label > img { mix-blend-mode: normal; }
.pdp-image-note { position: absolute; right: 26px; bottom: 22px; left: 26px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 14px; }
.pdp-image-note > span { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #493c3540; border-radius: 50%; font-size: 23px; }
.pdp-gallery-bottom { display: contents; }
.pdp-thumbnails { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; gap: 10px; }
.pdp-thumbnail { display: grid; place-items: center; width: var(--pdp-thumb-width); height: 84px; padding: 8px; border: 1px solid var(--line); border-radius: 15px; background: var(--white); }
.pdp-thumbnail.is-active { border: 2px solid var(--green); background: #eee8dc; }
.pdp-thumbnail img { width: 100%; height: 100%; min-height: 0; object-fit: contain; mix-blend-mode: multiply; }
.pdp-image-count { grid-column: 2; grid-row: 2; justify-self: end; color: var(--muted); font-size: 14px; font-variant-numeric: tabular-nums; }
.pdp-summary { position: sticky; top: calc(var(--site-chrome-height) + 20px); min-width: 0; }
.pdp-title { margin-top: 14px; font-size: clamp(32px, 3.2vw, 58px); font-weight: 550; line-height: 1.1; letter-spacing: -.055em; text-wrap: balance; }
.pdp-title:focus { outline: none; }
.pdp-intro { max-width: 57ch; margin-top: 22px; color: var(--muted); font-size: 18px; line-height: 1.6; }
.pdp-description-link { margin-top: 8px; }
.pdp-highlights { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 14px; margin: 22px 0; padding-block: 20px; border-block: 1px solid var(--line); }
.pdp-highlights dt { color: var(--muted); font-size: 14px; }
.pdp-highlights dd { margin: 5px 0 0; font-size: 18px; font-weight: 600; }
.pdp-purchase { padding-top: 3px; }
.pdp-price-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.pdp-price { font-size: clamp(32px, 3vw, 48px); font-weight: 600; letter-spacing: -.055em; font-variant-numeric: tabular-nums; }
.pdp-stock { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 14px; }
.pdp-buy { width: 100%; margin-top: 18px; min-height: 54px; font-size: 18px; }
.pdp-source-date { max-width: 60ch; margin-top: 12px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.pdp-help { display: flex; align-items: center; gap: 14px; margin-top: 24px; padding: 18px 20px; border-radius: 18px; background: #eee6da; }
.pdp-help > span { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border: 1px solid #493c3540; border-radius: 50%; font-size: 22px; }
.pdp-help strong, .pdp-help a { display: block; font-size: 16px; }
.pdp-help strong { font-weight: 600; }
.pdp-help a { min-height: 32px; text-decoration: underline; text-underline-offset: 3px; }
.pdp-section-nav { display: flex; flex-wrap: wrap; gap: 12px 36px; margin-top: 70px; padding-block: 16px; border-block: 1px solid var(--line); }
.pdp-section-nav a { display: flex; align-items: center; min-height: 44px; font-size: 16px; font-weight: 600; }
.pdp-section-nav a:hover { color: var(--green); text-decoration: underline; text-underline-offset: 5px; }
.pdp-information { display: grid; grid-template-columns: minmax(0, .65fr) minmax(0, 1fr); gap: clamp(36px, 8vw, 160px); padding-block: 65px; }
.pdp-information h2, .pdp-technical h2 { margin-top: 12px; font-size: clamp(30px, 3.1vw, 52px); font-weight: 550; line-height: 1.1; letter-spacing: -.05em; }
.pdp-standard { display: flex; align-items: center; gap: 16px; margin-top: 28px; color: var(--muted); font-size: 16px; }
.pdp-standard img { padding: 6px; border: 1px solid var(--line); border-radius: 16px; background: var(--sand); }
.pdp-standard strong { display: block; color: var(--ink); font-weight: 600; }
.pdp-prose { max-width: 74ch; font-size: 18px; line-height: 1.65; overflow-wrap: anywhere; }
.pdp-prose > * + * { margin-top: 20px; }
.pdp-prose h3 { font-size: 22px; font-weight: 600; line-height: 1.3; }
.pdp-prose ul { padding-left: 22px; }
.pdp-prose li + li { margin-top: 8px; }
.pdp-technical { display: grid; grid-template-columns: minmax(0, .65fr) minmax(0, 1fr); gap: clamp(36px, 8vw, 160px); padding-block: 58px; border-top: 1px solid var(--line); }
.pdp-technical > div > p:last-child { margin-top: 20px; color: var(--muted); }
.pdp-spec-list { margin: 0; }
.pdp-spec-list > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 20px; padding: 16px; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.pdp-spec-list > div:nth-child(odd) { background: #eee7dc; border-radius: 10px; }
.pdp-spec-list dt { color: var(--muted); }
.pdp-spec-list dd { margin: 0; font-weight: 500; }
.pdp-data-note { margin-top: 20px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; color: var(--muted); font-size: 16px; line-height: 1.5; }
.pdp-service { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 30px; margin-block: 20px 70px; padding: 34px; border-radius: 26px; background: var(--sand); }
.pdp-service > img { padding: 8px; }
.pdp-service h2 { margin-top: 7px; font-size: clamp(26px, 2.3vw, 38px); font-weight: 550; line-height: 1.15; letter-spacing: -.04em; }
.pdp-service p:last-child { max-width: 62ch; margin-top: 14px; color: var(--muted); font-size: 18px; }
.pdp-related-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pdp-zoom { width: min(1200px, 94%); max-height: 94dvh; padding: 22px; border: 1px solid var(--line); border-radius: 24px; background: var(--cream); color: var(--ink); }
.pdp-zoom::backdrop { background: #11100ed9; backdrop-filter: blur(8px); }
.pdp-zoom-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.pdp-zoom-head h2 { font-size: 20px; font-weight: 600; }
.pdp-zoom-close { font-size: 30px; }
.pdp-zoom-image { width: 100%; height: 65dvh; object-fit: contain; }
.pdp-zoom-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.pdp-zoom-count { color: var(--muted); font-size: 14px; }
.pdp-unavailable { padding-top: calc(var(--site-chrome-height) + 50px); padding-bottom: 80px; }
.pdp-unavailable h1 { margin-bottom: 20px; font-size: 38px; }
@media (max-width: 1100px) {
  .pdp-layout { gap: 32px; }
  .pdp-title { font-size: 34px; }
  .pdp-stage-button { height: 510px; padding: 30px 30px 62px; }
  .pdp-service { grid-template-columns: auto minmax(0, 1fr); }
  .pdp-service .button { grid-column: 2; justify-self: start; }
  .pdp-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .pdp { padding-top: calc(var(--site-chrome-height) + 16px); padding-bottom: 50px; }
  .pdp-breadcrumb { gap: 8px; margin-bottom: 18px; }
  .pdp-layout { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .pdp-summary { position: static; }
  .pdp-stage-button { height: clamp(340px, 52svh, 510px); padding: 24px 28px 58px; border-radius: 26px; }
  .pdp-gallery { --pdp-thumb-width: 56px; column-gap: 12px; }
  .pdp-thumbnails { gap: 8px; }
  .pdp-thumbnail { height: 64px; padding: 6px; }
  .pdp-title { font-size: 32px; }
  .pdp-intro { margin-top: 18px; }
  .pdp-price { font-size: 38px; }
  .pdp-section-nav { gap: 8px 22px; margin-top: 42px; }
  .pdp-information, .pdp-technical { grid-template-columns: minmax(0, 1fr); gap: 30px; padding-block: 38px; }
  .pdp-service { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 26px; margin-block: 12px 45px; }
  .pdp-service > img { width: 90px; height: 85px; }
  .pdp-service .button { grid-column: 1; justify-self: stretch; }
  .pdp-related-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
  .pdp-spec-list > div { gap: 16px; padding: 14px 10px; }
  .pdp-zoom { padding: 16px; }
  .pdp-zoom-controls .button { padding-inline: 12px; }
}
/* Circular hover magnifier; tap/click and keyboard keep the full-screen gallery. */
.pdp-stage-button{isolation:isolate;overflow:hidden;cursor:zoom-in}
.pdp-image-note svg{width:20px;height:20px}
.pdp-hover-lens{display:none;pointer-events:none}
.pdp-standard img{width:120px;height:94px;padding:0;border:0;border-radius:0;background:transparent;object-fit:contain}
.pdp-service>img{width:144px;height:110px;padding:0;object-fit:contain}
@media (hover:hover) and (pointer:fine){
  .pdp-hover-lens{position:absolute;z-index:3;top:0;left:0;display:block;overflow:hidden;border:3px solid var(--white);border-radius:50%;background:var(--sand);box-shadow:0 12px 32px #342a2538;opacity:0;transition:opacity .14s ease}
  .pdp-hover-lens>img{position:absolute;max-width:none;max-height:none;object-fit:contain;transform:scale(2.35);transform-origin:0 0;mix-blend-mode:multiply}
  .pdp-stage-button.is-magnifying .pdp-hover-lens{opacity:1}
  .pdp-stage-button.is-magnifying .pdp-image-note>span{opacity:0}
  .pdp-stage-button.is-label .pdp-hover-lens{background:var(--white)}
  .pdp-stage-button.is-label .pdp-hover-lens>img{mix-blend-mode:normal}
}
@media(prefers-reduced-motion:reduce){.pdp-hover-lens{transition:none}}
@media(max-width:760px){.pdp-service>img{width:120px;height:94px}}