/* ================================
   Global & Fonts
==================================*/
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;600&display=swap');

:root{
  --brand-brown: #4a2c2a;
  --text: #333;
  --bg: #f8f5f2;
  --shadow: rgba(0,0,0,0.15);
  --muted: #777;
  --card: #fff;
  --sold: #9a9a9a;
  --reserved: #cc8800;
  --accent: #4a2c2a;
}

* { box-sizing: border-box; }

body { font-family: Arial, sans-serif; margin: 0; padding: 0; background: var(--bg); color: var(--text); }
main { padding: 2rem; }
footer { background: var(--brand-brown); color: #fff; text-align: center; padding: 1rem; margin-top: 2rem; }

/* Header */
.site-header { position: relative; z-index: 10; display: grid; grid-template-columns: auto 1fr auto; align-items: center; background: #4a2c2a; color:#fff; padding: .7rem 1.25rem; }
.header-left { display:flex; align-items:center; gap:12px; justify-self:start; }
.header-logo { height:80px; width:auto; display:block; opacity:1; }
.title-block { display:flex; flex-direction:column; line-height:1.1; }
.site-title { font-size:1.9rem; margin:0; font-weight:800; line-height:1.2; }
.tagline { font-family:'Dancing Script', cursive; font-size:1.2rem; margin:4px 0 0; opacity:.95; letter-spacing:.5px; }
.nav { justify-self:center; }
.nav a { color:#fff; margin:0 14px; text-decoration:none; font-weight:700; letter-spacing:.2px; }
.nav a:hover { text-decoration:underline; }
.header-right { justify-self:end; }
.cart-link { display:inline-flex; align-items:center; gap:6px; background:#ffffff22; border:2px solid #ffffff55; color:#fff; padding:6px 12px; border-radius:999px; font-weight:800; cursor:pointer; }
.cart-link:hover { background:#ffffff33; }
.cart-link .icon { display:inline-flex; line-height:0; }

@media (max-width: 700px) {
  .site-header { grid-template-columns:1fr; row-gap:8px; padding:.7rem 1rem; }
  .header-left { justify-self:start; }
  .nav { justify-self:center; }
  .header-right { justify-self:end; }
  .header-logo { height:80px; }
  .site-title { font-size:1.6rem; }
  .tagline { font-size:1.1rem; }
}

/* HERO */
.hero-img-wrap { position:relative; width:100%; min-height:70vh; background:#000; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:40px 16px; color:#fff; }
.hero-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:center center; z-index:0; }
.hero-img-wrap .logo, .hero-img-wrap h1, .hero-img-wrap .tagline { position:relative; z-index:1; margin:0; text-shadow:3px 3px 12px rgba(0,0,0,1); }
.logo { max-height:350px; width:auto; opacity:.5; display:block; margin:0 auto 12px; }
.hero-img-wrap h1 { font-size:3rem; line-height:1.1; }
.hero-img-wrap .tagline { font-family:'Dancing Script', cursive; font-size:1.5rem; margin-top:8px; }
@media (max-width: 600px) { .hero-img-wrap { min-height:60vh; padding:28px 14px; } .logo { max-height:100px; margin-bottom:10px; } .hero-img-wrap h1 { font-size:2.2rem; } .hero-img-wrap .tagline { font-size:1.2rem; } }
@media (min-width: 1200px) { .hero-img-wrap { min-height:75vh; } }

/* Gallery */
.gallery { padding:2rem; text-align:center; max-width:1100px; margin:0 auto; }
.gallery h2 { font-size:2rem; margin-bottom:1.5rem; }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:16px; }
.grid .item { display:flex; flex-direction:column; align-items:center; }
.grid .item img { width:100%; height:200px; object-fit:cover; border-radius:10px; box-shadow:0 4px 10px var(--shadow); transition: transform .2s ease, box-shadow .2s ease; }
.grid .item img:hover { transform:scale(1.03); box-shadow:0 6px 14px rgba(0,0,0,.22); }
.grid .item p { margin-top:.5rem; font-weight:600; font-size:.95rem; }

/* Piece page */
.piece { display:grid; grid-template-columns:1.2fr 1fr; gap:24px; max-width:1100px; margin:2rem auto; padding:0 16px; }
.piece-main { width:100%; aspect-ratio:4 / 3; object-fit:contain; background:#fff; border:1px solid #eee; border-radius:10px; }
.thumbs { display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-top:10px; }
.thumbs img { width:100%; aspect-ratio:1 / 1; object-fit:cover; border-radius:8px; cursor:pointer; transition: transform .15s; }
.thumbs img:hover { transform:scale(1.03); }
.thumbs img.active-thumb { outline:3px solid var(--brand-brown); outline-offset:2px; }
.piece-info h2 { margin-top:0; }
.specs { padding-left:16px; }
.specs li { margin:6px 0; }
.video { margin-top:16px; }
.btn { display:inline-block; margin-top:10px; padding:8px 14px; background:var(--brand-brown); color:#fff; border-radius:6px; text-decoration:none; font-size:.95rem; }
.btn:hover { background:#633c38; }
@media (max-width:900px){ .piece { grid-template-columns:1fr; } }

/* Shop */
.shop { max-width:1100px; margin:0 auto; text-align:center; padding:2rem 16px; }
.shop h2 { font-size:2rem; margin-bottom:.25rem; }
.shop p.sub { color:var(--muted); margin-top:0; margin-bottom:1.5rem; }
.products { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:18px; }
.product-card { background:var(--card); border-radius:12px; box-shadow:0 4px 12px var(--shadow); overflow:hidden; display:flex; flex-direction:column; text-align:left; }
.product-card img { width:100%; height:200px; object-fit:cover; }
.product-body { padding:12px 14px 14px; display:flex; flex-direction:column; gap:6px; }
.product-title { margin:0; font-size:1.05rem; font-weight:700; }
.product-sub { margin:0; color:var(--muted); font-size:.9rem; }
.price { font-weight:800; margin-top:4px; }
.btn-add { margin-top:10px; padding:10px 12px; border-radius:8px; border:none; background:var(--accent); color:#fff; font-weight:700; cursor:pointer; }
.btn-add:disabled { opacity:.6; cursor:not-allowed; }
/* NEW: green styling for "Added to Cart" */
.btn-add.added { background:#2e7d32; }

/* Cart drawer */
.cart-drawer { position:fixed; top:0; right:-420px; width:360px; max-width:92vw; height:100vh; background:#fff; box-shadow:-6px 0 16px rgba(0,0,0,.2); padding:16px; transition:right .25s ease; z-index:100; display:flex; flex-direction:column; gap:10px; }
.cart-drawer.open { right:0; }
.cart-header { display:flex; justify-content:space-between; align-items:center; }
.cart-items { flex:1; overflow:auto; border-top:1px solid #eee; border-bottom:1px solid #eee; padding:8px 0; }
.cart-row { display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:8px; padding:8px 0; border-bottom:1px dashed #eee; }
.cart-row img { width:54px; height:54px; object-fit:cover; border-radius:6px; }
.cart-row h4 { margin:0; font-size:.95rem; }
.cart-total { display:flex; justify-content:space-between; align-items:center; font-weight:800; }
.paypal-wrap { margin-top:10px; }