/* -------------------------------------------------------------------------- */
/* Design tokens — FAD Store (paleta, tipografia, espaçamentos)              */
/* -------------------------------------------------------------------------- */

:root {
  /* Cores */
  --color-black: #000000;
  --color-white: #ffffff;
  --color-gray-50: #fafafa;
  --color-gray-100: #f5f5f5;
  --color-gray-150: #ededed;
  --color-gray-200: #e8e8e8;
  --color-gray-300: #d4d4d4;
  --color-gray-500: #737373;
  --color-gray-600: #525252;
  --color-gray-700: #404040;

  /* Tipografia */
  --font-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-serif: "Libre Baskerville", Georgia, "Times New Roman", serif;

  /* Tamanhos */
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-md: 1rem;
  --text-lg: 1.125rem;
  --text-xl: clamp(2rem, 4.2vw, 3.125rem);
  --text-2xl: clamp(1.35rem, 2.5vw, 1.75rem);

  /* Layout */
  --shell-max: 1180px;
  --shell-pad: 24px;
  --header-height: 88px;

  /* Vitrine produtos */
  --featured-grid-gap: clamp(16px, 2vw, 24px);
  --radius-card: 2px;

  /* Bordas */
  --radius-pill: 999px;
  --radius-tag: 3px;
  --radius-card-media: 0;

  /* Sombras */
  --shadow-hero-item: 0 18px 40px rgba(0, 0, 0, 0.12);
}