/**
 * BlueCollarz configurator studio.
 *
 * Ported from the approved design (design/pages/configurator.html) and scoped
 * under .bcz-studio-form so it never leaks into the rest of the store. The
 * three-part layout (360 / 1fr / 320), dark studio preview, numbered steps and
 * summary all match the approved Figma.
 */

.bcz-studio-form{
	--bcz-bg:#0a0a0a;--bcz-panel:#121212;--bcz-field:#1c1c20;--bcz-chip:#161619;
	--bcz-line:#2a2a2a;--bcz-orange:#c15a2b;--bcz-tx:#fff;--bcz-mut:#a1a1aa;
	--bcz-disp:'Anton',system-ui,sans-serif;--bcz-cond:'Oswald',system-ui,sans-serif;--bcz-body:'Inter',system-ui,sans-serif;
	color:var(--bcz-tx);font-family:var(--bcz-body);
}
.bcz-studio-form *{box-sizing:border-box}
.bcz-disp{font-family:var(--bcz-disp);text-transform:uppercase;font-weight:400;line-height:1;letter-spacing:.5px}
.bcz-orange{color:var(--bcz-orange)}
.bcz-muted{color:var(--bcz-mut);font-size:13px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

.bcz-shirticon{width:100%;aspect-ratio:1;display:block;clip-path:polygon(24% 8%,38% 2%,62% 2%,76% 8%,100% 22%,90% 42%,80% 36%,80% 100%,20% 100%,20% 36%,10% 42%,0 22%)}

.bcz-top{padding:8px 0 6px}
.bcz-top h1{font-size:34px}
.bcz-top p{color:var(--bcz-mut);margin-top:6px}

.bcz-cfg{display:grid;grid-template-columns:360px 1fr 320px;gap:22px;padding:14px 0 40px;align-items:start}

/* left panel */
.bcz-panel{background:var(--bcz-panel);border:1px solid var(--bcz-line);border-radius:14px;padding:22px}
.bcz-block{padding:16px 0;border-bottom:1px solid var(--bcz-line)}
.bcz-block:first-child{padding-top:2px}
.bcz-bhead{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.bcz-stepnum{width:26px;height:26px;border-radius:50%;border:1px solid var(--bcz-line);color:#000;    background: #fff;font-family:var(--bcz-cond);font-weight:600;font-size:13px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.bcz-steplbl{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1.5px;font-size:14px;font-weight:600}

.bcz-select{width:100%;background:var(--bcz-field);border:1px solid var(--bcz-line);border-radius:8px;color:#fff;padding:14px;font-family:var(--bcz-body);font-size:14px}

.bcz-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.bcz-designs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.bcz-designs[aria-busy="true"]{opacity:.5}
.bcz-viewall{margin-top:10px;width:100%;background:transparent;border:1px solid var(--bcz-line);color:#fff;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1px;font-size:12px;padding:10px;border-radius:8px;cursor:pointer}
.bcz-viewall:hover{border-color:var(--bcz-orange);color:var(--bcz-orange)}
.bcz-dz{aspect-ratio:1;background:none;border:2px solid var(--bcz-line);border-radius:8px;overflow:hidden;position:relative;cursor:pointer;padding:0}
.bcz-dz.on{border-color:var(--bcz-orange)}
.bcz-dz .ph{position:absolute;inset:0;background:linear-gradient(135deg,#efeae1,#ddd7cc)}
.bcz-dz img{width:100%;height:100%;object-fit:cover;display:block;padding: 5px;object-position: top;}

/* Color picker — customers browse the real garment photos, not tiny dots. A few
   colors show up front and the rest open in a scrollable gallery, so a 30-color
   garment stays shoppable. */
.bcz-colornow{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1.5px;font-size:12px;color:var(--bcz-mut);margin:0 0 10px}
.bcz-colornow strong{color:#fff;font-weight:600;letter-spacing:1px}
.bcz-colors{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;text-align:center}
.bcz-colors.is-expanded{max-height:340px;overflow-y:auto;padding-right:6px;scrollbar-width:thin}
.bcz-cz{cursor:pointer;background:none;border:0;padding:2px;scroll-snap-align:start}
.bcz-cz .bcz-shirticon{background:#1c1c1f;border-radius:8px}
.bcz-cz .bcz-cz-img{width:100%;aspect-ratio:1;object-fit:contain;display:block;border-radius:8px;background:#131316;border:1px solid rgba(255,255,255,.07);transition:border-color .15s,transform .15s}
.bcz-cz:hover .bcz-cz-img{border-color:rgba(255,255,255,.28);transform:translateY(-1px)}
.bcz-cz .bcz-lbl{font-family:var(--bcz-cond);font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--bcz-mut);margin-top:6px;display:block;line-height:1.2}
.bcz-cz.on .bcz-lbl{color:var(--bcz-orange);font-weight:600}
.bcz-cz.on .bcz-cz-img,.bcz-cz.on .bcz-shirticon{border:2px solid var(--bcz-orange);box-shadow:0 0 0 3px rgba(193,90,43,.22),0 6px 14px rgba(0,0,0,.45)}
.bcz-cz:focus-visible .bcz-cz-img{outline:2px solid var(--bcz-orange);outline-offset:2px}
.bcz-viewcolors{margin-top:12px;width:100%;background:transparent;border:1px solid var(--bcz-line);color:#fff;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1px;font-size:12px;padding:10px;border-radius:8px;cursor:pointer}
.bcz-viewcolors:hover{border-color:var(--bcz-orange);color:var(--bcz-orange)}
@media (max-width:640px){
	/* Collapsed on phones: a swipeable row rather than a cramped grid. */
	.bcz-colors:not(.is-expanded){display:flex;overflow-x:auto;gap:10px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:4px}
	.bcz-colors:not(.is-expanded) .bcz-cz{flex:0 0 96px}
	.bcz-colors.is-expanded{grid-template-columns:repeat(3,1fr);max-height:52vh}
}

.bcz-places{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.bcz-pz{background:var(--bcz-chip);border:1px solid var(--bcz-line);border-radius:8px;padding:12px 6px 8px;text-align:center;cursor:pointer;color:#fff}
.bcz-pz .bcz-shirticon{width:34px;margin:0 auto;background:#2a2a2e}
.bcz-pz .bcz-lbl{font-family:var(--bcz-cond);text-transform:uppercase;font-size:9px;letter-spacing:.5px;color:var(--bcz-mut);margin-top:6px;display:block}
.bcz-pz .bcz-pr{color:var(--bcz-orange);font-family:var(--bcz-cond);font-size:9px;display:block}
.bcz-pz .bcz-pr .amount{color:var(--bcz-orange)}
.bcz-pz.on{border-color:var(--bcz-orange);background:#1c140f}
.bcz-pz.on .bcz-shirticon{background:var(--bcz-orange)}

.bcz-sizes{display:flex;gap:8px;flex-wrap:wrap}
.bcz-sz{min-width:44px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--bcz-chip);border:1px solid var(--bcz-line);border-radius:8px;font-family:var(--bcz-cond);font-weight:600;font-size:14px;cursor:pointer;color:var(--bcz-mut)}
.bcz-sz.on{border-color:var(--bcz-orange);background:#451600;color:#fff}
.bcz-sz[disabled]{opacity:.4;cursor:not-allowed;text-decoration:line-through}
.bcz-guide{display:inline-block;margin-top:10px;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1px;font-size:12px;color:var(--bcz-orange)}

.bcz-qty{display:inline-flex;align-items:center}
.bcz-qty button{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--bcz-chip);border:1px solid var(--bcz-line);border-radius:8px;font-size:18px;cursor:pointer;color:#fff}
.bcz-qv{width:56px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--bcz-chip);border:1px solid var(--bcz-line);border-radius:8px;margin:0 8px;font-family:var(--bcz-cond)}

.bcz-add{width:100%;background:var(--bcz-orange);color:#fff;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:2px;font-size:15px;font-weight:600;padding:16px;border:none;border-radius:10px;cursor:pointer;margin-top:18px}
.bcz-add[disabled]{opacity:.5;cursor:not-allowed}
.bcz-add .amount{color:#fff}
.bcz-savelater{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;background:transparent;border:1px solid var(--bcz-line);color:#fff;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1.5px;font-size:13px;padding:16px;border-radius:10px;margin-top:12px;cursor:pointer}
.bcz-savelater .h{color:var(--bcz-orange);font-size: 32px;line-height: 23px;    margin-top: -5px;}
.bcz-savelater.is-active .h{color:var(--bcz-orange)}

/* centre studio */
.bcz-studio h2{font-size:30px}
.bcz-studio .bcz-sub{color:var(--bcz-mut);margin:4px 0 16px}
.bcz-stagebox{border:1px solid var(--bcz-line);border-radius:14px;padding:26px;background-image: url(./images/configurator-bg.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding-bottom: 35px;}
.bcz-views{display:grid;grid-template-columns:repeat(var(--bcz-views,2),minmax(0,1fr));gap:20px}
.bcz-view{text-align:center}
.bcz-view .bcz-vl{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:2px;font-size:13px;color:#fff;margin-bottom:10px;display:block}
.bcz-shirt{width:82%;margin:0 auto;aspect-ratio:1/1.1;position:relative}
/* Soft overhead spotlight behind the garment so any colour (incl. black) lifts
   off the dark studio; plus a controlled shadow beneath (spec §8). */
/*.bcz-shirt::before{content:'';position:absolute;left:50%;top:42%;width:100%;height:100%;transform:translate(-50%,-50%);background:radial-gradient(ellipse at 50% 40%,rgba(255,255,255,.13),rgba(255,255,255,.035) 46%,transparent 70%);z-index:0;pointer-events:none}*/
.bcz-shirt::after{content: ''; position: absolute; left: 50%; bottom: -3.5%; width: 58%; height: 7%; transform: translateX(-50%); background: radial-gradient(ellipse at 50% 50%, rgb(0 0 0), #00000000 72%); z-index: 0; pointer-events: none; filter: blur(1.5px);}
/* Garment photos ship with Printify's white background; present them as a
   deliberate photo card ( rounded, edged, floating shadow ) so they sit
   intentionally on the dark studio instead of reading as a raw white patch. */
.bcz-shirt .bcz-garment-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:none;z-index:1}
.bcz-shirt.has-img .bcz-garment-img{display:block}
.bcz-shirt .bcz-body{position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,#26262b,#151517);clip-path:polygon(24% 6%,38% 0,62% 0,76% 6%,100% 20%,90% 40%,80% 34%,80% 100%,20% 100%,20% 34%,10% 40%,0 20%)}
.bcz-shirt.has-img .bcz-body{display:none}
.bcz-logo{position:absolute;transform:translate(-50%,-50%);z-index:3;cursor:move;touch-action:none}
.bcz-logo img{display:block;width:100%;height:auto;pointer-events:none}
/* Editing controls sit clear of the artwork and appear only on the placement
   being edited — on a sleeve the print area is a few inches across, and a
   handle over it makes precise placement impossible. */
/* Sizes divide by the editing zoom, so a control stays the same size on screen
   whether the view is zoomed into a sleeve or showing the whole garment. */
.bcz-logo .bcz-resize{position:absolute;right:calc(-13px / var(--bcz-z,1));bottom:calc(-13px / var(--bcz-z,1));width:calc(9px / var(--bcz-z,1));height:calc(9px / var(--bcz-z,1));border-radius:calc(2px / var(--bcz-z,1));background:var(--bcz-orange);border:calc(1px / var(--bcz-z,1)) solid #fff;cursor:nwse-resize;touch-action:none;z-index:4;opacity:0;transition:opacity .15s}
.bcz-logo .bcz-logo-remove{position:absolute;right:calc(-18px / var(--bcz-z,1));top:calc(-18px / var(--bcz-z,1));width:calc(14px / var(--bcz-z,1));height:calc(14px / var(--bcz-z,1));border-radius:50%;background:#1b1b1f;color:#fff;border:calc(1px / var(--bcz-z,1)) solid rgba(255,255,255,.85);font-size:calc(10px / var(--bcz-z,1));line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;z-index:4;opacity:0;transition:opacity .15s}
.bcz-logo.active .bcz-resize,.bcz-logo.active .bcz-logo-remove{opacity:1}
.bcz-print-area{position:absolute;box-sizing:border-box;border-radius:3px;z-index:2;pointer-events:none}
.bcz-print-area.bcz-max{border:1px dashed rgba(255,255,255,.42)}
.bcz-print-area.bcz-max.active{border-color:rgba(224,106,27,.95)}
.bcz-subthumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
.bcz-st{background-image: url(./images/configurator-bg.jpg); background-position: center; background-repeat: no-repeat; background-size: cover;border:1px solid var(--bcz-line);border-radius:12px;padding:14px 8px 12px;text-align:center}
.bcz-st.on{border-color:var(--bcz-orange)}
.bcz-st .bcz-stl{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1.2px;font-size:13px;color:#fff;display:block;margin-bottom:10px}
.bcz-st .bcz-mini{width:100%;margin:0 auto;aspect-ratio:225/256;position:relative;overflow:hidden;border-radius:10px}
.bcz-st .bcz-mini .bcz-zoom{position:absolute;inset:0;transition:transform .18s ease}
.bcz-st .bcz-fit{position:absolute;right:6px;bottom:6px;z-index:6;background:rgba(12,12,14,.82);color:#fff;border:1px solid var(--bcz-line);border-radius:6px;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:.6px;font-size:9px;padding:4px 7px;cursor:pointer}
.bcz-st .bcz-fit:hover{border-color:var(--bcz-orange);color:var(--bcz-orange)}
.bcz-st .bcz-mini .bcz-body{position:absolute;inset:0;background:#1c1c20;clip-path:polygon(24% 6%,38% 0,62% 0,76% 6%,100% 20%,90% 40%,80% 34%,80% 100%,20% 100%,20% 34%,10% 40%,0 20%)}
.bcz-st .bcz-mini .bcz-mini-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:1}
.bcz-st .bcz-mini .m{position:absolute;width:16%;height:14%;background:#2b4a6a;border-radius:2px;z-index:2}
/* On the stage the card is one of the garments, not a tile of its own. */
.bcz-views .bcz-st-stage{background:none;border:0;border-radius:0;padding:0;align-self:start}
.bcz-views .bcz-st-stage .bcz-stl{font-size:13px;margin-bottom:10px}
.bcz-views .bcz-st-stage .bcz-mini{width:82%}
.bcz-draghint{text-align:center;color:var(--bcz-mut);font-size:13px;margin-top:14px}
.bcz-draghint a{color:var(--bcz-orange)}
.bcz-approx{text-align:center;color:var(--bcz-mut);font-size:12px;margin-top:6px}

/* right summary */
.bcz-summary{background:var(--bcz-panel);border:1px solid var(--bcz-line);border-radius:14px;padding:22px}
.bcz-summary h3{font-family:var(--bcz-disp);text-transform:uppercase;font-size:30px;margin-bottom:16px;    font-weight: 400;}
.bcz-crow{display:flex;gap:12px;align-items:flex-start;padding:20px 0;border-bottom:1px solid var(--bcz-line)}
.bcz-crow .bcz-ic{width:64px;height:64px;border-radius:10px;flex:none;position:relative;background-image: url(./images/side-preview.png); background-size: cover; background-position: center;}
/*.bcz-crow .bcz-ic::after{content:'';position:absolute;inset:9px;background:#3a3a40;clip-path:polygon(24% 6%,38% 0,62% 0,76% 6%,100% 20%,90% 40%,80% 34%,80% 100%,20% 100%,20% 34%,10% 40%,0 20%)}*/
.bcz-crow .bcz-k{font-family:var(--bcz-cond);text-transform:uppercase;font-size:18px;color:#fff}
.bcz-crow .bcz-v{font-size:14px;margin-top:2px;color: #a1a1aa;}
.bcz-subtot{display:flex;justify-content:space-between;align-items:center;padding:16px 0}
.bcz-subtot .bcz-l{font-family:var(--bcz-cond);text-transform:uppercase;font-size:16px}
.bcz-subtot .bcz-p{font-family:var(--bcz-disp);color:var(--bcz-orange);font-size:24px}
.bcz-subtot .bcz-p .amount{color:var(--bcz-orange)}
.bcz-badges{border-top:1px solid var(--bcz-line);padding-top:14px}
.bcz-bd{display:flex;gap:12px;align-items:center;padding:9px 0;font-size:13px;color:#d4d4d8}
.bcz-bd .i{color:var(--bcz-orange);font-size:16px}

/* polish: back link, details card, shirt info, size guide, trust strip, drawers */
.bcz-back{display:inline-block;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1.5px;font-size:12px;color:var(--bcz-mut);margin-bottom:8px}
.bcz-back:hover{color:var(--bcz-orange)}
.bcz-studio-foot{margin-top:18px;text-align: center;}
.bcz-info-btn{background:transparent;border:1px solid var(--bcz-line);color:#fff;font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1px;font-size:12px;padding:10px 18px;border-radius:8px;cursor:pointer}
.bcz-info-btn:hover{border-color:var(--bcz-orange);color:var(--bcz-orange)}
.bcz-details{margin-top:16px;background:var(--bcz-panel);border:1px solid var(--bcz-line);border-radius:12px;padding:18px}
.bcz-details h4{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1px;font-size:14px;margin-bottom:10px;color:#fff}
.bcz-details ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0}
.bcz-details li{position:relative;padding-left:18px;color:var(--bcz-mut);font-size:13px}
.bcz-details li::before{content:'\2713';position:absolute;left:0;color:var(--bcz-orange)}
.bcz-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 28px;border-top:1px solid var(--bcz-line);margin-top:30px;padding:22px 0 6px}
.bcz-trust-item{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:1px;font-size:13px;color:#d4d4d8}
.bcz-trust-item .bcz-tick{color:var(--bcz-orange);margin-right:6px}
.bcz-drawer{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:9999;display:flex;justify-content:flex-end}
.bcz-drawer[hidden]{display:none}
.bcz-drawer-panel{width:min(420px,90vw);height:100%;overflow-y:auto;background:var(--bcz-panel);border-left:1px solid var(--bcz-line);padding:28px;position:relative}
.bcz-drawer-panel h3{font-family:var(--bcz-disp);text-transform:uppercase;font-size:22px;margin-bottom:18px}
.bcz-drawer-close{position:absolute;top:16px;right:18px;background:none;border:none;color:var(--bcz-mut);font-size:26px;line-height:1;cursor:pointer}
.bcz-drawer-close:hover{color:#fff}
.bcz-spec{display:grid;grid-template-columns:auto 1fr;gap:10px 18px}
.bcz-spec dt{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:.5px;font-size:12px;color:var(--bcz-mut)}
.bcz-spec dd{font-size:14px;color:#fff;margin:0}
.bcz-sizeguide{color:#d4d4d8;font-size:14px;line-height:1.6}
@media(min-width:1301px){ .bcz-summary{position:sticky;top:90px} }

/* per-placement focus: the location button and the logo currently being edited */
.bcz-pz.active{outline:2px solid var(--bcz-orange);outline-offset:2px}
.bcz-logo.active{outline:calc(1px / var(--bcz-z,1)) solid rgba(224,106,27,.9);outline-offset:calc(2px / var(--bcz-z,1))}
/* placement tabs: which placement a design pick applies to (one chip each) */
.bcz-place-wrap{margin:0 0 14px}
.bcz-place-tabs{display:flex;flex-wrap:wrap;gap:8px}
.bcz-ptab{display:flex;align-items:center;gap:8px;background:var(--bcz-panel);border:1px solid var(--bcz-line);border-radius:10px;padding:5px 12px 5px 5px;cursor:pointer;color:#d4d4d8}
.bcz-ptab:hover{border-color:#666}
.bcz-ptab.active{border-color:var(--bcz-orange);box-shadow:0 0 0 1px var(--bcz-orange)}
.bcz-ptab-th{width:30px;height:30px;border-radius:6px;background:#0d0d0f;display:flex;align-items:center;justify-content:center;overflow:hidden;flex:none}
.bcz-ptab-th img{width:100%;height:100%;object-fit:contain}
.bcz-ptab-th.empty{color:var(--bcz-orange);font-size:20px;font-weight:700;line-height:1;border:1px dashed var(--bcz-line);background:transparent}
.bcz-ptab-l{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:.5px;font-size:12px}
.bcz-place-hint{font-size:11px;color:var(--bcz-mut);margin:8px 0 0}

/* Buy As Shown (pre-designed / crew locked product) */
.bcz-buy{display:grid;grid-template-columns:1fr 380px;gap:30px;align-items:start;margin-top:10px}
.bcz-buy-panel{display:flex;flex-direction:column;gap:4px}
.bcz-buy-panel .bcz-subtot{border-bottom:1px solid var(--bcz-line);margin-bottom:6px}
.bcz-logo-static{cursor:default}
@media(max-width:900px){.bcz-buy{grid-template-columns:minmax(0, 1fr);         margin-bottom: 60px;}}

/* Admin: save current design as a product */
.bcz-admin-save{margin-top:16px;padding:14px;border:1px dashed var(--bcz-line);border-radius:10px;background:rgba(255,255,255,.02)}
.bcz-admin-save-h{font-family:var(--bcz-cond);text-transform:uppercase;letter-spacing:.5px;font-size:12px;color:var(--bcz-mut);margin-bottom:8px}
.bcz-admin-save input[type=text]{width:100%;box-sizing:border-box;padding:9px;background:#0d0d0f;border:1px solid var(--bcz-line);border-radius:8px;color:#fff;margin-bottom:8px}
.bcz-admin-save-c{display:flex;font-size:12px;color:#d4d4d8;margin-bottom:10px}
input#bcz-preset-custom {
    margin-right: 7px;
}
.bcz-preset-msg{font-size:12px;color:var(--bcz-mut);margin:8px 0 0;min-height:14px}
.bcz-preset-msg a{color:var(--bcz-orange)}

/* responsive */
@media(max-width:1300px){
	.bcz-cfg{grid-template-columns:320px 1fr}
	.bcz-summary{grid-column:1/-1;order:3}
	.bcz-badges{display:grid;grid-template-columns:repeat(1,1fr)}
}
@media screen and (max-width: 767px) {
    .bcz-gswitch-row {
    grid-template-columns: repeat(2, 1fr) !important;
}
.bcz-shirt::after {
    bottom: 7.5%;
}

}

@media(max-width:900px){
	.bcz-cfg{grid-template-columns:minmax(0, 1fr); padding-bottom: 0px;}
	.bcz-studio{order:-1}
}
@media(max-width:640px){
	.bcz-views{grid-template-columns:1fr; gap: 35px;}
	.bcz-subthumbs{grid-template-columns:repeat(2,1fr)}
	.bcz-colors{grid-template-columns:repeat(5,1fr)}
}
.bcz-summary .bcz-badges .bcz-bd img { width: 42px; }
.ftr-configurator .wrap {
    padding: 0px;
}
.ftr-configurator { padding-bottom: 0px; }

@media screen and (min-width: 768px) and (max-width: 1024px) {
	.bcz-top h1 { font-size: 24px; }
	.bcz-panel { margin-top: 15px; }
	.bcz-shirt::after { bottom: -8.5%; }
	.bcz-stagebox { padding-bottom: 45px; }
	.bcz-shirt { width: 100%; }
	.bcz-print-area.bcz-max { border: 2px dashed rgba(255, 255, 255, .42); }
	.bcz-views { gap: 25px; }
	.bcz-places { gap: 20px; }
	.bcz-pz .bcz-shirticon { width: 54px; }
	.bcz-cz .bcz-lbl { font-size: 12px; }
	.bcz-pz .bcz-lbl { font-size: 12px; }
	.bcz-pz .bcz-pr { font-size: 12px; }
}

/* A placement whose print does not sit where the photograph shows it. */
.bcz-place-hint.bcz-place-note{color:#e0a06a;border-left:2px solid #c15a2b;padding-left:8px}

/* Garment chooser — the way into the studio from the storefront. */
.bcz-chooser{margin-top:50px;}
.bcz-chooser-h{font-size:26px;letter-spacing:.04em;margin:0 0 18px; font-weight: 400;}
.bcz-chooser-grid{display:grid;gap:18px; grid-template-columns: repeat(5, 1fr);}
.bcz-gcard{display:block;text-decoration:none;color:inherit;background:#141416;border:1px solid #232327;border-radius:12px;overflow:hidden;transition:border-color .18s,transform .18s}
.bcz-gcard:hover{border-color:var(--bcz-orange,#c15a2b);transform:translateY(-2px)}
.bcz-gcard-img{display:block;aspect-ratio:1;background:#0f0f11}
.bcz-gcard-img img{width:100%;height:100%;object-fit:contain;display:block}
.bcz-gcard-b{display:block;padding:14px 14px 16px}
.bcz-gcard-n{display:block;font-weight:700;letter-spacing:.03em;text-transform:uppercase;font-size:15px}
.bcz-gcard-t{display:block;margin-top:4px;font-size:12px;color:#9a9aa2}
.bcz-gcard-p{display:block;margin-top:10px;font-size:14px;color:#d8d8dd}
.bcz-gcard-cta{display:inline-block;margin-top:12px;padding:8px 16px;border-radius:6px;background:var(--bcz-orange,#c15a2b);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
@media(max-width:480px){.bcz-chooser-grid{grid-template-columns:repeat(2,1fr);gap:12px}.bcz-gcard-b{padding:10px}.bcz-gcard-n{font-size:13px}}

/* Change of garment, without leaving the studio. */
.bcz-gswitch{margin:18px 0 4px}
.bcz-gswitch-h{margin:0 0 10px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#9a9aa2}
.bcz-gswitch-row{display:grid;gap:20px;grid-template-columns: repeat(4, 1fr);overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}
.bcz-gswitch-i{flex:0 0 108px;display:block;text-decoration:none;color:inherit;background:#141416;border:1px solid #232327;border-radius:10px;padding:8px;transition:border-color .18s}
.bcz-gswitch-i:hover{border-color:var(--bcz-orange,#c15a2b)}
.bcz-gswitch-i img{width:100%;aspect-ratio:1;object-fit:contain;display:block;border-radius:6px}
.bcz-gswitch-n{display:block;margin-top:6px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;line-height:1.25}
.bcz-gswitch-p{display:block;margin-top:2px;font-size:11px;color:#9a9aa2}


/* Decoration method — the family the customer buys, not the technique. */
.bcz-methods{margin:0 0 14px}
.bcz-methods-h{margin:0 0 8px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#9a9aa2}
.bcz-methods-row{display:flex;gap:10px;flex-wrap:wrap}
.bcz-mz{flex:1 1 140px;text-align:left;background:#141416;border:1px solid #232327;border-radius:10px;padding:10px 12px;cursor:pointer;color:inherit;transition:border-color .18s,background .18s}
.bcz-mz:hover{border-color:#3a3a40}
.bcz-mz.on{border-color:var(--bcz-orange,#c15a2b);background:#1b1517}
.bcz-mz-n{display:block;font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.bcz-mz-p{display:block;margin-top:3px;font-size:11px;color:#9a9aa2}
.bcz-methods-msg{margin:8px 0 0;font-size:12px;color:#e0a06a;border-left:2px solid #c15a2b;padding-left:8px}


/* The garment you are on keeps its place in the row, without being a link. */
.bcz-gswitch-i.on{border-color:var(--bcz-orange,#c15a2b);cursor:default}
.bcz-gswitch-i.on .bcz-gswitch-n{color:var(--bcz-orange,#c15a2b)}
