/* shared additions: cart, clickable cards, product page */
.card-img.linked, .card h3.linked { cursor: pointer; }
.card h3.linked:hover { color: #a76f4a; }
.card-img.linked::after { content:'view details'; position:absolute; left:50%; bottom:12px; transform:translate(-50%,10px);
  background:rgba(62,44,31,.85); color:#fff8ee; font-size:.75rem; font-weight:600; padding:.3rem .8rem; border-radius:50px;
  opacity:0; transition:.3s; pointer-events:none; letter-spacing:.3px; }
.card:hover .card-img.linked::after { opacity:1; transform:translate(-50%,0); }

.cart-btn { position:relative; margin-left:2rem; background:#a76f4a; color:#fff8ee; border:none; cursor:pointer;
  width:46px; height:46px; border-radius:50%; font-size:1.1rem; box-shadow:0 8px 16px -6px rgba(112,79,56,.5); transition:.3s; }
.cart-btn:hover { background:#8b5a2e; transform:translateY(-2px); }
.cart-btn .count { position:absolute; top:-6px; right:-6px; min-width:22px; height:22px; padding:0 5px; border-radius:11px;
  background:#e8b06a; color:#2e1e14; font-size:.75rem; font-weight:700; display:none; align-items:center; justify-content:center; font-family:'Quicksand',sans-serif; }
.cart-btn .count.show { display:flex; }
.cart-btn.bump { animation: cartBump .4s; }
@keyframes cartBump { 50% { transform:scale(1.25); } }
.header-inner nav { display:flex; align-items:center; }

.overlay { position:fixed; inset:0; background:rgba(46,30,20,.45); backdrop-filter:blur(2px); opacity:0; pointer-events:none; transition:.3s; z-index:1500; }
.overlay.open { opacity:1; pointer-events:auto; }
.drawer { position:fixed; top:0; right:0; height:100%; width:min(420px,100%); background:#fbf3e8; z-index:1600;
  transform:translateX(100%); transition:transform .4s cubic-bezier(.2,.8,.2,1); display:flex; flex-direction:column;
  box-shadow:-20px 0 40px -10px rgba(62,44,31,.3); }
.drawer.open { transform:none; }
.drawer-head { display:flex; justify-content:space-between; align-items:center; padding:1.3rem 1.5rem; border-bottom:1px solid rgba(168,120,80,.25); }
.drawer-head h3 { font-size:1.5rem; color:#4a3323; }
.drawer-close { background:none; border:none; font-size:1.4rem; color:#704f38; cursor:pointer; }
.drawer-body { flex:1; overflow-y:auto; padding:1rem 1.5rem; }
.empty { text-align:center; color:#7a614b; padding:3rem 1rem; }
.empty i { font-size:3rem; color:#d4a574; margin-bottom:1rem; display:block; }
.ci { display:flex; gap:.9rem; padding:.9rem 0; border-bottom:1px solid rgba(168,120,80,.18); }
.ci img { width:68px; height:68px; border-radius:14px; object-fit:cover; background:#efe2d2; }
.ci-info { flex:1; min-width:0; }
.ci-info b { display:block; font-family:'Playfair Display',serif; color:#4a3323; }
.ci-info small { display:block; color:#7a614b; font-size:.78rem; }
.ci-row { display:flex; align-items:center; justify-content:space-between; margin-top:.4rem; }
.qty { display:inline-flex; align-items:center; background:#f0e0cc; border-radius:50px; }
.qty button { width:30px; height:30px; border:none; background:none; color:#5e3e2b; font-size:1rem; cursor:pointer; font-weight:700; }
.qty span { min-width:24px; text-align:center; font-weight:700; }
.ci-price { font-weight:700; color:#a76f4a; font-family:'Playfair Display',serif; }
.ci-rm { background:none; border:none; color:#a08a76; cursor:pointer; font-size:.8rem; margin-left:.5rem; }
.ci-rm:hover { color:#a03a2a; }
.drawer-foot { padding:1.2rem 1.5rem 1.5rem; border-top:1px solid rgba(168,120,80,.25); background:#f6ead9; }
.sum { display:flex; justify-content:space-between; font-size:1.1rem; margin-bottom:.9rem; color:#4a3323; }
.sum b { font-family:'Playfair Display',serif; font-size:1.4rem; color:#a76f4a; }
.wide { width:100%; border:none; cursor:pointer; text-align:center; font-family:'Quicksand',sans-serif; animation:none; }
.link-btn { background:none; border:none; color:#7a614b; text-decoration:underline; cursor:pointer; margin-top:.7rem; font-family:'Quicksand',sans-serif; width:100%; }
.toast { position:fixed; left:50%; bottom:28px; transform:translate(-50%,30px); background:#3e2c1f; color:#fff8ee; padding:.8rem 1.4rem;
  border-radius:50px; z-index:2000; opacity:0; transition:.35s; pointer-events:none; font-weight:600; box-shadow:0 14px 30px -8px rgba(0,0,0,.4); }
.toast.show { opacity:1; transform:translate(-50%,0); }
.toast i { color:#e8b06a; margin-right:.5rem; }

/* product page */
.crumbs { padding:1.6rem 0 .5rem; font-size:.95rem; color:#7a614b; }
.crumbs a { color:#a76f4a; text-decoration:none; } .crumbs a:hover { text-decoration:underline; }
.pd { display:grid; grid-template-columns:1.05fr 1fr; gap:3rem; padding:1.5rem 0 3rem; align-items:start; }
.pd-img { position:relative; border-radius:36px; overflow:hidden; background:#efe2d2; aspect-ratio:1/1;
  box-shadow:0 30px 45px -18px rgba(112,79,56,.35); border:1px solid rgba(236,194,142,.5); animation:softPop .8s both; }
.pd-img img { width:100%; height:100%; object-fit:cover; display:block; }
.pd-tag { position:absolute; top:18px; left:18px; background:#a76f4a; color:#fff8ee; font-size:.75rem; font-weight:700; letter-spacing:.5px;
  text-transform:uppercase; padding:.4rem .9rem; border-radius:50px; }
.pd-info { animation:slideInRight .8s both; }
.pd-cat { text-transform:uppercase; letter-spacing:2px; font-size:.8rem; color:#a76f4a; font-weight:700; }
.pd-info h1 { font-size:clamp(2.2rem,5vw,3.3rem); color:#3e2c1f; line-height:1.15; margin:.3rem 0 .6rem; }
.pd-short { font-size:1.15rem; color:#6b4f38; margin-bottom:1rem; }
.pd-price { font-family:'Playfair Display',serif; font-size:2.2rem; font-weight:600; color:#a76f4a; margin-bottom:1rem; }
.pd-desc { font-size:1.05rem; color:#5f4a38; margin-bottom:1.6rem; line-height:1.7; }
.opt { margin-bottom:1.2rem; }
.opt label { display:block; font-weight:700; color:#4a3323; margin-bottom:.5rem; font-size:.95rem; }
.chips { display:flex; gap:.5rem; flex-wrap:wrap; }
.chip { border:1px solid rgba(168,120,80,.5); background:rgba(255,250,244,.8); color:#5e3e2b; padding:.5rem 1.1rem; border-radius:50px;
  cursor:pointer; font-family:'Quicksand',sans-serif; font-weight:600; transition:.25s; }
.chip:hover { background:#f2dcbd; }
.chip.on { background:#a76f4a; color:#fff8ee; border-color:#a76f4a; }
.buy { display:flex; gap:1rem; align-items:center; margin:1.6rem 0 1.4rem; flex-wrap:wrap; }
.buy .qty { background:#f0e0cc; } .buy .qty button { width:42px; height:46px; font-size:1.2rem; } .buy .qty span { min-width:34px; font-size:1.1rem; }
.buy .btn { flex:1; min-width:200px; border:none; cursor:pointer; font-family:'Quicksand',sans-serif; animation:none; text-align:center; }
.perks { display:flex; gap:1.4rem; flex-wrap:wrap; color:#7a614b; font-size:.9rem; }
.perks i { color:#c08e5c; margin-right:.4rem; }
.details { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.4rem; margin-bottom:3rem; }
.dbox { background:rgba(255,250,244,.85); border:1px solid rgba(236,194,142,.45); border-radius:28px; padding:1.6rem; box-shadow:0 18px 28px -14px rgba(112,79,56,.2); }
.dbox h3 { font-size:1.2rem; color:#4a3323; margin-bottom:.6rem; } .dbox h3 i { color:#c08e5c; margin-right:.5rem; }
.dbox p { color:#5f4a38; font-size:.98rem; }
.related h2 { font-size:2rem; color:#3e2c1f; margin-bottom:1.4rem; text-align:center; }
.rel-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1.4rem; margin-bottom:3rem; }
.rel { text-decoration:none; color:inherit; background:rgba(255,250,244,.9); border-radius:26px; overflow:hidden; border:1px solid rgba(236,194,142,.4);
  transition:.4s; box-shadow:0 16px 26px -14px rgba(112,79,56,.25); }
.rel:hover { transform:translateY(-8px); }
.rel img { width:100%; height:160px; object-fit:cover; display:block; }
.rel div { padding:.9rem 1rem 1.1rem; text-align:center; } .rel b { font-family:'Playfair Display',serif; display:block; color:#4a3323; } .rel span { color:#a76f4a; font-weight:700; }
.notfound { text-align:center; padding:6rem 1rem; }
@media (max-width:820px){ .pd{grid-template-columns:1fr;gap:1.6rem;} .cart-btn{margin-left:1rem;} }

/* full-screen checkout thank-you */
.thanks { position:fixed; inset:0; z-index:3000; background:#1c1410; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .4s; overflow:hidden; }
.thanks.show { opacity:1; }
.thanks-bg { position:absolute; inset:-30px; background-size:cover; background-position:center; filter:blur(28px) brightness(.55); }
.thanks-img { position:relative; height:100%; max-width:100%; object-fit:contain; animation:thanksPop .8s cubic-bezier(.2,.9,.3,1.2) both; }
.thanks-cap { position:absolute; left:0; right:0; bottom:0; padding:5rem 1.5rem 2rem; text-align:center; color:#fff8ee;
  background:linear-gradient(to top,rgba(20,12,8,.92),rgba(20,12,8,.55) 60%,transparent); }
.thanks-cap h2 { font-family:'Playfair Display',serif; font-size:clamp(2rem,6vw,3.2rem); margin-bottom:.3rem; }
.thanks-cap p { margin-bottom:1.2rem; opacity:.92; font-size:1.05rem; }
.thanks-mute { position:absolute; top:18px; right:18px; width:46px; height:46px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(255,248,238,.9); color:#5e3e2b; font-size:1.1rem; }
@keyframes thanksPop { from { opacity:0; transform:scale(.9); } to { opacity:1; transform:none; } }
