/* The shop wears the same clothes as the shirts: warm black, aged bone,
   one brick accent, condensed heavy display over mono data. Committed to a
   single dark world on purpose — the product is bone ink on a black blank,
   and a light theme would be a different brand. */
@font-face{font-family:'Bricolage';src:url(/fonts/bricolage.woff2) format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:'Archivo';src:url(/fonts/archivo.woff2) format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'PlexMono';src:url(/fonts/plex-mono-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'PlexMono';src:url(/fonts/plex-mono-600.woff2) format('woff2');font-weight:600;font-display:swap}

*{box-sizing:border-box}
:root{
  --bg:#0c0a09; --bg2:#151110; --line:rgba(217,209,193,.14); --line2:rgba(217,209,193,.3);
  --bone:#d9d1c1; --dim:#9b9384; --faint:#6f6960; --brick:#b6332c;
  color-scheme:dark;
}
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--bone);
  font-family:'Archivo',system-ui,sans-serif;font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased}
.dis{font-family:'Bricolage',Impact,sans-serif;font-variation-settings:'wdth' 75,'wght' 800;text-transform:uppercase}
.dislc{font-family:'Bricolage',Impact,sans-serif;font-variation-settings:'wdth' 75,'wght' 800}
.mn{font-family:'PlexMono',ui-monospace,monospace}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
a{color:inherit}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--brick);outline-offset:3px}

.top{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(12,10,9,.92);backdrop-filter:blur(8px);z-index:10}
.top-inner{display:flex;align-items:center;justify-content:space-between;padding-top:16px;padding-bottom:16px;gap:20px}
.mark{font-size:26px;text-decoration:none;letter-spacing:-.01em}
.mark span{color:var(--brick)}
.top-nav{display:flex;gap:24px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase}
.top-nav a{text-decoration:none;color:var(--dim)}
.top-nav a:hover{color:var(--bone)}
.pill{display:inline-block;min-width:20px;padding:1px 6px;border-radius:999px;background:var(--brick);color:#fff;font-size:11px;text-align:center}

.hero{padding:76px 0 64px;border-bottom:1px solid var(--line)}
.kicker{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--dim);margin:0}
.kicker b{color:var(--brick);font-weight:600}
h1{font-size:clamp(52px,10vw,150px);line-height:.86;margin:22px 0 0;letter-spacing:-.005em}
h1 em{font-style:normal;color:var(--brick)}
.lede{max-width:58ch;color:var(--dim);font-size:18px;margin:28px 0 0}

.section-head{font-size:clamp(26px,4vw,44px);margin:72px 0 28px;line-height:1}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.card{background:var(--bg);display:flex;flex-direction:column}
.card-art{background:linear-gradient(168deg,#2a2320,#151110 62%);aspect-ratio:6/7;overflow:hidden}
.card-art img{width:100%;height:100%;object-fit:cover;display:block}
.card-art-empty{width:100%;height:100%}
.card-body{padding:20px}
.card-body h2{font-family:'Bricolage',sans-serif;font-variation-settings:'wdth' 75,'wght' 800;
  text-transform:uppercase;font-size:22px;line-height:1.04;margin:0}
.card-meta{font-size:12px;letter-spacing:.12em;color:var(--dim);margin:10px 0 16px;text-transform:uppercase}
.card-buy{display:flex;gap:8px}
select{background:var(--bg2);color:var(--bone);border:1px solid var(--line2);border-radius:2px;
  padding:9px 10px;font-family:'PlexMono',monospace;font-size:12.5px;flex:1;min-width:0}
.btn{background:var(--bone);color:#12100e;border:0;border-radius:2px;padding:9px 18px;cursor:pointer;
  font-family:'PlexMono',monospace;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
  transition:background .15s}
.btn:hover:not(:disabled){background:#fff}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.is-added{background:var(--brick);color:#fff}
.btn-primary{padding:12px 28px}

.cart{border-top:1px solid var(--line);margin-top:12px;padding-bottom:80px}
.line{display:grid;grid-template-columns:1fr auto auto;gap:20px;align-items:center;
  padding:16px 0;border-bottom:1px solid var(--line)}
.line-name{margin:0;font-weight:500}
.line-meta{margin:4px 0 0;font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.line-qty{display:flex;align-items:center;gap:12px}
.qty{background:none;border:1px solid var(--line2);color:var(--bone);width:28px;height:28px;
  border-radius:2px;cursor:pointer;font-size:15px;line-height:1}
.line-price{margin:0;min-width:5.5ch;text-align:right;font-variant-numeric:tabular-nums}
.cart-total{display:flex;justify-content:space-between;padding:18px 0;font-size:15px;
  border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.cart-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:22px}
.ship-label{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.cart-actions select{flex:0 1 220px}
.empty{color:var(--faint);padding:32px 0;font-size:13.5px}
.error{color:var(--brick);font-size:13px;min-height:1.2em;margin:12px 0 0}
.fineprint{color:var(--faint);font-size:11.5px;margin:14px 0 0;line-height:1.7}

.foot{border-top:1px solid var(--line)}
.foot-inner{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:36px 0 64px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}

@media (max-width:620px){
  .wrap{padding:0 16px}
  .hero{padding:48px 0 40px}
  .line{grid-template-columns:1fr auto;row-gap:8px}
  .line-price{grid-column:2}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}