/* ── Fonts ─────────────────────────────────────────────────────────────────── */
@font-face {
  font-family: 'Flame';
  src: url('/fonts/Flame-Bold.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'Flame';
  src: url('/fonts/Flame-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Rotonda';
  src: url('/fonts/Rotonda-Medium.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}

/* ── Globals ───────────────────────────────────────────────────────────────── */
html { scroll-behavior: smooth; }

body {
  font-family: 'Rotonda', system-ui, sans-serif;
}

h1, h2, h3, .font-flame {
  font-family: 'Flame', Impact, 'Arial Black', sans-serif;
}

/* ── Scrollbar hide ────────────────────────────────────────────────────────── */
.scrollbar-hide { scrollbar-width: none; -ms-overflow-style: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

/* ── Line clamp ────────────────────────────────────────────────────────────── */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── Sidebar active category ───────────────────────────────────────────────── */
.cat-btn.is-active {
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(44, 18, 3, 0.10);
}

/* ── Modal fade-in ─────────────────────────────────────────────────────────── */
#modal-overlay.flex { animation: fadeIn 0.15s ease; }
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Cart sidebar transition ───────────────────────────────────────────────── */
#cart-sidebar { transition: transform 0.3s cubic-bezier(.4,0,.2,1); }