*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'DM Sans', sans-serif; background: #FAFAF6; color: #1C2B1A; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }

:root {
  --green-deep: #1A4D2E; --green-mid: #2D6A4F; --green-light: #7AB648;
  --cream: #F5F2EB; --warm-white: #FAFAF6; --text-dark: #1C2B1A; --text-muted: #5A6B58;
  --border: rgba(26,77,46,.12); --shadow-sm: 0 2px 12px rgba(26,77,46,.08); --shadow-md: 0 8px 32px rgba(26,77,46,.14);
  --radius-sm: 12px; --radius-md: 20px; --radius-lg: 32px;
}

.container { width: 100%; max-width: 1140px; margin: 0 auto; padding: 0 20px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 28px; font-size: 15px; font-weight: 600; border-radius: 50px; cursor: pointer; border: none; white-space: nowrap; }
.btn-outline { background: transparent; color: var(--green-deep); border: 2px solid var(--green-deep); }
.btn-outline:hover { background: var(--green-deep); color: #fff; }
.btn-white { background: #fff; color: var(--green-deep); }
.section-label { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--green-light); }


.page-hero { background: var(--green-deep); padding: 52px 20px 48px; position: relative; overflow: hidden; }
.page-hero::after { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 28px 28px; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 1; max-width: 1140px; margin: 0 auto; }
.page-hero .section-label { color: var(--green-light); display: block; margin-bottom: 10px; }
.page-hero h1 { font-family: 'Playfair Display', serif; font-size: clamp(32px, 6vw, 52px); font-weight: 900; color: #fff; line-height: 1.1; margin-bottom: 12px; }
.page-hero p { font-size: 16px; color: rgba(255,255,255,.7); max-width: 480px; line-height: 1.6; }

.filters-bar { background: #fff; border-bottom: 1px solid var(--border); position: sticky; top: 72px; z-index: 50; }
.filters-inner { max-width: 1140px; margin: 0 auto; padding: 0 20px; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.filters-inner::-webkit-scrollbar { display: none; }
.filter-btn { flex-shrink: 0; padding: 14px 18px; font-size: 13px; font-weight: 500; color: var(--text-muted); background: none; border: none; cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; }
.filter-btn.active { color: var(--green-deep); border-bottom-color: var(--green-deep); font-weight: 600; }

.shop-section { padding: 48px 0 80px; }
.shop-grid { display: grid; grid-template-columns: repeat(1, 1fr); gap: 16px; }
.product-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); transition: box-shadow .22s, transform .22s; display: flex; flex-direction: column; }
.product-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.product-card.featured { grid-column: span 2; }
.product-card-img { width: 100%; height: 160px; background: var(--cream); display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; }
.product-card.featured .product-card-img { height: 200px; }
.product-card-img img { width: 100%; height: 100%; object-fit: cover; }
.product-img-ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 6px; background: repeating-linear-gradient(45deg, var(--cream) 0, var(--cream) 6px, rgba(26,77,46,.04) 6px, rgba(26,77,46,.04) 12px); }
.product-img-ph span { font-size: 10px; font-family: monospace; color: var(--text-muted); text-align: center; padding: 0 8px; line-height: 1.5; }
.product-badge { position: absolute; top: 10px; left: 10px; background: var(--green-deep); color: #fff; font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 4px 10px; border-radius: 50px; }
.product-badge.popular { background: var(--green-light); }
.product-badge.new { background: #E8623A; }
.product-card-body { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 6px; }
.product-card-category { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--green-light); }
.product-card-name { font-size: 15px; font-weight: 600; color: var(--green-deep); line-height: 1.3; }
.product-card-desc { font-size: 13px; color: var(--text-muted); line-height: 1.4; flex: 1; }
.product-card-serves { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 5px; }
.product-card-serves svg { width: 13px; height: 13px; }
.product-card-footer { padding: 0 16px 16px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.product-card-price { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; color: var(--text-dark); }
.product-card-price small { font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 400; color: var(--text-muted); }
.product-card-price .product-daily { font: inherit; color: inherit; }
.add-to-cart { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; background: var(--green-deep); color: #fff; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; text-decoration: none; }
.add-to-cart.added { background: var(--green-light); }
.add-to-cart svg { width: 18px; height: 18px; }
.added_to_cart.wc-forward { display: none !important; }
.product-card-empty { grid-column: 1 / -1; min-height: 220px; justify-content: center; }
.product-card-empty .product-card-body { justify-content: center; align-items: center; text-align: center; gap: 10px; }
.product-card-empty .product-card-name { font-size: 20px; }

.cart-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 300; backdrop-filter: blur(2px); }
.cart-overlay.open { display: block; }
.cart-drawer { position: fixed; top: 0; right: -100%; bottom: 0; width: min(380px, 100vw); background: #fff; z-index: 301; transition: right .3s cubic-bezier(.4,0,.2,1); display: flex; flex-direction: column; box-shadow: -8px 0 32px rgba(0,0,0,.15); }
.cart-drawer.open { right: 0; }
.cart-header { padding: 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
.cart-header h3 { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; color: var(--green-deep); }
.cart-close { background: var(--cream); border: none; width: 36px; height: 36px; border-radius: 50%; cursor: pointer; }
.cart-items { flex: 1; overflow-y: auto; padding: 16px 20px; display: flex; flex-direction: column; gap: 12px; }
.cart-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: 14px; color: var(--text-muted); text-align: center; }
.cart-empty svg { width: 48px; height: 48px; opacity: .3; }
.cart-item { display: flex; gap: 12px; align-items: flex-start; padding: 12px; background: var(--cream); border-radius: var(--radius-sm); }
.cart-item-icon { width: 44px; height: 44px; border-radius: 10px; background: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 22px; }
.cart-item-info { flex: 1; }
.cart-item-name { font-size: 14px; font-weight: 600; color: var(--text-dark); margin-bottom: 2px; }
.cart-item-price { font-size: 13px; color: var(--green-deep); font-weight: 500; }
.cart-item-qty { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.qty-btn { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--border); background: #fff; cursor: pointer; font-size: 14px; font-weight: 600; }
.qty-num { font-size: 14px; font-weight: 600; min-width: 20px; text-align: center; }
.cart-item-remove { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: 4px; }
.cart-item-remove svg { width: 16px; height: 16px; }
.cart-footer { padding: 20px; border-top: 1px solid var(--border); }
.cart-subtotal { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.cart-subtotal strong { font-family: 'Playfair Display', serif; font-size: 24px; color: var(--green-deep); }
.cart-checkout { width: 100%; padding: 16px; background: var(--green-deep); color: #fff; border: none; border-radius: 50px; font-size: 15px; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; }

.why-strip { background: var(--cream); padding: 32px 0; border-top: 1px solid var(--border); }
.why-strip-inner { max-width: 1140px; margin: 0 auto; padding: 0 20px; display: flex; flex-wrap: wrap; gap: 20px 40px; justify-content: center; }
.why-strip-item { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; color: var(--text-dark); }
.why-strip-item svg { width: 20px; height: 20px; color: var(--green-deep); }


@media (min-width: 600px) { .shop-grid { grid-template-columns: repeat(3, 1fr); } .product-card.featured { grid-column: span 1; } }
@media (min-width: 768px) {
  .shop-grid { grid-template-columns: repeat(4, 1fr); }
}