/*
 * HUACAN design tokens — from HUACAN Homepage.dc.html, "Creative direction · approved".
 * Palette validated against real artwork; do not add colors here without going back to
 * the approved design system. Loaded sitewide but consumed by nothing yet in Phase 0 —
 * intentionally invisible until Phase 1+ components start using these variables.
 */

:root {
  /* Color */
  --hp-paper: #FFFCF7;
  --hp-cream: #F6F1E8;
  --hp-sand: #E7DFD1;
  --hp-lacquer: #C0522F;
  --hp-lacquer-hover: #8F3A1D;
  /* Lacquer text at small/body sizes on Ink fails WCAG AA (3.49:1, needs
     4.5:1) — this lightened variant (5.08:1) is for that case only. Regular
     Lacquer stays the only token for CTAs/accents on Paper/Cream, per the
     design system's "single accent" rule; this isn't a second accent color,
     just a contrast-safe tint of the same one for dark-on-dark text. */
  --hp-lacquer-on-dark: #D67556;
  --hp-jade: #2C5A55; /* single use only — Abstract category tile, nowhere else */
  --hp-meta: #6E6458;
  --hp-ink: #241F1B;
  /* Consistency-audit pass (2026-08-26): these two were already reused
     4-5 times each across components.css/home.css as bare hex — a
     de-facto second/third gray that was never promoted to a token, which
     is exactly the kind of drift risk a consistency audit exists to
     catch. Same values, now named so a future palette tweak only needs
     one edit. */
  --hp-meta-soft: #8A7F72; /* lighter secondary label — eyebrows, footer column heads, mosaic count-on-dark */
  --hp-cream-on-dark: #BDB3A4; /* body copy on Ink backgrounds — footer tagline/menu, custom-photo paragraph */

  /* Type: two families only, per the 2026-08-26 art-direction pass.
     Instrument Serif stays for brand/emotional moments (hero, section
     headings, "Your photo. Your art."); Manrope covers everything
     functional (nav, product names, prices, labels, buttons, reviews) —
     replacing both the old Instrument Sans body font and IBM Plex Mono,
     which had crept into almost every small UI element sitewide and was
     the main source of the "trying too hard to be editorial" feedback. */
  --hp-font-serif: 'Instrument Serif', Georgia, serif;
  --hp-font-sans: 'Manrope', 'Helvetica Neue', Arial, sans-serif;

  /* Spacing scale: 8·16·24·40·64·100·160 */
  --hp-space-1: 8px;
  --hp-space-2: 16px;
  --hp-space-3: 24px;
  --hp-space-4: 40px;
  --hp-space-5: 64px;
  --hp-space-6: 100px;
  --hp-space-7: 160px;

  /* Grid: fluid by user decision (2026-08-24) — the approved mock's 1240px
     max-width read as too much empty margin on wide monitors, so sections
     stretch full-width with just the gutter as padding instead of also
     capping+centering at 1240px. --hp-grid-max kept only for anything that
     still wants a readability cap (e.g. long paragraph text via ch units,
     a separate mechanism from section width). */
  --hp-grid-max: 1240px;
  --hp-gutter-desktop: 100px;
  --hp-gutter-mobile: 20px;

  /* Radius: square by design system rule — kept as a token so it is a
     deliberate, greppable decision, not an absence of one. */
  --hp-radius: 0;
}