/* ZARHA container order — zc.css (R2 language: square, hairlines, mono annotations) */

/* ---- library section (products page, cream) ---- */
.stlib{background:var(--cream);padding:104px 0;position:relative;border-top:1px solid var(--line)}
.stlib .head{max-width:var(--maxw);margin:0 auto 40px;padding:0 var(--pad);display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end}
.stlib .head h2{font-weight:300;font-size:clamp(28px,3.8vw,48px);letter-spacing:-.022em;line-height:1.06;max-width:24ch}
.stlib .head h2 .serif{color:var(--blue)}
.stlib .head .note{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase;text-align:right;line-height:2}
.stlib .head p.lead{color:var(--ink2);margin-top:12px;font-size:15.5px;max-width:60ch}
.stlib .wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}

.zc-filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:22px;border-top:1px solid var(--ink);padding-top:16px}
.zf{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);background:none;border:1px solid var(--line);padding:9px 13px;cursor:pointer;transition:.25s}
.zf:hover{border-color:var(--ink3);color:var(--ink)}
.zf.on{background:var(--char);border-color:var(--char);color:var(--cream)}

.zc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.zc-tile{background:var(--paper);padding:0 0 14px;cursor:pointer;position:relative;transition:background .3s}
.zc-tile:hover{background:#fff}
.zc-tile.sel{outline:1px solid var(--blue);outline-offset:-1px}
.zc-im{aspect-ratio:16/9.4;overflow:hidden;background:var(--sand)}
.zc-im img{width:100%;height:100%;object-fit:cover;filter:saturate(.82);transition:filter .5s,transform 1s var(--ease)}
.zc-tile:hover .zc-im img{filter:none;transform:scale(1.04)}
.zc-meta{padding:12px 16px 0}
.zc-meta b{display:block;font-weight:400;font-size:15px;letter-spacing:-.01em;color:var(--ink)}
.zc-meta span{display:block;margin-top:5px;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;color:var(--ink3)}
.zc-add{margin:10px 16px 0;font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--blue);opacity:0;transform:translateX(-4px);transition:.3s var(--ease)}
.zc-add i{font-style:normal;display:inline-block;transition:transform .3s var(--ease)}
.zc-tile:hover .zc-add{opacity:1;transform:none}
.zc-tile:hover .zc-add i{transform:translateX(3px)}
.zc-note{margin-top:16px;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);line-height:2;max-width:96ch}

