:root{
  --charcoal:#1C1A17;
  --charcoal-soft:#2A2620;
  --cream:#F2EDE2;
  --cream-dim:#E8E0D0;
  --orange:#C8552D;
  --wood:#6B4226;
  --tile:#4A6058;
  --rule: rgba(28,26,23,0.16);
  --rule-light: rgba(242,237,226,0.22);
  --max: 760px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--cream);
  color:var(--charcoal);
  font-family:'Source Serif 4', Georgia, serif;
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.wordmark,.nav-brand-text{
  font-family:'Besley', Georgia, serif;
  font-weight:700;
  line-height:1.15;
  margin:0;
}

a{ color:inherit; }
a:focus-visible, button:focus-visible{
  outline:2px solid var(--orange);
  outline-offset:3px;
}

.wrap{ max-width: var(--max); margin:0 auto; padding:0 24px; }
.wrap-wide{ max-width: 980px; margin:0 auto; padding:0 24px; }

/* ---------- NAV ---------- */
.site-nav{
  position:sticky; top:0; z-index:20;
  background:rgba(242,237,226,0.94);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--rule);
}
.site-nav .wrap-wide{
  display:flex; align-items:center; justify-content:space-between;
  height:64px;
}
.nav-brand{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-brand img{ height:32px; width:auto; display:block; }
.nav-brand-text{ font-size:1rem; letter-spacing:0.02em; }
.nav-links{ display:flex; gap:28px; list-style:none; margin:0; padding:0; }
.nav-links a{
  text-decoration:none; font-family:'Source Serif 4', serif;
  font-size:0.95rem; color:var(--charcoal); border-bottom:1px solid transparent;
  padding-bottom:2px;
}
.nav-links a:hover{ border-bottom-color: var(--orange); }
.nav-links a.active{ color:var(--orange); border-bottom-color: var(--orange); }
@media (max-width:620px){
  .nav-links{ gap:16px; }
  .nav-links a{ font-size:0.85rem; }
  .nav-brand-text{ display:none; }
}

/* ---------- HERO ---------- */
.hero{
  background:var(--charcoal);
  color:var(--cream);
  padding:88px 0 76px;
  position:relative;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(0deg, rgba(242,237,226,0.02) 0px, rgba(242,237,226,0.02) 1px, transparent 1px, transparent 3px);
  pointer-events:none;
}
.hero-inner{ position:relative; }

.hero-logo{ margin-bottom:30px; }
.hero-logo img{ height:64px; width:auto; display:block; }

.hero-wordmark{
  font-family:'Besley', serif;
  font-weight:800;
  color:var(--orange);
  font-size:clamp(2rem, 5vw, 3rem);
  letter-spacing:0.01em;
  text-transform:uppercase;
}
.hero-subtitle{
  font-family:'Besley', serif;
  font-weight:600;
  color:var(--cream);
  text-transform:uppercase;
  letter-spacing:0.12em;
  font-size:0.95rem;
  margin-top:8px;
}
.hero p.lede{
  max-width:52ch;
  margin-top:24px;
  font-size:1.08rem;
  color:var(--cream-dim);
}
.tagline-mark{
  display:inline-block;
  margin-top:26px;
  font-family:'Besley', serif;
  font-weight:600;
  color:var(--cream);
  text-transform:uppercase;
  letter-spacing:0.1em;
  font-size:0.85rem;
  border-top:1px solid var(--rule-light);
  padding-top:14px;
}
.hero-ctas{
  display:flex; flex-wrap:wrap; gap:14px;
  margin-top:34px;
}
.btn{
  display:inline-block;
  padding:13px 22px;
  font-family:'Source Serif 4', serif;
  font-size:0.98rem;
  text-decoration:none;
  border:1px solid var(--orange);
  border-radius:2px;
}
.btn-solid{ background:var(--orange); color:var(--cream); }
.btn-solid:hover{ background:#B14A26; }
.btn-ghost{ color:var(--cream); border-color:var(--rule-light); }
.btn-ghost:hover{ border-color:var(--cream); }
.btn-dark{ border-color:var(--rule); color:var(--charcoal); }
.btn-dark:hover{ border-color:var(--orange); color:var(--orange); }

/* ---------- PAGE HEADER (for non-home pages) ---------- */
.page-header{
  padding:64px 0 20px;
  border-bottom:1px solid var(--rule);
}
.page-header h1{ font-size:2.1rem; }
.page-header p{ max-width:58ch; margin-top:14px; color:#4A463E; }

/* ---------- ABOUT / CURATOR STATEMENT ---------- */
.about-body{ padding:56px 0 72px; }
.about-body p{ margin-top:20px; max-width:60ch; }
.about-quote{
  margin-top:32px;
  padding-left:22px;
  border-left:3px solid var(--orange);
  font-family:'Besley', serif;
  font-style:italic;
  font-weight:600;
  font-size:1.15rem;
  max-width:52ch;
}
.ep-zero-panel{
  margin-top:48px;
  display:grid;
  grid-template-columns: 220px 1fr;
  gap:26px;
  align-items:center;
  background:var(--cream-dim);
  border:1px solid var(--rule);
  padding:20px;
}
.ep-zero-panel img{ width:100%; height:auto; display:block; }
.ep-zero-panel h3{ font-size:1.2rem; }
.ep-zero-panel p{ margin-top:8px; font-size:0.98rem; }
@media (max-width:600px){
  .ep-zero-panel{ grid-template-columns:1fr; }
}

/* ---------- COLLECTION ---------- */
.collection{ padding:56px 0 96px; }
.records{
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:26px;
}

.record-card{
  display:grid;
  grid-template-columns: 168px 1fr;
  gap:0;
  background:var(--cream-dim);
  border:1px solid var(--rule);
}
@media (max-width:640px){
  .record-card{ grid-template-columns: 1fr; }
}

.record-photo{
  min-height:168px;
  position:relative;
  display:flex;
  align-items:flex-end;
  padding:10px;
  overflow:hidden;
}
.record-photo img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:contain;
}
.record-photo.tone-wood{
  background:
    repeating-linear-gradient(95deg, #6B4226, #6B4226 8px, #7C4F2C 8px, #7C4F2C 15px);
}
.record-photo.tone-tile{
  background: var(--tile);
  background-image: linear-gradient(160deg, rgba(255,255,255,0.08), transparent 55%);
}
.record-photo.tone-pending{
  background: repeating-linear-gradient(45deg, #DCD3BC, #DCD3BC 10px, #D2C6A8 10px, #D2C6A8 20px);
}
.record-photo.tone-paper{
  background:
    repeating-linear-gradient(0deg, #E4DCC6, #E4DCC6 24px, #DACEAF 24px, #DACEAF 25px);
}
.record-photo span{
  position:relative;
  font-family:'Special Elite', monospace;
  font-size:0.68rem;
  letter-spacing:0.03em;
  background:rgba(28,26,23,0.6);
  color:var(--cream);
  padding:3px 6px;
}

.record-body{ padding:22px 24px; }
.record-ref{
  font-family:'Special Elite', monospace;
  font-size:0.82rem;
  color:var(--orange);
  letter-spacing:0.03em;
}
.record-title{
  font-family:'Besley', serif;
  font-weight:700;
  font-size:1.3rem;
  margin-top:6px;
}
.record-meta{
  display:flex; flex-wrap:wrap; gap:4px 18px;
  margin-top:10px;
  font-family:'Special Elite', monospace;
  font-size:0.74rem;
  color:#5A564C;
}
.record-meta .field-label{ color:#8A8578; }
.record-desc{
  margin-top:14px;
  font-size:0.98rem;
  max-width:58ch;
}
.record-listen{
  margin-top:16px;
  display:inline-block;
  font-family:'Source Serif 4', serif;
  font-size:0.95rem;
  text-decoration:none;
  border-bottom:1px solid var(--orange);
  color:var(--charcoal);
}
.record-listen:hover{ color:var(--orange); }

.record-card.pending{ opacity:0.82; }
.record-card.pending .record-title{ color:#5A564C; }
.status-pill{
  display:inline-block;
  margin-top:14px;
  font-family:'Special Elite', monospace;
  font-size:0.7rem;
  letter-spacing:0.04em;
  padding:3px 8px;
  background:var(--rule);
  color:#5A564C;
}

/* ---------- LISTEN ---------- */
.listen-body{ padding:56px 0 96px; }
.platform-list{
  margin-top:28px;
  display:flex; flex-wrap:wrap; gap:14px;
}
.platform-list a{
  text-decoration:none;
  border:1px solid var(--rule);
  background:var(--cream-dim);
  padding:16px 22px;
  min-width:160px;
  display:flex; flex-direction:column; gap:4px;
  color:var(--charcoal);
}
.platform-list a:hover{ border-color:var(--orange); background:#fff; }
.platform-list .platform-name{
  font-family:'Besley', serif;
  font-weight:700;
  font-size:1.05rem;
}
.platform-list .platform-hint{
  font-family:'Special Elite', monospace;
  font-size:0.7rem;
  letter-spacing:0.03em;
  color:#8A8578;
  text-transform:uppercase;
}
.platform-list a:hover .platform-hint{ color:var(--orange); }

/* ---------- FOOTER ---------- */
footer{
  background:var(--charcoal);
  color:var(--cream-dim);
  padding:52px 0 40px;
}
footer .foot-top{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:24px;
  padding-bottom:28px;
  border-bottom:1px solid var(--rule-light);
}
footer .foot-brand{ display:flex; align-items:center; gap:10px; }
footer .foot-brand img{ height:28px; width:auto; }
footer .foot-tagline{
  font-family:'Besley', serif; font-weight:600;
  text-transform:uppercase; letter-spacing:0.08em; font-size:0.8rem;
  color:var(--cream-dim);
  margin-top:6px;
}
footer .foot-links{
  display:flex; gap:20px; list-style:none; margin:0; padding:0;
}
footer .foot-links a{ text-decoration:none; font-size:0.92rem; }
footer .foot-links a:hover{ color:var(--orange); }
footer .foot-bottom{
  margin-top:22px;
  font-size:0.82rem;
  color:#8B877C;
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
}

/* ================= v2 additions ================= */

.record-ref{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.runtime-badge{
  font-family:'Source Serif 4', serif;
  font-size:0.72rem;
  color:#5A564C;
  background:rgba(28,26,23,0.08);
  padding:2px 7px;
  border-radius:2px;
}

.tag-row{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.tag-pill{
  font-family:'Source Serif 4', serif;
  font-size:0.76rem;
  color:var(--orange);
  border:1px solid rgba(200,85,45,0.35);
  padding:2px 9px;
  border-radius:20px;
}

.highlight-card{ border-color:var(--orange); }
.highlight-card .status-pill:last-child{ background:rgba(200,85,45,0.12); color:var(--orange); }

/* Found/Acquired status pills — colours sampled from the real
   database app, not approximated. */
.status-pill-found{ background:rgba(92,124,92,0.14); color:#5C7C5C; margin-right:8px; }
.status-pill-acquired{ background:rgba(118,93,42,0.14); color:#765D2A; margin-right:8px; }

.record-provenance{ margin-top:12px; }
.record-provenance .record-meta{ margin-top:4px; }
.record-provenance .record-meta:first-child{ margin-top:10px; }
.record-meta em{ font-style:italic; color:#8A8578; }

.catalogue-stat{
  display:inline-block;
  margin-top:18px;
  padding:8px 14px;
  border:1px solid var(--rule);
  background:var(--cream-dim);
  font-family:'Special Elite', monospace;
  font-size:0.78rem;
  letter-spacing:0.03em;
  color:#5A564C;
}
.catalogue-stat strong{ color:var(--charcoal); font-weight:400; }

.wider-section{
  padding:48px 0 8px;
}
.wider-section .section-label{
  font-family:'Special Elite', monospace;
  font-size:0.78rem;
  letter-spacing:0.04em;
  color:var(--orange);
  margin-bottom:14px;
  display:block;
}
.catalogue-note{
  font-size:0.9rem;
  color:#6b675c;
  margin-top:18px;
  padding-top:16px;
  border-top:1px dotted var(--rule);
}

/* skip-link for accessibility / SEO hygiene */
.skip-link{
  position:absolute; left:-9999px; top:0;
  background:var(--orange); color:var(--cream);
  padding:10px 16px; z-index:100;
}
.skip-link:focus{ left:10px; top:10px; }

/* ---------- Shop / cart ---------- */
.shop-toolbar{ display:flex; justify-content:flex-end; margin-bottom:8px; }
.cart-toggle{
  font-family:'Source Serif 4', serif; font-size:0.9rem; padding:10px 18px;
  border:1px solid var(--charcoal); background:var(--charcoal); color:var(--cream);
  cursor:pointer; border-radius:2px; position:relative;
}
.cart-toggle .cart-count{
  display:inline-block; min-width:18px; padding:0 4px; margin-left:6px;
  background:var(--orange); color:var(--cream); border-radius:10px;
  font-size:0.76rem; text-align:center; line-height:18px;
}

.add-to-cart-row{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.qty-stepper{ display:inline-flex; align-items:center; border:1px solid var(--rule); border-radius:2px; }
.qty-stepper button{
  width:30px; height:30px; border:none; background:transparent; cursor:pointer;
  font-size:1rem; color:var(--charcoal); font-family:'Source Serif 4', serif;
}
.qty-stepper button:hover{ background:var(--cream-dim); }
.qty-stepper input{
  width:34px; text-align:center; border:none; border-left:1px solid var(--rule);
  border-right:1px solid var(--rule); font-family:'Source Serif 4', serif; font-size:0.95rem;
  padding:6px 0; -moz-appearance:textfield;
}
.sold-out-pill{
  display:inline-block; margin-top:14px; font-family:'Special Elite', monospace;
  font-size:0.76rem; letter-spacing:0.03em; color:#8A8578; background:var(--cream-dim);
  padding:6px 11px; border-radius:2px;
}

/* Slide-in cart drawer */
.cart-overlay{
  position:fixed; inset:0; background:rgba(28,26,23,0.5); z-index:200;
  opacity:0; pointer-events:none; transition:opacity 0.2s;
}
.cart-overlay.open{ opacity:1; pointer-events:auto; }
.cart-drawer{
  position:fixed; top:0; right:0; bottom:0; width:min(420px, 100vw);
  background:var(--cream); z-index:201; box-shadow:-8px 0 24px rgba(0,0,0,0.18);
  transform:translateX(100%); transition:transform 0.25s ease; display:flex; flex-direction:column;
}
.cart-drawer.open{ transform:translateX(0); }
.cart-drawer-head{
  display:flex; justify-content:space-between; align-items:center;
  padding:20px 22px; border-bottom:1px solid var(--rule);
}
.cart-drawer-head h2{ font-size:1.1rem; margin:0; }
.cart-close{ background:none; border:none; font-size:1.3rem; cursor:pointer; color:var(--charcoal); line-height:1; }
.cart-drawer-body{ flex:1; overflow-y:auto; padding:18px 22px; }
.cart-empty{ color:#8A8578; font-size:0.92rem; margin-top:20px; }
.cart-line{ display:flex; gap:12px; padding:14px 0; border-bottom:1px dotted var(--rule); }
.cart-line-info{ flex:1; }
.cart-line-name{ font-weight:600; font-size:0.95rem; }
.cart-line-price{ font-size:0.85rem; color:#6b675c; margin-top:2px; }
.cart-line-remove{
  font-family:'Special Elite', monospace; font-size:0.74rem; color:#A3441F;
  background:none; border:none; cursor:pointer; padding:0; margin-top:6px;
}
.cart-drawer-foot{ border-top:1px solid var(--rule); padding:18px 22px; }
.cart-subtotal{ display:flex; justify-content:space-between; font-size:1rem; margin-bottom:14px; }
.cart-subtotal strong{ font-family:'Special Elite', monospace; }
.cart-checkout-btn{
  width:100%; padding:12px; background:var(--orange); color:var(--cream);
  border:none; border-radius:2px; font-family:'Source Serif 4', serif; font-size:0.98rem; cursor:pointer;
}
.cart-checkout-btn:disabled{ opacity:0.5; cursor:not-allowed; }

/* Checkout panel (replaces cart body when checking out) */
.checkout-field{ margin-bottom:14px; }
.checkout-field label{
  display:block; font-family:'Special Elite', monospace; font-size:0.72rem;
  letter-spacing:0.03em; color:#6b675c; margin-bottom:5px; text-transform:uppercase;
}
.checkout-field input{
  width:100%; padding:9px 11px; font-family:'Source Serif 4', serif; font-size:0.92rem;
  border:1px solid var(--rule); border-radius:2px;
}
.checkout-row{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
#sq-card-container{ margin:14px 0; min-height:90px; }
.checkout-status{ font-size:0.88rem; margin-top:10px; }
.checkout-status.err{ color:#A3441F; }
.checkout-status.ok{ color:#3F5A3F; }
.checkout-back{
  background:none; border:none; font-family:'Special Elite', monospace; font-size:0.76rem;
  color:#6b675c; cursor:pointer; padding:0; margin-bottom:14px;
}

