:root { --ink:#2b2014; --muted:#7a6a50; --honey:#e9a823; --honey-d:#c98a0e; --bg:#fffdf8; --card:#fff; --line:#eadfc8; --ok:#2f7a45; --err:#a3301e; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; line-height:1.55; }
a { color:inherit; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; font-weight:600; line-height:1.2; }
.announce { background:var(--ink); color:#fbefd5; text-align:center; font-size:.85rem; padding:.45rem 1rem; }
.shop-header { display:flex; align-items:center; gap:2rem; padding:1.1rem 2rem; border-bottom:1px solid var(--line); background:#fff; position:sticky; top:0; z-index:5; }
.logo { font-family:Georgia, serif; font-size:1.6rem; text-decoration:none; display:flex; align-items:center; gap:.15rem; }
.logo-mark { background:var(--honey); color:var(--ink); border-radius:8px; width:1.6rem; height:1.6rem; display:inline-flex; align-items:center; justify-content:center; font-size:1.2rem; margin-right:.1rem; }
.shop-nav { display:flex; gap:1.5rem; flex:1; }
.shop-nav a { text-decoration:none; color:var(--muted); }
.shop-nav a:hover { color:var(--ink); }
.cart-link { text-decoration:none; border:1px solid var(--line); border-radius:999px; padding:.4rem .9rem; }
.cart-count { background:var(--honey); border-radius:999px; padding:0 .45rem; margin-left:.25rem; font-weight:600; }
.shop-main { max-width:1080px; margin:0 auto; padding:2rem 1.5rem 4rem; }
.hero { text-align:center; padding:3rem 1rem 2.5rem; }
.hero h1 { font-size:2.6rem; margin:.2rem 0 .8rem; }
.hero p { color:var(--muted); max-width:560px; margin:0 auto 1.5rem; font-size:1.1rem; }
.btn { display:inline-block; background:var(--honey); color:var(--ink); border:none; border-radius:10px; padding:.8rem 1.6rem; font-weight:600; font-size:1rem; text-decoration:none; cursor:pointer; }
.btn:hover { background:var(--honey-d); }
.btn-wide { width:100%; text-align:center; }
.product-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:2rem; }
.product-card { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:1.2rem; text-decoration:none; transition:box-shadow .15s; }
.product-card:hover { box-shadow:0 8px 24px rgba(80,60,20,.12); }
.product-card h3 { margin:.8rem 0 .2rem; font-size:1.35rem; }
.jar { display:block; width:100%; height:auto; border-radius:12px; }
.jar-sm { width:56px; height:56px; border-radius:8px; }
.price { font-weight:600; font-size:1.1rem; }
.muted { color:var(--muted); }
.small { font-size:.85rem; }
.usp { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:3rem; padding-top:2rem; border-top:1px solid var(--line); }
.crumbs { font-size:.85rem; color:var(--muted); margin-bottom:1rem; }
.crumbs a { color:var(--muted); }
.product { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.product h1 { font-size:2.2rem; margin:0 0 .3rem; }
.lead { color:var(--muted); font-size:1.1rem; margin-top:0; }
.buy-box { background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.2rem; margin:1.2rem 0; display:flex; flex-direction:column; gap:1rem; }
.variants { border:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.variants legend { font-weight:600; margin-bottom:.4rem; }
.variant { display:grid; grid-template-columns:auto 1fr auto auto; gap:.8rem; align-items:center; border:1px solid var(--line); border-radius:10px; padding:.6rem .8rem; cursor:pointer; }
.variant:has(input:checked) { border-color:var(--honey-d); background:#fff8e6; }
.variant-price { font-weight:600; }
.variant-stock { font-size:.8rem; color:var(--ok); }
.qty input, .qty-form input { width:4.5rem; padding:.45rem; border:1px solid var(--line); border-radius:8px; font-size:1rem; }
.specs { display:grid; grid-template-columns:auto 1fr; gap:.4rem 1.2rem; font-size:.95rem; }
.specs dt { color:var(--muted); }
.specs dd { margin:0; }
.notice { background:#eef7ee; color:var(--ok); padding:.75rem 1rem; border-radius:10px; margin:.8rem 0; }
.alert { background:#fbecea; color:var(--err); padding:.75rem 1rem; border-radius:10px; margin:.8rem 0; }
.cart-table { width:100%; border-collapse:collapse; margin:1rem 0; }
.cart-table th { text-align:left; font-weight:500; color:var(--muted); font-size:.85rem; border-bottom:1px solid var(--line); padding:.5rem; }
.cart-table td { border-bottom:1px solid var(--line); padding:.8rem .5rem; vertical-align:middle; }
.cart-item { display:flex; gap:.8rem; align-items:center; }
.cart-item div { display:flex; flex-direction:column; }
.qty-form { display:flex; gap:.4rem; align-items:center; }
.link-btn { background:none; border:none; color:var(--muted); text-decoration:underline; cursor:pointer; padding:0; font-size:.9rem; }
.cart-summary { max-width:360px; margin-left:auto; display:flex; flex-direction:column; gap:.8rem; }
.totals { display:grid; grid-template-columns:1fr auto; gap:.4rem; margin:0; }
.totals dd { margin:0; text-align:right; }
.totals .grand { font-weight:700; font-size:1.15rem; border-top:1px solid var(--line); padding-top:.5rem; }
.checkout { display:grid; grid-template-columns:1.4fr 1fr; gap:3rem; align-items:start; }
.steps { display:flex; gap:1.5rem; list-style:none; padding:0; margin:0 0 1.2rem; counter-reset:s; font-size:.9rem; color:var(--muted); }
.steps li::before { counter-increment:s; content:counter(s); display:inline-flex; width:1.4rem; height:1.4rem; border-radius:50%; border:1px solid var(--line); align-items:center; justify-content:center; margin-right:.4rem; font-size:.8rem; }
.steps li.active { color:var(--ink); font-weight:600; }
.steps li.active::before { background:var(--honey); border-color:var(--honey); }
.steps li.done::before { content:"✓"; background:#eef7ee; color:var(--ok); }
.checkout-form { display:flex; flex-direction:column; gap:1rem; }
.checkout-form label { display:flex; flex-direction:column; gap:.3rem; font-size:.9rem; color:var(--muted); }
.checkout-form input, .checkout-form select { padding:.65rem .75rem; border:1px solid #d9ccb0; border-radius:8px; font-size:1rem; color:var(--ink); background:#fff; }
.checkout-form input:focus { outline:2px solid var(--honey); border-color:var(--honey); }
.row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.order-side { background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.2rem; position:sticky; top:5.5rem; }
.order-side h2 { font-size:1.15rem; margin-top:0; }
.side-items { list-style:none; padding:0; margin:0 0 1rem; display:flex; flex-direction:column; gap:.6rem; }
.side-items li { display:grid; grid-template-columns:auto 1fr auto; gap:.7rem; align-items:center; font-size:.9rem; }
.side-items .jar-sm { width:44px; height:44px; }
.review-box { display:grid; grid-template-columns:90px 1fr auto; gap:1rem; border:1px solid var(--line); border-radius:10px; padding:.6rem .9rem; margin-bottom:.5rem; font-size:.9rem; background:#fff; }
.ship-option { flex-direction:row !important; display:grid !important; grid-template-columns:auto 1fr auto; gap:.8rem; align-items:center; border:1px solid var(--line); border-radius:10px; padding:.8rem; background:#fff; color:var(--ink) !important; }
.pay-option { border:1px solid var(--line); border-radius:12px; background:#fff; overflow:hidden; }
.pay-option-head { flex-direction:row !important; gap:.8rem !important; align-items:flex-start; padding:.9rem 1rem; color:var(--ink) !important; cursor:pointer; }
.pay-option-head span { display:flex; flex-direction:column; }
.pay-option-body { padding:0 1rem 1rem 2.6rem; }
.pay-option:not(:has(input[name=method]:checked)) .pay-option-body { display:none; }
.card-widget { border:1px solid #d9ccb0; border-radius:10px; padding:.9rem; display:flex; flex-direction:column; gap:.7rem; background:#fcfaf5; }
.card-widget-head { display:flex; justify-content:space-between; font-size:.85rem; color:var(--muted); }
.test-badge { background:#ffe6b3; color:#8a5a00; font-size:.7rem; font-weight:700; letter-spacing:.06em; border-radius:4px; padding:.1rem .4rem; }
.card-error { color:var(--err); margin:0; font-size:.9rem; }
.bank-panel p { margin:.2rem 0; font-size:.9rem; color:var(--muted); }
.terms { flex-direction:row !important; gap:.5rem !important; align-items:center; }
.confirm { max-width:560px; margin:2rem auto; text-align:center; }
.confirm .check { font-size:2.4rem; background:#eef7ee; color:var(--ok); width:4rem; height:4rem; line-height:4rem; border-radius:50%; margin:0 auto; }
.confirm .totals { text-align:left; margin-bottom:1.5rem; }
.prose { max-width:680px; }
.shop-footer { border-top:1px solid var(--line); background:#fbf6ea; padding:2rem; font-size:.9rem; }
.footer-cols { max-width:1080px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:2rem; }
.footer-cols div { display:flex; flex-direction:column; gap:.35rem; }
.footer-cols a { color:var(--muted); text-decoration:none; }
.fineprint { max-width:1080px; margin:1.5rem auto 0; color:var(--muted); font-size:.8rem; }
@media (max-width: 760px) {
  .product, .checkout, .usp, .footer-cols { grid-template-columns:1fr; }
  .shop-header { flex-wrap:wrap; gap:1rem; padding:1rem; }
  .hero h1 { font-size:2rem; }
  .order-side { position:static; }
}
