:root{--paper:#fff;--gray:#f2f2f2;--mid:#6b6b6b;--gold-d:#9a7a14;--head:"Barlow Condensed","Arial Narrow",Impact,sans-serif;--body:Inter,system-ui,sans-serif}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--body)}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;color:#000;padding:8px;z-index:9}
.wrap{max-width:1100px;margin:0 auto;padding:0 28px}
.dark{background:var(--ink);color:#fff}
.cage{background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 1px,transparent 1px 24px),repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 1px,transparent 1px 24px)}
.strip{background:var(--gold);color:#0a0a0a;font:800 18px/1 var(--head);letter-spacing:.16em;text-transform:uppercase;padding:11px 14px;text-align:center}
.site-header .wrap{display:flex;justify-content:space-between;align-items:center}
.wordmark{height:84px;width:auto;margin:-14px 0 -14px -20px;mix-blend-mode:screen}
.site-header ul{display:flex;list-style:none;padding:0}
.site-header li a{display:block;padding:14px 16px 8px;border-bottom:3px solid var(--gold);font:700 17px/1 var(--head);letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.site-header li a:hover{background:var(--gold);color:#0a0a0a}
h1,h2{font:800 clamp(40px,6vw,68px)/.92 var(--head);text-transform:uppercase}
h2{margin-bottom:12px}
.sub{color:var(--mid);max-width:50ch;margin-bottom:40px}
.dark .sub{color:#b4b2a9}
.dark h2{border-left:6px solid var(--gold);padding-left:16px}
.btn,.btn-form{display:inline-block;padding:15px 28px;font:700 18px/1 var(--head);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:2px solid currentColor;background:transparent;color:inherit;cursor:pointer;border-radius:0}
.btn.main,.btn-form{background:var(--gold);border-color:var(--gold);color:#0a0a0a}
.btn:hover,.btn-form:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.dark .btn:hover,.dark .btn-form:hover{background:#fff;border-color:#fff;color:#0a0a0a}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;padding:56px 28px 88px}
.hero h1{font-size:clamp(52px,8.5vw,104px)}
.hero p.lead{font:700 15px/1.45 var(--head);letter-spacing:.1em;text-transform:uppercase;margin-top:26px;max-width:38ch;color:var(--gold)}
.oct,.oct>div{clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%)}
.oct{background:var(--gold);padding:5px;aspect-ratio:1/1;max-width:520px;margin-left:auto;width:100%}
.oct>div{background:#0a0a0a;width:100%;height:100%;position:relative}
.oct .burst{position:absolute;inset:0;width:100%;height:100%;animation:grow 1.1s ease-out both}
.oct .logo{position:absolute;left:50%;top:50%;width:104%;max-width:none;transform:translate(-50%,-50%);mix-blend-mode:screen}
.block{padding:80px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
.card{text-decoration:none;display:block}
.card .img{background:var(--gray);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden;border-bottom:4px solid transparent}
.card:hover .img{border-bottom-color:var(--gold)}
.card .img img{width:100%;height:100%;object-fit:cover}
.card .img.ph{background:#0a0a0a}
.card .img.ph img{width:90%;height:auto;object-fit:contain;mix-blend-mode:screen}
.card h3{font:800 28px/1 var(--head);text-transform:uppercase;margin-top:14px}
.card .price{color:var(--gold-d);font:700 18px/1 var(--head);letter-spacing:.06em}
.card .sold{color:var(--mid);font-size:14px}
.pdp{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;padding:40px 0 80px}
.pdp .gallery{display:grid;gap:12px}
.pdp .gallery img{width:100%;background:var(--gray)}
.pdp h1{font-size:clamp(40px,5.5vw,68px)}
.pdp .price{font:700 30px/1 var(--head);letter-spacing:.04em;margin:14px 0 22px;color:var(--gold-d)}
.pdp .desc{color:var(--mid);margin-bottom:26px}
select,input[type=email],input[type=number],input[type=search]{background:var(--bg);color:var(--ink);border:2px solid var(--ink);padding:14px;font:inherit;border-radius:0}
select{width:100%;margin-bottom:16px}
.inline-form{display:flex;flex-wrap:wrap}
.inline-form input{flex:1 1 220px;min-width:0}
.dark input[type=email]{background:#1b1b1b;color:#fff;border-color:#333}
.dark input::placeholder{color:#8a8a8a}
.note{color:var(--mid);font-size:14px;margin-top:10px}
.dark .note{color:#8a8a8a}
.cart-row{display:grid;grid-template-columns:80px 1fr auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid #d6d6d6}
.cart-row input{width:72px}
.cart-total{display:flex;justify-content:space-between;align-items:center;margin-top:24px;gap:16px;flex-wrap:wrap}
.pagination{margin-top:32px}.pagination a,.pagination span{margin-right:12px}
.site-footer{padding:28px 0;color:#b4b2a9;font-size:14px}
.site-footer .wrap{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.site-footer .wordmark{height:72px;margin:-12px 0 -12px -16px}
.socials{display:flex;gap:22px;flex-wrap:wrap}
.socials a{font:800 24px/1 var(--head);text-transform:uppercase;text-decoration:none;color:#fff}
.socials a:hover{color:var(--gold)}
.site-footer p{flex:1 1 280px}
.page{padding:48px 0 80px}.page .rte{color:var(--mid);max-width:68ch;margin-top:16px}
@keyframes grow{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@media(max-width:820px){.hero,.pdp{grid-template-columns:1fr}.oct{margin:0}.site-header li a{padding:14px 8px 8px}}
@media(prefers-reduced-motion:reduce){.oct .burst{animation:none}html{scroll-behavior:auto}}