:root{--ink:#202722;--cream:#f7f3ec;--gold:#bb9155}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:14px/1.65 'DM Sans',system-ui,sans-serif}a{color:inherit;text-decoration:none}button,select{font:inherit}.shell{width:min(1230px,calc(100% - 42px));margin:auto}header{background:#202a23;color:#f7efe3}header .head-inner{display:flex;justify-content:space-between;align-items:center;min-height:86px;gap:16px}.brand{display:flex;flex-direction:column;line-height:1.06}.brand>span{height:6px;width:110px;border-top:2px solid #e9c889;border-bottom:2px solid #ae8137;margin-bottom:7px}.brand strong{font-size:27px;letter-spacing:.16em;font-weight:500}.brand small{letter-spacing:.26em;font-size:8px;color:#dacbb3;margin-top:5px}nav{display:flex;align-items:center;gap:28px;font-size:12px}nav .contact-link{padding:11px 15px;border:1px solid #b8925c}.intro{padding:65px 0 43px}.eyebrow{font-size:10px;letter-spacing:.22em;color:#9a7443;font-weight:700}.intro h1,.ending h2{font:500 clamp(42px,6vw,73px)/1.05 Georgia,serif;max-width:800px;margin:15px 0 18px}.intro p{color:#5c625c;max-width:680px;font-size:15px}.filter-panel{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:17px;background:#fffaf2;border:1px solid #ded7c9}.filter-panel label{font-size:10px;letter-spacing:.08em;font-weight:700;display:flex;flex-direction:column;gap:8px}.filter-panel select{width:100%;padding:11px 9px;background:white;border:1px solid #d4c9b8;border-radius:0;color:#333}.count{color:#847363;font-size:12px;padding:24px 0 12px}.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;min-height:220px}.piece{cursor:pointer;border:1px solid #ddd6cb;background:white;text-align:left;padding:0;display:flex;flex-direction:column;overflow:hidden;transition:transform .2s,box-shadow .2s}.piece:hover{transform:translateY(-4px);box-shadow:0 14px 34px #26251825}.piece .media{width:100%;aspect-ratio:4/3;overflow:hidden;position:relative;background:#d0c8bb}.piece img,.piece video{width:100%;height:100%;object-fit:cover;display:block}.piece .play{position:absolute;inset:45% auto auto 45%;background:#1a2521dd;color:white;border-radius:50%;font-size:20px;padding:7px 14px}.piece .cap{padding:17px 18px 22px;display:grid;gap:6px}.cap strong{font:500 26px/1.1 Georgia,serif}.cap small{color:#79716a;font-size:10px;letter-spacing:.03em}.cap p{margin:0;color:#656d65;font-size:12px}.flag{font-size:9px;font-weight:700;letter-spacing:.15em;color:#956a35;text-transform:uppercase}.empty{grid-column:1/-1;padding:60px 30px;text-align:center;background:#fffaf2;color:#6d6358}.ending{margin-top:70px;margin-bottom:75px;padding:45px!important;border-top:1px solid #b8a78c;border-bottom:1px solid #b8a78c;display:flex;align-items:center;justify-content:space-between;gap:35px}.ending h2{font-size:43px}.ending p{max-width:690px;color:#666}.ending a{white-space:nowrap;padding:13px 20px;background:#bc9359;color:white;font-weight:700}footer{padding:25px 0 40px;display:flex;justify-content:space-between;font-size:11px;color:#777}dialog{border:0;max-width:min(950px,92vw);max-height:90dvh;padding:20px;background:#fffaf3;color:#242b24;box-shadow:0 28px 80px #0008}dialog::backdrop{background:#0c130dc9}dialog form{display:flex;justify-content:end}.close{font-size:28px;background:transparent;border:0;cursor:pointer}#detail-body img,#detail-body video{max-height:65dvh;max-width:100%;display:block;margin:auto;object-fit:contain}#detail-body h2{font:500 32px Georgia,serif}#detail-body p{max-width:660px}a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid #b68a4d;outline-offset:3px}@media(max-width:850px){.filter-panel{grid-template-columns:repeat(2,1fr)}.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.ending{display:block}.ending a{display:inline-block;white-space:normal;margin-top:14px}}@media(max-width:520px){.shell{width:calc(100% - 30px)}header .head-inner{min-height:72px}nav a:not(.contact-link){display:none}.brand strong{font-size:19px}.brand small{font-size:6px}.intro{padding:42px 0 23px}.filter-panel{gap:8px;padding:12px}.filter-panel select{font-size:11px}.gallery{gap:10px}.piece .cap{padding:12px}.cap strong{font-size:20px}.piece .media{aspect-ratio:3/4}.ending{padding:26px 8px!important}.ending h2{font-size:34px}footer{display:block}}


/* V18 – ellenőrizhető, valódi előtte–utána munkafotók */
.ref-compare{padding:25px 0 37px}
.ref-compare[hidden]{display:none}
.ref-compare-heading{border-top:1px solid #d7cbbc;padding:23px 0 20px}
.ref-compare-heading h2{font:600 clamp(28px,3.8vw,45px)/1.18 'DM Sans',system-ui,sans-serif;letter-spacing:-.04em;margin:12px 0 10px}
.ref-compare-heading h2 em{font-style:normal;font-weight:500;color:#99734a}
.ref-compare-heading p{max-width:720px;font-size:13px;color:#686a61;line-height:1.85}
.ref-compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:22px}
.before-after{border:1px solid #dfd7cb;background:#fffdf9}
.before-after-photos{aspect-ratio:16/10;position:relative;overflow:hidden;background:#c8c6bc}
.before-after-photos img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.before-after-after{clip-path:inset(0 0 0 var(--split,50%))}
.before-after-tag{position:absolute;top:14px;background:#223228e6;color:#f7eddb;font:700 9px/1.5 'DM Sans',system-ui,sans-serif;letter-spacing:.12em;padding:7px 10px}
.before-after-tag.before{left:14px}
.before-after-tag.after{right:14px}
.before-after-divider{position:absolute;left:var(--split,50%);top:0;bottom:0;width:2px;transform:translateX(-1px);background:#fff;box-shadow:0 0 0 1px #36413655;pointer-events:none}
.before-after-control{display:flex;flex-direction:column;padding:17px 21px 7px;gap:10px;font-size:11px;color:#586258;font-weight:700}
.before-after-control input{width:100%;accent-color:#9b794d;cursor:ew-resize}
.before-after-caption{display:flex;justify-content:space-between;align-items:start;gap:10px;padding:12px 21px 22px}
.before-after-caption strong{font:600 14px/1.4 'DM Sans',system-ui,sans-serif;color:#29382d}
.before-after-caption span{color:#93734f;font-size:10px}
@media(max-width:620px){.before-after-caption{display:block}.before-after-caption span{display:block;margin-top:5px}}