/* ── Meloso Vape — design tokens ──
   Warm Tropical DNA per seo-automation/sites/melosovapes/site-config.md §13.
   Sunset-orange palette: #E8672A primary, #D4531A hover, #1C1108 deep,
   #FFF6EE warm cream surface. Prefix --ml-* keeps fingerprint distinct
   from sister sites (--dvx-*, --fv-*, --rz-*, --rv-*).
   Legacy token names (--ml-rose-*) kept as aliases so the rest of the
   stylesheet never had to rename — the *values* below are what render.
*/
:root {
  --ml-rose:        #E8672A;   /* primary — CTA, accents (sunset orange) */
  --ml-rose-deep:   #D4531A;   /* hover state */
  --ml-rose-dark:   #1C1108;   /* warm cocoa dark backdrop */
  --ml-rose-pale:   #FFF6EE;   /* warm cream surface */
  --ml-text:        #4B4F58;   /* body */
  --ml-text-soft:   #6B5B4F;   /* warm brown-gray secondary */
  --ml-line:        rgba(232, 103, 42, .22);
  --ml-line-strong: rgba(232, 103, 42, .45);
  --ml-shadow:      0 4px 24px rgba(212, 83, 26, .12);
  --ml-shadow-hover:0 8px 32px rgba(212, 83, 26, .22);

  --ml-font-display: "Poppins", Georgia, serif;
  --ml-font-body:    "Lato", "Roboto", -apple-system, system-ui, sans-serif;
  --ml-font-slab:    "Roboto Slab", Georgia, serif;

  --ml-r-sm:  8px;
  --ml-r-md:  12px;       /* primary radius — buttons, cards, callouts */
  --ml-r-lg:  20px;
  --ml-r-pill: 999px;

  --ml-container: 1180px;
  --ml-pad-x: 28px;
}

@media (max-width: 640px) {
  :root { --ml-pad-x: 18px; }
}