:root{
  --bg:#1C1A17;
  --surface:#242019;
  --surface2:#2B261E;
  --steel:#9C978D;
  --rust:#B9532F;
  --ochre:#D9A441;
  --bone:#EDE6D8;
  --muted:#AFA694;
  --line:#3A3428;
  --radius:2px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--bone);
  font-family:'Source Serif 4', Georgia, serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.mono{font-family:'Oswald',sans-serif;}
.mono{font-family:'IBM Plex Mono',monospace;}

a{color:inherit;}

/* subtle brushed-steel texture */
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1;
  background:
    repeating-linear-gradient(115deg, rgba(255,255,255,0.015) 0px, rgba(255,255,255,0.015) 1px, transparent 1px, transparent 3px),
    radial-gradient(ellipse at 20% 0%, #2a251d 0%, var(--bg) 60%);
}

/* NAV */
.nav{
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px;
  background:rgba(28,26,23,0.88);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.brand{
  font-family:'Oswald',sans-serif;
  font-weight:700;
  letter-spacing:0.14em;
  font-size:15px;
  text-transform:uppercase;
  display:flex; align-items:center; gap:10px;
}
.brand .dot{width:8px;height:8px;background:var(--rust);border-radius:50%;display:inline-block;box-shadow:0 0 0 3px rgba(185,83,47,0.2);}
.version-badge{
  font-family:'IBM Plex Mono',monospace;
  font-weight:500;
  font-size:10px;
  letter-spacing:0.06em;
  color:var(--muted);
  background:var(--surface2);
  border:1px solid var(--line);
  padding:2px 7px;
  border-radius:10px;
  text-transform:none;
}
.filters{display:flex; gap:6px;}
.filters button{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  background:transparent;
  border:1px solid var(--line);
  color:var(--muted);
  padding:8px 14px;
  cursor:pointer;
  border-radius:var(--radius);
  transition:all .15s ease;
}
.filters button:hover{border-color:var(--rust); color:var(--bone);}
.filters button.active{background:var(--rust); border-color:var(--rust); color:#fff;}

/* HERO */
.hero{
  padding:96px 28px 64px;
  max-width:760px;
  margin:0 auto;
  text-align:left;
}
.hero .brandline{
  display:block;
  width:100%;
  font-family:'Oswald',sans-serif;
  font-weight:700;
  font-size:clamp(56px, 12vw, 130px);
  line-height:0.9;
  letter-spacing:0.04em;
  text-align:center;
  margin:0 auto 22px;
  text-transform:uppercase;
  background:linear-gradient(180deg, #FF6A3D 0%, #B9532F 55%, #8A3C20 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-stroke:1px rgba(0,0,0,0.15);
  text-shadow:0 2px 0 rgba(0,0,0,0.35), 0 8px 24px rgba(185,83,47,0.25);
}
.brand-divider{
  width:120px;
  height:3px;
  margin:0 auto 40px;
  background:linear-gradient(90deg, transparent 0%, var(--rust) 50%, transparent 100%);
  border-radius:2px;
}
.hero h1{
  font-size:clamp(40px, 7vw, 76px);
  line-height:0.98;
  margin:0 0 18px;
  letter-spacing:0.01em;
  font-weight:700;
  text-transform:uppercase;
  color:var(--bone);
}
.hero h1 em{
  font-style:normal;
  color:var(--rust);
}
.hero .sub{
  font-family:'Source Serif 4', serif;
  font-style:italic;
  color:var(--steel);
  font-size:19px;
  margin:0 0 28px;
}
.hero p{
  color:var(--muted);
  font-size:16px;
  max-width:58ch;
}

/* WELD SEAM DIVIDER */
.seam{ width:100%; height:14px; display:block; margin:0; }
.seam path{ fill:none; stroke:var(--rust); stroke-width:1.4; opacity:0.55; }
.section-head + .seam, .hero + .seam { opacity:0.9; }

/* SECTION HEADS */
.section-head{
  max-width:1100px;
  margin:64px auto 8px;
  padding:0 28px;
  display:flex; align-items:baseline; gap:14px;
}
.section-head h2{
  font-size:13px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--ochre);
  margin:0;
  font-weight:600;
}
.section-head .count{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  color:var(--muted);
}
.section-head::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--line);
}

