/* Toko & detail produk */
.tk-hero { background:var(--tosca); color:#fff; padding:2rem var(--pad) 2.2rem; }
.tk-hero-inner { max-width:1180px; margin:0 auto; }
.tk-title { font-family:'Arial Black',Arial,sans-serif; font-weight:900; font-size:clamp(1.8rem,4vw,2.6rem); text-transform:uppercase; }
.tk-lead { max-width:620px; opacity:.92; margin-top:.3rem; font-size:.95rem; }
.tk-search { margin-top:1rem; max-width:460px; }
.tk-search input { width:100%; padding:.75rem 1rem; border-radius:99px; border:0; font:inherit; font-size:.92rem; }
.tk-body { max-width:1180px; margin:0 auto; padding:1.6rem var(--pad) 3rem; }
.tk-muted { color:#888; padding:1rem 0; }
.tk-cats { display:flex; gap:.45rem; overflow-x:auto; padding-bottom:.6rem; margin-bottom:1rem; -webkit-overflow-scrolling:touch; }
.tk-cats button { flex:none; border:1.5px solid var(--border); background:#fff; border-radius:99px; padding:.4rem .9rem; font:inherit; font-size:.8rem; font-weight:700; cursor:pointer; color:var(--black); }
.tk-cats button.on { background:var(--tosca-dk); border-color:var(--tosca-dk); color:#fff; }
.tk-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:.9rem; }
@media (min-width:700px) { .tk-grid { grid-template-columns:repeat(3, 1fr); gap:1.2rem; } }
@media (min-width:1000px) { .tk-grid { grid-template-columns:repeat(4, 1fr); } }
.tk-card { background:#fff; border:1px solid var(--border); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; transition:transform .15s, box-shadow .15s; }
.tk-card:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.08); }
.tk-card.sold { opacity:.6; }
.tk-img { position:relative; aspect-ratio:1/1; background:#f4f1ec; display:flex; align-items:center; justify-content:center; }
.tk-img img { width:100%; height:100%; object-fit:contain; padding:.6rem; }
.tk-img > span { font-size:.75rem; color:#aaa; }
.tk-badge { position:absolute; top:.5rem; left:.5rem; background:#c0392b; color:#fff; font-style:normal; font-size:.68rem; font-weight:700; padding:.15rem .5rem; border-radius:99px; }
.tk-badge.dig { background:var(--tosca-dk); }
.tk-info { padding:.7rem .8rem .9rem; display:flex; flex-direction:column; gap:.2rem; flex:1; }
.tk-cat { font-size:.68rem; color:#999; text-transform:uppercase; letter-spacing:.04em; font-weight:700; }
.tk-name { font-weight:700; font-size:.86rem; line-height:1.3; flex:1; }
.tk-price { font-weight:700; color:var(--tosca-dk); font-size:.9rem; }
.tk-price s, .pd-price s { color:#aaa; font-weight:400; font-size:.8em; margin-right:.3rem; }
.tk-crumb { font-size:.8rem; color:#888; margin-bottom:1rem; }
.tk-crumb a { color:var(--tosca-dk); font-weight:700; }

.pd { display:grid; grid-template-columns:1fr; gap:1.6rem; }
@media (min-width:860px) { .pd { grid-template-columns:1fr 1fr; gap:2.4rem; align-items:start; } }
.pd-main { background:#fff; border:1px solid var(--border); border-radius:16px; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.pd-main img { width:100%; height:100%; object-fit:contain; padding:1rem; }
.pd-thumbs { display:flex; gap:.5rem; margin-top:.6rem; flex-wrap:wrap; }
.pd-thumbs button { width:64px; height:64px; border:2px solid var(--border); border-radius:10px; background:#fff; padding:2px; cursor:pointer; }
.pd-thumbs button.on { border-color:var(--tosca-dk); }
.pd-thumbs img { width:100%; height:100%; object-fit:contain; }
.pd-name { font-family:'Arial Black',Arial,sans-serif; font-size:clamp(1.25rem,2.6vw,1.7rem); line-height:1.2; margin:.3rem 0 .5rem; }
.pd-price { font-size:1.35rem; font-weight:700; color:var(--tosca-dk); margin-bottom:1rem; }
.pd-opt { margin-bottom:.9rem; }
.pd-opt > span { display:block; font-size:.8rem; font-weight:700; margin-bottom:.35rem; }
.pd-opt div { display:flex; flex-wrap:wrap; gap:.4rem; }
.pd-opt button { border:1.5px solid var(--border); background:#fff; border-radius:8px; padding:.45rem .75rem; font:inherit; font-size:.82rem; cursor:pointer; }
.pd-opt button.on { border-color:var(--tosca-dk); background:#e6f6f4; color:var(--tosca-dk); font-weight:700; }
.pd-buy { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin:1.2rem 0 .4rem; }
.pd-qty { display:flex; border:1.5px solid var(--border); border-radius:10px; overflow:hidden; background:#fff; }
.pd-qty button { width:38px; border:0; background:#fff; font-size:1.1rem; cursor:pointer; }
.pd-qty input { width:48px; border:0; text-align:center; font:inherit; font-weight:700; -moz-appearance:textfield; }
.pd-qty input::-webkit-outer-spin-button, .pd-qty input::-webkit-inner-spin-button { -webkit-appearance:none; }
.pd-cart, .pd-now { padding:.75rem 1.2rem; border-radius:10px; font:inherit; font-weight:700; cursor:pointer; font-size:.9rem; }
.pd-cart { background:#fff; border:1.5px solid var(--tosca-dk); color:var(--tosca-dk); }
.pd-now { background:var(--orange); border:0; color:var(--black); }
.pd-cart:disabled, .pd-now:disabled { opacity:.45; cursor:default; }
.pd-msg { font-size:.85rem; color:var(--tosca-dk); min-height:1.2em; }
.pd-msg a { text-decoration:underline; font-weight:700; }
.pd-meta { font-size:.8rem; color:#888; margin:.4rem 0 1rem; }
.pd-desc { font-size:.9rem; color:#444; line-height:1.7; border-top:1px solid var(--border); padding-top:1rem; }
