:root{--paper:#F7F5F1;--ink:#111111;--muted:#8d8a84;--red:#B3241C;}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:'Jost',Helvetica,Arial,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}
body.locked{overflow:hidden}
header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:18px 48px;}
.wordmark{font-family:'Playfair Display',Georgia,serif;font-size:24px;letter-spacing:8px;text-align:center}
.wordmark .h{color:var(--red)}
.tagline{font-size:8px;letter-spacing:3px;color:var(--muted);margin-top:5px;text-align:center}
nav{display:flex;gap:38px;font-size:10.5px;letter-spacing:3px;align-items:center}
nav.right{justify-content:flex-end}
nav a{color:var(--ink);text-decoration:none}
nav a.on{border-bottom:1px solid var(--ink);padding-bottom:2px}
a{color:var(--ink)}
.colhero{position:relative;height:76vh;min-height:540px;overflow:hidden;background:#111}
.colhero>img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block}
.colhero .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,9,7,.12) 30%,rgba(12,9,7,.62));z-index:1}
.colhero .cap{position:absolute;left:0;right:0;bottom:60px;text-align:center;color:#F3EFE9;z-index:2;padding:0 24px}
.colhero .cap .eb{font-size:10.5px;letter-spacing:5px;opacity:.92}
.colhero .cap h1{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:68px;letter-spacing:1px;margin-top:14px}
.colhero .cap .sub{margin-top:16px;font-size:13.5px;letter-spacing:.5px;line-height:1.7;max-width:540px;margin-left:auto;margin-right:auto;opacity:.94}
.cartbtn{background:none;border:none;cursor:pointer;position:relative;color:var(--ink);display:inline-flex;align-items:center;padding:0}
.cartbtn .cbadge{position:absolute;top:-8px;right:-10px;background:var(--red);color:#fff;font-size:9px;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px;font-family:'Jost'}
.cartbtn .cbadge[data-n="0"]{display:none}
.bespoke-band{display:flex;align-items:center;justify-content:center;gap:14px;margin:36px auto 0;max-width:680px;border-top:1px solid #e2ded7;border-bottom:1px solid #e2ded7;padding:16px 20px;font-size:11px;letter-spacing:2.5px}
.bespoke-band svg{flex:none}
.filters{display:flex;justify-content:center;flex-wrap:wrap;gap:30px;margin:46px auto 0;font-size:11px;letter-spacing:3.5px;padding:0 24px}
.filters button{background:none;border:none;cursor:pointer;font-family:'Jost';font-weight:300;font-size:11px;letter-spacing:3.5px;color:var(--muted);padding-bottom:5px;border-bottom:1px solid transparent;transition:.2s}
.filters button.on{color:var(--ink);border-bottom-color:var(--red)}
.filters button .ct{font-size:8.5px;color:var(--muted);margin-left:5px;letter-spacing:1px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:56px 40px;max-width:1280px;margin:50px auto 40px;padding:0 48px}
.card{cursor:pointer}
.media{position:relative;width:100%;aspect-ratio:3/4;overflow:hidden;background:#e8e3db}
.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.media .frame{opacity:0;z-index:0;transition:opacity .12s ease}
.media .frame.on{opacity:1;z-index:1}
.media video.filmv{opacity:0;z-index:2;transition:opacity .5s ease}
.media.playing video.filmv{opacity:1}
.media .dots{position:absolute;bottom:12px;left:0;right:0;display:flex;gap:7px;justify-content:center;align-items:center;z-index:4;flex-wrap:wrap}
.media .dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.5);box-shadow:0 0 3px rgba(0,0,0,.35);cursor:pointer;transition:.2s;padding:0;border:none}
.media .dot.on{background:#fff;transform:scale(1.25)}
.media .dot.film{width:auto;height:auto;border-radius:8px;padding:2px 5px;background:rgba(17,17,17,.62);color:#fff;display:inline-flex;align-items:center}
.media .dot.film.on{background:var(--red)}
.media .tag{position:absolute;top:12px;left:12px;z-index:4;background:rgba(17,17,17,.55);color:#F3EFE9;font-size:8px;letter-spacing:2px;padding:5px 8px}
.card .nm{font-family:'Playfair Display',Georgia,serif;font-size:22px;margin-top:20px;letter-spacing:1px}
.card .ds{font-size:13px;color:#5d5952;margin-top:6px;line-height:1.6}
.card .pr{margin-top:12px;font-size:13px;letter-spacing:1px;color:var(--ink)}
.pmodal{position:fixed;inset:0;background:rgba(17,17,17,.6);display:none;z-index:60;align-items:flex-start;justify-content:center;overflow:auto;padding:0}
.pmodal.open{display:flex}
.pbox{background:var(--paper);width:100%;max-width:1120px;margin:auto;display:grid;grid-template-columns:1fr 1fr;min-height:100vh}
.pbox .pmedia{position:relative;background:#e8e3db;overflow:hidden}
.pbox .pmedia img,.pbox .pmedia video{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.pbox .pmedia .pframe{position:absolute;inset:0;opacity:0;transition:opacity .35s;z-index:0}
.pbox .pmedia .pframe.on{opacity:1;z-index:1}
.pbox .pmedia video.pfilm{position:absolute;inset:0;opacity:0;transition:opacity .5s;z-index:2}
.pbox .pmedia.playing video.pfilm{opacity:1}
.pthumbs{position:absolute;bottom:14px;left:0;right:0;display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:0 12px;z-index:3}
.pth{width:46px;height:58px;padding:0;border:1px solid rgba(255,255,255,.55);background:#e8e3db;cursor:pointer;overflow:hidden;opacity:.7;transition:.2s}
.pth img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.pth.on{opacity:1;border-color:#fff;box-shadow:0 0 0 1px #fff}
.pth.film{display:flex;align-items:center;justify-content:center;background:rgba(17,17,17,.72);color:#fff}
.pbox .pinfo{padding:70px 64px;display:flex;flex-direction:column;justify-content:center;position:relative}
.pclose{position:absolute;top:26px;right:30px;background:none;border:none;font-size:22px;cursor:pointer;color:var(--ink);line-height:1}
.pbox .pcat{font-size:10px;letter-spacing:4px;color:var(--muted)}
.pbox h2{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:40px;margin-top:14px;letter-spacing:1px}
.pbox .plong{font-size:14.5px;line-height:1.9;color:#5d5952;margin-top:22px}
.pbox .pprice{font-size:15px;letter-spacing:1px;margin-top:14px;color:var(--ink)}
.pbox .lbl{font-size:10px;letter-spacing:3px;color:var(--muted);margin-top:34px}
.sizes{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.sizes span{border:1px solid #cfc9c0;padding:9px 0;width:48px;text-align:center;font-size:11px;letter-spacing:1px;cursor:pointer;user-select:none;transition:.15s}
.sizes span:hover{border-color:var(--ink)}
.sizes span.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.prow{display:flex;gap:24px;align-items:center;margin-top:20px;font-size:10px;letter-spacing:2.5px}
.prow a{text-decoration:none;border-bottom:1px solid #cfc9c0;padding-bottom:3px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.porder{display:block;width:100%;margin-top:26px;text-align:center;border:1px solid var(--ink);background:var(--ink);color:var(--paper);padding:16px 0;font-size:11px;letter-spacing:3px;font-family:'Jost';cursor:pointer;opacity:.35;pointer-events:none;transition:.2s}
.porder.ready{opacity:1;pointer-events:auto}
.porder.added{background:var(--paper);color:var(--ink)}
.modal{position:fixed;inset:0;background:rgba(17,17,17,.6);display:none;align-items:center;justify-content:center;z-index:80;padding:20px}
.modal.open{display:flex}
.sheet{background:var(--paper);max-width:640px;width:100%;padding:46px 50px;max-height:88vh;overflow:auto}
.sheet h3{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:28px;text-align:center}
.sheet .sub{text-align:center;font-size:10px;letter-spacing:3px;color:var(--muted);margin-top:8px}
.sheet table{width:100%;border-collapse:collapse;margin-top:28px;font-size:12.5px}
.sheet th,.sheet td{border:1px solid #e2ded7;padding:9px 6px;text-align:center;font-weight:300}
.sheet th{letter-spacing:2px;font-size:10px;background:#efece6}
.sheet .note{margin-top:22px;font-size:12px;line-height:1.7;color:#5d5952;text-align:center}
.sheet .close{display:block;margin:28px auto 0;border:1px solid var(--ink);background:none;padding:11px 34px;font-family:'Jost';font-size:11px;letter-spacing:3px;cursor:pointer}
.cartov{position:fixed;inset:0;background:rgba(17,17,17,.5);opacity:0;visibility:hidden;transition:.3s;z-index:90}
.cartov.open{opacity:1;visibility:visible}
.cart{position:fixed;top:0;right:0;height:100%;width:420px;max-width:90vw;background:var(--paper);z-index:91;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column}
.cart.open{transform:none}
.cart .chead{display:flex;align-items:center;justify-content:space-between;padding:26px 30px;border-bottom:1px solid #e2ded7}
.cart .chead h3{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:22px;letter-spacing:1px}
.cart .chead button{background:none;border:none;font-size:22px;cursor:pointer;line-height:1}
.cart .citems{flex:1;overflow:auto;padding:10px 30px}
.citem{display:grid;grid-template-columns:64px 1fr auto;gap:16px;padding:22px 0;border-bottom:1px solid #ece8e1}
.citem img{width:64px;height:85px;object-fit:cover;object-position:center top}
.citem .cn{font-family:'Playfair Display',Georgia,serif;font-size:17px}
.citem .cs{font-size:11px;letter-spacing:1.5px;color:var(--muted);margin-top:5px}
.citem .qty{display:flex;align-items:center;gap:12px;margin-top:12px;font-size:12px}
.citem .qty button{width:22px;height:22px;border:1px solid #cfc9c0;background:none;cursor:pointer;font-size:13px;line-height:1;color:var(--ink)}
.citem .rm{background:none;border:none;font-size:10px;letter-spacing:1.5px;color:var(--muted);cursor:pointer;text-decoration:underline;align-self:start;margin-top:2px}
.cart .empty{padding:60px 30px;text-align:center;color:var(--muted);font-size:13px;letter-spacing:1px;line-height:1.9}
.cart .cfoot{border-top:1px solid #e2ded7;padding:24px 30px 30px}
.cart .cfoot .note{font-size:11px;color:#5d5952;line-height:1.7;margin-bottom:18px}
.cart .checkout{display:block;width:100%;text-align:center;background:var(--ink);color:var(--paper);padding:16px 0;font-size:11px;letter-spacing:3px;text-decoration:none;border:none;cursor:pointer;font-family:'Jost'}
.cart .cont{display:block;text-align:center;margin-top:14px;font-size:10px;letter-spacing:2.5px;color:var(--muted);cursor:pointer;text-decoration:underline}
.bespoke-sec{background:#111;color:#F3EFE9;text-align:center;padding:90px 40px;margin-top:60px}
.bespoke-sec h2{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:38px}
.bespoke-sec p{max-width:540px;margin:20px auto 0;font-size:14px;line-height:1.9;color:#c9c4bc}
.bespoke-sec a{display:inline-block;margin-top:30px;color:#F3EFE9;border:1px solid #6f6a63;padding:14px 34px;font-size:11px;letter-spacing:3px;text-decoration:none}
footer{border-top:1px solid #e2ded7;padding:60px 40px 46px;text-align:center}
footer .wm{font-family:'Playfair Display',Georgia,serif;font-size:20px;letter-spacing:8px}
footer .wm .h{color:var(--red)}
footer .base{margin-top:18px;font-size:9.5px;letter-spacing:3px;color:var(--muted)}
@media(max-width:1000px){.grid{grid-template-columns:repeat(2,1fr)}.pbox{grid-template-columns:1fr}.pbox .pmedia{aspect-ratio:3/4}.pbox .pinfo{padding:48px 36px}}
@media(max-width:900px){header{padding:16px 24px}nav{gap:18px;font-size:9.5px}}
@media(max-width:640px){
  header{padding:14px 18px;gap:6px}
  .wordmark{font-size:18px;letter-spacing:5px;white-space:nowrap}
  .tagline{font-size:6.5px;letter-spacing:2px}
  nav a{display:none}
  .colhero{height:66vh;min-height:420px}
  .colhero .cap{bottom:40px}
  .colhero .cap h1{font-size:40px}
  .colhero .cap .sub{font-size:12px;margin-top:12px}
  .bespoke-band{margin-top:26px;padding:14px 8px;font-size:9.5px;letter-spacing:1.5px;gap:10px}
  .filters{gap:18px;font-size:10px;letter-spacing:2.5px}
  .grid{grid-template-columns:1fr;gap:44px;padding:0 24px;margin-top:36px}
  .card .nm{font-size:24px}
  .pbox .pinfo{padding:40px 26px 60px}
  .pbox h2{font-size:32px}
  .bespoke-sec{padding:64px 28px}
  .bespoke-sec h2{font-size:30px}
  .sheet{padding:34px 24px}
  .sheet table{font-size:11px}
}