.detail-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:7%;align-items:start;margin-top:32px}.detail-gallery{min-width:0}.detail-main{position:relative;background:var(--soft);overflow:hidden}.detail-main>img{width:100%;height:auto;aspect-ratio:1.12;object-fit:contain}.detail-main>[data-gallery-open]{position:absolute;right:14px;bottom:14px;padding:12px 16px;background:rgba(245,246,244,.9);border:0;font-size:var(--small);min-height:44px}.detail-thumbs-wrap{position:relative;margin-top:18px}.detail-thumbs{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.detail-thumbs::-webkit-scrollbar{display:none}.detail-thumbs>[data-gallery-item]{flex:0 0 calc((100% - 24px)/2.5);scroll-snap-align:start;min-width:0;background:var(--soft);border:0;padding:4px}.detail-thumbs img{width:100%;aspect-ratio:1;object-fit:contain}.detail-thumbs [aria-pressed=true]{outline:3px solid var(--accent);outline-offset:-3px}.detail-thumbs-wrap>[data-gallery-prev],.detail-thumbs-wrap>[data-gallery-next]{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:48px;border:0;background:rgba(245,246,244,.8);font-size:24px;border-radius:3px;z-index:1}.detail-thumbs-wrap>[data-gallery-prev]{left:8px}.detail-thumbs-wrap>[data-gallery-next]{right:8px}.detail-gallery [hidden]{display:none!important}.detail-gallery:has([data-gallery-dialog][open]) .detail-thumbs-wrap{isolation:isolate}.detail-summary h1{font-size:var(--title)}.detail-lead{font-size:var(--lead);margin-top:28px;max-width:36ch}.detail-specs{margin:30px 0;display:grid;gap:18px}.detail-specs>div{display:grid;grid-template-columns:1fr 1.65fr;gap:20px;font-size:16px}.detail-specs dt{font-weight:600}.detail-specs dd{margin:0}.detail-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:28px}.detail-note{font-size:var(--small);margin-top:20px;max-width:48ch;color:var(--secondary)}.detail-share{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-top:14px}.detail-share p{font-size:var(--small);margin-right:12px}.detail-share a,.detail-share button{display:grid;place-items:center;width:42px;height:44px;border:0;background:transparent;color:var(--ink)}.detail-share svg{width:19px;height:19px;fill:currentColor}.detail-share a[data-service=linkedin]:hover{color:#0a66c2}.detail-share a[data-service=facebook]:hover{color:#1877f2}.detail-share a[data-service=whatsapp]:hover{color:#128c7e}.detail-share [role=status]{flex-basis:100%;font-size:var(--small);min-height:0}.detail-share input{width:100%;font-size:14px}.detail-section{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.detail-section img{width:100%;height:420px;object-fit:contain;background:var(--soft)}.detail-section p{margin-top:24px;max-width:44ch}.detail-video{background:var(--soft);padding:36px;display:grid;grid-template-columns:1fr 1.2fr;gap:7%;align-items:center}.detail-video video{width:100%;aspect-ratio:1.2;object-fit:contain;background:var(--dark)}.detail-video p{margin-top:24px}.detail-related{display:flex;justify-content:space-between;align-items:center;gap:28px;background:var(--soft);padding:32px}.detail-related p{max-width:45ch}[data-gallery-dialog]{border:0;padding:52px 58px;background:var(--paper);color:var(--ink);width:min(1100px,96vw);max-height:96dvh;overflow:auto}[data-gallery-dialog]::backdrop{background:rgba(15,22,18,.82)}[data-dialog-image]{width:100%;height:min(70dvh,800px);object-fit:contain}[data-dialog-close]{position:absolute;top:8px;right:12px;border:0;background:var(--soft);min-height:40px;padding:8px 16px}[data-dialog-prev],[data-dialog-next]{position:absolute;top:50%;width:42px;height:48px;border:0;background:rgba(229,232,226,.9);font-size:24px}[data-dialog-prev]{left:8px}[data-dialog-next]{right:8px}.detail-dialog-caption{font-size:var(--small);padding-top:18px;text-align:center}.detail-page .contact-panel h2{font-size:var(--title)}
@media(max-width:1000px){.detail-layout{gap:5%}.detail-summary h1{font-size:42px}.detail-specs>div{display:block}.detail-specs dd{margin-top:6px}.detail-section{gap:6%}.detail-section img{height:350px}.detail-video{padding:28px;gap:6%}}
@media(max-width:650px){.detail-layout{display:flex;flex-direction:column;gap:36px}.detail-gallery{width:100%}.detail-summary{width:100%}.detail-summary h1{font-size:46px}.detail-lead{margin-top:24px}.detail-specs>div{display:grid;grid-template-columns:1fr 1.5fr;gap:18px}.detail-specs dd{margin:0}.detail-section,.detail-video{display:flex;flex-direction:column;gap:30px;align-items:stretch}.detail-section img{height:auto;max-height:400px;aspect-ratio:1.08}.detail-video{padding:24px}.detail-video video{aspect-ratio:1.1}.detail-related{display:block;padding:28px}.detail-related .text-link{margin-top:20px}[data-gallery-dialog]{padding:54px 42px 25px;width:96vw;max-height:94dvh}[data-dialog-image]{height:65dvh}.detail-page .contact-panel h2{font-size:38px}}
@media(max-width:359px){.detail-summary h1{font-size:39px}.detail-specs>div{font-size:15px;gap:12px}.detail-share p{margin-right:4px}.detail-video{padding:22px}}
.detail-summary h1{font-size:var(--landing-title)}[data-dialog-image]{touch-action:pan-y pinch-zoom}
.detail-share [data-copy-product] svg{fill:none;width:20px;height:20px}

/* Square H60 photographs retain their complete native framing. */
.hollow-case-page .detail-main>img,.hollow-case-page .detail-thumbs img,.hollow-case-page .detail-section img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;max-height:none}
.hollow-case-page .detail-thumbs>[data-gallery-item]{padding:0}

/* Short demonstration headings should fit their text column naturally. */
.detail-video h2{font-size:clamp(28px,3.2vw,52px)}

/* Use the source photograph proportions rather than letterboxed media frames. */
.keycaps-page .detail-main>img,.keycaps-page .detail-section img{height:auto;aspect-ratio:auto;max-height:none}
.keycaps-page .detail-thumbs>[data-gallery-item]{padding:0}
.keycaps-page .detail-thumbs img{object-fit:cover}