/* ════════════════════════════════════════════════════════════════
   Variables CSS — à surcharger au besoin
   ════════════════════════════════════════════════════════════════ */
:root {
  --ep-green:     #128C7E;
  --ep-green2:    #075E54;
  --ep-gold:      #F4A724;
  --ep-dark:      #0f172a;
  --ep-gray:      #64748b;
  --ep-light-bg:  #f8fafc;
  --ep-border:    #e2e8f0;
  --ep-radius:    .75rem;
  --ep-shadow:    0 4px 24px rgba(0,0,0,.07);
  --ep-font:      'Inter', 'Outfit', system-ui, sans-serif;
}

/* ════════════════════════ PARTIAL — Navbar ═══════════════════════ */

.navbar { background: rgba(255,255,255,.95); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--ep-border); padding: 0 2rem; height: 64px;
  display: flex; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 100; }

.navbar__brand { display: flex; align-items: center; gap: .75rem; text-decoration: none; }
.navbar__name { font-weight: 800; color: var(--ep-dark); font-size: 1.05rem; }

.navbar__nav { display: flex; align-items: center; gap: .25rem; }
.navbar__link { padding: .4rem .9rem; border-radius: .5rem; color: #475569; font-size: .9rem;
  font-weight: 500; text-decoration: none; transition: all .2s; }
.navbar__link:hover, .navbar__link--active { background: var(--ep-light-bg); color: var(--ep-dark); }

.navbar__actions { display: flex; align-items: center; gap: .75rem; }
.cart-badge { position: relative; }
.cart-badge__count { position: absolute; top: -6px; right: -6px; background: var(--ep-green); color: #fff;
  font-size: .65rem; font-weight: 700; width: 18px; height: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; }

@media (max-width: 768px) {
  .navbar__nav { display: none; }
  .navbar { padding: 0 1rem; }
}