:root{--ink:#120e0b;--ink2:#1c1612;--line:#ffffff1f;--bone:#efe7d8;--bone2:#e3d8c4;--tx:#f1e9db;--mut:#a79a88;--brass:#cfa54e;--dark:#1a130d;--serif:"Bodoni Moda",Georgia,serif;--sans:"Figtree",system-ui,sans-serif;--g:clamp(16px,4vw,56px);--ease:cubic-bezier(.2,.8,.2,1)}
html,body{background:var(--ink);color:var(--tx);margin:0}
*{box-sizing:border-box}
body{font:400 16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip;padding-bottom:env(safe-area-inset-bottom)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.02;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(38px,6.6vw,92px)}
em{font-style:italic;color:var(--brass)}
.eye{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);font-weight:500}
.wrap{padding-inline:var(--g);max-width:1560px;margin-inline:auto}
.sec{padding-block:clamp(72px,11vw,160px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 28px;border:1px solid var(--brass);color:var(--dark);background:var(--brass);font-weight:600;transition:background .25s,color .25s,transform .25s var(--ease)}
.btn:hover{background:transparent;color:var(--brass)}
.btn:active{transform:scale(.97)}
.btn.g{background:transparent;color:var(--tx);border-color:var(--line)}
.btn.g:hover{border-color:var(--brass);color:var(--brass)}
.btn.w{width:100%}
.lnk{border-bottom:1px solid currentColor;padding-bottom:2px}
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.on{opacity:1;transform:none}

/* header */
.hd{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;height:68px;padding-inline:var(--g);transition:background .3s,height .3s}
.hd.s{background:#120e0bd9;backdrop-filter:blur(10px);height:58px;border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:baseline;gap:8px;font-family:var(--serif);font-size:25px}
.logo small{font:500 10px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}
.nav{display:flex;gap:30px;font-size:14px}
.nav a{position:relative;padding:6px 0}
.nav a:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover:after,.nav a.cur:after{transform:scaleX(1)}
.ico{display:flex;gap:4px}
.ico button,.ico a{position:relative;width:44px;height:44px;display:grid;place-items:center}
.ico svg,.bar svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.4}
.cnt{position:absolute;top:5px;right:3px;min-width:16px;height:16px;border-radius:9px;background:var(--brass);color:var(--dark);font-size:10px;font-weight:600;display:grid;place-items:center}
.cnt:empty{display:none}
.bar{display:none;position:fixed;inset:auto 0 0;z-index:49;background:#120e0bf2;border-top:1px solid var(--line);grid-template-columns:repeat(4,1fr);padding-bottom:env(safe-area-inset-bottom)}
.bar a,.bar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:58px;font-size:11px;position:relative}
.bar .cnt{top:4px;right:calc(50% - 20px)}
@media(max-width:900px){.nav{display:none}.bar{display:grid}body{padding-bottom:calc(58px + env(safe-area-inset-bottom))}.ico .mh{display:none}.logo small{display:none}}

/* hero */
.hero{position:relative;height:420svh;--H:min(82svh,760px)}
.stage{position:sticky;top:0;height:100svh;overflow:hidden;background:radial-gradient(60% 70% at 50% 62%,color-mix(in srgb,var(--glow,#14733c) 34%,transparent),transparent 72%),var(--ink)}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.hl{position:absolute;z-index:1;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-family:var(--serif);font-size:clamp(66px,17.5vw,300px);line-height:.86;pointer-events:none;padding-bottom:6svh}
.hl span{display:block;position:relative}
.hl .o{color:transparent;-webkit-text-stroke:1px #ffffff2e}
.hl .f{position:absolute;inset:0;color:var(--tx);-webkit-mask-image:linear-gradient(to top,#000 calc(var(--p,0)*100%),transparent calc(var(--p,0)*100% + 18%));mask-image:linear-gradient(to top,#000 calc(var(--p,0)*100%),transparent calc(var(--p,0)*100% + 18%))}
.hl i .f{color:var(--brass)}
.hk{position:absolute;z-index:2;left:50%;bottom:3svh;height:var(--H);aspect-ratio:323/1400;margin-left:calc(var(--H) * -.1153)}
.pc{position:absolute;left:0;width:100%;overflow:hidden;will-change:transform}
.pc img{position:absolute;left:0;width:100%;max-width:none}
.bub{position:absolute;left:30%;width:40%;bottom:12%;height:24%;z-index:2;pointer-events:none}
.bub b{position:absolute;bottom:0;width:7px;height:7px;border:1px solid #ffffffb0;border-radius:50%;opacity:0}
.drawing .bub b{animation:bb 1s linear infinite}
@keyframes bb{10%{opacity:.9}100%{transform:translateY(-110px) translateX(6px);opacity:0}}
.hmeta{position:absolute;z-index:4;inset:auto var(--g) 28px;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;font-size:14px}
.hmeta p{margin:0;max-width:27ch;color:var(--mut)}
.hact{display:flex;align-items:center;gap:24px;white-space:nowrap}
.hold{user-select:none;-webkit-user-select:none;touch-action:manipulation;-webkit-touch-callout:none;display:flex;align-items:center;gap:12px;min-height:58px;padding:0 24px 0 10px;border:1px solid var(--brass);border-radius:40px;color:var(--tx);background:#120e0b99;font-weight:500}
.hold u{width:38px;height:38px;border-radius:50%;background:var(--brass);display:block;transition:transform .5s var(--ease);box-shadow:0 0 0 0 #cfa54e80}
.drawing .hold u{transform:scale(.78);box-shadow:0 0 34px 10px #e8742a}
.cal{position:absolute;z-index:4;right:var(--g);top:50%;transform:translateY(-50%);width:min(380px,36vw);opacity:0}
.cal b{font:400 clamp(60px,8vw,120px)/1 var(--serif);color:var(--brass);display:block}
.cal h3{font-size:clamp(28px,3.4vw,50px);margin:.1em 0 .3em}
.cal p{margin:0;color:var(--mut)}
.scrl{position:absolute;z-index:4;left:50%;bottom:6px;transform:translateX(-50%);font-size:10px;letter-spacing:.2em;color:var(--mut)}
@media(max-width:900px){.hmeta{bottom:72px}.scrl{display:none}}
@media(max-width:760px){.hero{--H:min(58svh,520px)}.hl{justify-content:flex-start;padding:12svh 0 0;font-size:21vw}.hk{bottom:140px}.hmeta p{display:none}.hmeta{justify-content:center}.cal{right:16px;left:16px;width:auto;top:auto;bottom:72px;transform:none;background:#120e0be0;padding:14px 16px;border-left:2px solid var(--brass)}.cal b{font-size:26px;display:inline;margin-right:8px}.cal h3{display:inline;font-size:26px}.cal p{font-size:14px;margin-top:6px}.scrl{display:none}}

/* glaze */
.glz{position:relative;overflow:hidden;background:radial-gradient(50% 60% at 50% 50%,color-mix(in srgb,var(--gc) 42%,transparent),transparent 75%),var(--ink);transition:--gc .6s}
.glzg{display:grid;grid-template-columns:1fr minmax(240px,420px) 1fr;align-items:center;gap:var(--g)}
.glzi{position:relative;height:clamp(420px,72svh,720px)}
.glzi img{position:absolute;inset:0;height:100%;width:100%;object-fit:contain;opacity:0;transform:translateY(24px) scale(.97);transition:opacity .55s,transform .8s var(--ease)}
.glzi img.on{opacity:1;transform:none}
.sw{display:flex;flex-direction:column;gap:2px}
.sw button{display:flex;align-items:center;gap:14px;min-height:48px;text-align:left;color:var(--mut);font:400 clamp(22px,2.4vw,34px) var(--serif);transition:color .3s,padding .4s var(--ease)}
.sw button i{width:16px;height:16px;border-radius:50%;background:var(--c);flex:none;box-shadow:inset 0 0 0 1px #fff4}
.sw button.on{color:var(--tx);padding-left:12px}
@media(max-width:900px){.glzg{grid-template-columns:1fr}.glzi{height:56svh;order:2}.sw{flex-direction:row;overflow-x:auto;gap:18px;order:3;scrollbar-width:none;padding-bottom:6px}.sw button{flex:none}.sw button i{width:22px;height:22px}.sw button span{display:none}.sw button.on{padding:0}.sw button.on i{outline:2px solid var(--tx);outline-offset:3px}}

/* long room */
.room{overflow:hidden}
.track{display:flex;gap:clamp(14px,2vw,28px);padding-inline:var(--g);width:max-content}
@media(max-width:900px){.room{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.room .card{scroll-snap-align:center}.room .card{width:70vw}}
.room .card{width:clamp(250px,26vw,400px)}
.card{position:relative;display:block}
.card .im{position:relative;aspect-ratio:3/4;background:linear-gradient(170deg,#241c16,#15100c);overflow:hidden;padding:7%}
.card img{width:100%;height:100%;object-fit:contain;transition:transform .9s var(--ease)}
.card:hover img{transform:translateY(-3%) scale(1.04)}
.card .im:after{content:"";position:absolute;inset:auto 18% 3% ;height:8%;background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 70%,transparent),transparent);filter:blur(6px)}
.card .mt{display:flex;justify-content:space-between;gap:10px;padding-top:12px}
.card h3{font-size:24px}
.card small{color:var(--mut);display:block}
.tag{position:absolute;top:10px;left:10px;z-index:2;font-size:11px;letter-spacing:.1em;text-transform:uppercase;background:var(--brass);color:var(--dark);padding:3px 8px}
.heart{position:absolute;top:2px;right:2px;z-index:2;width:44px;height:44px;display:grid;place-items:center}
.heart svg{width:20px;height:20px;stroke:var(--tx);fill:none;stroke-width:1.4}
.heart.on svg{fill:var(--brass);stroke:var(--brass)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(44vw,270px),1fr));gap:clamp(12px,2vw,28px)}

/* bone */
.bone{background:var(--bone);color:var(--dark)}
.bone em{color:#8d6a1f}
.bone .eye,.bone .mutd{color:#6d6152}
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--g);align-items:center}
@media(max-width:900px){.split{grid-template-columns:1fr}}
.steps{list-style:none;padding:0;margin:40px 0 0;border-top:1px solid #1a130d33}
.steps li{display:grid;grid-template-columns:70px 1fr;gap:12px;padding:20px 0;border-bottom:1px solid #1a130d33}
.steps b{font:italic 400 26px var(--serif);color:#8d6a1f}
.steps h3{font-size:27px;margin-bottom:4px}
.steps p{margin:0;color:#5c5245}
.clipim{clip-path:inset(12% 8% 12% 8%);transition:clip-path 1.3s var(--ease);overflow:hidden}
.clipim.on{clip-path:inset(0)}
.clipim img{width:100%;height:auto}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,48px)}
.quotes blockquote{margin:0;font:400 clamp(25px,2.7vw,40px)/1.14 var(--serif)}
@media(max-width:800px){.quotes{grid-template-columns:1fr}}
.calc input[type=range]{width:100%;accent-color:var(--brass);height:44px}
.big{font:400 clamp(44px,6vw,86px)/1 var(--serif)}

/* footer */
.ft{border-top:1px solid var(--line);padding:56px var(--g) 28px;overflow:hidden}
.ftg{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
.ftg a{display:block;padding:6px 0;color:var(--mut)}
.ftg a:hover{color:var(--tx)}
.mega{font:400 clamp(120px,33vw,560px)/.74 var(--serif);text-align:center;color:transparent;-webkit-text-stroke:1px #ffffff26;margin:40px 0 20px;user-select:none}
.fine{font-size:12px;color:var(--mut);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}
@media(max-width:700px){.ftg{grid-template-columns:1fr 1fr}.ftg>div:first-child{grid-column:1/-1}}

/* overlays */
.ov{position:fixed;inset:0;z-index:80;visibility:hidden;opacity:0;transition:opacity .3s,visibility .3s}
.ov.on{visibility:visible;opacity:1}
.ov .sh{position:absolute;inset:0;background:#000a}
.dr{position:absolute;top:0;right:0;bottom:0;width:min(460px,100%);background:var(--ink2);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .45s var(--ease)}
.ov.on .dr{transform:none}
.drh{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line)}
.drh h3{font-size:28px}
.x{width:44px;height:44px;font-size:24px}
.drb{flex:1;overflow:auto;padding:12px 20px;overscroll-behavior:contain}
.drf{padding:18px 20px calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.li{display:grid;grid-template-columns:72px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.li img{height:88px;width:72px;object-fit:contain;background:#ffffff0a}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line)}
.qty button{width:40px;height:40px}
.qty span,.qty input{width:44px;text-align:center;background:none;border:0}
.srch{background:var(--ink);overflow:auto}
.srch form{display:flex;border-bottom:1px solid var(--brass);margin-top:80px}
.srch input{flex:1;min-width:0;background:none;border:0;outline:0;font:400 clamp(32px,6.5vw,92px) var(--serif);padding:10px 0}
.hint{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 32px}
.chip{min-height:40px;padding:0 16px;border:1px solid var(--line);border-radius:30px;display:inline-flex;align-items:center;font-size:14px;transition:.25s}
.chip.on,.chip:hover{border-color:var(--brass);color:var(--brass)}
.gate{position:fixed;inset:0;z-index:100;background:var(--ink);display:grid;place-items:center;text-align:center;padding:24px}
.gate h2{font-size:clamp(40px,8vw,84px);margin:12px 0}
.toast{position:fixed;z-index:90;left:50%;bottom:80px;transform:translate(-50%,20px);background:var(--brass);color:var(--dark);padding:10px 18px;font-weight:500;opacity:0;transition:.3s;pointer-events:none;white-space:nowrap}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* inner pages */
.ph{padding:clamp(110px,14vw,180px) var(--g) clamp(28px,4vw,50px)}
.ph h1{font-size:clamp(50px,10vw,150px)}
.fl{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-inline:var(--g);margin-bottom:28px}
.fl select{min-height:40px;background:var(--ink2);border:1px solid var(--line);padding:0 10px;margin-left:auto}
.pd{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--g);padding:90px var(--g) 60px}
.pdv{position:sticky;top:70px;height:min(84svh,800px);background:radial-gradient(50% 50% at 50% 55%,color-mix(in srgb,var(--c) 40%,transparent),transparent),var(--ink2);padding:4%;overflow:hidden;cursor:zoom-in}
.pdv img{width:100%;height:100%;object-fit:contain;transition:transform .35s}
.th{display:flex;gap:8px;margin-top:8px}
.th button{width:68px;height:80px;background:var(--ink2);border:1px solid var(--line);overflow:hidden}
.th img{width:100%;height:100%;object-fit:cover}
.pdi h1{font-size:clamp(48px,6.5vw,104px)}
.tb{width:100%;border-collapse:collapse;margin:26px 0}
.tb td,.tb th{padding:12px 0;border-bottom:1px solid var(--line);text-align:left;font-weight:400}
.tb td:last-child{text-align:right}
.tb th{color:var(--mut);font-size:13px}
.row{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:900px){.pd{grid-template-columns:1fr;padding-top:64px}.pdv{position:relative;top:0;height:62svh}}
.fm{display:grid;gap:12px}
.fm label{display:grid;gap:5px;font-size:13px;color:var(--mut)}
.fm input,.fm select,.fm textarea{min-height:50px;background:#ffffff0a;border:1px solid var(--line);padding:10px 14px;font-size:16px;color:var(--tx);width:100%}
.fm select option{background:var(--ink)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cols{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--g)}
@media(max-width:900px){.cols{grid-template-columns:1fr}}
.tl{list-style:none;padding:0;margin:30px 0;position:relative}
.tl li{position:relative;padding:0 0 28px 34px;color:var(--mut)}
.tl li:before{content:"";position:absolute;left:5px;top:6px;width:11px;height:11px;border-radius:50%;border:1px solid var(--mut);background:var(--ink)}
.tl li:after{content:"";position:absolute;left:10px;top:18px;bottom:-6px;width:1px;background:var(--line)}
.tl li:last-child:after{display:none}
.tl li.d{color:var(--tx)}
.tl li.d:before{background:var(--brass);border-color:var(--brass)}
.tl li.n:before{box-shadow:0 0 0 6px #cfa54e33}
.tl b{display:block;font:400 25px var(--serif)}
.mas{columns:3 260px;column-gap:14px}
.mas img{margin-bottom:14px;width:100%}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.clipim{clip-path:none}.hero{height:100svh}}