.product-lines-page { padding-block:1.5rem 3.5rem; }
.product-lines-heading { max-width:44rem; margin:0 auto 2.5rem; text-align:center; }
.product-lines-heading h1 { font-size:clamp(2rem,3.2vw,2.75rem); line-height:1.2; letter-spacing:-.025em; text-wrap:balance; }
.product-lines-heading h1:focus { outline:none; }
.product-lines-heading p { margin-top:1rem; font-size:1rem; line-height:1.75; text-wrap:balance; }
.product-lines-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:clamp(1.5rem,4vw,3.5rem); max-width:68.75rem; margin-inline:auto; }
.product-line-card { min-width:0; }
.product-line-card h2 { margin:0 0 1rem; font-size:1.375rem; line-height:1.3; letter-spacing:-.015em; text-align:center; }
.product-line-poster { display:block; width:100%; padding:0; border:0; background:transparent; text-align:center; cursor:zoom-in; }
.product-line-poster img { display:block; width:100%; height:auto; border:1px solid var(--line); }
.product-line-enlarge { display:inline-flex; align-items:center; gap:.5rem; min-height:2.75rem; padding:.5rem .25rem; color:var(--muted); font-size:.8125rem; line-height:1.5; }
.product-line-poster:hover .product-line-enlarge { color:var(--accent-dark); text-decoration:underline; text-underline-offset:.2em; }
.product-line-poster:focus-visible { outline:2px solid var(--accent-dark); outline-offset:5px; }

.product-lines-dialog { position:fixed; inset:0; width:100%; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; border-radius:0; overflow:hidden; }
.product-lines-dialog[open] { display:flex; flex-direction:column; }
.product-lines-dialog [data-line-close] { position:absolute; z-index:1; top:max(1rem,env(safe-area-inset-top)); right:max(1rem,env(safe-area-inset-right)); display:grid; place-items:center; width:2.75rem; height:2.75rem; padding:0; border:1px solid var(--line); border-radius:50%; background:var(--paper); color:var(--ink); box-shadow:0 2px 12px #24212412; font-size:1.5rem; line-height:1; }
.product-lines-dialog [data-line-close]:hover { border-color:var(--ink); }
.product-lines-dialog button:focus-visible { outline:2px solid var(--accent-dark); outline-offset:3px; }
.product-lines-dialog .product-lines-viewer-viewport { position:relative; flex:1; min-width:0; min-height:0; overflow:auto; background:#f5f3f5; overscroll-behavior:contain; touch-action:pan-x pan-y pinch-zoom; scrollbar-gutter:stable both-edges; }
.product-lines-dialog .product-lines-viewer-viewport:focus-visible { outline:2px solid var(--accent-dark); outline-offset:-3px; }
.product-lines-dialog .product-lines-viewer-canvas { display:grid; justify-items:center; align-content:start; width:max-content; min-width:100%; min-height:100%; padding:1.5rem; }
.product-lines-dialog #product-lines-image { display:block; width:927px; max-width:calc(100vw - 5rem); height:auto; background:white; box-shadow:0 2px 16px #24212412; user-select:none; -webkit-user-drag:none; }
.product-lines-dialog .product-lines-image-status { position:absolute; inset:0; display:grid; place-content:center; margin:0; padding:2rem; text-align:center; font-size:.9375rem; }
@media(max-width:760px) {
  .product-lines-page { padding-block:1.25rem 2.5rem; }
  .product-lines-heading { margin-bottom:2rem; }
  .product-lines-grid { grid-template-columns:minmax(0,1fr); max-width:32rem; gap:2.25rem; }
}
@media(max-width:560px) {
  .product-lines-dialog .product-lines-viewer-canvas { padding:4.75rem 1rem 1rem; }
  .product-lines-dialog #product-lines-image { width:720px; max-width:none; }
}