/* ---- config bar ---- */
#zcBar{position:fixed;left:0;right:0;bottom:0;z-index:240;background:var(--char);color:var(--cream);transform:translateY(102%);transition:transform .45s var(--ease);border-top:1px solid var(--lined)}
#zcBar.on{transform:none}
.zb-in{max-width:var(--maxw);margin:0 auto;padding:14px var(--pad);display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.zb-in img{width:74px;height:46px;object-fit:cover;flex:none}
.zb-nm{min-width:150px}
.zb-nm b{display:block;font-weight:400;font-size:15.5px;letter-spacing:-.01em}
.zb-nm span{display:block;margin-top:3px;font-family:var(--mono);font-size:8px;letter-spacing:.1em;color:var(--beige)}
.zb-f{display:flex;flex-direction:column;gap:5px;font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(211,195,174,.7)}
.zb-f select,.zb-f input{font-family:var(--mono);font-size:11px;color:var(--cream);background:none;border:1px solid var(--lined);padding:8px 10px;letter-spacing:.05em}
.zb-f select option{color:var(--ink);background:var(--cream)}
.zb-f select:focus,.zb-f input:focus{outline:none;border-color:var(--blue)}
.zb-q{display:flex;align-items:center;gap:8px}
.zb-q input{width:84px}
.zb-q{font-size:10px;color:var(--beige)}
.zb-go{margin-left:auto;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:13px 22px;border:1px solid rgba(143,166,186,.8);color:var(--bluel);background:none;cursor:pointer;transition:.3s}
.zb-go:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.zb-go.ok{border-color:var(--gold);color:var(--goldl)}
.zb-x{background:none;border:0;color:rgba(244,241,234,.5);font-size:20px;cursor:pointer;padding:4px 2px;line-height:1}
.zb-x:hover{color:var(--cream)}

/* ---- floating chip ---- */
#zcChip{position:fixed;right:22px;bottom:22px;z-index:230;background:var(--char);color:var(--cream);border:1px solid var(--lined);font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;padding:13px 18px;opacity:0;transform:translateY(10px);pointer-events:none;transition:.4s var(--ease);text-transform:uppercase}
#zcChip.on{opacity:1;transform:none;pointer-events:auto}
#zcChip:hover{border-color:var(--blue);color:var(--bluel)}
#zcChip .zar{color:var(--bluel);display:inline-block;margin-left:6px;transition:transform .3s var(--ease)}
#zcChip:hover .zar{transform:translateX(4px)}
#zcBar.on~#zcChip, body:has(#zcBar.on) #zcChip{opacity:0;pointer-events:none}

/* ---- order page ---- */
.zo{background:var(--cream);padding:96px 0 104px}
.zo .wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.zo-empty{border:1px solid var(--line);background:var(--paper);padding:56px 40px;font-size:16px;color:var(--ink2)}
.zo-empty a{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--blue);border-bottom:1px solid var(--blue);padding-bottom:3px;margin-left:10px}
.zo-lines{border:1px solid var(--line);border-bottom:0;background:var(--paper)}
.zo-row{display:grid;grid-template-columns:96px 1.2fr 1fr 130px 70px 190px 34px;gap:20px;align-items:center;padding:14px 20px;border-bottom:1px solid var(--line);transition:background .3s}
.zo-row:hover{background:#fff}
.zo-row img{width:96px;height:56px;object-fit:cover}
.zo-nm b{display:block;font-weight:400;font-size:15.5px;letter-spacing:-.01em;color:var(--ink)}
.zo-nm span{display:block;margin-top:4px;font-family:var(--mono);font-size:8px;letter-spacing:.1em;color:var(--ink3)}
.zo-spec{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;color:var(--ink2)}
.zo-qty{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;color:var(--ink3)}
.zo-qty input{width:76px;font-family:var(--mono);font-size:12px;color:var(--ink);background:none;border:1px solid var(--line);padding:8px 9px}
.zo-qty input:focus{outline:none;border-color:var(--blue)}
.zo-wt{font-family:var(--mono);font-size:10.5px;color:var(--ink2);text-align:right}
.zo-pr{font-family:var(--mono);font-size:11px;color:var(--ink);text-align:right}
.zo-pr span{display:block;font-size:7.5px;letter-spacing:.12em;color:var(--ink3);text-transform:uppercase;margin-top:3px}
.zo-rm{background:none;border:0;color:var(--ink3);font-size:17px;cursor:pointer;line-height:1;padding:4px}
.zo-rm:hover{color:#9A5B44}
.zo-meterwrap{border:1px solid var(--line);background:var(--paper);padding:20px 20px 18px}
.zo-mline{display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase}
.zo-mline .v{color:var(--ink)}
.zo-meter{height:20px;background:var(--sand);margin-top:10px;overflow:hidden}
.zo-meter i{display:block;height:100%;background:var(--blue);transition:width .8s var(--ease)}
.zo-meter i.ov{background:#9A5B44}
.zo-mline2{display:flex;justify-content:space-between;gap:16px;margin-top:9px;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;color:var(--ink3);text-transform:uppercase}
.zo-tot{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.zo-tot span{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase}
.zo-tot b{font-family:var(--mono);font-weight:500;font-size:19px;color:var(--ink)}
@media(max-width:980px){
  .zc-grid{grid-template-columns:repeat(2,1fr)}
  .zo-row{position:relative;grid-template-columns:76px 1fr auto;grid-auto-rows:auto;gap:8px 14px;padding:16px}
  .zo-row img{width:76px;height:46px;grid-row:span 2}
  .zo-spec{grid-column:2/4}
  .zo-qty{grid-column:1/3}
  .zo-wt,.zo-pr{text-align:left}
  .zo-rm{position:absolute;top:12px;right:12px}
  .zb-in{gap:12px}
  .zb-go{margin-left:0;width:100%}
}
@media(max-width:560px){
  .zc-grid{grid-template-columns:1fr 1fr}
  .zc-meta b{font-size:13px}
  .stlib .head{grid-template-columns:1fr}
  .stlib .head .note{text-align:left}
}

/* ---- starter rack + millwork (v2) ---- */
.zc-subhead{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;margin:72px 0 22px;border-top:1px solid var(--ink);padding-top:26px}
.zc-subhead h3{font-weight:300;font-size:clamp(22px,2.8vw,34px);letter-spacing:-.018em;line-height:1.1}
.zc-subhead h3 .serif{color:var(--gold)}
.zc-subhead p{color:var(--ink2);margin-top:10px;font-size:14.5px;max-width:66ch}
.zc-shnote{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase;text-align:right;line-height:2}
.zc-grid3{grid-template-columns:repeat(3,1fr)}
.zc-pend{display:flex;align-items:center;justify-content:center;text-align:center}
.zc-pend span{font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;color:var(--ink3);line-height:2.1;text-transform:uppercase}
.zc-pr2{margin-top:4px;color:var(--ink2)!important}
.zc-mw{display:flex;gap:22px;align-items:flex-end;flex-wrap:wrap;border:1px solid var(--line);background:var(--paper);padding:22px 24px}
.zc-mwf{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.zc-mwf select,.zc-mwf input{font-family:var(--mono);font-size:11px;color:var(--ink);background:none;border:1px solid var(--line);padding:9px 11px;letter-spacing:.04em}
.zc-mwf select:focus,.zc-mwf input:focus{outline:none;border-color:var(--blue)}
.zc-mwq{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--ink2)}
.zc-mwq input{width:70px}
.zc-mwwide{flex:1 1 240px}
.zc-mwwide input{width:100%}
.zc-mwgo{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:12px 20px;border:1px solid rgba(84,113,138,.85);color:var(--blue);background:none;cursor:pointer;transition:.3s}
.zc-mwgo:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.zb-note input{width:170px}
.zo-im2{width:96px;height:56px;background:var(--sand);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;letter-spacing:.16em;color:var(--ink3)}
.zo-cust .zo-pr{font-size:8.5px;letter-spacing:.1em;color:var(--ink3)}
@media(max-width:980px){
  .zc-grid3{grid-template-columns:repeat(2,1fr)}
  .zc-subhead{grid-template-columns:1fr}
  .zc-shnote{text-align:left}
  .zo-im2{width:76px;height:46px;grid-row:span 2}
}
@media(max-width:560px){.zc-grid3{grid-template-columns:1fr 1fr}}

/* ---- packed container drawing (v3) ---- */
.zo-boxwrap{border:1px solid var(--line);background:var(--paper);padding:20px 20px 18px}
.zo-boxsvg{margin:18px 0 2px}
.zo-boxsvg svg{width:100%;height:auto;display:block}
.zsv{font-family:var(--mono);text-transform:uppercase}
.zo-mgrid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:16px;border-top:1px solid var(--line);padding-top:16px}
#zcChip.viz{display:flex;flex-direction:column;gap:9px;align-items:stretch;padding:11px 13px 12px}
#zcChip.viz svg{display:block;margin:0 auto}
#zcChip.viz .zct{font-size:8.5px;letter-spacing:.1em;white-space:nowrap;text-align:center}
@media(max-width:980px){.zo-mgrid{grid-template-columns:1fr}}

/* ---- container drawing: motion + hover sync (v3.1) ---- */
.zo-boxsvg .zg{animation:zgin .45s var(--ease) backwards;animation-delay:var(--zd,0ms);transition:opacity .25s}
@keyframes zgin{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.zo-boxsvg.hov .zg:not(.sel){opacity:.28}
.zo-boxsvg .zg{cursor:default}
.zo-row.hl{background:#fff;box-shadow:inset 0 0 0 1px var(--blue)}
.zo-emptyline{margin-top:20px}
#zcChip.pulse{animation:zcpulse .7s var(--ease)}
@keyframes zcpulse{0%{border-color:var(--lined)}30%{border-color:var(--bluel);box-shadow:0 0 0 3px rgba(143,166,186,.25)}100%{border-color:var(--lined)}}

/* ---- cart drawer (v4) ---- */
#zdOv{position:fixed;inset:0;background:rgba(24,22,18,.42);opacity:0;pointer-events:none;transition:opacity .4s var(--ease);z-index:255}
#zdOv.on{opacity:1;pointer-events:auto}
#zcDrawer{position:fixed;top:0;right:0;bottom:0;width:404px;max-width:94vw;background:var(--cream);z-index:260;transform:translateX(103%);transition:transform .5s var(--ease);border-left:1px solid var(--line);display:flex;flex-direction:column;box-shadow:-18px 0 50px rgba(0,0,0,.12)}
#zcDrawer.on{transform:none}
html.zd-lock{overflow:hidden}
.zd-head{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid var(--line);flex:none}
.zd-t{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.zd-x{background:none;border:0;color:var(--ink3);font-size:22px;line-height:1;cursor:pointer;padding:2px 4px}
.zd-x:hover{color:var(--ink)}
.zd-box{background:var(--char);padding:16px 22px 12px;flex:none}
.zd-box svg{width:100%;height:auto;display:block}
.zd-meta{display:flex;justify-content:space-between;margin-top:10px;font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;color:var(--beige);text-transform:uppercase}
.zd-lines{flex:1;overflow-y:auto;background:var(--paper)}
.zd-empty{padding:36px 22px;font-size:14.5px;color:var(--ink2)}
.zd-row{display:grid;grid-template-columns:52px 1fr 82px 86px 18px;gap:11px;align-items:center;padding:12px 18px 12px 22px;border-bottom:1px solid var(--line)}
.zd-im{width:52px;height:34px;object-fit:cover}
.zd-imtx{background:var(--sand);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;color:var(--ink3)}
.zd-nm b{display:block;font-weight:400;font-size:13px;letter-spacing:-.01em;color:var(--ink);line-height:1.25}
.zd-nm span{display:block;margin-top:3px;font-family:var(--mono);font-size:7px;letter-spacing:.1em;color:var(--ink3)}
.zd-q{display:flex;align-items:center;gap:5px;font-family:var(--mono);font-size:9px;color:var(--ink3)}
.zd-q input{width:52px;font-family:var(--mono);font-size:11px;color:var(--ink);background:none;border:1px solid var(--line);padding:6px 7px}
.zd-q input:focus{outline:none;border-color:var(--blue)}
.zd-pr{font-family:var(--mono);font-size:9px;color:var(--ink);text-align:right;line-height:1.5}
.zd-rm{background:none;border:0;color:var(--ink3);font-size:15px;cursor:pointer;line-height:1;padding:3px}
.zd-rm:hover{color:#9A5B44}
.zd-foot{flex:none;border-top:1px solid var(--ink);background:var(--paper);padding:14px 22px 18px}
.zd-tot{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.zd-tot span{font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase}
.zd-tot b{font-family:var(--mono);font-weight:500;font-size:15px;color:var(--ink)}
.zd-go{display:block;margin-top:13px;text-align:center;border:1px solid var(--blue);color:var(--blue);padding:14px;font-family:var(--mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;transition:.3s}
.zd-go:hover{background:var(--blue);color:#fff}
.zd-note{margin-top:11px;text-align:center;font-family:var(--mono);font-size:7.5px;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase}
.zc-ifilters{margin-top:26px}
@media(max-width:560px){#zcDrawer{width:100vw}.zd-row{grid-template-columns:44px 1fr 74px 16px}.zd-pr{display:none}}

/* ---- share link (v5.1) ---- */
.zo-share{display:flex;align-items:center;gap:16px;margin-top:14px}
.zo-share button{background:none;border:0;border-bottom:1px solid var(--blue);color:var(--blue);font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;padding:0 0 3px;cursor:pointer}
.zo-share button:hover{color:var(--ink)}
#zShareOk{font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;color:var(--gold);text-transform:uppercase}

/* ---- aisle showroom (v7) ---- */
.zl-wrap{display:grid;grid-template-columns:296px 1fr;gap:30px;align-items:start}
.zl-nav{position:sticky;top:92px;border:1px solid var(--line);background:var(--paper);max-height:calc(100vh - 120px);overflow-y:auto}
.zl-gh{font-family:var(--mono);font-size:8px;letter-spacing:.2em;color:var(--ink3);text-transform:uppercase;padding:16px 18px 9px;border-top:1px solid var(--line)}
.zl-nav .zl-gh:first-child{border-top:0}
.zl-a{display:block;width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:12px 34px 12px 18px;cursor:pointer;position:relative;transition:.25s;font-family:inherit}
.zl-a b{display:block;font-weight:400;font-size:14.5px;letter-spacing:-.01em;color:var(--ink)}
.zl-a span{display:block;margin-top:4px;font-family:var(--mono);font-size:7.5px;letter-spacing:.11em;color:var(--ink3);text-transform:uppercase}
.zl-a i{position:absolute;right:14px;top:50%;transform:translateY(-50%) translateX(-4px);font-style:normal;color:var(--blue);opacity:0;transition:.25s var(--ease)}
.zl-a:hover{background:#fff}
.zl-a:hover i{opacity:1;transform:translateY(-50%)}
.zl-a.on{background:var(--char);border-top-color:var(--char)}
.zl-a.on b{color:var(--cream)}
.zl-a.on span{color:var(--beige)}
.zl-a.on i{opacity:1;color:var(--bluel);transform:translateY(-50%)}
.zl-main{min-height:540px}
.zl-main.in{animation:zlin .45s var(--ease)}
@keyframes zlin{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.zl-ah{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:16px}
.zl-ah b{display:block;font-weight:300;font-size:clamp(20px,2.2vw,28px);letter-spacing:-.015em;color:var(--ink)}
.zl-ah span{display:block;margin-top:5px;font-family:var(--mono);font-size:8px;letter-spacing:.13em;color:var(--ink3);text-transform:uppercase}
.zl-ct{font-family:var(--mono);font-size:8px;letter-spacing:.12em;color:var(--ink3);text-transform:uppercase;text-align:right;line-height:1.9;flex:none}
.zl-grid{grid-template-columns:repeat(4,1fr)}
.zl-grid3{grid-template-columns:repeat(3,1fr)}
.zl-mwp{color:var(--ink2);font-size:14.5px;max-width:64ch;margin-bottom:18px}
@media(max-width:1120px){.zl-wrap{grid-template-columns:240px 1fr}.zl-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:980px){
  .zl-wrap{grid-template-columns:1fr;gap:18px}
  .zl-nav{position:static;max-height:none;display:grid;grid-template-columns:1fr 1fr}
  .zl-gh{grid-column:1/-1}
  .zl-grid,.zl-grid3{grid-template-columns:repeat(2,1fr)}
  .zl-ah{flex-direction:column;align-items:flex-start}
  .zl-ct{text-align:left}
}

/* ---- category sheets (v8) ---- */
#zsOv{position:fixed;inset:0;background:rgba(24,22,18,.46);opacity:0;pointer-events:none;transition:opacity .4s var(--ease);z-index:228}
#zsOv.on{opacity:1;pointer-events:auto}
#zcSheet{position:fixed;top:0;right:0;bottom:0;width:1120px;max-width:96vw;background:var(--cream);z-index:232;transform:translateX(103%);transition:transform .55s var(--ease);border-left:1px solid var(--line);display:flex;flex-direction:column;box-shadow:-22px 0 60px rgba(0,0,0,.16)}
#zcSheet.on{transform:none}
html.zs-lock{overflow:hidden}
.zs-head{flex:none;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:26px 34px 20px;border-bottom:1px solid var(--ink);background:var(--cream)}
.zs-k{display:block;font-family:var(--mono);font-size:8px;letter-spacing:.2em;color:var(--ink3);text-transform:uppercase}
.zs-head b{display:block;margin-top:8px;font-weight:300;font-size:clamp(24px,2.6vw,36px);letter-spacing:-.018em;color:var(--ink)}
.zs-hr{display:flex;align-items:center;gap:20px}
.zs-pdf{font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--blue);border-bottom:1px solid var(--blue);padding-bottom:3px}
.zs-pdf:hover{color:var(--ink);border-color:var(--ink)}
.zs-x{background:none;border:0;color:var(--ink3);font-size:26px;line-height:1;cursor:pointer;padding:2px 6px}
.zs-x:hover{color:var(--ink)}
.zs-body{flex:1;overflow-y:auto;padding:24px 34px 34px;background:var(--cream)}
.zs-tabs{margin-bottom:18px}
.zs-grid{grid-template-columns:repeat(3,1fr)}
.zs-custom{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;border:1px solid var(--line);background:var(--paper);padding:18px 22px;margin-top:20px}
.zs-cl{flex:1 1 260px}
.zs-cl b{display:block;font-weight:400;font-size:15px;color:var(--ink)}
.zs-cl span{display:block;margin-top:4px;font-size:12.5px;color:var(--ink2);line-height:1.5}
.zs-custom input#zsNote{flex:2 1 260px;font-family:var(--mono);font-size:11px;color:var(--ink);background:none;border:1px solid var(--line);padding:10px 11px}
.zs-custom input#zsQty{width:70px;font-family:var(--mono);font-size:11px;color:var(--ink);background:none;border:1px solid var(--line);padding:10px 9px}
.zs-custom select#zsUnit{font-family:var(--mono);font-size:11px;color:var(--ink);background:none;border:1px solid var(--line);padding:10px 8px}
.zs-custom input:focus,.zs-custom select:focus{outline:none;border-color:var(--blue)}
@media(max-width:980px){
  #zcSheet{width:100vw}
  .zs-grid{grid-template-columns:repeat(2,1fr)}
  .zs-head{padding:20px 18px 16px}
  .zs-body{padding:16px 18px 26px}
}

/* ---- full-page catalog (v12): horizontal rack -> vertical rail ---- */
#zcFull{position:fixed;inset:0;z-index:236;background:var(--cream);opacity:0;pointer-events:none;transition:opacity .45s var(--ease);display:flex;flex-direction:column}
#zcFull.on{opacity:1;pointer-events:auto}
.zn-top{flex:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 28px;border-bottom:1px solid var(--ink);background:var(--cream)}
.zn-wrap{flex:1;display:flex;min-height:0}
.zn-rail{width:274px;flex:none;overflow-y:auto;border-right:1px solid var(--line);background:var(--paper);padding-bottom:24px}
.zn-gh{font-family:var(--mono);font-size:8px;letter-spacing:.2em;color:var(--ink3);text-transform:uppercase;padding:18px 18px 8px}
.zn-gh b{color:var(--ink);margin-right:9px;font-size:9px}
.zn-i{display:flex;align-items:stretch;gap:0;width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:0;cursor:pointer;transition:background .25s;font-family:inherit}
.zn-i::before{content:'';width:6px;background:var(--tc);flex:none;transition:width .3s var(--ease)}
.zn-i i{font-style:normal;font-family:var(--mono);font-size:8px;color:var(--ink3);width:30px;display:flex;align-items:center;justify-content:center}
.zn-i span{flex:1;padding:12px 14px 12px 0;font-size:13.5px;font-weight:400;color:var(--ink);letter-spacing:-.01em}
.zn-i:hover{background:#fff}
.zn-i.on{background:var(--char);border-top-color:var(--char)}
.zn-i.on span{color:var(--cream)}
.zn-i.on i{color:var(--beige)}
.zn-i.on::before{width:14px}
#zcFull.on .zn-i{animation:znin .55s var(--ease) backwards;animation-delay:var(--zd,0ms)}
@keyframes znin{from{opacity:0;transform:translateX(-52px) rotate(-5deg)}to{opacity:1;transform:none}}
.zn-main{flex:1;display:flex;flex-direction:column;min-width:0}
.zs-head2{flex:none;padding:24px 36px 0}
.zs-head2 b{display:block;font-weight:300;font-size:clamp(26px,3vw,40px);letter-spacing:-.02em;color:var(--ink)}
.zn-main .zs-body{flex:1;overflow-y:auto;padding:18px 36px 44px}
.zn-main .zs-body.in{animation:zlin .45s var(--ease)}
#zcChip{z-index:238}
@media(max-width:980px){
  .zn-wrap{flex-direction:column}
  .zn-rail{width:100%;display:flex;overflow-x:auto;overflow-y:hidden;border-right:0;border-bottom:1px solid var(--line);padding-bottom:0}
  .zn-gh{display:none}
  .zn-i{flex:none;border-top:0;border-right:1px solid var(--line)}
  .zn-i span{white-space:nowrap;font-size:12px;padding:12px 12px 12px 0}
  .zs-head2{padding:16px 18px 0}
  .zn-main .zs-body{padding:12px 18px 30px}
}

/* ---- embedded catalog page (v14) ---- */
.zn-embed{position:relative;height:80vh;min-height:600px;border:1px solid var(--line);background:var(--cream)}
.zn-embed .zn-rail{background:var(--paper)}
.zn-embed .zn-i{animation:znin .55s var(--ease) backwards;animation-delay:var(--zd,0ms)}
@media(max-width:980px){.zn-embed{height:auto;min-height:70vh}}

/* ---- catalog back navigation (v15) ---- */
.zn-tl{display:flex;align-items:center;gap:18px}
.zn-back{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);background:none;border:1px solid var(--line);padding:10px 16px;cursor:pointer;transition:.25s;white-space:nowrap}
.zn-back:hover{border-color:var(--ink);color:var(--ink);background:#fff}
@media(max-width:980px){.zn-tl .zn-k{display:none}}

/* spec-build ghost tile + collection group headers */
.zc-spec .zc-im.zc-ghost{display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(45deg,#F1EBDF,#F1EBDF 14px,#ECE5D6 14px,#ECE5D6 28px)}
.zc-ghost i{font-style:normal;font-weight:300;font-family:'Playfair Display',serif;font-size:58px;color:#B4A88F;border:1px dashed #C6BAA1;width:92px;height:92px;display:flex;align-items:center;justify-content:center;border-radius:3px;transition:color .3s,border-color .3s,transform .5s}
.zc-tile.zc-spec:hover .zc-ghost i{color:#8A8378;border-color:#8A8378;transform:rotate(6deg)}
.zs-ghead{grid-column:1/-1;font-family:var(--mono,ui-monospace,monospace);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#8A8378;border-bottom:1px solid #E2DACB;padding:26px 0 8px}

/* ---------- products header: container viz ---------- */
.phrow{display:flex;align-items:flex-end;gap:48px;flex-wrap:wrap}
.phtext{flex:1 1 460px;min-width:290px}
.phbox{flex:0 1 560px;min-width:300px;max-width:600px;background:transparent;border:0;padding:0;box-shadow:none}
.phbox svg{width:100%;height:auto;display:block}
.phbox .zcap{margin-top:12px;padding-top:9px;border-top:1px solid rgba(244,241,234,.22);font-family:var(--mono,'DM Mono',monospace);font-size:9px;letter-spacing:.14em;color:#A79D8C;text-transform:uppercase}
.phbox.pulse svg{animation:zhb .6s ease}
@keyframes zhb{0%{opacity:.55}100%{opacity:1}}
@media(max-width:760px){.phrow{gap:26px}.phbox{flex:1 1 100%;max-width:520px}}

/* ---------- natural stone: continuous families ---------- */
.zs-fam{scroll-margin-top:96px}
.zs-fam+.zs-fam{margin-top:44px}
.zs-fam .zl-ah{margin-bottom:14px}

/* ---------- product detail modal ---------- */
#zpOv{position:fixed;inset:0;background:rgba(24,22,18,.55);opacity:0;pointer-events:none;transition:opacity .4s var(--ease);z-index:265}
#zpOv.on{opacity:1;pointer-events:auto}
.zp-lock{overflow:hidden}
#zcProd{position:fixed;z-index:270;top:50%;left:50%;transform:translate(-50%,-46%);opacity:0;pointer-events:none;
  width:min(1060px,94vw);max-height:88vh;background:var(--cream);border:1px solid var(--line);
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);transition:opacity .45s var(--ease),transform .45s var(--ease);
  box-shadow:0 30px 80px rgba(0,0,0,.28)}
#zcProd.on{opacity:1;transform:translate(-50%,-50%);pointer-events:auto}
#zcProd .zp-x{position:absolute;top:0;right:0;z-index:3;width:44px;height:44px;background:var(--char);color:var(--cream);border:0;font-size:19px;line-height:1;cursor:pointer}
#zcProd .zp-x:hover{background:#000}
.zp-im{position:relative;background:var(--sand);min-height:340px;overflow:hidden}
.zp-im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zp-im .zp-cap{position:absolute;left:14px;bottom:12px;font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:rgba(244,241,234,.92);background:rgba(25,24,23,.55);padding:5px 9px}
.zp-pend{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:#8d8577;text-align:center;line-height:2.1}
.zp-info{padding:34px 34px 26px;overflow-y:auto;max-height:88vh}
.zp-k{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;color:#8d8577;text-transform:uppercase}
.zp-info h3{font-weight:300;font-size:clamp(26px,2.6vw,38px);letter-spacing:-.02em;margin:10px 0 18px;line-height:1.05}
.zp-spec{border-top:1px solid var(--line)}
.zp-spec>div{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.zp-spec span{font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:#8d8577;text-transform:uppercase;padding-top:3px}
.zp-spec b{font-weight:400;color:var(--ink,#2c2924);line-height:1.5}
.zp-cfg{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px}
.zp-cfg label{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:#8d8577;text-transform:uppercase;flex:1;min-width:110px}
.zp-cfg .zp-wide{flex-basis:100%}
.zp-cfg select,.zp-cfg input{border:1px solid var(--line);background:#fff;padding:9px 10px;font-family:var(--mono);font-size:11px;color:#2c2924;width:100%}
.zp-q{display:flex;align-items:center;gap:8px}
.zp-q input{width:90px}
.zp-act{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.zp-add{flex:1;min-width:200px;background:var(--char);color:var(--cream);border:1px solid var(--char);padding:13px 18px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:.3s}
.zp-add:hover{background:var(--blue,#54718A);border-color:var(--blue,#54718A)}
.zp-add.ok{background:var(--blue,#54718A);border-color:var(--blue,#54718A)}
.zp-smp{background:none;border:1px solid var(--gold,#B98A55);color:#8a6a42;padding:13px 18px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:.3s}
.zp-smp:hover{background:var(--gold,#B98A55);color:#fff}
.zp-smp.ok{background:var(--gold,#B98A55);color:#fff}
.zp-note{margin-top:16px;font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:#8d8577}
@media(max-width:860px){
  #zcProd{grid-template-columns:1fr;overflow-y:auto;max-height:92vh;width:min(560px,94vw)}
  .zp-im{min-height:220px;height:38vh}
  .zp-info{padding:22px 20px 20px;max-height:none;overflow:visible}
}

/* ---------- sample box chip + panel ---------- */
#zsChip{position:fixed;left:22px;bottom:22px;z-index:230;background:var(--cream);color:#2c2924;border:1px solid var(--gold,#B98A55);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;padding:10px 14px;opacity:0;transform:translateY(10px);
  pointer-events:none;transition:.4s var(--ease);text-transform:uppercase;display:flex;align-items:center;gap:10px;cursor:pointer}
#zsChip.on{opacity:1;transform:none;pointer-events:auto}
#zsChip:hover{background:#fff}
#zsChip .zsp-box{width:30px;height:22px;color:#8a6a42;flex:none}
#zsChip.pulse{animation:zcpulse .7s var(--ease)}
#zsPanel{position:fixed;left:22px;bottom:74px;z-index:262;width:330px;max-width:calc(100vw - 44px);max-height:70vh;overflow-y:auto;
  background:var(--cream);border:1px solid var(--line);box-shadow:0 22px 60px rgba(0,0,0,.2);
  opacity:0;transform:translateY(12px);pointer-events:none;transition:.4s var(--ease)}
#zsPanel.on{opacity:1;transform:none;pointer-events:auto}
.zsp-head{display:flex;justify-content:space-between;align-items:center;padding:14px 14px 10px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:#2c2924}
.zsp-x{background:none;border:0;font-size:17px;cursor:pointer;color:#8d8577;line-height:1}
.zsp-x:hover{color:#2c2924}
.zsp-lines{padding:4px 0}
.zsp-row{display:grid;grid-template-columns:44px 1fr 20px;gap:10px;align-items:center;padding:8px 14px;border-bottom:1px solid var(--line)}
.zsp-row img{width:44px;height:32px;object-fit:cover;display:block}
.zsp-imtx{width:44px;height:32px;background:var(--sand);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;color:#8d8577}
.zsp-nm b{display:block;font-weight:400;font-size:12px;line-height:1.25}
.zsp-nm span{font-family:var(--mono);font-size:7.5px;letter-spacing:.12em;color:#8d8577}
.zsp-rm{background:none;border:0;color:#8d8577;font-size:15px;cursor:pointer;line-height:1}
.zsp-rm:hover{color:#2c2924}
.zsp-form{padding:12px 14px 14px;display:flex;flex-direction:column;gap:8px}
.zsp-form input{border:1px solid var(--line);background:#fff;padding:9px 10px;font-family:var(--mono);font-size:10.5px;color:#2c2924}
.zsp-go{background:var(--gold,#B98A55);border:1px solid var(--gold,#B98A55);color:#fff;padding:12px 14px;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:.3s}
.zsp-go:hover{filter:brightness(1.06)}
.zsp-note{font-family:var(--mono);font-size:7.5px;letter-spacing:.13em;color:#8d8577;text-align:center;margin-top:2px}
#zsOk{position:fixed;left:22px;bottom:22px;z-index:263;background:var(--char);color:var(--cream);font-family:var(--mono);font-size:9px;letter-spacing:.13em;padding:12px 16px;opacity:0;transform:translateY(8px);transition:.4s var(--ease)}
#zsOk.on{opacity:1;transform:none}
@media(max-width:560px){#zsChip{left:12px;bottom:12px}#zsPanel{left:12px;bottom:62px}}

/* per-category PDF link in embedded catalog header */
.zs-head2{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.zs-head2 .zs-pdf{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#5c718a;border-bottom:1px solid #5c718a;padding-bottom:2px;white-space:nowrap}
.zs-head2 .zs-pdf:hover{color:#2c2924;border-color:#2c2924}

/* continuous library flow (products page virtual catalog) */
.zl-flow .zl-sec{margin-bottom:64px;scroll-margin-top:96px}
.zl-flow .zl-sec:last-child{margin-bottom:20px}
.zl-pdf{font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:#5c718a;border-bottom:1px solid #5c718a;padding-bottom:1px}
.zl-pdf:hover{color:var(--ink,#2c2924);border-color:var(--ink,#2c2924)}
@media(max-width:980px){
  .zl-wrap{grid-template-columns:1fr}
  .zl-nav{position:sticky;top:58px;z-index:40;display:flex;overflow-x:auto;max-height:none;border:1px solid var(--line)}
  .zl-nav .zl-gh{display:none}
  .zl-a{flex:none;border-top:0;border-left:1px solid var(--line);padding:10px 14px;width:auto}
  .zl-a:first-child{border-left:0}
  .zl-a span{display:none}
  .zl-a i{display:none}
  .zl-flow .zl-sec{scroll-margin-top:130px}
}

/* family tabs stay pinned while the stone list scrolls past */
.zn-main .zs-body .zs-tabs{position:sticky;top:0;z-index:5;background:var(--cream);padding-top:6px;margin-top:-6px;box-shadow:0 8px 12px -10px rgba(0,0,0,.25)}