/* PRODUCT LIST */
.catalogue{max-width:700px; margin:0 auto; padding:0 28px;}
.product{
  padding:44px 0;
}
.product[data-status].is-hidden{display:none;}

.plate{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  border-bottom:1px solid var(--line);
  padding-bottom:10px; margin-bottom:18px;
}
.plate h3{
  font-size:26px; margin:0; letter-spacing:0.01em; font-weight:600;
  text-transform:uppercase; text-decoration:underline; text-underline-offset:5px;
}
.status{
  font-family:'IBM Plex Mono',monospace; font-size:16px; letter-spacing:0.08em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:7px; white-space:nowrap; font-weight:500;
}
.status i{width:9px; height:9px; border-radius:50%; display:inline-block;}
.status-available{color:var(--ochre);}
.status-available i{background:var(--ochre);}
.status-sold{color:var(--muted);}
.status-sold i{background:var(--muted);}

.product-media{position:relative; max-width:480px; margin:0 auto 20px;}
.main-photo-btn{
  display:block; width:100%; padding:0; border:1px solid var(--line);
  background:var(--surface); cursor:zoom-in; border-radius:var(--radius); overflow:hidden;
}
.main-photo{width:100%; height:auto; display:block; aspect-ratio:4/5; object-fit:cover;}
.product-media.contain .main-photo{aspect-ratio:auto; object-fit:contain; background:var(--surface2);}
.thumbs{display:flex; gap:8px; margin-top:8px; justify-content:center;}
.thumb{
  width:56px; height:56px; padding:0; border:1px solid var(--line); background:var(--surface);
  cursor:pointer; overflow:hidden; border-radius:var(--radius); opacity:0.6; transition:opacity .15s, border-color .15s;
}
.thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.thumb.active, .thumb:hover{opacity:1; border-color:var(--rust);}
.product-info{max-width:600px;}
.specs{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--steel);
  letter-spacing:0.02em; margin:0 0 16px;
}
.desc{color:var(--bone); font-size:16px; margin:0;}

/* LIGHTBOX */
.lightbox{
  position:fixed; inset:0; background:rgba(10,9,8,0.92); display:none;
  align-items:center; justify-content:center; z-index:100; padding:40px; cursor:zoom-out;
}
.lightbox.open{display:flex;}
.lightbox img{max-width:min(90vw,900px); max-height:88vh; object-fit:contain; border:1px solid var(--line);}

footer{
  max-width:1100px; margin:0 auto; padding:60px 28px 90px; text-align:center;
}
footer p{color:var(--muted); font-size:15px;}
footer .mono{color:var(--steel); font-size:11px; letter-spacing:0.12em; text-transform:uppercase;}
footer .site-version{margin-top:18px; color:var(--line); font-size:10px; opacity:0.8;}

@media (max-width:760px){
  .nav{padding:14px 18px;}
  .filters button{padding:7px 10px; font-size:10px;}
  .hero{padding:64px 18px 40px;}

}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important;}
}

/* IMAGE PLACEHOLDER (shown only if an artwork has no photos yet) */
.no-image{
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:4/3; background:var(--surface2); border:1px dashed var(--line);
  color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:11px;
  letter-spacing:0.08em; text-transform:uppercase; text-align:center; padding:12px;
}
/* Note: real photo galleries use .main-photo-btn / .main-photo / .thumbs / .thumb,
   all already styled above (see .product-media block) to match the original design. */

/* ENQUIRY / BUY BOX */
.buy-box{
  margin-top:18px; padding-top:16px; border-top:1px solid var(--line);
}
.buy-box .price{
  font-family:'Oswald',sans-serif; font-weight:600; font-size:20px; color:var(--ochre);
  margin:0 0 10px;
}
.buy-box .price-tbc{ font-size:16px; color:var(--muted); font-style:italic; }
.sold-tag{
  font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--muted);
  letter-spacing:0.06em; text-transform:uppercase;
}
.enquire-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:100%; max-width:260px; padding:11px 18px;
  background:var(--rust); border:none; border-radius:20px;
  font-family:'Oswald',sans-serif; font-weight:600; font-size:15px;
  color:#fff; cursor:pointer; text-decoration:none; transition:filter .15s ease;
}
.enquire-btn:hover{ filter:brightness(1.08); }

