/* ============================================================
   MUSE SWITZERLAND — Design System CSS v1.0
   Stack: WordPress + WooCommerce + Dokan
   À injecter dans: Apparence > Personnaliser > CSS additionnel
   ============================================================ */

:root {
  --muse-beige:  #F2EFE9;
  --muse-black:  #111110;
  --muse-gray:   #6B6B68;
  --muse-light:  #F8F6F2;
  --muse-red:    #C41E3A;
  --muse-border: rgba(17,17,16,0.12);
  --muse-green:  #3B6D11;
  --font-serif:  'Cormorant Garamond', Georgia, serif;
  --font-sans:   'Jost', 'Helvetica Neue', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 13px; }
body { font-family: var(--font-sans); color: var(--muse-black); background: #fff; -webkit-font-smoothing: antialiased; }

/* TYPOGRAPHY */
h1, h2, h3 { font-family: var(--font-serif); font-weight: 400; }
h1 { font-size: 42px; letter-spacing: -0.5px; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }
p  { font-size: 13px; line-height: 1.7; color: var(--muse-gray); }
.eyebrow { font-size: 9px; letter-spacing: 3px; color: var(--muse-gray); font-weight: 500; text-transform: uppercase; }

/* HEADER */
.muse-header { background: #fff; border-bottom: 0.5px solid var(--muse-border); padding: 0 40px; position: sticky; top: 0; z-index: 100; }
.muse-header-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 70px; }
.muse-logo { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid var(--muse-black); font-family: var(--font-serif); font-size: 18px; font-weight: 300; cursor: pointer; text-decoration: none; color: var(--muse-black); }

/* ICON BUTTONS */
.muse-icon-btn { background: none; border: 0.5px solid var(--muse-border); border-radius: 4px; cursor: pointer; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; }
.muse-icon-btn:hover { background: var(--muse-beige); }
.muse-icon-btn svg { width: 13px; height: 13px; stroke: var(--muse-black); fill: none; stroke-width: 1.3; }

/* BUTTONS */
.muse-btn-primary { background: var(--muse-black); color: #fff; border: none; padding: 13px 28px; font-size: 10px; letter-spacing: 2px; cursor: pointer; font-family: var(--font-sans); border-radius: 2px; text-transform: uppercase; }
.muse-btn-primary:hover { opacity: 0.88; }
.muse-btn-outline { background: transparent; color: var(--muse-black); border: 0.5px solid var(--muse-black); padding: 12px 28px; font-size: 10px; letter-spacing: 2px; cursor: pointer; font-family: var(--font-sans); border-radius: 2px; text-transform: uppercase; }
.muse-btn-outline:hover { background: var(--muse-light); }

/* PRODUCT CARD */
.muse-product-card { cursor: pointer; }
.muse-product-card__img { background: var(--muse-beige); aspect-ratio: 0.78; position: relative; overflow: hidden; margin-bottom: 10px; }
.muse-product-card__img:hover { background: #EAE7DF; }
.muse-product-card__badge { position: absolute; top: 9px; left: 9px; font-size: 8px; letter-spacing: 1.5px; padding: 3px 7px; background: #fff; color: var(--muse-black); text-transform: uppercase; }
.muse-product-card__badge--red { background: var(--muse-red); color: #fff; }
.muse-product-card__brand { font-size: 8px; letter-spacing: 2px; color: var(--muse-gray); margin-bottom: 3px; }
.muse-product-card__name  { font-size: 11px; color: var(--muse-black); line-height: 1.35; margin-bottom: 5px; }
.muse-product-card__price { font-size: 12px; font-weight: 500; color: var(--muse-black); }
.muse-product-card__price--old { font-size: 10px; color: var(--muse-gray); text-decoration: line-through; margin-left: 4px; }
.muse-product-card__cond { font-size: 8px; letter-spacing: 1px; color: var(--muse-gray); }

/* STATUS BADGES */
.muse-status { font-size: 8px; letter-spacing: 1.5px; padding: 3px 8px; border-radius: 2px; text-transform: uppercase; }
.muse-status--delivered { background: #EAF3DE; color: var(--muse-green); }
.muse-status--shipping  { background: #E6F1FB; color: #185FA5; }
.muse-status--pending   { background: #FAEEDA; color: #854F0B; }
.muse-status--new       { background: var(--muse-red); color: #fff; }

/* TRUST BAR */
.muse-trust-bar { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 0.5px solid var(--muse-border); }
.muse-trust-item { padding: 24px; border-right: 0.5px solid var(--muse-border); display: flex; align-items: flex-start; gap: 12px; }
.muse-trust-item:last-child { border-right: none; }
.muse-trust-icon svg { width: 18px; height: 18px; stroke: var(--muse-red); fill: none; stroke-width: 1.3; }
.muse-trust-title { font-size: 11px; font-weight: 500; color: var(--muse-black); margin-bottom: 3px; }
.muse-trust-desc  { font-size: 10px; color: var(--muse-gray); line-height: 1.5; }

/* SECTION */
.muse-section { padding: 52px 40px; }
.muse-section__header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 28px; }
.muse-section__title  { font-family: var(--font-serif); font-size: 26px; font-weight: 400; color: var(--muse-black); }
.muse-section__link   { font-size: 11px; color: var(--muse-gray); cursor: pointer; border-bottom: 0.5px solid var(--muse-border); }

/* FOOTER */
.muse-footer-top { background: var(--muse-beige); padding: 48px 40px; display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; }
.muse-footer-bottom { background: var(--muse-black); padding: 14px 40px; display: flex; justify-content: space-between; align-items: center; }
.muse-footer-copy { font-size: 9px; letter-spacing: 1.5px; color: #666; }
.muse-footer-col h4 { font-size: 8px; letter-spacing: 3px; color: var(--muse-gray); margin-bottom: 14px; font-weight: 500; text-transform: uppercase; }
.muse-footer-col ul { list-style: none; }
.muse-footer-col ul li { font-size: 11px; color: var(--muse-black); padding: 5px 0; cursor: pointer; }
.muse-footer-col ul li:hover { color: var(--muse-red); }

/* RESPONSIVE */
@media (max-width: 768px) {
  .muse-header { padding: 0 16px; }
  .muse-section { padding: 32px 16px; }
  .muse-footer-top { grid-template-columns: 1fr; padding: 32px 16px; }
  h1 { font-size: 28px; }
  .muse-trust-bar { grid-template-columns: 1fr 1fr; }
}