.door-config{display:grid;grid-template-columns:minmax(0,633fr) minmax(0,637fr);gap:50px;align-items:start}
.door-gallery{display:flex;flex-direction:column-reverse;gap:22px;min-width:0}
@media(min-width:1201px){.door-gallery{position:sticky;top:min(calc(var(--site-header-height,89px) + 24px),calc(100dvh - var(--door-gallery-height,485px) - 24px));align-self:start}}
.door-thumbs{display:flex;flex-direction:row;gap:18px;min-width:0;overflow-x:auto;scrollbar-width:none}
.door-thumbs::-webkit-scrollbar{display:none}
.door-thumb,.door-stage{position:relative;background:var(--card);border-radius:22px;overflow:hidden}
.door-thumb{aspect-ratio:144/147;width:144px;flex:0 0 144px;border:1px solid transparent}
.door-thumb[aria-pressed=true]{border-color:var(--accent)}
.door-thumb>img{width:100%;height:100%;object-fit:cover}.door-thumb.product-thumb>img{width:34%;height:71%;object-fit:contain;margin:auto}
.door-thumb .play-icon{position:absolute;inset:0;margin:auto;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#fff9;color:var(--accent);font-size:22px}
.door-stage{aspect-ratio:1}.door-main-photo{position:absolute;inset:0}.door-main-photo>img{width:100%;height:100%;object-fit:contain;padding:3% 4%}
.door-main-photo>img.interior-photo{padding:0;object-fit:cover}.door-main-photo>video{width:100%;height:100%;object-fit:contain}.door-main-photo .door-placeholder{top:7.8%;height:84.5%;width:41%;left:29.5%}
.door-zoom{position:absolute;right:7%;bottom:6%;padding:0 22px;height:33px;background:white;border-radius:30px;text-transform:uppercase;font-size:12px;font-weight:600}.door-zoom:hover{background:var(--accent);color:white}
.door-options{display:flex;flex-direction:column;gap:48px;min-width:0}.door-heading{display:flex;flex-direction:column;gap:42px}
.door-page .door-title{font-family:var(--heading);font-size:44px;line-height:.97;text-box-trim:trim-both;text-box-edge:cap alphabetic}
.door-choice{display:flex;flex-direction:column;gap:34px;min-width:0}.door-choice h3{font-family:var(--heading);font-size:24px;line-height:1.15;text-box-trim:trim-both;text-box-edge:cap alphabetic;font-weight:400}
.door-patterns{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.door-pattern{aspect-ratio:116/178;position:relative;border-radius:17px;background:var(--card);border:1px solid var(--sand);overflow:hidden;min-width:0}.door-pattern>img{width:100%;height:100%;object-fit:contain;padding:16px 20px 26px}.door-pattern .pattern-label{position:absolute;bottom:7px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted)}
.door-pattern[aria-pressed=true],.door-trim[aria-pressed=true]{border-color:var(--accent)}.door-pattern:hover,.door-trim:hover{border-color:var(--accent)}
.door-pattern .door-placeholder{top:10%;left:28%;width:44%;height:71%;font-size:9px;border-width:2px;padding:1px}.door-pattern .door-placeholder>span{padding:2px 0}
.door-trims{display:flex;gap:14px}.door-trim{position:relative;width:153px;max-width:calc((100% - 14px)/2);aspect-ratio:1;border-radius:17px;background:var(--card);border:1px solid var(--sand);overflow:hidden}.door-trim img{width:100%;height:100%;object-fit:cover}.door-trim .trim-label{position:absolute;bottom:5px;left:5px;right:5px;background:#f9f7f6e8;border-radius:5px;padding:3px;font-size:10px;line-height:1.2}.trim-missing{display:grid;place-items:center;height:100%;font-size:12px;color:var(--muted)}
.door-sizes{display:flex;gap:7px}.door-sizes>span{display:flex;align-items:center;justify-content:center;border-radius:90px;background:var(--card);height:40px;padding:0 27px;font-size:11px;font-weight:600;white-space:nowrap;text-box-trim:trim-both;text-box-edge:cap alphabetic;cursor:default}
.door-nonstandard{gap:27px}.door-nonstandard p{font-size:14px;line-height:1.36;color:var(--muted)}.door-actions{display:flex;flex-wrap:wrap;gap:16px}.door-actions .button{font-size:14px;height:50px;min-height:50px;padding:0 30px}.door-download{background:transparent;color:var(--ink);border:1px solid var(--accent)}.door-description{font-size:18px;line-height:1.34;color:var(--muted)}
.door-page .series-specs{display:block}.door-page .series-specs h2{margin-bottom:36px}.door-page .series-spec-grid{grid-template-columns:repeat(3,minmax(0,1fr));font-size:14px}.door-page .series-spec-grid>div{min-height:64px}
.door-lightbox{border:0;border-radius:22px;padding:40px;background:var(--card);width:min(90vw,900px);height:90dvh;max-height:90dvh;margin:auto}.door-lightbox::backdrop{background:#0009}.door-lightbox>div{height:100%}.door-lightbox img{height:100%;width:100%;object-fit:contain}.door-lightbox-close{position:absolute;top:5px;right:12px;font-size:32px;width:40px;height:40px}.door-lightbox .door-placeholder{position:relative;inset:auto;height:90%;width:40%;margin:0 auto}
.door-page button:focus-visible,.door-page a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.door-page [hidden]{display:none!important}.door-page .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:701px){.door-colors{gap:9px;overflow-x:auto;scrollbar-width:none;min-height:37px;max-width:100%;mask-image:linear-gradient(to right,transparent,#000 var(--fade-left,0px),#000 calc(100% - var(--fade-right,0px)),transparent)}.door-colors .finish-option{font-size:13px;min-height:37px;padding:4px 0}.door-colors .finish-option i{--finish-diameter:29px}.door-colors .finish-option[aria-pressed=true]{padding:4px 4px 4px 13px;gap:9px}.door-colors .finish-option[aria-pressed=true] .finish-name{max-width:158px}}
@media(min-width:1600px){.door-config{grid-template-columns:633px minmax(0,1fr);gap:80px}.door-options{gap:68px}}
@media(min-width:701px) and (max-width:1200px){.door-config{grid-template-columns:1fr;gap:56px}.door-gallery{gap:22px}.door-patterns{grid-template-columns:repeat(5,minmax(0,116px))}.door-page .series-spec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.door-config{grid-template-columns:1fr;gap:32px}.door-gallery{display:flex;flex-direction:column-reverse;gap:12px}.door-thumbs{display:flex;flex-direction:row;gap:10px}.door-thumb{width:0;flex:1;aspect-ratio:1;border-radius:16px}.door-stage{aspect-ratio:1}.door-main-photo>img{padding:7.8% 10%}.door-zoom{right:12px;bottom:12px;font-size:10px;padding:0 20px}.door-options{gap:32px}.door-heading{gap:20px}.door-page .door-title{font-size:30px}.door-choice{gap:20px}.door-choice h3{font-size:18px}.door-patterns{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.door-pattern{aspect-ratio:101/138}.door-pattern>img{padding:12px 20px 24px}.door-trim-choice{gap:34px}.door-sizes>span{padding:0 8px;flex:1;min-width:0}.door-nonstandard{gap:20px}.door-actions{gap:12px}.door-actions .button{width:100%;font-size:12px}.door-description{font-size:16px}.door-page .series-spec-grid{grid-template-columns:1fr;font-size:13px}.door-page .series-spec-grid>div{min-height:60px}.door-page .series-specs h2{margin-bottom:24px}.door-colors{gap:7px}.door-lightbox{padding:36px 14px}.door-thumb .play-icon{width:36px;height:36px;font-size:16px}}
/* Match the unlabeled image choices in the Figma template; accessible names remain on buttons. */
.door-pattern{background:transparent}.door-pattern>img{padding:11px}.door-pattern .pattern-label,.door-trim .trim-label{display:none}.door-trim{background:transparent}
@media(max-width:700px){.door-pattern>img{padding:10px}}
@media(min-width:1600px){.door-patterns{grid-template-columns:repeat(5,116px)}}
.door-enquiry-summary{margin:0 0 20px;color:var(--accent);font-size:14px;line-height:1.4}
@media(max-width:700px){.door-actions .button{font-size:14px}.door-nonstandard{gap:16px}}
.series-model h3 a:hover{color:var(--accent)}
/* Four separately framed color visualizations share a 2 × 2 image atlas. */
.trim-visualization{position:absolute;inset:0;overflow:hidden;display:block;border-radius:inherit;clip-path:inset(2px 0 0)}
.door-trim .trim-visualization img{position:absolute;width:200%;height:200%;max-width:none;object-fit:fill}
/* Assemble a frame around an unchanged leaf; never stretch the milling artwork. */
.door-assembly-fit{display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:3% 4%}
.door-assembly{position:relative;display:block;height:100%;max-width:100%;overflow:hidden;flex-shrink:0}
.door-assembly-leaf{position:absolute;display:block;overflow:visible;clip-path:inset(-.5px);z-index:2}
.door-assembly .door-assembly-leaf img{position:absolute;max-width:none;object-fit:fill;padding:0;margin:0}
.door-assembly-frame-top,.door-assembly-frame-sides{position:absolute;left:0;width:100%;display:block;overflow:hidden}
.door-assembly-frame-top{top:0;overflow:visible;clip-path:inset(0 0 -1px);z-index:1}
.door-assembly .door-assembly-frame-top img,.door-assembly .door-assembly-frame-sides img{position:absolute;left:0;top:0;width:100%;max-width:none;object-fit:fill;padding:0;margin:0}
.product-thumb .door-assembly-fit{height:71%;padding:0;margin:auto}
.door-lightbox .door-assembly-fit{padding:0}
.trim-corner{position:absolute;inset:0;overflow:hidden}
.door-trim .trim-corner img{position:absolute;left:16%;top:16%;width:230%;height:auto;max-width:none}
.trim-neutral{position:absolute;display:block;overflow:hidden}
.door-trim .trim-neutral img{position:absolute;max-width:none;object-fit:fill}
.door-zoom{z-index:5;display:flex;align-items:center;justify-content:center;color:var(--accent);box-shadow:0 4px 8.65px #00000021;padding:0 20px;line-height:1;white-space:nowrap}
.door-zoom>span{text-box-trim:trim-both;text-box-edge:cap alphabetic}
.door-3d-dialog{width:min(94vw,1000px);height:90dvh;padding:30px}
.door-3d-dialog>div{display:flex;flex-direction:column;gap:12px;min-height:0}
.door-3d-dialog h2{font-family:var(--heading);font-size:30px;font-weight:400;padding-right:32px}
.door-3d-note,.door-3d-help{font-size:13px;line-height:1.45;color:var(--muted)}
.door-3d-stage{position:relative;flex:1;min-height:160px;border-radius:16px;overflow:hidden}
.door-3d-stage model-viewer{display:block;width:100%;height:100%;touch-action:none;--poster-color:transparent}
.door-3d-stage model-viewer::part(default-progress-bar){display:none}
.door-3d-stage>p{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;pointer-events:none}
.door-3d-dialog .door-lightbox-close{z-index:2}
@media(max-width:700px){.door-assembly-fit{padding:7.8% 10%}.door-3d-dialog{padding:24px 16px;height:92dvh}.door-3d-dialog h2{font-size:24px}.door-3d-note,.door-3d-help{font-size:12px}.door-zoom{font-size:12px}}

.door-zoom[hidden]{display:none}

/* Four standard width × height options must stay fully visible on narrow screens. */
@media(max-width:700px){.door-sizes>span{padding-inline:4px}}
@media(max-width:380px){.door-sizes{gap:3px}.door-sizes>span{padding-inline:2px;font-size:9.5px}}