/* proto-awesomeo v3: Concept B configurator (tabs over a large drawing, short panel, sticky price footer).
   Used by Heritage (#design) and Contemporary (#sizes). Loaded after site.css, pa.css and generator.css. */
.v3c{background:#f7f3ea;padding:40px 0 48px}
.v3c .chead{display:flex;align-items:flex-end;justify-content:space-between;gap:6px 28px;flex-wrap:wrap;margin-bottom:16px}
.v3c .chead h2{font-size:clamp(26px,3vw,32px);line-height:1.15;margin-top:6px}
.v3c .chead p{color:#5f5a4f;font-size:14.5px;max-width:560px;line-height:1.5}
.v3c .chead .hgs-tag{align-self:flex-end}
.ccfg{background:#fbf8f1;border:1px solid #e3dac6;position:relative;display:grid;grid-template-columns:minmax(0,1fr)}
.kfoot{font-size:14px;line-height:1.55;color:#6b6455;margin-top:12px;max-width:980px}
.kfoot p+p{margin-top:4px}
.stg{background:#f3ecdc;padding:14px 18px 16px;min-width:0}
.stg .svgw{margin-top:8px}
.stg .svgw svg{height:var(--svgh,380px);width:100%;display:block}
.stg .stnote{margin-top:4px;font-size:14px;color:#6b6455}
.stg .e3dw{margin-top:8px}
@media (min-width:1000px){ .v3c .svgw svg .dl{font-size:13.5px} .v3c .svgw svg .ct{font-size:14.5px} .v3c .svgw svg .cs{font-size:11px} .v3c .svgw svg .fl,.v3c .svgw svg .vl{font-size:12px} }
/* tabs */
.btabs{display:flex;overflow-x:auto;border-bottom:1px solid #e3dac6;background:#fbf8f1;scrollbar-width:none;min-width:0}
.btabs::-webkit-scrollbar{display:none}
.btabs [role=tab]{flex:1 0 auto;display:flex;gap:10px;align-items:center;text-align:left;min-height:62px;padding:8px 16px;border:0;border-right:1px solid #eee5d3;border-bottom:3px solid transparent;background:none;cursor:pointer;font-family:inherit;min-width:0;color:inherit}
.btabs [role=tab]:last-child{border-right:0}
.btabs [role=tab]:hover{background:#f6f1e6}
.btabs i{font-style:normal;flex:0 0 24px;width:24px;height:24px;border:1px solid var(--g);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:14px;color:var(--gd);font-weight:600}
.btabs [role=tab]>span{min-width:0}
.btabs b{display:block;font:600 14px/1.3 Montserrat,Arial,sans-serif;color:var(--f)}
.btabs .v{display:block;font-size:14px;line-height:1.35;color:#6d6656;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.btabs [aria-selected=true]{border-bottom-color:var(--g);background:#fff}
.btabs [aria-selected=true] i{background:var(--f);border-color:var(--f);color:#fff}
/* panel + controls */
.bpanel{padding:18px 20px;background:#fff;min-width:0}
.bp .klab{margin:14px 0 8px}
.bp>.klab:first-child,.bp>.seg:first-child,.bp>.intstd:first-child,.bp>.tog:first-child,.bp>.icards:first-child{margin-top:0}
.bp .seg.ktall>button{min-height:56px}
.bp .sline{margin-top:8px;font-size:14px;color:#555}
.bp .tog{margin-top:12px}
.bp .tog:first-child{margin-top:0}
.bp .mini{margin-top:6px}
.bp .intstd{padding:6px}.bp .intstd img{width:52px;height:52px}
.bp .lnk{display:inline-flex;align-items:center;margin-top:10px}
.seg{display:flex;border:1px solid #d9cfb9;background:#fff}
.seg>button{flex:1 1 0;min-width:0;min-height:44px;border:0;border-left:1px solid #e6dcc6;background:none;font:500 14px Montserrat,Arial,sans-serif;color:var(--f);cursor:pointer;padding:4px 4px;line-height:1.25}
.seg>button:first-child{border-left:0}
.seg>button:hover{background:#f6f1e6}
.seg>button[aria-checked=true]{background:var(--f);color:#fff}
.seg>button small{display:block;font-size:14px;font-weight:500;opacity:.8}
.seg.wrap5{flex-wrap:wrap}.seg.wrap5>button{flex:1 0 20%;border-top:1px solid #e6dcc6;margin-top:-1px}
.seg.wrap5>button:nth-child(5n+1){border-left:0}
.sws{display:flex;flex-wrap:wrap;gap:4px}
.ksw{width:44px;height:44px;border:0;background:none;padding:4px;cursor:pointer;border-radius:50%}
.ksw span{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px #d9cfb9}
.ksw img{width:100%;height:100%;object-fit:cover;display:block}
.ksw[aria-checked=true] span{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--g)}
.c12{display:grid;grid-template-columns:repeat(6,44px);gap:4px 8px}
.klab{font-size:14px;letter-spacing:0;text-transform:none;color:#6d6656;font-weight:600;display:block}
.klab em{font-style:normal;text-transform:none;letter-spacing:0;font-size:14px;color:var(--f);font-weight:600;margin-left:6px}
.mini{font-size:14px;line-height:1.5;color:#6b6455}
.mini a{color:var(--f)}
.icards{display:grid;gap:8px}
.icard{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;text-align:left;padding:10px 12px;border:1px solid #d9cfb9;background:#fff;cursor:pointer;font-family:inherit;color:var(--tx);min-height:56px}
.icard b{font-family:Optima,Georgia,serif;font-weight:500;font-size:16.5px;color:var(--f)}
.icard small{grid-column:1;font-size:14px;color:#666;line-height:1.4}
.icard .ot{grid-column:2;grid-row:1/3;align-self:center}
.icard[aria-checked=true]{border-color:var(--g);box-shadow:inset 0 0 0 1px var(--g);background:#fffdf7}
.xlist{list-style:none;display:grid;gap:8px;margin-top:4px}
.xlist li{display:flex;justify-content:space-between;gap:10px;font-size:14px;color:var(--f);border-bottom:1px solid #f0e9da;padding:8px 0}
.xlist li span{font-size:14px;color:#6b6455;white-space:nowrap}
/* sticky price footer */
.bfoot{position:sticky;bottom:0;z-index:6;display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr) auto;align-items:center;gap:8px 24px;padding:12px 20px;background:var(--f);color:#fff;border-top:3px solid var(--g)}
.bfoot .pk{font-size:14px;letter-spacing:0;text-transform:none;color:var(--g);font-weight:600}
.bfoot [data-s=price],.bfoot [data-cp=price]{font-family:Optima,Georgia,serif;font-size:28px;line-height:1.1;display:block}
.bfoot [data-s=pnote],.bfoot [data-cp=pnote]{display:block;font-size:14px;line-height:1.45;color:#c9d3cc;margin-top:3px;max-width:320px}
.bfm{display:flex;flex-direction:column;gap:6px;align-items:flex-start;min-width:0}
.kproof{font-size:14px;color:#c9d3cc;max-width:270px;line-height:1.5}
.kproof .kst{color:#00b67a;letter-spacing:1px}
.kproof a{color:#fff}
.kctas{display:flex;gap:10px;flex-wrap:wrap}
.bfoot .btn{min-height:48px;padding:10px 20px;font-size:14px}
.bfoot .btn.ghl{border-color:rgba(255,255,255,.6)}
.bsend{display:none}
@media (min-width:1000px){
 .ccfg{grid-template-columns:minmax(0,1fr) 380px;grid-template-areas:"tabs tabs" "stg panel" "foot foot"}
 .btabs{grid-area:tabs}.btabs [role=tab]{flex:1 1 0}
 .ccfg .stg{grid-area:stg}
 .bpanel{grid-area:panel;border-left:1px solid #e3dac6}
 .bfoot{grid-area:foot}
 .ccfg .stagebar>div:first-child{display:none}
 .ccfg .stagebar{justify-content:flex-end;margin-bottom:-44px;position:relative;z-index:2}
 .v3c{--svgh:clamp(240px,calc(100vh - 330px),560px)}
}
@media (max-width:999px){
 .v3c{padding:28px 0 36px}
 .ccfg .stg{order:-2;padding:8px 12px}
 .btabs{order:-1;position:sticky;top:var(--hdrvis,0px);z-index:5;transition:top .3s ease}
 .btabs [role=tab]{padding:8px 14px;max-width:190px}
 .v3c{--svgh:auto}
 .ccfg .stnote,.ccfg .e3dw span{display:none}
 .ccfg .stagebar p{font-size:14px}
 .bpanel{padding:16px}
 .c12{grid-template-columns:repeat(6,1fr);justify-items:center;gap:6px 4px}
 .bfoot{grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -6px 16px rgba(0,0,0,.15)}
 .bfoot [data-s=price],.bfoot [data-cp=price]{font-size:24px}
 .bfoot .pk{font-size:0;white-space:nowrap}
 .bfoot .pk::after{content:"From";font-size:10px;letter-spacing:.16em}
 .bfoot [data-s=pnote],.bfoot [data-cp=pnote],.bfm,.bfoot .kctas [data-send-open]{display:none}
 .bfoot .kctas{flex-wrap:nowrap}
 .bfoot .kctas .btn{white-space:nowrap;padding:8px 14px;font-size:14px}
 .bsend{display:block;padding:0 16px 16px;background:#fff}
}
/* one bar at a time: while the configurator is on screen its footer replaces the site's sticky bars */
body.v3cfg-in .stk,body.v3cfg-in .mbar,body.v3cfg-in .pabar{transform:translateY(110%)!important;opacity:0!important;pointer-events:none!important}
@media (min-width:1080px){ body.v3cfg-in .stk{transform:translateY(-120%)!important} }
body.v3cfg-in.stk-on,body.v3cfg-in.mbar-on{padding-bottom:0}
/* Contemporary drawing */
.ctsvg .wall{fill:#3c4043;fill-opacity:.82;stroke:#123627;stroke-width:1.1}
.ctsvg .brd{stroke:#fff;stroke-opacity:.16;stroke-width:.8}
.ctsvg .roof{fill:#2a2c2e;stroke:#123627;stroke-width:1.1}
.ctsvg .floor{fill:#e9e1cf;stroke:#123627;stroke-width:1.2}
.ctsvg .inner{fill:none;stroke:#123627;stroke-width:.7}
.ctsvg .gl{stroke:#123627;stroke-width:1.2}
.ctsvg .dim{stroke:#7d6230;stroke-width:.8}
.ctsvg .ext{stroke:#7d6230;stroke-width:.5;stroke-opacity:.7}
.ctsvg .dl{font:500 11px Montserrat,Arial,sans-serif;fill:#123627}
.ctsvg .fl{font:500 10px Montserrat,Arial,sans-serif;fill:#6b6455}
.ctsvg .vl{font:600 10px Montserrat,Arial,sans-serif;fill:#7d6230;letter-spacing:.16em;text-transform:uppercase}
.ctsvg .ct{font:600 12px Montserrat,Arial,sans-serif;fill:#123627}
.ctsvg .fig{fill:#123627;fill-opacity:.13}
.ctimg{display:flex;align-items:center;justify-content:center;background:#fff;height:var(--svgh,380px)}
.ctimg img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.ctimg.ph img{width:100%;height:100%;object-fit:cover}
@media (max-width:999px){ .ctimg{height:auto;aspect-ratio:1000/620} .ctsvg .dl{font-size:22px}.ctsvg .ct{font-size:22px}.ctsvg .fl,.ctsvg .vl{font-size:17px} }
.bfoot .sumchip{display:none}
.v3c .nxt{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border:1px solid var(--f);background:#fff;color:var(--f);font:600 14px Montserrat,Arial,sans-serif;letter-spacing:0;text-transform:none;cursor:pointer}
.v3c .nxt:hover{background:#f3f6f1}
@media (max-width:999px){ .ctsvg .dl{font-size:30px}.ctsvg .ct{font-size:30px}.ctsvg .fl{font-size:24px}.ctsvg .vl{font-size:22px} }
.bfoot [data-s=price] .px{font:500 14px/1.3 Montserrat,Arial,sans-serif;color:#e9e1cf;letter-spacing:0}
@media (max-width:999px){ .bfoot [data-s=price] .px{display:block;font-size:14px;margin-top:1px} }
.icard{grid-template-columns:1fr;gap:3px}
.icard b{order:0}.icard .ot{order:1;grid-column:1;grid-row:auto;justify-self:start}.icard small{order:2}
.ctsvg .frm{fill:#e9ecea;stroke:#1d2124;stroke-width:1}
.ctsvg .gls{fill:#cfdde0;stroke:#1d2124;stroke-width:.7}
.ctsvg .hdl{stroke:#1d2124;stroke-width:1.6}
.ctsvg .pdoor{fill:#7d6230}.ctsvg .pwin{fill:#cfdde0;stroke:#123627;stroke-width:.6}
/* v8.1 (3 Oct 2026): sticky step tabs. Solid background, hairline, above the panel content (and below the site header / price bar
   layers), and panel content that is scrolled or focused into view stops below the tabs and above the price bar. The tabs are sticky
   only inside .ccfg (their containing block), so they leave with the configurator. */
.ccfg .btabs{background-color:#fbf8f1;border-bottom:1px solid #e3dac6;background-clip:padding-box}
@media (max-width:999px){
 .ccfg .bfoot{z-index:8} /* at the very end of the configurator the docked price bar stays above the tabs */
 .ccfg .btabs{z-index:7;box-shadow:0 1px 0 #e3dac6,0 6px 12px -8px rgba(13,42,30,.18)}
 .ccfg .bpanel *,.ccfg .bpanel{scroll-margin-top:calc(var(--hdrvis,0px) + var(--btabsh,62px) + 12px);scroll-margin-bottom:calc(var(--bfh,64px) + 12px)}
}