@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600&family=Work+Sans:wght@300;400;500;600;700&display=swap');

:root {
  --primary: #33450d;
  --primary-hover: #4a5d23;
  --accent: #4a5d23;
  --bg: #fef9ec;
  --bg-secondary: #f9f3e6;
  --bg-tertiary: #f3eee0;
  --bg-dark: #1d1c14;
  --text: #1d1c14;
  --text-secondary: #45483c;
  --text-muted: #76786b;
  --text-light: #9e9d95;
  --border: #c6c8b8;
  --border-subtle: #e7e2d5;
  --border-dark: #323028;
  --brand-light: #b8cf88;
  --brand-xlight: #d4eca2;
  --radius: 4px;
  --transition: 0.25s cubic-bezier(.4,0,.2,1);
  --transition-slow: 0.4s cubic-bezier(.4,0,.2,1);
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  max-width: 100vw;
  overflow-x: hidden;
}

body {
  font-family: 'Work Sans', sans-serif;
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button { cursor: pointer; font-family: inherit; }

/* ── Liquid Glass ── */
.liquid-glass {
  background: rgba(254, 249, 236, 0.28);
  backdrop-filter: blur(10px) saturate(1.3);
  -webkit-backdrop-filter: blur(10px) saturate(1.3);
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow:
    0 4px 24px rgba(51, 69, 13, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.liquid-glass-btn {
  background: rgba(254, 249, 236, 0.35);
  backdrop-filter: blur(8px) saturate(1.2);
  -webkit-backdrop-filter: blur(8px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, 0.25);
  box-shadow:
    0 3px 16px rgba(51, 69, 13, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
  transition: all var(--transition);
}

/* ── Range input ── */
input[type="range"] { accent-color: var(--primary); }

/* ── Responsive ── */
@media (max-width: 768px) {
  .desktop-nav { display: none !important; }
  .mobile-menu-btn { display: flex !important; }
  .products-layout { grid-template-columns: 1fr !important; }
  .products-sidebar { position: static !important; }
}

/* ── Scrollbar ── */
.cart-scroll::-webkit-scrollbar { width: 4px; }
.cart-scroll::-webkit-scrollbar-track { background: transparent; }
.cart-scroll::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }