/* Artwork presentation only. Client website preview styles remain untouched. */
#design-work .design-grid{gap:34px 28px;align-items:start}
#design-work .design-card,#design-work .design-card:hover{display:block;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible;transform:none;color:#24251d}
#design-work .mockup-scene{height:clamp(290px,29vw,370px);max-height:none;aspect-ratio:auto;padding:36px 25px 42px;border:0;border-radius:0;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(135deg,#e6dccd,#c9bba5);text-decoration:none}
#design-work .mockup-scene:after{content:'';position:absolute;inset:0;box-shadow:inset 0 1px 0 #fff7;pointer-events:none}
#design-work .mockup-art{display:flex;align-items:center;justify-content:center;max-width:100%;max-height:100%;position:relative;transition:transform .25s ease}
#design-work .mockup-scene img{width:auto;height:auto;max-width:100%;max-height:265px;object-fit:contain;background:transparent;border:0;border-radius:0;box-shadow:none;transform:none}
#design-work .mockup-paper .mockup-art{height:100%;transform:rotate(-6deg);filter:drop-shadow(12px 14px 10px #493b3b40)}
#design-work .mockup-paper img{height:100%;max-height:100%;width:auto;max-width:100%}
#design-work .mockup-paper:nth-child(1){background:linear-gradient(135deg,#e6ddce,#c9bba6)}
#design-work .design-card:nth-child(5) .mockup-scene{background:linear-gradient(135deg,#e0dace,#bdb6a9)}
#design-work .mockup-sign{background:repeating-linear-gradient(0deg,#dedbd3 0 35px,#d1cec5 35px 36px)}
#design-work .mockup-sign .mockup-art{width:94%;height:85%;padding:25px 16px;background:#f7f6ef;box-shadow:6px 13px 16px #38332630;transform:perspective(800px) rotateY(-12deg);border:1px solid #eae7dc}
#design-work .mockup-sign img{max-height:100%;width:100%;height:100%}
#design-work .mockup-identity{background:linear-gradient(135deg,#d7dedd,#b9c7c8)}
#design-work .mockup-identity .mockup-art{width:83%;background:#fff;padding:12px;box-shadow:7px 14px 20px #263d3e35;transform:perspective(900px) rotateY(10deg) rotate(-3deg)}
#design-work .mockup-identity img{width:100%;max-height:230px}
#design-work .mockup-banner{background:linear-gradient(135deg,#dedacf,#b8b8ad)}
#design-work .mockup-banner .mockup-art{width:100%;padding:9px;background:#f9f8f1;box-shadow:7px 14px 18px #30392e40;transform:perspective(850px) rotateY(-9deg)}
#design-work .mockup-banner img{width:100%}
#design-work .mockup-view{position:absolute;bottom:15px;left:20px;right:20px;text-align:center;text-transform:uppercase;font-size:9px;letter-spacing:1.7px;color:#605b4f}
#design-work .design-card-copy{display:block;padding:16px 0 0;color:#24251d}
#design-work .design-card h4{font-size:18px;color:#24251d;min-height:0;margin:0 0 7px;line-height:1.3;letter-spacing:-.4px}
#design-work .mockup-category{font-size:9px;letter-spacing:1px;color:#716952}
#design-work .mockup-details{margin-top:15px;border-top:1px solid #b6a57866;font-size:12px}
#design-work .mockup-details summary{display:flex;justify-content:space-between;align-items:center;list-style:none;cursor:pointer;padding:12px 0;color:#786121;font-size:11px;font-weight:600}
#design-work .mockup-details summary::-webkit-details-marker{display:none}
#design-work .mockup-details[open] summary span{transform:rotate(45deg)}
#design-work .design-card p{color:#666356;font-size:12px;margin:0 0 14px;line-height:1.7}
#design-work .design-variants{margin:0;gap:7px}
#design-work .design-variants a{background:#f6edcf;color:#70581d;border-color:#b6a578;font-size:10px}
#design-work .design-variants a:hover{background:#ffca05;color:#191a15}
#design-work .design-cover:focus-visible,#design-work summary:focus-visible{outline:3px solid #9c7715;outline-offset:3px}
#design-work .mockup-paper:hover .mockup-art{transform:rotate(-3deg) scale(1.02)}
@media(max-width:950px){#design-work .mockup-scene{height:340px}}
@media(max-width:680px){#design-work .design-grid{gap:30px}#design-work .mockup-scene{height:340px;max-height:100vw}#design-work .design-card-copy{padding:15px 0 0}}
@media(prefers-reduced-motion:reduce){#design-work .mockup-art{transition:none}#design-work .mockup-paper:hover .mockup-art{transform:rotate(-6deg)}}
