:root {
  /* ══════════════════════════════════════════════════════════
     Mercado Negro — canonical UI palette
     FINAL LOCKED BRAND (current): Option 2 monogram + Option 4
     wordmark + Option C palette (Black + Champagne). Black/near-black
     dominant, ivory primary text, champagne restrained accent.
     No brown/chocolate-forward surfaces, no dusty-rose primary CTA.
     Values match brand-final/tokens/mn-brand-tokens.json exactly
     (the supplied source of truth) — see MN-BRAND-NOTES.md for full
     direction history.
     ══════════════════════════════════════════════════════════ */

  --mn-black:         #0B0B0B; /* deepest background tier */
  --mn-near-black:    #121212; /* primary background / panel */
  --mn-ivory:         #F4F1EA; /* primary text/logo color */
  --mn-champagne:     #D4B98A; /* restrained accent — borders, rules, labels */
  --mn-champagne-soft: #c7a878; /* secondary/muted champagne, derived for hover states */
  --mn-divider:       rgba(212,185,138,0.5);

  --mn-button-fill:       #101010;
  --mn-button-fill-hover: #161616;
  --mn-button-border:     #D4B98A;
  --mn-button-text:       #F4F1EA;

  /* Back-compat aliases — older markup in this project may still
     reference earlier-pass variable names; keep them mapped onto the
     current locked values so nothing silently reverts to a
     superseded palette. */
  --mn-charcoal:      var(--mn-near-black);
  --mn-panel:         var(--mn-near-black);
  --mn-panel-2:       #161616;
  --mn-cream:         var(--mn-ivory);
  --mn-cream-muted:   rgba(244,241,234,0.62);
  --mn-cream-faint:   rgba(244,241,234,0.4);
  --mn-gold:          var(--mn-champagne);
  --mn-gold-bright:   #e3cda3;
  --mn-gold-dim:      rgba(212,185,138,0.35);
  --mn-border:        rgba(212,185,138,0.28);
  --mn-charcoal-2:    var(--mn-panel-2);

  /* Typography */
  --mn-serif:        'EB Garamond', Georgia, 'Times New Roman', serif; /* editorial headings, byline, section titles */
  --mn-serif-italic:  'EB Garamond', Georgia, serif; /* emotional/editorial copy, italic */
  --mn-sans:          Arial, Helvetica, sans-serif; /* functional / UI text */

  /* Shared geometry */
  --mn-radius:        10px;
  --mn-radius-sm:      6px;
  --mn-section-space: 88px;
  --mn-shadow-card:   0 20px 48px -20px rgba(0,0,0,0.6);
}

/*
IMPORTANT — FINAL LOCKED BRAND (current, supersedes all earlier passes):
- Monogram = brand-final/logo/mercado-negro-monogram-option2-locked-transparent.webp
  (ornate circular gold-frame "MN" monogram, richer 3D gold finish).
  Primary mark for compact/favicon/social/badge use.
- Wordmark = brand-final/logo/mercado-negro-wordmark-option4-CLEAN-transparent.png
  ("Mercado Negro" in a clean upright Didot-style serif — NOT the
  script/cursive treatment used in every earlier pass). This CLEAN
  file contains only the wordmark itself (no baked byline/divider,
  no crop needed) and supersedes the earlier
  mercado-negro-wordmark-option4-transparent.webp, which had a
  truncated byline baked into its bottom edge. Used as its own
  separate image alongside the monogram, not fused into one lockup
  file.
- Leave breathing room between the monogram and the wordmark when
  stacking them — do not place them tight against each other.
- These are supplied, approved, production assets. Do NOT redraw,
  trace, simplify, reinterpret, or replace them. Do NOT substitute a
  script font for the wordmark — Option 4 (upright serif) is locked.
- Primary CTA = outline treatment: --mn-button-fill (near-black) fill,
  --mn-button-border (champagne) border, --mn-button-text (ivory)
  text. No filled color block.
- Service descriptors ("PASTELERÍA & CATERING") and taglines stay as
  live HTML text, not baked into any logo file.
- The Martha Domínguez hub's Mercado Negro tile
  (tarjeta-martha/index.html, hub-assets/cards/mercado-negro.webp)
  is a single flat composite photo with the OLD branding baked into
  its pixels — it was intentionally left unchanged in this pass per
  the user's direction. See MN-BRAND-NOTES.md "Hub tile — pending."
*/