/* ==========================================================
   MV Coffee — Design tokens
   Todo el sistema visual sale de estas variables.
   Para re-tematizar el producto (otra cafetería) se cambian aquí.
   ========================================================== */
:root {
  /* Paleta de marca (tomada del menú impreso de MV Coffee) */
  --pink-pastel: #f6c9da;      /* casilla clara del damero */
  --pink-pastel-soft: #fbe4ec;
  --pink-checker: #e46f9f;     /* casilla fuerte del damero */
  --pink-strong: #c94379;      /* rosa de títulos y contornos (apto para texto blanco) */
  --pink-strong-dark: #a8315f;
  --pink-dusty: #d98aa8;
  --pink-dusty-soft: #efc3d3;
  --cream: #fdf1ec;            /* papel del menú */
  --beige: #f0dccb;
  --beige-soft: #f8ebe2;
  --coffee: #4b2e24;
  --coffee-soft: #7d5f54;
  --coffee-sleeve: #8d5a42;    /* faja del vaso de la mascota */
  --white: #ffffff;

  /* Semánticos */
  --bg: var(--cream);
  --surface: var(--white);
  --text: var(--coffee);
  --text-muted: var(--coffee-soft);
  --accent: var(--pink-strong);
  --line: rgba(75, 46, 36, 0.12);

  /* Tipografía */
  --font-display: "Shrikhand", "Cooper Black", "Georgia", serif;   /* retro, como el menú impreso */
  --font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-script: var(--font-display);
  --checker: url("../img/checker.svg");

  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-lg: 1.25rem;
  --fs-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
  --fs-2xl: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
  --fs-hero: clamp(2.6rem, 1.6rem + 5vw, 5rem);

  /* Espaciado y forma */
  --gutter: clamp(1rem, 4vw, 2rem);
  --container: 1180px;
  --section-y: clamp(3.5rem, 7vw, 6.5rem);
  --radius-sm: 12px;
  --radius: 22px;
  --radius-lg: 34px;
  --radius-pill: 999px;

  /* Sombras suaves, tintadas de café */
  --shadow-sm: 0 2px 8px rgba(75, 46, 36, 0.08);
  --shadow: 0 10px 30px -10px rgba(75, 46, 36, 0.25);
  --shadow-lg: 0 24px 60px -20px rgba(75, 46, 36, 0.35);

  /* Movimiento */
  --ease: cubic-bezier(0.22, 0.8, 0.28, 1);
  --t-fast: 160ms;
  --t: 320ms;
  --t-slow: 700ms;

  --header-h: 68px;
}