/*
  Sistema de diseño — El Club de la Galleta MX
  Variables globales: color, tipografía y espaciado.
  Breakpoints usados en el resto del proyecto (mobile-first, min-width):
    --bp-sm: 600px
    --bp-md: 960px
    --bp-lg: 1200px
  (Las custom properties no pueden contener media queries, así que estos
  valores se repiten como literales dentro de layout.css.)
*/

:root {
  /* Paleta — tonos cálidos de galleta */
  --color-cream: #fbf3e6;
  --color-cream-dark: #f1e2c8;
  --color-brown-900: #3a2415;
  --color-brown-700: #5c3a22;
  --color-brown-500: #8b5e3c;
  --color-brown-300: #c9a582;
  --color-mustard: #d9a441;
  --color-mustard-dark: #b4801f;
  --color-white: #ffffff;

  /* Roles semánticos */
  --color-bg: var(--color-cream);
  --color-bg-alt: var(--color-cream-dark);
  --color-surface: var(--color-white);
  --color-text: var(--color-brown-900);
  --color-text-muted: var(--color-brown-500);
  --color-accent: var(--color-mustard);
  --color-accent-dark: var(--color-mustard-dark);
  --color-border: var(--color-brown-300);

  /* Tipografía */
  --font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;

  --fs-hero: clamp(2.5rem, 6vw + 1rem, 5.5rem);
  --fs-h1: clamp(2rem, 4vw + 1rem, 3.5rem);
  --fs-h2: clamp(1.5rem, 2.5vw + 1rem, 2.25rem);
  --fs-h3: 1.25rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;

  --lh-tight: 1.1;
  --lh-normal: 1.6;

  /* Espaciado — escala base 8px */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 6rem;
  --space-16: 8rem;

  /* Layout */
  --header-height: 4.5rem;
  --content-max-width: 72rem;
  --sidebar-width: 22rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.25rem;

  /* Sombra y transición base (para uso futuro: hover states, animaciones) */
  --shadow-sm: 0 1px 2px rgba(58, 36, 21, 0.08);
  --shadow-md: 0 8px 24px rgba(58, 36, 21, 0.12);
  --transition-base: 200ms ease;
}
