/* R & J Customs interactive design catalog */
.design-explorer{background:linear-gradient(145deg,#f0fcfa,#fffdf8 68%);padding:76px 20px 85px}
.dx-inner{max-width:1160px;margin:auto}
.dx-intro{max-width:850px;margin-bottom:27px}
.dx-intro h2{margin:5px 0 10px;line-height:1.13}
.dx-intro p{color:#546d70;max-width:720px}
.dx-topline{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:22px 0 13px}
.dx-search{width:min(370px,100%);min-width:180px;flex:1;display:flex;align-items:center;gap:6px;border:1px solid #b9deda;border-radius:11px;background:#fff;padding:0 13px}
.dx-search span{font-size:18px;color:#388f86}
.dx-search input{width:100%;border:none;background:transparent;padding:13px 7px;outline:none;color:#183f41;font-size:15px}
.dx-count{font-size:13px;color:#42676a;font-weight:750;white-space:nowrap}
.dx-filters{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 23px}
.dx-filter{border:1px solid #bce8e2;border-radius:999px;padding:9px 13px;background:#fff;color:#235d5f;font-size:12px;font-weight:700;cursor:pointer;line-height:1.2;transition:.15s}
.dx-filter:hover{background:#edf9f8}
.dx-filter.active{background:#2b8d87;border-color:#2b8d87;color:#fff}
.dx-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(315px,.7fr);gap:26px;align-items:start}
.dx-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.dx-card{width:100%;display:flex;flex-direction:column;gap:0;padding:0;border:1px solid #d4e4df;background:#fff;border-radius:12px;cursor:pointer;text-align:left;overflow:hidden;color:#233e40;transition:transform .15s,box-shadow .15s,border-color .15s}
.dx-card:hover,.dx-card:focus-visible{transform:translateY(-2px);box-shadow:0 7px 18px #173a391e;outline:none;border-color:#43b6ad}
.dx-card.active{border:2px solid #1a9991;box-shadow:0 0 0 2px #b6efdf}
.dx-img{width:100%;aspect-ratio:1 / 1;object-fit:contain;display:block;background:#f6f7f5;padding:8px}
.dx-name{font-size:13px;font-weight:750;padding:10px 10px 2px;line-height:1.32;min-height:47px}
.dx-tag{font-size:11px;color:#577b7b;padding:0 10px 11px}
.dx-load{border:1px solid #bbdcd7;border-radius:9px;background:#fff;color:#21585a;padding:13px 20px;font-weight:750;cursor:pointer;margin:22px auto 0;display:block;width:min(280px,100%)}
.dx-empty{grid-column:1/-1;padding:28px;background:#fff;border-radius:14px;color:#567174}
.dx-preview{position:sticky;top:12px;background:#fff;border:1px solid #c7e5df;border-radius:16px;overflow:hidden;box-shadow:0 10px 28px #0e535014}
.dx-preview h3{font-size:22px;line-height:1.15;letter-spacing:-.5px;margin:2px 0 7px}
.dx-preview-label{color:#32817f;font-size:11px;text-transform:uppercase;letter-spacing:1.5px;font-weight:800}
.dx-preview-top{padding:22px 22px 12px}
.dx-selected-category{color:#597778;font-size:13px;margin:0}
.dx-mock-stage{min-height:335px;background:radial-gradient(circle at center,#fff 0%,#e5f7f2 100%);display:flex;align-items:center;justify-content:center;padding:30px 12px;position:relative;overflow:hidden}
.dx-mock-shape{position:relative;background:linear-gradient(100deg,#c6cdd0 0%,#f5f7f7 28%,#fefefe 45%,#d2d9da 79%,#98a2a5);box-shadow:10px 16px 22px #15434325, inset 0 0 2px #777;transition:width .2s,height .2s}
.dx-mock-shape img{display:block;position:absolute;object-fit:contain;mix-blend-mode:multiply}
.dx-mock-shape.tumbler{height:276px;width:166px;border-radius:17px 17px 39px 39px}
.dx-mock-shape.tumbler:before{content:'';position:absolute;left:-5px;right:-5px;top:-8px;height:19px;border-radius:50%;border:5px solid #d2d5d6;background:#f9fcfc;box-shadow:inset 0 3px 5px #63727966}
.dx-mock-shape.tumbler img{inset:39px 15px 26px;width:136px;height:200px}
.dx-mock-shape.shirt,.dx-mock-shape.hoodie{width:260px;height:272px;background:#eee;border:1px solid #d4d8d8;clip-path:polygon(28% 8%,40% 3%,45% 9%,55% 9%,60% 3%,72% 8%,100% 25%,86% 42%,78% 37%,78% 100%,22% 100%,22% 37%,14% 42%,0 25%)}
.dx-mock-shape.shirt img,.dx-mock-shape.hoodie img{top:86px;left:76px;width:108px;height:133px}
.dx-mock-shape.hoodie{background:linear-gradient(90deg,#bac7cb,#f3f6f5,#bac7cb)}
.dx-mock-shape.hat{width:240px;height:145px;background:#edece8;border-radius:60% 60% 18% 18%;box-shadow:10px 14px 17px #1543432a}
.dx-mock-shape.hat:after{content:'';position:absolute;bottom:-22px;left:22px;width:210px;height:38px;background:linear-gradient(90deg,#ccc,#eee,#cacaca);border-radius:0 0 50% 50%;z-index:-1}
.dx-mock-shape.hat img{width:84px;height:78px;left:78px;top:40px}
.dx-mock-shape.sticker{width:228px;height:228px;background:#fff;border-radius:50%;border:9px solid #f3f2ec;box-shadow:10px 12px 25px #15434325}
.dx-mock-shape.sticker img{width:83%;height:83%;top:8.5%;left:8.5%}
.dx-mock-shape.sign{width:340px;height:190px;border-radius:5px;background:#f9f8ee;border:7px solid #d4af37}
.dx-mock-shape.sign img{width:79%;height:80%;top:10%;left:10.5%}
.dx-mock-note{font-size:11px;color:#4b7778;position:absolute;bottom:9px;left:10px;right:10px;text-align:center}
.dx-product-options{padding:16px 20px 8px}
.dx-product-options p{margin:0 0 11px;font-size:12px;color:#516e72;font-weight:750}
.dx-product-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.dx-product-buttons button{border:1px solid #c7ded9;border-radius:8px;background:#fff;color:#2d5e60;font-size:12px;font-weight:750;padding:9px 5px;cursor:pointer}
.dx-product-buttons button.active{background:#81d8d0;border-color:#379a95;color:#184342}
.dx-preview-action{padding:15px 20px 23px;display:grid;gap:11px}
.dx-preview-action .btn{display:block;text-align:center;padding:12px}
.dx-preview-action p{font-size:12px;color:#718285;margin:0;line-height:1.45}
.dx-legal{max-width:1000px;color:#647b7b;font-size:12px;margin:22px 0 0}
@media(max-width:1000px){.dx-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.dx-layout{grid-template-columns:minmax(0,1fr) minmax(290px,.85fr)}}
@media(max-width:730px){.design-explorer{padding:56px 16px}.dx-layout{grid-template-columns:1fr}.dx-preview{position:static}.dx-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.dx-img{padding:4px}.dx-name{font-size:12px}.dx-tag{font-size:10px}}
@media(max-width:450px){.dx-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.dx-mock-stage{min-height:315px}.dx-card{border-radius:8px}.dx-card.active{border-width:1px}}

/* Preserve original layout and preview correct print zones */
.dx-original-sets{margin:24px 0 27px;border:1px solid #bde0dc;background:#fff;border-radius:14px;overflow:hidden}
.dx-original-sets summary{padding:17px 20px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:14px;list-style:none}
.dx-original-sets summary::-webkit-details-marker{display:none}
.dx-original-sets summary:after{content:"+";font-size:24px;font-weight:700;color:#278e85}
.dx-original-sets[open] summary:after{content:"−"}
.dx-original-sets summary strong{font-size:15px;color:#205456}
.dx-original-sets summary span{font-size:12px;color:#597273}
.dx-original-grid{border-top:1px solid #d6ebe7;padding:16px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.dx-set{border:1px solid #d8e6e3;border-radius:10px;overflow:hidden;background:#fff;text-decoration:none;color:#244e50;display:flex;flex-direction:column}
.dx-set:hover{box-shadow:0 6px 18px #163f411b}
.dx-set img{width:100%;height:118px;object-fit:contain;background:#f7f9f6}
.dx-set span{font-size:12px;font-weight:800;padding:9px 10px 2px}
.dx-set small{font-size:11px;color:#61807e;padding:0 10px 11px}
.dx-mock-shape img{object-fit:contain;mix-blend-mode:multiply;object-position:50% 50%;}
.dx-mock-shape.dark-art img{mix-blend-mode:normal}
.dx-mock-shape.dark-art.tumbler{background:linear-gradient(90deg,#172629,#091215 45%,#2b383c)}
.dx-mock-shape.tumbler{width:170px;height:278px}
.dx-mock-shape.tumbler img{inset:33px 14px 23px;width:142px;height:215px}
.dx-mock-shape.tumbler.is-wrap img{object-fit:cover;object-position:50% 50%;border-radius:7px 7px 15px 15px}
.dx-mock-shape.shirt img{top:88px;left:72px;width:116px;height:128px}
.dx-mock-shape.hoodie img{top:95px;left:75px;width:110px;height:120px}
.dx-mock-shape.hat img{top:43px;left:82px;width:76px;height:66px}
.dx-mock-shape.sticker{width:260px;height:198px;background:#fff;border-radius:14px;border:8px solid #f3f2ec}
.dx-mock-shape.sticker img{width:90%;height:88%;top:6%;left:5%}
.dx-mock-shape.sign img{width:84%;height:82%;top:9%;left:8%}
.dx-wrap-position{padding:15px 22px;background:#f4fbfa;border-bottom:1px solid #d2e9e5}
.dx-wrap-position[hidden]{display:none}
.dx-wrap-position label{display:block;font-size:12px;font-weight:800;color:#235f60;margin-bottom:8px}
.dx-wrap-position input{display:block;width:100%;accent-color:#2f9e98;cursor:pointer}
.dx-wrap-position span{font-size:11px;color:#527476}
.dx-artwork-panel{padding:15px 22px;display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:10px;align-items:center;background:#fff;border-bottom:1px solid #dce8e6}
.dx-artwork-panel strong{font-size:13px;color:#234f51}
.dx-artwork-panel p{font-size:11px;color:#628081;margin:3px 0 0}
.dx-artwork-panel a:has(img){grid-column:2;grid-row:1 / span 2;display:block}
.dx-artwork-panel a img{max-height:95px;max-width:100%;width:100%;object-fit:contain;border:1px solid #d5e8e3;border-radius:8px;background:#f9faf8;padding:4px}
.dx-artwork-panel #dxSourceSheetLink{font-size:12px;color:#237e79;text-decoration:underline;grid-column:1;grid-row:2}
.dx-artwork-panel #dxSourceSheetLink[hidden]{display:none}
@media(max-width:930px){.dx-original-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.dx-original-sets summary{display:block}.dx-original-sets summary span{display:block;margin-top:5px}}
@media(max-width:580px){.dx-original-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dx-set img{height:115px}.dx-original-sets summary{padding:14px}}

/* Theme category layout */
.dx-gallery.theme-mode{display:flex;flex-direction:column;gap:23px}
.dx-gallery.theme-mode .dx-group{min-width:0;padding:18px;border:1px solid #d5e9e4;border-radius:14px;background:#fff;box-shadow:0 5px 17px #1843460a}
.dx-group-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}
.dx-group-header h3{font-size:21px;font-weight:850;margin:0 0 3px;color:#24575a;letter-spacing:-.4px}
.dx-group-header span{color:#657d7c;font-size:12px}
.dx-view-collection{border:1px solid #93d9cd;background:#e9fbf7;color:#24565b;border-radius:999px;padding:9px 13px;font-size:12px;font-weight:800;cursor:pointer;white-space:nowrap}
.dx-view-collection:hover{background:#81d8d0}
.dx-group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.dx-group-grid .dx-card{min-width:0}
.dx-group-grid .dx-img{object-fit:contain}
@media(max-width:460px){.dx-gallery.theme-mode .dx-group{padding:12px}.dx-group-header h3{font-size:18px}.dx-view-collection{font-size:11px;padding:8px 9px}.dx-group-grid{gap:8px}}
